@charset "utf-8";

body {font: 12px/1.4 Arial, Helvetica, sans-serif; margin: 0; padding: 0; background: #fff;}
.smallfont {font: 11px/13px Arial, Helvetica, sans-serif; margin: 0; padding: 0;}

a:link { text-decoration: underline; color: #069; }
a:visited { text-decoration: none; color: #069; }
a:hover { text-decoration: underline; color: #069; }
a:active{ text-decoration: underline; color: #069; }

.fakelink, .fakelinkform {text-decoration: underline; color: #069; cursor:pointer;}
.fakelinkform {font: 12px/16px Verdana, Arial, Helvetica, sans-serif;}
/* simulates a link in .dmvform. example <li><span class="fakelink" onclick="someFunction">Link Text</span></li> */

.clear, .clearftr { clear:both; height:1px; font:1px/1px monospace; }
.clearftr { background-color: #1f1f1f; }
.overflowhidden {overflow:hidden;} /*use in a container when .clear causes problems */

.accordion, .accordion-header {
  background-color: #f2faff;
  color: #444;
  padding: 18px;
  /* width: 100%; 100% needed for <p>, not headings */
  border: 1px solid #777;
  text-align: left;
  outline: none;
  font-size: 15px;
  margin-top:0.5em;
  font-weight: bold;
}

.accordion {
cursor: pointer;
transition: 0.4s;
}

p.accordion {width: 100%;}

.active, .accordion:hover {
  background-color: #b2e2ff;
}

.accordion:after {
  content: '\002B'; /* plus sign */
  color: #777;
  font-weight: bold;
  float: right;
  margin-left: 5px;
}

.active:after {
  content: "\2212"; /* minus sign */
}

.panel {
  padding: 7px 18px 0 18px;
  background-color: white;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}

.panel p, .panel a:link, .panel ul {
    font-size: 14px; 
    line-height: 1.428;
}

#leftmenu a:link { text-decoration: none; color: #069; }
#leftmenu a:visited { text-decoration: none; color: #069; }
#leftmenu a:hover { text-decoration: underline; color: #069; }
#leftmenu a:active{ text-decoration: underline; color: #069; }

#searchresults { margin-left: 30px; }

#header { margin: 0px auto; position: relative; z-index: 2; width: 960px; height: 75px;}

#header-wrap { background: transparent url(../images/headerbg.jpg) repeat-x 0px 0px; margin: 0px auto; position: relative; z-index: 2; width: 960px; height:90px; }

#r1 {  border-bottom: #F3F3F3 solid 1px; }

#r2, #r2noborder { background: #fff; margin: 0px auto; width: 958px; border-left: 1px solid #ccc; border-right: 1px solid #ccc; }

#r2noborder { border:none; width: 960px; }

#logo{ margin: 0; height: 75px; width: 960px; }

#logo_left{ float:left; margin: 15px 0 0 5px;}

#logo_middle{ float: left; margin: 12px 0 0 25px; }

#logo_right{ float: right; margin: 40px 0 0 0; }

#announcetitle { position: absolute; font-size: 11px; margin-left: 4px; margin-top: -9px; padding: 0px 3px 0px 2px; background: #fff; color: #F00; font-weight: bold; }
#announcetitle a:link, #announcetitle a:visited, #announcetitle a:active{ text-decoration: none; color: #427CD5; }
#announcetitle a:hover{ text-decoration: underline; color: #427CD5; }
#announcetitle a:active{ text-decoration: none; color: #930; }

#planout { padding: 4px 4px 0px 4px; height: 48px; width: 450px; text-align: left; font-size: 11px;  color: #333; border: #ccc solid 1px; background: #fff;}
#planout #t1{ font-weight: bold; font-size: 11px; color: #427CD5; padding-right: 4px; }

#planout a:link, #planout a:visited, #planout a:active{ text-decoration: none; color: #000; }
#planout a:hover{ text-decoration: underline; color: #333; }

#menu { position: relative; margin-left: 0px; width: 960px;  background-color: #ECE8E5; }

#menu_ul { color: #CCC; list-style: none; padding-top: 6px; }

#menu li{ float: left; padding: 0px 20px 0px 20px; text-align: center; font-size: 11px; color: #fff; font-weight: bold; }

#menu a:link { text-decoration: none; color: #000; }
#menu a:visited { color: #ccc; text-decoration: none; }
#menu a:hover { color: #999; }
#menu a:active { color: #ccc; text-decoration: none; }

#l0 { float: left; width: 958px; height: 3px; background: #ccc; } /* small bar below menu */

#l1 { float: left; width: 958px; border-bottom: #ccc solid 1px; border-top: #ccc solid 1px; overflow:hidden} 

#l2 { float: left; width: 100%; border-bottom: #ccc solid 1px; clear:both; }

.index, .index2, .indexblue, .index2blue 
	{ float:left; width: 238px; border-left: 1px solid #ccc; }
.index1st, .index21st, .index1stblue, .index21stblue 
	{ float:left; width: 239px; }
.index2, .index2blue { width: 477px; }
.index21st, .index21stblue { width: 478px; }
.indexblue, .index2blue, .index1stblue, .index21stblue 
	{ background: url("../images/border_fade4.png") repeat-y; }

.index img.img220, .index1st img.img220, .indexblue img.img220, .index1stblue img.img220
{height: 99px; width: 220px; margin:0.75em 0 0 0.75em} 
.index2 img.img460, .index21st img.img460, .index2blue img.img460, .index21stblue img.img460  
{height: 99px; width: 460px; margin:0.75em 0 0 0.75em}
/* 99 height ensures list items will line up with lists that have no image */

#l1 ul, #l2 ul {margin: 0.75em 0 0 0; padding:0 0.75em;}
#l1 li, #l2 li {list-style: none; line-height: 26px; border-bottom: #ccc dashed 1px; 
				text-decoration: none; font-weight: bold; color: #930;}
#l1 li.noborder, #l2 li.noborder { border:none; } /* used on last item of list */
#l1 ul.margin26, #l2 ul.margin26 {margin-bottom:26px;} /* used if one list is too short */
#l1 ul.margin52, #l2 ul.margin52 {margin-bottom:52px;}

#l1 a:link, #l2 a:link , #l3 a:link { text-decoration: none; font-weight: bold; color: #930; }
#l1 a:visited, #l2 a:visited, #l3 a:visited { color: #930; text-decoration: none; }
#l1 a:hover, #l2 a:hover, #l3 a:hover { color: #930; font-weight: bold; text-decoration: underline; }
#l1 a:active, #l2 a:active, #l3 a:active { color: #930; text-decoration: none; }

#l1 .listtop a:link { list-style: none; color: #427CD5; text-decoration: none; }
#l1 .listtop a:visited { list-style: none; color: #427CD5; text-decoration: none; }
#l1 .listtop a:hover { list-style: none; color: #427CD5; text-decoration: none; }
#l1 .listtop a:active { list-style: none; color: #427CD5; text-decoration: none; }

#l2 .listtop a:link { list-style: none; color: #427CD5; text-decoration: none; }
#l2 .listtop a:visited { list-style: none; color: #427CD5; text-decoration: none; }
#l2 .listtop a:hover { list-style: none; color: #427CD5; text-decoration: none; }
#l2 .listtop a:active { list-style: none; color: #427CD5; text-decoration: none; }

#l1 .listtop{ list-style: none; font-family: Georgia, "Times New Roman", Times, serif; font-size: 18px; font-weight: bold; color: #427CD5; }  

#l2 .listtop{ margin-top: -5px; list-style: none; font-family: Georgia, "Times New Roman", Times, serif; font-size: 18px; font-weight: bold; color: #427CD5; } 


/*  ------------ begin map --------------------- */

#l2c1 a:link { color: #fff; font-weight: bold; text-decoration:none; }
#l2c1 a:visited { color: #fff; text-decoration: none; }
#l2c1 a:hover { color: #fff; font-weight: bold; text-decoration: underline; }
#l2c1 a:active{ color: #fff; text-decoration: none; }

#l2c1_links a:link { color: #fff; font-weight: normal; text-decoration:none; }
#l2c1_links a:visited { color: #fff; text-decoration: none; }
#l2c1_links a:hover { color: #fff; font-weight: normal; text-decoration: underline; }
#l2c1_links a:active{ color: #fff; text-decoration: none; }

#map_canvas {margin: 5px auto 0 auto; width: 410px; height: 270px; padding: 2px 4px 4px 4px; background: #234270; color: #000; }

#googleMap { text-align: left;width: 400px;padding-top: 0px; padding-left: 30px;float: left; clear:left;margin-bottom: 0px;margin-top: 0px;}
#googleMap #api {float: left;height: 400px;width: 480px;margin: 0px;padding: 10px 0 0 0;font-family: Arial, Helvetica, sans-serif;	font-size: 12px;}
#googleMap #api p {	font-size: 12px;color: #666;font-family: Arial, Helvetica, sans-serif; width:440px;}

#googleMap #api ul li a {float: left;display: block;font-size: 12px;font-weight: bold;color: #fff;background: #cc6600;padding: 2px 6px;text-align: left; line-height: 20px;text-decoration: none;border: #666633 solid 1px;margin-right: 2px;}
#googleMap #api ul li  {display:inline;}
#googleMap #api ul li a:hover {background: #666633;}
#googleMap #api ul li.active a {background: #666633;border: #666633 solid 2px;margin-right: 2px;}

#googleMap h1 {font-family: Georgia, "Times New Roman", Times, serif;font-size: 20px;color: #333;font-weight: lighter;}
#googleMap p {	font-size: 12px;color: #666;font-family: Arial, Helvetica, sans-serif;}

#googleMap #zip {display: block;float: left;margin-top: 10px;font-family: Arial, Helvetica, sans-serif;font-size: 12px;color: #666;margin-right: 10px; line-height: 22px;}
#googleMap #waiting {display: block;float: left;width: 65px;font-family: Arial, Helvetica, sans-serif;font-size: 12px;color: #666;margin-top: 10px; margin-right: 10px;}
#googleMap #form {display: block;}
#googleMap #textfield {height: 25px;border: 1px solid #CCC;background: #FFF;vertical-align: middle;text-align: left;padding-top: 4px;padding-bottom: 4px; font-family: Arial, Helvetica, sans-serif;color: #999;font-size: 14px;width: 160px;padding-left: 5px;}

#l2c1  { float: left; width: 440px; height: 292px; padding: 3px 0 0 0; background: #234270; color: #fff; }

/*  -- end map --- 
#l2c1 contains the map on any page other than the home page. #l2c1_links is for the home page.
The following are used on home page only. */

#l1c1 {width:442px; height:228px; padding:0 0 0 4px; margin:0; border:none; float:left; overflow:hidden;} /* slider */
#l2c1_links {width:439px; height:333px; padding:8px 0 0 8px; margin:0; border:none; float:left; overflow:hidden;} /* map */

/* contains the slider */
#subnav { width: 432px; height: 217px; z-index:1; position:relative; padding: 4px 0 0 0;}
#subnav-slider { width: 432px; height: 217px; z-index: 0; position:relative; float: left; }

/* contains the map */
#map_wrapper {width: 430px; height:320px; padding-top:3px; background-color: #234270; color:#fff; text-align:center;}
#maptabs {margin-top:2px; font-size: 12px; font-weight:bold;} /* text under the map i.e. "All Kiosk Locations" */

#l1c2 {width:255px; height:228px; padding:0; margin:0; border:none; float:left; overflow:hidden;} /* wait times */
#l2c2 {width:254px; height:333px; padding:8px 0 0 0; margin:0; border:none; float:left; overflow:hidden;}

#l1c3 {width:255px; height:228px; padding:0; margin:0; border:none; border-left:1px solid #ccc; float:left; overflow:hidden; background: url("../images/border_fade4.png") repeat-y; } /* Online Services */
#l2c3 {width:255px; height:333px; padding:8px 0 0 0; margin:0; border:none; border-left:1px solid #ccc; float:left; overflow:hidden;}

#l2c2 img, #l2c3 img { width: 245px; height: 115px; padding: 0; margin: 0; }
#l2c2 img {margin-left: 2px;}
#l2c3 img {margin-left: 5px;}

/* --- 2014 home page redesign */

#level1column2 {float:right; width:400px; height: 315px; position:relative; background-image:url(../images/stay_bg.jpg); background-repeat:no-repeat; background-position:center;}

.zboxtrpll, .zboxtrplm,.zboxtrplm2, .zboxtrplr, .zboxtrplr2 {
	width: 303px;
	padding: 5px;
	margin: 10px 0;
	height: 330px;
	background: #eee;
	float:left;
	position:relative;
	border-radius: 5px;
}
.zboxtrplm {width: 304px; margin-left: 10px; background: #eee url(../../images/kiosk_icon.png) no-repeat 95% center;}
.zboxtrplm2 {width: 304px; margin-left: 10px; background: #eee;}
.zboxtrplr {float:right; background: #eee url(../../images/road-straight.png) no-repeat center;}
.zboxtrplr2 {float:right;}
.zboxinner {margin:10px;}
.zboxinner ul {padding:0 0 0 15px;}
.zboxtrplbtn {text-align:left; position:absolute; bottom:10px; width: 283px;}
.zboxtrplbtn2 {text-align:left; width: 283px;}

.zboxdbll, .zboxdblr {width: 455px; padding: 10px; height: 267px; float:left; background-color:#e0f3fb; margin: 0 0 10px 0;}
.zboxdblr {float:right; background-color:#f5e8dc;}

/*  ------------ end home page only ------------- */

#l3 { clear: both; height: 120px; width: 960px; padding: 15px 0 0 0; background: #234270; }

#l3boxwrapper {width: 930px; margin: 0 auto;}
.l3box {float:left; width: 160px; margin: 0 13px; padding-bottom: 6px; text-align:center; background: #ccc;}
.l3box p {margin:3px 0; padding:0; width: 100%;}
.l3box img {width: 150px; height: 77px; margin:0; padding:0;}

#r3 { width: 100%; background-color: #000; } 

#footer { margin: 0 auto; padding-top: 15px; width: 960px; font-family: Arial, Helvetica, sans-serif; }

#footerseal {position: absolute; bottom: 17px; right: 0;}

#subfooter{ margin: 0 auto; width: 100%; color: #ccc;} 

#fc1, #fc2, #fc3, #fc4 { float: left; width: 25%; }
#fc3 {width: 22%}
#fc4 {width: 27%}

#footer ul{ margin: 0 5px 0 15px; padding: 0; list-style-type: none; }
#footer li{ margin: 0; padding: 0; list-style-type:none; font-size: 13px; color: #ddd;}
select.goog-te-combo {color:#ccc; border-color: #ccc; background:#222; font-weight:normal;}

#footer li.ftrhdr {margin-top: 2px; font-size: 13px; font-weight: bold; color: #fff; }
#footer li.ftrhdr2{font-size: 13px; font-weight: bold; color: #fff}
#footer li.ftrtop { margin-top: 0px; padding-top: 10px; text-align: left; 
font-size: 16px; font-weight:bold; color: #009add; text-transform:uppercase; font-family: 'Raleway', Arial, Helvetica, sans-serif;}

#footer a:link, #Subfooter a:link { text-decoration: none; color: #ccc; }
#footer a:visited, #Subfooter a:visited { color: #ccc; text-decoration: none; }
#footer a:hover, #Subfooter a:hover { text-decoration: underline; color: #fff; }
#footer a:active, #Subfooter a:active { color: #ccc; text-decoration: none; }

#sfr0 { margin: 0 auto; width:815px; height: 100px;} /* Gov, Dir and social media and copyright */
#sfr0 ul{ position: absolute; padding-top: 20px; margin: 0 auto; width: 960px; text-align: left;}
#sfr0 li{ font-size: 13px; height: 30px; text-align: left; list-style: none;}
#sfr0 img{ margin: 5px 20px 0 0; width: 30px; height: auto; }

#sfr1 {font-size: 13px; margin: 0 auto; width: 815px; text-align: left; color: #fff;} /* links*/

#sfr2 { margin: 0 auto; width: 960px; } /* copyright */
#sfr2 p { font-size: 12px; text-align: left; }