/* --------------- COPYRIGHT -----
CSS by PureSpider © 2009-2010
for http://purespider.de/

Swatch colors:
#F2EDE4 - rgb(242, 237, 228)
#BFB5A8 - rgb(191, 181, 168)
#594F46 - rgb(89, 79, 70)
#730E0E - rgb(115, 14, 14)
*/

/* --------------- RESET CSS ----- */
/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 1em;
	vertical-align: baseline;
	background: transparent;
}

ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
*:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* --------------» LINKS & BASICS «---- */
body {
	color: #594F46;
	font-family: "MrJonesBook", Verdana,sans-serif;
	background: #BE844F url("./img/bg_wood.jpg") repeat-x fixed right top;
	line-height: normal;
}

a {
	color: #F2EDE4;
	text-decoration: none;
	text-shadow: 0 1px 1px #000;
}

a.button {
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	padding: 1px;
	font-size: 1em;
	background: none no-repeat scroll 1px 3px #594F46;
}

a.script {
	padding-left: 18px;
}

a.script[href$='.php'] {
	background-image: url('./img/filetypes/page_white_php.png');
}

.emboss {
	-moz-box-shadow:inset 0 1px 0 #F2EDE4;
	-webkit-box-shadow:inset 0 1px 0 #F2EDE4;
	box-shadow:inset 0 1px 0 #F2EDE4;
	background: url('./img/button_gradient.png') repeat-x scroll 0 0 #594F46;
	border: 1px solid #594F46;
}

p {
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	color: #F2EDE4;
	padding: 5px;
	margin: 0 0 20px 210px;
	background: none repeat scroll 0 0 #594F46;
	background: none repeat scroll 0 0 rgba(89, 79, 70, 0.5);
	text-shadow: 0 1px 1px #000;
}

p:last-child {
	margin-bottom: 0;
}

h1 {
	color:#730E0E;
	font-family: "Museo", Verdana, sans-serif;
	font-size:1.5em;
	line-height: 1.25em;
	font-weight:700;
	margin:0 0 0 210px;
	text-align:center;
	text-shadow:0 1px 1px #333;
}

h2 {
	color: #730E0E;
	float: left;
	text-shadow: 0 1px 1px #333;
	font-family: "Museo", Verdana, sans-serif;
	font-size: 1.25em;
	width: 205px;
	text-align: right;
	margin: 0.3em 0;
}

code {
	border-left: 1px solid #594F46;
	display: block;
	font-size: 1.2em;
	padding-left: 5px;
	margin-bottom: 5px;
	margin-top: 5px;
}

/* --------------» MAIN STYLES «---- */
/* --------------- HEADER PICS ----- */
img.pic {
	width: 150px;
	height: 100px;
	padding: 0;
	margin: 0;
	float: left;
	opacity: 0.5;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
	filter: alpha(opacity=50);
}

	img.pic:hover {
		opacity: 1;
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
		filter: alpha(opacity=100);
	}

/* --------------- PIC SCROLLER ----- */
.pic_small {
	float: left;
	width: 145px;
	height: 96px;
	cursor: url(plus.png), default;
}

#pic_scroll_container {
	border: 1px solid #594F46;
	width: 870px;
	overflow: hidden;
	position: relative;
}

.arrow {
	position: absolute;
	bottom: 0;
}

#pic_scroll_container #nav_left {
	-webkit-transition: left 0.2s ease-in-out;
	-moz-transition: left 0.2s ease-in-out;
	-o-transition: left 0.2s ease-in-out;
	left: -18px;
}

#pic_scroll_container:hover #nav_left {
	-webkit-transition: left 0.2s ease-in-out;
	-moz-transition: left 0.2s ease-in-out;
	-o-transition: left 0.2s ease-in-out;
	left: 0;
}

#pic_scroll_container #nav_right {
	-webkit-transition: right 0.2s ease-in-out;
	-moz-transition: right 0.2s ease-in-out;
	-o-transition: right 0.2s ease-in-out;
	right: -18px;
}
#pic_scroll_container:hover #nav_right {
	-webkit-transition: right 0.2s ease-in-out;
	-moz-transition: right 0.2s ease-in-out;
	-o-transition: right 0.2s ease-in-out;
	right: 0;
}

/* --------------- BUBBLE ----- */
#bubble {
	height: 26px;
	cursor: default;
	position: absolute;
	text-shadow: 0 1px 1px #000000;
	font-family: "Museo", Verdana, sans-serif;
}

	#bubble #bubble_desc {
		height: 26px;
		color: #F2EDE4;
		padding-left: 5px;
		padding-top: 1px;
		float: left;
		background-image: url(./img/bubble_left.png);
	}

	#bubble #bubble_right {
		width: 5px;
		height: 23px;
		float: left;
		background-image: url(./img/bubble_right.png);
	}

/* --------------- CONTENT ----- */
#header {
	display: block;
	font-size: 18pt;
	color: #730E0E;
	text-shadow: 0pt 1px 1px #333;
	width: 900px;
	height: 29px;
	margin: 5px auto 0pt;
	cursor: default;
}

	#header:hover { color: #F2EDE4; }

	#header > #purespider {
		font-family: 'Perspective Sans Black', sans-serif;
	}
	
	#header > #de {
		font-family: 'Perspective Sans', sans-serif;
		font-style: italic;
	}
	
	#header > #tagline {
		font-size: 0.7em;
		font-family: 'Perspective Sans', sans-serif;
		font-style: italic;
	}

div#pics_top {
	-moz-box-shadow:0 0 15px black;
	-webkit-box-shadow:0 0 15px black;
	box-shadow:0 0 15px black;
	background:none repeat-y fixed 50% 0 #594F46;
	height:200px;
	margin:15px auto;
	padding:0;
	width:900px;
}

	div#pics_top a, #prev_image {
		cursor: url(plus.png), auto;
	}

/* --------------- NAVIGATION ----- */
#nav_container {
	background-color: #594F46;
	border-top: 1px solid black;
	border-bottom: 1px solid black;
}

#nav_container #nav {
	background:none transparent;
	height:20px;
	margin:0 auto;
	padding:0;
	width:900px;
}

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

		#nav_container #nav ul#left li {
			float:left;
			font-size:1em;
			text-align:center;
			width:150px;
			height: 26px;
			line-height: 19px;
			font-family: "Museo", Verdana, sans-serif;
		}

			#nav_container #nav ul#left li:before {
				content: "\00BB";
				text-shadow: 0 1px 1px #000;
				color: #F2EDE4;
			}
			
			#nav_container #nav ul#left li:hover {
				background: url("./img/hover_tick.png") no-repeat scroll 50% 20px transparent;
			}

	#nav_container #nav ul#right {
		padding: 0;
		margin: 2px 15px 0;
		float: right;
		list-style: none outside none;
	}

		#nav_container #nav ul#right li {
			float: left;
			position: relative;
			padding: 0px;
			width: 20px;
		}

#content {
	-moz-box-shadow:0 0 15px black;
	-webkit-box-shadow:0 0 15px black;
	box-shadow:0 0 15px black;
	background:none repeat fixed 0 0 #BFB5A8;
	cursor:default;
	margin:15px auto;
	padding:15px;
	text-align:left;
	width:870px;
}

#pic_prev {
	width: 870px;
	height: 580px;
	margin: 0 auto;
	border: 1px solid #594F46;
	border-bottom-width: 0;
}

/* --------------- FOOTER ----- */
#footer {
	background-color: #594F46;
	border-top: 1px solid black;
	border-bottom: 1px solid black;
	color: #F2EDE4;
	font-size: 9px;
	font-family: "Museo", Verdana, sans-serif;
	margin: 0 auto 15px;
	padding: 2px 5px 2px 0;
	text-align: right;
	width: 895px;
}

/* --------------- IMAGE FULL VIEW ----- */
#white {
	color: #F2EDE4;
	background-color: #594F46;
	background-repeat: no-repeat;
	background-position: center 400px;
	top: 0;
	left: 0;
	position: absolute;
	min-width: 100%;
	min-height: 815px;
	z-index: 10;
}

#fullview {
	top: 0;
	margin-left: auto;
	margin-right: auto;
	padding-left: 0;
	padding-right: 34px;
	padding-bottom: 15px;
	background: transparent url(./img/window_back.png) no-repeat scroll center bottom;
	z-index: 15;
}

#fullview_image {
	cursor: url(minus.png), auto;
}

#sidebar {
	width: 32px;
	padding: 2px 2px 0px 0px;
	float: left;
	z-index: 15;
}

/* --------------- MISC ----- */
#heart {
	position: fixed;
	top: 5px;
	right: 5px;
	z-index: 0;
}
