/* BE SURE TO INCLUDE THE CSS RESET FOUND IN THE DEMO PAGE'S CSS */

body {
    background-color: #336699;
}
.clear {
    margin: 0;
    padding: 0;
    clear: both;
}
img.floatLeft {
	float: left;
	margin: 0px 10px;
}

img.floatRight {
	float: right;
	margin: 0px 10px;
}

img.button {
	width: 50;
	height: 68;
	padding: 8px;
	border: 0;
}

#maindiv {
	width: 1000px;
    margin: 0 auto; 
    background-color: #FEFFE7;
	position: relative;
}
#govHeader2 {
	color: #FFF;
	font-size: 10pt;
	font-family: Verdana, Geneva, sans-serif;
	line-height: 1.2em;
	position: absolute;
	margin-top:-150px;
	right: 19px;
	text-shadow: 1px 1px #000;
	text-align: right;
}
#govHeader2 a {
	color:#FFF;
}
#govHeader2 a:hover{
	text-decoration:underline;
}
#banner {
	position: relative;
	height: 154px;
	width: 1000px;
	border: 0px;
	padding: 0px;
}
h4,h5,h6 {
	color: #003366;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}
h1,h2,h3 {
	color: #998833;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}
p {
	font-family: Verdana, Geneva, sans-serif;
	font-size:12px;
	padding:0px 10px 0px 10px;
}
.center {
	text-align:center;
}
.right {
	text-align:right;
}
.italic {
	font-style:italic;
}
.ulStyle li {
	font-family: Verdana, Geneva, sans-serif;
	font-size:12px;
	padding:7px 0px;
}
#dataTable table {
	border-collapse:collapse;
	padding:0px;
}

#dataTable .th {
	padding:0px 0px;
	font-size:14px;
	background-color:#FEFED8;
	text-align:center;
}

#dataTable td {
	font-family: Verdana, Geneva, sans-serif;
	padding:4px;
	font-size:12px;
}

#pagetitle{
	clear:both;
	text-indent:15px;
	margin-top:-20px;
}

#pulldown{
	margin: 0px 25px;
	font-size: 12px;
}

/*------------------------------------*\
    NAV
\*------------------------------------*/

#top-menu{
	position: absolute;
	width: 1000px;
	height: 20px;
	margin-top:-41px;
}
#nav{
	font-family: Verdana, Geneva, sans-serif;
	font-size: 8pt;
	position: absolute;
	list-style: none;
	font-weight: bold;
	margin-bottom: 0px;
	width: 100%;
	height: 20px;
	padding: 0px;
	z-index:114;
}
#nav li{
    float:left;
	position:relative;
}
#nav a{
    display:block;
	padding:6px 15px;
    color:#fff;
    background:#036;
    text-decoration:none;
}
#nav a:hover{
    color:#fff;
    background:#6b0c36;
    text-decoration:none;
}

/*--- DROPDOWN ---*/
#nav ul{
	background:#036; /* Adding a background makes the dropdown work properly in IE7+. */
    background:rgba(255,255,255,0);  /*But! Let's make the background fully transparent where we can, we don't actually want to see it if we can help it... */
    list-style:none;
    position:absolute;
	left:-9999px; /* Hide off-screen when not needed (this is more accessible than display:none;) */
}
#nav ul li{
	margin-bottom:-1px;
    margin-left:1px;
	margin-right:1px;
    float:none;
	border-style:solid;
	border-width:1px;
	border-color:#036;
}
#nav ul a{
    white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
}
#nav li:hover ul{ /* Display the dropdown on hover */
	left:-30px; /* Bring back on-screen when needed */
}
#nav li:hover a{ /* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */
	background:#549492;
	color:#FEFFE7;
    text-decoration:none;
}
#nav li:hover ul a{ /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */
    text-decoration:none;
}
#nav li:hover ul li a:hover{ /* Here we define the most explicit hover states--what happens when you hover each individual link. */
    background:#B1D3D2;
	color:#264A2D;
}

/*---marquee---*/

@import url(http://fonts.googleapis.com/css?family=Lato:300|PT+Serif:400);

.marquee { font-size:16px; height:500px; max-width:1000px; margin: 0px auto 20px auto; border: 1px solid #ccc;}

.marquee .marquee_data { display: none; }

.marquee .marquee_stage_large { height: inherit; position:relative; overflow: hidden; }

.marquee .marquee_container_1,
.marquee .marquee_container_2 { height: inherit; position: absolute; top: 0px; left: 0px; width: 100%; }
.marquee .marquee_container_1 { z-index: 101; }
.marquee .marquee_container_2 { z-index: 102; }

.marquee .marquee_panel {
	height: inherit; width: 100%;
	position: absolute; top: 0px; left: 0px;
	text-align: center;
	background-repeat: no-repeat;
	background-position: center 0px;
	background-size: cover;
}

.marquee .marquee_panel .panel_caption {
	width: 68%;
	position: absolute; bottom: 35px; left: 0px;
	margin-left: 16%;
	padding-bottom: 15px;
}
.marquee .marquee_panel .panel_caption h5 { font-family:Georgia, "Times New Roman", Times, serif; margin: 0px 0px 0px 0px; font-weight: 900; text-shadow: 2px 2px 4px #000, 0 0 10px #000, 0 0 30px #000, 0 0 15px #fff; font-size: 2.2em; color:#FE9; }
/*.marquee .marquee_panel .panel_caption p { margin: 0px 50px 15px 50px; color: #888; font-size: 1.3em; text-shadow: 0 0 4px #000; color: #fff); }*/
.marquee .marquee_panel .panel_caption p { margin: 0px 50px 15px 50px; font-size: 1.3em; font-weight:bold; text-shadow: 2px 2px 4px #000, 0 0 10px #000, 0 0 50px #000, 0 0 15px #fff; color: #ffffff;}
.marquee .marquee_panel .panel_caption a.cta { font-family: Verdana, Geneva, sans-serif; display: inline-block; background-color: rgba(100,100,100,.4); text-transform: uppercase; color:#fff; font-weight: 800; font-size: .9em; padding: 6px 20px; transition: background-color .7s, border .7s; border: 1px solid rgba(255,255,255,.8); border-radius: 5px; text-decoration: none; }

.marquee .marquee_panel .panel_caption a:hover { background-color: rgba(255,255,255,.6); color:#000; border-color: rgba(255,255,255,0); }

.marquee .overlay {
	position: absolute; left: 0px; top: 0px;
	width: 100%; height: 100%;
	background-image: linear-gradient(rgba(0,0,0,0) 45%, rgba(0,0,0,.2)90%);
	background-size: 100%;
}

.marquee .marquee_nav {
	position: absolute; bottom: 10px; left: 0px;
	text-align: center; width:100%;
	z-index: 103;
}

.marquee .marquee_nav div {
	display: inline-block;
	width: 10px; height: 10px;
	border: 2px solid rgba(20,20,20,.5);
	border-radius: 50%;
	margin: 0px 8px 0px 8px;
	cursor: pointer;
	transition: background-color .4s, border .4s;
}

.marquee .marquee_nav div:hover { border-color:#fff; background-color: rgba(255,255,255,.2); }

.marquee .marquee_nav div.selected { background-color: #fff; }

.marquee .btn {
	width: 39px; height: 39px;
	background: rgba(100,100,100,.6) no-repeat;
	background-size: 50px 30px;
	position: absolute; top: 192px;
	cursor: pointer;
	border-radius: 50%; border: 2px solid rgba(255,255,255,.5);
	transition: background-color .4s, border .4s;
}
.marquee .btn:hover { border-color: #fff; background-color: rgba(0,0,0,.6); }

.marquee .btn.prev {
	left: 20px; z-index: 104;
	background-image: url(images/arrow_left_t.gif); background-position: -8px 4px;
}
.marquee .btn.next {
	right: 20px; z-index:105;
	background-image: url(images/arrow_right_t.gif); background-position: -3px 4px;
}

.marquee .marquee_stage_small {
	height: inherit; position: relative; overflow: hidden;
}
.marquee .marquee_stage_small .marquee_panel {
	width: 100%; height: inherit;
	position: absolute; top: 0px; left: 0px;
}

/*---hottopics popup---*/

#hottopics{
	position:absolute;
	top:160px;
	right:10px;
	border:groove;
	border-radius:10px;
	border-color:#036;
	background-color:#B1D3D2;
	height:25px;
	width:100px;
	z-index: 113;
	overflow:hidden;
}
#hottitle{
	margin-top:5px;
	color:#036;
	text-align:center;
	overflow:hidden;
	font-weight:bold;
	font-size:12px;
	/*text-shadow:1px 1px 6px #006666;*/
}
#hotlist{
	padding-left:8px;
	padding-right:8px;
}
#topics{
	color:#036;
	text-align:left;
	/*overflow:hidden;*/
}

/*---users group popup---*/

#ugroup{
	position:absolute;
	top:160px;
	right:125px;
	border:groove;
	border-radius:10px;
	border-color:#036;
	background-color:#B1D3D2;
	height:25px;
	width:135px;
	z-index: 112;
	overflow:hidden;
}
#ugtitle{
	margin-top:5px;
	color:#036;
	text-align:center;
	overflow:hidden;
	font-weight:bold;
	font-size:12px;
	/*text-shadow:1px 1px 6px #006666;*/
}
#uglist{
	padding-left:8px;
	padding-right:8px;
}
#topics{
	color:#036;
	text-align:left;
	/*overflow:hidden;*/
}

/*---applications---*/

#apptitletb {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	color: #000;
}
#createmap {
	float: right;
	width: 100px;
	height: 635px;
	color: #000;
	padding: 1px;
}
#createmapbutton {
	padding-left:10px;
}
#apptable .table {
	font-family: Verdana, Arial, Helvetica, sans-serif;
    border-collapse: collapse;
	border: 1px solid #000;
	width:830px;
	margin-left:40px;
	vertical-align:top;
}
#appcell {
    padding-left: 10px;
	padding-right: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
    border-collapse: collapse;
	border: 1px solid #000;
	text-align:center;
	color: #000;
	width: 100px;
}
#appcelltn {
	padding:8px 10px;
    border-collapse: collapse;
	border: 1px solid #000;
}
#appcelldes {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
    border-collapse: collapse;
	border: 1px solid #000;
}

/*---bottomBar---*/

#bottomBar {
	float:right;
	background: transparent;
}

#bottomBar p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #000000;
	text-decoration: none;
	margin: 3px 5px 5px 0px;
	padding: 0px;
}

/*---Footer---*/

#footer {
	clear: both;
}

#footer a {
	text-decoration:underline;
	margin-bottom:10px;
}

#footer a:hover {
	color:#369;
}

#footer p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color:#036;
}

/*------*/

#break {
	height:2px;
	width:1000px;
	background:#036;
	color:#036;
}
.search {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: x-small;
	color: #003366;
}
table.search {
	margin-bottom: 15px;
	text-align: right;
}
td.search {
	padding-left: 5px;
	padding-right: 5px;
	text-align: right;
}
A.headerLink:link, A.headerLink:visited, A.headerLink:active {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #003366;
	text-decoration: none;
	font-weight: bold;
}
A.headerLink:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #003366;
	text-decoration: underline;
	font-weight: bold;
}