@import url('https://fonts.googleapis.com/css2?family=Inter:opsz,wght@14..32,100..900&display=swap');

/*- Общие стили*/

body{
	margin: 0;
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  background-color: white;
  color:rgba(101, 102, 102, 1);
}

a{
	color:rgba(101, 102, 102, 1);
	text-decoration: none;
}

ul{
	list-style: none;
	padding: 0;
	margin: 0;
}

.container{
	max-width: 1140px;
	margin: 0 auto;
	padding: 0 15px;
}

img{
	max-width: 100%;
	height: auto;
	display: inline-block;
	object-fit: cover;
	vertical-align: top;
}

/*кнопка подгрузки*/
.load6block{flex:0 0 100%;display:flex;align-items:center;justify-content:center;}
.load6{cursor:pointer;}
/*модалка*/
.modal{visibility:hidden;position:fixed;top:0;left:0;right:0;bottom:0;display:flex;overflow:auto;z-index:5;transition:.2s;backdrop-filter:blur(5px);user-select:none;}
.modalinner{opacity:0;top:-100px;margin:auto;position:relative;transition:.2s;}
.modal.visible{visibility:visible;background:rgba(0,0,0,.6);}
.modal.visible .modalinner{opacity:1;top:0;transition:.2s .2s;}
.close{display:block;position:absolute;top:0;right:0;width:44px;height:44px;background:url(close.svg)no-repeat 50% 50%;cursor:pointer;}
/*просмотр в стиле фанси*/
#fngh6{display:block;position:fixed;top:0;bottom:0;left:0;right:0;background:rgba(0,0,0,.8);text-align:center;z-index:98;overflow:auto;line-height:100vh;}
#fngh7{display:inline-block;vertical-align:middle;border:9px solid #fff;border-radius:3px;max-width:96%;max-height:96%;background:#fff;transition:.2s;position:relative;}
#cls,#nxt,#prv{display:block;position:absolute;cursor:pointer;}
#cls{background:url(fancy_close.png);width:30px;height:30px;top:-20px;right:-20px;}
#prv{background:url(fancy_nav_left.png)no-repeat 50% 50%;top:0;left:0;bottom:0;width:50px;opacity:0;transition:.2s;}
#nxt{background:url(fancy_nav_right.png)no-repeat 50% 50%;top:0;right:0;bottom:0;width:50px;opacity:0;transition:.2s;}
#fngh7:hover #prv,#fngh7:hover #nxt{opacity:.5;}
#fngh7:hover #prv:hover,#fngh7:hover #nxt:hover{opacity:1;}
#fngh6 img{display:block;max-width:100%;max-height:100%;max-height:92vh;}
#fngh6 iframe{display:block;max-width:100%;max-height:100%;max-height:92vh;height:90vh;width:120vh;}
.mob{display:none;}
.mob,.nomob{width:100%;height:100%;object-fit:cover;}
/**/

/*- КНОПКА СЕРАЯ*/ 
.btn{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 220px;
	height: 50px;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: 400;
	color: white;
	background: #656666;
	border-radius: 5px;
	transition: opacity 0.3s;
}

.btn:hover {
	opacity: 0.8;}

/*- КНОПКА */ 
.btn2{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 200px;
	height: 40px;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: 400;
	color: #ffffff;
	background: #477338;
	border:0;
	font-family: "Inter", sans-serif;
	border-radius: 5px;
	transition: opacity 0.3s;
}

.btn2:hover {opacity: 0.8;}

/*- КНОПКА ОТКРЫТЬ БЛОК*/ 

.button2{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 200px;
	height: 40px;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: 400;
	color: rgba(101, 102, 102, 1);
	background: #f7f7f7;
	border-radius: 5px;
	transition: opacity 0.3s;
	border: none;
	 box-shadow: 0px 5px 5px 2px rgba(101, 102, 102, 0.2);
}

.button2:hover {opacity: 0.8;}



/*- ШАПКА*/ 
.header{padding:25px 0 ;}

.header .container{
display: flex;
flex-direction: column;
}

.header_container1{
display: flex;
justify-content: space-between;
align-items: center;
}

.logo{}

.phon_number{
	font-size: 24px;
	font-weight: 600;
	transition: opacity 0.3s;
}

.phon_number:hover{opacity: 0.7;}

.line{
	 margin-top: 7px;
    padding-bottom: 0px;
    padding-top: 7px;
	width: 1140px;
  border-top: 2px solid #656666;
}

.header_container2{
display: flex;
justify-content: space-around;
align-items: center;
}

.header_nav a{
	font-size: 16px;
	font-weight: 400;
	transition: opacity 0.3s;
}

.header_nav a:hover{
opacity: 0.7;
}

.header_list{
	display: flex;
	gap: 50px;}




/*-бургер меню*/ 

.burger{
	display: none;
	position: relative;
	z-index: 60;
	align-items: center;
	justify-content: flex-end;
	width: 30px;
	height: 18px;
}

.burger span{
	height: 2px;
	width: 80%;
	transform: scale(1);
	background-color: rgba(101, 102, 102, 1);
}

.burger::before, .burger::after{
	content: '';
	position: absolute;
	height: 2px;
	width: 100%;
	background-color: rgba(101, 102, 102, 1);
	transition: all 0.3s ease 0s;
} 

.burger::before{top: 0 }
.burger::after{bottom: 0 }



.burger.active span{ transform:scale(0); }
.burger.active::before{
	top: 50%;
	transform: rotate(-45deg) translate(0, 50%);
}

.burger.active::after{
	bottom: 50%;
	transform: rotate(45deg) translate(0, 50%);
}

@media(max-width: 900px){
.burger{display: flex;}
.header_container1 .phon_number{display: none;} 
.header_container1 .btn2{display: none;} 
.line{display: none;}

.header_list {
	display: none;
	flex-direction: column;
	position: fixed;
	height: 100%;
	width: 100%;
	top: 0; bottom: 0; left: 0; right: 0;
	z-index: 50;
	overflow-y: auto;
	padding: 50px 40px;
	background-color: white;
	animation:burgerAnimation 0.4s;
}

.header_list ul{
	flex-direction: column;
	row-gap: 30px;
}}


@keyframes burgerAnimation{
	from{opacity: 0}
	to {opacity: 1}
}

.open{
	display: flex !important;
}





















/*-БАННЕР*/ 

.main{}
.welcome{
	padding: 280px 0;
	background-image: url("../img/banner.png");
	background-repeat: no-repeat;
	background-size: cover ;
	background-position: center;
}
.welcome .container{
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
}
.welcome_text{
	display: flex;
	flex-direction: column;
    align-items: center;
    text-align: center;
	background-color:#00000087;
    padding-left: 50px;
    padding-right: 50px;
    padding-top: 30px;
    padding-bottom: 30px;
}
.welcome_title{
	margin: 0;
    padding-bottom: 30px;
	font-size: 36px;
	font-weight: 400;
	color: white;
}
.welcome_desc{
    padding-bottom: 30px;
	font-size: 16px;
	font-weight: 200;
	list-style-type: square;
}
.welcome_desc li {color: white;
    padding-bottom: 15px;
}
.welcome_desc a{color: white;}


/*- О НАС*/ 
.blok_text{}
.blok_text .container{
	display: flex;
	flex-direction: row;
    justify-content: space-between;
    flex-wrap: nowrap;
    align-items: flex-start;
    margin-top: 100px;
    margin-bottom: 50px;}
.onas_text{width: 550px;}
.blok_name{
	margin: 0px;
	font-size: 16px;
	font-weight: 600px;
	text-transform: uppercase;}
.blok_zagolovok{
	margin-top: 20px;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
	font-size: 36px;
	font-weight: 200;}
.blok_opisanie{
	padding-bottom: 30px;
	font-size: 16px;
	font-weight: 200;
	list-style-type: square;}
.blok_opisanie li {
    padding-bottom: 15px;
    color: rgba(101, 102, 102, 1);}
.blok_opisanie a{color: rgba(101, 102, 102, 1);}





 /*АДАПТАЦИЯ*/
            @media only screen and (max-width:1200px) {
				.blok_name{font-size: 14px;}
				.blok_zagolovok{font-size: 30px;}
				.blok_opisanie{font-size: 14px;}

				.welcome_title{font-size: 30px;}
				.welcome_desc{font-size: 14px;} 

				.welcome{padding: 200px 0;}	
            }

            @media only screen and (max-width:768px){
 				.blok_name{font-size: 14px;}
				.blok_zagolovok{font-size: 26px;}
				.blok_opisanie{font-size: 14px;}           
            
				.welcome_title{font-size: 26px;}
				.welcome_desc{font-size: 14px;} 

				.welcome{padding: 150px 0;} 

            }


            @media only screen and (max-width:480px){
 				.blok_name{font-size: 12px;}
				.blok_zagolovok{font-size: 24px;}
				.blok_opisanie{font-size: 12px;}

				.welcome_title{font-size: 24px;}
				.welcome_desc{font-size: 12px;} 
				                      
				 .welcome{padding: 100px 0;} 

            }






.onas{padding:0;}
.onas .container {
display: flex;
justify-content: space-evenly;
align-content: center;
   align-items: center;
flex-wrap: wrap;
gap:30px ;}
.onas_card{
width: 350px;
background: white;
box-shadow: 0px 5px 5px 2px rgba(101, 102, 102, 0.2);
border-radius: 5px;
overflow: hidden;
text-align: center;}

.onas_img{
	width: 100%;
	height: 200px;
	object-fit: cover;}
.onas_card_title{
 margin-top: 10px;
 margin-bottom: 10px;}

/*- ПРОЕКТЫ */ 

.blok_progect .container{
	display: flex;
	flex-direction: row;
    justify-content: space-between;
    flex-wrap: nowrap;
    align-items: flex-start;
    margin-top: 200px;
    margin-bottom: 20px;
    gap:30px ;
}
.progect .container{
	display: flex;
	flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: space-around;
    align-items: center;
    gap: 40px;
}
/*- слайдер*/ 
.slider-arrows{
	width: 350px;
    height: 300px;
	grid-area: slider-arrows;
	position: relative;
}

.slider-arrows_items-wrapper{
display: flex;}

.slider-arrows_item{
		width: 350px;
    height: 300px;
background-repeat: no-repeat;
	background-size: cover ;
	background-position: center;
}

.slider-arrows_nav{
	position: absolute;
	left: 0;
	top: 50%;
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.slider-arrows_arrow{
	color: white;
	background-color: #ffffff00;
	font-size: 20px;
	border: 1px  solid white;
	border-radius: 50%;
	width: 30px;
	height: 30px;
	transition: 0.2s opacity;
}

.slider-arrows_arrow:hover{opacity: 0.8;}

.slider-arrows_arrow:active{opacity: 0.6;}
.slider-arrows_arrow--left{margin-left: 10px;}
.slider-arrows_arrow--right{margin-right: 10px;}

/*- карточка общие стили*/ 
.progect_blok_vse{
    width: 350px;
    height: 450px;
    margin-bottom: 25px;
    margin-top: 25px;
    background: white;
	box-shadow: 0px 5px 5px 2px rgba(101, 102, 102, 0.2);
	border-radius: 5px;
	overflow: hidden;
	text-align: center;
	display: flex;
	flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;
}

.progect_opisanie{
	display: flex;
	flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;
}

.progect_name{
	display: flex;
	flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    margin: 0;
    width: 300px;
	position:relative;
}

.tooltip{display:none;position:absolute;bottom:100%;right:-15px;background:#fff;border-radius:4px;box-shadow:0 0 3px rgba(0,0,0,.3);opacity:0;transition:.2s;padding:2px 4px;font-size:95%;}
.progect_material:hover+.tooltip{display:block;opacity:1;}

.progect_name_text{
	margin-top: 15px;
    margin-bottom: 15px;
}

.progect_icon_blok{
	display: flex;
	flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    margin: 0;
    width: 300px;
}

.progect_icon_text{
	font-size: 13px;
	font-weight: 200;
    color: rgba(101, 102, 102, 1)
    margin-top: 15px;
    margin-bottom: 15px;
}

.line2{
	 margin-top: 7px;
    padding-bottom: 0px;
    padding-top: 7px;
	width: 300px;
	margin: auto 0;
  border-top: 2px solid #656666;	
}

/*- АКЦИИ*/ 
.blok_sale .container{
	display: flex;
	flex-direction: row;
    justify-content: space-between;
    flex-wrap: nowrap;
    align-items: flex-start;
    margin-top: 100px;
    margin-bottom: 50px;
    gap:30px ;}
.sale_text{width: 550px;}

/*- слайдер АКЦИИ*/ 
.slider-sale{}
.slider-sale .container{
    margin-top: 50px;}

.slider-dots{
position: relative;
height: 400px;}

.slider-dots_item-wrapper{
width: 100%;
height: 100%;
display: flex;}

.slider-dots_item{}

.slider-dots_nav{
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 10px;
    margin-top: 20px;
	left: 0;
	bottom: 10px;}


.slider-dots_nav-item{
width: 18px;
height: 18px;
background-color: #477338;
border: 1px solid black;
border-radius: 50%;
transition: 0.2s opacity;}

.slider-dots_nav-item:hover{opacity: 0.8;}
.slider-dots_nav-item:active{opacity: 0.6;}
.slider-dots_nav-item--active{
background-color: transparent;
border: 2px solid black;}




 /*АДАПТАЦИЯ*/
            @media only screen and (max-width:1200px) {
				.slider-sale .container{max-width: 800px;}
            }

            @media only screen and (max-width:768px){
        		 .slider-sale .container{max-width: 500px;}
				.nomob{display:none;}
				.mob{display:block;}
				
				/*.blok_progect .container{flex-direction:column;gap:0;}
				.blok_foto .container{flex-direction:column;gap:0;}*/
            
            }


            @media only screen and (max-width:480px){
                  .slider-sale .container{max-width: 400px;}  
            }




















/*- ОБРАТНАЯ СВЯЗЬ */ 

.container_zvonok .container{
    margin-top: 100px;
    margin-bottom: 50px;
    gap:30px ;
    text-align: center;}

.container_zvonok{background: rgba(217, 217, 217, 1);}
.zvonok_text{
 padding-top: 10px;
 padding-bottom: 10px;}

.zvonok_text .blok_zagolovok{padding-bottom: 20px;}
.zvonok_text .blok_name{padding-bottom: 20px;}
.obrsvaz__container{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 30px;
    align-content: flex-start;
    justify-content: space-evenly;
    align-items: flex-start;
    padding-bottom: 50px;
    padding-top: 30px;}

   
.field{
    height: 35px;
    width: 250px;
    text-align: left;
    font-family: "Inter", sans-serif;
    font-style: normal;
    font-size: 14px;
    font-weight: 400;
    border-radius: 5px;
    border: white;
    padding-left: 10px;
}

/*- ПОСТРОЕННЫЕ НАМИ ДОМА*/ 
.blok_foto .container{
	display: flex;
	flex-direction: row;
    justify-content: space-between;
    flex-wrap: nowrap;
    align-items: flex-start;
    margin-top: 100px;
    margin-bottom: 50px;
    gap:30px ;}
.foto_text{width: 550px;}
.nashi_doma .container{
	display: flex;
	flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: space-around;
    align-items: center;
    gap: 40px;
}

/*- слайдер наши дома*/ 
.slider-doma{
	width: 400px;
    height: 400px;
	grid-area: slider-arrows;
	position: relative;}
.slider-doma_items-wrapper{display: flex;}
.slider-doma_item{
	width: 400px;
    height: 400px;
background-repeat: no-repeat;
	background-size: cover ;
	background-position: center;}

.slider-doma_nav{
	position: absolute;
	left: 0;
	top: 50%;
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;}

.doma-arrows_arrow{
	color: white;
	background-color: #ffffff00;
	font-size: 20px;
	border: 1px  solid white;
	border-radius: 50%;
	width: 30px;
	height: 30px;
	transition: 0.2s opacity;}

.doma-arrows_arrow:hover{opacity: 0.8;}
.doma-arrows_arrow:active{opacity: 0.6;}
.doma-arrows_arrow--left{margin-left: 10px;}
.doma-arrows_arrow--right{margin-right: 10px;}

/*- карточка общие стили*/ 
.nashi_doma_vse{
    width: 400px;
    height: 500px;
    margin-bottom: 25px;
    margin-top: 25px;
    background: white;
	box-shadow: 0px 5px 5px 2px rgba(101, 102, 102, 0.2);
	border-radius: 5px;
	overflow: hidden;
	text-align: center;
	display: flex;
	flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;}

.doma_opisanie{
	display: flex;
	flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;}
.doma_adress{
	display: flex;
	flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    margin: 0;
    width: 300px;}
.progect_name_text{
	margin-top: 15px;
    margin-bottom: 15px;}
.progect_icon_blok{
	display: flex;
	flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    margin: 0;
    width: 300px;}
.progect_icon_text{
	font-size: 13px;
	font-weight: 200;
    color: rgba(101, 102, 102, 1)
    margin-top: 15px;
    margin-bottom: 15px;}



/*- БАНКИ + ФОРМА СВЯЗИ*/ 

.blok_banki-container .container{margin-top: 50px;}
.blok_banki-container{
	background-image: url("../img/banner2.png");
	background-repeat: no-repeat;
	background-size: cover ;
	background-position: center;}
.blok_banki{
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
gap: 60px;}
.blok_zagolovok{margin-top: 10px;padding-bottom: 40px;}
.banki_text{
    width: 500px;
    margin-top: 50px;
    margin-bottom: 50px;}
.banki_text a{}
.blok_opisanie{
  padding-left: 20px;
  padding-top: 30px;}
.zayavka_blok{
    margin-top: 50px;
    margin-bottom: 50px;	}
.zayavka{
	width: 400px;
	background-color: #ffffff87;
	border-radius: 5px;
    box-shadow: 0px 5px 5px 2px rgba(101, 102, 102, 0.2);
	display: flex;
	flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-evenly;
}
.zayavka-text{
    text-align: center;
    margin-top: 30px;
    margin-bottom: 20px;
    color: rgba(101, 102, 102, 1);
}
.obrsvaz__container2{
	display: flex;
	flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
}
.form-group{
    margin-bottom: 20px;
    box-shadow: 0px 5px 5px 2px rgba(101, 102, 102, 0.2);
}
.form-row{
    margin-bottom: 20px;
    box-shadow: 0px 5px 5px 2px rgba(101, 102, 102, 0.2);
}
.messege{
    margin-bottom: 20px;
    box-shadow: 0px 5px 5px 2px rgba(101, 102, 102, 0.2);
}
.obrsvaz__container2{
    margin-bottom: 30px;
}



.footer_container{}
.footer_container .container{}

.footer{
	column-gap: 60px;
    row-gap: 60px;
    display: flex;
    justify-content: space-evenly;
    align-items: flex-start;
    flex-wrap: wrap;
    margin-top: 100px;
    margin-bottom: 50px;
}

.kontakt{
	display: flex;
	flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;
}

.social-knop{
	display: flex;
	flex-direction: column;
    align-items: flex-start;
    flex-wrap: nowrap;
}


.social-icons{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 200px;
	height: 40px;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: 400;
	color: rgba(101, 102, 102, 1);
	background: #f7f7f7;
	border-radius: 5px;
	transition: opacity 0.3s;
	border: none;
	 box-shadow: 0px 5px 5px 2px rgba(101, 102, 102, 0.2);
}

.social-icons:hover {opacity: 0.8;}




.footer_container2{
	background:rgba(217, 217, 217, 1) ;

	display: flex;

	padding-top: 50px;
    padding-bottom: 100px;
}