html {
	background-image: url(../i/_bkg.gif);
	background-repeat: repeat-x;
	background-color: #fcfbf9;
}

body {
	color: #330;
	font-family: helvetica, arial, sans-serif;
}


/* GENERAL STYLES */

.center 
{
text-align:center;
}


a {
	color: #CE6800;
}

a.button {
	position: relative;
	background: #5e7285;
	border-top: 1px solid #a3b5d4;
	padding: 6px 9px;	
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	border: 1px solid #a3b5d4;
	text-decoration: none;	
	text-shadow: 0 1px 0 black;
	font-size: 13px;
	font-weight: bold;
	-moz-box-shadow: 0 0 1px black;
	-webkit-box-shadow: 0 0 1px black;
}

a.button:hover {
	background: #4a5969;
}

p::selection, li::selection, a::selection {
	background: #251440;
}

p::-moz-selection, li::-moz-selection, a::-moz-selection {
	background: #251440;
}

#container {
	position: relative;
	padding-top: 15px;
	background-repeat: no-repeat;
	margin-top: 25px;
}



/* HEADER */

#header {
	position: relative;
	z-index: 1;
	background-image: url(../i/_logo.png);
	background-repeat: no-repeat;
	height: 185px;
}

	#header img {
		float: left;
	}

	#header #nav {
	float: left;
	overflow: hidden;
	}
	
		#header #nav li {
			float: left;
			background: #5e7285;
			list-style: none;
			padding: 6px 9px;
			height: 14px;
			line-height: 14px;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;
			border: 1px solid #a3b5d4;
		}
		
		#header #nav li.selected, #header #nav li:hover {
			background: #536475 url(../img/buttonBG.png) repeat-x;
			border: 1px solid #161e2a;
			/* css 3 gradient */
		}
			#nav li a {
				text-decoration: none;
				display: block;
			}
			
/*Nav-top*/
#nav {
	padding-top: 0px;
	padding-right: 0;
	padding-bottom: 0px;
	padding-left: 0;
	height: 65px;
	margin-top: 0px;
	width: 940px;
	}
#nav ul {
	background-image: url(../i/nav.jpg);
	height: 65px;
	overflow: hidden;
	width: 940px;
	}
#nav li { float: left; }
#nav a {
	height: 65px;
	overflow: hidden;
	position: absolute;
	text-indent: -9999px;
	top: 0;
	left: 41px;
	width: 19px;
	}
#nav-home a {
	left: 35px;
	width: 45px;
	background-image: url(../i/nav.jpg);
	background-position: -34px -65px;
	background-repeat: no-repeat;
}
#nav-about a {
	left: 83px;
	width: 60px;
	background-image: url(../i/nav.jpg);
	background-position: -85px -65px;
	background-repeat: no-repeat;
}
#nav-product a {
	left: 144px;
	width: 70px;
	background-image: url(../i/nav.jpg);
	background-position: -145px -65px;
	background-repeat: no-repeat;
}
#nav-services a {
	left: 221px;
	width: 65px;
	background-image: url(../i/nav.jpg);
	background-position: -220px -65px;
	background-repeat: no-repeat;
}
#nav-club a {
	left: 279px;
	width: 93px;
	background-image: url(../i/nav.jpg);
	background-position: -276px -65px;
	background-repeat: no-repeat;
}
#nav-coffee a {
	left: 550px;
	width: 50px;
	background-image: url(../i/nav.jpg);
	background-position: -550px -65px;
	background-repeat: no-repeat;
}
#nav-contact a {
	left: 620px;
	width: 100px;
	background-image: url(../i/nav.jpg);
	background-position: -615px -65px;
	background-repeat: no-repeat;
}


.trails #nav-home a { background-position: -34px -104px; }
.routes #nav-about a { background-position: -200px -104px; }
.events #nav-product a { background-position: -471px -104px; }
.oregon #nav-services a { background-position: -645px -104px; }

#nav-home a:hover {
	background-position: -34px -129px;
}
#nav-about a:hover {
	background-position: -85px -129px;
}
#nav-product a:hover {
	background-position: -145px -129px;
}
#nav-services a:hover {
	background-position: -220px -129px;
}
#nav-club a:hover {
	background-position: -276px -129px;
}
#nav-coffee a:hover {
	background-position: -550px -129px;
}
#nav-contact a:hover {
	background-position: -615px -129px;
}

#big-gear {
	background-color:transparent;
	left: 476px;
	margin-left: 250px;
	top: 4px;
	z-index: 16;
	margin-top: 135px;
	margin-right: 0px;
	margin-bottom: 0px;
	width: 176px;
	overflow: hidden;
	position: absolute;
	background-image: url(../i/bsg_bu2t.png);
	background-repeat: no-repeat;
	padding-top: 45px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	height: 100px;
	}
	#big-gear #bsg {
	width: 75px;
	height: 75px;
	margin-left: 45px;
	z-index: 20;
	}
	
#big-gear a {
	text-decoration: none;
}
#big-gear h2 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 21px;
	font-weight: bold;
	text-decoration: none;
	line-height: 21px;
	color: #630;
	text-align: center;
	padding: 0px;	
}

/* APPS */

#apps {
	padding-top: 0px;
	background-image: url(../../../Documents/CafeCyclist/Website/html/assets/i/_nav.png);
	background-repeat: no-repeat;
	height: 63px;
	margin-top: 0px;
}

	#apps ul {
		overflow: hidden;
		display: inline;
	}

		#apps ul li {
	float: left;
	list-style: none;
	text-align: center;
	margin-left: 0;
	margin-right: 45px;
	font-weight: bold;
	height: 33px;
	display: inline;
		}
		
		#apps ul li.current, #apps ul li:hover {
			background: #475665 url(../img/currentAppBG.png) repeat-x;
			border: 1px solid #28313b;
			-moz-border-radius: 10px;
			-webkit-border-radius: 10px;
			padding: 17px 15px;
			margin-top: -18px;
		}
		
		#apps ul li:not(.current):hover {
			margin-left: -15px;
			margin-right: 28px;
		}
		
			#apps ul li img {
				display: block;

			}
		
			#apps ul li a {
				text-decoration: none;
				font-size: 10px;			
			}
			
	#apps img#graphic {
		float: right;
	}

/* MAIN BANNER */

#banner {
	margin-top: 20px;
	color: #630;
	padding-left: 0px;
	position: relative;
	margin-bottom: 25px;
}

	#banner h2 {
	color: #d8dbde;
	font-size: 48px;
	line-height: 58px;
	padding-top: 31px;
	padding-bottom: 18px;
	margin-bottom: 0;
	text-shadow: 0 1px 3px black;
	margin-right: 350px;
	background-repeat: no-repeat;
	}
	
	#banner p {
	margin-top: 0;
	font-size: 20px;
	line-height: 36px;
	text-shadow: 0 1px 3px black;
	}
	
		#banner p strong {
			color: #131828;
		}
	
	#banner img#phone {
		position: absolute;
		right: 111px; top: 38px;
	}
	
	#banner img#download {
		position: absolute;
		left: 190px;
		bottom: -45px;
	}
#banner #welcome {
width: 300px;
margin-right: 50px;
padding-top: 10px;
}
.date {
text-decoration: underline;
margin-top: 30px;
padding-bottom: 10px;
color: #666666;
font-size: 14px;
}

	#banner #welcome h2 {
	font-size: 48px;
	color: #FFF;
	/*background-image: url(../i/_welcome.png);*/
	background-repeat: no-repeat;
	text-indent: -9999px;
	padding: 0px;
	margin-bottom: 10px;
	}
#banner #welcome .welcome {
	color: #FFF;
	/*background-image: url(../i/_welcome.png);*/
	background-repeat: no-repeat;
	/*text-indent: -9999px;*/
	padding: 0px;
	margin-bottom: 10px;
	}

#banner #welcome p {
	margin-top: 0px;
	font-size: 15px;
	line-height: 20px;
	text-shadow: 0 1px 3px black;
	padding-left: 0px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}

#banner #home-pic {
	width: 540px;
	margin: 0px;
	padding: 0px;
	height: 406px;
}
	
/* MAIN */

#rule {
	background-color: #330;
	height: 3px;
	width: 940px;
	margin-bottom: 10px;
	margin-top: 10px;
}

#main {
	clear: both;
	padding-top: 5px;
padding-bottom:0px;
	margin-bottom: 70px;
}

	#main h4, #main h3 {
		color: #131828;
		text-shadow: 0 1px 1px #8d97a2;
	}
	
	#main h3 {
		margin-bottom: 0;		
	}
	
	#main h4 {
		margin-bottom: 9px;
	}
	
	#main ul li {
		margin-left: 15px;
		margin-bottom: 10px;
		line-height: 18px;
		font-size: 13px;
	}
	
		#main #sub1 h3 {
			font-size: 36px;
			margin-top: -17px;
		}
		
		#main #sub1 p {
			font-weight: bold;
		}
		
		#main #sub1 li {
			list-style: none;
			float: left;
			margin-left: 0;
			margin-right: 5px;
		}
		
		#main #sub2 li {
			font-weight: bold;
			list-style: none;
			margin-left: 0;
			padding-left: 15px;
			background: url(../img/bullet.png) no-repeat 0 50%;
		}
	
		#main #sub3 {
			margin-top: 143px;
		}
		
		#main #sub3 p {
			font-size: 12px;
		}
		
			#main #sub3 p:first-child {
				background: url(../img/border2.png) repeat-x 0 100%;
				padding-bottom: 14px;
				margin-bottom: 14px;				
			}
		
		#main #sub3 li {
			background: url(../img/border2.png) repeat-x 0 100%;
			font-weight: bold;
			font-style: italic;
			padding-bottom: 14px;
			margin-bottom: 14px;
			margin-left: 0;
			list-style: none;
		}
		
		#main #sub3 li:last-child {
			background: none;
		}
#sub-services {
	margin-top: 25px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #666;
	border-right-color: #666;
	border-bottom-color: #666;
	border-left-color: #666;
	padding-top: 10px;
}

#sub-services h2 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 14px;
	color: transparent;
	padding-bottom: 10px;
	background-image: url(../i/bike_fitting.gif);
	background-repeat: no-repeat;
	text-align: left;
	text-indent: -9999px;
	background-position: -4px 0px;
	margin: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-left: 0px;
}

#sub-coffee {
	margin-top: 25px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #666;
	padding-top: 10px;
	text-align: left;
}

#sub-coffee h2 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 14px;
	color: transparent;
	padding-bottom: 10px;
	background-image: url(../i/rides_title.png);
	background-repeat: no-repeat;
	text-indent: -9999px;
	margin: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-left: 0px;
	text-align: left;
	background-position: left top;
}

#sub-signup {
	margin-top: 25px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #666;
	padding-top: 0px;
	width: 220px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
#sub-signup h2 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 14px;
	color: transparent;
	padding-bottom: 10px;
	background-image: url(../i/sub-newletter.gif);
	background-repeat: no-repeat;
	margin: 10px;
	width: 100%;
	text-indent: -9999px;
	padding-top: 0px;
	padding-right: 0px;
	padding-left: 0px;
}

#sub-signup #greenbox {
	background-color: #ced91b;
	height: 180px;
	width: 220px;
	text-align: center;
}

#sub-signup p {
	color: #300;
	padding-top: 20px;
	padding-right: 20px;
	padding-bottom: 0px;
	padding-left: 20px;
	text-align: left;
}
.form {
	margin-top: 0px;
	margin-bottom: 10px;
	width: 100%;
}

		
/* FOOTER */

#footer-wrap {
	background-color: #C60;
	color: #000;
}

	#footer {
		overflow: hidden;
		font-size: 12px;
		font-weight: bold;
		padding-bottom: 32px;
	}
	
	#footer a {
	color: #330;
	}
	
		#footer div:last-child a.button{
			display: block;	
			width: 90px;
			margin-top: 30px;	
			clear: both;		
		}
	
		#footer ul li {
			list-style: none;
			margin-left: 0;
			padding-bottom: 11px;
			margin-bottom: 15px;
			border-bottom: 1px dashed #cccccc;
		}
		
			#footer li:last-child {
				border-bottom: 0;
			}
		
			#footer li span {
				color: #85a1bc;
				display: block;
				margin-top: 5px;
			}
			
				#footer li a {
					text-decoration: none;
				}
	#footer p {
	color: #330;
	font-size: 12px;
	margin-top: 2px;
margin-bottom: 0px;
	padding: 0px;
}
		#footer h4 {
	color: #330;
	font-size: 20px;
	margin-top: 24px;
margin-bottom: 0px
	padding: 0px;
		}
		
			#footer h4 small {
				font-size: 12px;
			}
			
			#footer a.button img {
				position: absolute;
				bottom: 5px;
				right: -8px;
			}
		
	/*Twitter Feed*/
	
#footer .tweet {
	color: #330;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 10px;
	padding-left: 0px;

}

#footer .tweetdate {
	color: #333;
	display: block;	
}
			
			
/* VERY BOTTOM */
			
#bottom-wrap {
	background-color: #999;
}

#bottom {
	overflow: hidden;
	padding-top: 23px;
	padding-bottom: 30px;
}

	#bottom-wrap #bottom p:first-child {
		float: left; /* IE fix */
	}

	#bottom-wrap p, #bottom-wrap p a {
		color: #212b3f;
		font-weight: bold;
			display: inline;
	}
	
		#bottom ul {
			float: right;
			overflow: hidden;

		}
	
			#bottom li {
				list-style: none;
				float: left;
				font-weight: bold;
			}
	
				#bottom li.selected a, #bottom a:hover {
					color: white;
					text-decoration: underline;
				}

				#bottom ul li a {
					color: #97b8d8;
					text-decoration: none;
				}
	/*Product page*/
	
#product {
	margin-top: 50px;
	color: #630;
	padding-left: 0px;
	position: relative;
	margin-bottom: 150px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #333;
	background-image: url(../i/_bkg-trans.png);
	background-repeat: no-repeat;
}
#product #sub1 {
	
}

#product #sub2 {
	
}

#product #sub3 {
	
}

#product #desc {
	margin: 0px;
	padding-top: 25px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
#product #desc h2 {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: bold;
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 20px;
}
#product #desc p {
	color: #333;
	margin-left: 20px;	
}

#product #picture {
	margin: 0px;
	padding: 10px;
}

#breadcrumb {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #300;
	text-decoration: none;
	margin-left: 25px;
       height: 25px;

}

/*sub nav*/
#product-index {
	margin-top: 50px;
	padding-top: 20px;
	padding-left: 0px;
	margin-bottom: 50px;
	background-image: url(../i/_bkg-trans.png);
	background-repeat: no-repeat;
	margin-right: 0px;
	margin-left: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	width: 960px;
}

#product-index #desc {
	margin-top: 15px;
}

#product-index #img {
	margin-top: 25px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding: 0px;	
}
#product-index #thumbs {
	margin-top: 20px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #999;
	padding-top: 20px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	width: 960px;
}
#product-index #thumbs #bicycles {
	margin-top: 0px;
	margin-right: 20px;
	margin-bottom: 20px;
	margin-left: 20px;
	width: 240px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}

#product-index #thumbs .product_thumbs {
	background-image: url(../i/_desc_bkg.png);
	background-repeat: no-repeat;
	background-position: center bottom;
	text-align: center;
}
#product-index #thumbs img {
	border: 1px solid #999;	
}

#product-index #thumbs .prod_name {
color: #f27490;	
}
#sub-nav {
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0px;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 15px;
	width: 200px;
}

#sub-nav h2 {
	font-size: 26px;
	margin: 0px;
	color: #330;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}

#sub-nav ul {
	display: block;
	list-style-type: none;
	list-style-position: outside;
	list-style-image: none;
	margin: 0px;
	padding: 0px;
	text-align: left;
}

#sub-nav a {
	color: #300;
	list-style-type: none;	
}

#sub-nav ul li {
	margin: 0px;
	padding: 0px;	
}



#sub-nav .sub-cat {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #930;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #333;
	padding-left: 0px;
	margin-left: 0px;
	margin-right: 25px;
	margin-bottom: 0px;
	padding-bottom: 0px;
}

.sub-cat {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #930;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #333;
	padding-left: 0px;
	margin-left: 0px;
	margin-bottom: 5px;
}

.desc-type {
	font-size: 10px;
	margin: 0px;
	padding: 0px;
}

/* BLOG PAGES */
#blog {
	margin-top: 50px;
	padding-top: 20px;
	padding-left: 0px;
	margin-bottom: 50px;
	background-image: url(../i/_bkg-trans.png);
	background-repeat: no-repeat;
	margin-right: 0px;
	margin-left: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	width: 960px;
}
#blog #nav {
width: 300px;
}

#blog #content {
width:475px;
}

#blog #content h2 {
font-size: 28px;
color: #930;
font-weight: normal;
margin-top: 22px;
margin-right: 0pt;
margin-bottom: 10px;
margin-left: 0pt;
letter-spacing: -1px;

}
#blog #content p {
margin-top: 12px;
margin-right: 0pt;
margin-bottom: 12px;
margin-left: 0pt;
font-size: 14px;
}
#blog #snav {
font-size: 16px;
font-family: "serif";
font-decoration: none;
text-align: center;
	
}
#blog #snav ul {
margin-left: 20px;
padding-left: 0px;
margin-bottom: 0px;
}
#blog #snav li {
	background-image: url(../i/nav_line.gif);
	background-repeat: no-repeat;
	height: 30px;
	padding: 3px;
	margin-top: 4px;
	margin-left: 0px;
	text-align: left;
	margin-bottom: 0px;
	background-position: left bottom;
}
#blog #snav li a {
text-decoration: none;
}
#blog #snav li a:hover {
color: #8ec554;
}

/* Lower Third*/

#sub-sub_1 {
margin: 0px;
padding-top: 10px;
font-family: 'times', serif;
color: #888888;
border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #666;

}

#sub-sub_1 h2 {
color: #f27a9c;
size: 13px;
padding: 0px;
margin: 0px;
}

#sub-sub_1 p {
margin: 0px;
padding: 0px;
}

#sub-sub_2 {
margin-left: 20px;
margin-top: 0px;
margin-bottom: 0px;
margin-right: 0px;
padding-top: 10px;
font-family: 'times', serif;
color: #888888;
border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #666;
}
#sub-sub_2 p {
margin-top: 0px;
margin-bottom: 2px;
padding: 0px;
}

#sub-sub_2 h2 {
color: #f27a9c;
size: 13px;
padding: 0px;
margin: 0px;
}

/*FORM VALID*/
#message { width:220px;
                    margin: 0px;
padding: 0px;
background-color:#ced91b;}
#message h3	{ font-size:90%;color:white; }
#message p { color:#300;font-weight:bold;margin-top:0px; margin-bottom:0px;padding:0px; text-align: center;}
#checkmark { position:relative;top:-21px;left:-92px; }