.header{
    background: url("/img/new/header.jpg") no-repeat;
    background-position:top center;
    margin:0px;
    min-height:500px;
}

a {
    text-decoration: none;
}
.nav-link{
    margin-right: 8px;
}

@media only screen and
(max-width : 1280px) {
    .header{
        background: url("/img/new/1280/header.jpg") no-repeat;
    }
}

@media only screen and
(max-width : 800px) {
    .header{
        background: url("/img/new/800/header.jpg") no-repeat;
    }
    .price_table{
        font-size: 0.8rem;
    }
}


@media only screen and
(max-width : 640px) {
    .header{
        background: url("/img/new/640/header.jpg") no-repeat;
    }
    .price_table{
        font-size: 0.7rem;
    }
}

@media only screen and
(max-width : 320px) {
    .header {
        background: url("/img/new/320/header.jpg")  no-repeat;
    }
}



.header p{
    font-size:14px;
    margin: 20px 0px;
}

img{
    max-width:100%;
}

@font-face {
    font-family: HeaderFont;
    src: url(fonts/9404.ttf);
}

@font-face {
    font-family: HeaderFont-2;
    src: url(fonts/10395.ttf);
}

.main-title{
    text-transform: uppercase;
    color:#000;
    font-weight: bold;
    font-size:20px;
    letter-spacing: 2px;
    font-family: HeaderFont;
}


.sub-title{
    color:green;
    text-transform: uppercase;
    color:#06971e;
    font-weight: 900;
    font-size:52px;
    letter-spacing: 5px;
    font-family: HeaderFont-2;
}

.main-hr{
    margin:5px 0px;
    border: 1px solid #333;
}

.treatment-div{
    background: url("/img/new/bg_2.jpg");
    min-height:400px;
    margin-top: 20px;
    color:#fff;
    font-size:16px;
    padding: 20px;
}

@media only screen and
(max-width : 640px) {
    .treatment-div{
        background: green;
    }
}

.footer{
    background: url("/img/new/footer.jpg") no-repeat;
    background-position: center -80px;
    height: 495px;
    color: #ccc;
    margin-top:40px;
    padding-bottom:60px;
}

@media only screen and
(max-width : 1280px) {
    .footer{
        background: url("/img/new/1280/footer.jpg") no-repeat;
    }
}

@media only screen and
(max-width : 800px) {
    .footer{
        background: url("/img/new/800/footer.jpg") no-repeat;
    }
}


@media only screen and
(max-width : 640px) {
    .footer{
        background: url("/img/new/640/footer.jpg") no-repeat;
    }
}

@media only screen and
(max-width : 320px) {
    .footer{
        background: url("/img/new/320/footer.jpg") no-repeat;
    }
}

.btn-booking{
    background: orange;
    height:50px;
    font-size:24px;
    padding:10px 30px;
    border-top:none;
    color:#333;
    border-radius: 10px;
}

.btn-more{
    background: #fff;
    height:48px;
    font-size:24px;
    padding:10px 30px;
    border:2px solid green;
    color:#000;
    border-radius: 10px;
}

.btn-booking:hover{
    color:#fff;
}

.header-price{
    font-size:22px;
}

.header-price strong{
    color:red;
    font-size:26px;
    margin:5px;
}


.phone-div{
    background: #fff;
    padding:10px;
    border-radius: 10px;
    border: 1px solid #ccc;
    margin:15px auto;
    max-width: 300px;
    box-shadow: 0 5px 3px -3px gray;
}
.main-phone {
    list-style: none;
    padding:5px;
    margin:0px;
}

.main-phone span{
    color:#aaa;
}

.main-phone li{
    display: inline;
    margin: 0px 5px;
}

.main-phone a{
    font-size:22px;
    color:#337ab7;
    font-weight:bold;
    text-decoration: none;
    font-size: 2em;
}

.main-phone a:hover{
    color:orangered;
}

.main-list{
    list-style: none;
}

.main-list li{
    float:left;
}

.icon{
    width: 48px;
    height: 48px;
    fill: #ffba02;
    margin:10px 20px;
    float:left;
}

.icon:hover{
    fill: #ffaf02;
}

.treatment-list p{
    padding:20px 10px;
}

.treatment-list img {
    width: 100%;
    height: auto;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-transition: -webkit-transform .3s ease-in-out;
    transition: -webkit-transform .3s ease-in-out;
    -o-transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out;
}

.treatment-list img:hover {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
}

.sevice-icon{
    width: 48px;
    height: 48px;
    fill: #06971e;
    margin:10px 20px;
    float:left;
}

.sevice-icon:hover{
    fill: green;
}

.sevice-list{
    list-style:none;
    vertical-align: middle;
}

.sevice-list li{
    float:left;
    min-height: 100px;
}

.svc-icon{
    float:left;
    margin:10px 30px;
    height:50px;
}

.footer-menu ul{
    list-style: none;
    padding: 5px;
}

.footer-menu li{
    padding: 2px;
    font-size:18px;
}


.footer-menu a{
   color:#000;
}

.footer-menu{
    background: #fff;
    padding:5px;
    border-radius: 10px;
    border: 1px solid #ccc;
    margin:15px auto;
    max-width: 260px;
    box-shadow: 0 5px 3px -3px gray;
}

.footer-menu a:hover{
   color:orangered;
   text-decoration: none;
}

.footer-menu-phone{
   margin-top:10px;
}

.footer-menu-phone a{
    font-size:24px;
    font-weight: bold;
    color: #337ab7;
}

.booking-field{
    height:50px;
    border-radius: 10px;
    border:2px solid #ccc;
    margin:15px 20px 15px 0px;
    color:#000;
    width:250px;
    padding:5px;
}

.date-field{
    padding:5px 5px 5px 50px;
    background: #fff url("/img/new/calendar.jpg") no-repeat;
}

.t-list{
    list-style: none;
    margin:0;
    padding:0;
    font-size:22px;
}

.t-list li{
    margin:10px 0px;
}

.gallery-hr{
    width:60%;
    border:1px solid green;
}

.news-flex {
    display: flex;
    flex-flow: row wrap;
}


.row-flex {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
}

.answer-div{
    background: #eee;
    margin-top:0px;
    padding-top: 50px;
}

.answer-item{
    border: 2px solid green;
    border-radius: 5px;
    min-height: 250px;
    margin: 20px;
    background: #eee;
}



.answer-item p{
    text-align: left;
}


.answer-item h3 {
    font-size: 18px;
    margin-top: 40px;
    font-weight: bold;
}

.answer-number {
    width: 50px;
    height: 50px;
    text-align: center;
    vertical-align: middle;
    margin: -25px auto;
}

.answer-number span {
    z-index: 10000;
    color: #fff;
    font-size: 24px;
    font-weight: bold;
    position: absolute;
    margin-top: 8px;
    margin-left: -5px;
}

.romb {
    z-index: 1;
    width: 50px;
    height: 50px;
    background: green;
    transform: rotate(45deg);
    position: absolute;
    margin: 0px auto;
    border-radius: 3px;
}

.boxShadow {
    box-shadow: 0 15px 7px -7px #eee;
    margin-top: 30px;
    margin-bottom: 30px;
}

.about{
    border:2px solid #ccc;
    border-radius: 5px;
    margin:10px 0px;
}

.about p{
    font-size:16px;
    vertical-align: middle;
    padding: 20px;
}

.room-info{
    margin-bottom: 30px;
}

.room-desc{
    list-style: none;
    font-size:18px;
    padding-left:0px;
}

.room-desc li{
    margin-top:10px;
}


.price{
    font-size:22px;
    color: #4cae4c;
}

.contacts{
    list-style: none;
    margin:0px;
    padding:0px;
    font-size:18px;
}

.contacts li{
    margin:10px 0px;
}

.treatment-list img {
    width: 100%;
    height: auto;
    -o-object-fit: cover;
       object-fit: cover;
    -webkit-transition: -webkit-transform .3s ease-in-out;
    transition: -webkit-transform .3s ease-in-out;
    -o-transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out; }
.treatment-list img:hover {
    -webkit-transform: scale(1.1);
        -ms-transform: scale(1.1);
            transform: scale(1.1); }

.glyphicon-ok{
    color: #4cae4c;
}

.language-list{
    position: absolute;
    z-index: 1000;
    top:0px;
    right: 20px;
    width: 180px;
    text-align: right;
}

.languages-klisl a{
    margin:5px;
}

.room-bts a {
    margin: 5px;
}

.navbar-dark{
    background-color:green !important;
    border-radius: 30px;
}

.navbar-dark a{
    color:#ffffff;
}
.navbar-dark a:hover{
    color:orange;
}

.main_menu{
    margin:3px 20px;
}

.main-btn{
    background-color: gold;
    color:#212529;
    height: 50px;
    line-height: 30px;
    border-radius:100px;
    box-shadow: 0 10px 5px -5px #555;
    font-family: 'Roboto',Arial,sans-serif;
    font-size: 16px;
    text-align: center;
    white-space: nowrap;
    font-weight: 700;
    cursor: pointer;
}

.main-btn:hover{
    color: #555;
    box-shadow: 0 10px 5px -5px #888;
    background: gold;
}

.autoink{
    position: relative;
    overflow: hidden;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}

.ink{
    display: block;
    position: absolute;
    background: rgba(255, 255, 255, 1.0);
    border-radius: 100%;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    z-index: 20;
}

.animate {
    webkit-animation: ripple 4s linear infinite;
    -moz-animation: ripple 4s linear infinite;
    -ms-animation: ripple 4s linear infinite;
    -o-animation: ripple 4s linear infinite;
    animation: ripple 4s linear infinite;
}
@keyframes ripple {
    20% {
        opacity: 0;
        transform: scale(2.5);
    }
    100% {
        opacity: 0;
        transform: scale(2.5);
    }
}


.news-item{
    padding: 0;
    background: #FFFFFF;
    box-shadow: 0px 4px 25px rgba(0, 0, 0, 0.25);
    border-radius: 18px;
    margin-bottom:20px;
    font-size: 16px;
}

.news-item img{
    width:100%;
    border-radius: 18px 18px 0px 0px;
}

.news-item__text{
    padding: 10px;
}

.news-item__title{
   font-size:18px;
}

#button-up{
    display: none;
    opacity:0.5;
    filter:alpha(opacity=50);
    position: fixed;
    left: 20px;
    bottom: 100px;
    color: #000;
    background: #fff;
    transition: .3s;
    z-index: 1000;
    border:1px #ccc;
    border-radius: 100px;
}

#button-up:hover{
    cursor: pointer;
    opacity: 1;
    filter:alpha(opacity=100);
    transition: .3s;
    color: #FF0000;
}

.fixed-phone{
    position: fixed;
    background:#fff;
    top: 0px;
    width:240px;
    right:0px;
    margin:0;
    padding: 0;
    z-index:1010;
    border-radius:18px;
    padding: 10px 0px;
    border: 1px solid #eee;
    box-shadow: 0 15px 7px -7px gray;
}


/*кнопка звонка*/
.callback-bt img{
    margin:14px;
    width:40px;
    height:40px;
}

.callback-bt {
    background:#59d600;
    border:2px solid #77d600;
    border-radius:50%;
    box-shadow:0 8px 10px rgba(165, 255, 102, 0.3);
    cursor:pointer;
    height:68px;
    text-align:center;
    width:68px;
    position: fixed;
    right: 20px;
    bottom: 100px;

    z-index:999;
    transition:.3s;
    -webkit-animation:hoverWave linear 1s infinite;
    animation:hoverWave linear 1s infinite;
}

.callback-bt .text-call{
    height:68px;
    width:68px;
    border-radius:50%;
    position:relative;
    overflow:hidden;
}

.callback-bt .text-call span {
    text-align: center;
    color:white;
    opacity: 0;
    font-size: 0;
    position:absolute;
    right: 4px;
    top: 22px;
    line-height: 14px;
    font-weight: 600;
    text-transform: uppercase;
    transition: opacity .3s linear;
    font-family: 'montserrat', Arial, Helvetica, sans-serif;
}

.callback-bt .text-call:hover span {
    opacity: 1;
    font-size: 9px;
}
.callback-bt:hover img {
    display:none;
}

.callback-bt:hover {
    z-index:1;
    background:#59d600;
    color:transparent;
    transition:.3s;
}
.callback-bt:hover img {
    color:#59d600;
    font-size:40px;
    transition:.3s;
}
.callback-bt img {
    color:#fff;
    font-size:34px;
    transition:.3s;
    line-height: 66px;transition: .5s ease-in-out;
}

.callback-bt img  {
    animation: 1200ms ease 0s normal none 1 running shake;
    animation-iteration-count: 2, 0, infinite;
    -webkit-animation: 1200ms ease 0s normal none 1 running shake;
    -webkit-animation-iteration-count: 2, 0, infinite;
}

@-webkit-keyframes hoverWave {
    0% {
        box-shadow:0 8px 10px rgba(165, 255, 102, 0.3),0 0 0 0 rgba(175, 255, 102, 0.2),0 0 0 0 rgba(165, 255, 102, 0.2)
    }
    40% {
        box-shadow:0 8px 10px rgba(165, 245, 102, 0.3),0 0 0 15px rgba(165, 235, 102, 0.2),0 0 0 0 rgba(165, 245, 102, 0.2)
    }
    80% {
        box-shadow:0 8px 10px rgba(165, 245, 102, 0.3),0 0 0 30px rgba(56,163,253,0),0 0 0 26.7px rgba(165, 245, 102,0.067)
    }
    100% {
        box-shadow:0 8px 10px rgba(165, 245, 102, 0.3),0 0 0 30px rgba(56,163,253,0),0 0 0 40px rgba(56,163,253,0.0)
    }
}@keyframes hoverWave {
     0% {
         box-shadow:0 8px 10px rgba(165, 245, 102, 0.3),0 0 0 0 rgba(165, 235, 102, 0.2),0 0 0 0 rgba(195, 235, 102, 0.2)
     }
     40% {
         box-shadow:0 8px 10px rgba(165, 245, 102, 0.3),0 0 0 15px rgba(165, 245, 102, 0.2),0 0 0 0 rgba(165, 245, 102,0.2)
     }
     80% {
         box-shadow:0 8px 10px rgba(165, 245, 102, 0.3),0 0 0 30px rgba(56,163,253,0),0 0 0 26.7px rgba(165, 245, 102,0.067)
     }
     100% {
         box-shadow:0 8px 10px rgba(165, 245, 102, 0.3),0 0 0 30px rgba(56,163,253,0),0 0 0 40px rgba(56,163,253,0.0)
     }
 }

/* animations icon */

@keyframes shake {
    0% {
        transform: rotateZ(0deg);
        -ms-transform: rotateZ(0deg);
        -webkit-transform: rotateZ(0deg);
    }
    10% {
        transform: rotateZ(-30deg);
        -ms-transform: rotateZ(-30deg);
        -webkit-transform: rotateZ(-30deg);
    }
    20% {
        transform: rotateZ(15deg);
        -ms-transform: rotateZ(15deg);
        -webkit-transform: rotateZ(15deg);
    }
    30% {
        transform: rotateZ(-10deg);
        -ms-transform: rotateZ(-10deg);
        -webkit-transform: rotateZ(-10deg);
    }
    40% {
        transform: rotateZ(7.5deg);
        -ms-transform: rotateZ(7.5deg);
        -webkit-transform: rotateZ(7.5deg);
    }
    50% {
        transform: rotateZ(-6deg);
        -ms-transform: rotateZ(-6deg);
        -webkit-transform: rotateZ(-6deg);
    }
    60% {
        transform: rotateZ(5deg);
        -ms-transform: rotateZ(5deg);
        -webkit-transform: rotateZ(5deg);
    }
    70% {
        transform: rotateZ(-4.28571deg);
        -ms-transform: rotateZ(-4.28571deg);
        -webkit-transform: rotateZ(-4.28571deg);
    }
    80% {
        transform: rotateZ(3.75deg);
        -ms-transform: rotateZ(3.75deg);
        -webkit-transform: rotateZ(3.75deg);
    }
    90% {
        transform: rotateZ(-3.33333deg);
        -ms-transform: rotateZ(-3.33333deg);
        -webkit-transform: rotateZ(-3.33333deg);
    }
    100% {
        transform: rotateZ(0deg);
        -ms-transform: rotateZ(0deg);
        -webkit-transform: rotateZ(0deg);
    }
}

@-webkit-keyframes shake {
    0% {
        transform: rotateZ(0deg);
        -ms-transform: rotateZ(0deg);
        -webkit-transform: rotateZ(0deg);
    }
    10% {
        transform: rotateZ(-30deg);
        -ms-transform: rotateZ(-30deg);
        -webkit-transform: rotateZ(-30deg);
    }
    20% {
        transform: rotateZ(15deg);
        -ms-transform: rotateZ(15deg);
        -webkit-transform: rotateZ(15deg);
    }
    30% {
        transform: rotateZ(-10deg);
        -ms-transform: rotateZ(-10deg);
        -webkit-transform: rotateZ(-10deg);
    }
    40% {
        transform: rotateZ(7.5deg);
        -ms-transform: rotateZ(7.5deg);
        -webkit-transform: rotateZ(7.5deg);
    }
    50% {
        transform: rotateZ(-6deg);
        -ms-transform: rotateZ(-6deg);
        -webkit-transform: rotateZ(-6deg);
    }
    60% {
        transform: rotateZ(5deg);
        -ms-transform: rotateZ(5deg);
        -webkit-transform: rotateZ(5deg);
    }
    70% {
        transform: rotateZ(-4.28571deg);
        -ms-transform: rotateZ(-4.28571deg);
        -webkit-transform: rotateZ(-4.28571deg);
    }
    80% {
        transform: rotateZ(3.75deg);
        -ms-transform: rotateZ(3.75deg);
        -webkit-transform: rotateZ(3.75deg);
    }
    90% {
        transform: rotateZ(-3.33333deg);
        -ms-transform: rotateZ(-3.33333deg);
        -webkit-transform: rotateZ(-3.33333deg);
    }
    100% {
        transform: rotateZ(0deg);
        -ms-transform: rotateZ(0deg);
        -webkit-transform: rotateZ(0deg);
    }
}
/* конец кнопки звонка */