* {
    font-family: "Helvetica Neue",sans-serif;
}

body {
    background-color: darkgray;
}

h1 {
    text-align: center;
}

label {
    display: inline-block;
    background-color: lightgray;
    margin-top: 0.2rem;
    margin-bottom: 0.2rem;
    margin-right: 0.5rem;
    padding-left: 0.5rem;
    width: calc(50% - 1rem);
}

label[data-wica-channel-name] {
    margin-right: 0;
    padding-left: 0;
    width: 50%;
}

.nav-header {
    display: flex;
    justify-content: space-between;
    padding-bottom: 1rem;
    width: 10rem;
}

.nav {
    background-color: lightgray;
    color: steelblue;
    border-radius: 0.5rem;
    padding: 0.75rem;
    text-decoration: none;
    text-transform: uppercase;
}

.nav:hover {
    background-color: lightsteelblue;
}

/*---------------------------------------------------------------------- */
/* 1.0 SMALL DEVICES                                                     */
/*---------------------------------------------------------------------- */

@media (min-width: 0px) {

    .Llrf                { grid-area: Llrf; overflow: hidden }
    .Cavity              { grid-area: Cavity; overflow: hidden }
    .RfAmp               { grid-area: RfAmp; overflow: hidden }
    .RfInterlock         { grid-area: RfInterlock; overflow: hidden }

    .grid-container {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto auto;
        grid-gap: 0.5rem;
        grid-template-areas:  'Cavity'
                              'RfAmp'
                              'RfInterlock'
                              'Llrf';
    }

    html {
        font-size: 11px;
    }

    .Plot1 {
        height: 15rem;
    }
}

/* Small devices (landscape phones, 544px and up) */
@media (min-width: 544px) {

    .grid-container {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto auto;
        grid-gap: 0.5rem;
        grid-template-areas:  'Cavity'
                              'RfAmp'
                              'RfInterlock'
                              'Llrf';
    }
    html {
        font-size: 12px;
    }
}

/*---------------------------------------------------------------------- */
/* 2.0 TABLETS                                                           */
/*---------------------------------------------------------------------- */

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {

    html {
        font-size: 12px;
    }

    .grid-container {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto auto;
        grid-gap: 0.5rem;
        grid-template-areas:  'Cavity           Cavity'
                              'RfAmp            RfInterlock'
                              'Llrf             RfInterlock';
    }
}

/*---------------------------------------------------------------------- */
/* 3.0 LARGE DEVICES                                                     */
/*---------------------------------------------------------------------- */

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {

    html {
        font-size: 12px;
    }

    .grid-container {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-rows: auto auto;
        grid-gap: 0.5rem;
        grid-template-areas:  'Cavity        Cavity              RfInterlock'
                              'RfAmp         Llrf                RfInterlock';
    }
}

/*---------------------------------------------------------------------- */
/* 5.0 LARGER DEVICES                                                    */
/*---------------------------------------------------------------------- */

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {

    html {
        font-size: 14px;
    }

    .grid-container {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-rows: auto auto;
        grid-gap: 0.5rem;
        grid-template-areas:  'Cavity        Cavity              RfInterlock'
                              'RfAmp         Llrf                RfInterlock';
    }
}