/var/www/clients/client1/web2/web/css
Edit: /var/www/clients/client1/web2/web/css/main.scss (33835B)
* {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900');
@font-face {
font-family: 'Hurme Geometric Sans 1';
src: url('../fonts/HurmeGeometricSans1-Bold.eot');
src: url('../fonts/HurmeGeometricSans1-Bold.eot?#iefix') format('embedded-opentype'),
url('../fonts/HurmeGeometricSans1-Bold.woff') format('woff'),
url('../fonts/HurmeGeometricSans1-Bold.ttf') format('truetype');
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: 'Hurme Geometric Sans 1';
src: url('../fonts/HurmeGeometricSans1-Regular.eot');
src: url('../fonts/HurmeGeometricSans1-Regular.eot?#iefix') format('embedded-opentype'),
url('../fonts/HurmeGeometricSans1-Regular.woff') format('woff'),
url('../fonts/HurmeGeometricSans1-Regular.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Hurme Geometric Sans 1';
src: url('../fonts/HurmeGeometricSans1-SemiBold.eot');
src: url('../fonts/HurmeGeometricSans1-SemiBold.eot?#iefix') format('embedded-opentype'),
url('../fonts/HurmeGeometricSans1-SemiBold.woff') format('woff'),
url('../fonts/HurmeGeometricSans1-SemiBold.ttf') format('truetype');
font-weight: 600;
font-style: normal;
}
@font-face {
font-family: 'Hurme Geometric Sans 1';
src: url('../fonts/HurmeGeometricSans1-Light.eot');
src: url('../fonts/HurmeGeometricSans1-Light.eot?#iefix') format('embedded-opentype'),
url('../fonts/HurmeGeometricSans1-Light.woff') format('woff'),
url('../fonts/HurmeGeometricSans1-Light.ttf') format('truetype');
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: 'Helvetica Neue LT Std';
src: url('../fonts/HelveticaNeueLTStd-MdCn.woff2') format('woff2'),
url('../fonts/HelveticaNeueLTStd-MdCn.woff') format('woff');
font-weight: 500;
font-style: normal;
}
$font1:'Roboto', sans-serif;
$font2:'Hurme Geometric Sans 1';
$font3:'Helvetica Neue LT Std';
$naranja:rgb(247,146,30);
$gris:#191a1a;
$violeta:rgb(247,146,30);
$violeta2:rgb(247,146,30);
$gris2:rgba(0,0,0,0.6);
$gris3:#b0b0b0;
$gris4:#121312;
$naranja2:#dd6003;
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; background-color:$gris;}
.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:$gris2; background-image:none; border:none;}
.navbar-brand{padding:4px 33px 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:$naranja;}
.navbar-inverse .navbar-nav > li{border-right:none;}
.navbar-nav{float:right; text-align:left!important;}
.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-brand > img{height:62px;}
.navbar-nav > li > .dropdown-menu{background-color:$violeta; 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-nav{float:none; text-align:center;
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:$violeta; color:#fff;}
.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:$gris;}
#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; color:#fff; text-align:center; background-color:$naranja; position:relative; background-size:cover; margin-top:73px; margin-bottom:45px;
h1{letter-spacing:4px; font-size:18px; font-weight:300;}
h2{font-size:45px; font-weight:300;
span{font-weight:bold;}
}
}
.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{color:$violeta; margin:33px 0 10px 0; font-weight:bold; font-size:19px;}
.postventa p{font-size:15px; color:#fff;}
.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:$violeta; color:#fff; 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{opacity:0.8;}
}
.titulopost{text-align:center; font-weight:300; font-size:21px!important; color:#fff;}
.postventa input::placeholder{color:#000;}
.carousel1{margin-bottom:0px;}
.postventa{color:#fff;
.col-md-3{font-size:12px;}
textarea{margin-top:33px;}
}
footer{
}
.videohome{margin-top:62px;}
.mapa2{
position:relative;
.contacto{
.contacto2{background-color:#fff; padding:60px 60px 60px 60px;
h1{color:#fff; margin-bottom:15px; font-size:33px; font-family:$font1; font-weight:200;
span{font-weight:600;}
}
input[type="text"], input[type="email"], textarea{border:none; font-size:15px; width:100%; margin-bottom:10px; color:#fff; padding:10px; background-color:transparent; border-bottom:solid 1px #fff;}
input[type="submit"], input[type="button"]{border:none; background-color:transparent; border:solid 1px $naranja; font-weight:700; color:#fff; display:block; margin:12px 0 0 15px; font-size:18px; border-radius:33px; padding:10px 22px 10px 22px; @extend .trans;}
input[type="submit"]:hover, input[type="button"]:hover{background-color:$naranja2;}
}
.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;}
}
}
}
.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: #fff;
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:$violeta; 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:1px; width:16px; height:51px; border:none; background-color:$violeta; 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:650px; left:-126px; border-bottom:solid 6px $naranja2; padding-top:21px; padding-bottom:21px;
li{display:inline-block; text-align:center; border:none; font-size:28px; border:none!important; width:49%; color:#fff;
img{display:inline; width:100px; vertical-align:middle; float:left; margin-top:-20px;}
span{display:block;}
a{font-weight:400;}
}
.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 $naranja2!important; margin-right:6px; padding-top:26px;}
}
@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%;}
}
.col1{border-right:solid 1px #fff;}
.col2{border-left:solid 1px #fff;}
h1{color:$naranja; font-size:28px; margin-bottom:33px; margin-top:70px;}
.bold{font-weight:bold;}
.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:61px; 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 0px 61px; position:relative; background-color:#000; background-image:url(../img3/fdo_cnx.png); background-size:50%; background-position:bottom right; background-repeat:no-repeat;
img{float:right;}
.texto{max-width:1300px; padding:45px; margin:auto;
h2{color:$naranja; font-size:18px; font-family:$font2;
span{width:900px; height:1px; background-color:$naranja; display:inline-block; vertical-align:middle;}
}
h1{color:#fff; font-size:51px; font-weight:100; line-height:57px; margin-top:6px; font-family:$font1;
span{display:block;}
}
p{color:#fff; width:70%; max-width:750px; font-size:16px; margin-top:14px; padding-left:6px; font-family:$font1;}
}
.barrita{width:150px; height:1px; background-color:$naranja; margin:45px 0 15px 0;}
}
footer{
background-color:$gris; padding:31px 0 0px 0;
.logofooter{text-align:center;}
.menu1{
text-align:center; border-bottom:solid 1px $naranja2; 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; background-image:url(../img/header_prods.jpg); color:#fff; margin-top:43px; background-size:cover; margin-bottom:45px;
h1{font-size:22px; margin-bottom:9px; font-family:$font3; letter-spacing:1px;}
h2{font-size:58px; font-weight:bold; font-family:$font3;}
.barrita{width:145px; height:1px; margin-bottom:9px; background-color:$naranja2;}
.container{position:relative;}
img{position:absolute; right:0; top:0px; width:150px;}
}
.prods{
h1{color:rgba(0,0,0,0.4); font-size:14px;}
h2{font-size:22px; font-weight:bold; font-family:$font3; margin-top:3px; height:68px;}
img{display:block; margin:auto auto 6px auto; height:200px; width:auto;}
.col-md-4{margin-bottom:81px;}
.fichaboton{padding:12px 6px 6px 6px; display:block; color:$naranja; 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(../img/Productos/ico_pdf.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;}
}
.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; display:none;
.bold{font-weight:bold; font-family:$font3; margin-bottom:4px;}
.borde{border-bottom:solid 1px rgba(0,0,0,0.1);}
}
.medidasboton{padding:12px 6px 6px 6px; display:block; color:$naranja; font-size:16px; border-bottom:solid 1px rgba(0,0,0,0.2); background-image:url(../img/Productos/flecha_medidas.svg); background-repeat:no-repeat; background-position:95%; font-family:$font3; cursor:pointer; @extend .trans;}
.medidasboton:hover{background-color:rgba(0,0,0,0.1); color:$gris2;}
.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{
background-color:$gris; padding:0 9px 14px 9px;
.col1{
img{width:73px;}
}
.col2{text-align:right;
ul{padding-top:0px;
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;}
}
}
.copy3{font-size:13px; color:#fff; text-align:center; padding-top:3px;
a{color:#fff; display:inline;}
span{display:block;}
}
}
.copy2{color:#fff; text-align:center;
a{color:#fff;}
a:hover{opacity:0.8;}
}
.marcas{
.pad{max-width:90%; margin:auto;}
img{display:block; margin:auto;}
.logologo{filter:brightness(0) invert(1); opacity:0.6; @extend .trans;}
.col-md-3:hover .logologo{filter:brightness(1) invert(0); opacity:1;}
.borde1{border-right:solid 1px #000; border-bottom:solid 1px #000;}
.borde2{border-bottom:solid 1px #000;}
.borde3{border-top:solid 1px #000;}
.borde4{border-right:solid 1px #000;}
.pad2{padding:31px; text-align:center; color:$gris3; height:331px;
p{padding-top:14px; font-size:18px; line-height:22px;
span{display:block;}
}
}
h1{font-size:77px; font-family:$font1; color:#fff; font-weight:100; text-align:center; margin-top:61px;}
h2{font-size:90px; font-family:$font1; color:#fff; font-weight:700; text-align:center; line-height:58px;}
.trama{margin-top:16px; width:300px;}
a{color:#fff; @extend .trans;}
a:hover{color:rgba(255,255,255,0.8);}
.col-md-3{@extend .trans;}
.col-md-3:hover{background-color:rgba(0,0,0,0.8);}
}
.bannerconexiones{width:1200px; height:269px; margin:65px auto 65px 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:$naranja; 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 $naranja; border-radius:31px; padding:15px 22px 15px 22px; font-size:18px; @extend .trans;}
a:hover{background-color:$naranja;}
}
.contacto{
position:absolute; left:0; top:0; width:600px;
}
.mapa2 .contacto .contacto2{padding:60px 60px 48px 60px; background-color:rgba(0,0,0,0.8);}
.carousel1{margin-top:72px;}
.noopacity{opacity:1!important; background-color:transparent!important;}
#nav-icon1, #nav-icon2, #nav-icon3, #nav-icon4 {
width: 55px;
height: 36px;
position: relative;
margin: 9px 0 0 0;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: .5s ease-in-out;
-moz-transition: .5s ease-in-out;
-o-transition: .5s ease-in-out;
transition: .5s ease-in-out;
cursor: pointer;
}
#nav-icon1 span, #nav-icon3 span, #nav-icon4 span {
display: block;
position: absolute;
height: 3px;
width: 33px;
background: #fff;
border-radius: 16px;
opacity: 1;
left: 0;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: .25s ease-in-out;
-moz-transition: .25s ease-in-out;
-o-transition: .25s ease-in-out;
transition: .25s ease-in-out;
}
#nav-icon1 span:nth-child(1) {
top: 12px;
}
#nav-icon1 span:nth-child(2) {
top: 22px;
}
#nav-icon1 span:nth-child(3) {
top: 32px;
}
#nav-icon1.open span:nth-child(1) {
top: 28px;
-webkit-transform: rotate(135deg);
-moz-transform: rotate(135deg);
-o-transform: rotate(135deg);
transform: rotate(135deg);
}
#nav-icon1.open span:nth-child(2) {
opacity: 0;
left: -60px;
}
#nav-icon1.open span:nth-child(3) {
top: 28px;
-webkit-transform: rotate(-135deg);
-moz-transform: rotate(-135deg);
-o-transform: rotate(-135deg);
transform: rotate(-135deg);
}
.iconomobile{position:fixed; top:0; right:0; z-index:99999999999999; display:block;}
.activemenu{top:72px!important;}
.menucab{position:fixed; top:-100%; right:0; width:300px; z-index:999999; padding:33px; background-color:$gris; border-bottom:solid 6px $naranja;
li{color:#fff; font-size:18px; cursor:pointer; font-size:18px; line-height:33px; font-family:$font2; font-weight:600;
span{color:$naranja;}
}
li:hover, a:hover{color:$naranja;}
a{color:#fff;}
}
.coltitulo:hover{opacity:0;}
@media (max-width: 1300px) {
.nav > li > a > img{max-width:93px;}
.marcas h1{font-size:58px;}
.marcas h2{font-size:65px;}
.trama{width:100%!important;}
}
@media (max-width: 620px) {
.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:73px;}
.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{display:block;}
footer .menu1 .borde{border:none;}
footer .menu1{text-align:left;}
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-brand{position:absolute;}
.modbanner .texto{position:relative; max-width:100%; left:auto; top:auto;
h2{
span{width:100%;}
}
}
.modbanner{padding:0;}
.modbanner .texto h1 span{display:inline;}
.modbanner .texto p{width:100%;}
.modbanner img{float:none;}
.marcas .col-md-3{border:none!important; border-bottom:solid 1px $gris!important;}
.bannerconexiones img{float:none;}
.bannerconexiones{width:100%; text-align:center; padding-bottom:60px; height:auto;}
.mapa2 .contacto .contacto2 h1{font-size:26px;}
footer .menu1 li{display:inline-block; width:45%;}
footer .menu1{text-align:center;}
.footer2 .col2{padding-top:15px;}
.bannerconexiones h1{margin-top:15px;}
.footer2 .col2 ul{padding-top:31px;}
.modbanner img{width:100%;}
.trama{width:100%;}
.modbanner img{display:none;}
}