/*	This is the master css of the website where all css code should go.
        NOTE: If you are using individual css for each page this should only contain the items you want to be constant throughout the website.
*/

@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,400italic,700,700italic|Amaranth&subset=latin,latin-ext);
@import url('https://fonts.googleapis.com/css?family=Montserrat&display=swap');
@import url('https://fonts.googleapis.com/css?family=Anton&display=swap');
body{font-family: 'Open Sans', sans-serif; font-size:1em; padding: 0px; margin:0px; width:100%; color:#111111;}
img{border:0px; max-width:100%; height:auto !important;}
img[src*="gstatic.com/"], img[src*="googleapis.com/"] {max-width: none;}
a:link, a:visited{text-decoration:none; color:#2121aa;}
a:hover, a:active{text-decoration:none; color:#6b21aa;}
h1, h2, h3, h4, h5, h6, .title, .boxtitle, .boxtitledefault{margin-bottom:5px;font-family: 'Montserrat', sans-serif; color: #025563;}
.title, .boxtitle, .boxtitledefault{font-size:2.5em;}

h1{font-size: 2em; margin: 0 !important; }
h2{font-size: 2em;}
h3{font-size: 1.4em;}
h4{font-size: 1.2em; color:#0d7993; max-width: 800px;margin: 40px auto 20px; text-align: center;}

/*#keywords{font-size: 2em; color: #0d2d6d; font-size: 1.7em; color: #0d2d6d; margin: -19px 0 0 150px; text-align: center;}*/

#container{width:100%; margin:0; padding:0;}
#header{width:100%; margin: 10px auto 0; padding:0; display: flex; justify-content: center; align-items: center;}
#hdrShape{height: 62px; }
#hdrShape img{max-width: 112px !important; background: #fff;}

#hdrImg{height: 126px; background:url('/styles/stylesets/202001vserve/images/titleBg.jpg') center top no-repeat; margin: -92px auto 0;}

#header #hdrLogo{margin: 0; margin: 0;}
#header #hdrLogo #logoText{vertical-align: middle; padding: 0;}
#header #hdrLogo #logoText a:link, #header #hdrLogo #logoText a:visited{text-decoration:none; color:#025563; font-size: 3.4em;margin: 10px 40px 10px 0; display: block; text-align: center; font-family: 'Anton', sans-serif;text-transform: uppercase;}
#header #hdrLogo #logoText a:hover, #header #hdrLogo #logoText a:active{text-decoration:none; color:#025563;}

#logoImg{z-index: 1; position: relative; }
#logoImg a{display: block;}
#header #hdrLogo #logoBg{max-width: 100%; padding:5px; margin:10px 5px;border-radius: 3px;}
#header #hdrInfo #keyBg{max-width: 100%; font-size: 1.5em;margin:10px 5px;}

#header #hdrWrap{width: 45%; margin: -108px 0 0 -48px;}
#hdrDetails{display: flex; justify-content: center;}

#header #hdrInfo{vertical-align: middle; padding: 0px 0 0 80px; border-top: 3px solid #fff;}
#header #hdrInfo #detailBg{max-width: 100%;font-size: 1em;margin:10px 5px;}
#header #hdrInfo #detailBg>ul{padding:0;margin:0;}
#header #hdrInfo #detailBg>ul>li{display:inline-block;list-style: none;margin:0;padding:0;}
#header #hdrInfo #detailBg>ul>li>a:link,#header #hdrInfo #detailBg>ul>li>a:visited{display: block;padding:0px 15px; margin:0; color:#ffffff;}
#header #hdrInfo #detailBg>ul>li>a:hover,#header #hdrInfo #detailBg>ul>li>a:active{color:#ffffff;}
#header #hdrInfo #detailBg>ul>li>a>span{display:inline-block;vertical-align: middle;height: 30px;line-height: 30px;padding:0px 2px;}
#header #hdrInfo #detailBg.mobile>ul>li>a>.detailTxt{display:none;}

#header #navBar{font-family: 'Montserrat', sans-serif;padding: 0 0 0 96px;font-size:1.2em; background: #0d7993; height: 62px; width: 75%;}
#header #navBar.mobile{height:50px; overflow:hidden; padding-right: 0; width: 100%;}
#header #navBar.mobile #navWrap>ul{height: auto;}
#header #navBar.mobile #navWrap>ul>li{height: auto;}
#header #navBar #navWrap{margin:auto;}
#header #navBar .navIcon{display:none;}
#header #navBar.mobile .navIcon{display:inline-block; line-height:50px;height:50px;vertical-align: middle;padding:0px 20px;transition:0.2s linear;color:#fff;cursor:pointer;font-size:1.5em;}
#header #navBar.mobile .navIcon:hover{background:rgba(255,255,255,0.3)}
#header #navBar.mobile #navWrap>ul{padding: 47px 10px 0 10px;}
#header #navBar #navWrap>ul{display:block;margin:0;padding:0;text-align: center; height: 62px;}
#header #navBar #navWrap>ul>li{display:inline-block;list-style: none;margin:0;padding:0; height: 62px;}
#header #navBar.mobile #navWrap>ul>li{display:block;text-align: left;}
#header #navBar #navWrap>ul>li>a:link, #header #navBar #navWrap>ul>li>a:visited{display:inline-block;line-height:50px;height:50px;vertical-align: middle;padding:0px 15px;transition:0.2s linear;color:#fff; margin: 6px 2px; border-radius: 5px;}
#header #navBar #navWrap>ul>li>a:hover{background:#ffffff; color: #025563;}

#header #navBar.mobile #navWrap>ul>li>ul{border: none;}
#header #navBar.mobile #navWrap>ul>li>ul>li>a:link, #header #navBar.mobile #navWrap>ul>li>ul>li>a:visited{display:inline-block;border-radius: 5px;}
#header #navBar #navWrap>ul>li>ul{display:none;margin: 0;padding:0;text-align: left;position: absolute;background:#0d7993; z-index: 1000; border-radius: 0 0 5px 5px; border: 1px solid #ffffff; border-top: none;}
#header #navBar.mobile #navWrap>ul>li>ul{display:block;padding:0;position: relative;font-size:0.9em;}
#header #navBar #navWrap>ul>li>ul>li{display:inline-block;list-style: none;margin:0;padding:0;}
#header #navBar #navWrap>ul>li>ul>li{display:block;text-align: left;}
#header #navBar #navWrap>ul>li>ul>li>a:link, #header #navBar #navWrap>ul>li>ul>li>a:visited{display:block;line-height:50px;height:50px;vertical-align: middle;padding:0px 20px;transition:0.2s linear;color:#fff; margin: 5px; }
#header #navBar #navWrap>ul>li>ul>li>a:hover{background:#ffffff; color: #025563; border-radius: 5px;}

.secBox1{padding: 0px 20px 0px 20px; display: flex; justify-content: center; align-items: center;}
.secBox2{margin:auto;padding: 40px 0 30px 0;}
/*.secBox2{margin:auto;padding: 0px 0 30px 0;}*/
.secBox3{padding: 30px 0 30px 0; margin: 20px auto 0;}
.secBox1 .textBox, .secBox2 .textBox, .textBox{ max-width: 1200px; margin: 0 auto; text-align: justify; position: relative; }

#line{margin: 20px 0 30px -14px;}
#lineRight{margin: 10px 0 10px 0; text-align: right;}

#upArrowWrap{z-index: 1001; margin: 10px 0 0 -25px; right: 10px; position: fixed;bottom: 55px; display: none; font-family: 'Montserrat', sans-serif; }
#upArrowWrap>a:link, #upArrowWrap>a:visited{text-decoration: none; display:inline-block; font-size: 1.6em; color: #ffffff !important; background: #696d75 !important;  transition: ease-in 0.3s; border-radius: 200px; line-height: 1.3em; height: 1.5em; padding: 5px 10px 5px 10px; border: 2px solid #fff;  }
#upArrowWrap>a:hover, #upArrowWrap>a:active{color: #0d7993 !important; background: #ffffff !important;text-decoration: none;border: 2px solid #025563;  }


#back-arrow{max-width:1200px;margin: 0 auto 40px;text-align: left;position: relative; }
.arrow{display: inline-block; vertical-align: middle;font-size: 1.2em; margin: 0 5px;}
.backtext{display: inline-block; vertical-align: middle; font-size: 1.1em;}
#back-arrow>a:link, #back-arrow>a:visited{display:block;  color: #0d7993;transition: ease-in 0.3s; padding: 0px 20px; line-height: 1.5em; height: 1.5em;   }
#back-arrow>a:hover, #back-arrow>a:active{ color: #696d75;}


#quicklinks{background:#efefef; border:1px solid #cfcfcf;}
#quicklinks ul, #quicklinks li{list-style:none; display:inline;}
#contentmask{width:100%; height:100%; margin:auto;}
#contentbox{max-width:100%;margin: auto; padding: 0;}
#sidebar{max-width:100%;margin:0 auto;}
#footer{width:100%;margin:0; padding:0;background:#025563;color:#fff;}
#footer a:link, #footer a:visited{text-decoration:none; color:#fff;}
#footer a:hover, #footer a:active{text-decoration:underline; color:#ddd;}
#footer #copytext{text-align:center; line-height:2em; min-height:3em; font-size:0.8em;padding: 20px 10px;}

#fb{margin: auto; text-align: center; padding: 20px 0 0 0;}

.photogallery .fancybox{border:none !important;background:none !important;border-radius:0 !important;box-shadow:none !important;padding:0 !important;margin: 5px !important;opacity:1;transition:0.4s ease-in-out;}
.photogallery .fancybox:hover{opacity:0.6;}

.fancybox-opened .fancybox-skin{box-shadow:none !important;}
.fancybox-skin{background:none !important;}
.fancybox-outer{box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5) !important;}

.clearboth{clear:both;}
.list_row1{padding:5px;border-bottom:1px solid rgba(0,0,0,0.1); background-color:rgba(200,200,200,0.1); border-top:1px solid rgba(0,0,0,0.1);transition: 0.3s ease-in-out;}
.list_row2{padding:5px;background-color:rgba(250,250,250,0.1);transition: 0.3s ease-in-out;}
.highlight, .list_row1:hover, .list_row2:hover{background-color:rgba(255,255,255,0.9);}
form{ background: rgba(150,150,150, 0.25); border: solid 1px rgba(50,50,50, 0.2); margin:2px;padding:5px;border-radius:2px;}
.buttons{display:inline-block;padding:4px 2px 4px;font-size:1em;line-height:1.5em;color:#303030;text-align:left;text-shadow:0 1px 1px rgba(255, 255, 255, 0.75);background-color:#fefefe;border:1px solid #a0a0a0;border-bottom-color:#505050;border-radius:2px;box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.2),0 1px 2px rgba(0, 0, 0, 0.05);margin:1px;}
.buttons:hover{box-shadow:0 0 4px #808080;background-color:#e0e0e0; background:linear-gradient(#e0e0e0, #e0e0e0 25%, #fefefe);}
input[type="text"]{cursor:text;}
input[type="submit"]{cursor:pointer;}
input[type="reset"]{cursor:pointer;}
input[type="checkbox"]{cursor:pointer;}
textarea{cursor:text;}
select{cursor:pointer;}

@media screen and (max-width:1600px){
    #header #hdrWrap{width: 50%; margin: -100px 0 0 -40px;}
    
}

@media screen and (max-width:1400px){
    #header #navBar{font-size: 1.1em !important;}
    #header #navBar #navWrap > ul > li > a:link, #header #navBar #navWrap > ul > li > a:visited{padding: 0px 10px;}
    
}

@media screen and (max-width:1300px){
    #header #hdrWrap{width: 65%;}
    #header #navBar #navWrap>ul>li>a:link, #header #navBar #navWrap>ul>li>a:visited{padding: 0px 10px;}
    
}

@media screen and (max-width:1200px){
    .secBox1 .textBox, .secBox2 .textBox{margin: 0 20px 0 20px;}
    h1{font-size: 1.8em; }
    
}

@media screen and (max-width:1100px){
    
    
}

@media screen and (max-width:1000px){
    #map-canvas{ width: 90% !important; margin:0 !important;}
    .secBox1 .textBox, .secBox2 .textBox{text-align: left;}
    #line{margin: 20px 0 30px -217px;}
    #header #hdrWrap{width: 75%;}
    #logoImg{width: 255px;}
    #header #hdrLogo #logoText a:link, #header #hdrLogo #logoText a:visited{margin: 15px 40px 5px 0;}
}

@media screen and (max-width:900px){
    #header #navBar{font-size: 1em;padding: 0 0 0 71px;}
    #header #hdrLogo #logoText a:link, #header #hdrLogo #logoText a:visited{font-size: 2.5em;}
    #header #hdrWrap{margin: -90px 0 0 -40px;}
    .secBox1 .textBox, .secBox2 .textBox, .textBox{text-align: left; }
}

@media screen and (max-width:800px){
    #header #navBar{padding: 0 0 0 79px; font-size: 0.9em;}
    #header #navBar #navWrap > ul > li > a:link, #header #navBar #navWrap > ul > li > a:visited{padding: 0px 5px;}
    #ddb_left_column{float:none !important;width:auto !important;}
    #ddb_right_column{float:none !important;width:auto !important;}
    #header #navBar{padding: 0; text-align: center;}
    #header #hdrLogo #logoText a:link, #header #hdrLogo #logoText a:visited{font-size: 2em}
    #header #hdrWrap{margin: -72px 0 0 -40px;}
    #logoImg{width: 200px;}
    
    h2{font-size: 1.6em;}
    h3{font-size: 1.2em;}
    #lineRight{margin: 10px auto 10px; text-align: right; width: 80%;}
    .secBox2{padding: 20px 0 20px 0;}
}

@media screen and (max-width:700px){
    #header{justify-content: flex-start; align-items: flex-start; margin: 20px auto 0;}
    #hdrShape{margin-left: -42px;}
    #hdrShape img{height: 50px !important;}
    #header #hdrWrap{margin: -25px 0 0 -110px; width: 100%;}
    #logoImg{margin: 0 0 0 5px;}
    #header #hdrWrap{width: 100%;}
    #hdrDetails{margin: 0 20px 0 0;}
    .secBox2{padding: 10px 0;}
    
}

@media screen and (max-width:600px){
    #map-canvas{ width: 80% !important; margin:0 !important;}
    h4{font-size: 1.1em;margin: 30px auto 20px; text-align: left;}
    #header{margin: 30px auto 0;}
    #logoImg{width: 150px;}
    #header #hdrWrap{margin: -38px 0 40px -110px;}
    #header #hdrLogo #logoText a:link, #header #hdrLogo #logoText a:visited{margin: 15px 0 5px 0;}
    #header #navBar.mobile .navIcon{margin: 0 0 0 50px;}
    #header #navBar.mobile #navWrap > ul{padding: 30px 10px 0 10px;}
/*    #header{margin: 30px auto 10px;}
    #logoImg{width: 150px;}
    #header #navBar.mobile{height: 62px;}
    #hdrShape img{max-width: 113px !important;}
    #header #navBar.mobile .navIcon{line-height: 50px; height: 50px;}
    #header #hdrWrap{margin: -61px 0 0 -40px;}
    
    #header #hdrLogo{margin: -19px 0 10px 10px;}
    #header #hdrLogo #logoText{padding: 0;}
    #header #hdrLogo #logoText a:link, #header #hdrLogo #logoText a:visited{font-size: 1.7em;}
    #logoImg{width: 66px; position: absolute; top: 5px; left: 10px;}*/
}

@media screen and (max-width:500px){
     h1{font-size: 1.6em;}
     #contentbox{margin: auto;}
     #header #hdrWrap{margin: -26px 0 40px -110px;}
     #header #hdrLogo #logoText a:link, #header #hdrLogo #logoText a:visited{font-size: 1.5em;}
     #back-arrow{margin: 10px auto 30px;}
     #footer #copytext{padding: 20px 10px 70px;}
     #upArrowWrap{bottom: 70px;}
     
/*   
     #hdrShape{display: none;}
     #header #hdrWrap{margin: 0; width: 100%;}
     #header #navBar{width: 100%;}
     #contentmask{margin: 0;}*/
     
}

@media screen and (max-width:400px){
    #header{margin: 40px auto 0;}
    #header #hdrWrap{margin: -39px 0 40px -110px;}
    #header #navBar.mobile{width: 80%; margin: 0 0 0 10px;}
    #hdrDetails{margin: 0 10px 0 0;}
    #logoImg{width: 120px;}
    #header #hdrLogo #logoText a:link, #header #hdrLogo #logoText a:visited{margin: 15px 0 10px 0;}
    
}

@media screen and (max-width:360px){
}