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

html { }
body {
	font-family:"Times New Roman", Times, serif;
	text-align: center;
	background:url(../images/body_bg.jpg) repeat-y top center;
	width: 100%;
	display: table
}
* {margin: 0;padding: 0}
p {
	padding-bottom:0.75em;
}
a {
	text-decoration:none;
	color:#660000;
}

a:hover {
	text-decoration:none;
	color:#FF3300;
}

ul {list-style:none;}

#contact {
	background:url(../images/contact_bg.png) top center no-repeat;
	width: 100%; height:526px; 
	margin:auto;
	position:fixed;
	z-index:1;
	border-top:#999 5px solid;
	text-align:center;
}
/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

#contactform {
	position:relative;
	width:400px; margin:auto;
	padding-top:120px;
	text-align:left
}
#contactform p{
	width: 400px;
	clear: left;
	margin: 0;
	padding: 0px 0 8px 0
}

#contactform label{
	text-indent:-9999px;
	float: left;
	width: 100px
}

#contactform input[type="text"]{
	width: 240px;
	background:url(../images/space.gif) repeat;
}

#contactform textarea {
	width: 240px;
	height: 100px
}
#x a {
	text-indent:-9999px;
	position:absolute;
	display:block;
	width:32px;
	height:41px;
	top:13px;
	right:-13px;
}
.alert {color:#FF0000; font-size: 10pt}

.field {
	width: 240px;
	border:none;
	border-bottom:#996600 1px solid;
	background:url(../images/space.gif) repeat;
}
.requireField {	color:#669999;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: bold;
	line-height: 14px;
	font-style:italic
}
.submit_reset {
	width:70px;
	border:none;
	text-indent:-999px;
	cursor:pointer;
	background:url(../images/space.gif) repeat;
}


/*.threepxfix class below:
Targets IE6- ONLY. Adds 3 pixel indent for multi-line form contents.
to account for 3 pixel bug: http://www.positioniseverything.net/explorer/threepxtest.html
*/
* html .threepxfix{
margin-left: 3px
}

/*------ ^_^ -------*/
.big_container {
		background:url(../images/bg_top.jpg) no-repeat top center;
		width:100%;
		text-align:center
}
#container {
	width: 780px;
	text-align:left;
	margin:auto;
	position:relative
}

.header {
	height: 300px; width:780px;
	position:relative
}
#clock {
	height: 100px;
	width:100px;
	position:absolute;
	left:773px;
	top:22px
}
.logo {
	display:block; 
	width:300px;
	position:relative; 
	top:130px; right: 40px;
	float:right
}
.logo a {
	text-indent:-9999px;
	display:block; 
	width:300px;height:18px;
	}

/*------------- nav */
#nav {
	position:absolute;
	left:534px;
	top: 196px;
	width:300px;
	height:180px;
}
ul#nav1 {
	position: relative;
	width:100px;height:128px;
	margin:0; padding: 0;
	}
ul#nav1 a {
	display:block;
	width:300px;height:45px;
	text-indent: -9999px;
	overflow: hidden;
}
li#btn_home {
	position:absolute;top:0;
	width:300px;height:45px;
	background:url(../images/main_nav.gif) no-repeat -300px 0;
}

li#btn_life {
	position:absolute;top:45px;
	width:300px;height:45px;
	background:url(../images/main_nav.gif) no-repeat -300px -45px;
}
li#btn_message {
	position:absolute;top:90px;
	width:300px;height:45px;
	background:url(../images/main_nav.gif) no-repeat -300px -90px;
}
li#btn_contact {
	position:absolute;top:135px;
	width:300px;height:45px;
	background:url(../images/main_nav.gif) no-repeat -300px -135px;
}
li#btn_home a:hover { background:url(../images/main_nav.gif) no-repeat 0px 0px; }
li#btn_life a:hover { background:url(../images/main_nav.gif) no-repeat 0px -45px; }
li#btn_message a:hover { background:url(../images/main_nav.gif) no-repeat 0px -90px; }
li#btn_contact a:hover { background:url(../images/main_nav.gif) no-repeat 0px -135px; }


/*--------end----nav*/


.sub_nav {
	text-align:center;
	width:285px;
	margin-bottom:25px;
	font-weight:bold
}

.sub_nav li {
	display:inline;
	padding:0 5px;
/*	border-left:#D7AC76 1px solid;  */
}
/*-----                  ------                   ---------                        ----*/


#col {
	padding:50px 40px 0px 95px ;
	text-align:left;
}

#colleft {
	width:300px;
	float:left;
	margin:0;
	font-size:11pt;
	line-height:1.3em;
	color:#660000;
	padding-top:18px
}

#colleft a, #colleft a:visited {
	color:#C7611B; 
	font-size:10pt;
}

#colleft a:hover {
	color:#660000;
}
#colleft a:active {
	color:#660000;
}

#colleft p {
	padding-top:0.5em;
}
#colleft img {
	border:#999999 2px dotted;
	text-align:center;
	padding:4px;
	margin:2px 7px 2px 0;
}
.story {
	width:210px;
	padding:10px 40px 5px 40px;
	background:url(../images/colleft_mid.png) top center repeat-y;
	clear:left;
}

.story h5 {
	font-size:21pt;
	float:left;
	padding-right:20px;
	line-height:13pt;
}
#date {
	font-size:8pt;
	float:right;
	color:#666666;
	background-color:#fff;
	border:#CCCCCC 1px dotted;
	font-weight:normal;
	margin-right:-50px;
}
#top a {
	width:75px;
	height:45px;
	background:url(../images/top.gif) -72px 0 no-repeat;
	position:absolute;
	text-indent:-9999px;
	left: 209px;
	top: 68px;
}
#top a:hover {
	background:url(../images/top.gif) top left no-repeat;
}

#top {
	text-align:center;
}
#feature, #recent, #expertise, #stories, #rides {
	display:block; width:290px; height:45px;
	text-indent:-9999px;	
	float:left;
}
#feature {background:url(../images/feature_top.png) top center no-repeat}
#recent {background:url(../images/recent_top.png) top center no-repeat}
#expertise {background:url(../images/expertise_top.png) top center no-repeat}
#stories {background:url(../images/stories_top.png) top center no-repeat}
#rides {background:url(../images/rides_top.png) top center no-repeat}

.storyend {
	width:250px; height:85px;
	float:left;
	margin-bottom:40px;
	background:url(../images/colleft_end.png) center no-repeat;
	text-align:right;
	padding-right:40px;
	font-size:9px;
	font-style:italic;
	color:#666666;
	position:relative
}

#colright {
	width:220px;
	float:right;
	margin-top:200px;
	font-size:9pt;
	line-height:1.3em;
	color:#333333;
}
#colright h4 {
	font-size:11pt;
	color:#666666;
	width:150px;
	border-bottom:#7F7F7F 1px solid;
	margin-bottom:0.5em;
	line-height:0.75em;
}
#colright a {
	color:#660000;
}
#colright a:hover {
	color:#FF3300;
}
.links {
	padding:25px 15px 0 15px;
}
#colright ul {
list-style-position:outside;
	margin-left:1.5em;
}
#colright li {
	padding-bottom:5px;	

}
.links ul {list-style:url(../images/arrow2.png)}

/*----------------*/
#note {
	text-indent:-9999px; font-size:10%;clear:both
}
.footer {
	border-top:#fff 1px solid;
	padding:.5em;
	font-size:9pt;
	color:#fff;
	text-align:center;
	background-color:#6D88AE;
	clear:both;
}
.ground {
	 height:320px;
	 width:100%;
	 clear:both; 
	 background:url(../images/ground_bg.jpg) no-repeat bottom center;
	}

.under_container {
	background-color:#96bddc;
	text-align:left;
	}
.under_col {
	width: 615px;
	text-align:left;
	margin:auto;
	padding:0px 40px 40px 95px ;
	color:#356E9A;
	font-size:10pt;
	line-height:1.5em;
	}
.under_col img {
	border:#356E9A 3px solid;
	}
/*#copy {
	width:100%;
	background:url(../images/copyright.jpg) 70% 100% no-repeat;
	}*/
	
#portfolio, #under_contact, #under_about {
	padding:80px 0 0 40px;
	float:left;
	width:500px
	}
#portfolio {background:url(../images/portfolio_bg.gif) top left no-repeat}
#under_contact {background:url(../images/contact_bg.gif) top left no-repeat}
#under_about {background:url(../images/about_bg.gif) top left no-repeat}

/* ---------- gallery styles start here ----------------------- */

.gallery {
	padding:0;
	}
.gallery li {
text-align:center;
	}

.gallery li a {
	float:left;
	display:block;
	width:65px; height:50px;
	margin:0 20px 20px 0;
	background:white;
	border:#356E9A 3px solid;
}

.gallery li img {

}
.gallery li a:hover {
	border:#fff 3px solid;
}
.gallery li {
	display:inline;  
}
.gallery img {
	border:none;
}



/*----------------------------------------------------------------*/

/*-------------rides_nav */
#rides_nav {
	width:200px;
}
ul#rides_nav1 {
	width:100px;height:128px;
	margin:0; padding: 0;
	}
ul#rides_nav1 a {
	display:block;
	width:200px;height:45px;
	text-indent: -9999px;
	overflow: hidden;
}
#rides_nav li {
	border:red 1px solid;
}
li#rides1 {
	width:200px;height:45px;
	background:url(../images/main_nav.gif) no-repeat -200px 0;
}

li#rides2 {
	width:200px;height:45px;
	background:url(../images/main_nav.gif) no-repeat -200px -45px;
}
li#rides1 a:hover { background:url(../images/main_nav.gif) no-repeat 0px 0px; }
li#rides2 a:hover { background:url(../images/main_nav.gif) no-repeat 0px -45px; }


/*--------end----nav*/