#form-tabs {
    width: 100%;
}
#run-controls-display-toggle {
    float: left;
    margin: 8px;
}

#run-controls .tab-content .panel {
    margin-bottom: 0;
}

.utc-offset-caption {
    font-style: italic;
    font-size: smaller;
}

/* larger devices */

@media (min-width: 769px) {
    #run-controls.open .tab-content {
        display: block;
    }
    #run-controls.closed .tab-content {
        display: none;
    }
    #run-controls.closed li.active {
        border-bottom: 1px solid #999;
    }

    #run-controls {
        position: absolute;
        left: 0px;
        top: 61px;
        height: calc(100% - 61px);
        /*height: calc(50%);*/
        z-index: 1002;
        bottom: 90px;
        max-width: 600px;
        overflow: hidden;
    }
    #run-controls .tab-pane {
        overflow: scroll;
    }

    #run-controls .nav-tabs {
        /*position: absolute;*/
/*        right: 5px;
        top: 65px;
        height: 40px;
        width: 500px;*/
        background-color: white;
        border: #999 1px solid;
    }

    #run-controls .tab-content {
        /*position: absolute;*/
/*        right: 5px;
        top: 105px;
        bottom: 5px;
        width: 500px;*/
        overflow: scroll;
        z-index: 1002;
        background-color: white;
        border-bottom: #999 1px solid;
        border-left: #999 1px solid;
        border-right: #999 1px solid;
    }

    #run-controls .tab-content .nav-tabs {
        position: relative;
        border: none;
        top: 0px;
        /*width: 475px;*/
    }
    #run-controls .tab-content .tab-pane.time-series-graphs {
        width: 560px;
    }
    #run-controls .tab-content .tab-pane {
        overflow: hidden;
    }

    #run-controls .collapse-control {
        z-index: 1003;
        position: absolute;
        top: 75px;
        right: 10px;
    }
}

/* smaller devices */
@media (max-width: 768px) {
    #run-controls.open {
        height: 100%;
        z-index: 1002;

    }
    #run-controls.closed {
        height: 0;
        overflow: hidden;
    }

    #run-controls {
        position: absolute;
        left: 0px;
        top: 0px;
        width: 100%;
        background-color: white;
        border: #999 1px solid;
    }

    #run-controls .tab-content {
        overflow: scroll;
    }

    .collapse-control {
        float: right;
        margin-right: 30px;
        margin-top: 10px;
    }
}

/* really small devices */
@media (max-width: 450px) {
    #run-controls .nav > li > a {
        padding: 10px 10px;
    }
}
@media (max-width: 390px) {
    #run-controls .nav > li > a {
        padding: 10px 5px;
    }
}