* {
	margin:0;
	padding:0;
}

.clearfix {
	display:block;
	clear:both;
}

.skiplinks {
	height:0;
	width:0;
	left:-19000px;
	overflow:hidden;
	position:absolute;
}

body {
	background-position:center top;
	background-image:url(/images/wood-bg.jpg);
	background-repeat:repeat;
	font-family:Helvetica,Verdana,Arial,sans-serif;
/* 	font-size:62.5%; */
	padding:10px 0 100px;
	background-color:#ccc;
}

h2 {
	font-size:14px;
	padding:0 0 10px;
	color:#333;
}

h4 {
	font-size:12px;
	padding:0 0 10px;
	color:#333;
}

p {
	font-size:13px;
	line-height:130%;
	color:#333;
}

a {
	line-height:130%;
}

#wrapper {
	margin:auto;
	width:960px;
	background-color:#fff;
	padding:0 10px;
}

#wrapper-top {
	background-image:url(/images/top.png);
	background-position:center top;
	background-repeat:no-repeat;
	width:980px;
	height:10px;
	background-color:#fff;
	margin:auto;
}

#wrapper-base {
	background-image:url(/images/base.png);
	background-position:center bottom;
	background-repeat:no-repeat;
	width:980px;
	height:10px;
	background-color:#fff;
	margin:auto;
}

#header {
	float:left;
	width:960px;
}

#logo {
	float:left;
	padding:0 0 20px 20px;
}

#logo img {
	border:0;
}

#header-contact {
	float:right;
	width:350px;
	padding:20px 20px 0 0;
}

.telephone {
	float:right;
	width:200px;
	clear:right;
	font-size:28px;
	font-weight:700;
	color:#555;
	text-align:right;
	padding:0 0 3px;
}

#call-us {
	float:left;
	width:auto;
	font-size:18px;
	padding:5px 0 0;
	font-weight:700;
	color:#333;
}

ul.nav {
	float:left;
	clear:both;
	width:940px;
	height:40px;
	padding:10px 0 10px 20px;
	border-top:1px dashed #aaa;
}

ul.nav li {
	display:inline;
	float:left;
	width:auto;
	height:40px;
}

ul.nav a {
	float:left;
	display:block;
	width:auto;
	font-size:12px;
	font-weight:700;
	color:#555;
	text-decoration:none;
	padding:10px 0 5px;
	margin:0 20px 0 0;
}

ul.nav a:hover {
	border-bottom:2px solid #a03e1d;
}

body#home .home,
body#garages .garages,
body#sheds .sheds,
body#extras .extras,
body#repairs .repairs,
body#removals .removals,
body#contact .contact {
	border-bottom:2px solid #a03e1d;
}

#main-content {
	float:left;
	width:960px;
	padding-bottom: 15px;
}

#home-left {
	float:left;
	width:440px;
	height:200px;
	padding:25px 20px 0;
	border-top:1px dashed #aaa;
}

#home-left h1 {
	font-size:27px;
	line-height:130%;
	padding:0 0 15px;
	color:#333;
}

#home-left h2 {
	line-height:130%;
	padding:0 0 10px;
}

ul.home-left {
	padding:0 0 0 15px;
}

ul.home-left li {
	font-size:13px;
	padding:0 0 10px;
	line-height:140%;
}

#home-right {
	float:left;
}

#home-right img {
	width:440px;
	padding:25px 20px 30px;
	border-top:1px dashed #aaa;
}

.inner-left {
	float:left;
	width:440px;
	padding:25px 20px 30px;
	border-top:1px dashed #aaa;
}

.inner-left h1 {
	font-size:27px;
	line-height:130%;
	padding:0 0 5px;
	color:#333;
}

.inner-left h2 {
	padding:15px 0 5px;
}

.inner-left p {
	line-height:140%;
}

#inner-right {
	float:left;
	width:440px;
	padding:25px 20px 0 20px;
	border-top:1px dashed #aaa;
}

#inner-right h2 {
	float:left;
	display:block;
	width:398px;
	padding:20px;
	background-color:#eee;
	font-size:18px;
	line-height: 120%;
	border:1px solid #999;
}

.inner-box {
	float:left;
}

.inner-extras {
	float:left;
	width:480px;
	padding:25px 0 0;
	border-top:1px dashed #aaa;
}

.main-box {
	float:left;
	width:280px;
	height:215px;
	padding:20px;
	border-top:1px dashed #aaa;
	border-bottom:1px dashed #aaa;
}

.main-box img {
	padding:0;
}

.sub-box {
	float:left;
	width:280px;
	height:130px;
	padding:30px 20px;
	border-bottom:1px dashed #aaa;
}

.sub-box img {
	float:right;
	padding:0 0 0 10px;
}

.sub-box h2 {
	padding:0;
}

.portfolio-box {
	float:left;
	width:200px;
	height:160px;
	padding:30px 20px 0;
}

.extras-box {
	float:left;
	width:200px;
	height:160px;
	padding:0 20px;
}

.contact-box {
	float:left;
	width:280px;
	height:500px;
	padding:40px 20px;
	border-top:1px dashed #aaa;
	border-bottom:1px dashed #aaa;
}

.contact-box h3,#map-box h3 {
	font-size:16px;
	padding:0 0 20px;
	color:#333;
}

.contact-box p {
	padding:0 0 20px;
}

.main-box img,
.sub-box img,
.portfolio-box img,
.extras-box img,
.contact-box img,
.contact-box img {
	border:0;
}

#map-box {
	float:left;
	width:922px;
	padding:20px 19px 40px;
	border-top:1px dashed #aaa;
	border-bottom:1px dashed #aaa;
}

#map-box img {
	border:1px solid #999;
}

.contact-box h3 {
	font-size:16px;
	padding:0 0 20px;
	color:#333;
}

.main-box a,
.sub-box a,
.portfolio-box a,
.extras-box a,
.contact-box a,
#map-box a {
	font-size:13px;
}

form {
	float:left;
	width:270px;
	margin:0;
	padding:0;
}

fieldset {
}

legend {
}

label,input,textarea {
	font-size:12px;
	font-family:Arial,Verdana,Helvetica,sans-serif;
	float:left;
	clear:left;
	padding:0;
}

input,textarea {
	border:1px solid #999;
	color:#444;
	margin:0;
	padding:3px;
	margin:8px 0 10px;
	background-color:#eee;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
}

label {
	margin:0;
	width:100%;
}

input:focus,textarea:focus {
	background:#fff;
}

#message,#from,#name,#phone {
	width:240px;
}

.msgSent p {
	color:#0acb10;
}

.errormsg p {
	color:red;
	font-weight:700;
}

#footer {
	float:left;
	width:920px;
	padding:20px;
	font-size:12px;
}

#footer a {
	text-decoration:none;
	color:#666;
}

#footer a:hover {
	text-decoration:underline;
}

#footer-left {
	float:left;
}

#footer-right {
	float:right;
}

.links {
	display:block;
	font-weight:700;
	padding:10px 0 0;
}

.links a {
	text-decoration:none;
	color:#a03e1d;
}

.links a:hover {
	text-decoration:underline;
}

#breadcrumbs {
	float:left;
	width:700px;
	height:20px;
	padding:5px 0 0 20px;
	font-size:12px;
	color:#444;
}

#breadcrumbs a {
	color:#a03e1d;
}

.offer {
	color:#a03e1d;
}

#call-to-action {
	float:left;
	display:block;
	width:920px;
	font-size:20px;
	line-height:150%;
	font-weight:700;
	padding:20px 20px 0;
	color:#333;
}

.base-line {
	clear:left;
	border-bottom:1px dashed #aaa;
	padding:20px 0 0;
}

.padding-20 {
	padding-left:20px;
}

#pad {
	padding:0;
}

#gap {
	float:left;
	display:block;
	width:920px;
	height:100px;
	padding:20px;
}

#float {
	float:left;
}

#right {
	float:right;
	padding:0 20px 0 0;
}

#green {
	color:#0acb10;
}

.red {
	color:red;
	font-weight:700;
	font-size:12px;
}

#indicates {
	float:left;
	clear:left;
	width:270px;
	height:30px;
	font-size:10px;
	padding:20px 0 0;
}

.no-pad,#no-pad-link {
	padding:0;
}

/* ********************* Media Queries ********************* */

@media all and (max-width: 740px) {
	
	h1 {
/* 		font-size: 28px !important; */
	}
	
	h2 {
		font-size: 17px !important;
	}
	
	p {
		font-size: 14px;
	}
	
	.inner-left p {
		line-height: 160%;
	}

	img {
		max-width: 100%;
	}
	
	body,
	#wrapper-top,
	#wrapper-base {
		background-image: none;
	}
	
	body {
		background-color: white;
		padding: 0px;
	}
	
	body,
	#wrapper-top,
	#wrapper,
	#header,
	#main-content,
	#home-left,
	ul.home-left,
	.inner-left,
	#inner-right,
	.main-box,
	.sub-box,
	#call-to-action,
	#footer,
	#wrapper-base  {
		width: 100%;
	}
	
	#wrapper,
	#logo,
	.main-box,
	#home-left,
	ul.home-left,
	.inner-left,
	.inner-box,
	#inner-right,
	.sub-box,
	#footer,
	#call-to-action,
	.padding-20 {
		padding: 0;
	}
	
	#wrapper {
		width: 95%;
		padding: 0 2.5%;
	}
	
	#logo {
		padding-top: 5px;
	}

	ul.nav,
	#header-contact,
	#home-right,
	.base-line,
	#wrapper-top,
	#wrapper-base,
	#footer-right {
		display: none;
	}
	
	.portfolio-box,
	.extras-box {
		width: 30%;
		padding: 0 1.5%;
		height: 180px;
	}
	
	#inner-right h2 {
		width: 90%;
		padding: 10px 5%;
		margin-bottom: 20px;
		border: 0;
	}
	
	#home-left {
		height: auto;
		padding: 10px 0;
	}
	
	ul.home-left {
		width: 95%;
		margin: 0 0 0 5%;
		padding: 0;
	}
	
	#logo img {
		width: 310px;
		height: auto;
	}
	
	.main-box {
		padding: 20px 0;
		border-bottom: none;
		height: auto;
	}
		
	.sub-box img {
		padding: 0 0 0 20px;
	}
	
	.sub-box {
		border-bottom: none;
		border-top: 1px dashed #aaa;
		padding: 20px 0 0 0;
	}
	
	#header {
		padding-bottom: 5px;
	}
	
	.inner-left {
		padding: 10px 0;
	}
	
	.inner-left h2 {
		padding: 10px 0 10px 0;
	}
	
	#inner-right img {
		width: 100%;
		height: auto;
	}
	
	#inner-right {
		border-top: none;
	}
	
	.inner-extras {
		width: 100%;
		padding: 0;
		border-top: none;
		padding-bottom: 10px;
	}
	
	.inner-extras img {
		width: 100%;
	}
	
	#right {
		float: left;
		padding: 0;
	}
	
	.base-line {
		display: none;
	}
	
	.links {
		font-size: 12px;
	}
	
	#footer {
		border-top: 1px dashed #aaa;
		padding: 20px 0 20px 0;
	}
	
	#nav_icon {
	    display: block;
	    font-size: 26px;
	    float: right;
	}
	
	#nav_icon a.nav_menu_icon {
	    display: block;
	    padding: 10px 10px 5px 10px;
	    color: #ca4a10;
	    text-decoration: none;
	    font-size: 35px;
	}

	#nav_icon a:hover.nav_menu_icon {
		text-decoration: none;
	}
	
	ul.nav {
		width: 100%;
		height: auto;
		padding: 5px 0 10px 0;
	}

	ul.nav li {
		width: 100%;
		height: auto;
		padding: 0;
	}

	ul.nav li a {
		width: 100%;
		height: auto;
		padding: 8px 0;
		font-size: 15px;
	}

	ul.nav li a:hover {
		border-bottom: none;
		color: #CA4A10;
	}

	body#home .home,
	body#garages .garages,
	body#sheds .sheds,
	body#extras .extras,
	body#repairs .repairs,
	body#removals .removals,
	body#contact .contact {
		border-bottom: none;
	}
	
	.contact-box {
		width: 100%;
		height: auto;
		padding: 20px 0;
		border-bottom: none;
	}
	
	.contact-box h4 {
		font-size: 14px;
		padding-bottom: 0;
	}

	.contact-box p {
		padding: 10px 0 0 0;
		font-size: 16px;
	}
	
	form {
		width: 85%;
	}
	
	label,
	input {
		font-size: 14px;
	}

	input {
		padding: 2%;
	}

	#name,#postcode,#phone,#from,#message {
		width:75%;
	}

	ul.home-left li {
		font-size: 12px;
	}
	
	.main-box a,
	.sub-box a {
		font-size: 18px;
	}
	
	h2 {
		font-size: 21px !important;
	}
	
	p {
		font-size: 10px;
	}
	
	.links {
		font-size: 18px;
	}
	
	.contact-box h4 {
		font-size: 10px;
	}

	.contact-box p {
		font-size: 10px;
	}
	
	label {
		font-size: 10px;
	}

}

@media all and (max-width: 500px) {
	
	label {
		font-size: 14px;
	}

	.contact-box h4 {
		font-size: 16px;
	}

	.contact-box p {
		font-size: 16px;
	}

	#name,#postcode,#phone,#from,#message {
		width:95%;
	}

	.links {
		font-size: 15px;
	}

	p {
		font-size: 14px;
	}

	h2 {
		font-size: 17px !important;
	}

	.portfolio-box,
	.extras-box {
		width: 45%;
		padding: 0 2.5%;
		height: 180px;
	}


	.main-box img {
		width: 100%;
		height: auto;
	}

	.main-box a,
	.sub-box a {
		font-size: 15px;
	}
	
	ul.home-left li {
		font-size: 15px;
	}

}

@media all and (max-width: 440px) {
	
}

@media all and (max-width: 384px) {

	#logo img {
		width: 280px;
	}

}

@media all and (max-width: 350px) {

	#logo img {
		width: 260px;
	}

@media all and (max-width: 330px) {

	#logo img {
		width: 220px;
	}

}