/* ---------------------------------------------------------------------- */
/*  Settings -> Variables
/* ---------------------------------------------------------------------- */

:root {

    /* Colors */

    --main-bg-color: #FFF;
    --contrast-bg-color: #000;
    --secondary-bg-color: #F8F7F6;
    --tertiary-bg-color: #EAEAEA;
    --quaternary-bg-color: #BBB;

    --main-font-color: #000;
    --contrast-font-color: #E5E5E5;
    --secondary-font-color: #191919;
    --tertiary-font-color: #FFF;
    --quaternary-font-color: #707070;

    --error-color: rgba(242, 102, 102, .3);


    /* Typography */

    --main-font-family: 'Roboto', sans-serif;
    --secondary-font-family: 'Playfair Display', serif;

    --base-font-size: 16px;
    --nav-font-size: 0.9375rem; /* 15px */
    --smaller-font-size: 0.750rem; /* 12px */
    --small-font-size: 0.813rem; /* 13px */
    --big-font-size: 1.125rem; /* 18px */
    --bigger-font-size: 1.875rem; /* 30px */
    --biggest-font-size: 4vw;


    /* Box Model */

    --spacer: 36px;
    --spacer-2x: 72px;
    --logo-width: 250px;
    --header-height: 130px;
    --footer-height: 193px;
    --drawer-width: 33vw;

}

@media all and (max-width: 1160px) {

    :root {
        --drawer-width: 40vw;
    }

}

@media all and (max-width: 800px) {

    :root {
        --bigger-font-size: 1.175rem;
        --biggest-font-size: 10vw;

        --spacer: 20px;
        --spacer-2x: 50px;
        --logo-width: 180px;
        --footer-height: 149px;
        --header-height: 124px;
    }

}

@media all and (max-width: 600px) {

    :root {
        --spacer-2x: 40px;
        --drawer-width: 85vw;
    }

}

@media all and (max-width: 360px) {

    :root {
        --logo-width: 140px;
    }

}


/* ---------------------------------------------------------------------- */
/*  Vendor –> Hamburgers
           -> https://jonsuh.com/hamburgers
/* ---------------------------------------------------------------------- */

.hamburger{padding:15px;display:inline-block;cursor:pointer;transition-property:opacity,filter;transition-duration:.15s;transition-timing-function:linear;font:inherit;color:inherit;text-transform:none;background-color:transparent;border:0;margin:0;overflow:visible}.hamburger:hover{opacity:.7}.hamburger-box{width:40px;height:24px;display:inline-block;position:relative}.hamburger-inner{display:block;top:50%;margin-top:-2px}.hamburger-inner,.hamburger-inner::after,.hamburger-inner::before{width:40px;height:4px;background-color:#000;border-radius:4px;position:absolute;transition-property:transform;transition-duration:.15s;transition-timing-function:ease}.hamburger-inner::after,.hamburger-inner::before{content:'';display:block}.hamburger-inner::before{top:-10px}.hamburger-inner::after{bottom:-10px}.hamburger--squeeze .hamburger-inner{transition-duration:75ms;transition-timing-function:cubic-bezier(.55,.055,.675,.19)}.hamburger--squeeze .hamburger-inner::before{transition:top 75ms .12s ease,opacity 75ms ease}.hamburger--squeeze .hamburger-inner::after{transition:bottom 75ms .12s ease,transform 75ms cubic-bezier(.55,.055,.675,.19)}.hamburger--squeeze.is-active .hamburger-inner{transform:rotate(45deg);transition-delay:.12s;transition-timing-function:cubic-bezier(.215,.61,.355,1)}.hamburger--squeeze.is-active .hamburger-inner::before{top:0;opacity:0;transition:top 75ms ease,opacity 75ms .12s ease}.hamburger--squeeze.is-active .hamburger-inner::after{bottom:0;transform:rotate(-90deg);transition:bottom 75ms ease,transform 75ms .12s cubic-bezier(.215,.61,.355,1)}


/* ---------------------------------------------------------------------- */
/*  Vendor –> Flickity v2.1.2
           -> https://flickity.metafizzy.co
/* ---------------------------------------------------------------------- */

.flickity-enabled{position:relative}.flickity-enabled:focus{outline:0}.flickity-viewport{overflow:hidden;position:relative;height:100%}.flickity-slider{position:absolute;width:100%;height:100%}.flickity-enabled.is-draggable{-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.flickity-enabled.is-draggable .flickity-viewport{cursor:move;cursor:-webkit-grab;cursor:grab}.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down{cursor:-webkit-grabbing;cursor:grabbing}.flickity-button{position:absolute;background:hsla(0,0%,100%,.75);border:none;color:#333}.flickity-button:hover{background:#fff;cursor:pointer}.flickity-button:focus{outline:0;box-shadow:0 0 0 5px #19f}.flickity-button:active{opacity:.6}.flickity-button:disabled{opacity:.3;cursor:auto;pointer-events:none}.flickity-button-icon{fill:#333}.flickity-prev-next-button{top:50%;width:44px;height:44px;border-radius:50%;transform:translateY(-50%)}.flickity-prev-next-button.previous{left:10px}.flickity-prev-next-button.next{right:10px}.flickity-rtl .flickity-prev-next-button.previous{left:auto;right:10px}.flickity-rtl .flickity-prev-next-button.next{right:auto;left:10px}.flickity-prev-next-button .flickity-button-icon{position:absolute;left:20%;top:20%;width:60%;height:60%}.flickity-page-dots{position:absolute;width:100%;bottom:-25px;padding:0;margin:0;list-style:none;text-align:center;line-height:1}.flickity-rtl .flickity-page-dots{direction:rtl}.flickity-page-dots .dot{display:inline-block;width:10px;height:10px;margin:0 8px;background:#333;border-radius:50%;opacity:.25;cursor:pointer}.flickity-page-dots .dot.is-selected{opacity:1}


/* ---------------------------------------------------------------------- */
/*  Vendor –> jQuery Confirm v1.7.5
           -> Author: boniface pereira
           -> http://craftpip.github.io/jquery-confirm/
/* ---------------------------------------------------------------------- */

 body.jconfirm-noscroll{overflow:hidden!important}@-webkit-keyframes jconfirm-rotate{from{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes jconfirm-rotate{from{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.jconfirm{position:fixed;top:0;left:0;right:0;bottom:0;z-index:99999999;font-family:inherit;overflow:hidden}.jconfirm .jconfirm-bg{position:fixed;top:0;left:0;right:0;bottom:0;opacity:0;-webkit-transition:all .4s;transition:all .4s}.jconfirm .jconfirm-bg.seen{opacity:1}.jconfirm .jconfirm-scrollpane{position:fixed;top:0;left:0;right:0;bottom:0;overflow-y:auto}.jconfirm .jconfirm-box{background:#F9F9F9;position:relative}.jconfirm .jconfirm-box div.closeIcon{height:20px;width:20px;position:absolute;top:6px;right:12px;cursor:pointer;opacity:.6;text-align:center;display:none;font-size:29px;z-index: 9999;}.jconfirm .jconfirm-box div.closeIcon:hover{opacity:1}.jconfirm .jconfirm-box div.title{font-size:24px;font-weight:bold;padding:30px 30px 0px 30pxs}.jconfirm .jconfirm-box div.content{padding:30px}.jconfirm .jconfirm-box div.content:empty{height:40px;position:relative;opacity:.6}.jconfirm .jconfirm-box div.content:empty:before{content: '\f29c';height:20px;width:20px;font-family:'Ionicons';position:absolute;left:50%;margin-left:-45px;-webkit-animation:jconfirm-rotate 1s infinite;animation:jconfirm-rotate 1s infinite}.jconfirm .jconfirm-box div.content:empty:after{content:'...';position:absolute;left:50%;margin-left:-15px}.jconfirm .jconfirm-box .buttons{padding:10px 15px}.jconfirm .jconfirm-box .buttons button+button{margin-left:5px}.jconfirm .jquery-clear{clear:both}.jconfirm.white .jconfirm-bg{background-color:rgba(0,0,0,0.2)}.jconfirm.white .jconfirm-box .buttons{float:right}.jconfirm.white .jconfirm-box .buttons button{border:0;background-image:none;text-transform:uppercase;font-size:14px;font-weight:bold;text-shadow:none;-webkit-transition:background .1s;transition:background .1s;color:white}.jconfirm.white .jconfirm-box .buttons button.btn-default{box-shadow:none;color:#333}.jconfirm.white .jconfirm-box .buttons button.btn-default:hover{background:#ddd}.jconfirm.black .jconfirm-bg{background-color:rgba(0,0,0,0.5)}.jconfirm.black .jconfirm-box{box-shadow:0 2px 6px rgba(0,0,0,0.2);background:#444;border-radius:5px;color:white}.jconfirm.black .jconfirm-box .buttons{float:right}.jconfirm.black .jconfirm-box .buttons button{border:0;background-image:none;text-transform:uppercase;font-size:14px;font-weight:bold;text-shadow:none;-webkit-transition:background .1s;transition:background .1s;color:white}.jconfirm.black .jconfirm-box .buttons button.btn-default{box-shadow:none;color:#fff;background:0}.jconfirm.black .jconfirm-box .buttons button.btn-default:hover{background:#828282}.jconfirm.hololight .jconfirm-bg{background-color:rgba(0,0,0,0.5)}.jconfirm.hololight .jconfirm-box{box-shadow:0 2px 6px rgba(0,0,0,0.4);border-radius:2px;overflow:hidden}.jconfirm.hololight .jconfirm-box div.title{font-weight:inherit;border-bottom:solid 2px #76cfdf;color:#76cfdf}.jconfirm.hololight .jconfirm-box .buttons{border-top:solid 2px #e7e7e7;width:100%;float:none;padding:0}.jconfirm.hololight .jconfirm-box .buttons button{margin:0;border:0;background:#fff;border-radius:0;width:50%;padding:13px;font-size:16px;font-weight:bold;color:#666}.jconfirm.hololight .jconfirm-box .buttons button+button{border-left:solid 2px #e7e7e7}.jconfirm.holodark .jconfirm-bg{background-color:rgba(0,0,0,0.5)}.jconfirm.holodark .jconfirm-box{box-shadow:0 2px 6px rgba(0,0,0,0.4);border-radius:2px;background:#333;overflow:hidden}.jconfirm.holodark .jconfirm-box div.closeIcon{color:white}.jconfirm.holodark .jconfirm-box div.title{font-weight:inherit;border-bottom:solid 2px #76cfdf;color:#76cfdf}.jconfirm.holodark .jconfirm-box div.content{color:white}.jconfirm.holodark .jconfirm-box .buttons{border-top:solid 2px rgba(255,255,255,0.2);width:100%;float:none;padding:0}.jconfirm.holodark .jconfirm-box .buttons button{margin:0;border:0;background:#333;border-radius:0;width:50%;padding:13px;font-size:16px;font-weight:bold;color:#fff;text-shadow:none}.jconfirm.holodark .jconfirm-box .buttons button+button{border-left:solid 2px rgba(255,255,255,0.2)}.jconfirm .jconfirm-box.hilight{box-shadow:0 0 20px red}.jconfirm{-webkit-perspective:400px;perspective:400px}.jconfirm .jconfirm-box{opacity:1;-webkit-transition-property:-webkit-transform,opacity,box-shadow;transition-property:transform,opacity,box-shadow}.jconfirm .jconfirm-box.anim-top,.jconfirm .jconfirm-box.anim-left,.jconfirm .jconfirm-box.anim-right,.jconfirm .jconfirm-box.anim-bottom,.jconfirm .jconfirm-box.anim-opacity,.jconfirm .jconfirm-box.anim-zoom,.jconfirm .jconfirm-box.anim-scale,.jconfirm .jconfirm-box.anim-none,.jconfirm .jconfirm-box.anim-rotate,.jconfirm .jconfirm-box.anim-rotatex,.jconfirm .jconfirm-box.anim-rotatey,.jconfirm .jconfirm-box.anim-scaley,.jconfirm .jconfirm-box.anim-scalex{opacity:0}.jconfirm .jconfirm-box.anim-rotate{-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}.jconfirm .jconfirm-box.anim-rotatex{-webkit-transform:rotateX(90deg);transform:rotateX(90deg);-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center}.jconfirm .jconfirm-box.anim-rotatey{-webkit-transform:rotatey(90deg);-ms-transform:rotatey(90deg);transform:rotatey(90deg);-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center}.jconfirm .jconfirm-box.anim-scaley{-webkit-transform:scaley(1.5);-ms-transform:scaley(1.5);transform:scaley(1.5);-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center}.jconfirm .jconfirm-box.anim-scalex{-webkit-transform:scalex(1.5);-ms-transform:scalex(1.5);transform:scalex(1.5);-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center}.jconfirm .jconfirm-box.anim-top{-webkit-transform:translate(0px,-100px);-ms-transform:translate(0px,-100px);transform:translate(0px,-100px)}.jconfirm .jconfirm-box.anim-left{-webkit-transform:translate(-100px,0px);-ms-transform:translate(-100px,0px);transform:translate(-100px,0px)}.jconfirm .jconfirm-box.anim-right{-webkit-transform:translate(100px,0px);-ms-transform:translate(100px,0px);transform:translate(100px,0px)}.jconfirm .jconfirm-box.anim-bottom{-webkit-transform:translate(0px,100px);-ms-transform:translate(0px,100px);transform:translate(0px,100px)}.jconfirm .jconfirm-box.anim-zoom{-webkit-transform:scale(1.2);-ms-transform:scale(1.2);transform:scale(1.2)}.jconfirm .jconfirm-box.anim-scale{-webkit-transform:scale(0.8);-ms-transform:scale(0.8);transform:scale(0.8)}.jconfirm .jconfirm-box.anim-none{display:none}.jconfirm.supervan .jconfirm-bg{background-color:rgba(54,70,93,0.95)}.jconfirm.supervan .jconfirm-box{background-color:transparent}.jconfirm.supervan .jconfirm-box div.closeIcon{color:white}.jconfirm.supervan .jconfirm-box div.title{text-align:center;color:white;font-size:28px;font-weight:normal}.jconfirm.supervan .jconfirm-box div.content{text-align:center;color:white}.jconfirm.supervan .jconfirm-box .buttons{text-align:center}.jconfirm.supervan .jconfirm-box .buttons button{font-size:16px;border-radius:2px;background:#303f53;text-shadow:none;border:0;color:white;width:25%;padding:10px}


/* ---------------------------------------------------------------------- */
/*  Vendor –> Custom Select
/* ---------------------------------------------------------------------- */

.custom-select{width:100%;padding:0;position:relative}.custom-select select{width:100%;margin:0;padding:6px 10px;background:0 0;border:1px solid transparent;border-radius:0;font-size:var(--small-font-size);line-height:1.3;outline:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;appearance:none;-webkit-appearance:none;cursor:pointer}.custom-select::after{content:'\f3d0';width:9px;height:8px;margin-top:-12px;font-family:Ionicons;font-size:19px;font-weight:700;color:var(--main-font-color);position:absolute;top:50%;right:14px;z-index:2;pointer-events:none}.custom-select select:focus{background-color:transparent;border:none;color:#222;outline:0}.custom-select option{font-weight:400}.custom-select::after,x:-o-prefocus{display:none}@media screen and (-ms-high-contrast:active),(-ms-high-contrast:none){.custom-select select::-ms-expand{display:none}.custom-select select:focus::-ms-value{background:0 0;color:#222}}@-moz-document url-prefix(){.custom-select{overflow:hidden}.custom-select select{width:120%;width:-moz-calc(100% + 3em);width:calc(100% + em)}}.custom-select select:-moz-focusring{color:transparent;text-shadow:0 0 0 #000}


/* ---------------------------------------------------------------------- */
/*  Generic –> Reset -> normalize.css v8.0.0
/*                   -> http://github.com/necolas/normalize.css
/* ---------------------------------------------------------------------- */

button,hr,input{overflow:visible}progress,sub,sup{vertical-align:baseline}[type=checkbox],[type=radio],legend{-webkit-box-sizing:border-box;box-sizing:border-box;padding:0}html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}h1{font-size:2em;margin:.67em 0}hr{-webkit-box-sizing:content-box;box-sizing:content-box;height:0}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.5;margin:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:ButtonText dotted 1px}fieldset{padding:.35em .75em .625em}legend{color:inherit;display:table;max-width:100%;white-space:normal}textarea{overflow:auto}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}


/* ---------------------------------------------------------------------- */
/*  Generic –> Box Sizing
/* ---------------------------------------------------------------------- */

*, *:before, *:after {-webkit-box-sizing: border-box; box-sizing: border-box;}


/* ---------------------------------------------------------------------- */
/*  Generic –> Shared
/* ---------------------------------------------------------------------- */

html, body {font-family: var(--main-font-family); font-size: var(--base-font-size); line-height: 1.4; font-weight: 300; color: var(--main-font-color);}
body {background: var(--main-bg-color);}


hr {display: block; height: 1px; margin: 1em 0; padding: 0; border: 0; border-top: 1px solid #ccc;}

a {color: var(--main-font-color); text-decoration: none; transition: all 0.6s ease 0s;}
p a {text-decoration: underline;}

.text, .text p {line-height: 1.875rem;}

p:first-child {margin-top: 0;}
p:last-child {margin-bottom: 0;}

h1 {margin: 0; font-family: var(--secondary-font-family); font-size: var(--biggest-font-size); font-weight: 400; line-height: 1;}
h2 {margin: 0; font-family: var(--secondary-font-family); font-size: var(--bigger-font-size); font-weight: 400; line-height: 1.2;}
h3 {margin: 0; font-family: var(--secondary-font-family); font-size: var(--big-font-size); font-weight: 400; line-height: 1.2;}
h4 {margin: 0; font-family: var(--main-font-family); font-size: var(--base-font-size); font-weight: 300; text-transform: uppercase; line-height: 1.2;}
h5 {margin: 0; font-family: var(--main-font-family); font-size: var(--small-font-size); font-weight: 300; text-transform: uppercase; line-height: 1.2;}

.content h1, .content h2, .content h3, .content h4, .content h5 {margin: 0 0 10px;}

.wrap-pad {padding-right: var(--spacer); padding-left: var(--spacer);}
h4.wrap-pad, h5.wrap-pad {margin: 0; text-align: center;}
.wrap-small {width: 80%; margin: 0 auto;}
.separating-pad {padding-top: var(--spacer-2x); padding-bottom: var(--spacer-2x);}
.pad-top {padding-top: var(--spacer);}
.pad-bottom {padding-bottom: var(--spacer);}
.pad-double-top {padding-top: var(--spacer-2x);}
.pad-double-bottom {padding-bottom: var(--spacer-2x);}

main {min-height: calc(100vh - var(--header-height) - var(--footer-height)); padding-top: var(--spacer); padding-bottom: var(--spacer);}
.has-banner main {padding-top: 0;}

.grayscale {filter: grayscale(80%); transition: all 0.6s ease 0s; }
.grayscale:hover {filter: grayscale(50%);}

.mobile {display: none !important;}
.check-mobile {display: none;}

@media all and (max-width: 1160px) {

    .no-mobile {display: none !important;}
    .mobile {display: block !important;}

    .check-mobile {display: block;}

}

@media all and (max-width: 800px) {

    .wrap-small {width: 100%; margin: 0 auto; padding-right: var(--spacer); padding-left: var(--spacer);}

}


/* ---------------------------------------------------------------------- */
/*  Elements –> Header
/* ---------------------------------------------------------------------- */

.header-main {height: var(--header-height); background: var(--main-bg-color); border-bottom: 1px solid var(--tertiary-bg-color); position: -webkit-sticky; position: sticky; top: 0; right: 0; left: 0; z-index: 3;}
.has-banner .header-main {border: none;}

.top-bar {height: 40px; padding: 0 var(--spacer); background: var(--contrast-bg-color); color: var(--contrast-font-color); line-height: 40px; font-family: var(--secondary-font-family); letter-spacing: 1px; font-weight: 600; text-transform: uppercase; font-size: 11px}
.top-bar a {color: var(--contrast-font-color);}
.top-bar a:hover {opacity: .8;}

.top-bar-left a {margin-right: var(--spacer);}

.top-bar-right {display: flex;}
.top-bar-right ion-icon {margin: 7px 5px;}
.lang-nav {margin-left: var(--spacer);}

.social-nav {font-size: var(--base-font-size); margin-top: -3px;}
.icon {height: 16px; margin-right: 6px; position: relative; top: 4px;}

.aside-bar {height: 28px; position: absolute; top: 74px; right: calc(var(--spacer) - 5px);}
.aside-bar a {display: inline-block; height: 28px;}
.logout-button {margin-left: 6px; font-size: var(--small-font-size); position: relative; top: 2px;}
.aside-bar ion-icon {margin: 4px 2px; font-size: 20px;}

.search-form {width: 100%; overflow: hidden; height: calc(var(--header-height) - 40px); background: var(--secondary-bg-color); line-height: calc(var(--header-height) - 40px); opacity: 0; z-index: -1; transition: all 0.6s ease 0s; position: fixed; top: 40px; right: 0; left: 0;}
.search-form.is-open {opacity: 1; z-index: 0;}
.search-form input {display: block; width: 100%; height: 100%; padding: 0 var(--spacer); background: var(--secondary-bg-color); border: none; font-family: var(--secondary-font-family); font-size: var(--bigger-font-size); line-height: calc(var(--header-height) - 40px);}
.search-form input:focus {border: 1px solid var(--tertiary-bg-color); outline: 0;}
.search-form .search-close {display: flex; align-items: center; height: 100%; padding: 0 var(--spacer); font-size: var(--bigger-font-size);position: absolute; top: 0; right: 0;}


@media all and (max-width: 1160px) {

    .aside-bar {top: 70px; right: calc(var(--spacer) + 40px);}

}

@media all and (max-width: 800px) {

    .view-collection {display: none;}

    .aside-bar {top: 70px; right: calc(var(--spacer) + 50px);}

}

@media all and (max-width: 600px) {

    .top-bar {letter-spacing: 0;}

    .top-bar-left a {margin-right: 0;}
    .social-nav {display: none;}
    .nav-main .social-nav {display: block;}

    .aside-bar {top: 64px; right: 60px;}

}




/* ---------------------------------------------------------------------- */
/*  Elements –> Navigation Button (Mobile)
/* ---------------------------------------------------------------------- */

.hamburger {display: none; height: 56px; padding: 20px; position: absolute; top: 0; right: 0;}
.hamburger:focus {outline: 0;}
.hamburger-box {width: 20px; height: 16px;}
.hamburger-inner, .hamburger-inner::after, .hamburger-inner::before {width: 20px; height: 2px;}
.hamburger-inner::before {top: -6px;}
.hamburger-inner::after {bottom: -6px;}

@media all and (max-width: 1160px) {

    .hamburger {display: block; top: 56px; right: 16px;}

}

@media all and (max-width: 600px) {

    .hamburger {top: 51px; right: 0;}

}


/* ---------------------------------------------------------------------- */
/*  Elements –> Main Navigation
/* ---------------------------------------------------------------------- */

.nav-main ul {margin: 0; padding: 0; list-style: none;}

.nav-main > div {display: grid; grid-template-columns: 1fr calc(var(--logo-width) + 40px) 1fr; grid-template-rows: 1fr; grid-template-areas: 'list1 logo list2'; align-items: center; margin: 20px 0 0; padding-bottom: 12px; font-size: var(--nav-font-size); font-weight: 500; text-transform: uppercase;}
.nav-main > div > ul:first-child {grid-area: list1; text-align: right;}
.nav-main .site-logo {grid-area: logo; margin: 0 20px;}
.nav-main > div > ul:last-child {grid-area: list2;}
.nav-main li {display: inline; margin: 0 10px; padding: 31px 0;}

.nav-main > div > ul > li:hover {border-bottom: 1px solid #000;}
.nav-main .submenu {padding: 15px; background: var(--secondary-bg-color); text-align: left; position: absolute; top: var(--header-height); right: 0; left: 0; opacity: 0; visibility: hidden; transition: all 0.6s ease 0s;}
.nav-main ul li:not(:nth-child(3)):hover .submenu  {opacity: 1; visibility: visible;}
.nav-main .submenu ul {display: flex; flex-direction: column; height: 120px; flex-wrap: wrap; align-content: flex-start;}
.nav-main .submenu ul li {display: block; height: 30px; margin: 0 100px 0 0; padding: 0; font-weight: 300; line-height: 30px;}
.nav-main .submenu ul ul {display: none;}

.site-logo img {width: var(--logo-width);}

@media all and (max-width: 1160px) {

    .site-logo {margin: 16px 0 0 var(--spacer); padding-bottom: 16px;}

    .nav-main {width: 0; margin-top: 0; background: var(--main-bg-color); position: absolute; top: 0; bottom: 0; right: 0; transition: width 0.6s ease 0s; opacity: 0; visibility: hidden; overflow-x: hidden; z-index: 999999;}
    .nav-main > div {grid-template-columns: auto; grid-template-rows: auto; grid-template-areas: 'logo' 'list1' 'list2'; grid-gap: 0; align-content: start; align-items: start; border-left: 1px solid var(--tertiary-bg-color); margin: 0; z-index: 999999;}
    .nav-main li {display: block; margin: 0; padding: 0; border-bottom: 1px solid var(--tertiary-bg-color);}
    .nav-main li a {display: block; padding: 21px;}
    .nav-main > div > ul > li:hover {border-bottom: 1px solid var(--tertiary-bg-color);}

    .nav-main > div > ul:first-child { text-align: left;}

    .nav-main .submenu {display: none; padding: 0!important; background: none; border-top: 1px solid var(--tertiary-bg-color); text-align: left; position: static; opacity: 1; visibility: visible;}
    .nav-main .submenu.is-open {display: block;}
    .nav-main .submenu ul {display: block; height: auto;}
    .nav-main .submenu ul li {height: auto; margin: 0; line-height: 42px;}
    .nav-main .submenu ul li:last-child {border-bottom: none;}
    .nav-main .submenu ul li a {padding: 10px 20px;}
    .nav-main .submenu ul ul {display: block; padding: 0 0 20px;}
    .nav-main .submenu ul ul li {border: none; font-size: var(--smaller-font-size); line-height: 30px;}
    .nav-main .submenu ul ul a {padding-left: 40px;}


    .nav-main .site-logo {margin: 0; padding: 20px; border-bottom: 1px solid var(--tertiary-bg-color);}

    .nav-main .menu-info {padding: 20px; background: var(--secondary-bg-color);}
    .nav-main .menu-info p {font-size: var(--small-font-size); line-height: 1.6; text-transform: none;}
    .nav-main .menu-info p.copy {font-size: var(--smaller-font-size); font-weight: 300; line-height: 1.2;}
    .nav-main .menu-info p a {text-decoration: none;}
    .nav-main .menu-info ion-icon {margin-right: 6px; font-size: 18px;}

    .main-container {transition: all 0.6s ease 0s;}
    body {position: relative;}
    .nav-is-open .main-container {width: 100vw; height: 100%; position: fixed; top: 0; bottom: 0; left: 0; overflow-x: hidden; overflow-y: scroll;}
    .nav-is-open .nav-main {width: var(--drawer-width); transform: translateX(0); opacity: 1; visibility: visible; overflow-x: visible;}
    .nav-is-open .main-container {transform: translateX(calc(-1 * var(--drawer-width)));}

}

@media all and (max-width: 800px) {

    .site-logo {padding-bottom: 24px;}

}

@media all and (max-width: 360px) {

    .site-logo {margin: 22px 0 0 var(--spacer); padding-bottom: 27px;}

}


/* ---------------------------------------------------------------------- */
/*  Elements –> Footer
/* ---------------------------------------------------------------------- */

footer {display: grid; grid-template-columns: repeat(6, auto); grid-gap: var(--spacer); background: var(--secondary-bg-color); font-size: var(--small-font-size);}

footer h5 {margin-bottom: 15px; font-weight: 500; text-transform: none;}
footer ul {margin: 0; padding: 0; list-style: none;}
footer ul li {display: block; height: 20px; margin: 0 20px 0 0; padding: 0; font-weight: 300; line-height: 20px;}

footer ion-icon {margin-right: 5px; font-size: 18px;}
footer .copyright {margin: 10px 0;}

@media all and (max-width: 800px) {

    footer {display: none;}

}


/* ---------------------------------------------------------------------- */
/*  Elements –> Banner
/* ---------------------------------------------------------------------- */

.slide {background: #000; position: relative;}
.slide-image {display: block; width: 100%; opacity: .8;}
.slide-content {color: var(--tertiary-font-color); text-align: center; position: absolute; right: 0; bottom: 0; left: 0;}
.slide-content h4 { font-weight: 400;}
.slide-content h1 {margin-bottom: var(--spacer); line-height: 1;}

.slide-video {height: calc(100vh - var(--header-height)); overflow: hidden; position: relative;}
.slide-video video {width: 100%; height: 100%; object-fit: cover;}
.video-link {font-size: var(--smaller-font-size); text-align: center; position: absolute; right: 20px; bottom: 20px; z-index: 99;}
.video-link i {display: block; font-size: 24px;}

@media all and (max-width: 600px) {

    .slide-image {height: 200px; object-fit: cover;}

}


/* ---------------------------------------------------------------------- */
/*  Elements –> Content block (title / text)
/* ---------------------------------------------------------------------- */

.block {display: grid; grid-template-columns: calc(40% - var(--spacer)) 60%; grid-column-gap: var(--spacer);}

.block-header > :first-child {margin-top: 0;}
.block-header > :last-child {margin-bottom: 0;}

@media all and (max-width: 600px) {

    .block {grid-template-columns: auto; grid-row-gap: var(--spacer);}

}


/* ---------------------------------------------------------------------- */
/*  Elements –> Grid Gallery
/* ---------------------------------------------------------------------- */

.grid-gallery {display: grid; grid-template-columns: repeat(3, 1fr); grid-column-gap: 10px;}

.grid-link {display: block; padding-top: 52.6%; position: relative;}
.grid-image {width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; right: 0; bottom: 0; left: 0;}
.grid-content {padding: var(--spacer); position: absolute; bottom: 0; left: 0;}
.grid-content h5 {color: var(--tertiary-font-color); font-weight: 400;}
.grid-content h2 {color: var(--tertiary-font-color); text-transform: lowercase;}

@media all and (max-width: 800px) {

    .grid-link {padding-top: 70%;}

    .grid-content {text-shadow: 0px 0px 11px #949494;}

}

@media all and (max-width: 600px) {

    .grid-gallery {display: block; grid-template-columns: auto; grid-row-gap: 10px;}

    .grid-link {margin-bottom: 10px; padding-top: 80%;}

}


/* ---------------------------------------------------------------------- */
/*  Elements –> Products Carousel
/* ---------------------------------------------------------------------- */

.main-carousel .carousel-cell {width: 20%; margin: 0 10px; transition: transform 0.6s ease 0s;}
.main-carousel .carousel-cell a {display: block; padding: 12vw 20px 20px; text-align: center; opacity: 1; position: relative;}
.main-carousel .carousel-cell a::before {content: ''; width: 100%; height: 100%; background: rgba(132, 114, 79, .06); position: absolute; top: 0; left: 0;}
.main-carousel .carousel-cell .content {margin-bottom: var(--spacer); position: absolute; top: var(--spacer); right: 20px; left: 20px;}
.main-carousel .carousel-cell .content h3 {margin: 5px 0 0;}
.main-carousel .carousel-cell img {height: 12vw; margin: 0 auto;}

.main-carousel .carousel-cell.is-previous {transform: translateX(-100px);}
.main-carousel .carousel-cell.is-next {transform: translateX(100px);}

.flickity-button, .flickity-button:hover {background: none;}

.main-carousel .flickity-prev-next-button.previous {left: calc(20vw - 100px);}
.main-carousel .flickity-prev-next-button.next {right: calc(20vw - 100px);}

@media all and (max-width: 800px) {

    .main-carousel .carousel-cell {width: 25%;}
    .main-carousel .carousel-cell a {padding-top: 16vw;}
    .main-carousel .carousel-cell img {height: 16vw;}

    .main-carousel .carousel-cell.is-previous {transform: translateX(-35px);}
    .main-carousel .carousel-cell.is-next {transform: translateX(35px);}

    .main-carousel .flickity-prev-next-button.previous {left: calc(20vw - 125px);}
    .main-carousel .flickity-prev-next-button.next {right: calc(20vw - 125px);}

}

@media all and (max-width: 600px) {

    .main-carousel .carousel-cell {width: 100%;}
    .main-carousel .carousel-cell a {padding-top: 40vw;}
    .main-carousel .carousel-cell img {height: 60vw;}

    .main-carousel .carousel-cell.is-previous {transform: none;}
    .main-carousel .carousel-cell.is-next {transform: none;}

    .main-carousel .flickity-prev-next-button.previous {left: 20px;}
    .main-carousel .flickity-prev-next-button.next {right: 20px;}

}


/* ---------------------------------------------------------------------- */
/*  Elements –> Instagram
/* ---------------------------------------------------------------------- */

.instagram {display: grid; grid-template-columns: repeat(6, 1fr);}
.instagram-image {width: 100%;}

.instagram a {display: block; width: 100%; padding-top: 100%; background-size: cover; background-position: center;}

@media all and (max-width: 800px) {

    .instagram {grid-template-columns: repeat(3, 1fr);}

}

@media all and (max-width: 600px) {

    .instagram {grid-template-columns: repeat(2, 1fr);}

}


/* ---------------------------------------------------------------------- */
/*  Elements –> Page Detail Default
/* ---------------------------------------------------------------------- */

.page-detail-grid {display: grid; grid-template-columns: repeat(2, 1fr); grid-column-gap: var(--spacer-2x);}

.page-detail-banner .slide-image {max-height: 600px; object-fit: cover;}
.page-detail-header h1 {margin-bottom: var(--spacer);}
.page-detail-content h2 {margin: var(--spacer) 0;}

.page-detail-content ul {list-style-type: none; margin:0; padding:0;}
.page-detail-content ul li {margin-bottom: var(--spacer);}
.page-detail-content ul li p {margin-top: 0;}

.page-carousel  {margin-top: 10px;}

.page-carousel img {height: 400px; margin-right: 10px;}
.page-carousel .flickity-button-icon {fill: var(--main-bg-color);}

@media all and (max-width: 800px) {

    .page-detail-grid {grid-template-columns: auto;}
    .page-detail-content {margin-top: var(--spacer-2x);}

}

@media all and (max-width: 600px) {

    .page-carousel img {height: 200px;}

}


/* ---------------------------------------------------------------------- */
/*  Elements –> Stores Listing
/* ---------------------------------------------------------------------- */

.stores .store {display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: var(--spacer) 0; margin: 0 0 var(--spacer);}
.stores .store:last-child {margin: 0;}
.stores .store .store-photo {min-height: 400px; background-repeat: no-repeat; background-size: cover;}
.stores .store .store-text {display: flex; flex-direction: column; justify-content: center; padding: var(--spacer); background: var(--secondary-bg-color);}
.stores .store .store-text h1 {display: flex; align-items: center; justify-content: space-between; margin: 0 0 var(--spacer); line-height: 1;}
.stores .store .store-text h1 a {margin-left: 20px; padding: 10px 20px; border: 1px solid var(--contrast-bg-color); font-family: var(--main-font-family); font-size: var(--small-font-size);}

@media all and (max-width: 800px) {

    .stores .store {grid-template-columns: auto; grid-gap: 0;}

}

@media all and (max-width: 600px) {

    .stores .store .store-photo {min-height: 200px;}
    .stores .store .store-text h1 {align-items: flex-start;}

}


/* ---------------------------------------------------------------------- */
/*  Elements –> Store Page
/* ---------------------------------------------------------------------- */

.store-grid {display: grid; grid-template-columns: 25fr 75fr; grid-template-rows: auto 1fr; grid-gap: 0 var(--spacer);}
.store-grid > h1 {grid-column: 1/3; text-transform: lowercase;}

.nav-store ul {margin: 0; padding: 0; list-style: none;}
.nav-store li {font-size: var(--small-font-size); line-height: 2.125rem; text-transform: uppercase;}
.nav-store li li a {color: var(--quaternary-font-color);}
.nav-store li li a.active {color: #000;}
.nav-store ul ul {margin-left: 10px;}

.products-grid {display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: var(--spacer) 30px;}

.product {position: relative;}
.icon-inner {background: red;}
.product ion-icon {padding: 10px; cursor: pointer; position: absolute; top: 0; right: 0; z-index: 1;}

.product-thumb {display: flex; align-items: center; justify-content: center; height: 22vw; margin-bottom: 10px; position: relative;}
.product-thumb::before {content: ''; width: 100%; height: 100%; background: rgba(132, 114, 79, .06); position: absolute; top: 0; left: 0;}
.product-thumb img {width: 80%; max-height: 80%; object-fit: contain;}

.product ion-icon[name="heart-empty"] {opacity: 1; transition: all 0.6s ease 0s;}
.product:hover ion-icon[name="heart-empty"] {opacity: 1;}

.product-content {display: grid; grid-template-columns: 1fr auto; grid-gap: 20px; grid-template-areas: '. price';}
.product-price {grid-area: price; font-size: 14px; line-height: 1.7}

@media all and (max-width: 1160px) {

    .products-grid {grid-template-columns: repeat(3, 1fr);}

}

@media all and (max-width: 800px) {

    .products-grid {grid-template-columns: repeat(2, 1fr);}

}

@media all and (max-width: 600px) {

    .store-grid {display: block;}

    .nav-store {display: none;}

    .products-grid {grid-template-columns: auto;}
    .product-thumb {height: 70vw;}

}


/* ---------------------------------------------------------------------- */
/*  Elements –> Store Detail
/* ---------------------------------------------------------------------- */

.product-detail {display: grid; grid-template-columns: 1fr 1fr; grid-template-areas: 'media info' 'title title' 'related related';}

.product-detail-media {grid-area: media; display: grid; grid-template-columns: 150px auto;}
.product-detail-media .carousel-cell {width: 100%; height: 700px; position: relative;}
.product-detail-media .carousel-cell::before {content: ''; width: 100%; height: 100%; background: rgba(132, 114, 79, .06); position: absolute; top: 0; left: 0;}
.product-detail-media .carousel-cell img {width: 100%; height: 100%; object-fit: contain;}

.product-detail-media .carousel-nav {width: 150px; max-height: 700px; overflow-y: scroll;}
.product-detail-media .carousel-nav .carousel-cell {display: flex; align-items: center; justify-content: center; width: 150px; height: 150px; object-fit: contain; cursor: pointer;}
.product-detail-media .carousel-nav .carousel-cell img {width: 80%; height: 80%; object-fit: contain;}

.product-detail-media .carousel .flickity-button {opacity: 0; transition: all 0.6s ease 0s;}
.product-detail-media .carousel:hover .flickity-button {opacity: 1;}

.product-detail-info {grid-area: info; padding: var(--spacer-2x) calc(10vw - var(--spacer)) var(--spacer) var(--spacer-2x);}
.product-detail-info h2 {margin-bottom: var(--spacer);}

.product-detail-links {display: grid; grid-template-columns: 1fr 1fr; margin-top: 50px;}
.product-detail-links a {display: block; margin-right: 20px; padding: 0 8px; border: 1px solid var(--quaternary-font-color); font-size: var(--smaller-font-size); text-transform: uppercase; line-height: 42px; text-align: center;}
.product-detail-links ion-icon {position: relative; top: 2px;}

.product-detail h5 {grid-area: title;}

.product-related {grid-area: related; display: grid; grid-template-columns: repeat(5, 1fr); grid-gap: var(--spacer) 30px;}

@media all and (max-width: 1160px) {

    .product-detail-media {display: block;}
    .product-detail-media .carousel-nav {display: none;}

    .product-detail-media .carousel .flickity-button {opacity: 1;}

    .product-related {grid-template-columns: repeat(4, 1fr);}
    .product-related :nth-child(n+5) {display: none;}

}

@media all and (max-width: 800px) {

    .product-detail {grid-template-areas: 'media media' 'info info' 'title title' 'related related';}

    .product-detail-media .carousel-cell {height: 500px;}

    .product-detail-info {padding: var(--spacer-2x) 0 var(--spacer);}

    .product-related {grid-template-columns: repeat(3, 1fr);}
    .product-related :nth-child(n+4) {display: none;}

}

@media all and (max-width: 600px) {

    .product-detail-media .carousel-cell {height: 350px;}

    .product-detail-links {grid-template-columns: auto; grid-gap: var(--spacer);}
    .product-detail-links a {margin-right: 0;}

    .product-related {grid-template-columns: auto;}

}


/* ---------------------------------------------------------------------- */
/*  Elements –> Blog Grid
/* ---------------------------------------------------------------------- */

.blog-grid {display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: var(--spacer);}
.blog-grid-thumb {width: 100%; height: 0; padding-top: 62%; background-position: top center; background-size: cover; filter: grayscale(50%); transition: filter 0.6s ease 0s; overflow: hidden;}
.blog-grid a:hover .blog-grid-thumb {filter: grayscale(10%);}
.blog-grid-thumb img {width: 100%; height: 100%;}
.blog-grid-content h5 {margin: 15px 0 10px;}

.archive-button {padding: 20px 5px; background: var(--contrast-bg-color); color: var(--contrast-font-color); writing-mode: vertical-rl; position: fixed; top: 50%; right: 10px; z-index: 1;}

.archive {width: 25%; height: calc(100vh - var(--header-height)); margin: 0; padding: var(--spacer-2x); background: var(--secondary-bg-color); transform: translateX(100%); position: fixed; top: var(--header-height); right: 0px; transition: all 0.6s ease 0s; overflow-y: auto; overflow-x: hidden; z-index: 1; -webkit-overflow-scrolling: touch;}

body.open-archive .archive {transform: translateX(0);}

.archive li {margin-bottom: 8px; font-family: var(--main-font-family); font-size: var(--nav-font-size); list-style: none; cursor: pointer;}
.archive > li {font-family: var(--secondary-font-family); font-size: 24px;}
.archive span {transition: .6s;}
.archive span:hover {opacity: .6;}
.archive .active {font-weight: 400;}
.archive ul {padding: 10px 0 20px 20px;}

.archive.auto-open > li:not(:first-child) ul, .archive:not(.auto-open) > li:not(.open) ul {display: none;}
.center-button {text-align: center; margin-top: var(--spacer);}
.view-more-button {display: inline-block;
    border: 1px solid #000;
    padding: 10px 40px; cursor: pointer;}
.view-more-button:hover {background:#000; color: #fff;}

@media all and (max-width: 800px) {

    .blog-grid {grid-template-columns: repeat(3, 1fr);}

    .archive {width: 33.333%;}

}

@media all and (max-width: 600px) {

    .blog-grid {grid-template-columns: auto;}

    .archive {width: 65%;}

}


/* ---------------------------------------------------------------------- */
/*  Elements –> Blog Detail
/* ---------------------------------------------------------------------- */

body.bloges_page.is_show_page main, body.blog_page.is_show_page main {padding: 0px;}

.blog-wrap {position: relative;}
.blog-detail {display: grid; grid-template-columns: 50% 50%; grid-template-rows: auto 1fr; grid-gap: 20px 0; grid-template-areas: 'image header' 'image content'; align-items: start; transition: all 0.6s ease 0s;}

.blog-detail-header {grid-area: header; padding-left: var(--spacer-2x);}
.blog-detail-header h2 {margin-top: var(--spacer-2x); margin-bottom: 10px;}
.blog-detail-content {grid-area: content; padding: 0 0 var(--spacer-2x) var(--spacer-2x);}
.blog-detail-content .text a {text-decoration: underline;}
.blog-detail-image {grid-area: image; position: -webkit-sticky; position: sticky; top: var(--header-height);}
.blog-detail-image img {display: block; width: 50vw; position: relative; right: 10vw;}

/* Theme 2 */
.blog-detail-theme-2 {grid-template-columns: 100%; grid-template-areas: 'header' 'content';}
.blog-detail-theme-2 .blog-detail-header {padding-left: 0;}
.blog-detail-theme-2 .blog-detail-content {padding-left: 0;}
.blog-detail-theme-2 .blog-detail-image {display: none;}

body.open-comments .blog-detail  {transform: translateX(calc(-1 * var(--drawer-width)));}
body.open-comments .blog-comments  {transform: translateX(0);}

.comments-close {padding: var(--spacer); position: fixed; top: calc(var(--header-height) + 14px); right: 0; cursor: pointer; transition: all 0.6s ease 0s; opacity: 0; z-index: -1;}
.open-comments .comments-close {opacity: 1; z-index: 2;}

.blog-comments {width: var(--drawer-width); transform: translateX(100%); transition: all 0.6s ease 0s; top: var(--header-height); right: 0px; padding: var(--spacer-2x); background:var(--secondary-bg-color); height: calc(100vh - var(--header-height)); position: fixed; overflow-y: auto; overflow-x: hidden; z-index: 1; -webkit-overflow-scrolling: touch;}
.blog-comments .blog-comment {margin-top: var(--spacer); font-size: 14px; line-height: 1.7;}
.blog-comments .blog-comment.level-1 {margin-left: calc(var(--spacer)/2);}
.blog-comments .comment-author {font-weight: 500;}
.blog-comments .comment-author span {font-weight: 300;}
.blog-comments h2 {margin-bottom: 20px;}
span.js-comments {display: inline-block; margin-left: 10px; cursor: pointer;}

form.form-comments > * {transition: all 0.6s ease 0s }
form.form-comments input, form.form-comments textarea {display: block; width: 100%; padding: 10px; margin-bottom: 10px; border:  1px solid var(--quaternary-bg-color); background: transparent; font-size: 14px; font-weight: 300}
form.form-comments button {width: 50%; background: none; border: 0px none; padding:0px 10px; border: 1px solid var(--quaternary-bg-color); font-size: var(--smaller-font-size); font-weight: 300; color: var(--main-font-color); text-transform: uppercase; line-height: 42px; text-align: center; transition: all 0.6s ease 0s;}
form.form-comments button:hover {cursor: pointer; opacity: .6;}

.form-comments input:disabled {padding: 0; border: 0; font-weight: 500; color: var(--main-font-color);}

.reply-button {margin-top: 20px; padding: 5px 15px; background: var(--contrast-bg-color); border: none; color: var(--contrast-font-color); cursor: pointer;}
.reply-button:focus {outline: 0;}

.blog-comment .form-comments {margin-top: 20px;}

/* Old blog entries */
.blog-detail-content .text img {display: block;}
.blog-detail-content .text [title~="seprarador"],
.blog-detail-content .text [title~="separador"],
.blog-detail-content .text [href~="seprarador"],
.blog-detail-content .text [href~="separador"],
.blog-detail-content .text [src~="seprarador"],
.blog-detail-content .text [src~="separador"] {display: none!important;}

@media all and (max-width: 1160px) {

    .blog-comments {padding: var(--spacer);}

}

@media all and (max-width: 800px) {

    body.bloges_page.is_show_page main, body.blog_page.is_show_page main {padding: var(--spacer);}

    body.open-comments {height: 100vh; overflow: hidden; position: fixed;}
    body.open-comments .blog-detail  {height: calc(100vh - var(--header-height) - var(--footer-height));overflow: hidden; transform: translateX(-100%);}
    .blog-comments {width: 100%;}

    .blog-detail {display: block;}

    .blog-detail-header {padding-left: 0;}
    .blog-detail-header h2 {margin-top: 0;}
    .blog-detail-image {margin: var(--spacer) 0; position: static;}
    .blog-detail-image img {width: 100%; position: static;}
    .blog-detail-content {padding-left: 0;}

    .blog-detail-theme-2 .blog-detail-content {margin-top: var(--spacer);}

}


/* ---------------------------------------------------------------------- */
/*  Elements –> Favorites
/* ---------------------------------------------------------------------- */

.favorites-grid {display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); grid-gap: var(--spacer) 20px;}

.form-buy-favorites {width: var(--drawer-width); transform: translateX(100%); transition: all 0.6s ease 0s; top: var(--header-height); right: 0px; padding: var(--spacer-2x); background:var(--secondary-bg-color); height: calc(100vh - var(--header-height)); position: fixed; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch;}

.buy-favorites-close {padding: var(--spacer); position: fixed; top: 0; right: 0; cursor: pointer; transition: all 0.6s ease 0s;}

body.open-buy-favorites .favorites-grid  {width: calc(100% - var(--drawer-width));}
body.open-buy-favorites .form-buy-favorites {transform: translateX(0);}

a.buy-favorites {border: 1px solid #000; padding: 6px 14px; display:inline-block; margin-bottom: var(--spacer);}

@media all and (max-width: 600px) {

    .favorites-grid {grid-template-columns: auto;}

}

/* ---------------------------------------------------------------------- */
/*  Elements –> Clients Area
/* ---------------------------------------------------------------------- */

.clientsarea {display: grid; grid-template-columns: 1fr 1fr; grid-template-areas: 'image title' 'image nav' 'image form';}

.clientsarea > h1 {grid-area: title; padding: var(--spacer) var(--spacer) 20px; text-align: center;}
.clientsarea > nav {grid-area: nav; padding: 0 var(--spacer); text-align: center;}
.clientsarea > .order-history {grid-area: form; padding: var(--spacer);}
.clientsarea > img {grid-area: image; width: 100%; height: 100%; object-fit: cover;}

.clientsarenav ul {margin: 0; padding: 0; list-style: none;}
.clientsarenav li {display: inline;}
.clientsarenav li:not(:last-child)::after {content: ' | ';}
.clientsarenav a.active {font-weight: bold;}

.order-history {font-size: var(--small-font-size);}

.order-history input {width: 100%; margin: 5px 0 15px; padding: 6px 12px; border: 1px solid var(--quaternary-bg-color); font-size: var(--small-font-size);}

.order-history h2 {margin: 30px 0 20px; font-size: var(--big-font-size);}
.order-history h3 {margin: 20px 0;}
.order-history p {margin: 0;}

.order-history button {display: block; width: 100%; margin-top: 20px; padding:0px 10px; background: var(--contrast-bg-color); border: none; font-size: var(--smaller-font-size); font-weight: 500; color: var(--tertiary-font-color); letter-spacing: 1px; text-transform: uppercase; line-height: 42px; text-align: center; transition: all 0.6s ease 0s;}
.order-history button:hover {cursor: pointer; opacity: .6;}

.order-history .button {display: inline-block; margin-top: 20px; padding: 10px 20px; border: 1px solid var(--contrast-bg-color); font-size: var(--smaller-font-size); font-weight: 500; color: var(--main-font-color); text-transform: uppercase; text-align: center; transition: all 0.6s ease 0s;}
.order-history .button:hover {cursor: pointer; opacity: .6;}

.order-history .custom-select.country {width: 100%; margin-left: 0; border: 1px solid var(--quaternary-bg-color);}


/* ---------------------------------------------------------------------- */
/*  Elements –> Press List
/* ---------------------------------------------------------------------- */

.press-grid {display: grid; grid-template-columns: repeat(6, 1fr); grid-gap: var(--spacer);}
.press-grid img {max-width: 100%;}
.press-grid h1 {grid-column: 1/-1;}
.press-grid h5 {margin-top: 10px;}
.press-grid h5 span {text-transform: none}

@media all and (max-width: 1160px) {

    .press-grid {grid-template-columns: repeat(4, 1fr);}

}

@media all and (max-width: 800px) {

    .press-grid {grid-template-columns: repeat(3, 1fr);}

}

@media all and (max-width: 600px) {

    .press-grid {grid-template-columns: repeat(2, 1fr);}

}

/* ---------------------------------------------------------------------- */
/*  Elements –> Pages
/* ---------------------------------------------------------------------- */

form.como-comprar input, form.como-comprar textarea{ display: block; width: 100%; margin-bottom: 10px; padding: 10px; background: transparent; border: 1px solid var(--quaternary-bg-color); font-size: 14px; font-weight: 300; }

form.como-comprar button {width: 50%; margin-bottom: 40px; padding: 0px 10px; background: none; border: 0px none; border: 1px solid var(--quaternary-bg-color); font-size: var(--smaller-font-size); font-weight: 300; color: var(--main-font-color); text-transform: uppercase; line-height: 42px; text-align: center; transition: all 0.6s ease 0s;}

form.como-comprar p {font-size: var(--small-font-size); line-height: 1.7}

.payment-methods-bar {display: grid; grid-template-columns: repeat(5, 1fr); grid-column-gap: 10px; align-items: center;}
.payment-methods-bar img {width: 100%; height: auto;}

form.como-comprar .custom-select.country {width: 100%; border:1px solid #bbbbbb; margin: 0 0 10px 0; font-size: 14px; padding: 6px 0px}
form.como-comprar .custom-select.country select {font-size: 14px;}

/* ---------------------------------------------------------------------- */
/*  Elements –> Modal
/* ---------------------------------------------------------------------- */

.jconfirm {text-align: center}
.jconfirm h2{margin-top: 0; margin-bottom: 20px; font-size: 22px; line-height: 27px;}
.jconfirm label{display: inline-block; width:100px}
.jconfirm input {width: 90%; margin-bottom: 20px; font-size: 13px; padding: 7px; background: none; border: 1px solid #000;}
.jconfirm input.consent_check {width: auto;}
.jconfirm button{font-size:13px; display: block; width: 90%; padding: 8px; background: #000; font-weight: normal; color: #fff; text-transform: uppercase; text-align: center; text-shadow:none !important; border:none !important; box-shadow:none !important; margin: 0 auto; -webkit-transition: all 2s ease-out; -moz-transition: all 0.6s ease 0s; -o-transition: all 0.6s ease 0s; transition: all 0.6s ease 0s;}
.jconfirm button:hover {background: #666;}
.jconfirm .smallinfo {opacity: 0.7; font-size: 13px; margin-top: 20px!important;}
.jconfirm .privacy_agree {width: 90%; margin: 10px auto; padding: 10px; font-size: 13px;}
.jconfirm .privacy_agree input[type="checkbox"] {margin-bottom: 0;}

.jconfirm form .error, .jconfirm form.error .privacy_agree {background-color: var(--error-color);}
.jconfirm form span.error {display: none!important;}
.jconfirm div.errorFeedback {width:90%; margin: 0 auto 20px; padding: 10px 0; background-color: var(--error-color); font-size: var(--small-font-size);}


.jconfirm .col-1-2 {width: 50%; float: left;}
.resetpasswordbox {text-align: center; min-height: calc(100vh - 348px);}
#resetpassword{width: 50%; margin: 0 auto; text-align: center;}
#resetpassword input{width:80%; margin: 0 auto; float: none; margin-bottom: 20px; }
#resetpassword button {margin: 0 auto;}

.jconfirm .container {width: auto; float: none;}
.jconfirm-box-container {width: 400px; margin: 0 auto;}
.jconfirm-box-container.large-modal {width: 700px;}
.jconfirm-box-container.personalization-modal {width: 900px;}
.personalization-modal .jconfirm-box {background: #fff!important;}

.custom-select.country, .custom-select.ptzone {width: 90%; margin: 0 0 20px 5%; border:1px solid var(--secondary-font-color);}
.custom-select select {color: var(--secondary-font-color);}

@media all and (max-width: 800px) {

    .jconfirm-box-container.large-modal {width: 100%;}
    .jconfirm .jconfirm-box {margin: 0!important;}
    .jconfirm .col-1-2 {width: 100%; float: none;}
    .jconfirm .loginbox {margin-top: 0;}

}


/* ---------------------------------------------------------------------- */
/*  Elements –> Error 404
/* ---------------------------------------------------------------------- */

.error404 {height: 100%; text-align: center;}
.error404:before {content: ''; display: inline-block; height: 100%; margin-right: -0.25em; vertical-align: middle;}
.error404 .centered {display: inline-block; width: 420px; vertical-align: middle; max-width: 90%;}

.error404 .centered > a {display: block; border-bottom: 2px solid #000;}
.error404 .logo {width: 340px; max-width: 80%;}
.error404 .center {width: 430px; margin: 30px auto 0; max-width: 90%;}
.error404 h1, .error404 h1 a {margin: 0; padding: 20px 0 10px; font-size: 16px; text-transform: uppercase; font-weight: 300; }


/*! Lity - v2.3.1 - 2018-04-20
* http://sorgalla.com/lity/
* Copyright (c) 2015-2018 Jan Sorgalla; Licensed MIT */.lity{z-index:9990;position:fixed;top:0;right:0;bottom:0;left:0;white-space:nowrap;background:#0b0b0b;background:rgba(0,0,0,0.7);outline:none !important;opacity:0;-webkit-transition:opacity .3s ease;-o-transition:opacity .3s ease;transition:opacity .3s ease}.lity.lity-opened{opacity:1}.lity.lity-closed{opacity:0}.lity *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.lity-wrap{z-index:9990;position:fixed;top:0;right:0;bottom:0;left:0;text-align:center;outline:none !important}.lity-wrap:before{content:'';display:inline-block;height:100%;vertical-align:middle;margin-right:-0.25em}.lity-loader{z-index:9991;color:#fff;position:absolute;top:50%;margin-top:-0.8em;width:100%;text-align:center;font-size:14px;font-family:Arial,Helvetica,sans-serif;opacity:0;-webkit-transition:opacity .3s ease;-o-transition:opacity .3s ease;transition:opacity .3s ease}.lity-loading .lity-loader{opacity:1}.lity-container{z-index:9992;position:relative;text-align:left;vertical-align:middle;display:inline-block;white-space:normal;max-width:100%;max-height:100%;outline:none !important}.lity-content{z-index:9993;width:100%;-webkit-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);-webkit-transition:-webkit-transform .3s ease;transition:-webkit-transform .3s ease;-o-transition:-o-transform .3s ease;transition:transform .3s ease;transition:transform .3s ease, -webkit-transform .3s ease, -o-transform .3s ease}.lity-loading .lity-content,.lity-closed .lity-content{-webkit-transform:scale(.8);-ms-transform:scale(.8);-o-transform:scale(.8);transform:scale(.8)}.lity-content:after{content:'';position:absolute;left:0;top:0;bottom:0;display:block;right:0;width:auto;height:auto;z-index:-1;-webkit-box-shadow:0 0 8px rgba(0,0,0,0.6);box-shadow:0 0 8px rgba(0,0,0,0.6)}.lity-close{z-index:9994;width:35px;height:35px;position:fixed;right:0px;top:0px;-webkit-appearance:none;cursor:pointer;text-decoration:none;text-align:center;padding:0;color:#fff;font-style:normal;font-size:35px;font-family:Arial,Baskerville,monospace;line-height:35px;text-shadow:0 1px 2px rgba(0,0,0,0.6);border:0;background:none;outline:none;-webkit-box-shadow:none;box-shadow:none}.lity-close::-moz-focus-inner{border:0;padding:0}.lity-close:hover,.lity-close:focus,.lity-close:active,.lity-close:visited{text-decoration:none;text-align:center;padding:0;color:#fff;font-style:normal;font-size:35px;font-family:Arial,Baskerville,monospace;line-height:35px;text-shadow:0 1px 2px rgba(0,0,0,0.6);border:0;background:none;outline:none;-webkit-box-shadow:none;box-shadow:none}.lity-close:active{top:1px}.lity-image img{max-height:90vh!important; max-width:100%;display:block;line-height:0;border:0}.lity-iframe .lity-container,.lity-youtube .lity-container,.lity-vimeo .lity-container,.lity-facebookvideo .lity-container,.lity-googlemaps .lity-container{width:100%;max-width:964px}.lity-iframe-container{width:100%;height:0;padding-top:56.25%;overflow:auto;pointer-events:auto;-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-overflow-scrolling:touch}.lity-iframe-container iframe{position:absolute;display:block;top:0;left:0;width:100%;height:100%;-webkit-box-shadow:0 0 8px rgba(0,0,0,0.6);box-shadow:0 0 8px rgba(0,0,0,0.6);background:#000}.lity-hide{display:none}


/* ==========================================================================
   POPUP
   ========================================================================== */
#popup {width: 700px;  padding:10px; box-sizing: border-box; background: #fff; overflow: hidden; text-align: center}
#popup img {width: 100%; display: block;}
#popup h1 {font-size:50px; margin: 0px 0px 10px 0px; padding: 0px; color: #fff;}
#popup h2 {font-size:23px; margin: 0px 0px 10px 0px; padding: 0px; color: #fff;}
#popup h5, #popup h6 {font-weight: normal; margin: 0px;}
#popup p {font-size: 20px; margin-bottom: 0px; }

#popup .popup_imagecontainer {width: 100%; height: 450px; color: #fff; display: flex; justify-content: center; align-items: center; text-align: center; background: #000;}
#popup .popup_imagecontainer:before {
    content : "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: calc(100% - 40px);
    height: calc(100% - 40px);
    opacity : 0.5;
    background-repeat: no-repeat; background-size: cover;
    margin: 20px;
}

#popup .popup_imagecontainer .pop_content {opacity: 1; position: absolute; transform: translateX(-50%) translateY(-50%); left: 50%; top: 50%; width: 100%;  padding: 40px; box-sizing: border-box}
#popup .popup_imagecontainer .pop_content p {padding: 20px;}
#popup .pop_content_single {padding: 20px}
#popup .col-1-2.pop_content_single {display: flex; justify-content: center; align-items: center; height: 400px;}

@media only screen and (max-width: 736px) {


    .lity-container {max-width: 90%!important;}
    #popup {width: 100%; min-width: 90vw}
    #popup .col-1-2 {width: 100%; float: none;}
    #popup .col-1-2.pop_content_single {height: auto; display: inline;}
    #popup h1 {font-size: 30px;}
    #popup h2 {font-size: 20px;}
    #popup p {font-size: 16px;}


}