
body {
	background: url(images/bird.jpg) top center #000 fixed no-repeat;
	margin: 0;
	padding: 0;
	font-family: Verdana;
	font-size: 62.5%;	
}

body.home		{ background: #000; color: #fff; }
body.about		{ background: url(images/tap.jpg) top center #000 fixed no-repeat; }
body.contact	{ background: url(images/bird.jpg) top center #000 fixed no-repeat; }
body.photos		{ background: url(images/church.jpg) top center #000 fixed no-repeat; }
body.backhoe	{ background: url(images/tap.jpg) top center #000 fixed no-repeat; }
	
#container {
	width: 800px;
	margin: 0 auto;
	font-size: 1.6em;
	position: relative;	
}

body.home #logo {
	display: none;
}

#logo {
	background: url(images/wb_logo.png) top left no-repeat;
}

#logo a {
	display: block;
	width: 150px;
	height: 136px;	
}

#logo a span {
	display: none;	
}

#content_container {
	margin: 0;
	padding: 0;
}

body.home		#content { }
body.about		#content { color: #fff; padding: 0 400px 0 0; }
body.contact	#content { padding: 100px 0 0 400px; }
body.photos		#content { padding: 0 0 0 0px; }
body.backhoe	#content { color: #fff; padding: 0 0 0 0; }

body.home		#content h1 { }
body.about		#content h1 { }
body.contact	#content h1 { text-align: right; margin: 0; padding: 10px 0 10px 0; }
body.photos		#content h1 { text-align: right; margin: 0; padding: 10px 0 10px 0; }
body.backhoe	#content h1 { }

body.home		#content p { }
body.about		#content p { }
body.contact	#content p { }
body.contact	#content table { float: right; margin-bottom: 10px; }
body.photos		#content p { margin-bottom: 10px; }
body.backhoe	#content p { }

body.home		#content a { color: #fff; }
body.about		#content a { color: #fff; }
body.contact	#content a { color: #222931; }
body.photos		#content a { color: #222931; }
body.backhoe	#content a { color: #fff; }

body.home		#content a:hover { color: #fff; }
body.about		#content a:hover { color: #fff; }
body.contact	#content a:hover { color: #fff; background: #222931; }
body.photos		#content a:hover { color: #fff; background: #222931; }
body.backhoe	#content a:hover { color: #fff; }

#nav {
	position: absolute;
	top: 0;
	right: 0;	
	z-index: 22;
}

#nav ul {
	list-style: none;
	margin: 0;
	padding: 0; 	
}

#nav ul li {
	list-style: none;
	margin: 0;
	padding: 0; 	
	float: left;
}

#nav ul li a {
	display: block;
	margin: 0 4px 0 0;
	padding: 0;
	height: 40px;
	background-image: url(images/nav.png);
	background-repeat: none;
}

#nav0 a { width: 104px; background-position:    0px 0px; }
#nav1 a { width: 124px; background-position: -108px 0px; }
#nav2 a { width: 113px; background-position: -236px 0px; }

#nav0 a:hover { background-position: 	0px -40px; }
#nav1 a:hover { background-position: -108px -40px; }
#nav2 a:hover { background-position: -236px -40px; }

#nav0.selected a, #nav0.selected a:hover { background-position:    0px -80px; }
#nav1.selected a, #nav1.selected a:hover { background-position: -108px -80px; }
#nav2.selected a, #nav2.selected a:hover { background-position: -236px -80px; }

#nav ul li a span {
	display: none;	
}

#collage {
	width: 800px;
	height: 800px;
	background: url(images/collage_logo.png) 320px 320px no-repeat;
	position: relative;	
}

#collage img {
	position: absolute;	
}

#collage .v1 { top:   0px; left:   0px; z-index: 20; }
#collage .v2 { top: 320px; left: 480px; z-index: 20; }
#collage .h1 { top:   0px; left: 320px; z-index: 20; }
#collage .h2 { top: 480px; left:   0px; z-index: 20; }

#log {
	position: absolute;
	top: 0;
	left: 0;	
}

/*******************************************************************************
Pics
*******************************************************************************/

ul.pics {
	margin: 0;
	padding: 0;
	list-style: none;	
}
	
ul.pics li {
	float: left;
	margin: 0;	
	padding: 0 2px;
	list-style: none;
}

#content ul.pics li a {
	margin: 0;
	padding: 0;	
}

#content ul.pics li a:hover {
	margin: 0;
	padding: 0;	
	background: transparent;
}

#content ul.pics li a img {
	width: 75px;
	height: 75px;
	border: #fff 1px solid;
}

#content ul.pics li a:hover img {
	width: 75px;
	height: 75px;
	border: #ff0000 1px solid;
}

/*******************************************************************************
Pic Sets
*******************************************************************************/

ul.pic_sets {
	margin: 0;
	padding: 0;
	list-style: none;	
}
	
ul.pic_sets li {
	float: left;
	margin: 0;	
	padding: 2px;
	list-style: none;
	position: relative;
}

#content ul.pic_sets li a {
	display: block;
	width: 100px;
	height: 130px;
	margin: 0;
	padding: 0;	
	position: relative;
	border: #000 1px solid;
	text-align: center;
	text-decoration: none;
	line-height: normal;
}

#content ul.pic_sets li a:hover {
	margin: 0;
	padding: 0;	
	background: #ffcc99;
	color: #000;
}

#content ul.pic_sets li a img {
	margin: 10px 0 2px 0;
	padding: 0;
	width: 75px;
	height: 75px;
	border: #fff 1px solid;
}

#content ul.pic_sets li a:hover img {
	width: 75px;
	height: 75px;
	border: #000 1px solid;
}

ul.pic_sets li a span.set_title {
	display: block;
	font-size: 0.8em;
}

/*
http://www.456bereastreet.com/lab/transparent-custom-corners-borders-v2/
*/

/* Default CSS
================================================*/
/* Basic styling, used when JavaScript is unsupported */
.cbb {
	margin:1em 0;
	padding:0 10px;
	border:1px solid #666;
	background:#fff;
}
.cbb h1 {
	margin:0 -10px;
	padding:0.3em 10px;
	background:#efece6;
	font:bold 1.2em/1 Arial, Helvetica, sans-serif;
}
/* Normal styling */
.cb {margin:0.5em 0;}
	/* Top corners and border */
.bt {
	height:17px;
	margin:0 0 0 18px;
	background:url(images/cb/box.png) no-repeat 100% 0;
}
.bt div {
	position:relative;
	left:-18px;
	width:18px;
	height:17px;
	background:url(images/cb/box.png) no-repeat 0 0;
	font-size:0;
	line-height:0;
}

	/* Bottom corners and border */
.bb {
	height:14px;
	margin:0 0 0 12px;
	background:url(images/cb/box.png) no-repeat 100% 100%;
}
.bb div {
	position:relative;
	left:-12px;
	width:12px;
	height:14px;
	background:url(images/cb/box.png) no-repeat 0 100%;
	font-size:0;
	line-height:0;
}

	/* Left border */
.i1 {
	padding:0 0 0 12px;
	background:url(images/cb/borders.png) repeat-y 0 0;
}
	/* Right border */
.i2 {
	padding:0 12px 0 0;
	background:url(images/cb/borders.png) repeat-y 100% 0;
}
	/* Wrapper for the content. Use it to set the background colour and insert some padding between the borders and the content. */
.i3 {
	display:block;
	margin:0;
	padding:1px 10px;
	background:#fff;
}
	/* Make the content wrapper auto clearing so it will contain floats (see http://positioniseverything.net/easyclearing.html). */
.i3:after {
	content:"."; 
	display:block; 
	height:0; 
	clear:both; 
	visibility:hidden;
}
.i3 {display:inline-block;}
.i3 {display:block;}
/* Default CSS ends here */

/* Custom CSS
================================================*/
/* You can use different borders for different boxes on the same page. Just adjust the CSS. Here are a few examples, one of which uses the GIF images instead of the PNG images. Note that you can also adjust borders, heights and paddings this way. Remember to adjust the IE CSS as well. */

.one {
	position:absolute;
	top:0;
	right:0;
}
.two {
	float:left;
	width:45%;
}
.two .i1,
.two .i2 { background-image:url(borders.gif); }
.two .bt,
.two .bt div,
.two .bb,
.two .bb div { background-image:url(box.gif); }
#three {
	float:left;
	clear:both;
	width:80%;
}
#three .cb {
	float:left;
	width:40%;
}
.button {
	float:left;
	margin-top:0;
}
.button .bt {
	height:8px;
	margin:0 0 0 9px;
	background-image:url(images/cb/button.png);
}
.button .bt div {
	left:-9px;
	width:9px;
	height:8px;
	background-image:url(images/cb/button.png);
}
.button .bb {
	height:8px;
	margin:0 0 0 8px;
	background-image:url(images/cb/button.png);
}
.button .bb div {
	left:-8px;
	width:8px;
	height:8px;
	background-image:url(images/cb/button.png);
}
.button .i1 {
	padding:0 0 0 3px;
	background-image:url(images/cb/button-borders.png);
}
.button .i2 {
	padding:0 3px 0 0;
	background-image:url(images/cb/button-borders.png);
}
.button .i3 {
	padding:0 0.5em;
	background:#3a3d40 url(images/cb/button.png) no-repeat -3px -8px;
	font-weight:bold;
	text-decoration:none;
	text-align:center;
}
.button a:link,
.button a:visited,
.button a:hover {
	border:none;
	color:#fff;
}

/* Just a bit of styling for this demo page. Adjust as you wish. */
#absolute-wrapper {
	position:relative;
	height:9em;
}
.cb li {margin-left:1em;}


/*ceebox*/
/* CeeBox CSS Document */
/* Minor change made for 2.0.6 */
/* Works with 2.0.4 and up */
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> global settings needed for ceebox <<<-----------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
*{padding: 0; margin: 0;}
html,body{height:100%;}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> ceebox specific background images <<<-----------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#cee_closeBtn 		{ background-image: url(images/ceebox/cee-close-btn.png); }
#cee_next 			{ background-image: url(images/ceebox/cee-next-btn.png); }
#cee_prev 			{ background-image: url(images/ceebox/cee-prev-btn.png); }
* html #cee_next 	{ background-image: url(images/ceebox/cee-next-btn.gif); } /* IE6 hack */
* html #cee_prev 	{ background-image: url(images/ceebox/cee-prev-btn.gif); } /* IE6 hack */
#cee_load 			{ background-image: url(images/ceebox/loader.gif);}
/* ceebox border width controled as option in jquery.ceebox.js */
/* colors for ceebox background and border can also be set as option in jquery.ceebox.js  */
#cee_box			{background-color: #fff;border-color:#525252;border-style: solid; -moz-border-radius: 7px; -webkit-border-radius: 7px; border-radius: 7px; }

/* ---------->>> ceebox specific css minimized <<<-----------------------------------------------------------*/
#cee_box{font:12px Arial,Helvetica,sans-serif;color:#333;background-color:#fff}#cee_count{font:10px Arial,Helvetica,sans-serif;-moz-opacity:0.8;opacity:0.8;clear:left;float:left;padding:2px 0 4px}.cee_html #cee_title h2{float:left}.cee_html #cee_count{clear:none;padding-left:5px}* html #cee_count{zoom:1;padding-bottom:6px}#cee_next,#cee_prev{height:100%;width:49%;text-indent:-10000px;text-decoration:none;visibility:visible;background-repeat:no-repeat}#cee_box a{border:0;outline:none}#cee_box a:link{color:#666}#cee_box a:visited{color:#666}#cee_box a:hover{color:#000}#cee_box a:active{color:#666}#cee_box a:focus{color:#666}#cee_closeBtn{background-repeat:no-repeat;display:box;width:24px;height:23px;position:absolute;text-indent:-10000px} #cee_closeBtn{top:-3px;right:-3px}#cee_closeBtn,#ie8#hack{top:-10px;right:-10px}*:first-child+html #cee_closeBtn{top:-3px;right:-3px} * html #cee_closeBtn{top:-3px;right:-3px}#cee_closeBtn:hover{background-position:0px -23px}.cee_close{cursor:pointer}#cee_box{text-align:left;color:#000}#cee_box img#cee_img,#cee_vid,#cee_iframeContent,#cee_ajax{display:block;margin:15px 15px 0;border-right:1px solid #ccc;border-bottom:1px solid #ccc;border-top:1px solid #666;border-left:1px solid #666}#cee_title{padding:7px 15px 5px 15px;overflow:hidden}.cee_html #cee_title{background-color:#e8e8e8;height:18px;-moz-border-radius:7px 7px 0 0;-webkit-border-radius:7px 7px 0 0;border-radius:7px 7px 0 0}#cee_title h2{font-size:1em;font-weight:400;margin:0 0 1px}#cee_ajax{clear:both;padding:2px 15px 15px 15px;overflow:auto;text-align:left;line-height:1.4em}#cee_load{display:none;height:50px;width:50px;margin:-25px 0 0 -25px;background-position:center center;background-repeat:no-repeat}#cee_HideSelect{z-index:99;position:fixed;top:0;left:0;background-color:#fff;border:none;filter:alpha(opacity=0);-moz-opacity:0;opacity:0;height:100%;width:100%}* html #cee_HideSelect{ position:absolute; height:expression(document.body.scrollHeight >document.body.offsetHeight ? document.body.scrollHeight:document.body.offsetHeight+'px')}#cee_iframe{clear:both;border:none;margin-bottom:-1px;margin-top:1px}
