/* GENERAL ------------------------------------------------------------------------------------------------- */

.body-secciones {background: #ffffff; margin-bottom: 15rem;}
.body-secciones-musica {background-image: url("../trabajos/musica/fondo-musica.jpg"); background-position: center; background-size: cover; margin-bottom: 15rem;}
.body-secciones-musica-gris {background-color: #313131; margin-bottom: 15rem;}


/* BARRA NAVEGACIÓN ---------------------------------------------------------------------------------*/

.menu-secciones {background-image: linear-gradient(90deg, rgba(13, 174, 191, 0.88), rgba(13, 118, 192, 0.88)); margin-top: 0rem; padding: 1.5rem 0rem 0.5rem;}
.menu-secciones-musica {background-color: #000000cc; margin-top: 0rem; padding: 1.5rem 0rem 0.5rem;}
.active, .nav-link:hover {color: #e7f92f !important;}


/* BANNER ----------------------------------------------------*/

.banner-secciones {display: flex; justify-content: center; align-items: center; overflow: hidden;}
.banner-secciones h1 {position: absolute; z-index: 10;}
.banner-secciones img {position: relative; z-index: -1}

.titulo-secciones {font-family: 'khand', sans-serif; font-size: 5.5rem; font-weight: 300; color: #0daebf; text-align: center; letter-spacing: 0px;}


/* WHATSAPP ICON --------------------------------------------*/

.wap {display: flex; justify-content: center; align-items: center; position: fixed; right: 1rem; bottom: 2.7rem; width: 2.3rem; height: 2.3rem; z-index: 1000; background-color: #25d366; border-radius: 100%; line-height: 100%; box-shadow: 1px 2px 4px 0px #0000002e;}
.wap i {font-size: 1.4rem; color: #ffffff;}
.wap i:hover {animation: wap 0.75s;}

.wap.captcha {bottom: 6rem;}

@keyframes wap {
	0% 	  {transform: scale(1);}
	50%  {transform: scale(1.25);}
	100%  {transform: scale(1);}
}


/* PIE -----------------------------------------------------*/

.pie-secciones {background-color: #727272; position: absolute; bottom: 0; display: flex; flex-direction: row; justify-content: center; align-items: flex-end; padding-top: 2rem; padding-bottom: 2.8rem; margin-top: 0rem; margin-bottom: 0rem;}
.pie-secciones.musica {background-color: #2b2b2b;}

.mail-creditos.musica {color: #848484 !important;}
.ubicacion.musica {color: #848484 !important;}
.tel.musica {color: #848484 !important;}
.tel.musica b {color: #02aba9;}
.tel-w {color: #ffffff !important;}

.redes-secciones {display: flex; justify-content: flex-end; align-items: flex-end; margin-bottom: 0.1rem;}
.redes-secciones a {margin-left: 0rem; margin-right: 0rem; padding: 0rem 0.5rem;}


/* 404 -----------------------------------------------------*/

.menu-error404 {background-image: none;}
.body-error404 {background-image: linear-gradient(90deg, rgb(255 4 4 / 88%), #990917)}

.error404 {position: absolute; top: 0; display: flex; justify-content: center; align-items: center; height: 100vh;}
.error404 h1 {font-family: 'khand', sans-serif; font-size: 18rem; font-weight: 300; color: #ffffff; letter-spacing: 0px; line-height: 100%; margin-bottom: 0rem; text-align: center;}
.error404 h2 {font-family: 'Catamaran', sans-serif; font-size: 1.5rem; text-align: center; color: #ffffff; margin-bottom: 1rem;}
.error404 p {font-family: 'Open Sans', sans-serif; font-weight: 400; font-size: 1rem; line-height: 160%; color: #ffffff; margin: 0rem; text-align: center;}
.error404 a {color: #ffffff}
.error404 p:last-child {margin-top: 1rem;}

.pie-error404 {background-color: unset;}











/*----------------------------------------------------------------------------------------------------------- */
/*----------------------------------------------------------------------------------------------------------- */
/* NOSOTROS ------------------------------------------------------------------------------------------------- */


summary::-webkit-details-marker {display: none}
summary:after {content: "+"; color: #ff6e28; float: left; font-size: 1.3rem; font-weight: bold; margin: -0.20rem 0.3rem 0 0; text-align: center; line-height: 110%;}
details[open] summary:after {content: "-";}

@keyframes aparecer {
	0%   {opacity: 0;}
	100% {opacity: 1;}
}

.nosotros-intro {margin-top: 1.5rem; margin-bottom: 2rem;}
.bloque {margin-top: 2.3rem; opacity: 0;}
.nosotros-intro div:nth-child(1) {animation: aparecer 1s 0.3s forwards;}
.nosotros-intro div:nth-child(2) {animation: aparecer 1s 0.5s forwards;}
.nosotros-intro div:nth-child(3) {animation: aparecer 1s 0.7s forwards;}
.nosotros-intro div:nth-child(4) {animation: aparecer 1s 0.9s forwards;}

.titulo2 {font-family: 'khand', sans-serif; font-size: 2rem; color: #ff6e28;}

.titulo3 {font-family: 'khand', sans-serif; font-weight: 300; font-size: 3.9rem; line-height: 100%; letter-spacing: -1px; color: #0daebf;text-align: center;}

.txt-nosotros-bajada {font-family: 'Open Sans', sans-serif; font-weight: 400; font-size: 1rem; line-height: 160%; color: grey; margin-top: 0.7rem;}

.txt-nosotros {font-family: 'Open Sans', sans-serif; font-weight: 400; font-size: 0.9rem; line-height: 160%; color: grey; margin-top: 0.7rem; animation: desplegar 1s;}

@keyframes desplegar {
	0%   {transform: translateY(-20px); color: #ffffff;}
	75%  {transform: translateY(10px);}
	100% {transform: translateY(0px);}
}

.vermas {font-family: 'Catamaran', sans-serif; font-size: 0.85rem; letter-spacing: 1px; color: grey; margin-top: 1rem; line-height: 140%; transition-duration: 0s;}
.vermas:hover {color: #ff6e28; transition-duration: 0s;}

/* Metodo---------------------------------------------------------------------------------*/

.nosotros-metodo {background-image: url("../nosotros/img/placa1.jpg"); background-position: center top; background-repeat: no-repeat; margin-top: 1rem; padding-top: 7.4rem; width: 100%; height: 524px;}

.metodo-iconos {display: flex; justify-content: center; flex-wrap: wrap; margin-top: 0.75rem;}
.metodo-iconos div {position: relative; display: flex; justify-content: flex-start; align-items: center; flex-direction: column; flex: 16%; padding: 2rem 1rem 2rem; font-family: 'Open Sans', sans-serif; font-weight: 400; font-size: 0.9rem; line-height: 140%; text-align: center; color: #737C18;}
.metodo-iconos-p {width: 1.7rem; height: 1.7rem; border-radius: 50%; background-color: #ff6e28; padding-top: 0.2rem; margin-bottom: 0.5rem; font-size: 1rem; font-weight: 700; color: #ffffff;}
.metodo-iconos-p.animar {animation: metodo-numeros 0.7s;}
.metodo-iconos img {margin-bottom: 0.75rem; width: 80px; height: 80px;}

@keyframes metodo-numeros {
	0% 	  {transform: scale(1);}
	50%  {transform: scale(1.9);}
	100%  {transform: scale(1);}
}

/* Musica ---------------------------------------------------------------------------------*/

.nosotros-music-division {margin-top: 3rem; text-align: center;}

.music-division-presentacion {display: flex; flex-direction: column; justify-content: center; align-items: start; text-align: left; margin: 2.5rem 0rem 0rem;}
.music-division-presentacion h2 {font-family: 'khand', sans-serif; font-size: 6rem; line-height: 95%; letter-spacing: -3px; margin: 0rem; padding: 0.3rem 0.3rem 0rem 0rem; background: -webkit-linear-gradient(270deg, #ec0c59, #ec0c59, #761234); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.music-division-presentacion p {font-family: 'Open Sans', sans-serif; font-size: 1rem; line-height: 160%; color: grey; margin: 1rem 0rem 0rem;}

.boton-nosotros-musicos {font-family: 'Catamaran', sans-serif; font-size: 0.85rem; padding: 0.6rem 0.8rem 0.5rem 0.8rem; border-radius: 20px; background-color: #000000; margin-top: 1.5rem; transition: 0s; color: #ffffff; text-decoration: none;}
.boton-nosotros-musicos.animar {animation: aparecer-boton-musica 0.6s;}
.boton-nosotros-musicos:hover {background-color: #ec0c59; color: #ffffff;}

@keyframes aparecer-boton-musica {
	0% 	  {transform: scale(1);}
	50%  {transform: scale(1.2); background-color: #ec0c59; color: #ffffff;}
	100%  {transform: scale(1);}
}

/* Staff ---------------------------------------------------------------------------------*/

.staff {background-color: #e2e2e2; background-image: url("../nosotros/img/placa2.jpg"); background-position: center top; background-repeat: no-repeat; margin-top: 3rem; padding-top: 7.4rem; height: 683px;}
.staff-bloques {opacity: 0;}
.staff-bloques.animar {animation: aparecer 1.75s forwards;}
.staff p {font-family: 'Open Sans', sans-serif; font-weight: 400; font-size: 0.9rem; line-height: 160%; color: #ffffff; margin-top: 0.7rem;}
.staff-tit {font-family: 'khand', sans-serif; font-weight: 300; font-size: 3.9rem; line-height: 100%; letter-spacing: -1px; color: #e7f92f; text-align: center;}
.staff-nombre {font-family: 'khand', sans-serif; font-weight: 400; font-size: 2rem; color: #00fffc; margin-top: 1rem;}

/* Ver Portfolio ---------------------------------------------------------------------------------*/

.descarga-presentacion {font-family: 'khand', sans-serif; font-weight: 200; font-size: 2.5rem; line-height: 2.5rem; color: #ff6e28; margin-top: 4rem;}
.descarga-presentacion a {color: #ff6e28; text-decoration: none;}
.descarga-presentacion a:hover {text-decoration: none; color: #0daebf;}
.descarga-presentacion a:hover #oculto {color: #0daebf;}

.descarga-presentacion i {font-size: 2.5rem; margin-top: 0.75rem; transition-duration: 0s;}

.descarga-presentacion #oculto {color: #ffffff;}

.presentacion-borde {border-right-style: solid; border-right-width: 2px; border-right-color: #d2cfcf;}

.portfolio-online {text-align: right;}

.portfolio-ver {font-size: 1.7rem; letter-spacing: 1px; line-height: 3rem; color: #0daebf;}

.el-portfolio {font-size: 3rem; line-height: 2.5rem; transition-duration: 0s;}

.estado {font-size: 2.2rem; font-weight: 400; transition-duration: 0s;}
















/*----------------------------------------------------------------------------------------------------------- */
/*----------------------------------------------------------------------------------------------------------- */
/* PORTFOLIO ------------------------------------------------------------------------------------------------- */


#trabajos-contenedor {display: flex; flex-wrap: wrap; justify-content: center; margin: 1.5rem -2rem 2.5rem;}

#trabajos-contenedor div:nth-child(1) {animation: aparecer 1s 0.1s forwards;}
#trabajos-contenedor div:nth-child(2) {animation: aparecer 1s 0.3s forwards;}
#trabajos-contenedor div:nth-child(3) {animation: aparecer 1s 0.5s forwards;}
#trabajos-contenedor div:nth-child(4) {animation: aparecer 1s 0.7s forwards;}
#trabajos-contenedor div:nth-child(5) {animation: aparecer 1s 0.9s forwards;}
#trabajos-contenedor div:nth-child(6) {animation: aparecer 1s 1.1s forwards;}

.accesos-portfolio {flex: 30%; max-width: 30%; margin: 1rem 1rem; border-radius: 30px 10px; overflow: hidden; opacity: 0;}
.accesos-portfolio h2 {font-family: 'khand', sans-serif; font-size: 2.25rem; color: #0c4e7b; margin-top: 1.5rem; margin-left: 1.3rem; position: absolute; z-index: 10; line-height: 110%;}
.accesos-portfolio img {width: 100%; height: auto;}
.accesos-portfolio img:last-child {display: none}
.accesos-portfolio:hover img:first-child {display: none}
.accesos-portfolio:hover img:last-child {display: inline-block;}
.accesos-portfolio h2 i {font-size: 1.5rem; color: #ffffff; margin-left: 0.1rem;}
#color-estrella-portfolio {color: #ffffff !important;}

.accesos-portfolio:hover #flecha-portfolio {position: relative; animation: animacion-flecha-portfolio 0.6s linear infinite; color: #e7f92f; transform: translate(5px, 0px);}

@keyframes animacion-flecha-portfolio {
	0% {left: 0px; top: 0px;}
	50% {left: 20px; top: 0px;}
	100% {left: 0px; top: 0px;}
}

.accesos-portfolio:hover #color-estrella-portfolio {color: #e7f92f !important; transition-duration: 0s;}

.tit-mus-portfolio {color: #ffffff !important;}



/* PORTFOLIO GALERIAS ---------------------------------------------------------------------------------*/

.portfolio-head {margin-top: 4rem; margin-bottom: 3rem;}
.portfolio-head h1 {font-family: 'khand', sans-serif; font-size: 5.5rem; font-weight: 300; color: #0daebf; letter-spacing: 0px; line-height: 110%; margin-bottom: 0rem; text-align: center;}
.portfolio-head h2 {font-family: 'khand', sans-serif; font-size: 3rem; font-weight: 300; color: #ff6e28; letter-spacing: -2px;  line-height: 100%; margin-bottom: 0rem; text-align: center;}

.galeria-portfolio {display: flex; flex-wrap: wrap; justify-content: center; margin: 0rem -0.25rem 2.5rem;}
.contenedor-galeria-portfolio {overflow: hidden; position: relative; cursor: default; flex: 33%; padding: 0.25rem;}
.contenedor-galeria-portfolio-web {flex: 100%; margin: 0rem 0rem 1.5rem; position: relative;}
.contenedor-galeria-portfolio-web:last-child {margin: 0rem;}
.contenedor-galeria-portfolio-web a {font-family: 'Catamaran', sans-serif; font-size: 0.85rem; position: absolute; right: 1rem; bottom: 2.5rem; text-decoration: none; color: #ffffff; padding: 0.1rem 0.10rem 0rem 0.4rem;}
.contenedor-galeria-portfolio-web a:hover {background-color: #ff6e28; border-radius: 0.25rem;}
.contenedor-galeria-portfolio-web a i {font-size: 0.8rem; padding: 0rem 0.40rem 0rem 0.15rem;}
.contenedor-galeria-portfolio-web p {font-family: 'Open Sans', sans-serif; font-size: 0.9rem; color: grey; margin: 0.25rem 0rem; text-align: center;}
.contenedor-galeria-portfolio-paackaging-etiquetas {flex: 24%; padding: 0rem 0.5rem;}
.conjunto {background-color: #ff6e28; position: relative; width: 100%;}
.conjunto:hover .imagen {opacity: 0.075;}
.conjunto:hover .epigrafe {opacity: 1;}
.conjunto.musica {background-color: #ec0c59;}
.conjunto.musica:hover .imagen {opacity: 0.125;}
.imagen {opacity: 1; display: block; width: 100%; height: auto; transition: .5s ease; backface-visibility: hidden;}
.epigrafe {transition: .5s ease; opacity: 0; position: absolute; top: 50%; left: 50%; width: 100%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); text-align: center;}
.epigrafe h3 {font-family: 'khand', sans-serif; color: #ffffff; font-size: 2rem; margin-bottom: 0rem; line-height: 100%;}
.epigrafe h4 {font-family: 'khand', sans-serif; font-weight: 300; color: #ffffff; font-size: 1.6rem; margin-top: 0.40rem; margin-bottom: 0rem; line-height: 100%;}
.epigrafe p {font-family: 'khand', sans-serif; font-weight: 300; color: #ffffff; font-size: 1.25rem; margin-bottom: 0rem;}



/* PORTFOLIO SUB-GALERIAS ---------------------------------------------------------------------------------*/

.portfolio h3 {font-family: 'khand', sans-serif; font-size: 2rem; color: #0daebf; margin-bottom: 0.75rem;}
.portfolio h4 {font-family: 'khand', sans-serif; font-size: 1.5rem; color: #0daebf;}
.portfolio p {font-family: 'Open Sans', sans-serif; font-size: 0.9rem; line-height: 165%; color: grey; margin-top: 0rem;}
.portfolio a {color: grey;}
.portfolio a:hover {color: #ff6e28;}

.portfolio-barra {display: flex; justify-content: center; flex-wrap: wrap; font-family: 'Catamaran', sans-serif; font-size: 0.85rem; margin-bottom: 2rem; line-height: 170%;}
.portfolio-barra a {color: #ababab; text-decoration: none; margin: 0rem 1rem;}
.portfolio-barra a:hover {color: #ff6e28;}

.portfolio-ruta {text-align: center; width: 100%;}
.portfolio-ruta p {font-family: 'Open Sans', sans-serif; font-size: 0.9rem; margin-top: 1rem; color: #ff6e28; margin-bottom: 1rem; text-align: center;}
.portfolio-ruta a {color: grey; text-decoration: none;}
.portfolio-ruta a:hover {color: #ff6e28;}
.portfolio-ruta span {color: #bfbfbf !important;}

/* BRANDING - GIOCARE */

.contenedor-galeria-giocare-estampas {overflow: hidden; position: relative; cursor: default; flex: 25%; padding: 0.25rem;}
.conjunto-giocare-estampas {background-color: #ffffff; position: relative; width: 100%;}
.conjunto-giocare-estampas:hover .imagen {opacity: 0.6;}

/* BRANDING - CRUZ DIABLO */

.contenedor-galeria-cruz-diablo-ilustraciones {overflow: hidden; position: relative; cursor: default; flex: 33%; padding: 0.25rem;}
.conjunto-cruz-diablo-estampas {background-color: #ffffff; position: relative; width: 100%;}
.conjunto-cruz-diablo-estampas:hover .imagen {opacity: 0.6;}
.cruz-diablo-etiquetas {position: relative;}
.cruz-diablo-etiquetas div {position: absolute; top: 3rem; right: 4rem;}
.cruz-diablo-etiquetas div h3 {font-size: 2.5rem; letter-spacing: -1px; margin-bottom: 0.25rem;}
.cruz-diablo-etiquetas div p {font-size: 0.95rem; margin-bottom: 0.1rem; font-weight: bold;}
.cruz-diablo-etiquetas div p:nth-child(2) {color: #b00003;}
.cruz-diablo-etiquetas div p:nth-child(3) {color: #006f9d;}
.cruz-diablo-etiquetas div p:nth-child(4) {color: #f8b600;}

/* PORTFOLIO - WEB */
/* PORTFOLIO - MUSICA - WEB */

.imagen-web-sm {display: none;}



/* PORTFOLIO SUBSECCIÓN MUSICA MENU ---------------------------------------------------------------------------------*/

#menu-musica {display: flex; flex-direction: column; justify-content: center; height: 55vh;}

.portfolio-head-musica {margin-top: 3rem; margin-bottom: 3rem;}
.portfolio-head-musica h1 {font-family: 'khand', sans-serif; font-size: 2rem; font-weight: 300; color: #ec0c59; letter-spacing: 16px; line-height: 110%; margin-bottom: 0rem; text-align: center; margin-top: 3rem; text-shadow: 1px 2px 10px #000000;}
.portfolio-head-musica h2 {font-family: 'khand', sans-serif; font-size: 3rem; font-weight: 300; color: #ffffff; letter-spacing: 0px; line-height: 100%; margin-bottom: 0rem; text-align: center;}

.portfolio-musica-dmts-music {font-family: 'blankaregular', 'khand', sans-serif; font-size: 4rem; letter-spacing: 8px; text-align: center; color: #ec0c59; margin: 0rem 0rem 0.5rem; text-shadow: 1px 2px 10px #000000a3}

.portfolio-musica {display: flex; justify-content: center; flex-wrap: wrap; font-family: 'khand', sans-serif; color: #ffffff; text-align: center; margin-bottom: 3rem; transition-duration: 0s;}
.portfolio-musica a {display: flex; flex-direction: column; align-items: center; flex: 20%; text-decoration: none; color: unset;}
.portfolio-musica .ico {display: flex; justify-content: center; align-items: center; flex: unset; margin-bottom: 0.5rem; border-radius: 50%; width: 6rem; height: 6rem; background-color: #7b7b7b; transition-duration: 0s;}
.portfolio-musica .ico i {font-size: 3.5rem; transition-duration: 0s;}
.portfolio-musica h3 {font-weight: 600; font-size: 2.25rem; line-height: 80%; transition-duration: 0s; text-shadow: 1px 2px 10px #000000;}
.portfolio-musica h3 span {font-weight: 300; font-size: 1.25rem; transition-duration: 0s;}

.portfolio-musica .ico .bi-star {padding: 0.25rem 0rem 0rem 0rem;}
.portfolio-musica .ico .bi-disc {padding: 0.5rem 0rem 0rem 0rem;}
.portfolio-musica .ico .bi-display {padding: 0.5rem 0rem 0rem 0rem;}
.portfolio-musica .ico .bi-file-earmark-medical {padding: 0.5rem 0rem 0rem 0rem;}

.portfolio-musica .ico-logos-color {background-color: #21ccca;}
.portfolio-musica .ico-discos-color {background-color: #3cca73;}
.portfolio-musica .ico-webs-color {background-color: #b075e0;}
.portfolio-musica .ico-difusion-color {background-color: #ef8e41;}

.portfolio-musica a:hover h3 {color: #ffffff; transform:scale(1.07,1.07); transition-duration: 0s;}
.portfolio-musica a:hover span {color: #ffffff; transition-duration: 0s;}
.portfolio-musica a:hover i {animation: music-ico 0.4s;}
.portfolio-musica a:hover .ico {background-color: #ec0c59; transition-duration: 0s;}

@keyframes music-ico {
	0% 	  {transform: scale(1);}
	50%  {transform: scale(1.4);}
	100%  {transform: scale(1);}
}


/* PORTFOLIO SUBSECCIÓN MUSICA GALERIAS ---------------------------------------------------------------------------------*/

.portfolio-head-musica-subseccion {margin-top: 4rem; margin-bottom: 3rem;}
.portfolio-head-musica-subseccion h1 {font-family: 'khand', sans-serif; font-size: 5.5rem; font-weight: 300; color: grey; line-height: 110%; margin-bottom: 0rem; text-align: center;}
.portfolio-head-musica-subseccion h2 {font-family: 'khand', sans-serif; font-size: 3rem; font-weight: 300; color: #ec0c59; letter-spacing: -1px;  line-height: 100%; margin-bottom: 0rem; text-align: center;}

.portfolio-barra.musica a {color: grey;}
.portfolio-barra.musica a:hover {color: #ec0c59;}

.boton-info {margin-bottom: 1.5rem; text-align: center;}
.boton-info a {font-family: 'Catamaran', sans-serif; font-size: 0.85rem; color: #ec0c59; padding: 0.2rem 0.4rem 0.1rem 0.4rem; border-radius: 20px; border: 1px solid; text-decoration: none;}
.boton-info a:hover {color: #ffffff; background-color: #ec0c59; transition-duration: 0.2s; border-color: #ec0c59;}
.boton-info p {font-family: 'Catamaran', sans-serif; font-size: 0.8rem; margin: 0.50rem 0rem 0rem 0.25rem;}


/* PORTFOLIO SUBSECCIÓN MUSICA WEB ----------------------------------------------------------------------------------------*/

.contenedor-galeria-portfolio-musica-web {flex: 100%; margin: 0rem 0rem 1.5rem; position: relative;}
.contenedor-galeria-portfolio-musica-web:last-child {margin: 0rem;}
.contenedor-galeria-portfolio-musica-web a {font-family: 'Catamaran', sans-serif; font-size: 0.85rem; position: absolute; right: 1rem; bottom: 2.5rem; text-decoration: none; color: #ffffff; padding: 0.1rem 0.10rem 0rem 0.4rem;}
.contenedor-galeria-portfolio-musica-web a:hover {background-color: #ec0c59; border-radius: 0.25rem;}
.contenedor-galeria-portfolio-musica-web a i {font-size: 0.8rem; padding: 0rem 0.40rem 0rem 0.15rem;}
.contenedor-galeria-portfolio-musica-web p {font-family: 'Open Sans', sans-serif; font-size: 0.9rem; color: grey; margin: 0.25rem 0rem; text-align: center;}

/* PORTFOLIO SUBSECCIÓN MUSICA DIFUSIÓN -----------------------------------------------------------------------------------*/


.contenedor-galeria-portfolio-difusion {flex: 100%; margin: 0rem 0rem 1.5rem; position: relative;}
.contenedor-galeria-portfolio-difusion h3 {font-family: 'khand', sans-serif; font-size: 2rem; color: #ec0c59; margin-bottom: 0.75rem; font-weight: 300;}

.difusion-tripticos {position: relative;}
.difusion-tripticos h4 {font-family: 'khand', sans-serif; font-size: 1.5rem; color: #000000; margin-bottom: 0.75rem; position: absolute; bottom: 6rem; right: 5rem; width: 11rem;}

.difusion-flyers {position: relative; background-color: #9c9b96;}
.difusion-flyers h4:nth-child(1) {font-family: 'khand', sans-serif; font-size: 1.5rem; color: #000000; margin-bottom: 0.75rem; position: absolute; top: 4rem; right: 5rem; width: 11rem;}
.difusion-flyers h4:nth-child(2) {font-family: 'khand', sans-serif; font-size: 2rem; color: #000000; margin-bottom: 0rem;}

.contenedor-galeria-difusion-flyers {overflow: hidden; position: relative; cursor: default; flex: 33%; padding: 0.25rem;}
.conjunto-difusion-flyers {background-color: #ffffff; position: relative; width: 100%;}
.conjunto-difusion-flyers:hover .imagen {opacity: 0.6;}

.difusion-flyers-ironia {position: relative;}
.difusion-flyers-ironia h4 {font-family: 'khand', sans-serif; font-size: 1.7rem; color: #000000; margin-bottom: 0rem; position: absolute; top: 4rem; right: 3rem;}

.difusion-flyers-armonauta {position: relative;}
.difusion-flyers-armonauta h4 {font-family: 'khand', sans-serif; font-size: 1.7rem; color: #000000; margin-bottom: 0rem; position: absolute; top: 3.25rem; right: 3rem;}

.difusion-flyers-acido-mc {position: relative;}
.difusion-flyers-acido-mc h4 {font-family: 'khand', sans-serif; font-size: 1.7rem; color: #000000; margin-bottom: 0rem; position: absolute; top: 4rem; right: 3rem;}

.difusion-flyers-soulkick {position: relative; display: flex; justify-content: center;}
.difusion-flyers-soulkick h4 {font-family: 'khand', sans-serif; font-size: 1.7rem; color: #000000; margin-bottom: 0rem; position: absolute; top: 3rem;}

.difusion-afiches {position: relative;}
.difusion-afiches h4:nth-of-type(1) {font-family: 'khand', sans-serif; font-size: 1.5rem; color: #501760; margin-bottom: 0rem; position: absolute; top: 4rem; right: 3rem; width: 14rem;}
.difusion-afiches h4:nth-of-type(2) {font-family: 'khand', sans-serif; font-size: 1.5rem; color: #aeaeae; margin-bottom: 0rem; font-weight: 300; margin-top: 1.5rem; text-align: center;}















/*----------------------------------------------------------------------------------------------------------- */
/*----------------------------------------------------------------------------------------------------------- */
/* SERVICIOS ------------------------------------------------------------------------------------------------ */

.servicios-contenido {margin-top: 2.5rem; margin-bottom: 2.5rem; padding: 0rem 1.5rem;}

.servicios-contenido .blq1 {opacity: 0; animation: aparecer 1s forwards;}
.servicios-contenido .blq2 {opacity: 0; animation: aparecer 1s 0.3s forwards;}
.servicios-contenido .blq3 {opacity: 0; animation: aparecer 1s 0.6s forwards;}
.servicios-contenido .blq4 {opacity: 0; animation: aparecer 1s 0.9s forwards;}

.servicios-bloque {display: inline-block; margin: 1.5rem 0rem; padding: 0.5rem 0.70rem 1.5rem 1rem; border-style: solid; border-color: #dcdcdc; border-width: 1px; border-radius: 30px 10px; transition-duration: 0s; position: relative;}
.servicios-bloque:hover {background-image: linear-gradient(135deg, #faffc4, #e7f92f); transition-duration: 0s;}
.servicios-bloque:hover #serviciosmas {background-color: #ff6e28; transform: rotate(180deg); transition-duration: 0.5s;}
.servicios-bloque:hover #serviciovermastexto {color: #ffffff; background-color: #d0d0d0; border-color: #d0d0d0;}
.servicios-bloque:hover #serviciovermastexto a {color: #ffffff; background-color: #d0d0d0; border-color: #d0d0d0;}
.servicios-bloque:hover #serviciosmasmusicos {background-color: #000000; transform: rotate(180deg); transition-duration: 0.5s;}
.servicios-bloque:hover #serviciovermastextomusicos {background-color: #717171; border-color: #717171;}
.servicios-bloque:hover #serviciovermastextomusicos a {color: #ffffff;}

.servicios-boton {text-decoration: none !important;}
.servicios-boton p {font-family: 'Open Sans', sans-serif; font-weight: 400; font-size: 0.9rem; line-height: 150%; color: grey; margin-top: 0rem; margin-bottom: 0rem;}

.titulo-servicios {font-family: 'khand', sans-serif; font-weight: 400; font-size: 1.4rem; color: #ff6e28; margin-top: 0.7rem; margin-bottom: 0rem;}

.servicios-vermas {font-size: 0.75rem; display: flex; justify-content: center; align-items: center; width: 1.5rem; height: 1.5rem; position: absolute; bottom: -0.75rem; color: #ffffff; background-color: #d0d0d0; border-radius: 50%; z-index: 2;}
.servicios-vermas a {color: #ffffff; text-decoration: none;}
.servicios-vermas-texto {font-family: 'Open Sans', sans-serif; font-weight: 800; font-size: 0.7rem; position: absolute; bottom: -0.55rem; left: 1.8rem; display: inline-block; color: #d0d0d0; background-color: #ffffff; border-style: solid; border-width: 1px; border-radius: 20px; border-color: #dcdcdc; padding: 0rem 0.5rem 0rem 0.8rem; z-index: 1; transition-duration: 0s;}
.servicios-vermas-texto a {color: #d0d0d0; text-decoration: none;}
.servicios-vermas-texto a:hover {color: #ffffff; text-decoration: none;}
#serviciosmasmusicos {background-color: #ec0c59;}

.servicios-musicos {background-color: #000000; border-color: #ffffff; width: 100%;}
.servicios-musicos h3 {font-family: 'blankaregular', 'khand', sans-serif; font-size: 1.2rem; margin: 0.2rem 0rem 0.4rem; color: #ffffff; letter-spacing: 0.2rem;}
.servicios-musicos p {margin: 0.3rem 0rem 0.5rem; color: white;}
.servicios-musicos:hover {background-image: linear-gradient(135deg, #ff1968, #ca0d4e); border-color: #ffffff;}
.servicios-musicos:hover #color-estrella-servicios {color: #e7f92f; transition-duration: 0s;}
.titulo-servicios-musicos {color: white;}
.fa-star {font-size: 1.6rem; margin-left: 0.3rem;}



/* SERVICIOS SUBSECCIÓN ---------------------------------------------------------------------------------*/

.servicios-art-head {margin-top: 4rem; margin-bottom: 5rem;}
.servicios-art-head h1 {font-family: 'khand', sans-serif; font-size: 5.5rem; font-weight: 300; color: #0daebf; letter-spacing: 0px; line-height: 110%; margin-bottom: 0rem; text-align: center;}
.servicios-art-head h2 {font-family: 'khand', sans-serif; font-size: 3rem; font-weight: 300; color: #ff6e28; letter-spacing: -2px; margin-bottom: 0rem; line-height: 100%; text-align: center;}
.servicios-art-head p {font-family: 'Open Sans', sans-serif; font-size: 0.9rem; margin-top: 1rem; color: #ff6e28; margin-bottom: 0rem; text-align: center;}
.servicios-art-head a {color: grey; text-decoration: none;}
.servicios-art-head a:hover {color: #ff6e28;}
.servicios-art-head span {color: #bfbfbf !important;}

.servicios-art {margin: 4.5rem 0rem 1.5rem;}
.servicios-art h3 {font-family: 'khand', sans-serif; font-size: 2rem; color: #0daebf; margin-bottom: 0.75rem;}
.servicios-art h4 {font-family: 'khand', sans-serif; font-size: 1.5rem; color: #0daebf;}
.servicios-art p {font-family: 'Open Sans', sans-serif; font-size: 0.9rem; line-height: 165%; color: grey; margin-top: 0rem;}
.servicios-art p a {color: grey;}
.servicios-art p a:hover {color: #ff6e28; text-decoration: none;}
.servicios-art ul {list-style-image: url('../servicios/img/item.png');}
.servicios-art ul li {font-family: 'Open Sans', sans-serif; font-size: 0.9rem; line-height: 165%; color: grey; margin-top: 0rem; margin-left: -0.75rem; list-style-position: outside;}
.servicios-art .destacado {font-weight: bold; text-align: center; margin-top: 1rem; color: #ec0c59;}

.img-servicios-subseccion {margin: 1rem 0rem 0rem;}
.img-servicios-subseccion:first-child {margin-top: 0rem;}

.separador {border-top: 1px solid; margin: 2rem 0rem 2.5rem; color: #0daebf;}

.boton-servicios {color: grey; margin-bottom: 1.5rem; text-align: center;}
.boton-servicios a {font-family: 'Catamaran', sans-serif; font-size: 0.85rem; color: #0daebf; padding: 0.2rem 0.4rem 0.1rem 0.4rem; border-radius: 20px; border: 1px solid; text-decoration: none;}
.boton-servicios a:hover {color: #e7f92f; background-color: #0daebf; transition-duration: 0.2s; border-color: #0daebf;}
.boton-servicios p {font-family: 'Catamaran', sans-serif; font-size: 0.8rem; margin: 0.50rem 0rem 0rem 0.25rem;}

/* web */

.modulo-web {display: flex; justify-content: center; flex-wrap: wrap;}
.modulo-web div {flex: 20%; border-radius: 30px 10px; padding: 1rem 1rem 0.75rem; margin: 0.5rem 0.5rem; box-shadow: 0px 0px 80px 10px #efefef;}
.modulo-web h4 {font-family: 'Open Sans', sans-serif; font-weight: 700; font-size: 0.9rem; margin-bottom: 0.25rem; color: #0daebf;}
.modulo-web p {font-family: 'Open Sans', sans-serif; font-weight: 400; font-size: 0.9rem; margin-bottom: 0rem;}

.tienda-online h3 {font-family: 'khand', sans-serif; font-size: 3.75rem; color: #ff6e28; line-height: 100%; margin-bottom: 0.5rem;}
.tienda-online h4 {font-family: 'khand', sans-serif; font-size: 2rem; color: #0daebf; line-height: 100%; margin-bottom: 0.5rem;}
.tienda-online div div div div div {display: flex; padding: 0.5rem 1rem;}
.tienda-online i {font-size: 1rem; color: #10bf0d; padding-right: 0.5rem; margin-top: 0.25rem;}
.tienda-online .destacado {font-family: 'Sansita Swashed', cursive; font-weight: normal; font-size: 1.5rem; text-align: center; margin-top: 1rem; color: #10bf0d;}

/* hosting */

.modulo-hosting div div div div {display: flex; flex: 25%; justify-content: center; flex-wrap: wrap;}
.modulo-hosting div div div div div {display: flex; flex-wrap: nowrap; padding: 0.5rem 1rem 0.5rem;}
.modulo-hosting i {font-size: 1rem; color: #ec0c59; padding-right: 0.5rem; margin-top: 0.25rem;}
.modulo-hosting .destacado {font-family: 'khand', sans-serif; font-size: 1.5rem; text-align: center; margin-top: 1rem; color: #ec0c59;}

/* fotografia */

.modulo-foto-listado {margin-top: 1rem;}
.modulo-foto-listado ul {display: inline-block; list-style-image: none !important; list-style-type: none;}
.modulo-foto-listado ul li {font-family: 'Open Sans', sans-serif; line-height: 200%; margin-top: 0rem; margin-left: -1.6rem; list-style-position: outside;}

.modulo-foto-equipos {margin: 2rem 0rem;}
.modulo-foto-equipos ul {list-style-image: url('../servicios/img/item.png');}
.modulo-foto-equipos ul li {font-family: 'Open Sans', sans-serif; line-height: 200%; margin-top: 0rem; margin-left: -1.6rem; list-style-position: outside;}

/* impresos */

.modulo-impresos {margin-bottom: 4rem;}
.modulo-impresos div div div div {display: flex; flex: 15%; justify-content: center; flex-wrap: wrap;}
.modulo-impresos div div div div div {border-radius: 0.75rem 0rem; padding: 0.5rem 0rem 0.25rem; margin: 0.5rem 0.5rem; background-color: #c5fffe;}
.modulo-impresos h4 {font-family: 'khand', sans-serif; font-size: 1.5rem; text-align: center; margin-top: 0rem; margin-bottom: 0rem; color: #f51c1c;}

/* logo-branding */

.logo-branding-cuadro {background-color: #ffffff; border-radius: 1.5rem; padding: 2rem; margin: 2rem 0rem 2rem; box-shadow: 0px 0px 80px 10px #efefef;}
.logo-branding-cuadro div div {padding: 0rem 1rem;}
.logo-branding-cuadro h3 {text-align: center; margin-bottom: 1rem;}
.logo-branding-cuadro p {margin-bottom: 0rem;}

.logo-branding-parametros {margin-top: 4rem;}
.logo-branding-parametros .destacado {font-weight: bolder; color: #ec0c59; margin-bottom: 2rem;}

.logo-branding-isotipo {background-image: linear-gradient(150deg, #ec0c59, #bd144e); padding: 2rem; box-shadow: 0px 0px 80px 10px #efefef;}
.logo-branding-isotipo h3 {color: #ffffff;}
.logo-branding-isotipo p {color: #ffffff;}
.logo-branding-isotipo p:last-child {margin-bottom: 0rem;}


/* SERVICIOS DISEÑO PARA MUSICA  -----------------------------------------------------------------------------*/

.musica-base-barra-navegacion {position: absolute; top: 0; width: 100%; height: 19rem; background-color: #000000; z-index: -10;}

.pasador-musica-grande {display: block;}
.pasador-musica-chico {display: none;}

.carrousel-tit {font-family: 'khand', sans-serif; font-size: 3rem; color: #ffffff; margin-bottom: 0rem;}
.carrousel-txt {font-family: 'Open Sans', sans-serif; font-weight: 400; font-size: 1rem; color: #ffffff;}

.servicios-musica-intro {background-color: #000000; padding-top: 2rem; padding-bottom: 4rem;}
.servicios-musica-intro h1 {font-family: 'khand', sans-serif; font-size: 6rem; letter-spacing: -3px; margin: 3rem 0rem 0rem; line-height: 110%; text-align: center; background: -webkit-linear-gradient(270deg, #ec0c59, #ec0c59, #25040f); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.servicios-musica-intro h2 {font-family: 'blankaregular', 'khand', sans-serif; font-size: 2.5rem; letter-spacing: 8px; text-align: center; color: #ffffff; margin-top: 0.75rem;}
.servicios-musica-intro p {font-family: 'Open Sans', sans-serif; font-size: 1.15rem; color: #d0d0d0; margin: 1.5rem 0rem; text-align: center; line-height: 150%;}

.titmusica.animar {animation: titmusica 1s;}
.titdmts.animar {animation: titmusica 1s;}

@keyframes titmusica {
	0% 	  {transform: scale(1);}
	50%  {transform: scale(1.2);}
	100%  {transform: scale(1);}
}

.subtitulo-seccion-servicios-3-musica {color: #ec0c59 !important;}

.musicanimatxt {opacity: 0;}
.musicanimatxt.animar {animation: txtservmusica 1.5s forwards;}

@keyframes txtservmusica {
	
	0%    {transform: translateY(75px); opacity: 1;}
	100%  {transform: translateY(0px); opacity: 1;}
}

.banderas h3 {font-family: 'khand', sans-serif; font-weight: 300; font-size: 3rem; line-height: 100%; color: #545454; opacity: 0;}
.banderas.animar h3 {animation: banderanima 2s 0.3s forwards;}
.banderas p {font-family: 'Open Sans', sans-serif; font-size: 1.1rem; color: #8d8d8d; opacity: 0;}
.banderas.animar p {animation: banderanima 2s 0.6s forwards;}

.bandera {width: 83%;}

.bandera-ar {opacity: 0;}
.bandera-ar.animar {animation: banderanima 1s 0s forwards;}
.bandera-bol {opacity: 0;}
.bandera-bol.animar {animation: banderanima 1s 0.1s forwards;}
.bandera-ch {opacity: 0;}
.bandera-ch.animar {animation: banderanima 1s 0.2s forwards;}
.bandera-usa {opacity: 0;}
.bandera-usa.animar {animation: banderanima 1s 0.3s forwards;}
.bandera-sal {opacity: 0;}
.bandera-sal.animar {animation: banderanima 1s 0.4s forwards;}
.bandera-esp {opacity: 0;}
.bandera-esp.animar {animation: banderanima 1s 0.5s forwards;}
.bandera-it {opacity: 0;}
.bandera-it.animar {animation: banderanima 1s 0.6s forwards;}
.bandera-mex {opacity: 0;}
.bandera-mex.animar {animation: banderanima 1s 0.7s forwards;}
.bandera-pol {opacity: 0;}
.bandera-pol.animar {animation: banderanima 1s 0.8s forwards;}
.bandera-ur {opacity: 0;}
.bandera-ur.animar {animation: banderanima 1s 0.9s forwards;}


@keyframes banderanima {
	0%   {opacity: 0;}
	100% {opacity: 1;}
}


.parallax-musica {
	background-image: url("../servicios/musica/paralax.jpg");
	min-height: 220px;
	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	margin-top: 2rem;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	font-family: 'khand', sans-serif;
	font-weight: 400;
	font-size: 5.5rem;
	line-height: 100%;
}
.parallax-musica a {color: #ffffff; text-decoration: none;}
.parallax-musica a:hover {color: #e7f92f;}

.parallax-musica-tit.animar {animation: parallaxportfolio 1s;}

@keyframes parallaxportfolio {
	0% 	  {transform: scale(1);}
	50%  {transform: scale(1.05);}
	100%  {transform: scale(1);}
}


@font-face {
    font-family: 'blankaregular';
    src: url('webfont/blanka-regular-webfont.eot');
    src: url('webfont/blanka-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('webfont/blanka-regular-webfont.woff2') format('woff2'),
         url('webfont/blanka-regular-webfont.woff') format('woff'),
         url('webfont/blanka-regular-webfont.svg#blankaregular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

.dmts-music-logo {display: flex; flex-direction: column; justify-content: center; align-items: center; margin: 7rem 0rem 4rem;}
.dmts-music-logo h2 {font-family: 'blankaregular', 'khand', sans-serif; font-size: 9rem; background-image: url(../servicios/musica/fondo-dmts-music-logo.gif); background-size: cover; color: transparent; -moz-background-clip: text; -webkit-background-clip: text;}
.dmts-music-logo h2 span#m {}
.dmts-music-logo h2 span#u {vertical-align: -67%; margin-left: -4.5rem;}
.dmts-music-logo h2 span#s {vertical-align: 8%; margin-left: -2.3rem;}
.dmts-music-logo h2 span#i {vertical-align: -67%; margin-left: -2.8rem;}
.dmts-music-logo h2 span#c {vertical-align: -25%; margin-left: -1.8rem;}
.dmts-music-logo h3 {font-family: 'blankaregular', 'khand', sans-serif; font-size: 4rem; margin-bottom: 0rem; color: #a49435;}
.dmts-music-logo h3 span#d {}
.dmts-music-logo h3 span#m {vertical-align: -20%;}
.dmts-music-logo h3 span#t {vertical-align: 6%;}

.musica-serv {display: flex; justify-content: center; flex-wrap: wrap;}
.musica-serv a {text-decoration: none;}
.musica-serv article {flex: 22%; border-radius: 30px 10px; padding: 0rem 1rem; margin: 1.5rem 1rem 1.5rem; box-shadow: 0px 0px 80px 10px #efefef; transition: 0.2s;}
.musica-serv div {display: flex; justify-content: center; align-items: center; position: relative; bottom: 1.6rem; left: 0.25rem; border-radius: 50%; width: 3rem; height: 3rem; z-index: 10;}
.musica-serv i {font-size: 2rem; line-height: 100%; color: #ffffff;}
.musica-serv h3 {font-family: 'khand', sans-serif; font-size: 1.5rem; color: #ec0c59; position: relative; bottom: 0.75rem;}
.musica-serv p {font-family: 'Open Sans', sans-serif; font-size: 0.90rem; color: grey; margin-bottom: 0rem; position: relative; bottom: 1rem; transition: 0s;}

.musica-serv article:hover {box-shadow: 4px 8px 20px 2px #898989; transition: 0.2s; transform:scale(1.03,1.03); background-color: #000000; z-index: 10;}
.musica-serv article:hover p {color: #ffffff; transition: 0s;}
.musica-serv article:hover i {animation: music-ico 0.4s; animation-fill-mode: backwards;}

.ico-estrella-ajuste {padding: 0rem 0.1rem 0.2rem 0rem; background-color: #21ccca;}
.ico-disco-ajuste {padding: 0rem 0.12rem 0.08rem 0rem; background-color: #3cca73;}
.ico-web-ajuste {background-color: #b075e0;}
.ico-impreso-ajuste {padding: 0rem 0rem 0.12rem 0.10rem; background-color: #ef8e41;}


.musica-serv-a {opacity: 0;}
.musica-serv-a.animar {animation: musicservanima 1s 0.3s forwards;}
.musica-serv-b {opacity: 0;}
.musica-serv-b.animar {animation: musicservanima 1s 0.6s forwards;}
.musica-serv-c {opacity: 0;}
.musica-serv-c.animar {animation: musicservanima 1s 0.9s forwards;}
.musica-serv-d {opacity: 0;}
.musica-serv-d.animar {animation: musicservanima 1s 1.1s forwards;}

@keyframes musicservanima {
	0%   {opacity: 0;}
	100% {opacity: 1;}
}















/*----------------------------------------------------------------------------------------------------------- */
/*----------------------------------------------------------------------------------------------------------- */
/* CONTACTO ------------------------------------------------------------------------------------------------- */


.form {margin-top: 2rem;}

.form-tit {font-family: 'Open Sans'; font-size: 1rem; margin-top: 0.6rem; margin-bottom: 0.2rem; color: grey;}
.form-control {background-color: #e8e8e8; border-color: #9c9c9c;}
.form-group {margin-bottom: 1rem;}
.btn-primary {background-color: #0daebf; border-color: #2481c1; margin-top: 1.5rem; box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.4);}
.btn-primary:hover {color: #4a320f; background-color: #ff6e28; border-color: #ff5300;}

.contenedor-data article p {font-family: 'Open Sans'; font-size: 1rem; color: #a5a5a5 !important; margin-top: 1.5rem;}
.contenedor-data article a {font-size: 1rem; color: #a5a5a5; text-decoration: none;}
.contenedor-data article a:hover {color: #ff6e28;}
.mail-contacto {text-decoration: underline !important;}

.tel-contacto-bold {font-weight: 600; color: #0daebf; font-size: 1.1rem; margin-bottom: 0rem;}
.tel-contacto {font-family: 'Open Sans', sans-serif; font-size: 1rem !important; color: #a5a5a5;}
a.tel-contacto:hover {color: #ff6e28 !important;}

.tel-w-contacto-bold {font-weight: 600; color: #25d366 !important; font-size: 1.1rem; margin-bottom: 0rem;}
.fa-whatsapp {font-size: 1.2rem; color: #25d366;}

.redes-contacto {margin-right: 0.5rem;}

.gracias {position: absolute; top: 0; right: 0; left: 0; height: 100vh; display: flex; justify-content: center; align-items: center;}
.gracias p {font-family: 'khand', sans-serif; font-size: 4rem; font-weight: 300; line-height: 130%; letter-spacing: -1px; color: #ff6e28; text-align: center;}























/*    --------------------------------------------------------------- */
@media (max-width: 1370px) {

/* PORTFOLIO */
#menu-musica {height: 80vh;}

/* SERVICIOS / MUSICA */
.bandera {width: 93%;}

}







/*    --------------------------------------------------------------- */
@media (max-width: 1200px) {

/* SERVICIOS / MUSICA */
.musica-serv article {flex: 45%;}


}









/* IPAD PRO   --------------------------------------------------------------- */
@media (max-width: 1035px) {

/* PIE */

.redes-secciones {margin-top: 0.75rem; justify-content: center;}
.redes-secciones a {margin-left: 0rem; margin-right: 0rem; padding: 0rem 0.5rem;}


/* NOSOTROS */

.music-division-presentacion {margin: 0rem 0rem 0rem;}
.music-division-presentacion h2 {font-size: 5rem; line-height: 100%;}


/* PORTFOLIO */

#trabajos-contenedor {margin-top: 3rem;}
.accesos-portfolio {flex: 45%; max-width: 45%;}
#menu-musica {height: 70vh;}


/* SERVICIOS */

.servicios-bloque {height: 7.5rem;}
.servicios-musicos h3 {margin: 0rem;}
.servicios-musicos p {margin: 0rem 0rem 0.5rem;}

/* SERVICIOS / WEB */

.tienda-online div div div div div {padding: 0rem 0.5rem;}

/* SERVICIOS / HOST */

.modulo-hosting div div div div div {padding: 0.5rem 0.75rem 0.5rem;}

/* SERVICIOS / MUSICA */

.carrousel-tit {font-size: 2rem; line-height: 100%;}
.carrousel-txt {font-size: 0.85rem; margin-bottom: 0.5rem;}
.bandera {width: 90%;}
.parallax-musica {font-size: 4rem;}
.musica-serv article {flex: 45%;}


}










/* iPod Air ------------------------------------------------------- */
@media (max-width: 820px){


/* NOSOTROS */

.music-division-presentacion {align-items: center; text-align: center; margin: 3rem 0rem 0rem;}

/* PORTFOLIO - MUSICA - DIFUSION */

.difusion-tripticos h4 {bottom: 2rem; right: 2rem; width: 11rem;}
.difusion-flyers h4:nth-child(1) {font-size: 1.5rem; top: 2rem; right: 1rem}
.difusion-flyers-ironia h4 {top: 2.5rem; right: 2rem}
.difusion-flyers-armonauta h4 {top: 1.5rem; right: 2rem}
.difusion-flyers-acido-mc h4 {font-size: 1.5rem; top: 2rem; right: 1.5rem}
.difusion-flyers-soulkick h4 {top: 1.5rem;}
.difusion-afiches h4:nth-of-type(1) {top: 2rem; right: 0rem;}

/* CONTACTO */

.gracias {padding: 0 6rem}
.gracias p {font-size: 4rem; line-height: 110%; letter-spacing: -1px;}


}














/* TABLETS ------------------------------------------------------- */
@media (max-width: 768px){


/* NOSOTROS */

.music-division-presentacion {align-items: center; text-align: center; margin: 3rem 0rem 0rem;}
.staff {padding-top: 5.5rem;}
.staff-nombre {margin-top: 0rem;}


/* PORTFOLIO */

#trabajos-contenedor {margin: 1.5rem -3.2rem 2.5rem;}
.accesos-portfolio {flex: 45%; max-width: 45%;}
.accesos-portfolio h2 {font-size: 1.8rem;}
.portfolio-barra a {margin: 0rem 0.5rem;}

/* PORTFOLIO SUBSECCIONES */

.contenedor-galeria-portfolio {flex: 50%;}
#menu-musica {height: 60vh;}

/* PORTFOLIO SUB-GALERIAS*/

/* BRANDING GIOCARE */

.contenedor-galeria-giocare-estampas {flex: 50%;}

/* BRANDING CRUZ DIABLO */

.cruz-diablo-etiquetas div {top: 1rem; right: 3rem;}

/* SERVICIOS */

.servicios-bloque {height: 8.5rem}


/* SERVICIOS / WEB */

.modulo-web div {flex: 40%;}
.tienda-online div div div div div {padding: 0rem 1rem;}

/* SERVICIOS / HOST */

.modulo-hosting div div div div {flex: 33%;}
.modulo-hosting div div div div div {padding: 0.5rem 0.5rem 0.5rem;}

/* SERVICIOS / MUSIC */

.bandera {width: 100%;}


}











/* CELULARES ------------------------------------------------------- */
@media (max-width: 500px){

/* GENERAL ------------- */

.body-secciones {margin-bottom: 28rem;}
.body-secciones-musica {margin-bottom: 28rem; background-attachment: fixed;}
.body-secciones-musica-gris {margin-bottom: 28rem;}
.titulo-secciones {font-size: 3.5rem; letter-spacing: -2px;}
.banner-secciones img {height: 25vh; width: auto; max-width: none !important;}

.body-error404 {margin-bottom: 0rem;}
.error404 {position: relative; height: auto; margin-top: 2rem;}
.error404 h1 {font-size: 8rem; margin-bottom: 1rem;}
.error404 h2 {margin-bottom: 2rem;}
.error404 p {margin-bottom: 1.5rem;}
.pie-error404 {position: relative;}



/* NOSOTROS ------------- */

.nosotros-intro {margin-top: 0rem;}
.bloque {flex: 100%;}
.titulo2 {margin-top: 1.7rem;}
.nosotros-metodo {padding-top: 3rem; padding-bottom: 2.5rem; background-image: linear-gradient(90deg, #f8fdc4, #f7fdb5); height: auto;}
.metodo-iconos div {flex: 100%;}
.music-division-presentacion h2 {line-height: 93%;}
.staff-tit {font-size: 3.5rem;}
.staff {background-image: linear-gradient(135deg, #2ab2c6, #2a86c7); height: unset; padding-top: 3rem; padding-bottom: 2rem; margin-top: 5rem;}
.staff-nombre {margin-top: 0rem;}
.portfolio-online {text-align: center;}
.portfolio-descarga {text-align: center;}


/* PORTFOLIO -------------*/

#trabajos-contenedor {margin: 1.5rem -0.9rem 2.5rem;}
.accesos-portfolio {flex: 100%; max-width: 100%;}
.accesos-portfolio h2 {font-size: 1.7rem;}

/* PORTFOLIO SUBSECCIONES */

.contenedor-galeria-portfolio-web a {bottom: 3.75rem; background-color: #525252; border-radius: 5px;}
.contenedor-galeria-portfolio {flex: 100%;}
.contenedor-galeria-portfolio-paackaging-etiquetas {flex: 100%; padding: 0.5rem;}
.portfolio-barra {flex-direction: column; align-items: center;}
.portfolio-barra a {margin: 0rem 0rem 0.5rem;}

/* BRANDING - CRUZ DIABLO */

.contenedor-galeria-cruz-diablo-ilustraciones {flex: 100%;}
.cruz-diablo-etiquetas {justify-content: center;}
.cruz-diablo-etiquetas div {position: static;}

/* PORTFOLIO - WEB */
/* PORTFOLIO - MUSICA - WEB */

.imagen-web {display: none;}
.imagen-web-sm {display: block;}

/* PORTFOLIO - MUSICA */

#menu-musica {height: auto;}

.portfolio-head-musica h1 {line-height: 90%; padding-left: 0.85rem;}
.portfolio-head-musica h2 {margin-top: 0.75rem;}
.portfolio-musica {margin-bottom: 0rem;}
.portfolio-musica a {flex: 50%; margin-bottom: 3rem;}

.bandera {width: 100%;}

.portfolio-musica-dmts-music {line-height: 115%; padding-left: 0.75rem;}

.portfolio-head-musica-subseccion {margin-bottom: 2rem;}
.portfolio-head-musica-subseccion h1 {line-height: 90%;}
.portfolio-head-musica-subseccion h2 {margin-top: 1rem;}
.portfolio-barra.musica a {margin: 0rem 0rem 0.5rem;}

/* PORTFOLIO - MUSICA - WEB */

.contenedor-galeria-portfolio-musica-web a {bottom: 3.5rem; background-color: #000000; border-radius: 5px;}

/* PORTFOLIO - MUSICA - DIFUSION */

.difusion-tripticos h4 {color: #aeaeae; margin-bottom: 0.75rem; position: relative; bottom: unset; right: unset; width: unset; text-align: center; font-weight: 300;}
.contenedor-galeria-difusion-flyers {flex: 100%;}
.difusion-flyers h4:nth-child(1) {position: relative; font-size: 2rem; margin-top: 2rem; top: unset; right: 0rem; width: unset; text-align: center;}
.difusion-flyers h4:nth-child(2) {margin-top: 1.25rem;}
.difusion-flyers-ironia h4 {color: #aeaeae; position: relative; top: unset; right: unset; margin-top: 2.5rem; text-align: center !important; font-weight: 300;}
.difusion-flyers-armonauta h4 {color: #aeaeae; position: relative; top: unset; right: unset; margin-top: 2.5rem; text-align: center !important; font-weight: 300;}
.difusion-flyers-acido-mc h4 {font-size: 1.7rem; color: #aeaeae; position: relative; top: unset; right: unset; margin-top: 2.5rem; text-align: center !important; font-weight: 300;}
.difusion-flyers-soulkick {display: block;}
.difusion-flyers-soulkick h4 {color: #aeaeae; position: relative; top: unset; right: unset; margin-top: 2.5rem; padding: 0 3rem; text-align: center !important; font-weight: 300;}
.difusion-afiches h4:nth-of-type(1) {color: #943aad; margin-bottom: 0.75rem; position: relative; top: unset; right: unset; width: unset; text-align: center;}




/* SERVICIOS ---------------------- */

.servicios-bloque {height: auto;}
.servicios-art h3 {font-size: 1.5rem;}
.servicios-art ul li {padding: 0.25rem 0rem; margin: 0rem 0rem 0.5rem -1.5rem;}

/* SERVICIOS / MUSICA -------------*/

.servicios-musica-intro h1 {line-height: 95%; padding-top: 0.5rem; color: #ec0c59; background: unset; -webkit-text-fill-color: unset; -webkit-background-clip: unset;}
.servicios-musica-intro p {font-size: 1.2rem;}

.pasador-musica-grande {display: none;}
.pasador-musica-chico {display: block;}
.parallax-musica {font-size: 3rem; line-height: 110%; margin-top: 1rem;}

.dmts-music-logo h2 {font-size: 6rem;}
.dmts-music-logo h2 span#u {vertical-align: -67%; margin-left: -3rem;}
.dmts-music-logo h2 span#s {vertical-align: 8%; margin-left: -1.5rem;}
.dmts-music-logo h2 span#i {vertical-align: -67%; margin-left: -1.5rem;}
.dmts-music-logo h2 span#c {vertical-align: -25%; margin-left: -1rem;}
.dmts-music-logo h3 {font-size: 3rem;}

.musica-serv article {flex: 100%;}

/* SERVICIOS / WEB */

.modulo-web div {flex: 100%; max-width: 80%;}
.tienda-online div div div div div {padding: 0rem 0rem;}
.tienda-online h3 {font-size: 3rem;}

/* SERVICIOS / HOST */

.modulo-hosting div div div div {flex: 100%;}
.modulo-hosting div div div div div {padding: 0rem 0.5rem 0rem;}

/* SERVICIOS / FOTOGRAFIA */

.modulo-foto-listado ul {padding-left: 0rem; list-style-image: url(../servicios/img/item.png) !important;}
.modulo-foto-listado ul li {line-height: 140%; padding: 0.20rem 0rem; margin: 0rem 0rem 0.5rem 0.9rem !important; text-align: left;}
.modulo-foto-equipos ul {padding-left: 0rem;}
.modulo-foto-equipos ul li {line-height: 140%; padding: 0.20rem 0rem; margin: 0rem 0rem 0rem 0.9rem !important; text-align: left;}

/* SERVICIOS / IMPRESOS */

.modulo-impresos div div div div {flex: 40%;}

/* SERVICIOS / LOGO BRANDING */

.logo-branding-cuadro {padding: 1rem; margin: 0rem;}
.logo-branding-cuadro h3 {margin-bottom: 0.5rem;}
.logo-branding-cuadro P {margin-bottom: 0.75rem;}

.logo-branding-isotipo {padding: 1.75rem 1rem;}


/* CONTACTO */

.gracias {position: relative; height: 100%; margin-top: 4rem;}
.gracias p {font-size: 3rem; line-height: 110%; letter-spacing: -1px;}


}