/*=======================================================
 CSS Document for Supreme Shades
=======================================================*/

@import url("global.css");

.hidden { display: none; }
.show { display: block; visibility: visible; }

/* Core layout 
======================================================================*/
#container {width:970px; margin:0 auto; }
#top-banner {width:900px; margin:0 auto; background:url(../images/core/quote.gif) no-repeat right 180px; height:255px; }
#slider {width:910px; height:260px; }

#content {width:900px; margin:0 auto; padding:20px 0 20px 0; }
#right-cta-container {width:300px; float:right; margin:0 0 10px 40px; }
#home-page #right-cta-container {width:300px; float:right; margin:0 0 100px 40px; }


#footer-container {background:#346573 url(../images/core/footerbg.gif) repeat-x 0 0; width:100%; }
#footer {background:url(../images/core/footer.gif) no-repeat top center; width:900px; margin:0 auto; padding:25px 0 20px 0; }

.footer-column_1, .footer-column_2, .footer-column_3, .footer-column_4 {float:left; }
.footer-column_1 {width:130px; }
.footer-column_2 {width:270px; }

.footer-column_3 {width:300px; padding:0 10px 0 25px; }
.footer-column_4 {width:160px; text-align:right; }



/* Navigation layout 
======================================================================*/
ul.nav {list-style:none; width: 590px; height:32px; display: inline-block; clear: both; padding:0; float:right;}
ul.nav li {float:left; height:32px; overflow:hidden; padding:12px 0 0 0;}
ul.nav li a {display:block; height:32px; text-indent:-9999px;}
ul.nav li a:hover {background-position:0 -32px!important;}

ul.nav li#home a 					{background:url(../images/nav/home.gif) no-repeat 0 0; width: 51px;} 
ul.nav li#profile a 			{background:url(../images/nav/profile.gif) no-repeat 0 0; width: 64px;} 
ul.nav li#residential a 	{background:url(../images/nav/residential.gif) no-repeat 0 0; width: 89px;} 
ul.nav li#commercial a 		{background:url(../images/nav/commercial.gif) no-repeat 0 0; width: 95px;}
ul.nav li#colour a 				{background:url(../images/nav/colour.jpg) no-repeat 0 0; width: 101px;}
ul.nav li#testimonials a 	{background:url(../images/nav/testimonials.gif) no-repeat 0 0; width: 99px;} 
ul.nav li#contact a 			{background:url(../images/nav/contact.gif) no-repeat 0 0; width: 84px;}

#home-page 					li#home a 				{background-position:0 -32px!important; width: 51px;} 
#profile-page 			li#profile a 			{background-position:0 -32px!important; width: 64px;} 
#residential-page 	li#residential a 	{background-position:0 -32px!important; width: 89px;} 
#commercial-page 		li#commercial a 	{background-position:0 -32px!important; width: 95px;}
#colour-page 				li#colour a 			{background-position:0 -32px!important; width: 101px;}
#testimonials-page 	li#testimonials a {background-position:0 -32px!important; width: 99px;} 
#contact-page 			li#contact a 			{background-position:0 -32px!important; width: 84px;}
#contact-thankyou-page li#contact a 			{background-position:0 -32px!important; width: 84px;}

ul.cta-nav {list-style:none; width: 640px; height:125px; display: inline-block; clear: both; padding:0; float:right;}
ul.cta-nav li {float:left; height:125px; overflow:hidden; padding:24px 0 0 0;}
ul.cta-nav li a {display:block; height:125px; text-indent:-9999px;}
ul.cta-nav li a:hover {background-position:0 -125px!important;}

ul.cta-nav li#cta-residential a {background:url(../images/nav/cta-residential.gif) no-repeat 0 0; width: 209px;} 
ul.cta-nav li#cta-commercial a 	{background:url(../images/nav/cta-commercial.gif) no-repeat 0 0; width: 138px;} 
ul.cta-nav li#cta-colour a 			{background:url(../images/nav/cta-colourrange.gif) no-repeat 0 0; width: 161px;} 
ul.cta-nav li#cta-contact a 		{background:url(../images/nav/cta-contact.gif) no-repeat 0 0; width: 132px;}

ul.sitemap-links {width:130px; list-style:none; }
ul.sitemap-links li {float:left; width:130px; height:17px; padding:0 0 0 0; }
ul.sitemap-links li a {display:block; text-decoration:none; text-transform:uppercase; color:#fff; font-size:10px; }
ul.sitemap-links li a:hover {color:#FFFFCC; font-size:10px; font-weight:bold; }
li.visit{color:#ffffff;padding-top:10px!important;font-size:9px!important;}
li.visit a {color:#ffffff;}
li.visit a:hover {color:#ffffff;}

/* Easy Slider layout 
======================================================================*/

#banner {position:relative; width:939px; height:276px; background:url(../images/core/flash-bg.gif) no-repeat top center !important; padding:7px 0 0 30px; }	

#slider ul, #slider li, #slider2 ul, #slider2 li { margin:0; padding:0; list-style:none; }
#slider2{margin-top:1em;}
#slider li, #slider2 li{  /* define width and height of list item (slide)	entire slider area will adjust according to the parameters provided here */ 
	width:910px; height:260px; overflow:hidden; margin:0 auto; }	
#prevBtn, #nextBtn, #slider1next, #slider1prev{  
	display:block;
	width:30px;
	height:50px;
	position:absolute;
	left:0px;
	top:120px;
	z-index:1000;
	text-indent:-99999px;
	
	}	
#nextBtn, #slider1next{ left:940px;	}														
#prevBtn a, #nextBtn a,	#slider1next a, #slider1prev a {display:block; position:relative; width:30px; height:50px; background:url(../images/core/left.jpg) no-repeat 0 0;outline:none;}	
#nextBtn a, #slider1next a {background:url(../images/core/right.jpg) no-repeat 0 0;	}	
		
#banner-gallery {width:940px; height:276px; background:url(../images/core/flash-bg.gif) no-repeat top center !important; padding:7px 0 0 30px; }	




/* Typography  
======================================================================*/
p.quote {color:#d2e9e9; font-size:12px; font-style:italic; padding:0 0 10px 0 !important; margin:0; }
p.quote-dark {color:#668086; font-size:12px; font-style:italic; padding:0 0 10px 0 !important; margin:0; background:url(../images/core/quote.png) no-repeat 0 0px; text-indent:20px; }

.white 	{color:#fff; font-size:10px; text-transform:uppercase; }



/* Extra Bits and Pieces  
======================================================================*/
.cta-space 	{padding:15px 0 30px 0; }
#profile-page .cta-space, #residential-page .cta-space, #commercial-page .cta-space, #contact-thankyou-page .cta-space 	{padding:15px 0 10px 0; }

.warrenty		{padding:20px 0 10px 0; }
.outline 		{border:1px dotted #55a6a9; padding:15px 15px 0 15px; background-color:#cde6e7; color:#155a59; }


/* Form Formatting  
======================================================================*/