*{
  margin: 0;
  padding: 0;
  font-family: Helvetica;
}
body{
  text-align: center;
}

/*HEADER*/
header{
  height: 80px;
  width: 100%;
  background-image: url('../image/stone.jpg');
}

.logo{
  display:inline-block;
  float:left;
  width: 20%;
  text-align: center;
  margin-top:30px;
  font-weight: bold;
  font-size: 22px;
  color:#091D46;
}
.menu{
  float: left;
  width: 50%;
  text-align: center;
  margin-top:30px;
  font-size: 18px;
  font-weight: bold;
}
.phone{
  float:left;
  width: 30%;
  text-align: center;
  margin-top:25px;
  font-size: 24px;
  font-weight: bold;
}
.phone a{
  text-decoration: none;
  color:black;
}
ul li{
  display:inline;
  padding:10px;
}
ul li:hover{
  color:white;
  cursor: pointer;
}
/*ПЕРВЫЙ ЭКРАН*/
.first_screen{
  width: 100%;
  min-height: 800px;
  background-image: url('../image/first_screen.jpg');
  background-size: cover;
  text-align: center;
}
.zagolovok{
  text-align: center;
  color:white;
  background-color: #000000B3;
  padding:5px;
}
.zagolovok2{
  text-align: center;
  background: #F4CA16;
  margin:0px 80px;
}
.zagolovok3{
  text-align:center;
}
.trigger{
  width: 50%;
  background-color: blue;
  float: left;

}
.forma{
  display: flex;
  width: 50%;
  float: right;
  justify-content: center;
}
.first_form{
  margin-top: 80px;
  background: rgba(255,255,255,0.7);
  width: 80%;
}
.input_form{
  width: 80%;
  height: 40px;
  text-align: center;
  font-size: 22px;
}
.button_form{
  width: 80%;
  height:50px;
  background: linear-gradient(#FFFF00, #FF993F);
  margin-top: 10px;
  font-size: 22px;
  font-weight: bold;
  cursor: pointer;
  border:1px solid #FF993F;
  /* Важные стили для анимации */
  position: relative;
  overflow: hidden;
}
.button_form .flare {
    position: absolute;
    top: 0;
    height: 100%;
    width: 45px;
    transform: skewX(45deg); // Наклон
    animation: flareAnimation;
    left: -150%;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.7));
    animation: flareAnimation 3s infinite linear; // Время и тип анимации можно менять
}

@keyframes flareAnimation {
    0% {
        left: -150%;
    }
    100% {
        left: 150%;
    }
}
.button_form:hover{
  background: linear-gradient(#FF993F, #FFFF00);
}
.text1 {
	font-size:20px;
	text-align:left;
}
.cifra {
	float:left;
	font-size:28px;
	font-weight:bold;
	border:0px;
	width:30px;

}
.cifra1 {
	border:0px;
}
.text_form{
  font-size: 24px;
}
.table_form{
  padding:20px;
}
.two_container{
  display: flex;
  justify-content: center;
}
#two_screen{
  max-width: 1200px;
  text-align: center;
  margin-top:20px;
  display:block;

}
.vid_fundamenta{
  width: 30%;
  text-align: center;
  float: left;
  font-weight: bold;
  padding:10px;
}
.vid{
  width: 100%;
}
.bottom_vid{
  width: 100%;
  display: flex;
  justify-content: center;
}
#three_screen{
  text-align: center;
  display:block;
}
#three_screen button{
  width: 30%;
}
/*БЛОК КОНТАКТЫ*/
#six_screen{
  min-height: 444px;
}
#map{
  width: 50%;
  float: left;
}
#map2{
  padding: 20px;
}
#vopros{
  width: 50%;
  float: right;
  display: flex;
  justify-content: center;
  padding-top:50px;
}
#vopros2{
  width: 80%;
}
/*ФУТЕР*/
footer{
  width: 100%;
  height: 80px;
  background-color: grey;
}
footer p{
  padding-top:20px;
  color:white;
}
