﻿/* CSS layout */
/* common */		
	
	.left{float:left;margin-right:1em;}
	.right{float:right;margin-left:1em;}
	.center{text-align:center;}
	
	.clear{clear:both;}
	.first{margin-left:0 !important;}
	.last{margin-right:0 !important;}
	.top{margin-top:0 !important;}
	.bottom{margin-bottom:0 !important;}	
	.hidden, .print{display:none;}
	.graphic{
		margin:0;
		padding:0;
		display:block;
		overflow:hidden;
		text-indent:-8000px;
		}

/* // common */
/* percentage based grid */
		
		.cols{} /* main column container class */
		.col, .col1w, .col2w {
			float:left;
			display:inline;
			width:48%;margin-left:4%; /* 2 equal width columns layout - default */
			}	
		.cols3 .col{width:30%;margin-left:5%;} /* 3 equal width columns layout */
		.cols4 .col{width:22%;margin-left:4%;} /* 4 equal width columns layout */
		.cols5 .col{width:16%;margin-left:5%;} /* 5 equal width columns layout */
		.col1w {width:30%;margin-left:5%;}
		.col2w {width:65%;margin-left:5%;}
		
/* percentage based grid */
/* side bar list */

	ul.list{
		margin:1em 0;
		padding:0;
		border-top:1px solid #ccc;
		width:160px;
		}	
	ul.list li{
		margin:0;
		padding:.5em 0;
		list-style:none;
		border-bottom:1px solid #ccc;
		}
	
/* side bar list */	

/* Basic Elements */
#body {
	background-position: left top;
	padding: 40px 20px 0px 20px;
	float: left;
	width: 360px;
	background-image: url('parks-assets/images/bg-body-content.jpg');
	background-repeat: no-repeat;
}
html {
	margin: 0;
	padding: 0;
	}
body {
	font: .8em Arial, Helvetica, sans-serif;
	margin: 0;
	padding: 0;
}
img {
	border-style: none;
}

h3 {
	font: 1.4em Arial, Helvetica, sans-serif;
	color: #829CC1;
}
a:link {
	text-decoration: none;
	color: #0066CC;
}
a:visited {
	font-weight: none;
	text-decoration: none;
	color: #0066CC;
}
a:active {
	text-decoration: none;
	color: #0066CC;
}
a:hover {
	text-decoration: none;
	color: #0066FF;
}
	
.break {
	font-size:0px; line-height:0px; clear:both;
}

/* specific divs */
#wrapper {
	margin: 0px auto 0px auto;
	width: 780px;
	background-image: url('parks-assets/images/bg-content.gif');
	background-repeat: repeat-y;
}
#masthead {
	width: 780px;
}

/* using an image to replace text in an h1. This trick courtesy Douglas Bowman, http://www.stopdesign.com/articles/css/replace-text/ */
#masthead h1 {
	padding: 0px;
	margin: 0px;
	background: transparent url('parks-assets/images/logo-sjcgov-seal.gif') no-repeat left top;
	width: 180px;
	height: 132px;
	float: left;
}
#masthead h1 span {
	display:none
	}
#masthead h2 {
	padding: 0px;
	margin: 0px;
	background: transparent url('parks-assets/images/masthead-sjc-parks-rec.jpg') repeat-x left top;
	width: 600px;
	height: 132px;
	float: right;
}
#masthead h2 span {
	display:none
	}

#top_nav {
	margin: 0px;
	padding: 0px;
	width: 780px;
	height: 32px;
	background-image: url('parks-assets/images/bg-nav.gif');
	background-color: #FFCC00;
	background-repeat: repeat-x;
	text-align: center;
}
#navcontainer ul
{
	text-align: center;
	padding-bottom: 5px;
	padding-top: 5px;
	padding-left: 0;
	margin-top: 0; /* cancels gap caused by top padding in Opera 7.54 */;
	margin-left: 0;
	color: white;
	width: 100%;
	font-family: Arial,Helvetica,sans-serif;
	line-height: 18px;
	font-weight: bold;
	font-size: 1.1em;
}

#navcontainer ul li
{
display: inline;
padding-left: 0;
padding-right: 0;
padding-bottom: 5px;
/* matches link padding except for left and right */
padding-top: 5px;
}

#navcontainer ul li a
{
	padding: 5px 8px 5px 8px;
	color: white;
	text-decoration: none;
}
#navcontainer ul li a:hover
{
	background-color: #FFCC00;
	color: white;
}

#navcontainer #active { border-left: 1px solid #fff; }

#container {
	width: 780px;
}
#left_col {
	width: 180px;
	left: 0px;
	top: 0px;
	background-image: url('parks-assets/images/bg-left-column.png');
	background-repeat: no-repeat;
	background-color: #829cc1;
	float: left;
	padding-top: 30px;
}
#page_content {
	width: 600px;
	float: right;
}
/* footer */
#main_footer{
	width: 780px;
	background: url('parks-assets/images/bg-footer.gif') repeat-x;
	color: #FFFFFF;
	margin: 20px auto 0px auto;
	padding: 20px 0px 10px 0px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: .8em;
	background-color: #264E75;
	height: 50px;
}
#footer {
	width: 780px;
	height: 28px;
	margin: 0 auto 0 auto;
	text-align: center;
}
#navfooter
{
	margin: 18px auto 0em auto;
	overflow: hidden;
	width: 550px;
}

#footerlist
{
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#footerlist li
{
	border-left: 1px solid #000;
	float: left;
	line-height: 1.1em;
	margin: 0 .5em 0 -.5em;
	padding: 0 .5em 0 .5em;
	border-left-color: #FFFFFF;
}

#footer a {
	color: #FFFFFF;
	text-decoration: none;
}


#right_col {
	float: right;
	width: 180px;
	padding: 40px 10px 0px 10px;
	background-image: url('parks-assets/images/bg-right-column-content.jpg');
	background-repeat: no-repeat;
}

#body_inside {
	padding: 40px 20px 0px 20px;
	float: left;
	width: 560px;
	background-image: url('parks-assets/images/bg-body-content-inside.jpg');
	background-repeat: no-repeat;
}
#left_col H3 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.6em;
	color: #99CCFF;
	margin: 0px 0px 0px .8em;
	padding: 0px;
}
#left_col_navlist_sjgov
{
	margin: 0px 0px 1em 1.3em;
	padding: 0px 0px 1em 0;
	border-bottom: 1px solid #FFFFFF;
	width: 145px;
	border-bottom-color: #FFFFFF;
	color: #CCCCCC;
}
#left_col_navlist_sjgov li
{
	list-style: none;
	margin: 0em;
	padding: 0em;
	border-top: 1px solid #FFFFFF;
	border-top-style: none;
}

#left_col_navlist_sjgov li a {
	text-decoration: none;
	color: #FFFFFF;
}
#left_col_navlist
{
	margin: 0px 0px 1em 1.3em;
	padding: 0px 0px 1em 0;
	border-bottom: 1px solid #FFFFFF;
	width: 145px;
	border-bottom-color: #FFFFFF;
	color: #CCCCCC;
}
#left_col_navlist li
{
	list-style: none;
	margin: 0em;
	padding: 0em;
	border-top: 1px solid #FFFFFF;
	border-top-style: none;
}

#left_col_navlist li a {
	text-decoration: none;
	color: #FFFFFF;
}

#left_col_navsublist
{
	margin: 0px 0px 0px 1.3em;
	padding: 0px 0px 0px 0;
	border-bottom: 1px solid #FFFFFF;
	width: 145px;
	border-bottom-color: #FFFFFF;
	border-bottom-style: none;
}
#left_col_navsublist li
{
	list-style: none;
	margin: 0px;
	padding: 0em;
	border-top: 1px solid #FFFFFF;
	border-top-style: none;
}

#left_col_navsublist li a {
	text-decoration: none;
	color: #FFFFFF;
}
#side_nav a {
	color: #99CCFF;
	text-decoration: none;
	font-family: Arial, Helvetica, sans-serif;
}
#left_col_navlist li a:hover {
	text-decoration: none;
	color: #99CCFF;
}

/* Images with Captions */

div.caption_float {
	float: left;
	width: 110px;
}
div.caption_float_4 {
	float: left;
	width: 135px;
	text-align: center;
}
div.caption_float p {
	padding: 0px;
	margin: 0px;
	text-align: center;
	line-height: 1.2em;
}
div.caption_float_4 p {
	padding: 0px;
	margin: 0px;
	text-align: center;
	line-height: 1.2em;
}

div.caption_container {
	border: 2px none #333;
}

div.caption_spacer {
  clear: both;
  }
.imgBorderFloatRight {
	border: 1px solid #CCCCCC;
	padding: 5px;
	margin: 5px 5px 10px 10px;
	float: right;
}
.imgBorderFloatLeft {
	border: 1px solid #CCCCCC;
	padding: 5px;
	margin: 5px 10px 10px 5px;
	float: left;
}
#park_main_col {
	float: left;
	width: 330px;
}
#park_main_col h5 {
	margin: 0px;
	padding: 7px;
	font-weight: bold;
	border: 1px none #CCCCCC;
	color: #FFFFFF;
	background-color: #FFFFFF;
	background-image: url('parks-assets/images/bg-H5-sub-header-green.gif');
	background-repeat: no-repeat;
	height: 17px;
}
#park_main_col H4 {
	color: #FF9900;
	font-size: 16px;
}
#park_right_col {
	float: left;
	width: 190px;
	padding: 0px;
	margin: 0px 0px 0px 30px;
	text-align: center;
}
.imgBorder {
	border: 1px solid #CCCCCC;
	padding: 5px;
	margin: 0px;
}
/* Image Rotator Styles */
#rotator
{
	border: 1px none #000;
	cursor: pointer;
	overflow: hidden;
	position: relative;
	width: 600px;
	height: 259px;
	background-image: url('parks-assets/images/rot-image-bg.jpg');
	background-repeat: no-repeat;
}

#rotator img
{
	border: 0;
	cursor: pointer;
	width: 600px;
	height: 259px;
}
#side_nav {
	font-size: 12px;
}
h4 {
	color: #FF9900;
	margin-top: 0px;
	font-size: 1.3em;
}
/* Decorative Bullet Lists */
 .iconlist
{
	list-style: none;
	margin: 0;
	padding: 0 0 10px 0;
}

li.pdf
{
	background-image: url('parks-assets/bullets/bul-pdf.png');
	background-repeat: no-repeat;
	background-position: 0 50%;
	padding: 0px 0 0px 20px;
	margin: .2em 0 .2em 0;
}
li.doc
{
	background-image: url('parks-assets/bullets/bul-msword-icon.png');
	background-repeat: no-repeat;
	background-position: 0 50%;
	padding: 3px 0 3px 20px;
	margin: .4em 0;
}

li.text
{
	background-image: url('parks-assets/bullets/bul-check-blue.png');
	background-repeat: no-repeat;
	background-position: 0 .5em;
	padding: 0px 0 0px 20px;
	margin: .2em 0 .2em 0;
}

li.weblink
{
	background-image: url('parks-assets/bullets/bul-exteranl-link.png');
	background-repeat: no-repeat;
	background-position: 0 50%;
	padding: 0px 0 0px 20px;
	margin: .2em 0 .2em 0;
}

li.arrowblue
{
	background-image: url('parks-assets/bullets/bul-blue-double-arrow.png');
	background-repeat: no-repeat;
	background-position: 0 .3em;
	padding: 0px 0 0px 20px;
	margin: .2em 0 .2em 0;
}
li.arroworange
{
	background-image: url('parks-assets/bullets/bul-circle-orange-arrow.png');
	background-repeat: no-repeat;
	background-position: 0 .5em;
	padding: 3px 0 3px 20px;
	margin: .4em 0;
}
li.webpage
{
	background-image: url('parks-assets/bullets/bul-webpage.png');
	background-repeat: no-repeat;
	background-position: 0 50%;
	padding: 3px 0 3px 20px;
	margin: .4em 0;
}
li.nobullet
{
	background-image: url('');
	background-repeat: no-repeat;
	background-position: 0 50%;
	padding: 3px 0 3px 20px;
	margin: .4em 0;
}
.iconlist2deep {
	list-style: none;
	margin: 0;
	padding: 0 0 0px 0;
}
.graytext {
	color: #666666;
}
.divider {
	border-top-style: dashed;
	border-top-width: 2px;
	border-top-color: #666666;
	padding-top: 10px;
	margin-top: 10px;
}
h6 {
	color: #829CC1;
	font-size: .9em;
	font-weight:normal;
	font-variant: normal;
	text-transform: uppercase;
	margin: 0px;
}
p {
	line-height: 1.5em;
}
.HeadingOrange {
	padding: 0px;
	margin: 0px;
	color: #FF9900;
	font-size: 1.25em;
	font-weight: bold;
}
.SubHeadingGray {
	font-size: 1.1em;
	font-weight: bold;
	color: #999999;
	margin-top: 0px;
}
.SubHeadingOrange {
	font-size: .75em;
	font-weight: normal;
	color: #F90;
	margin-top: 0px;
}
.TDData {
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #CCCCCC;
}
.TDColumn {
	border-top-width: 2px;
	border-bottom-width: 1px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #006699;
	border-bottom-color: #006699;
}
.TDDataCenter {
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #CCCCCC;
	text-align: center;
}
.center {
	text-align: center;
}
.graysmsubtext {
	font-size: .74em;
	color: #999;
}
a.button {border:1px solid #E6E6E6;padding:.2em .4em;color:#808080}
a.button:hover{background:#efefef;color:#666}

#body_inside_meet {
	padding: 40px 20px 0px 20px;
	float: left;
	width: 560px;
	background-image: url('parks-assets/images/right-body-bg.png');
	background-repeat: no-repeat;
}
#flashcontent {
	width:300px;
	height:237px;
}
.blue_text {
	font-size: small;
	color: #0066CC;
}

