@charset "utf-8";
/* CSS Document */

/* -------------------- General Styles --------------------*/

body {
  margin: 0 auto;
  padding:0px;
  color: #000000;
  font-family: Arial, Verdana, Helvetica, sans-serif;
  height: 100%;
  background-color: #f6f6f6;
}

.clearfix:after {
  content: " ";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}
 
.clearfix {
  display: inline-block;
}
 
html[xmlns] .clearfix {
  display: block;
}
 
* html .clearfix {
  height: 1%;
}

ul li {
 margin: 0 0 .5em 0; 
}

h1 {
  font-size: 1.8em;
  color: #2c4677;
  margin: 0 0 .75em 0em;
}

h2 {
  font-size: 1.6em;
  color: #2c4677;
  margin: 0 0 .75em 0em;
}

h3 {
  font-size: 1.4em;
  color: #2c4677;
  margin: 0 0 .75em 0em;
}

h4 {
  font-size: 1.2em;
  color: #2c4677;
  margin: 0 0 .75em 0em;
}

h5 {
  font-size: 1em;
  color: #2c4677;
  margin: 0;
}

h6 {
  font-size: .9em;
  color: #000;
  margin: 0;
}

/* -------------------- Hidden H1 for assistive technology --------------------*/

.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
}

/* restyle an old style */
.headtext2 {
  font-size: 1.6em;
  color: #2c4677;
  margin: 0 0 .75em .2em;
}

.headtext3 {
  font-size: 1.4em;
  color: #2c4677;
  margin: 0 0 .75em .2em;
}

/* -------------------- Skip nav for assistive technology --------------------*/

#skip a
{ 
position:absolute; 
left:-10000px; 
top:auto; 
width:1px; 
height:1px; 
overflow:hidden;
} 
 
#skip a:focus 
{ 
position:static; 
left: 0;
width:auto; 
height:auto;
overflow: visible; 
color: #00f;
background-color: #fff;
}

.skip a
{ 
position:absolute; 
left:-10000px; 
top:auto; 
width:1px; 
height:1px; 
overflow:hidden;
} 
 
.skip a:focus 
{ 
position:static; 
left: 0;
width:auto; 
height:auto;
overflow: visible; 
color: #00f;
background-color: #fff;
}

/* -------------------- Calendar of events --------------------*/

#userdata {
  list-style-type: none;
  padding: 0;
}

#userdata li {
  /*padding: 20px 0;*/
  border-bottom: 1px solid #ccc;
  width: 97%;
  display: table;
  margin-left: 5px;
}

.eventtile {
  margin-left: 75px;
  font-family: Georgia, serif;
  font-size: 20px;
  display: table-cell;
}

/* - fancy dates -*/

.eventdate {
  padding: 0 0 50px 0;
  position: relative;
  width: 70px;
  font-family: Georgia, serif;
  /*color: #999;*/
  color: #000;
  margin: 0;
  display: table-cell;
 }
 
.eventdate abbr[title] {
  border-bottom: none !important;
  cursor: inherit !important;
  text-decoration: none !important;
}
 
.eventday, .eventmonth, .eventyear {
  position: absolute;
}
 
.eventday { 
  font-size: 30px;
  top: 15px;
}
 
.eventmonth { 
  top: 0;
  left: 0;  
  font-size: 18px;
}
 
.eventyear { 
  display: inline-block;
  margin-top: -4px;
  top: 19px;
  right: 0;
  font-size: 20px;
  transform: rotate(-90deg); !important;
  /* ** Hacks ** */
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);  
}

.eventbutton {
  position: absolute;
  right: 1.5em;
  margin-top: -.5em;
}

.eventbutton a {
  background: #0062df;
  border-radius: 10px;
}

.eventbutton a:hover {
  background: #0272a7;
  color: #eee;
}

.breadcrumb {
 font-weight: normal;
 font-size: 12px;
 text-decoration: none;
 color: #000;
 margin: 5px 0 10px 0;
}

.portalnav {
  margin: .5em auto;
  background-color: #eee;
  padding: .5em 0;
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  width: 50%;
}

.boxmain {
  margin: 0;
  padding: .1em;
  border: 1px solid #ccc;
  border-radius: 10px;
  width: 95%;
}

p.boxmainp {
	margin: 0 auto; 
	text-align: center;
	}

.boxmain img {
  margin: 0 auto;	
}

a.boxmain {
  font-size: 1.5em;
  font-weight: bold;
  text-decoration: none;
  margin-top: 0;
}

a:hover.boxmain {
  background-color: #eee;
}

.blue2 {
  border: 3px solid #2a3a91;
}

.orange2 {
  border: 3px solid #f8931d;
}

.green2 {
  border: 3px solid #066839;
}

/* -------------------- Standard Links --------------------*/

a {
  color: #00a; 
  text-decoration: underline;
  /*outline: none;*/
}

a:hover {
  color: #923; 
}

a.img_fade:hover {
  opacity: 0.5;
  filter: alpha(opacity=50); /* For IE8 and earlier */
}

a.img_fade75:hover {
  opacity: 0.75;
  filter: alpha(opacity=75); /* For IE8 and earlier */
}

/* -------------------- Main Wrapper --------------------*/

.wrapper {
  width: 100%;
  max-width: 1000px;
  margin: 0 auto; 
  background-color: #fff;
  -webkit-box-shadow: 10px 10px 20px 0px rgba(0,0,0,0.75);
  -moz-box-shadow: 10px 10px 20px 0px rgba(0,0,0,0.75);
  box-shadow: 10px 10px 20px 0px rgba(0,0,0,0.75);
}

#header {
  padding: 1%;
  background: #fff;
  margin: 0 0 1em 0;
}

/* -------------------- Image styles --------------------*/

.megamenu img {
  max-width: 100%;
  height: auto;
  border:none;
}

img.img_left {
  float: left;
  margin-right: 4px;
}

img.img_right {
  float: right;
  margin-left: 4px;
}
 
.img_shadow {
  background:#FFFFFF;
  padding:4px;
  border:1px solid #777777;
  margin-top:5px;
  -moz-box-shadow:0px 0px 5px #666666;
  -webkit-box-shadow:0px 0px 5px #666666;
  box-shadow:0px 0px 5px #666666;
}

/* -------------------- Search form top --------------------*/

.search {
  font-size: .75em;
  line-height: 1.5em;
  padding: 0;
  text-align: right;
  float: right;
  min-height: 110px; /* accomodate google translate form */
}

.search button {
  background-color: #003399 !important;
}

.search .float {
  float: right;
}

.search a:link, .search a:active, .search a:visited {
  text-decoration: none;
}

.search .button {
  background: #0272a7;
}

.search .button a:hover {
  background: #013953;
}

#qtlabel {
  display: none;
}

#qplegend {
  display: none;
}

/* -------------------- A to Z List --------------------*/

#atoz {
  margin: 0 auto;
  /*margin-bottom: -1em;*/
  text-align:center;
  /*color: #8899AA;*/
  color: #000;
  font-weight: bold;
  font-face: verdana;
  font-size: .9em;
  clear: both;
}

#atoz a {
  /*color: #8899AA;*/
  color: #000;
  margin: 0 .25em;
  text-decoration:none;
}

#atoz a:hover {
  /*color: #000;*/
  color: #8899AA;
}

/* -------------------- Menu --------------------*/

.custom-wrapper {
  margin: 1em 0;
  clear: both;
  font-size: 1.2em;
  -webkit-font-smoothing: antialiased;
  height: 1.7em;
  overflow: hidden;
  -webkit-transition: height 0.5s;
  -moz-transition: height 0.5s;
  -ms-transition: height 0.5s;
  transition: height 0.5s;
}
.custom-wrapper.open {
  height: 15em;
}
.custom-menu-3 {
  text-align: right;
}
.custom-toggle {
  width: 34px;
  height: 34px;
  display: block;
  position: relative;
  top: 0;
  right: 0;
  display: none;
}
.custom-toggle .bar {
  background-color: #fff;
  display: block;
  width: 20px;
  height: 2px;
  border-radius: 100px;
  position: absolute;
  top: 18px;
  right: 7px;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  transition: all 0.5s;
}
.custom-toggle .bar:first-child {
  -webkit-transform: translateY(-6px);
  -moz-transform: translateY(-6px);
  -ms-transform: translateY(-6px);
  transform: translateY(-6px);
}
.custom-toggle.x .bar {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
.custom-toggle.x .bar:first-child {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
@media (max-width: 47.999em) {
  .custom-menu-3 {
      text-align: left;
  }
  .custom-toggle {
      display: block;
  }
}

.menu-custom {
    /* Fallback (could use .jpg/.png alternatively) */
  background-color: #003399;

  /* SVG fallback for IE 9 (could be data URI, or could use filter) */
/*  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc5MDIiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjEwMCUiIHkyPSIxMDAlIj4KPHN0b3Agc3RvcC1jb2xvcj0iIzAyNzJBNyIgb2Zmc2V0PSIwIi8+PHN0b3Agc3RvcC1jb2xvcj0iIzAxMzk1MyIgb2Zmc2V0PSIxIi8+CjwvbGluZWFyR3JhZGllbnQ+CjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzkwMikiIC8+Cjwvc3ZnPg==); */

  /* Safari 4, Chrome 1-9, iOS 3.2-4.3, Android 2.1-3.0 */
/*  background-image:
    -webkit-gradient(linear, top, from(#0272a7), to(#013953));*/
  
  /* Safari 5.1, iOS 5.0-6.1, Chrome 10-25, Android 4.0-4.3 */
/*  background-image:
    -webkit-linear-gradient(top, #0272a7, #013953);*/

  /* Firefox 3.6 - 15 */
/*  background-image:
    -moz-linear-gradient(top, #0272a7, #013953);*/

  /* Opera 11.1 - 12 */
/*  background-image:
    -o-linear-gradient(top, #0272a7, #013953);*/

  /* Opera 15+, Chrome 25+, IE 10+, Firefox 16+, Safari 6.1+, iOS 7+, Android 4.4+ */
<!--  background-image:
    linear-gradient(to bottom, #0272a7, #013953);-->
}

.menu-custom a { 
  color: #fff;
  padding-top: 5px;
}

.menu-custom a:hover, 
.menu-custom a.active,
/*.menu-custom a.focus*/
.menu-custom > a:hover, 
.menu-custom > a.active,
/*.menu-custom > a.focus,*/
.menu-custom li:hover,
/*.menu-custom li:focus,*/
.menu-custom li:active, 
.menu-custom > li:hover,
/*.menu-custom > li:focus, */
.menu-custom > li.active {
/*  background: #0272a7;
  -webkit-box-shadow:inset 0px 3px 6px rgba(0,0,0,0.2);
  -moz-box-shadow:inset 0px 3px 6px rgba(0,0,0,0.2);
  box-shadow:inset 0px 3px 6px rgba(0,0,0,0.2);*/
  background-color: #2765D0;
}

.custom-pure-menu-active > .custom-pure-menu-link,
.custom-pure-menu-link:hover,
.custom-pure-menu-link:focus {
    /*background-color: #0272a7;*/
	/*background-color: #8899aa;*/
	background-color: #2765D0; 

		
}

/* -------------------- Home Page Header --------------------*/

.homehead {
	background-image: url(../images/index/HomePic100.jpg);
	background-repeat: no-repeat;
	width: 100%;
	margin-top: -1.2em;
	padding: 1em;
}

.homehead p {
	width:20%;
	margin: 1em 0;
	padding: 0;
	background-color: #003399;
}

/* -------------------- Slider --------------------*/

.slider {
  margin: 0;
  padding:0;
  z-index: 5;
}

.slider h4 {
  color: #221100;
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 1.4em;
  margin: 1em 0 .1em 0;
  letter-spacing: .18em;
}

.slider a:hover img {
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
  filter: alpha(opacity=70);
  opacity:0.7;
  -webkit-transition: opacity 0.3s ease-in-out; 
  -moz-transition: opacity 0.3s ease-in-out; 
  -o-transition: opacity 0.3s ease-in-out; 
  -ms-transition: opacity 0.3s ease-in-out; 
  transition: opacity 0.3s ease-in-out;  
}

/* -------------------- News --------------------*/

.news {
  margin: .5em 1em 0 1em;
}

.news .date {
  font-weight: bold;
}

.news li {
  display: block;
  list-style: none;
  list-style-position: outside;
  border-bottom: 1px dotted #8899AA;
  color: #000;
  padding: .25em 0;
}

.news li a {
  text-decoration: none;
}

#doenews {	
  margin:0;
  padding:0;
}

.news h3 {
  font-family: "Times New Roman", Times, serif;
  font-weight: bold;
  font-size: 2em;
  letter-spacing: .25em;
  margin-bottom: 0;
  border-bottom: 1px solid #000;
}

/* -------------------- Contact Section --------------------*/

.contact {
  margin: 2em 0 0 0;
  font-size: 1.25em;
}

.contact img {
  vertical-align: middle;
  margin-right: .1em; 
}

.contact li {
  margin: 2em 0 0 0;
  display: block;
  list-style: none;
  list-style-position: outside;
  color: #000;
  padding: 0;
}

.contact li a {
  text-decoration: none;
}

.contact-hor {
  width: 100%;
  margin: 1em 0;
  font-size: 1em;
  text-align: center;
}

.contact-hor ul {
  margin: 0;
  padding: 0;
}

.contact-hor img {
  vertical-align: middle;
  margin-right: .1em; 
}

.contact-hor li {
  display: inline;
  list-style: none;
  list-style-position: outside;
  color: #000;
  padding: .25em 0;
  margin: .25em 1.25em;
  white-space: nowrap;
}

.contact-hor li:first-child {
  margin: 0;
}

.contact-hor li a {
  text-decoration: none;
}

/*contact links for secondary pages */

.contact-hor-sec {
  width: 100%;
  margin: 1em 0;
  font-size: 1.25em;
  text-align: center;
}

.contact-hor-sec ul {
  margin: 0;
  padding: 0;
}

.contact-hor-sec img {
  vertical-align: middle;
  margin-right: .1em; 
}

.contact-hor-sec li {
  display: inline;
  list-style: none;
  list-style-position: outside;
  color: #000;
  padding: .25em 0;
  margin: .25em 5em;
  white-space: nowrap;
}

.contact-hor-sec li:first-child {
  margin: 0;
}

.contact-hor-sec li a {
  text-decoration: none;
}

/* -------------------- Constituents box --------------------*/

a.constituents {
	font-weight: bold;
	font-size: 1.5em;
	letter-spacing: 2px;
	text-align: center;
	background-color: #003399;
	padding: .5em 0;
	width: 99%;
	margin-top: -3px;
	text-decoration: none;
	color: #fff;
	display: block;
	border-bottom: 5px solid #fff;
}

a.constituents:hover {
	text-decoration: none;
	background-color: #8899aa;
	/*color: #05486e;*/
}

/* -------------------- Services box --------------------*/

.landing-section2 {
	padding: 20px;
	text-align: center;
}

.landing-section2 > div {
	border: 1px solid #357ca3;
	/*padding: 20px;*/
	position: relative;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	z-index: 0;
	min-height: 170px;
}

.landing-section2 h3 {
	/*color: white;*/
	margin: 50px 20px 0 20px;
}

.landing-section2 p {
	/*color: white;*/
	margin: 1em 20px 20px 20px;
}

.landing-section2 .landing-icon {
  color: #0062df;
  background: #fff;
  z-index: 1000;
  position: absolute;
  padding-left: 10px;
  padding-right: 10px;
  top: -35px;
  right: 0;
  bottom: 0;
  width: 70px;
  left: 0;
  height: 50px;
  margin: 0 auto;
}

.landing-section2 a {
  font-weight: bold;
  font-size: 1em;
  color: #003399;
}

.landing-section2 a:hover {
  color: #923;
}


/* -------------------- Social box --------------------*/

.social {
  margin: 1em 0 5em 0;
  padding: 0 1em;
/*  border-top: 1px solid #aaa;
  background-color: #eee;*/
}

.social h3 {
  border-bottom: 1px solid #999;
  color: #000;
  font-size: 1.25em;
  width: 95%;
}

.fb-container {
  position: relative;
  /*padding-bottom: 56.25%;*/
  padding-top: 35px;
  height: 500px;
  overflow: hidden;
}

.fb-iframe {
  position: absolute;
  top:0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* -------------------- Commissioner box --------------------*/

.commbox {
/*  width: 100px;
  margin: .5em auto; 
  border: 1px solid #ccc; 
  padding: .5em;
  border-radius: 7px;
  box-shadow: 3px 3px 1px #888888;
  background-color: #fff;
  font-size: .8em;*/
  font-weight: bold;
  text-align:center;
}

.commbox a {
  text-decoration: none;
  color: #003399;
}


/* -------------------- Features --------------------*/

.features {
 font-size: .8em;
 font-weight:bold;
 line-height: 1.25em;
 text-align: center;
 vertical-align: middle;
 margin: 0 0 0 3em;
}

.features img {
  margin: 0 0 .35em 0;
  vertical-align: middle;
}

.features img.displayed {
  display: block;
  margin-left: auto;
  margin-right: auto 
}

.features a {
 text-decoration: none; 
}


/* --------------------Highlights --------------------*/

.highlights_buttons {
  margin: 1em 0 0 0;
  text-align: center;	
}

.highlights_buttons img{
  margin: .25em auto;	
}

ul.highlights {
  text-align: left;
  clear: both;
  margin: 1em;
  padding: 0;
  border: 1px solid #bbb;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  -khtml-border-radius: 10px;
  border-radius: 10px;
  -moz-box-shadow: 3px 3px #888;
  -webkit-box-shadow: 3px 3px #888;
  box-shadow: 3px 3px #888;
  behavior: url(/education/scripts/PIE.htc);
}


ul.highlights li {
  display: block;
  clear: both;
  list-style: none;
  list-style-position: outside;
  color: #000;
  margin: .25em 0;
  padding: .25em 0;
  border-bottom: 1px dotted #bbb;
}

ul.highlights li:last-child {
  border-bottom: none;
}

ul.highlights li a {
  display: block;
  text-decoration: none;
  padding: 0;
  height: 50px;
  font-weight: bold;
  font-size: 1em;
}

ul.highlights li a img {
  float: left;
  margin: 0 .5em 0 .1em;
  vertical-align: middle;
}

ul.highlights li .tagline {
  font-style: italic;
  color: #000;
  font-weight: normal;
  font-size: .9em;
  margin-top: 1.5em;
}

/* -------------------- Footer --------------------*/

.footer {
  background-color: #3D474C;
  color: #fff;
  font-size: .9em;
  padding: .1em .5em 4em .5em;
  clear: both;
}

.searchbot {
  font-size: .85em;
  padding: 0px;
  text-align: right;
  margin: 1em 0;
  float: right;
}

.footer a:link, .footer a:active, .footer a:visited {
  text-decoration: none;
  margin-right: 2px;
  color: #fff;
}

.footer a:hover {
  color: #8899AA;
}

.botline {
   border-bottom: 1px solid #8899AA;
   width: 90%;
   text-align: center;
   margin: 1em auto;
}

.botline_dash {
   border-bottom: 1px dashed #8899AA;
   width: 90%;
   text-align: center;
   margin: 0 auto;
}

/* -------------------- SEONDARY PAGES --------------------*/

#atoz_page h5 {
  color: #2c4677;
  font-size: 3em;
  border: 1px solid #8899AA;
  width: 1.5em;
  text-align: center;
  padding: .3em;
  margin: .5em 0.1em 0;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px;
  -khtml-border-radius: 15px;
  border-radius: 15px;
 behavior: url(/education/scripts/PIE.htc);
}

#data_page h5 {
	color: #000;
	font-size: 1em;
	font-weight: bold;
	border-bottom: dotted 1px #000;
	width: 90%;
	margin-bottom: 0;
}

#data_page ul {
	margin-top: .5em;
}

.image_shrink {
  display: block;
  /*margin-right: 1em;*/
}

.image_shrink img {
  width: 100%;
}

/* -------------------- Secondary Page News Toc List --------------------*/

/*#doenews {
	margin: 0;
	padding: 0;
}

#doenewstable {
  list-style: none;
  margin:0 0 0 .75em;
  padding: 0;
}

#doenewstable span.date {
	display: block;
    float: left;
    width: 65px;
    text-align: right;
	margin-right: .25em;
	color: #2c4677;
	font-weight: bold;
}

#doenewstable a {
    display: block;
    float: left;
    padding-bottom: 1em;
}

#doenewstable li {
    clear: both;
	margin-top: 5px;
}*/

#doenews {
	margin: 0;
	padding: 0;
}

#doenewstable {
  list-style: none;
  margin: 0 0 0 .75em;
  padding: 0;
}

#doenewstable span.date {
    display: block;
    float: left;
    /*width: 65px;*/
	width: 11%;
    text-align: right;
	margin-right: 8px;
	color: #2c4677;
	font-weight: bold;
}

#doenewstable a {
    display: block;
    float: right;
    /*width: 885px;*/
	width: 87%;
    padding-bottom: 10px
}

#doenewstable li {
    clear: both;
	margin-bottom: 1em;
}

/* -------------------- Press Release Heading --------------------*/

.newssub_title {

	font-size: 20px;
	color: #70102c;
	/*float: left;*/
	font-weight: bold;
	margin: 0;
	/*width: 655px;*/
	padding-top: 0px;
	padding-right: 0;
	padding-bottom: 15px;
	padding-left: 0;
}

/* -------------------- Home link --------------------*/

.homelink {
 font-weight: normal;
 font-size: .7em;
 text-decoration: none;
}

/* -------------------- Add padding for content --------------------*/

.mainpad {
  padding: .5em;
}

/* -------------------- table padding for content --------------------*/

td {
  padding: .25em;
}

table.tableshade tr:nth-child(even) {background: #eee}
table.tableshade tr:nth-child(odd) {background: #fff}


/* -------------------- covid 19 pandemic --------------------*/

#covid {
    text-align: center;

}