/********************************************************/
/***************LESS THAN MAX WIDTH***************/
/********************************************************/
@media only screen and (max-width : 1200px) {
  .siteWidth{
    width: 100%;
    padding-left: 20px;
    padding-right: 20px;
    box-sizing: border-box;
  }
    
    .fakeborder{ width: calc(66.666% - 26px); right: 20px }
    
    
    
    .twoBoxes .half:nth-child(odd) {
  padding-right: 10px
}
.twoBoxes .half:nth-child(even) {
  padding-left: 10px
}
    
       .affix{ min-width: calc(66.666% - 26px); top: 0} 
    
    .imagecarrier{right: -180px}
   #videoHeader .siteHeader.third h2{ padding-left: 120px; box-sizing: border-box; }
    #videoHeader .siteHeader h2, .siteHeader h2{font-size: 36px}
    
    
    #singlePage{ padding-top: 80px}
	
	.ccu{ max-width: 150px;
  float: left;
  margin-top: 35px;
  margin-left: 135px; }
	
	
	
	.siteLogo img {
  width: 80%;
  margin-top: 11px;
}

    
}
/********************************************************/
/***************LESS THAN MAX WIDTH***************/
/********************************************************/
/********************************************************/
/***************CUSTOM 1160*************************/
/********************************************************/
@media only screen and (max-width : 1110px) {
    
    .introHome {
    font-size: 30px;
    line-height: 42px;
        padding-right: 20px
    }
        .callBox a.tel, .phoneHolder a.tel{
            font-size: 36px
        }
        
    #boxesContent .icon {width: 50px; margin-left: -10px}
        
        

    #boxesContent #addressesTxt {
    top: 38px;
    padding-left: 90px;
        font-size: 15px;
line-height: 22px;
        

}
    
 .whiteOverRely {
    margin-top: -110px;
}   
    
    
    
.square {
    font-size: 23px;
}
    
    
    
    .footerContact .quarter{ display: none}
    
        .footerContact .quarterX3{  float: none; width: 100%; padding-left: 0}
    
    .logoFooter {margin-top: 0}
    
    
    footer .quarterX3 {width: 100%; padding-left: 0; float: none}
    footer .quarter.floatLeft{ float: none; width: 100%}
    
      footer .floatLeft.quarter:after {
    clear: both;
	 content: "";
    display: table;
    line-height: 0;
}
    

    .logoFooter, .socialExpand {float: left; width: 50%; box-sizing: border-box}
    .logoFooter {border-right: 10px solid #ededed}
    .socialExpand{ padding-left: 10px}
    .social-icons{ padding-top: 0}
    

    
  
}
/********************************************************/
/***************I PAD LANDSCAPE*********************/
/********************************************************/
@media only screen and (max-width : 1024px) {

    h1.specialHeader {
   

    padding-bottom: 20px;
    font-size: 36px;
}
    
    
    .specialHeader strong:after{ bottom: -27px}
    
    
    
    .sati .font80{ font-size: 60px}
    
    

    
    
}
/********************************************************/
/***************I PAD LANDSCAPE*********************/
/********************************************************/
/********************************************************/
/********(LESS THAN)I PAD LANDSCAPE***************/
/********************************************************/
@media only screen and (max-width : 1023px) {
 
        .topPhone a {font-size: 36px; padding-top: 8px}
    .siteLogo{ width: 180px}
    .mainNav li{ padding-bottom: 83px; padding-right: 20px}
		.mainNav a {
		font-size: 16px;
	}
	
    .fixedFlying{ top: 120px}
    
    .affix{ min-width: calc(100% - 40px); top: 0}
    
    .covid {padding-left: 200px}
      .pushit { padding-left: 0}
    
    
    
        #boxesContent .tableCell  { width: 100%; display: block; box-sizing: border-box}
    

    .photoLayout, .aboveOverRely {display: none}
    
    #innerMenu{ display: block; float: none; width: 100%; margin-bottom: 20px}
    .textLayout, .photoOnRight {
    display: block; 
        width: 100%;
       
}
    
    
    .textLayout, .photoOnRight .textLayout{ padding-right: 0; padding-left: 0; width: 100%}
    
    .specialHeader strong:after { display: none}
    
    
    .mobileRandom { display: block}
    
    
    .linkUnits .iconic {position: relative; right: auto; left: 0; margin-bottom: 20px}
    
    .linkUnits .rel{ border-bottom: 1px solid #cccccc;  padding-bottom: 10px;
margin-bottom: 40px;}
    
    .linkUnits{ padding-top: 20px}
    
    
        .fakeborder {
    width: calc(100% - 40px);
    right: auto;
}
    
    
    .sati.section80{padding-top: 40px;
padding-bottom: 100px;}
    
    
    
   .twoBoxes .square {
    bottom: auto;
   box-sizing: border-box; 
        width: 100%;
        position: relative;
        display: block;
        left: 0 !important; 
}
    
    .twoBoxes .half a:hover .square{
        
        bottom: auto
    }
    
    
    .twoBoxes a{display:  block}
       .twoBoxes a:hover span{display:  block; background-color: #0079c2}
    
    
    .square   .icon{width: 50px}
    
    
    
    
    
    .section80160{ padding-top: 20px; padding-bottom: 20px;}
    
    
    /**/
    
     .imagecarrier{right: -180px}
   #videoHeader .siteHeader.third h2{ padding-left: 120px; box-sizing: border-box; }
    #videoHeader .siteHeader h2, .siteHeader h2{font-size: 36px}
    
    
    #innerVids.upVids {
            margin-top: -92px;
        }
    
    #videoHeader .siteHeader h2{
        bottom: 0
    }
    
    .imagecarrier {
    right: -260px;
}
    #videoHeader .siteHeader h2, .siteHeader h2 {
    font-size: 28px;
}
    
    #videoHeader,  #singlePage,  #serviceAreaHeader {overflow: hidden}
    
    
    
    .coverInner{ display: block; z-index: 888}
    .imagecarrier {
    right: -450px;
}
    
    
    #videoHeader .siteHeader.third h2 {
    padding-left: 60px;
}
    
    
    
    
    .videoSection .third, .videoSection .twothirds{ float: none; width: 100%}
    
    .intro{ padding-bottom: 60px}
    
    .intro.font60 {
    font-size: 40px;
    line-height: 44px;
}
    
    

}
/********************************************************/
/********(LESS THAN)I PAD LANDSCAPE***************/
/********************************************************/
/********************************************************/
/****************CUSTOM 880**************************/
/********************************************************/
@media only screen and (max-width : 880px) {
	
	
	
 
    #footerLinks .linemenu{ width: 100%; display: block}
    
    #footerLinks .vid { display: block; float: left; box-sizing: border-box; width: 33.333%; min-height: 340px; margin-top: 20px; border-left: 1px solid #cccccc}
    
    
    .footerMenu li {position: relative}
    
    .footerMenu li ul {

left: 0;
height: 100%;
width: 100%;
bottom: 0;
position: relative;
display: none;
 border-left: 0  !important;

border-top: 20px solid #22283e;
    -moz-transition: none;	-webkit-transition: none; -o-transition: none; -ms-transition: none; transition: none;
        padding-bottom: 20px
    }
    
    
        .footerMenu li:hover ul {
            
  border-left: 0  !important;
width: 100% !important;
    -moz-transition: none;	-webkit-transition: none; -o-transition: none; -ms-transition: none; transition: none;
    }
    
    
 
    
    
    
   footer  .linemenu > ul > li > a:after {transform: rotate(90deg);}
    
    
   .linemenu > ul > li > a.activeLi:after { background-color: #22283e}
    
    
    
} 
/********************************************************/
/****************CUSTOM 810**************************/
/********************************************************/
@media only screen and (max-width : 810px) {
    .mainNav li{ padding-right: 20px}
    
        #homeVids.upVids {
            margin-top: -230px;
        }
    
    
    .sati .font80 {
    font-size: 50px;
}
    
    
    .footerContact .quarterX3 .half:first-child{display: none}
    .footerContact .quarterX3 .half { width: 100%; float: none}
    
    
    #reviewList .twothird, #reviewList .third{width: 50%}
	
	
    
}


/********************************************************/
/****************I PAD PORTRAIT**********************/
/********************************************************/
@media only screen and (max-width : 768px) {
    
}



/********************************************************/
/****************I PAD PORTRAIT**********************/
/********************************************************/
/********************************************************/
/*********STARTING PHONES LESS THAN IPAD********/
/********************************************************/
@media only screen and (max-width : 767px) {
    
    
  .mainNav li:not(.navMore){display: none}
    

    .anchors li { width: 50%; padding-bottom: 20px}
	.gallery li { width: 50%; padding-bottom: 20px}
	
	
	
    
    #videoHeader .siteHeader h2, .siteHeader h2 {
    font-size: 24px;
}
    
    #videoHeader .siteHeader.third h2 {
    padding-left: 20px;
}

}
/********************************************************/
/*********STARTING PHONES LESS THAN IPAD* END*******/
/********************************************************/
/********************************************************/
/*********PHONES CUSTOM 750  - 736 is large iphone********/
/********************************************************/
/********************************************************/
/*********PHONES CUSTOM 680********/
/********************************************************/
@media only screen and (max-width : 680px) {
    
    .topPhone a{ font-size: 26px}
    

    .buttonRequest a { font-size: 16px; padding: 10px}
    
    .mainNav li { padding-right: 24px}
    .mainNav a{ font-size: 16px}
    
}
/********************************************************/
/*********PHONES CUSTOM 640********/
/********************************************************/
@media only screen and (max-width : 665px) {
    
     #homeVids.upVids{ margin-top: -92px}
     #homeVids.upVids .videoWrapper{border: 5px solid #fff}
    
    #homeFirstSection .third{ display: none}   
    #homeFirstSection .twothirds{ width: 100%}
    
    #reviewList .iconic {

    left: 20px;
    }
    .revTitles h3 { font-size: 26px; padding-right: 20px}
 
}


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

    #megaNav .hide{ display: block}
     
    
    .covid {
            padding-left: calc(100% - 160px);
            }
    
    .pushit { min-height: 150px}
    
    
    
    .phoneHolder { margin-top: 0; width: 100%; margin-bottom: 20px}
    
    .phoneHolder .iconic {left: 0}
    
    
    .anchors .play {width: 54px;}
    
    
    
        #footerLinks .vid {  float: none; box-sizing: border-box; width: 100%; border-left: 0; min-height: 400px}
    
        .logoFooter, .socialExpand {float: none; width: 100%; border: 0; padding-left: 0}
    
    .logoFooter{ margin-bottom: 20px}
    
    .revTitles h3 { font-size:  22px}
    
        #reviewList .twothird, #reviewList .third{width: 100%; float: none}
    #reviewList h3{ padding-bottom: 20px}
    
}





/*Iphone landscape*/
@media only screen and (max-width : 568px) {
    
    
    
}

@media only screen and (max-width : 540px) {
    
    .buttonRequest,  .topPhone {float: none; text-align: center; width: 100%; box-sizing: border-box; display: block}
    .buttonRequest{ margin-bottom: 10px}
    .buttonRequest a{ display: block}
    .pushit {
    min-height: 175px;
}
    
    
    .twoBoxes .half{ width: 100%; padding-left: 0 !important; padding-right: 0 !important; padding-bottom: 20px}
    
    
.section80160 {
    padding-bottom: 0;
}
    
    
.coverInner{right: -40px;}

    .imagecarrier {
    right: -550px;
}
    
    
}



/*UNDER I PHONE PLUS 414*/
@media only screen and (max-width : 399px) {
  
    .covid {
    padding-left: calc(100% - 150px);
}
    
    .siteLogo {
    width: 170px;
}
    #boxesContent .tableCell{ padding: 20px}
    .callBox a.tel, .phoneHolder a.tel{ margin-bottom: 20px}
    
    #boxesContent #addressesTxt {

    padding-left: 70px;
        
        top: 22px;

} 
    
    
    .anchors .play { width: 50px; top: 90px}
    
    
 
}
@media only screen and (max-width : 372px) {}
@media only screen and (max-width : 320px) {}