/var/www/clients/client1/web2/web/latynfusion/2024_borrar/css
Edit: /var/www/clients/client1/web2/web/latynfusion/2024_borrar/css/main.scss (40795B)
* {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
@import url('https://fonts.googleapis.com/css2?family=Bai+Jamjuree:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;1,200;1,300;1,400;1,500;1,600;1,700&display=swap');
$font1:"Bai Jamjuree", sans-serif;
$font2:"Bai Jamjuree", sans-serif;
$font3:"Bai Jamjuree", sans-serif;
$naranja:rgb(247,146,30);
$gris:rgba(105, 105, 105, 1);
$violeta:rgb(247,146,30);
$violeta2:rgb(247,146,30);
$gris2:rgba(217, 217, 217, 1);
$naranja2:#dd6003;
$verde:rgba(141, 198, 63, 1);
$verde2:rgba(60, 153, 0, 1);
$amarillo:#ffc233;
a, select, button, input, textarea{outline:none;}
.trans{-moz-transition: all 0.3s ease-in;
-webkit-transition: 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;}
body{padding:0; margin:0; font-family:$font1;}
.clear{clear:both;}
h1, h2, h3, h4, p, ul, li{padding:0; margin:0;}
li{list-style:none;}
a, a:hover{text-decoration:none; outline:0;}
.left{float:left;}
.right{float:right;}
.navbar-inverse{background-color:transparent; background-image:none; border:none;}
.navbar-brand{padding:6px 0 0 15px;}
.navbar-collapse{padding-right:0;}
.navbar{min-height:62px;}
.navbar-inverse .navbar-brand, .navbar-inverse .navbar-nav > li > a{text-shadow:none; color:#000; text-transform:uppercase; font-size:15px; font-weight:600;}
.navbar-inverse .navbar-nav > li{border-right:none;}
.navbar-nav{float:right;}
.navbar-inverse .navbar-nav > .open > a:focus{background-color:$violeta;}
.navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .active > a{font-weight:bold; background-color:$violeta; background-image:none; box-shadow:none;}
.navbar-nav > li > .dropdown-menu{background-color:#fff; border-radius:none;
a{color:#fff;}
}
.dropdown-menu li{border-bottom:solid 1px #fff!important;}
.navbar-nav > li > .dropdown-menu a:hover{background-color:transparent;}
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus{background-color:transparent!important;}
.dropdown-menu{padding:10px; border:none; box-shadow:none;
li{border-bottom:solid 1px #C10073;}
li:last-child{border:none;}
span{color:#000;}
}
.navbar{border-top:solid 4px $verde!important;}
.carousel1{margin-top:66px;}
.navbar-nav{float:none; text-align:right;
li{float:none; display:inline-block; }
}
.linkredes{padding:17px 10px 17px 10px !important;}
.dropdown-menu > li > a:hover{color:#fff!important; opacity:0.8;}
.navbar-nav > li > a{padding-top:22px; padding-bottom:20px; font-size:17px; display:block; @extend .trans;}
.navbar-inverse .navbar-nav > li > a:hover{background-color:#fff; color:$verde;}
.navbar{border-top:none;}
.dropdown-menu > li > a{padding:5px;}
.dropdown-menu > li > a:hover{color:#000; background-image:none;}
.bx-wrapper .bx-pager.bx-default-pager a{display:none!important;}
@media (max-width: 420px) {
.navbar-nav{float:none;}
.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form{border:none;}
.navbar-collapse{box-shadow:none;}
.navbar-nav > li > a{padding:10px 10px 5px 14px;}
.navbar-toggle{margin-top:14px; border:none; background-color:transparent;}
.redes{display:inline-block!important; border:none!important;}
.navbar-inverse .navbar-toggle .icon-bar{background-color:#fff;}
#slider-wrapper{margin-top:62px;}
.bx-wrapper .bx-controls-direction a{display:none;}
.mapa1 img{margin-top:33px; display:block;}
.mod1 h1{font-size:18px; margin-bottom:21px;}
.mod1 .col-md-7{font-size:15px;}
}
#slider-wrapper li{cursor:pointer;}
.mapa{height:721px; width:100%;}
.mapa1{padding:160px 0 160px 0;
h1{color:$naranja; font-family:$font2; text-transform:uppercase; font-size:39px;}
h2{color:$naranja; font-family:$font2; font-weight:600; font-size:45px; margin-bottom:21px; text-transform:uppercase;}
p{color:#fff;}
@media (max-width: 420px) {
padding:45px 0 45px 0;
}
}
.mod1{padding:114px 0 124px 0; background-image:url(../img2/FDO_ACERCA.jpg); background-repeat:no-repeat; background-position:top right;
h1{color:$violeta; font-size:21px; font-weight:300; margin-bottom:21px;
span{font-weight:bold; display:block;}
}
.col-md-7{font-size:18px; color:$gris; font-family:$font2; font-weight:300;}
.col-md-6{padding-top:33px;
h2{font-size:22px; color:$violeta2; font-weight:bold; margin-bottom:10px; border-bottom:solid 1px $violeta2; margin-top:21px; padding-bottom:10px;}
p{font-size:14px; font-weight:300;}
}
p{font-size:15px;}
}
.productos{
h1{color:#fff; background-color:$violeta; text-align:center; padding:21px 21px 10px 21px; font-weight:300; font-size:21px; margin-bottom:33px;
span{font-weight:700;}
}
h2{font-size:28px; font-weight:bold; color:$violeta2; border-bottom:solid 1px $gris; padding:0 0 10px 0; margin-bottom:10px;}
p{color:$gris; font-weight:300; font-size:14px; height:185px; padding-bottom:21px;}
.botones{padding-bottom:21px;
ul{padding-bottom:15px;}
li{margin:0 0 10px 0; display:inline-block;
img{margin:0 3px 0 0;}
a{color:$violeta; font-size:22px; padding:10px 15px 5px 15px; @extend .trans;}
a:hover{background-color:$violeta; color:#fff;
img{filter:brightness(0) invert(1);}
}
}
li:last-child{display:none;}
}
.pad{padding-top:33px;}
.repuestos{padding-top:33px; text-align:center; padding-bottom:33px;
.foto{display:block; margin:10px auto 15px auto;}
}
.col-md-6{border-bottom:dashed 1px rgba(0,0,0,0.1); height:551px;}
.grilla{
h3{color:$violeta; text-align:center; margin-bottom:15px;}
a{color:#fff; font-size:18px; border-radius:6px; font-size:18px; background-color:$violeta; width:150px; font-family:$font1; margin:auto auto 31px auto; text-align:center; display:block; padding:10px 15px 7px 15px; @extend .trans;}
a:hover{background-color:$violeta2;}
img{width:100px; display:block; margin:auto;}
.borde{border-left:solid 1px rgba(0,0,0,0.1); border-right:solid 1px rgba(0,0,0,0.1);}
.col-md-4{margin-bottom:45px;}
}
}
.banner{padding:45px;
.banner2{color:#fff; background-color:$violeta; border-radius:10px; font-size:21px; padding:15px 21px 15px 21px; font-weight:bold; display:block; margin:auto; margin-top:31px; text-align:center; width:501px; @extend .trans;}
.banner2:hover{background-color:$violeta2;}
p{font-size:33px; font-weight:300; line-height:31px; text-align:center; padding:12px 0 21px 0;
span{display:block;}
}
img{display:block; margin:auto;}
ul{text-align:center;
li{display:inline-block; padding:21px; color:#fff; font-size:18px;}
a{color:#fff;}
a:hover{opacity:0.8;}
p{font-size:22px; line-height:22px;}
}
.iconogarantia{position:absolute; top:15px; left:15px;}
}
.banners{
background-image:url(../img2/fdo_contacto.jpg); background-size:cover; background-repeat:no-repeat; color:#fff; margin-top:45px;
.borde1{border-right:solid 1px #fff; height:345px;}
.borde2{border-left:solid 1px #fff; height:345px;}
}
.cabcategorias{
padding:45px 45px 0 45px; color:#fff; text-align:center; position:relative; background-size:cover; margin-top:67px;
h1{letter-spacing:4px; font-size:18px; font-weight:300;}
h2{font-size:28px; font-weight:300; color:$verde2; border-bottom:solid 1px $verde; padding-bottom:33px; margin-bottom:20px;
span{font-weight:600;}
}
}
.detalleprod{padding-bottom:60px; border-bottom:solid 1px rgba(0,0,0,0.1); margin-bottom:21px;
h1{color:$violeta; font-weight:bold; font-size:26px; padding-bottom:12px;
span{font-size:14px;}
}
p{font-size:15px; margin-bottom:31px; font-weight:300;}
.botonmanual{width:200px; display:block; border-radius:6px; border:solid 1px $violeta; background-image:url(../img2/2020/ico_manual.svg); background-repeat:no-repeat; padding:14px 12px 6px 49px; color:$violeta; font-size:16px; margin:61px auto 31px auto; background-position:9px 7px; @extend .trans;}
.botonmanual:hover{background-color:rgba(0,0,0,0.1); color:$violeta;}
.grilla{
.item1{font-weight:bold; border-bottom:solid 1px rgba(0,0,0,0.1);}
.item2{border-bottom:dashed 1px rgba(0,0,0,0.1); padding:11px 0 3px 0; font-weight:300;}
.precio{text-align:right;}
}
.adquirir{
padding:16px 12px 12px 12px; background-color:rgba(0,0,0,0.1); margin-top:21px; position:relative;
p{font-weight:bold; margin-bottom:15px; font-size:21px; text-align:center; line-height:21px;}
a{color:#fff; font-weight:bold; padding:10px 15px 7px 15px; display:block; font-size:16px; background-color:$violeta; border-radius:6px; text-align:center; @extend .trans;}
a:hover{background-color:$violeta2;}
ul{
text-align:center;
li{display:inline-block; width:45%;}
}
.bullet{position:absolute; top:-6px; left:0; right:0; margin:auto; width:22px;}
}
}
.volver{
text-align:right; padding-bottom:45px;
a{color:$violeta; font-size:16px; font-weight:bold;}
a:hover{color:$violeta2;}
}
.volverlistado{position:absolute; right:0; bottom:-21px; background-color:$violeta; color:#fff; font-size:16px; border-radius:21px 0 0 21px; padding:12px 12px 8px 16px; font-weight:bold;
a{color:#fff;}
a:hover{opacity:0.8;}
}
.postventa h1{margin:69px 0 10px 0; font-weight:bold; color:#003E5F; font-size:28px; border-bottom:solid 1px #C9C9C9; padding:0 0 5px 0;}
.postventa h2{background-color:rgba(215, 234, 185, 0.35); color:$verde; text-align:center; padding:15px; text-transform:uppercase; margin:33px 0 10px 0; font-weight:500; font-size:19px;}
.postventa p{font-size:15px;}
.postventa input[type="text"], .postventa input[type="email"], textarea{border:none; font-size:15px; border-bottom:solid 1px rgba(0,0,0,0.1); color:$gris; padding:5px; width:100%; margin:0 0 10px 0;}
.postventa .ticket{margin:0 0 10px 0;}
.postventa select{border:none; border-bottom:solid 1px rgba(0,0,0,0.1); padding:5px; font-size:15px; width:100%; margin:0 0 10px 0; -webkit-appearance: none;
-moz-appearance: none;
appearance: none; background-image:url(../img/dropdown.png); background-repeat:no-repeat; background-position:97%;}
.postventa .col-md-12{padding-top:0px;}
.postventa{padding-bottom:45px; font-size:15px!important;
input[type="submit"], input[type="button"]{background-color:$verde; color:#fff; border-radius:14px; font-size:20px; border:none; background-image:url(../img/flecha_enviar.jpg); background-repeat:no-repeat; background-position:right; text-align:center; display:block; margin:auto; padding:15px 31px 15px 31px; @extend .trans;}
input[type="submit"]:hover, input[type="button"]:hover{background-color:$verde2;}
}
.titulopost{text-align:center; font-weight:300; font-size:21px!important;}
.postventa .row{margin-left:0;}
.postventa input::placeholder{color:#000;}
.postventa .gris{background-color:rgba(245, 245, 245, 1); padding:33px;}
.carousel1{margin-bottom:45px;}
footer{
background-color:rgba(25, 26, 26, 1);
}
.videohome{margin-top:62px;}
.mapa2{
position:relative; background-color:rgba(60, 153, 0, 1); padding-top:120px; padding-bottom:45px;
h2{color:#fff; font-size:16px; margin-bottom:15px;}
p{color:#fff; line-height:25px; margin-bottom:20px;}
a{color:#fff; font-size:16px; font-weight:600; width:120px; display:block; text-align:center; border:solid 1px #fff; border-radius:12px; padding:12px; @extend .trans;}
a:hover{background-color:#fff; color:$verde;}
.contacto{
.contacto2{padding:15px 0 15px 0;
h1{color:#fff; margin-bottom:15px; text-transform:uppercase; font-size:33px; font-family:$font3; background: rgba(215, 234, 185, 0.35); padding:15px; text-align:center; font-weight:600; color:$verde;
span{font-weight:400;}
}
input[type="text"], input[type="email"], textarea{border:none; font-size:15px; width:100%; margin-bottom:10px; color:$gris; padding:10px; background-color:transparent; border-bottom:solid 1px $verde;}
input[type="submit"], input[type="button"]{border:none; background-color:$verde; color:#fff; display:block; margin:auto; font-size:18px; border-radius:33px; padding:10px 22px 10px 22px; border:solid 1px $verde; font-weight:600; text-transform:uppercase; @extend .trans;}
input[type="submit"]:hover, input[type="button"]:hover{background-color:$verde2;}
}
.sumate{
background-color:rgb(51,51,51); padding:20px; position:relative;
h1{color:$naranja; font-size:19px; text-transform:uppercase; font-family:$font2;}
p{color:#fff; margin:5px 0 5px 0; padding:0 60px 0 0;}
a{color:$naranja;}
a:hover{color:#fff;}
.icono{position:absolute; right:-45px; top:9px;}
}
}
.borde{border-right:solid 1px #fff; border-left:solid 1px #fff;}
.col-md-4{padding-top:20px; padding-bottom:20px; padding-left:33px;}
}
.descarga{
padding:15px; text-align:center; margin-top:31px; color:$gris; border-top:solid 1px rgba(0,0,0,0.1); font-weight:300; margin-bottom:33px;
h1{font-size:26px; color:$gris; margin-bottom:15px; font-weight:300;}
a{color:#fff; background-color:$violeta; border-radius:10px; font-size:21px; padding:15px 21px 15px 21px; font-weight:bold; display:inline-block; margin:0 10px 0 0; text-align:center; width:300px; @extend .trans;}
a:hover{background-color:$violeta2;}
}
.carousel3{
img{width:auto!important; display:inherit!important;}
}
div.tooltip-inner {
width: 350px;
}
@media (max-width: 420px) {
/*.mapa2 .contacto{position:relative; left:auto; top:auto; width:100%;}*/
.mapa2 .icono{display:none;}
}
.pie{
background-color:$violeta2; padding:20px 20px 15px 20px; color:#fff;
a{color:#fff;}
.col-md-8{font-size:11px;}
.right, .left{width:50%;}
.right{text-align:right; font-size:11px; line-height:14px;
a{display:block;}
a:hover{opacity:0.8;}
}
.col-md-6{text-align:center;}
ul{text-align:right;
li{display:inline-block;}
.borde{border-right:solid 1px #fff; padding:0 10px 0 0px; margin-right:10px;}
img{@extend .trans;}
img:hover{opacity:0.8;}
}
@media (max-width: 420px) {
.right, .left{float:none; width:100%; text-align:center; margin-bottom:10px;}
}
}
::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
color: $gris;
opacity: 1; /* Firefox */
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
color: #fff;
}
::-ms-input-placeholder { /* Microsoft Edge */
color: #fff;
}
.fotodistribuidores{margin-top:67px; background-color:$violeta; padding:45px;
h1{color:#fff; text-align:center; font-weight:300;
span{font-weight:bold;}
}
}
.tiendaslistado{background-image:url(../img/fondo.png);
.col-md-4{}
color:$violeta; padding-top:31px; padding-bottom:31px;
h2{font-size:15px; margin:0 0 5px 0; font-weight:bold; color:#000; text-transform:uppercase;}
h3{font-size:22px; color:$violeta; font-weight:normal; margin-bottom:10px; border-bottom:solid 1px #EAE8E9; padding-bottom:10px; text-transform:uppercase;}
p{font-weight:normal; font-size:16px;}
a{width:101px; display:block; background-color:$violeta; color:#fff; padding:10px 10px 5px 10px; text-transform:uppercase; text-align:center; margin-top:10px; margin-bottom:51px; @extend .trans;}
a:hover{background-color:#303030;}
select{
border:none; padding:10px 43px 10px 10px; color:#303030; font-size:16px; background-image:url(../img/flecha_naranja.png); background-repeat:no-repeat; background-position:95%; -webkit-appearance: none;
-moz-appearance: none;
appearance: none; margin-bottom:33px; background-color:#EAE8E9;
}
option{
background-color:#fff; color:#303030; font-family:arial;
}
@media (max-width: 420px) {
select{padding-right:8px;}
}
}
.modinstagram{text-align:center; margin-top:31px; border-bottom:solid 1px rgba(0, 0, 0, 0.1); font-size:31px; padding-bottom:10px; margin-bottom:31px;}
.instagram{margin-bottom:31px;}
.botoncomprar{background-color:$violeta; color:#fff; padding:15px 15px 10px 15px; font-size:16px; border-radius:6px;}
.botoncomprar:hover{opacity:0.8; color:#fff;}
.modalredes{position:fixed; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,0.8); z-index:999999999;}
.redespop{position:absolute; top:100px; width:778px; background-image:url(../img2/redes/fdo_popup.jpg); left:0; right:0; margin:auto; height:432px; padding:21px; color:#fff; text-align:center; padding:80px 0 0 245px;
ul{text-align:center;
li{display:inline-block; margin:5px;}
img:hover{@extend .trans;}
img:hover{opacity:0.8;}
}
h1{margin:10px 0 10px 0; font-weight:normal;}
h2{font-weight:300; font-size:21px; margin-bottom:10px;
span{display:block;}
}
.x{position:absolute; top:10px; right:15px; color:#fff; cursor:pointer; font-size:21px;}
}
.slick-prev{position:absolute; top:45%; left:1px; width:16px; height:51px; border:none; background-color:transparent; border-radius:0px; color:transparent; z-index:9; background-repeat:no-repeat; background-image:url("../img3/flechaizq.png"); background-size:10px; background-position:center; width:36px;}
.slick-next{position:absolute; top:45%; right:5px; width:16px; height:51px; border:none; background-color:transparent; border-radius:0px; z-index:9; background-repeat:no-repeat; color:transparent; background-image:url("../img3/flechader.png"); background-size:10px; background-position:center; width:36px;}
.slick-dots {
position: absolute;
bottom: -33px;
left: 0;
right: 0;
width: 100%;
text-align: center;
padding-right: 31px;
}
.slick-dots li {
display: inline-block;
margin-left: 6px;
}
.slick-dots li button {
border: solid 1px $violeta;
padding: 5px;
background-color: #fff;
color: transparent;
width: 21px;
height: 21px;
border-radius: 60px;
}
.slick-dots .slick-active button {
background-color: $violeta;
border:solid 1px $violeta;
}
.slick-prev:hover, .slick-next:hover{opacity:0.8;}
.carousel1 img, .slick-slide img{width:100%;}
button::-moz-focus-inner{border:none!important;}
.dropdown-menu{min-width:433px; left:-126px; border-bottom:solid 6px $verde; padding-top:33px; padding-bottom:21px;
li{display:inline-block; vertical-align:top; text-align:center; border:none; font-size:28px; border:none!important; width:200px; color:#fff;
img{display:inline; width:100px; vertical-align:middle; float:left; margin-top:-20px;}
span{display:block;}
a{font-weight:400;}
}
.tituloagua{
h1{color:$verde; font-size:18px; font-weight:300; margin-bottom:15px;}
.bold{display:inline!important; font-weight:bold; color:$verde;}
.enter{display:block;}
a{color:$verde!important; font-size:15px; line-height:15px!important; margin-left:15px;}
a:hover{color:$verde!important; opacity:0.8;}
}
.titulogas{
h1{color:$naranja; font-size:18px; font-weight:300; margin-bottom:15px;}
.bold{display:inline!important; font-weight:bold; color:$naranja;}
.enter{display:block;}
a{color:$naranja!important; font-size:15px; line-height:15px!important; margin-left:15px;}
a:hover{color:$naranja!important; opacity:0.8;}
}
.vertodos{display:block; font-size:16px; text-align:center; width:100%; border-top:solid 1px #562854!important; margin-top:15px; padding-top:12px;
a{display:block; text-align:center; background-color:#562854; color:#fff; font-size:18px; width:200px; padding:12px 12px 8px 12px; margin:auto;}
a:hover{background-color:$violeta2;}
}
.borde{border-left:solid 1px $gris!important; margin-right:6px; padding-top:0px; padding-bottom:61px;}
}
@media only screen and (min-width: 768px) {
.dropdown:hover .dropdown-menu {
display: block;
}
}
.graciaspost{font-size:21px; text-align:center; padding:31px 31px 100px 31px;}
.preciorepuestos{font-size:21px; text-align:center; padding:12px;}
.gracias2{padding-bottom:45px;
h1{color:$violeta; font-size:27px; text-align:center; font-weight:bold;}
h2{color:$gris; font-size:18px; margin:6px 0 0 0; text-align:center;}
h3{color:$violeta; font-size:27px; text-align:center; font-weight:bold;}
img{display:block; margin:31px auto 31px auto;}
a{width:200px; background-color:$violeta; color:#fff; background-image:url(../img2/bot_home_gracias.svg); background-position:right; background-repeat:no-repeat; margin:auto; padding:12px; display:block; margin-top:31px; font-size:20px; text-align:center; @extend .trans;}
a:hover{background-color:$naranja2;}
}
.modsprods{
.col-md-6{padding:0;
img{width:100%;}
}
h1{color:#fff; font-size:33px; margin-bottom:33px; margin-top:70px; text-align:center;}
.bold{font-weight:700;}
.barrita{height:1px; background-color:rgba(0,0,0,0.1); width:161px; display:inline-block; vertical-align:middle;}
img{@extend .trans;}
img:hover{opacity:0.8;}
}
.iconolatyn{
padding:0px; text-align:center;
}
.modacerca{border-left:solid 6px $naranja;
.col-md-6{padding:0;}
.col1{padding-left:90px; padding-top:90px;
h1{color:$naranja; font-size:16px;
span{font-weight:bold;}
}
h2{font-size:39px; line-height:39px; font-family:$font3; font-weight:bold; margin-top:15px; margin-bottom:15px;
span{display:block;}
}
p{max-width:600px; margin-bottom:33px;}
a{color:$naranja; border:solid 2px $naranja; font-size:18px; padding:10px 15px 10px 15px; border-radius:33px; display:block; width:145px; text-align:center; @extend .trans;}
a:hover{background-color:$naranja; color:#fff;}
}
}
.mapa2{
.col1, .col2{padding:0;}
}
.modbanner{padding:45px 0 395px 0;
h1{font-family:$font3; margin:15px 0 9px 0; font-size:28px; text-align:center; color:#fff; font-weight:700; font-size:18px;
span{background-color:$verde; padding:4px 14px 4px 14px;}
}
p{font-size:21px; color:$gris2; padding-top:16px; text-align:center; padding-bottom:15px;
span{display:block;}
}
a{color:$verde; font-size:18px; background-color:transparent; padding:10px 15px 10px 15px; border-radius:33px; border:solid 1px $verde; display:block; font-weight:700; width:265px; margin:auto; text-align:center; @extend .trans;}
a:hover{background-color:$verde; color:#fff;}
.iconolatyn{padding-bottom:15px;}
}
footer{
padding:31px 0 14px 0;
.logofooter{text-align:center;}
.menu1{
text-align:center; border-bottom:solid 1px $verde; padding-bottom:15px; margin-bottom:15px;
li{display:inline-block; color:#fff; font-size:21px; vertical-align:middle; padding:4px 14px 4px 14px;
a{color:#fff; font-size:21px;}
}
.borde{border-left:solid 1px $naranja2;}
}
.descargar{width:222px; border-radius:33px; border:solid 1px #fff; display:block; text-align:center; padding:10px 15px 10px 15px; @extend .trans;}
.descargar:hover{background-color:$naranja2;}
.col1{
ul{
text-align:center;
li{display:inline-block; padding-right:14px;
a{color:#fff; font-size:16px;}
span{color:$naranja2;}
}
}
}
.col2{color:#fff; font-size:16px; border-left:solid 1px $naranja2;
a{color:#fff;}
}
.borde1{border-bottom:solid 1px $naranja2; padding-bottom:15px; margin-bottom:15px;}
a:hover{opacity:0.8;}
}
.botondescargar{float:right!important;
a{color:$naranja; border:solid 2px $naranja; font-size:18px; padding:12px!important; margin-top:6px; border-radius:33px; display:block; width:209px; text-align:center; @extend .trans;}
a:hover{background-color:$naranja; color:#fff;}
}
.dropdown-menu > li > a{line-height:28px; text-align:left;
img{margin-right:14px;}
}
.fondocat{
padding:85px 85px 60px 85px; color:#fff; margin-top:43px; background-size:cover; margin-bottom:0px;
h1{font-size:22px; margin-bottom:9px; font-family:$font3; color:#000; font-weight:600; letter-spacing:1px;}
h2{font-size:58px; font-weight:bold; color:#000; font-family:$font3;}
.barrita{width:145px; height:1px; margin-bottom:9px; background-color:$verde;}
.container{position:relative;}
img{position:absolute; right:0; top:-33px; width:150px;}
}
.fondoagua{background-image:url(../img3/fdo_header-prods_agua.jpg);}
.fondogas{background-image:url(../img3/fdo_header-prods_gas.jpg);}
.prodsagua{padding-top:45px;
h1{color:rgba(0,0,0,0.4); font-size:14px;}
h2{font-size:22px; color:$verde; font-weight:bold; font-family:$font3; margin-top:3px; height:68px;}
img{display:block; margin:auto auto 6px auto; width:100%;}
.col-md-4{margin-bottom:81px;}
.fichaboton{padding:12px 6px 6px 6px; display:block; color:$verde; font-weight:500; font-size:16px; border-top:solid 1px rgba(0,0,0,0.2); border-bottom:solid 1px rgba(0,0,0,0.2); background-image:url(../img3/ico_pdf_agua.svg); background-repeat:no-repeat; background-position:95%; font-family:$font3; @extend .trans;}
.fichaboton:hover{background-color:rgba(0,0,0,0.1); color:$gris2;}
.foto{position:relative;}
}
.prodsgas{margin-top:74px; border-top:solid 1px rgba(228, 228, 228, 1); padding-top:20px;
h1{color:rgba(0,0,0,0.4); font-size:14px;}
h2{font-size:22px; color:$verde; font-weight:bold; font-family:$font3; margin-top:3px; height:68px;}
img{display:block; margin:auto auto 6px auto; width:300px; height:300px; object-fit:cover;}
.col-md-3{margin-bottom:81px; position:relative;}
.fichaboton{padding:12px 6px 6px 6px; display:block; color:$verde; font-weight:500; font-size:16px; border-top:solid 1px rgba(0,0,0,0.2); border-bottom:solid 1px rgba(0,0,0,0.2); background-image:url(../img3/ico_pdf_agua.svg); background-repeat:no-repeat; background-position:95%; font-family:$font3; @extend .trans;}
.fichaboton:hover{background-color:rgba(0,0,0,0.1); color:$gris2;}
.foto{position:relative;}
.vervideo{background-color:$verde;}
.vervideo:hover{color:$verde2;}
.fichaboton, .medidasboton{color:#000; padding-left:12px; font-weight:500;}
.fichaboton{background-image:url(../img3/ico_pdf_gas.svg);}
.medidasboton{background-image:url(../img/bullet.svg);}
.titulo{padding:12px; text-align:center; color:$verde2; font-size:26px; font-weight:400; text-transform:uppercase;
span{font-weight:600;}
}
p{position:absolute; bottom:51px; right:20px; z-index:99999999;}
}
.formcontacto{
padding:33px;
h1{text-align:center; font-size:33px; font-family:$font3;}
p{color:$gris2; max-width:700px; margin:auto; font-size:16px; text-align:center;}
img{display:block; margin:31px auto 31px auto;}
input[type="text"], input[type="email"], textarea{border:none; font-size:15px; width:100%; margin-bottom:10px; color:$gris2; padding:10px; background-color:transparent; border-bottom:solid 1px rgba(0,0,0,0.1);}
input[type="submit"], input[type="button"]{border:none; background-color:$naranja; color:#fff; display:block; margin:auto; font-size:18px; border-radius:33px; padding:10px 22px 10px 22px; @extend .trans;}
input[type="submit"]:hover, input[type="button"]:hover{background-color:$naranja2;}
.pad{max-width:700px; margin:auto;}
}
.franjanaranja{padding:15px; background-color:$naranja;}
.medidas{padding:15px 4px 15px 4px; background-color:#f1f7e6; position:absolute; z-index:999999; width:91%; right:0; left:0; margin:auto; display:none;
.bold{font-weight:bold; font-family:$font3; margin-bottom:4px;}
.borde{border-bottom:solid 1px rgba(0,0,0,0.1); padding:3px 0 3px 0;}
ul{padding-left:12px;
li{width:32%; display:inline-block; color:$gris; padding:6px; font-size:14px; margin-left:-4px; border-bottom:solid 1px $verde;}
}
}
.medidasboton{padding:12px 6px 6px 6px; display:block; color:$verde; font-size:16px; border-bottom:solid 1px rgba(0,0,0,0.2); background-image:url(../img3/ico_drop_agua.svg); background-repeat:no-repeat; background-position:95%; font-family:$font3; cursor:pointer; background-color:rgba(215, 234, 185, 0.35); @extend .trans;}
.medidasboton:hover{background-color:$verde2; color:#fff;}
.textomedidas{padding:15px 15px 15px 0; border-bottom:solid 1px rgba(0,0,0,0.2);
img{float:left; margin-right:6px; width:45px!important; height:45px!important;}
}
.copy{padding:4px; text-align:center; background-color:$naranja; color:#fff;
a{color:#fff; font-weight:bold;}
}
.footer2{
padding:9px; background-color:rgba(25, 26, 26, 1);
.col2{text-align:right;
ul{padding-top:11px;
li{display:inline-block; vertical-align:middle; color:#fff;}
li:nth-child(2){margin:0 9px 0 9px;}
img{@extend .trans;}
img:hover{opacity:0.8;}
}
}
.col3{color:#fff; padding-top:6px; font-family:"Roboto", sans-serif; text-align:center; font-size:13px;}
.col1{
img{width:200px;}
}
a{color:#fff;}
}
.copy2{color:#fff; text-align:center;
a{color:#fff;}
a:hover{opacity:0.8;}
}
.bannerconexiones{height:269px; margin:0px auto 0px auto; background-image:url(../img3/fdo_banner_serv.jpg); background-size:cover; padding:51px 45px 45px 60px;
img{float:left; margin-right:22px;}
h1{color:$verde; font-size:18px; font-family:$font2;}
h2{color:#fff; font-size:28px; margin:6px 0 6px 0; font-family:$font2; margin-bottom:33px;}
a{color:#fff; border:solid 1px $verde; border-radius:31px; padding:15px 22px 15px 22px; font-size:18px; @extend .trans;}
a:hover{background-color:$verde;}
}
.franja{
background-color:$verde; color:#fff; padding:14px; text-align:center; font-weight:600; font-size:16px; margin-top:-6px;
a{color:#fff;}
}
.contacto{
width:700px; position:absolute; top:-331px; left:0; right:0; margin:auto; background-color:#fff; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.12); border-radius:12px;
}
.iconos2{text-align:center; font-size:22px; padding-top:45px; background-color:#ececec; padding-bottom:70px;
.borde{border-right:solid 1px $gris;}
a{color:#fff; @extend .trans;}
a:hover{opacity:0.8;
span{background-color:$verde;}
}
h1{color:$verde; font-weight:700; margin:14px 0 14px 0; font-size:18px;}
img{display:block; margin:auto;}
span{display:block; margin:auto; cursor:pointer; border:solid 1px $verde; color:$verde; font-size:31px; padding:6px; border-radius:61px; width:57px;}
.iconolatyn{margin:33px;}
a:hover span{color:#fff;}
span:hover{background-color:$verde; color:#fff;}
}
.acerca{
.container{padding-bottom:61px;}
h1{color:$verde; font-size:18px; font-weight:700; margin-bottom:22px; margin-top:33px;
span{background-color:$verde; color:#fff; padding:6px 9px 6px 9px;}
}
h2{font-size:33px; color:$verde2; font-weight:700;}
h3{font-size:33px; color:$verde2; font-weight:400;}
p{color:$gris; font-size:16px; margin-top:76px; padding:6px 62px 52px 62px; border-left:solid 1px $gris2;}
img{float:right; margin:15px 43px 0 0;}
}
.borde1{height:9px; margin-top:33px; background-image:url(../img3/linea_01.svg); background-size:cover;}
.nopad{padding:0;}
nav{
background-color:#fff!important;
}
.banner1{border-right:solid 1px #fff; background-image:url(../img3/fdo_banner_agua.png)!important; height:300px; background-size:cover; position:relative; @extend .trans;
.texto{position:absolute; top:33%; right:33px; @extend .trans;
h1{color:#fff; font-size:33px; font-weight:400; padding:0; margin:0;}
h2{color:#fff; font-size:45px; font-weight:700; padding:0; margin:0;}
}
img{position:absolute; width:200px!important; left:33px; top:45px; height:auto;}
a{color:#fff; display:block; width:100%; height:100%;}
}
.banner1:hover{opacity:0.6;
.texto{right:43px;}
}
.banner2{border-left:solid 1px #fff; background-image:url(../img3/fdo_banner_gas.png)!important; height:300px; background-size:cover; position:relative; @extend .trans;
.texto{position:absolute; top:33%; left:33px; @extend .trans;
h1{color:#fff; font-size:33px; font-weight:400; padding:0; margin:0;}
h2{color:#fff; font-size:45px; font-weight:700; padding:0; margin:0;}
}
img{position:absolute; width:200px!important; right:33px; top:45px; height:auto;}
a{color:#fff; display:block; width:100%; height:100%;}
}
.banner2:hover{opacity:0.6;
.texto{left:43px;}
}
.navprods{
background-color:#fff!important; background-image:none!important;
}
.vervideo{
position:absolute; bottom:15px; background-color:$verde; color:#fff; border-radius:33px; left:0; right:0; margin:auto; font-weight:500; background-image:url(../img3/ico_video.svg); background-repeat:no-repeat; background-position:95%; padding:9px 43px 9px 15px; width:145px; display:block; text-align:left; @extend .trans;
}
.vervideo:hover{background-color:$gris; color:$verde;}
.filtro{
border-bottom:solid 1px $verde; margin-bottom:45px;
ul{
text-align:center;
li{display:inline-block; font-size:16px; font-weight:500;
a{display:block; padding:10px 15px 10px 15px; color:#000; border-bottom:solid 2px transparent;}
a:hover, .active{border-bottom:solid 2px $verde2;}
}
}
}
.cabcategorias{background-image:none;}
.postventa{background-color:#fff;}
.postventa h2{color:$verde;}
.postventa input[type="submit"], .postventa input[type="button"]{background-color:$verde;}
.linkcert{
a{display:block; font-size:14px; color:$verde; border-bottom:solid 1px $verde; padding:6px; max-width:85%; margin:auto;}
.certaccordion{display:none;}
}
.redeshead{
img{width:28px;}
a{padding:6px!important;}
a:hover{background-color:transparent!important;}
a:hover{opacity:0.8;}
}
.productoshome{margin-top:45px; margin-bottom:51px;
h2{text-align:center; text-transform:uppercase; font-weight:400; font-size:26px; color:$verde2; padding-bottom:33px;
span{font-weight:600;}
}
.item{
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.18); padding:15px; text-align:center; border-radius:14px; background: rgb(255,255,255);
background: linear-gradient(0deg, rgba(255,255,255,1) 57%, rgba(241,247,230,1) 57%);
a{color:#fff; background-color:$verde; border-radius:33px; text-align:center; width:133px; margin:auto; display:block; text-transform:uppercase; font-size:18px; margin-top:12px; @extend .trans;}
a:hover{background-color:$verde2;}
}
}
.bannerhome{
text-align:center; padding:33px 0 33px 0;
img{width:100%;}
.bannermobile{display:none;}
}
.links{
.pad{
text-align:center; border-radius:12px; padding:20px; height:345px; padding-top:52px; @extend .trans;
h2{font-size:20px; font-weight:600; height:45px; margin-top:41px;}
a{color:$verde; font-size:20px; width:200px; font-weight:600; display:block; text-align:center; text-transform:uppercase; border:solid 1px $verde; border-radius:12px; padding:12px; margin:auto; @extend .trans;}
a:hover{background-color:$verde; color:#fff;}
}
.pad:hover{box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);}
img{height:120px;}
}
.container-fluid{max-width:92%; margin:auto;}
.headred{margin-top:67px; margin-bottom:45px;
img{width:100%;}
}
.red{padding-bottom:33px;
.titulo{color:$verde2; text-transform:uppercase; padding:12px 0 12px 0; font-size:20px; font-weight:400; border-bottom:solid 1px $verde; margin-bottom:33px;
span{font-weight:600;}
.col2{text-align:right;}
select{padding:10px; font-size:15px;}
}
.col-md-3{margin-bottom:33px;
h3{font-size:12px;}
h4{color:$verde; font-size:18px; border-bottom:solid 1px rgba(228, 228, 228, 1); padding:6px; margin-bottom:15px;}
p{line-height:20px; margin-bottom:20px;
span{color:$verde;}
a{color:#000;}
a:hover{color:$verde;}
}
}
.boton{border-radius:12px; border:solid 1px $verde; color:$verde; font-size:16px; font-weight:600; padding:6px 12px 6px 12px; @extend .trans;}
.boton:hover{background-color:$verde; color:#fff;}
}
.grecaptcha-badge{display:none!important;}
@media (max-width: 820px) {
.col4 .col-md-3{width:100%;}
.mod1 h1{font-size:18px; line-height:21px;}
.productos h2{font-size:24px;}
.productos .col-md-6{padding-bottom:21px; margin-bottom:21px;}
.banner p{font-size:21px; line-height:22px;}
.banner a{width:100%; font-size:18px;}
.mapa2 .contacto .contacto2{padding:21px;}
.pie ul{text-align:center;}
.pie .col-md-6{padding:10px 0 10px 0;}
.pielogo{display:block; margin:auto;}
.productos .col-md-6{height:auto;}
button::-moz-focus-inner{border:none!important;}
.fotodistribuidores{margin-top:62px;}
.redespop{width:100%; padding:60px 0 80px 0;}
.redespop h1{font-size:22px;}
.redespop h2{font-size:16px;}
.redespop ul li img{width:31px; height:auto;}
.descarga a{margin-bottom:15px;}
.linkm{display:inline-block!important;}
.navbar-inverse .navbar-nav > li{border:none!important;}
.productos .grilla .borde{border:none;}
.banner .iconogarantia{width:70px;}
.banners .borde1, .banners .borde2{border:none; height:auto; padding:12px;}
.banner .banner2{width:auto; font-size:15px;}
.banner{padding:31px 0 31px 0;}
.cabcategorias{margin-top:62px;}
footer .pad{padding:12px;}
.cabcategorias h2{font-size:33px;}
.detalleprod h1{padding-top:12px;}
.detalleprod .grilla .item2{font-size:12px;}
.detalleprod .adquirir ul li{width:100%; margin-top:3px;}
.postventa input[type="submit"], .postventa input[type="button"]{padding:12px 21px 6px 21px;}
.dropdown-menu{min-width:100%!important;}
.dropdown-menu li{width:100%!important;}
.dropdown-menu .borde{border:none!important;}
.navbar-collapse{padding-left:0;}
.navbar-nav{margin:0;}
.dropdown-menu li{margin-bottom:12px;}
.productos p{height:auto;}
.carousel1mobile{margin-top:68px;}
.modsprods .barrita{width:60px;}
.modsprods .col1, .modsprods .col2{border:none; border-bottom:solid 3px #fff;}
.modacerca .col1{padding-top:33px; padding-left:33px; padding-bottom:31px;}
.modacerca .col1 h2 span{display:inline;}
.mapa2 .contacto .contacto2 h1{font-size:29px;}
.modbanner p span{display:inline;}
.modbanner h1{font-size:22px;}
.modbanner p{max-width:90%; margin:auto;}
footer .menu1 li{}
footer .menu1 .borde{border:none;}
footer .menu1{text-align:center;}
footer .container{padding:0;}
footer .col2{text-align:center;}
footer .row{padding:0; margin:0; padding-bottom:15px; margin-bottom:31px;}
.navbar-inverse .navbar-toggle:hover, .navbar-inverse .navbar-toggle:focus{background-color:#fff;}
.navbar-nav li{display:block;}
.botondescargar{float:none!important; margin:auto;}
.botondescargar a{margin:auto;}
.navbar-header{height:73px;}
.dropdown-menu > li > a:hover{color:$gris!important;}
.fondocat{padding:57px 0 45px 0;}
.fondocat h2{font-size:33px;}
.fondocat img{width:65px; right:7px;}
.formcontacto{padding:0 0 33px 0;}
.bannerlatyn h1{font-size:16px;}
.bannerlatyn h2{font-size:26px;}
.footer2 .col1, .footer2 .col2{text-align:center;}
.footer2 .col2 ul li:nth-child(2){display:block; margin:0 0 15px 0;}
.navbar-nav > li > a{text-align:center;}
.navbar-nav{background-color:#000;}
.navbar-inverse .navbar-toggle:hover, .navbar-inverse .navbar-toggle:focus{background-color:transparent;}
.iconos2 .borde{border:none; margin-top:31px; margin-bottom:31px;}
.modbanner h1{font-size:16px;}
.modbanner{padding-bottom:45px;}
.footer2 .col3{text-align:center;}
.acerca .container{background-size:93%; padding-bottom:45px;}
.acerca{padding-top:0;}
.cab{background-image:none!important; background-color:#fff!important;}
.navbar-brand{padding-top:9px;}
.navbar-inverse .navbar-toggle .icon-bar{background-color:$verde;}
.acerca p{column-count:1;}
.acerca p{width:100%; padding-top:15px;}
.iconos2 .col-md-4{margin-bottom:45px;}
.banner1 img{position:relative; display:block; margin:auto auto 15px auto!important; width:100px!important;}
.banner1 .texto{position:relative; text-align:center; top:0; left:0; right:0;}
.banner1 img{left:0; top:0;}
.banner1{padding:45px 0 45px 0;}
.banner2 img{position:relative; display:block; margin:auto auto 15px auto!important; width:100px!important;}
.banner2 .texto{position:relative; text-align:center; top:0; left:0!important; right:0;}
.banner2 img{left:0; top:0;}
.banner2{padding:45px 0 45px 0;}
.bannerconexiones{width:100%; height:auto; padding:45px 0 45px 0; text-align:center;}
.bannerconexiones img{float:none;}
.bannerconexiones img{margin-right:auto; margin-bottom:15px;}
.navbar-nav{background-color:#fff; padding-bottom:15px;}
.filtro ul li{display:block;}
.fondocat img{display:block; margin:auto; left:0; right:0;}
.fondocat{text-align:center;}
.fondocat img{right:0; margin-top:15px!important; top:0; position:relative;}
.fondocat h1{margin-bottom:0;}
.dropdown-menu .tituloagua a, .dropdown-menu .titulogas a{text-align:center; margin:0;}
.navbar-brand>img{width:228px;}
.navbar{margin-bottom:0;}
.navbar-header{height:auto;}
.navbar-brand{padding-top:14px;}
.navbar-toggle{margin-top:18px;}
.acerca p{padding:0; margin-top:0; border:none;}
.productoshome .item{margin-bottom:33px;}
.mapa2{padding-top:33px;}
.mapa2 .borde{border:none; border-top:solid 1px #fff; border-bottom:solid 1px #fff;}
.mapa2 .contacto .contacto2 h1{font-size:22px;}
.mapa2 .contacto{width:92%;}
.mapa2 .contacto .contacto2{padding:12px;}
footer .menu1 li{text-align:center;}
.cabcategorias h2{font-size:25px; padding-bottom:15px;}
.titulopost{font-size:16px!important;}
.red .titulo .col2{text-align:left; padding-top:12px;}
.navbar-inverse .navbar-toggle{border:none;}
.contacto{position:relative; top:auto;}
.modbanner{padding:0;}
.navbar-nav span{display:block; padding-top:12px; text-align:center;}
.redeshead{display:inline-block!important;}
.bannerhome .bannermobile{display:block;}
.bannerhome .bannerdesktop{display:none;}
}
.grecaptcha-badge{display:none;}
.input-file {
display: none!important; /* Oculta el input file original */
}
.custom-file-label {
display: inline-block;
padding: 10px 20px;
background-color: $verde;
color: white;
border-radius: 5px;
cursor: pointer;
text-align: center;
font-size: 16px;
transition: background-color 0.3s ease;
}
.custom-file-label:hover {
background-color: #45a049;
}
@media (max-width: 1300px) {
.medidas ul li{font-size:11px;}
}