@charset "utf-8";
/* CSS Document */

body {
	color: #393939;
	font-family: "trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 17px;
	background-color: #e8e6dd;
}

body, html { height: 100% }

/* reset */
html, body, p, table, fieldset, form, label, input, legend, tbody, tfoot, thead, tr, th, td, img, a { padding: 0px; margin: 0px; border: 0px; outline: none; }
* { padding: 0px; margin: 0px; }
/* --------------------------------------------------------------------------------------------------------- */

.clear { clear: both; }
#bottle img.cover, #footer img.cover { width: 100%; height: 100%; }
/* --------------------------------------------------------------------------------------------------------- */

h1 {
	display: block;
	color: #2b2b2b;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 32px;
	font-weight: bold;
	text-transform: uppercase;
	padding: 6px 0px;
	margin: 0px 0px 28px  0px;
}
h2 { color: #b23434; font-size: 18px; font-weight: bold; margin-bottom: 10px; }
h3 { color: #494949; font-size: 14px; font-weight: bold; margin-bottom: 8px; }

/* TOP */
#top_wrap { height: 392px; border-bottom: #a79b7f solid 3px; background: url(../images/sky_bg.jpg) repeat-x; padding: 0px; }
#top { width: 960px; height: 392px; background: url(../images/top_bg.jpg) no-repeat; margin: 0px auto; position: relative; }
#bottle { width: 960px; height: 449px; background: url(../images/bottle.png) no-repeat center; position: absolute; }
/* --------------------------------------------------------------------------------------------------------- */

/* ########## CONTENT ########## */
#content_wrap { border-top: #937d48 solid 1px; background: url(../images/content_tile.jpg) repeat; }
#content { width: 960px; padding: 0px; margin: 0px auto; background: url(../images/bg_hoax.jpg) repeat-y; }
#content p { padding-bottom: 12px; }

#left { width: 512px; padding: 0px; margin: 40px 16px 0px 0px; float: left; }
#right { width: 400px; border-left: #e6cca6 solid 1px; border-right: #e6cca6 solid 1px; background: url(../images/content_feature_tile.jpg) repeat; float: right; padding: 15px; }

/* ---------- GALLERY ---------- */
#projects_desc { margin-bottom: 15px; }
#projects_desc .formula { width: 206px; float: left; }
#projects_desc .info { width: 294px; margin: 6px 0px 0px 12px; float: left; }

#gallery { position: relative; margin-bottom: 15px; }
#buddy { width: 73px; height: 46px; background: url(../images/peeking.png) no-repeat; position: absolute; top: -31px; right: 40px; z-index: 1; }

/* gallery nav */
#gallery #nav { width: 498px; position: absolute; left: 7px; top: -40px; }
#gallery #nav ul { display:block; list-style-type: none; padding: 0px; margin: 0px; display: inline-block; }
#gallery #nav ul li { display: block; list-style-type: none; padding: 0px; margin: 0px; float: left; }
#gallery #nav ul li a { display: block; color: #FFFFFF; font-size: 14px; font-weight: bold; text-decoration: none; }

#gallery #nav ul li.web_design a { width: 102px; height: 26px; background: url(../images/web_btn.jpg) no-repeat; padding: 22px 0px 0px 28px; }
#gallery #nav ul li.web_design a:hover, #gallery #nav ul li.web_design a.active-tab { background: url(../images/web_btn_over.jpg) no-repeat 0px 0px; }

#gallery #nav ul li.logo_design a { width: 114px; height: 28px; background: url(../images/logo_btn.jpg) no-repeat; padding: 20px 0px 0px 12px; }
#gallery #nav ul li.logo_design a:hover, #gallery #nav ul li.logo_design a.active-tab  { background: url(../images/logo_btn_over.jpg) no-repeat; }

#gallery #nav ul li.resources a { width: 89px; height: 24px; background: url(../images/print_btn.jpg) no-repeat; padding: 24px 0px 0px 10px; }
#gallery #nav ul li.resources a:hover, #gallery #nav ul li.resources a.active-tab { background: url(../images/print_btn_over.jpg) no-repeat; }

/* green bar */
#gallery .nav_bottom { border-top: #a4a4a4 solid 1px; border-bottom: #546334 solid 1px; background-color: #61821c; padding-bottom: 5px; }

/* gallery projects panels (sections) */
.panel { clear: both; display: none; }
.panel.active-tab-body { display: block; }

/* gallery projects */
#projects { border: #765c36 solid 1px; background-color: #8a7a62; padding: 7px 5px 5px 5px; margin-top: 48px; }
#projects_area { border: #786956 solid 1px; border-top: none; background-color: #FFFFFF; padding: 32px 0px 19px 19px; }

/*gallery projects thumbnails */
#projects .thumbnails ul { display: block; list-style-type: none; padding: 0px; margin: 0px; clear: both; }
#projects .thumbnails ul li { display: block; border: #d0d0d0 solid 1px; background-color: #727c5e; margin: 0px 19px 19px 0px; float: left; }
#projects .thumbnails ul li img { display: block; width: 206px; height: 118px; border: #d0d0d0 solid 1px; margin: 5px; }
#projects .thumbnails ul li:hover { background-color: #535b41; }
#projects .thumbnails ul li span { display: block; color: #FFFFFF; font-weight: bold; padding: 0px 5px 5px 8px; }
/* --------------------------------------------------------------------------------------------------------- */

/* RESOURCES TAB (books/links) */
/* books */
#projects ul#books_list { display: block; font-size: 11px; line-height: 15px; list-style-type: none; padding: 0px 9px 0px 0px; margin: 15px 0px; }
#projects ul#books_list li { display: block; width: 210px; border: #d2d2d2 solid 1px; padding: 5px; margin: 0px 8px 8px 0px; float: left; }
#projects ul#books_list li:hover { background-color: #F3F3F3; }
/* --------------------------------------------------------------------------------------------------------- */

#projects ul#books_list a.book, #projects ul#books_list a:link.book, #projects ul#books_list a:visited.book { display: block; color: #666666; text-decoration: underline; cursor: pointer; }
#projects ul#books_list a:hover.book, #projects ul#books_list a:active.book { color: #666666; text-decoration: none; }
#projects ul#books_list .book span { display: block; height: 62px; background-position: 0px 2px; background-repeat: no-repeat; padding: 0px 0px 2px 45px; }

/* books icons */
#projects ul#books_list .book1 { background-image: url(../images/books/book1.jpg); }
#projects ul#books_list .book2 { background-image: url(../images/books/book2.jpg); }
#projects ul#books_list .book3 { background-image: url(../images/books/book3.jpg); }
#projects ul#books_list .book4 { background-image: url(../images/books/book4.jpg); }
#projects ul#books_list .book5 { background-image: url(../images/books/book5.jpg); }
#projects ul#books_list .book6 { background-image: url(../images/books/book6.jpg); }
#projects ul#books_list .book7 { background-image: url(../images/books/book7.jpg); }
#projects ul#books_list .book8 { background-image: url(../images/books/book8.jpg); }
#projects ul#books_list .book9 { background-image: url(../images/books/book9.jpg); }
#projects ul#books_list .book10 { background-image: url(../images/books/book10.jpg); }

/* website links */
#projects ul#website_list { display: block; font-size: 11px; list-style-type: none; padding: 0px 9px 0px 0px; margin: 15px 0px; }
#projects ul#website_list li { display: block; width: 220px; padding: 0px; margin: 0px 10px 10px 0px; float: left; }

#projects ul#website_list a:link.round_button, #projects ul#website_list a:visited.round_button {
	display: block;
	width: 220px;
	height: 30px;
	color: #555555;
	font-weight: bold;
	line-height: 29px;
	text-decoration: none;
	background: url(../images/link_bg.gif);
}
#projects ul#website_list a:hover.round_button, #projects ul#website_list a:active.round_button { color: #0066CC; text-decoration: none; }
#projects ul#website_list .round_button span { display: block; background-position: 10px 7px; background-repeat: no-repeat; padding: 0px 0px 0px 35px; }

/* website links icons */
#projects ul#website_list .add { background-image: url(../images/add.gif); }
/* --------------------------------------------------------------------------------------------------------- */

/* RIGHT SIDE */
/* bio */
#bio { padding: 0px 10px; margin: 5px 0px -14px 0px; }

/* contact */
#contact_me {}
#contact_me p { padding: 0px 10px; margin-top: 8px; }
/* --------------------------------------------------------------------------------------------------------- */

/* ########## FORM STYLES ########## */
#form { margin-top: 20px; }
#form fieldset {
	display: block;
	border: none;
	margin: 0px;
}
#form label {
	width: 70px;
	color: #876535;
	text-align: right;
	font-size: 14px;
	font-weight: bold;
	padding: 6px 10px 0px 10px;
	float: left;
}
#form fieldset div {
	display: block;
	padding: 0px;
	margin-bottom: 16px;
}
#form fieldset div input, fieldset div textarea {
	width: 230px;
	color: #887c60;
	font-size: 12px;
	font-weight: bold;
	border: #d6b78c solid 1px;
	background: #FFFFFF url(../images/white.gif) repeat;
	padding: 8px;
}
#form fieldset div textarea { height: 100px; }
#form input:focus,textarea:focus { border: #37b2cd solid 1px; background-color: #fff9e1; }
#form fieldset div span {
	display: block;
	color: #876535;
	font-size: 11px;
	padding: 0px;
	margin: 2px 0px 0px 92px;
}

/* submit button */
#form input.send_btn { width: 86px; height: 46px; border: none; background: url(../images/send_btn.jpg) no-repeat; cursor: pointer; }
#form input.send_btn:hover { background: url(../images/send_btn_over.jpg) no-repeat top left; }
#form input.send_btn:focus { border: none; outline: none; }

/* form error styles */
#form_error { padding: 0px 10px; margin-left: 100px; clear: both; }
#form_error ul { list-style-type: none; padding: 0px; margin: 0px; }
#form_error ul li { display: block; color: #b23434; font-weight: bold; background: url(../images/icon_cross.png) no-repeat center left; padding: 4px 0px 4px 20px; margin: 0px; }
.success { color: #657044; font-size: 14px; font-weight: bold; margin: 0px 0px 0px 90px; }
#contact_me .success p { display: block; background: url(../images/icon_tick_circle.png) no-repeat center left; padding: 4px 0px 4px 22px; margin: 0px; }
/* --------------------------------------------------------------------------------------------------------- */

/* ########## -- STICKY FOOTER HACK -- ########## */
#wrapper { height: 100%; min-height: 100%; height: auto !important; margin: 0 auto -181px; } /* <-- The negative value for the margin in #wrapper is the same number as the height of "#footer" and ".push" --| */
.push { height: 181px; } /* <-- The height number for the ".push" needs to be the same number as the height of "#footer" --| */
/* --------------------------------------------------------------------------------------------------------- */

/* FOOTER */
#footer_wrap { height: 181px; background: url(../images/bottom_bg.jpg) repeat-x; }
#footer { width: 960px; height: 181px; 	color: #656565; font-size: 11px; background: url(../images/footer_bg.jpg) no-repeat; margin: 0px auto; position: relative; }
#copyright { position: absolute; left: 43px; top: 5px; }
#valid { position: absolute; left: 259px; top: 5px; }
#valid a { color: #656565; }
#valid a:link, #valid a:visited { text-decoration: underline; }
#valid a:hover { text-decoration: none; }
/* --------------------------------------------------------------------------------------------------------- */
