/* CSS Document */ @font-face { font-family: "ArialNarrow-Bold"; src: url("./fonts/ArialNarrowBold.eot"); /* IE9 Compat Modes */ src: url("./fonts/ArialNarrowBold.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */ url("./fonts/ArialNarrowBold.otf") format("opentype"), /* Open Type Font */ url("./fonts/ArialNarrowBold.svg") format("svg"), /* Legacy iOS */ url("./fonts/ArialNarrowBold.woff") format("woff"), /* Modern Browsers */ url("./fonts/ArialNarrowBold.woff2") format("woff2"); /* Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: "ArialNarrow"; src: url("./fonts/ArialNarrow.eot"); /* IE9 Compat Modes */ src: url("./fonts/ArialNarrow.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */ url("./fonts/ArialNarrow.otf") format("opentype"), /* Open Type Font */ url("./fonts/ArialNarrow.svg") format("svg"), /* Legacy iOS */ url("./fonts/ArialNarrow.woff") format("woff"), /* Modern Browsers */ url("./fonts/ArialNarrow.woff2") format("woff2"); /* Modern Browsers */ font-weight: normal; font-style: normal; } @font-face { font-family: 'Futura-Medium'; src: url('./fonts/Futura-Medium.eot') format('embedded-opentype'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Futura-Medium'; src: url(data:application/x-font-woff;charset=utf-8;base64,) format('woff'), url('./fonts/Futura-Medium.ttf') format('truetype'), url('./fonts/Futura-Medium.svg#Futura-Medium') format('svg'); font-weight: normal; font-style: normal; } * { margin: 0; padding: 0; border: 0;font-family:ArialNarrow, Helvetica, sans-serif; outline: none; color: #4c382a;-moz-box-sizing: border-box;-webkit-box-sizing: border-box; box-sizing: border-box; -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-tap-highlight-color: transparent;} html, body {background-color: #f3f2f0;} body {font-size:14px;} .alert {display: none} h1 {color: #c5b29b;font-size: 30px;} .rwd {width: 100%;max-width: 100%;} .rwdCustom { max-width: 100%; } .clear{ clear:both} a{color: #4c382a; cursor:pointer; text-decoration:none} .toppad{ padding-top:50px!important} .invertir{direction: rtl; unicode-bidi: bidi-override;} .capa_cookies{position:fixed; bottom:0; background-color: rgba(0, 0, 0, 0.5); width:100%; padding:2%; z-index:99999999; display:none} .capa_cookies .cerrar{ float:right; color:#fff; font-size:20px; cursor:pointer} .capa_cookies p{ width:100%; float:left; color:#fff; font-size:14px; font-weight:normal; margin:20px 0 20px 0; text-align:center} .capa_cookies p a{color:#fff; text-decoration:underline} .capa_cookies .boton{ width:auto; padding:10px 2% 10px 2%; margin:0 auto; display:table; background-color:#a52433; color:#fff; cursor:pointer} header{ width:100%; position:fixed;background-color:#fff;clear:both; z-index:1000; padding:20px 0 20px 0;} header .contHeader{width:100%; max-width:1280px; margin:0 auto; display:table} header .logo{ width:53%; float:left; text-align:left; padding: 0 0 0 2%} header .logo img{ width:100%; max-width:314px} header .menumov{ width:45%; float:left; text-align:right; margin:10px 0 0 0} header .idiomas {display:none} header nav{ width:100%; float:left;margin:0 ; background:url(../../images/fd_menu.png); background-size:100%; background-repeat:no-repeat; background-position:0 20px; background-color:#a32732; display:none } header nav .idioma {width:96%; float:right; margin:0 2% 20px 2%; } header nav .idioma ul{ width:90%; float:left; position:absolute;background-color:#fff} header nav .idioma li{ list-style:none; cursor:pointer; padding:5%;font-family:ArialNarrow, Helvetica, sans-serif; font-size:18px } header nav .idioma li a{ color: #4c382a; text-decoration:none} header nav .idioma li a:hover{ color: #a32732} header nav .idioma li:first-child{ background:url(../../images/flecha_menu.gif); background-repeat:no-repeat; background-position:96% 50%} header nav .idioma li:last-child{ display:none} header nav hr{ display:none} header nav .redes{ width:100%; float:left; margin:80px 0 50px 0;} header nav .redes h2{ width:100%; float:left; text-align:center; color:#fff; font-size:16px; font-weight:normal} header nav .redes .enlaces{ width:100%; float:left; text-align:center; margin: 10px 0 20px 0} header nav .redes .enlaces img{ padding:0 5px 0 5px; width:20%} /*index*/ .bloque1{width:100%; max-width:1280px; margin:0 auto; background:url(../../images/fd_mujer.png); background-repeat:no-repeat; background-position:top right; background-size:cover; min-height:680px; } .bloque1 h1{ width:96%; padding:20px 2% 20px 2%; font-size:22px; text-align:center; text-shadow: 1px 2px #000;color: #c5b29b;} .bloque1 .banda{ width:100%; float:left; display:table; background-color: rgba(243, 242, 240, 0.8); padding:20px 0 20px 0} .bloque1 .banda .bloque{ width:92%; float:left; margin:0 4% 50px 4%} .bloque1 .banda .bloque .left{ width:40%; float:left; position:relative} .bloque1 .banda .bloque .left .foto{ width:100%;text-align:center; } .bloque1 .banda .bloque .left .foto img{ width:80%; max-width:155px } .bloque1 .banda .bloque .left .boton{ width:100%; text-align:center; position:absolute; bottom:-40px} .bloque1 .banda .bloque .right{ width:60%; float:left} .bloque1 .banda .bloque .right h2{ width:100%; float:left; font-size:20px; color:#a52433} .bloque1 .banda .bloque .right hr{ width:10%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 0 10px 0} .bloque1 .banda .bloque .right p{ width:100%; float:left;} .bloque2{width:100%; display:table; background-color:#fdfdfd; padding:20px 0 20px 0; min-height:200px} .bloque2 .cont{width:100%; max-width:1280px; margin:0 auto; display:table} .bloque2 .cont .iconos{width:100%; float:left; text-align:center} .bloque2 .cont .iconos img{width:80%; max-width:134px} .bloque2 .cont p{width:70%; float:none; background:url(../../images/comillas.png); clear:both; background-position:100% 25%; background-repeat:no-repeat; padding:20px 8% 0 0; font-size:16px; margin:0 auto 0 auto; display:none} .bloque3{width:100%; max-width:1280px; margin:0 auto; display:table} .bloque3 .left_cafe{width:96%; float:left; padding:0 2% 0 2%} .bloque3 .left_cafe .top{width:100%; } .bloque3 .left_cafe .top .lluvia{width:100%; position:relative; min-height:500px } .bloque3 .left_cafe .top .lluvia .grano1{width:10%; position:absolute; top:90%; left:5% } .bloque3 .left_cafe .top .lluvia .grano2{width:10%; position:absolute; top:85%; left:45% } .bloque3 .left_cafe .top .lluvia .grano3{width:10%; position:absolute; top:88%; right:0 } .bloque3 .left_cafe .top .lluvia .grano4{width:10%; position:absolute; top:75%; left:65% } .bloque3 .left_cafe .top .lluvia .grano5{width:10%; position:absolute; top:60%; left:55% } .bloque3 .left_cafe .top .lluvia .grano6{width:10%; position:absolute; top:50%; left:70%} .bloque3 .left_cafe .top .lluvia .grano7{width:10%; position:absolute; top:40%; left:20% } .bloque3 .left_cafe .top .lluvia .grano8{width:10%; position:absolute; top:30%; left:35%} .bloque3 .left_cafe .top .lluvia .grano9{width:10%; position:absolute; top:18%; left:10%} .bloque3 .left_cafe .top .lluvia .grano10{width:10%; position:absolute; top:15%; left:70% } .bloque3 .left_cafe .top .lluvia .grano11{width:10%; position:absolute; top:10%; left:35%; } .bloque3 .left_cafe .top figure{width:100%; z-index:999; position:relative; padding:0!important ; margin:0!important } .bloque3 .left_cafe .top figure img{width:100%; max-width:536px } .bloque3 .left_cafe .bottom{width:100%; } .bloque3 .left_cafe .bottom h2{ width:86%; float:left;font-size:20px;color:#a52433; margin:50px 7% 0 7%} .bloque3 .left_cafe .bottom hr{ width:5%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 7% 10px 7%} .bloque3 .left_cafe .bottom p{ width:86%; float:left; margin:0 7% 30px 7%} .bloque3 .left_cafe .bottom .tipos{width:100%; float:left; text-align:center; } .bloque3 .left_cafe .bottom .tipos img{width:100%; max-width:480px } .bloque3 .left_cafe .bottom h3{ width:100%; float:left; text-align:center; color:#d7d7d6; margin:20px 0 20px 0; font-family:ArialNarrow-Bold, Helvetica, sans-serif; font-size:26px} .bloque3 .left_cafe .bottom .opc{ width:20%; float:left; text-align:center} .bloque3 .left_cafe .bottom .opc img{ width:100%; max-width:100px } .bloque3 .left_cafe .bottom figcaption{ width:100%; font-size:14px} .bloque3 .right_cafe{width:96%; float:left; padding:50px 2% 0 2%} .bloque3 .right_cafe .paso1{ width:100%;} .bloque3 .right_cafe .paso1 h2{ width:80%;float:left; font-size:30px; font-family:ArialNarrow-Bold, Helvetica, sans-serif; margin:0 10% 45px 10%; line-height:30px; letter-spacing:-2px} .bloque3 .right_cafe .paso1 h3{ width:83%;float:left; font-size:20px;color:#a52433; margin:0 7% 0 10%} .bloque3 .right_cafe .paso1 hr{ width:5%;float:left; border:0; background-color:#4c382a; height:2px; margin:5px 0 10px 10%} .bloque3 .right_cafe .paso1 p{ width:83%;float:left;margin:0 7% 0 10%} .bloque3 .right_cafe .paso1 figure{ width:100%;float:left; text-align:center; margin:20px 0 20px 0} .bloque3 .right_cafe .paso1 figure img{ width:80%; max-width:342px} .bloque3 .right_cafe .paso1 h4 {width:100%; float:left; text-align:center;color:#d7d7d6; margin:20px 0 20px 0;font-family:ArialNarrow-Bold, Helvetica, sans-serif; font-size:26px} .bloque3 .right_cafe .paso1 .taza_cont{ width:100%; float:left; position:relative; min-height:450px; max-height:470px } .bloque3 .right_cafe .paso1 .taza_cont .nube{width:51%; margin:0 0 0 15% } .bloque3 .right_cafe .paso1 .taza_cont .nube img{width:100%; max-width:275px} .bloque3 .right_cafe .paso1 .taza_cont figure{ width:100%; position:relative; z-index:2; top:-220px; left:5%; text-align:center} .bloque3 .right_cafe .paso1 .taza_cont figure img{ width:80%; max-width:378px} .bloque3 .right_cafe .paso2{ width:100%; float:left} .bloque3 .right_cafe .paso2 .nube2{ width:80%; float:left; margin:0 10% 50px 15%} .bloque3 .right_cafe .paso2 .nube2 span{color:#a52432;font-size:28px;} .bloque3 .right_cafe .paso2 .nube2 .tam1{font-size:100%;} .bloque3 .right_cafe .paso2 .nube2 .tam2{font-size:110%;} .bloque3 .right_cafe .paso2 .nube2 .tam3{font-size:125%;} .bloque3 .right_cafe .paso2 .nube2 .tam4{font-size:115%;} .bloque3 .right_cafe .paso2 .nube2 .tam5{font-size:110%;} .bloque3 .right_cafe .paso2 .nube2 .tam6{font-size:200%;} .bloque4{width:100%; max-width:1280px; margin:0 auto 100px auto; display:table} .bloque4 .textoCarrera{width:100%; float:left} .bloque4 .textoCarrera h2{ width:95%; float:left;font-size:30px; padding:0 0 30px 0; margin:25px 0 0 5%} .bloque4 .textoCarrera h3{ width:90%; float:left;font-size:20px;color:#a52433; margin:0 0 0 10%} .bloque4 .textoCarrera hr{ width:5%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 0 10px 10%} .bloque4 .textoCarrera p{ width:68%; float:left; margin:0 22% 30px 10%} .bloque4 .textoCarrera h4 {width:90%;float:left; text-align:left;color:#d7d7d6; margin:10px 0 20px 10%;font-family:ArialNarrow-Bold, Helvetica, sans-serif; font-size:46px} .bloque4 .textoCarrera .nube3{ width:90%; float:left; margin:0 0 20px 10%} .bloque4 .textoCarrera .nube3 span{color:#a52432;font-family:ArialNarrow-Bold, Helvetica, sans-serif;font-size:24px; } .bloque4 .textoCarrera .nube3 .tam1{font-size:110%;} .bloque4 .textoCarrera .nube3 .tam2{font-size:220%;} .bloque4 .textoCarrera .nube3 .tam3{font-size:100%;} .bloque4 .textoCarrera .nube3 .tam4{font-size:150%;} .bloque4 .textoCarrera .nube3 .tam5{font-size:200%;} .bloque4 figure{width:100%; float:left} .bloque4 figure img{width:100%; max-width:840px} .bloque5{width:100%; max-width:1280px; margin:50px auto 50px auto; display:table;background:url(../../images/fd_superacion.png); background-size:90%; background-repeat:no-repeat; background-position:bottom right; } .bloque5 figure{width:100%; float:left} .bloque5 figure img{width:100%; max-width:837px} .bloque5 .textoCompromiso{ width:90%; float:left; margin:25px 5% 10% 5%;} .bloque5 .textoCompromiso h2{ width:90%; float:left;font-size:30px;color:#a52433; margin:0 4% 0 6%} .bloque5 .textoCompromiso hr{ width:5%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 0 10px 6%} .bloque5 .textoCompromiso p{ width:90%; float:left; margin:0 4% 0 6%} .bloque5 .textoCompromiso h4 {width:100%;float:left; text-align:center;color:#d7d7d6; margin:10px 0 10px 0;font-family:ArialNarrow-Bold, Helvetica, sans-serif; font-size:26px} .bloque5 .textoCompromiso figure{ width:100%; float:left; text-align:center;margin:20px 0 10px 0} .bloque5 .textoCompromiso figure img { width:100%; max-width:159px} /*fin index*/ /*interiores Historia,valores*/ .interior{ width:100%; max-width:1260px; margin:0 auto; display:table; padding:0 0 100px 0; } .interior .leftit{ width:96%; float:right; margin:40px 2% 2% 2%;} .interior .leftit h1{ width:100%; float:left; color:#bda993; font-size:40px; line-height:40px} .interior .leftit h2{ width:100%; float:left; color:#bda993; font-size:32px; line-height:32px} .interior .leftit h3{ width:90%; float:left; margin:30px 5% 0 5%; font-size:24px;color:#a52433;} .interior .leftit hr{width:10%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 0 10px 5%} .interior .leftit p{width:90%; float:left; margin:0 5% 0 5%;} .interior .leftit .listadoPoliticas { width: 90%; float: left; margin: 0 5% 0 8%; } .interior .leftit .listadoPoliticas li { margin-top: 10px; } .interior .leftit .listadoPoliticas li a { color: #a52433; font-weight: bold; } .interior .leftit .listadoPoliticas li a:hover { color: #bda993; } .interior .leftit p span{color:#a52433; font-weight:bold} .interior .leftit .bt_cta{ width:58%; clear:both; max-width:200px; text-align:center; margin:0 auto 20px auto!important; display:table;border:2px #a52433 solid; cursor:pointer; padding:15px 50px 15px 50px; } .interior .leftit .redes{ width:100%; float:left; text-align:center; margin:20px 0 0 0 } .interior .leftit .redes img{ margin:0 10px 0 10px} .interior .leftint h3 {width: 90%;float: left;margin: 30px 5% 0 5%;font-size: 24px;color: #a52433;} .interior .leftint hr{width:10%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 0 10px 5%} .interior .leftint p{width:90%; float:left; margin:0 5% 0 5%;} .interior .leftint p span{color:#a52433; font-weight:bold} .interior .leftit ol.aviso{ width:90%; float:left; margin: 20px 0 0 10%} .interior .leftit ol.aviso li{ padding: 0 0 20px 0} .interior .legales{ width:96%; max-width:900px; margin:0 auto; padding:40px 2% 0 2%; display:table; } .interior .legales h2{ width:100%; float:left; color:#bda993; font-size:20px; margin:40px 0 20px 0} .interior .legales p{ width:100%; float:left} .interior .legales ol.aviso{ width:98%; float:left; margin: 20px 0 0 2%} .interior .legales ol.aviso li{ padding: 0 0 20px 0} .interior .legales ol.aviso li ul{width:95%; float:left; margin:10px 0 20px 5%;} .interior .legales ol.aviso li ul li{ list-style:disc; padding: 0 0 10px 0} .interior .righfoto{width:100%; float:left;} .interior .righfoto img{ width:100%; max-width:901px} .interior .righfoto .imgVideo{ cursor:pointer} .interior .righfoto iframe{ max-width:901px; display:none;} .interior .rightint{width:100%; float:left; margin:30px 0 2% 0; text-align:center} .interior .rightint .logoHistoria{width:90%; max-width:400px} .interior .rightint .logoValores{width:60%; max-width:312px} .interior .rightint .logoPolitica{width:90%; max-width:400px;margin-left:0px;} .floatLeft{ float:left!important; } .interior .rightint .logoCalidad{width:90%; max-width:432px} .interior .rightint .logoProceso{width:100%; max-width:478px} .interior .rightint .logoCalidadSeg{width:100%; max-width:255px} .interior .leftint{width:90%; float:left; margin:10px 5% 0 5%} .interior .leftint p{ width:100%; float:left} .interior .leftint ul.listado{ width:90%; float:left; margin:30px 0 30px 10%} .interior .leftint ul.listado li{ list-style-image:url(../../images/bullet.gif); padding:0 0 10px 0} .interior .leftint ul.listado li .dest{font-family:ArialNarrow-Bold, Helvetica, sans-serif; color:#a52433; font-size:20px } .interior .leftint .proyec{ width:96%; float:left; margin:2%; padding:2%; background-color:#fff; border:1px solid #e2e1de; position:relative} .interior .leftint .proyec figure{ width:60%; float:left; } .interior .leftint .proyec figure img{ width:90%; max-width:179px } .interior .leftint .proyec p{ width:35%; float:none; font-size:14px; padding:0 0 0 0; position:absolute; right:10px; bottom:8px} /*Fin interiores Historia,valores*/ /*interiores productos*/ .interiorCenter{ width:96%; max-width:1260px; margin:0 auto; padding:40px 2% 0 2%; display:table; } .interiorCenter h1{width:100%; float:left; color:#bda993; font-size:40px; line-height:40px} .interiorCenter p{ width:97%; float:left; font-size:18px; color:#bda993; padding:10px 0 0 3%} .interiorCenter .lupas{ width:100%; float:left; position:relative;} .interiorCenter .lupas .lupaopc {display:none} .interiorCenter .lupas .producto{ width:100%; position:relative; float:left} .interiorCenter .lupas .producto h2{ width:97%; color:#a52433; margin:30px 0 0 3% } .interiorCenter .lupas .producto hr{width:10%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 93% 10px 3%} .interiorCenter .lupas .producto p{ width:97%; padding:0; font-size:16px;color:#4c382a;margin:5px 0 0 3% } .interiorCenter .lupas .producto .boton{width:60%; float:right; margin:5% 0 0 0; cursor:pointer} .interiorCenter .lupas .producto .boton span{ float:left; width:56%; margin:25px 0 0 0; text-align:right; font-size:18px;color:#a52433;font-family:ArialNarrow-Bold, Helvetica, sans-serif;} .interiorCenter .lupas .producto .boton img{ float:left; vertical-align:middle} .nuestro{padding:80px 2% 0 2%!important;} .interiorCenter .leftCafe{ width:96%; float:left; margin:0 2% 0 2%} .interiorCenter .leftCafe h2{ width:100%; float:left;font-family:ArialNarrow-Bold, Helvetica, sans-serif; font-size:42px; line-height:42px} .interiorCenter .leftCafe figure{ width:100%; float:left; margin:10px 0 0 0} .interiorCenter .leftCafe figure img{ width:100%; max-width:315px} .interiorCenter .rightCafe{ width:96%; float:left; margin:0 2% 0 2% } .interiorCenter .rightCafe h3{ width:97%; float:left;color:#a52433;margin:35px 0 10px 3%} .interiorCenter .rightCafe hr{width:4%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 93% 10px 3%} .interiorCenter .rightCafe p{ width:94%; float:left; padding:0 3% 0 3%; margin:0; font-size:16px;color:#4c382a;} .interiorCenter .rightCafe p span{color:#a52433; font-size:24px;font-family:ArialNarrow-Bold, Helvetica, sans-serif; } .interiorCenter .rightCafe .boton{ width:80%; margin:50px auto 50px auto; display:table; } .interiorCenter .rightCafe .bt_cta{border:2px #a52433 solid; cursor:pointer; padding:15px 50px 15px 50px; background:url(../../images/flecha_right.png); background-repeat:no-repeat; background-position:90% 50%} .interiorCenter .boton{ width:80%; margin:50px auto 50px auto; display:table; } .interiorCenter .bt_cta{border:2px #a52433 solid; cursor:pointer; padding:15px 50px 15px 50px; background:url(../../images/flecha_right.png); background-repeat:no-repeat; background-position:90% 50%} .fdmapa{ width:100%; float:left; background:url(../../images/fd_mundo.jpg);background-color:#fff; background-repeat:no-repeat; background-size:cover; background-position:top center; padding:0 0 0 0!important; min-height:135px; position:relative} .fdmapa .mapa{ width:95%; padding:5% 10% 0 5%;background:url(../../images/comillas.png); background-position:100% 25%; background-repeat:no-repeat; font-size:16px;font-family:ArialNarrow-Bold, Helvetica, sans-serif; text-align:center } .fdmapa .botonMapa{ width:100%; position:absolute; text-align:center; background:url(../../images/fd_granos.png); background-repeat:no-repeat; background-position:top center; background-size:40%; padding:0 0 27px 0} .fdmapa .botonMapa img{ cursor:pointer} .fdmapa .capaMapa{ width:90%; position:absolute; top:-290%; z-index:9999; left:5%;} .fdmapa .capaMapa .content{ width:100%; margin:0 auto; display:table; background-color:#fff; padding:20px;-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75); -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75); box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75); } .fdmapa .capaMapa .content .int{ width:100%; margin:0 auto; display:table; border:1px solid #a52433; padding:4%; text-align:center; line-height:20px } .fdmapa .capaMapa .content .int .cerrar{ float:right; font-size:18px; cursor:pointer} .fdmapa .capaMapa .content .int p{ width:100%; margin:0 auto; display:table; padding:4%; text-align:center; line-height:20px } .fdmapa .capaMapa .pico{ width:100%; float:left; text-align:center} .interiorCenter .leftsoluble{ width:98%; float:left; margin: 0 2% 0 0} .interiorCenter .leftsoluble h1{width:100%; float:left; color:#bda993; font-size:40px; line-height:40px} .interiorCenter .leftsoluble h2{ width:100%; float:left; color:#bda993; font-size:32px; line-height:32px } .interiorCenter .leftsoluble h3{width:100%; float:left; font-size:36px; color:#bda993} .interiorCenter .leftsoluble h4{ width:97%; float:left;color:#a52433;margin:35px 0 10px 3%; font-size:18px} .interiorCenter .leftsoluble hr{width:4%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 93% 10px 3%} .interiorCenter .leftsoluble p{ width:97%; float:left; font-size:16px; color:#4c382a; padding:10px 0 0 3%} .interiorCenter .rightsoluble{ width:96%; float:left; margin: 30px 2% 0 2%} .interiorCenter .rightsoluble figure{ width:100%; float:left; margin:0 0 20px 0} .interiorCenter .rightsoluble figure img{ width:100%; max-width:655px } .interiorCenter .rightsoluble .boton{ margin:0 auto 50px auto; display:table; float:none} .interiorCenter .bloqueProd{ width:96%; float:left; margin:0 2% 50px 2%} .interiorCenter .bloqueProd h2{ width:100%; float:left; color:#bda993; font-size:26px } .interiorCenter .bloqueProd h3{ width:91%; float:left; color:#bda993; font-size:20px; margin: 0 0 0 9% } .interiorCenter .bloqueProd .imgProd{ width:100%; float:left; margin:20px 0 0 0 } .interiorCenter .bloqueProd .imgProd img{ width:96%; max-width:240px; margin:0 2% 0 2%} .interiorCenter .bloqueProd p{ width:100%; float:left; color:#4c382a; font-size:16px; } .interiorCenter p.nota{ width:100%; float:left; color:#4c382a; margin:50px 0 20px 0; padding:0} .interiorCenter .boton2{ margin:50px auto 50px auto!important; display:table; float:none} .interiorCenter h2.right{ width:100%; float:left; font-size:30px; color:#bda993; text-align:right} .interiorCenter h3.right{width:100%; float:left; font-size:16px; color:#bda993; text-align:right} .interiorCenter .envases{ width:96%; float:left; margin:50px 2% 100px 2%; position:relative} .interiorCenter .envases figure{ width:100%; float:left; text-align:center} .interiorCenter .envases figure img{width:100%; max-width:637px} .interiorCenter .envases .plus{ position:absolute; top:-50px; right:0; z-index:2} .interiorCenter h2.left{ width:100%; float:left; font-size:30px; color:#bda993; } .interiorCenter h3.left{width:100%; float:left; font-size:16px; color:#bda993} .interiorCenter .progreso{ width:96%; float:left; margin:30px 2% 30px 2%} .interiorCenter .progreso .left{ width:100%; float:left; } .interiorCenter .progreso .right{ width:100%; float:left; } .interiorCenter .progreso .paso{ width:100%; float:left; margin:0 0 20px 0} .interiorCenter .progreso .paso3{ display:none} .interiorCenter .progreso .paso3Mov{ float:left} .interiorCenter .progreso .paso figure{ width:40%; float:left} .interiorCenter .progreso .paso figure img{ width:100%; max-width:199px} .interiorCenter .progreso .paso .datos{ width:60%; float:left; margin:20px 0 0 0} .interiorCenter .progreso .paso .datos h2{ width:100%; float:left;color:#a52433; font-size:20px} .interiorCenter .progreso .paso .datos hr{width:10%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 93% 10px 0} .interiorCenter .progreso .paso .datos p{ width:100%; float:left;color:#4c382a;padding:0; font-size:14px} .interiorCenter .resultado{ width:96%; float:left; margin:30px 2% 200px 2%} .interiorCenter .resultado figure{ width:100%; float:left; text-align:center } .interiorCenter .resultado figure img{ width:80%; max-width:309px } .catalogo{ width:96%; max-width:1280px; position:absolute; top:200px; right:0; z-index:999; padding:10px 2% 0 2%; display:table; background-color:#fff;} .catalogo .cerrar{ width:auto; float:right; cursor:pointer} .catalogo .cerrar .cierre{ width:auto; float:right; padding:10px 10px 0 0; margin:0} .catalogo .cerrar .cierre img{ width:auto; max-width:41px; padding:0 0 5px 0} .catalogo .cerrar .cierre figcaption{ width:100%; text-align:center; font-size:10px; } .catalogo .tits{ width:100%; float:left; padding:30px 0 0 0} .catalogo .tits h1{ width:100%; float:left; color:#4c382a; font-size:24px;font-family:ArialNarrow-Bold, Helvetica, sans-serif;} .catalogo .tits h2{width:100%; float:left; color:#bda993; font-size:30px;font-family:ArialNarrow-Bold, Helvetica, sans-serif;} .catalogo .tits h3{width:100%; float:left; color:#bda993; font-size:24px;font-family:ArialNarrow-Bold, Helvetica, sans-serif;} .catalogo figure{ width:100%; float:left; margin:50px 0 0 0} .catalogo figure img{ width:100%; max-width:630px} .catalogo .menu{ width:95%; float:left; border:1px solid #e2e2e2; padding:1% 2%; margin:0 0 50px 0} .catalogo .menu .opc{ width:100%; float:left; text-align:center; border-bottom:1px solid #9f2330; padding:5% 0 5% 0} .catalogo .menu .opc:first-child{ text-align:left; } .catalogo .menu .opc:last-child{ border-bottom:0;} .catalogo .menu .opc span{ width:99%;float:left; padding:0 0 0 1%; margin:0; text-align:left;color:#bda993; cursor:pointer} .catalogo .menu .opc span.on{ width:99%;float:left; padding:5px 0 5px 1%; margin:0; text-align:left;color:#bda993; background-color:#4c382a} .catalogo .menu .opc span.off{ width:99%;float:left; padding:5px 0 5px 1%; margin:0; text-align:left;color:#bda993;} .catalogo .menu .opc span:hover{ width:99%;float:left; padding:5px 0 5px 1%; margin:0; text-align:left;color:#4c382a} .catalogo .menu .opc hr{ display:none} .catalogo .listadoProd{ width:100%; float:left; position:relative; margin:0 0 20px 0} .catalogo .listadoProd .prod{ width:47%; float:left;border:1px solid #e2e2e2; cursor:pointer; margin:1%; text-align:center; position:relative; height:170px; overflow:hidden} .catalogo .listadoProd .prod img{ width:100%; max-width:350px;transition: all 0.2s linear;} .catalogo .listadoProd .prod p{ width:100%; text-align:center; color:#4c382a; font-size:12px; font-family:ArialNarrow-Bold, Helvetica, sans-serif; padding:5px 0 5px 0} .catalogo .listadoProd .prod .mascara {opacity: 0;text-align:center; position:absolute; top:0; width:100%; height:100%;background-color: rgba(0,0,0, 0.4);transition: all 0.3s ease-in-out;} .catalogo .listadoProd .prod .mascara img{ width:auto; margin:30% 0 0 0 } .catalogo .listadoProd .prod:hover .mascara {opacity: 1;} .catalogo .listadoProd .prod:hover img {transform: scale(0.7);} .catalogo .bloquesCat{width:100%; float:left; } .catalogo .bloquesCat span{width:100%; float:left; text-align:center; padding:20px 0 20px 0; font-size:22px; color:#bda993 } .catalogo .bloquesCat .listadoProd{ width:100%; float:left; position:relative; margin:0 0 20px 0} .catalogo .bloquesCat .listadoProd .prod{ width:47%; float:left;border:1px solid #e2e2e2; cursor:pointer; margin:1%; text-align:center; position:relative; height:170px; overflow:hidden} .catalogo .bloquesCat .listadoProd .prod img{ width:100%; max-width:350px;transition: all 0.2s linear;} .catalogo .bloquesCat .listadoProd .prod p{ width:100%; text-align:center; color:#4c382a; font-size:12px; font-family:ArialNarrow-Bold, Helvetica, sans-serif; padding:5px 0 5px 0} .catalogo .bloquesCat .listadoProd .prod .mascara {opacity: 0;text-align:center; position:absolute; top:0; width:100%; height:100%;background-color: rgba(0,0,0, 0.4);transition: all 0.3s ease-in-out;} .catalogo .bloquesCat .listadoProd .prod .mascara img{ width:auto; margin:30% 0 0 0 } .catalogo .bloquesCat .listadoProd .prod:hover .mascara {opacity: 1;} .catalogo .bloquesCat .listadoProd .prod:hover img {transform: scale(0.7);} .catalogo .galeriaProd{ width:100%; float:left; position:relative; margin:0 0 20px 0} .catalogo .galeriaProd .ant{ width:10%; float:left; text-align:center; margin:30% 0 0 0; cursor:pointer} .catalogo .galeriaProd .ant img{ width:30%; max-width:41px;} .catalogo .galeriaProd .sig{ width:10%; float:left; text-align:center; margin:30% 0 0 0; cursor:pointer} .catalogo .galeriaProd .sig img{ width:30%; max-width:41px;} .catalogo .galeriaProd .carrusel{ width:80%; float:left; text-align:center} .catalogo .galeriaProd .carrusel figure{ width:100%; float:left; text-align:center} .catalogo .galeriaProd .carrusel figure img{ width:100%; max-width:650px} .catalogo .galeriaProd figcaption{width:100%; text-align:center; color:#4c382a; font-family:ArialNarrow-Bold, Helvetica, sans-serif; padding:5px 0 5px 0} .catalogo .cargar-mas{ width:100%; float:left; text-align:center; padding:50px 0 50px 0; font-family:ArialNarrow-Bold, Helvetica, sans-serif; font-size:20px; cursor:pointer} .interiorCenter .leftcapsulas{ width:98%; float:left; margin: 0 2% 0 0} .interiorCenter .leftcapsulas h1{width:100%; float:left; color:#bda993; font-size:40px; line-height:40px} .interiorCenter .leftcapsulas h2{ width:100%; float:left; color:#bda993; font-size:32px; line-height:32px } .interiorCenter .rightcapsulas{ width:96%; float:left; margin: 30px 2% 0 2%; } .interiorCenter .rightcapsulas figure{ width:100%; float:left; margin:0 0 20px 0} .interiorCenter .rightcapsulas figure img{ width:100%; max-width:655px } .interiorCenter .rightcapsulas .boton{ margin:0 auto 50px auto; display:table; float:none} .interiorCenter .bloqueleftCap h4{ width:97%; float:left;color:#a52433;margin:35px 0 10px 3%; font-size:18px} .interiorCenter .bloqueleftCap hr{width:4%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 93% 10px 3%} .interiorCenter .bloqueleftCap p{ width:97%; float:left; font-size:16px; color:#4c382a; padding:10px 0 0 3%} .interiorCenter .bloquerightCap{ width:96%; float:left; margin: 30px 2% 0 2%} .interiorCenter .bloquerightCap .caracteristicas{ width:100%; float:left;} .interiorCenter .bloquerightCap .caracteristicas .carac{ width:100%; float:left; margin: 0 0 20px 0} .interiorCenter .bloquerightCap .caracteristicas .carac .icono{ width:10%; float:left; } .interiorCenter .bloquerightCap .caracteristicas .carac .icono img{ width:96%; float:left; } .interiorCenter .bloquerightCap .caracteristicas .carac p{ width:89%; float:left;color:#4c382a; font-size:16px; padding:0 0 0 1% } .interiorCenter .selloCap{ width:96%; float:left; text-align:center;margin:35px 2% 50px 2%;} .interiorCenter .selloCap img{ width:100%; max-width:278px } .interiorCenter .bloqueCap{ width:96%; float:left; margin:0 2% 50px 2%} .interiorCenter .bloqueCap h2{ width:100%; float:left; color:#bda993; font-size:26px } .interiorCenter .bloqueCap h3{ width:89%; float:left; color:#bda993; font-size:20px; margin: 0 0 0 11% } .interiorCenter .bloqueCap .labelTabs { margin: 0 0 0 11%; padding:10px 0!important; } .interiorCenter .bloqueCap .rowTabs { margin: 0 0 0 11%; padding: 10px 0 !important; } .interiorCenter .bloqueCap .colores{ width:100%; float:left; margin:20px 0 0 0; text-align:center;border-bottom:2px solid #c0ad98 } .interiorCenter .bloqueCap .colores figure{ width:35%; float:left; margin:0 2% 2% 2%} .interiorCenter .bloqueCap .colores figure img{ width:100%; max-width:119px;} .interiorCenter .bloqueCap .colores .gama{ width:57%; float:left; margin:30px 2% 0 2%} .interiorCenter .bloqueCap .colores .gama img{ width:11%; max-width:30px; margin:0 2% 2% 2%} .interiorCenter .bloqueCap p{ width:100%; float:left; color:#4c382a; font-size:16px; } .interiorCenter p.notaCap{ width:100%; float:left; color:#4c382a; margin:20px 0 20px 0; text-align:center; font-size:16px; padding:0} .interiorCenter .botonCap{ margin:50px auto 50px auto!important; display:table; float:none} .interiorCenter p.notaCap2{ width:100%; float:left; color:#4c382a; margin:20px 0 20px 0; text-align:right; font-size:16px} .interiorCenter .botonCap2{ margin:50px auto 50px auto!important; display:table; float:none} .interiorCenter p.asterisco{ width:100%; float:left; color:#4c382a; margin:20px 0 20px 0; text-align:left;font-family:ArialNarrow-Bold, Helvetica, sans-serif; font-size:16px} .interiorCenter h2.rightCap{ width:100%; float:left; font-size:30px; color:#bda993; text-align:right;} .interiorCenter h3.rightCap{width:100%; float:left; font-size:16px; color:#bda993; text-align:right;} .interiorCenter .estuches{ width:96%; float:left; margin:50px 2% 100px 2%; position:relative;} .interiorCenter .estuches figure{ width:100%; float:left; text-align:center} .interiorCenter .estuches figure img{width:100%; max-width:637px} .interiorCenter .estuches figure figcaption{ width:100%; float:left; text-align:center} .interiorCenter .estuches .plus{ position:absolute; top:-50px; right:0; z-index:2} .interiorCenter h2.leftCap{ width:100%; float:left; font-size:40px; color:#bda993;} .interiorCenter h3.leftCap{width:100%; float:left; font-size:26px; color:#bda993;} .interiorCenter .progresoCap{ width:96%; float:left; margin:30px 2% 30px 2%;} .interiorCenter .progresoCap .left{ width:100%; float:left; } .interiorCenter .progresoCap .right{ width:100%; float:left; } .interiorCenter .progresoCap .paso{ width:100%; float:left; margin:0 0 20px 0} .interiorCenter .progresoCap .paso3{ display:none} .interiorCenter .progresoCap .paso3Mov{ float:left} .interiorCenter .progresoCap .paso figure{ width:40%; float:left} .interiorCenter .progresoCap .paso figure img{ width:100%; max-width:199px} .interiorCenter .progresoCap .paso .datos{ width:60%; float:left; margin:20px 0 0 0} .interiorCenter .progresoCap .paso .datos h2{ width:100%; float:left;color:#a52433; font-size:20px} .interiorCenter .progresoCap .paso .datos hr{width:10%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 93% 10px 0} .interiorCenter .progresoCap .paso .datos p{ width:100%; float:left;color:#4c382a;padding:0; font-size:14px} .interiorCenter .resultadoCap{ width:96%; float:left; margin:30px 2% 0 2%} .interiorCenter .resultadoCap figure{ width:100%; float:left; text-align:center } .interiorCenter .resultadoCap figure img{ width:80%; max-width:309px } footer{ width:100%; float:left} footer .pie_cont{ width:96%; max-width:1280px; margin:0 auto; padding:20px 0 20px 0; border-top:1px solid #9f958d;} footer .pie_cont .left{ width:100%; float:left;} footer .pie_cont .left figure{ width:50%; float:left} footer .pie_cont .left figure img{ width:100%; max-width:258px} footer .pie_cont .left ul{ width:47%; float:left; margin:20px 0 0 1%; border-left:1px solid #9f958d; padding:0 0 0 2%} footer .pie_cont .left ul li{ list-style:none; padding:2px 0 3px 0; } footer .pie_cont .left ul li a{ text-decoration:none; color:#4c382a } footer .pie_cont .right{ width:100%; float:left; margin:20px 0 0 0} footer .pie_cont .right .opciones{ width:100%; float:left; margin:0 0 20px 0; position:relative } footer .pie_cont .right .opciones ul{ width:99%; float:left; display:inline; padding:0 0 10px 1%} footer .pie_cont .right .opciones ul li{ display:inline; margin:0 3px 0 0; font-size:13px} footer .pie_cont .right .opciones ul li a{ text-decoration:none; cursor:pointer} footer .pie_cont .right .opciones ul li a:hover{ color:#4c382a!important;} footer .pie_cont .right .opciones ul li a.on{ text-decoration:none;color:#4c382a} footer .pie_cont .right .opciones ul li a.off{ color:#d7d7d6} footer .pie_cont .right .opciones .descripcion {z-index:9; width:100%; max-width:300px; position:absolute; bottom:70px; text-align:center; display:none} footer .pie_cont .right .opciones .descripcion p{ color:#fff!important; padding:10px; background-color:#4a382c; font-size:12px; font-weight:normal; text-align:center; } footer .pie_cont .right .opciones .descripcion p strong { color: #fff !important; font-weight:bold; } footer .pie_cont .right .opciones .descripcion figure{ } footer .pie_cont .right .opciones .carrusel{width:98%; float:left; padding:0 0 0 2%} footer .pie_cont .right .opciones .carrusel .ant{width:5%; float:left; text-align:left; padding:30px 0 0 0} footer .pie_cont .right .opciones .carrusel .galeria_cont{width:88%; float:left; overflow:hidden; } footer .pie_cont .right .opciones .carrusel .galeria_cont .galeria{ width:100%;} footer .pie_cont .right .opciones .carrusel .sig{width:5%; float:left; text-align:right; padding:30px 0 0 0;} footer .pie_cont .right .datos{ width:96%; float:left;padding:4% 2% 0 2%; border-top:1px solid #9f958d} footer .pie_cont .right .datos .bloque{ width:50%; float:left; min-height:110px} footer .pie_cont .right .datos .bloque h2{ width:90%; float:left; font-size:18px;font-family:ArialNarrow-Bold, Helvetica, sans-serif; margin-top:0} footer .pie_cont .right .datos .bloque p{ width:90%; float:left; word-wrap:break-word; font-size:14px!important} footer .pie_cont .right .datos .bloque p a{text-decoration:none;color:#4c382a; } footer .pie_cont .right .redes{ width:96%; float:left; padding:4% 2% 4% 2%; border-top:1px solid #9f958d} footer .pie_cont .right .redes h2{ width:100%; float:left; font-weight:normal; margin: 0 0 5px 0; text-align:center;font-size:20px;font-family:ArialNarrow-Bold, Helvetica, sans-serif;} footer .pie_cont .right .redes .enlaces{ width:100%; float:left; text-align:center} footer .pie_cont .right .redes .enlaces img{ margin:0 10px 0 10px} footer .copy{ width:100%; float:left; background-color:#4c382a; color:#f3f2f0; font-size:14px; text-align:center; padding:25px 0 25px 0} footer .copy a{color:#f3f2f0; text-decoration:underline;} .error{ width:100%; max-width:1260px; margin:0 auto; display:table; padding:0; } .error .cabecera{width:100%; float:left} .error .cabecera img{ width:100%; max-width:1280px} /*.error h1{ width:90%; float:left; font-size:20px; color:#a52433;margin:5% 5% 0 5%;} .error hr{ width:3%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 92% 10px 5%;}*/ .error .intro{width:90%; float:left; margin:10% 5% 10% 5%; text-align:center; } .error .intro .dest{ color:#a62531; font-size:26px} .error .intro .boton{ width:auto; margin:50px auto 0 auto; display:table;border:2px #a52433 solid; cursor:pointer; padding:15px 50px 15px 50px; background:url(../../images/flecha_right.png); background-repeat:no-repeat; background-position:90% 50%} .bloque1 .banda,.bloque3 .right_cafe .paso1 .enlace,.bloque3 .left_cafe .enlace .opc,.rightint img {opacity:0; transition: all 3s ease-out;} .bloque1 .banda.fade-in,.bloque3 .right_cafe .paso1 .enlace.fade-in,.bloque3 .left_cafe .enlace .opc.fade-in, .rightint img.fade-in { opacity: 1;} .hide-effect {display:none;} .bloque2 p{display:none;} .bloque2 .iconos img {display:none;} .bloque2 .iconos img.anime-left {opacity:1;-webkit-animation-name: bounceInLeft;animation-name: bounceInLeft;transition: all 1s ease-out;} .paso2 .nube2 span {margin-bottom:9px; font-family:ArialNarrow-Bold, Helvetica, sans-serif;} .paso2 .nube2 .tam1{ font-size: 36px !important;-webkit-transition:all 1s ease;-moz-transition:all 1s ease;-o-transition:all 1s ease;transition:all 1s ease;} .paso2 .nube2 .tam2{ font-size: 32px !important;-webkit-transition:all 1s ease;-moz-transition:all 1s ease;-o-transition:all 1s ease;transition:all 1s ease;} .paso2 .nube2 .tam3{ font-size: 28px !important;-webkit-transition:all 1s ease;-moz-transition:all 1s ease;-o-transition:all 1s ease;transition:all 1s ease;} .paso2 .nube2 .tam4{ font-size: 24px !important;-webkit-transition:all 1s ease;-moz-transition:all 1s ease;-o-transition:all 1s ease;transition:all 1s ease;} .paso2 .nube2 .tam5{ font-size: 20px !important;-webkit-transition:all 1s ease;-moz-transition:all 1s ease;-o-transition:all 1s ease;transition:all 1s ease;} .paso2 .nube2 .tam6{ font-size: 16px !important;-webkit-transition:all 1s ease;-moz-transition:all 1s ease;-o-transition:all 1s ease;transition:all 1s ease;} .paso2 .nube2 .tam7{ font-size: 25px !important;-webkit-transition:all 1s ease;-moz-transition:all 1s ease;-o-transition:all 1s ease;transition:all 1s ease;} .paso2 .nube2 .tam1.zoom-txt{font-size: 26px !important;} .paso2 .nube2 .tam2.zoom-txt{font-size: 36px !important;} .paso2 .nube2 .tam3.zoom-txt{font-size: 36px !important;} .paso2 .nube2 .tam4.zoom-txt{font-size: 36px !important;} .paso2 .nube2 .tam5.zoom-txt{font-size: 36px !important;} .paso2 .nube2 .tam6.zoom-txt{font-size: 36px !important;} .paso1 .nube .tam1,.paso1 .nube .tam2,.paso1 .nube .tam3,.paso1 .nube .tam4,.paso1 .nube .tam5,.paso1 .nube .tam6,.paso1 .nube .tam7{ font-size: 0px !important;-webkit-transition:all 1s ease;-moz-transition:all 1s ease;-o-transition:all 1s ease;transition:all 1s ease;} .paso1 .nube .tam1.show{font-size: 27px !important;} .paso1 .nube .tam2.show{font-size: 28px !important;} .paso1 .nube .tam3.show{font-size: 16px !important;} .paso1 .nube .tam4.show{font-size: 21px !important;} .paso1 .nube .tam5.show{font-size: 40px !important;} .paso1 .nube .tam6.show{font-size: 21px !important;} .paso1 .nube .tam7.show{font-size: 26px !important;} .bloque4 .textoCarrera {display:none;} .zoom-img:hover img {-webkit-transform:scale(1.3);transform:scale(1.3);} .zoom-img {overflow:hidden;} .zoom-img img {transition:all .5s ease-in-out;} .parallax-cafe {position: relative;padding: 47em 0 0 0;overflow: hidden;margin: 0 auto -2em auto; } .parallax-cafe .coffee-beans {perspective: 1px;position: absolute;top: 0;bottom: 0;left: 0;right: 0;margin: 0 auto;text-align: center; } .parallax-cafe .coffee-beans img {position: absolute; width:100%;top: 0;left: 0;right: 0;margin: 0 auto; } .parallax-cafe .coffee-beans img:nth-of-type(1) {left: auto;margin: 0; } .parallax-cafe .coffee-beans img:nth-of-type(2) {right: auto;margin: 0; } .catalogo,.galeriaProd {display:none;} .cargar-mas {display:none;} .capaMapa{opacity:0; display:none;} .bloque3 .right_cafe{transition: all 3s ease-out;} .bloque3 .right_cafe.fade-inTop{padding: 250px 2% 0 2%;} .parallax-cafe figure img {margin-bottom:-4px;} .overlay {position: fixed;z-index: 999999;width: 100%;height: 100%;left: 0;top: 0;background-color: #f3f2f0;display: none;} .loading {width: 10%; z-index: 9999999;height: 65px;text-align: center;position: fixed;top: 40%;left: 45%} .slick-prev.slick-arrow, .slick-next.slick-arrow {display:none !important; z-index:1 !important; opacity:0 !important;} [data-elemento='carrousel-3'] .ant, [data-elemento='carrousel-3'] .sig {display:block;} @media only screen and (orientation:landscape){ header .logo img{ width:78%; } .bloque1{background-size:100%; min-height:700px; } .bloque1 h1{ width:70%; padding:40px 0 20px 80px; font-size:30px; text-align:left} .bloque1 .banda{padding:20px 0 20px 0} .bloque1 .banda .bloque{ width:31%; margin:0 1% 0 1%; } .bloque1 .banda .bloque .right h2{ font-size:20px;} .bloque2 .cont .iconos{width:25%; text-align:right} .bloque2 .cont p{width:65%; background-position:100% 35%; font-size:22px; margin:0 5% 0 2%; position:absolute; right:0; display:none} .bloque3{width:100%; display:table; margin:0 auto 50px auto} .bloque3 .left_cafe{width:46%; float:left; padding:0 2% 0 2%} .bloque3 .left_cafe .top{width:100%; } .bloque3 .left_cafe .top .lluvia{width:100%; } .bloque3 .left_cafe .top figure{width:100%; } .bloque3 .left_cafe .bottom{width:100%; } .bloque3 .left_cafe .bottom h2{ width:83%; float:left;font-size:30px;color:#a52433; margin:250px 7% 0 10%} .bloque3 .left_cafe .bottom hr{width:5%; float:left; border:0; background-color:#4c382a; height:2px;margin:5px 7% 10px 10%} .bloque3 .left_cafe .bottom p{ width:83%; float:left; margin:0 7% 30px 10%} .bloque3 .left_cafe .bottom .tipos{width:100%; float:left; text-align:center; } .bloque3 .left_cafe .bottom .tipos img{width:100%; max-width:480px } .bloque3 .left_cafe .bottom h3{ width:100%; float:left; text-align:center; color:#d7d7d6; margin:20px 0 20px 0; font-family:ArialNarrow-Bold, Helvetica, sans-serif; font-size:26px} .bloque3 .left_cafe .bottom .opc{ width:25%; float:left; text-align:center} .bloque3 .left_cafe .bottom figcaption{width:100%; font-size:16px} .bloque3 .right_cafe{width:46%; float:left; padding:400px 2% 0 2%} .bloque3 .right_cafe .paso1{ width:100%;} .bloque3 .right_cafe .paso1 h2{ width:80%;float:left; font-size:30px; font-family:ArialNarrow-Bold, Helvetica, sans-serif; margin:0 10% 75px 10%; line-height:35px; letter-spacing:-2px} .bloque3 .right_cafe .paso1 h3{ width:83%;float:left; font-size:30px;color:#a52433; margin:0 7% 0 10%} .bloque3 .right_cafe .paso1 hr{ width:5%;float:left; border:0; background-color:#4c382a; height:2px; margin:5px 0 10px 10%} .bloque3 .right_cafe .paso1 p{ width:83%;float:left;margin:0 7% 0 10%} .bloque3 .right_cafe .paso1 figure{ width:100%;float:left; text-align:center; margin:20px 0 20px 0} .bloque3 .right_cafe .paso1 figure img{ width:80%; max-width:342px} .bloque3 .right_cafe .paso1 h4 {width:100%; float:left; text-align:center;color:#d7d7d6; margin:20px 0 20px 0;font-family:ArialNarrow-Bold, Helvetica, sans-serif; font-size:26px} .bloque3 .right_cafe .paso1 .taza_cont{ width:100%; float:left; position:relative; min-height:650px ;max-height:754px } .bloque3 .right_cafe .paso1 .taza_cont .nube{width:51%; margin:0 0 0 25% } .bloque3 .right_cafe .paso1 .taza_cont figure{ width:100%; z-index:2; top:-220px;left:15%; text-align:center} .bloque3 .right_cafe .paso1 .taza_cont figure img{ width:90%; max-width:378px} .bloque3 .right_cafe .paso2{ width:100%; float:left} .bloque3 .right_cafe .paso2 .nube2{ width:75%; float:left; margin:5% 0 50px 25%} .bloque3 .right_cafe .paso2 .nube2 span{color:#a52432} .bloque3 .right_cafe .paso2 .nube2 .tam1{font-size:18px;} .bloque3 .right_cafe .paso2 .nube2 .tam2{font-size:30px;} .bloque3 .right_cafe .paso2 .nube2 .tam3{font-size:25px;} .bloque3 .right_cafe .paso2 .nube2 .tam4{font-size:22px;} .bloque3 .right_cafe .paso2 .nube2 .tam5{font-size:20px;} .bloque3 .right_cafe .paso2 .nube2 .tam6{font-size:40px;} .bloque4{width:100%; } .bloque4 .textoCarrera{width:100%; float:left} .bloque4 .textoCarrera h2{ width:95%; float:left;font-size:28px; padding:0 0 50px 0; margin:5px 0 0 5%} .bloque4 .textoCarrera h3{ width:85%; float:left;font-size:30px;color:#a52433; margin:0 0 0 15%} .bloque4 .textoCarrera hr{ width:5%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 0 10px 15%} .bloque4 .textoCarrera p{ width:63%; float:left; margin:0 22% 30px 15%} .bloque4 .textoCarrera h4 {width:85%;float:left; text-align:left;color:#d7d7d6; margin:10px 0 20px 15%;font-family:ArialNarrow-Bold, Helvetica, sans-serif; font-size:26px} .bloque4 .textoCarrera .nube3{ width:85%; float:left; margin:0 0 0 15%} .bloque4 .textoCarrera .nube3 span{color:#a52432;font-family:ArialNarrow-Bold, Helvetica, sans-serif; } .bloque4 .textoCarrera .nube3 .tam1{font-size:30px;} .bloque4 .textoCarrera .nube3 .tam2{font-size:40px;} .bloque4 .textoCarrera .nube3 .tam3{font-size:14px;} .bloque4 .textoCarrera .nube3 .tam4{font-size:25px;} .bloque4 .textoCarrera .nube3 .tam5{font-size:30px;} .bloque4 figure{width:100%; float:left} .bloque4 figure img{width:100%; max-width:840px} .bloque5{width:100%; background:url(../../images/fd_superacion.png); background-size:50%; background-repeat:no-repeat; background-position:bottom right; margin:100px auto 20px auto } .bloque5 figure{width:100%; float:left} .bloque5 figure img{width:100%; max-width:837px} .bloque5 .textoCompromiso{ width:77%; float:left;margin:5px 13% 10% 10%;} .bloque5 .textoCompromiso h2{ width:90%; float:left;font-size:30px;color:#a52433; margin:0 4% 0 6%} .bloque5 .textoCompromiso hr{ width:5%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 0 10px 6%} .bloque5 .textoCompromiso p{ width:90%; float:left; margin:0 4% 0 6%} .bloque5 .textoCompromiso h4 {width:100%;float:left; text-align:center;color:#d7d7d6; margin:10px 0 10px 0;font-family:ArialNarrow-Bold, Helvetica, sans-serif; font-size:26px} .bloque5 .textoCompromiso figure{ width:100%; float:left; text-align:center;margin:20px 0 10px 0} .bloque5 .textoCompromiso figure img { width:100%; max-width:159px} .interior .leftit h1{ font-size:40px; line-height:40px} .interior .leftit h2{ font-size:32px; line-height:32px} .interior .rightint{width:50%; float:right; text-align:center} .interior .leftint{width:100%; float:right; margin:10px 0 0 0} .interior .leftint p{ width:90%; padding:0 5% 0 5% } .interior .leftint ul.listado{ width:80%; float:left; margin:30px 10% 30px 10%} .interior .leftint .proyec{ width:46%; float:left; margin:2%; padding:2%; background-color:#fff; border:1px solid #e2e1de} .interior .leftint .proyec figure{ width:60%; float:left; } .interior .leftint .proyec p{ width:35%; float:none; font-size:14px; padding:0 0 0 0; position:absolute; right:10px; bottom:15px} interior .bloqueOPC{ width:31%; float:left; margin:50px 1% 0 1%} .interior .bloqueOPC .left{ width:40%; float:left; } .interior .bloqueOPC .left figure{ width:100%; float:left;text-align:center; } .interior .bloqueOPC .left figure img{ width:80%; max-width:156px} .interior .bloqueOPC .left .bt{ width:100%; float:left; text-align:center; margin:-40px 0 0 0 } .interior .bloqueOPC .right{ width:58%; float:left; margin:5px 0 0 2% } .interior .bloqueOPC .right h2{ width:100%; float:left; font-size:14px;color:#a52433;} .interior .bloqueOPC .right hr{ width:10%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 0 10px 0} .interior .bloqueOPC .right p{width:100%; float:left; font-size:14px} .nuestro{padding:80px 2% 0 2%!important;} .interiorCenter h1{ font-size:40px; line-height:40px} .interiorCenter .leftCafe{ width:28%; float:left; margin:0 0 0 4%} .interiorCenter .leftCafe h2{ width:100%; float:left;font-family:ArialNarrow-Bold, Helvetica, sans-serif; font-size:42px; line-height:42px} .interiorCenter .leftCafe figure{ width:100%; float:left} .interiorCenter .leftCafe figure img{ width:100%; max-width:315px} .interiorCenter .rightCafe{ width:68%; float:left; margin:0 } .interiorCenter .rightCafe h3{ width:97%; float:left;color:#a52433;margin:55px 0 10px 3%} .interiorCenter .rightCafe hr{width:4%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 93% 10px 3%} .interiorCenter .rightCafe p{ width:47%; float:left; padding:0 3% 0 3%; margin:0; font-size:16px;color:#4c382a;} .interiorCenter .rightCafe p span{color:#a52433; font-size:20px;font-family:ArialNarrow-Bold, Helvetica, sans-serif;} .interiorCenter .rightCafe .bt_cta{border:2px #a52433 solid; cursor:pointer; padding:15px 50px 15px 50px; margin:50px 50px 50px 0; background:url(../../images/flecha_right.png); background-repeat:no-repeat; background-position:90% 50%} .interiorCenter .bt_cta{border:2px #a52433 solid; cursor:pointer; padding:15px 50px 15px 50px; margin:50px 50px 50px 0; background:url(../../images/flecha_right.png); background-repeat:no-repeat; background-position:90% 50%} .interiorCenter .leftsoluble{ width:48%; float:left; margin: 0 2% 0 0} .interiorCenter .leftsoluble h1{ font-size:40px; line-height:40px} .interiorCenter .leftsoluble h2{ font-size:32px; line-height:32px} .interiorCenter .leftsoluble h3{width:100%; float:left; font-size:36px; color:#bda993} .interiorCenter .leftsoluble h4{ width:95%; float:left;color:#a52433;margin:35px 0 10px 5%} .interiorCenter .leftsoluble hr{width:4%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 93% 10px 5%} .interiorCenter .leftsoluble p{ width:95%; float:left; font-size:14px; color:#4c382a; padding:10px 0 0 5%} .interiorCenter .rightsoluble{ width:48%; float:left; margin: 30px 2% 0 0} .interiorCenter .rightsoluble figure{ width:100%; float:left; margin:100px 0 20px 0} .interiorCenter .rightsoluble figure img{ width:100%; } .interiorCenter .rightsoluble .boton{ margin:0 auto 50px auto; display:table; float:none} .interiorCenter .bloqueProd{ width:46%; float:left;margin:25px 2% 25px 2%} .interiorCenter .bloqueProd h2{ width:100%; float:left; color:#bda993; font-size:22px } .interiorCenter .bloqueProd h3{ width:91%; float:left; color:#bda993;font-size:18px; margin: 0 0 0 9% } .interiorCenter .bloqueProd .imgProd{ width:100%; float:left; margin:20px 0 0 0; text-align:center } .interiorCenter .bloqueProd .imgProd img{ width:56%; margin:0 2% 0 2%} .interiorCenter .bloqueProd p{ width:100%; float:left; color:#4c382a; font-size:14px; } .interiorCenter p.nota{ width:100%; float:left; color:#4c382a;} .interiorCenter .boton2{ margin:50px auto 50px auto; display:table; float:none} .interiorCenter h2.right{ width:100%; float:left; font-size:40px; color:#bda993; text-align:right} .interiorCenter h3.right{width:100%; float:left; font-size:26px; color:#bda993; text-align:right} .interiorCenter .envases{ width:96%; float:left; margin:50px 2% 100px 2%; position:relative} .interiorCenter .envases figure{ width:100%; float:left} .interiorCenter .envases figure img{width:80%;} .interiorCenter .envases .plus{ position:absolute; top:-50px; right:0; z-index:2} .interiorCenter h2.left{ width:100%; float:left; font-size:40px; color:#bda993; } .interiorCenter h3.left{width:100%; float:left; font-size:26px; color:#bda993} .interiorCenter .progreso{ width:96%; float:left; margin:30px 2% 200px 2%; background:url(../../images/fd_curva.png); background-repeat:no-repeat; background-position:top center; background-size:90%} .interiorCenter .progreso .left{ width:50%; float:left; } .interiorCenter .progreso .right{ width:50%; float:left; } .interiorCenter .progreso .paso{ float:left; margin:0 0 20px 0;height:130px} .interiorCenter .progreso .paso1{width:70%;float:left;} .interiorCenter .progreso .paso2{width:70%;float:right; margin:0 10% 0 0} .interiorCenter .progreso .paso3{width:70%;float:left; display:block; margin:0 0 0 10%} .interiorCenter .progreso .paso3 figure{float:right!important;} .interiorCenter .progreso .paso3Mov{float:left;display:none} .interiorCenter .progreso .paso4{ width:70%;float:right;} .interiorCenter .progreso .paso4 figure{ float:right!important;} .interiorCenter .progreso .paso figure{ width:50%; float:left} .interiorCenter .progreso .paso figure img{width:100%; float:left} .interiorCenter .progreso .paso .datos{ width:50%;float:left; margin:20px 0 0 0} .interiorCenter .progreso .paso .datos h2{ width:100%; float:left;color:#a52433; font-size:14px} .interiorCenter .progreso .paso .datos hr{width:10%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 93% 10px 0} .interiorCenter .progreso .paso .datos p{ width:100%; float:left;color:#4c382a; font-size:12px; } .interiorCenter .resultado{ width:96%; float:left; margin:-250px 2% 30px 2%} .interiorCenter .resultado figure{ width:100%; float:left; text-align:center } .interiorCenter .resultado figure img{ width:25%; max-width:353px } .interiorCenter .leftcapsulas{ width:50%; float:left; margin: 0 2% 0 0} .interiorCenter .leftcapsulas h1{ font-size:40px; line-height:40px} .interiorCenter .leftcapsulas h2{ font-size:32px; line-height:32px} .interiorCenter .rightcapsulas{ width:44%; float:left; margin: 30px 2% 0 2%; text-align:center} .interiorCenter .rightcapsulas figure{ width:100%; float:left; margin:0 0 20px 0} .interiorCenter .rightcapsulas figure img{ width:100%; max-width:655px } .interiorCenter .rightcapsulas .boton{ margin:0 auto 50px auto; display:table; float:none} .interiorCenter .bloqueleftCap h4{ width:97%; float:left;color:#a52433;margin:35px 0 10px 3%; font-size:18px} .interiorCenter .bloqueleftCap hr{width:4%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 93% 10px 3%} .interiorCenter .bloqueleftCap p{ width:97%; float:left; font-size:16px; color:#4c382a; padding:10px 0 0 3%} .interiorCenter .bloquerightCap{ width:96%; float:left; margin: 30px 2% 0 2%} .interiorCenter .bloquerightCap .caracteristicas{ width:100%; float:left;} .interiorCenter .bloquerightCap .caracteristicas .carac{ width:100%; float:left; margin: 0 0 20px 0} .interiorCenter .bloquerightCap .caracteristicas .carac .icono{ width:10%; float:left; } .interiorCenter .bloquerightCap .caracteristicas .carac .icono img{ width:96%; float:left; } .interiorCenter .bloquerightCap .caracteristicas .carac p{ width:89%; float:left;color:#4c382a; font-size:16px; padding:0 0 0 1% } .interiorCenter .selloCap{ width:96%; float:left; text-align:center;margin:35px 2% 50px 2%;} .interiorCenter .selloCap img{ width:100%; max-width:278px } .interiorCenter .bloqueCap{ width:96%; float:left; margin:0 2% 50px 2%} .interiorCenter .bloqueCap h2{ width:100%; float:left; color:#bda993; font-size:26px } .interiorCenter .bloqueCap h3{ width:89%; float:left; color:#bda993; font-size:20px; margin: 0 0 0 11% } .interiorCenter .bloqueCap .labelTabs { margin: 0 0 0 11%; padding:10px 0px!important; } .interiorCenter .bloqueCap .rowTabs { margin: 0 0 0 11%; padding: 10px 0px !important; } .interiorCenter .bloqueCap .colores { width: 100%; float: left; margin: 20px 0 0 0; text-align: center; border-bottom: 2px solid #c0ad98 } .interiorCenter .bloqueCap .colores figure{ width:46%; float:left; margin:0 2% 2% 2%} .interiorCenter .bloqueCap .colores figure img{ width:100%; max-width:119px;} .interiorCenter .bloqueCap .colores .gama{ width:46%; float:left; margin:30px 2% 0 2%} .interiorCenter .bloqueCap .colores .gama img{ width:11%; max-width:30px; margin:0 2% 2% 2%} .interiorCenter .bloqueCap p{ width:100%; float:left; color:#4c382a; font-size:16px; } .interiorCenter p.notaCap{ width:100%; float:left; color:#4c382a; margin:20px 0 20px 0} .interiorCenter .botonCap{ margin:50px auto 50px auto!important; display:table; float:none} .interiorCenter p.notaCap2{ width:100%; float:left; color:#4c382a; margin:20px 0 20px 0} .interiorCenter .botonCap2{ margin:50px auto 50px auto!important; display:table; float:none} .interiorCenter h2.rightCap{ width:100%; float:left; font-size:40px; color:#bda993; text-align:right} .interiorCenter h3.rightCap{width:100%; float:left; font-size:26px; color:#bda993; text-align:right} .interiorCenter .estuches{ width:96%; float:left; margin:50px 2% 100px 2%; position:relative} .interiorCenter .estuches figure{ width:100%; float:left; text-align:center} .interiorCenter .estuches figure img{width:100%; max-width:637px} .interiorCenter .estuches figure figcaption{ width:100%; float:left; text-align:center} .interiorCenter .estuches .plus{ position:absolute; top:-50px; right:0; z-index:2} .interiorCenter h2.leftCap{ width:100%; float:left; font-size:40px; color:#bda993; } .interiorCenter h3.leftCap{width:100%; float:left; font-size:26px; color:#bda993} .interiorCenter .progresoCap{ width:96%; float:left; margin:30px 2% 30px 2%} .interiorCenter .progresoCap .left{ width:100%; float:left; } .interiorCenter .progresoCap .right{ width:100%; float:left; } .interiorCenter .progresoCap .paso{ width:100%; float:left; margin:0 0 20px 0} .interiorCenter .progresoCap .paso3{ display:none} .interiorCenter .progresoCap .paso3Mov{ float:left} .interiorCenter .progresoCap .paso figure{ width:40%; float:left} .interiorCenter .progresoCap .paso figure img{ width:100%; max-width:199px} .interiorCenter .progresoCap .paso .datos{ width:60%; float:left; margin:20px 0 0 0} .interiorCenter .progresoCap .paso .datos h2{ width:100%; float:left;color:#a52433; font-size:20px} .interiorCenter .progresoCap .paso .datos hr{width:10%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 93% 10px 0} .interiorCenter .progresoCap .paso .datos p{ width:100%; float:left;color:#4c382a;padding:0; font-size:14px} .interiorCenter .resultadoCap{ width:96%; float:left; margin:30px 2% 0 2%} .interiorCenter .resultadoCap figure{ width:100%; float:left; text-align:center } .interiorCenter .resultadoCap figure img{ width:80%; max-width:309px } footer{ width:100%; float:left} footer .pie_cont{ width:96%; margin:0 auto; border-top:1px solid #9f958d;} footer .pie_cont .left{ width:100%; float:left;} footer .pie_cont .left figure{ width:50%; float:left} footer .pie_cont .left figure img{ width:100%; max-width:258px} footer .pie_cont .left ul{width:47%; float:left;margin:30px 0 0 1%; border-left:1px solid #9f958d; padding:0 0 0 2%} footer .pie_cont .left ul li{list-style:none; padding:6px 0 6px 0; } footer .pie_cont .left ul li a{ text-decoration:none } footer .pie_cont .right{ width:100%; float:left; margin:0 0 0 0} footer .pie_cont .right .opciones{ width:100%; float:left; margin:0 0 20px 0; position:relative;border-bottom:1px solid #9f958d; } footer .pie_cont .right .opciones ul{ width:98%; float:left; display:inline; padding:0 0 0 2%} footer .pie_cont .right .opciones ul li{ display:inline; margin:0 20px 0 0} footer .pie_cont .right .opciones ul li a{ text-decoration:none} footer .pie_cont .right .opciones ul li a:hover{ color:#4c382a!important;} footer .pie_cont .right .opciones ul li a.on{ text-decoration:none} footer .pie_cont .right .opciones ul li a.off{ color:#d7d7d6} footer .pie_cont .right .opciones .descripcion{ width:200px; position:absolute; bottom:70px; text-align:center} footer .pie_cont .right .opciones .descripcion p{ color:#fff!important; padding:10px; background-color:#4a382c; font-size:12px; font-weight:normal} footer .pie_cont .right .opciones .descripcion p strong { color:#fff !important; font-weight:bold; } footer .pie_cont .right .opciones .descripcion figure{ } footer .pie_cont .right .opciones .carrusel{width:97%; float:left; padding:0 0 0 2%} footer .pie_cont .right .opciones .carrusel .ant{width:3%; float:left; text-align:left; padding:30px 0 0 0} footer .pie_cont .right .opciones .carrusel .galeria_cont{width:92%; float:left; overflow:hidden} footer .pie_cont .right .opciones .carrusel .galeria_cont .galeria{ float:left} footer .pie_cont .right .opciones .carrusel .sig{width:3%; float:left; text-align:right; padding:30px 0 0 0} footer .pie_cont .right .datos{ width:58%; float:left; padding:0 0 0 2%; border:0} footer .pie_cont .right .datos .bloque{ width:33%; float:left} footer .pie_cont .right .datos .bloque h2{ width:90%; float:left} footer .pie_cont .right .datos .bloque p{ width:90%; float:left; word-wrap:break-word} footer .pie_cont .right .datos .bloque p a{text-decoration:none} footer .pie_cont .right .redes{ width:37%; float:left;padding:0 0 0 2%; border-top:none; border-left:1px solid #9f958d; } footer .pie_cont .right .redes h2{ width:100%; float:left; font-weight:normal; margin: 0 0 5px 0} footer .pie_cont .right .redes .enlaces{ width:100%; float:left;} footer .pie_cont .right .redes .enlaces img{ margin:0 10px 0 10px} footer .copy{ width:100%; float:left; background-color:#4c382a; color:#f3f2f0; font-size:14px; text-align:center; padding:25px 0 25px 0} footer .copy a{color:#f3f2f0; text-decoration:underline;} } @media screen and (min-width:768px) { header{ padding:10px 0 20px 0;} header .logo{ width:30%; margin: 10px 0 20px 2%} header .idiomas {display:block; width:18%; float:right; margin:0 2% 20px 0;} header .idiomas .globo{ float:left; margin:0 10px 0 0} header .idiomas .lang{ width:50%; float:left; position:relative} header .idiomas .lang ul{ width:90%; float:left; position:absolute} header .idiomas .lang li{ list-style:none; cursor:pointer} header .idiomas .lang li a{ color: #4c382a; text-decoration:none} header .idiomas .lang li a:hover{ color: #a32732} header .idiomas .lang li:first-child{ background:url(../../images/flecha_menu.gif); background-repeat:no-repeat; background-position:99% 50%} header .idiomas .lang li:last-child{ display:none} header .menumov{ display:none} header nav{ width:99%; margin: 0 0 0 1%; background:none; background-color:#fff; display:block } header nav hr{ width:25px; float:left; border:0; background-color:#a52433; height:2px; margin:5px 0 0 15px; } header nav .lisubmenuOff hr{display:none} header nav .lisubmenuOn hr{display:block} header nav .idioma{display:none} header nav .redes{ display:none} .bloque1{background-size:100%; min-height:680px; } .bloque1 h1{ width:60%; padding:60px 0 80px 80px; font-size:30px; text-align:left} .bloque1 .banda{ padding:20px 0 20px 0} .bloque1 .banda .bloque{ width:31%; margin:0 1% 0 1%; } .bloque1 .banda .bloque .right h2{ font-size:20px;} .bloque2 .cont .iconos{width:30%; text-align:right} .bloque2 .cont p{width:60%; background-position:97% 35%;font-size:22px; margin:0 5% 0 2%; position:absolute; right:0} .bloque3{width:96%; margin:0 auto 100px auto; padding:0 2% 0 2%} .bloque3 .left_cafe{width:49%; float:left; padding:0 1% 0 0} .bloque3 .left_cafe .bottom h2{ width:83%;font-size:18px;margin:250px 7% 0 10%} .bloque3 .left_cafe .bottom hr{ margin:5px 7% 10px 10%} .bloque3 .left_cafe .bottom p{ width:83%; float:left; margin:0 7% 30px 10%} .bloque3 .left_cafe .bottom .tipos{width:100%; } .bloque3 .left_cafe .bottom h3{ font-size:30px} .bloque3 .left_cafe .bottom figcaption{font-size:16px} .bloque3 .right_cafe{width:49%; padding:400px 0 0 1%; margin:0} .bloque3 .right_cafe .paso1 h2{ font-size:50px; margin:0 10% 75px 10%; line-height:50px;} .bloque3 .right_cafe .paso1 h3{ font-size:18px; margin:0 7% 0 10%} .bloque3 .right_cafe .paso1 h4 { font-size:30px} .bloque3 .right_cafe .paso1 .taza_cont{ width:100%; float:left; position:relative; min-height:550px } .bloque3 .right_cafe .paso1 .taza_cont figure{ top:-270px; } .bloque3 .right_cafe .paso1 .taza_cont figure img{ width:85%;} .bloque4 .textoCarrera{width:48%; } .bloque4 .textoCarrera h2{font-size:38px; padding:0 0 20px 0; margin:5px 0 0 5%} .bloque4 .textoCarrera h3{ width:85%; font-size:18px; margin:0 0 0 15%} .bloque4 .textoCarrera hr{ margin:5px 0 10px 15%} .bloque4 .textoCarrera p{ width:63%; margin:0 22% 30px 15%} .bloque4 .textoCarrera h4 {width:85%; margin:10px 0 20px 15%;font-size:30px} .bloque4 .textoCarrera .nube3 { /*width: 85%;*/ margin: 0 0 0 15%; width:60%; } .bloque4 figure{width:52%; float:right} .bloque5{ background-size:40%; background-position:top right; margin:100px auto 20px auto; } .bloque5 figure{width:45%;} .bloque5 .textoCompromiso{ width:45%; margin:5px 5% 10% 5%;} .bloque5 .textoCompromiso h2{font-size:18px;} .bloque5 .textoCompromiso h4 { font-size:30px} .interior{ font-size:16px } .interior .leftit h1{font-size:50px; line-height:50px} .interior .leftit h2{font-size:28px; line-height:28px} .interior .leftint{width:100%; float:right; margin:0 0 0 0} .interior .leftint p{ width:100%; padding:20px 7% 0 7%;} .interior .leftint ul.listado{ width:77%; margin:30px 15% 30px 8%} .interior .leftint .proyec{ width:40%; float:left; margin:2%; padding:2%; background-color:#fff; border:1px solid #e2e1de} .interior .leftint .proyec figure{ width:60%; float:left; } .interior .leftint .proyec p{ right:10px; bottom:18px} /*interiores productos*/ .interiorCenter h1{font-size:50px; line-height:50px} .interiorCenter p{ font-size:24px; } .interiorCenter .lupas{ min-height:277px} .interiorCenter .lupas .lupaopc { width:100%; position:absolute; top:0; z-index:1; text-align:right; display:block; } .interiorCenter .lupas .lupaopc img{ width:100%; max-width:950px} .interiorCenter .lupas .producto{ position:absolute; top:46px; z-index:2} .interiorCenter .lupas .uno{ width:45%;left:0} /*.interiorCenter .lupas .dos{ width:55%; left:47%;}*/ .interiorCenter .lupas .dos { width: 55%; left: 43%; } .interiorCenter .lupas .producto h2{ width:93%; margin:0 0 0 7% } .interiorCenter .lupas .producto hr{margin:5px 93% 10px 7%} .interiorCenter .lupas .producto p{ font-size:14px;} .interiorCenter .lupas .uno p{ width:55%; margin:5px 0 10px 7%;} .interiorCenter .lupas .dos p{ width:38%; margin:5px 0 10px 7%;} .interiorCenter .lupas .uno .boton{ width:28%; float:left; margin:7% 0 0 10%; cursor:pointer} .interiorCenter .lupas .dos .boton{width:50%; float:left; margin:7% 0 0 0; cursor:pointer} .interiorCenter .lupas .producto .boton span{ display:none} .nuestro{padding:80px 2% 0 2%!important;} .interiorCenter .leftCafe{ width:28%; float:left; margin:0 0 0 4%} .interiorCenter .leftCafe h2{ width:100%; float:left;font-family:ArialNarrow-Bold, Helvetica, sans-serif; font-size:40px; line-height:40px} .interiorCenter .leftCafe figure{ width:100%; float:left} .interiorCenter .leftCafe figure img{ width:100%; max-width:315px} .interiorCenter .rightCafe{ width:68%; float:left; margin:0 } .interiorCenter .rightCafe h3{ width:97%; float:left;color:#a52433;margin:55px 0 10px 3%} .interiorCenter .rightCafe hr{width:4%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 93% 10px 3%} .interiorCenter .rightCafe p{ width:47%; float:left; padding:0 3% 0 3%; margin:0; font-size:16px;color:#4c382a;} .interiorCenter .rightCafe p span{color:#a52433;font-size:24px;font-family:ArialNarrow-Bold, Helvetica, sans-serif;} .interiorCenter .rightCafe .boton{ width:auto; float:right; margin:0 } .interiorCenter .rightCafe .bt_cta{border:2px #a52433 solid; cursor:pointer; padding:15px 50px 15px 50px; margin:50px 50px 50px 0; background:url(../../images/flecha_right.png); background-repeat:no-repeat; background-position:90% 50%} .interiorCenter .boton{ width:auto; float:right; margin:0 } .interiorCenter .bt_cta{border:2px #a52433 solid; cursor:pointer; padding:15px 50px 15px 50px; margin:50px 50px 50px 0; background:url(../../images/flecha_right.png); background-repeat:no-repeat; background-position:90% 50%} .fdmapa{ min-height:156px;} .fdmapa .mapa{ width:55%; margin:0 auto; padding:5% 7% 0 5%;background-position:99% 65%; } .fdmapa .botonMapa{ background-size:19%; } .fdmapa .botonMapa img{ cursor:pointer} .fdmapa .capaMapa{ width:80%; position:absolute; top:-168%; z-index:9999; left:10%;} .interiorCenter .leftsoluble{ margin: 0 2% 0 0} .interiorCenter .leftsoluble h1{font-size:50px; line-height:50px} .interiorCenter .leftsoluble h2{font-size:28px; line-height:28px} .interiorCenter .leftsoluble h3{width:100%; float:left; font-size:36px; color:#bda993} .interiorCenter .rightsoluble figure{ margin:0 0 20px 0} .interiorCenter .bloqueProd{ width:46%; float:left; margin:25px 2% 25px 2%} .interiorCenter .bloqueProd h2{ font-size:24px } .interiorCenter .bloqueProd h3{ font-size:20px; } .interiorCenter .bloqueProd .imgProd{ width:38%; border-right:2px solid #bda993 } .interiorCenter .bloqueProd .imgProd img{ width:96%; float:left; } .interiorCenter .bloqueProd p{ width:60%;} .interiorCenter p.nota{ font-size:14px; text-align:center} .interiorCenter .envases figure img{width:70%;} .interiorCenter .progreso{ width:96%; float:left; margin:30px 2% 85px 2%; background:url(../../images/fd_curva.png); background-repeat:no-repeat; background-position:top center; background-size:90%} .interiorCenter .progreso .left{ width:50%; float:left; } .interiorCenter .progreso .right{ width:50%; float:left; } .interiorCenter .progreso .paso{ width:100%; float:left; margin:0 0 20px 0; height:160px} .interiorCenter .progreso .paso1{width:70%;} .interiorCenter .progreso .paso2{width:70%; float:right; margin:0 10% 0 0} .interiorCenter .progreso .paso3Mov{ display:none} .interiorCenter .progreso .paso3{width:70%; float:left;display:block; margin:0 0 0 10%} .interiorCenter .progreso .paso3 figure{ float:right!important;} .interiorCenter .progreso .paso4{width:70%; float:right;} .interiorCenter .progreso .paso4 figure{ float:right!important;} .interiorCenter .progreso .paso figure{ width:58%; float:left} .interiorCenter .progreso .paso figure img{ width:100%; float:left} .interiorCenter .progreso .paso .datos{ width:42%; float:left; margin:10px 0 0 0} .interiorCenter .progreso .paso .datos h2{ width:100%; float:left;color:#a52433;font-size:16px} .interiorCenter .progreso .paso .datos hr{width:10%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 93% 5px 0} .interiorCenter .progreso .paso .datos p{ width:100%; float:left;color:#4c382a;font-size:14px;} .interiorCenter .resultado{ width:96%; float:left; margin:-260px 2% 30px 2%} .interiorCenter .resultado figure{ width:100%; float:left; text-align:center } .interiorCenter .resultado figure img{ width:25%; max-width:353px } .catalogo{ width:96%; max-width:1280px; position:absolute; top:200px; right:0; z-index:999; padding:10px 2% 0 2%; display:table; background-color:#fff;} .catalogo .tits{ width:40%; float:left} .catalogo .tits h1{ width:100%; float:left; color:#4c382a; font-size:44px;font-family:ArialNarrow-Bold, Helvetica, sans-serif;} .catalogo .tits h2{width:100%; float:left; color:#bda993; font-size:80px;font-family:ArialNarrow-Bold, Helvetica, sans-serif;} .catalogo .tits h3{width:100%; float:left; color:#bda993; font-size:44px;font-family:ArialNarrow-Bold, Helvetica, sans-serif;} .catalogo figure{ width:60%; float:left; margin:50px 0 0 0} .catalogo figure img{ width:100%; max-width:630px} .catalogo .menu{ width:95%; float:left; border:1px solid #e2e2e2; padding:1% 2%; margin:50px 0 50px 0} .catalogo .menu .opc{ width:auto; float:left; text-align:center; border-bottom:0; border-right:1px solid #9f2330; padding:0 5% 0 5%; word-break:normal} .catalogo .menu .opc:first-child{ text-align:left; padding:0 5% 0 0} .catalogo .menu .opc:last-child{ border-right:0;} .catalogo .menu .opc span{ width:100%;float:left; padding:0; margin:0; text-align:left;color:#bda993; cursor:pointer} .catalogo .menu .opc span.on{ width:100%;float:left; padding:5px 0 0 0; margin:0; text-align:left;color:#4c382a; background-color:#fff} .catalogo .menu .opc span.off{ width:100%;float:left; padding:5px 0 0 0; margin:0; text-align:left;color:#bda993;} .catalogo .menu .opc span:hover{ width:100%;float:left; padding:5px 0 0 0; margin:0; text-align:left;color:#4c382a} .catalogo .menu .opc hr{width:10px; float:left; border:0; background-color:#a52433; height:2px; margin:5px 0 10px 0;} .catalogo .menu .opcOff hr{display:none} .catalogo .menu .opcOn hr{display:block} .catalogo .listadoProd{ width:100%; float:left; position:relative; margin:0 0 20px 0} .catalogo .listadoProd .prod{ width:30%; float:left;border:1px solid #e2e2e2; cursor:pointer; margin:1%; text-align:center; position:relative; height:auto} .catalogo .listadoProd .prod img{ width:100%; max-width:350px;transition: all 0.2s linear;} .catalogo .listadoProd .prod p{ width:100%; text-align:center; color:#4c382a; font-family:ArialNarrow-Bold, Helvetica, sans-serif; padding:5px 0 5px 0} .catalogo .listadoProd .prod .mascara {opacity: 0;text-align:center; position:absolute; top:0; width:100%; height:100%;background-color: rgba(0,0,0, 0.4);transition: all 0.3s ease-in-out;} .catalogo .listadoProd .prod .mascara img{ width:auto; margin:30% 0 0 0 } .catalogo .listadoProd .prod:hover .mascara {opacity: 1;} .catalogo .listadoProd .prod:hover img {transform: scale(0.7);} .catalogo .bloquesCat .listadoProd{ width:100%; float:left; position:relative; margin:0 0 20px 0} .catalogo .bloquesCat .listadoProd .prod{ width:30%; float:left;border:1px solid #e2e2e2; cursor:pointer; margin:1%; text-align:center; position:relative; height:auto} .catalogo .bloquesCat .listadoProd .prod img{ width:100%; max-width:350px;transition: all 0.2s linear;} .catalogo .bloquesCat .listadoProd .prod p{ width:100%; text-align:center; color:#4c382a; font-family:ArialNarrow-Bold, Helvetica, sans-serif; padding:5px 0 5px 0} .catalogo .bloquesCat .listadoProd .prod .mascara {opacity: 0;text-align:center; position:absolute; top:0; width:100%; height:100%;background-color: rgba(0,0,0, 0.4);transition: all 0.3s ease-in-out;} .catalogo .bloquesCat .listadoProd .prod .mascara img{ width:auto; margin:30% 0 0 0 } .catalogo .bloquesCat .listadoProd .prod:hover .mascara {opacity: 1;} .catalogo .bloquesCat .listadoProd .prod:hover img {transform: scale(0.7);} .catalogo .galeriaProd{ width:100%; float:left; position:relative; margin:0 0 20px 0} .catalogo .galeriaProd .ant{ width:20%; float:left; text-align:center; margin:20% 0 0 0} .catalogo .galeriaProd .ant img{ width:30%; max-width:41px;} .catalogo .galeriaProd .sig{ width:20%; float:left; text-align:center; margin:20% 0 0 0} .catalogo .galeriaProd .sig img{ width:30%; max-width:41px;} .catalogo .galeriaProd .carrusel{ width:60%; float:left; text-align:center} .catalogo .galeriaProd .carrusel figure{ width:100%; float:left; text-align:center} .catalogo .galeriaProd .carrusel figure img{ width:100%; max-width:650px} .catalogo .galeriaProd figcaption{width:100%; text-align:center; color:#4c382a; font-family:ArialNarrow-Bold, Helvetica, sans-serif; padding:5px 0 5px 0} .interiorCenter .leftcapsulas{ width:50%; float:left; margin: 0 2% 0 0} .interiorCenter .leftcapsulas h1{font-size:50px; line-height:50px} .interiorCenter .leftcapsulas h2{font-size:28px; line-height:28px} .interiorCenter .rightcapsulas{ width:44%; float:left; margin: 0 2% 0 2%} .interiorCenter .rightcapsulas figure{ width:100%; float:left; margin:0 0 20px 0} .interiorCenter .rightcapsulas figure img{ width:100%; max-width:655px } .interiorCenter .bloqueleftCap{ width:46%; float:left; margin: 0 2% 0 2%} .interiorCenter .bloqueleftCap h4{ width:97%; float:left;color:#a52433;margin:0 0 10px 3%; font-size:18px} .interiorCenter .bloqueleftCap hr{width:4%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 93% 10px 3%} .interiorCenter .bloqueleftCap p{ width:97%; float:left; font-size:16px; color:#4c382a; padding:10px 0 0 3%} .interiorCenter .bloquerightCap{ width:46%; float:left; margin: 0 2% 0 2%} .interiorCenter .bloquerightCap .caracteristicas{ width:100%; float:left; margin:60px 0 0 0} .interiorCenter .bloquerightCap .caracteristicas .carac{ width:100%; float:left; margin: 0 0 20px 0} .interiorCenter .bloquerightCap .caracteristicas .carac .icono{ width:10%; float:left; } .interiorCenter .bloquerightCap .caracteristicas .carac .icono img{ width:96%; float:left; } .interiorCenter .bloquerightCap .caracteristicas .carac p{ width:89%; float:left;color:#4c382a; font-size:16px; padding:0 0 0 1% } .interiorCenter .selloCap{ width:46%; float:left; text-align:center;margin:35px 2% 50px 2%;} .interiorCenter .selloCap img{ width:100%; max-width:278px } .interiorCenter .bloqueCap{ width:46%; float:left; margin:0 2% 50px 2%} .interiorCenter .bloqueCap h2{ width:100%; float:left; color:#bda993; font-size:26px } .interiorCenter .bloqueCap h3{ width:89%; float:left; color:#bda993; font-size:20px; margin: 0 0 0 11% } .interiorCenter .bloqueCap .labelTabs { margin: 0 0 0 11%; padding: 10px 0px !important; } .interiorCenter .bloqueCap .rowTabs { margin: 0 0 0 11%; padding: 10px 0px !important; } .interiorCenter .bloqueCap .colores figure{ width:35%; float:left; margin:0 2% 2% 2%} .interiorCenter .bloqueCap .colores figure img{ width:100%; max-width:119px;} .interiorCenter .bloqueCap .colores .gama{ width:57%; float:left; margin:30px 2% 0 2%} .interiorCenter .bloqueCap .colores .gama img{ width:11%; max-width:30px; margin:0 2% 2% 2%} .interiorCenter .bloqueCap p{ width:100%; float:left; color:#4c382a; font-size:16px; } .interiorCenter p.notaCap{ width:100%; float:left; color:#4c382a; margin:20px 0 20px 0;} .interiorCenter .botonCap{ margin:50px auto 50px auto!important; display:table; float:none} .interiorCenter p.notaCap2{ width:100%; float:left; color:#4c382a; margin:0 0 20px 0} .interiorCenter .botonCap2{ margin:10px 0 50px 0!important; display:table; float:right} .interiorCenter h2.rightCap{ width:100%; float:left; font-size:40px; color:#bda993; text-align:right} .interiorCenter h3.rightCap{width:100%; float:left; font-size:26px; color:#bda993; text-align:right} .interiorCenter .estuches{ width:96%; float:left; margin:50px 2% 100px 2%; position:relative} .interiorCenter .estuches figure{ width:100%; float:left; text-align:center} .interiorCenter .estuches figure img{width:100%; max-width:637px} .interiorCenter .estuches figure figcaption{ width:100%; float:left; text-align:center} .interiorCenter h2.leftCap{ width:100%; float:left; font-size:40px; color:#bda993; } .interiorCenter h3.leftCap{width:100%; float:left; font-size:26px; color:#bda993} .interiorCenter .progresoCap{ width:96%; float:left; margin:30px 2% 85px 2%; background:url(../../images/fd_curva.png); background-repeat:no-repeat; background-position:top center; background-size:90%} .interiorCenter .progresoCap .left{ width:50%; float:left; } .interiorCenter .progresoCap .right{ width:50%; float:left; } .interiorCenter .progresoCap .paso{ width:100%; float:left; margin:0 0 20px 0; height:160px} .interiorCenter .progresoCap .paso1{width:70%;} .interiorCenter .progresoCap .paso2{width:70%; float:right; margin:0 10% 0 0} .interiorCenter .progresoCap .paso3Mov{ display:none} .interiorCenter .progresoCap .paso3{width:70%; float:left;display:block; margin:0 0 0 10%} .interiorCenter .progresoCap .paso3 figure{ float:right!important;} .interiorCenter .progresoCap .paso4{width:70%; float:right;} .interiorCenter .progresoCap .paso4 figure{ float:right!important;} .interiorCenter .progresoCap .paso figure{ width:58%; float:left} .interiorCenter .progresoCap .paso figure img{ width:100%; float:left} .interiorCenter .progresoCap .paso .datos{ width:42%; float:left; margin:10px 0 0 0} .interiorCenter .progresoCap .paso .datos h2{ width:100%; float:left;color:#a52433;font-size:16px} .interiorCenter .progresoCap .paso .datos hr{width:10%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 93% 5px 0} .interiorCenter .progresoCap .paso .datos p{ width:100%; float:left;color:#4c382a;font-size:14px;} .interiorCenter .resultadoCap{ width:96%; float:left; margin:-290px 2% 30px 2%} .interiorCenter .resultadoCap figure{ width:100%; float:left; text-align:center } .interiorCenter .resultadoCap figure img{ width:25%; max-width:309px } footer .pie_cont .left{ width:45%; padding:60px 0 0 0} footer .pie_cont .left ul li{padding:2px 0 2px 0; } footer .pie_cont .right{ width:55%;} footer .pie_cont .right .opciones ul{padding:0 0 0 2%} footer .pie_cont .right .opciones ul li{ margin:0 20px 0 0} footer .pie_cont .right .opciones .carrusel{width:97%;border-left:1px solid #9f958d; padding:0 0 0 2%} footer .pie_cont .right .opciones .carrusel .ant{width:3%;} footer .pie_cont .right .opciones .carrusel .galeria_cont{width:92%; } footer .pie_cont .right .opciones .carrusel .sig{width:3%;} footer .pie_cont .right .datos{ width:97%; border-top:0; padding:0 0 0 2%} footer .pie_cont .right .datos .bloque{ width:33%;} footer .pie_cont .right .datos .bloque p a{text-decoration:none; font-size:11px} footer .pie_cont .right .redes{ width:97%; border-left:1px solid #9f958d; border-top:0; padding:0 0 0 2%; margin:20px 0 20px 0} [data-elemento='carrousel-3'] .ant, [data-elemento='carrousel-3'] .sig {display:block !important;} .right_cafe .paso1 .enlace {opacity:1 !important;} } @media screen and (min-width:990px) { header{ padding:10px 0 20px 0;} header .logo{ width:24%; margin: 40px 0 20px 2%} header .logo img{ width:100%; max-width:314px} header nav{ width:74%; padding:25px 0 0 0; margin:0} header .idiomas {display:block; width:12%; float:right; margin:0 2% 20px 0;} .bloque1{background-size:auto; min-height:822px; } .bloque1 h1{ width:50%; padding:200px 0 20px 50px; text-shadow: none; color:#c5b29b;} .bloque1 .banda{padding:50px 0 50px 0} .bloque1 .banda .bloque{ width:33%; margin:0} .bloque1 .banda .bloque .right h2{ font-size:25px;} .bloque2 .cont p{background-position:100% 60%; padding:50px 5% 0 0;} .bloque3{width:100%; margin:0 auto 50px auto} .bloque3 .left_cafe{width:46%; padding:0 2% 0 2%} .bloque3 .left_cafe .bottom h2{ font-size:22px;} .bloque3 .left_cafe .bottom h3{ font-size:35px} .bloque3 .left_cafe .bottom .opc{ width:20%;} .bloque3 .left_cafe .bottom figcaption{ font-size:20px} .bloque3 .right_cafe{width:46%; padding:400px 2% 0 2%} .bloque3 .right_cafe .paso1 h3{font-size:22px; margin:0 7% 0 10%} .bloque3 .right_cafe .paso1 h4 {font-size:35px} .bloque3 .right_cafe .paso1 .taza_cont{ min-height:610px; margin:150px 0 0 0; max-height:610px } .bloque3 .right_cafe .paso1 .taza_cont .nube{margin:0 0 0 27% } .bloque3 .right_cafe .paso1 .taza_cont figure{ top:-300px;} .bloque3 .right_cafe .paso1 .taza_cont figure img{ width:80%;} .bloque3 .right_cafe .paso2 .nube2{ width:73%; float:left; margin:5% 0 50px 27%} .bloque3 .right_cafe .paso2 .nube2 .tam1{font-size:100%;} .bloque3 .right_cafe .paso2 .nube2 .tam2{font-size:250%;} .bloque3 .right_cafe .paso2 .nube2 .tam3{font-size:195%;} .bloque3 .right_cafe .paso2 .nube2 .tam4{font-size:155%;} .bloque3 .right_cafe .paso2 .nube2 .tam5{font-size:130%;} .bloque3 .right_cafe .paso2 .nube2 .tam6{font-size:300%;} .bloque4 .textoCarrera h2{ font-size:50px; padding:0 0 50px 0;} .bloque4 .textoCarrera h3{font-size:22px;} .bloque4 .textoCarrera h4 {font-size:35px} .bloque5 .textoCompromiso{ width:35%; margin:5px 10% 10% 10%;} .bloque5 .textoCompromiso h2{font-size:22px;} .bloque5 .textoCompromiso h4 { font-size:35px} .interior .leftit{ width:41%; float:left;margin:40px 4% 2% 5%;} .interior .leftit h3{ width:82%; margin:30px 8% 0 10%; font-size:20px;} .interior .leftit hr{ margin:5px 0 10px 10%} .interior .leftit p{width:88%;margin:0 2% 0 10%;} .interior .leftit .listadoPoliticas { width: 88%; margin: 0 2% 0 14%; } .interior .leftit .listadoPoliticas li { margin-top:10px; } .interior .leftit .listadoPoliticas li a { color: #a52433; font-weight:bold; } .interior .leftit .listadoPoliticas li a:hover { color: #bda993; } .interior .rightint .logoPolitica { width: 90%; max-width: 400px; margin-left: 20px; } .interior .righfoto{width:50%; float:right;} .interior .rightint{text-align:center} .interior .leftint{width:50%; float:right; margin:10px 0 0 0 } .interior .leftint p{ width:70%; padding:0 } .interior .leftint ul.listado{ width:62%; margin:30px 0 30px 15%} .interior .leftint ul.listado li{ list-style-image:url(../../images/bullet.gif); padding:0 0 10px 0} .interior .leftint .proyec p{ font-size:12px; bottom:8px} .width95pc{ width:95%!important; } /*interiores productos*/ .interiorCenter .lupas { min-height: 340px } .interiorCenter .lupas .lupaopc { width:100%; position:absolute; top:0; z-index:1; text-align:right} .interiorCenter .lupas .producto{ top:85px;} .interiorCenter .lupas .producto p{ font-size:16px;} .interiorCenter .lupas .dos p{ width:38%; margin:5px 3% 10px 7%;} /*.interiorCenter .lupas .uno .boton{ width:23%; margin:7% 0 0 15%;}*/ .interiorCenter .lupas .uno .boton { width: 23%; margin: 7% 0 0 23%; } .interiorCenter .rightCafe .boton{ width:auto; float:right; margin:0 100px 50px 0 } .fdmapa .botonMapa{ background-size:16%; padding:0 0 35px 0} .fdmapa .capaMapa{ width:70%; position:absolute; top:-158%; z-index:9999; left:15%;} .interiorCenter .h1solubles{ font-size:24px} .interiorCenter .leftsoluble{ width:46%; float:left; margin: 0 2% 60px 2%} .interiorCenter .leftsoluble p{font-size:16px; padding:10px 0 0 5%} .interiorCenter .rightsoluble figure{margin:70px 0 20px 0} .interiorCenter .bloqueProd h2{ font-size:30px } .interiorCenter .bloqueProd h3{ width:93%; margin: 0 0 0 7% } .interiorCenter .bloqueProd p{ font-size:16px; padding:18px 0 0 3%} .interiorCenter p.nota{ font-size:16px;} .interiorCenter h2.right{ width:100%; float:left; font-size:60px; color:#bda993; text-align:right} .interiorCenter .envases figure img{width:70%;} .interiorCenter h2.left{ width:100%; float:left; font-size:60px; color:#bda993; } .interiorCenter .progreso{ background-size:auto} .interiorCenter .progreso .paso{ margin:10px 0 20px 0; height:220px} .interiorCenter .progreso .paso1{width:60%;} .interiorCenter .progreso .paso2{width:60%; margin:0 20% 0 0} .interiorCenter .progreso .paso3{width:60%; margin:0 0 0 20%} .interiorCenter .progreso .paso4{width:60%;} .interiorCenter .progreso .paso figure{ width:55%;} .interiorCenter .progreso .paso .datos{ width:45%;} .interiorCenter .progreso .paso .datos h2{ font-size:18px} .interiorCenter .resultado{ margin:-390px 2% 30px 2%} .interiorCenter .resultado figure img{ width:30%;} .interiorCenter .leftcapsulas{ width:50%; float:left; margin: 0 2% 0 0} .interiorCenter .leftcapsulas h2{ width:100%; float:left; font-size:50px; line-height:50px; color:#bda993; } .interiorCenter .leftcapsulas h3{width:100%; float:left; font-size:36px; line-height:50px; color:#bda993} .interiorCenter .rightcapsulas{ width:44%; float:left; margin: 0 2% 0 2%} .interiorCenter .rightcapsulas figure{ width:100%; float:left; margin:0 0 20px 0} .interiorCenter .rightcapsulas figure img{ width:auto; max-width:655px } .interiorCenter .bloqueleftCap{ width:46%; float:left; margin: 50px 2% 0 2%} .interiorCenter .bloqueleftCap h4{ width:97%; float:left;color:#a52433;margin:0 0 10px 3%; font-size:18px} .interiorCenter .bloqueleftCap hr{width:4%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 93% 10px 3%} .interiorCenter .bloqueleftCap p{ width:97%; float:left; font-size:16px; color:#4c382a; padding:10px 0 0 3%} .interiorCenter .bloquerightCap{ width:46%; float:left; margin: 50px 2% 0 2%} .interiorCenter .bloquerightCap .caracteristicas{ width:100%; float:left; margin:50px 0 0 0} .interiorCenter .bloquerightCap .caracteristicas .carac{ width:100%; float:left; margin: 0 0 20px 0} .interiorCenter .bloquerightCap .caracteristicas .carac .icono{ width:10%; float:left; } .interiorCenter .bloquerightCap .caracteristicas .carac .icono img{ width:96%; float:left; } .interiorCenter .bloquerightCap .caracteristicas .carac p{ width:89%; float:left;color:#4c382a; font-size:16px; padding:15px 0 0 1% } .interiorCenter .selloCap{ width:46%; float:left; text-align:center;margin:85px 2% 50px 2%;} .interiorCenter .selloCap img{ width:100%; max-width:278px } .interiorCenter .bloqueCap{ width:46%; float:left; margin:85px 2% 50px 2%} .interiorCenter .bloqueCap h2{ width:100%; float:left; color:#bda993; font-size:26px } .interiorCenter .bloqueCap h3{ width:92%; float:left; color:#bda993; font-size:20px; margin: 0 0 0 8% } .interiorCenter .bloqueCap .labelTabs { margin: 0 0 0 8%; padding: 10px 0px !important; } .interiorCenter .bloqueCap .rowTabs { margin: 0 0 0 8%; padding: 10px 0px !important; } .interiorCenter .bloqueCap .colores{ width:50%; float:left; margin:20px 0 0 0; text-align:center;border-bottom:0; border-right:2px solid #c0ad98 } .interiorCenter .bloqueCap .colores figure{ width:100%; float:left; margin:0; text-align:center } .interiorCenter .bloqueCap .colores figure img{ width:100%; max-width:119px;} .interiorCenter .bloqueCap .colores .gama{ width:100%; float:left; margin:10px 0 0 0} .interiorCenter .bloqueCap .colores .gama img{ width:11%; max-width:30px; margin:0 2% 2% 2%} .interiorCenter .bloqueCap p{ width:50%; float:left; color:#4c382a; font-size:16px; margin:10px 0 0 0 } .interiorCenter p.notaCap{ width:100%; float:left; color:#4c382a; margin:20px 0 20px 0;} .interiorCenter .botonCap{ margin:50px auto 50px auto!important; display:table; float:none} .interiorCenter p.notaCap2{ width:100%; float:left; color:#4c382a; margin:0 0 20px 0} .interiorCenter .botonCap2{ margin:10px 0 150px 0!important; display:table; float:right} .interiorCenter h2.rightCap{ width:100%; float:left; font-size:40px; color:#bda993; text-align:right} .interiorCenter h3.rightCap{width:100%; float:left; font-size:26px; color:#bda993; text-align:right} .interiorCenter .estuches{ width:96%; float:left; margin:50px 2% 100px 2%; position:relative} .interiorCenter .estuches figure{ width:100%; float:left; text-align:center} .interiorCenter .estuches figure img{width:100%; max-width:637px} .interiorCenter .estuches figure figcaption{ width:100%; float:left; text-align:center} .interiorCenter h2.leftCap{ width:100%; float:left; font-size:40px; color:#bda993; } .interiorCenter h3.leftCap{width:100%; float:left; font-size:26px; color:#bda993} .interiorCenter .progresoCap{margin:30px 2% 30px 2%; background-size:auto} .interiorCenter .progresoCap .paso{ margin:10px 0 20px 0; height:220px} .interiorCenter .progresoCap .paso1{width:60%;} .interiorCenter .progresoCap .paso2{width:60%; margin:30px 20% 0 0} .interiorCenter .progresoCap .paso3{width:60%; margin:30px 0 0 20%} .interiorCenter .progresoCap .paso4{width:60%; } .interiorCenter .progresoCap .paso figure{ width:55%;} .interiorCenter .progresoCap .paso .datos{ width:45%; } .interiorCenter .progresoCap .paso .datos h2{ font-size:18px} .interiorCenter .resultadoCap{ margin:-420px 2% 30px 2%} .interiorCenter .resultadoCap figure img{ width:30%; } footer .pie_cont .left{ width:35%;padding:30px 0 0 0} footer .pie_cont .right{ width:65%; } footer .pie_cont .right .opciones{ border:0 } /*footer .pie_cont .right .opciones .descripcion{ width:200px; position:absolute; bottom:100px; text-align:center}*/ footer .pie_cont .right .opciones .descripcion { width: 100%; position: absolute; bottom: 100px; text-align: center; max-width:400px; } footer .pie_cont .right .datos{ width:61%; margin:0 0 20px 0} footer .pie_cont .right .datos .bloque h2{font-size:14px} footer .pie_cont .right .redes{ width:34%; margin:0} footer .pie_cont .right .redes h2{ font-size:14px} footer .pie_cont .right .redes .enlaces img{ margin:0 5px 0 5px} } @media screen and (min-width:1025px) { body {font-size:16px;} header{ padding:10px 0 50px 0;} header .logo{ width:23%; margin:40px 0 0 0;text-align:center; padding: 0 0 0 2% } header nav{ width:73%; padding:10px 0 0 6%} .bloque1 .banda{ width:100%; float:none; display:table; background-color: rgba(243, 242, 240, 0.8); padding:50px 0 50px 0} .bloque1 .banda .bloque{ width:31%; float:left} .bloque1 .banda .bloque .left{ width:50%; float:left; position:relative} .bloque1 .banda .bloque .left .foto{ width:100%;text-align:center; } .bloque1 .banda .bloque .left .boton{ width:100%; text-align:center; position:absolute; bottom:-40px} .bloque1 .banda .bloque .right{ width:50%; float:left} .bloque1 .banda .bloque .right h2{ width:100%; float:left; font-size:25px; color:#a52433} .bloque1 .banda .bloque .right hr{ width:10%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 0 10px 0} .bloque1 .banda .bloque .right p{ width:100%; float:left} .bloque2{width:100%; display:table; background-color:#fdfdfd; padding:20px 0 20px 0} .bloque2 .cont .iconos{width:20%; float:left; text-align:right} .bloque2 .cont p{width:68%; float:left; background:url(../../images/comillas.png); background-position:95% 55%; background-repeat:no-repeat; padding:50px 5% 0 0; font-size:24px; margin:0 5% 0 2%} .bloque3 .left_cafe .bottom h3{ font-size:46px} .bloque3 .right_cafe .paso1 h4 {font-size:43px} .bloque3 .right_cafe .paso1 .taza_cont{max-height:754px } .bloque3 .right_cafe .paso1 .taza_cont .nube{width:51%; margin:0 0 0 12% } .bloque3 .right_cafe .paso1 .taza_cont figure{top:-320px; left:auto;} .bloque3 .right_cafe .paso1 .taza_cont figure img{ width:100%;} .bloque3 .right_cafe .paso2 .nube2{ width:88%; float:left; margin:5% 0 50px 12%} .bloque3 .right_cafe .paso2 .nube2 .tam1{font-size:28px;} .bloque3 .right_cafe .paso2 .nube2 .tam2{font-size:50px;} .bloque3 .right_cafe .paso2 .nube2 .tam3{font-size:35px;} .bloque3 .right_cafe .paso2 .nube2 .tam4{font-size:32px;} .bloque3 .right_cafe .paso2 .nube2 .tam5{font-size:30px;} .bloque3 .right_cafe .paso2 .nube2 .tam6{font-size:70px;} .bloque4 .textoCarrera h4 { font-size:46px} .bloque5 .textoCompromiso{ width:32%; margin:5px 13% 10% 10%;} .bloque5 .textoCompromiso h4 { font-size:46px} .bloque5 .textoCompromiso figure img { width:100%;} .interior{ font-size:16px } .interior .leftit h1{ font-size:70px; line-height:70px} .interior .leftit h2{ font-size:38px; line-height:38px} .interior .leftit h3{ font-size:24px;} .interior .leftit p{width:82%; margin:0 8% 0 10%;} .interior .leftint p{ width:500px; clear:both } .interior .leftint ul.listado{ width:500px; clear:both} .interior .leftint .proyec{ width:300px; float:left; margin:1% 2% 1% 0; padding:2%; background-color:#fff; border:1px solid #e2e1de} .interior .leftint .proyec figure{ width:70%; float:left; margin: 0; padding:0} .interior .leftint .proyec figure img{ width:auto; max-width:179px } .interior .leftint .proyec p{ width:30%; font-size:14px; bottom:10px; clear:inherit} /*interiores productos*/ .interiorCenter h1{font-size:70px; line-height:70px} .interiorCenter .lupas{min-height:443px} .interiorCenter .lupas .producto{ top:139px;} /*.interiorCenter .lupas .uno p{ width:55%;}*/ .interiorCenter .lupas .uno p { width: 45%; } .interiorCenter .lupas .dos p{margin:5px 4% 10px 7%;} .interiorCenter .lupas .dos .boton{ margin:5% 0 0 0; } .fdmapa{background-size:auto; min-height:208px;} .fdmapa .mapa{ width:620px;padding:20px 5% 0 5%; background-position:96% 19%;font-size:24px;} .fdmapa .botonMapa{background-position:top center; background-size:auto; padding:20px 0 78px 0} .fdmapa .capaMapa{ width:50%; position:absolute; top:-115%; z-index:9999; left:25%;} .interiorCenter .bloqueProd h3{ margin: 0 0 0 29px } .interiorCenter .rightCafe h3{ width:97%; float:left;color:#a52433;margin:95px 0 10px 3%} .interiorCenter .progreso .paso{ height:250px; } .interiorCenter .progreso .paso1{width:50%; margin:0 0 0 80px} .interiorCenter .progreso .paso2{width:50%;} .interiorCenter .progreso .paso3{width:50%;} .interiorCenter .progreso .paso4{width:50%; margin:0 80px 0 0} .interiorCenter .progreso .paso4 figure{ float:right!important;} .interiorCenter .progreso .paso .datos h2{ font-size:20px} .interiorCenter .progreso .paso .datos p{font-size:16px;} .interiorCenter .resultado{margin:-450px 2% 30px 2%} .interiorCenter .resultado figure img{ width:auto; max-width:353px } .interiorCenter .leftsoluble h1{ font-size:70px; line-height:70px} .interiorCenter .leftsoluble h2{ font-size:38px; line-height:38px} .interiorCenter .leftCafe h2{ width:100%; float:left;font-family:ArialNarrow-Bold, Helvetica, sans-serif; font-size:60px; line-height:60px} .interiorCenter .leftcapsulas{ width:50%; float:left; margin: 0 2% 0 0} .interiorCenter .leftcapsulas h1{ font-size:70px; line-height:70px} .interiorCenter .leftcapsulas h2{ font-size:38px; line-height:38px} .interiorCenter .rightcapsulas{ width:44%; float:left; margin: 0 2% 0 2%} .interiorCenter .rightcapsulas figure{ width:100%; float:left; margin:0 0 20px 0} .interiorCenter .rightcapsulas figure img{ width:auto; max-width:655px } .interiorCenter .bloqueleftCap { width: 46%; float: left; /*margin: 50px 2% 0 2%;*/ margin:0px 2% 0 2%; } .interiorCenter .bloqueleftCap h4{ width:97%; float:left;color:#a52433;margin:0 0 10px 3%; font-size:18px} .interiorCenter .bloqueleftCap hr{width:4%; float:left; border:0; background-color:#4c382a; height:2px; margin:5px 93% 10px 3%} .interiorCenter .bloqueleftCap p{ width:97%; float:left; font-size:16px; color:#4c382a; padding:10px 0 0 3%} .interiorCenter .bloquerightCap { width: 46%; float: left; /*margin: 50px 2% 0 2%;*/ margin: 0px 2% 0 2% } .interiorCenter .bloquerightCap .caracteristicas{ width:100%; float:left;} .interiorCenter .bloquerightCap .caracteristicas .carac{ width:100%; float:left; margin: 0 0 20px 0} .interiorCenter .bloquerightCap .caracteristicas .carac .icono{ width:10%; float:left; } .interiorCenter .bloquerightCap .caracteristicas .carac .icono img{ width:96%; float:left; } .interiorCenter .bloquerightCap .caracteristicas .carac p{ width:89%; float:left;color:#4c382a; font-size:16px;} .interiorCenter .selloCap{ width:46%; float:left; text-align:center;margin:85px 2% 50px 2%;} .interiorCenter .selloCap img{ width:100%; max-width:278px } .interiorCenter .bloqueCap{ width:46%; float:left; margin:85px 2% 50px 2%} .interiorCenter .bloqueCap h2{ width:100%; float:left; color:#bda993; font-size:26px } .interiorCenter .bloqueCap h3{ width:92%; float:left; color:#bda993; font-size:20px; margin: 0 0 0 8% } .interiorCenter .bloqueCap .labelTabs { margin: 0 0 0 8%; padding: 10px 0px !important; } .interiorCenter .bloqueCap .rowTabs { margin: 0 0 0 8%; padding: 10px 0px !important; } .interiorCenter .bloqueCap .colores{ width:50%; float:left; margin:20px 0 0 0; text-align:center;border-bottom:0; border-right:2px solid #c0ad98; height:102px } .interiorCenter .bloqueCap .colores figure{ width:100%; float:left; margin:0; text-align:center } .interiorCenter .bloqueCap .colores figure img{ width:100%; max-width:119px;} .interiorCenter .bloqueCap .colores .gama{ width:100%; float:left; margin:10px 0 0 0} .interiorCenter .bloqueCap .colores .gama img{ width:11%; max-width:30px; margin:0 2% 2% 2%} .interiorCenter .bloqueCap p{ width:50%; float:left; color:#4c382a; font-size:16px; margin:10px 0 0 0 } .interiorCenter p.notaCap{ width:100%; float:left; color:#4c382a; margin:20px 0 20px 0;} .interiorCenter .botonCap{ margin:50px auto 50px auto!important; display:table; float:none} .interiorCenter p.notaCap2{ width:100%; float:left; color:#4c382a; margin:0 0 20px 0} .interiorCenter .botonCap2{ margin:10px 0 150px 0!important; display:table; float:right} .interiorCenter h2.rightCap{ width:100%; float:left; font-size:40px; color:#bda993; text-align:right} .interiorCenter h3.rightCap{width:100%; float:left; font-size:26px; color:#bda993; text-align:right} .interiorCenter .estuches{ width:96%; float:left; margin:50px 2% 100px 2%; position:relative} .interiorCenter .estuches figure{ width:100%; float:left; text-align:center} .interiorCenter .estuches figure img{width:100%; max-width:637px} .interiorCenter .estuches figure figcaption{ width:100%; float:left; text-align:center} .interiorCenter h2.leftCap{ width:100%; float:left; font-size:40px; color:#bda993; } .interiorCenter h3.leftCap{width:100%; float:left; font-size:26px; color:#bda993} .interiorCenter .progresoCap .paso{ height:250px; } .interiorCenter .progresoCap .paso1{width:50%; margin:0 0 0 80px} .interiorCenter .progresoCap .paso2{width:50%;} .interiorCenter .progresoCap .paso3{width:50%;} .interiorCenter .progresoCap .paso4{width:50%; margin:0 80px 0 0} .interiorCenter .progresoCap .paso4 figure{ float:right!important;} .interiorCenter .progresoCap .paso .datos h2{font-size:20px} .interiorCenter .progresoCap .paso .datos p{font-size:16px;} .interiorCenter .resultadoCap{ margin:-480px 2% 30px 2%} .interiorCenter .resultadoCap figure img{ width:30%;} footer .pie_cont .left{ padding:0} footer .pie_cont .left ul li{ padding:6px 0 6px 0; } footer .pie_cont .right .datos{ width:57%; padding:0 0 0 2%} footer .pie_cont .right .datos .bloque p a{ font-size:14px} footer .pie_cont .right .redes{ width:37%;} footer .pie_cont .right .redes .enlaces img{ margin:0 10px 0 10px} } @media screen and (min-width:1280px){.bloque1 .banda .bloque{ width:410px; float:left}} @media screen and (min-width:1400px) { .bloque2 .cont p{width:55%; max-width:814px; background-position:97% 35%;font-size:22px; margin:0 5% 0 2%; position:absolute; left:35%} .interiorCenter .lupas .dos p{ width:40%; margin:5px 0 10px 7%;} /*.interiorCenter .lupas .dos .boton{width:51%; float:left; margin:5% 0 0 2%}*/ .interiorCenter .lupas .dos .boton { width: 40%; float: left; margin: 5% 0 0 13%; } .interiorCenter .rightCafe .boton{ width:auto; float:right; margin:0 110px 50px 0 } .interior .leftint .proyec p{ bottom:15px; font-size:13px; width:30%} .fdmapa .mapa{width:643px; padding:30px 3% 0 5%;} .fdmapa .botonMapa{padding:58px 0 77px 0} } @media screen and (min-width:2000px) { .fdmapa .mapa{ width:706px} } /*LOADING*/ .loading {display: none;position: fixed;top: 0; left: 0;width: 100%;height: 100%;} .catalogo {display: none;} /*ODS*/ .redLink { color: #a52433; } .imgodsend{ width:100%!important; text-align:center; margin-top:20px; } .pl15{ padding-left:15px; } .slick-track img{ cursor:pointer; } /*capsulas compatibles video*/ .bloqueVideo{ text-align:center; margin-top:50px; } .separator60{ height:60px; } #videoCapsulasCompatibles { width: 1000px; height: 563px; margin-bottom:20px; } @media(max-width:700px){ .bloqueVideo { margin-top: 0px; } } @media(max-width:1000px){ #videoCapsulasCompatibles { width: 600px; height: 432px; } .interiorCenter .bloquerightCap .caracteristicas { margin-bottom: 80px; } } @media(max-width:700px) { .interiorCenter .rightcapsulas figure img { width: 100%; max-width: 80%; } } @media(max-width:600px) { #videoCapsulasCompatibles { width: 500px; height: 282px; margin-top:-50px; } } @media(max-width:500px) { #videoCapsulasCompatibles { width: 400px; height: 225px; } } @media(max-width:400px) { #videoCapsulasCompatibles { width: 380px; height: 214px; } } @media(max-width:379px) { #videoCapsulasCompatibles { width: 320px; height: 180px; } } .bloqueCap .rowTabs { width: 100%; float: left; } .bloqueCap .rowTabs .tab { width: 30%; float: left; border: 2px solid #bda993; padding: 8px; color: #bda993; text-transform: uppercase; text-align: center; margin-right: 5px; font-weight: bold; cursor: pointer; font-size: 14px; } .bloqueCap .rowTabs .tab:hover { border: 2px solid #a52433; color: #a52433; } .bloqueCap .rowTabs .tab.active { border: 2px solid #a52433; color: #a52433; } @media(max-width:1139px) { .bloqueCap .rowTabs .tab { font-size: 12px; } } @media(max-width:999px) { .bloqueCap .rowTabs .tab { font-size: 10px; } } @media(max-width:860px){ .bloqueCap .rowTabs .tab { font-size:8px; } } @media(max-width:500px) { .bloqueCap .rowTabs .tab { font-size: 10px; padding:8px 3px; width: 28%; } } @media(max-width:380px) { .bloqueCap .rowTabs .tab { font-size: 8px; padding: 8px 1px; width: 28%; } } @media(min-width:1000px){ .mt100 { margin-top: 100px !important; } } .interiorCenter .bloqueCap .labelDescriptionTabs { margin: 0 0 0 8%; padding: 10px 0px !important; } .interiorCenter .bloqueCap .labelDescriptionTabs p { width:100%; } .alert:after { font-family: 'Roboto', Arial, Helvetica, sans-serif; position: absolute; right: 15px; top: 15px; content: ""; font-size: 25px; color: #fff; cursor: pointer; } .alert { position: fixed; top: 50%; left: 50%; width: 60%; max-width: 1200px; height: auto; padding: 15px; border-radius: 15px; -moz-border-radius: 15px; -webkit-border-radius: 15px; background-color: #fff; color: #fff; text-align: center; -moz-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); border: 2px solid #a52433; z-index: 9999999; } @media(max-width:800px){ .alert { width: 90%; } } .alert img{ width:100%; max-width:1200px; } .hide { display: none; } .cerrarBanner { width: 20px; float: right; cursor: pointer; } .bloque3_1 { width: 100%; display: table; text-align: center; padding: 20px 0 20px 0; } .bloque3_1 img { width: 100%; max-width: 712px; } /*productos/productos prosol responsive*/ @media(max-width:1380px) { .interiorCenter .lupas .dos .boton { margin: 5% 0 0 12%; width: 38%; } } @media(max-width:1225px){ .interiorCenter .lupas .producto h2 { width: 93%; margin: 0 7% 0 0; } .interiorCenter .lupas .uno p { width: 40%; margin: 5px 0 10px 0%; } .interiorCenter .lupas .dos p { width: 35%; margin: 5px 3% 10px 0%; } } @media(max-width:1198px) { .interiorCenter .lupas .dos .boton { margin: 5% 0 0 16%; width: 34%; } } @media(max-width:1152px) { .interiorCenter .lupas .producto h2 { font-size: 1.2em; } .interiorCenter .lupas .uno p { font-size: 0.9em; width: 35%; } .interiorCenter .lupas .dos p { font-size: 0.9em; } } @media(max-width:1119px) { .interiorCenter .lupas .producto h2 { font-size: 1.2em; } .interiorCenter .lupas .uno p { font-size: 0.9em; width: 35%; } .interiorCenter .lupas .dos p { font-size: 0.9em; } } @media(max-width:1118px) { .interiorCenter .lupas .producto { top: 20px; } } @media(max-width:930px) { .interiorCenter .lupas .producto { top: 10px; } .interiorCenter .lupas .uno p { font-size: 0.9em; width: 60%; } .interiorCenter .lupas .dos p { font-size: 0.9em; width: 70%; } .interiorCenter .lupas .dos .boton { margin: 5% 0 0 0%; width: 0%; } } .video-responsive { height: 0; overflow: hidden; padding-bottom: 56.25%; padding-top: 30px; position: relative; } .video-responsive iframe, .video-responsive object, .video-responsive embed { height: 100%; left: 0; position: absolute; top: 0; width: 100%; } .bt_new{ border: 2px #a52433 solid; cursor: pointer; padding: 15px 50px 15px 50px; background: url(../../images/flecha_right.png); background-repeat: no-repeat; background-position: 90% 50% } .posBtnNew{ margin-bottom:80px; text-align:right; } .mb15 { margin-bottom: 5px!important; } .mb25 { margin-bottom: 25px !important; } .rowCustom{ display:flex; flex-direction:row; width:100%; } .nowrap{ flex-wrap:nowrap } .row-space-between{ justify-content:space-between } .row-center{ align-items:center; } .row-space-evenly{ justify-content:space-evenly } .column { display: flex; flex-direction: column; } .colCustom { display: flex; flex-direction: column; flex-basis: 100%; flex:1; } .colCustom-8 { display: flex; flex-direction: column; flex-basis: 100%; flex: 2; } .pcolForm{ padding:5px; } .divContainerCafes { width: 83%; float: left; /*margin: 0 7% 30px 10%;*/ margin-left:40px; margin-bottom:80px; /*background-color:red;*/ } .divContainerCafes a { margin-bottom: 5px; /**/ } .divContainerCafes a span { font-size: 16px; color: #a52433 !important; font-weight: bold; } .divContainerCafes a i { font-size: 5px; color: #4c382a!important; margin-right: 3px; } .bloque4{ margin-top:80px; } .hoverZoom { position: relative; display: inline-block; font-weight: bolder; color: #a52433; overflow: hidden; background: linear-gradient(to right, #4c382a, #4c382a 50%, #a52433 50%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-size: 200% 100%; background-position: 100%; transition: background-position 400ms ease; /*text-decoration: underline!important;*/ } .hoverZoom:hover { background-position: 0 100%; } .containerLogosCalidad{ width:40%; margin-left:10%; margin-top:20px; } @media(max-width:600px){ .containerLogosCalidad { width: 50%; margin-left: 5%; } } .mt15{ margin-top:15px!important; } /*.galeria.galeriaColaboraciones img{ width:auto!important; max-width:100%; }*/