@media all and (min-width: 701px) {


#service_wrap{
padding:0;
margin:0;
width:100%;
height:750px;
max-height:750px;
display:table;
background: url(../images/service_header.jpg) no-repeat center center; 
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}	
h1{
color:#FFF;
width:90%;
text-align:center;
font-weight:bold;
font-size:22px;
text-transform:uppercase;
margin-top:4%;
margin-bottom:3%;
padding-left:3%;
}
h2{color:#FFF;
font-size:17px;
width:100%;
text-align:center;
margin: 0 auto;
margin-top:5%;
margin-bottom:10%;
}
#thingstoknow{
border: 2px solid red;
border-radius: 3px;
float:left;
width:30%;
text-transform:uppercase;
font-size:15px;
text-align:center;
line-height:46px;
height:48px;
display:table;display:none;
}	
#yourrights{
border: 2px solid red;
border-radius: 3px;
display:table;
float:right;
width:30%;
text-transform:uppercase;
font-size:15px;
text-align:center;
line-height:46px;
height:48px;display:none;
}
#thingstoknow a{color:#FFF;width:100%;height:100%;display:none/* block to display div */;text-decoration:none;
white-space:nowrap;
text-align:center;
padding-right:20px;
}
#yourrights a{color:#FFF;width:100%;height:100%;display:none/* block to display div */;text-decoration:none;}
@media screen and (max-width: 400px) {}
#service_top{
margin: 0 auto;
width:60%;
display:table;
margin-bottom:8%;
}
#service_bottom{
height:49%;
width:100%;
display:table;
margin-bottom:8%;
}
/*      our services      */
#sec3{
width:100%;
display:table;
}
.sec3_header{
padding-top:15px;
text-align:center;
font-weight:bold;
font-weight:22px;
width:100%;
margin-bottom:15px;
height:50px;
line-height:50px;
}
.services_holder{width:80%;	text-align:center;
display:table;
margin: 0 auto;
padding-bottom:20px;
}
.service1{
background-image: url(../images/service-1.png);
display: inline-block;
margin:5px;
height:189px;
width:189px;

}
.service1:hover{
background-image: url(../images/service_large-1.png);
display: inline-block;
margin:5px;
height:218px;
width:218px;

}
.service2{	
background-image: url(../images/service-2.png);
height:189px;	
width:189px;
display: inline-block;
margin:5px;
}
.service2:hover{
background-image: url(../images/service_large-2.png);
display: inline-block;
margin:5px;
height:218px;
width:218px;
}
.service3{	
background-image: url(../images/service-3.png);
height:189px;
width:189px;
display: inline-block;
margin:5px;
}
.service3:hover{
background-image: url(../images/service_large-3.png);
display: inline-block;
margin:5px;
height:218px;
width:218px;
}
.service4{
background-image: url(../images/service-4.png);	
height:189px;
width:189px;
display: inline-block;
margin:5px;	
}
.service4:hover{
background-image: url(../images/service_large-4.png);
display: inline-block;
margin:5px;
height:218px;
width:218px;
}
.service5{	
background-image: url(../images/service-5.png);
height:189px;
width:189px;
display: inline-block;	
margin:5px;
}
.service5:hover{
background-image: url(../images/service_large-5.png);
display: inline-block;
margin:5px;
height:218px;
width:218px;
}

/*      our services      */
#sec3{
width:100%;
display:table;
}
.sec3_header{
padding-top:15px;
text-align:center;
font-weight:bold;
font-weight:22px;
width:100%;
margin-bottom:15px;
height:50px;
line-height:50px;
}
.services_holder{
width:80%;
text-align:center;
display:table;
margin: 0 auto;
padding-bottom:20px;
}
.service1{
background-image: url(../images/service-1.png);
display: inline-block;
margin:5px;
height:189px;
width:189px;

}
.service1:hover{
background-image: url(../images/service_large-1.png);
display: inline-block;
margin:5px;
height:218px;
width:218px;

}
.service2{	
background-image: url(../images/service-2.png);
height:189px;	
width:189px;
display: inline-block;
margin:5px;
}
.service2:hover{
background-image: url(../images/service_large-2.png);
display: inline-block;
margin:5px;
height:218px;
width:218px;
}
.service3{	
background-image: url(../images/service-3.png);
height:189px;
width:189px;
display: inline-block;
margin:5px;
}
.service3:hover{
background-image: url(../images/service_large-3.png);
display: inline-block;
margin:5px;
height:218px;
width:218px;
}
.service4{
background-image: url(../images/service-4.png);	
height:189px;
width:189px;
display: inline-block;
margin:5px;	
}
.service4:hover{
background-image: url(../images/service_large-4.png);
display: inline-block;
margin:5px;
height:218px;
width:218px;
}
.service5{	
background-image: url(../images/service-5.png);
height:189px;
width:189px;
display: inline-block;	
margin:5px;
}
.service5:hover{
background-image: url(../images/service_large-5.png);
display: inline-block;
margin:5px;
height:218px;
width:218px;
}
/*     ADDITIONAL SERVICES     */
#additional_services{
width:100%;
height:350px;
display:table;
background-color:#CCC;
}
.additional_right{
float:right;
width:45%;
margin:0;padding:10px;
}
.additional_left{
float:left;
margin:0;padding:10px;
width:45%;
}
#additional_services ul { margin:0;padding:0;list-style:none;margin: 0 auto;width:60%;
}
#additional_services li { margin:0;padding:0;line-height:2;font-size:16px;}
.additional_left li:before {margin:0;padding:0;
    content: "• ";
    color: red; /* or whatever color you prefer */
}

.additional_right li:before {margin:0;padding:0;
    content: "• ";
    color: red; /* or whatever color you prefer */
}
#service_details{
width:100%;
}
.service_details_left{
float:left;width:50%;
}
.service_details_right{
float:right;
width:50%;
}
#secholder{
width:100%;
height:250px;
display:table;
}
.details{
float:left;
height:250px;
display:table;
width:50%;
padding-bottom:10px;
}
.details_holder{
margin: 0 auto;
position: relative;
margin-top:1%;
//transform: translateY(-50%);
//-webkit-transform: translateY(10%);
//-ms-transform: translateY(-50%);
width:90%;
display:table;
}
.details1{
float:left;
height:250px;
display:table;
width:50%;
background: url(../images/services/autobody.jpg) no-repeat right center; 
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
.details2{
float:left;
height:250px;
display:table;
width:50%;
background: url(../images/services/rental.jpg) no-repeat right center; 
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
.details3{
float:left;
height:250px;
display:table;
width:50%;
background: url(../images/services/haildamage.jpg) no-repeat right center; 
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
.details4{
float:left;
height:250px;
display:table;
width:50%;
background: url(../images/services/towing.jpg) no-repeat right center; 
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
.details5{
float:left;
height:250px;
display:table;
width:50%;
background: url(../images/services/glass.jpg) no-repeat right center; 
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
h3{width:90%;
margin-left:7%;
font-size:16px;
font-weight:bold;
}
h4{width:100%;
font-size:15px;
font-weight:bold;
}
.details_desc{
width:100%;
display:table;
margin-bottom:50px;
}
.details_li{
width:100%;
display:table;
position: absolute;
bottom:0px;
margin: 0 auto;
margin-bottom:10px;
}
.details_li nav ul{

padding:0;
margin:0;
display:table;
width:100%;
text-align:center;
}
.details_li nav li{
display: table-cell;
list-style: none;
margin: 0 auto;

}

/* this is the perfce set up for custom icons on LI*/
.details_li nav li.foot_phone a{
background-image: url(../images/icon_phone1.png);
background-repeat: no-repeat;
background-position: 0.0em;
background-size: 18px 18px;
padding-left: 23px;
}
.details_li nav li.foot_app a{
padding-top:3px;padding-bottom:3px;
background-image: url(../images/icon_appt.png);
background-repeat: no-repeat;
background-position: 0.0em;
background-size: 18px 18px;
padding-left: 23px;
}
.details_li nav li a{
text-decoration:none;
font-weight:bold;
font-size:13px;
text-transform:uppercase;
color:#000;
}
.right3_button{
height:48px;
line-height:48px;
text-decoration:none;
width:235px;
margin: 0 auto;
font-size:15px;
background-color:#ff0000;
color:#FFF;
}
#services_more a{
text-align:center;
text-decoration:none;
color:#FFF;
width:235px;
height:48px;margin: 0 auto;
}
.cert img {
display: block;
margin-left: auto;
margin-right: auto;
position: absolute;
top: 50%;
left: 50%;
margin-right: -50%;
transform: translate(-50%, -50%) 
}
#sec2{
height:500px;
background-color:#F00;
widows:100%;
}

}




/*mobile site*/
@media all and (max-width: 700px){



#service_wrap{
padding:0;
margin:0;
width:100%;
height:750px;
max-height:750px;
display:table;
background: url(../images/service_header.jpg) no-repeat center center; 
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}	
h1{
color:#FFF;
width:90%;
text-align:center;
font-weight:bold;
font-size:22px;
text-transform:uppercase;
margin-top:4%;
margin-bottom:3%;
padding-left:3%;
}
h2{color:#FFF;
font-size:17px;
width:100%;
text-align:center;
margin: 0 auto;
margin-top:5%;
margin-bottom:10%;
}
#thingstoknow{
border: 2px solid red;
border-radius: 3px;
float:left;
width:30%;
text-transform:uppercase;
font-size:15px;
text-align:center;
line-height:46px;
height:48px;
display:table;display:none;
}	
#yourrights{
border: 2px solid red;
border-radius: 3px;
display:table;
float:right;
width:30%;
text-transform:uppercase;
font-size:15px;
text-align:center;
line-height:46px;
height:48px;display:none;
}
#thingstoknow a{color:#FFF;width:100%;height:100%;display:none/* block to display div */;text-decoration:none;
white-space:nowrap;
text-align:center;
padding-right:20px;
}
#yourrights a{color:#FFF;width:100%;height:100%;display:none/* block to display div */;text-decoration:none;}
@media screen and (max-width: 400px) {}
#service_top{
margin: 0 auto;
width:60%;
display:table;
margin-bottom:8%;
}
#service_bottom{
height:49%;
width:100%;
display:table;
margin-bottom:8%;
}
/*      our services      */
#sec3{
width:100%;
display:table;
}
.sec3_header{
padding-top:15px;
text-align:center;
font-weight:bold;
font-weight:22px;
width:100%;
margin-bottom:15px;
height:50px;
line-height:50px;
}
.services_holder{width:80%;	text-align:center;
display:table;
margin: 0 auto;
padding-bottom:20px;
}
.service1{
background-image: url(../images/service-1.png);
display: inline-block;
margin:5px;
height:189px;
width:189px;

}
.service1:hover{
background-image: url(../images/service_large-1.png);
display: inline-block;
margin:5px;
height:218px;
width:218px;

}
.service2{	
background-image: url(../images/service-2.png);
height:189px;	
width:189px;
display: inline-block;
margin:5px;
}
.service2:hover{
background-image: url(../images/service_large-2.png);
display: inline-block;
margin:5px;
height:218px;
width:218px;
}
.service3{	
background-image: url(../images/service-3.png);
height:189px;
width:189px;
display: inline-block;
margin:5px;
}
.service3:hover{
background-image: url(../images/service_large-3.png);
display: inline-block;
margin:5px;
height:218px;
width:218px;
}
.service4{
background-image: url(../images/service-4.png);	
height:189px;
width:189px;
display: inline-block;
margin:5px;	
}
.service4:hover{
background-image: url(../images/service_large-4.png);
display: inline-block;
margin:5px;
height:218px;
width:218px;
}
.service5{	
background-image: url(../images/service-5.png);
height:189px;
width:189px;
display: inline-block;	
margin:5px;
}
.service5:hover{
background-image: url(../images/service_large-5.png);
display: inline-block;
margin:5px;
height:218px;
width:218px;
}

/*      our services      */
#sec3{
width:100%;
display:table;
}
.sec3_header{
padding-top:15px;
text-align:center;
font-weight:bold;
font-weight:22px;
width:100%;
margin-bottom:15px;
height:50px;
line-height:50px;
}
.services_holder{
width:80%;
text-align:center;
display:table;
margin: 0 auto;
padding-bottom:20px;
}
.service1{
background-image: url(../images/service-1.png);
display: inline-block;
margin:5px;
height:189px;
width:189px;

}
.service1:hover{
background-image: url(../images/service_large-1.png);
display: inline-block;
margin:5px;
height:218px;
width:218px;

}
.service2{	
background-image: url(../images/service-2.png);
height:189px;	
width:189px;
display: inline-block;
margin:5px;
}
.service2:hover{
background-image: url(../images/service_large-2.png);
display: inline-block;
margin:5px;
height:218px;
width:218px;
}
.service3{	
background-image: url(../images/service-3.png);
height:189px;
width:189px;
display: inline-block;
margin:5px;
}
.service3:hover{
background-image: url(../images/service_large-3.png);
display: inline-block;
margin:5px;
height:218px;
width:218px;
}
.service4{
background-image: url(../images/service-4.png);	
height:189px;
width:189px;
display: inline-block;
margin:5px;	
}
.service4:hover{
background-image: url(../images/service_large-4.png);
display: inline-block;
margin:5px;
height:218px;
width:218px;
}
.service5{	
background-image: url(../images/service-5.png);
height:189px;
width:189px;
display: inline-block;	
margin:5px;
}
.service5:hover{
background-image: url(../images/service_large-5.png);
display: inline-block;
margin:5px;
height:218px;
width:218px;
}
/*     ADDITIONAL SERVICES     */
#additional_services{
padding-bottom:10px;
width:100%;
height:350px;
display:table;
text-align:center;
background-color:#CCC;
}

.additional_right{
text-align:center;
white-space:nowrap;
width:100%;
margin:0;
padding:0;
}
.additional_left{
text-align:center;
white-space:nowrap;
margin:0;padding:0;

width:100%;
}
#additional_services ul {margin:0;padding:0;list-style:none;margin: 0 auto;width:100%;
}
#additional_services li { margin:0;padding:0;line-height:2;font-size:15px;}
.additional_left li:before {margin:0;padding:0;
    content: "• ";
    color: red; /* or whatever color you prefer */
}

.additional_right li:before {margin:0;padding:0;
    content: "• ";
    color: red; /* or whatever color you prefer */
}
#service_details{
width:100%;
}
.service_details_left{
float:left;width:50%;
}
.service_details_right{
float:right;
width:50%;
}
#secholder{
width:100%;
height:250px;
display:table;
}
.details{
height:250px;
display:table;
width:100%;
padding-bottom:10px;
}
.details_holder{
margin: 0 auto;
position: relative;
margin-top:1%;
//transform: translateY(-50%);
//-webkit-transform: translateY(10%);
//-ms-transform: translateY(-50%);
width:90%;
display:table;
}
.details1{
display:none;
}
h3{width:90%;
margin-left:7%;
font-size:16px;
font-weight:bold;
}
h4{width:100%;
font-size:15px;
font-weight:bold;text-align:center;
}
.details_desc{
width:100%;text-align:center;
display:table;
margin-bottom:20px;
}
.details_li{
width:100%;
display:table;
position: absolute;
bottom:0px;
margin: 0 auto;
margin-bottom:10px;
}
.details_li nav ul{

padding:0;
margin:0;
display:table;
width:100%;
text-align:center;
}
.details_li nav li{
display: table-cell;
list-style: none;
margin: 0 auto;

}

/* this is the perfce set up for custom icons on LI*/
.details_li nav li.foot_phone a{
background-image: url(../images/icon_phone1.png);
background-repeat: no-repeat;
background-position: 0.0em;
background-size: 18px 18px;
padding-left: 23px;
}
.details_li nav li.foot_app a{
padding-top:3px;padding-bottom:3px;
background-image: url(../images/icon_appt.png);
background-repeat: no-repeat;
background-position: 0.0em;
background-size: 18px 18px;
padding-left: 23px;
}
.details_li nav li a{
text-decoration:none;
font-weight:bold;
font-size:13px;
text-transform:uppercase;
color:#000;
}
.right3_button{
height:48px;
line-height:48px;
text-decoration:none;
width:235px;
margin: 0 auto;
font-size:15px;
background-color:#ff0000;
color:#FFF;
}
#services_more a{
text-align:center;
text-decoration:none;
color:#FFF;
width:235px;
height:48px;margin: 0 auto;
}
.cert img {
display: block;
margin-left: auto;
margin-right: auto;
position: absolute;
top: 50%;
left: 50%;
margin-right: -50%;
transform: translate(-50%, -50%) 
}
#sec2{
height:500px;
background-color:#F00;
widows:100%;
}


}