/*
      Created by Keith Donegan of Code-Sucks.com
	  
	  E-Mail: Keithdonegan@gmail.com
	  
	  You can do whatever you want with these layouts,
	  but it would be greatly appreciated if you gave a link
	  back to http://www.code-sucks.com
	  
*/

* { padding: 0; margin: 0; }

body {
 background:#fff url(images/bg-back.jpg) top left repeat-x;
 font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
 font-size: 13px;
 line-height: 1.5;
 color: #333;
}
#clearall{
clear:both;
padding:0px;
margin:0px;
}
h2 {
color:#8f360d;
font-size:18px;
margin-bottom: 10px;
}
h3 {
color: #8f360d;
font-size: 14px;
margin-bottom: 5px;
}
h4 {
	margin: 5px 0;
}
p, ul {
	margin-bottom: 10px;
}

#wrappertop { 
 margin: 0;
 height:115px;
 width: 100%;
 background:none;
 position:absolute;
 left: 0;
 top: 0;
 z-index:10;
}
#headerleft { 
 margin: 0;
 height:115px;
 width: 49%;
 float:left;
 background: url(images/header-left.jpg) repeat-x;

}
#header {
 width: 962px;
 color: #333;
 padding: 0px;
 height: 115px;
 margin: 0 auto;
 background: url(images/headertop.jpg) no-repeat;

}
#headerright { 
 margin: 0;
 height:115px;
 width: 50%;
 float:right;
 background: url(images/header-right.jpg) repeat-x;
}
#wrapper { 
 margin: 0 auto;
 width: 965px;
 position:relative;
 z-index:100;
}
#headercontact{
float:right;
width:335px;
margin:5px 0px -13px 20px;
color: #fff;
font-size: 18px;
font-weight: bold;
text-shadow: 0 1px 3px #000;
}
#headercontact span{
font-weight: normal;
font-size: 14px;
}

#navholder{
float:right;

}
#nav ul {
list-style-type: none;
width: 600px;
margin-right:-15px;
position:relative;
z-index:1001;

}
#nav li{
float:left;
}

#nav ul a{
color:#333;
float:left;
font-weight:bold;
display:block;
font-size:13px;
padding: 7px 16px 0px;
border-right:1px solid #dedcdd;
text-decoration:none;
text-align:center; 
vertical-align:center;
}

#nav ul #toppad a{padding: 14px 16px 0px;}
#nav ul #toppad a{padding: 14px 16px 0px;}

#nav ul a:hover{
background:#fdfdfd;
text-decoration:none;
}

#nav ul a.active{
background:url(images/nav-active.png) top center repeat-x;
padding-bottom:23px;
border:0px;
text-decoration:none;
}

#banner {
 width: 960px;
 height:343px;
 color: #333;
 padding: 0px;
/* margin: -3px 0px 0px 0px;*/
 z-index:10;
}

#slogan{
height:40px;
border-top:1px solid #c5d0c6;
 width: 960px;
background:#e0632b;
margin-top:-2px;
}
#slogan p{
color:#fff;
text-align:center;
padding:8px;
font-weight:normal;
font-size:15px;
}
#slogan a {
	color: #fff;
}
#content { 
 width: 958px;
 color: #333;
 background: #FFF;
 margin: 0px 0px 0px 0px;
 padding: 0px;
 height: auto;
 min-height:350px;
 float:left;
 border-left:1px solid #dfdcdc;
 border-right:1px solid #dfdcdc;
}

#contenttext { 
 width: 96%;
 color: #333;
 padding: 20px;
 margin: 0px;
 height: auto;
 float:left;
}

#ctenttextleft, #ctentimgright { 
 width: 45%;
 padding: 20px;
 margin: 0px;
 height: auto;
 float:left;
}
 
#contenttext hr{ border: 0; color: #dfdcdc; background-color: #dfdcdc; height: 1px; }
#ctenttextleft ul { list-style-image: url("images/bullet.png");  margin-left:20px; } 



#threeboxes{
height:130px;
width:100%;
background: #f0f0f0;
border-bottom:1px solid #dfdcdc;
padding:0px;
}
#threeboxes a {
	text-decoration: none;
}

#boxlink{
float:left;
width:270px;
height:100px;
margin:20px 24px;
}


#boxlink2{
float:left;
width:245px;
height:100px;
margin:10px 10px 10px 5px;

}

#boxlink img, #boxlink2 img{
border:2px solid #fff;
float:left;
margin-right:15px;
 -moz-box-shadow: 2px 1px 5px #737373; /* FF3.5+ */
  -webkit-box-shadow: 2px 1px 5px #737373; /* Saf3.0+, Chrome */
          box-shadow: 2px 1px 5px #737373; /* Opera 10.5, IE9, Chrome 10+ */

}

#boxlink p, #boxlink2 p{
color:#333;
font-size:11px;
text-decoration:none;
}

#boxlink strong, #boxlink2 strong{
color:#18421a;
}

a:hover #boxlink strong {
text-decoration:underline;
}

#boxlink a:visited {
text-decoration:none;
}

#boxlink p a:visited, #boxlink p a:active{
text-decoration:none;
color:#333;
}

#ctentleft{
float:left;
width:595px;
height:auto;
margin:10px 20px 10px 30px;
}

#ctentleft ul, #ctentleft ol {
margin-left:20px;
}

#ctentright{
float:right;
width:250px;
display:block;
height:275px;
-moz-border-radius: 8px; /* FF1+ */
-webkit-border-radius: 8px; /* Saf3-4, iOS 1+, Android 1.5+ */
border-radius: 8px; /* Opera 10.5, IE9, Saf5, Chrome, FF4 */
margin:10px 20px 10px 10px;
padding:15px 5px 15px 25px;
border: 1px solid #DFDCDC;

}

#ctentright strong{
font-size:16px;
}
label {
	margin-right: 10px;
}
input, textarea {
	padding: 2px 4px;
}
input {
	width: 150px;
}
textarea {
	width: 206px;
}
input#submit {
	width: 60px;
}

#ctentright img {
	margin-top: 20px;
}

#footer { 
 width: 940px;
 background: #333;
 color: #fff;
 border-top: 1px solid #dfdcdc;
 padding: 10px;
 height: 40px;
}	

#copyright{
float:left;
width:75%;
font-size:11px;
}
#copyright2{
float:right;
text-align:right;
width:21%;
font-size:11px;
}
#designby a{
color:#6f6f6f;
font-size:10px;
}

.error, label.error{
color:#F00;
}

label{
font-size:14px;
}

/*contact*/
#cform ul {
	list-style: none;
	padding: 0;
	margin: 10px 30px 60px;
}

#cform li.box {margin:0 0 10px;padding:0}
.hotr {display:none}
#cform input[type=text], #cform textarea {width:385px}
#cform label {color:#18421a; font-size:14px; font-weight:normal;}
#cform label.error {color:#F00; font-size:14px; font-weight:bold;}
#cpage-nos {margin-left:50px;margin-bottom:80px}

#contact-primary, #contact-secondary {width:445px}
#contact-secondary .triangle-right {margin-left:445px}
#headercontact a{color:white!important;}

/*UTILITIES */
.fright {
	float: right;
}
img.fright {
	margin: 0 0 10px 10px;
}
.hide-large {
			display: none;
		}

/*Style 'show menu' label button and hide it by default*/
.show-menu {
	
	text-decoration: none;
	 color: #000;
    background: #F5F5F5;
	padding: 14px 10px;
    margin-top: -4px;
	display: none;
	font-weight: 400;
}
 label.show-menu {
	margin-right: 0;
}

/*Hide checkbox*/
input[type=checkbox]{
    display: none;
    -webkit-appearance: none;
}

/*Show menu when invisible checkbox is checked*/
input[type=checkbox]:checked ~ #menu{
    display: block;
}

/*img.fblink { display: block; margin: 10px auto;}*/

#ctentright2{float: right;
    width: 250px;
    display: block;
    height: 71px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    margin: 10px 20px 10px 10px;
    padding: 15px 5px 15px 25px;
    border: 1px solid #DFDCDC;}

#ctentright3{float: right;
    width: 250px;
    display: block;
    height: 43px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    margin: 10px 20px 10px 10px;
    padding: 15px 5px 15px 25px;
    border: 1px solid #DFDCDC;}

/*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
											MEDIA QUERIES
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/

@media only screen and (max-width: 980px) {
	.quotetable #name {
    width: 120px !important;
    }
    .quotetable #tel {
    width: 120px !important;
    }
    .quotetable #email {
    width: 120px !important;
    }
}


@media only screen and (max-width: 767px) {

	table.quotetable {
    width: 170px !important;
    margin: 0 auto;
	}

		#navholder {
    	float: left;
    	width: 100%;
		}
		/*Make dropdown links appear inline*/
	#nav ul {
		width: 100%;
		position: static;
		display: none;
	}

	#nav ul a.active { background: transparent; padding-bottom: 0;}

	#nav ul a { padding: 10px 0px !important;}
	/*Create vertical spacing*/
		#nav ul li {
		margin-bottom: 0px;
	    text-align: center;
	    border-bottom: 2px solid #f5f5f5;
	    border-top: 0px solid #f5f5f5;
		}
	/*Make all menu links full width*/
		#nav ul  li, li a {
		width: 100%;
	}
		/*Display 'show menu' link*/
	.show-menu {
		display:block;
	}    
		

		img {max-width: 100%;}

		#wrappertop { 
		width: 100%;
 		height: auto;
 		
		
			}
		#headerleft { 
		 width: 100%;
		 float:none;
			}
		#header {
		 width: 100%;
		 background: #e36125 url(images/headertop-mob.jpg) no-repeat;
 		background-position: center top;
			}
		#headerright { 
		 width: 100%;
		 float:none;
		}
		#wrapper { 
		 width: 100%;
		}
		#headercontact{
		width: 100%;
		 float:none;
		 padding-top: 120px;
		 text-align: center;
		 margin:0;
		}

		#headercontact span {
    	font-weight: normal;
    	font-size: 12px;
		}


		#banner {
		 width: 100%;	
		 clear: both;
		 height: 270px;
		}

		#banner img {
		 max-width: 100%;
		 height: auto;	
		}

		#slogan{
			clear: both;
		width: 100%; 
		height: auto;
		}


		#content { 
		 width: 100%;
		float:none;
		border-left: 0px;
    	border-right: 0px solid #dfdcdc; 
		}

		#contenttext { 
		 width: 100%;
				 float:none;
		}

		#ctenttextleft, #ctentimgright { 
		width: 100%;
				 float:none;
		}
		#threeboxes{
			height: auto;}

		#threeboxes a {
			text-decoration: none;
		}

		#boxlink{
		width: 96%;
		margin: 2%;
		float:none;
		height: auto;
		text-align: center;
		}


		#boxlink2{
		width: 100%;
				 float:none;

		}

		#boxlink img, #boxlink2 img{

				 float:none;

		}

		#ctentleft{
		 float:none;
	     width:90%;
		margin:2%;
		padding:2%;
		}

		#ctentleft iframe {
			max-width: 100%;

		}


		#ctentright{
		float:none;
		display:block;
		height:auto;
		width:250px;
		margin:0 auto;
		padding:2%;
		background-color: #f5f5f5;
		}


		#footer { 
		 width:90%;
		margin:2%;
		padding:2%;
		 background: #333;
		 color: #fff;
		 height: auto;
		}	

		#copyright{
		float:none;
		width:100%;
		font-size:11px;
		text-align: center;
		}
		#copyright2{
		float:none;
		width:100%;
		font-size:11px;
		text-align: center;
		}
		
		.head-banner{margin-top: 115px;}
		
 
}

@media only screen and (max-width: 680px) {

	#banner {height: 237px;}
	.internal #banner {display: none;}
 	.internal #slogan{display: none;}
}

@media only screen and (max-width: 580px) {

	#banner {
		 height: 200px;/*
		 background: #e0632b;*/
		}

}


@media only screen and (max-width: 480px) {

	#banner {
		 height: 170px;
		
		}
}

@media only screen and (max-width: 320px) {

	#banner {
		 height: 145px;
		
		}
}