@import url('https://fonts.googleapis.com/css?family=Tinos:400,700&subset=cyrillic');
@import url("https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css");
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;700&display=swap');
body{background-color: #fff;color:#222; overflow-x: hidden !important;font-family: "PT Sans",sans-serif;padding-right:0px !important; }
html{
overflow-x: hidden !important;}
.wrapperrrr {overflow-x: hidden !important;}


header {padding:10px 0; border-bottom:1px solid #c3c3c3;background: #2b2b2b;}
.header{padding:0px 0; }
.header .fab{font-size: 22px; margin-right:20px; color:#acacaf;margin-top: 15px;}
.header .fab:hover{color:#fe0000;}

a {color:  #fff;font-size: 14px;}
a:hover{text-decoration: none;color:#6fba0e;}

p {
    margin: 0 0 0px;
    font-size: 17px;
    margin-bottom: 10px;
}



.uslugi p.ret{ font-size: 22px;
    color: #333;
    text-align: justify;
    font-family: "Georgia", serif;
    font-style: italic;
margin-top: -20px;}

.uslugi h3.zagzag {    font-size: 26px;
    margin-top: 50px;
    font-family: georgia;
    text-align: center;
  
    font-weight: 700;
    color: #222;}

.uslugi h3.zagzag::after{content: '';
    display: block;
    margin: 10px auto;
    background: #fe0000;
    width: 220px;
    height: 4px;}




a.phone-hed {display: none;}

.header .fas, .header .far {margin-right: 10px; color:#fe0000;}

.navbar {
    border-radius: 0px;
	border:none;
margin-bottom: 0px;
background:#fff;
text-transform: uppercase;
 overflow: hidden;
  top: 0;
  width: 100%;
    z-index: 999; 
    min-height: 100px;
    padding: 10px 0;
    border-bottom:2px solid #d22a2a;
}

img.logotip {width: 150px;}

.navbar-brand {
    float: left;
padding: 0px 10px;
margin-right: 10px;
}

.nav>li {
    margin-top: 28px;
}
.navbar-inverse .navbar-nav>li>a {
    color: #333;
      border-bottom:2px solid #d22a2a;
}

.nav>li>a {
padding: 0;
	font-size:14px;
	color:#fe0000; margin: 0 15px;
    font-weight: 700;
}

.navbar-inverse .navbar-nav>li>a:hover {
	color:#fe0000;

}

.navbar-brand>img {
    display: block;
    margin-top: -5px;
}
a.tel-heder {    color: #000;
    font-size: 20px;
    font-family: 'Montserrat',Arial,sans-serif;
    line-height: 1.55;
    font-weight: 600;
    background-position: center center;
    border-color: transparent;
    border-style: solid;
    margin-left: 10px;
}

.but-hed {
    color: #FFF;
    font-size: 15px;
    line-height: 1.55;
    border-radius: 30px;
    background-color: #fe0000;
    padding: 10px 20px;
    margin-top: 5px;
    border:none;
    
    
    border-style: solid;
  
       box-shadow: 0px 1px 0px 0px rgb(0, 0, 0);

}

.but-hed:hover {
    color: #FFF;
    background-color:#d22a2a;
  

}



.face{

        background: linear-gradient( rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.8) ), url('img/bg.jpg');
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
margin-top: 100px;padding: 40px 0px;
    background-position: center center;
    background-attachment: scroll;

    background-size: cover;
    background-repeat: no-repeat;
}



h1 {color:#222; 
    font-size: 55px;
    font-weight: 700;
    margin-top: 50px;
    line-height: 1.3;
    font-family: 'Montserrat', sans-serif;}

.yellow {
color: #fe0000;
       }

.face p  {
    color: #232732;
    font-size: 24px;
    font-family: 'Montserrat',Arial,sans-serif;
    line-height: 1.55;
    font-weight: 600;
    background-position: center center;
    border-color: transparent;
    border-style: solid;
}

.fas {margin-right: 10px;}

.vbros .but-hed {margin-top: 15px;}

.content-home {padding: 40px 10px;background: #eee;}
.content-home p {text-align: justify; font-size: 17px;}
.content-home h1 {margin-top: 0;margin-bottom: 25px; font-size: 26px;}
.content-home h2 {margin-top: 0;margin-bottom: 25px; font-size: 40px;}

.zag:after {
    content: '';
    display: block;
    margin: 10px auto;
    background: #fe0000;
    width: 220px;
    height: 4px;

}

.zag2:after {
    content: '';
    display: block;
    margin: 10px auto;
    background: #fe0000;
    width: 220px;
    height: 4px;

}

.zag {text-align: center;font-size: 40px;font-weight: 700; color:#222;}
h2.zag2 {text-align: center;font-size: 40px;font-weight: 700; color: #fff;}

.aboutus {border: 2px solid #e6e6e6; padding: 0;border-radius: 8px;background: #fff;
border-style: solid;
    box-shadow: 0px 10px 15px 0px rgba(35,39,50,0.3);
}

.aboutus p{
font-size: 18px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
  margin: 20px;
}
img.felix {width: 90%;}

.aboutus img{border-radius: 8px;}
.raboty {padding:40px 0px; background: #464f61;padding-bottom: 80px;}
.raboty h2{margin-bottom: 30px;}
.raboty img{width:  100%}
.raboty p{background: #fff; font-size: 14px;}
.raboty .fas{font-size: 14px; margin-right: 2px;}
.raboty .far{font-size: 14px; margin-right: 0px; margin-left: 5px;color:#464f61; }
.podlogka {background: #fff;padding: 15px;}
.podlogka h3 {margin: 10px 0; font-size: 20px;    border-bottom: 2px solid #464f61;
    padding-bottom: 5px;}
.portfolio {padding:40px 20px; background: #464f61;}
.portfolio h2{margin-bottom: 30px;}
.port{width: 70%;}

span.bord {border-bottom: 0px solid #fe0000;font-weight: 700;}
.preimushestva {padding: 40px 10px;    background: #fff;}
.preimushestva img{width: 100%;}
.preimushestva h2 {margin-bottom: 30px;}

.wells {border-radius: 3px;
    background-color: #ededed;
    background-position: center center;
    border-color: transparent;
    border-style: solid;
    box-shadow: 0px 0px 15px 0px rgba(35,39,50,0.4);
padding: 7px;
    margin-bottom: 25px;
 
}
.wells p {
    font-size: 20px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    min-height: 80px;
}

.item-title {padding: 10px;}

.item-uslugi{
    background-color: #ffffff;
    background-position: center center;
    border-color: transparent;
    border-style: solid;
    box-shadow: 0px 0px 15px 0px rgba(35,39,50,0.4);
padding: 0;
}

img.icon {width: 100px; 
    border:5px solid #bdbdbd;
    border-radius: 100%;
position: absolute;
    top:20px;
    left:35px;
}

.uslugi {padding: 40px 10px; background: #eeeeee;}
.uslugi img{outline: 2px solid #fff; 
    outline-offset: -10px;}
.uslugi img:hover{opacity: 0.7;}
.uslugi h2 {margin-bottom: 30px;}
.uslugi h3{font-size: 26px;margin-top: 70px;font-family: georgia;}
.uslugi p {font-size: 19px; 
    padding: 10px 25px;text-align: center;}
.itemss-uslug {background: #fff;}
.itemss {padding: 0px;}

.reviews {padding: 40px 10px; background: #eee;}
.footer{padding: 40px 0px;
background:  url('img/bg-foot.jpg');
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    background-position: center center;
    background-attachment: scroll;

    background-size: cover;
    background-repeat: no-repeat;

}
.footer h2{margin-bottom: 30px;} 


.obvodka { border:8px solid #fe0000;padding: 0;}
.forma {background: #fff; padding: 50px;outline: 2px solid #fe0000; 
    outline-offset: -20px;margin: 50px;}

.modal-content {background: #fff; padding: 10px;outline: 2px solid #fe0000; 
    outline-offset: -20px;margin: 0px;width: 400px;border-radius: 0;}
.modal-header {text-align: center;}

.input-group-addon {
    padding: 6px 12px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    color: #fe0000;
    text-align: center;
    border: none;
    border-radius: 0px;
}
.modal-dialog {margin-top: 50px;}
.modal-body {
    padding: 20px;
}

.modal-header .closes{

    position: absolute;
    top: 0;
    right: 0;
    background: #fe0000;
    width: 35px;
    height: 35px;
    color: #fff;
    font-size: 20px;
    border: none;

}

.hed-form {text-align: center;}
.hed-form img{margin-top: -15px;}

.form-control {
    background: transparent;
    color: #222;
    border: none;
    width: 100%;
    border-bottom: 1px solid #b9b9b9;
    border-radius: 0px;
    font-size: 18px;
    margin-bottom: 40px;
      font-family: 'Montserrat',Arial,sans-serif;
}

h5{color: #000000;
    text-align: center;
    font-size: 20px;
    font-family: 'Montserrat',Arial,sans-serif; margin-bottom: 30px;}

.contacty {padding: 50px;margin-top: 50px;}
.contacty a {color: #fff;
    font-size: 26px;
font-family: 'Montserrat',Arial,sans-serif;

}
ul {list-style: none; padding-left: 0}
li{margin-bottom: 25px;color: #fff;font-size: 26px;}
.fas, .far {color:#fe0000; margin-right: 15px; }

hr{
border-bottom: 2px solid #fe0000;
    text-align: left;
}


.social h5 {color: #d6d6d6; text-align: left;font-size: 28px;}
.social .fab {color:#fe0000; margin-right: 36px; font-size: 36px;}
.social .fab:hover{color:#d6d6d6;}

.owl-carousel {border: 4px solid #dcdbdb; margin-top: 20px;background: #eee;border-radius: 8px;}

.owl-theme .owl-dots .owl-dot span {
    width: 15px;
    height: 15px;
    margin: 5px 10px;
    background: #D6D6D6;
outline: none;
margin-top: 30px;}

.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
    background: #fe0000;
}

.owl-dots {
    margin-top: 30px;
    
}

.owl-theme .owl-dots .owl-dot span {

    border-radius: 0px;}
.img-slide img{width: 100%;margin-top: 0px;
outline: 2px solid #FFF; 
    outline-offset: -10px;
}
.text h3{margin-top: 10px;}


button:active, button:focus {
  outline: none !important;
}
button::-moz-focus-inner {
  border: 0 !important;
}

.navbar-inverse .navbar-toggle {background: #222; margin-top: 40px;
}

.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form {
    border: none;
}

.owl-dots {
   display: none;
    
}
.owl-carousel {border: 0px solid #dcdbdb; margin-top: 0px;background: #fff;border-radius: 0px;}
.owl-theme .owl-nav {
    margin-top: 0px;
}


.owl-nav .fa-angle-left{
    position: absolute;
    top: 60%;
    left: 4px;
    transform: translateY(-50%);
    width: 28px;
    height: 28px;
    border-radius: 50%;
    overflow: hidden;
    background-color: rgba(255, 255, 255, .5);
    font-size: 18px;
    padding: 5px;
}

.owl-nav .fa-angle-right{
    position: absolute;
    top: 70%;
    right: 4px;
    transform: translateY(-50%);
    width: 28px;
    height: 28px;
    border-radius: 50%;
    overflow: hidden;
    background-color: rgba(255, 255, 255, .5);
    font-size: 18px;
    padding: 5px;
}

.owl-nav .fa-angle-right:hover{
    background-color: #6d6d6d80;
}
.owl-nav .fa-angle-left:hover{
    background-color: #6d6d6d80;
}

.fancybox-prev {display: none;}
.fancybox-next {display: none;}

.foto{height: 440px;background: #fff;}
.foto img:hover{cursor: pointer;opacity: 0.8;}
.modal1 {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 10000; /* Sit on top */
  padding-top: 5px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content1 {
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  border: 1px solid #888;
        margin-top: -40px;
}

.modal-header {
    padding: 5px 0;

}

.modal-header h3{
    margin: 10px 0;

}

.modal-content1 .close {
    background-color: rgba(47, 47, 47, 0.9);
    height: 44px;
    line-height: 44px;
    position: absolute;
    right: 0px;
    cursor: pointer;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    color: rgba(255, 255, 255, 0.9);
    font-size: 24px;
    top: 0px;
    width: 44px;
}


.project {margin-top: 100px; padding: 40px 0;}



/* Position the image container (needed to position the left and right arrows) */
.gal {

 width: 60%;
}
.carousel-inner img {width: 100%;}

@media (min-width: 1400px) {

    .port{width: 50%}
}



@media (max-width: 767px) {

 h1{font-size: 37px;}
   
    h2.zag, h2.zag2{font-size: 27px;}
    .face p{font-size: 18px;}
    .face{margin-top: 70px;}
}

@media (max-width: 598px) {
.modal-content1 {
margin-top: 100px;
  width: 100%;
    margin-left: 8px;
}
    .modal-content1 {
    padding: 5px;
}
    img.felix {width: 100%;}
    .aboutus p {
    margin: 10px;}
 h1{font-size: 36px;}
    .modal-body {
    padding: 0px;
}
    .modal1{padding: 0;width: 100%;}
    .modal-open {
    padding-right: 0 !important;
}
   
    h2.zag, h2.zag2{font-size: 26px;}
    .face p{font-size: 18px;}
    .face{margin-top: 70px;}
    .port {
    width: 100%;
}
    .portfolio {padding: 40px 0;}
    .owl-carousel .but-hed, .forma .but-hed {font-size: 11px;}
    .reviews {
    padding: 40px 0px;

}
  
}
   .thumb img { 
      filter: none; /* IE6-9 */ 
      -webkit-filter: grayscale(0); 
      border-radius:5px; 
      background-color: #fff; 
      border: 1px solid #ddd; 
      padding:5px; 
    } 
    .thumb img:hover { 
      filter: gray; /* IE6-9 */ 
      -webkit-filter: grayscale(1); 
    } 
    .thumb { 
      padding:5px; 
    } 

@media (max-width: 490px) {
    
img.logotip {width: 100px;}
    .navbar-brand>img {
    display: block;
    margin-top: 10px;
}
    a.phone-hed{
    position: absolute;
    top: 20px;
    right: 20px;
    color: #000;
    font-size: 18px;
    font-family: 'Montserrat',Arial,sans-serif;
    line-height: 1.55;
    font-weight: 600;
}
    a.phone-hed{display: block;}
img.icon {width: 50px; 
}
    h1{font-size: 32px;}
   
    .modal-dialog {width: 335;}
    
    .modal-content { 
   width: 335px;
            padding: 30px;
}
    
    h2.zag, h2.zag2{font-size: 24px;}
    .face p{font-size: 16px;}
    .face{margin-top: 70px;}
    .forma { margin: 0px;}
    .contacty {
    padding: 10px;
    margin-top: 20px;
}
    .contacty li, .contacty li a{font-size: 16px;} 
    .social h5 {font-size: 24px;margin-bottom: 10px;}
    .foto{margin-top: 15px;}
    

}

@media (max-width: 436px) {

    h1{font-size: 32px;}
   .uslugi h3{font-size: 30px;margin-top: 20px;}
    h2.zag, h2.zag2{font-size: 24px;}
    .face p{font-size: 16px;}
    .face{margin-top: 70px;}
    .nav>li {
    margin-top: 8px;
}
    li {
    margin-bottom: 15px;

}
    .social .fab {
        font-size: 26px;}
    .fm-cont {padding: 0;}
    
    .uslugi p.ret {font-size: 18px; text-align: left;}
    .uslugi p {padding: 10px 5px;}
   
}


@media (max-width: 336px) {

.modal-content {width: 280px;}

}