@charset "UTF-8";
/* CSS Document */

/*******************************/
/* HTML/BODY TAGS              */
/*******************************/
html { height: 100%;}
body {
	font-family: "Trebuchet MS", Helvetica, Verdana, Arial, sans-serif;
	margin:0px;
	text-align: left;
	background: url(../images/home_bg.jpg) repeat-x #2d2d2d;
	font-size: 12px;
	color: #555;
	height: 100%;
}
* {margin:0; padding:0;}

/*******************************/
/* COMMON BASE TAGS            */
/*******************************/
a, a:link, a:visited {color:#57aad9; text-decoration: none; border: 0;}
a:hover, a:active {text-decoration:none; color:#999}
a i {visibility:hidden;}
a img {border:0;}
h1 {font-size:20px; font-weight:bold; padding: 30px 0 15px 0; color:#26ade4;}
h2 {font-size:16px; font-weight:normal; padding-bottom: 7px; color:#ffe14f;}
h3 {font-size:12px; font-weight:bold; padding: 0px 0 2px 0; color:#333333}
h4 {font-size:16px; font-weight:normal; padding-bottom: 3px; color:#212121;}
p {margin-bottom: 8px; padding-bottom: 5px; color: #ffffff}
p2 {margin-bottom: 10px; color: #212121}
ul {padding-bottom:15px;}
ul li {margin-left:0px;}
ul li ul li {color: #ffffff}
ol {list-style-position: inside; color: #ffffff;}
.transparent {
filter:alpha(opacity=80);
-moz-opacity:0.8;
-khtml-opacity: 0.8;
opacity: 0.8;
}
.clearfix {clear: both; font: 1px/1px sans sarif;}

#wrapper {width: 902px; margin: 0 auto; position: relative; min-height: 100%;}
#header {height: 168px; position: relative;}
#logo {width: 250px; float: left; padding: 0 0 0 20px;}
#social {width: 215px; height: 104px; background: url(../images/blue_social_sign.jpg); position: absolute; top: 15px; right: 60px;}
#twitter a {width: 196px; height: 14px; position: absolute; top: 21px; right: 10px; background: url(../images/social_twitter.gif) no-repeat; background-position: top; text-indent: -9999px;}
#twitter a.rollover:hover {background-position: bottom;}
#share a {width: 196px; height: 17px; position: absolute; top: 40px; right: 10px; background: url(../images/social_share.gif) no-repeat; background-position: top; text-indent: -9999px;}
#share a.rollover:hover {background-position: bottom;}
#blog a {width: 196px; height: 17px; position: absolute; top: 59px; right: 10px; background: url(../images/social_blog.gif) no-repeat; background-position: top; text-indent: -9999px;}
#blog a.rollover:hover {background-position: bottom;}
#main_banner {height: 280px; width: 902px; position: relative; background: url(../images/roadtrip_banner.jpg) no-repeat;}
#green_banner {width: 902px; height: 49px; position: absolute; top: -49px;}

#get_ad_button {width: 306px; height: 70px; position: absolute; top: 131px; right: 40px; background: url(../images/get_ad_button.gif) no-repeat; background-position: top; text-indent:-9999px; cursor: pointer; border: none}
#get_ad_button:hover {background-position: bottom;}

/*******************************/
/* NAV TAGS                    */
/*******************************/
#nav {position: relative; width: 902px; height: 54px;}

body#home .home_button a,
body#details .details_button a,
body#story .story_button a,
body#route .route_button a,
body#driver .driver_button a,
body#faqs .faqs_button a {background-position: bottom;}

.home_button a {
width: 149px;
height: 54px;
position: absolute;
top: 0px;
left: 0px;
background: url(../images/home_button.jpg) no-repeat;
background-position: top;
}

.home_button a.rollover:hover {background-position: bottom;}

.details_button a {
width: 149px;
height: 54px;
position: absolute;
top: 0px;
left: 150px;
background: url(../images/details_button.jpg) no-repeat;
background-position: top;
}

.details_button a.rollover:hover {background-position: bottom;}

.story_button a {
width: 149px;
height: 54px;
position: absolute;
top: 0px;
left: 300px;
background: url(../images/story_button.jpg) no-repeat;
background-position: top;
}

.story_button a.rollover:hover {background-position: bottom;}

.route_button a {
width: 148px;
height: 54px;
position: absolute;
top: 0px;
left: 450px;
background: url(../images/route_button.jpg) no-repeat;
background-position: top;
}

.route_button a.rollover:hover {background-position: bottom;}

.driver_button a {
width: 149px;
height: 54px;
position: absolute;
top: 0px;
left: 599px;
background: url(../images/driver_button.jpg) no-repeat;
background-position: top;
}

.driver_button a.rollover:hover {background-position: bottom;}

.faqs_button a {
width: 149px;
height: 54px;
position: absolute;
top: 0px;
left: 749px;
background: url(../images/faqs_button.jpg) no-repeat;
background-position: top;
}

.faqs_button a.rollover:hover {background-position: bottom;}

/*******************************/
/* BUY CONTAINER TAGS          */
/*******************************/
#big_buy_bar {width: 900px; height: 61px; display: block; background: url(../images/big_buy_bar.gif) no-repeat; background-position: top; text-indent: -9999px; margin: 20px 0 5px 0; border:none; }
#big_buy_bar:hover {background-position: bottom; cursor: pointer}

/*******************************/
/* HIGHLIGHTS TAGS             */
/*******************************/
#highlights {border-bottom: 1px dotted #4C4C4C; margin: 25px 0 0px 0px; width: 902px; padding: 10px 0 20px 0}
#highlight_left {width: 265px; float: left; padding: 5px 35px 0 5px;}
#highlight_center {width: 265px; float: left; padding: 5px 35px 0 5px;}
#highlight_right {width: 290px; float: right; padding: 5px 0px 0 0;}

/*******************************/
/* EXTRAS TAGS                 */
/*******************************/
#extras_container {margin: 15px 0 0 0;}
#vehicle_panels {width: 475px; float: left; padding: 0 0 0 5px; border-right: 1px dotted #4C4C4C;}
#map_route {width: 390px; float: right;}
#map_route h2 {color: #57aad9;}
#vehicle_panels h2 {color: #57aad9;}

/*******************************/
/* COLUMNS TAGS (2)            */
/*******************************/
#columns_container {margin: 15px 0 0 0;}
#left_column {float: left;}
#left_column h3 {font-weight: bold; color: #57aad9; }
#left_column ul { list-style-type: none;}
#right_column {float: right; min-height: 70px}
#left_column h2 {color: #57aad9; }
#right_column h2 {color: #57aad9; }

.standard_line {width: 460px; padding: 0 15px 0 5px; border-right: 1px dotted #4C4C4C;}
.standard_noline {width: 460px; padding: 0 15px 0 5px;}
.standard {width: 390px; float: right;}
.wide_line {float: left; width: 550px; padding: 0 15px 0 5px; border-right: 1px dotted #4C4C4C;}
.wide_noline {float: left; width: 550px; padding: 0 15px 0 5px;}
.narrow {width: 300px;}

#buy_button {width: 300px; height: 64px; display: block; background: url(../images/ready_button.gif) no-repeat; background-position: top; text-indent: -9999px; border:none; cursor: pointer}
#buy_button:hover {background-position: bottom;}

/*******************************/
/* FOOTER TAGS                 */
/*******************************/
#footer_wrapper {margin: 30px 0 0 0; width: 100%; height: 90px; border-top: 1px solid #333333; background: #212121;}
#footer {width: 902px; margin: 0 auto; padding: 10px 0 0 0; height: 80px}
#footer p {font-size: 10px}
* html #wrapper {height: 100%;}
#wrapper {padding-bottom: 9em;}
#footer_wrapper {position: relative; margin-top: -70px;} 

