body{font:1.7em/1.4 'Montserrat', sans-serif;color:#333}
a{cursor:pointer}
img{max-width:100%}
h1, h2, h3{color:#333}
h2{margin:2em 0 0.5em 0;color:#333;text-transform:uppercase;border-bottom:4px solid darkred;display:table;padding:0 0 0.2em 0;font-size:2em;font-weight:bold}

header{position:relative;padding-left:2em!important}
header h1{color:#111;font-size:2.4em;line-height:1.2;text-transform:uppercase;font-weight:bold}
header h1 small{color:#111;font-size:0.7em;display:block;margin-top:0.2em;text-transform:none;}
div.rline{border-top: 5px solid darkred;width:150px;margin:1em 0 0}
header p{display:table;color:#222;font-size:1.1em;margin:1em 0;max-width:600px}
header img.animated{float:right;max-width:60%;position:absolute;right:0;bottom:0}
header .row h3{float:left;font-size:1.5em;margin-bottom: 0;}
header .row .addr{padding:0.8em 0;line-height:1.6em;float:right}
header .row .addr *{white-space:nowrap}
header .row .addr span{display:none}
header .row .addr>div{display:inline-block;margin:0 1em;vertical-align:top}
header .row .addr>div:last-child{/*text-align:right*/}
header a.tel{font-size:1.1em;color:#23527c}
header a.tel::before{font-family:'FontAwesome';content:'\f10b';margin-right:0.3em;color:#ccc}
header a.tel:hover::before{-webkit-transform:rotate3d(180,270,90,-360deg);transform:rotate3d(180,270,90,-360deg);-webkit-transition:0.7s;-o-transition:0.7s;transition:0.7s}
header .addr .fa{color:#ccc}
header .list-inline {font-family:Oswald;float:right;margin:0 2em;}
header .list-inline a {padding:0.1em 0.2em;margin:0.6em auto;display:inline-block;border-bottom:1px solid #fff;font-size:1.3em;text-decoration:none;text-transform:uppercase}
header .list-inline a:hover {border-bottom:1px solid #333;transform:scale(1.1)}
header .btn {margin:0 0.5em 1em 0}

@media (max-width:991px){
header{background:none}
header h1{font-size:2em}
header p{font-size:1.6em}
header img.animated{opacity:0.4;z-index:-1}
/*header img.animated{float:none;max-width:100%;position:initial;}*/
header .row .addr *{line-height:2em;white-space:initial}
}

article img{float:right;width:160px}
#service>*{margin-left:1rem}
#service p, #foto p{text-align:center;padding:0.5em 0 0.2em}
#service > p, #foto > p{color:#555;text-align:left}

aside{margin:2em auto 1em;text-align:center;color:#fff}
#about aside{position:-webkit-sticky;position:sticky;top:1em}
aside>*{margin:1em auto 0}
aside .action{position:relative;font-size:1.1em;border:1px solid #f33;color:#fff}
aside .action img{width:100%;height:130px;-o-object-fit:cover;object-fit:cover}
aside .action p{position:absolute;bottom:0;background:rgba(255,0,0,0.8);padding:0.5em 0.2em}
aside .action:hover p{background:darkdarkred;-webkit-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05)}
aside .action:hover img{-webkit-filter:opacity(.6);filter:opacity(.6)}
aside form{background:darkred;padding:1em;background: linear-gradient(#c00,darkred);}
aside form input{margin:1em auto}
aside form h4{font-size:1.1em;margin:0.5em;padding:0;color:#fff}
aside form p{font-size:0.9em;margin:0.5em;padding:0}

form a{font-size:11px;color:#fff;display:inline-block;margin:1em auto}
.modal form a{color:#bbb}
form.article{position:relative;background:darkred;background: linear-gradient(#c00,darkred);padding:1em;margin-top:2em;text-align:center}
form.article img{position:absolute;left:2em;top:-1em;width:245px;height:245px;border-radius:50%;-o-object-fit:cover;object-fit:cover}
form.article h3{margin:auto;color:white}
form.article p{color:white}
input,textarea{margin-top:10px}
input[type=submit]{---text-transform:uppercase;font-size:1.05em}
select.form-control{width:auto;max-width:100%}

.modal-dialog{text-align:center}
.modal-header{color:#fff;background:-webkit-gradient(linear,left top, left bottom,from(#666),to(#333));background:-webkit-linear-gradient(#666,#333);background:-o-linear-gradient(#666,#333);background:linear-gradient(#666,#333)}
.modal-header .close{font-size:1.4em}
#callme input, #addreview input{margin:0}
#addreview textarea{width:99%;margin:0 auto 1em}
#addreview .form-inline{margin-top:1em}
#callme .input-group, #addreview .input-group {margin:0 auto 1em}
#callme .input-group {margin:0 auto 1em}
#callme .service2 {color:#f33;margin:0.5em auto}
/*#callme .service2 {color:#fff;padding:0.3em 0;background:#f66;margin:auto}*/
#form_remont .modal-dialog label{display:block;margin:1em auto;color:#369;text-align:left;font-weight:normal}
#form_remont .modal-dialog label input, .modal-dialog label textarea{margin:auto}

.fotoset{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;text-align:center}
.fotoset a{display:inline-block;position:relative;width:210px;max-width:26%;padding:8px;margin:8px 16px 8px 0;-webkit-box-shadow:0 0 1em #aaa;box-shadow:0 0 1em #aaa}
.fotoset a img{width:100%;height:130px;-o-object-fit:cover;object-fit:cover;-webkit-filter:sepia(50%);filter:sepia(50%)}
#service .fotoset a{width:260px;max-width:99%;text-transform:uppercase;text-decoration:none;color:#23527c;font-size:1.1em}
#service .fotoset a:hover{color:#f33}
#service .fotoset a img{height:100px;margin-bottom:0.5em}
.fotoset a:hover{-webkit-box-shadow:0 0 1em #666;box-shadow:0 0 1em #666;-webkit-transform:scale(1.02);-ms-transform:scale(1.02);transform:scale(1.02)}
.fotoset a:hover img{-webkit-filter:none;filter:none}
#service .fotoset a:hover::before{font-family:'FontAwesome';content:'\f095';position:absolute;right:10px;top:10px;font-size:2em;border-radius:50%;background:#f33;color:#fff;display:block;width:1.5em;height:1.5em;/*transform: rotate(-25deg);*/
}

.review{overflow:auto;height:310px}
.review div{position:relative;border-bottom:1px solid #ddd;padding-bottom:0.6em;margin-bottom:0.6em}
.review .fa-quote-right{position:absolute;top:0;right:0.1em;color:#eee;z-index:-1}
.review div:hover .fa-quote-right{color:#ddd}
.review b{color:#333;font-weight:600}
.review small{color:#999}
.review p{font-size:0.9em;margin:0.6em 0}
#review a{margin:1em auto 0;display:table}
@media (max-width:991px){
.review{overflow:initial;height:auto}
}

#work{position:relative;margin:auto}
#work img{position:absolute;left:0;bottom:0}
#work div{margin:0.5em auto;padding:0.8em;background:#fff}
#work div .fa{font-size:1.6em;color:#369;margin-right:0.4em}
#work div:hover .fa{-webkit-transform:rotate3d(180,270,90,-360deg);transform:rotate3d(180,270,90,-360deg);-webkit-transition:0.7s;-o-transition:0.7s;transition:0.7s}


.advantage{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;text-align:left;clear:both}
.advantage div{
margin:0.5em;padding:0.5em;min-width:19%;
/*
-webkit-box-shadow:inset 0 0 1em #bbb;box-shadow:inset 0 0 1em #bbb;background-color:#fff;
background-image:-webkit-linear-gradient(45deg, rgba(0,0,0,.0) 30%, rgba(0,0,0,.2), rgba(0,0,0,.0) 70%);
background-image:-o-linear-gradient(45deg, rgba(0,0,0,.0) 30%, rgba(0,0,0,.2), rgba(0,0,0,.0) 70%);
background-image:linear-gradient(45deg, rgba(0,0,0,.0) 30%, rgba(0,0,0,.2), rgba(0,0,0,.0) 70%);
background-repeat:no-repeat;background-size:200% 100%;background-position:200% 0;
border-top:3px solid #333;
*/
}
.advantage div:hover{-webkit-transition:.5s linear;-o-transition:.5s linear;transition:.5s linear;background-position:-200% 0, 0 0;-webkit-transform:scale(1.03);-ms-transform:scale(1.03);transform:scale(1.03)}
.advantage .fa{display:block;font-size:2.5em;color:#369;padding:0.2em}
--.advantage div:hover .fa{-webkit-transform:rotate3d(180,270,90,-360deg);transform:rotate3d(180,270,90,-360deg);-webkit-transition:0.7s;-o-transition:0.7s;transition:0.7s}
@media screen and (max-width:640px){
.advantage{display:block}
.advantage .fa{display:inline;padding:0 0.2em}
.advantage br{display:none}
}

footer {
	color: #fff;
	padding: 2em 0 1em;
	background: #333;
	background-image: linear-gradient(rgba(0,0,0,0.9),rgba(0,0,0,0.5)),url('/image/footer.jpg');
	background-size: auto,cover;
	background-repeat: repeat,no-repeat;
	background-attachment: scroll,fixed;
}
footer a{color:#eee}
footer a:hover{color:#fff}
footer form{background:rgba(0,0,0,0.3);padding:1em 0.5em 0.5em;text-align:center}
.map{margin-top:1em}
iframe{max-width:100%}
.btn:hover {transform:scale(1.05)}

.social{color:#000;}

div.addr .social{font-size:1.6em}
.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:#369}
.social.fa:hover{transform:scale(1.2)}
.wtftel{margin:0}


.animated, #service .fotoset a:hover::before, form.article:hover img{-webkit-animation-name:zoomIn;animation-name:zoomIn;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}
@-webkit-keyframes zoomIn{from{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)} 50%{opacity:1}}
@keyframes zoomIn{from {opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)} 50%{opacity:1}}

#nav1,#nav2{font-size:2.4em;cursor:pointer;position:fixed;top:1vw;right:1vw;color:#337ab7;}
#nav2{top:calc(1em + 1vw);color:rgba(0,0,0,0.2);display:none}
#nav1:hover,#nav2:hover{color:#369;-webkit-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1)}
#nav, #nav li{display:block;margin:auto;padding:0}
#nav {height:100%;width:0;position:fixed;z-index:1;top:0;right:0;background:rgba(0,0,0,0.9);overflow-x:auto;-webkit-transition:0.5s;-o-transition:0.5s;transition:0.5s;padding-top:2em}
#nav a{padding:8px 1em;text-decoration:none;color:#ddd;display:block;-webkit-transition:0.3s;-o-transition:0.3s;transition:0.3s;border-bottom:1px solid rgba(255,255,255,0.05)}
#nav a[href^="#"]{text-align:left}
#nav a[href^="#contact"]{border-bottom:1px solid rgba(255,255,255,0.2)}
#nav li:last-child a{border-bottom:0;}
#nav a:hover {color:darkred;background:rgba(255,255,255,0.2)}
#nav .fa-times {position:absolute;top:0;right:0;font-size:1.2em;border-bottom:none}


/*
.btn {border:0;border-radius:0;font-family:'Montserrat',sans-serif;}
.btn.bw {background:#000;color:#fff;}
.btn.wb {background:#fff;color:#000;}
form input.wb{}
.form-control{border-radius:0;font-family:'Montserrat', sans-serif;font-size:0.9em}
*/ 