body, html {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    background: #BFBD93;
    font-family: Arial, Helvetica, sans-serif;
    font-size: .9em;
}

/*makes padding/margins included input size*/
body, html, #header, #searchMenu {
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
}

input:focus {
    background-color: yellow;
}

body {position: relative; top: 0; overflow: hidden;}

#header {
    position: absolute;
    /*left: 12px;*/
    left: 135px;
    width: 55%;
    height: auto;
    padding: 3px 10px;
    background: #BFBD93;
    border: 2px solid #e7e2d9;
    border-top: 0;
    border-radius: 0 0 10px 10px;
    z-index: 201;
}

h1 {
    float: left;
    color: #e7e2d9;
    padding: 0;
    margin: 0;
    font-size: 1.8em;
    font-weight: bold;}

.logo {
    position: absolute;
    top: 0px;
    right: 0px;
    z-index: 200;
    border-radius: 0px 0px 5px 5px;
    background-color: #FFFFFF;
}

h2 {
    font-size: 1.2em;
    font-weight: bold;
    margin: 0;
    padding: 0;
    line-height: 0;
    text-align: center;
}

h3 {
    font-size: .95em;
    font-weight: bold;
    color: #a9a285;
    padding: 15px 0 3px 0;
    margin: 0;
}

usr {
    font-size: .85em;
    font-weight: bold;
    color: #a9a285;
    padding: 15px 0 3px 0;
    margin: 0;
}

#nav {
    float: left;
    color: #e7e2d9;
    font-size: .95em;
    font-weight: bold;
    z-index: 201;
    padding: 9px 15px 0 30px;
}

#nav a {
    color: #e7e2d9;
    font-weight: bold;
    padding-left: 30px;
}
#nav a:hover {
    text-decoration: none;
    color: white;
}
#nav .active {
    color: #9d9486;
}

a {
    color: #ad4c0c;
    text-decoration: none;
}

a:hover {
    color: #ed6212;
    text-decoration: underline;
    }

#searchMenu {
    width: auto;
    width: 500px\9;
    position: absolute;
    top: 115px;
    left: 12px;
    z-index: 100;
}

#searchBttn {
    width: 200px;
    height: auto;
    background: #BFBD93;
    border-radius: 6px 6px 0 0;
    border: 2px solid #e7e2d9;
    color: black;
    padding: 5px 5px 5px 5px;
    text-align: center;
    font-weight: bold;
}



.backTop {
    color: blue;
}

.sectionHeading {
    color: black;
    font-weight: bold;
}

#searchPanel {
    width: auto;
    padding: 10px;
    margin: 0;
    background: rgb(231, 226, 217);
    background: rgba(231, 226, 217, 0.9);
    border-radius: 0 6px 6px 6px;
    overflow:auto;
    border-left: 0;
}

#resultsMenu {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    position: absolute;
    bottom: 5px;/*leaves a tiny peak at the bottom as requested by KB to make it clear that the bottom of the results are visible*/
    left: 0;
    right: 0;
    z-index: 110;
    border-radius: 6px 6px 6px 6px;
}

#resultsBttn {
    width: 300px;
    /*height: auto;*/
    background: #BFBD93;
    border-radius: 6px 6px 0 0;
    border: 2px solid #e7e2d9;
    color: black;
    padding: 5px 5px 5px 5px;
    text-align: center;
    font-weight: bold;
    margin-left: auto;
    margin-right: auto;
    cursor:pointer;
    display:none;
}

#resultsSizeBttn {
    width: 250px;
    height: auto;
    background: #BFBD93;
    border-radius: 6px 6px 0 0;
    border: 2px solid #e7e2d9;
    color: black;
    /*padding: 5px 5px 5px 5px;*/
    text-align: center;
    font-weight: bold;
    margin-left: auto;
    margin-right: 0px;
    cursor:pointer;
    display:none;
}


 #resultsPanel {
    /*width: auto;*/
    max-height: 150px;
    width: 93%;
    /*padding: 5px;*/
    margin: 0;
    background: rgba(231, 226, 217, 0.9);
    overflow:auto;
    border-left: 0;
    text-align: left;

}



 #downloadPanel {
    display: none;
    background: #BFBD93;
    width: 93%;
    overflow:auto;
    border-left: 0;
    border-radius: 4px 4px 0 0;
}

 #helpPanel {
    /*width: auto;*/
    max-height: 800px;
    width: 75%;
    /*padding: 5px;*/
    margin-left: 10px;
    background: rgba(231, 226, 217, 0.9);
    overflow:auto;
    border-left: 0;
    text-align: left;
    border-radius: 6px 6px 6px 6px;
}

 #helpCloseBttn {
    width: 100px;
    height: auto;
    background: #BFBD93;
    border-radius: 6px 6px 0 0;
    border: 2px solid #e7e2d9;
    color: black;
    /*padding: 5px 5px 5px 5px;*/
    text-align: center;
    font-weight: bold;
    margin-left: auto;
    margin-right: 5px;
    cursor:pointer;
    display:none;
}

  #DrillerhelpCloseBttn {
    width: 100px;
    height: auto;
    background: #BFBD93;
    border-radius: 6px 6px 0 0;
    border: 2px solid #e7e2d9;
    color: black;
    /*padding: 5px 5px 5px 5px;*/
    text-align: center;
    font-weight: bold;
    margin-left: auto;
    margin-right: 5px;
    cursor:pointer;
    display:none;
}

  #DrillerhelpPanel {
    /*width: auto;*/
    max-height: 800px;
    width: 75%;
    /*padding: 5px;*/
    margin-left: 10px;
    background: rgba(231, 226, 217, 0.9);
    overflow:auto;
    border-left: 0;
    text-align: left;
    border-radius: 6px 6px 6px 6px;
}

    #PIhelpCloseBttn {
    width: 100px;
    height: auto;
    background: #BFBD93;
    border-radius: 6px 6px 0 0;
    border: 2px solid #e7e2d9;
    color: black;
    /*padding: 5px 5px 5px 5px;*/
    text-align: center;
    font-weight: bold;
    margin-left: auto;
    margin-right: 5px;
    cursor:pointer;
    display:none;
}

  #PIhelpPanel {
    /*width: auto;*/
    max-height: 800px;
    width: 75%;
    /*padding: 5px;*/
    margin-left: 10px;
    background: rgba(231, 226, 217, 0.9);
    overflow:auto;
    border-left: 0;
    text-align: left;
    border-radius: 6px 6px 6px 6px;
}

#statusMessage {
    width: auto;
    padding: 10px 10px 20px 10px;
    margin: 0;
    background: rgba(231, 226, 217, 0.9);
    overflow:auto;
    border-left: 0;
    text-align: center;
}

.userMessage{
    font-family: "Arial", Times, serif;
    color:#FF0000;

}

.bttn {
    margin-top: 20px;
    padding: 5px;
    width: 100px;
    background: #BFBD93;
    border: 1px solid white;
    border-radius: 4px;
    text-align: center;
    cursor: pointer;
}

.bttnExport {
    padding: 5px;
    margin-right: 5px;
    width: 130px;
    background: #93C07D;
    border: 1px solid white;
    border-radius: 4px;
    text-align: center;
    cursor: pointer;
    font-size:smaller;
    float: left;

}

.bttn:hover {
    color: #ad4c0c;
    background: #BFBD93;
    border: 1px solid #ad4c0c;
}

.bttnClose {
    margin: 0;
    padding: 1px 2px 1px 2px;
    width: auto;
    color: #a9a285;
    border: 1px solid #a9a285;
    border-radius: 4px;
    text-align: center;
    cursor: pointer;
    font-size: .8em;
    font-weight: bold;
}

.bttnClose:hover {
    color: #807a62;
    border: 1px solid #807a62;
}

.arrow-up {
	width: 0; 
	height: 0; 
    margin-top: 3px;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	border-bottom: 8px solid white;
    float: right;
}

.arrow-down {
	width: 0; 
	height: 0; 
    margin-top: 3px;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	border-top: 8px solid white;
    float: right;
}

.arrow-right {
	width: 0; 
	height: 0; 
    margin-top: 3px;
	border-top: 8px solid transparent;
	border-right: 8px solid transparent;
    border-bottom: 8px solid transparent;
	border-left: 8px solid white;
    float: right;
}

.arrow-left {
	width: 0; 
	height: 0; 
    margin-top: 3px;
	border-top: 8px solid transparent;
	border-right: 8px solid white;
    border-bottom: 8px solid transparent;
	border-left: 8px solid transparent;
    float: right;
}

/*admin styles*/
#mainbody {
    margin-top: 75px;
    width: 100%;
    height: -moz-calc(100% - 72px);
    height: -webkit-calc(100% - 72px);
    height: calc(100% - 72px);
    background: #e7e2d9;
}

#dataEntryContain {
    position: absolute;
    top: 0;
    left: 0;
    width: 20%;
    min-width: 280px;
    background: #e7e2d9;
    z-index: 200;
    height: 100%;
    /*overflow:auto;*/
}

#welldataEntry {
    /*the div that contains the area where well data is entered*/
    float:left;
    width:400px;
    /*overflow:hidden;*/
    /*min-width: 280px;*/
    height: 90%;
    padding: 10px;
    margin-top: 38px;
    overflow:auto;
    background: #e7e2d9;
}

#testResultsEntry {
    min-width: 280px;
    float:left;
    /*width:40%;*/
    overflow:hidden;
    height: 90%;
    width: 60%;
    padding: 10px;
    margin-top: 38px;
    overflow:auto;
    background: #faf5ed;
}

.wqSearchable{
    font-style:italic;
    text-shadow: 0.1em 0.1em 0.2em gray;
}

/*table styles*/

table {width: 100%;    margin-left:auto; margin-right:auto;}
tr .lftCol {text-align: right; white-space: nowrap}
tr .rtCol {text-align: left;}

thead {font-weight: bold; text-align: center; background-color: #666352; color:white }
.alt {background-color: #f4f0e9;}
.datalist tbody tr:hover { background-color: #ffffff; }
.label {color: #73724d; font-weight: bold; text-align: right;}
.identified td {vertical-align: top;}
.highlightID {background-color:#d7d6b2; font-weight:bold;}
.search {border-collapse: collapse;}
.search td {padding: 1px;}
.yearlist  {font-weight: bold; text-align: center; background-color: #666352; color:white;}
.drillerInfo  { /*CONTAINER FOR driller contact table clear:both;*/ padding: 5px 5px 5px 5px; margin: 5px auto; width:450px; background: #faf5ed; text-align:left; height: 95%;border-radius: 5px; display:none; }
#resultsTable { /*CONTAINER FOR well search results clear:both;*/ padding: 20px 10px 10px 10px; margin: 5px auto; width:80%; background: #faf5ed; text-align:left; height: 100%; border-radius: 5px; }

.sampleInfo     { /*CONTAINER FOR sample results table*/ clear:both; padding: 20px 10px 10px 10px; margin: 5px auto; width:1000px; background: #faf5ed; border-radius: 5px; display:none;overflow:scroll;font-size:x-small; }
.wellOwnerInfo  { /*CONTAINER FOR wellOwner table*/  padding: 20px 10px 10px 10px; margin: 5px auto; width:1000px; background: #faf5ed; text-align:left; height: 100%;border-radius: 5px; overflow:auto; }
.wellOwnerTable {background: #BCB5A6;overflow:scroll;}
#resultsTableResultsDR {
    overflow: scroll;
    min-width: 800px;
    max-height: 500px;
    display: none;
}

#rtable tbody tr:hover { background-color: #ffffff; }
#rtable thead {cursor: pointer;}
#dtable tbody tr:hover { background-color: #ffffff; }
#dtable thead {cursor: pointer;}
#ptable tbody tr:hover { background-color: #ffffff; }
#ptable thead {cursor: pointer;}

/*map styles*/
#mapAdmin {
    position: absolute;
    right: 0;
    top: 0;
    width: 50%;
    height: 100%;
}

#map {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#pdfViewBtn {
     background:none!important;
     border:none; 
     padding:0!important;
     font: inherit;
     /*border is optional*/
     border-bottom:1px solid #444; 
     cursor: pointer;
}


#BasemapToggle {
    position: absolute;
    bottom: 45px;
    right: 8px;
    z-index: 50;
}
#HomeButton {
    position: absolute;
    top: 45px;
    left: 55px;
    z-index: 60;
    border: 1px solid #e7e2d9;
    border-radius: 5px;
}
#map_zoom_slider {top: 45px !important; left: 12px !important;}
#mapAdmin_zoom_slider {top: 45px !important; left: 23px !important;}

/*drillers page*/
#drillTab { margin: 0; padding: 0; font-size: 14px;}
#drillTab li { /*TAB BUTTON LAYOUT*/ float:left; list-style:none; background: #faf5ed; border-top-left-radius: 5px; border-top-right-radius: 5px; margin: 0 4px 0 0;}
#drillTab li a { /*TAB BUTTON WITH LINK*/ font-weight:bold; color: black; padding: 6px 25px 6px 25px; display:block; text-decoration:none; }
#drillTab li a.inactive{
/*TAB BUTTON INACTIVE*/ padding-top:4px; padding-bottom:4px; color: #9d9486; background: #e7e2d9; border-top-left-radius: 5px; border-top-right-radius: 5px; border-top: 0;
/*THIS TRANSITION MAKES THE HOVER EFFECT ANIMATE*/
-webkit-transition: border-top .25s, color .25s; /* For Safari 3.1 to 6.0 */
transition: border-top .25s, color .25s;
}

#drillTab li a.inactive:hover {
/*TAB BUTTON INACTIVE HOVER*/ 
border-top: 4px solid #959474; 
color:black;
}

.drillContain { 
    /*CONTAINER FOR CONTENT*/ 
    clear:both; 
    padding: 20px 10px 10px 10px; 
    margin: 0; 
    width:450px; 
    background: #faf5ed; 
    text-align:left; 
    height: 100%;
    border-radius: 0 5px 5px 5px;
}



/*pump installer page*/
.PIContain { 
    /*CONTAINER FOR CONTENT*/ 
    clear:both; 
    padding: 20px 10px 10px 10px; 
    margin: 0; 
    width:500px; 
    background: #faf5ed; 
    text-align:left; 
    height: 100%;
    border-radius: 0 5px 5px 5px;
}

#PItab { margin: 0; padding: 0; font-size: 14px;}
#PItab li { /*TAB BUTTON LAYOUT*/ float:left; list-style:none; background: #faf5ed; border-top-left-radius: 5px; border-top-right-radius: 5px; margin: 0 4px 0 0;}
#PItab li a { /*TAB BUTTON WITH LINK*/ font-weight:bold; color: black; padding: 6px 25px 6px 25px; display:block; text-decoration:none; }
#PItab li a.inactive{
/*TAB BUTTON INACTIVE*/ padding-top:4px; padding-bottom:4px; color: #9d9486; background: #e7e2d9; border-top-left-radius: 5px; border-top-right-radius: 5px; border-top: 0;
/*THIS TRANSITION MAKES THE HOVER EFFECT ANIMATE*/
-webkit-transition: border-top .25s, color .25s; /* For Safari 3.1 to 6.0 */
transition: border-top .25s, color .25s;

}

#PItab li a.inactive:hover {
     /*TAB BUTTON INACTIVE HOVER*/ 
border-top: 4px solid #959474; 
color:black;
}

.bttn_wellOwnerTable {
    margin-top: 20px;
    padding: 5px;
    /*width: 100px;*/
    background: #BDAE8C;
    border: 1px solid white;
    border-radius: 4px;
    text-align: center;
    cursor: pointer;
}


#correspondenceDiv {
    min-width: 280px;
    height: 90%;
     /*float:left;*/
    /*width: 30%;*/
    padding: 10px;
    margin-top: 38px;
    overflow:auto;
    background: #faf5ed;
}

.letterArea{
    float:left;
}

/*required field asterik*/
.reqfld{
    /*float: right;*/
}
.reqfld:before{
 content:"*" ;
color:red    
}
.reqfldRight{
    /*float: right;*/
}
.reqfldRight:after{
    content:"*" ;
    color:red;    
}

.popup_overlay{
    display: none;
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    background-color: black;
    z-index:1001;
    -moz-opacity: 0.4;
    opacity:.4;
    filter: alpha(opacity=40);
}

.popup_content {
    display: none;
    position: absolute;
    top: 25%;
    left: 32%;
    width: 30%;
    height: 30%;
    padding: 16px;
    border: 16px solid #959474;
    background-color: #faf5ed;
    z-index:1002;
    overflow: auto;
}

.popup_cancel {
    position: absolute;
    top: 5%;
    right: 5%;
}

.quarters {
    border-radius: 20px;
    width: 100px;
    font-size: 20px;
}

.quarterQuarters {
    border-radius: 25px;
    background-color: #A0A0A0;
    display:none;
    position: absolute;
    top: 15%;
    left: 30%;
    z-index:1000;
}
#dijit_form_DropDownButton_0_label {
    font-size:x-small;
}

dijitDownArrowButton{
    font-size:x-small;
}
#rightDiv {
    top: 1px;
    right: 1px;
    width: auto; 
    height: auto;
    max-width: 210px;
    position: absolute; 
    z-index: 1; 
    /*padding: 20px 20px 20px 20px;*/ 
}
#toolsSubDiv{
    font-size: 11px;
}
#measurementDiv {
            /*color: #4c4c4c;*/
            /*font-size: 14px;
            font-weight: bold;*/
            /*padding: 7px;*/
            /*border-radius: 10px;*/ 
            /*border: 2px solid rgb(231, 226, 217);*/ 
            border-image: none; 
            /*right: 15px; 
            top: 280px;*/ 
            width: auto; 
            height: auto; 
            max-width: 300px;
            /*position: absolute;*/ 
            z-index: 1; 
            background-color: rgb(191, 189, 147);
}
#measurementSubDiv {
min-width: 165px;
}
.unitDropDown{
    font-size: 11px;
}
.dijitDownArrowButton{
    font-size: 11px;
}

.separator_10{
    padding-left:10em
}

.LLArrow{

}

.LLArrow:after{

}
/*MEDIA QUERIE FOR SMALLER SCREENS*/
@media screen and (max-width: 600px) {
    body, html {overflow: hidden;}
    #header {height: 25px; min-width: 200px;}
    #header h1 {font-size: 1.25em; text-align: center; float: none; padding-left: 0px; margin-top: 10px;}
    .logo {display: none;}
    #map {height: -moz-calc(100% - 36px); height: -webkit-calc(100% - 36px); height: calc(100% - 36px); overflow: hidden;}
    #searchMenu {width: auto; position: absolute; top:35px; left: 0; right: 0;}
    #searchBttn {width: auto; border-radius: 0 0 0 0; border-top: 2px solid #e7e2d9; border-bottom: 2px solid #e7e2d9; border-left: 0; border-right: 0;}
    #searchPanel {border-radius: 0 0 0 0;}
    #mainbody {height: -moz-calc(100% - 36px); height: -webkit-calc(100% - 36px); height: calc(100% - 36px); overflow: auto;}
    #welldataEntry {float:none; width: 100%; height: auto; position: absolute; left: 0; top: 300px;}
    #mapAdmin {width: 100%; height: 300px;}
}

.ui-autocomplete { position: fixed; cursor: default;z-index:9999 !important;}