header {
      text-align: center;
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      background-color: #fff;
      border-bottom: solid lightblue 8px;
            }
menu {
      display: flex; /*делет дочерние элементы контейнера flex-элементами, втроенными в ряд*/
      flex-direction: row; /*выравниваем по вертикали*/
      justify-content: space-around; /*выравниваем по главной оси: элементы расходятся на всю ширину*/
      font-size: larger; /*Задаём размер шрифта*/
      height: 20px;
      max-height: 20px;
                        }

.free_call {
      display: flex;
      flex-direction: row;
      justify-content: flex-start;
      align-items: flex-end; /*выравниваем по перекрёстной оси на центер*/
}
.head_adv {
      text-align: center;
      font-family: 'Play', sans-serif;
      font-size: 250%;
      text-shadow: 1px 1px thistle;
            }
.number_a {
    color: aliceblue;
}
h3    {
      margin-left: 20px;
      margin-top: 30px;
      font-family: 'Barlow', sans-serif;
      color: #4a94e9;
      font-size: 160%;
      text-shadow: 1px 1px #696969;
            }
span {
      color: white;
            }
a    {
      text-decoration: none; /*убираем нижнее подчеркивание*/
      color: cornflowerblue;
      font-family: 'Play', sans-serif;
      font-weight: bold;
      }
h4 {
      text-align: center;
      font-size: 100%;
}
.h4 {
    font-style: 'Play';
}
a:hover {
      color: #191970;
      }
.bonus_filling {
      display: flex;
      flex-direction: row;
      }
.surprise {
      font-size: 240%;
      }
.details {
      color: gray;
      font-size: 60%;
      }
.div_sur {
      display: flex;
      flex-direction: column;
      justify-content: center;
      margin: 0% 10% 0% 0%;
      }
.ul_1 {
      font-family: 'Play', sans-serif;
      font-size: 150%;
      font-weight: bolder;
      text-shadow: 1px 1px currentColor;
      color: currentColor;
      margin: 3%;
      letter-spacing: 1px;
      }
.ul_2 {
      font-weight: bold;
      font-size: 130%;
}
.sec1 {
      display: flex;
      background-image: url(../img/wall.jpg);
      height: 470px;
      background-repeat: no-repeat;
      background-size: cover;
      border: solid lightblue;
      }
.sec2 {
      display: flex;
      height: 600px;
      border: solid lightblue;
      flex-direction: column;
      }
.sec3 {
      display: flex;
      height: 550px;
      border: solid lightblue;
      flex-direction: column;
      }
.sec4 {
      display: flex;
  
      border: solid lightblue;
      flex-direction: column;
      }
.sec5 {
      display: flex;
      height: 300px;
      border: solid lightblue;
      flex-direction: column;
      }
#bonus {
    text-align: center;
    font-size: 200%;
    font-family: 'Play';
}
.wantToCallBack {
        font-size: 100%;
        font-family: 'Play';
}
.point1 {
    height: 40px;
    border-style: groove;
    width: 65%;
    border-radius: 15%;
}
.logo-b {
      position: relative;
      display: flex;
      flex-direction: row;
            }
.logo-i {
      width: 150px;
      height: 100px;
       }
.rollgate {
      padding-left: 50%;
}
.price_for {
      margin: 0% 20%;
      display: flex;
      font-size: 200%;
      font-weight: bold;
      text-shadow: 1px 1px yellow;
      padding: 0% 20%;
      width: 115%;
      color: black;
      }
.price_for2 {
      color: black;
      font-size: 170%;
      margin: 1% 15%;
      text-align: center;
      width: 80%;
}
.color {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
}
.colors {
      width: 40%
}
.p_colors {
      text-align: center;
      font-weight: bold;
      font-family: 'Play';
      letter-spacing: 0.5px;
      }
.text {
      width: 80%;
}
.div_colors {
      text-align: center;
}
.h4    {
      margin: 10px;
      }
.point {
      height: 40px;
      width: 53%;
      border-radius: 30px;
      font-size: 20px;
      margin: 0% 3%;
      }
.number_bg {
      background-color: rgba(0, 0, 255, 0.5);
      text-align: center;
      width: 70%;
      border-radius: 18%;
      box-shadow: 0px 1px 20px 4px blue;
      }
.point-sub {
      height: 60px;
      width: 110px;
      white-space: pre-line;
      font-weight: bold;
      color: #fff;
      background-color: #f00;
      border-radius: 20px;
      font-family: 'Play', sans-serif;
      box-shadow: 1px 2px 4px 4px cornflowerblue;
      font-size: 80%;
      letter-spacing: 0.5px;
	   margin-bottom: 45px;
      }
.bgc {
      background-color: rgba(176, 224, 230, 0.7);
      background-size: cover;
      width: 100%;
      height: 100%;
      }
.console {
      width: 55%;
      margin-top: 5%;
}
.bgc1 {
      background-color: rgba(119, 136, 153, 0.7);
      background-size: cover;
      width: 100%;
      height: 100%;
      }
.bgc3 {
      background-color: azure;
      height: 100%;
      width: 100%;
      display: flex;
      flex-direction: row;
      justify-content: space-around;
      }
.headline {
      text-align: center;
      font-size: 240%;
      font-family: Play;
      font-weight: bolder;
      text-shadow: 2px 2px lightblue;
       }
.headblocks {
      display: flex;
      flex-direction: row;
      justify-content: space-around;
      }
.logo_partners {
      display: flex;
      flex-direction: row;
      justify-content: space-around;
      }
.logo_partner1, .logo_partner3 {
      width: 25%;
      height: 1%;
      align-self: center;
}
.logo_partner2 {
      width: 10%;
      height: 1%;
}
.headblocks1 {
            display: flex;
            flex-direction: row-reverse;
            justify-content: space-around;
            }
.advantages {
      display: flex;
      flex-direction: column;
      justify-content: end;
      background-color: rgba(0, 0, 255, 0.5);
      border-radius: 15%;
      width: 45%;
             }
.number {
      font-size: 180%;
      text-shadow: 0px 0px 15px red;
            }
.mob {
      font-size: 250%;
      color: unset;
      text-shadow: 2px 2px darkgray;
      }
.text {
      font-family: Play;
      }
.bknow_more {
      display: flex;
      flex-direction: row;
      justify-content: space-around;
      }
.whant_more_1 {
      margin: 0% 15%;
      width: 100%;
      height: 50px;
      font-family: Play;
      border-radius: 15px;
      font-size: 120%;
      font-weight: bold;
      background-image: linear-gradient(to right, #ff8c00 0%, #ff0 51%, #ffffe0 100%);
      letter-spacing: 1px;
      box-shadow: 0 0 20px rgb(0,0,0);
      color: midnightblue;
      }
.whant_more_2 {
      margin: 15% 5%;;
      width: 100%;
      height: 50px;
      font-family: Play;
      border-radius: 15px;
      font-size: 120%;
      font-weight: bold;
      background-image: linear-gradient(to right, #ff8c00 0%, #ff0 51%, #ffffe0 100%);
      letter-spacing: 1px;
      box-shadow: 0 0 20px rgb(0,0,0);
      color: midnightblue;
      }
.types {
      text-align: center;
      font-size: 110%;
      font-family: Play;
      }
.img2 {
      width: 80%;
      height: 80%;
      }
.form {
      border: solid;
      text-align: center;
      padding: 2% 0%;
      border-radius: 25%;
      margin: 15% 2% 0% 2%;
      background-image: linear-gradient(to right, #9EEFE1 0%, #4830F0 51%, #9EEFE1 100%);
      }
.point1 {
      height: 40px;
      border-style: groove;
      }
.point-sub1 {
      color: white;
      padding: 20px 30px;
      margin: 5% 1% 0%;
      border-radius: 10px;
      font-family: 'Play', sans-serif;
      letter-spacing: 2px;
      background-image: linear-gradient(to right, #9EEFE1 0%, #4830F0 51%, #9EEFE1 100%);
      box-shadow: 0 0 20px rgba(0,0,0,.1);
      font-size: 70%;
      font-weight: bold;
      }
.name {
      font-size: 99%;
      letter-spacing: 0.8px;
      color: aliceblue;
      }
.connect-grid {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
}
.cont-left {
      width: 50%;
}
.cont-right {
      width: 45%;
}
.cont-p {
      
      font-size: 100%;
      font-weight: bolder;
}
.map {
    height:100vh;
}
@media (min-width: 390px) and (max-width: 900px) {
    .sec5 {display: none;}
    .sec3 {height: 740px;}
    .console {width: 50%; margin: 0% 25%;}
@media (min-width: 650px) and (max-width: 900px) {
    .form {
    margin: 4% 0% 0% 25% !important; 
    width: 50% !important; 
}
}