/*----------------------------------------------------
	
	SCREEN.CSS
	
----------------------------------------------------*/

@import url("reset.css");


/*--- 00. Common Elements ---------------------------------------------------------------------------*/

body 						{background:url('../img/window-bg.png') repeat-x #F3DBAA; font-family:Arial, Helvetica Neue, Helvetica, sans-serif; font-size: 75%; /* Resets 1em to 12px */}

a							{color:#9C6F14; text-decoration:underline;}
a:focus, a:hover			{color:#D09F45; text-decoration:none;}


/*--- 01. Headings ---------------------------------------------------------------------------*/

h1, h2						{color:#9F731B; font-size:2em; font-weight:bold; margin:0 0 30px 0;}
h3							{font-size:1.2em; font-weight:bold;}


/*--- 02. Global Container Elements ---------------------------------------------------------------------------*/

#main-container				{border:1px solid #CD993A; margin:0px auto 10px auto; position:relative; width:960px;}


/*--- 03. Header ---------------------------------------------------------------------------*/

#header 					{height:100%; overflow:hidden; width:100%;}
#logo						{background:url('../img/sash-repairs.gif') no-repeat; display:block; float:left; height:84px; text-indent:-9999px; width:300px;} 
#header img					{float:left;}


/*--- 04. Navigation ---------------------------------------------------------------------------*/

#nav						{background:url('../img/menu-bg.png') repeat-x; height:29px;}
#nav li						{float:left;}
#nav li a					{color:#FFFFFF; display:block; height:22px; padding:7px 17px 0 16px; text-decoration:none;}
#nav li a:hover,
#nav li a:focus				{text-decoration:underline;}
#nav li.tab-1, 
#nav li.tab-2, 
#nav li.tab-3, 
#nav li.tab-4 				{background-repeat:repeat-x; border-left:1px solid #E5D9C1; text-align:center; width:119px;}
#nav li.tab-1 				{background-image:url('../img/menu-bg1.png');}
#nav li.tab-2 				{background-image:url('../img/menu-bg2.png');}
#nav li.tab-3 				{background-image:url('../img/menu-bg3.png');}
#nav li.tab-4 				{background-image:url('../img/menu-bg4.png');}
#nav li.tab-1 a, #nav li.tab-2 a, #nav li.tab-3 a, 
#nav li.tab-4				{padding-left:0; padding-right:0;}

 
/*--- 05. Content ---------------------------------------------------------------------------*/ 
  
#content 					{background:#FFFFFF; height:100%; overflow:hidden; padding:20px 50px; text-align:justify; width:860px;}
#homepage #content			{padding:0; width:960px;}

#content p 					{line-height:180%; margin:0 0 20px 0;}
#content ol 				{color:#DCAF53; font-family:Georgia, "Times New Roman", Times, serif; font-size:1.2em; font-weight:bold; list-style:decimal; margin:0 0 0 20px;}
#content li 				{margin:0 0 0 5px;}
#content ol p				{color:#000000; font-family:Arial, Helvetica, sans-serif; font-size:0.8em; font-weight:normal; margin:8px 0;}

#column-1					{float:left; width:404px;} 
#column-2					{float:right; width:406px;}

#content ul.gallery 		{margin:0 0 0 -27px;}
#content ul.gallery li		{display:inline; float:left; line-height:180%; margin:0 0 20px 27px; width:150px;}
.gallery a img				{border:1px solid #9C6F14;}
.gallery span				{color:#9C6F14; display:block;}


/*--- 06. Index ---------------------------------------------------------------------------*/ 

#homepage #column-1			{width:480px;}
#homepage #column-1	img		{display:block;}
#homepage #column-2			{text-align:right; width:480px;}

#macro-intro-area			{background:#9C6F14; color:#FFFFFF; margin:0 0 0 1px; padding:45px 35px; text-align:justify;}
#macro-intro-area h1  		{color:#FFFFFF;}
#macro-intro-area h1 span	{color:#FAE5A3;}
#homepage #column-2 #macro-intro-area p	{margin:0 0 20px 0;}
#macro-intro-area p a		{color:#FAE5BB; font-weight:bold; text-decoration:none;}
#macro-intro-area p a:focus,  
#macro-intro-area p a:hover {text-decoration:underline;}

#homepage #column-2 img 	{margin:15px 50px 0 0;}
#homepage #column-2 p 		{margin:10px 50px 0 0;}


/*--- 07. Our Work ---------------------------------------------------------------------------*/ 

#our-work ul.gallery		{margin:0 0 0 -80px; position:relative; zoom:1;}
#our-work ul.gallery li		{margin-left:80px;}


/*--- 08. Testimonials ---------------------------------------------------------------------------*/ 

#content ul.testimonial-list li	{border-bottom:1px solid #DFC795; height:100%; line-height:180%; margin:20px 0; overflow:hidden; padding:0 0 25px 0;}
.testimonial-list img		{float:left; margin:0 20px 0 0;}
.testimonial-list blockquote	{font-style:italic; margin:0 0 5px 0;}
.testimonial-list span		{color:#9C6F14; font-size:1.2em;}
.testimonial-list cite		{color:#9C6F14; display:block;}
.testimonial-list strong	{display:block;}

a.next-page-link,
a.prev-page-link 			{border:1px solid #DFC795; border-left:0; border-right:0; padding:4px 0;}
a.next-page-link 			{background:url('../img/misc/arrow-link_next.gif') no-repeat right center; float:right; padding-right:20px;}
a.prev-page-link 			{background:url('../img/misc/arrow-link_back.gif') no-repeat left center; float:left; padding-left:20px;}


/*--- 09. Contact ---------------------------------------------------------------------------*/ 

#contact-us h3				{color:#9C6F14;}
#contact-us #column-2  		{width:366px;}

.vcard 						{border-top:1px solid #DFC795; padding:10px 0 0 0;}
.vcard p,
.vcard address				{padding:0 0 0 30px; width:170px;}
.vcard p.tel-row 			{background: url('../img/misc/icon_phone.gif') no-repeat;}
.vcard p.email-row 			{background: url('../img/misc/icon_email.gif') no-repeat;}
.vcard address				{border-left:1px solid #DFC795; float:right; font-style:normal; line-height:180%;}
.vcard strong 				{color:#9C6F14;}

form						{width:350px;}
form label 					{color:#9C6F14; display:block; float:left; font-weight:bold; width:95px;}
form input, form textarea, 
form select 				{background:#F7EFD7; border:1px solid #9C6F14; color:#9C6F14;}
form input 					{width:212px;}
form textarea 				{width:306px;}
.select-row label 			{display:inline; float:none; margin:0 10px 0 0;}
input[type="submit"]		{background:url('../img/misc/button_submit.gif') no-repeat; border:0; cursor:pointer; float:right; height:35px; margin:0 55px 0 0; padding:0 0 0 110px; text-indent:-9999px; width:110px;}

.message-error				{color:#FF0000;}

#p-security					{clear:both; display:none; height:0px; visibility:hidden;}
#p-security label			{float:none; padding:0 0 4px 0; text-align:left; width:auto;}
#p-security input[type='text']	{display:block; float:none;}


/*--- 10. Repairs ---------------------------------------------------------------------------*/ 

#repairs #column-1 			{width:300px;}
#repairs #column-2 			{width:510px;}
#repairs ul.gallery			{margin:0 0 0 -24px; position:relative; zoom:1;}
#repairs ul.gallery li		{margin-left:24px;}


/*--- 11. Renovation ---------------------------------------------------------------------------*/ 

#renovation #column-1		{width:444px;}
#renovation #column-2 		{width:376px;}
#renovation #column-2 > p 	{text-align:right;}
#renovation ul.gallery		{margin:0 0 0 -26px; position:relative; zoom:1;}
#renovation ul.gallery li	{margin-left:50px; min-height:155px;}


/*--- 12. Draught Proofing ---------------------------------------------------------------------------*/ 

#draught-proofing #column-1 ul li {background:url('../img/misc/bullet_1.gif') no-repeat; margin:0; padding:0 0 0 25px;}
#draught-proofing #column-1 {width:444px;}
#draught-proofing #column-2 {width:366px;}
#draught-proofing ul.gallery	{margin:0 0 0 -46px; position:relative; zoom:1;}
#draught-proofing ul.gallery li	{margin-left:50px; min-height:155px;}


/*--- 13. Replacements ---------------------------------------------------------------------------*/ 

#replacements ul.gallery	{margin:0 0 0 -65px; position:relative; zoom:1;}
#replacements ul.gallery li	{margin-left:72px; width:113px;}


/*--- 14. Sitemap ---------------------------------------------------------------------------*/ 

#sitemap #content ul li		{background: url('../img/misc/bullet_1.gif') no-repeat; list-style:none; line-height:180%; margin:0; padding:0 0 20px 25px;}


/*--- 15. Info ---------------------------------------------------------------------------*/ 

#subnav						{background:url(../img/menuTop.jpg) no-repeat; float:left; padding:31px 0 0 0; width:185px;}
#subnav li					{margin:0;}
#subnav a					{background:url(../img/menu.gif); color:#9F731B; display:block; height:24px; padding:8px 0 0 35px; text-decoration:none;}
#subnav a:hover				{background-position:0 -32px; color:#FFFFFF;}

.alignright					{float:right;}
.alignleft					{float:left;}

.info-section #content 		{padding-left:75px; padding-right:75px; width:810px;}
.info-section #content p 	{margin-top:12px; text-align:justify;} 
.info-section h1, h2, h3, h4	{border-bottom:1px solid #DFC795; font-size:1.6em; line-height:180%;}
.info-section h2, h3, h4	{clear:both; color:#9F731B; font-weight:bold; line-height:160%; margin-bottom:20px;}

#column-info-3 				{float:left; margin:0 0 20px 25px; width:600px;}
#infopic					{margin:5px 5px 20px 39px;}
#info-links					{clear:both; padding:20px 0 0 0;}
#info-links li				{border:1px solid #DFC795; border-left:0; border-right:0; line-height:180%; margin:0 0 25px 0; text-transform:uppercase;}
#info-links li span			{text-transform:none;}

#column-3 					{float:right; width:595px;}
.info-section blockquote	{font-family:Georgia, "Times New Roman", Times, serif; font-size:0.87em; line-height:180%; margin:10px 85px 20px 85px;}

.pullquote					{margin:6px 0 40px 0; padding:5px; text-align:center;}	
.pullquote a				{text-decoration:none;}	
.icon-enlarge				{float:right; margin:0 0 0 5px;}
.alignleft .icon-enlarge	{float:left; margin:0 5px 0 0;}
.info-section #content .pullquote p	{border-bottom:1px solid #DEC794; font-family:Georgia, "Times New Roman", Times, serif; font-size:0.87em; font-style:italic; line-height:normal; margin:0; padding:5px; text-align:center;}
.pullquote span				{color:#000000; font-size:1.1em; font-weight:bold;}
.pullquote-270				{margin-left:25px; width:270px;}
.pullquote-405				{margin-left:25px; width:405px;}
.pullquote-635				{margin-left:70px; width:635px;}
.pullquote-650				{margin-left:70px; width:650px;}
.triple-pullquote .alignleft	{margin-right:33px;}
.top-row-img				{margin-bottom:13px;}

.clear						{clear:both;}

#recommended-reading		{clear:both; height:100%; margin:0 0 25px 0; overflow:hidden; text-align:center;}
#recommended-reading div	{font-family:Georgia, "Times New Roman", Times, serif; font-size:0.8em; width:380px;}

#acknowledgements 			{border-top:1px solid #DFC795; font-size:0.8em; padding:10px 0 0 0; text-align:center;}
#acknowledgements h6		{font-style:italic; font-weight:bold; text-transform:uppercase;}
.info-section #content #acknowledgements p	{font-style:italic; line-height:normal; margin:0; text-align:center;}

#note-2 #column-3 p:first-child	{margin-top:10px;}


/*--- START OF CSS ADDED BY JOHN ---------------------------------------------------------------------------*/
 
 .pullquote-595				{width:595px;}
 .pullquote-648				{margin-left:76px; width:648px;}
 .pullquote-860				{width:805px;}
 
 
.three-pullquote .alignleft	{margin-right:20px;} 
.three-pullquote2 .alignleft {margin-right:20px; margin-bottom:13px;}


/*--- END OF CSS ADDED BY JOHN ---------------------------------------------------------------------------*/ 


/*--- 16. About ---------------------------------------------------------------------------*/ 

#about-us #column-1 img		{border:1px solid #9C6F14; float:left; margin:5px 10px 10px 0;}
#about-us #column-2 img		{border:1px solid #9C6F14; float:right; margin:5px 0 10px 10px;}


/*--- 17. 404 ---------------------------------------------------------------------------*/ 

#four-o-four #content ul li		{background: url('../img/misc/bullet_1.gif') no-repeat; list-style:none; line-height:180%; margin:0; padding:0 0 20px 25px;}


/*--- 50. Footer ---------------------------------------------------------------------------*/ 

#footer 					{background:#9C6F14; border-top:1px solid #CD993A; font-size:0.85em; height:100%; overflow:hidden; width:100%;}
#footer p 					{color:#FFFFFF; padding:5px;}
#copyright					{float:left; width:75%;}
#link-sitemap				{color:#FFFFFF; display:block; float:right; padding:5px; text-decoration:none;}
#link-sitemap:hover			{text-decoration:underline;}
#siteby						{margin:-10px auto 10px auto; text-align:right; width:960px;}
