body { display: flex;flex-direction: column; font-size: .9em;  position: relative; }

.Header {
    & .logo {
        img {max-width: 100%;margin: 11px 0;}
	}
}
.background-black{background: #1B427D ;}
.background-black *{ color:#FFF;}
.signup-block{position:relative;background: #1B427D ;}
.signup-block:before{content:'';position:absolute;z-index: 0;width:100%;height:100%;top:0;left:0; background-attachment:fixed;opacity:.1;}
.signup-block > p {position:relative;font-size:12px;color:#FFF;margin: 0 5px;}
.signup-block > p a{ color:#FFF;}
.signup-form-Block h2{color:#FFF;/* display: block; */clear: both;float: none;}
.signup-form-Block form{position:relative;display:block;width: 90%;clear: both;margin: 0 auto;}
.signup-form-Block form input{ margin:0;}
.signup-form-Block form input[type="text"]{ background:#FFF;}
.signup-form-Block form input[type="submit"]{position:absolute;right:0;top:0;height: 45px;}

/* ==================== layout==================== ================================================== */
#layout {position: relative;top: 0;left: 0;width: 100%;min-width: 100%;background: #FFFFFF;display: flex;min-height: 100vh;flex-direction: column;}
#wrapper {height: auto;width: 100%;margin: 0 auto;position: relative;height: auto;width: 100%;margin: 0 auto;position: relative;flex: 1 0 auto;}
.content-block {  padding: 25px 0; }
.subpageHeader-block {margin-top: 150px;text-align: justify;background: #00853E;position: relative;z-index: 2;overflow: hidden;}
.home-content-block {  border: 0;  padding: 50px 0; }
.subpage-block {  margin-top: 74px;  padding-top: 10px;  }
 
/* ==================== layout ==================== */
 
.subpageHeader-block{min-height: 100px;height: 440px;} 
.flwdth.pageheader .container {height: 100%;}
.subpageHeader-block.no-pageHeader {height:0;min-height: 50px;margin-top: 155px;}
.flwdth.pageheader {top: 0;height: 100%;background-blend-mode: screen;background-clip: border-box;background-color: rgba(0, 0, 0, 0);background-origin: padding-box;background-size: cover;position: relative;width: 100%;background-repeat: no-repeat;background-position: center center;}
.flwdth.pageheader:after {  content: "";  position: absolute;  z-index: 2;  left: 0;  bottom: 0;  width: 0;  height: 0;  border-left: 160px solid #ffffff;  border-top: 260px solid transparent;  border-bottom: 160px solid transparent;}
.flwdth.pageheader .image {position: relative;top:0;left:0;}
.flwdth.pageheader  .pageHeaderCaption {width:100%;height:100%;position: absolute;}
.flwdth.pageheader .overlay.Back_ { display:none;}
.flwdth.pageheader .Back_Black{display:block;position:absolute;width:100%;height:100%;background: url(/image/cache/overlay-pattern.png);opacity: .7;top:0;left:0;z-index:1;}
.flwdth.pageheader .Back_White{display:block; position:absolute; width:100%; height:100%; background: url(/image/cache/overlay-pattern_white.png); opacity: .7; top:0; left:0; z-index:1;}
.flwdth.pageheader .Back_Smooth.Black {display: block;position:absolute;width:100%;height:100%;background: ;opacity: .7;top:0;left:0;z-index:1;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0.65+0,0+49,0.65+100 */background: -moz-linear-gradient(top,  rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 49%, rgba(0,0,0,0.65) 100%); /* FF3.6-15 */background: -webkit-linear-gradient(top,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 49%,rgba(0,0,0,0.65) 100%); /* Chrome10-25,Safari5.1-6 */background: linear-gradient(to bottom,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0.3) 50%,rgba(0,0,0,0.65) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#a6000000',GradientType=0 ); /* IE6-9 */}
.flwdth.pageheader .Back_Smooth.White {display:block;position:absolute;width:100%;height:100%;opacity: .7;top:0;left:0;z-index:1;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&0.65+0,0+49,0.65+100 */
background: -moz-linear-gradient(top,  rgba(255,255,255,0.65) 0%, rgba(255,255,255,0) 49%, rgba(255,255,255,0.65) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,255,255,0.65) 0%,rgba(255,255,255,0) 49%,rgba(255,255,255,0.65) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,255,255,0.65) 0%,rgba(255,255,255,0) 49%,rgba(255,255,255,0.65) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6ffffff', endColorstr='#a6ffffff',GradientType=0 ); /* IE6-9 */
}

.flwdth.pageheader .Back_None{ display:none;}
.flwdth.pageheader .container {height: 100%;position: relative;}

.subpageHeader-block.noPageHeader{background:none;height:auto;margin: 0;min-height: 120px;font-size: 0;}

.pagetitle{width: 75%;/* text-align: center; */margin: auto;z-index: 10;position: absolute;top: 50%;transform: translateY(-50%);}
.pagetitle .titleShow {padding: 20px;color: #FFF;text-rendering: optimizelegibility;font-family: 'EB Garamond', serif;}
.pagetitle .titleShow p{font-size: 1.7em;margin: 0.3em 0;}
.pagetitle .titleShow h3{font-size: 3.35em;}
.pagetitle .titleShow.GreyBox{background: rgba(0, 0, 0, 0.25); border: 6px solid #777; }
.pagetitle .titleShow.WhiteBox{background: rgba(255, 255, 255, 0.25); border: 6px solid #FFF;}
.pagetitle .titleShow.BrownLine{background:none ; border-bottom: 2px solid #e29050; padding: 20px;padding-bottom: 0;margin-bottom: 20px;} 
.pagetitle .titleShow.BrownLine  * { color:#e29050;}
.pagetitle .titleShow.WhiteLine{background:none ;  padding: 20px;padding-bottom: 0;margin-bottom: 20px; color:#FFF;}
.pagetitle .titleShow.WhiteLine h2,.pagetitle .titleShow.BrownLine h2  { border-bottom: 2px solid #FFF; }  
.pagetitle .titleShow.WhiteLine * { color:#FFF;}
.pagetitle h1, .pagetitle h2, .pagetitle h3, .pagetitle h4, .pagetitle h5, .pagetitle h6 {color: #fff;margin: 0;padding: 0;}
.pagetitle h1 {font-size: 3.5em;padding: 0;margin: 0;text-transform: uppercase;font-weight: 600;color: #FFFF;}
.pagetitle.Top-Left {  top: 2%;  left: 0;  }
.pagetitle.Top-Center {top: calc(0px + 150px);left: 50%;-webkit-transform: translateY(-12%) translateX(-50%);-ms-transform: translateY(-12%) translateX(-50%);transform: translateY(-12%) translateX(-50%);}
.pagetitle.Top-Center * {  text-align: center !important;  }
.pagetitle.Top-Right {  top: 2%;  left: 100%;  -webkit-transform: translateY(-2%) translateX(-100%);  -ms-transform: translateY(-2%) translateX(-100%);  transform: translateY(-2%) translateX(-100%);  text-align: right !important;  }
.pagetitle.Top-Right * {  text-align: right !important;  }
.pagetitle.Middle-Left {  top: 50%;  left: 0%;  -webkit-transform: translateY(-50%);  -ms-transform: translateY(-50%);  transform: translateY(-50%);  display: block !important; }
.pagetitle.Middle-Center {top: 50%;left: 50%;-webkit-transform: translateY(-50%) translateX(-50%);-ms-transform: translateY(-50%) translateX(-50%);transform: translateY(-50%) translateX(-50%);}
.pagetitle.Middle-Center * {  text-align: center !important;  }
.pagetitle.Middle-Right {  top: 50%;  left: 100%;  -webkit-transform: translateY(-50%) translateX(-100%);  -ms-transform: translateY(-50%) translateX(-100%);  transform: translateY(-50%) translateX(-100%);  }
.pagetitle.Middle-Right * {  text-align: right !important;  }
.pagetitle.Bottom-Left {top: 90%;left: 0%;-webkit-transform: translateY(-100%);-ms-transform: translateY(-100%);transform: translateY(-100%);}
.pagetitle.Bottom-Center {  top: 100%;  left: 50%;  -webkit-transform: translateY(-100%) translateX(-50%);  -ms-transform: translateY(-100%) translateX(-50%);  transform: translateY(-100%) translateX(-50%);  }
.pagetitle.Bottom-Center * {/* text-align: center !important; */}
.pagetitle.Bottom-Right {top: 100%;left: 100%;-webkit-transform: translateY(-100%) translateX(-100%);-ms-transform: translateY(-100%) translateX(-100%);transform: translateY(-100%) translateX(-100%);}
.pagetitle.Bottom-Right * {  text-align: right !important;  }
 .Navigation__body, .HeaderMenu { height:100%;}

#downloadform .fieldrow{ margin-bottom:10px;}
#downloadform .fieldrow .date {margin: 10px 0;}

/* ====================Footer==================== ================================================== */
footer{
	& .address * { color:var(--text);}
     & .address{text-align: left;
        p{padding-left: 25px; word-break: break-all; 
          i{display:inline-block;margin-left: -25px; text-align:center; vertical-align:middle; width: 25px; color:var(--primary);}
        }
               
    }
	.iframe {min-height: 400px;}
	& .foot_form h2{color:var(--primary);}
}

/* ====================small size grid style declarations==================== ================================================== */
@media (min-width: 580px) {  
/* ==================== multi level footer menu ==================== ================================================== */
 
 }

@media (min-width: 640px) {  }

@media (min-width: 780px) {  
	.Navigation {transition: margin .5s ease;}
	.Navigation .container{/* width:98%; *//* max-width: none; */}
	body.subpage .Navigation {  margin-top: 0;  }

	/* ==================== webform styles ==================== ================================================== */
	.fieldrow .fieldval select {width: 80%;padding: 8px 5px;}
	.fieldrow .fieldval input {  width: 80%;  }
	.fieldrow .fieldval input[type=button], .fieldrow .fieldval input[type=reset], .fieldrow .fieldval input[type=submit], .fieldrow .fieldval .button, .fieldrow .fieldval input[type='radio'], .fieldrow .fieldval input[type='checkbox'] {  width: auto;  }
	.fieldrow .fieldval {  display: inline-block;  vertical-align: top;  width: 40%;  margin: 0;  text-align: left;  }
	.fieldrow .fieldlabel {  width: 30%;  min-width: 10%;  }
}
  
@media (min-width: 1200px) {  
   .Navigation .container{width: auto;max-width: 1140px;}
}

/* ==================== taoCMS Components and Modules ==================== ================================================== */
/* ==================== Image Slider ==================== ================================================== */
.slider-block .slider_block {position: relative;margin: 0; width: 100%;height: 100vh;overflow: hidden;}
#slides {  height: 100%;  position: absolute;  top: 0px;  width: 100%;  }

/* =============================================== ================================================== =============================================== ================================================== Custom Styles =============================================== ================================================== =============================================== ================================================== */
/*navigation */
.form-btn {  padding: 10px 10px;  cursor: pointer;  position: relative;  float: right;  text-align: center;  right: 0;  margin: 3px 0;  color: #fff;  }
.nav-icon a {  color: #3f3f41;  line-height: 75px;  display: block;  padding: 0 5px;  }
.nav-icon a:hover, .nav-icon.nav-collapsed a:hover {  text-decoration: none !important;  background: none !important;  color: #08364c !important;  }
.nav-icon {  float: right;  font-size: 30px;  line-height: 75px;  position: relative;  z-index: 99;  right: 0;  top: 0px;  margin: auto;  padding: 0 7px;  color: #08364c;  }
.nav-icon a:hover, .search-btn.search-on, .search-btn:hover {  background: #08364c;  color: #FBFBEA;  }
.nav-icon.nav-collapsed {  z-index: 102;  }
.nav-icon.nav-collapsed a {  color: #00853E !important;  }
.nav-icon.nav-collapsed a span:before {  content: "\f00d";  }

/* side navigation*/
.side-nav {  margin-top: 20px;  }
.side-nav ul{list-style:none; margin:0; padding:0;}
.side-nav ul li a {border-bottom: 1px solid #dddddd;font-size: .9em;color: #00853E;display: block;padding: 10px 10px;}
.side-nav ul li a:before{content:"\f0da";font-family: 'FontAwesome';display: inline-block;margin-right: 5px;}
.side-nav ul li: last-child a {  border: 0;  }
.side-nav ul li a:hover {color: #1B427D ;}

#slides:hover a.nextNav{right: 0;transition: all .5s ease;opacity:1;}
#slides:hover a.prevNav{left: 0px;transition: all .5s ease;opacity:1;}
 

/*board survey*/
table.individualrecord {min-width: 50%;margin: 5px 0;margin-bottom: 20px;}
table.individualrecord tr td, .recordtable tr td, .jdreventtable tr td, .jdreventtable tr th{ border:1px solid #DDD;padding:2px 5px; }

#toprecordrow {display:flex;flex-direction: row;justify-content: flex-start;align-items: center;align-content: space-around;margin: 15px 0;}
#toprecordrow a{display: block;padding: 7px 15px;border: 1px solid #00853e;}
#toprecordrow a:hover {background:#00853e; color:#fff;}

.recordtable {min-width:50%;}
p.offensetitle {font-weight:600; margin:0;}
ul.offenses {margin:0;padding:0;padding-left: 15px; margin-bottom:15px;}

p.offenselink a{ display:inline-block; padding:3px 8px ; border:1px solid #00853e;}
table.jdreventtable {min-width:50%;}

form table tr td{padding: 5px;}
form table tr td input[name*="date"] {width:calc(100% - 30px);}
p.errmsg ~ a{display:inline-block;margin: 10px 0;padding: 3px 10px;font-size:14px;border: 1px solid #013d7e;}

form#selectmode .fieldBlock{font-size:0;display: flex;flex-direction: row;align-items: flex-end;align-content: center;flex-wrap: nowrap;margin: 15px 0;}
form#selectmode .fieldrow{margin: 0 10px;min-width: 20%;}
form#selectmode .fieldrow label{ margin:0; text-transform:capitalize;}
form#selectmode .fieldrow input{ margin:0;}
form#selectmode .fieldrow.action label{display:none;}

form#selectmode .jdrhometop{ display:none;}
form#selectmode .fieldBlock.jdrhome {align-items: center;}
form#selectmode .fieldBlock.jdrhome .fieldrow {display:flex;align-items: center;min-width: auto;}
form#selectmode .fieldBlock.jdrhome .fieldrow input{ margin:0 5px;}
form#selectmode .fieldBlock.jdrhome .fieldrow.List.Records label{ display:none;}

form#downloadform input[name*='date']{width: calc(45% - 40px);margin: 0 5px;}


/* ====================mobile css ==================== ================================================== */
@media (min-width: 460px) {  }

@media (min-width: 580px) {  }

@media (min-width: 640px) {  }

@media (min-width: 780px) {  
	.subpage-content-block.page-content-block {  margin: 20px 0;  }
 
	.modal-dialog{ max-width:65%;}
}

@media (min-width: 991px) {  }

@media (min-width: 1200px) {  
	.logo {  margin-top: 0;  }
}

@media all and (min-width: 0px) and (max-width: 1199px) {  
	.sliderContent div.base div.caption p {  margin: 0;  line-height: 1.1em;  }
}

@media all and (min-width: 0px) and (max-width: 1080px) {  
 
}
@media all and (min-width: 0px) and (max-width: 992px) { 	
.Navigation .navbar-collapse {  display: none;  }
}
@media all and (min-width: 0px) and (max-width: 991px) { 
    .mobileTop {display:flex;width: 100%;flex-direction: row;justify-content: space-between;align-items: center;align-content: center;flex-wrap: nowrap;padding: 3px 0;} 
    .searchBlock{ margin:0;}
    .logoBlock {top: 0px;position: relative;}
	.Header.headBg{ border-bottom:3px solid #00853E;}
	.Header.headBg .logo img {max-width: 140px;}
	.Header .backbutton {height: 152px;transition: all .3s ease;} 
	.Header.headBg .backbutton {height: 118px;transition: all .3s ease;}
	.HeaderMenu>ul>li {  padding: 0 7px;  }
	.Navigation .navbar-collapse {  display: none;  }
	.subpageHeader-block.no-pageHeader {margin-top:140px;}
	.sliderContent div.base div.caption h1 {  font-size: 2.2em;  line-height: 1.4em;  font-weight: 600;  text-align: center;  margin: 0;  }
	.sliderContent div.base div.caption h2 {font-size: 5em;text-align: center;}
	.sliderContent div.base div.caption h3 {font-weight: 400;text-align: center;font-size: 20px;line-height: 18px;margin: 0;}
	.sliderContent div.base div.caption h4 {  font-weight: 400;  text-align: center;  font-size: 13px;  line-height: 16px;  margin: 0;  }

    #downloadform .fieldrow .fieldval, #downloadform .fieldrow .fieldlabel {width:50%; }
    #downloadform .fieldrow:nth-child(5){width:100%;text-align: left;}
}

 @media all and (min-width: 0px) and (max-width: 880px) {  
	.sliderContent div.base div.caption {  -webkit-transform: translateY(-50%) translateX(-100%);  -ms-transform: translateY(-50%) translateX(-100%);  transform: translateY(-50%) translateX(-100%);  left: 100%;  top: 50%;  float: none;  }
	.sliderContent div.base div.caption p {  line-height: 1.6em;  }
 }

@media all and (min-width: 0px) and (max-width: 779px) { 
    .searchBlock input[type=text] {width: 100%;}
    .Header .backbutton{height: 124px;}
    .Header.headBg .backbutton{ height:120px;}
    .subpageHeader-block.no-pageHeader { margin-top:120px;}
	.page-content-block {  margin-top: 20px;  padding-top: 0px;  }
	.logo img {max-width: 150px;}
	/* header */
	.nav-top {  margin-top: 0;  }
	.nav-top li a {  padding: 8px 6px !important;  }
	.header {  padding: 0px 0;  border: 0;  }
	.header > .container {  width: 98%;  }
	.logo {}
	.Header.headBg{padding: 0;}
	.Header.headBg .logo{margin: 0;}
	.Navigation .NavbarToggle {z-index: 1;display: block;float: right;margin: 0;height: auto;}
    .NavbarToggle i {padding:10px 0px;}
	.sliderContent div.base img {/* max-width: none; *//* top: 0; *//* left: 50%; *//* -webkit-transform: translateY(0%) translateX(-50%); */-ms-transform: translateY(0%) translateX(-50%);/* transform: translateY(0%) translateX(-50%); */}
	.sliderContent div.base div.caption h1 {  font-size: 2.2em;  line-height: 1.4em;  font-weight: 600;  text-align: center;  margin: 0;  }
	.sliderContent div.base div.caption h2 {/* font-size: 1.4em; */text-align: center;}
	.sliderContent div.base div.caption h3 {  font-weight: 400;  text-align: center;  font-size: 20px;  line-height: 18px;  margin: 0;  }
	.sliderContent div.base div.caption h4 {  font-weight: 400;  text-align: center;  font-size: 13px;  line-height: 16px;  margin: 0;  }
.sliderContent div.base.slShow div.caption.Top-Center {top:20%;left: 50%;-webkit-transform: translateY(-20%) translateX(-50%);-ms-transform: translateY(-20%) translateX(-50%);transform: translateY(-20%) translateX(-50%);}
	/* navigation */
	.nav-top ul {  margin: 0 !important;  }
	#main-navigation {  position: fixed;  overflow-y: auto;  width: 0;  height: 100%;  margin-bottom: 0;  z-index: 1;  left: 0;  top: 0;  background: #08364c;  display: none;  }
	#main-navigation.navbar-block {  display: block;  }

	/* ====================nav bar==================== ================================================== */
	.slider-block{padding-top: 80px;}
	.Competition .display-1{ font-size:4em;}
	.Header.headBg .logo, .logo{}
	.demoImage img{ max-height:400px;}

	footer .address { text-align:center;}
	footer .address img {/* display:block; *//* margin:0 auto; */}

    #gimage, #gcontent {float:none;width:100%;height: auto;margin: 0 auto;}
    #gcontent{margin:15px auto;width: 85%;}
    #gimage img {margin:auto !important;margin-top: 45px !important;width: auto !important;height: auto !important;max-width: calc(100% - 10px);}
    .reasons .reason span {height:auto;line-height: normal;}
    #downloadform .fieldrow .fieldval, #downloadform .fieldrow .fieldlabel { width:80%;}
    #downloadform .fieldrow .date {width:40%;}
}

@media all and (min-width: 0px) and (max-width: 639px) {  
	.nav-top {/* display: none; */}
	.top-phone {  float: right;  }
	.sliderContent div.base div.caption {  width: 100%;  min-width: 100%;  max-width: 100%;  transform: none; padding: 0;  left: 0;  top: auto;  background: none;  }
	#slides .sliderContent div.base .img {width: 100%;/* position: relative; */}
	.feature-bg-block h2 {  font-size: 8vw;  }
}

@media all and (min-width: 0px) and (max-width: 579px) {  
	.logo img, .Header.headBg .logo img {}
	.nav-icon a, .nav-icon {  line-height: 74px;  }
	.sliderContent div.base div.caption h1 {  font-size: 1.8em;  }
	.sliderContent div.base div.caption h2 {  font-size: 1.4em;  line-height: 1.4em;  }
	.sliderContent div.base div.caption h3 {  font-size: 1.2em;  border: 0;  margin: 0;  padding: 0;  }
	.sliderContent div.base div.caption h4 {  font-size: 1.0em;  line-height: 1.2em;  }
	.sliderContent div.base div.caption h5 {  font-size: .84em;  line-height: 1.18em;  }
	.home-content-block, .page-content-block.news-block, .feature-blocks {  padding: 30px 0;  }
	 .subpage-content-block.page-content-block {  margin-top: 129px;  }
	#socail li {  margin: 0 2px;  }
	.sliderContent div.base div h2.display-1{font-size: 4em;font-weight:900;}
}

@media (max-width: 460px) and (min-width: 0px) {  
	.nav-top {  position: relative;  text-align: right;  }
	.Header .topNav ul li a{padding: 3px;}
    .searchBlock input[type=text] {width: 160px;}	
	#socail > span {  display: inline-block;  vertical-align: middle; font-size: 11px;  }
	#socail li a:after {  font-size: 20px;  margin: 2px;  }
	.Competition .block-text { font-size:2em;}
	.Competition .display-1{ font-size:3em;}
	.subpageHeader-block {margin-top: 0;height: 320px;}
	    #downloadform .fieldrow .fieldval, #downloadform .fieldrow .fieldlabel { width:100%;}
    #downloadform .fieldrow .date {width: 100%;} 
}

@media all and (min-width: 0px) and (max-width: 380px) {  
    .Header .backbutton {height: 148px;}
    .Header.headBg .backbutton {height: 143px;}
    .searchBlock form { float:none;}
    .searchBlock input[type=text]{ width:100%;} 
    .backbutton{height: 148px;}    
    .Header .topNav ul {text-align:center;}
    .Header .topNav ul li a { padding:0 3px;}
    .mobileTop { display:block;}
	.slider_block { min-height: 100% !important;  }
	.logo { max-width:100%;}
	.logo a {  letter-spacing: 0px;  }
	.logo img {}
	.logo .tag {  letter-spacing: 1px;  font-size: 15.5px;  }
	.search-btn, .nav-icon {  margin: 0 5px;  padding: 0;  }
	.footer-nav > ul > li {  display: block;  width: auto;  }
	.Header.headBg .logo, .logo{}
	.logoBlock span{font-size: 2.2em;}
	.NavbarToggle{height: 54px;}
	.slider-block{/* padding-top:54px; */}
	.sliderContent div.base div h2{font-size: 1.8em;}
	.sliderContent div.base div h2.display-1{ font-size:2.4em;}
}

@media all and (orientation: landscape) and (min-height: 100px) and (max-height: 540px) {  
  .sliderContent div.base div {}
  #gimage img {margin:0 !important;padding: 0;}
}