@charset "utf-8";
/*
Theme Name: SamGilbeyIllustrates 1 (sgi1)
Theme URI: http://www.samgilbeyillustrates.com/
Description: Custom theme for Sam Gilbey. Designed by Sam Gilbey. Built by Oliver Jones.
Author: Oliver Jones
Author URI: mailto:oj.freelance@gmail.com
*/

body {
	background: #edecec url("gfx/bg_body.gif") top left repeat-x;
	padding: 0;
	margin: 0;
	border: 0;
	font-size: 80%;
	color: #959595;
	font-family: Arial, Helvetica, sans-serif;
}
a, img, input, button { outline: none !important; }
a { text-decoration: none; color: #95b5bd; }
a:hover { color: #3c7d8d; }

a img { border: 0; }

p { font-size: 11px; line-height: 20px; }

h1 { font-size: 24px; color: #3c7d8d; padding: 0 0 17px 0; margin: 0; }
h2 { font-size: 15px; color: #3c7d8d; padding: 8px 0 17px 0; margin: 0; } 

#middle ul { 
	list-style-image: url("gfx/gfx_list.gif");
	font-size: 11px;
	margin: 4px 0 13px 0;
	padding-left: 15px;
}

#middle li { line-height: 20px; }


/* ------------------------------------------------------ */
/* LAYOUT */

#top { height: 41px; }

	#menu { position: relative; }
	
	#menu ul {
		list-style: none;
		padding: 11px 0 0 0;
		margin: 0;
	}
	
	#menu ul li {
		display: inline;
		padding-right: 18px;
	}
	
	#menu ul li a {
		color: #95b5bd;
		font-size: 15px;
	}
	
	#menu ul li a:hover,
	#menu ul li.on a {
		color: #3c7d8d;
	}
	
	#buy { 
		position: absolute;
		right: 149px;
		top: 10px;
		z-index: 300;
	}
	
	#buy a img { background: #3c7d8d url("gfx/btn_buy_prints.gif") 0 -20px no-repeat; }
	#buy a:hover img { background-position: 0 0; }
	
	#buyprint { margin-bottom: 20px; }
	#buyprint a img { background: #3c7d8d url("gfx/btn_buy_print.gif") 0 -20px no-repeat; }
	#buyprint a:hover img { background-position: 0 0; }	
	
	#buy_text {
		width: 227px;
		height: 123px;
		background: #3c7d8d url("gfx/bg_buy_prints.gif") top left repeat-x;
		z-index: 200;
		position: absolute;
		right: 0;
		top: 10px;
		display: none;
	}
	
	#buy_text p { color: #fff; line-height: 14px; padding: 28px 10px 10px 10px; margin: 0; }
	
	#contact {
		width: 224px; 
		height: 119px;
		float: right; 
		border-bottom: 1px solid #fff;
	}
	
	#contact table { margin-top: 48px; }
	#contact table th { text-align: left; font-size: 15px; color: #3c7d8d; padding: 0 5px 5px 0; }
	#contact table td { text-align: left; font-size: 12px; color: #959595; font-weight: bold; padding: 0 5px 5px 0;}

.centre {
	width: 984px;
	margin: 0 auto;
}
	#left { width: 760px; float: left; position: relative; }
	#right { width: 224px; float: left; }
	
	#title { padding-bottom: 26px; position: relative; }
	#logo-header { position: absolute; z-index: 100; bottom: 40px; left: -49px;}
	#hero { 
		padding-bottom: 19px; 
		background-color: #fff;
                position: relative;
	}
        #hero-stroke { position: absolute; border: 4px solid #3c7d8d; top:24px; left:24px; width: 648px; height: 448px; z-index: 100; cursor: pointer; }
	
	div.page,
	div.post {
		border-bottom: 1px solid #fff;
		margin: 0 0 19px 0;
		width: 704px;
	}
	
	.entry p { font-size: 13px; }

	#paging { position: absolute; z-index: 100; right: 54px; top: -96px; }
	#paging img.previous { background: transparent url("gfx/btn_previous.gif") 0 -28px no-repeat; }
	#paging img.next { background: transparent url("gfx/btn_next.gif") 0 -28px no-repeat; }
	#paging a:hover img { background-position: 0 0; }
	
	div.see_all { float: right; width: 110px; height: 20px; margin-top: 6px; }
	div.see_all a img { background: transparent url("gfx/btn_show_more.gif") 0 -20px no-repeat; }
	div.see_all a:hover img { background-position: 0 0; }
	div.less a img { background-image: url("gfx/btn_show_less.gif") !important; }
	
#bottom {
	background-color: #fff;
	height: 220px;
	margin-top: 30px;
}

	#footer { padding-top: 14px; position: relative;}
	.logo-small { float: left; padding: 5px 20px 20px 0; }
	
	#site-design {
		float: right;
	}
	a.nvp { font-size: 11px; padding-right: 20px; background: #fff url("gfx/logo_nvp_tiny.gif") center right no-repeat; }
	a.nvp:hover { background-image: url("gfx/logo_nvp_tiny_on.gif"); }
	
	#social-links { position: absolute; top: 9px; right: 0; width: 265px; height: 60px; }
	#social-links ul { list-style: none; }
	#social-links ul li { display: inline; vertical-align: middle; }
	#social-links ul li img,
	#social-links ul li span { vertical-align: middle; }
	
/* ------------------------------------------------------ */ 
/* Hero slideshow */
#slideshow-images {
	width: 656px;
	height: 456px;
	overflow: hidden;
	border-color: #fff;
	border-style: solid;
	border-bottom-width: 0;
	border-top-width: 24px;
	border-left-width: 24px;
	border-right-width: 24px;
}

#slideshow-images img { 
	width: 656px;
	height: 456px;
	padding: 0; 
	margin: 0; 
	border: 0; 
	top: 0; 
	left: 0;
}

#slideshow-footer { 
	height: 60px;
	background-color: #fff;
	padding: 0 24px;
}

#slideshow-display { float: left; }
#slideshow-display p { margin-top: 5px; }

#slideshow-key { float: right; }
#slideshow-key ul { list-style: none;  }
#slideshow-key ul li { display: inline;  }
#slideshow-key ul li img { background: #fff url("gfx/sprite_slide_marker.gif") 0 0 no-repeat; margin: 8px 0 0 3px; }

#gallery-portfolio,
#gallery-sketchbook { overflow: hidden; }

/* ------------------------------------------------------ */ 
/* Gallery Thumbnails */
div.thumbnail {
	float: left;
	width: 224px;
	height: 160px;
	margin-right: 16px;
}

div.thumbnail-border {
	float: left;
	width: 224px;
	height: 160px;
	/*padding: 19px 0 0 0;*/
	margin: 0 16px 19px 0;
	border-bottom: 1px solid #fff;
}
div.thumbnail-border p,
div.thumbnail p { margin-top: 5px; }

div.thumbnail a, 
div.thumbnail-border a {
	display: block;
	position: relative;
	width: 224px;
	height: 121px;
}
	.rolloverz {
		position: absolute; 
		z-index: 100; 
		border: 4px solid #3c7d8d; 
		top: 0; 
		left: 0; 
		width: 216px; 
		height: 113px;
	}
	
div.third { margin-right: 0 !important; }
/* ------------------------------------------------------ */ 
/* Page Styles */

div.full { width: 100%; }
div.full img.alignleft { margin-right: 38px; }
div.full h2 { padding: 0; margin: 0; }

div.entry p { margin: 0 0 9px 0; }
div.entry h2 { font-size: 15px; color: #3c7d8d; padding: 0 0 17px 0; margin: 0; } 
div.wide {
	width: 480px; float: left;
}
div.wide h2 { padding: 8px 0 3px 0; }
div.wide p { margin-bottom: 20px; }
div.wide img.divider {
	padding-top: 14px;
	margin: 0;
}
div.wide ul { margin: 0 0 13px 0 !important; }

img.divider { padding-top: 20px; }
img.border { border: 24px solid #fff; margin-bottom: 20px; }
img.alignleft { float: left; margin-bottom: 19px;}
img.alignright { float: right; margin-bottom: 19px;}
img.underline { border-bottom: 1px solid #fff; margin-bottom: 19px; }

h2.new { background: transparent url("gfx/icon_new.gif") 0 9px no-repeat; padding-left: 35px; }

/* ------------------------------------------------------ */ 
/* Side Bar */
h2.widgettitle { padding: 8px 0 0 0; margin: 0; }

div.textwidget,
div.widget_recent_entries,
div.widget_twitter { width: 224px; margin-bottom: 19px; border-bottom: 1px solid #fff; }

div.widget_twitter ul { padding: 0 !important; }
div.widget_twitter ul li { list-style: none; }
span.twitter-timestamp { display: block; }
div.twitter_follow { padding-bottom: 19px; }

div.textwidget p { padding: 0; margin: 3px 0 20px 0; }
div.textwidget p.last { padding: 0; margin: 3px 0 14px 0; }

ul.portfolio-meta { padding: 2px 0 7px 0 !important;}
ul.portfolio-meta li { list-style: none; font-weight: bold; }

ul.gallery-thumbs { padding: 0 !important; margin: 0 !important;}
ul.gallery-thumbs li { list-style: none; display: inline; }
ul.gallery-thumbs li img { position: absolute; z-index: 10; padding-bottom: 20px; }
ul.gallery-thumbs li img.even { padding-left: 16px; }
ul.gallery-thumbs li img.space { padding-right: 16px; }

ul.gallery-thumbs li a div { float: left; position: relative; width: 104px; height: 120px; }
ul.gallery-thumbs li a.even div { width: 120px; }
ul.gallery-thumbs li a.space div { width: 120px; }

	.rolloverx,
	.hilite-border {
		position: absolute !important; 
		z-index: 100 !important; 
		border: 4px solid #3c7d8d !important; 
		top: 0 !important; 
		right: 0 !important; 
		width: 96px !important; 
		height: 92px !important;
	}

	ul.gallery-thumbs li a.space div.rolloverx,
	ul.gallery-thumbs li a.space div.hilite-border {
		left: 0 !important;
	}
	
#right #twitter_update_list { list-style: none; padding-left: 0; margin-bottom: 5px; }
#right #twitter_update_list li { line-height: 21px; } 

#middle ul.social_links { padding-left: 0; }
#middle ul.social_links span { font-size: 15px; color: #3c7d8d; }
#middle ul.social_links li { display: inline; padding: 0; margin: 0; }
#middle ul.social_links li img { vertical-align: middle; }
#right ul.social_links { padding-bottom: 1px; }

.icon-twitter { background: transparent url("gfx/icon_twitter.gif") 0 -18px no-repeat; }
.icon-facebook { background: transparent url("gfx/icon_facebook.gif") 0 -18px no-repeat; }
.icon-digg { background: transparent url("gfx/icon_digg.gif") 0 -18px no-repeat; }
.icon-stumble { background: transparent url("gfx/icon_seenupon.gif") 0 -18px no-repeat; }
.icon-reddit { background: transparent url("gfx/icon_reddit.gif") 0 -18px no-repeat; }
.icon-delicious { background: transparent url("gfx/icon_delicious.gif") 0 -18px no-repeat; }

ul.social_links a:hover img { background-position: 0 0; }

div.post_share { float: right; }

	
}
/* ------------------------------------------------------ */ 
/* HELPER CLASSES */



.no-border { border: none !important; }

.hidden {
	display: none;
	visibility: hidden;
}

.cleaner {
	clear:both;	
	font-size:1px;
	border:none;
	margin:0;
	padding:0;	
}	


.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
 
.clearfix {
	display: inline-block;
}
 
html[xmlns] .clearfix {
	display: block;
}
 
* html .clearfix {
	height: 1%;
}