/*
Theme Name: GeneratePress
Theme URI: https://generatepress.com
Author: Tom Usborne
Author URI: https://tomusborne.com
Description: GeneratePress is a lightweight WordPress theme built with a focus on speed and usability. Performance is important to us, which is why a fresh GeneratePress install adds less than 10kb (gzipped) to your page size. We take full advantage of the block editor (Gutenberg), which gives you more control over creating your content. If you use page builders, GeneratePress is the right theme for you. It is completely compatible with all major page builders, including Beaver Builder and Elementor. Thanks to our emphasis on WordPress coding standards, we can boast full compatibility with all well-coded plugins, including WooCommerce. GeneratePress is fully responsive, uses valid HTML/CSS, and is translated into over 25 languages by our amazing community of users. A few of our many features include 60+ color controls, powerful dynamic typography, 5 navigation locations, 5 sidebar layouts, dropdown menus (click or hover), and 9 widget areas. Learn more and check out our powerful premium version at https://generatepress.com
Version: 3.1.3
Requires at least: 5.2
Tested up to: 5.9
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: generatepress
Tags: two-columns, three-columns, one-column, right-sidebar, left-sidebar, footer-widgets, blog, e-commerce, flexible-header, full-width-template, buddypress, custom-header, custom-background, custom-menu, custom-colors, sticky-post, threaded-comments, translation-ready, rtl-language-support, featured-images, theme-options

GeneratePress, Copyright 2014-2022 EDGE22 Studios LTD.
GeneratePress is distributed under the terms of the GNU GPL

GeneratePress is based on Underscores http://underscores.me/, (C) 2012-2022 Automattic, Inc.

Actual CSS can be found in /assets/css/ folder.
*/

/* HEADER */

.header-info-icons figure{
	width: 24px !important;
	min-width: 24px !important;
}

#caja-busqueda input{
	padding: 10px 15px !important;
}

.top-menu > div {
	display: flex;
	flex-direction: row;
	justify-content: end;
}
.top-menu > div > div {
	width: auto !important;
}
.top-menu img {
	width: auto !important;
    height: 18px !important;
    margin-top: 7px !important;
}
.top-menu .top-menu-search {
	width: 450px !important
}

/* CONTACT FORM */
#contact-form p{
	margin-bottom: 0.5em;
}
#contact-form{
	color: white;
}
#contact-form input::placeholder,
#contact-form textarea::placeholder{
	color: white;
}
#contact-form input[type="text"], 
#contact-form input[type="email"], 
#contact-form input[type="url"], 
#contact-form input[type="password"], 
#contact-form input[type="search"], 
#contact-form input[type="tel"], 
#contact-form input[type="number"], 
#contact-form textarea, 
#contact-form select{
	font-size: 15px;
	font-weight: 600;
	font-family: "Montserrat";
	color: white;
	border: 1px solid rgb(107, 107, 107);
	background-color: rgba(255, 255, 255, 0.07);
}
#contact-form .wpcf7-spinner{
	display: none;
}
p:has(> .submit-button){
	margin-top: 0.5em;
	text-align: right;
}
.submit-button{
	font-size: 16px;
	font-weight: 700;
	font-family: "Montserrat";
}
#contact-form input[type="submit"]{
	background-color: rgba(255, 255, 255, 0.07);
}


/* FOOTER */
#footer-section a{
	color: #898989;
}
#footer-section a:hover{
	color: #B4FF01;
}


/* TIENDA */
#tienda{
	font-family: "Montserrat";
	color: white;
	margin-top: 75px;
}
#shop-sidebar-container{
	float: left;
	height: 100%;
}
#shop-sidebar{
	background-color: rgba(255, 255, 255, 0.07);
	margin-right: 50px;
	padding: 40px;
	padding-right: 50px;
	padding-left: 30px;
}
#shop-sidebar #filter-title{
	font-size: 16px;
	font-weight: 700;
	color: #B4FF01;
}
#shop-sidebar .title{
	font-size: 14px;
	font-weight: 700;
}
#shop-sidebar input[type="checkbox"]{
	margin-right: 10px;
	margin-bottom: 15px;
	width: 15px;
	height: 15px;
	accent-color: #B4FF01;
}
#shop-sidebar .sidebar-section{
	margin-top: 40px;
}
#shop-sidebar .sidebar-section .title{
	cursor: pointer;
}
#shop-sidebar .sidebar-options{
	margin-left: 15px;
}
#shop-sidebar .sidebar-section .sidebar-options{
	display:none;
}
#shop-sidebar .sidebar-section .sidebar-options.active{
	display: block;
}
#shop-sidebar label{
	font-size: 13px;
	font-weight: 700;
}
.album-target{
	background-color: #B4FF01;
	color: black;
	font-size: 13px;
	font-weight: 700;
	padding: 5px 10px;
}
.album-title{
	font-weight: 800;
	margin-top: 20px;
	margin-bottom: 0;
}
.team-category{
	font-weight: 600;
	color: rgb(241, 241, 241);
}
.album-info{
	margin-top: 20px;
	display: flex;
	justify-content: space-between;
}
.album-info .album-price{
	font-size: 22px;
	font-weight: 800;
}
.album-info .album-button{
	padding: 7px 15px;
	background: rgba(255, 255, 255, 0.15);
	font-weight:800;
	font-size: 16px;
}

#album-list{
	display: none;
}

#album-list .album-title{
	margin-top: 0;
}
#album-list .album-item{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	border-top: 1px solid white;
}
#album-list img{
	margin-top: 25px;
	max-width: 70%;
}
#album-list .album-text{
	grid-column: 2/4;
	display: grid;
	grid-template-rows: repeat(3, 1fr);
	padding: 20px 0;
}
#album-list .album-text .album-title{
	margin-right: 15px;
}
.row1{
	display: flex;
	justify-content: space-between;
}
#album-list > :first-child{
	border-top: none;
}
.row2{
	display: flex;
	font-size: 14px;
}
.row2 ul {
    list-style: none;
    margin-left: 15px;
    padding-left: 1em;
}
.row2 ul > li:before {
    display: inline-block;
    content: "-";
    width: 1em;
    margin-left: -1em;
}
#album-list .album-info{
	align-items: end;
}
#list-icon{
	filter: grayscale(100%);
}

/* TIENDA -> modal info */

/* The Modal (background) */
#modal-info,
#modal-process,
#modal-instructions,
#modal-promo-code
{
	display: none; /* Hidden by default */
	position: fixed; /* Stay in place */
	z-index: 1000; /* Sit on top */
	left: 0;
	top: 0;
	width: 100%; /* Full width */
	height: 100%; /* Full height */
	overflow: auto; /* Enable scroll if needed */
	background-color: rgb(0,0,0); /* Fallback color */
	background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
  background-color: #282C30;
  margin: 20px auto; /* 15% from the top and centered */
  padding: 15px 30px;
  width: 80%; /* Could be more or less, depending on screen size */
  position: relative;
}
.modal-text{
	/*padding: 20px 100px;*/
}
.modal .modal-text h3{
	font-size: 18px;
	font-weight: 700;
	margin-bottom: 5px;
}
.modal .modal-text hr{
	background-color: rgba(255, 255, 255, 0.25);
	width: 90%;
	margin: 40px auto;
}
.modal .modal-text p{
	font-size: 13px;
	font-weight: normal;
}


.steps{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-gap: 40px;
}
.steps .step-item{
	border: 1px solid rgba(255, 255, 255, 0.25);
	border-left: 10px solid #B4FF01;
	border-radius: 5px 0 0 5px;
	padding: 20px;
	margin: 2%;
}
.steps .step-item .step-content{
	display: flex;
}
.steps .step-item span{
	color: grey;
	font-size: 68px;
	font-weight: 800;
}
.steps .step-item .step-description{
	margin-left: 30px;
	margin-top: 10px;
}
.steps .step-item h6{
	font-size: 18px;
	font-weight: 700;
	margin-bottom: 5px;
}
.steps .step-item .step-images{
	display: flex;
	justify-content: space-between;
}
.steps .step-item img{
	max-height: 150px;
	width: auto;
	margin: auto;
}
.steps .step-item .step-images img{
	/*width: 47%;*/
	max-height: 150px;
	width: auto;
}
.modal-buttons{
	margin-top: 20px;
	text-align: center;
}
.modal-buttons button,
.modal-process-buttons button{
	padding: 7px 15px;
	background: rgba(255, 255, 255, 0.15);
	font-weight:800;
	font-size: 16px;
	margin: 15px;
}
.modal-process-buttons button:disabled{
	opacity: 0.3;
}
.modal-row{
	display: flex;
	justify-content: space-between;
	margin-top: 75px;
}
.modal-preview{
	width: 32%;
	text-align: right;
}
.modal-preview small{
	color: #ddd;
	font-size: 11px;
	font-weight: 600;
	margin-top: 20px;
}
.modal-customization{
	width: 60%;
}
.item-custom{
	margin-bottom: 20px;
}
.item-custom h6{
	font-weight: 700;
	font-size: 20px;
	padding: 15px 20px;
	border: 1px solid rgba(255, 255, 255, 0.25);
	border-left: 10px solid #B4FF01;
	border-radius: 4px 0 0 4px;
	margin: 0;
}
.item-custom .item-custom-options{
	border: 1px solid rgba(255, 255, 255, 0.25);
	border-top: none;
	padding: 20px 30px;
}
.item-custom input{
	margin-right: 10px;
}
.item-custom label{
	font-size: 14px;
	margin-right: 40px; 
}
.item-custom input[type="text"]{
	width: 100%;
	background-color: rgba(255, 255, 255, 0.15);
	border: none;
	font-size: 12px;
	color: white;
}
.modal-process-buttons{
	display: flex;
	justify-content: space-between;
}
.modal-process-buttons button{
	margin: 0;
	min-width: 150px;
}
.cards{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-gap: 15px;
	max-height: 350px;
	overflow-y: scroll;
}
.cards card{
	padding: 10px;
	border: 1px solid rgba(255, 255, 255, 0.25);
	text-align: center;
	position: relative;
}
.cards card span{
	font-size: 11px;
	font-weight: 600;
}
.cards card input{
	position: absolute;
	margin: 0;
	top: 15px;
	right: 15px;
}

/* The Close Button */
.close {
  	color: #282C30;
  	float: right;
  	font-size: 20px;
	background: white;
	border-radius: 50%;
	width: 30px;
	height: 30px;
	padding: 5px;
	text-align: center;
	line-height: 0;
	position: absolute;
	right: 20px;
	top: 20px;
}

.close:hover,
.close:focus {
  	text-decoration: none;
  	cursor: pointer;
}


/* carrousel */
.carrousel {
	display: flex;
	flex-direction: row;
	align-items: center;
	height: 100px;    
	padding: 110px 0px !important;
}
.carrousel .button-prev {
	position: absolute;
	left: -26px;
	top: 47%;
	color: white;
	font-size: 26px;
}
.carrousel .button-next {
	position: absolute;
	right: -26px;
	top: 47%;
	color: white;
	font-size: 26px;
}

.carrousel .carrousel-slide {
	width: 20%;
	position: relative;
	display: none;
	z-index: 1;
	opacity: 0.6;
	transition: all .5s ease-in-out;
}
.carrousel .carrousel-slide.visible {
	display: inline-block;
}
.carrousel .carrousel-slide.prev {
	transform: scale(1.25);
	z-index: 2;
	opacity: 0.8;
}
.carrousel .carrousel-slide.active {
	transform: scale(1.5);
	z-index: 3;
	opacity: 1.0;
}
.carrousel .carrousel-slide.next {
	transform: scale(1.25);
	z-index: 2;
	opacity: 0.8;
}
.slick-prev, .slick-prev:hover, .slick-prev:active {
	position: absolute;
	left: -28px;
	top: 50%;
	width: 20px;
    height: 20px;
	overflow: hidden;
	padding: 0px;
	transform: translate(0, -50%);
    cursor: pointer;
    color: transparent;
    border: none;
    outline: none;
    background: transparent;
}
.slick-prev:before {
	content: "<";
	color: white;
}

.slick-next, .slick-next:hover, .slick-next:active {
	position: absolute;
	right: -28px;
	top: 50%;
	width: 20px;
    height: 20px;
	overflow: hidden;
	padding: 0px;
	transform: translate(0, -50%);
    cursor: pointer;
    color: transparent;
    border: none;
    outline: none;
    background: transparent;
}
.slick-next:before {
	content: ">";
	color: white;
}
.slick-slide {
	transition: all .2s ease-in-out;
	position: relative;
}
.slick-track {
	padding-top: 100px;
	padding-bottom: 100px;
}
.slick-scale-1{
	transform: scale(1.25);
	z-index: 2;
}
.slick-scale-2{
	transform: scale(1.50);
	z-index: 3;
}
@media(max-width: 768px){
	.slick-prev {
		display: none !important;
	}
	.slick-next {
		display: none !important;
	}
}

/* REGISTRO E INICIO SESIÓN */

#sign-in-tab .elementor-tabs-wrapper{
	text-align: center;
	border-bottom: 1px solid rgba(255, 255, 255, 0.25);
}
#sign-in-tab .elementor-tab-title.elementor-active{
	border-bottom: 2px solid #B4FF01 !important;
}
#sign-in-tab .elementor-tab-content{
	padding: 50px !important;
}
#sign-in-tab span{
	display: block;
	text-align: right;
	font-size: 13px;
	margin: 20px 0;
	cursor: pointer;
}
form.sign-up .form-input{
	margin: 20px 0;
	display: flex;
	align-items: center;
}
form.sign-up img{
	width: 62px;
	padding: 13px 16px;
	border: 1px solid white;
	border-right: none;
	border-radius: 4px 0 0 4px;
}
form.sign-up input{
	font-family: "Montserrat";
	color: white;
}
form.sign-up input:focus{
	color: white !important;
	outline: 1px solid #B4FF01;
}
form.sign-up input[type="text"]{
	width: 100%;
	background: transparent;
	border-radius: 0 4px 4px 0;
	padding: 15px;
}
form.sign-up input[type="password"]{
	width: 100%;
	background: #D2D1D2;
	border-radius: 0 4px 4px 0;
	padding: 15px;
}
form.sign-up input::placeholder{
	color: white;
}
form.sign-up input[type="password"]::placeholder{
	color: grey;
}
form.sign-up input[type="submit"]{
	display: block;
	margin: 0 auto;
	font-weight: 700;
	font-size: 14px;
	margin-top: 50px;
	background-color: #5A5C5E;
}
form.sign-up .check-input{
	text-align: center;
}
form.sign-up label.check-label{
	font-size: 12px;
	color: #bbb;
	margin-left: 10px;
}
form.sign-up .remember-password{
	text-align: right;
}
form.sign-up .remember-password label.check-label{
	font-size: 16px;
}
form.sign-up hr{
	background-color: rgb(167, 167, 167);
	margin: 40px 0;
}
form.sign-up p.center{
	text-align: center;
	font-size: 18px;
	font-weight: 700;
	margin: 0;
	cursor: pointer;
}
.success {
	display: none;
    margin-top: 20px;
    background-color: #2d721c;
    padding: 10px;
    border-radius: 5px;
	text-align: center;
}
.error {
	display: none;
    margin-top: 20px;
    background-color: #721c24;
    padding: 10px;
    border-radius: 5px;
	text-align: center;
}

/* CHECKOUT */
#checkout{
	width: 100%;
	text-align: left;
	color: white;
	font-family: "Montserrat";
	padding: 20px;
}
#checkout h1{
	font-weight: 700; 
	font-size: 42px; 
	/*margin: 75px 0;*/
}
#checkout table th{
	font-size: 14px;
}
#checkout .table-title{
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 0px;
	padding: 15px 25px;
	background-color: #3D3F42;
	border-left: 12px solid #B4FF01;
	border-radius: 4px 4px 0 0;
	border-bottom: 1px solid #b5b5b5;
}
#checkout table{
	background-color:#3D3F42;
	padding: 20px;
}
#checkout table tr{
	padding: 0 20px;
}
#checkout table th,
#checkout table td{
	border: none;
	border-bottom: 1px solid #b5b5b5;
}
#checkout table img{
	max-width: 45%;
}
#checkout table td{
	font-size: 14px;
}
#checkout a{
	color: white;
	font-weight: 800;
	text-decoration: none;
}
#checkout a.delete-product{
	color: #3D3F42;
	padding: 1px 5px;
	background: white;
	border-radius: 50%;
	display: inline-block;
}
#checkout .step-1 button{
	font-weight: 700;
	font-size: 12px;
	padding: 5px 10px;
	background: rgb(107, 107, 107);
}
#checkout .step-2 h4{
	font-size: 20px;
	font-weight: 700;
}
#checkout .step-2 h4 span{
	color: #B4FF01;
}
#checkout .step-2-content{
	display: flex;
	justify-content: space-between;
	margin-top: 60px;
}
#checkout .step-2-content p{
	font-size: 18px;
	font-weight: 600;
}
#checkout .step-2-content span.right{
	font-size: 14px;
	display: block;
	text-align: right;
	font-weight: 600;
}
#checkout .step-2-content card{
	width: 45%;
	padding: 20px 0;
	background-color: #3D3F42;
}
#checkout .step-2-content .tabs{
	display: flex;
	border-bottom: 1px solid #b5b5b5;
}
#checkout .step-2-content .tabs h5{
	font-size: 18px;
	font-weight: 700;
	width: 50%;
	text-align: center;
	margin-bottom:0;
	padding-bottom: 20px;
	cursor: pointer;
}
#checkout .step-2-content .tabs h5.active{
	border-bottom: 2px solid #B4FF01;
}
#checkout .step-2-content #s2-sign-up,
#checkout .step-2-content #s2-sign-in,
#checkout .step-2-content #s2-guest,
#checkout .step-2-content #s2-loged
{
	padding: 60px;
}

#checkout #s2-products{
	padding-top: 0;
}
#checkout #s2-products h4{
	padding: 20px;
	font-size: 18px;
	font-weight: 700;
	margin-bottom: 0;
	border-bottom: 1px solid #b5b5b5;
	border-left: 12px solid #B4FF01;
}
#checkout #s2-products #s2-products-content{
	padding: 30px;
}
#checkout #s2-products .cart-item{
	display: flex;
	border-bottom: 1px solid #b5b5b5;
	padding: 10px 0;
}
#checkout #s2-products .cart-item img{
	margin-right: 15px;
	max-width: 50px;
	border-radius: 4px;
}
#checkout #s2-products .cart-item .item-content{
	display: grid;
	grid-gap: 10px;
	grid-template-columns: 70% 30%;
	grid-template-rows: auto auto;
}
#checkout #s2-products a.delete-product{	
	font-size: 14px;
	font-weight: 600;
	color: white;
	background: transparent;
	width: 120px;
}
#checkout #s2-products a.delete-product span{	
	color: #3D3F42;
	display: inline;
	padding: 1px 5px;
	background: white;
	font-size: 10px;
	border-radius: 50%;
	width: 16px;
	height: 16px;
}
#checkout .step-3 h4{
	font-size: 20px;
	font-weight: 700;
}
#checkout .step-3 h4 span{
	color: #B4FF01;
}
#checkout .step-3-content{
	display: flex;
	justify-content: space-between;
	margin-top: 60px;
}
#checkout .step-3-content card{
	width: 45%;
	background-color: #3D3F42;
}
#checkout .step-3-content .payment-title{
	padding: 20px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-bottom: 1px solid #b5b5b5;
	border-left: 12px solid #B4FF01;
}
#checkout .step-3-content .payment-title h5{
	font-size: 18px;
	font-weight: 700;
	margin-bottom: 0;
}
#checkout .step-3-content .payment-content{
	padding: 20px;
}
#checkout .step-3-content .payment-content p{
	font-size: 14px;
	font-weight: 600;
}
#checkout .step-3-content .payment-content .card-types{
	display: flex;
	justify-content: space-around;
	align-items: center;
	margin-top: 40px;
}
#checkout .step-3-content .payment-content .card-types img{
	max-width: 25%;
	border-radius: 5px;
}
#checkout .step-3-content .payment-content .card-number input::-webkit-inner-spin-button{
	display: none;
}
#checkout .steps-buttons{
	display: flex;
	justify-content: space-between;
	margin-top: 60px;
}
#checkout .steps-buttons button{
	padding: 7px 15px;
	background: #3D3F42;
	font-weight:800;
	font-size: 16px;
}
#checkout .steps-buttons button:disabled{
	opacity: 0.3;
}
#checkout .step{
	display: none;
}
#checkout .active-step{
	display: block;
}
#checkout #steps-tab{
	display: flex;
	width: 80%;
	margin: 0 auto;
	justify-content: center;
	margin-bottom: 50px;
	border-bottom: 1px solid #b5b5b5;
}
#checkout #steps-tab .active-step-tab{
	border-bottom: 2px solid #B4FF01;
}
#checkout #steps-tab h5{
	font-size: 18px;
	font-weight: 700;
	margin-bottom: 0;
	/*margin: 0 40px;*/
	padding: 20px;
	cursor: pointer;
}
#checkout .step-4 h2{
	color: #B4FF01;
	font-size: 36px;
	font-weight: 800;
}
#checkout .step-4 h3{
	font-size: 34px;
	font-weight: 800;
}
#checkout .step-4 h5{
	font-size: 22px;
	font-weight: 800;
}

/* MI COLECCIÓN */
#my-collection{
	font-family: "Montserrat";
	color: white;
	width: 100%;
}
#my-collection .banner{
	padding: 30px;
	background-image: url("/wp-content/uploads/2022/06/07.-Mi-coleccion-19.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	margin-bottom: 75px;
}
#my-collection .banner-title{
	display: flex;
	max-width: 1200px;
	margin: 0 auto;
}
#my-collection .banner-number{
	font-size: 136px;
	font-weight: 700;
	color: rgba(255, 255, 255, 0.2);
	margin-right: 40px;
}
#my-collection .banner-name h1{
	font-size: 40px;
	font-weight: 800;
	padding-top: 46px;
	margin: 0;
}
#my-collection .banner-name h1 span{
	font-size: 68px;
	color: #B4FF01;
}
#my-collection .container{
	max-width: 1200px;
	margin: 0 auto;
}
#collectionView,
#accountView h6,
.account-info,
.account-password
{
	background-color: #282C30;
}
#my-collection .main-content h6{
	font-weight: 700;
	font-size: 18px;
	padding: 15px 20px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.25);
	border-left: 10px solid #B4FF01;
	border-radius: 4px 4px 0 4px;
	margin: 0;
}
#my-collection .albums{
	padding: 20px;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-gap: 15px;
}
#my-collection .album{
	padding: 30px;
	background: black;
	border-radius: 4px;
	cursor: pointer;
}
#my-collection .card-images{
	display: flex;
	gap: 10px;
}
#my-collection .card-images img{
	width: 50%;
}
#my-collection .album-images{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-gap: 10px;
}
#my-collection .album-images img:first-child{
	grid-column: 1/3;
}
#my-collection .album-images div{
	display: flex;
	flex-wrap: wrap;
	align-content: space-between;
}
#my-collection .album-details{
	margin-top: 20px;
	display: flex;
	justify-content: space-between;
}
#my-collection .album-details small{
	padding: 2px 5px;
	font-weight: 600;
	background: #B4FF01;
	color: black;
	font-size: 12px;
	height: 20px;
}
#my-collection .album-details span{
	font-weight: 600;
	font-size: 16px;
}
#my-collection .album-info{
	display: block;
}
#my-collection .album-info h4{
	font-size: 18px;
	font-weight: 800;
	margin: 0;
}
#my-collection .album-info span{
	font-size: 14px;
	font-weight: 700;
	color: rgb(222, 222, 222);
}
#my-collection .buttons{
	margin: 20px;
	text-align: right;
}
#my-collection .buttons button{
	padding: 7px 15px;
	background: #494C4F;
	font-weight:800;
	font-size: 16px;
	margin: 0 5px;
}
#my-collection #modal-instructions .modal-content{
	max-width: 1300px;
}
#my-collection #modal-instructions .modal-text{
	padding: 0;
}
#my-collection #modal-instructions .steps img{
	width: 150px;
	display: block;
	margin: 0 auto;
}
#my-collection #modal-instructions .scheme{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
}
#my-collection #modal-instructions .scheme div{
	display: flex;
	flex-wrap: wrap;
	align-content: space-between;
}
#my-collection #modal-instructions .scheme div div{
	background: #555659;
	padding: 30px;
}
#my-collection #modal-instructions .scheme div span{
	color: black;
	padding: 3px 13px;
	background: #B4FF01;
	font-size: 14px;
	margin-bottom: 20px;
	font-weight: 700;
}
#my-collection #modal-instructions .scheme div p{
	font-size: 16px;
	font-weight: 600;
	margin: 0;
}
#my-collection #modal-instructions .scheme div p b{
	font-weight: 700;
}

#my-collection #modal-promo-code{
	text-align: center;
}
#my-collection #modal-promo-code .modal-content{
	max-width: 1300px;
}
#my-collection #modal-promo-code input{
	display: block;
	width: 90%;
	margin: 20px auto;
	background-color: #393B3E;
	border: 1px solid grey;
	color: white;
	text-align: center;
	font-size: 20px;
	font-weight: 700;
}
#my-collection #modal-promo-code input::placeholder{
	font-size: 22px;
	font-weight: 600;
	text-align: center;
}
#my-collection #modal-promo-code label{
	font-size: 16px;
	font-weight: 700;
}
#my-collection #modal-promo-code .modal-buttons{
	margin-top: 20px;
}

#my-collection .content{
	display: flex;
}
#my-collection aside{
	width: 200px;
	flex-shrink: 0;
	margin-right: 40px;
}
#my-collection aside h6{
	font-weight: 700;
	font-size: 18px;
	padding: 15px 20px;
	border-radius: 4px 4px 0 4px;
	margin: 0;
	color: grey;
	background:#282C30;
	cursor: pointer;
}
#my-collection aside h6:first-child{
	border-bottom: 1px solid rgba(255, 255, 255, 0.25);	
}
#my-collection aside h6.active{
	border-left: 10px solid #B4FF01;
	color: white;
}

#my-collection .account-info{
	display: flex;
	padding: 30px 60px;
	margin-bottom: 40px;
}
#my-collection .account-img{
	margin-right: 30px;
	max-width: 300px;
}
#my-collection .account-img h5{
	font-size: 14px;
	font-weight: 700;
	text-align: center;
	color: #dadada;
}
#my-collection .account-form form{
	display: grid;
	grid-gap: 20px 75px;
	grid-template-columns: repeat(2, 1fr);
	grid-template-areas: 
                       "a d"
                       "b e"
                       "c f";

}
#my-collection .account-form form #a{
	grid-area: a;
}
#my-collection .account-form form #b{
	grid-area:b;
}
#my-collection .account-form form #c{
	grid-area:c;

}
#my-collection .account-form form #d{
	grid-area:d;

}
#my-collection .account-form form #e{
	grid-area:e;

}
#my-collection .account-form form #f{
	grid-area:f;

}
#my-collection .account-form form .form-item img,
#my-collection .account-password form .form-item img{
	width: 14px;
	margin-right: 5px;
}
#my-collection .account-form form .form-item label,
#my-collection .account-password form .form-item label{
	font-size: 12px;
	font-weight: 700;
	margin-bottom: 5px;
}
#my-collection .account-form form .form-item input,
#my-collection .account-password form .form-item input{
	background-color: #393B3E;
	border: 1px solid grey;
	font-size: 12px;
	font-weight: 600;
	color: white;
	border-radius: 4px;
	width: 100%;
}
#my-collection .account-form button,
#my-collection .account-password button{
	padding: 7px 15px;
	background: #494C4F;
	font-weight:800;
	font-size: 16px;
	text-align: right;
	margin-top: 30px;
	display: block;
	margin-left: auto;
}
#my-collection .account-password{
	padding: 30px;
	padding-right: 60px;
}
#my-collection .account-password form{
	display: flex;
}
#my-collection .account-password form .form-item{
	margin-right: 75px;
}

.modal-preview-2 {
    display: none;
}
#checkout .step-1 .products-mobile {
    display: none;
}

/* menu movil */
#mobile-menu {
    display: none;
}

@media(max-width: 768px){
    
    #mobile-menu .menu {
        padding: 10px;
    }
    
    #mobile-menu .menu a {
        display: block;
        color: white;
        margin-bottom: 20px;
        font-weight: bold;
        padding: 5px;
    }
    
    #mobile-menu .menu hr {
        background-color: white;
        margin-bottom: 20px;
    }
    
    #my-collection aside {
        display: none;
    }
    #accountView {
        display: block !important;
        margin-top: 20px;
    }
    #my-collection .account-info {
        padding: 30px !important;
    }
    #my-collection .account-password {
        padding: 30px !important;
    }
    #my-collection .account-form {
        width: 100%;
    }
    #my-collection .account-form form {
        display: flex !important;
        flex-direction: column !important;
    }
    #my-collection .account-password form {
        flex-direction: column !important;
    }
    #my-collection .account-password form .form-item {
        margin-right: 0px;
    }
    .buttons button {
        display: block;
        width: 100%;
        margin-top: 5px !important;
    }
    #my-collection .albums {
        grid-template-columns: repeat(1, 1fr);
    }
    .steps {
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 0px;
    }
    .steps .step-item span {
        display: none;
    }
    .steps .step-item .step-description {
        margin: 0px;
    }
    .modal-content {
        width: 100%;
        margin: 0px;
    }
    .modal .modal-text h3 {
        margin-top: 10px;
        margin-bottom: 20px;
    }
    .modal-preview {
        display: none;
    }
    .modal-preview-2 {
        display: block;
    }
    .modal-customization {
        width: 100%;
    }
    .modal-album-row {
        flex-direction: column;
    }
    .item-custom-options.cards {
        grid-template-columns: repeat(2, 1fr);
    }
    .banner-number {
        display: none;
    }
    #my-collection #modal-instructions .scheme {
        grid-template-columns: repeat(1, 1fr);
    }
    #my-collection #modal-instructions img {
        display: none;
    }
    #checkout #steps-tab h5 {
        display: none;
    }
    #checkout #steps-tab .active-step-tab {
        display: block;
    }
    #checkout .step-1 .products-grid {
        display: none;
    }
    #checkout .step-1 .products-mobile {
        display: block;
        background-color: #3D3F42;
        padding: 20px;
    }
    #checkout .step-1 .products-mobile .options {
        display: flex;
        margin-top: 20px;
    }
    #checkout .step-2-content card {
        width: 100%;
    }
    #checkout .step-2-content #s2-products {
        display: none;
    }
    #checkout .step-2-content #s2-sign-up {
        padding: 20px;
    }
    #checkout .step-2-content #s2-sign-in {
        padding: 20px;
    }
    #checkout .step-2-content #s2-guest {
        padding: 20px;
    }
    #checkout .step-3-content card {
        width: 100%;
    }
}



.album-popup {
	background-color: #1D2025;
	display: none;
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 100;
}
.album-popup .album-popup-close {
	position: absolute;
	top: 0px;
	right: 10px;
	z-index: 101;
	color: white;
    padding: 5px 5px 0px 5px;
    background-color: rgba(0,0,0,0.4);
}
.album-popup .album-popup-close:hover {
	color: var(--accent);
}
.album-popup iframe {
	border: 0;
	width: 100%;
	height: 100%;
}

/* TIENDA DISPONIBLE PRÓXIMAMENTE */
.menu-tienda a{
	color: grey !important;
	cursor: not-allowed;
}


.wpcf7-response-output {
	color: white;
}