@import url('https://fonts.googleapis.com/css?family=Jura:300,400,500,600,700&subset=cyrillic-ext');
@import url('https://fonts.googleapis.com/css2?family=Amatic+SC:wght@400;700&display=swap');




* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;  
}

html {
  scroll-behavior: smooth;
}
.yakor{
  position: relative;
  top: -100px;
  width: 10px;
  opacity: 0;
}

html, body {
	font-family: 'Jura', sans-serif;
	font: 20px Jura;
	background: #fff;
	color: #333;
  background-color:#f3efe9;
}



.wm100 {
  max-width: 100%;
 // font: 18px Jura;
}

.wm1200 {
  max-width: 1200px;
  margin: 0 auto;
}

header{
position: fixed;
   width: 100%;
 / background-color:#f3efe9;
  / border-bottom: 2px solid #f9c31f;
 /  box-shadow: 0 0 10px 0px rgba(90, 54, 0, 0.19);
  
  transition: all 0.5s ease-out;
  
   font-family: "Amatic SC", sans-serif;
  font-weight: 700;
  font-style: normal;
  
}

.header_container {
 display: flex;
   
  margin: 0 auto;
  max-width: 1300px;
 height: 100px;
  justify-content: space-between;
  align-items: center;
  padding: 15px 0 15px 0;
}

.header_logo {
  flex-grow: 1;
  display: flex;
 
  align-self: start;
  margin: -10px 0 8px 20px;
  
 / background: #444;
}

.header_logo img{
  max-height: 270px;
  height: calc(270px - var(--scrollTop));
  min-height: 90px;
  
  width: 100%;
 // min-width: 90px;
}



.header_menu {
  flex-grow: 1;
/  display: flex;
 / text-align: center; 
/  align-self: center;
/  margin: 0 0 8px 0;
  
/  background: #444;
}

.linemenu {
 // height: 45px; 
 // position: relative;
 //  background: #4F96E6;
}

.menu {
  padding: 0;
  margin: 0;
  overflow: hidden;
   display: flex;
  justify-content: space-between;
}

.menu_li {

  list-style: none;
  margin: 0 5px;
 // font-family: 'Open Sans', sans-serif;
  font-size: 200%;
  font-weight: 700;

}

.menu_li a{
	text-decoration:none;
	color: #833c64;
	
}

.menu_li a:hover {
	color: #DF8EBC;
	//	 text-decoration: underline;
}







.header_phons {
  flex-grow: 1;
/ text-align: right;

display: flex;
  margin-right:20px;
  
 /align-items: end;
/  align-self: end;
  justify-content: end; 
/  min-width: 250px;
/  height: 100px;
//  font: 400 28px/27px "Open Sans",sans-serif;
 / background-color:#eee;
 
   font-size: 250%;
  font-weight: 700;
 

}

.phon {
  position: relative;
  display: flex;
  
}

.phon::before {
  display: flex;
  height: 30px;
  align-items: center;
 // content: url('https://vippnevma.ru/img/phon.svg');

  color: #482b01;

}

.header_phons a {
  color: #833c64;
  text-decoration: none;

}

.m_menu{
 // background-color:#fff;
 /  flex-grow: 1;
/// text-align: right;

display: none;
    justify-content: end; 
  margin: 40px;
}

/* Скрываем чекбокс */
#menu-toggle {
  display: none;
}

/* Стили для кнопки меню (бургера) */
.menu-btn {
 / position: fixed;
  /top: 20px;
 / right: 20px;
  width: 40px;
  height: 30px;
  cursor: pointer;
  z-index: 1000;
  background: none;
  border: none;
  padding: 0;
}
/* Полоски бургера */
.menu-btn span {
  display: block;
  height: 4px;
  width: 100%;
  background: #833c64;
  margin-bottom: 10px;
  transition: all 0.3s ease;
  border-radius: 1px;
}
.menu-btn span:last-child {
  margin-bottom: 0;
}



/* Меню (изначально скрыто) */
.mmenu {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: #7b468a;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  z-index: 999;
}

/* Навигация */
.mmenu nav {
  text-align: center;
}

/* Ссылки меню */
.mmenu a {
  color: white;
  font-size: 2rem;
  text-decoration: none;
  display: block;
  padding: 15px 20px;
  text-align: center;
  transition: color 0.2s ease;
  border-radius: 5px;
}

.mmenu a:hover {
  color: #007bff;
  background: rgba(255, 255, 255, 0.1);
}

/* Когда чекбокс отмечен (меню открыто) */
#menu-toggle:checked ~ .mmenu {
  opacity: 1;
  visibility: visible;
}

/* Анимация бургера в крестик */
#menu-toggle:checked ~ .menu-btn span:nth-child(1) {
  transform: translateY(14px) rotate(45deg);
  background: white;
}

#menu-toggle:checked ~ .menu-btn span:nth-child(2) {
  opacity: 0;
}

#menu-toggle:checked ~ .menu-btn span:nth-child(3) {
  transform: translateY(-14px) rotate(-45deg) ;
  background: white;
}






















/* media screen 1200px ============================= */

@media screen and (max-width: 1200px) {
.header_logo img{
 
 
  height: 90px;
 
width: 90px;
}
  
}

/* media screen 1024px ============================= */

@media screen and (max-width: 1024px) {
	.m_menu{
display: flex;
}
 .header_menu {
   display: none;
   
  }
  
.header_phons {

  margin-right:0;
}
  
}

/* media screen 570px ============================= */

@media screen and (max-width: 570px) {

	
	.header_phons {
  font-size: 200%;
      
  }
  
}

/* media screen 460px ============================= */

@media screen and (max-width: 460px) {
	.header_phons {
font-size: 150%;
      
  }
 

}



/* media screen 450px ============================= */

@media screen and (max-width: 450px) {
	
		.header_logo {
  flex-grow: 0;
	}
	
	.header_phons {
  justify-content: center; 
	}

  .phon::before {


  display: none;



}
  .m_menu{

  margin-left: 5px;
}

}








/* media screen 350px ============================= */

@media screen and (max-width: 350px) {
  .header_phons{
    display:none;
  }

}


.oneline {
  padding:100px 0 10px 0;
 background-color:#eee;
/// min-height: 600px;
  
  background-image: url("/img/fon_6.jpg");
  background-position: center bottom;
  background-size: cover;
  background-repeat: no-repeat;

}

.oneline span {
 / background-color: rgba(53, 103, 164, 0.7);
  padding: 0 10px 5px 0px;
}

.wm1000p {
  max-width: 1000px;
  margin: 0 auto;
 // padding: 0 0px 0 5px;
}
.oneline__h1{
  
  width: 100%;
  /  background-color:#000;
    display: flex;

  justify-content: flex-end;
  
}

.h1_gl {
	
	  font-family: "Amatic SC", sans-serif;
  font-weight: 700;
  font-style: normal;
	
	
	

   max-width: 800px;
  font-size: 300%;
  text-align: right;
 color: #482b01;
  padding: 40px 0 10px 0;
  margin: 0 20px;
 / background-color:#e0e;
  
}

.h1_gl b{
	font-size: 140%;
  color: #f90;
  text-shadow: 2px 2px 2px rgba(131, 60, 100, 0.5);
	
}
.oneline__club {
  display: block;
  max-width: 650px;
  font-size: 168%;
  color: #fff;
  margin: 20px;
  padding: 20px;
 / font-weight: bold;
  background-color: rgba(123, 70, 138, 0.8);
 / backdrop-filter: blur(5px);
  border-radius: 10px;
}


.oneline_button {
  display: flex;
  align-items: center;
  margin: 20px;
  justify-content: end;
}



.oneline_button span {
  width: 430px;
  height: 80px;
  padding: 15px;
  font-size: 131%;
  border-radius: 10px;
  background-color: #833C64;
  color: #f7ebf1;
  box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.05);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  transition:  all 200ms ease-out; 
}


.oneline_button span:hover{
    background: #662A4C;
    cursor: pointer;
    transition:  all 200ms ease-out; 
}

/* media screen 570px ============================= */

@media screen and (max-width: 570px) {
.h1_gl {

   
  font-size: 220%;
  padding: 10px 0 10px 0;
      
  }
  .oneline__club {

    font-size: 110%;
  }
  
  .oneline_button span {

  font-size: 110%;
  height: 60px;
  }
  
}

/* media screen 350px ============================= */

@media screen and (max-width: 350px) {
.h1_gl {

   
  font-size: 130%;
      
  }

}







.twoline {

 min-height: 400px;
  background-color:#efaf8c;
padding: 10px 0 40px 0;
color: #3A2012;
}

.twoline_flex{
  font-family: ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";
  
 //height: 400px;
   display: flex;
flex-wrap: wrap;
  justify-content: center;
 margin: 0;

}

.twoline_flex_in{
  
  display: flex;
  flex-flow: column nowrap;
  width: 425px;
  font-size: 120%;
  margin: 20px;
  padding: 10px 20px;
  background-color:#FFD1B8;
  border-radius: 10px;
  box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.05);

}

.twoline_flex_in ul{
  margin: 0 0 0 20px;
  padding: 5px 1px 5px 0px;
  font-size: 80%;
  flex-grow: 1;
  color: #481d35;
}

.twoline_flex_in li{
   list-style: disc outside;
  padding: 5px 1px 5px 0px;
  
}
.twoline_flex_in li::marker {
  color: #833C64;
  //content: "☯ ";
  font-size: 115%;
}

.twoline_flex_in div{
  /border: 2px solid #000;
  /  border-radius: 10px;
/   padding: 10px 30px;
}

.twoline h3{
   font-size: 110%;
  text-align: center;
  color: #481D35;
  padding: 10px 0 20px 0;
  margin: 0 0;
  
}

.twoline_flex_in_in{
  margin-top:  15px;
   padding-top: 10px;
 border-top: 1px solid #833C64;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  

}










.twoline_flex_in_price{
	margin: 0 0 10px 0;
	flex-grow: 2;
	
}

.twoline_flex_in_button{
  display:flex;
 align-items: center;
   
 height: 40px;
  margin: 0 auto 10px auto;
   padding: 15px;
  font-size: 80%;
  border-radius: 10px;
  background-color: #833C64;
  color: #f7ebf1;
  box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.05);
  transition:  all 200ms ease-out; 
}



.twoline_flex_in_button:hover{
    background: #662A4C;
    cursor: pointer;
    transition:  all 200ms ease-out; 
}


.twoline_flex_in_price span{
  display:block;
  
}








h2{

  
  font-size: 300%;
  text-align: center;
  color: #000;
  padding: 40px 0 30px 0;
  margin: 0 0;
  font-family: "Amatic SC", sans-serif;
  font-weight: 700;
  font-style: normal;
}

/* media screen 1000px ============================= */

@media screen and (max-width: 1000px) {
	h2{
		font-size: 190%;
padding: 30px 0 20px 0;
}
  
}




.threeline{
 margin: 0 auto;
   background-image: url("/img/fon2_8.jpg");
  background-position: center bottom;
  background-size: cover;
  /background-repeat: no-repeat;

}

.threeline_in{
   display: flex;
flex-wrap: wrap;
  flex-direction: row;
  justify-content: center;
  padding: 0 0 30px 0;
}

.threeline_in img{
  border-radius: 5%;
  width: 100%;
 height: auto;
 / object-fit: cover;
  
}

.threeline_in span{
  
   display: block;
  max-width: 650px;
  font-size: 130%;
  color: #000;
 / margin: 20px;
  padding: 20px;
 / font-weight: bold;

  
}


/* media screen 1000px ============================= */

@media screen and (max-width: 1000px) {
	.threeline_in span{
  

  font-size: 100%;
   
  }
  
}


/* Галерея ============================= */

.galereya{
	background-color: #efaf8c;
	background-image: url("/img/fon2_8.jpg");
}

.galereya_in{

	display: flex;
	flex-flow: row nowrap;
	justify-content: space-evenly;
	
  overflow: scroll;
  scrollbar-width: none; 
  
//  scroll-snap-type: x mandatory;
//  scroll-snap-type: x proximity;
  
//  margin: 0 20px 0 20px;

cursor: grab;
padding: 0 0 40px 0;
}

.galereya_in:active{
	cursor: grabbing;
}

@media (pointer: coarse) {
    .galereya_in{  
  scroll-snap-type: x mandatory;

}
}

.galereya_in::-webkit-scrollbar { display: none; }

.galereya_in div{
	margin: 10px 20px 10px 0;
	
	background-color: #fbccb5;
	 border-radius: 10px;
	min-width: 250px;
 height: 350px;
 
 scroll-snap-align: start;
 scroll-margin: 20px;

  display: flex;
  align-items: flex-end;
	
}

.galereya_in div:first-child {
  	margin-left:20px;
}

.galereya_in span{
color: #fff;
  margin: 0 0 10px 10px;
  font-weight: bold;
  text-shadow: 2px 2px 2px rgba(41, 37, 39, 0.9);
  padding: 2px 5px 5px 5px;
  
  
  font-family: "Amatic SC", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 150%
}










/* Контакты ============================= */

.kontakti{
	background-color: #efaf8c;
}
.kontakti_in{
	padding: 30px 0 60px 0;
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	//align-items: center;
}

.kontakti_phon{
	margin: 0 20px 0 20px;
	display: flex;
  flex-flow: column nowrap;
}

.kontakti_phon div{
  font-size: 105%;
  margin: 0 0 20px 0;
  padding: 15px;
  background-color: #fbccb5;
  border-radius: 10px;
  box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.05);
  max-width: 400px;
  display: flex;
  flex-flow: column nowrap;
}
.kontakti_phon b{

margin: 0 0 10px 0;
}


.kontakti_map{
	margin: 0 20px 20px 20px;
	width: 600px;
	min-height: 300px;
	 background-color: #fcfaf8;
  border-radius: 10px;
  box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.05);
}
	



/* Форма записи ============================= */

.forma_zapisi{
	position: fixed;	
	width: 100%;
	height: 100%;
	//background: #7b468a;
	background: rgba(123, 70, 138, 0.95);
	z-index: 99;
	top: 0;
	//display: flex;
	display: none;
	flex-flow: column nowrap;
	justify-content: center;
	align-items: center;
}

.forma_zapisi_krest{
	position: fixed;
	top: 0px;
	right: 30px;
	font-size: 75px;
	color: #fff;
	cursor: pointer;
}

.forma_zapisi_input{
	display: flex;
	min-width: 0;
	width: 90%;
	max-width: 500px;
	height: 50px;
	font-size: 20px;
	padding: 10px;
	margin: 10px;
	border-radius: 5px;

  }
  
 .forma_zapisi_textarea{
	display: flex;
	min-width: 0;
	width: 90%;
	max-width: 500px;
	font-size: 20px;
	padding: 10px;
	margin: 10px;
	border-radius: 5px;

  }
  
  
 .forma_zapisi_knopka {
	 
height: 50px;
  padding: 25px;
  margin: 10px;
  font-size: 25px;
  border-radius: 5px;
  background-color: #C578DB;
  color: #fff;
  box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  transition: all 200ms ease-out;
 }


.forma_zapisi_knopka:hover{
    background: #833C64;
    cursor: pointer;
    transition:  all 200ms ease-out; 
}


.forma_zapisi_checkbox{
	width: 90%;
	max-width: 500px;
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	color: #fff;
    font-size: 90%;
	
}

/* Отключаем стандартный стиль чекбокса */
.checkbox-input {
    appearance: none;
    -webkit-appearance: none; /* для поддержки в Safari */
}

/* Стилизация чекбокса */
.checkbox-input {
    appearance: none;
	min-width: 25px;
    width: 25px;
    height: 25px;
    border: 1px solid #d9b1e4;
    border-radius: 0.25rem;
    background-color: #fff;
    cursor: pointer;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    margin-right: 10px;
}

/* Оформление состояния checked */
.checkbox-input:checked {
    background-color: #7c4588;
    border-color: #d9b1e4;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}



/* Эффект нажатия */
.checkbox-input:active {
    filter: brightness(90%);
}

/* Смена цвета границы при наведении */
.checkbox-input:hover:not(:disabled) {
    border-color: #d9b1e4;
}

/* Стили для чекбокса при фокусе */
.checkbox-input:focus {
    border-color: #d9b1e4;
    outline: none;
    box-shadow: 0 0 0 0.25rem rgba(123, 70, 138, 0.25);
}

/* Отключенный чекбокс */
.checkbox-input:disabled {
    filter: none;
    opacity: 0.5;
    cursor: not-allowed;
}

.checkbox-input:disabled ~ .checkbox-label {
    opacity: 0.5;
    cursor: not-allowed;
}





























/* Форма ответа ============================= */

.forma_otveta{
	position: fixed;	
	width: 250px;
	//height: 100px;
	background: #7b468a;
	z-index: 101;
	bottom: 10px;
	right:10px;
//	display: flex;
	display: none;
	color: #fff;
  padding: 15px;
  margin: 10px;
  transition:  all 600ms ease-out; 
  opacity: 0; 
  border-radius: 10px 10px 0 10px;
}


/* Подвал ============================= */

footer{
	padding: 0 20px;
    background-color: #5A3724;
    color: #FFEBB8;
}


.footer_in{
	padding: 50px 0 10px 0;
	display: flex;
	flex-flow: row wrap;
	justify-content:space-between;
}

.footer_in_logo{
	display: flex;
	 flex-flow: column nowrap;
	 max-width: 440px;
	 margin-bottom: 40px;
}



.footer_in_logo_in{
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
  margin-bottom: 20px;
}
.footer_in_logo_in img{
	
	max-width: 120px;
	height:auto;
}

.footer_in_logo_in span{
	font-size:120%;
	margin-left: 15px;
}
.footer_in_logo_in b{
	font-size:130%;
	
}

.footer_in_logo p{
	font-size: 90%;
	
}

.footer_in_menu{
	display: flex;
	 flex-flow: column nowrap;
	 max-width: 350px;
	 margin-bottom: 40px;
}

.footer_in_menu b{
margin-bottom: 5px;
}

.footer_in_menu a{
margin-top: 10px;
text-decoration:none;
color: #FFEBB8;
}

.footer_in_menu  a:hover{
color: #A38A4A;
}


.footer_in_kon{
	display: flex;
	 flex-flow: column nowrap;
	max-width: 350px;
	margin-bottom: 40px;
	
}
.footer_in_kon b{
margin-bottom: 5px;
}
.footer_in_kon span{
margin-top: 10px;
}

.copyright{
	text-align: center;
	border-top: 1px solid #FFEBB8;
	padding: 15px;
	//margin-top: 15px;
}

/* media screen 1000px ============================= */

@media screen and (max-width: 1000px) {

.footer_in{

	 flex-flow: column nowrap;

}
  
}