/* CSS Document */

.printonly{ display: none; }

body{
	background: #80c242;
	margin: 0;
	padding: 0;
}

.wrapper{
	width: 994px;
	margin: 0 auto;
}

.header{
	display: block;
	width: 994px;
	height: 133px;
	background: url(_gfx/cmn/header.png) 0 0 no-repeat;
	margin: 10px 0 0 0;
	padding: 0;
}

.clearfix:after
{ 
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}

.content{
	width: 994px;
	background: url(_gfx/cmn/content_bg.png) 0 0 repeat-y;
	margin: 0;
	padding: 0;
}

.content_left{
	width: 415px;
	float: left;
	margin-top: 75px;
}


.content_right{
	display:block;
	float:right;
	width: 531px;
	height: 590px;
}

.footer{
	width: 994px;
	background: url(_gfx/cmn/footer_bg.png) 0 0 no-repeat;
	margin: 0;
	padding: 0;
}

.top_link{
	display: block;
	height: 99px;
	padding-top: 9px; 
}

.sched_table{ color: #25408f; font-family: Arial, Helvetica, sans-serif; font-size: 8pt; margin-left: 125px;}
.sched_table tr td{ width: 55px !important; border: none; text-align: center;}
.sched_table .alt{ background: #e2f1cf; }

/**different content backgrounds**/
.mainblue{ background: url(_gfx/home/contentright_bg.png) 0 0 no-repeat;}
.crosstown{ background: url(_gfx/int/contentright_cross.png) 0 0 no-repeat;}
.tide{ background: url(_gfx/int/contentright_tide.png) 0 0 no-repeat;}
.sunset{ background: url(_gfx/int/contentright_sunset.png) 0 0 no-repeat;}
.green_int{ background: url(_gfx/int/contentright_green.png) 0 0 no-repeat;}
.beach{ background: url(_gfx/int/contentright_beach.png) 0 0 no-repeat;}
.downtown{ background: url(_gfx/int/contentright_downtown.png) 0 0 no-repeat;}

/**right side links**/
.links{position: relative; list-style: none; margin: 0; left: 150px; top: 30px; text-indent: -4000px;}
html>body .links{width: 250px;}
* + html .links{ position: relative; top: 30px; left: 180px;}
* html .links{ margin: 30px 0 0 180px; }
* html .links li{ float: left; }
*:first-child+html .links li{ margin: 0; padding: 0; float: left; }
.links .system a{margin: 0; display: block; width: 93px; height: 21px; float: left; }
.links .schedule a{ margin: 0; display: block; width: 125px; height: 21px; float: left;}
body:last-child:not(:root:root) .links { left: 150px; }
body:last-child:not(:root:root) .links .schedule a { margin-left: 105px; }
@media all and (min-width: 0px) {
         body:not(:root:root) .links { left: 150px; }
}
@media all and (min-width: 0px) {
         body:not(:root:root) .links .schedule a { margin-left: 105px; }
}

.mainblue .system a{ background: url(_gfx/home/mainlinks.png) 0 0 no-repeat; }
.mainblue .schedule a{  background: url(_gfx/home/mainlinks.png) -91px 0 no-repeat;}
.crosstown .system a{ width: 105px; background: url(_gfx/int/crosslinks.png) 0 0 no-repeat; }
.crosstown .schedule a{  background: url(_gfx/int/crosslinks.png) -105px 0 no-repeat;}
.sunset .system a{ width: 105px; background: url(_gfx/int/sunsetlinks.png) 0 0 no-repeat; }
.sunset .schedule a{  background: url(_gfx/int/sunsetlinks.png) -105px 0 no-repeat;}
.tide .system a{ width: 105px; background: url(_gfx/int/tidelinks.png) 0 0 no-repeat; }
.tide .schedule a{  background: url(_gfx/int/tidelinks.png) -105px 0 no-repeat;}
.beach .system a{ width: 105px; background: url(_gfx/int/beachlinks.png) 0 0 no-repeat; }
.beach .schedule a{  background: url(_gfx/int/beachlinks.png) -105px 0 no-repeat;}
.downtown .system a{ width: 105px; background: url(_gfx/int/downlinks.png) 0 0 no-repeat; }
.downtown .schedule a{  background: url(_gfx/int/downlinks.png) -105px 0 no-repeat;}

/**footer links**/
.top_link a{ text-indent: -4000px;}
.top_link .cosm{float: left; display: block; background: url(_gfx/cmn/cosm_logo.png) 0 0 no-repeat; width: 77px; height: 77px; margin-left: 50px;}
.top_link .gogreen{ float: right; display: block; background: url(_gfx/cmn/go_green.png) 0 0 no-repeat; width: 141px; height: 77px; margin-right: 10px;}

/**ride maps**/
.system_map {background: url(_gfx/maps/systemmap.gif) 0 0 no-repeat; display: block; width: 984px; height: 855px; margin-left: 10px;}
.crosstown_map {background: url(_gfx/maps/crosstownmap.gif) 0 0 no-repeat; display: block; width: 984px; height: 898px; margin-left: 10px;}
.sunset_map {background: url(_gfx/maps/sunsetmap.gif) 0 0 no-repeat; display: block; width: 984px; height: 898px; margin-left: 10px;}
.tide_map {background: url(_gfx/maps/tidemap.jpg) 0 0 no-repeat; display: block; width: 984px; height: 915px; margin-left: 10px;}
.beach_map {background: url(_gfx/maps/beachmap.gif) 0 0 no-repeat; display: block; width: 984px; height: 898px; margin-left: 10px;}
.downtown_map {background: url(_gfx/maps/downtownmap.gif) 0 0 no-repeat; display: block; width: 984px; height: 898px; margin-left: 10px;}

/**map links**/
.maplinks{ width: 250px; height:50px; position: relative; top: 95px; left: 605px; list-style: none; margin: 0; text-indent: -4000px;}
* + html .maplinks{ width: 250px; position: relative; top: 95px; left: 640px;}
* html .maplinks{ position: relative; top: 95px; left: 640px;}
.maplinks li{ margin: 0; padding: 0;}
* + html .maplinks li{ float: left;}
* html .maplinks li{ position: relative;float: left;}
.maplinks .system a{margin: 0; display: block; width: 105px; height: 23px; float: left;}
.maplinks .schedule a{ margin: 0; display: block; width: 105px; height: 23px; float: left;}
* + html .maplinks .schedule{ float: none;}
* html .maplinks .schedule{float: none;}
.maplinks .systemmap a{ margin: 0; display: block; width: 125px; height: 25px; }
.crosstown_map .system a{margin: 0; padding: 0; background: url(_gfx/maps/crosstownmaplinks.png) 0 0 no-repeat;}
.crosstown_map .schedule a{margin: 0; padding: 0; background: url(_gfx/maps/crosstownmaplinks.png) -105px 0 no-repeat;}
.crosstown_map .systemmap a{margin: 0; padding: 0; background: url(_gfx/maps/crosstownmaplinks.png) 0px -23px no-repeat; float: left;}
.sunset_map .system a{margin: 0; padding: 0; background: url(_gfx/maps/sunsetmaplinks.png) 0 0 no-repeat;}
.sunset_map .schedule a{margin: 0; padding: 0; background: url(_gfx/maps/sunsetmaplinks.png) -105px 0 no-repeat;}
.sunset_map .systemmap a{margin: 0; padding: 0; background: url(_gfx/maps/sunsetmaplinks.png) 0px -23px no-repeat; float: left;}
.tide_map .system a{margin: 0; padding: 0; background: url(_gfx/maps/tidemaplinks.png) 0 0 no-repeat;}
.tide_map .schedule a{margin: 0; padding: 0; background: url(_gfx/maps/tidemaplinks.png) -105px 0 no-repeat;}
.tide_map .systemmap a{margin: 0; padding: 0; background: url(_gfx/maps/tidemaplinks.png) 0px -23px no-repeat; float: left;}
.beach_map .system a{margin: 0; padding: 0; background: url(_gfx/maps/beachmaplinks.png) 0 0 no-repeat;}
.beach_map .schedule a{margin: 0; padding: 0; background: url(_gfx/maps/beachmaplinks.png) -105px 0 no-repeat;}
.beach_map .systemmap a{margin: 0; padding: 0; background: url(_gfx/maps/beachmaplinks.png) 0px -23px no-repeat; display: none;}
.downtown_map .system a{margin: 0; padding: 0; background: url(_gfx/maps/downtownmaplinks.png) 0 0 no-repeat;}
.downtown_map .schedule a{margin: 0; padding: 0; background: url(_gfx/maps/downtownmaplinks.png) -105px 0 no-repeat;}
.downtown_map .systemmap a{margin: 0; padding: 0; background: url(_gfx/maps/downtownmaplinks.png) 0px -23px no-repeat; display: none;}


.printmap a{  display: block; width: 126px; height: 30px; background: url(_gfx/printmap.gif) 0 0 no-repeat; text-indent: -4000px; margin: 0; padding: 0; color: #80c242; font-size: 8pt; font-family: Arial, Helvetica, sans-serif; position: relative; left: 435px; top: 210px;}
* + html .printmap a{ top: 230px; left: 440px;}
* html .printmap a{ top: 230px; left: 325px;}

/**fonts, etc.**/
.content_left h2, h3{margin: 0;  margin-left: 125px; padding: 0;}
.content_left p, .content_left li { font-family: Arial, Helvetica, sans-serif; font-size: 10pt; line-height: 14pt; color: #333333;}
.content_left p { margin-left: 125px;}
.content_left ul{ margin-left: 108px;}
.content_left li{ list-style: circle; list-style-image: url(_gfx/home/list_image.png); }
* + html .content_left li{ margin-left: 35px; }
* html .content_left li{ margin-left: 35px; }
.content_left ul.green li{ list-style: circle; list-style-image: url(_gfx/int/list_image.png); }
.bottom_link p, .bottom_link p a{ text-align: center; color: #fff; font-size: 8pt; font-family:Arial, Helvetica, sans-serif; margin: 15px 0;}

/**first/last rides**/
.cross_rides p{ background: url(_gfx/int/cross_ridebg.png) 0 0 no-repeat; font-size: 10pt; font-weight: bold; color: #fff; padding-left: 10px;}
.cross_schedhdr{ background: url(_gfx/int/cross_hdr.png) 0 0 no-repeat; width: 238px; font-size: 8pt !important; font-weight: bold; color: #fff !important; text-align: center; padding: 4px 0; text-transform: uppercase;}
.tide_rides p{ background: url(_gfx/int/tide_ridebg.png) 0 0 no-repeat; font-size: 10pt; font-weight: bold; color: #fff; padding-left: 10px;}
.tide_rides .two{ background: url(_gfx/int/tide_ridebg2.png) 0 0 no-repeat; font-size: 10pt; font-weight: bold; color: #fff; padding-left: 10px;}
.tide_rides .three{ background: url(_gfx/int/tide_ridebg3.png) 0 0 no-repeat; font-size: 10pt; font-weight: bold; color: #fff; padding: 2px 0 3px 10px; line-height: 11pt;}
.tide_schedhdr{ background: url(_gfx/int/tide_hdr.png) 0 0 no-repeat; width: 238px; font-size: 8pt !important; font-weight: bold; color: #fff !important; text-align: center; padding: 4px 0; text-transform: uppercase;}
.down_rides p{ background: url(_gfx/int/down_ridebg.png) 0 0 no-repeat; font-size: 10pt; font-weight: bold; color: #fff; padding-left: 10px;}
.down_rides .two{ background: url(_gfx/int/down_ridebg2.png) 0 0 no-repeat; font-size: 10pt; font-weight: bold; color: #fff; padding: 2px 0 3px 10px; line-height: 11pt;}
.down_rides .three{ background: url(_gfx/int/down_ridebg3.png) 0 0 no-repeat; font-size: 10pt; font-weight: bold; color: #fff; padding: 2px 0 3px 10px; line-height: 11pt;}
.down_schedhdr{ background: url(_gfx/int/down_hdr.png) 0 0 no-repeat; width: 236px; font-size: 8pt !important; font-weight: bold; color: #fff !important; text-align: center; padding: 5px 0; text-transform: uppercase;}
.pico_rides p{ background: url(_gfx/int/pico_ridebg.png) 0 0 no-repeat; font-size: 10pt; font-weight: bold; color: #fff; padding-left: 10px;}
.pico_schedhdr{ background: url(_gfx/int/pico_hdr.png) 0 0 no-repeat; width: 128px; font-size: 9pt !important; font-weight: bold; color: #fff !important; text-align: center; padding: 4px 0; text-transform: uppercase;}
.sunset_rides p{ background: url(_gfx/int/sunset_ridebg.png) 0 0 no-repeat; font-size: 10pt; font-weight: bold; color: #fff; padding-left: 10px;}
.sunset_schedhdr{ background: url(_gfx/int/sunset_hdr.png) 0 0 no-repeat; font-size: 8pt !important; font-weight: bold; color: #fff !important; text-align: center; padding: 2px 0; text-transform: uppercase;}
.beach_rides p{ background: url(_gfx/int/beach_ridebg.png) 0 0 no-repeat; font-size: 10pt; font-weight: bold; color: #fff; padding-left: 10px;}
.beach_schedhdr{ background: url(_gfx/int/beach_hdr.png) 0 0 no-repeat; font-size: 8pt !important; font-weight: bold; color: #fff !important; text-align: center; padding: 2px 0; text-transform: uppercase;}

/**color classes**/

.blue{ color: #0065a4;}
.green{ color: #8cc63f;}
.red{ color: #e82f2e;}
.teal{ color: #00abac;}
.purple{ color: #922e8e;}
.orange{ color: #ea7e23;}
.sixtyseven{ font-family: Arial, Helvetica, sans-serif;}
.ninetyfive{ font-family: Arial Black, Arial, Helvetica, sans-serif;}
.downtown-color{color:#00b1b0;}


/**CSS image links**/

.header h1{
	text-indent: -4000px;
	margin: 0;
	padding: 0;
	float: left;
}

.header h1 a{
	display: block;
	width: 150px;
	height: 60px;
	margin: 0;
	padding: 0;
	position:relative;
	left:40px;
	top:55px;
	
}

.nav
{
	float: left;
    margin:0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}

.nav li
{
	float: left;
    margin:0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
	background: none;
	list-style: none;
	position: relative;
	top: 40px;
	margin: 0 9px 0 0;
	left: 64px;	
}

.nav li a, .nav li a:hover, .nav li a:visited{
	display:block;
	height:81px; 
	float:left;
    margin:0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
	text-indent: -2000px;
	/*position: relative;*/
}

.nav li.crosstown a {
	width:83px;
	}


.nav li.sunset a {
	width:83px;
	}

.nav li.downtown{
	margin-right:109px;
}

.nav li.downtown a {
	width:83px;
	}
	
.nav li.beach a {
	width:83px;
	}
.nav li.fares{
	top: 70px;
	
}

.nav li.fares a {
	width:35px;
	height: 25px;
	right: 90px;
	}
.nav li.contact{
	top: 70px;
}
.nav li.contact a {
	width:61px;
	height: 25px;
	right: 90px;
	}
.nav li.gogreen	{
	margin-right:45px;
}
.nav li.gogreen a {
	right: 75px;
	width:140px;
	right: 90px;
	}

.nav li.bluebus a {
	width:90px;
	right: 30px;
	}
	
.spacer {
	width: 95px;
}