/**
	Triangle Transit master screen stylesheet 
		by Chris Jones, Web Developer, OnWired LLC
		http://onwired.com
		copyright (c) 2008 Triangle Transit

	** Organization **
		1. Layout
		2. Typography
		3. Colors, borders, link styles
		4. Background images & colors
		5. Image replacement
		6. Forms
		7. Tables
**/



/***
	1. Layout
***/

#page {
	width: 610px;
	margin: 0 auto;
}

#masthead {
	position: relative;
	margin-bottom: -6px;
}


/* H1 logo & branding */
#masthead h1 {
	position: absolute;
	top: 0; left: 25px;
	height: 75px; width: 290px;
}
#masthead h1 a {
	display: block;
	width: 290px;
	height: 75px;
}


/* Call out links */
ul#call_out {
	position: absolute;
	top: 0; right: 15px;
	height: 70px; width: 245px;
}
ul#call_out li {
	height: 70px; width: 75px;
	float: left;
	margin-right: 10px;
}
ul#call_out li#transit_future { margin-right: 0; }
ul#call_out li a {
	display: block;
	height: 70px; width: 75px;
}


/* Rider alerts */
#rider_alerts {
	width: 565px;
	margin-left: 5px;
	padding: 105px 10px 0 25px;
	overflow: hidden;
}
.alerts { 
	float: left;
	width: 455px;
}
#all_alerts { float: right; }


/* Main nav */
#main_nav {
	position: relative;
	height: 28px; width: 588px;
	padding-left: 22px;
}
#main_nav li {
	float: left;
	height: 22px;
	margin-right: 10px;	
}
#main_nav li a {
	display: block;
	height: 22px;
}
#main_nav li#maps_nav,
#main_nav li#maps_nav a		{ width: 130px; }
#main_nav li#fares_nav,
#main_nav li#fares_nav a	{ width: 62px; }
#main_nav li#ride_nav,
#main_nav li#ride_nav a 	{ width: 102px; }
#main_nav li#news_nav,
#main_nav li#news_nav a		{ width: 62px; }
#main_nav li#contact_nav,
#main_nav li#contact_nav a 	{ width: 92px; }
#main_nav li#about_nav,
#main_nav li#about_nav a	{ width: 83px; margin: 0 0 0 1px; }


/* Primary & Secondary Content */
#primary,
#secondary {
	width: 600px;
	margin-left: 5px;
}

#primary { padding: 15px 0; }
#home #primary { padding: 10px 0; }

#secondary { padding-bottom: 15px; }


/* Trip planner */
#trip_planner {
	float: left;
	width: 239px;
	margin-left: 5px;
	position: relative;
}

#trip_planner h2,
#trip_planner p.current_time {
	width: 209px;
}
#trip_planner h2 {
	padding: 10px 15px;
}
#trip_planner p.current_time {
	padding: 0 15px 10px 15px;
	margin-bottom: 0;
}

#trip_planner form {
	width: 224px;
	margin: 0 0 5px 15px;
}

#trip_planner p {
	margin-bottom: 6px;
}

#trip_planner p#trip_planner_help,
#trip_planner p#trip_planner_help a {
	height: 25px; width: 25px;
	margin: 0; padding: 0;
	
}
#trip_planner p#trip_planner_help {
	position: absolute;
	top: 4px; right: 7px;
}
#trip_planner p#trip_planner_help a {
	display: block;
	text-indent: -9999px;
}


/* Featured image */
#feature {
	float: right;
	width: 342px;
	margin-right: 5px;
}


/* Main content */
#main_content {
	float: right;
	width: 413px;
	margin-right: 20px;
}
body#misc #main_content {
	margin-right: 0;
	width: 560px;
	padding: 0 20px;
}


/* Sub content (left-hand menu) */
#sub_nav {
	/*float: left;*/
	width: 130px;
	margin-left: 17px;
}
#sub_nav li { 
	width: 130px;
	margin: 0;
	padding: 0;
}
#sub_nav a {
	display: block;
	width: 112px;
	margin: 0;
	padding: 8px;
}
#sub_nav img {
	margin: 75px 0 0 23px;
}
#sub_nav p {
	width: 84px;
	margin: 25px 0 0 23px;
}

.facebooklink {
	text-align: center;
	margin-top: 10px;
}

/* Search bar */
#search_bar {
	width: 590px;
	margin-left: 5px;
	margin-bottom: 15px;
}
#search_bar h3 {
	float: left;
}
#search_bar form {
	width: 560px;
	padding: 0 15px 3px 15px;
	text-align: right;
}


/* Search Results */
ol#search_results {
	list-style: none;
	border-top: 1px solid #fcb034;
}
ol#search_results li {
	margin-left: 0;
	padding-top: 15px;
	border-bottom: 1px solid #fcb034;
}
ol#search_results ul li {
	margin-left: 18px;
	padding-top: 0;
	border: 0;
}
ol#search_results p {
	margin-bottom: 0;
}


/* Quick Links */
#quick_links {
	float: left;
	width: 390px;
	margin-left: 15px;
}
#quick_links li {
	float: left;
	width: 130px;
	margin-right: 0;
	font-size: .9em;
}


/* Go Triangle badge */
#secondary p#gotriangle {
	float: right;
	width: 175px; height: 76px;
	padding-right: 5px;	
}


/* Footer */
#footer {
	width: 610px;
	margin: 0px auto;
	padding-top: 5px;
}


/* Clear floats */
.clear:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}



/***
	2. Typography
***/

body {
	font-size: .8em; /* slightly more than 12px base - changed by Allison - was .75em which equals 12px*/
	font-family: "Trebuchet", "Trebuchet MS", sans-serif;
}

#feature h2 { display: none; }


/* Rider Alerts */
#rider_alerts {
	font-size: 1em;
	line-height: 1.5;
	font-weight: bold;
}


/* Trip Planner */
#trip_planner {
	/* font-family: Tahoma, sans-serif; */
}

#trip_planner h2,
#trip_planner label { 
	font-weight: bold;
}

#trip_planner h2 {
	font-size: 1.166666em;
}


/* Main content */
#main_content h2 {
	font-size: 1.5em;	/* 18px */
	line-height: 1;		/* 18px */
	margin-bottom: 1em; /* 18px */
	font-weight: bold;
}

#main_content h3 {
	font-size: 1.166666em; /* 14px */
	line-height: 1.285714; /* 18px */
	margin-bottom: 0.75em; /* 12px */
	font-weight: bold;
}

#main_content p,
#main_content li {
	font-size: 1;
	line-height: 1.5;
}
#main_content p,
#main_content ol,
#main_content ul {
	margin-bottom: 1.5em;
}
#main_content li {
	margin-left: 30px;
}
#main_content ul#site_map ul{
	margin-bottom: 0;
}
#main_content ul ul { margin-bottom: 0; }

#main_content blockquote#blurb {
	font-weight: bold;
	font-style: italic;
}


/* Rider alerts */
#main_content h2.rider_alert_title {
	margin-bottom: 0;
}

#main_content ul.rider_alert_date li {
	font-style: italic;
	margin-left: 16px;
}


/* Sub content (left-hand menu) */
#sub_nav p {
	font-size: 0.916666em;
	text-align: right;
}


/* Search bar */
#search_bar h3 {
	font-weight: bold;
	font-size: 1.166666em;
	margin-top: 5px;
}


/* Quick links */
#quick_links {
	font-size: 1em;
	line-height: 1.5;
}


/* Footer */
#footer {
	text-align: center;
	font-size: 1em;
	line-height: 2;
}
#footer img { margin-bottom: -3px; }



/***
	3. Colors, borders, link styles
***/

/* Rider alerts */
#rider_alerts a {
	color: #fff;
	text-decoration: none;
}
#rider_alerts a:hover { text-decoration: underline; }
#rider_alerts p span { background-color: #55893d; padding: 1px 2px;}



#trip_planner {	color: #fff; }

#search_bar h3 { color: #fff; }



/* Quick links */
#quick_links a { 
	color: #231f20;
	text-decoration: none;
}
#quick_links a:hover { 
	color: #0065a4;
	text-decoration: underline;
}


/* Main content */
#main_content {
	color: #231f20;
}
#main_content h2 {
	color: #0065a4;
}
#main_content h3 {
	color: #6db33f;
}
#main_content a {
	color: #0065a4;
	text-decoration: none;
}
#main_content a:hover {
	color: #fcb034;
	text-decoration: underline;
}


/* Sub content (left-hand menu) */
#sub_nav ul {
	border-style: solid;
	border-color: #609fc8;
	border-top-width: 1px;
}

#sub_nav a {
	color: #fff;
	background-color: #2c7fb6;
	text-decoration: none;
	border-style: solid;
	border-color: #609fc8;
	border-width: 0px 1px 1px 1px;
}
#sub_nav a:hover,
#sub_nav li.here a { background-color: #0066a4; }

#sub_nav p { color: #FFFFFF; }

/* Join Our Team link (in the left-hand menu under employee testimonials) */

#join_our_team a {color: #fff;
	text-decoration: none;
        font-size: 0.916666em;
	text-align: right;
}

#join_our_team a:hover {
	color: #fcb034;
	text-decoration: underline;
}


/* Footer */
#footer a {
	color: #fff;
	text-decoration: none;
}
#footer a:hover {
	text-decoration: underline;
}


/***
	4. Background Images & Colors
***/

body 			{ background: #67a73e url(/images/body_bg.gif) repeat-x top left; }
#page	 		{ background: transparent url(/images/top_bg.png) repeat top left;}
#rider_alerts 	{ background: #6cb33e url(/images/rider_alerts_bg.jpg) no-repeat top left; }
#main_nav 		{ background: transparent url(/images/main_nav_bg.png) no-repeat top left; }
#home #main_nav { background: transparent url(/images/main_nav_home_ie_bg.gif) no-repeat top left; }
#primary		{ background: #fff url(/images/primary_bg.gif) repeat-y top left; }
#home #primary,
#misc #primary	{ background-image: none; }
#secondary		{ background-color: #fff; }
#trip_planner	{ background: transparent url(/images/trip_planner_bg_top.gif) no-repeat top left; }
#trip_planner p.current_time { background: transparent url(/images/trip_planner_bg_bottom.gif) no-repeat bottom left; }
#search_bar		{ background: #6aae3e url(/images/search_bar_bg_top.gif) no-repeat top left; }
#search_bar form{ background: transparent url(/images/search_bar_bg_bottom.gif) no-repeat bottom left; }
#main_content ul li { list-style-image: url(/images/main_content_li_bg.gif); }
#footer			{ background: transparent url(/images/footer_bg.gif) no-repeat top left; }



/***
	5. Image Replacement
***/

/* h1 logo branding */
#masthead h1 { background: transparent url(/images/h1_bg.jpg) no-repeat top left; }
#masthead h1 a { text-indent: -9999px; }


/* Call out links */
ul#call_out li a { text-indent: -9999px; }
ul#call_out li#take_the_bus a { background: transparent url(/images/call_out_li_bus.jpg) no-repeat 0 0; }
ul#call_out li#take_the_van a { background: transparent url(/images/call_out_li_van.jpg) no-repeat 0 0; }
ul#call_out li#transit_future a { background: transparent url(/images/call_out_li_future.jpg) no-repeat 0 0; }
ul#call_out li#take_the_bus a:hover { background: transparent url(/images/call_out_li_bus.jpg) no-repeat center bottom; }
ul#call_out li#take_the_van a:hover { background: transparent url(/images/call_out_li_van.jpg) no-repeat center bottom; }
ul#call_out li#transit_future a:hover { background: transparent url(/images/call_out_li_future.jpg) no-repeat center bottom; }

/* Main nav links */
#main_nav li a {
	background: transparent url(/images/main_nav_li_bg.jpg) no-repeat top left;
	text-indent: -9999px;
}
#main_nav li#maps_nav a			{ background-position: 0 0; }
#maps #main_nav li#maps_nav a,
#main_nav li#maps_nav a:hover	{ background-position: -130px 0; }

#main_nav li#fares_nav a		{ background-position: 0 -22px; }
#fares #main_nav li#fares_nav a,
#main_nav li#fares_nav a:hover	{ background-position: -130px -22px; }

#main_nav li#ride_nav a		 	{ background-position: 0 -44px; }
#bus #main_nav li#ride_nav a,
#main_nav li#ride_nav a:hover 	{ background-position: -130px -44px; }

#main_nav li#news_nav a			{ background-position: 0 -66px; }
#news #main_nav li#news_nav a,
#main_nav li#news_nav a:hover	{ background-position: -130px -66px; }

#main_nav li#contact_nav a		{ background-position: 0 -88px; }
#contact #main_nav li#contact_nav a,
#main_nav li#contact_nav a:hover{ background-position: -130px -88px; }

#main_nav li#about_nav a		{ background-position: 0 -110px; }
#about #main_nav li#about_nav a,
#main_nav li#about_nav a:hover 	{ background-position: -130px -110px; }



/***
	6. Form elements
***/
button {
	background: none;
	border: none;
	outline: none;
	margin: 0;
	padding: 0;
	cursor: pointer;
}

input {
	margin: 0;
	padding: 3px 5px;
}
input.text_box {
	border-style: solid;
	border-width: 1px;
	border-color: #444 #888 #888 #444;
}
input.radio_button { border: 0; }

#misc legend { display: none !important; }

/* Trip Planner */
#trip_planner input.text_box {
	margin: 0 0 0px 0;
	width: 197px;
}

#trip_planner select {
	margin-right: 3px;
	margin-bottom: 5px;
	width: 63px;
}

#trip_planner button {
	vertical-align: middle;
}


/* Search bar */
#search_bar input {
	width: 130px;
	margin-top: 2px;
	padding: 1px 5px;
}
#search_bar button {
/* 	padding-top: 1px; */
	vertical-align: middle;
}


/***
	7. Tables
***/

#misc table { 
	width: 415px; 
	margin-bottom: 1em;
}

#login td {	
	border: 1px solid #FCB034; 
	padding: 5px;
}

.no_formatting_table {
	text-align: left;
}

.no_formatting_table td {
	margin: 10px;
    vertical-align: top;
    padding: 0;
}

.orange_borders_table {
	border: 1px solid #FCB034;
	width: 415px;
	text-align: left;
}

.orange_borders_table tr td {
	border: 1px solid #FCB034;
	padding: 3px;
}

.orange_borders_table tr th {
	border: 2px solid #0065A4;
	background-color: #0065A4;
	color: #FFFFFF;
	padding: 3px;
	font-weight: bold;
}

.staff,
.position,
.phone {
	width: auto;
}

.email {
	width: 18px;
}