    html, body{
     height:100%;
     width:100%;
     padding:0;
     margin: 0;
    }
    body {
         background-color:#FFF;
         color: #000;
         font-size:14px;
         overflow:hidden;
        font-family: Verdana;
    }


    .heading{
      border-bottom:  solid 1px #999;
    }



    #header {
        color:white; font-size:18pt;
        text-align:left; font-weight:bold;
        height:70px;          
        overflow: hidden;
        background-color: #000;
    }
    .esriSimpleSliderDecrementButton:hover {
    border-top: 1px solid #666;
    }
    .HomeButton .home{
    background-image: url(../images/home.png);
    padding:0;
    border-radius: 0;
    border-bottom: 1px solid #666;
    background-color:#FFF;
    }
    .HomeButton .home:hover  {
    background-color:#eee;
    background-color: rgb(238, 238, 238);
    }

    .HomeButton .home:active {
    background-color:#ddd;
    }


    .LocationButton { 
           -moz-user-select: none;
            background-color: #fff;
            background-image: url("../images/locatebuttonTool.png");
            border-bottom: 1px solid #666;
            border-radius: 0;
            background-position: center center;
            background-repeat: no-repeat;
            cursor: pointer;
            height: 30px;
            width: 30px;          
    }

    .locationButton:hover{
        background-color:#ddd;
    }

    #title {
     font-size:16pt;
     font-weight:bolder;     
     padding-left:15px;
    }

    #subtitle {       	    
	    padding: 0px;
        margin-left: 25px;
	    color: white;
	    font-size: 10pt;
    }

    #leftPane {
        width: 320px;
        height: 100%;    
        top: 0px;
        z-index: 100;
        font-size: small;
    }

    #mapcoords{
        background-color: #C0C0C0;
        padding: 7px;
        right: 2px;
        bottom: 2px;
        position:absolute;
        z-index: 3;
        font-size: 7pt;
    }

    .header-search-control {
        position:absolute;
        font-size: small;
        border:none;
    }



    .esriEditor{
      height:95%;
    }
    .esriLegend{
        height:95%;
        padding-top:5px;
    }
    .templatePicker{
        border:none;
        /*was set to height 90%*/
    }
    
    
    .templatePicker .tooltip {
      display: none;
    }

    
    #map {
     /*border-left:solid 1px #999;
     border-right:solid 1px #999;*/
     height:100%;
     padding: 0px;
    }

  .mobile #header{
    height:30px;
    overflow: hidden;
    text-align: center;
    padding-right: 10px;
    background-image: none;
  }
  .mobile #title{
   display: block;
    font-size: 16px;
    margin: 0.6em 30% 0.8em;
    min-height: 1.1em;
    outline: 0 none !important;
    overflow: hidden;
    padding: 0;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .mobile #leftPane{
    height:100%;
    overflow: auto;
    position: absolute;
    width:100%;
    z-index:100;
    display:none;
    background-color: white;
  }

    .mobile #menuPane{
    
    overflow: auto;
    
  }

    .mobile-menu-section {
        padding: 5px 5px;
    }

    .mobile-menu-header {
        
    }

   
    .ags-mobile-button{
        text-decoration: none;       
    }

    

.list-group {
  padding-left: 0;
  margin-bottom: 10px;
}

.list-group-item {
  position: relative;
  display: block;
  padding: 10px 15px;
  margin-bottom: -1px;
  background-color: #ffffff;
  border: 1px solid #dddddd;
}

.list-group-item:first-child {
  border-top-right-radius: 4px;
  border-top-left-radius: 4px;
}

.list-group-item:last-child {
  margin-bottom: 0;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
}

.list-group-item > .badge {
  float: right;
}

.list-group-item > .badge + .badge {
  margin-right: 5px;
}

a.list-group-item {
  color:#000;
}

a.list-group-item .list-group-item-heading {
  color: #333333;
}

a.list-group-item:hover,
a.list-group-item:focus {
  text-decoration: none;
  background-color: #f5f5f5;
}

.list-group-item.active,
.list-group-item.active:hover,
.list-group-item.active:focus {
  z-index: 2;
  color: #ffffff;
  background-color: #428bca;
  border-color: #428bca;
}

.list-group-item.active .list-group-item-heading,
.list-group-item.active:hover .list-group-item-heading,
.list-group-item.active:focus .list-group-item-heading {
  color: inherit;
}

.list-group-item.active .list-group-item-text,
.list-group-item.active:hover .list-group-item-text,
.list-group-item.active:focus .list-group-item-text {
  color: #e1edf7;
}

.list-group-item-heading {
  margin-top: 0;
  margin-bottom: 5px;
}

.list-group-item-text {
  margin-bottom: 0;
  line-height: 1.3;
}

   
.ags-mobile-sidebar {
              
}


.headerBar{


}

.headerButton{
    -webkit-border-radius: .5em;
    -moz-border-radius: .5em;
    border-radius: .5em;
    font-size:10px;
    font-weight:bold;
    padding: 0.5em 0.5em 0.55em;
    text-decoration:none;
    text-align:center;
    cursor: pointer;

}


.leftButton{
    top:3px;
    left:5px;
    display:inline-block;
    position: absolute;
    vertical-align: middle;
}

#rightTools{
    top:3px;
    right:5px;
    display:inline-block;
    position: absolute;
    vertical-align: middle;
}

 .rightButton{
    position: relative;
    float:right;
    margin-right: 3px;
    cursor:pointer;
 }
  .submitButton{
    font-size: 100%;
    padding: 2px;
    cursor:pointer;
  }


.mobile .esriPopup .titleButton.maximize{
  display:none;
}
.mobile .esriPopup .titleButton.restore{

  display:none;
}
.mobile .esriPopup{
  z-index:99;
}

@-webkit-keyframes pulse{
    0% { opacity:1.0;}
    45% { opacity: .20;}
    100%{ opacity: :1.0;}

}
@-moz-keyframes pulse{
    0%{ opacity: 1.0;}
    45%{ opacity: .20;}
    100%{ opacity: 1.0;}
}
@keyframes pulse{
    0%{ opacity: 1.0;}
    45%{ opacity: .20;}
    100%{ opacity: 1.0;}

}
#map_graphics_layer{
    -webkit-animation-duration: 3s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-name: pulse;
    -moz-animation-iteration-count: infinite;
    -moz-animation-name: pulse;

}


 #headermenu 
      {
          position: absolute;
          top: 5px;
          right: 5px;
          text-align: right;
          font-size: x-small;
          color: White;
      }
      
      #headermenu a,#headermenu a:visited,#headermenu a:link {
	    color: white;
	    text-decoration: none;
      }
      
      #headermenu a:hover 
      {
          text-decoration: underline;          
      }
      
      #headermenu ul li
      {
          display: inline;
      }
      
      #headermenu ul li a {
	    color:White;
	    text-decoration: none;
      }
      
      #headermenu ul li a:hover 
      {
          text-decoration: underline;          
      }
      
      #toolMenu 
      {         	
         	font-size: x-small;
         	padding: 0px;
         	position: absolute;
         	top: 25px;
         	right: 3px;
      }
    
    #selectByFeatureTool 
    {
	    position:absolute; display:none;top:0px;left:0px;z-index:999; 
    }
     
 



.esriScalebar {

}


.esriScalebar > div {
    padding-top: 10px;
    padding-left: 10px;
    padding-right: 50px;
    background-color: whitesmoke;
}

    .ags-scalebar-container {
    position:absolute; 
    bottom: 30px; 
    left: 2px;
    }

      #disclaimer
      {
      	padding-left: 5px;
      	font-style:italic;   
      	font-size:x-small;   	
      }

      .map-disclaimer{
            position:absolute; 
            bottom: 2px; 
            right: 2px;
            background-color: whitesmoke;
            color: black;
            width: 150px;
            padding: 12px;
            z-index: 9999;
            border: 1px solid #000;
            font-size: 0.8em;
      }

      .map-disclaimer:hover{
            font-size: larger;
            width: 300px;
        }
         
       
       #results
       {
	       margin-bottom: 10px;	
       }


       
       .detail-toolmenu {
           padding: 7px;
       }
      
  /*.close {
    position: absolute;
    width: 24px;
    height: 24px;
    background-image: url(images/remove-24x24.png);
    cursor: pointer;
    z-index: 9999;
}*/
     
      


        

        
 
 




.dialog
{	
	position:absolute;
	-moz-border-radius: 10px;	
	background-color: White;
	border: solid 3px  #345641;
	z-index: 9999;
	padding: 20px;	
	color: black; 
}

 .button {
	font-size: 0.8em;
}

.button a, .button a:visited, .button a:active, .button a:link {
	        color: black;
        }

.panbutton 
{
    padding-left: 7px;
}

.esriPopup .sizer {
    width: 400px;
}


 .ui-autocomplete {
        max-height: 150px;
        overflow-y: auto;
        /* prevent horizontal scrollbar */
        overflow-x: hidden;
        z-index: 99999;
        
    }
    /* IE 6 doesn't support max-height
     * we use height instead, but this forces the menu to always be this tall
     */
    * html .ui-autocomplete {
        height: 150px;
    }
   
   
   
   
/*  The following Styles have to do with the grid view */
    
th 
{
background-color:Black;
color: White;
padding: 10px;
}
    
#details {
   color: Black;   
   font-size: x-small;
}


/* style for Result Listing */

.ags-result-header {

}

.ags-result-header img {
    height: 32px;
}

.ags-locator-text
{
    line-height: 34px;
}

.mobile .ags-result-header  img {
    height: 24px;
}


.ags-results-total {
    font-size: small;
    font-weight: bold;
    min-height: 20px;
    vertical-align:middle;
}

.ags-results-none {
    color: magenta;
    text-align: center;
    padding: 8px;
}


#resultList, #resultList table
{
   color: Black;
   font-size: x-small;	
}


.record, .record tr, .record td
{
	vertical-align:middle;
	background-color:White;

}

.r1, r1 td, .r1 tr
{
background-color: white;
color: #333333
}
      
.r2, .r2 td, .r2 tr
{
    background-color: #D5EAFF;
    color:  #333333
}
            
.highlight
{
    border: 2px solid #D5EAFF;
    background-color: #C0C0C0;
    color: #000;
}

.ags-results-record
 {
    padding: 5px;
 }

.ags-results-record:hover
 {
    border: 2px solid #D5EAFF;
    background-color: #C0C0C0;
    color: #000;
 }

.pad7 
{
  padding: 7px;
}

.bold
{
	font-weight: bold;	
}  

.centered
{
	text-align:center;
}

 


.idresult {
	font-size: x-small;	
}

.idlayerlabel 
{
    font-weight: bold;
}

.td1 
{
}


/* Toolbar Styling */
.tdHeader
{    
    font-weight: bolder;
    padding: 4px;
}


.imgOptions
{
    height: 18px;
    width: 18px;
    vertical-align: middle;
    padding: 0px 0px 0px 0px;
    cursor: pointer;
}

.imgOptions-small{
    height: 18px;
    width: 18px;
}

.imgOptions-medium {
    height: 27px;
    width: 27px;
}

.imgOptions-large{
    height: 36px;
    width: 36px;
}

.tdHighlight { 
    background-color: white;
	border: solid 1px  #A52A2A;   
}
.tdActiveTool 
{
  background-color: white;
  border: solid 1px  #A52A2A;
}


.right{
    text-align:right;
}


/*********************************/
/*  Panel sub menu tabs          */
/*********************************/
.inline-panel-tabs
{
	padding-bottom: 12px;
	font-size: x-small;	
}

ul.inline-panel-tabs
{
	margin:0pt;
	padding:5pt;
	text-align:left;
}

ul.inline-panel-tabs li
{	
	display: inline;
}

ul.inline-panel-tabs li a
{
	color: #345641;
	text-decoration:none;
	font-weight:bold;
}

ul.inline-panel-tabs li a:hover
{
	color:#A52A2A;
	text-decoration:underline;
	font-weight:bold;
}



.group
{
	padding: 3px;
	margin: 3px;
	background-color:#dfebf9;
	color: Black;
	font-size: 1em;
}

.viewer-content {
	background-color: white;
	color: black;
	padding: 7px;
	min-height: 300px;
}

.ags-panel {
    background-color: #fff;
    color: #333;
}

.ags-search-panel, .ags-search-buffer-panel  {
    padding: 7px;
    margin: 5px;
   
}

/* Search Link buttons */
.ags-search-control-link, .ags-search-control-tabs
{
	padding-bottom: 12px;
	font-size: x-small;	
}

ul.ags-search-control-tabs
{
	margin:0pt;
	padding:5pt;
	text-align:left;
}

ul.ags-search-control-tabs li
{	
	display: inline;
}

ul.ags-search-control-tabs li a
{
	color: #345641;
	text-decoration:none;
	font-weight:bold;
}

ul.ags-search-control-tabs li a:hover
{
	color:#A52A2A;
	text-decoration:underline;
	font-weight:bold;
}

.active.ags-search-control-link
{
    text-decoration:underline;
}


.ags-search-label
{
    font-weight: bold;
    padding: 3px;

}

.ags-search-error-label{
    color: red;
}


.ags-search-example
{
    font-weight: normal;
    font-style: italic;
    padding: 7px;

}


.ags-search-button {    
    text-align:right; 
      
}

.ags-search-control
{
    width: 100%;
}

.ags-search-control-small{
    width: 100px;
}


/* Table of Contents Control*/
.ags-toc-legend{
    margin-left: 25px;
    padding: 6px;
}

.toc-enabled {
    font:inherit;
}

.toc-disabled {
    font-style:italic;
    color:gray;
}

.toc-category-label {
    font-weight: bold;
}

/* styles for static Table of Contents*/
.toc-section-header {
    font-weight: bold;
}

/*.toc-folder-open {
    background-image: url(images/folderOpenState16.png);
    background-repeat: no-repeat;
    padding-left: 20px;
    line-height: 18px;
}

.toc-folder-closed {
    background-image: url(images/folder16.png);
    background-repeat: no-repeat;
    padding-left: 20px;
    line-height: 18px;
}*/

.toc-section {
    padding-left: 20px;
}

/*Exclusive Overlay Node Container for the whole control*/
.ags-toc-toggle-node-container
{
    background-color: gray;
    border: 1px solid #000;
       -webkit-border-radius: .5em;
    -moz-border-radius: .5em;
    border-radius: .5em;

}
/*Exclusive Overlay Node Container for the sub control*/
.ags-toc-toggle-node{

}





.ags-basemap-control {
    position:absolute; right:30px; top:10px; z-Index:30;
}
            
/* Tools that float on top of the map */
.ags-tool-container {
        z-index: 11;
        position:absolute;
                          
}
@media (min-width: 481px) {
    .ags-tool-container {
        top: 70px;
        right: 2px;
    }
}

@media (max-width: 480px) {

    .ags-tool-container {        
        top: 0px;
        right: 2px;
    }
}

.panel-help{
    padding: 10px;
    color: darkgray;
}

.ags-tool-rounded-container {
        background-color: #fff;   
        border: thin solid #45930b;
        border-radius: 10px;
        box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
        padding: 20px;
        transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
}

    .ags-measurement-tool{        
        display:none;        
        right:50px;
        z-index:99;    
    }

    .esriMeasurement{
        background-color: #fff;
        padding: 20px;
        border: thin solid #45930B;        
        border-radius: 10px;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
        -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
        transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    }

.measuresegment {
	font-size: small;
	color: Gray;
	font-style: italic;
}




.ags-draw-toolbar {
    min-width: 250px;
}

.ags-draw-editor{
    margin: 25px 5px 5px;
}

.ags-draw-edit-footer{
    text-align:center;
    align-content:center;
}

.dialog-search-form-group {
    padding: 5px;
    margin-left: 5px;
}


/*  Coordinate tool */
.ags-coord-tool-main{  

}

.ags-coord-tool-button {
    padding-left: 5px;
    padding-right: 5px;
}

.ags-coord-tool-settings{
    padding-top: 20px;
    font-size: smaller;
}




/* Print Dialog */
.ags-print-row
{
     height: 34px;   
}

.ags-print-label{
    font-weight: bold;
}

.ags-print-dialog-ui{
    font-size: small;
    padding: 7px;
}

.ags-print-panel {
    background-color: #eee;
    color: black;
    padding: 12px;
}

.form-control {
  display: block;
  width: 90%;
  height: 34px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.428571429;
  color: black;
  vertical-align: middle;
  background-color: #ffffff;
  background-image: none;
  border: 1px solid #cccccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
          transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

.form-label{
    width: 100px;
    display: inline-block;
}

.form-control-small{
    width: 100px;
}


.ags-mobile-panel{
    display: none;
}



#overviewmap{
    height: 275px;
    width: 275px;
    overflow:hidden;
    background-color: white;
    border: solid 1px black;
}

.no-close .ui-dialog-titlebar-close {
  display: none;
}




          * {
              box-sizing: border-box;
          }


          #main-loading {
              width: 100%;
              height: 100%;
              text-align: center;
              overflow: hidden;              
          }
          #main-loading{
	        background-color:#345641;
	        position:relative;
        }
        #main-loading #app-loading{
	        position: absolute;
	        background-repeat: no-repeat;
	        top: 50%;
	        left: 50%;
	        transform: translate(-50%, -50%);
        }
        #main-loading #loading-gif{
	        position: absolute;
	        background-image: url('images/predefined_loading_1.gif');
	        background-repeat: no-repeat;
	        width:58px;
	        height:58px;
	        top: 50%;
	        left: 50%;
	        transform: translate(-50%, -50%);
        }


              #main-loading #ie-note {
                  position: absolute;
                  top: 0;
                  bottom: 0;
                  left: 0;
                  right: 0;
                  margin: auto;
              }

              #main-loading #ie-note {
                  width: 586px;
                  height: 253px;
                  background-image: url('images/notes.png');
                  padding: 0 30px 40px 30px;
                  font-size: 14px;
                  color: #596679;
              }

          #ie-note .hint-title {
              height: 40px;
              line-height: 48px;
              text-align: left;
              font-weight: bold;
          }

          #ie-note .hint-img {
              background-image: url('images/hint.png');
              background-position: left;
              padding-left: 40px;
              margin-top: 20px;
              background-repeat: no-repeat;
              height: 30px;
              text-align: left;
              line-height: 30px;
              font-weight: bold;
          }

          #ie-note span {
              display: block;
              line-height: 14px;
          }





.ags-bootstrap-panel{
    position:fixed;
    top: 200px;
    right: 0px;
    width: 320px;     
    z-index: 1;   
}

.ags-bootstrap-panel > .panel-body
{     
     overflow:auto;
     height: 90%;
}

.ags-panel-layers
{    
    left: 150px;    
}

.ags-panel-details{
    left: 200px;
}





/*Toggle side panel*/
.divToggle {
    position: relative; 
    bottom: 60%;
    z-index: 99;
    left: -5px;
    width: 30px;
    height: 50px;
    z-index: 99;
    cursor: pointer;    
    background-repeat:no-repeat;
    margin-top: 30px;
    background-position:center center;  

}

.toggleExpand {
   background-image: url(images/arrow_choose.png); 
}

.toggleCollapse {
     background-image: url(images/arrow_choose_rtl.png);   
}


/*.toggleExpand {
    background-image: url(images/TabHandle.png);
    background-position: 28px 0px;         
    
   
}

.toggleCollapse {
    background-image: url(images/TabHandle.png);
    background-position: 0px 0px;    
}*/


.ui-icon-none {
    background-position: 64px 144px;    
}


.mobile-menu-button {
    background-image: url(images/mobile_menu.png);
    position: absolute; 
    top: 145px;   
    left: 22px;
    z-index: 99;
    -moz-user-select: none;
    background-color: #4c4c4c;            
    border: 1px solid #57585a;
    border-radius: 5px;
    color: #4c4c4c;
    background-position: center center;
    background-repeat: no-repeat;
    cursor: pointer;
    height: 30px;
    width: 30px;          
}





.map-disclaimer {
    border: 1px solid #004040;
    color: #004040;
    display: none;
}