html, body {
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0px;
    font-family: helvetica, arial, sans-serif;
    font-size: 90%;
}

button, input[type="button"]{
    cursor: pointer;
}

#leftPane {
    width: 20%;
    overflow: auto
}

#scaleDiv .agsTOCOutOfScale {
    display: none;
}

.esriSimpleSliderIncrementButton, .esriSimpleSliderDecrementButton {
    display: none;
}

#maptable {
    height: 100%;
}

#map_root > div.esriPopup.esriPopupVisible > div.esriPopupWrapper > div:nth-child(3) > div > div > a > span {
    display: none;
}

#map_root > div.esriPopup.esriPopupVisible > div.esriPopupWrapper > div:nth-child(1) > div > div.title {
    background-color: #0066FF;
}

#map_root > div.esriPopup.esriPopupVisible > div.esriPopupWrapper {
    background-color:#FFFFFF;
    border: 1px solid #D8D8D8;
    /*box-shadow: 3px 3px 5px #888888;*/
    padding:2px;
}

#map{
    position: absolute;
    height: 88%;
    width: 98%;

}

.esriMapContainer{
    min-height: 450px;
    overflow-y: auto;
}


.test{
    border-radius: 3px;
    background-color: rgb(248, 152, 56) !important;
    background-image: url('../images/content-bg-test.jpg');
}
.prod{
    background-color: #256a9c !important;
    background-image: url('../images/content-bg.jpg');
}

#mainlabel {

    background-repeat: no-repeat;
    background-position: center top;
}

#transport{
    background-image: url(../images/TasGovtLogo.jpg);
    background-size: 110px 36px;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center top;

}


#infoPane {
    background-color:#E6F3FF;
    border: 3px solid #D8D8D8;
    padding:2px;
}
.esriPopup .titlePane{
    background-color:#0066FF;
}

.esriPopup .printPane{
    background-color:#0066FF;
}

.dijitTooltipContainer {
    background-color: #FFFF99;
}

#map_zoom_slider {
    position: absolute;
    top: 6.4em;
    left: 2.625em;
    z-index: 50;
}

#sliderWrapper {
    /*position:absolute;*/
    /*right: 200px;*/
    /*bottom:20px;*/
    /*z-Index: 40;*/
    /*width: 250px;*/
    /*height: 40px;*/
    /*background: #fff;*/
    /*-moz-box-shadow: 0 0 5px #888;*/
    /*-webkit-box-shadow: 0 0 5px #888;*/
    /*box-shadow: 0 0 5px #888;*/
}

#sliderLabels {
    /*position: relative;*/
    /*top: -1px;*/
    /*height: 1.0em;*/
    /*font-size: 80%;*/
    /*font-weight: bold;*/
    /*font-family: arial;*/
    /*color: #444;*/
    /*padding: 3px;*/
    /*margin: 5px 10px 0 10px;*/
}

/*.dijitSliderButtonContainerV{*/
/*    padding: 0px !important;*/
/*}*/
/*.dijitRuleContainerV {*/
/*    height: 100%;*/
/*    left: -6px;*/
/*    line-height: 0;*/
/*    float: left;*/
/*    text-align: left;*/
/*}*/

#version {
    font-size:12px;
    font-style: italic;
}

b {
    margin-right: 5px;
}

#contentDiv {
    background-color:#FFFFFF;
    border: 1px solid #D8D8D8;
    box-shadow: 3px 3px 5px #888888;
    padding:2px;
}

#legend {
    position:absolute;
    right: 21px;
    bottom: 78px;
    border: 4px solid #BBBBBB;
    border-style: groove;;
    z-index: 99;
}
@-moz-document url-prefix() {
    #legend {
        bottom: 82px;
    }
}

#search {
    display: block;
    position: absolute;
    z-index: 3;
  top: 20px;
    left: 63px;
}


#buttons{
    position:absolute;
    right:26px;
	top:20px;
    width: 188px;
    z-Index:1;
}
.mapButtons {
    width : 170px;
}


.tinyButton{
    font-size: 90%;
}

#listmapButton{
}
#googleMapButton{
}

.selLbl{
    float: left;
    text-align: right;
    width: 150px;
    padding-right: 7px;
}

.errorText{
    color: orangered;
    display: block;
    /*font-size: 1.2em;*/
    /*font-weight: bold;*/
}

.warnText{
    color: rgba(240, 130, 3, 0.9);
}

.infoText{
    color: rgba(40, 40, 40, 0.9);
    left: 15%;
    position: relative;
    font-weight: bold;
}

#titlePane{
    padding-top: 4px;
    padding-left:3px;
    padding-bottom: 8px;
}

#printPane{
    padding-top: 4px;
    padding-left:3px;
}


.dijitButtonNode  {
    width:170px;
}

.dijitArrowButton  {
    width:16px;
}


.dijitButton{
    margin: 0.3em;
}
.dijitButtonNode {
    border: 1px solid #759dc0;
    padding: 2px 4px 4px 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
    background-color: #bcd8f4;
    background-repeat: no-repeat;
    _background-image: none;
}

div.dijitButtonText, .dijitArrowNode,
.dijitTitlePaneTextNode{
    color: white;
}

div.dijitTitlePane .dijitTitlePaneTitle {
    opacity: 0.6;
    background-color: #256a9c;
    color: white;
    background-image: none;
    background-repeat: no-repeat;
    _background-image: none;
    border: 1px solid lightgray;
    padding: 0;
    min-height: 17px;
    color: #494949;
    width: 200px;
}

.claro .dijitComboButton .dijitButtonNode{
    opacity: 1;
    border: 1px solid #759dc0;
    padding: 2px 4px 4px 4px;
    color: white;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
    background-color: #06548C;
    /* background-image: url("form/images/buttonEnabled.png"); */
    background-repeat: no-repeat;
    background-image: none;
    _background-image: none;
}

.dijitComboButton:hover .dijitButtonNode:hover,
.dijitComboButton:focus .dijitButtonNode:focus,
div.dijitTitlePaneTitle:hover, div.dijitTitlePaneTitle:focus{
    opacity: 1.0;
}

#links{
    position:absolute;
    right:26px;
    bottom:20px;
    width: 190px;
    z-Index:1;
}
#fmdiv{
    z-index: 1;
    height: 110px;
    border-radius: 4px;
    background-color: white;
    width: 224px;
    position: relative;
    right: -4px !important;
    padding: 5px 5px 0 5px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

.esriAttribution{
    position: fixed;
    left: 19px;
    bottom: 18px;

}

.esriScalebar {
    position: absolute;
    left:20px;
    bottom:55px;
}

#dijit_Dialog_0{
    width: 530px;
    height: 630px !important;
}

h3{
    text-align: left;
    position: relative;
    font-size: 1.12em;
}

ul{
    align-content: center;
    float: left;
    -webkit-margin-before: 0px;
    -webkit-padding-start: 1px;
    padding-bottom: 2px;
    margin-bottom: 20px;
}

ul.names li{
    float: left;
    margin: 0 10px 0 1px;
    padding: 2px;
    list-style: none;
    font-size: 13px;
    font-family: sans-serif;
}

li.vt{
    position: relative;
    left: 30%;
}

input, select,
a, .dijitTitlePane{
    font-size: 13px;
    font-family: Helvetica, Arial, sans-serif;
    font-weight: normal;
    -webkit-border-radius: 4px !important;
    -moz-border-radius: 4px !important;
    border-radius: 4px !important;
}
.numberEntry{
    width: 126px;
}

.mapButton {
    opacity: 0.6;
}
.mapButton:hover,
.mapButton:focus{
    opacity: 0.9;
}

span.esriButton, .esriMeasurementSeparator {
    float: left;
}

.esriMeasurement .esriToggleButton .dijitButtonNode {
    width: 112px;
}

span#dijit_form_DropDownButton_0 {
    float: left;
    left: 50px;
    text-align: left;
    position: absolute;
}

#dijit_layout_ContentPane_0{
    margin: 1%;
}
div#dijit_layout_ContentPane_1 {
    text-align: center;
}

.dijitButtonNode {
    background-color: #efefef;
}

.dijitTitlePane{
    width: 202px;
    height: auto;
    text-align: center;
}

.dijitTitlePaneTitle {
    -webkit-border-radius: 4px !important;
    -moz-border-radius: 4px !important;
    border-radius: 4px !important;
}
.dijitDialogPaneActionBar {
    text-align: center !important;
    background-color: rgba(24, 95, 179, 0.13) !important;
    margin: 0 !important;
    padding: 0px 8px !important;
}

.aboutBox{
    width: 450px !important;
    height: 348px !important;
}

.aboutBox, .loadLimitDialog{
    -webkit-border-radius: 6px !important;
    -moz-border-radius: 6px !important;
    border-radius: 6px !important;
}

.aboutBoxContent {
    height: 340px;
}
.loadLimitDialog {
    width: 550px !important;
}
.feedback{
    bottom: 5px;
    position: static;
}

select{
    width:300px;
    font-size:12px;
}

fieldset{
    border: none;
    margin: 0.1em;
    margin-left: 0.6em;
}

#loadingImg{
    position:absolute;
    right:48%;
    top:48%;
    z-index:100;
}

#rightPane{
    margin: 0.3em;
    padding: 0px;
    background-color: rgba(181, 188, 199, 0.4);
    color: #421b14;
    width: 199px !important;
    margin-top: 2px;
}

table.esriPrintButton {
    width: 100%;
}

#cbl1, #cbl2,
#cbl3, #cbrw, #cbrl{
    color: rgb(40, 40, 40);
    /*visibility: hidden;*/
    float: left;
    text-align: right;
    width: 150px;
    padding-right: 7px;
}

a{
    border: #b5bcc7 none;
    border-width: 1px;
    margin: 10px;
    margin-bottom: 20px;
    padding-bottom: 5px;
    color: #565656;
    text-decoration: none;
    -webkit-border-radius: 4px !important;
    -moz-border-radius: 4px !important;
    border-radius: 4px !important;
    vertical-align: middle;
}

a:hover {
    text-decoration: underline;
}

.invalid{
    -webkit-animation: errorPulse 1.5s infinite ease-in-out;
    animation: errorPulse 1.5s infinite ease-in-out;
}
.dijitDialog{
    width: 860px;
    -webkit-border-radius: 6px !important;
    -moz-border-radius: 6px !important;
    border-radius: 6px !important;
}

.dijitDialogPaneContent{
    overflow-y: auto;
}

.dijitDialogPaneActionBar {
    align-items: center;
}

.dialogFooter{
    position: relative;
    bottom: 0px;
    height: 30px;
    margin-bottom: 4px;
    width: 94%;
    clear: both;
}

h3{
    font-size: 14px;
    font-weight: bold;
}

h5, h3{
    text-align: justify;
    font-size:0.83em;
    font-weight:bold;
    margin-bottom: 0.1em;
    margin-top: 1em;
}
h5#nonight{
    color: #c40000;
}
h5#night {
    color: darkgreen;
}
.updateText{
    color: blue;
}

select:focus,
select:focus{
    -webkit-animation: pulse 1.5s infinite ease-in-out;
    animation: pulse 1.5s infinite ease-in-out;
}

.claro .dijitDialogPaneContent {
    height: 583px;
}

.dijitComboButton {
    margin: 0;
}

#transport {
    width: 103px;
    text-align: center;
    border: none rgb(160,160,160) 1px;
    padding: 5px 4px;
    height: 40px;
    position: fixed;
    top: 5px;
}
td.colhdr, td.coldta{
    line-height: 1.5em;
}

.col1{
    width: 100%;
    font-size: 14px;
}

.col2{
    -moz-column-width: 220px;
    -webkit-column-width: 220px;
    column-width: 220px;
    width: 15%;
    font-size: 10px;
    float:right;
    position: fixed;
    left: 72%;
    line-height: 1.1em;
}

.col3{
    vertical-align: middle;
    width:12%;
    position: fixed;
    left: 90%;
    top: 70px;
}
.col3 .coldta{
    /*display: none;*/
}

.about{
    text-indent:8px;
    font-size:12px;
}
#dsg{
    font-size: 1.2em;
    font-weight: bold;
    color: white;
}
.ssg, .ssglink {
    font-size: 11px;
    font-weight: normal;
    color: white;
}
.ssglink{
    font-weight: bold;
    text-decoration: none;
    border-image-source: initial;
    border-image-slice: initial;
    border-image-width: initial;
    border-image-outset: initial;
    border-image-repeat: initial;
    color: white;
    /*border: gray solid 1px;*/
    /*background-color: buttonface;*/
    border-radius: 4px !important;
    /*-webkit-appearance: button;*/
    /*-moz-appearance: button;*/
    /*apperance: button;*/
    vertical-align: middle;
    height: 18px;
    margin-left: 2px;
}

.ssglink:hover{
    text-decoration: underline;
}

.logo{
    width:96px;
    height:35px;
    border-radius: 4px !important;
    position: fixed;
    top: 25px;
}
img.ssglink{
    height: 16px;
    width: 16px;
}

.button{
    background-color: #256a9c; /* blue */
    color: white;
    border: solid 1px lightgray;
    padding: 1px 4px;
    text-align: center;
    margin: 4px 4px 4px;
    text-decoration: none;
    display: inline-block;
    font-size: 13px;
    font-weight: normal;
    opacity: 0.6;
    -webkit-border-radius: 4px !important;
    -moz-border-radius: 4px !important;
    border-radius: 4px !important;
    width: 200px;
}

.button:hover,
.button:focus{
    opacity: 1.0;
}

.button1{
    background-color: #256a9c; /* blue */
    color: white;
    border: solid 1px lightgray;
    padding: 1px 4px;
    text-align: center;
    margin: 4px 5px;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    font-weight: normal;
    opacity: 1.0;
    -webkit-border-radius: 4px !important;
    -moz-border-radius: 4px !important;
    border-radius: 4px !important;
    width: 158px;
}

.button1:disabled{
    background-color: rgba(96, 96, 111, 0.58);
}

#aboutButton{
    width: 100px;
}

select.normal {
    width: 170px;
    /*     opacity:0.6; */
}
select.normal:focus{
    opacity: 1.0;
}

#clearanceToggle{
    background-color: #256a9c;
    color: white;
    background-image: url(../images/ClearanceExclaim2t.png);
    background-repeat: no-repeat;
    background-size: 14px;
}

#road-width {
    text-indent: 8px;
    font-size: 18px;
    font-weight: bold;
    color: white;
}

#mapTitle{
    font-weight: bold;
    color: white;
    padding: 12px;
}

#roadWorksToggle{
    display: inline-block;
    display: inline-block;
    background-color: #F9830B;
    color: black;
    font-weight: bold;
    font-size: 0.96em;
}

select.normal {
    width: 130px;
}

/* The Close Button */
.closer {
    color: #d3d3d3;
    float: right;
    font-size: 28px;
    font-weight: bold;
    opacity: 1.0;
    margin: 0px 4px 0 4px;
    position: relative;
    bottom: 6px;
}

.closer:hover,
.closer:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
}

div.esriPopupWrapper .content .contentPane{
    max-height:320px;
    height:100%;
}
.contentPane{
    overflow-y: auto;
}

div.esriViewPopup .mainSection div div{
    padding-bottom: 100%;
}

.print{
    display:none;
}

.warn{
    -webkit-animation: warnPulse 1.5s infinite ease-in-out;
    animation: warnPulse 1.5s infinite ease-in-out;
}

.fa{
    color: #ffffff;
    float: left;
    padding-left: 50px;
}

.daytime{
    background-color: white;
    color: #333;
}

.nighttime{
    background-color: #1b5379 !important;
    color: #f5bb35 !important;
}

.daytime-title {
    background-color: white;
    color: #333;
    background-image: url('../images/content-bg.jpg');
}

.nighttime-title {
    background-color: #1b5379 !important;;
    color: #f5bb35 !important;
    background-image: none !important;
}

.daytime-header{
    background-color: #256a9c;
    color: #fff;
}

.nighttime-header{
    background-color: #f56835  !important;
    color: #1b5379 !important;
}

p.infoTxt {
    line-height: 8px;
    text-align: left;
    margin-left: 36px;
}

.arcgisSearch {
    display: block;
    top: 3.25em;
    left: 5.625em;
    position: absolute;
    height: 3.75em;
    width: auto;
    font-size: 1em;
    line-height: 1.25em;
    z-index: 3;
}

#ui-home-button{
    display: block;
    position: absolute;
    top: 3.4em;
    left: 2.625em;
    z-index: inherit;
}

.arcgisSearch .searchGroup {
    font-family: HelveticaNeue-Light, Roboto, Helvetica, Arial, san-serif;
    line-height: 22px;
    font-size: 1.1875em;
}

@-webkit-keyframes pulse {
    0% {
        box-shadow: 0 0 12px rgba(51, 204, 255, 0.2);
    }
    50% {
        box-shadow: 0 0 12px rgba(51, 204, 255, 0.9);
    }
    100% {
        box-shadow: 0 0 12px rgba(51, 204, 255, 0.2);
    }
}

@keyframes pulse {
    0% {
        box-shadow: 0 0 12px rgba(51, 204, 255, 0.2);
    }
    50% {
        box-shadow: 0 0 12px rgba(51, 204, 255, 0.9);
    }
    100% {
        box-shadow: 0 0 12px rgba(51, 204, 255, 0.2);
    }
}

@-webkit-keyframes errorPulse {
    0% {
        box-shadow: 0 0 12px rgba(240, 0, 40, 0.2);
    }
    50% {
        box-shadow: 0 0 12px rgba(240, 0, 40, 0.9);
    }
    100% {
        box-shadow: 0 0 12px rgba(240, 0, 40, 0.2);
    }
}
@media only screen and (min-width: 668px) and (orientation: landscape) {
    #mainlabel {
        height: 100px;
        overflow: hidden;
    }
}

@keyframes errorPulse {
    0% {
        box-shadow: 0 0 12px rgba(240, 0, 40, 0.2);
    }
    50% {
        box-shadow: 0 0 12px rgba(240, 0, 40, 0.9);
    }
    100% {
        box-shadow: 0 0 12px rgba(240, 0, 40, 0.2);
    }
}

@-webkit-keyframes warnPulse {
    0% {
        box-shadow: 0 0 12px rgba(240, 130, 3, 0.2);
    }
    50% {
        box-shadow: 0 0 12px rgba(240, 130, 3, 0.9);
    }
    100% {
        box-shadow: 0 0 12px rgba(240, 130, 3, 0.2);
    }
}

@keyframes warnPulse {
    0% {
        box-shadow: 0 0 12px rgba(240, 130, 3, 0.2);
    }
    50% {
        box-shadow: 0 0 12px rgba(240, 130, 3, 0.9);
    }
    100% {
        box-shadow: 0 0 12px rgba(240, 130, 3, 0.2);
    }
}