@media only screen and ( max-width:1700px) {
}

@media only screen and ( max-width:1680px) {

}

@media only screen and ( max-width:1400px) {

}

@media only screen and ( max-width:1200px) {
.wrapper { width:90%; margin:0 5%;}
#header { text-align:center;}
.logo,.header-right { float:none; display:inline-block; width:auto;}

#why-choose { 
background:
linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0.7)),
url('../images/why-choose-img.png'); 
background-repeat:no-repeat, no-repeat; 
background-position: top 0 left 0, bottom 50% center;
background-size:100% 100%,60% auto;}

.why-choose { text-align:center; width:100%;}
.why-choose h2 {color:#fff;}
.why-choose h3 {color:#fff;}
.why-choose p { color:#fff;}


.locations {margin: 20px 0 0;}
.areas-left { width:10%;}
.areas-right { width:90%;}

#footer { padding:40px 0;}


.footer1 { width:42%;}
.footer2 { width:35%;}
.footer3 { width:18%;}
.footer3 h2 { font-size:23px;}

.header-top-left p{float: none;}
.header-top-left{width: 40%}

#boiler-within { padding:30px 0;}
#boiler-within h2 { font-size:70px; line-height:80px;}
#boiler-within h3 { font-size:30px; line-height:40px;}
}



@media only screen and ( max-width:1000px) {
h2 { font-size:31px; line-height:40px;}
.cont-add h2 { font-size:33px;}

.getin-touch-left { width:68%;}
.getin-touch-right { width:30%;}
.getin-touch-right a,.getin-touch-right a:hover {    padding: 10px 56px 10px 25px; font-size:20px;}
}

@media only screen and ( max-width:900px) {
}

@media only screen and ( max-width:800px) {
}

@media only screen and ( max-width:768px) {
p,.accreditations-left p,.why-choose p { font-size:17px; line-height:26px;font-family:'Montserrat Light';}
.worcester-left h2,.worcester-right h2 { font-size:24px; line-height:30px;}

.accreditations-left p br { display:none;}

#content,#accreditations,#areas,#footer,#getin-touch,.getin-touch-right { text-align: center;}
#header-top,.header-top-right { text-align:left;}

#why-choose { background-position: top 0 left 0, bottom 0% center;background-size:100% 100%,80% auto;}
#worcester-home { text-align:center; padding:50px 0;}

.worcester-left h2,.worcester-right h2 { font-size:24px; line-height:30px;}
.worcester-home-right p { font-size:19px; line-height:30px;}

.worcester-home-left,.worcester-home-right,.accreditations-left,.accreditations-right,.areas-left,.areas-right,.header-top-left,.header-top-right,
.contact-left,.contact-right,.worcester-left,.worcester-right,.worcester-col-left,.row-left,.row-right,.row1-left,.row1-right,.row2-left,.row2-right,
.getin-touch-left,.getin-touch-right,.footer1,.footer2,.footer3 { float:none; display:inline-block; width:100%;}

.footer1,.footer2,.footer3 { padding:0px; margin:0px;}

.areas-left,.areas-right { margin:0px; padding:0px;}
.areas h2 {font-size:28px; margin:15px 0 0;}

.worcester-home-left li { text-align:left;}

.worcester-home-left { padding-bottom:20px;}

.cont-add h2 span,.cont-add h3 span { float:none; display:inline-block; width:100%; min-height:auto; padding:10px 0; margin:0px;}

.worcester-col-left h2 br { display:none;}
.worcester-col-left h2 { font-size:25px; line-height:35px;}
.worcester-col-left { margin-bottom:50px; min-height:auto;}

.worcester-left h2 br { display:none;}
.worcester-services ul { -webkit-column-count: 1; /* Chrome, Safari, Opera */  -moz-column-count: 1; /* Firefox */  column-count: 1; overflow:hidden;}

.home-oil-boiler,.home-gas-boiler { width:100%; }
.gas-oil-text { text-align:center;height:400px;}

.worcester-home-left h2 br { display:none;}
.worcester-home-left h2 { font-size:25px; line-height:35px;}
.worcester-home-left p { font-size:17px; line-height:26px;}

.footer2 { padding:20px 0;}

.getin-touch-right { padding:20px 0 0;}

.worcester-full h2 { font-size:22px; line-height:35px;}

#boiler-within h2 { font-size:50px; line-height:60px;}
#boiler-within h3 { font-size:22px; line-height:30px;}
}



@media only screen and ( max-width:640px) {
h1 { font-size:30px; line-height:40px;}
h3 {font-size:20px; line-height:30px;}

.worcester-home-right .visit-our { margin:5% 0 0;}
.worcester-home-right .visit-our a { font-size:18px; padding:10px 25px;}
.worcester-home-left li {font-size: 18px;line-height: 28px; background-position: top 10px left 0;}

.top-btn { display:inline-block;}
}

@media only screen and ( max-width:540px) {
.header-right { text-align: center; margin:0px; padding:15px 0 0;}
.header-right h2 br { display:none;}

.gas-oil-text { height:300px;}
.gas-oil-text h2 {font-size:30px; line-height:40px;}
.gas-oil-text p a,.gas-oil-text p a:hover { padding:8px 50px 8px 20px; font-size:20px; background-size:12%; background-position: top 8px right 15px;}

.why-choose h3 { font-size:17px; line-height:28px;}
.why-choose p { font-size:18px; line-height:28px;}

.locations li { font-size: 17px; line-height: 32px; background-position: top 12px left 0;}
.areas-right h3 { font-size:19px; line-height:26px;}


}


@media only screen and ( max-width:520px) {
.worcester-home-right h2 { font-size:20px; line-height:26px;}

#why-choose { background-size:100% 100%,100% auto;}

.cont-add h2 { font-size:35px; line-height:40px;}
.cont-add h3 { font-size:25px; line-height:35px;}

.gas-oil-text { height:250px;}

#boiler-within h2 { font-size:40px; line-height:50px;}
#boiler-within h3 { font-size:19px; line-height:26px;}
}

@media only screen and ( max-width:480px) {
#header { padding:15px 0;}
.logo img { width:90%;}
.header-top-right p { font-size:16px;}
.header-right h2 { font-size:20px;}

#boiler-within h3 { font-size:16px; line-height:25px;}
}

@media only screen and ( max-width:420px) {
.header-top-right p { font-size:13px;}
.header-right h2 { font-size:18px;}

.accreditations-right li:first-child img { width:90%;}
}

@media only screen and ( max-width:340px) {
.header-right h2 { font-size:16px;}
}












