@charset "utf-8";

/* 
====CSS INFO============================================

	FILENAME:		style.css
	DESCRIPTION:	Global CSS
	VERSION:		1.3.0 (08-17-2011)
	WEB SITE:		City of Sunnyvale, California and PMC
					http://sunnyvale.ca.gov
					http://www.pmcworld.com

=========================================================
*/

/* MAIN LAYOUT */
body { margin: 0px; }
.page { width:auto; height:100%; margin-left: auto; margin-right:auto; padding-top:0; position:relative; left:auto; right:auto }
.container { background:url(images/sv_container_bg.jpg); position:relative; background-repeat:repeat-y; width:1020px; height: 100%; padding-left:20px; padding-right:0px; margin:auto; margin-left:auto;}

.mainHeader {width:1020px; height:124px; margin:0px auto 0px; padding:0px 0px 0px 20px;}

.head {
background-image: url("images/sv_head.jpg");
background-repeat: no-repeat;
background-attachment: scroll;
background-position: 0% 0%;
height: 124px;
width: 1020px;
position: relative;
margin-left: -20px;
top: 0pt;
z-index: 20;
}


.mainContent { position:relative; left:240px; top:-40px; width:490px; min-height: 530px; _height: 530px !important; margin:0px 0px 10px 0px;
}

.mainContentTwoCol { position:relative; left:240px; top:-40px; width:704px; min-height: 550px; height:550px !important;
}
.mainContentSingle { position:relative; left:240px; top:-40px; width:650px; min-height: 560px; _height: 560px !important; margin:0px 0px 10px 0px;
}


.mainContentSub { position:relative; left:240px; top:-40px; width:670px; min-height: 530px; _height: 550px !important; margin:0px 0px 10px 0px;}



.rightSide { position:absolute; top:225px; width:250px; z-index:3; margin-left:740px; }
.rightSideSub { position:absolute; top:225px; width:250px; z-index:3; margin-left:740px; }

.foot {position:relative; background:url(images/sv_foot4.jpg) #999; background-repeat:repeat-x; width:940px; height:300px;  margin:30px 0 0 0; padding:0 20px 0 20px; border-top:#333 solid 2px;}
.object	{ margin:10px 0 0 0; padding:10px 0 0 0}


/* HEADERS AND TEXT VARIANTS */
h1 	{ font-weight:bold; font-size:2.4em; letter-spacing: -0.5pt; word-spacing: -.5pt; line-height: 1.0; }
h2 	{ font-weight:bold; font-size:1.3em; letter-spacing: -0.1pt; word-spacing: -.5pt; line-height: 1.2;}
h3	{ color: #525252; font-size: 1.4em; font-weight:normal }
h4	{ margin-bottom:-5px}
body,td,th { font-family: Arial, Helvetica, sans-serif; font-size: 10px; color: #525252; height:100%; }
.container { font-size:1.2em; font-family:Arial, Helvetica, sans-serif; left: auto; right: auto; position:relative; }
.mainContent { line-height:1.4em; }
.mainContent h2, .mainContentSingle h2, .mainContentSub h2 { text-transform:uppercase; border-bottom: #999 solid 1px; margin-top:20px; }

/* TABLES */
/*.mainContent table, .mainContentSingle table, .mainContentSub table {border:solid 1px #f2f2f2; }*/
.mainContent td, .mainContentSingle td, .mainContentSub td {font-size:1.0em; padding:2px 0 2px 5px;border:solid 1px #f2f2f2; }
.mainContent td h4, .mainContentSingle td h4, .mainContentSub td h4 {font-size:1.2em; padding-bottom:5px; padding-top:0; margin-top:-2px;}
.mainContent td ul, .mainContentSingle td ul, .mainContentSub td ul {margin-left:-15px; }
.mainContent td li, .mainContentSingle td li, .mainContentSub td li { list-style-type:square }

/* MARQUEE (This is the page-wide photo, with text overlay) */
.marquee { margin:0 0 0 0; position:relative; left:0; width:980px; height:225px; z-index:100; }

.specialLogo {margin:8px 0px 18px 8px; padding:0px; position:absolute; top:10px; left:750px; width:225px; height:107px;}

.overlay { background-image:url(images/marqueeOverlay.png); background-repeat:repeat-x; width:960px; color:#FFF; text-align:right; padding-right:20px; padding-top:18px; padding-bottom:18px; vertical-align:middle; position:relative; top:-50px; z-index:700; font-weight:bold; font-size:1.2em; }


/* LINKS */
a, a:link, a:hover, a:visited{ color:#1e8cc8; text-decoration:none; }
a:hover { text-decoration:underline; }

/* BREADCRUMBS */
.breadcrumb a, .breadcrumb a:visited, .breadcrumb a:hover { color:#1e8cc8; text-decoration:none; }
.breadcrumb a:hover { text-decoration:underline; }

/* LEFT NAVIGATION */
.leftNav { position:absolute; top:225px; left:20px; width:200px; padding-left:0px; color: #1e8cc8; }
.leftNavSingle { position:absolute; top:225px; left:20px; width:200px; padding-left:0px; color: #1e8cc8; }
.leftNavSingle img { margin:-7px 0 -11px -20px; border-bottom:none}
.leftNavSub { position:absolute; top:124px; left:20px; width:200px; padding-left:0px; color: #1e8cc8; }
.leftNav ul, .leftNavSingle ul { margin:0; top:0; display:block; list-style-type:none; padding:0; width:200px; }
.leftNav li, .leftNavSingle li  { list-style-type:none;  padding:7px 20px 7px 20px; background-color:#cde9f8;  width:180px;   margin-bottom:0; margin-top:0; border-bottom:#fff solid 1px; }
.leftNav li.LftNavHd, .leftNavSingle li.LftNavHd { background-color:#1e8cc8;  color:#fff; padding-top:10px; padding-bottom:10px; font-size:1.6em; font-weight:bold; }

/*.leftNav li a, .leftNavSingle li a { color:#1e8cc8;  text-decoration:none;  margin-bottom:0; margin-top:0; padding-bottom:0; }*/
.leftNav li a, .leftNavSingle li a { 

color:#1e8cc8;  
background-color:#cde9f8; 
position:static;
padding:7px 20px 7px 20px; 
margin: -7px 20px -7px -20px; 
width:180px; 
display:block; 
overflow:hidden; 
}

.leftNav li a:hover, .leftNavSingle li a:hover { 
color:#fff;  
background-color:#1e8cc8; 
position:static;
padding:7px 20px 7px 20px; 
margin: -7px 20px -7px -20px; 
width:180px; 
display:block; 
overflow:hidden; 
}
.leftNav li, .leftNavSingle li. { background-color:#1e8cc8;  color:#fff; padding-top:10px; padding-bottom:10px; font-size:1.6em; font-weight:bold; }
 
/* TABS */
.RTab { width:250px; }

.RTab1, .RTab3 { position:relative; top:0; height:19px; width:250px;}
.RTab1	{ background:url(images/RtTab_01.png) no-repeat; }
.RTab2 { position:inherit; width:250px; background:url(images/RtTab_02.png) repeat-y; top:0; clear:both; margin-bottom:0 }
.RTab3	{ background:url(images/RtTab_03.png) no-repeat; }

.LTab { width:230px; margin-left:-10px; margin-top:0; color:#525252; background:url(images/LTFade.png) no-repeat; position:relative; height:500px}
.LTab a, .LTab a:visited { color:#1e8cc8;  text-decoration:none; }
.LTab a:hover { text-decoration:underline; }
.LTab li { background:none; border:none; padding-left:0 }

.LTab1, .LTab3 { position:relative; top:0; height:19px; width:230px;}
.LTab1 { background:url(images/LtTab_01a.png) no-repeat; }
.LTab2 { position:relative; width:230px; background:url(images/LtTab_02a.png) repeat-y; top:0;  }
.LTab3 { background:url(images/LtTab_03a.png) no-repeat; margin-top:0 }

.LTab2 .tabContent { padding:0 20px; font-weight:normal; margin-bottom:0}
.LTab .LTab2, .LTab .LTab2 a {list-style-type:none}




.tabContent { padding:0 20px; font-weight:normal; margin-bottom:0}
.tabContent p { margin-bottom:0px; }
.tabContent h4 { margin-bottom:-10px }
.tabContent ul { margin:0; padding-left:10px }
/*.tabContent li { padding-bottom:5px; }*/
.tabContent li a { color:#1e8cc8; text-decoration:none; font-weight:normal; }
.tabContent li a:visited { color:#1e8cc8; text-decoration:none; font-weight:normal; }
.tabContent li a:hover { color: #1e8cc8; text-decoration:underline; font-weight:normal; }
.tabContent h3 { margin-top:0px; padding-top:5px; margin-bottom:10px; font-size:1.8em }

/* USER TOOLS */
.rightSide .userTools, .rightSideSub .userTools {  width:185px; padding:0;  margin-left:45px; font-size:1em; margin-bottom:0}
.userTools a, .userTools a:visited, .rightSide .userTools a, .rightSide .userTools a:visited, .rightSideSub .userTools a, .rightSideSub .userTools a:visited { color:#1e8cc8; text-decoration:none; font-weight:normal; }
.userTools a:hover, .rightSide .userTools a:hover { color: #1e8cc8; text-decoration:underline; font-weight:normal; }
.rightSide .userTools ul, .rightSideSub .userTools ul {  position:relative; left:15px; right:auto; margin-left:-10px; padding:0; margin-top:5px }
.rightSide .userTools li, .rightSideSub .userTools li { list-style-type:none; display: inline-block;  text-align:center; padding:0 }
.userTools li { list-style-type:none; display: inline-block;  text-align:center; padding:0; margin-left:-40px; }

/* SEARCH */
.bottomSearchField { position:relative; left:0px; top:5px; height:20px; margin-bottom:10px; }
.bottomSearchButton { position:relative; background:url(images/searchButton.png) no-repeat; top:2px; width:51px; height:20px; border:none; left:7px; margin-bottom:10px }

.topSearch { position:absolute; top:60px; left:650px; z-index:300 }
.topSearchField { position:relative; left:0px; top:0px; height:20px; margin-bottom:10px; width:220px }
.topSearchButton { position:relative; background:url(images/searchButton.png) no-repeat; top:-2px; width:51px; height:20px; border:none; left:7px; margin-bottom:10px }



/* FOOTER */
.foot, .foot a, .foot a:visited { color:#FFF }
.foot ul { margin-top:5px; }
.foot li { list-style-type:none; margin-left:-40px; margin-bottom:3px }
.foot h1, .foot h2, .foot h3 { font-weight:bold; color:#FFF; font-size:1.8em; letter-spacing:-0.03em; margin-bottom:5px; margin-top:0; }
.foot h2 { font-weight:normal; font-size:2.2em; }
.foot h3 { font-size:1.2em; }
.foot td { padding-top:10px; }
.foot form { margin-bottom:5px; }

/* FOOTER COLUMNS */
.footCol1, .footCol2, .footCol3, .footCol4 { position:absolute; top:20px; width:220px; padding:0px 10px;  height:280px; }
.footCol1 { left:-2px;  text-align:center; }
.footCol2 { left:230px;background:url(images/foot_bg.png) repeat-y;}
.footCol3 { left:460px;background:url(images/foot_bg.png) repeat-y;}
.footCol4 { left:690px;background:url(images/foot_bg.png) repeat-y;}

/* -.-- --- ..- / -.-. .- -. .----. - / ... - --- .--. / - .... . / ... .. --. -. .- .-.. */

.rowAlt {
background-color:#f3f3f3; padding:0px; margin:2px 0 2px 0px;
}

.rowAlt img {
	float:left;
	margin:0;
	padding:0;
	}
	
.rowNormal {
background-color:#fff; padding:0px; margin:2px 0 2px 0;
}

.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float. Use this to separate footer from the container otherwise the container will not push the footer down. This div also clears the image float right class and pushed the main content, below*/

	clear:both;
    height:0;
    line-height: 0px;

}
/*** set the width and height to match your images **/

#slideshow {
    position:relative;
    width:980px;
	height:225px;
}

#slideshow IMG {
    position:absolute;
    top:0;
    left:0;
    z-index:8;
    opacity:0.0;
}

#slideshow IMG.active {
    z-index:10;
    opacity:1.0;
}

#slideshow IMG.last-active {
    z-index:9;
}

.highlight {margin:10px 0 10px 0px; padding:3px 5px 3px 5px; background-color:#ffb400; color:#000; border:1px solid #fff;
}

.redText {
	color: #900;
}


#documents li{
	background-attachment:fixed; 
	background:url(images/media_icons/pdf.gif) no-repeat top left  ;
	list-style-type:none;
	margin:0;
	padding:1px 0 3px 20px;
	}


#homeLinks {
	margin-top: 2px;
}
 
#homeLinks ul {
	list-style-type: none;
	width: 220px;
	margin-left:-15px;
	
}
 
#homeLinks li {
	border: 1px dotted #999;
	border-width: 1px 0;
	margin: 5px 5px 0 5px;
	
}
 
#homeLinks li a {
	color: #1e8cc8;
	display: block;
	font: bold 102% Arial, Helvetica, sans-serif;
	padding: 5px;
	text-decoration: none;
	
}
 
* html #homeLinks li a {
	width: 220px;
	margin-left:-10px;
}
 
#homeLinks li a:hover {
	background: #ffffcc;
	
}
 
#homeLinks a em {
	color: #333;
	display: block;
	font: normal 85% Verdana, Arial, Helvetica, sans-serif;
	line-height: 125%;
}
 
#homeLinks a span {
	color: #125F15;
	font: normal 70% Verdana, Arial, Helvetica, sans-serif;
	line-height: 150%;
}
	


#leftnav {
	margin-top: 2px;
}
 
#leftnav ul {
	list-style-type: none;
	width: 100px;
	margin-left:-15px;
	
}
 
#leftnav li {
	border: 1px dotted #999;
	border-width: 1px 0;
	margin: 5px 5px 0 5px;
	
}
 
#leftnav li a {
	color: #990000;
	display: block;
	font: bold 102% Arial, Helvetica, sans-serif;
	padding: 5px 5px 5px 0;
	text-decoration: none;
	padding-left:5px;
}
 
* html #leftnav li a {
	width: 100px;
	margin-left:-10px;
}
 
#leftnav li a:hover {
	background: #ffffcc;
}