@font-face{
	font-family: Roboto;
    src: url(../fonts/Roboto-Light.woff2),
         url(../fonts/Roboto-Light.woff),
	     url(../fonts/Roboto-Light.ttf);
    font-weight: 300; font-display: swap;}
@font-face{
	font-family: Cutive;
    src: url(../fonts/Cutive-Regular.woff2),
         url(../fonts/Cutive-Regular.woff),
	     url(../fonts/Cutive-Regular.ttf);
    font-weight: normal; font-display: swap;}
*{
	margin: 0; padding: 0;}
body{
	font-family: 'Roboto', sans-serif; font-size: 1.1em; font-display: auto;
	line-height: 1.6em;}
img a, a, a img{
	text-decoration: none; border: none;}
.imagen img, .servicio .foto img, .foto2 img, .foto3 img{
	width: 100%; height: auto; display: block;}
.neg{
	font-weight: bold;}
.noneg, .noneg strong{
	font-weight: normal;}
.idioma a{
	width: 40px; height: 25px; padding: 5px; display: block; background: #00774c; color: #fff; 
	font-size: 11px; text-align: center; letter-spacing:1px;} 
.home a{
	width: 40px; height: 22px; padding: 8px 5px 5px 5px; display: block; 
	background: #e2007a; text-align: center;}
.home a:hover, .idioma a:hover{
	background: #ccc;}
#logo a:hover img{
	opacity: 0.5;}
#menu ul li{
	list-style-type: none; text-align: center;
	font-family: 'Cutive', serif;}
#menu ul li a{
	color: #777; padding: 40px 0 20px 0; display: block;}
h2, h3, .titulo{
	font-family: 'Cutive', serif;}
.titulo{
	font-size: 33px; line-height: 35px; color: #e2007a;}
.gris .titulo{
	color: #006a3c;}
h1, .h1{
	text-transform: uppercase; font-size: 14px;	margin-bottom: 30px; font-family: 'Roboto', sans-serif;}
h3{
	font-size: 22px; color: #006a3c;}
#titulo-h1{
	text-transform: none !important;}
.destacado{
	font-family: 'Cutive', serif; color: #006a3c; text-align: center; font-size: 1.2em; margin-top: 80px;}
.texto, .info2{
	margin-top: 120px;}
p{
	margin: 8px 0;}
.lista{
	margin-left: 20px;}
.lista ul li{
	margin-left: 20px;}
.duo-imprentas{
	margin: 20px 0 80px 0;}
.duo-imprentas a{
	display: block; color: #fff; padding: 60px 0;
	font-family: 'Cutive', serif; text-align: center; font-size: 26px; 
	text-shadow: 0px 0px 20px #000;}
.duo-imprentas .offset a{
	background: url(../imagenes/fondo-offset-2.jpg) no-repeat center center; 
	background-size: cover;}
.duo-imprentas .digital a{
	background: url(../imagenes/fondo-digital-2.jpg) no-repeat center center; 
	background-size: cover;}
.duo-imprentas .offset a:hover{
	background: url(../imagenes/fondo-offset.jpg) no-repeat center center; 
	background-size: cover;}
.duo-imprentas .digital a:hover{
	background: url(../imagenes/fondo-digital.jpg) no-repeat center center; 
	background-size: cover;}
.duo-imprentas .offset h4{
	padding: 20px; background: url(../imagenes/rosa80.png); display: table; margin: 0 auto;}
.duo-imprentas .digital h4{
	padding: 20px; background: url(../imagenes/verde80.png); display: table; margin: 0 auto;}
.gris{
	background: #e2e7e9; padding: 120px 0;}
.servicio{
	margin-top: 30px; padding-bottom: 30px; border-bottom: 1px solid #fff; color: #006a3c;}
.servicio .boton a{
	font-family: 'Cutive', serif; font-size: 1em; background: #fff; color: #006a3c; 
	padding: 20px 20px 17px 20px; float: right; text-align: center;}
.servicio .boton a:hover{
	background: none; }
#u-servicio{
	padding-bottom: 0; border-bottom: none;}
.servicio ul{
	margin-left: 20px;}
.servicio-global{
	padding: 120px; color: #e2007a;}
.global, .global-libros{
	margin: 40px 0; }
.global .cuarto a, .global-libros .cuarto{
	display: block; padding-top: 90px; background: #fff; color: #e2007a;}
.global .cuarto a h5, .cuarto h5{
	font-family: 'Cutive', serif; font-size: 20px;}
.global #cuarto-1 a{
	background: #fff url(../imagenes/diseno.jpg) no-repeat center top;}
.global #cuarto-2 a{
	background: #fff url(../imagenes/impresion.jpg) no-repeat center top;}
.global #cuarto-3 a{
	background: #fff url(../imagenes/acabados.jpg) no-repeat center top;}
.global #cuarto-4{
	background: #fff url(../imagenes/buzoneo.jpg) no-repeat center top; padding-top: 90px; }
.global #cuarto-1 a:hover, .global #cuarto-2 a:hover, .global #cuarto-3 a:hover{
	background-size: auto 55px; background-position: center 20%;
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;}
.global-libros #cuarto-1{
	background: #fff url(../imagenes/diseno.jpg) no-repeat center top;}
.global-libros #cuarto-2{
	background: #fff url(../imagenes/maquetacion.jpg) no-repeat center top;}
.global-libros #cuarto-3{
	background: #fff url(../imagenes/impresion.jpg) no-repeat center top;}
.global-libros #cuarto-4{
	background: #fff url(../imagenes/encuadernacion.jpg) no-repeat center top; padding-top: 90px; }
.tooltip {
    position: relative; display: inline-block; background:#e2007a; color: #fff;
	border-radius: 16px; width: 32px; height: 32px; font-size: 20px;}
.tooltip .tooltiptext {
    visibility: hidden; font-size: 0.9em; background-color: #fff; color: #e2007a; 
    padding: 15px; position: absolute; z-index: 1; border: 2px solid #e2007a;}
.tooltip .tooltiptext {
    width: 200px; top: 100%; left: 50%; 
    margin-left: -115px; /* Use half of the width (250/2 = 60), to center the tooltip */}
.tooltip:hover .tooltiptext {
    visibility: visible;}
#cabecera-digital{
	margin-top: 120px;}
#margin-bottom{
	margin-bottom: 120px;}
.foto4{
	margin-top: 10px;}
footer .container{
	padding: 40px 0; font-size: 0.9em;}
footer #aviso .container{
	padding: 2px 0;}
footer .contacto .boton a{
	font-family: 'Cutive', serif; font-size: 1em; background: #e2007a; color: #fff; 
	padding: 20px 20px 16px 20px; display: block; text-align: center;}
footer .contacto .boton a:hover{
	background: #bbb;}
address{
	font-style: normal; display: inline;}	
.borra{
	clear: both;}
.gallery{
	margin-left: 0.5%; padding-top: 20px;}
.gallery a{
	width: 32.82%; height: auto; display: inline-block; margin-right: 0.2%;}
.gallery .thumbnail{
	display: block; width: 100%; height: auto;}
#aviso{ 
	font-size: 15px; background: #e2007a; color: #fff;}
#aviso a{
	color: #fff; display: inline-block; padding: 5px 0; font-size: 15px;}
#aviso .top a{
	display: block; text-align: center;
	width: 40px; height: 27px; padding-top: 8px; float: right; border-radius: 20px;
	background: #fff; color: #e2007a; }
#aviso .top a:hover{opacity: 0.5;}
#aviso-legal ul{
	margin-left: 20px;}
#aviso-legal h2{
	font-size: 18px; margin-top: 40px;}
#aviso h5{
	display: inline; font-size: 15px;}
iframe{
	border: none; width: 100%;}
#c-telefono{
	margin-top: 0 !important;}
.tel, .email{
	padding: 5px 0; display: block; color: #000;}
.tel{
	font-size: 1.3em; font-weight: 700;}
.tel:hover, .email:hover{
	color: #e2007a;}
.borde{
	border: 1px solid #e2007a; padding: 20px; margin-top: 50px;}
.borde p{color: #e2007a;}
#con-galeria{
	margin: 30px auto 60px auto;}
#con-galeria h1{
	margin: 0;}
.en-pie{
	font-size: 0.9em; line-height: 1.6em; font-family: 'Roboto', sans-serif;}
footer .todo{
	position: relative;}
.redes{
	position: absolute;}
.redes a{
	display: block; padding: 10px;}
.redes a:hover img{
	opacity: 0.5;}
.enviar{color: #000; margin-top: 15px; display: block; padding-top: 10px;}
.mapa .boton{float: none; width: 250px; margin: 0 auto;}
.mapa .boton a{display:  block; width: 250px; font-size: 15px; padding: 10px; background: #e2007a;
; text-align: center; color: #fff;}
.mapa .boton a:hover{opacity: 0.6;}

@media only screen 
and (max-width : 550px){
.pantalla, .tablet, .guion, #c-telefono, .gallery, #slider1, #slider2{
	display: none;}
.container {
	width: 100%; margin: 0 auto; text-align: center;}
.todo {
	margin: 0 20px;}
#cabecera{
	margin-top: 5px;}
#cabecera .todo{
	margin: 0 5px;}
.home a{
	float: left;}
.idioma a{
	float: right;}
#logo{
	width: 170px; margin: 20px auto; clear: both;}
#logo img{
	width: 100%; height: auto;}
.logo-presentacion{
	width: 170px; height: auto;}
#menu{
	max-width: 520px; margin: 0 auto; font-size: 0.9em;}
#menu ul li a {
    padding: 15px 0;}
#menu ul ul li a{
	color: #e2007a; }
#menu ul ul li, #menu ul ul li{
	width: 100%; display: block;}
.slider h3{font-size: 26px; line-height: 40px;}
.slider h5{font-size: 18px; margin-top: 10px;}
h3 {
    font-size: 20px;}
.titulo {
    font-size: 24px;}
.destacado {
    font-size: 1em; margin-top: 50px;}
.texto, .info2 {
    margin-top: 80px;}
.duo-imprentas a {
    font-size: 18px;}
.gris{
	padding: 30px 0;}
.servicio-global {
    padding: 120px 0;}
.servicio .foto, .foto2, .foto3{
	margin-top: 30px;}
.servicio .boton a {
    font-size: 0.9em; margin-top: 20px; display: block;
    padding: 14px 10px 10px 10px;
    float: none;}
.lista{
	text-align: left; margin-left: 10%;}
.servicio .lista2{
	text-align: left; margin-left: 20%;}
.global, .global-libros{
	background: url(../imagenes/linea-punteada2.jpg) repeat-y center top;}
.global .cuarto{
	text-align: center; margin-bottom: 36px; padding-top: 15px; background: #fff;}
.global #cuarto-4 {
    background: #fff url(../imagenes/buzoneo.jpg) no-repeat center 15px;
    padding-top: 90px;}
.global #cuarto-1 a, .global #cuarto-2 a, .global #cuarto-3 a, .global #cuarto-4, 
.global-libros #cuarto-1, .global-libros #cuarto-2, .global-libros #cuarto-3, .global-libros #cuarto-4{
	background-size: auto 60px;}
.global-libros .cuarto{
	text-align: center; margin-bottom: 36px; padding-top: 80px; background: #fff;}
#barra-imprenta{
	background: url(../imagenes/barra-imprenta.svg) center bottom no-repeat; padding-bottom: 60px; margin-bottom: 15px; background-size: 80% auto;}
#barra-imprenta .todo{
	padding-bottom: 90px;}
#margin-bottom {
    margin-bottom: 80px;}
#galeria-movil img{
	width: 100%; height: auto;}
.gallery a{
	width: 96%; margin-left: 2%;}
footer img{
	height: 60px; width: auto;}
footer #aviso img{
	width: 30px; height: auto;}
footer .contacto{
	width: 130px; margin: 20px auto 0 auto;}
footer .contacto .boton a{
	padding: 12px 0 10px 0; }
#aviso a{
	display: block;}
.tel{
	font-size: 1.4em; }
footer .redes img {
    height: auto; width: 45px; display:block;}
.redes{
	bottom: 0px; left: 43%;}
.mapa{ background: url("../imagenes/mapa4.jpg") no-repeat center center; padding: 300px 0 100px 0;
	background-size: cover;}
}

@media only screen 
and (min-width : 551px)
and (max-width : 800px) {
.pantalla, .movil, .guion, #c-telefono{
	display: none;}
.container {
	width: 100%; margin: 0 auto; text-align: center;}
.todo {
	margin: 0 30px;}
#cabecera{
	margin-top: 5px;}
#cabecera .todo{
	margin: 0 5px;}
.home a{
	float: left;}
.idioma a{
	float: right;}
#logo{
	width: 240px; margin: 20px auto; clear: both;}
#logo img{
	width: 100%; height: auto;}
#menu{
	max-width: 520px; margin: 0 auto; font-size: 0.8em;}
#menu ul li{
	float: left; width: 18%;}
#menu ul .p{
	width: 17%;}
#menu ul .m{
	width: 22%;}
#menu ul .x{
	width: 27%;}
#menu ul .d{
	width: 22%;}
#menu ul .s{
	width: 20%;}
#menu ul .c{
	width: 25%;}
#menu ul ul, #menu ul ul li{
	width: 100%;}
.slider h3{font-size: 26px; line-height: 40px;}
.slider h5{font-size: 18px; margin-top: 10px;}
.titulo {
    font-size: 26px;}
.gris .container {
	text-align: left;}
.destacado {
    font-size: 1em;
    margin-top: 70px;}
.duo-imprentas a {
    font-size: 20px;}
.texto, .info2 {
    margin-top: 80px;}
.gris{
	padding: 30px 0;}
.servicio-global {
    padding: 120px 0;}
.servicio .foto, .foto2, .foto3{
	margin-top: 30px;}
.lista{
	text-align: left; margin-left: 80px;}
.global, .global-libros{
	background: url(../imagenes/linea-punteada2.jpg) repeat-y center top;}
.global .cuarto{
	text-align: center; margin-bottom: 36px; padding-top: 15px; background: #fff;}
.global #cuarto-4 {
    background: #fff url(../imagenes/buzoneo.jpg) no-repeat center 15px;
    padding-top: 90px;}
.global-libros .cuarto{
	text-align: center; margin-bottom: 36px; padding-top: 90px; background: #fff;}
#barra-imprenta{
	background: url(../imagenes/barra-imprenta.svg) center 60px no-repeat; background-size: 420px auto; padding-top: 130px;}
.gallery a{
	width: 49%; margin-right: 0.2%; margin-left: 0.2%;}
footer .logo{
	width: 50px; float: left;}
footer .logo img{
	width: 100%; height: auto;}
footer .datos{
	width: 50%; float: left; padding-top: 20px;}
footer .contacto{
	width: 110px; float: right; padding-top: 10px;}
footer .contacto .boton a {
    padding: 15px 10px;}
.redes{
	bottom: 0px; right: 120px;}
.mapa{ background: url("../imagenes/mapa3.jpg") no-repeat center center; padding: 300px 0 100px 0;
	background-size: cover;}}

@media only screen 
and (min-width : 801px)
and (max-width : 1000px) {
.pantalla, .movil, .guion, #c-telefono-movil{
	display: none;}
.container {
	width: 100%; margin: 0 auto; text-align: center;}
.todo {
	margin: 0 40px;}
#cabecera{
	margin-top: 5px;}
#cabecera .todo{
	margin: 0 5px;}
.home a{
	float: left;}
.idioma a{
	float: right;}
#logo{
	width: 260px; margin: 20px auto; clear: both;}
#menu{
	max-width: 520px; margin: 0 auto; font-size: 0.8em;}
#menu ul li{
	float: left; width: 18%;}
#menu ul .p{
	width: 17%;}
#menu ul .m{
	width: 22%;}
#menu ul .x{
	width: 27%;}
#menu ul .d{
	width: 22%;}
#menu ul .s{
	width: 20%;}
#menu ul .c{
	width: 25%;}
#menu ul ul, #menu ul ul li{
	width: 100%;}
.slider h3{font-size: 26px; line-height: 40px;}
.slider h5{font-size: 18px; margin-top: 10px;}
.titulo {
    font-size: 28px;}
.gris .container {
	text-align: left;}
.destacado {
    font-size: 1em;
    margin-top: 70px;}
.duo-imprentas .offset{
	width: 50%; float: left;}
.duo-imprentas .digital{
	width: 50%; float: right;}
.duo-imprentas a {
    font-size: 22px;}
.servicio-global {
    padding: 120px 0;}
.servicio .info, .info2{
	width: 50%; float: left;}
.servicio .foto, .foto2, .foto3{
	width: 40%; float: right; margin-top: 45px;}
.global{
	background: url(../imagenes/linea-punteada.jpg) repeat-x left 100px;}
.global .cuarto, .global-libros .cuarto{
	width: 20%; float: left; text-align: center;}
.global #cuarto-1, .global-libros #cuarto-1{
	margin-right: 3.3%;}
.global #cuarto-2, .global #cuarto-3,
.global-libros #cuarto-2, .global-libros #cuarto-3{
	margin: 0 3.3%;}
.global #cuarto-4{
	margin-left: 3.3%;}
.global .cuarto, .global-libros #cuarto-4{
	width: 20%; float: left; text-align: center;}
.servicio-global #cuarto-4{
	float: right;}
.foto2{
	margin-top: 220px;}
.foto3{
	margin-top: 170px;}
#barra-imprenta{
	background: url(../imagenes/barra-imprenta.svg) 93% 20px no-repeat; background-size: 420px auto; padding-top: 60px;}
.gallery a{
	width: 49%; margin-right: 0.2%; margin-left: 0.2%;}
.tooltip .tooltiptext {
    width: 160px;
    top: 100%;
    left: 50%;
    margin-left: -105px;}
footer .logo{
	width: 80px; float: left;}
footer .datos{
	width: 40%; float: left; padding-top: 20px;}
footer .contacto{
	width: 130px; float: right; padding-top: 10px;}
.redes{
	bottom: 0px; right: 150px;}
.mapa{ background: url("../imagenes/mapa2.jpg") no-repeat center center; padding: 300px 0 100px 0;
	background-size: cover;}
}

@media only screen 
and (min-width : 1001px)
and (max-width : 1299px) {
.movil, .tablet, .salto, #c-telefono-movil{
	display: none;}
.container {
	width: 100%; margin: 0 auto;}
#cabecera{
	position: fixed; top: 0; width: 100%; background: #fff; z-index: 120;}
.idioma a{
	position: fixed; top: 5px; right: 5px;} 
.home a{
	position: fixed; top: 5px; left: 5px;}
.todo {
	margin: 0 80px;}
#logo{
	width: 260px; float: left; margin: 20px 0;}
#menu{
	width: 520px; float: right; font-size: 0.8em;}
#menu ul li{
	float: left; width: 18%;}
#menu ul .p{
	width: 17%;}
#menu ul .m{
	width: 22%;}
#menu ul .x{
	width: 27%;}
#menu ul .d{
	width: 22%;}
#menu ul .s{
	width: 20%;}
#menu ul .c{
	width: 25%;}
#menu ul ul, #menu ul ul li{
	width: 100%;}
.slider h3{font-size: 33px; line-height: 40px;}
.slider h5{font-size: 22px; margin-top: 10px;}
section{
	margin-top: 110px;}
.titulo {
    font-size: 28px;}
.duo-imprentas .offset{
	width: 50%; float: left;}
.duo-imprentas .digital{
	width: 50%; float: right;}
.duo-imprentas a {
    font-size: 22px;}
.servicio-global {
    padding: 120px 0;}
.servicio .info, .info2{
	width: 50%; float: left;}
.servicio .foto, .foto2, .foto3{
	width: 50%; max-width: 350px; float: right;}
.global{
	background: url(../imagenes/linea-punteada.jpg) repeat-x left 100px;}
.global .cuarto, .global-libros .cuarto{
	width: 20%; float: left; text-align: center;}
.global #cuarto-1, .global-libros #cuarto-1{
	margin-right: 3.3%;}
.global #cuarto-2, .global #cuarto-3,
.global-libros #cuarto-2, .global-libros #cuarto-3{
	margin: 0 3.3%;}
.global #cuarto-4{
	margin-left: 3.3%;}
.global .cuarto, .global-libros #cuarto-4{
	width: 20%; float: left; text-align: center;}
.servicio-global #cuarto-4{
	float: right;}
.foto2{
	margin-top: 220px;}
.foto3{
	margin-top: 170px;}
#barra-imprenta{
	background: url(../imagenes/barra-imprenta.svg) 93% 20px no-repeat; background-size: 420px auto; padding-top: 60px;}
footer .logo{
	width: 80px; float: left;}
footer .datos{
	width: 65%; float: left; padding-top: 40px;}
footer .contacto{
	width: 130px; float: right; padding-top: 40px;}
.redes{
	bottom: -5px; right: 160px;}
.mapa{ background: url("../imagenes/mapa.jpg") no-repeat center center; padding: 300px 0 100px 0;
	background-size: cover;}
}
	
@media only screen 
and (min-width : 1300px){ 
.movil, .tablet, .salto, #c-telefono-movil{
	display: none;}
.container {
	width: 1300px; margin: 0 auto;}
#cabecera{
	position: fixed; top: 0; width: 100%; background: #fff; z-index: 120;}
.idioma a{
	position: fixed; top: 5px; right: 5px;} 
.home a{
	position: fixed; top: 5px; left: 5px;}
.todo {
	margin: 0 50px;}
#logo{
	width: 260px; float: left; margin: 20px 0;}
#menu{
	width: 600px; float: right; font-size: 0.9em;}
#menu ul li{
	float: left; width: 18%;}
#menu ul .p{
	width: 17%;}
#menu ul .m{
	width: 22%;}
#menu ul .x{
	width: 27%;}
#menu ul .d{
	width: 22%;}
#menu ul .s{
	width: 20%;}
#menu ul .c{
	width: 25%;}
#menu ul ul, #menu ul ul li{
	width: 100%;}
.slider h3{font-size: 40px; line-height: 40px;}
.slider h5{font-size: 24px; margin-top: 10px;}
section{
	margin-top: 110px;}
.duo-imprentas .offset{
	width: 50%; float: left;}
.duo-imprentas .digital{
	width: 50%; float: right;}
.servicio .info, .info2{
	width: 50%; float: left;}
.servicio .foto, .foto2, .foto3{
	width: 50%; max-width: 350px; float: right;}
.global{
	background: url(../imagenes/linea-punteada.jpg) repeat-x left 100px;}
.global .cuarto, .global-libros .cuarto{
	width: 20%; float: left; text-align: center;}
.global #cuarto-1, .global-libros #cuarto-1{
	margin-right: 3.3%;}
.global #cuarto-2, .global #cuarto-3,
.global-libros #cuarto-2, .global-libros #cuarto-3{
	margin: 0 3.3%;}
.global #cuarto-4{
	margin-left: 3.3%;}
.global .cuarto, .global-libros #cuarto-4{
	width: 20%; float: left; text-align: center;}
.servicio-global .container{
	width: 100%; max-width: 1300px;}
.foto2{
	margin-top: 220px;}
.foto3{
	margin-top: 170px;}
#barra-imprenta{
	background: url(../imagenes/barra-imprenta.svg) right 20px no-repeat; background-size: 420px auto; padding-top: 60px;}
footer .logo{
	width: 80px; float: left;}
footer .datos{
	width: 50%; float: left; padding-top: 40px;}
footer .contacto{
	width: 130px; float: right; padding-top: 40px;} 
.redes{
	bottom: -5px; right: 160px;}
.mapa{ background: url("../imagenes/mapa.jpg") no-repeat center center; padding: 300px 0 100px 0;
	background-size: cover;}}