<!-- start Simple Custom CSS and JS -->
<style type="text/css">
* {
  box-sizing: border-box;
}

div#myBtnContainer {
    display: flex;
	padding: 1.5em 1.5rem !important;
	flex-wrap: wrap !important;
}

button.btn {
    margin: 4px !important;
    border-radius: 100px;
}

/* Center website */


.row {
  margin: 8px -16px;
}

/* Add padding BETWEEN each column (if you want) */
.row,
.row > .column {
  padding: 8px;
}

/* Create three equal columns that floats next to each other */
.column {
  float: left;
  display: none; /* Hide columns by default */
}



/* Clear floats after rows */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Content */
.content {

  padding: 10px;
}

/* The "show" class is added to the filtered elements */
.show {
	display: block;
	margin-bottom: -1px;
}

/* Style the buttons */
.btn {
  border: none;
  outline: none;
  padding: 2px 10px;
  background-color: white;
  cursor: pointer;
}

/* Add a grey background color on mouse-over */
.btn:hover {
  background-color: #ddd;
}

/* Add a dark background color to the active button */
.btn.active {
  background-color: #666;
   color: white;
}

.w-container {
max-width: 100vw !important
}


.row {
    margin: 0px 0px !important;
}

.section.drawer {

    margin-top: 3rem !Important;

}
@media only screen and (max-width: 600px) {
  /* Estilos solo para dispositivos con un ancho máximo de 600px (típicamente dispositivos móviles) */
  .btn {
    border: none;
    outline: none;
    padding: 8px 10px !important;
  }
}


/*Altura de gallery work en el movil*/

@media only screen and (max-width: 600px) {
.case-img-ratio {
    padding-top: 135% !important;
    position: relative;
	}}


div#mobileFilter {
	
	/*position: fixed;
    display: flex;
    justify-content: center;
    z-index: 2 !important;
    top: 9px;
    left: 8px;
    mix-blend-mode: difference;
    width: 100%;
    align-content: center;
    flex-wrap: wrap;
    align-items: center;
    flex-direction: row;
    margin-top: 12px;
    text-decoration-line: line-through;
    -webkit-text-decoration-line: line-through;
	color: white;
	
	padding-left: 0px;
	position: fixed;
	display: grid;
	overflow: hidden;
	width: 100%;
	z-index: 3;
	top: 0px;
	left: 8px;
	mix-blend-mode: difference !important;
	justify-content: center;
	align-items: center;
	justify-items: center;
	
    padding-left: 16px;
    position: fixed;
    overflow: hidden;
    z-index: 5;
	top: 0px;
	mix-blend-mode: difference !important; */
}


/*Para el filto de SO cambiar */
/* Reset CSS */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* Evitar estilos de selección por defecto */


select {
  outline: none !important;
}

select,
option {
  	-webkit-appearance: none;
  	-moz-appearance: none;
  	appearance: none;
	mix-blend-mode: difference !important;
    color: black !important;
}

/* Estilo personalizado para el elemento select */
.mobile-filter select {

    padding: 0px;
    border-radius: 0;
    background-color: #00000000;
    border: 0px;
    color: white !important;
}
	
/*
    padding: 21px 0px;

    border-radius: 0;
    background-color: #00000000;
    border: 0px;
    width: 100% !important;
    backdrop-filter: blur(10px) !important;
    color: white !important;
    text-align: center !important;
}
    /*padding: 6px 0px;
    border-radius: 0;
    background-color: #00000000;
    border: 0px;
    width: 100% !important;
    backdrop-filter: blur(10px) !important;
    color: white !important;
	text-align: center !important;*/
	

  /* Añade tus estilos personalizados aquí */
}

/* Estilo personalizado para las opciones del select */
.mobile-filter option {
	
	
  /* Añade tus estilos personalizados aquí */
}

.custom-select {
  position: relative;
  width: 100%;
}

.custom-select::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: black;
  opacity: 0.5; /* Ajusta la opacidad según tus preferencias */
  pointer-events: none; /* Esto permite hacer clic a través del fondo */
}

.selectionfullwidth {
	
 /* width: 100%;
  /*padding: 21px 0px 12px 18px !important;*/
 /* border: 1px solid #ccc;
  /*border-radius: 5px;
  color: white; /* Establece el color del texto en blanco */
  /*background-color: transparent; /* Hace que el fondo del select sea transparente */
}

select.selectionfullwidth {
    text-align: center !important;
	width: 100px;
	text-align-last:center !important;
}

/*Quitar el filtro de escriotrio en la version movil*/

@media only screen and (max-width: 600px) {
div#myBtnContainer {
    display: flex;
    padding: 1.5em 1.5rem !important;
    flex-wrap: wrap !important;
    display: none;
	}}


@media only screen and (max-width: 600px) {
.section.drawer {
	background-color:#ff000000 !important;
    margin-top: -10px !important;
	}}


div#w-node-_81a68d5a-a580-8772-84c7-92ec3427b487-8f8f7bbb {
    padding-top: 60px !important;
}

.column.Brand.events.show p {
    display: none;
}</style>
<!-- end Simple Custom CSS and JS -->
