body {
    font-family: 'PT Serif', serif;
    color: #3b3b3b;
    padding: 0;
    margin: 0;
    font-size: 3vw;
    line-height: 1.2;
    text-align: center;
    vertical-align: middle;
    background-image: url(../img/bg-lightl-892.jpg);
    
}
@media(min-width:480px) {
    body {
        font-size: 2.5vw;
    }
}
@media(min-width:750px) {
    body {
        font-size: 2vw;
    }
}
@media(min-width:1024px) {
    body {
        font-size: 20px;
    }
}

a {
    text-decoration: none;
    color: inherit;
}

header {
    background: rgb(33,33,33);
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(33,33,33,1)), color-stop(50%, rgba(97,86,86,1)), to(rgba(32,30,30,1)));
    background: -o-linear-gradient(top, rgba(33,33,33,1) 0%, rgba(97,86,86,1) 50%, rgba(32,30,30,1) 100%);
    background: linear-gradient(180deg, rgba(33,33,33,1) 0%, rgba(97,86,86,1) 50%, rgba(32,30,30,1) 100%);
}

.nav-list {
    list-style: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
        justify-content: space-around;
    text-transform: uppercase;
    margin: 0;
    padding: 0;
    color: #dbcfcf;
}

.nav-item {
    display: block;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
}

.nav-item a {
    display: block;
    padding: 20px 5px;
}

.nav-item:hover,
.nav-item:focus {
    text-shadow: 0 0 5px #ffffff;
}

.nav-item:active {
    text-shadow: 0 0 5px #181717;
    color: #978c8c;
}


.main-page__text {
    position: absolute;
    z-index: 10;
}

h1 {
    font-size: 5vw;
    margin: 30px 20vw 0;
    padding: 10px;
    background-color: rgba(216, 55, 6, 0.685);
    color: #181818;
}

.main-page__subtitle {
    margin: 0 20vw;
    padding: 10px;
    background-color: rgba(73, 63, 61, 0.685);
    color: #ffffff;
}

h2 {
    font-size: 6vw;
}

@media(min-width:480px) {
    h1 {
        margin-top: 80px;
    }
}
@media(min-width:750px) {
    h1 {
        margin-top: 120px;
    }
}
@media(min-width:1024px) {
    h1 {
        margin-top: 180px;
        font-size: 4vw;
    }

    h2 {
        font-size: 3vw;
    }
}
@media(min-width:1300px) {
    h1 {
        margin-top: 300px;
        font-size: 3vw;
    }
}

.advantages__title {
    padding-top: 10px;
    border-top: 2px dotted #000;
}

.advantages__title--descr {
    padding-bottom: 10px;
    border-bottom: 2px dotted #000;
}

.advantages__container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-pack: distribute;
        justify-content: space-around;
}

.advantages__item {
    width: 60vw;
    padding: 20px;
}

@media(min-width:480px) {
    .advantages__item {
        width: 40vw;
    }
}
@media(min-width:750px) {
    .advantages__item {
        width: 25vw;
    }
}
@media(min-width:1024px) {
    .advantages {
        margin: 0 10vw;
        padding-bottom: 5vw;
    }
    .advantages__item {
        width: 20vw;
    }
}

.contacts {
    padding-bottom: 10vh;
}

iframe {
    margin-bottom: 10vh;
}

.contacts__list {
    list-style: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
        justify-content: space-around;
    padding: 0;
}

.contacts__item {
    font-size: 4vw;
}

@media(min-width:480px) {
    .contacts__item {
        font-size: 3vw;
    }
}
@media(min-width:750px) {
    .contacts__item {
        font-size: 2vw;
    }
}
@media(min-width:1200px) {
    .contacts__item {
        font-size: 1.5vw;
    }
}

footer {
    background: rgb(33,33,33);
background: -webkit-gradient(linear, left top, left bottom, from(rgba(33,33,33,1)), color-stop(50%, rgba(97,86,86,1)), to(rgba(32,30,30,1)));
background: -o-linear-gradient(top, rgba(33,33,33,1) 0%, rgba(97,86,86,1) 50%, rgba(32,30,30,1) 100%);
background: linear-gradient(180deg, rgba(33,33,33,1) 0%, rgba(97,86,86,1) 50%, rgba(32,30,30,1) 100%);
}

.signature {
    margin: 0;
    padding: 1vh;
    color: #ffffff;
}

#popup__toggle{bottom:25px;right:10px;position:fixed;z-index:999;}
.img-circle{background-color:#29AEE3;box-sizing:content-box;-webkit-box-sizing:content-box;}
.circlephone{box-sizing:content-box;-webkit-box-sizing:content-box;border: 2px solid #29AEE3;width:150px;height:150px;bottom:-25px;right:10px;position:absolute;-webkit-border-radius:100%;-moz-border-radius: 100%;border-radius: 100%;opacity: .5;-webkit-animation: circle-anim 2.4s infinite ease-in-out !important;-moz-animation: circle-anim 2.4s infinite ease-in-out !important;-ms-animation: circle-anim 2.4s infinite ease-in-out !important;-o-animation: circle-anim 2.4s infinite ease-in-out !important;animation: circle-anim 2.4s infinite ease-in-out !important;-webkit-transition: all .5s;-moz-transition: all .5s;-o-transition: all .5s;transition: all 0.5s;}
.circle-fill{box-sizing:content-box;-webkit-box-sizing:content-box;background-color:#29AEE3;width:100px;height:100px;bottom:0px;right:35px;position:absolute;-webkit-border-radius: 100%;-moz-border-radius: 100%;border-radius: 100%;border: 2px solid transparent;-webkit-animation: circle-fill-anim 2.3s infinite ease-in-out;-moz-animation: circle-fill-anim 2.3s infinite ease-in-out;-ms-animation: circle-fill-anim 2.3s infinite ease-in-out;-o-animation: circle-fill-anim 2.3s infinite ease-in-out;animation: circle-fill-anim 2.3s infinite ease-in-out;-webkit-transition: all .5s;-moz-transition: all .5s;-o-transition: all .5s;transition: all 0.5s;}
.img-circle{box-sizing:content-box;-webkit-box-sizing:content-box;width:72px;height:72px;bottom: 14px;right: 49px;position:absolute;-webkit-border-radius: 100%;-moz-border-radius: 100%;border-radius: 100%;border: 2px solid transparent;opacity: .7;}
.img-circleblock{box-sizing:content-box;-webkit-box-sizing:content-box;width:72px;height:72px;background-image:url(../img/mini.png);background-position: center center;background-repeat:no-repeat;animation-name: tossing;-webkit-animation-name: tossing;animation-duration: 1.5s;-webkit-animation-duration: 1.5s;animation-iteration-count: infinite;-webkit-animation-iteration-count: infinite;}
.img-circle:hover{opacity: 1;}
@keyframes pulse {0% {transform: scale(0.9);opacity: 1;}
  50% {transform: scale(1); opacity: 1; }   
  100% {transform: scale(0.9);opacity: 1;}}
 @-webkit-keyframes pulse {0% {-webkit-transform: scale(0.95);opacity: 1;}
  50% {-webkit-transform: scale(1);opacity: 1;}   
  100% {-webkit-transform: scale(0.95);opacity: 1;}}
@keyframes tossing {
  0% {transform: rotate(-8deg);}
  50% {transform: rotate(8deg);}
  100% {transform: rotate(-8deg);}}
@-webkit-keyframes tossing {
  0% {-webkit-transform: rotate(-8deg);}
  50% {-webkit-transform: rotate(8deg);}
  100% {-webkit-transform: rotate(-8deg);}}
@-moz-keyframes circle-anim {
  0% {-moz-transform: rotate(0deg) scale(0.5) skew(1deg);opacity: .1;-moz-opacity: .1;-webkit-opacity: .1;-o-opacity: .1;}
  30% {-moz-transform: rotate(0deg) scale(0.7) skew(1deg);opacity: .5;-moz-opacity: .5;-webkit-opacity: .5;-o-opacity: .5;}
  100% {-moz-transform: rotate(0deg) scale(1) skew(1deg);opacity: .6;-moz-opacity: .6;-webkit-opacity: .6;-o-opacity: .1;}}
@-webkit-keyframes circle-anim {
  0% {-webkit-transform: rotate(0deg) scale(0.5) skew(1deg);-webkit-opacity: .1;}
  30% {-webkit-transform: rotate(0deg) scale(0.7) skew(1deg);-webkit-opacity: .5;}
  100% {-webkit-transform: rotate(0deg) scale(1) skew(1deg);-webkit-opacity: .1;}}
@-o-keyframes circle-anim {
  0% {-o-transform: rotate(0deg) kscale(0.5) skew(1deg);-o-opacity: .1;}
  30% {-o-transform: rotate(0deg) scale(0.7) skew(1deg);-o-opacity: .5;}
  100% {-o-transform: rotate(0deg) scale(1) skew(1deg);-o-opacity: .1;}}
@keyframes circle-anim {
  0% {transform: rotate(0deg) scale(0.5) skew(1deg);opacity: .1;}
  30% {transform: rotate(0deg) scale(0.7) skew(1deg);opacity: .5;}
  100% {transform: rotate(0deg) scale(1) skew(1deg);
opacity: .1;}}
@-moz-keyframes circle-fill-anim {
  0% {-moz-transform: rotate(0deg) scale(0.7) skew(1deg);opacity: .2;}
  50% {-moz-transform: rotate(0deg) -moz-scale(1) skew(1deg);opacity: .2;}
  100% {-moz-transform: rotate(0deg) scale(0.7) skew(1deg);opacity: .2;}}
@-webkit-keyframes circle-fill-anim {
  0% {-webkit-transform: rotate(0deg) scale(0.7) skew(1deg);opacity: .2;  }
  50% {-webkit-transform: rotate(0deg) scale(1) skew(1deg);opacity: .2;  }
  100% {-webkit-transform: rotate(0deg) scale(0.7) skew(1deg);opacity: .2;}}
@-o-keyframes circle-fill-anim {
  0% {-o-transform: rotate(0deg) scale(0.7) skew(1deg);opacity: .2;}
  50% {-o-transform: rotate(0deg) scale(1) skew(1deg);opacity: .2;}
  100% {-o-transform: rotate(0deg) scale(0.7) skew(1deg);opacity: .2;}}
@keyframes circle-fill-anim {
  0% {transform: rotate(0deg) scale(0.7) skew(1deg);opacity: .2;}
  50% {transform: rotate(0deg) scale(1) skew(1deg);opacity: .2;}
  100% {transform: rotate(0deg) scale(0.7) skew(1deg);opacity: .2;}}




