/******************************/
/*** ferm samples dashboard ***/
/******************************/
html.dashboard.fermsamples {
    font-size: 2.909vmin;
    font-weight: 300;
}

html.dashboard.fermsamples #pnl-lbl-unit {
    grid-area: _h000_;
}
html.dashboard.fermsamples #pnl-lbl-ferm1 {
    grid-area: _hf01_;
}
html.dashboard.fermsamples #pnl-lbl-ferm2 {
    grid-area: _hf02_;
}
html.dashboard.fermsamples #pnl-lbl-ferm3 {
    grid-area: _hf03_;
}
html.dashboard.fermsamples #pnl-lbl-ferm4 {
    grid-area: _hf04_;
}
html.dashboard.fermsamples #pnl-lbl-ferm5 {
    grid-area: _hf05_;
}
html.dashboard.fermsamples #pnl-lbl-ferm6 {
    grid-area: _hf06_;
}
html.dashboard.fermsamples #pnl-lbl-ferm7 {
    grid-area: _hf07_;
}
html.dashboard.fermsamples #pnl-lbl-ferm8 {
    grid-area: _hf08_;
}
html.dashboard.fermsamples #pnl-lbl-ferm9 {
    grid-area: _hf09_;
}
html.dashboard.fermsamples #pnl-lbl-ferm10 {
    grid-area: _hf10_;
}
html.dashboard.fermsamples #pnl-lbl-ps {
    grid-area: _hrps_;
}
html.dashboard.fermsamples #pnl-lbl-6hr {
    grid-area: _hr06_;
}
html.dashboard.fermsamples #pnl-lbl-12hr {
    grid-area: _hr12_;
}
html.dashboard.fermsamples #pnl-lbl-18hr {
    grid-area: _hr18_;
}
html.dashboard.fermsamples #pnl-lbl-29hr {
    grid-area: _hr29_;
}
html.dashboard.fermsamples #pnl-lbl-39hr {
    grid-area: _hr39_;
}
html.dashboard.fermsamples #pnl-lbl-45hr {
    grid-area: _hr45_;
}
html.dashboard.fermsamples #pnl-lbl-etoh {
    grid-area: _heth_;
}
html.dashboard.fermsamples #pnl-lbl-glyc {
    grid-area: _hgly_;
}
html.dashboard.fermsamples #pnl-lbl-gluc {
    grid-area: _hglu_;
}
html.dashboard.fermsamples #pnl-ferm1-ps {
    grid-area: f01hps;
}
html.dashboard.fermsamples #pnl-ferm2-ps {
    grid-area: f02hps;
}
html.dashboard.fermsamples #pnl-ferm3-ps {
    grid-area: f03hps;
}
html.dashboard.fermsamples #pnl-ferm4-ps {
    grid-area: f04hps;
}
html.dashboard.fermsamples #pnl-ferm5-ps {
    grid-area: f05hps;
}
html.dashboard.fermsamples #pnl-ferm6-ps {
    grid-area: f06hps;
}
html.dashboard.fermsamples #pnl-ferm7-ps {
    grid-area: f07hps;
}
html.dashboard.fermsamples #pnl-ferm8-ps {
    grid-area: f08hps;
}
html.dashboard.fermsamples #pnl-ferm9-ps {
    grid-area: f09hps;
}
html.dashboard.fermsamples #pnl-ferm10-ps {
    grid-area: f10hps;
}
html.dashboard.fermsamples #pnl-ferm1-6hr {
    grid-area: f01h06;
}
html.dashboard.fermsamples #pnl-ferm2-6hr {
    grid-area: f02h06;
}
html.dashboard.fermsamples #pnl-ferm3-6hr {
    grid-area: f03h06;
}
html.dashboard.fermsamples #pnl-ferm4-6hr {
    grid-area: f04h06;
}
html.dashboard.fermsamples #pnl-ferm5-6hr {
    grid-area: f05h06;
}
html.dashboard.fermsamples #pnl-ferm6-6hr {
    grid-area: f06h06;
}
html.dashboard.fermsamples #pnl-ferm7-6hr {
    grid-area: f07h06;
}
html.dashboard.fermsamples #pnl-ferm8-6hr {
    grid-area: f08h06;
}
html.dashboard.fermsamples #pnl-ferm9-6hr {
    grid-area: f09h06;
}
html.dashboard.fermsamples #pnl-ferm10-6hr {
    grid-area: f10h06;
}
html.dashboard.fermsamples #pnl-ferm1-12hr {
    grid-area: f01h12;
}
html.dashboard.fermsamples #pnl-ferm2-12hr {
    grid-area: f02h12;
}
html.dashboard.fermsamples #pnl-ferm3-12hr {
    grid-area: f03h12;
}
html.dashboard.fermsamples #pnl-ferm4-12hr {
    grid-area: f04h12;
}
html.dashboard.fermsamples #pnl-ferm5-12hr {
    grid-area: f05h12;
}
html.dashboard.fermsamples #pnl-ferm6-12hr {
    grid-area: f06h12;
}
html.dashboard.fermsamples #pnl-ferm7-12hr {
    grid-area: f07h12;
}
html.dashboard.fermsamples #pnl-ferm8-12hr {
    grid-area: f08h12;
}
html.dashboard.fermsamples #pnl-ferm9-12hr {
    grid-area: f09h12;
}
html.dashboard.fermsamples #pnl-ferm10-12hr {
    grid-area: f10h12;
}
html.dashboard.fermsamples #pnl-ferm1-18hr {
    grid-area: f01h18;
}
html.dashboard.fermsamples #pnl-ferm2-18hr {
    grid-area: f02h18;
}
html.dashboard.fermsamples #pnl-ferm3-18hr {
    grid-area: f03h18;
}
html.dashboard.fermsamples #pnl-ferm4-18hr {
    grid-area: f04h18;
}
html.dashboard.fermsamples #pnl-ferm5-18hr {
    grid-area: f05h18;
}
html.dashboard.fermsamples #pnl-ferm6-18hr {
    grid-area: f06h18;
}
html.dashboard.fermsamples #pnl-ferm7-18hr {
    grid-area: f07h18;
}
html.dashboard.fermsamples #pnl-ferm8-18hr {
    grid-area: f08h18;
}
html.dashboard.fermsamples #pnl-ferm9-18hr {
    grid-area: f09h18;
}
html.dashboard.fermsamples #pnl-ferm10-18hr {
    grid-area: f10h18;
}
html.dashboard.fermsamples #pnl-ferm1-29hr {
    grid-area: f01h29;
}
html.dashboard.fermsamples #pnl-ferm2-29hr {
    grid-area: f02h29;
}
html.dashboard.fermsamples #pnl-ferm3-29hr {
    grid-area: f03h29;
}
html.dashboard.fermsamples #pnl-ferm4-29hr {
    grid-area: f04h29;
}
html.dashboard.fermsamples #pnl-ferm5-29hr {
    grid-area: f05h29;
}
html.dashboard.fermsamples #pnl-ferm6-29hr {
    grid-area: f06h29;
}
html.dashboard.fermsamples #pnl-ferm7-29hr {
    grid-area: f07h29;
}
html.dashboard.fermsamples #pnl-ferm8-29hr {
    grid-area: f08h29;
}
html.dashboard.fermsamples #pnl-ferm9-29hr {
    grid-area: f09h29;
}
html.dashboard.fermsamples #pnl-ferm10-29hr {
    grid-area: f10h29;
}
html.dashboard.fermsamples #pnl-ferm1-39hr {
    grid-area: f01h39;
}
html.dashboard.fermsamples #pnl-ferm2-39hr {
    grid-area: f02h39;
}
html.dashboard.fermsamples #pnl-ferm3-39hr {
    grid-area: f03h39;
}
html.dashboard.fermsamples #pnl-ferm4-39hr {
    grid-area: f04h39;
}
html.dashboard.fermsamples #pnl-ferm5-39hr {
    grid-area: f05h39;
}
html.dashboard.fermsamples #pnl-ferm6-39hr {
    grid-area: f06h39;
}
html.dashboard.fermsamples #pnl-ferm7-39hr {
    grid-area: f07h39;
}
html.dashboard.fermsamples #pnl-ferm8-39hr {
    grid-area: f08h39;
}
html.dashboard.fermsamples #pnl-ferm9-39hr {
    grid-area: f09h39;
}
html.dashboard.fermsamples #pnl-ferm10-39hr {
    grid-area: f10h39;
}
html.dashboard.fermsamples #pnl-ferm1-45hr {
    grid-area: f01h45;
}
html.dashboard.fermsamples #pnl-ferm2-45hr {
    grid-area: f02h45;
}
html.dashboard.fermsamples #pnl-ferm3-45hr {
    grid-area: f03h45;
}
html.dashboard.fermsamples #pnl-ferm4-45hr {
    grid-area: f04h45;
}
html.dashboard.fermsamples #pnl-ferm5-45hr {
    grid-area: f05h45;
}
html.dashboard.fermsamples #pnl-ferm6-45hr {
    grid-area: f06h45;
}
html.dashboard.fermsamples #pnl-ferm7-45hr {
    grid-area: f07h45;
}
html.dashboard.fermsamples #pnl-ferm8-45hr {
    grid-area: f08h45;
}
html.dashboard.fermsamples #pnl-ferm9-45hr {
    grid-area: f09h45;
}
html.dashboard.fermsamples #pnl-ferm10-45hr {
    grid-area: f10h45;
}
html.dashboard.fermsamples #pnl-ferm1-etoh {
    grid-area: f01eth;
}
html.dashboard.fermsamples #pnl-ferm2-etoh {
    grid-area: f02eth;
}
html.dashboard.fermsamples #pnl-ferm3-etoh {
    grid-area: f03eth;
}
html.dashboard.fermsamples #pnl-ferm4-etoh {
    grid-area: f04eth;
}
html.dashboard.fermsamples #pnl-ferm5-etoh {
    grid-area: f05eth;
}
html.dashboard.fermsamples #pnl-ferm6-etoh {
    grid-area: f06eth;
}
html.dashboard.fermsamples #pnl-ferm7-etoh {
    grid-area: f07eth;
}
html.dashboard.fermsamples #pnl-ferm8-etoh {
    grid-area: f08eth;
}
html.dashboard.fermsamples #pnl-ferm9-etoh {
    grid-area: f09eth;
}
html.dashboard.fermsamples #pnl-ferm10-etoh {
    grid-area: f10eth;
}
html.dashboard.fermsamples #pnl-ferm1-glyc {
    grid-area: f01gly;
}
html.dashboard.fermsamples #pnl-ferm2-glyc {
    grid-area: f02gly;
}
html.dashboard.fermsamples #pnl-ferm3-glyc {
    grid-area: f03gly;
}
html.dashboard.fermsamples #pnl-ferm4-glyc {
    grid-area: f04gly;
}
html.dashboard.fermsamples #pnl-ferm5-glyc {
    grid-area: f05gly;
}
html.dashboard.fermsamples #pnl-ferm6-glyc {
    grid-area: f06gly;
}
html.dashboard.fermsamples #pnl-ferm7-glyc {
    grid-area: f07gly;
}
html.dashboard.fermsamples #pnl-ferm8-glyc {
    grid-area: f08gly;
}
html.dashboard.fermsamples #pnl-ferm9-glyc {
    grid-area: f09gly;
}
html.dashboard.fermsamples #pnl-ferm10-glyc {
    grid-area: f10gly;
}
html.dashboard.fermsamples #pnl-ferm1-gluc {
    grid-area: f01glu;
}
html.dashboard.fermsamples #pnl-ferm2-gluc {
    grid-area: f02glu;
}
html.dashboard.fermsamples #pnl-ferm3-gluc {
    grid-area: f03glu;
}
html.dashboard.fermsamples #pnl-ferm4-gluc {
    grid-area: f04glu;
}
html.dashboard.fermsamples #pnl-ferm5-gluc {
    grid-area: f05glu;
}
html.dashboard.fermsamples #pnl-ferm6-gluc {
    grid-area: f06glu;
}
html.dashboard.fermsamples #pnl-ferm7-gluc {
    grid-area: f07glu;
}
html.dashboard.fermsamples #pnl-ferm8-gluc {
    grid-area: f08glu;
}
html.dashboard.fermsamples #pnl-ferm9-gluc {
    grid-area: f09glu;
}
html.dashboard.fermsamples #pnl-ferm10-gluc {
    grid-area: f10glu;
}

@media (orientation: landscape) {
    html.dashboard.fermsamples.illinois .layout-grid {
        grid-template-areas:
                "_h000_ _hf01_ _hf02_ _hf03_ _hf04_ _hf05_ _hf06_ _hf07_ _hf08_ _hf09_ _hf10_"
                "_hrps_ f01hps f02hps f03hps f04hps f05hps f06hps f07hps f08hps f09hps f10hps"
                "_hr06_ f01h06 f02h06 f03h06 f04h06 f05h06 f06h06 f07h06 f08h06 f09h06 f10h06"
                "_hr12_ f01h12 f02h12 f03h12 f04h12 f05h12 f06h12 f07h12 f08h12 f09h12 f10h12"
                "_hr18_ f01h18 f02h18 f03h18 f04h18 f05h18 f06h18 f07h18 f08h18 f09h18 f10h18"
                "_hr29_ f01h29 f02h29 f03h29 f04h29 f05h29 f06h29 f07h29 f08h29 f09h29 f10h29"
                "_hr39_ f01h39 f02h39 f03h39 f04h39 f05h39 f06h39 f07h39 f08h39 f09h39 f10h39"
                "_heth_ f01eth f02eth f03eth f04eth f05eth f06eth f07eth f08eth f09eth f10eth"
                "_hgly_ f01gly f02gly f03gly f04gly f05gly f06gly f07gly f08gly f09gly f10gly"
                "_hglu_ f01glu f02glu f03glu f04glu f05glu f06glu f07glu f08glu f09glu f10glu";

        grid-template-columns: repeat(11, minmax(0, 1fr));
    }
    
}

@media (orientation: portrait) {
    html.dashboard.fermsamples.illinois .layout-grid {
        grid-template-areas:
                "_h000_ _hrps_ _hr06_ _hr12_ _hr18_ _hr29_ _hr39_ _heth_ _hgly_ _hglu_"
                "_hf01_ f01hps f01h06 f01h12 f01h18 f01h29 f01h39 f01eth f01gly f01glu"
                "_hf02_ f02hps f02h06 f02h12 f02h18 f02h29 f02h39 f02eth f02gly f02glu"
                "_hf03_ f03hps f03h06 f03h12 f03h18 f03h29 f03h39 f03eth f03gly f03glu"
                "_hf04_ f04hps f04h06 f04h12 f04h18 f04h29 f04h39 f04eth f04gly f04glu"
                "_hf05_ f05hps f05h06 f05h12 f05h18 f05h29 f05h39 f05eth f05gly f05glu"
                "_hf06_ f06hps f06h06 f06h12 f06h18 f06h29 f06h39 f06eth f06gly f06glu"
                "_hf07_ f07hps f07h06 f07h12 f07h18 f07h29 f07h39 f07eth f07gly f07glu"
                "_hf08_ f08hps f08h06 f08h12 f08h18 f08h29 f08h39 f08eth f08gly f08glu"
                "_hf09_ f09hps f09h06 f09h12 f09h18 f09h29 f09h39 f09eth f09gly f09glu"
                "_hf10_ f10hps f10h06 f10h12 f10h18 f10h29 f10h39 f10eth f10gly f10glu";

        grid-template-columns: repeat(10, minmax(0, 1fr));
    }
}

@media only screen and (min-aspect-ratio: 5 / 9) and (max-aspect-ratio: 6 / 9) {
    html.dashboard.fermsamples.illinois {
        font-size: 2.5vmin;
    }
}
@media only screen and (min-aspect-ratio: 6 / 9) and (max-aspect-ratio: 7 / 9) {
    html.dashboard.fermsamples.illinois {
        font-size: 2.25vmin;
    }
}
@media only screen and (min-aspect-ratio: 7 / 9) and (max-aspect-ratio: 8 / 9) {
    html.dashboard.fermsamples.illinois {
        font-size: 2vmin;
    }
}
@media only screen and (min-aspect-ratio: 8 / 9) and (max-aspect-ratio: 9 / 9) {
    html.dashboard.fermsamples.illinois {
        font-size: 1.85vmin;
    }
}
@media only screen and (min-aspect-ratio: 9 / 9) and (max-aspect-ratio: 10 / 9) {
    html.dashboard.fermsamples.illinois {
        font-size: 1.96vmin;
    }
}
@media only screen and (min-aspect-ratio: 10 / 9) and (max-aspect-ratio: 11 / 9) {
    html.dashboard.fermsamples.illinois {
        font-size: 2.15vmin;
    }
}
@media only screen and (min-aspect-ratio: 11 / 9) and (max-aspect-ratio: 12 / 9) {
    html.dashboard.fermsamples.illinois {
        font-size: 2.35vmin;
    }
}
@media only screen and (min-aspect-ratio: 12 / 9) and (max-aspect-ratio: 13 / 9) {
    html.dashboard.fermsamples.illinois {
        font-size: 2.55vmin;
    }
}
@media only screen and (min-aspect-ratio: 13 / 9) and (max-aspect-ratio: 14 / 9) {
    html.dashboard.fermsamples.illinois {
        font-size: 2.75vmin;
    }
}
@media only screen and (min-aspect-ratio: 14 / 9) and (max-aspect-ratio: 15 / 9) {
    html.dashboard.fermsamples.illinois {
        font-size: 2.95vmin;
    }
}
@media only screen and (min-aspect-ratio: 15 / 9) and (max-aspect-ratio: 16 / 9) {
    html.dashboard.fermsamples.illinois {
        font-size: 3.2vmin;
    }
}

html.dashboard.fermsamples .panel .text {
    text-align: center;
    font-size: .8rem;
    font-weight: bold;
    color: white;
}

html.dashboard.fermsamples small {
    font-size: .6rem;
}

html.dashboard.fermsamples.illinois.north .panel.ferm-label {
    background-color: rgba(0,0,0,0.83);
}

html.dashboard.fermsamples.illinois.south .panel.ferm-label {
    background-color: rgba(166, 166, 166, 0.83);
}

html.dashboard.fermsamples.illinois.south .panel.ferm-label .text {
    color: black;
}

html.dashboard.fermsamples .panel.hour-label {
    background-color: rgba(255,255,255,0.83);
}
html.dashboard.fermsamples .panel.hour-label .text {
    color:black;
}
html.dashboard.fermsamples .panel.drop-label {
    background-color: rgba(0, 176, 80, 0.83);
}
html.dashboard.fermsamples .panel.drop-label .text {
    color: black;
}

html.dashboard.fermsamples .panel.future {
    background-color: rgba(255,255,255,0.83);
}
html.dashboard.fermsamples .panel.dropped {
    background-color: rgba(166,166,166,0.83);
}
html.dashboard.fermsamples .panel.success {
    background-color: rgba(0, 176, 80, 0.83);
}
html.dashboard.fermsamples .panel.complete {
    background-color: rgba(185, 205, 229,0.83);
}
html.dashboard.fermsamples .panel.warn {
    background-color: rgba(255, 255, 0, 0.83);
}

html.dashboard.fermsamples .panel.reading {
    justify-content: space-between;
    padding: .25rem;
    color: black;
}
html.dashboard.fermsamples .panel .reading-top {
    display: flex;
    justify-content: space-between;
    font-size: .6rem;
}

@media (orientation: portrait) {
    html.dashboard.fermsamples .panel .reading-top {
        flex-direction: column;
    }
}

html.dashboard.fermsamples .panel .reading-bottom-etoh-gluc {
    display: flex;
    justify-content: space-around;
    font-size: .8rem;
    font-weight: bold;
    padding: 0 .3rem .3rem .3rem;
}

html.dashboard.fermsamples .panel .reading-bottom-etoh-gluc .slash:before {
    content: "/";
}

@media (orientation: portrait) {
    html.dashboard.fermsamples .panel .reading-bottom-etoh-gluc {
        flex-direction: column;
        align-items: center;
    }
    html.dashboard.fermsamples .panel .reading-bottom-etoh-gluc .slash:before {
        content: '';

        width: 2rem;
        height: .08rem;
        background-color: black;
        margin-bottom: .2rem;
        margin-top: 0;

        display: block;
    }
}

html.dashboard.fermsamples .panel .reading-bottom-large {
    display: flex;
    justify-content: space-around;
    font-size: 1.1rem;
    font-weight: bold;
}

html.dashboard.fermsamples #cmp-updated {
    font-size: .5rem;
    color: deepskyblue;
}

html.dashboard.fermsamples.illinois.south #cmp-updated {
    color: darkblue;
}

html.dashboard.fermsamples.illinois.north #cmp-updated {
    color: deepskyblue;
}

html.dashboard.fermsamples .panel .out-of-range {
    color: #dc0000;
}

@media (orientation: landscape) {
    main {
        height: 63vw; /* For the non 16:9 tablets */
    }
}