/*
Theme Name: Nicola Bealing
Description: Bespoke theme for Nicola Bealing
Author: RoomFive
Author URI: http://www.roomfive.net
*/



@import url("section.css");



html, body, h1, h2, h3, h4, h5, p, blockquote, cite, ol, ul, li, fieldset, form, label, img, div, dl, dt, dd { margin:0; padding:0; border:0; -webkit-text-size-adjust:none; }

body { font-family:Arial, Helvetica, sans-serif; font-size:62.5%; color:#000; }

a { outline:none; }

#container { width:960px; margin:0 auto; position:relative; }

.logo a { position:absolute; top:70px; left:0; display:block; width:197px; padding:106px 0 0 0; overflow:hidden; height:0 !important; height /**/:106px; }




/* CONTENT
---------------------------------------------------------------------------------------------------------------*/
#content { padding:196px 0 0 0; }
	#content h1 { display:none; }
	#content #image { padding-top:14px; position:relative; }
		#content #image p { position:absolute; bottom:0; left:250px; height:21px; padding:10px 20px 0 36px; background:url(images/info.gif) 8px 8px no-repeat #fff; font-size:1.4em; font-style:italic; color:#555; }
	#content #image iframe { padding-bottom:10px; }

#content section { float:right; width:565px; margin:58px 0 0 25px; padding:18px 0 50px 0; border-top:1px solid; }
	#content section p, #blog p { font-size:1.4em; line-height:1.2em; padding-bottom:1.2em; }
		#content section p.intro { font-size:24px; padding-bottom:22px; }
			#content section .intro p { font-size:24px; padding-bottom:22px; }
		#content section p strong { font-size:24px; padding:0 0 10px 0; font-weight:normal; display:block; }
	#content section ul, #blog article div ul { list-style:none; padding-bottom:20px; }
	#content section li, #blog article div li { font-size:1.4em; line-height:1.5em; }
		#content section a, #blog article div a { text-decoration:none; }
		#content section a:hover, #blog article div a:hover { border-bottom:1px dotted; }

#content aside { float:left; width:370px; text-transform:lowercase; margin:58px 0 0 0; padding:12px 0 50px 0; border-top:1px solid; position:relative; }
	#content aside h2, #content aside h1 { display:inline; font-size:2.4em; position:absolute; top:-38px; left:0; }
	#content aside ul { list-style:none; }
	#content aside li { font-size:1.8em; line-height:1.6em; }
	#content aside li.active { font-weight:bold; }
		#content aside li a { color:#464646; text-decoration:none; }

#blog { float:right; width:710px; margin:54px 0 30px 35px; }
	#blog article { width:100%; float:left; clear:both; padding:18px 0 20px 0; border-top:1px solid; }
	#blog article img { max-width:710px; }
	#blog article header { width:215px; padding:22px 90px 0 0; float:left; }
		#blog article header h3, #blog article header h1 { display:inline; font-size:2.4em; font-weight:normal; }
			#blog article header h3 a, #blog article header h1 a { color:#000; text-decoration:none; }
		#blog article header em { font-size:14px; font-style:normal; padding-top:8px; display:block; }
	#blog article div { width:405px; float:left; padding:22px 0 0 0; }

.section-work #content section { position:relative; }
	.section-work #content section .info { float:left; padding:1px 0 4px 25px; text-transform:lowercase; background:url(images/info.gif) 0 0 no-repeat; position:absolute; top:-31px; left:0; }

/*#portfolio { position:absolute; top:276px; right:-34px; padding-bottom:20px; }
	#portfolio ul { list-style:none; }
	#portfolio li { float:left; width:214px; overflow:hidden; padding-bottom:30px; }
	#portfolio li img { max-width:214px; height:auto; }*/

#portfolio { position:absolute; top:276px; right:-20px; padding-bottom:20px; }
	#portfolio ul { list-style:none; }
	#portfolio li { float:left; width:176px; overflow:hidden; padding-bottom:20px; }
	#portfolio li img { max-width:176px; height:auto; }

/*.section-contact #content section { position:relative; }
	.section-contact #content section p { position:absolute; top:-41px; left:0; height:960px; }*/
	
.contact-image { position:absolute; top:267px; left:0; }




/* PRIMARY NAVI
---------------------------------------------------------------------------------------------------------------*/
#primary { position:fixed; top:0; left:0; width:100%; height:29px; padding-top:10px; background:#fff; z-index:500; }
	#primary #accordion { position:relative; }
	.show { display:block; width:960px; padding:19px 0 0 0; overflow:hidden; height:0 !important; height /**/:19px; background:url(images/navi.png) 0 0 no-repeat; }
		.show:hover { background-position:0 -25px; }
	.wrap { width:960px; margin:0 auto; position:relative; text-decoration:none; outline:none; }
	
	#navi_popup { width:100%; position:absolute; left:0; top:29px; display:none; z-index:200; background:url(images/trans.png) 0 0 repeat; padding:30px 0 40px 0; }
		#navi_popup ul { list-style:none; padding:0 0 0 287px; width:640px; }
		#navi_popup li { font-size:2.1em; line-height:1.6em; width:320px; float:left; text-transform:lowercase; }
			#navi_popup li a { color:#464646; text-decoration:none; }
	
	.home { position:absolute; top:1px; left:0; display:block; width:197px; padding:106px 0 0 0; overflow:hidden; height:0 !important; height /**/:106px; background:url(images/nicola-bealing.png) 0 0 no-repeat; }

#share { position:fixed; top:0; left:0; z-index:500; width:100%; }
	#share .wrap div { position:absolute; top:10px; right:0; }
	#share h4 { float:left; width:75px; display:block; padding:19px 0 0 0; overflow:hidden; height:0 !important; height /**/:19px; background-image:url(images/share.gif); }
	#share ul { list-style:none; float:left; width:116px; }
	#share li { float:left; }
	#share li a { background-image:url(images/share.gif); display:block; padding:19px 0 0 0; overflow:hidden; height:0 !important; height /**/:19px; }
	
	.tweet a { background-position:-75px 0; width:39px; }
		.tweet a:hover { background-position:-75px -25px; }
	.fb a { background-position:-114px 0; width:22px; }
		.fb a:hover { background-position:-114px -25px; }
	.stumble a { background-position:-137px 0; width:35px; }
		.stumble a:hover { background-position:-137px -25px; }
	.email a { background-position:-173px 0; width:17px; }
		.email a:hover { background-position:-173px -25px; }
	



/* HOME BG
---------------------------------------------------------------------------------------------------------------*/
.section-bg .logo { position:fixed; z-index:450; }

.home-bg { width:100%; height:100%; overflow:hidden; position:relative; }
	.home-bg iframe { display:block; width:100%; border:none; }
	
.bg { width:100%; height:100%; overflow:hidden; position:relative; }
	.bg img { width:100%; height:auto; margin:40px 20px 20px 20px; }

.border-left { width:20px; height:100%; background:#fff; position:absolute; bottom:0; left:0; z-index:200; }
.border-right { width:20px; height:100%; background:#fff; position:absolute; bottom:0; right:0; z-index:200; }
.border-bottom { width:100%; height:20px; background:#fff; position:absolute; bottom:0; left:0; z-index:200; }

#caption { position:absolute; bottom:20px; left:0; width:100%; z-index:300; }
	#caption a { display:block; width:214px; padding:34px 0 0 0; overflow:hidden; height:0 !important; height /**/:34px; background:url(images/painting.gif) 10px 10px no-repeat #fff; }
		#caption a:hover { background-position:10px -25px; }

#one_popup, #two_popup, #three_popup { width:100%; position:absolute; left:0; bottom:54px; display:none; z-index:200; }
	#one_popup p, #two_popup p, #three_popup p { font-size:1.4em; font-style:italic; color:#555; padding:15px 10px 10px 10px; background:#fff; width:194px; }