/* ==========================================================================
   ==========================================================================
   BIEN NACIDO + KABOOKABOO MARKETING
   ==========================================================================
   ========================================================================== */










/* ==========================================================================
   ==========================================================================
   Header
   ==========================================================================
   ========================================================================== */

.header {
	width: 100%;
	height: 100px;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999;
}

.header.header--alt {
	background: linear-gradient(180deg, rgba(0,0,0,.65) 0%, rgba(0,0,0,0) 100%);
}

.header:after {
	width: 100%;
	height: 100px;
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	background: #fff;
	z-index: 1;
	pointer-events: none;
    transition: opacity .3s ease;
	will-change: opacity;
}

.header.header--alt:not(.header--scroll):not(.header--open):after {
	opacity: 0;
}

.header.no-animation *,
.header.no-animation *:before,
.header.no-animation *:after {
	transition: none !important;
}

@media (max-width:980px) {
    
    .header {
		padding-top: 30px;
		height: 120px;
    }
	
	.header:after {
		height: 120px;
	}
}

@media (max-width:760px) {
    
    .header {
		height: 120px;
    }
	
	.header:after {
		height: 120px;
	}
}

.header__wrapper {
	width: 100%;
	height: 100%;
	z-index: 10;
}





/* ==========================================================================
   Logo
   ========================================================================== */

.header__logo {
	width: 200px;
	height: auto;
	position: absolute;
	top: 50%;
	left: 4.5%;
	transform: translateY(-50%);
}

@media (max-width:980px) {
    
    .header__logo {
		width: 180px;
		left: 50%;
		transform: translate(-50%, -50%);
    }
}

@media (max-width:760px) {
    
    .header__logo {
		width: 180px;
    }
}

.header__logo-img {
	width: 100%;
	height: auto;
	transition: filter .4s ease;
	will-change: filter;
}

.header.header--alt:not(.header--scroll):not(.header--open) .header__logo-img {
	filter: brightness(10);
}




/* ==========================================================================
   Main Menu
   ========================================================================== */

.main-menu {
	position: absolute;
    top: 50%;
    left: 50%;
	z-index: 10;
    transform: translate(-50%, -50%);
}

.main-menu__wrapper {
	width: 100%;
    height: 100%;
}

@media (max-width:1420px) {
    
    .main-menu {
		left: auto;
		right: calc(4.5% - 15px);
		z-index: 10;
		transform: translate(0, -50%);
    }
}

@media (max-width:980px) {
    
    .main-menu {
		display: none;
    }
    
    .main-menu {
		width: 100%;
		height: calc(100vh - 120px);
    	top: 90px;
		left: 0;
		right: auto;
		transform: none;
		overflow: scroll;
		display: none;
    }
	
	.main-menu:before {
		width: 100%;
		height: calc(100vh - 120px);
		content: '';
		position: fixed;
		top: 120px;
		left: 0;
		background: #F8F6F4;
		opacity: 0;
		transition: opacity .2s ease;
	}

	.main-menu--open:before {
		opacity: 1;
		transition: opacity .3s ease;
	}
    
    .main-menu__wrapper {
		transform: translateY(-20px);
		transition: transform .15s ease-in-out;
		transition-delay: 0s;
		will-change: transform;
    }
    
    .main-menu--open .main-menu__wrapper {
		transform: translateY(0);
		transition: transform .3s ease-in-out;
		transition-delay: .1s;
    }
}

.main-menu .main-menu__wrapper {
	width: 100%;
    height: 100%;
}

.main-menu .main-menu__list {
    justify-content: center;
    flex-wrap: nowrap;
    flex-direction: row;
	display: flex;
}

@media (max-width:980px) {
    
    .main-menu .main-menu__list {
		padding: 15px 6%;
		text-align: left;
		justify-content: flex-start;
		flex-wrap: wrap;
    }
}

@media (max-width:760px) {
    
    .main-menu .main-menu__list {
		padding: 15px 8%;
    }
}

.main-menu .main-menu__list > .menu-item {
	margin: 0 5px;
}

@media (max-width:980px) {

	.main-menu .main-menu__list > .menu-item {
		margin: 0 !important;
		padding: 0 !important;
		width: 100%;
		display: block;
		opacity: 0;
		transition: opacity .3 ease;
		will-change: opacity;
	}

	.main-menu--open .main-menu__list > .menu-item {
		opacity: 1;
		transition: opacity .3s ease;
	}

	.main-menu--open .main-menu__list > .menu-item:nth-child(1) {
		transition-delay: .1s;
	}

	.main-menu--open .main-menu__list > .menu-item:nth-child(2) {
		transition-delay: .15s;
	}

	.main-menu--open .main-menu__list > .menu-item:nth-child(3) {
		transition-delay: .2s;
	}

	.main-menu--open .main-menu__list > .menu-item:nth-child(4) {
		transition-delay: .25s;
	}

	.main-menu--open .main-menu__list > .menu-item:nth-child(5) {
		transition-delay: .3s;
	}

	.main-menu--open .main-menu__list > .menu-item:nth-child(6) {
		transition-delay: .35s;
	}

	.main-menu--open .main-menu__list > .menu-item:nth-child(7) {
		transition-delay: .4s;
	}
}

.main-menu .menu-item a {
	padding: 10px;
	color: #262321 !important;
	font-size: 14px;
	line-height: 100%;
	font-weight: 400 !important;
	text-decoration: none !important;
	letter-spacing: 0;
	display: block;
	transition: color .3s ease;
	will-change: color;
}

.main-menu .menu-item a:after {
	width: 0;
	height: 1px;
	content: '';
	position: absolute;
	left: 50%;
	bottom: 5px;
	background: #262321;
	transform: translateX(-50%);
	transition: width .3s ease;
	will-change: width;
}

.header.header--alt:not(.header--scroll):not(.header--open) .main-menu .menu-item a {
	color: #fff !important;
}

.header.header--alt:not(.header--scroll):not(.header--open) .main-menu .menu-item a:after {
	background: #fff;
}

.no-touch-device .main-menu .menu-item a:hover:after {
	width: calc(100% - 20px);
}

@media (max-width:980px) {
    
    .main-menu .menu-item a {
		padding: 20px 0;
		font-size: 16px;
    }

	.main-menu .menu-item a:after {
		display: none;
	}
	
	.main-menu .menu-item:not(:first-child) a:before {
		width: 100%;
		height: 1px;
		content: '';
		position: absolute;
		top: 0.5px;
		left: 0;
		background: rgba(159,158,140,.5);
	}
}

.main-menu .menu-item a span {
	white-space: nowrap;
	display: block;
}






/* ==========================================================================
   Toggle Button
   ========================================================================== */

.main-menu__toggle-btn {
    width: 45px;
    height: 45px;
    position: absolute;
    z-index: 20;
	display: none;
}

@media (max-width:980px) {
    
    .main-menu__toggle-btn {
    	top: 50%;
    	right: calc(6% - 10px);
		display: block;
		transform: translateY(-50%);
    }
}

@media (max-width:760px) {
    
    .main-menu__toggle-btn {
    	right: calc(8% - 10px);
    }
}

.main-menu__toggle-btn:before,
.main-menu__toggle-btn:after,
.main-menu__toggle-btn span:before {
    width: 25px;
    height: 2px;
    content: '';
    position: absolute;
    left: 50%;
    background: #9F9E8A;
	transform: translate(-50%, -50%);
    transition: transform .3s ease, width .3s ease, left .3s ease, top .3s ease, bottom .3s ease, background .3s ease, opacity .3s ease;
    will-change: transform, left, top, bottom, background;
}

.header.header--alt:not(.header--scroll):not(.header--open) .main-menu__toggle-btn:before,
.header.header--alt:not(.header--scroll):not(.header--open) .main-menu__toggle-btn:after,
.header.header--alt:not(.header--scroll):not(.header--open) .main-menu__toggle-btn span:before {
    background: #fff;
}

.main-menu__toggle-btn:before {
    top: calc(50% - 8px)
}

.main-menu__toggle-btn--close:before {
    width: 27px;
    top: calc(50% - 1px) !important;
    transform: translateX(-50%) rotate(135deg);
}

.main-menu__toggle-btn span {
	width: 100%;
    height: 100%;
}

.main-menu__toggle-btn span:before {
    top: 50%;
	opacity: 1;
}

.main-menu__toggle-btn--close span:before {
	opacity: 0;
}

.main-menu__toggle-btn:after {
    bottom: calc(50% - 10px)
}

.main-menu__toggle-btn--close:after {
    width: 27px;
    bottom: calc(50% - 1px) !important;
    transform: translateX(-50%) rotate(-135deg);
}






/* ==========================================================================
   Secondary Menu / Commerce7
   ========================================================================== */

#c7-cart {
    color: inherit !important;
}

#c7wp-cart-box {
	padding: 0 !important;
	border-left: 1px solid #9F9E8C !important;
	border-bottom: 1px solid #9F9E8C !important;
	position: fixed !important;
	top: 0 !important;
	right: 0 !important;
	z-index: 999 !important;
}

@media (max-width:980px) {
    
    #c7wp-cart-box {
		width: 100% !important;
		border-left: none !important;
    	justify-content: center !important;
    	display: flex !important;
    }
}

#c7wp-cart-box:before {
	width: 100% !important;
	height: 100% !important;
	content: '' !important;
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	background: #262321 !important;
	transition: opacity .3s ease !important;
	opacity: 0 !important;
}

#c7wp-cart-box.header--alt:not(.header--scroll):not(.header--open):before {
	opacity: .1 !important;
}

#c7wp-cart-box #c7-login,
#c7wp-cart-box #c7-cart {
	padding: 0 !important;
}

#c7wp-cart-box #c7-login > a,
#c7wp-cart-box #c7-cart > a {
	padding: 6px 15px 5px !important;
	font-family: 'Roboto', sans-serif !important;
	color: #9F9E8A !important;
	font-size: 12px !important;
	line-height: 16px !important;
	letter-spacing: 0;
	text-decoration: none !important;
	vertical-align: top !important;
    display: inline-block !important;
	transition: color .3s ease !important;
}

#c7wp-cart-box #c7-login > a.c7-login__logged-in {
	padding-right: 0 !important;
}

#c7wp-cart-box #c7-login > a.c7-login__logout {
	padding-left: 0 !important;
}

#c7wp-cart-box #c7-cart > a:after {
	width: 1px !important;
	height: 18px !important;
	content: '' !important;
	position: absolute !important;
	top: 50% !important;
	left: -1px !important;
	background: #9F9E8C !important;
	transform: translateY(-50%) !important;
}

#c7wp-cart-box.header--alt:not(.header--scroll):not(.header--open) #c7-login > a,
#c7wp-cart-box.header--alt:not(.header--scroll):not(.header--open) #c7-cart > a {
	color: #fff !important;
}

.no-touch-device #c7wp-cart-box #c7-login > a:hover {
	text-decoration: underline !important;
}

#c7wp-cart-box #c7-cart > a:before {
	margin-top: -1px !important;
	padding-right: 5px !important;
	width: auto !important;
	height: 16px !important;
	content: url(../img/shopping-bag-icon.svg) !important;
	vertical-align: top !important;
    display: inline-block !important;
	transition: filter .3s ease !important;
}

#c7wp-cart-box.header--alt:not(.header--scroll):not(.header--open) #c7-cart > a:before {
	filter: brightness(3) !important;
}

#c7wp-cart-box #c7-cart > a .c7-cart__count {
	vertical-align: top !important;
	display: inline-block !important;
}

.no-touch-device #c7wp-cart-box #c7-cart > a:hover .c7-cart__count {
	text-decoration: underline !important;
}

#c7wp-cart-box #c7-cart > a .c7-cart__total {
	display: none !important;
}






/* ==========================================================================
   Cart Drawer / Commerce7
   ========================================================================== */

#c7wp-cart-box #c7-cart #c7-side-cart {
	font-size: 14px !important;
	line-height: 135% !important;
    transition: all .4s cubic-bezier(.165,.84,.44,1) !important;
}

#c7wp-cart-box #c7-cart #c7-side-cart .c7-cart__close {
	font-size: 0 !important;
	border-color: transparent !important;
	z-index: 10 !important;
	transition: border .3s ease, transform .3s ease !important;
}

.no-touch-device #c7wp-cart-box #c7-cart #c7-side-cart .c7-cart__close:hover {
	transform: rotate(90deg) !important;
}

#c7wp-cart-box #c7-cart #c7-side-cart .c7-cart__close:before,
#c7wp-cart-box #c7-cart #c7-side-cart .c7-cart__close:after {
    width: 19px !important;
    height: 2px !important;
    content: '' !important;
    position: absolute !important;
    left: 50% !important;
    background: #999 !important;
	transform: translate(-50%, -50%) !important;
    transition: transform .3s ease, width .3s ease, left .3s ease, top .3s ease, bottom .3s ease, background .3s ease, opacity .3s ease !important;
    will-change: transform, left, top, bottom, background !important;
}

#c7wp-cart-box #c7-cart #c7-side-cart .c7-cart__close:before {
    top: calc(50% - 1px) !important;
    transform: translateX(-50%) rotate(135deg) !important;
}

#c7wp-cart-box #c7-cart #c7-side-cart .c7-cart__close:after {
    bottom: calc(50% - 1px) !important;
    transform: translateX(-50%) rotate(-135deg) !important;
}

.no-touch-device #c7wp-cart-box #c7-cart #c7-side-cart .c7-cart__close:hover:before,
.no-touch-device #c7wp-cart-box #c7-cart #c7-side-cart .c7-cart__close:hover:after {
    background: #111 !important;
}

#c7wp-cart-box #c7-cart #c7-side-cart h1#c7-cart-title {
	font-weight: 400 !important;
}

#c7wp-cart-box #c7-cart #c7-side-cart .c7-message--empty-cart,
#c7wp-cart-box #c7-cart #c7-side-cart .c7-cart__carrot {
	max-width: 100% !important;
}

#c7wp-cart-box #c7-cart #c7-side-cart .c7-message--empty-cart:before,
#c7wp-cart-box #c7-cart #c7-side-cart .c7-message--empty-cart:after {
    width: 19px !important;
    height: 2px !important;
    content: '' !important;
    position: absolute !important;
    left: 50% !important;
	top: auto;
	bottom: 0 !important;
	background-image: none !important;
    background: #999 !important;
	opacity: 1 !important;
	transform: translate(-50%, -50%) !important;
    transition: transform .3s ease, width .3s ease, left .3s ease, top .3s ease, bottom .3s ease, background .3s ease, opacity .3s ease !important;
    will-change: transform, left, top, bottom, background !important;
}

#c7wp-cart-box #c7-cart #c7-side-cart .c7-message--empty-cart:before {
    top: 38px !important;
    transform: translateX(-50%) rotate(180deg) !important;
}

#c7wp-cart-box #c7-cart #c7-side-cart .c7-message--empty-cart:after {
    top: 38px !important;
    transform: translateX(-50%) rotate(90deg) !important;
}

.no-touch-device #c7wp-cart-box #c7-cart #c7-side-cart .c7-message--empty-cart:hover:before {
    transform: translateX(-50%) rotate(270deg) !important;
}

.no-touch-device #c7wp-cart-box #c7-cart #c7-side-cart .c7-message--empty-cart:hover:after {
    transform: translateX(-50%) rotate(180deg) !important;
}

#c7wp-cart-box #c7-cart #c7-side-cart .c7-message--empty-cart p:before {
	width: 32px !important;
    height: 32px !important;
    line-height: 32px !important;
    content: '' !important;
	border: 1px solid #999 !important;
    position: absolute !important;
	top: -25px !important;
    left: 50% !important;
	border-radius: 50% !important;
	transform: translate(-50%, -50%) !important;
    transition: border .3s ease !important;
    will-change: border !important;
}

.no-touch-device #c7wp-cart-box #c7-cart #c7-side-cart .c7-message--empty-cart:hover p:before {
	border: 1px solid #111;
}

#c7wp-cart-box #c7-cart #c7-side-cart .c7-message--empty-cart a {
	font-weight: 400 !important;
	text-decoration: none !important;
}

#c7wp-cart-box #c7-cart #c7-side-cart .c7-button,
#c7wp-cart-box #c7-cart #c7-side-cart .c7-button-alt {
	padding: 1rem 1.5rem !important;
	font-family: inherit !important;
	font-size: 1rem !important;
    line-height: 1 !important;
	font-style: italic !important;
	transition: border .3s ease, background .3s ease !important;
}

#c7wp-cart-box #c7-cart #c7-side-cart .c7-button-alt-small {
	font-family: 'Roboto', sans-serif !important;
	transition: color .3s ease !important;
}

#c7wp-cart-box #c7-cart #c7-side-cart .c7-cart-items__quantity {
	padding-right: 3% !important;
}

#c7wp-cart-box #c7-cart #c7-side-cart .c7-cart-items__quantity input {
	font-family: 'Roboto', sans-serif !important;
}
#c7wp-cart-box #c7-cart #c7-side-cart .c7-cart-items__image {
	padding-right: 3% !important;
}

#c7wp-cart-box #c7-cart #c7-side-cart .c7-cart-items__title {
	font-size: 14px !important;
    line-height: 125% !important;
    font-weight: 700 !important;
}

#c7wp-cart-box #c7-cart #c7-side-cart .c7-cart-items__title .c7-cart-items__title__variant {
	padding-top: 0 !important;
}

#c7wp-cart-box #c7-cart #c7-side-cart .c7-cart-items__title a {
	color: #656445 !important;
}

.no-touch-device #c7wp-cart-box #c7-cart #c7-side-cart .c7-cart-items__title a:hover {
	color: #535233 !important;
}

#c7wp-cart-box #c7-cart #c7-side-cart .c7-cart-items__price span {
	color: #999 !important;
}

#c7wp-cart-box #c7-cart #c7-side-cart .c7-cart-summary__total div:last-child {
	font-size: 18px !important;
}

#c7wp-cart-box #c7-cart #c7-side-cart .c7-discount-amount {
	padding-top: 5px !important;
}