body{background:#fff; font-family:Tahoma, Arial, Verdana; font-size:14px; line-height:20px; color:#242424;}
.left{float:left;} .right{float:right;} .clear{clear:both;}

a{color:#242424; text-decoration:underline;}
a:hover{text-decoration:none; color:#000;}
img{max-width:100%;}
img.right{float:right; margin:5px 0 5px 10px;}
img.left{float:left; margin:5px 10px 5px 0;}
img, object, embed{max-width: 100%; height: auto;}
.map{padding:5px; margin-bottom:20px; border:solid 1px #dad4c7; width:100%;}
.google-map{margin-bottom:20px; position: relative;}
.google-map::before {content: url("../img/spa-tech-spa-repair-address.webp"); width: 160px; height: 86px; display: block;  box-shadow: 0px 1px 8px 0px rgba(0,0,0,0.40); z-index: 1; position: absolute; top: 15px; left: 15px;}
.google-map img{padding:5px; border:solid 1px #dad4c7; }

.list{ display:block;}
ul.style, ol.style{margin:0 0 15px; font-size:14px; line-height:16px; color:#242424;}
ol.style li{list-style:decimal; margin:0 0 8px 20px;}
ul.style li{list-style:disc; margin:10px 0 8px 20px;}
ul.style li.none, ol.style li.none{list-style:none;}
ul.style li.heading, ol.style li.heading{list-style:none; margin:0 0 8px 0px; border:none; padding:0; font-family:Arial, Helvetica, sans-serif; font-size:16px; font-weight:bold; margin-bottom:2px;}

.text-left{text-align:left; position:relative;} .text-right{text-align:right; position:relative;} .text-center{text-align:center; position:relative;}
.line-through span{background:#c3c0bb; display: block; position: absolute; height: 1px; top: 28%; width: 96%; z-index:1;}
p{font-size:14px; line-height:19px;}
p, .mb{display:block; margin-bottom:15px;}
hr{background:#d3d3d3; margin:19px 0; border:none; height:1px;}

.heading, .sub-heading, .sub-heading2{display:block; font-family:Georgia, "Times New Roman", Times, serif; font-size:30px; line-height:34px; font-weight:normal; font-style:italic; color:#01607a; margin:0 0 15px 0;}
.sub-heading{font-size:22px; line-height:24px; font-weight:normal; color:#01607a; margin:0 0 10px;}
.sub-heading2{font-size:18px; line-height:22px; font-weight:normal; color:#01607a; margin:0 0 10px;}
.heading .sub-heading{margin:0; color:#000; font-family:Arial, Helvetica, sans-serif; font-size:17px; font-weight:bold;}

/*** Header ***/
header{text-align:center; background:url(../img/header-bg.jpg) left top repeat-x;}
header .sub-heading{ font-family: Tahoma,Arial,Verdana; font-size:23px; line-height:28px; font-weight:bold; color:#000; text-align:center; font-style:normal; margin-top:32px;}
header .row{background:url(../img/header.webp) center top no-repeat; padding:10px 0;}

header .logo{ display:block; min-height:110px}
header .head-contact{ font-size:18px; line-height:22px;}
header .head-contact .phone{background:#056080; color:#fff; font-weight:bold; border:solid 1px #0b6a89; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; padding:6px 3px; margin:7px 0 5px 0;}
header .head-contact .phone img{display:block; margin:7px auto 0;}

.head-contact .tags{font-family:Verdana,Arial,Helvetica,sans-serif; color:#01739b; font-weight:bold;}
.head-contact .tags span{background:url(../img/cirle-bullet.png) left center no-repeat; padding-left:16px; margin-left:3px;}

/*** Navigation ***/
.navigation, .top-bar, .top-bar.expanded .title-area, .top-bar-section ul, .top-bar-section li a:not(.button), .top-bar-section li:not(.has-form) a:not(.button){ 
background: #076782; /* Old browsers */
background: -moz-linear-gradient(top,  #076782 0%, #0b86b2 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#076782), color-stop(100%,#0b86b2)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #076782 0%,#0b86b2 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #076782 0%,#0b86b2 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #076782 0%,#0b86b2 100%); /* IE10+ */
background: linear-gradient(to bottom,  #076782 0%,#0b86b2 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#076782', endColorstr='#0b86b2',GradientType=0 ); /* IE6-9 */
text-decoration:none;}

.top-bar-section li:not(.has-form) a:not(.button):hover, .top-bar-section ul li:hover:not(.has-form) > a, .top-bar-section li.current a:not(.button), .top-bar-section li.current:not(.has-form) a:not(.button){ background:#0a81aa; color:#fff;}

.top-bar-section ul{display: table; margin: 0 auto;}
.top-bar, .title-area{height:46px; line-height:46px}
.top-bar-section li:not(.has-form) a:not(.button){padding:16px 8px; font-size:14px; line-height:14px; text-transform:uppercase; border-right:solid 1px #015677; border-left:solid 1px #0590c1; color:#fff; text-align:center;}
.top-bar-section li:not(.has-form) a.two:not(.button){padding:10px 8px 9px;}
.top-bar-section li:first-child a{border-left:none!important;}
.top-bar-section li:last-child a{border-right:none!important;}
.top-bar-section .has-dropdown > a{padding-right:10px!important;}
.top-bar-section .has-dropdown > a::after{ display:none;}/*class for dropdown arrow*/

.top-bar.expanded br{display:none;}
.top-bar.expanded .top-bar-section li:not(.has-form) a:not(.button){text-align:left;}

.top-bar-section .dropdown{ border:solid 1px #00356a;}
.top-bar.expanded .top-bar-section ul li a, .top-bar-section .dropdown li:not(.has-form):not(.active) > a:not(.button){ background:#026383; border-top:solid 1px #027499; border-bottom:solid 1px #01455b; padding:5px!important; line-height:20px; border-right:none; border-left:none; color:#fff; font-size:12px; text-align:left;}
.top-bar-section .dropdown li.title h5 a:hover, .top-bar-section .dropdown li.parent-link a:hover, .top-bar-section .dropdown li:not(.has-form):not(.active):hover > a:not(.button), .current-parent .current a{background:#01455b !important; color:#fff;}
.top-bar.expanded .toggle-topbar a span::after{box-shadow: 0 0px 0 1px #fff, 0 7px 0 1px #fff, 0 14px 0 1px #fff;}
.top-bar.expanded .toggle-topbar a{color:#fff;}

.navigation nav .dropdown a:hover, .top-bar.expanded .top-bar-section a:hover{ background:#01455b !important; color:#fff !important;}
.navigation .top-bar.expanded .no-link ul .parent-link.js-generated, .navigation .top-bar .no-link .dropdown .parent-link{display:none;}
.navigation .top-bar.expanded .parent-link.show-for-small{display: block!important;}
.navigation .dropdown .parent-link.js-generated br{display:none;}
.top-bar .toggle-topbar.menu-icon a{ text-decoration:none;}
/*** End Navigation ***/

.main-container{background:url(../img/content-bg.jpg) left top repeat-x;}
.tagline{padding:10px; text-align:center;}
.tagline .sub-heading{font-family:Arial, Helvetica, sans-serif; font-size:24px; color:#000; margin-bottom:3px;}
.tagline .sub-heading2{ font-family:Arial, Helvetica, sans-serif; font-size:22px; line-height:26px; color:#0788af; font-style:normal;}

/*** Banner ***/
.banner [class*="block-grid-"] > li{padding:0.2rem 0.4rem;}
.banner ul{background:#fff; box-shadow:0 0 4px #888888; padding:5px 0; margin:0px;}
.banner ul li a{display:block; border:solid 1px #1f1f1f; text-decoration:none; position:relative; min-height:250px}
.banner ul li a img{ width:100%;}
.banner ul li a span{display:block; width:100%; background:rgba(0, 0, 0, 0.8); font-size:18px; line-height:22px; color:#fff; text-align:center; padding:8px 4px; position:absolute; left:0; bottom:0;}
.banner ul li a:hover span{ background:rgba(1, 57, 73, 0.9);}

/*class for orbit slider*/
.orbit-timer, .orbit-slide-number{display:none;}
.orbit-bullets-container{position:absolute; bottom:0px; right:10px; z-index:99;}
.orbit-timer, .orbit-slide-number, .orbit-bullets{display:none;}
/*class for orbit slider*/

.inner-banner .heading{font-size:20px; line-height:24px; text-align:center; color:#01607a; border-bottom:1px solid #ccc; margin:0 0 15px; padding-bottom:6px;}
.inner-banner ul.chk-list{margin:0 0 15px;}
.inner-banner ul.chk-list li{list-style:none; background:url(../img/check.png) left 5px no-repeat; font-size:14px; line-height:20px; font-weight:bold; color:#414141; padding:2px 0 2px 20px;}
.inner-banner .medium-5{padding:0; margin-bottom:15px;}

/*** Content Area ***/
.content-area{ background:url(../img/content.png) center top no-repeat; padding-top:25px;}
.content-area .large-9 .right{ margin-left:10px;}

.testimonials{ background:#075F7E; color:#fff; margin-bottom:15px; padding:10px;}
.testimonials .sub-heading{color:#fff;}
.testimonials p, .testi p{ font-size:12px; line-height:18px; margin-bottom:10px;}
.testimonials a{text-decoration:none; font-size:12px; font-weight:bold; color:#fff;}
.testimonials hr{background:#066d8e; border-bottom:solid 1px #57a2ba; height:2px;}

.testi{padding: 15px 20px 5px; margin: 0 0 20px; background: #FFFFFF; -webkit-box-shadow: 0 1px 5px rgba(0,0,0,0.2); -moz-box-shadow: 0 1px 5px rgba(0,0,0,0.2);-o-box-shadow: 0 1px 5px rgba(0,0,0,0.2); box-shadow: 0 1px 5px rgba(0,0,0,0.2);-webkit-border-radius: 18px;-khtml-border-radius: 18px;-moz-border-radius: 18px;-o-border-radius: 18px;border-radius: 18px;}

.review-social{ background:url(../img/5star.png) top right no-repeat; font-weight: bold; text-align:right; padding-top:24px; margin: 15px 0 5px;}
.review-social strong{display:block; margin-bottom:5px;}
.review-social img{display:inline!important;}

.box{ background:#e4e4e4; margin-bottom:15px; padding:10px;}
.box .sub-heading{ text-align:center;}

.payment{margin-bottom:15px; background:#f2f2f2; border:solid 1px #e4e4e4; text-align:center; padding:5px;}
.payment img{margin:5px 5px 0;}

.brands{text-align:center; border:solid 1px #e4e4e4; margin-bottom:15px; padding:10px;}
.brands img{margin:10px;}

.expert{text-align:center; border:solid 1px #e4e4e4; margin-bottom:15px; padding:10px;}
.expert ul li{text-align:left; display:inline; background:url(../img/cirle-bullet.png) left center no-repeat; margin-left:4px; padding-left:14px;}
.expert ul li:first-child{background:none; margin:0; padding:0;}

.special{background:url(../img/special-shadow.jpg) bottom center no-repeat; background-size:100%; padding-bottom:15px; font-family:Arial, Helvetica, sans-serif;}
.special div{display:block; background:url(../img/special-bg.webp) bottom center no-repeat; border:solid 1px #fff; padding:10px; font-size:15px; line-height:18px; font-weight:bold; text-decoration:none;}
.special div:hover{color:#000;}
.special div strong{font-family:Georgia, "Times New Roman", Times, serif; font-size:17px; margin-bottom:5px; font-weight:bold; display:block;}
.special div b{color:#cf1426; font-size:20px;}

/*** Gallery ***/
.projects{background:#e7e7e7; border:solid 1px #c9d0d6; padding:10px; margin-bottom:20px;}
.projects .sub-heading{font-size:20px; line-height:24px; color:#363636; border-bottom:dotted 1px #363636;}
.projects a{ font-weight:bold; display:block; text-align:right;}
.projects .clearing-close{display:none;}
.clearing-container .clearing-close{display:block;}
.recent-project{margin:0;}
.recent-project a img{ border:solid 1px #797a7b; margin-bottom:5px;}
.recent-project span{display:block; font-size:13px; line-height:16px; color:#0e0e0e;}
.recent-project li div{ display:block; padding-bottom:15px; margin-bottom:20px; border-bottom:solid 1px #c9d0d6;}
.recent-project li div::after {clear: both; content: "."; display: block; height: 0; visibility: hidden;}
.recent-project li span{ display:block; margin-top:5px;}
.recent-project.inner li div a{ width:155px; overflow:hidden; float:left; display:block; margin:0 5px 0 0; padding:0;}

.clearing-thumbs li, [data-clearing] li{margin:0;}
[data-clearing].recent-project li{float:none;}

.gallery-block{ margin-top: 10px;}
.gallery-block .heading{ text-align:center; margin:5px 0 10px;}
.gallery-block .sub-heading{ text-align:left;}
.gallery-block [class*="block-grid-"] > li{padding:0 0.325rem 1.25rem;}

ul.gallery{margin:0; margin-bottom:15px;}
ul.gallery li div, ul.gallery li a{ display:block; padding:4px; border:solid 1px #cacaca;}
ul.gallery li div:hover, ul.gallery li a:hover{ border:solid 1px #6d6d6d;}

ul.gallery li a{ position:relative;}
.gallery-block .gallery-title a{ padding:0;}
.gallery-block .gallery-title li a span{ width:100%; background:rgba(0, 0, 0, 0.6); font-size:12px; line-height:16px; color:#fff; font-weight:bold; position:absolute; left:0; bottom:0; padding:3px 7px;}

.gallery-block .gallery-inner li div{list-style:none; border:solid 1px #cacaca; font-size:13px; line-height:15px; color:#000; text-decoration:none; padding:4px;}
.gallery-block .gallery-inner li div:hover{ color:#2f3338;}
.gallery-block .gallery-inner li div:after {clear: both; content: "."; display: block; height: 0; visibility: hidden;}
.gallery-block .gallery-inner li a{ width:155px; overflow:hidden; float:left; display:block; margin:0 5px 0 0; padding:0;}
.gallery-block .gallery-inner li.two-img a{ width:100%; float:none; margin:0;}
.gallery-block .gallery-inner li.two-img span{ display:block; margin-top:5px;}

.clearing-assembled .clearing-container .carousel > ul li div{ padding:0; border:0;}
.clearing-assembled .clearing-container .carousel > ul li a{ border:0; margin-left:5px;}
/** End Gallery **/

/*** Contact Form ***/
.contact-form{font-size:12px; line-height:18px; margin-bottom:20px; background:#e5e5e5; color:#000; border:solid 1px #d5d5d5; padding:10px; min-height:350px}
.contact-form .sub-heading{font-size:22px; color:#363636; margin-bottom:5px;}
.contact-form p{ margin-bottom:5px}
.contact-form p a{ color:#333; text-decoration:none; font-weight:bold}
.contact-form label{font-size:12px; color:#000;}
.contact-form label span{color:#ff0000;}
.contact-form input, .contact-form textarea{display:block; height:28px; padding:2px 3px; margin-bottom:5px; border:solid 1px #c8c7c7;}
.contact-form input.phone{width:35px; display:inline;}
.contact-form textarea{height:60px;}
.contact-form input.chk_box{height: 13px; margin: 0 5px 0 0; width: 13px; display:inline;}
.contact-form #submit{background:#505050; border:none; color:#fff; margin:10px auto 0; height:30px; padding:0 5px 3px; width:75px; cursor:pointer; font-size:14px; line-height:16px; font-weight:bold;}
.contact-form #submit:hover{background:#313131;}

.contact-form .large-8{padding:0 0.8rem!important;}
.contact-form .phone{margin:0 -0.2rem!important;}
.contact-form .phone .small-4{width:31.3333%; padding:0 0.2rem!important;}
.contact-form .phone .small-4:last-child{width:37.3333%;}

.contact-form .error{ background:#e5e5e5; color:#FF0000; font-size: 11px; text-align: left; margin:0 0 5px; padding:0;}
.zipcodes{ font-size:13px; text-align:center; margin-bottom:15px;}
.social{ margin-bottom:15px;}
.error404, .thanks{ text-align:center; padding:30px 15px;}

/*** Service Area ***/
.service-area-top{ border-top:solid 5px #078ab4; padding:10px 0; font-size:18px; line-height:22px; text-align:right;}
.service-area-top div:last-child{text-align:left;}
.service-area-top .sub-heading2 {font-family:Tahoma, Arial, Verdana; font-size:16px; line-height:16px; font-weight:bold; color:#000; font-style:normal;}
.service-area-top .right strong{ font-size:14px;}
.service-area .columns{padding:0 0 0 .7em;}
.service-area ul{margin:0;}
.service-area ul li{background:url(../img/service-bullet.png) left 7px no-repeat; padding-left:15px; margin:0 0 13px 10px; border-bottom:dotted 1px #fff;}
.service-area ul li a{text-decoration:none; font-size:12px; line-height:14px; color:#261911; display:block;}
.service-area ul li a, .service-area ul li{text-decoration:none; font-size:12px; color:#000; display:block;}
.service-area ul li a:hover{text-decoration:underline;}

/*** Footer ***/
footer{ background:#076783; font-size:12px; color:#fff; padding:10px 0;}
footer .row div:last-child{ text-align:right;}
footer a, footer a:hover, footer a:focus{color:#fefefe; text-decoration:none;}
footer a:hover{color:#fff; text-decoration:underline;}
footer .right a{ margin:0;}

a.contact-btn{position: fixed; right: 0; bottom: 30%; z-index: 1000;}
#revealModel1{min-height: auto; padding:15px; text-align:center}
#revealModel1 a{ text-decoration:none; color:#000}
#revealModel1 .contact-form{ margin-bottom:0}

#back-to-top{position:fixed; bottom:4%; right:2%; background:#0b83ad; padding:5px; transition:.5s; display: none; z-index:1000}
#back-to-top:hover{background:#056080;}

/*** Media Querys ***/
//Small screens
@media only screen { } /* Define mobile styles */
@media only screen and (max-width: 40em) {
.heading .heading, .heading{ font-size:20px; font-weight:bold; line-height:22px;}
.heading .sub-heading, .sub-heading{ font-size:16px; font-weight:bold; line-height:18px;}
.top-bar-section .has-dropdown > a::after{ display:block;}

header .sub-heading{ font-size:16px; line-height:20px; margin:10px 0;}
header .head-contact{ font-size:16px; line-height:20px; min-height:112px}
header .head-contact .phone img{ min-height:32px}
.head-contact .tags span{background:url(../img/cirle-bullet-s.png) left center no-repeat;}

.tagline{ font-size:18px; line-height:22px;}
.tagline .sub-heading{ font-size:18px; line-height:22px;}

.inner-banner .heading{ font-size:18px; line-height:20px;}
.inner-banner .columns{ padding:0;}
.inner-banner img{ width:100%; margin-right:0;}
.inner-banner .chk-list{ width:100%; margin-top:10px;}

.banner{ padding:0 10px 15px 10px; min-height:400px; max-height:680px; overflow:hidden}
.banner ul li a img{ min-height:400px}

.content-area .large-9 .right{ margin-left:0;}
.expert ul li{ background:url(../img/cirle-bullet-s.png) left center no-repeat;}

/*** for gallery ***/
.recent-project li div a, .recent-project.inner li div a{width:130px; float:left; margin-right:5px;}
.recent-project a img{ margin-bottom:0;}
.gallery-block .gallery-inner li{ width:100%;}
.gallery-block .gallery-inner li a{ width:130px;}

.special div{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#efd16f+0,f8d24d+37,f0b161+100 */
background: #efd16f; /* Old browsers */
background: -moz-linear-gradient(left, #efd16f 0%, #f8d24d 37%, #f0b161 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #efd16f 0%,#f8d24d 37%,#f0b161 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #efd16f 0%,#f8d24d 37%,#f0b161 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efd16f', endColorstr='#f0b161',GradientType=1 ); /* IE6-9 */
border:solid 1px #dea650;
}

.service-area-top div, .service-area-top div:last-child{ text-align:center; margin-bottom:10px;}
.service-area .columns{padding:0 0 0 .2em;}
footer, footer .row div:last-child{ text-align:center;}
img.left, img.right, .img-right{ float:none!important; margin:0 auto 20px!important; display:block;}
.img-right img{ margin:0 auto;}
.style{ margin:0!important;}
.brands{ min-height:270px}
}
@media only screen and (max-width: 23.750em) {
header .sub-heading{ font-size:14px; line-height:18px; margin:10px 0;}
header .head-contact{ font-size:14px; line-height:18px;}
header .head-contact img{ width:200px;}

/*** for gallery ***/
.recent-project li div a, .recent-project.inner li div a{width:100%; float:left; margin-right:5px;}
}

// Medium screens
@media only screen and (min-width: 40.063em) { } /* min-width 641px, medium screens */
@media only screen and (min-width: 40.063em) and (max-width: 64em) {
.top-bar-section li:not(.has-form) a:not(.button){ padding:16px 3px;}
.top-bar-section li:not(.has-form) a.two:not(.button){ padding:10px 3px 9px;}
.top-bar-section .has-dropdown > a{ padding-right:3px !important;}

header .sub-heading{ font-size:18px; line-height:26px;}
header .logo{ min-height:100px}

.banner ul li a{ min-height:160px}

/*** for gallery ***/
.recent-project li a{ width:155px; overflow:hidden; float:left; display:block; margin:0 5px 0 0; padding:0;}

.special div{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#efd16f+0,f1b65c+100 */
background: #efd16f; /* Old browsers */
background: -moz-linear-gradient(left, #efd16f 0%, #f1b65c 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #efd16f 0%,#f1b65c 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #efd16f 0%,#f1b65c 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efd16f', endColorstr='#f1b65c',GradientType=1 ); /* IE6-9 */
border:solid 1px #dea650;
}

.map{ height:280px;}
}
@media only screen and (min-width: 40.063em) and (max-width: 56.250em) {
.top-bar-section .has-dropdown > a::after{ display:block;}
.banner ul li a span{ font-size:14px; padding:5px;}
header .sub-heading{ font-size:14px; line-height:20px;}
header .head-contact{font-size:14px; line-height:18px;}
}


// Large screens
@media only screen and (min-width: 64.063em) { } /* min-width 1025px, large screens */
@media only screen and (min-width: 64.063em) and (max-width: 90em) { } /* min-width 1025px and max-width 1440px, use when QAing large screen-only issues */

// XLarge screens
@media only screen and (min-width: 90.063em) { } /* min-width 1441px, xlarge screens */
@media only screen and (min-width: 90.063em) and (max-width: 120em) { } /* min-width 1441px and max-width 1920px, use when QAing xlarge screen-only issues */

// XXLarge screens
@media only screen and (min-width: 120.063em) { } /* min-width 1921px, xxlarge screens */