html  {  font-size: 100.1%;font-family: Arial, Tahoma, Verdana;
   color: #000;  background : url(../i/bgfon.jpg);
   margin: 0px; padding: 0px;
   text-align: center;

}
body {  font-size: 62.5%;font-family: Arial, Tahoma, Verdana;
   color: #fff;  background : url(../i/bgfon.jpg);
   margin: 0px; padding: 0px;
   text-align: center;

}
body, input, form, img, h1, h2, h3, h4, h5, h6, ul, ol, li, td, p, fieldset, dt, dd, dl{margin:0; padding:0}
img{  border:0px ;}
table{  border:0px; /* border="0" */   border-collapse:collapse; /* cellspacing="0" */ text-align:left;}
table td{  padding:0px; /* cellspadding="0" */   vertical-align: top; }


.top{vertical-align:top;}


a{  text-decoration: none;  color:#fed035;}
a:hover{ color: #f8de85;}


.sait{text-decoration: underline; color:#fff;}

.bord{border-bottom: 2px solid #49512b;}
.bord2{border-top: 1px solid #f3c835;}

.tab100 {width:100%;}
.tab100h{height:100%;}
.tab5{width:2%;}

/*öâåòà*/
.white{color:#fff;}
.yellow{color:#fff1bf;}
.yel_akt{color: #f8de85;}
.yel_menu{color: #fed035;}

/*ðàçìåð øðèôòîâ*/
.font11{font-size:1.1em;}
.font14{font-size:1.4em;}
.font18{font-size:1.8em;}
.font24{font-size:2.4em;}

/*ïýääèíãè*/
.padlogo{padding:30px 0 0 60px;}
.padnazv{padding:50px 0 0 30px;}
.padtel1{padding:30px 15px 0 0;}
.padtel{padding:20px 0 13px 18px;}
.padtel2{padding: 0 15px 0 0;}
.padkriv1{padding:0 0 14px 10px;}
.padkriv2{padding:0 10px 14px 0;}
.padmenu{padding-top: 18px;}
.padfoto{padding: 23px 0 0 18px;}
.padsauna{padding-top:16px;}
.padkafe{padding-top:20px;}
.pad_onas{padding: 19px 10px 0 19px;}
.padline2{padding:4px 11px 0 0;}
.padline1{padding:4px 0 0 0;}
.padugol{padding: 0 0 0 13px;}
.paduzor{padding: 0 58px 0 0;}
.padcopy{padding: 5px 0 0 0;}
.padpauk{padding: 0 185px 0 0;}
.padsait{padding: 5px 0 0 0;}
.padniz{padding: 10px 0 10px 0;}
.padsvet{padding-top:20px;}

/*áýêãðàóíäû*/
/*.bgfon{background:url(../i/bgfon.jpg);}*/
.bglogo1{background:url(../i/bglogo1.png) no-repeat; behavior: url(css/iepngfix.htc); width:320px; height:180px;}
.bgnazv{background:url(../i/bgnazv_new.png) no-repeat; behavior: url(css/iepngfix.htc); width:421px; height:176px;}
.bgfoto{background:url(../i/podfoto.png) no-repeat; behavior: url(css/iepngfix.htc); width:534px; height:382px; }
.bgline{ background:url(../i/yel1.gif) repeat-x; background-position: 0 30px;}
.bgline1{ background:url(../i/yel2.gif) repeat-y; background-position: 28px 0;}
.bgline2{ background:url(../i/yel1.gif) repeat-y; background-position: 18px 0;}
.bgline3{ background:url(../i/yel1.gif) repeat-x; background-position: 0 42px;}
.menuakt{background:url(../i/svet1.png) no-repeat; behavior: url(css/iepngfix.htc); width:182px; height:58px; color: #f8de85; }
/*.bgniz{background:url(../i/bgniz.png) repeat-x; behavior: url(css/iepngfix.htc);}*/

.bgpauk{ background:url(../i/pauk.png) no-repeat left; behavior: url(css/iepngfix.htc);}
/*äëÿ ïíã â îñëèêå*/
img.imgpng
{  background-image: expression(
        this.runtimeStyle.backgroundImage = "none",
        this.runtimeStyle.filter =
            "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" +
            this.src + "', sizingMethod='image')",
        this.src = "i/0.gif"
    )
}

img.imgpng2
{ behavior: url(css/iepngfix.htc) }

.float{float:left;}
.hei{vertical-align:middle; height: 100px;}
.hei2{height:100px;}

.left{text-align: left;}
.right{text-align: right;}
.center{text-align: center;}
.text{font-size:1.4em; color:#fff;}
.zagolovok{font-size:1.8em; color: #f8de85;}

a.svet{background: url(../i/menu_akt.gif) no-repeat; width:113px; height:43px;}

.op a{opacity: 0; float: right; }

.cena{margin: 20px 0;}
.cena tr{border-bottom: 1px white solid}
.cena th, .cena td:nth-child(3){vertical-align: middle; font-size:16px;}
.cena td, .cena th{padding:8px}
.cena td:nth-child(2){font-size:13px;}

 #map {
     border-radius: 10px;
     overflow: hidden;
 }
 .main-container{
     margin:0 auto;
     max-width:1000px;
     width: 100%;
 }

 .header{
     display: flex;
     justify-content: space-between;
     gap: 10px;
 }
 .phone-block a{
     color: #fff1bf;
 }
 .phone-block{
     display: flex;
     justify-content: center;
     align-items: center;
     flex-direction: column;
 }
 .menu nav a{
     text-decoration: none;
     color: #fed035;
     font-size: 1.8em;
     transition: all ease-in-out 0.3s;
 }
.menu nav a:hover{
    color:  #fff1bf;
}

.menu nav{
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
}
 .menu{
     border-top: 2px solid #49512b;
     padding: 15px;
     display: flex;
     justify-content: space-between;
     align-items: center;
 }
.imgpng.flip{
    -moz-transform: scale(-1, 1);
    -o-transform: scale(-1, 1);
    -webkit-transform: scale(-1, 1);
    transform: scale(-1, 1);
}

.head-images{
    display: grid;
    grid-template-columns: 1fr 1fr;
    justify-items: end;
    gap: 15px;
}

.head-images .big{
    grid-column: span 1;
    grid-row: span 2;
}

.section{
    position: relative;
    padding: 20px 30px;
    border: 1px solid;
    color: #fed035;
    margin-top: 50px;
    margin-bottom: 50px;
    border-radius: 20px;
    text-align: left;
    font-size: 1.3em;

}

.section:before{
    background: url(/i/kriv3a.png);
    position: absolute;
    left: -30px;
    top: -25px;
    content: ' ';
    width: 79px;
    height: 97px;
}


.section:after{
    background: url(/i/kriv3a.png);
    position: absolute;
    right: -30px;
    bottom: -25px;
    content: ' ';
    width: 79px;
    height: 97px;
    -moz-transform: scale(-1, -1);
    -o-transform: scale(-1, -1);
    -webkit-transform: scale(-1, -1);
    transform: scale(-1, -1);
}

.footer{
    display: flex;
    justify-content: space-between;
    text-align: left;
    padding: 15px;
}

.footer div:last-child{
    text-align: right;
}
img.right{
    float: right;
    margin-bottom: 10px;
    margin-left: 10px;
    border-radius: 10px;
    box-shadow: 1px 1px 6px #fff1bfaa;
    border: 1px solid #021f2f;
}

h1,h2,h3{ color:  #fff1bf;}
h1{
    padding-top: 10px;
    padding-bottom: 30px;
    text-align: center;
}

h2,h3{ padding: 15px 0;}
h4{ color: #fed035; padding: 10px 0;}
.price{
    text-align: right;
    color: #fed035;
    font-weight: bold;
}

ul li{
    padding-bottom: 10px;
    color: #ffcc00;
}

ul.color-white li{
    color: #fff;
}
ul{
    padding: 20px;
    list-style: circle;
}
.zag{    color: #f8de85;padding: 10px 0;}

.gallery img{
    border-radius: 10px;
    box-shadow: 1px 1px 6px #fff1bfaa;
    border: 1px solid #021f2f;
    transition: all ease-in-out 0.3s;
}
.gallery img:hover{
    box-shadow: 1px 1px 6px #fff1bf00;
    border: 1px solid #021f2f00;

}
.gallery{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 15px;
    justify-items: center;
    align-items: center;
}

.menu nav.mobile_menu{
    justify-content: center !important;

    position: fixed;
    width: 100%;
    top: 0;
    padding: 20px 0;
    background: #032031;
    margin: 0;
    left: 0;
    font-weight: bold;
    gap: 15px 30px;
    box-shadow: 1px 4px 6px #fed03590;
    z-index: 11;
    border-bottom: 2px solid #fed035bb;
}


@media screen and (max-width: 1000px){
    .main-container{overflow: hidden;
        padding: 0 3px;
        width: calc(100% - 6px);
    }
    .head-images{padding: 0 20px}
    .header img:first-child{display: none}
}

@media screen and (max-width: 860px){
    .gallery img{
        width: auto;
        max-width: 100%;
        height: auto;
    }
    .menu nav{
        flex-wrap: wrap;
        justify-content: center;
    }

    .head-images .big {
        width: 100%;
        grid-column: span 2;
        grid-row: span 2;
    }
    .head-images{
        justify-items: center;
    }
}

@media screen and (max-width: 860px){
    .header div:last-child{display: none}
    .header{justify-content: center}
    .header img:nth-child(2){    margin-left: 55px;}
}


@media screen and (max-width: 650px){
    .head-images img:nth-child(2),
    .head-images img:nth-child(3){display: none}
    .gallery {
        grid-template-columns: 1fr 1fr;
    }
}

@media screen and (max-width: 480px){
    .gallery {
        grid-template-columns: 1fr ;
    }
    img.right {
    float: unset;
    margin: 0;
    width: 100%;
    height: auto;
    margin-bottom: 20px;
}
}