body{font:1.7em/1.6 'Open Sans',sans-serif;padding-top:60px}
h2[id]:before,h3[id]:before{display:block;content:'';margin-top:-80px;height:80px}
h1,h2,h3{color:tomato;font-family:Oswald,'Open Sans',sans-serif}
h1{color:#337ab7}
h2{text-align:center;margin:1em auto}
img{max-width:100%}
p{margin:1em auto}
a{cursor:pointer}
a:focus,a:hover{color:#f60}
.flx{display:-webkit-box;display:-ms-flexbox;display:flex;justify-content:center;-ms-flex-wrap:wrap;flex-wrap:wrap}


.navbar-inverse{background:linear-gradient(#666,#333)}
.navbar-brand,.navbar a{color:#fff!important}
nav a:hover{background:linear-gradient(#999,#666)!important;color:#fff!important}
.dropdown-menu{background:#666}
.dropdown-menu > li > a{line-height:2.2em;font-size:1.2em}
@media (max-width:640px){
.dropdown-menu > li > a{white-space:normal}
}
nav .navbar-collapse > ul > li{border-left:1px solid #666}
nav .viewall{border-top:1px solid #888;font-size:1.1em}


header{padding-top:1em}
header .contact{font-size:1em;text-align:right}
header .contact a[href^="tel:"]{font-size:1.3em;color:#337ab7}
header .contact .fa{color:#aaa}
header .carousel{color:#fff;padding:2em 0;background-color:#999;background-image:linear-gradient(rgba(0,0,0,0.1),rgba(0,0,0,0.2)),url('/image/background.jpg');background-size:auto,cover;background-repeat:repeat,no-repeat;background-position:auto,center;background-attachment:fixed;background-repeat:no-repeat}
header .carousel button{margin:1em auto 2em auto}
header .carousel-caption{color:#000;position:static;padding:0}
header .carousel-caption{padding:1em;background:rgba(0,0,0,0.6)}
header .slide1{padding:12px;color:#fff;font-size:1.6em}
header .slide1 span{display:block;color:#fff;background:crimson;padding:0.1em 1em}
header .slide2{color:#eee;font-size:1.4em}
header .callback{margin:auto;padding:2em}

.carousel-indicators{bottom:1em}
.carousel-indicators li, .carousel-indicators .active{width:20px;height:20px;margin:1px 5px}
.carousel-indicators li{border-color:#ccc}
.carousel-indicators li:hover, .carousel-indicators .active{background:#fff}
.carousel-indicators li:hover{transform:scale(1.4)}
.carousel-inner{max-width:960px;margin:auto}

.callback button{display:block;margin:auto}
article p,article li{font-size:1.1em}


.modal-header{padding:15px 15px 10px 15px;background:#777;background:linear-gradient(#999,#666);color:white}
.modal .close:hover{transform:scale(1.3)}
.modal form{padding:5px 1em 1em 1em}
.modal-footer {text-align:center}

.remont .modal-content{background:#fff;background-image:linear-gradient(rgba(255,255,255,0.8),rgba(255,255,255,1)),url('/image/background.jpg');background-size:auto,cover;background-repeat:repeat,no-repeat;background-position:auto,center}
.remont label{min-width:150px;color:#369;font-weight:200;display:block}
.callme .service2 {color:#fff;margin:0.5em auto;background:#337ab7}


iframe{width:100%;max-width:100%}

.s1{background:#fff;margin-bottom:1em}
.s2{background:tomato;color:white;font-size:1.5em;text-align:center;line-height:1.2;padding:0.4em 0}
.s3{margin:1em auto}
.contact div, .contact a{color:#333}
.advantage > div:hover .fa, .step:hover i, .contact a:hover .fa, .review .item:hover .fa{transform:rotate3d(180,270,90,-360deg);transition:0.5s}
.logo:hover{transform:scale(1.02)}
.btn:hover{transform:scale(1.06)}
form a{font-size:11px;color:#069;display:block;text-align:center;margin-top:1em}
.modal form a{color:#666}
.advantage > div{text-align:center;padding:10px;margin:15px;box-shadow:2px 2px 4px #ccc;margin-top:-1em;background:linear-gradient(#eee,#fff);line-height:1.4;border-top:3px solid tomato}
.advantage > div:hover{transform:scale(1.05)}
.advantage i{display:block;color:#337ab7;font-size:2em;margin:10px auto}

.shop{margin-top:-3em}
.service{background:#fff;padding:1em;text-align:center}
.service div{border-top:3px solid tomato;font-size:1.2em;padding:8px 0;line-height:1.2em}
.service:hover{transform:scale(1.02)}

a.service{display:block;text-decoration:none;color:#222}
a.service:hover{color:tomato;background:linear-gradient(rgba(0,0,0,0.05),rgba(0,0,0,0))}
a.service::before{font-family:'FontAwesome';content:'\f2a0';position:absolute;right:0.6em;top:0.6em;font-size:2em;border-radius:50%;background:rgba(255,255,255,0.4);color:rgba(255,255,255,0.8);display:block;width:1.5em;height:1.5em;transform:scale(-1,1)}
a.service:hover::before{background:#f33;color:#fff}

.shop img{width:100%;max-width:100%;height:100px;object-fit:cover}
.shop .container{background:#fff;margin:2em auto;padding:1em 0 2em}

.steps{text-align:center;margin:auto;padding-bottom:1em}
.step{display:inline-block;width:150px;height:150px;margin:1em;border-radius:50%;border:2px #ddd solid;padding:1em 0;background:#fff;box-shadow:inset 0 0 1em #aaa;vertical-align:top}
.step i{display:block;padding:1px;font-size:1.6em;color:#337ab7;font-style:normal}
.step span{display:block;font-size:0.9em}
.step:hover{box-shadow:inset 0 0 1em #bbb;transform:scale(1.05)}
.steps .line{min-height:2px;background:#ddd;margin:6em auto -5.5em auto}
@media (max-width:760px){
.step{width:80%;height:auto;margin:0.1em auto;border-radius:0;padding:0.5em}
.step span{display:inline;font-size:1em}
}

.review{font-size:0.95em}
.review .item p{line-height:1.3}
.review .item .fa{float:left;color:#ddd;margin-right:0.3em}
.review .item:hover .fa{color:#eee}
.review .item:hover .fa::before{content:"\f2be"}
.comment {margin-bottom:25px;margin-left:40px;position:relative}
.comment > div {background:#fff;border:1px solid #ddd;border-radius:3px;padding:10px;position:relative}
.comment > div:before, .comment > div:after {border-right:10px solid #ddd;border-style:solid;border-width:10px;color:rgba(0,0,0,0);content:"";display:block;height:0;position:absolute;left:-20px;top:6px;width:0}
.comment > div:after {border-right:10px solid #fff;left:-18px}
.comment:before {background:#fff;border-radius:2px;box-shadow:0 0 3px rgba(0,0,0,0.2);content:"";width:3px;height:100%;left:-30px;bottom:-30px;position:absolute}
.comment:after {background:#fff;border-radius:50%;box-shadow:0 0 5px rgba(0,0,0,0.1);content:"";width:15px;height:15px;left:-36px;top:10px;position:absolute;border:2px solid #ccc}
.comment h4 {color:#337ab7}
.comment h4 small {color:#bbb}
.comment:hover h4 small {color:#aaa}
.comment:hover:after {background:#eee}
.comment .fa-quote-right{float:right;z-index:-1;color:#eee}
.comment:hover .fa-quote-right {color:#ddd}



.dark{background:#777;margin:2em auto;padding:1em 0}
.dark.hform{text-align:center}
.dark.hform a{color:#ddd;display:table;margin:auto}
.dark.hform div{color:#fff;font-size:1.4em;padding:1em}
.dark.hform input{margin-bottom:0.5em}
.form2{display:inline-block}
.form2 input{width:220px;padding-left:36px;color:#265a88;border:1px solid #ddd}
.form2:before{font-family:'FontAwesome';color:#337ab7;position:relative;left:28px;content:"\f007";font-size:1.1em}
.form2.tel:before{content:"\f095"}
.hform .submit{padding-left:1em}

@media (max-width:480px){
.carousel{font-size:0.9em}
.s2{font-size:1.5em}
}

.facts {float:right}
.facts div {width:200px;margin:0 auto 1em 2em;text-align:center;background:rgba(0,0,0,0.05);padding:1em 1em 3em;background:linear-gradient(#eee,#fff);border-top:1px solid tomato}
.facts div:hover{transform:scale(1.06)}
.facts span{font-size:2em;display:block;color:#337ab7}
@media (max-width:480px){
.facts {float:unset;margin:auto}
.facts div{width:100%;margin:1em auto;padding:1em}
.facts span{display:inline}
}

.dark{background-image:linear-gradient(rgba(0,0,0,0.6),rgba(0,0,0,0.9)),url('/image/background.jpg');background-size:auto,cover;background-repeat:repeat,no-repeat;background-position:auto,center;background-attachment:fixed}


.navbar-brand .hidden-sm{display:none}
.logo,.advantage > div,.service,.step,.facts div,.btn{transition:0.5s}

.foto{text-align:center}
.foto a img{
border: 1px solid #ddd;
width: 180px;
height: 120px;
margin: 0.3em;
padding: 5px;
object-fit: cover;
max-width:40%;
}
.foto a img:hover{
border: 1px solid tomato;
transform: scale(1.05);
}

footer h2, .dark h2{color:#eee}
footer{background:#666;color:#fff;padding:2em 0;margin-top:2em}
footer h2{font-size:1.6em;text-align:left;padding:10px;border-bottom:1px solid #999}
footer form{background:rgba(255,255,255,0.3);box-shadow:inset 0 0 1em #666;padding:1em 2em;margin-top:1em}
footer form:hover{box-shadow:inset 0 0 1em #777}
footer form .input-group, footer form textarea, .modal form .input-group, .modal form textarea{margin:1em auto}
footer form h4{text-align:center;font-size:1.1em}
footer form h4 small{display:block;font-size:0.9em;color:#eee;border-top:1px solid #aaa;padding-top:0.5em;margin-top:0.5em}
footer .frm {position:sticky;top:3em}
footer p:hover{letter-spacing:0.1px}
footer form a,footer form a:hover{color:#ddd}
footer .contact a{color:#fff}
footer{background-image:linear-gradient(rgba(0,0,0,0.8),rgba(0,0,0,1)),url('/image/background.jpg');background-size:auto,cover;background-repeat:repeat,no-repeat;background-position:auto,center}

.social.fa{color:#369;font-size:1.3em}
.social.fa.fa-skype{color:#39f}
.social.fa.fa-instagram{color:#f03}
.social.fa.fa-whatsapp{color:#093}
.social.fa.fa-phone-square{color:#834995}
.social.fa.fa-vk{color:#369}
.social.fa.fa-facebook-square{color:#336}
.social.fa.fa-odnoklassniki{color:#c30}
.social.fa:hover{transform:scale(1.2)}
footer .social.fa{font-size:2em}