html{
  scroll-behavior: smooth;

}

body{
  margin: 0;
}

p {
  font-family: 'Oswald', sans-serif;
  font-size: 1.15vw;
}

a {
  text-decoration: none;
}


.clear {
  clear: both;
}

.fade-load {
  opacity: 0;
}

.header-slider{
  width: 100%;
  position: relative;
}

.header-slider img{
  width: 100%
}

.header-phone{
  position: absolute;
  width: 50%;
  left: 25%;
  top: 3%;
}

.header-phone img{
  width: 100%;
}

.header-logo{
  width: 50%;
  position: absolute;
  top: 20%;
  left: 25%;
}

.header-logo img{
  width: 100%;
}

.header-menu{
  width: 40%;
  position: absolute;
  top: 80%;
  left: 30%;
}

.header-menu img{
  width: 33%;
  float: left;
}

.block-text{
  width: 100%;
}

.block-text img{
  width: 100%;
}

.menu-wrap{
  width: 100%;
  position: relative;
}

.menu-wrap img{
  width: 100%;
}

.menu-buttons{
  width: 100%;
  position: absolute;
  top: 25%;
  left: 1%;
}

.menu-buttons-one{
  width: 12%;
  float: left;
  margin-left: 2%;
  filter: invert(95%);
}

.menu-buttons-two{
  width: 20%;
  float: left;
  margin-left: 4%;
}

.menu-buttons-three{
  width: 23%;
  float: left;
  margin-left: 5%;
}

.menu-buttons-four{
  width: 22%;
  float: left;
  margin-left: 6%;
}

.content-wrap{
  width: 100%;
}

.content-wrap img{
  width: 100%;
}

.calls-wrap{
  width: 100%;
  position: relative;
}

.calls-wrap img{
  width: 100%;
}

.calls-phone{
  position: absolute;
  width: 53%;
  right: 4%;
  bottom: 35%;
}

.calls-phone img{
  width: 100%;
}

.calls-form{
  width: 90%;
  margin-left: 5%;
}

.form-button{
  width: 100%;
  background-color: #1469A9;
  border-radius: 5px;
  font-size: 4.3vw;
  font-family: 'Oswald', sans-serif;
  color: white;
}

.process-wrap{
  width: 100%;
}

.process-wrap img{
  width: 100%;
}

.preim-wrap{
  width: 100%;
}

.preim-wrap img{
  width: 100%;
}

.footer-wrap{
  width: 100%;

}

.footer-map{
  width: 100%;

}

.footer-map img{
  width: 100%;
}

.footer-address{
  width: 100%;
  position: relative;
}

.footer-address img{
  width: 100%;
}

.footer-menu{
  width: 40%;
  position: absolute;
  top: 80%;
  left: 30%;
}

.footer-menu img{
  width: 33%;
  float: left;
}

.footer-tel{
  width: 100%;
  position: absolute;
  top: 65%;
}

.footer-tel img{
  width: 50%;
  float: left;
}
/*Navigation block*/

.bukvi-stick{
  display: none;
}

.fasade-stick{
  display: none;
}

.stends-stick{
  display: none;
}


.dev p{
  font-size: 2.5vw;
  color: gray;
  text-align: center;
}


/*Recalling*/
.modalDialog {
  position: fixed;
  font-family: 'Roboto Condensed';
  font-weight: 200;
  font-size: 3vw;
  top: 0;
  right: 0;
  bottom: 0;
  left: 20%;
  background: #F0F1EF;
  z-index: 8;
  opacity: 0;
  pointer-events: none;
  transition-property: opacity;
  transition-duration: 0.6s;
}

.modalDialog:target {
  opacity: 0.95;
  pointer-events: auto;}

  .modalDialog > div {
    width: 80%;
    position: relative;
    margin: 20% auto;
    padding: 5px 20px 13px 20px;
    border-radius: 10px;
  }

  .close {
    background: #606061;
    color: #FFFFFF;
    line-height: 25px;
    position: absolute;
    right: 2%;
    text-align: center;
    top: 2%;
    width: 24px;
    text-decoration: none;
    font-weight: bold;
    border-radius: 12px;
    box-shadow: 1px 1px 3px #000;
  }

  .close:hover {
    background: #00B020;
  }

  .icon-tel{
    position: fixed;
    width: 17%;
    right: 5%;
    bottom: 5%;
    background: rgb(237, 47, 0);
    border-radius: 50%;
    animation: circling 1s infinite;
    animation-delay: 2s;
    z-index: 7;
  }

  .logo-tel{
    margin-left: 15%;
    width: 70%;
  }

  @keyframes circling {
    0% {
      box-shadow: 0 0 0 0px rgba(237, 47, 0, 0.5);
    }

    100% {
      box-shadow: 0 0 0 30px rgba(237, 47, 0, 0);
    }
  }