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

	shell.css
	
	version:	1.0
	date:		June 2010
	author:		[Martin Olson @ innertwine]
	email:		[martin@innertwine.com]

	website:	[www.calhounrental.com]

	version history: [1.0]
	

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

/*	Reset & Import -------*/

@import url("css/reset.css");
@import url("css/fonts.css");


body {
  background: rgb(200,200,200) url(images/wall.png);
  color: rgb(62,60,56);
  font-family: 'Helvetica', Arial, sans-serif;	
  text-align: center }

/* links  */

a { color: rgb(145,145,145); text-decoration: underline }
a:hover { color: rgb(75,75,75) }

p.alink { margin: 3em auto 0 }
p.alink a {
	background: rgb(254,242,0) url(images/link-arrow.gif) right center no-repeat;
	color: rgb(45,45,45);
	font-size: 13px; font-weight: 700;
	padding: 10px 35px 10px 20px;
	text-decoration: none }
p.alink a:hover { color: rgb(100,100,100) }

/* headings */

h1 a {
	background: rgb(110,110,110);
	color: rgb(245,245,245);
	display: block; float: left;
	text-align: center;
	text-decoration: none;
	/*text-indent: -9999px;*/
	width: 250px }
	h1 a:hover { color: rgb(200,200,200) }
h2 {
	font: 700 24px/30px 'Helvetica', Arial, sans-serif;
	margin-bottom: .3em }
h3 { }
h4 {
	font-size: 12px;
	font-weight: 700;
	margin: 0 auto .5em }

/* strong em hr */
strong { font-weight: bolder; }
em { font-style: italic; }

hr {
	background-color: none;
	border: none;
	border-bottom: 1px dashed rgb(230,230,230);
	clear: both;
	height: 1px;
	font-size: 1px;
	line-height: 0;
	margin: 30px 0;
	width: 100% }

/* classes */

.error { color: red; }

/* page structure & layout */

#content {
	background: rgb(255,255,255);
	border: 1px solid rgb(230,230,230);
	border-top: none;
	margin: 0 auto;
	text-align: left;
	width: 860px }
#header {
	background: rgb(45,45,45) url(images/hdr-bkg.gif) 0 0 repeat-x;
	height: 45px;
	margin: 45px auto 0;
	padding: 0;
	width: 860px;
	text-align: left;
	z-index: 1 }
#reserve-tag {
	background: url(images/reserve-tag.png) 0 0 no-repeat;
	display: block; position: relative;
	height: 60px;
	line-height: 1em;
	padding: 0;
	top: 5px; left: 666px;
	text-indent: -9999px;
	width: 205px;
	z-index: 10 }
#breadcrumb { }
#footer {
	clear: both;
	color: rgb(160,160,160);
	font-size: 11px;
	padding: 20px }

/* navigation */

#sitenav { 
	display: block;
	float: left;
	margin: 0 5px;
	padding: 0;
	width: 400px }
#sitenav ul { margin: 0; padding: 5px 0 0 5px }
#sitenav li { display: block; float: left; padding: 0 }
#sitenav li a {
	color: rgb(235,235,235);
	display: block;
	font-size: 13px;
	font-weight: 700;
	height: 40px;
	line-height: 38px;
	padding: 0 16px;
	text-decoration: none }
#sitenav li a:hover { color: rgb(140,140,140) }
#sitenav li a.current { background: rgb(255,255,255); color: rgb(65,65,65); height: 40px }

/* content */

#content { clear: both; overflow: hidden; padding-bottom: 15px }
#content p, ul { font-size: 12px; line-height: 1.5em; margin-bottom:1.5em }

#content #sidecol p { *margin-bottom: .3em }


/* home */

#home-slideshow { height: 350px; width: 860px; z-index: 1 }
#maincol-home { 
	display: block; float: left;
	padding: 35px 25px;
	width: 525px }
	#maincol-home p { font-size: 13px }
#sidecol-home {
	background: rgb(247,247,247) url(images/sidecol-arrow.gif) center 0 no-repeat;
	border: 1px solid rgb(239,239,239);
	border-top: none;
	display: block; float: left;
	margin: 20px;
	padding: 25px 20px 10px;
	width: 185px }
#sidecol-home p { font-size: 11px }
#sidecol-home ul { font-size: 11px; list-style: none; margin: 0; padding: 0 0 0 20px }
#sidecol-home ul { padding-left: 0 }
#sidecol-home hr { margin: 15px auto }

/* bike rental */

#bike-models {
	border-bottom: 1px dashed rgb(230,230,230);
	height: 40px;
	padding: 20px 27px 0;
	margin: 15px 0 0 }
#bike-models li {
	display: block;
	float: left;
	font-size: 11px;
	font-weight: 700 }
#bike-models li.type-title { line-height: 25px; margin-right: 15px }
#bike-models li a {
	color: rgb(140,140,140);
	display: block;
	line-height: 25px;
	height: 25px;
	padding: 0 10px;
	margin-right: 10px;
	text-decoration: none;
	-moz-border-radius: 12px;
	-webkit-border-radius: 12px }
#bike-models li a:hover { color: rgb(80,80,80) }
#bike-models li a.selected {
	background: rgb(254,242,0);
	color: rgb(80,80,80) }
	
.bike-rental {
	border-bottom: 1px solid rgb(245,245,245);
	margin-top: 30px;
	display:block; clear:both; min-height: 430px; width:860px }
.bike-views { display: none; position: absolute; top: 0; left: 25px; z-index: 5 }
.bike-views span { display: block; float: left; height: 80px; width: 80px }
.bike-views span a:link, .bike-views span a:visited { display: block; height: 80px; width: 80px; text-indent: -9999px }
	span.his a { background: url(images/icon-his.png) 0 0 no-repeat }
	span.hers a { background: url(images/icon-hers.png) 0 0 no-repeat }
.bike-views span a:hover { background-position: 0 -80px }
.bike-views span.selected a { background-position: 0 -160px }

.bike-details {
	background: url(images/sidecol-arrow.png) center 0 no-repeat;
	display: block;
	position: relative;
	left: 550px;
	height: 360px;
	padding: 40px 30px 20px;
	width: 225px;
	z-index:3 }
.bike-images { position: relative; left: 10px; margin-top: -400px }
.bike-images img { }
.bike-details ul {
	border-bottom: 1px dashed rgb(230,230,230);
	font-size: 11px }
.bike-details ul li {
	background: url(images/icon-diamond.png) 0 9px no-repeat;
	border-top: 1px dashed rgb(230,230,230);
	padding: 5px 10px }
.rental-details {
	border-bottom: 1px dashed rgb(230,230,230);
	clear: both;
	color: rgb(110,110,110);
	overflow: hidden;
	font-size: 11px;
	line-height: 1.2em;
	padding: 10px 30px }
	.rental-details span { display: block; float: left; width: 240px; margin-right: 25px }
	.rental-details span.hours { width: 210px }
	
/* inner */
	
#maincol, #sidecol {
	display: block; float: left;
	padding: 40px 35px;
	width: 540px }
#sidecol {
	background: rgb(247,247,247) url(images/sidecol-arrow.gif) center 0 no-repeat;
	border: 1px solid rgb(239,239,239);
	border-top: none;
	margin: 40px 20px 0;
	padding: 30px 20px 20px;
	display: block;
	width: 165px }
#sidecol p { font-size: 11px }
#maincol ul, #sidecol ul {
	font-size: 11px; list-style: none; margin: 0; padding: 0 0 0 20px }
#sidecol ul { padding-left: 0 }
#maincol li {
	background: url(images/icon-diamond.png) 0 7px no-repeat;
	padding: 2px 10px }
#sidecol hr { margin: 15px auto }

.iframe { border: 5px solid rgb(247,247,247) }


