/*body 2017-05-15 V25 GAF commented this out for the new code below
{
    position: relative;
    height: auto;
    min-height: 100%;
    margin: 0px 0px -10px 0px;
    padding: 0px 0px 0px 0px;
}*/
html, body /*2017-05-15 GAF Added this in to get the page to fill the screen.*/
{
   height: 100%;
}
body
{
    margin: 0px 0px -10px 0px;
    padding: 0px 0px 0px 0px;
}
.mainTableFormat
{
    /*border-collapse:collapse;
    border: 1px solid black;
    text-align: left;*/
    width: 100%; 
    background-color: #fff; 
    margin: 5px 0 10px 0; 
    border: solid 1px #525252; 
    border-collapse:collapse; 
}
    .mainTableFormat th {
        /*border:1px solid black;
    background-color:#dddddd;
    color:#000000;
    font-weight:bolder;*/
        padding: 4px 2px;
        color: #fff;
        background: #424242 url(grd_head.png) repeat-x top;
        border-left: solid 1px #525252;
        font-size: 13px; /*v27.9 GAF 2020-01-29 Changed this from 0.9em to 12px*/
        font-weight: bolder; /*v27.9 GAF 2020-01-29 added this in*/
    }
.mainTableFormat td
{
    /*border:1px solid black;
    text-align:center;*/
    padding: 2px; 
    border: solid 1px #c1c1c1; 
    color: #717171;
    
}
    .mainTableFormat tr:hover
    {
        background-color: lightgray;
        color: black;
        font-weight:bold;
    }
.mainTableFormat Caption
{
    font-size: 16pt;
    font-weight: bold;
}

.headerDivLeft
{
    float:left;
    width:50%;
}
.headerDivRight
{
    float:right;
    width:50%;
    text-align:right;
}
.mainPanel
{
    min-height:98%;
    background-color:#dddddd;
    width:100%;
}
.headerPanel
{
    height:20px;
    background-color:white; 
    width:90%;  
    text-align:left;
}
.headerLeftLabelDiv
{
    color:white;
    font-weight:bold;
    padding-left:20px;
    font-size:30px;
    font-family:'Bookman Old Style';
}
.headerRightLabelDiv
{
    color:white;
    font-weight:bold;
    padding-right:20px;
    font-size:30px;
    font-family:'Bookman Old Style';
}
.navDiv
{
    height:40px;
    background-color:whitesmoke; 
    width:100%;
}
.navigationPanel
{
    background-color:white;
    width:90%;
    text-align:left;
}
.navPanelDiv
{
    background-color:#41b73c;
    width:100%;
    text-align:left;
}
.mainBodyPanel
{
    min-height:70%;
    background-color:White;
    width:90%;
    text-align:left;
}
.footerPanel
{
    background-color:#41b73c;
    height:20px;
    width:90%;
    color:#dddddd;
    text-align:left;
}
.footPanelLeftLabel
{
    float:left;
    position:absolute;
    width:50%;
    padding-left:10px;
    color: blue;
}
.footPanelLeftLabel:visited
{
    color: blue;
}
.footPanelRightLabel
{
    float:right;
    width:50%;
    text-align:right;
    padding-right:10px;
    color: blue;
}
.foorPanelRightLabel:visited
{
    color:blue;
}
.headerPanelTopBar
{
    text-align: right;
    background-color:#41b73c;
    height:15px;
    width:90%;
}

.mainMenu
{
    width: 160px;
    background-color: #41b73c;
    color:white;
    text-align: center;
    height: 30px;
    line-height: 30px;
    font-weight:bold;
}
.levelMenu
{
    width: 160px;
    background-color: #41b73c;
    color:white;
    text-align:center;
    height: 30px;
    line-height: 30px;
    font-weight:bold;
    -webkit-transition:-webkit-transform 1s,opacity 1s,background 1s,width 1s,height 1s,font-size 1s;
    -webkit-border-radius:5px;
    -o-transition-property:width,height,-o-transform,background,font-size,opacity;
    -o-transition-duration:1s,1s,1s,1s,1s,1s;
    -moz-transition-property:width,height,-o-transform,background,font-size,opacity;
    -moz-transition-duration:1s,1s,1s,1s,1s,1s;
    transition-property:width,height,transform,background,font-size,opacity;
    transition-duration:1s,1s,1s,1s,1s,1s;
    border-radius:5px;
    opacity:1.0;
}
.menuHoverStyle
{
    width: 160px;
    background-color: #dddddd;
    color:black;
    text-align:center;
    height: 30px;
    line-height: 30px;
    font-weight:bold;
    opacity:2;
}
.menuSelectedStyle
{
    width: 160px;
    background-color: #dddddd;
    color: #000000;
    text-align: center;
    height: 30px;
    line-height: 30px;
    font-weight:bold;
}
.maturityReportHeaderLabelDiv
{
    text-align:center;
}
.inlineBlock 
{
    display: inline-block;
}
.floatLeft 
{
    float: left;
}
.floatLeft 
{
    float: left;
}
.scrollit 
{
    overflow: scroll;
    height: 100px;
}
.wrapper 
{
    overflow-x: auto;
}

.wrapper table 
{
    white-space: nowrap;
}
.maturityReportHeaderLabel
{
    color:Black;
    font-weight:bold;
    font-size:larger;
    text-align:center;
}
.maturityReportLeftLabel
{
    padding-left:5px;
    font-weight:bold;
}
.maturityReportDropDownLabelsDiv
{
    width:15%;
    display:inline-block;
    float:left;
}
.maturityReportDropDownLabel
{
    padding-left:10px;/*v27.0 GAF 2018-12-03 Changed from 5px to 10px */
    font-size:18px; /*v27.0 GAF 2018-12-03 added this in*/
    font-weight: bold;/*v27.0 GAF 2018-12-03 added this in*/
    padding-right:10px; /*v27.0 GAF 2018-12-03 added this in*/
}
.maturityReportDropDownSubmit
{
    margin-left:5px;
    margin-bottom:5px;
    margin-top:5px;
    /*V24 GAF 2016-12-30 Commented out the code below and instead added this code for the buttons.*/
    color: #fff;
    background-color:#00529B;
    font-weight: bold;
    padding:10px;
    border:none 0px transparent;
    border-radius: 4px 4px 4px 4px;
    -moz-border-radius:  4px 4px 4px 4px;
    border-radius:  4px 4px 4px 4px;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    
    /*background:#808080;
    color:#ffffff;
    font-weight:bold;
    -webkit-transition:-webkit-transform 1s,opacity 1s,background 1s,width 1s,height 1s,font-size 1s;
    -webkit-border-radius:5px;
    -o-transition-property:width,height,-o-transform,background,font-size,opacity;
    -o-transition-duration:1s,1s,1s,1s,1s,1s;
    -moz-transition-property:width,height,-o-transform,background,font-size,opacity;
    -moz-transition-duration:1s,1s,1s,1s,1s,1s;
    transition-property:width,height,transform,background,font-size,opacity;
    transition-duration:1s,1s,1s,1s,1s,1s;
    border-radius:5px;
    opacity:1.0;*/
}
.maturityReportDropDownSubmit:hover
{
    margin-left:5px;
    margin-bottom:5px;
    margin-top:5px;
     /*V24 GAF 2016-12-30 Commented out the code below and instead added this code for the buttons.*/
    cursor:pointer;
    background-color: #FFF;
    color:#00529B ;
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    /*opacity:2;
    background:#00FFFF;*/
}

.cancelButtonFormat /*v25.1 GAF 2018-01-28 Added this as a cancel button format*/
{
    margin-left:5px;
    margin-bottom:5px;
    margin-top:5px;
    color: #fff;
    background-color:Red;
    font-weight: bold;
    padding:10px;
    border:none 0px transparent;
    border-radius: 4px 4px 4px 4px;
    -moz-border-radius:  4px 4px 4px 4px;
    border-radius:  4px 4px 4px 4px;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
}
.CancelButtonFormat:hover /*v25.1 GAF 2018-01-28 Added this as a cancel button format*/
{
    margin-left:5px;
    margin-bottom:5px;
    margin-top:5px;
    cursor:pointer;
    background-color: #FFF;
    color:red;
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
}
.mautrityReportValues
{
    color:Black;
    padding-left:5px;
}
.maturityReportProjectLabelFormat
{
    padding-right:20px;
    vertical-align:middle;
}
.maturityReportPaddedLeftLabels
{
    padding-left: 30px;
    font-weight:bold;
}
.maturityReportLeftLabelsTable
{
    max-height:300px;
}
.maturityReportLeftLabelsTable tr
{
    text-align:left;
    vertical-align:top;
}
.maturityReportLeftLabelsTable td
{
    max-width:300px;
}
.maturityReportGraphDiv
{
    max-width:80%;
}
.temperatureReportHeaderLabels
{
    vertical-align:top;
}
 .modalBackground
{
    background-color: Black;
    filter: alpha(opacity=90);
    opacity: 0.8;
}
.modalPopup
{
    background-color: #FFFFFF;
    border-width: 3px;
    border-style: solid;
    border-color: black;
    padding-top: 10px;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
}
.textbox:focus
{
    outline: none;
    border-color: #9ecaed;
    box-shadow: 0 0 10px #9ecaed;
}
.loginControl
{
    padding-left: 25px;
}
/*2016-03-06 GAF v18 for use with menu button*/
.dropbtn {

    border-style: none;
    border-color: inherit;
    border-width: medium;
    cursor: pointer;
    text-align: right;
}
.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    right:0;
    text-align:left;
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

.dropdown-content a:hover {background-color: #f1f1f1}

.dropdown:hover .dropdown-content {
    display: block;
}

.dropdown:hover .dropbtn {
    background-color: #3e8e41;
}
/*2016-03-25 GAF Added this piece in for the new buttons*/
.mainButton
{
    color: #fff;
    width: 250px;
    font-size: medium;
    background-color:#41b73c;
    font-weight: bold;
    padding:25px;
    border:none 0px transparent;
    webkit-border-radius: 4px 4px 4px 4px;
    -moz-border-radius:  4px 4px 4px 4px;
    border-radius:  4px 4px 4px 4px;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
}
.mainButton:hover
{
    cursor:pointer;
    background-color: #FFF;
    color:#41b73c;
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
}
/*2016-03-25 GAF END*/
/*2017-05-16 V25 GAF Start*/
footer {
    text-align: center;
    position: relative;
    bottom: 0;
    width: 100%;
    /* Set the fixed height of the footer here */
    height: 60px;
    line-height: 12px; /* Vertically center the text there */
}
.footerList div{
    height: 200px;
    font-size: 14px;
    width: 100%;
    text-align:center;
}

/**Makes the items appear in a line. But you can't define the width of an inline element.**/
.footerList li{
    display:inline-block;
    float:none;
    padding-right:35px;
}
/*.footerList li + li:before {
    content: "|";
}*/
.footerList a{
    display:block; /*Allows you to define a width.*/
    text-align:center;
    color: gray;
    text-decoration:none;

}
    .footerList a:hover
    {
        text-decoration:underline;
        color:blue;
    }
.copyright
{
    color:gray;
}

.LoginDiv{
    border: 3px solid #f1f1f1;
    /*width: 50%;
    margin:0 auto;
    float:none;
    margin-right:200px;
    /*display:flexbox;*/
     /*left: 50%;
    top: 50%;
    position: absolute;
    -webkit-transform: translate3d(-50%, -50%, 0);
    -moz-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0);*/
     padding-right:60px;
     padding-top:20px;
     padding-bottom:20px;
}

.LoginTextBox{
    width: 90%;
    padding: 12px 20px;
    margin: 8px 0;
    margin-left:25px;
    display: inline-block;
    border: 1px solid #ccc;
    box-sizing: border-box;
}
.LoginLabel{
    font-weight:bold;
    margin-left:25px;
}
.LoginHeaderLabel{
    font-weight:bold;
    font-size:x-large;
}
.LoginInvalidLabel
{
    font-weight:bold;
    font-size:large;
    color:red;
}

.LoginButton {
    background-color: #0762f4;
    color: white;
    padding: 14px 20px;
    margin: 8px 0;
    border: none;
    cursor: pointer;
    width: 90%;
    margin-left:25px;
}

.LoginButton:hover {
    opacity: 0.8;
}

.MaturityMultiViewDiv
{
    width:100%;
    margin-left:25px;
}
.MainBodyDiv
{
    min-height:77%;
}

/*2017-05-16 V25 GAF End*/
/*2017-12-28 GAF Start*/
.NavMenuParent:hover .NavMenuHiddenChild
{
    display:block;
    
}
.NavMenuHiddenChild
{
    display:block;
}
/*2017-12-28 GAF End*/

/*v25.6 GAF 2018-07-22 Added this code to handle setting the column headers for the RAD Grid that we use on the TempSensorReport*/
.yellowItemsStyle
{
    background-color: yellow !important;
    background-image: none !important;
}
.greenItemsStyle
{
    background-color: green !important;
    background-image: none !important;
}
.blueItemsStyle
{
    background-color: blue !important;
    background-image: none !important;
}
.redItemsStyle
{
    background-color: red !important;
    background-image: none !important;
}
/*v25.8 GAF 2018-08-13 Start Added this in for the new colors we added*/
.pinkItemsStyle
{
    background-color: pink !important;
    background-image: none !important;
}
.purpleItemsStyle
{
    background-color: purple !important;
    background-image: none !important;
}
/*v25.8 GAF 2018-08-13 End*/
/*v26.1 GAF 2018-08-25 Added in the orange color style for ambient temps*/
.orangeItemsStyle
{
    background-color: orange !important;
    background-image: none !important;
}
/*v26.4 GAF 2018-09-19 Added in the light blue color style for ambient temps*/
.lightBlueItemsStyle
{
    background-color: lightblue !important;
    background-image: none !important;
}
/*v26.2 GAF 2018-09-06 Added this in to control how the configuration radio buttons would look*/
/* The container */
.radioButtoncontainer {
    display: inline;
    position: relative;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 20px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default radio button */
.radioButtoncontainer input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
    }

/* Create a custom radio button */
.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: #eee;
    border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.radioButtoncontainer:hover input ~ .checkmark {
    background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.radioButtoncontainer input:checked ~ .checkmark {
    background-color: #2196F3;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the indicator (dot/circle) when checked */
.radioButtoncontainer input:checked ~ .checkmark:after {
    display: block;
}

/* Style the indicator (dot/circle) */
.radioButtoncontainer .checkmark:after {
    top: 9px;
    left: 9px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: white;
}

/*this gives the individual divs on the setup page their shape and spacing */
.setupDiv
{
    border: 3px solid #f1f1f1;
    width:100%;
    /*height:40px;
    padding-top:10px;*/    /*v27.8 GAF 2019-11-13 Commented these lines out now that the new bootstrap css is in place*/
}

/*v27.0 GAF 2018-12-03 Added this in to modernize the dropdowns*/
.modernDropDown
{
    width:300px;
    border-radius: 10px;
    height: 40px;
    font-size: 16px;
    padding: 10px;

}
.modernDropDown #Hover
{
    background-color:blue;
    color: white;
}
.gridView
{
    width:100%;
    border-radius: 10px;
}

/*v27.1 GAF 2018-12-20 Added in these button styles so that the manage outliers buttons would look correct*/
.manageOutlierHideButton
{
    margin-left:5px;
    margin-bottom:5px;
    margin-top:5px;
    color: white;
    background-color:lime;
    font-weight: bold;
    padding:10px;
    border:none 0px transparent;
    border-radius: 4px 4px 4px 4px;
    -moz-border-radius:  4px 4px 4px 4px;
    border-radius:  4px 4px 4px 4px;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    
}
.manageOutlierHideButton:hover
{
    margin-left:5px;
    margin-bottom:5px;
    margin-top:5px;
    cursor:pointer;
    background-color: #FFF;
    color:limegreen ;
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
}

.manageOutlierUnhideButton
{
    margin-left:5px;
    margin-bottom:5px;
    margin-top:5px;
    color: white;
    background-color:darkorange;
    font-weight: bold;
    padding:10px;
    border:none 0px transparent;
    border-radius: 4px 4px 4px 4px;
    -moz-border-radius:  4px 4px 4px 4px;
    border-radius:  4px 4px 4px 4px;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    
}
.manageOutlierUnhideButton:hover
{
    margin-left:5px;
    margin-bottom:5px;
    margin-top:5px;
    cursor:pointer;
    background-color: #FFF;
    color:darkorange;
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
}
.buttonHolderDiv
{
    border-left: 1.5px solid black; 
}
/*v28.2 GAF 2020-06-16 Added this in to handle the checkbox sliders on the create contact page*/
.switch {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 24px;
}

    .switch input {
        opacity: 0;
    }

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

    .slider:before {
        position: absolute;
        content: "";
        height: 16px;
        width: 16px;
        left: 4px;
        bottom: 4px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }

input:checked + .slider {
    background-color: #2196F3;
}

input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

    .slider.round:before {
        border-radius: 50%;
    }
/*v28.2 GAF 2020-06-16 END*/