/* Main CSS for the Site */


/***************** Main Elements ****************************/

body {
	font: 100%/100% Arial, Helvetica, sans-serif;
	color: #000;
	background: url(/v3/images/pm/pixels.gif);
	margin: 0px;
	}
 
h1	{
	font: 120%/120% Arial, Helvetica, sans-serif;
	font-weight: normal;
	text-transform: uppercase;
	color: #777777;
	margin: 0 0 10px 0;
	padding: 0;
	}
h2	{
	font: 105%/110% Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #333333;
	margin: 25px 0 5px 0;
	padding: 0 0 2px 10px;
	border-bottom: 1px solid #919395;
	}
	h2.news	{
		font: bold 95%/100% Arial, Helvetica, sans-serif;
		color: #777777;
		margin: 0 0 10px 0;
		padding: 0;
		border: none;
		}
	
h3	{
	font: bold 95%/100% Arial, Helvetica, sans-serif;
	color: #333333;
	margin: 20px 0 8px 0;;
	padding: 0;
	}

h4 { 
	font: 100%/130% Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #DF6F1D;
	margin: 20px 0 2px 0;;
	padding: 0;
	}

h5	{
	font: 95%/150% Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #000;
	margin: 10px 0 0 0;
	padding: 0;
	}

h6	{
	font: 100%/110% Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #666;
	margin: 0;
	padding: 2px 5px 2px 5px;
	display: block;
	width: auto;
	background-color: #EBEEF4;
	}

p, li {
	font: 80%/130% Arial, Helvetica, sans-serif;
	font-style: normal;
	font-weight: normal;
	padding: 0;
	margin: 0 0 .5em 0;
	}
	p.intro {
		font: 95%/135% Arial, Helvetica, sans-serif;
		font-style: normal;
		font-weight: normal;
		padding: 0;
		margin: 0 0 .5em 0;
		}
	
label	{
	padding: 0;
	font: 95%/170% Arial, Helvetica, sans-serif;
	font-style: normal;
	font-weight: normal;
	margin-top: 0px;
	}

td p{
	margin-bottom: 0px;
	}

p.caption {
	padding: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-style: italic;
	margin-top: 0px;
	}

a:link, a:visited { 
	font-weight: normal; 
	text-decoration: none;
	border-bottom: 1px dotted #bbd4ee;
	color: #0e549a;
	}
a:hover, a:active { 
	text-decoration: none;
	border-bottom: 1px dotted #FF3300;
	color: #FF3300;
	}

a img, a.image {
	border: none;
	}
		
#home_bridge a {
	display: block;
	width: 261px;
	height: 133px;
	background-image: url(/v3/images/pm/home_bridge.jpg);
	border: none;
	}
	#home_bridge a:hover {
		background-position: -261px;
		}
		
		
		
		

ul {
	padding: 0;
	margin: 0 0 0 18px;
	list-style-image: none;
	}
	ul.link {
		padding-top: 10px;
		}
	
	ul li {
		margin: 0 0 4px 0;
		padding: 0 0 0 0;
		}
	
ul.link li {		/* use this class to add link bullets */
	background: url(/v3/images/pm/bullet.gif) no-repeat 0 4px;
	list-style: none;
	margin: 3px 0 7px -18px;
	padding: 0 0 0 15px;
	}
ul.link-sidebar li {		/* use this class to add link bullets */
	background: url(/v3/images/pm/bullet_sidebar.gif) no-repeat 0 4px;
	list-style: none;
	margin: 3px 0 3px -18px;
	padding: 0 0 0 12px;
	}
		
blockquote {
	font: 100%/150% Arial, Helvetica, sans-serif;
	margin-right: 15px; margin-left: 15px;
	}
	
blockquote.second {
	margin-right: 30px; margin-left: 30px;
	}
	
blockquote.third {
	margin-right: 45px; margin-left: 45px;
	}
	
input.formy, textarea.formy, select.formy{
	font: 95% Arial, Helvetica, sans-serif;
	background-color: #ffffff;
	width: 350px;
	padding: 2px 2px 2px 2px; margin-bottom: 5px;
	border: solid #0e549a 1px;
  }
  
input.clear {
	background: url(/v3/images/clear_form.gif) no-repeat;
	cursor: pointer;
	width: 81px; height: 20px;
	border: 0px; margin: 0px; padding: 0px;
	}

.bullet_large {
	float: left;
	margin: 3px 10px 0 0;
	}
	
.border {
	border:1px solid #0e549a;
	}
	
td {
	vertical-align:top;
	}
	
.imageRight {
	float: right;
	padding: 0 0 12px 12px;
	clear: none;
	font: 90%/120% bold Arial, Helvetica, sans-serif;
	}
.imageLeft {
	float: left;
	padding: 0 12px 12px 0;
	clear: none;
	font: 90%/120% bold Arial, Helvetica, sans-serif;
	}
.imageRight img, .imageLeft img {
	margin-bottom: 5px;
	}
	
	
	
/*****************  Global Top Header ****************************/

#top {
	width: 860px;
	height: 94px;
	margin: 19px 0 0 0;
	}
		
		
#logo a{
	top: 0px;
	left: 0px;
	width: 375px;
	height: 94px;
	position: relative;
	float: left;
	background: url(/v3/images/pm/p-m_logo.gif);
	background-repeat: no-repeat;
	border: none;
}

#trimet_logo a  {
	background: url(/v3/images/pm/tm_logo.gif) top center no-repeat;
	background-repeat: no-repeat;
	position: relative;
	float: right;
	width: 160px;
	height: 94px;
	border: none;
	}


	

/***************** Global Top horizontal Navigation ****************************/

#mainnav	{
	position: relative;
	border-bottom: 3px solid #e06f1d;
	width: 860px;
	height: 26px;
	margin: 0;
	background: #0e549a url(/v3/images/pm/navbar_corner.gif) no-repeat top right;	/* top right bevel */
	background-color: #0e549a;
	}
	
#mainnav ul	{
	width: 782px;
	height: 26px;
	background: url(/v3/images/pm/navbar.gif);
	margin: 0;
	padding: 0;
	position: relative;
	}
	
#mainnav ul li	{
	margin: 0;
	padding: 0;
	list-style: none;
	position: absolute;
	top: 0;
	}
	
#mainnav ul li, #mainnav a	{
	height: 26px;
	display: block;
	border: none;
	}

#mainnav ul li a	{
	text-indent: -9999px; 
	text-decoration: none;
	padding: 0px;
	}
			
	
/* up states */
#routeandstations {left: 0; width: 173px;}
#construction {left: 173px; width: 148px;}
#planninganddesign {left: 321px; width: 183px;}
#abouttheproject {left: 504px; width: 178px;}
#library {left: 682px; width: 97px;}

/* over states */
#routeandstations a:hover {background: transparent url(/v3/images/pm/navbar.gif) 0 -26px no-repeat;}
#construction a:hover {background: transparent url(/v3/images/pm/navbar.gif) -173px -26px no-repeat;}
#planninganddesign a:hover {background: transparent url(/v3/images/pm/navbar.gif) -321px -26px no-repeat;}
#abouttheproject a:hover {background: transparent url(/v3/images/pm/navbar.gif) -504px -26px no-repeat;}
#library a:hover {background: transparent url(/v3/images/pm/navbar.gif) -682px -26px no-repeat;}

/* on states for 2nd-tier pages */
#routeandstations_on {left: 0; width: 173px; background: url(/v3/images/pm/navbar_routeandstations_on.gif) 0 0 no-repeat;}
#construction_on {left: 173px; width: 148px; background: url(/v3/images/pm/navbar_construction_on.gif) 0 0 no-repeat;}
#planninganddesign_on {left: 321px; width: 183px; background: url(/v3/images/pm/navbar_planninganddesign_on.gif) 0 0 no-repeat;}
#abouttheproject_on {left: 504px; width: 178px; background: url(/v3/images/pm/navbar_abouttheproject_on.gif) 0 0 no-repeat;}
#library_on {left: 682px; width: 97px; background: url(/v3/images/pm/navbar_library_on.gif) 0 0 no-repeat;}



/***************** Top Content for home and 2nd-tier pages ****************************/


#homeheader {	/* height of navbar plus homeimage */
	width: 860px;
	height: 271px;
	position:relative;
	margin: 0;
	}

#homearea {
	width: 860px;
	position: relative;
	float: left;
	margin: 0;
	border-bottom: 3px solid #e06f1d;
	background-color: #464849;
	clear:both;
	}
	
	
	
	
	
	#homenews {
		width: 247px;
		height: 227px;
		position: relative;
		float: left;
		margin: 0;
		background-image: url(/v3/images/pm/home_news_bg.gif);
		background-repeat: repeat-y;
		padding: 10px 20px 0 20px;
		}
		#homenews h2 {
			color: #fff;
			}
		#homenews li{
			background: url(/v3/images/pm/bullet_home.gif) no-repeat 0 4px;
			}
		#homenews a { 
			text-decoration: none;
			border-bottom: 1px dotted #666;
			color: #fff;
			}
		#homenews a:hover { 
			text-decoration: none;
			border-bottom: 1px dotted #fff;
			color: #fff;
			}
			
			
	#homeimage {
		width: 573px;
		position: relative;
		float: left;
		margin: 0;
		}
		
		
		
		
		
		
		
	
p.homedesc {
	font: bold 90%/110% Arial, Helvetica, sans-serif;
	text-align: center;
	color: #e06f1d;
	clear: both;
	padding: 20px 0 0 0;
	}
p.growingplaces {
	font: normal 80%/115% Arial, Helvetica, sans-serif;
	text-align: left;
	color: #666;
	clear: both;
	padding: 10px;
	border: 1px solid #666;
	margin: 25px 0 15px 119px;
	width: 600px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	}
p.pullquote {
	font: italic 115%/125% Arial, Helvetica, sans-serif;
	color: #e06f1d;
	clear: both;
	padding: 20px;
	}


#contentheader {	/* height of navbar plus contentimage */
	width: 860px;
	height: 124px;
	position:relative;
	margin: 0;
	}
#contentimage {
	width: 860px;
	position:relative;
	float: left;
	margin: 0;
	border-bottom: 3px solid #e06f1d;
	clear:both;
	}

	
/***************** Content for all pages ****************************/
	

#container {			/* 900px total width */
	position: relative;
	background: #ffffff;
	width: 860px !important;
	height: auto;
	margin: 10px auto 19px auto;
	padding: 0px 19px 0px 19px;
	border: 1px solid #0e549a;
	}
		
#content {
	position: relative;
	width: 860px !important;
	margin: 0px;
	float: left;
	}
	
* html #content {
  margin-top: 20px;
}


img.corner {
   border: none;
   text-align: right;
   display: block !important;
}

#nav_top {
	float: right;
	background-image: url(/v3/images/pm/bullet_up.gif);
	background-position:left;
	background-repeat: no-repeat;
	padding: 0 0 0 15px;
	font-size: 80%;
}

#stations h4 {
	margin: 0;
}


		
		

/***************** Below the fold content  ****************************/

#belowFold {
	width: auto;
	margin: 20px 0 0 0;
	clear: both;
	}

#news {
	clear:both;
}

.news {	/* for home page headers */
	}

#news_item1, #news_item2, #news_item3 {
	position: relative;
	float: left;
	width: 256px;
	padding: 0 10px 0 20px;
	border-right: 1px dashed #919395;
	_height: 174px;
	min-height: 174px;
	}
	
	#news_item2 {
		width: 271px;
	}
	#news_item3 {
		border-right:0px;
		width: 240px;
	}


	
	#contact-email-full {
		clear: both;
		/*background: url(/v3/images/pm/social-email-full.gif) no-repeat left top;*/
		margin: 16px 0 0 0;
		padding: 0 0 0 48px;
		
		padding: 0;
	}
		#contact-email-full p {
			margin: 0;
			padding: 0;
			font-weight: bold;
			color: #777;
		}
	
	
	#contact-email-full form input.query {
		font: 12px/120% Arial, Helvetica, sans-serif;
		padding: 1px 1px 1px 2px;
		width: 160px;
		height: 18px;
		border: 1px solid #2e2d2a;
		float: left;
		border-color: #2c2c2c !important;
		letter-spacing:.25px;
	}
	#contact-email-full form input.button {
		margin: 0;
		padding: 0;
		width: 48px;
		height: 22px;
		border: 0;
		float: left;
		background: url(/v3/images/structure/menu-search-button.gif) 0 0;
		cursor: pointer;
		font: 12px/100% Arial, Helvetica, sans-serif;
		color: #2c2c2c;
		vertical-align:top;
		letter-spacing:.25px;
	}			
		#contact-email-full form input.button:hover {
			background-position: -48px 0;
		}			
	
		#contact-email-full p.small {
			clear: left;
		}
			#contact-email-full p.small a {
				font-weight: normal;
				font-size: 80%;
				margin:0; padding:0;
			}
	
	




	
	
.note {
	font: 85%/100% bold Arial, Helvetica, sans-serif;
	color: #666666;
	}

/***************** Below the fold 2nd-tier content  ****************************/

#content {
	width: auto;
	margin: 0;
	clear: both;
	}

#breadcrumb {
	width: 860px;
	height: 25px;
	margin: 0;
	padding: 5px 0 0 0;
	clear:both;
	font-weight: normal;
	font-size: 75%;
	}

#columnTwo {
	width: 554px;
	padding: 15px 0 0 0;
	margin: 0 0 0 20px;
	float: left;
	}
	
	.box {
		border: 1px solid #919395;
		background-color: #eee;
		padding: 15px;
		margin: 10px 60px 0 60px;
		}
		.box h3 {
			margin-top: 0;
		}
	
#columnOne {
	width: 266px;
	margin: 0 0 0 20px;
	padding: 0;
	float: left;
	}
	#sidemenu {
		border-left: 1px solid #E06F1D; 
		padding: 13px 0 15px 30px;
		margin: 30px 0 0 15px;
		position: relative;
		}
		#columnOne h2 {
			font: bold 95%/100% Arial, Helvetica, sans-serif;
			color: #333333;
			margin: 6px 0 8px 0;;
			padding: 0;
			color: #0e549a;
			border: 0;
		}
		
		#sidemenu ul {
			font: 90%/170% Arial, Helvetica, sans-serif;
			padding: 10px 20px 15px 34px;
			margin: 0 0 0 0;
			list-style: url(/v3/images/pm/bullet_sidemenu.gif);
			}
		#sidemenu li {
			margin: 0 0 5px 0;
			padding: 0 0 0 0;
			}
		#sidemenu ul.bookmark {
			list-style: none;
			padding: 0;
		}
			#sidemenu ul.bookmark li a {
				background: url(/v3/images/downarrow.gif);
				background-position: right;
				background-repeat: no-repeat;
				padding-right: 12px;
			}
		
		div.sidebar-item {
			margin: 50px 0 25px 47px;
			clear: both;
		}
		
		
		div.sidebar-item p.download a {
			padding-left: 37px;
			padding-bottom: 15px;
			background: url(/v3/images/download.gif) no-repeat 0 0;
			clear: both;
			border: 0;
			display: block;
		}
			div.sidebar-item p.download a span.secondary {
				font: 80%/150% "Trebuchet MS", Arial, Helvetica, sans-serif;
				color: #aaa;
			}
		
		
		.sidebar-item-box {
			background: url(/v3/images/pm/sidebar-box-bg.gif) repeat-y;
			margin: 0 0 15px 0;
			clear: both;
		}
			.sidebar-item-box-top {
				background: url(/v3/images/pm/sidebar-box-top.gif) no-repeat;
				padding: 5px 11px 0 11px;
				min-height: 50px;
			}
			.sidebar-item-box-bottom {
				background: url(/v3/images/pm/sidebar-box-bottom.gif) no-repeat;
				height: 8px;
				clear: both;
			}
				/* get involved include */
				#contact-twitter a, #contact-youtube a, #contact-flickr a, #contact-facebook a, #contact-email a {
					width: 30px;
					height: 30px;
					float: left;
					margin: 12px 18px 0 0;
					padding: 0;
					background-position: 0 0;
					text-decoration: none;
					border: 0;
				}
					#contact-facebook a {
						background: url(/v3/images/pm/social-facebook.gif) no-repeat;
					}
					#contact-twitter a {
						background: url(/v3/images/pm/social-twitter.gif) no-repeat;
					}
					#contact-youtube a {
						background: url(/v3/images/pm/social-youtube.gif) no-repeat;
						margin-right: 0;
					}
					#contact-flickr a {
						background: url(/v3/images/pm/social-flickr.gif) no-repeat;
						margin-left: 24px;
					}
					#contact-email a {
						background: url(/v3/images/pm/social-email.gif) no-repeat;
					}
				#contact-twitter a:hover, #contact-youtube a:hover, #contact-flickr a:hover, #contact-facebook a:hover, #contact-email a:hover {
					background-position: -30px 0;
					text-decoration: none;
					border: 0;
				}
				
		
		#bridgelink a {
			display: block;
			width: 181px;
			height: 93px;
			background-image: url(/v3/images/pm/bridgelink.jpg);
			border: none;
			}
			#bridgelink a:hover {
				background-position: -181px;
				}
		
		#bridgegallerylink a {
			display: block;
			width: 181px;
			height: 87px;
			background-image: url(/v3/images/pm/bridgegallerylink.jpg);
			border: none;
			}
			#bridgegallerylink a:hover {
				background-position: -181px;
				}
				
		#facebooklink a {
			display: block;
			width: 181px;
			height: 61px;
			background-image: url(/v3/images/pm/facebooklink.gif);
			}
			#facebooklink a:hover {
				background-position: 0 -61px;
				}
				
		
		
		
	
#lowerContent {
	clear:both;
	text-align:center;
}




/***************** Footer ****************************/

#footer  {
	position: relative;
	width: 860px;
	text-align: center;
	margin: 20px 0 10px 0;
	padding: 0px;
	float: left;
	color: #999999;
	font-size: 70%;
	line-height: 110%;
	clear: both;
    }

#footer a {
	color: #999999;
	font-weight: normal;
	border: none;
	}

#footer ul {
	list-style: none;
	margin: 0px;
	padding: 5px 0 0 0;
	}
	
#footer ul li {
	margin: 0px;
	padding: 0px;
	float:left;
	}
	

div#qTip {
	padding: 3px 5px 3px 5px;
	border: 1px solid #000000;
	display: none;
	background: #919395;
	color: #ffffff;
	font: bold 80%/150% Arial, Helvetica, sans-serif;
	text-align: left;
	position: absolute;
	z-index: 1000;
	max-width:300px;
	}

#footer_icons {
	display: none;
	/*text-align: center;
	color: #666666;
	padding:10px;
	font: normal 125%/150% Arial, Helvetica, sans-serif;
	*/
	}
#footer_icons a {
	color: #666666;
	}
#footer_icons img {
	margin:0 3px 0 0;
	}


/***************** Popup ****************************/

#slideshow_container {
	margin: 10px auto;
	width: 690px;
}
#video_container {
	margin: 10px auto;
	padding: 0;
	width: 800px;
	border: 1px solid #000;
	background-color: #000;
}






#container #content #columnTwo form {
	margin: 0px;
	padding: 0px;
}
#container #content #columnTwo p {
}




/***************** Global ****************************/

#share {
	position: absolute;
	top: -25px;
	font: 80%/80% Arial, Helvetica, sans-serif;
}
#share-home {
	position: absolute;
	top: -95px;
	right: 0px;
	font: 80%/80% Arial, Helvetica, sans-serif;
}
	#share a, #share-home a {
		border: none;
		float: left;
		margin: 0 5px 0 0;
		padding: 0;
	}

	
