/* CSS Document */

/* Global Styles
--------------------------------------------------------------- */

* {
	margin: 0px;
	padding: 0px;
}

body, html {
	min-height: 101%;
}

body {
	text-align: left;
	font-size: 62.5%;
	font-family: Arial, Helvetica, sans-serif;
	color: #000000;
	background: url(../../images/misc/bodyBg.jpg) top repeat-x #eee;
	margin: 0px;
}

a img {
	border: none;
}

h1 {
	font-size: 2.0em;
	font-weight: bold;
	color:#222;
	padding:5px 0px 5px 0px;
	border-top:1px solid #e3e3e3;
	border-bottom:1px solid #e3e3e3;
	margin-bottom:20px;
}

h2 {
	font-size: 1.6em;
	font-weight: normal;
}

h3 {
	font-size: 1.3em;
	font-weight: normal;
}

/* Container Styles
--------------------------------------------------------------- */

#container {
	width: 960px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	font-size: 1.2em;
}

	#contentContainer {
		width: 960px;
		position: absolute;
		z-index: 1;
		top: 196px;
		background: #fff;
	}
	
/* Main Styles
--------------------------------------------------------------- */

		#main {
			float: left;
			width: 640px;
			padding-bottom:20px;
			padding-left:10px;
			padding-right:10px;
		}
			
			#main img {
				margin:20px 0;
			}
			
			#main p {
				margin: 7px 0px 7px 0px;
				padding:0px;
			}
			
			#main p a, #main ul a {
				color:#000;
			}
			
			#main h1 {
				color:#222;
			}
			
			#main ul {
				margin:20px 0 20px 40px;
			}
			
				#nrg{
					width:221px;
					height:152px;
					background:url(../../images/misc/automationBg.gif) no-repeat;
					margin-bottom:20px;
					float:left;
					padding-right:5px;
					padding-left:10px;
					padding-top:5px;
					position:relative;
				}
				
					#ditecLink{
						position:absolute;
						top:43px;
						left:135px;
					}
					
						#ditecLink a{
							width:83px;
							height:96px;
							display:block;
						}
				
				#nrg h2{
					text-transform:uppercase;
					font-weight:bold;
					color:#272727;
				}
				
				#nrg p{
					font-size:1em;
					text-align:left;
					padding:0;
					width:110px;
				}
				
				#nrg p span{
					display:block;
				}
				
				#lowerNav{
					float:right;
					width:380px;
				}
				
				#lowerNav2{
					float:right;
					width:100%;
					margin-bottom:5px;
					margin-top:13px;
				}
				
					.lowerNavButton{
						width:177px;
						height:26px;
						background:url(../../images/misc/lowerNavBg.gif) no-repeat;
						float:left;
						margin-right:20px;
						margin-bottom:10px;
					}
					
						.lowerNavButton a{
							width:142px;
							height:21px;
							padding-left:35px;
							padding-top:5px;
							font-size:1.2em;
							display:block;
							text-decoration:none;
							color:#fff;
							/*text-transform:uppercase;*/
						}
						
						.lowerNavButton a:hover{
							background:url(../../images/misc/lowerNavBg_over.gif) no-repeat;
							color:#B90203;
						}
					
					.secondLowerButton{
						margin-right:0px;
					}
					
					#lowerNav2 .lowerNavButton{
						width:142px;
						height:26px;
						background:url(../../images/misc/lowerNavBg.gif) no-repeat;
						float:left;
						margin-right:20px;
						margin-bottom:10px;
					}
					
						#lowerNav2 .lowerNavButton a{
							width:107px;
							height:21px;
							padding-left:35px;
							padding-top:5px;
							font-size:1em;
							display:block;
							text-decoration:none;
							color:#fff;
							/*text-transform:uppercase;*/
						}
						
						#lowerNav2 .lowerNavButton a:hover{
							background:url(../../images/misc/lowerNavBg_over.gif) no-repeat;
							color:#B90203;
							border-right:1px solid #9E9E9E;
						}
						
						#lowerNav2 .lastButton{
							margin-right:0;
						}
		
				#deliveryCta{
					width:382px;
					height:82px;
					background:url(../../images/misc/deliveryCta.jpg) no-repeat;
					float:right;
					clear:right;
					margin-left:10px;
					margin-top:8px;
				}
				
					#deliveryCta p{
						font-weight:bold;
						text-transform:uppercase;
						font-size:1.6em;
						width:230px;
						line-height:1em;
						padding-left:10px;
						color:#272727;
					}
		
		#googleMap {
			width: 640px;
			height: 300px;
		}
		
		#overhang{
			z-index:200;
			width:20px;
			height:98px;
			position:absolute;
			right:-10px;
			top:237px;
			/*background:url(../../images/misc/overhang.png) no-repeat;*/
		}
		
			#overhangText{
				z-index:200;
				position:absolute;
				right:0px;
				top:255px;
			}
			
				#overhangText a{
					text-transform:uppercase;
					color:#fff;
					font-weight:bold;
					width:257px;
					display:block;
					height:53px;
					text-align:right;
					font-size:2.6em;
					padding-top:9px;
					padding-right:20px;
					margin:0;
					text-decoration:none;
					line-height:0.7em;
				}
				
				#overhangText a span{
					font-size:0.6em;
				}
				
				#overhangText a:hover{
					color:#F8F500;
				}

	#tickBox{
		width:209px;
		background:url(../../images/misc/tickBoxBottom.png) bottom no-repeat;
		float:right;
		margin-right:10px;
	}
	
	#tickBoxInner{
		width:179px;
		background:url(../../images/misc/tickBoxTop.png) no-repeat;
		padding-left:15px;
		padding-top:10px;
		padding-bottom:25px;
		padding-right:15px;
	}
	
		#tickBoxInner h3{
			margin:0;
			padding:7px 0 7px 0px;
			font-weight:bold;
			text-transform:uppercase;
			color:#272727;
		}
		
		#tickBoxInner p{
			margin:0;
			background:url(../../images/misc/tickBullet.gif) center left no-repeat;
			padding:7px 0 7px 35px;
			font-size:1.1em;
		}

/* Sidebar/CTA Styles
--------------------------------------------------------------- */
		
		#sidebar {
			float: right;
			width: 300px;
			padding-left:0px;
			padding-top:20px;
			padding-bottom:20px;
		}
		
			#topCta{
				width:270px;
				height:299px;
				background:url(../../images/misc/ctaTopBg.jpg) no-repeat;
				padding:10px 10px 10px 10px;
				text-align:right;
			}
			
				#topCta h2{
					text-transform:uppercase;
					font-weight:bold;
					color:#b90203;
					padding-bottom:0px;
				}
				
				#topCta p{
					color:#fff;
				}
				
				#topCta p.number{
					font-size:3.2em;
					text-transform:uppercase;
					font-weight:bold;
					text-align:right;
					color:#b90203;
				}
				
				#topCta img{
					margin:5px 0px;
				}
				
				#topCta img.years{
					margin:5px 6px 5px 0;
				}
			
			#midCta{
				width:290px;
				background:url(../../images/misc/midRightBottom.gif) bottom no-repeat;
				position:relative;
				margin-top: 5px;
			}
			
				#quickfenceLink{
					position:absolute;
					left:155px;
					top:15px;
				}
				
					#quickfenceLink a{
						display:block;
						width:120px;
						height:35px;
					}
			
				#innerMidCta{
					width:270px;
					padding:10px;
					padding-top:55px;
					background:url(../../images/misc/quickfenceCtaBg.jpg) no-repeat;
				}
				
					#innerMidCta h2{
						color:#fff;
						font-weight:bold;
						text-transform:uppercase;
					}
					
					#innerMidCta p{
						color:#fff;
						padding-top:5px;
					}
					
					#innerMidCta a{
						color:#fff;
						float:right;
					}
				
			#callback{
				width:290px;
				color: #fff;
				margin-top: 5px;
				background:url(../../images/misc/callbackBottom.gif) bottom no-repeat;
			}
			
				#innerCallback{
					width:280px;
					background:url(../../images/misc/midRightTop.gif) no-repeat;
					padding:10px 0 0 10px;
				}
				
				#innerCallback h3{
					color:#fff;
					font-size:1.8em;
					font-weight:bold;
				}
				
				#innerCallback table{
					margin-top:10px;
					margin-bottom:5px;
				}
				
				#innerCallback td{
					padding-bottom:3px;
				}
				
				#innerCallback td.left{
					padding-right:10px;
					width:90px;
					text-align: right;
					font-weight: bold;
				}
				
				#innerCallback p{
					color:#fff;
					padding-top:5px;
				}
				
				#innerCallback .lowercase {
					text-transform:lowercase;
				}
		
/* Header Styles
--------------------------------------------------------------- */

#header {
	width: 960px;
	height: 142px;
	border-top:8px solid #333;
	position: absolute;
	background:url(../../images/misc/headerBg.png) repeat-x;
	z-index: 10;
	top: 0px;
	left: 0px;
}

	#innerHeader{
		width:960px;
		height:142px;
		background:url(../../images/misc/railingsBg.gif) right no-repeat;
	}

	#logo {
		width: 294px;
		height: 79px;
		float: left;
		margin-top:28px;
		margin-left:30px;
	}
	
	#cta-top-right {
		float: right;
		padding: 5px 20px 5px 20px;
		margin-right:30px;
		margin-top:40px;
		text-align: right;
		font-size: 1.9em;
		color:#fff;
		/*background: #333 url(../../images/misc/cta-top-right-bg.jpg) right top no-repeat;*/
	}
	
	#cta-top-right p span.number{
		color:#f8f500;
	}

#flashSlideshow {
	background: url(../../images/misc/flashSlideshowBackup.jpg);
	margin:10px 0 0 0;
}

	#flashSlideshow img{
		background: url(../../images/misc/flashSlideshowBackup.jpg);
		margin:10px 0 0 0;
		padding:0;
	}

body#index #flashSlideshow{
	margin:10px 0;
}

/* Horizontal Navigation Styles
--------------------------------------------------------------- */

#navigation {
	width: 960px;
	height: 46px;
	z-index: 1;
	position: absolute;
	left: 0px;
	top: 150px;
	background: url(../../images/misc/navBg3.png) right;
}

	#navigation ul {
		margin: 0px;
		padding: 0px;
	}
	
		#navigation ul li {
			display: inline;
			list-style: none;
		}
			  
			#navigation ul li a {
				float: left;
				border-right: 1px solid #606060;
				border-left: 1px solid #343434;
				/*background: #00216b;*/
				color: #fff;
				display:block;
				text-decoration: none;
				padding: 7px 9px 0 27px;
				height:38px;
				font-weight: bold;
				font-size: 1em;
				background:url(../../images/misc/navBg3.png) no-repeat;
			}
			
			#navigation ul li a span{
				display:block;
			}
			
				#navigation ul li a.index-a {
					border-left: none;
					padding: 15px 15px 0 32px;
					height:31px;
				}
				
				#navigation ul li a.rightLink {
					border-right: none;
					padding: 15px 15px 0 32px;
					height:31px;
				}

				#navigation ul li a:hover {
					background:url(../../images/misc/navBg4.png) no-repeat;
					color: #404040;
				}
				
#index #navigation .index-a,
#wrought-iron #navigation .link1-a,
#fencing-railings #navigation .link2-a,
#wooden-gates #navigation .link3-a,
#security-commercial #navigation .link4-a,
#gate-automation #navigation .link5-a,
#steel-balconies #navigation .link6-a,
#metal-post-boxes #navigation .link7-a,
#contact #navigation .contact-a {
	color:#f8f500;
	background:url(../../images/misc/naOn.png) no-repeat;
}

#steel-balustrades #lowerNav2 .link8-a,
#bespoke-design #lowerNav2 .link9-a,
#quickfence #lowerNav2 .link10-a,
#gallery #lowerNav2 .link11-a{
	color:#f8f500;
}

#steel-balustrades #lowerNav2 .link8-a:hover,
#bespoke-design #lowerNav2 .link9-a:hover,
#quickfence #lowerNav2 .link10-a:hover,
#gallery #lowerNav2 .link11-a:hover{
	color:#B90203;
	border-right:1px solid #9E9E9E;
}

/* Contact Details Table Styles
--------------------------------------------------------------- */

h2.enquiry{
	margin-left:0px;
	margin-top:20px;
	padding-bottom:5px;
}

#contact table.innertable{
}

#contact table.innertable td{
	padding:5px 30px 5px 0px;
}

#contact table.innertable td.noPad{
	padding:5px 0px 5px 0px;
}

/* Footer Styles
--------------------------------------------------------------- */
#outerFooter{	
	clear: both;
	background:url(../../images/misc/footerBg.png) repeat-x #650100;
}
* html #outerFooter{
	display:inline;
}	
#footer {
	width: 930px;
	color: #ccc;
	background:url(../../images/misc/footerGate.gif) right top no-repeat;
	padding: 10px 10px 10px 20px;
	font-size: 0.9em;
	

}

	#footer .index-a, #footer .contact-a {
		display: none;
	}

	#footer h2 {
		font-weight: bold;
		margin: 0px;
		color: #fff;
		padding: 3px 5px;
		font-size: 1.2em;
		font-style: italic;
		font-weight:bold;
		/*width: 250px;*/
	}
		
	#footer li {
		list-style: none;
	}
	
	#footer p, #footer ul {
		margin: 0px;
		padding: 0px;
	}

	#footer a {
		white-space: nowrap;
		color: #ccc;
		text-decoration: none;
	}
	
	#footer a:hover {
		color: #ffcc00;
		text-decoration:underline;
	}

/* Footer Services Styles
--------------------------------------------------------------- */	

	#footer #footer-services {
		float: left;
		width: 250px;
		margin: 0px;
	}
	
		#footer #footer-services ul li {
			float: left;
		}
	
			#footer #footer-services ul li a {
				float: left;
				width: 230px;
				padding: 3px 5px;
				border-bottom: 1px dotted #777;
			}
		
/* Footer Areas Styles
--------------------------------------------------------------- */	

	#footer #footer-areas {
		float: left;
		margin-left:25px;
		margin-right:10px;
		/*width: 320px;*/
	}
	
		#footer #footer-areas h2 {
			/*width: 300px;*/
		}
	
		#footer #footer-areas ul {
			float: left;
			width: 155px;
		}
	
		#footer #footer-areas ul li {
			float: left;
			width: 125px;
			padding: 3px 5px;
			border-bottom: 1px dotted #777;
		}
		
/* Footer Right Styles
--------------------------------------------------------------- */	


	#footer #footer-right {
		float: left;
		width: 140px;
		margin-right:25px;
	}
	
		#footer #footer-right h2 {
			/*width: 170px;*/
		}
		
		#footer #footer-right p {
			line-height: 20px;
			padding: 3px 5px;
		}
				
/* Footer Right Styles2
--------------------------------------------------------------- */	

	#footer #footer-right2 {
		float: left;
		width: 165px;
	}
	
		#footer #footer-right2 h2 {
			width: 155px;
		}
		
			#footer #footer-right2 ul li {
				float: left;
			}
					
			#footer #footer-right2 ul li a {
				float: left;
				width: 165px;
				padding: 3px 5px;
				border-bottom: 1px dotted #777;
			}
		
		#footer #footer-right2 p {
			line-height: 20px;
			padding: 3px 5px;
		}
		
		#footer #footer-right2 .bottomLink {
			margin-bottom: 5px;
		}
		
		
/* Footer Bottom Styles
--------------------------------------------------------------- */	

	#footer #footer-bottom {
		width: 940px;
		clear: both;
		float: left;
		margin: 10px 0px 0px 0px;
		text-align: center;
	}

/* Image Styles
--------------------------------------------------------------- */

#main img.img-left {
	float: left;
	margin: 0px 20px 20px 0px;
	padding:0;
}

body#steel-balconies #main img.img-left {
	float: left;
	margin: 0px 20px 30px 0px;
	padding:0;
}

.img-right {
	float: right;
	margin: 0px 0px 10px 10px;
	padding-left:20px;
	padding-right:10px;
}

#main .img-rightNM {
	float: right;
	margin:0px;
	padding-left:20px;
	padding-right:10px;
}
	
	.img-border {
		border: 1px solid #ccc;
	}
	
/* Contact Table Styles
--------------------------------------------------------------- */

	#contact #botBuster {
		display: none;
	}
	
/* Generic Styles
--------------------------------------------------------------- */

.clearfix {
	clear: both;
}

img.smallLogos{
	margin-left:6px;
	margin-top:10px;
}

.ctaImg{
	margin-left:10px;
}