/* Main site CSS */

body { font-family: Helvetica, Arial, sans-serif; background: #312E2F url("../img/sg-bg.gif") 0px 393px repeat-x; color: #E3E3E3; font-size: 12px; }
body.gallery { background-position: 0px 550px; }
body.case { background-position: 0px 508px; }
body.about { background-position: 0px 506px; }
body.craftsmanship { background-position: 0px 507px; }
body.services { background-position: 0px 506px; }
body.contactus { background-position: 0px 506px; }


/*div { border: 1px solid #CE1212; }*/
img { border: none; }
a { color: #E3E3E3; text-decoration: none; }
a:hover { color: #FFFFFF; }
ul { margin-left: 20px; }   



/* LAYOUT */
#main-wrap { text-align: center; }
#site-header { height: 91px; background: url("../img/sg-header.gif") top left repeat-x; text-align: center; }
#header-content { padding-top: 20px; }
#page-content { margin-top: 18px; }
#site-footer { margin: 30px 0;}
#tc-left { width: 320px; }
#tc-middle { width: 180px; margin: 100px 0 0 0; text-align: right; }
#tc-right { width: 360px; }
#map { width: 540px; height: 405px; }
#contact-form { margin-left: 20px; width: 320px; }
.site-block { width: 890px; text-align: left; margin: 0px auto; }
.home-blocks { margin-top: 20px; }
.home-blocks .last { margin-right: 0; }
.home-block { width: 287px; height: 76px; border-right: 3px solid #952c08; margin-right: 10px; }
.home-block .copy { margin-left: 110px; margin-right: 10px; }
.people-panel { width: 420px; margin-right: 20px; }
.people-panel .people-copy { width: 300px; margin-left: 10px; }
.people-panel h3 { margin-bottom: 0.3em; }
#tc-right.tc-wider { width: 560px; }
/* FADER */
.fade-block { position: relative; width: 890px; height: 310px; }
.fade-blanket { position: absolute; bottom: 0px; left: 0px; width: 100%; text-align: right; }
.fade-blanket p { font-size: 1.8em; padding: 20px; margin: 0; }



/* NAVIGATION */
#site-navigation { height: 30px; background: #000000; margin-bottom: 8px; }
#navigation-content { height: 22px; position: relative; }
ul.navigation { margin-left: 0px; padding-top: 6px; }
	ul.navigation li { float: left; padding: 0 10px; /*border-right: 1px solid #616060;*/ text-align: center; }
	ul.navigation li.first { padding-left: 0; }
	ul.navigation li.last { border-right: none; }
	
ul.border-bottom { bottom: -16px; position: absolute; }	
ul.border-bottom li { border-bottom: 8px solid #312E2F; padding-bottom: 9px; }

/* HOVER RULES */
ul.border-bottom li.li-home:hover 			{ border-bottom: 8px solid #952c08; }
ul.border-bottom li.li-craftsmanship:hover 	{ border-bottom: 8px solid #bb7308; }
ul.border-bottom li.li-gallery:hover 		{ border-bottom: 8px solid #bd9408; }
ul.border-bottom li.li-services:hover 		{ border-bottom: 8px solid #849d11; }
ul.border-bottom li.li-aboutsg:hover 		{ border-bottom: 8px solid #086d73; }
ul.border-bottom li.li-contactus:hover 		{ border-bottom: 8px solid #103066; }

/* TEXT RULES 
.craftsmanship #site-sub-navigation a			{ color: #333; text-decoration: none; }
.services #site-sub-navigation a 				{ color: #333; text-decoration: none; }
.craftsmanship #site-sub-navigation a:hover		{ color: #000; text-decoration: none; }
.services #site-sub-navigation a :hover			{ color: #000; text-decoration: none; }*/


/* ON RULES */
ul.border-bottom li.on 	{ color: #FFFFFF; border-bottom: 8px solid #A76405; }
.home ul.border-bottom li.on 			{ border-bottom-color: #952c08; }
.craftsmanship ul.border-bottom li.on 	{ border-bottom-color: #bb7308; }
.gallery ul.border-bottom li.on 		{ border-bottom-color: #bd9408; }
.services ul.border-bottom li.on 		{ border-bottom-color: #849d11; }
.about ul.border-bottom li.on 			{ border-bottom-color: #086d73; }
.contactus ul.border-bottom li.on 		{ border-bottom-color: #103066; }

/* SUB NAVIGATION */
#site-sub-navigation { background: #A76405; height: 24px; }
.home #site-sub-navigation 			{ background: #952c08; }
.craftsmanship #site-sub-navigation { background: #bb7308; }
.gallery #site-sub-navigation 		{ background: #bd9408; }
.services #site-sub-navigation 		{ background: #849d11; }
.about #site-sub-navigation 		{ background: #086d73; }
.contactus #site-sub-navigation 	{ background: #103066; }
/*.home #site-sub-navigation 		{ background: #A76405; }
.about #site-sub-navigation 		{ background: #663333; }
.craftsmanship #site-sub-navigation { background: #336633; }
.gallery #site-sub-navigation 		{ background: #993400; }
.contactus #site-sub-navigation 	{ background: #666633; }
.services #site-sub-navigation 		{ background: #336666; }*/
.gallery #site-sub-navigation, .home #site-sub-navigation { height: 8px; }

#sub-navigation-content {  }
#sub-navigation-content ul.navigation li.on { font-weight: bold; }

/* GALLERY */
.gallery-block { margin: 0 24px 24px 0; position: relative; }
.gallery-last { margin-right: 0;}
.gallery-blanket { position: absolute; bottom: 0px; left: 0px; width: 100%; text-align: left; }
.gallery-blanket p { padding: 8px 10px; margin: 0; }
.panel-one { width: 300px; float: left;}
.panel-two { float: right; }

/* CONTACT FORM */
#contact-form { }
#flash-holder { height: 20px; }
.form-part { margin-bottom: 10px; }
.form-part label { float: left; font-weight: bold; }
.form-part input, .form-part textarea { float: right; width: 200px; border: 1px solid #545252; background-color: #312E2F; color: #E3E3E3; padding: 0.2em; font-size: 1em; font-family: Helvetica, Arial, sans-serif; }
.form-options { width: 230px; }
.form-options label { padding-right: 10px; } 
.flash-error { color: #b01008; padding: 0 0 10px 0; font-weight: bold; }

/* FOOTER */
#footer-content { border-top: 1px solid #616060; padding: 8px 0; color: #616060; font-size: 0.9em; }
#footer-content ul.navigation li { float: right; border-right-color: #616060; }
#footer-content a { color: #616060; }
#footer-content a:hover { color: #E3E3E3; }
#footer-content ul.navigation li.last { padding-right: 0; }










/* TYPOGRAPHY */

h1 { font-size: 1.5em; margin: 0.3em 0; }

h2 {  }

h3 { font-size: 1.2em; margin-bottom: 1em; }

h4 {  }

p { margin: 0 0 1em 0; line-height: 140%; }






/* GENERAL */
.center { text-align: center; }
.clear { clear: both; }
.left { float: left; }
.right { float: right; }
.full-left { float: left; width: 49%; text-align: left; }
.full-right { float: right; width: 49%; text-align: right; }
.no-margin { margin: 0; }
.hidden { display: none; }