@media (max-width: 1214px){

    :root {
        --wrap: calc(100% - 44px); 
    }
    .menu {padding: 200px 50px 50px 106px; }
    .menu_logo {top: 40px; left: 30px;  }
    .menu li ul {left: calc(300px + 106px); width: calc(100vw - 300px - 106px); padding: 200px calc(100vw - 300px - 106px - 300px) 0 32px;    }
    .menu li li img {width: 300px;  }

}
/* end 1214 */



@media (max-width: 1100px){
    .menu li li img {left: calc(100% + 10px); width: 250px;  }
    .events2 {gap: 100px; margin: -0px 0 0 0; }
    .event {width: calc(50% - 50px);  }
    .title_img img {max-width: 230px; }
}
/* end 1100 */



@media (max-width: 991px){

    h1, .h1 {font-size: 28px;  }
    h2, .h2 {font-size: 22px; letter-spacing: 0.01em; }
    h3, .h3 {font-size: 20px;  }
    h4, .h4 {font-size: 18px; }
    h5, .h5 {font-size: 16px; letter-spacing: 0.02em; }
    h6, .h6 {font-size: 16px; }

    .hero_desc span {font-size: 28px;  }

    /* .caption {font-size: 14px; line-height: 120%; font-weight: 700; letter-spacing: 0.02em;}
    .caption2 {font-size: 12px; line-height: 100%; font-weight: 600; letter-spacing: 0.02em; } */

    .menu li li img {display: none;  }

    .third {width: calc(50% - 32px / 2 - 10px);}

.features { width: 100%;}

.scales_l .intro .abs:first-child {margin-left: -160px;}
.scales_r .intro .abs:nth-child(3) {margin-left: 220px;}

.scales_c .intro .abs:first-child {margin-left: -210px;}
.scales_c .intro .abs:nth-child(2) {margin-left: -160px;}
.scales_c .intro .abs:nth-child(3) {margin-left: 120px;}
.scales_c .intro .abs:nth-child(4) {margin-left: 170px;}



.rooms {padding: 20px 0 0;  }
.rooms.fullwidth .item {width: calc(50% - 16px);}


.item_content {bottom: 15px;}


.title_img img {width: 170px; transform: translate(-50%, -50%); }

}
/* end 991 */



@media (max-width: 767px){


    body {font-size: 15px;  }


    section {padding: 50px 0;}




    .hero, 
    .footer {padding: 0 8px;}
    .hero_inner {height: auto;}
    section:not(.contained_title) .hero_desc {position: static; transform: none; width: 100%; text-align: center; padding: 40px 0 80px 0; }
    section:not(.contained_title) .hero_desc span {font-size: 28px; text-shadow: none; color: var(--black); margin: 0 0 24px 0;   }
    section:not(.contained_title) .hero_desc p {margin: 0 0 30px 0; display: block; }


    


    .page .hero_inner {height: calc(100vw - 16px); max-height: 450px;    }




    .booking {width: calc(100vw - 16px); margin: 0 auto;}
    .booking_wrap {flex-direction: column;}
    .booking .col {flex-basis: 100%; width: 100%; }






    .menu {padding: 130px 66px 30px 66px; }
    .menu_logo {width: 156px; top: 16px; left: 24px;    }
    .menu ul {z-index: 205; }

    .menu li ul {
        -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out;
        position: fixed; z-index: 300; top: 0; left: 100%; width: calc(100vw - 25px); height: 100vh; background: var(--gold400);
        padding: 130px 32px 0 32px; display: block !important; visibility: hidden;
    }
    .menu li.open ul {left: 25px; visibility: visible; }
    .hasSub.open li.back {display: block; }
    .menu li.hasSub > a:before, .menu li.hasSub > a:after {display: none; }
    .menu li.hasSub > a {display: inline-block;  border-radius: 16px; }
    .close_menu {z-index: 500; }

.header_inner {justify-content: flex-end;}

.langs {position: absolute; padding: 20px 68px 20px 20px; z-index: 10; top: -20px; left: -20px; }
.langs.open {background: white; width: 100vw; }
.close_langs {top: 20px; right: 20px;}

/*
    .langs {padding: 0;  }
    .langs.open {
        width: 100vw; background: white; border-radius: 0 0 16px 16px; padding: 100px 20px 20px 20px; position: fixed; left: 0; top: -5px; z-index: 250; 
        box-shadow: 4px 4px 24px rgba(0,0,0,0.2); display: block; text-align: center; 
    
    }
    .langs.open:before {
        content: ""; position: absolute; top: 50%; left: 50%; width: calc(100% - 8px); height: calc(100% - 8px); transform: translate(-50%, -50%);
        border-radius: 12px; pointer-events: none; border: 1px solid var(--gold400);
    }
    .langs.open span.lang_full {display: inline-block; }
    .langs.open span.lang_title {display: block; color: var(--brown2); font-weight: 700;  }
    .langs.open span.lang_code {display: none; }
    .close_langs {
        top: 25px;
        right: auto;
        left: 20px;
    }
    .langs.open ul,
    .langs.open ul li,
    .langs.open ul li ul {display: block;}
    .langs.open ul li a span {width: auto;  }
    .langs.open ul li ul {padding: 0; }
    .langs.open ul li a {width: 100%; justify-content: center; height: auto;  color: var(--brown2); }
    .langs.open li a {margin-bottom: 8px; padding: 8px; }
*/


    .third {width: calc(100% - 12px); max-width: 500px; }

    .reviews {
        overflow: visible;
        width: 100%; 
        margin: 0;
    }

.contacts {flex-direction: column; gap: 16px; }

.menu2 ul li {display: block; margin: 8px; }

.logos .wrap {flex-wrap: wrap; gap: 16px; }

.footer:before {width: 306px; top: -43px; background-size: 100% auto;}
.footer > img {top: -80px;}

.features,
.features.wrapped {flex-wrap: wrap; justify-content: center; gap: 24px 12px; }
/* .feature {width: 150px; } */







.intro,
.w640 {max-width: 100%; }

section.scales_l.scales_r {padding-top: 300px !important; }
/* section.scales_c:not(:has(.intro)) {padding-top: 100px !important; padding-bottom: 200px !important; } */
/* section.scales_c.about_wrap {padding-top: 0 !important; padding-bottom: 80px !important; } */

section.scales_l.scales_r .wrap,
section.scales_l.scales_r .intro,
section.scales_c .wrap,
section.scales_c .intro {position: static; }

.scales_l:before {top: calc(50% - 790px / 2); left: calc(50% - 790px / 2);  }
.scales_r:after  {display: none; }
.scales_c.top:before {top: -200px;  }

.scales_l .intro .abs:first-child {height: 330px; width: auto; left: auto; right: -70px; top: 0; transform: none; margin: 0 0 0 0;}
.scales_r .intro .abs:nth-child(2) {width: 96px; left: 50%; top: 70px; margin-left: 0px; transform: translateX(-100%);}
.scales_r .intro .abs:nth-child(3) {width: 164px; left: -30px; top: 150px; margin-left: 0px; }

.scales_c .intro .abs:first-child {width: 136px; transform: translateX(-100%); margin-left: -150px;    }
.scales_c .intro .abs:nth-child(2) {width: 300px; margin-left: -50px; bottom: -40px; }
.scales_c .intro .abs:nth-child(3) {margin-left: 50px; top: -30px; }
.scales_c .intro .abs:nth-child(4) {width: 200px; margin-left: 100px; bottom: 80px; }


section.hero:not(.contained_title)  .buttlike.white {color: white; background: var(--red); }
section.hero:not(.contained_title)  .buttlike.white:hover {color: white;  }
section.hero:not(.contained_title)  .buttlike.white:after { border: 1px solid var(--red);}
section.hero:not(.contained_title)  .buttlike.white:hover:after {background: var(--red);  }


section:not(.contained_title) h1 {color: var(--black); text-shadow: none; }
.page .hero_desc p {color: var(--black); text-shadow: none; }

.wrap.narrow:has(.video) {width: 100%;}
.wrap.narrow video {border-radius: 0;}



.staff .item {margin: 0 0 16px 0;}

/* .decoration {margin-bottom: 12px; } */



.carousel:has(.about) + .decoration {display: none; }

.about .item {
    padding-bottom: 90px; background-image: url(../img/i-decoration2.svg); background-position: bottom center; background-repeat: no-repeat;
}

.about .about_txt {visibility: visible; opacity: 1;}

.about .owl-theme {display: flex; flex-direction: column; gap: 64px; }

.about .item .about_img {
  width: 100%; padding: 8px; border: 1px solid var(--gold600); border-radius: 4px; background-color: white; margin: 0 0 60px 0; transform: rotate(3deg); 
}
.about .item:nth-child(odd) .about_img {transform: rotate(-3deg); }

#wrapwidth {width: var(--wrap); margin: 0 auto; }




/* killed accommodation carousels */
.accommodation .owl-theme {display: flex; flex-direction: column; gap: 40px; }
.accommodation .owl-theme .item img {width: 100%; }

.rooms .item,
.rooms.fullwidth .item {width: calc(100%);}


    body {padding-top: 141px; }
    .logo {top: -10px; width: 150px; }
    .header .buttlike {position: fixed; top: 100px; left: 50%; transform: translateX(-50%); }

    .header {
        background: white;
        height: 140px; box-shadow: 0px 4px 16px rgba(0,0,0,0.2);
    }

    .header:before,
    .header:after {
        background-image: url(../img/header_bg_mob_sticky.svg); width: 454px; height: 78px; background-position: bottom center; background-repeat: no-repeat; 
        top: auto; left: 50%; bottom: -78px; 
    }


.features.simple {gap: 24px 4px; }
.features.simple .feature {width: calc(50% - 2px); padding: 40px 0 0 0; text-align: center; justify-content: center; }
.features.simple .ficon {left: 50%; margin-left: -20px;  }


.intro .acc_data {gap: 4px; }
.intro .acc_data > div {
    min-width: calc(50% - 2px);
}




.restaurants .item {width: 100%; }

.item_content .buttons {opacity: 1; visibility: visible; max-height: 300px; }

.restaurants .item:last-child {width: 100vw; margin: 0 -22px; }

.restaurants .item:last-child img {border-radius: 0;  }




.events .intro picture {display: none; }

.events2 {flex-direction: column; gap: 64px; align-items: center; margin-top: 64px; }

.event {width: 100%; max-width: 415px;  }




/* alternativni header koji nema pozadinu na mobilnoj dok se ne scrolla */
.header.alt {box-shadow: none; background: transparent; }
.header.alt:before,
.header.alt:after {opacity: 0; -webkit-transition: all 0.1s ease-out; transition: all 0.1s ease-out; }
.scroll-up .header.alt,
.scroll-down .header.alt {box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.2); background: white; }
.scroll-up .header.alt:before,
.scroll-down .header.alt:before,
.scroll-up .header.alt:after,
.scroll-down .header.alt:after {opacity: 1;  }


.gmap_wrap {width: calc(100% + 30px); margin: 0 -15px;  }
.gmap {height: 400px;}

.title_img img {position: static; transform: none !important; width: 170px; margin-bottom: 20px; }





    .inp.half {width: 100%; }
    .features.simple.centered {flex-direction: column; }
    .features.simple.centered .feature {width: 100%; }
    .features.simple.centered .ficon {margin-left: 0;    }

    .rooms.popup_gallery {gap: 16px;  }
    .rooms.popup_gallery .item {width: calc(50% - 8px);  }

	.rooms.popup_gallery .item:nth-of-type(-n + 9) {display: none;}
	.rooms.popup_gallery .more-wrap:nth-of-type(3) {display: none;}
	.rooms.popup_gallery .item:nth-of-type(-n + 6) {display: block;}
	.rooms.popup_gallery .more-wrap:nth-of-type(2) {display: block;}
	
	.dm-height-260, .dm-height-460 { min-height: auto; }

}
/* end 767 */






@media (max-width: 600px){
    
    /* .header:after {background-image: none;}
    .scroll-up .header:before, 
    .scroll-down .header:before {background-position: center -100px; }
    .scroll-up .header:after, 
    .scroll-down .header:after {background: white; height: 110px; } */

    /* .logo {top: unset;}
    .logo img {max-width: unset; width: 150px; }
    img.logo_desktop {display: none; }
    img.logo_mobile {display: block; }

    .header:before {background-size: 3000px 150px;}
    .header:after {background-size: 3000px 309px;}
    .header:after {top: -36px; left: calc(50% + 2px);}
 */
}
/* end 600 */






@media (max-width: 470px){

    .rate .buttlike {padding: 0 15px; }

    .scales_c .intro .abs:first-child {margin-left: -75px;    }
    .scales_c .intro .abs:nth-child(2) {margin-left: -10px; bottom: -40px; }
    .scales_c .intro .abs:nth-child(3) {margin-left: -20px; top: -30px; }
    .scales_c .intro .abs:nth-child(4) {margin-left: 50px; bottom: 60px; }

    .rooms.popup_gallery .item {width: 100%;  }
	.rooms.popup_gallery .item:nth-of-type(-n + 6) {display: none;}
	.rooms.popup_gallery .more-wrap:nth-of-type(2) {display: none;}
	.rooms.popup_gallery .item:nth-of-type(-n + 3) {display: block;}
	.rooms.popup_gallery .more-wrap:nth-of-type(1) {display: block;}

    .events picture + img {max-width: 100%; }

}
/* end 600 */






@media (max-width: 370px){

.features.simple {gap: 24px 0; }
.features.simple .feature {width: 100%;  }

.intro .acc_data  {flex-wrap: wrap; gap: 8px; }
.intro .acc_data > div {min-width: 100%; }

.restaurants .buttlike {height: 38px;}

}


@media (min-width: 460px) and (max-height: 480px) {
  .header .buttlike {
    position: relative;
    top: auto;
    left: auto;
    transform: none;
  }
  .logo {
    width: 130px;
    left: 33%;  
    top: -10px;
  }
  .header::before, .header::after {
  	display:none;
  }
  .header {
  	height: 88px;   
    background: white;
  }
  body {
    padding-top: 95px;
  }
}
@media (min-width: 680px) and (max-height: 480px) {
  .logo {  
    left: 50%;  
  }
}
@media (min-width: 680px) and (max-height: 480px) {
  .logo {  
    left: 50%;  
  }
}
@media (min-width: 768px) and (max-height: 480px) {
	 .booking {
	    margin: 25px auto 0 auto;
	  }
}


/* end 600 */