/* Global */
* {
    box-sizing: border-box;
    margin:0;
    padding: 0;
}

html {
scroll-behavior: smooth;
}


html,
body {
  font-family: "Montserrat", sans-serif;
  color: #444444;
  font-size: 12pt;  
}
.border{border:1px solid red;}
.block_1280{max-width: 1280px; }
.block_center_margin{margin: 0 auto;}

.block_1280{max-width: 1280px; }
.block_center_margin{margin: 0 auto;}

.contents img {
    width: auto\9;
    height: auto;
    max-width: 100%;    
    border: 0;
    -ms-interpolation-mode: bicubic;
}

.contents ul{padding-left:15px; padding-top:5px; padding-bottom:5px; margin-left:15px; margin-top:5px; margin-bottom:5px;line-height: 1.5;list-style-type:disc; letter-spacing: 0.7px;}
.contents ol{padding-left:15px; padding-top:5px; padding-bottom:5px; margin-left:15px; margin-top:5px; margin-bottom:5px;line-height: 1.5;list-style-type:decimal; letter-spacing: 0.7px;}
.contents ul, ol, li{padding-bottom: 10px;}
.contents p{
    padding-top:9px; 
    padding-bottom: 9px; 
    text-align: justify;       
    
}

a{color: #0078D0; text-decoration: underline;}
a:hover{color: #F98655; text-decoration: none;}

.not_items{visibility: hidden;}

.wrapper {
  min-height:100vh; 
    display: flex;
    flex-direction: column;
}

/* Header */
.header {  

    -min-height: 680px;
    background-position: center;
    padding-bottom: 30px;

    
}

.header_block{
	margin: 0 auto; 
	max-width: 1280px;
    padding: 10px; 	
}




.header__list {
    display: flex;
    list-style: none;
    justify-content: center;

}

.header__list-item {
    margin: 0 15px 0 0;
}

/* Content */

.content {
    display: flex;
    flex-grow: 5;
    margin: 0 auto; 
	max-width: 1280px;

}

.flex_dop{
    display: flex;
    flex-grow: 5;
}


.content__left-bar,
.content__right-bar {
    min-width: 250px;
    width: 250px;


}

.content__left-bar {
    background: #c798b8;
}

.content__right-bar {
    background: #9cb0c7;
}

.footer__text {
    text-align: center;
}

/* Задаём порядок */
.content__left-bar {
    order: 1;
}

.content__main {
    order: 2;
    width: 100%;
}

.content__right-bar {
    order: 3;
}

/* Main */

.content__main {
    padding: 15px 10px;
}

/* Footer */

.footer {
   padding: 0 10px; 
}

.footer__text {
    margin: 0;
}

.header__logo{ width:280px; height:auto; }

.shapka_flex{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.tel_top a{
font-weight: 700;
font-size: 30px;
color: #fff;
text-decoration: none;
white-space: nowrap;
}

.tel_top a:hover{
font-weight: 700;
font-size: 30px;
color: #fff;
text-decoration: none;
white-space: nowrap;
}

.knopka a{
    border-radius: 5px;
    background: #f9cc55;
    font-weight: 400;
    font-size: 18px;
    color: #000;
    padding: 8px 20px;
    text-decoration: none;
    cursor: pointer;
    transition: 1s;

}


.knopka a:hover{
    border-radius: 5px;
    background: #F98655;
    transition: 1s;
    font-weight: 400;
    font-size: 18px;
    color: #000;
    padding: 8px 20px;
    text-decoration: none;
    cursor: pointer;

}



.knopka a:active {
    position:relative;
    top:1px;
}

.messedg_flex{
    display: flex;
    padding: 0 25px;
    
}

.messedg_items{margin: 0 5px;}

.messedg img{width: 50px; height: auto; transition: .3s;}

.messedg img:hover{
opacity: 0.7;
transition: .3s;
}

.messedg2 img{width: 40px; height: auto; transition: .3s;}

.messedg2 img:hover{
opacity: 0.7;
transition: .3s;
}

.grow2{flex-grow: 2; text-align: right;}
.menu_block{
    background: rgba(232, 232, 232, 0.1);
    margin-top: 20px;
    padding: 8px 10px 4px 10px;
}

.top_menu_flex{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.header-menu-list ul li{list-style-type: none;}
.header-menu-list ul a{
font-weight: 300;
font-size: 18px;
text-decoration: underline;
text-decoration-skip-ink: none;
color: #fff;
white-space: nowrap;
}

.header-menu-list ul a:hover{
font-weight: 300;
font-size: 18px;
text-decoration: none;
text-decoration-skip-ink: none;
color: #F98655;
white-space: nowrap;
}


.forma_flex{
    display: flex;
    justify-content: space-between;
    padding-top: 40px;
    align-items: center;
}

.banner_zag h1{
font-weight: 800;
font-size: 40px;
color: #fff;
}

.forma_top{
    flex: none;
    width: 45%;
    margin-left: 20px;
}

.banner_opis{
padding-top: 20px;
font-weight: 300;
font-size: 18px;
color: #E8E8E8;

}

.otstup_knopk{padding-top: 40px; white-space:nowrap;}
.otstup_knopk2{padding-top: 30px; padding-bottom: 20px; white-space:nowrap;}
.otstup_knopk3{padding-top: 20px; padding-bottom: 10px; white-space:nowrap;}
.banner_snoska{
    padding-top: 20px;
    font-weight: 200;
    font-size: 14px;
    color: #e8e8e8;
}

.form_zag{
    font-weight: 600;
    font-size: 24px;
    color: #fff;
    text-align: center;
    padding-top: 5px;
}

.forma_fon{
    border: 1px solid rgba(217, 217, 217, 0.3);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.1);
    margin-top: 10px;    
    padding: 30px 40px;
}

.forma_chek_flex{
    display: flex;
    justify-content: space-between;
    font-weight: 200;
    font-size: 22px;
    color: #fff;
}

.input_flex{
    display: flex;
    justify-content: space-between;
    padding-top: 20px;
}

.input_items input{
border: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(232, 232, 232, 0.1);
border-radius: 5px;
width: 100%;
padding: 12px 25px;
}

.input_tel input{
border: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(232, 232, 232, 0.1);
border-radius: 5px;
width: 100%;
padding: 12px 25px;
margin-top: 20px;
}

.padtopinp{margin-left: 10px;}

.fontAwesomeicon {
         font-family: 'Montserrat', FontAwesome, sans-serif;
         font-weight: 200;
         color:#fff;
         font-size: 12pt;
    }

.slogan_niz{
    font-weight: 300;
font-size: 16px;
color: #979393;
text-align: center;
padding: 10px;
}

.footer_flex{
    display: flex;
    justify-content: space-between;
    padding-top: 30px;
}

.logo_niz img{width: 230px; height: auto;}
.priem_zaivok{
    font-weight: 300;
font-size: 14px;
color: #000;
}
.tel_footer{
    font-weight: 700;
font-size: 25px;
color: #000;
}

.tel_footer a{
    font-weight: 700;
font-size: 25px;
color: #000;
text-decoration: none;
}

.tel_footer a:hover{
    font-weight: 700;
font-size: 25px;
color: #000;
text-decoration: none;
}

.otstup_foot{padding-top: 7px;}

.menu_footer{list-style-type: none; line-height: 1.5;}
.menu_footer a{color: #0078D0; text-decoration: underline;}
.menu_footer a:hover{color: #F98655; text-decoration: none;}

.kompany_block{padding-top: 50px;}
.icons_zag{text-align: center;}
.icons_zag img{width: 50px; height: auto;}
.zag{
    text-align: center;
    font-weight: 600;
    font-size: 22px;
    color: #000;
}

.zag2{
    text-align: center;
    font-weight: 600;
    font-size: 22px;
    color: #fff;
}


.kompany_flex{
    display: flex;
    justify-content: space-between;
    padding-top: 30px;
}

.kompany_img img{
    border-radius: 10px;
    width: 250px;
    height: auto;
    margin-top: 10px;

}

.komp_otst{padding-right: 30px;}


.preimuch_block{
    padding: 100px 10px;
    
}

.zag_opis{
    font-weight: 500;
font-size: 17px;
color: #444;
text-align: center;
}


.preimuch_fon{  
    margin-top: 50px;
}

.preimuch_flex{
    display: flex;
    justify-content: space-around;
    padding-top: 40px;
    flex-wrap: wrap;
}

.preimuch_items{
    flex-basis: 280px;
    text-align: center;
    margin: 10px 5px;
}
.preimuch_img{padding: 7px 0;}
.preimuch_img img{height: 100px; width: auto;}
.preimuch_zag{
    font-weight: 600;
font-size: 20px;
color: #000;
}
.preimuch_opis{
font-weight: 300;
margin: 0 10px;
font-size: 16px;
text-align: center;
color: #444;
}

.hamam_block{
    padding: 50px 10px;
}

.pad_hamam{padding-top: 10px;}
.foto_zag h3{font-weight: 600;
font-size: 28px;
color: #000; text-align: center;}

.foto_opis{font-weight: 500;
font-size: 16px;
color: #444;
text-align: center;
}

.foto_zag2 h3{font-weight: 600;
font-size: 28px;
color: #fff; text-align: center;}

.foto_opis2{font-weight: 500;
font-size: 16px;
color: #979393;
text-align: center;
}

.foto_rabot{padding-top: 40px;}

.rabot_flex{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding-top: 10px;
}

.rabot_items img{
    width: 280px; 
    height: auto; 
    border-radius: 10px;
    vertical-align: bottom;
}
.rabot_items{
    flex-basis: 280px;
    margin: 15px 10px; 

}

.opis_hamam_cena{
    padding: 10px 0;
}

.hamam_cena{padding-top: 15px;}

.cena_flex{
    display: flex;
    justify-content: space-between;
    padding-top: 20px;
    flex-wrap: wrap;
}
.cena_items{flex-basis: 330px; margin: 25px 0; }

.cena_img img{
    border-radius: 10px;
    width: 320px;
    height: auto;
}

.cena_zag{
font-weight: 600;
font-size: 25px;
text-align: justify;
color: #000;
padding: 7px 0;
}

.cena_zag2{
font-weight: 600;
font-size: 25px;
text-align: justify;
color: #fff;
padding: 7px 0;
}


.cena_detali li{list-style-type: none;}
.cena_detali li span{font-weight: 600;}
.cena_detali ul{line-height: 1;}
.cena_detali{padding-top: 7px;}

.cena_cvet{color: #979393;}

.hamam_otst{padding-top: 30px;}
.cena{
    font-weight: 600;
font-size: 20px;
text-align: justify;
color: #000;
}

.cena2{
    font-weight: 600;
font-size: 20px;
text-align: justify;
color: #fff;
}

.cena span{font-size: 28px;}
.cena2 span{font-size: 28px;}

.sauna_fon{  
    background-position: center; 
    min-height: 600px;
}

.sauna_block{
    padding: 100px 10px;
}

.sauna_cont{color: #979393;}

.tovar_cena_opis{
    font-weight: 400;
font-size: 16px;
color: #6c6c6c;
padding-bottom: 10px;
}

.kontakt_block{
    margin-top: 40px;
}


.mapss{padding: 15px 0;}

  #topNubex {
    position: fixed;
    right: 45px;
    bottom: 35px;
    cursor: pointer;
   }

.forma_snoska{
        padding-top: 5px;
    font-weight: 100;
    font-size: 12px;
    color: #e8e8e8;
}

.forma_snoska2{
        padding-top: 5px;
    font-weight: 200;
    font-size: 12px;
    color: #444444;
	
}

.zvonok-div input{
border: 1px solid silver;
background: rgba(232, 232, 232, 0.1);
border-radius: 5px;
width: 100%;
padding: 12px 25px;
font-family: "Montserrat", sans-serif;
font-size:12pt;
}

.zvonok-div{margin: 10px 0;}
.capch_items img{padding-top: 10px;}

.button2{
     border-radius: 5px;
     background: #f9cc55;
     padding: 8px 20px;
     font-size: 18px;
     font-weight: 400;
     text-decoration: none;
    cursor: pointer;
    transition: 1s;
    border: 1px;
    font-family: "Montserrat", sans-serif;

}

.button2:hover{
    border-radius: 5px;
    background: #F98655;
    transition: 1s;
    font-weight: 400;
    font-size: 18px;
    color: #000;
    padding: 8px 20px;
    text-decoration: none;
    cursor: pointer;
    border: 1px;
    font-family: "Montserrat", sans-serif;

}


.button2:active {
    position:relative;
    top:1px;
}

.zvonok_box2{font-family: "Montserrat", sans-serif;}
.field-error2{color: red; font-size: 10pt;}
.zvonok-div .error2{border: 1px solid red;}
.forma_zvonok_zag{font-weight: bold; font-size: 13pt;}
.adress{text-align: center;}

.input_items .error2{border: 1px solid red;}
.input_tel .error2{border: 1px solid red;}

input[type="checkbox"]:checked, 
input[type="checkbox"]:not(:checked), 
input[type="radio"]:checked, 
input[type="radio"]:not(:checked) 
{
    position: absolute;
    left: -9999px;
}

input[type="checkbox"]:checked + label, 
input[type="checkbox"]:not(:checked) + label, 
input[type="radio"]:checked + label, 
input[type="radio"]:not(:checked) + label {
    display: inline-block;
    position: relative;
    padding-left: 28px;
    line-height: 20px;
    cursor: pointer;
}

input[type="checkbox"]:checked + label:before, 
input[type="checkbox"]:not(:checked) + label:before,
input[type="radio"]:checked + label:before, 
input[type="radio"]:not(:checked) + label:before {
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    width: 18px;
    height: 18px;
    border: 1px solid #f9cc55;
    background: rgba(255, 255, 255, 0);
}

input[type="checkbox"]:checked + label:before, 
input[type="checkbox"]:not(:checked) + label:before {
    border-radius: 1px;
}

input[type="radio"]:checked + label:before, 
input[type="radio"]:not(:checked) + label:before {
    border-radius: 100%;
}

input[type="checkbox"]:checked + label:after, 
input[type="checkbox"]:not(:checked) + label:after, 
input[type="radio"]:checked + label:after, 
input[type="radio"]:not(:checked) + label:after {
    content: "";
    position: absolute;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

input[type="checkbox"]:checked + label:after, 
input[type="checkbox"]:not(:checked) + label:after {
    left: 3px;
    top: 4px;
    width: 10px;
    height: 5px;
    border-radius: 1px;
    border-left: 4px solid #f9cc55;
    border-bottom: 4px solid #f9cc55;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

input[type="radio"]:checked + label:after, 
input[type="radio"]:not(:checked) + label:after {
    left: 5px;
    top: 5px;
    width: 10px;
    height: 10px;
    border-radius: 100%;
    background-color: #f9cc55;
}

input[type="checkbox"]:not(:checked) + label:after, 
input[type="radio"]:not(:checked) + label:after {
    opacity: 0;
}

input[type="checkbox"]:checked + label:after, 
input[type="radio"]:checked + label:after {
    opacity: 1;
}

::-webkit-input-placeholder {  opacity:1;  font-size: 12pt;}
::-moz-placeholder {  opacity:1;  font-size: 12pt;}
:-ms-input-placeholder {  opacity:1;  font-size: 12pt;}
:-moz-placeholder {  opacity:1;  font-size: 12pt;}

.forma_chek_flex ::-webkit-input-placeholder { color:#fff; opacity:1;  font-size: 12pt;}
.forma_chek_flex ::-moz-placeholder { color:#fff; opacity:1;  font-size: 12pt;}
.forma_chek_flex :-ms-input-placeholder { color:#fff; opacity:1;  font-size: 12pt;}
.forma_chek_flex :-moz-placeholder { color:#fff; opacity:1;  font-size: 12pt;}

.zvonok-div .error2 ::-webkit-input-placeholder { color:#ff0000!important; opacity:1;  font-size: 12pt;}
.zvonok-div .error2::-moz-placeholder { color:#ff0000!important; opacity:1;  font-size: 12pt;}
.zvonok-div .error2:-ms-input-placeholder { color:#ff0000!important; opacity:1;  font-size: 12pt;}
.zvonok-div .error2 :-moz-placeholder { color:#ff0000!important; opacity:1;  font-size: 12pt;}

.input_tel .error2 ::-webkit-input-placeholder { color:#ff0000!important; opacity:1;  font-size: 12pt;}
.input_tel .error2::-moz-placeholder { color:#ff0000!important; opacity:1;  font-size: 12pt;}
.input_tel .error2:-ms-input-placeholder { color:#ff0000!important; opacity:1;  font-size: 12pt;}
.input_tel .error2 :-moz-placeholder { color:#ff0000!important; opacity:1;  font-size: 12pt;}


.zvonok-div ::-webkit-input-placeholder { color:#979393; opacity:1;  font-size: 12pt;}
.zvonok-div ::-moz-placeholder { color:#979393; opacity:1;  font-size: 12pt;}
.zvonok-div :-ms-input-placeholder { color:#979393; opacity:1;  font-size: 12pt;}
.zvonok-div :-moz-placeholder { color:#979393; opacity:1;  font-size: 12pt;}

::-webkit-input-placeholder { color:#fff; opacity:1;  font-size: 12pt;}
::-moz-placeholder { color:#fff; opacity:1;  font-size: 12pt;}
:-ms-input-placeholder { color:#fff; opacity:1;  font-size: 12pt;}
:-moz-placeholder { color:#fff; opacity:1;  font-size: 12pt;}


/* Убираем placeholder при нажатии */
  :focus::-webkit-input-placeholder {opacity:0;}/* webkit */
  :focus::-moz-placeholder          {opacity:0;}/* Firefox 19+ */
  :focus:-moz-placeholder           {opacity:0;}/* Firefox 18- */
  :focus:-ms-input-placeholder      {opacity:0;}/* IE */




@media screen and (max-width: 1220px) {

.rabot_flex{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    padding-top: 20px;
}

.rabot_items{
    flex-basis: 280px;
    margin: 15px 18px; 

}


}

@media screen and (max-width: 1024px) {
.header-menu-list ul a{margin: 15px 7px; line-height: 2;}

.top_menu_flex{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}


.shapka_flex{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

.logo_tops{flex-basis: 100%; text-align: center;}
.grow2{flex-grow: 1; text-align: right;}
.shapka_items{flex-grow: 1;}


.messedg_flex{
    display: flex;
    padding: 0 5px;
    justify-content: center;
    
}


.footer_flex{
    display: flex;
    justify-content: space-between;
    padding-top: 30px;
    flex-wrap: wrap;
}

.niz_logos{flex-basis: 50%;}
.menus_niz{flex-basis: 50%;}

.menu_footer{
    display: flex;
    justify-content: space-around;
}

.rabot_items img{width: 180px; height: auto; border-radius: 10px;}
.rabot_items{
    flex-basis: 180px;
    margin: 5px 8px; 

}


.cena_flex{
    display: flex;
    justify-content: space-around;
    padding-top: 20px;
    flex-wrap: wrap;
}




}



@media screen and (max-width: 900px) {

.forma_flex{
    display: flex;
    justify-content: center;
    padding-top: 40px;
    flex-wrap: wrap;
}

.forma_items{flex-basis: 100%; text-align: center;}

.forma_top{
    flex: none;
    width: 60%;
    margin-left: 0px;
    padding-top: 20px;
}


}



@media screen and (max-width: 768px) {
.telfons_top{flex-basis: 100%; text-align: center;}

.messedg_flex{
    display: flex;
    padding: 0 5px;
    justify-content: start;
    
}

.forma_top{
    flex: none;
    width: 99%;
    margin-left: 0px;
    padding-top: 20px;
}

.niz_logos{flex-basis: 100%; text-align: center; order:1;}
.menus_niz{flex-basis: 100%; padding-bottom: 20px; order:2;}
.tels_foot{flex-basis: 50%; order:3; text-align: center;}
.zvon_foot{flex-basis: 50%; order:4; text-align: center;}
.mess_foot{order:5; padding-top: 20px;}

.footer_flex{
    display: flex;
    justify-content: space-around;
    padding-top: 30px;
}

.slogan_niz{font-size: 14px;}

.kompany_flex{
    display: flex;
    justify-content: space-between;
    padding-top: 30px;
    flex-wrap: wrap;
}

.kompany_img img{
    border-radius: 10px;
    width: 100%;
    height: auto;
    margin-top: 10px;

}
.komp_otst{padding-right: 0px;}

#topNubex {display: none!important;}


}


@media screen and (max-width: 480px) {

.input_flex{
    display: flex;
    justify-content: space-between;
    padding-top: 20px;
    flex-wrap: wrap;
}

.input_items{flex-basis: 100%;}


.input_items input{
border: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(232, 232, 232, 0.1);
border-radius: 5px;
width: 100%;
padding: 12px 25px;
}

.padtopinp{margin-top: 20px;}

.forma_fon{
    border: 1px solid rgba(217, 217, 217, 0.3);
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.1);
    margin-top: 10px;    
    padding: 30px 20px;
}

.padtopinp{margin-left: 0px;}

.tels_foot{flex-basis: 100%; order:3; text-align: center;}
.zvon_foot{flex-basis: 100%; order:4; text-align: center;}
.otstup_foot{padding-top: 15px;}

.rabot_items img{width: 140px; height: auto; border-radius: 10px;}
.rabot_items{
    flex-basis: 140px;
    margin: 2px 4px; 

}




}


@media screen and (max-width: 400px) {
.messs{flex-basis: 100%; text-align: center;}

.messedg_flex{
    display: flex;
    padding: 0 5px;
    justify-content: center;
    
}

.grow2{text-align: center; padding: 15px 1px; order:4;}
.messedg_flex{padding: 5px;}
.logo_tops{order:1;}
.messs{order:2;}
.telfons_top{order:3;}
.otstup_knopk2 span{display: none;}
.otstup_knopk3 span{display: none;}

.forma_chek_flex{
    display: flex;
    justify-content: space-between;
    font-weight: 200;
    font-size: 15px;
    color: #fff;
}


.rabot_items img{width: 100%; height: auto; border-radius: 10px;}


.cena_items{flex-basis: 100%; margin: 25px 0; }

.cena_img img{
    border-radius: 10px;
    width: 100%;
    height: auto;
}




}


@media screen and (max-width: 350px) {
.rabot_items{
    flex-basis: 100%;
    margin: 5px 0px; 

}

.not_items{display: none;}


}




