/*
Copyright (c) 2017, Bruce Schubert.
The MIT License
*/
body {
    /*padding-top: 50px;*/
    /* Move the content down because we have a fixed navbar that is 50px tall */
}

/*.navbar-fixed-top {
  max-height: 54px;
}*/

/* Computing height with % instead of vh due to Chrome/Android reporting vh
   based on total possible size (e.g., address bar hidden), not actual size */
.container-split {
    /*maximum size, excluding the nav-bar*/
    position: fixed;
    top: 54px;
    height: calc(100% - 54px);
    width: 100vw;
}

.container-split {
    /*maximum size, excluding the nav-bar*/
    position: fixed;
    top: 51px;
    height: calc(100vh - 51px);
    width: 100vw;
}

.container-full {
    margin: 0 auto;
    width: 100%;
    height: 100%;
    min-height:100%;
}

.globe-button {
    background:rgba(255,255,255,0.3);
}
/*.globe-button:hover {
    background: rgba(255,255,255,0.7);
    color:rgba(255,255,255,0.8);
}*/

#globe {
    overflow: hidden;
}

#globe canvas {
    top: 0;
    left: 0;
    z-index: 0 !important;
    width: 100%;
    height: 100%;
    padding-left: 0;
    padding-right: 0;
    background-color: rgb(0,0,0);
    /*border:1px solid #000000;*/
}

/*Override the default navbar-form padding of 15px*/
.navbar-form {
    padding-left: 5px;
    padding-right: 5px;
}

/* Controls the style of enabled and disabled layers */
.layer-name {
    font-style: italic;
    font-weight: lighter;
}

.layer-name.active {
    font-style: normal;
    font-weight: normal;
}

.main {
    padding: 0px;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 15px;
}

.non-interactive {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    pointer-events: none;
}

.interactive {
    -webkit-touch-callout: auto !important;
    -webkit-user-select: auto !important;
    -khtml-user-select: auto !important;
    -moz-user-select: auto !important;
    -ms-user-select: auto !important;
    -o-user-select: auto !important;
    pointer-events: auto !important;
}

.noselect {
    -webkit-touch-callout: none;
    /* -webkit-user-select: none; */
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.gutter {
    background-color: #aaa;
    background-repeat: no-repeat;
    background-position: 50%;
    z-index: 900 !important ;
}

.gutter.gutter-horizontal {
    background-image: url('images/grips/vertical.png');
    cursor: ew-resize;
}

.gutter.gutter-vertical {
    background-image: url('images/grips/horizontal.png');
    cursor: ns-resize;
}

.row {
    margin-right: 0;
    margin-left: 0;
}

.section-heading {
}


/*Truncating text on a single line with an ellipsis*/
.ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
}
/*split window container class*/
.split {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;

    overflow-y: auto;
    overflow-x: hidden;
}

.split.split-horizontal, .gutter.gutter-horizontal {
    height: 100%;
    float: left;
}

.split.split-vertical {
}

/*split window container class*/
.split {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;

    overflow-y: auto;
    overflow-x: hidden;
}

.gutter {
    background-color: #aaa;
    background-repeat: no-repeat;
    background-position: 50%;
}

.gutter.gutter-horizontal {
    background-image: url('images/grips/vertical.png');
    cursor: ew-resize;
}

.gutter.gutter-vertical {
    background-image: url('images/grips/horizontal.png');
    cursor: ns-resize;
}

.split.split-horizontal, .gutter.gutter-horizontal {
    height: 100%;
    float: left;
}
.split.split-vertical {
}

.sub-header {
    padding-bottom: 10px;
    border-bottom: 1px solid #eee;
    cursor: default;
    -webkit-user-select: none; /* Chrome all / Safari all */
    -moz-user-select: none; /* Firefox all */
    -ms-user-select: none; /* IE 10+ */
    user-select: none; /* Likely future */
}

/*Ensure JQuery UI dialogs are above other ui elements*/
.ui-dialog { z-index: 1000 !important ;}


/*vis.js library*/
.vis-time-axis .vis-text {
    color: #AAA;
}

.wrap-panel-heading {
    white-space: normal;
    -ms-word-wrap: break-word;
    word-wrap: break-word;
}

.vis-time-axis .vis-text {
  color: #AAA;
}

#canvas-wrap canvas {
    position: relative;
    top: 0;
    left: 0;
    z-index: 0 !important;
    width: 100%;
    height: 100%;
    padding-left: 0;
    padding-right: 0;
    background-color: rgb(0,0,0); 
    /*border:1px solid #000000;*/
}

#globe-marker-controls {
    width: 100px;
}

#globe-buttons {
    float: right;
    position: absolute; 
    top: 0; 
    right: 0;
    margin-top: 30px;
    margin-right: 5px;
    margin-left: 0px;
    max-width: 85px;
}

#timeControlButtons {
    position: absolute;  /*sets it's position relative to the document instead of the container. Allows the bottom property to be used to force the element to the bottom of the view.  */
    bottom: 35px;
    left: calc(50% - 98px);
}

#timeControlSlider {
    position: absolute;  /*sets it's position relative to the document instead of the container. Allows the bottom property to be used to force the element to the bottom of the view.  */
    bottom: 20px;
    left: calc(50% - 98px);
}

#timeControlSlider .ui-slider-handle {
    background:#3e444c;
    top:3px;
}


/*Desktop or laptop*/
@media (min-width: 768px) {
    /*desktop sidebar*/
    .sidebar-left {
        position: fixed;
        top: 54px;
        bottom: 0;
        left: 0;
        z-index: 1000;
        display: block;
        padding-top: 0px;
        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 20px;
        overflow-x: hidden;
        overflow-y: auto;
        border-right: 1px solid #eee;
    }
    .main {
        top: 54px;
        height: calc(100vh - 54px);
        position: fixed;
    }
    .section-heading .section-toggle:after {
        padding-left: 20px;
        padding-right: 20px;
    }


    .dl-horizontal dt { 
        /*text-align: left;*/ 
        width: 100px;
    }
    .dl-horizontal dd { 
        margin-left: 110px;
    }

}

/*Mobile phone or table*/
@media (max-width: 767px) {
    .main {
        height: calc(100vh - 71px);
    }
    /* symbol for opening sections */
    /*.section-heading .section-toggle:after {*/
    /*font-family: 'Glyphicons Halflings';*/
    /*content: "\e114";*/
    /*float: none;*/
    /*color: lightgrey;*/
    /*}*/

    /* symbol for closing sections */
    /*.section-heading .section-toggle.collapsed:after {*/
    /*content: "\e080";*/
    /*}*/

    a.section-toggle {
        text-decoration: none;
    }
}


/*
D3 charts
*/

.chart {
  background-color: #eeeeee;
}

.xyplot {
  background-color: #bebebe;
}

/*
VisJS library overrides
*/

.vis-data-axis .vis-y-axis.vis-major {
  /*in the 'slate' color scheme we need a bright color for the major*/
  color: #dedede;
}

.vis-data-axis .vis-y-axis.vis-minor {
  color: #bebebe;
}

.vis-data-axis .vis-y-axis.vis-minor.vis-measure {
  padding: 0;
  margin: 0;
  border: 0;
  visibility: hidden;
  width: auto;
}

/*
Custom style for VisJS graphs
*/

.air-temp-style1 {
    fill: #f2ea00;
    fill-opacity:0;
    stroke-width:2px;
    stroke: #b3ab00;
}

.wind-speed-style1 {
    fill: #00ced1;
    fill-opacity:0;
    stroke-width:2px;
    stroke: #1E90FF;
}

.rel-humidity-style1 {
    fill: #00f201;
    fill-opacity:0;
    stroke-width:2px;
    stroke: #029200;
}

.sky-cover-style1 {
    fill: #eeeeee;
    fill-opacity:0;
    stroke-width:2px;
    stroke: #cccccc;
}

path.custom-style3.vis-fill {
    fill-opacity:0.5 !important;
    stroke: none;
}