@import url(https://fonts.googleapis.com/css?family=Open+Sans);
html{ overflow-y: scroll;}
body{
margin:0;
padding:0;
line-height: 1.5em;
background-image:url(images/bk-tile.jpg); background-repeat:repeat-x;
background-color:#fff;
font-family: 'Open Sans', sans-serif;
font-size:13px;}

b{font-size: 110%;}
em{color: red;}
a:link {
	color: #96000B;
}
a:visited {
	color: #96000B;
}
a:hover {
	color: #F58805;
}
a:active {
	color: #F58805;
}
.phone{ float:right; height:84px; width:380px; text-align:center; margin-top:20px; border:0px solid #ccc;}
.logo{float:left; padding:20px 25px 0px 10px;}
#maincontainer{
width: 1099px; /*Width of main container*/
margin: 0 auto; /*Center container on page*/
}

#topsection{
height: 166px; /*Height of top section*/
}

#topsection h1{
margin: 0;
padding-top: 15px;
}

#contentwrapper{
float: left;
width: 100%;

clear:both;
}

#contentcolumn{
margin-left: 380px; /*Set left margin to LeftColumnWidth*/
min-height:600px;
}

#leftcolumn{
float: left;
width: 350px; /*Width of left column*/
margin-left: -1099px; /*Set left margin to -(MainContainerWidth)*/
background: #FFF;
}

#footer{
clear: left;
width: 100%;
background: #96000b;
color: #FFF;
text-align: center;
padding: 4px 0;
font-size:10px;
}

#footer a{
color: #FFFF80;
}

.innertube{
margin: 10px; /*Margins for inner DIV inside each column (to provide padding)*/
margin-top: 0;
}
.rollover a {
display:inline-block;
width: 160px;
padding:6px 0px 10px 0px;
text-align:center;
margin: 2px;
font: bold 13px sans-serif;
color:#F1C330;
text-decoration: none;
text-shadow: 1px 2px 1px #333;
}
.rollover a:hover { 
color:#FFF;
}
.rollover a:active {
color:#FF3;
text-decoration:underline;

}

.clearfix{ overflow:auto; zoom:1;}
.roundedCornerBoxWhite{ background-color:#FFF; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px;}

.roundedCornerBoxGold{ width:98%; background-color:#f58805; margin:10px 0px; padding:10px; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; border:3px solid #900;}
.roundedCornerBoxGoldNoBorder{ background-color:#F1C330; padding:10px; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px;}


/* Start of Column CSS */
#container5 {
	clear:left;
	float:left;
	width:100%;
	overflow:hidden;
	background:#96000b; /* column 5 background colour */
}
#container4 {
	clear:left;
	float:left;
	width:100%;
	position:relative;
	right:20%;
	background:#f58805; /* column 4 background colour */
}
#container3 {
	clear:left;
	float:left;
	width:100%;
	position:relative;
	right:20%;
	background:#96000b; /* column 3 background colour */
}
#container2 {
	clear:left;
	float:left;
	width:100%;
	position:relative;
	right:20%;
	background:#f58805; /* column 2 background colour */
}
#container1 {
	float:left;
	width:100%;
	position:relative;
	right:20%;
	background:#96000b;
	 /*height:350px; column 1 background colour */
}
#col1 {
	float:left;
	width:16%;
	margin:0px; padding:0px;
	position:relative;
	left:82%;
	overflow:hidden;
	text-align:center;
}
#col2 {
	float:left;
	width:16%;
	position:relative;
	left:86%;
	overflow:hidden;
		text-align:center;
}
#col3 {
	float:left;
	width:16%;
	position:relative;
	left:90%;
	overflow:hidden;
		text-align:center;
}
#col4 {
	float:left;
	width:16%;
	position:relative;
	left:94%;
	overflow:hidden;
		text-align:center;
}
#col5 {
	float:left;
	width:16%;
	position:relative;
	left:98%;
	overflow:hidden;
		text-align:center;
}

  

.hpimga:link {
	color: #FFF;
	 opacity: 1.0;
    filter: alpha(opacity=100); /* For IE8 and earlier */
	text-decoration:none;
	text-transform:uppercase;
}
.hpimga:visited {
	
		color:#FFF;
	text-transform:uppercase;
}
.hpimga:hover {
	color: #FFF;
opacity: 0.4;
    filter: alpha(opacity=40); /* For IE8 and earlier */
	
	text-transform:uppercase;
}

.hpimga:active {
	color: #FFF;
}


#contentParent{ width:718px;
                    margin: 0 auto;
					display:block; }
					
				   .contentLeft {
                    float: left;
                    width: 50%;
					background-color:#FFF;
					display:block;
					padding-left:10px;
					 -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px;
                }
                .contentRight {
					padding-left:28px;
                    overflow: hidden;
                    width: 50%;
					display:block;
                }



.citiesli{ display:inline-block; padding:0px 12px; border-left:1px solid #ccc; border-right:1px solid #ccc;}			
.citiesli a{color:#96000B; text-decoration:none;}				
.citiesli a:hover{color:#F58805; text-decoration:underline;}	

.citieslist{ display:block; padding:0px 12px; border-right:0px solid #ccc;}			
.citieslist a{color:#96000B; text-decoration:none;}				
.citieslist a:hover{color:#F58805; text-decoration:underline;}	



/* ####### responsive layout CSS ####### */

@media (max-width: 840px){ /* responsive layout break point */
	#maincontainer{
	width: 100%;
	}
	
	#contentwrapper{
	float: none;
	}
	
	#leftcolumn{
	float: none;
	width: 100%;
	margin-left: 0;
	}
	
	#contentcolumn{
	margin-left: 0;
	}
.phone{ float:right; height:84px; width:380px; text-align:center; margin-top:-15px; border:0px solid #ccc;}	
.rollover a {
width:140px;
padding:6px 0px 10px 0px;

}
.roundedCornerBoxGold{ width:96%; background-color:#f58805; margin:10px 0px; padding:10px; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; border:3px solid #900;}
	#parent { width:840px;
                    margin: 0 auto;
                    
                }
				 .left {
                    width: 100%;
					text-align:left;
					display:block;
					clear:both;
                }
                .right {
					text-align:left;
                    width: 100%;
					display:block;
					clear:both;
                }
	#contentParent{ width:840px;
                    margin: 0 auto;
					display:block; }
					
				   .contentLeft {
                    float: left;
                    width: 100%;
					display:block;
					clear:both;
					padding:10px;
					background-color:#FFF;
                }
                .contentRight {
				    width: 100%;
					padding:10px;
					display:block;
					clear:both;
                }
				.plumberImg{float:right; padding:4px; width:340px; height:auto; display:block;}
}
@media (max-width: 640px){ /* 1st level responsive layout break point- drop right column down*/
.innertube{
margin: 0px; /*Margins for inner DIV inside each column (to provide padding)*/
margin-top: 0;
}
.roundedCornerBoxGold{ width:600px; background-color:#f58805; margin:10px 0px; padding:10px; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; border:3px solid #900;}
.phone{ float:right; height:84px; width:380px; text-align:center; margin-top:0px; border:0px solid #ccc;}
	#parent { width:640px;
                    margin: 0 auto;
					display:inline-block;
                    
                }
				.left {
                    width: 100%;
					text-align:left;
					display:block;
					clear:both;
					
                }
                .right {
					text-align:left;
                    width: 100%;
					display:block;
					clear:both;
                }
		#contentParent{ width:640px;
                    margin: 0 auto;
					display:block; }
					
				   .contentLeft {
                    float: left;
                    width: 100%;
					display:block;
					clear:both;
					padding:10px;
					background-color:#FFF;
                }
                .contentRight {
				    width: 100%;
					display:block;
					clear:both;
					padding:10px;
                }
				.plumberImg{ width:320px; height:auto; text-align:center; display:block; }
			
			
}
@media (max-width: 360px){ /* 1st level responsive layout break point- drop right column down*/
	
body { background-image:url(images/bk-tile-mbl.png); background-repeat:repeat-x; background-color: #FFF; }
h2{ font-size:18px; color:#C00; }
#contentcolumn{ padding:20px 10px; /*Set left margin to LeftColumnWidth*/ }
.phone{ float:right; height:84px; width:380px; text-align:center; margin-top:0px; border:0px solid #ccc;}
.logo{float:left; padding:20px 0px 0px 0px;}
.roundedCornerBoxGold{ width:335px; background-color:#f58805; margin:10px 0px; padding:10px; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; border:3px solid #900;}
#parent { width:360px;
                    margin: 0 auto;
					display:inline-block;
                    
                }
				.left {
                    width: 100%;
					text-align:left;
					display:block;
					clear:both;
                }
                .right {
					text-align:left;
                    width: 100%;
					display:block;
					clear:both;
                }
		#contentParent{ width:360px;
                    margin: 0 auto;
					display:block; }
					
				   .contentLeft {
                    float: left;
                    width: 100%;
					padding:10px;
					display:block;
					clear:both;
					background-color:#FFF;
                }
                .contentRight {
				    width: 100%;
					padding:10px;
					display:block;
					clear:both;
                }
.plumberImg{ width:320px; height:auto; text-align:center; display:block; clear:both; }
				
}