/*
 Theme Name:   Collections of Waikiki
 Theme URI:    https://collectionsofwaikiki.com
 Description:  Collections of Waikiki theme
 Author:       Collections of Waikiki
 Author URI:   https://collectionsofwaikiki.com
 Template:     generatepress
 Version:      0.1
*/

@font-face {
    font-family: "Outfit";
    src: url("/wp-content/themes/collectionsofwaikiki/fonts/Outfit-var.woff2") format("woff2 supports variations"),
         url("/wp-content/themes/collectionsofwaikiki/fonts/Outfit-var.woff2") format("woff2-variations");
    font-weight: 100 1000;
    font-display: swap;
  }
@font-face {
    font-family: "Source Serif";
    src: url("/wp-content/themes/collectionsofwaikiki/fonts/Outfit-var.woff2") format("woff2 supports variations"),
         url("/wp-content/themes/collectionsofwaikiki/fonts/SourceSerif4Variable-Roman.ttf.woff2") format("woff2-variations");
    font-weight: 100 1000;
    font-display: swap;
  }

:root {
    --font-fallback: "San Fransisco", "Helvetica", "Inter", BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", sans-serif;
    --font-fallbackSerif: "Georgia", "Times", "Times New Roman", "Garamond", "San Fransisco", "Helvetica", "Inter", BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", sans-serif;
    font-family: "Outfit", var(--font-fallback);
    --green:#13342A;
    --darkGreen:#122717;
    --green20:#647367;
    --green60:#717D74;
    --gold:#AB8E66;
    --gold60:#C5A77C;
    --darkGold:#8A7252;
    --gold20:#EEE8E0;
    --textBlack:#1a1a1a;
    --white:#fff;
    --beige:#F6F1EF;
    --grey:#717D74;
    color:var(--stone);
  }
html,body{
    overflow-x:clip;
}
body, button, input, select, textarea, #sb_instagram #sbi_load .sbi_load_btn, #sb_instagram .sbi_follow_btn a, input[type="submit"]{
    /* Body/Body (M) */
    font-family: "Outfit", var(--font-fallback);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    color: var(--textBlack, #1a1a1a);
    font-feature-settings: 'clig' off, 'liga' off;
}
hr, hr.wp-block-separator{
    background-color:var(--gold20,#EEE8E0);
    border-color:var(--gold20,#EEE8E0);
}
  
h1, h2, h3, h4, h5, h6 {
    font-family: "Source Serif", var(--font-fallbackSerif);
    font-weight: 500;
    font-style:normal;
    color:var(--darkGreen,#122717);
  }
.bold, h1.bold, h2.bold, h3.bold, h4.bold, h5.bold, h6.bold{
    font-weight:600;
}
.sans{
    font-family: "Outfit", var(--font-fallback);
    font-feature-settings: 'clig' off, 'liga' off;
}
p{
    margin-bottom:1rem;
}
.text-l{
    font-size:20px;
    line-height:24px;
}
.white{
    color:var(--white,#fff);
}
.gold{
    color:var(--gold,#AB8E66)
}
.gold-60{
    color:var(--gold60,#C5A77C);
}
section{
    position: relative;
}
.xl{
    font-size: 48px;
    line-height: 1.35em;
}
.white{
    color:var(--white,#fff);
}
/* buttons */
a:not(.button):hover h3, a:not(.button):hover h4, a:not(.button):hover h5, a:not(.button):hover h6{
    text-decoration: underline;
}

.button, button, input[type="submit"], #sb_instagram #sbi_load .sbi_load_btn, #sb_instagram .sbi_follow_btn a{
    color:var(--white,#fff);
    position: relative;
    background:var(--darkGreen, #122717);
    font-size:20px;
    line-height:24px;
    font-weight:600;
    padding:12px 24px;
    border:none;
    border-bottom:4px solid var(--gold,#AB8E66);
    border-radius: 2px;
    align-items: center;
    display: inline-flex;
    gap: 8px;
    transition:all .2s ease-in-out;
}
.button.icon-right, button.icon-right{
    padding-right:20px;
}
.button.icon-left, button.icon-left, #sb_instagram #sbi_load .sbi_load_btn, #sb_instagram .sbi_follow_btn a{
    padding-left:20px;
}
.button.white, button.white{
    color:var(--green, #13342A);
    background:var(--white,#fff);
}

.button.tertiary, button.tertiary{
    padding:12px 16px;
    border:none;
    border-radius:2px;
}
.button.white:hover, button.white:hover{
    background:var(--gold20,#EEE8E0);
    color:var(--green, #13342A);
}
.button.flower:before, button.flower:before, #sb_instagram #sbi_load .sbi_load_btn, #sb_instagram .sbi_follow_btn a:before{
    content:"";
    background:url('/wp-content/uploads/2024/04/logomark.svg');
    width:40px;
    height:40px;
    position: absolute;
    top:-20px;
    left:-20px;
    transition:none;
}
.button.flower.flower-right:before,
button.flower.flower-right:before{
    left:initial;
    right:-20px;
}
.button.flower:hover:before, button.flower:hover:before,  #sb_instagram #sbi_load .sbi_load_btn, #sb_instagram .sbi_follow_btn a:hover:before{
    transform:rotate(480deg);
    transition: all 3s ease-out;
}

.button.beige{
    background:var(--beige, #F1EDE7);
    color:var(--green,#13342A);
}
.button.beige:hover, .button.beige:focus, .button.beige:active{
    background:#D5D9D2;
    color:var(--green,#13342A);
}
.underline-button{
    font-size: 20px;
    font-weight:460;
}
.button.tertiary{
    border-radius: 2px;;
}
.underline-button svg, .underline-button img{
    width:24px;
    height:24px;
    flex-shrink: 0;
}

.button svg, button svg{
    flex-shrink:0;
}
input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not(#search-modal-input),
textarea{
    border-radius: 4px;
    border: 1px solid #D0D6DD;
    background: var(--white, #FFF);
    color: var(--green,#13342A);
    outline-offset: 0;
    outline-color: var(--green,#13342A);
}

input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):active,
textarea:active,
input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):focus,
textarea:focus{
    border-color:var(--green,#13342A);
    outline:var(--green,#13342A) 1px solid;
}

.flex{
    display: flex;
}
.flex.inline{
    display:inline-flex;
}
.grid{
    display: grid;
}
.col-2{
    grid-template-columns: 1fr 1fr;
}
.col-4{
    grid-template-columns: 1fr 1fr 1fr 1fr;
}
.col-5{
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}
.flex.space-between{
    justify-content: space-between;
}
.flex.wrap{
    flex-wrap:wrap;
}
.grid{
    display: grid;
}
.gap-4{
    gap:4px;
}
.gap-8{
    gap:0.5rem;
}
.gap-16{
    gap:1rem;
}
.gap-24{
    gap:1.5rem;
}
.gap-32{
    gap:2rem;
}
.gap-40{
    gap:40px;
}
.flex.align-center{
    align-items: center;
}
.flex.align-end{
    align-items: end;
}
.flex.end{
    justify-content: end;
}
.flex.center{
    justify-content: center;
}
.flex.column{
    flex-direction: column;
}
.container{
    max-width: 1200px;
    margin-left:auto;
    margin-right:auto;
}
.text-center{
    text-align: center;
}
.mt-0{
    margin-top:0px;
}
.mb-0{
    margin-bottom:0px;
}
.mb-8{
    margin-bottom:8px;
}
.mb-16{
    margin-bottom:16px;
}
.mb-24{
    margin-bottom:24px;
}
.mb-32{
    margin-bottom: 32px;
}
.mb-40{
    margin-bottom:40px;
}

.dark-bg{
    background:var(--green,#13342A);
    padding-top:64px;
    padding-bottom:64px;
}

/* navigation */
.main-navigation .inside-navigation{
    justify-content: end;
    align-items: start;
}
#masthead{
    border-bottom: 8px solid var(--gold,#AB8E66);
}
.inside-header{
    padding-top:1rem;
    padding-bottom:0.5rem;
}
.main-navigation .main-nav ul li a, .main-navigation .menu-bar-item>a{
    font-size:16px;
    padding:1rem 1rem;
    line-height:24px;
}


/* utility top menu */
.utility-menu{
    padding-bottom:1rem;
    border-bottom:1px solid var(--gold20,#EEE8E0);
}
.utility-menu li{
    color:var(--green60,#717D74);
}

/* wpml language switcher */
.main-navigation ul .wpml-ls ul{
    box-shadow:none;
    display: block;
    float: initial;
    left: initial;
    opacity:1;
    z-index: initial;
    width: initial;
    text-align: initial;
    top: initial;
    transition: none;
    pointer-events: all;
    height:initial;
    overflow: initial;
    position: relative;
}
.main-navigation ul .wpml-ls .wpml-ls-sub-menu{
    width:100%;
    left:0px;
    top:100%;
    position: absolute;
}
.main-navigation ul .wpml-ls li:hover > ul.wpml-ls-sub-menu{
    left:0px;
    top:100%;
    z-index:99;
}
.wpml-ls li > ul.wpml-ls-sub-menu{
    z-index:99;
}
.wpml-ls{
    display: inline;
}
.utility-menu .wpml-ls ul > .wpml-ls-native:first-child .wpml-ls-native{
    display:none;
}
.wpml-ls .js-wpml-ls-item-toggle{
    padding: 6px 8px;
    border: 0px;
    padding-right: 32px;
    margin: -6px 0;
}
/* .utility-menu .wpml-ls .wpml-ls-sub-menu .wpml-ls-item{
    width: calc(100% + 36px);
    left: -36px;
}
*/

.wpml-ls .wpml-ls-sub-menu .wpml-ls-item a.wpml-ls-link {
    border: none;
    border-radius: 2px;
    box-shadow: 0px 2px 6px 0px rgba(0,0,0,.08);
}
#mobile-language-selector{
    display: none;
    margin-left:auto;
}
#mobile-language-selector .wpml-ls ul > .wpml-ls-item:first-child .wpml-ls-native{
    display:none;
}

/* hero-cover */
.hero-cover,.hero-content{
    position: relative;
    color:var(--white,#fff);
}
.hero-cover{
    min-height:min(36rem, 70ch);
    text-align: center;
    padding:1.5rem 0px 10rem;
}
.hero-bg-img{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.hero-cover:before{
    content: "";
    position: absolute;
    top:0px;
    left:0px;
    background:rgba(10,26,21,.8);
    width:100%;
    height:100%;
    z-index:1;
}
.hero-content{
    z-index:2;
}

/* hero slider with embla */
.embla {
    overflow: hidden;
}
.hero-slider{
    margin-top:-96px;
    z-index: 1;
}
.embla__container {
display: flex;
}
.hero-slider .embla__slide {
flex: 0 0 min(15%, 240px);
min-width: 0;
margin-right: 24px;
}
.hero-slider .embla__slide a.img{
    aspect-ratio: 1 / 1;
}
article.card{
    border-bottom:4px solid var(--gold, #AB8E66);
    background:var(--white,#fff);
    transition:all .2s ease-out;
}
article.card a.img,
.image-card{
    overflow:hidden;
}

article.card .img img,
article.card img.img{
    height:240px;
    width:100%;
    object-fit: cover;
    object-position: center;
    transition: all .2s ease-out;
}
article.card:hover a img,
.image-card:hover img{
    transform:scale(1.05);
}
article.card a:hover + div a{
    text-decoration: underline;
}
article.card .content{
    padding:12px 16px 16px;
}
article.card footer, article.card footer a{
    font-size:14px;
    line-height:14px;
    color:var(--darkGold,#8A7252);
}
article.card a{
    text-decoration: none;
}
article.card a:hover,article.card a:active,article.card a:focus{
    text-decoration: underline;
}
a.underline-next:hover + a,a.underline-next:hover + a h3,
a.underline-next:hover + a h4,a.underline-next:hover + a h5,
a.underline-next:hover + a h6{
    text-decoration: underline;
}

/* category grid */
.category-grid{
    margin-top:96px;
}
.category-grid:before, section.newsletter:before {
    content: "";
    background: var(--beige);
    width: 150vw;
    height: 200%;
    left: -25vw;
    bottom: 64px;
    /* display: flex; */
    position: absolute;
    z-index: -1;
}

.image-card{
    position: relative;
    display: flex;
}
.image-card img{
    width:100%;
    aspect-ratio: 1/1;
    transition: all .2s ease-out;
}
.image-card .button{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: calc(100% - 16px);
    width: max-content;
    display: flex;
}

/* homepage about us section */
.home-about{
    margin-top: 128px;
}
.small-resort-card{
    position: relative;
    overflow: hidden;
    border-bottom: 4px solid var(--gold, #AB8E66);
}
.small-resort-card img{
    width:100%;
    height:100%;
    object-fit: cover;
    object-position: center;
    transition: all .2s ease-out;
}
.small-resort-card .overlay{
    position: absolute;
    bottom:0px;
    left:0px;
    width:100%;
    padding:0px 16px;
}
.small-resort-card .name{
    padding:12px 0px 16px;
    color:var(--white,#fff);
    border-top:1px solid rgba(246,241,239,.4);
}
.small-resort-card:hover img{
    transform:scale(1.05);
}
.small-resort-card .name svg{
    width:24px;
    height:24px;
    flex-shrink: 0;
}
.small-resort-card:hover .white, .small-resort-card:active .white, .small-resort-card:focus .white{
    text-decoration: underline;
}
.overlay{
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 100%);
}

/* instagram section */
section.instagram{
    margin-top:96px;
    margin-bottom:64px;
}
#sb_instagram #sbi_load .sbi_load_btn, #sb_instagram .sbi_follow_btn a{
    color: var(--white, #fff);
    position: relative;
    background: var(--green, #13342A)!important;
    font-size: 20px;
    line-height: 24px;
    font-weight: 600;
    padding: 12px 24px 12px 20px;
    border: none;
    border-bottom: 4px solid var(--gold, #AB8E66)!important;
    border-radius: 0px;
    transition: all .2s ease-in-out;
}
#sb_instagram #sbi_load .sbi_load_btn svg, #sb_instagram .sbi_follow_btn a svg{
    width:24px!important;
    height:24px;
    flex-shrink:0;
}
#sb_instagram #sbi_load .sbi_load_btn:hover, #sb_instagram .sbi_follow_btn a:hover{
    background-color: var(--hover-green)!important;
    box-shadow:none!important;
}

.featured-articles{
    padding-bottom:144px;
    margin-bottom:-64px;
}
.newsletter-image{
    position: relative;
}
.newsletter-image img{
    width:100%;
    height:624px;
    object-fit: cover;
    object-position: center;
    display: flex;
}
.newsletter-image .overlay{
    position: absolute;
    bottom:0px;
    left:0px;
    width:100%;
    padding:24px;
    padding-top:80px;
}
.newsletter{
    padding-bottom:128px;
}
section.newsletter:before{
    bottom:0px;
    height:100%;
}
.newsletter-content{
    margin-top:172px;
}

/* newsletter form */

.newsletter-form form input.email-field{
    min-height:52px;
    border-radius: 2px!important;
}
.newsletter-form .data-text{
    color:#59625B;
    margin-top:12px;
    font-size:14px;
    line-height:20px;
}
.newsletter-form .email-wrap{
    min-width: 256px;
    max-width: 100%;
}
.newsletter-form .email-wrap label{
    font-weight: 500;
}
.newsletter-thank-you{
    padding:1rem;
    background:var(--white,#fff);
    transition: all .2s ease-out;
    display: none;
}
.newsletter-thank-you p{
    font-weight:600;
}
.newsletter-form.success form{
    display:none;
}
.newsletter-form.success .newsletter-thank-you{
    display:inline-flex;
}
button.primary.button.flower.flower-right:disabled{
    background:var(--grey,#717D74);
    color:var(--beige,#D0D6DD);
}
/* footer */

.site-footer{
    border-top:8px solid var(--gold,#AB8E66);
}
.site-footer .footer-widgets-container{
    padding-top:64px;
    padding-bottom:64px;
}

.inside-site-info{
    padding-top:64px;
    padding-bottom:64px;
    border-top:1px solid rgba(171,142,102, 0.2);
    color:var(--green60, #717D74);
    font-size:16px;
}
.inside-site-info a{
    color:var(--green60, #717D74);
}
.footer-widget-1{
    flex-basis:min(100%, 120px);
}
.inside-footer-widgets .widget_nav_menu .widget-title{
    font-family: 'Outfit';
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    /* identical to box height, or 150% */
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #AB8E66;
    margin-bottom:12px;
}
.inside-footer-widgets .widget ul li {
    margin-bottom:12px;
}
.inside-footer-widgets .widget ul li a:not(:hover){
    text-decoration: none;
}

/* Homepage */

body.home{
    background:var(--white,#fff);
}

/* Decoration */
.relative{
    position: relative;
}
.decor.floating{
    position: absolute;
    z-index:-1;
}
.category-grid .decor.abstract{
    top: -188px;
    right: 0px;
    opacity:.64;
}
.category-grid .decor.flower{
    left: 0px;
    transform: translate(-48%, -64%);
}
.instagram .decor.flower{
    right:0px;
    top:-48px;
    transform:translateX(50%);
}
.newsletter .decor.abstract{
    left: -96px;
    top: -12px;
}
.newsletter .decor.flower{
    width:206px;
    height:auto;
    bottom:-72px;
    left:-128px;
}


/* archives */

.separate-containers .page-header{
    background:transparent;
    padding:0px;
    margin-top:32px;
    margin-bottom:32px;
}
#breadcrumbs > span{
    display: flex;
    gap: 8px;
    align-items: center;
}
#breadcrumbs span,
#breadcrumbs span a{
    color:var(--grey, #717D74);
    letter-spacing: 0.4px;
}
#breadcrumbs span.breadcrumb_last{
    color:var(--gold,#AB8E66);
}

.separate-containers .site-main{
    margin-top:64px;
    margin-bottom:24px;
}
.archive-search{
    width: min(320px, 100%);
}
.archive-search form{
    position: relative;
}
.archive-search form input.search-field{
    padding: 12px 62px 12px 14px;
    height: 48px;
    width: 100%;
}
.archive-search form .search-submit{
    width: 56px;
    height: 48px;
    position: absolute;
    right: 0px;
    background: transparent;
    padding: 0px;
    color: #667685;
    border: none;
    display: block;
    top: 0px;
}

/* chips */

.chip{
    padding: 4px 8px;
    background: #FFFFFF;
    border: 1px solid var(--grey,#717D74);
    border-radius: 2px;
    font-size: 16px;
    text-decoration: none;
    display:inline-flex;
    gap:6px;
    align-items: center;
    transition: all .2s ease-out;
}
.chip:hover, .chip:focus, .chip:active{
    text-decoration: underline;
    border-color:var(--green,#13342A);
    box-shadow:inset 0px 0px 0px 1px var(--green,#13342A);
}
.chip.active:after{
    content:"⛌";
}
.chip.active{
    background: var(--green,#13342A);
    color: var(--white,#fff);
    font-weight: 500;
    border-color: var(--green,#13342A);
}
/* single shop pages */
.single-shop-hero .content h1{
    font-size:32px;
    line-height:40px;
}
.single-shop-hero .content p img {
    margin-left:0px;
}
#breadcrumbs {
    overflow-x:auto;
    padding-bottom:1rem;
    margin-bottom:0px;
}
#breadcrumbs span {
    white-space: nowrap;
}
.single-shop-hero .content .description iframe {
    height: auto;
    aspect-ratio: 16 / 9;
    width: 100%;
}

/* gallery grid */
.grid.gallery{
    grid-template-columns: repeat(12, 1fr);
    align-self: baseline;
}
.gallery .gallery-img{
    height:100%;
    object-fit: cover;
    object-position: center;
}
.gallery a.shop-featured-img, .gallery a.gallery-img{
    display: flex;
}
.gallery img{
    object-fit: cover;
}
.grid.gallery > a{
    grid-column-end: span 3;
}
.grid.gallery > a:nth-child(-n+2){
    grid-column-end: span 6;
}
.grid.gallery > a:nth-child(3),
.grid.gallery > a:nth-child(4),
.grid.gallery > a:nth-child(5){
    grid-column-end: span 4;
}

.single-shop-hero .content{
    padding:32px;
    background:var(--white,#fff);
}
.meta svg{
    flex-shrink: 0;
}
.meta, .meta span, .meta a{
    color:var(--grey,#717D74)!important;
}
.meta a:hover, .meta a:hover span{
    color:var(--green,#13342A)!important;

}
.activate-coupon{
    padding:16px 16px 20px;
    background:var(--green,#13342A);
}
.activate-coupon p{
    opacity:.8;
}

.single-shop-hero .shop-logo{
    max-width:150px;
    max-height:80px;
    display: flex;
}
.single-shop-hero .shop-logo img{
    object-fit: contain;
    object-position: left;
}
.coupon-wrap{
    display: none;
}

/* similar stores */

.similar-stores {
    width: 100vw;
    background: var(--green,#13342A);
    margin-top:64px;
    margin-left: calc(-50vw + 50%);
    /* padding-left: calc((100vw - 100%) / 2); */
    padding-top: 64px;
    padding-bottom: 64px;
    color-scheme: dark;
}
.title-and-slide-nav{
    padding: 0px 8px 0px 24px;
}
.horizontal-slider{
    padding-left:24px;
}
.similar-store-slider{
    overflow-x: scroll;
    padding-bottom: 32px;
    max-width:calc(1200px + ((100vw - 1200px) / 2 ));
}
.similar-stores article.card{
    flex-shrink: 0;
    width:max(18%, 284px);
}
.similar-stores article.card:last-child{
    margin-right:64px;
}

.similar-stores h2{
    display:inline-flex;
    font-size:24px;
    line-height:28px;
}
.similar-stores h2 a{
    font-weight: 600;
}
.similar-stores h2 a:hover,.similar-stores h2 a:focus,.similar-stores h2 a:active{
    color:var(--gold20,#C5A77C);
}

/* blog */
body.blog .generate-columns-container header + .grid-container.grid-parent,
body.search .generate-columns-container > .grid-container.grid-parent {
    display: block;
    width: 100%;
    margin-left: 1.25rem;
    order: -1;
}
article.generate-columns .inside-article{
    padding:1rem;
}
article.generate-columns .post-image{
    margin-bottom: 0px!important;
    width: calc(100% + 2rem);
    top: -1rem;
    left: -1rem;
    position: relative;
    overflow: hidden;
}
article.generate-columns .post-image img{
    transition:all .2s ease-out;    
}
article.generate-columns .post-image a{
    display: flex;
}
article.generate-columns h2{
    font-size: 24px;
    line-height: 32px;
}
article.generate-columns .post-image:hover img{
    transform: scale(1.05);    
}

article.generate-columns .entry-title:hover,
article.generate-columns .post-image:hover + .entry-header .entry-title{
    text-decoration: underline;
}
.entry-summary{
    margin-top:1rem!important;
}
.generate-columns{
    margin-bottom:20px;
    padding-left:20px;
}
.entry-summary .read-more{
    color:var(--darkGold,#8A7252);
}
.entry-summary .read-more:hover{
    color:var(--green,#13342A);
}
.blog .page-header{
    margin-top:16px;
}

/* single post */
.post-template-default #main article{
    background:var(--white,#fff);
}
.post-template-default #main article .inside-article{
    max-width:864px;
    margin: auto;
    margin-top: 12rem;
}
.post-template-default #main article .featured-image{
    margin-top: -12rem;
}
.post-template-default #main article p + h2,
.post-template-default #main article p + h3,
.post-template-default #main article p + h4,
.post-template-default #main article p + h5,
.post-template-default #main article p + h6{
    margin-top:2rem;
}

#nav-below{
    font-size:1rem;
}
#nav-below .nav-next{
    margin-top:1rem;
}
/* similar shops and recommendation slider */
.button.slide-nav-button {
    text-indent: -999px !important;
    gap: 0px !important;
    width: 40px !important;
    height: 40px !important;
    padding: 0px !important;
    overflow: hidden;
    justify-content: center;
}
.button.slide-nav-button.inactive {
    opacity: 0;
    pointer-events: none;
}
.title-and-slide-nav{
    max-width: calc(100% - 1rem);
}

/* related posts */
ul.maps-grid{
    margin:0px;
    padding:0px;
    list-style: none;
}
ul.maps-grid article{
    position: relative;
    height:100%;
}
ul.maps-grid article a{
    overflow: hidden;
    position: relative;
    text-decoration: none;
    height:100%;
    width:100%;
    min-height:380px;
}
ul.maps-grid article a:before{
    content:"";
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 34.91%, rgba(0, 0, 0, 0.4) 66.94%, rgba(0, 0, 0, 0.7) 100%);
    width:100%;
    height:100%;
    position: absolute;
    top:0px;
    left:0px;
    z-index:1;
}
ul.maps-grid article a header{
    padding:1rem 0px;
    margin:0px 1rem 4px;
    border-top:1px solid rgba(246,241,239, .4);
}
ul.maps-grid article a .map-logo-wrap,
ul.maps-grid article a header{
    position: relative;
    z-index:2;
}
.map-logo-wrap{
    max-height:80px;
    width: auto;
    text-align: center;
    padding-bottom:1rem;
}
.map-logo-wrap img{
    transform:none!important;
}
.map-logo{
    max-width: 160px;
    max-height: 96px;
}
.map-cover{
    position: absolute;
    width: 100%;
    height:calc(100% + 1px);
    margin-bottom:-1px;
    object-fit: cover;
    object-position: center;
    transition:all .2s ease-out;
}
.map-headline{
    font-size:20px;
    line-height:24px;
    font-weight:600;
}
ul.maps-grid article a:hover .map-headline,
ul.maps-grid article a:focus .map-headline,
ul.maps-grid article a:active .map-headline{
    text-decoration: underline;
}
.page-template-page-maps .inside-article{
    padding:0px;
    background:none;
}
.shop-mobile-featured-img{
    display: none;
}


/* RESPONSIVE */
@media only screen and (max-width:1231px){
    .container{
        max-width:calc(100% - 32px);
    }
    .hero-slider .embla__slide{
        flex:0 0 20%;
    }
    .button-row.m-stack{
        flex-direction: column;
        gap:32px;
    }
    .button-row .button{
        display: inline-flex;
        align-self: baseline;
    }
    .col-5{
        grid-template-columns: 1fr 1fr 1fr 1fr;
    }
    .similar-stores article.card{
        flex-shrink: 0;
        width:max(18%, 240px);
    }
}
@media only screen and (max-width:1025px){
    .shop-mobile-featured-img{
        display:flex;
        max-width: max(320px, 80%);
        margin-top:-10rem;
        margin-bottom:2rem;
    }
    .single-shop-hero .meta-container .metas {
        grid-template-columns: 1fr;
    }
}

@media only screen and (max-width:900px){
    .hero-slider .embla__slide{
        flex:0 0 25%;
    }
    .t-stack{
        flex-direction: column;
        grid-template-columns: 1fr;
    }
    .newsletter-image{
        margin-right: -16px;
        flex:1 0 0;
    }
    .social-overlay .button.tertiary{
        font-size: 16px;
    }
    .newsletter-content{
        flex:1 0 0;
    }
    .newsletter h2{
        font-size:32px;
        line-height:40px;
    }
    .featured-articles{
        padding-bottom:120px;
    }
    .inside-header{
        padding-bottom: 1rem;
    }
    .site-header .site-logo .header-image{
        max-height:64px;
    }
    #masthead{
        border-bottom-width: 6px;
    }
    .col-5{
        grid-template-columns: 1fr 1fr 1fr;
    }
    .similar-stores article.card{
        flex-shrink: 0;
        width:max(24%, 240px);
    }
    .similar-store-slider{
        gap:1rem;
    }
    .separate-containers .site-main {
        margin-top:24px;
    }
    .slider-nav{
        display: none;
    }
    .newsletter-image img{
        height:100%;
    }
    .newsletter-content{
        margin-top:120px;
    }
    #mobile-language-selector{
        display:inline-block;
    }
    #mobile-language-selector + #mobile-menu-control-wrapper{
        margin-left:0;
    }
    .single-shop-hero .gallery{
        display: flex;
        width: calc(100% + 16px);
        overflow-x: auto;
        margin-bottom: 0px;
        gap:4px;
        z-index: 2;
    }
    .grid.gallery > a{
        display: flex;
        flex-shrink: 0;
        flex-basis: 40%;
        height:auto!important;
    }
    .single-shop-hero .content{
        margin-top: -6rem;
        padding-top: 7rem;
    }
}

@media only screen and (max-width:500px){
    .hero-cover h1{
        font-size:32px;
        line-height:40px;
    }
    .archive-filters .archive-search{
        display:none;
    }
    .hero-slider .embla__slide{
        flex:0 0 45%;
        margin-right:8px;
    }
    article.card .content{
        padding:12px 12px 16px;
    }
    article.card .img img, article.card img.img{
        height:160px;
    }
    .col-4{
        grid-template-columns: 1fr 1fr;
    }
    .col-5{
        grid-template-columns: 1fr 1fr;
    }
    .m-gap-8{
        gap:8px;
    }
    .m-gap-16{
        gap:16px;
    }
    .m-gap-24{
        gap:24px;
    }
    .m-gap-32{
        gap:32px;
    }
    .m-stack{
        flex-direction: column;
        grid-template-columns: 1fr;
        align-items: baseline;
    }
    #masthead .site-logo{
        max-width:180px;
    }
    .inside-header.grid-container{
        padding:8px 16px;
    }
    #masthead{
        border-bottom-width:4px;
    }
    .site-header .site-logo .header-image{
        max-width:160px;
    }

/*     .hotel-logos{
        display:grid;
        grid-template-columns: 1fr 1fr;
        place-items: center;
        gap:8px;
    } */
    .hotel-logos{
        flex-wrap: wrap;
    }
    .hotel-logos img{
        max-width:128px;
    }
    .hotel-logos img:last-child{
        display:none;
    }
    .hotel-logos img:nth-child(3){
        margin-left:8px;
    }
    .hero-content > *:not(.mb-16) {
        margin-bottom:0px;
    }
    .hero-content .button-wrap{
        margin-top:1.5rem;
    }
    .category-grid{
        margin-top:48px;
    }
    .category-grid .decor.abstract{
        top:-92px;
        width:32px;
        height:auto;
    }
    .category-grid .decor.flower,
    .instagram .decor.flower{
        display: none;
    }
    .category-grid:before{
        bottom:40px;
    }
    .home-about,
    section.instagram{
        margin-top:48px;
    }
    
    article.featured-article{
        width:60%;
        flex-shrink: 0;
    }
    .featured-article-wrap{
        overflow-x:auto;
    }
    .featured-article .title{
        font-size:16px;
        line-height: 20px;
    }
    .featured-articles{
        padding-top:40px;
        padding-bottom:40px;
        margin-bottom:0px;
    }
    section.newsletter{
        padding-top:40px;
    }
    .site-footer .footer-widgets-container, .inside-site-info{
        padding-top:32px;
        padding-bottom:32px;
    }
    .footer-widgets .widget{
        margin-bottom:16px;
    }
    .similar-stores article.card{
        flex-shrink: 0;
        width:max(45%, 200px);
    }
    .similar-store-slider{
        gap:12px;
    }
    .grid.gallery > a.gallery-img{
        grid-column-end: span 6;
    }
    .metas{
        width:100%;
        gap:0.5rem;
    }
    .meta-container.flex.align-center{
        align-items: start;
        gap:1rem;
        margin-bottom:1.5rem;
    }
    .single-shop-hero .content{
        padding-left:1rem;
        padding-right:1rem;
        left:-1rem;
        width:100vw;
        position: relative;
    }
    .single-shop-hero .content h1{
        font-size:24px;
        line-height:32px;
    }
    .meta a {
        word-break: break-all;
    }

    .similar-stores{
        margin-top:0px;
        padding-top:2rem;
        padding-bottom:1rem;
    }

    body.single .site.grid-container + section.instagram {
        margin-top: 32px;
    }
    
    .similar-store-slider{
        margin-left: -1rem;
        padding-left: 1rem;
    }
    body.blog .generate-columns-container header + .grid-container.grid-parent,
    body.search .generate-columns-container > .grid-container.grid-parent{
        margin-left:0;
    }
    body.blog .page-header h1.entry-title{
        font-size:32px;
        line-height:40px;
    }
    article.generate-columns h2{
        font-size:20px;
        line-height:130%;
    }
    .blog .page-header{
        margin-top:24px;
        margin-bottom:24px;
    }
    .title-and-slide-nav{
        padding: 0px 8px 0px 16px;
    }
    .horizontal-slider{
        padding-left:32px;
    }
    .shop-mobile-featured-img{
        max-width: max(280px, 80%);
    }
    .newsletter-content{
        margin-top:0px;
    }
    .newsletter-form form.flex{
        display:block;
    }
    .newsletter-form form button{
        width: 100%;
        justify-content: center;
        margin-top: 8px;
    }
    .newsletter-description{
        margin-bottom:24px;
    }
    .map-headline {
        font-size: 16px;
        line-height: 20px;
    }
    ul.maps-grid article a {
        min-height:240px;
    }

}
@media only screen and (min-width:800px){
    .about-description p{
        font-size:20px;
        line-height:28px;
    }
    .featured-article-wrap.flex{
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
    }
    .gallery .shop-featured-img img {
        max-height: 480px;
    }
}
@media only screen and (min-width:1026px){
    .grid.gallery{
        position: sticky;
        top:40px;
        margin-bottom:0px;
    }
    .single-shop-hero {
        gap:24px;
    }
    .single-shop-hero .content {
        flex-shrink: 0;
        flex-basis: clamp(620px,55%,660px);
    }
}


@media only screen and (min-width:1200px){
    .hero-cover h1{
        font-size:56px;
        line-height:56px;
    }
    .single-shop-hero {
        gap:40px;
    }
}
@media only screen and (min-width:1232px) {
    .similar-stores .title-and-slide-nav,
    .similar-stores .horizontal-slider{
        padding-left:calc((100vw - 1200px) / 2);
    }
    .similar-store-slider{
        max-width: initial;
    }
    .featured-article-wrap.flex.gap-40{
        gap:64px;
        row-gap: 40px;
    }
}