/*
Theme Name: kbaker
Theme URL: http://www.katebaker.com/
Description: 2012 theme for Kate Baker. Custom WordPress websites: <a href="http://www.studio313.com.au/">www.studio313.com.au</a>
Author: Studio 313
Author URL: http://www.studio313.com.au/
Version: 1.0
*/

/** CSS RESET **/

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: 100%; vertical-align: baseline; background: transparent; }
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after { content: ''; content: none; }
:focus { outline: 0; }
ins { text-decoration: none; }
del { text-decoration: line-through; }
table { border-collapse: collapse; border-spacing: 0; }


/** SITE STYLES **/

body { -webkit-text-size-adjust: none; background-color:#fcfcfc;}

h1, h2, h3, h4, p, a, li { font-family: Century Gothic, sans-serif; margin:0; padding:0; text-decoration:none; outline:none; border:none;}

h1 { font-size: 18px; color:#333; margin-bottom:10px; font-weight:400;}
h2 { font-size: 16px; color:#333; margin:10px 0 5px 0; font-weight:400;}
p, li { font-size: 14px; color:#939393; line-height:150%;}

p { margin-bottom:8px;}
p.about-quote { line-height:200%; margin:0 0 40px 0; text-align:right;}
a { text-decoration:none; outline:none; border:none; color:#585858;}
a:hover { color:#939393;}

ul, ol { margin-left:35px; margin-bottom:8px;}
ul { list-style:disc;}
ol { list-style:decimal;}

hr { color:#999;}

img { border:1px solid #D6D6D6; padding:1px;}
 
input.submit-button { font-size: 16px; color:#333; margin:5px 0; border:1px solid #fcfcfc; text-transform:uppercase; background:none; font-weight:400;}
input.submit-button:hover { cursor:pointer; border:1px solid #999;}
/** PAGE WRAPPERS **/
 	#wrapper-page { position:relative; margin:0; padding:0; width:100%; height:100%;}
 	#wrapper-head { position:relative; width:100%; height:75px; background-color:#fcfcfc; }
 	#wrapper-slideshow-gap { position:relative; width:100%; height:545px; background: transparent url(images/slideshow-gap-bg.png) top center repeat-x; }
	#wrapper-content { position:relative; width:100%; height:auto; padding-top:20px; }
 	#wrapper-footer { position:relative; width:100%; height:auto; background-color:#fcfcfc; }
 
 
/** PAGE DIVS **/

	#header { width:940px; height:74px; margin:0 auto; position:relative;}
	
	#logo {  background: transparent url(images/name-logo.png) center center no-repeat; width: 201px;  height: 36px; text-indent: -3333px;  border: 0;  margin: 0; position:absolute; top:18px; left:10px; }
		#logo a {  display: block;  width: 201px;  height: 40px; text-decoration: none;  border: 0; }


	/**--- MENU ---**/	
	#nav{ list-style:none; width:auto; height:30px; position:relative; z-index:2000; float:right; top:30px; margin-left:23px;}
	
		#nav li{ float:left; position:relative; text-transform:lowercase; margin:0; margin-right:30px; }
			#nav li:last-child { margin-right:0;}
			#nav a{ display:block; padding:2px 0 15px 0; color:#585858; text-decoration:none; font: 13px Century Gothic, sans-serif; text-transform:uppercase; }
			#nav a:hover{ color:#999; text-decoration:none; }

		/*--- dropdown ---*/
		#nav ul{ background-color:#fcfcfc; /* Adding a background makes the dropdown work properly in IE7+. Make this as close to your page's background as possible (i.e. white page == white background). */ list-style:none; position:absolute; left:-9999px; /* Hide off-screen when not needed (this is more accessible than display:none;) */  width:200px; padding:0 15px; margin:0; padding-bottom:5px; }
		#nav ul li{ padding-top:0px; /* Introducing a padding between the li and the a give the illusion spaced items */ float:none; margin-right:0;}
		#nav ul a{  /* Stop text wrapping and creating multi-line dropdown items */ padding:7px 5px; text-transform:uppercase; }
		#nav li:hover ul{ /* Display the dropdown on hover */ left:-20px; top:25px; /* Bring back on-screen when needed */ }
		#nav li:hover a{ /* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */ color:#999; }
		#nav li:hover ul a{ /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */text-decoration:none; color:#999; font-size:13px;}
		#nav li:hover ul li a:hover{ /* Here we define the most explicit hover states--what happens when you hover each individual link. */ color:#585858; }
	
	
/** CONTENT **/	
	#content { width:940px; min-height:400px; margin:0 auto; padding:30px 0; position:relative;}
		div.page-title { width:940px; height:20px; border-top:1px solid #D6D6D6; margin:0; padding:0; position:relative;}
		div.page-content { width:940px; height:auto; margin:0; padding:20px 0 60px 0; position:relative;}
				div.page-title h1, .home-title-left h1 { text-transform:uppercase; color:#585858; text-align:center; font-size:18px !important; font-weight:400 !important; position:relative; top:-8px;}
				div.page-title h1 span { background-color:#fcfcfc; padding:0 15px; font-weight:400 !important;}


/** home **/
	
	div.home-heros { margin:0 auto; padding:0; height:auto; margin-bottom:30px;}
		div.home-heros ul { list-style:none; padding:0; margin:20px 0; position:relative; text-align:center;}
			div.home-heros li { width:30%; height:200px; display:inline-block; text-align:center; position:relative; margin-bottom:25px; margin-right:3%;}
				div.home-heros li img { width:100% !important; max-width:100% !important; height:auto !important;}
					div.home-heros li img:hover { cursor:pointer;}
		
		div.home-title-left { width:635px; height:20px; position:absolute; top:0; left:0;}
		div.home-title-right { width:300px; height:20px; position:absolute; top:0; left:635px; text-align:center;}
		
		
		ul.home-posts { text-align:center;}
			ul.home-posts li { height:300px; vertical-align:top;}
			ul.home-posts li h1 { text-transform:uppercase; color:#585858; text-align:center; font-size:13px; font-weight:400; margin-top:20px;}
				ul.home-posts li h1 span { background-color:#fcfcfc; padding:0 15px;}
			ul.home-posts li p { font-size: 11px; color:#939393; line-height:150%;}
		
			div.hp-post-desc { clear:both; position:relative; top-bottom:30px;}
		
		div.read-more-line { width:110px; height:20px; border-top:1px solid #D6D6D6; margin:0 auto; padding:0; position:relative; top:10px;}
		div.read-more-btn h3 { font-size:13px; position:relative; top:-9px; color:#585858; text-transform:uppercase; font-weight:400;}
			div.read-more-btn h3 span { background-color:#fcfcfc; padding:0 5px;}

/** about **/
		#cv { position:absolute; top:-27px; left:780px;}
		
		#cv h1 { text-transform:uppercase; color:#585858; text-align:center; font-size:13px; font-weight:400; position:relative;}
				#cv h1 span, #cv h1 span a { background-color:#fcfcfc; padding:0 10px;}


/**  blog **/
	
		div.blog-list-outer { width:auto; margin:0 auto; padding:20px 0; margin-left:15px;}
			div.blog-list { width:400px; height:200px; float:left; margin:20px 28px; position:relative;}
				div.list-thumb { width:100px; height:100px; position:absolute; top:0; left:0;}
				div.list-text { width:300px; max-height:150px; position:absolute; top:0; left:100px;}
					div.list-text h1 { font:16px Century Gothic, sans-serif; font-weight:400; margin-bottom:7px;}

	div.blog-credits { width:730px; height:30px; border-top:1px solid #D6D6D6; margin:0 auto; padding:0; position:relative; clear:both; margin-bottom:50px;}
		div.blog-credits-left { width:365px; height:20px; position:absolute; top:0; left:0;}
			div.blog-credits-left p { font:13px Century Gothic, sans-serif; font-style:italic; color:#A8A8A8; text-align:center; margin-top:3px;}
		div.blog-credits-right { width:365px; height:20px; position:absolute; top:0; left:365px; text-align:center;}
			div.blog-credits-right img { border:0; margin:0 5px;}
				div.blog-credits-left h3, div.blog-credits-right h3 { text-transform:uppercase; color:#585858; text-align:center; font-size:13px; font-weight:400; position:relative; top:-6px;}
				div.blog-credits-left h3 span, div.blog-credits-right h3 span { background-color:#fcfcfc; padding:0 10px;}
	
	div.blog-read-more-line { width:90px; height:20px; border-top:1px solid #D6D6D6; margin:0 auto; padding:0; position:relative; top:170px; left:140px;}
		div.blog-read-more-btn h3 { font-size:13px; position:relative; top:-6px; color:#585858; text-align:center; text-transform:uppercase; font-weight:400;}
			div.blog-read-more-btn h3 span { background-color:#fcfcfc; padding:0 5px;}
			

/** CONTACT FORM **/
div.contact-form {width:400px; height:240px;}
div.contact-form label { display:block; font:13px Century Gothic, sans-serif; color:#666; text-align:right; width:50px; float:left; }
	div.contact-form input, div.contact-form textarea  { outline:none; float:left; font:12px Century Gothic, sans-serif; color:#666; padding:4px 2px; border:solid 1px #ccc; width:315px; margin:2px 10px 10px 10px; }
		div.contact-form textarea { width:315px; resize:none;}
div.contact-form button { background-color: #fff; border: #585858 2px solid; width: auto; height: auto; float:right; color: #585858; margin: 0; font-size: 14px; font-weight:400; padding: 5px 10px; margin-right:20px;}
		div.contact-form button:hover { background-color: #585858; border: #585858 2px solid; color: #FFF; cursor:pointer;}

div.subscribe-form {width:400px; height:150px;}
div.subscribe-form label { display:block; font:13px Century Gothic, sans-serif; color:#666; text-align:right; width:50px; float:left; }
	div.subscribe-form input  { outline:none; float:left; font:13px Century Gothic, sans-serif; color:#666; padding:4px 2px; border:solid 1px #ccc; width:315px; margin:2px 10px 10px 10px; }
div.subscribe-form button { background-color: #fff; border: #585858 2px solid; width: auto; height: auto; float:right; color: #585858; margin: 0; font-size: 14px; font-weight:400; padding: 5px 10px; margin-right:20px;}
		div.subscribe-form button:hover { background-color: #585858; border: #585858 2px solid; color: #FFF; cursor:pointer;}

			
		
/** FOOTER **/		
	#footer { width:940px; height:auto; margin:0 auto; padding:0; padding:15px; border-top:1px solid #D6D6D6;}
		#footer p, #footer p a { text-align:center; font-size:9px; color:#D6D6D6; text-decoration:none;}
			#footer p a:hover { color:#585858;}
	
/** PAGE CLASSES **/




img.alignright {float:right; margin:0 0 15px 15px;}
img.alignleft {float:left; margin:0 15px 15px 0;}
img.aligncenter {display: block; margin-left: auto; margin-right: auto; margin-bottom:15px;}
.alignright {float:right; }
.alignleft {float:left; }
.aligncenter {display: block; margin-left: auto; margin-right: auto}

.about-clear { width:100%; height:0px; clear:right; padding:20px 0 0 0;}

  .hover_caption {
    /* If you can count of CSS3 support: */
    background-color: rgba(0, 0, 0, 0.5);

    /* Or use a transparent image if you need to support bad browsers: */
    /*background-image: url(hover_caption_bg.png);*/

    /* NOTE: If you're img elements have paddings or margins you'll need to
    match them here to get things lined up properly. */
  }
	.hover_caption h3 { font-weight:normal; font-style:italic; position:absolute; top:60px; width:274px !important; text-align:center;}
	
	#wrapper-slideshow-gap {
    position: relative;
    width: 100%;
    height: 445px;
    }

    #wp-admin-bar-my-account { display: none !important; } 
	#wrapper-content {z-index: 222 !important; background-color: #FCFCFC; }
    img.vegas-background { border:0px !important; padding:0px !important; }
    .cmd-clearfix { width:100%; height:0px; clear:both !important; }
    .slideshow-info { font-family: Century Gothic, sans-serif; color: #585858; }

.cf:before, .cf:after { content: ""; display: table; } .cf:after { clear: both; } .cf { zoom: 1; }