:root{
--ngold:#DA3;
--nocre:#630;
}
html,body,document{
max-width: 100vw;
overflow-x: hidden;
}
body{
font-family: 'Roboto Condensed',Helvetica, sans-serif;
text-align: left;
margin:0 0 0 0;
cursor:default;
font-size: 1vw;
}
input[type="button"],button{
border:none;
background:none;
font-size:1em;
cursor:pointer;
color:inherit;
}
img{
border:none;
}
a{
color: inherit;
text-decoration: none;
}
*[onclick],*[href]{
cursor: pointer;
}
textarea{
resize:none;
}
.clr{
clear:both;
}
.columnas2{
-webkit-column-count:2;
-moz-column-count:2;
column-count:2;
}
.columnas3{
-webkit-column-count:3;
-moz-column-count:3;
column-count:3;
}
.columnas4{
-webkit-column-count:4;
-moz-column-count:4;
column-count:4;
}
.columnas5{
-webkit-column-count:5;
-moz-column-count:5;
column-count:5;
}
.grid2{
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-gap: 0;
}
.grid3{
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-gap: 0;
}
.grid4{
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-gap: 0;
}
.grid5{
display: grid;
grid-template-columns: repeat(5, 1fr);
grid-gap: 0;
}
.flex{
display: flex;
flex-flow: row wrap;
align-content: space-between;
justify-content: space-between;
}
.flex>*{
flex-grow: 1;
flex-shrink: 1;
flex-basis: auto;
text-align: center;
}
.site_error>div{
margin: 0 auto;
padding: 0.5em;
color: #C44;
border:#C44 solid 1px;
background: #EDD;
text-align: center;
width: 50%;
min-width: 280px;
border-radius: 0.15em;
font-weight:600;
}
.site_error{
position: fixed;
top:-20em;
opacity: 0;
z-index: 10;
width: 100%;
-webkit-animation: siteError 5s 1;
-moz-animation: siteError 5s 1;
animation: siteError 5s 1;
}
.site_success>div{
margin: 0 auto;
padding: 0.5em;
color: #494;
border:#494 solid 1px;
background: #DED;
text-align: center;
width: 50%;
min-width: 280px;
border-radius: 0.15em;
font-weight:600;
}
.site_success{
position: fixed;
top:-20em;
opacity: 0;
z-index: 10;
width: 100%;
-webkit-animation: siteError 5s 1;
-moz-animation: siteError 5s 1;
animation: siteError 5s 1;
}
@keyframes siteError{
0%{opacity:1;top:5em;}
90%{opacity:1}
99%{opacity:0;top:5em;}
100%{opacity:0;top:-20em;}
}
.hide_me{
height: 0;
width: 0;
overflow: hidden;
opacity: 0;
font-size: 1px;
}
a,input,button,*[onclick],*[href]{
transition: all .25s ease-in-out;
cursor: pointer;
}
#wpadminbar{
opacity: 0;
}
#wpadminbar:hover{
opacity: 1;
}
html{
margin-top: 0 !important;
}
h1,h2,h3{
font-family: Poppins,Montserrat,sans-serif;
} body>header{
position: fixed;
top:1.5em;
left:0;
right: 0;
z-index: 100; background: white;
backdrop-filter: blur(3px);
box-shadow: rgba(0,0,0,0.15) 0 0 0.5em;
display: flex;
justify-content: space-between;
align-content: space-between;
align-items: center;
padding: 0.5em 2.5%;
}
#topbar{
position: fixed;
top:0;
left:0;
right: 0;
background: black;
z-index: 100;
color: white;
height: 2em;
line-height: 2em;
text-transform: uppercase;
font-family: Poppins,Lato,sans-serif;
letter-spacing: 0.2em;
text-align: center;
font-size: 0.8em;
}
#logo img{
display: block;
height: 5em;
}
menu,menu ul,menu li{
margin: 0;
padding: 0;
}
menu{
min-width: 55%;
}
menu ul{
display: flex;
justify-content: space-between;
align-content: space-between;
align-items: center;
}
menu li{
display: block;
text-transform: uppercase;
font-weight: 400;
}
menu li a:hover{
color:var(--nocre);
}
menu>div>ul>li>ul{
display: none;
height: 0;
width: 0;
overflow: visible;
position: relative;
left: -0.5em;
line-height: 1.5em;
}
menu>div>ul>li>ul ul{
margin: 0;
padding: 0;
font-size: 0.8em;
}
menu>div>ul>li:hover>ul{
display: block;
}
menu>div>ul>li>ul>li a{
display: block;
min-width: 14em;
line-height: 1.5em;
padding: 0.5em 1em;
background: #789;
color: white;
text-align: left;
}
menu>div>ul>li>ul>li a:hover{
padding-left: 1.25em;
padding-right: 0.75em;
background: black;
color:#789;
}
menu>div>ul>li>ul ul li a{
padding-left: 1.5em;
min-width: 17.5em;
background: rgba(230,160,15,0.9);
}
menu>div>ul>li>ul ul li a:hover{
padding-left: 1.75em;
padding-right: 0.75em;
}
#content{
min-height: 90vh;
margin-top: max(7.5vw,70px);
}
footer{
padding:5%;
background: #222;
color: #999;
gap:5%;
}
footer img{
max-width: 50% !important;
height: auto !important;
display: block;
margin: 0;
}
footer h4{
color:#D0D4D8;
text-transform: uppercase;
font-size: 1em;
margin:0 auto 0.5em auto;
font-weight: 600;
font-family: Lato,Montserrat,sans-serif;
}
footer ul,footer li{
margin: 0 0 0.5em;
padding: 0;
display: block;
}
footer li{
line-height: 1.25em;
font-weight: 400;
}
footer a:hover{
color:var(--ngold);
}
nav i.fa{
font-size: 1.5em;
}
nav>*{
display: inline-block;
margin-left: 1em;
}
nav a[data-count]:before{
content: attr(data-count);
position: absolute;
display: block;
background: #789;
color: white;
border-radius: 1em;
padding: 0.2em;
min-width: 1em;
line-height: 1em;
text-align: center;
border-bottom-left-radius: 0;
font:inherit;
font-weight: bold;
font-size: 0.75em;
translate: 1.5em -1.5em;
}
#subfooter{
background:black;
padding: 0.5em 5%;
color:#777;
font-weight: 200;
font-size: 0.8em;
text-align: center;
}
#subfooter h4{
margin: 0;
font-weight: 400;
letter-spacing: 0.1em;
}
#subfooter a{
color: #BBB;
}
h2{
font-size: 1.75em;
letter-spacing: 0.25em;
margin: 0 0 0.5em 0;
text-transform: uppercase;
}
h2 b{
font-weight: bold;
}
#contacto{
padding:2.5% 10%;
background: #666 url(https://dasalo.com.mx/wp-content/uploads/2025/02/dasalo2.jpg) center center no-repeat;
background-size: cover;
color:white;
}
#contacto div.grid2{
gap:1em;
}
form *:is(input,select,textarea){
box-sizing: border-box;
width: 100%;
padding: 0.5em;
font:inherit;
background: white;
display:block;
border:none;
box-shadow: rgba(0,0,0,0.3) 0 0 0 1px;
margin-bottom: 1em;
}
form button{
background: black;
font:inherit;
padding: 0.5em 2em;
color:white;
text-transform: uppercase;
font-size: 1.2em;
}
form button:hover{
background: var(--ngold);
color:black;
}
#contacto>div{
gap:5%;
}
#contacto ul{
margin: 0;
padding: 0;
}
#contacto li{
display: flex;
list-style: none;
justify-content: start;
align-content: start;
align-items: center;
}
#contacto li i.fa,#contact_social li svg{
font-size: 1.5em;
min-width: 1.5em;
text-align: center;
}
#contact_social{
text-align: right;
margin-top: 2em;
}
#contact_social ul,#social_menu ul{
display: flex;
justify-content: end;
align-content: end;
align-items: center;
}
#contact_social i.fa,#social_menu i.fa,#contact_social svg,#social_menu svg{
display: block;
width: 1em;
height: 1em;
line-height: 1em;
text-align: center;
padding: 0.25em;
background: white;
color: #222;
border-radius: 2em;
min-width: 0 !important;
margin-left: 0.5em;
font-size: 1.5em;
}
#home{
position: absolute;
z-index: 2;
top:30vw;
left: 0;
width: 50%;
padding: 0 5%;
}
#home h1{
font-weight: 400;
font-size: 1.75em;
letter-spacing: 0.2em;
}
#home h1::first-line{
font-size: 1.25em;
font-weight: 700;
letter-spacing: 0em;
}
#home>div{
margin-right: 20%;
gap:1em;
}
#home button{
box-shadow: black 0 0 0 3px inset;
font-family: Lato,Montserrar,sans-serif;
font-size: 1.5em;
padding: 0.5em;
text-transform: uppercase;
font-weight: 800;
}
#home button:first-child{
background: black;
color: white;
}
#home button:hover{
background: var(--ngold);
box-shadow: var(--ngold) 0 0 0 3px inset;
color: white;
}
.swiper-pagination{
text-align: right !important;
padding: 0 2.5%;
}
.homecarr img{
cursor: pointer;
transition:all 0.25s ease;
}
.homecarr img:hover{
opacity: 0.85;
}
#acercade img{
translate:0 -2em;
position: relative;
z-index: 2;
}
#colecciones_home{
background: linear-gradient(0deg,#EEE,#EEE) center 35% no-repeat;
background-size: 100% 50%;
}
#acercade img,#colecciones_home img{
box-shadow: rgba(0,0,0,0.3) 0 0.25em 0.5em;
}
#colecciones_home h3{
margin: 0.5em 0;
}
#single_header{
background: #666 url(//dasalo.com.mx/wp-content/themes/dasalo/images/contacto.jpg) center top fixed;
background-size: 100% auto;
padding: 15% 5% 10% 5%;
color: white;
text-align: center;
}
#single_header h1{
margin: 0;
font-size: 4em;
font-weight: 800;
text-transform: uppercase;
}
#single_header_new{
background: #EEE;
}
#single_header_new img{
max-width: 100%;
}
#single_header_new>div{
display: flex;
justify-content: center;
align-content: center;
align-items: center;
}
#single_header_new h1{
font-size: 2.5em;
text-transform: uppercase;
letter-spacing: 0.15em;
margin: 1em 1em 0 1em;
text-align: center;
text-wrap: balance;
font-weight: 200;
}
#single_header_new h1::first-line{
font-weight: bold;
}
#single_content{
padding: 2.5% 10%;
}
#single_content.legales{
padding: 5% 15%;
font-size: 1.2em;
}
.woocommerce span.onsale{
height: auto !important;
width: auto !important;
min-width: none;
min-height: 0;
line-height: 1.2em;
padding: 0.5em 1em;
border-radius: 0.5em !important;
background: var(--ngold);
font-family: Lato,Montserrat,sans-serif;
text-transform: uppercase;
font-weight: 400;
letter-spacing: 0.1em;
font-size: 0.7em;
}
.product h2{
font-size: 1.2em;
text-wrap: balance;
line-height: 1.2em;
min-height: 4.5em;
text-transform: none;
text-align: center;
letter-spacing: 0;
}
.product .price{
display: block;
text-align: center;
font-size: 1.25em !important;
}
.product .price del{
display: block !important;
color: #C33 !important;
opacity: 1 !important;
font-size: 0.7em;
}
.product a.button{
display: block;
box-sizing: border-box;
width: 100%;
background: #F8F8F8;
text-transform: uppercase;
font-family: Lato,Montserrat,sans-serif;
text-align: center;
font-size: 1em;
border-radius:0;
}
.summary{
text-align: left
}
.summary .button{
background: black !important;
margin-bottom: 1em !important;
}
.summary *:is(.button,input,select,textarea){
box-sizing: border-box;
width: 100% !important;
display: block;
border-radius: 0 !important;
}
.summary .button:hover{
background: var(--ngold) !important;
}
.woocommerce-product-details__short-description img{
display: none;
}
.woocommerce div.product form.cart div.quantity{
float: none !important;
}
.product .summary .price{
text-align: left;
}
.product .summary .price ins bdi{
font-size: 2em;
color: #222;
}
ins .woocommerce-Price-amount bdi{
font-size: 1.25em;
color: #222;
}
.woocommerce-product-details__short-description{
margin-bottom: 4em;
}
.woocommerce-product-details__short-description a{
display: none;
}
.sku_wrapper{
display: none;
}
.related.products{
clear: both;
width: 100%;
}
.related.products h2{
text-transform: uppercase;
font-size: 2em;
letter-spacing: 0.1em;
text-align: left;
padding-top: 0.5em;
border-top:#EEE solid 1px
}
.wc-block-components-button{
background: black;
color: white;
text-transform: uppercase;
transition: all 0.25s ease;
}
.wc-block-components-button:hover{
background: var(--ngold);
}
.single_add_to_cart_button{
margin-bottom: 1em !important;
} #modal{
background:rgba(0,0,0,0.8);
position:fixed;
display:none;
top:0;
left:0;
bottom:0;
right:0;
z-index:2000;
text-align:center;
}
#modal>div{
width: 100%;
height:100vh;
display: flex;
color: white;
align-items: center;
align-content: center;
justify-content: center;
font-size: 2em;
}
#modal form input[type="text"]{
border:white solid 2px;
padding: 0.25em;
border-radius: 0.25em;
box-sizing: border-box;
background: transparent;
display: inline-block;
width: 90%;
margin-right: 0.25em;
color: white;
}
#modal form input::placeholder{
color: white;
}
.sresult{
display: flex;
gap:1em;
padding: 0.5em;
border-top:#CCC dotted 1px;
}
.sresult img{
max-height: 4em;
max-width: 4em;
}
.sresult h4{
margin: 0.5em 0;
}
#whatsapp_link{
float: right;
position: fixed;
bottom: 1em;
right: 1em;
color: white;
z-index: 5;
}
#whatsapp_link>i.fa{
font-size: 3em;
background: #00ae41;
width: 1.4em;
height: 1.4em;
line-height: 1.4em;
border-radius: 2em;
text-align: center;
transition: all .25s ease-in-out;
}
#whatsapp_link>i.fa:hover{
background: white;
color: #49C87A;
box-shadow: #49C87A 0 0 0 3px;
}
#content>.alignwide{
padding: 10%;
box-sizing: border-box;
}
#content>.woocommerce{
padding: 10%;
box-sizing: border-box;
}
.woocommerce-MyAccount-navigation ul{
display: block;
}
.woocommerce-MyAccount-navigation li{
display: block;
list-style: none;
line-height: 2em;
font-size: 1.25em;
border-bottom: #CCC solid 1px;
padding: 0 1em;
}
.woocommerce-MyAccount-content{
padding: 1em;
border: #CCC solid 1px;
border-radius: 0.25em;
box-sizing: border-box;
}
.woocommerce-MyAccount-content a{
color: var(--nocre);
text-decoration: underline;
}
.buy_now_button{
color: white !important;
margin-top: 1em !important;
} .p-optin p{
display: none;
}
.p-optin input[type="checkbox"]{
display: inline-block !important;
width: auto !important;
}
.p-optin{
width: 100%;
max-width: none !important;
}
.wc-block-cart__empty-cart__title.with-empty-cart-icon::before {
display: none !important;
}
.wc-block-cart__empty-cart__title{
margin-top: 3em;
}
.swiper-wrapper{
transition-timing-function: linear !important;
} .mobile_only{
display:none !important;
}
@media all and (max-width:960px){
body{
font-size:14px;
}
.mobile_only{
display:block !important;
}
.desktop_only{
display:none !important;
}
.columnas2,.columnas3{
-webkit-column-count:1;
-moz-column-count:1;
column-count:1;
}
.columnas4{
-webkit-column-count:2;
-moz-column-count:2;
column-count:2;
}
.columnas5{
-webkit-column-count:3;
-moz-column-count:3;
column-count:3;
}
.grid2,.grid3,.grid4,.grid5,.flex{
display: block;
}
body>header{
height:60px;
padding: 0 10px;
background: white;
top:20px;
}
#topbar{
height: 20px;
line-height: 20px;
font-size: 2vw;
}
#menu_opener{
float:left;
margin: 5px;
width:50px;
height:50px;
border-radius: 3px;
}
#menu_opener>div{
height:2px;
margin: 4px auto 0 auto;
background: #CCC;
width: 36px;
}
#menu_opener>div:first-child{
margin-top: 14px;
}
#logo img{
height: 50px;
margin-left: 2.5em;
}
menu{
position: fixed;
top:60px;
left:0;
right: 0;
background: #EEE;
backdrop-filter: blur(5px);
padding: 2em;
display: block;
display: none;
box-shadow: rgba(0,0,0,0.3) 0 0.5em 0.5em;
}
menu ul{
display: block;
text-align: left;
}
menu li{
line-height: 2em;
margin-bottom: 1em;
}
menu>div>ul>li:has(ul)>a:after{
content:'\f078';
font-family: FontAwesome;
font-size: 0.65em;
display: inline-block;
margin-left: 0.5em;
translate: 0 -0.25em;
float: right;
}
menu>div>ul>li>ul{
display: block;
height: 0;
overflow: hidden;
width: auto;
}
menu>div>ul>li.opened>ul{
height: auto !important;
}
menu>div>ul>li.opened a:after{
rotate: 180deg;
}
menu>div>ul>li>ul>li{
margin-bottom: 0;
width: auto;
background: none;
}
menu>div>ul>li>ul>li a{
background: none;
color:#222;
padding-left: 1.5em;
border-top:#CCC solid 1px;
line-height: 2.5em;
}
#video_container video{
height: 100vw;
width: auto;
}
#home{
top:40vw;
}
#home h1,#single_header h1{
font-size: 4vw;
letter-spacing: 0;
}
#home h1{
margin-bottom: 2em;
}
#home p{
padding: 0;
font-size: 1em;
}
h2{
font-size: 1.5em !important;
line-height: 1.5em !important;
text-align: center !important;
}
.product h2{
font-size: 1em !important;
line-height: 1.2em !important;
}
h3{
font-size: 2em;
text-wrap: balance;
}
#acercade{
padding-top: 2em;
}
#acercade h2{
margin-bottom: 0;
}
#dasalo h4{
margin: 0;
font-size: 1.5em;
text-align: center;
}
.servicio .kt-inside-inner-col{
padding-top: 20em;
}
#contacto{
padding:1em;
}
#contacto h2{
font-size: 3em;
}
footer img{
margin: 1em auto;
}
#subfooter ul{
justify-content: start;
align-content: start;
margin:1.5em auto
}
#acercade img{
translate: 0 0;
}
#contact_social ul,#social_menu ul{
justify-content: center;
align-content: center;
}
#contact_social li i.fa{
font-size: 1.5em;
}
#contacto{
background: #45454F;
}
#contacto li{
font-size: 1em;
}
#social_menu ul li i.fa{
font-size: 1.5em;
}
#home{
width: 75%;	
}
#home button{
width: 100%;
font-size: 1em;
margin-bottom: 1em;
}
footer a{
line-height: 2em;
}
footer h4{
line-height: 2em;
}
footer img{
width: 30% !important;
margin-bottom: 1em auto 3em auto;
}
#single_header_new h1{
font-size: 4vw;
margin: 2em 0.5em;
}
.properties_last{
translate:25vw 0;
}
.footer_cols{
box-sizing: border-box;
width: 50%;
padding: 1em;
font-size: 0.8em;
float: left;
}
.footer_cols:nth-child(2){
padding-right: 2em;
border-right: #444 solid 1px;
}
#social_menu{
padding-top: 2em;
}
.row-image-select p{
font-size: 1em !important;
line-height: 1em !important;
font-family: inherit !important;
}
.wc-block-components-checkout-step__container{
max-width: 80vw !important;
}
#content>.woocommerce{
padding:10% 5%;
}
.wc-bacs-bank-details-account-name{
line-height: 1em;
font-size: 2em;
text-align: center;
}
.wc-bacs-bank-details{
font-size: 3em;
text-align: center;
color:#04A;
}
.wc-bacs-bank-details li{
float: none !important;
margin: 0 0 0.25em 0 !important;
padding: 0 !important;
}
.woocommerce ul.order_details{
margin: 0 !important;
padding: 0 !important;
}
#content>.woocommerce{
padding: 10% 5%;
}
.producto-item.slick-slide img{
display: block;
margin: 0 auto;
max-width: 70%;
}
.producto-item{
margin-top: 0 !important;
}
.producto-item del bdi{
color:#999 !important
}
.wc-block-cart__empty-cart__title{
font-size: 4vw !important;
text-wrap: balance !important;
word-break: keep-all !important;
}
#colecciones_home p a{
display: block;
background: black;
color: white;
padding: 0.5em;
margin-top: 0.5em;
border-radius: 0.5em;
}
}
.cookie-aviso {
position: fixed;
bottom: 0;
left: 0;
right: 0;
background-color: #333;
color: #fff;
padding: 1em;
text-align: center;
z-index: 1000;
display: none;
justify-content: space-between;
align-items: center;
}
.cookie-aviso a {
color: var(--ngold);
text-decoration: none;
}
.cookie-aviso a:hover {
text-decoration: underline;
}
.btn-aceptar {
background-color: var(--ngold);
color: #333;
border: none;
padding: 10px 20px;
cursor: pointer;
border-radius: 5px;
}
.btn-aceptar:hover {
background-color: white;
}
.carrusel-productos {
margin: 20px 0;
}
.producto-item {
padding: 10px;
text-align: center;
}
.producto-item img {
max-width: 100%;
height: auto;
border-radius: 8px;
}
.producto-item h3 {
font-size: 16px;
margin: 10px 0;
}
.producto-item .precio {
font-size: 14px;
color: #000;
font-weight: bold;
} .slick-prev:before,
.slick-next:before {
color: #000;
}
.slick-next,.slick-prev{
display: none !important;
}
.slick-dots{
display: flex;
justify-content: center;
align-content: center;
align-items: center;
}
.slick-dots li{
list-style: none;
display: block;
margin: 0 0.25em;
color: #CCC;
}
.slick-dots li.slick-active{
color: var(--nocre);
}