:root {
    /** GLOBALES **/
    --ruta: url('..');
    --colorPrincipal: rgb(34, 36, 41) /* #93D50A */;
    --colorSecundario: #FF002B;
  	--colorTercero: rgb(51, 51, 51);
  	--colorCuarto: #232323;
    --fuenteTitulos: "Rubik", sans-serif /* "Montserrat", sans-serif */;
    --fuenteParrafos: "Rubik", sans-serif;
    
    /** MENÚ **/
    --textoMenu: #fff;
    --selectecMenu: var(--colorSecundario) /* #919191 */;
    --lineaMenu: var(--colorSecundario);

    /** SECCIÓN HEADER **/
    --barraHeader: transparent;
    --barraMenu: var(--colorCuarto);
    --telefonosColor: var(--colorPrincipal);
    --alturaHeader: 0;
    --alturaHeaderMobile: 0;
    --fondoSticky: var(--colorCuarto);

    /** FOOTER **/
    --barraFooter: #fff;
    --colorTextoBarraFooter: var(--colorPrincipal);
    --fondoFooter: #fff;
    --colorTextoFooter: #3d3d3d;
}

/*CÓDIGO PLANTILLA*/

html {
    box-sizing: border-box;
    font-size: 62.5%;
}
*, *:before, *:after {
    box-sizing: inherit;
}

body {
    font-family: var(--fuenteParrafos);
    font-size: 1.6rem;
    line-height: 1.5;
    font-weight: 300;
}


/** Globales **/


h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
    font-family: var(--fuenteTitulos);
    margin: calc( var(--separacion) / 2 ) 0 ;
    line-height: 1;
    color: var(--colorTercero);
}
h1 {
    font-size: 2.8rem;
}
h2 {
    font-size: 2.6rem;
}
h3 {
    font-size: 2.2rem;
}
h4, h5, h6 {
    font-size:  2.2rem;
}
@media (min-width: 768px) {
    h1 {
        font-size: 3.5rem;
    }
    h2 {
        font-size: 2.8rem;
    }
}
a {
    text-decoration: none;
}
img{
    max-width: 100%;
    display: block;
}
.contenedor {
    max-width: 200rem;
    width: 90%;
    margin: 0 auto;
}
#scrollUp {
    bottom: 20px;
    right: 15px;
    padding: 7px 10px 10px;
    background: var(--colorPrincipal);
    color: #FFF;
    font-size: 24px;
    line-height: 1;
    text-decoration: none;
    transition: background .4s;
}
#scrollUp:hover {
    background: var(--colorSecundario);
}
.whatsapp {
    position: fixed;
    z-index: 2;
    left: 10px;
    bottom: 50px;
}
.whatsapp a img {
    width: 50px;
    transition: 0.5s;
}
.whatsapp a img:hover {
    width: 60px;
}
.telefono-sticky{
background: var(--colorPrincipal);
color: #fff;
padding: 1rem 2rem;
border-radius: 2rem 0 0 2rem;
position: fixed;
top: 13rem;
right: -20rem;
opacity: 0%;
transition: right 1s, opacity 1s;
z-index: 2;
}
@media (min-width: 768px) {
    .telefono-sticky{
        top: 10rem;
    }
    .contenedor {
        width: 80%;
    }
  .servicios-cards .contenedor{
  	width:90%;
  }
}
.telefono-sticky a{
    color:#ffffff;
}
.telefono-sticky-aparece{
    right: 0;
    opacity: 100%;
    transition: right 1s, opacity 1s;
}
.telefono-sticky-desaparece{
    right: -20rem;
    opacity: 0;
    transition: opacity 1s;
    transition: right 1s;
}
.sticky {
    position: fixed!important;
    top: 0;
    width: 100%;
    background-color: var(--fondoSticky)!important;
  }
  
  .sticky + .contenido-marketing {
    padding-top: 10rem;
  }
  .carga-fotos {
    display: none;
  }
  .cta-banner span i.fa {
    display: none;
}
/**MENÚ OLD SUPERFISH**/

#navigation .sf-menu, #navigation .sf-menu * {
	margin: 0;
	padding: 0;
	list-style: none;
}

#navigation .sf-menu li {
	position: relative;
	white-space: nowrap;
}

#navigation .sf-menu ul {
	position: absolute;
	display: none;
	z-index: 99;
}

#navigation .sf-menu > li {
	float: left;
}

#navigation .sf-menu ul {
	top: 100%;
	left: 0;
}

#navigation .sf-menu ul ul {
	top: 0;
	left: 100%;
}

#navigation .sf-menu li:hover > ul,
#navigation .sf-menu li.sfHover > ul {
	display: block;
}

#navigation .sf-menu a {
	display: block;
	position: relative;
	font-size: 1.6rem;
	color: var(--textoMenu);
	text-decoration: none;
	line-height: 1.5;
	padding: 5px 30px;
	transition: background .4s;
    
}
.menu-principal{
	padding:30px 0;
}

#navigation .sf-menu > li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 1px;
	height: 10px;
}

#navigation .sf-menu > li:first-child::before {
	display: none;
}

#navigation .sf-menu ul {
	min-width: 200px;
	background: var(--textoMenu);
	margin-top: 15px;
}

#navigation .sf-menu ul a {
	color: var(--textoMenu);
	text-transform: capitalize;
	border-radius: 0;
}

#navigation .sf-menu li a:hover, 
#navigation .sf-menu li.sfHover > a,
#navigation .sf-menu li.active > a, 
#navigation .sf-menu li.selected > a {
	background: none;
	color: var(--selectecMenu);
	border-bottom: solid 2px var(--lineaMenu);
}

#navigation .sf-arrows .sf-with-ul::after {
	content: '\f107';
	font-family: 'FontAwesome';
	font-size: 18px;
	position: absolute;
	left: 50%;
	bottom: 5px;
	transform: translateX(-50%);
	color: #ffffff;
}

/**UTILIDADES**/
.text-center{
    text-align: center;
}
.mt-5 {
    margin-top: 5rem;
}
.mb-5 {
    margin-bottom: 5rem;
}
.menu-wrap{
    display: auto;

}
@media (min-width:768px ) {
    .menu-wrap{
        display: none;
    
    }
}
/**HEADER**/

.contenedor-telefonos{
    background-color: var(--barraHeader);
   
}
.contenedor-menu.menu-sticky{
    transition: background-color 2s;
}
.telefonos{
   display: flex;
flex-direction: column;
align-items: center;
padding: 1rem 0;
}
@media (min-width: 768px) {
    .telefonos{
        flex-direction: row;
        justify-content: flex-end;
        gap: 2rem
    }
}
.menu-telefono{
    margin-top: 2rem
}
@media (min-width: 768px) {
    .menu-telefono{
        display: flex;
        flex-direction: column;
        align-items: flex-end;
    }
}
@media (min-width: 768px) {
    .telefonos{
        display: flex;
        gap: 2rem;
        position: absolute;
        z-index: 20;
        width: 100%;
      	right:20px;
    }
}
.telefono{
    color: var(--telefonosColor);
    font-size: 1.8rem;
}
.telefono a{
    color: var(--telefonosColor);
}

.contenedor-menu{
    background-color: var(--barraMenu);
    z-index: 2;
    position: relative;
    transition:  background-color  .5s;
}
.logo img{
    width: 100%;
    transition: width 1s;
    display: block;
    margin: 0 auto;
  	border-radius: 22px;
}
@media (min-width: 768px) {
    .logo img{
        display: inline;
        margin: 0 ;
    }
}
.logosticky{
width: 60%!important;
transition: width 1s;
}

.logo-menu{
    display: flex;
 flex-direction: column;
 align-items: center;
 padding: 1rem 0;
 }
 @media (min-width: 768px) {
     .logo-menu{
        flex-direction: column;
        justify-content: space-between;

     }
 }
 .sf-menu {
    display: none;
}
.mobile-nav {
    display: inline-block;
    margin: 1rem 0;
}
.mobile-nav a {
    display: inline-block;
    color: #fff;
    text-transform: uppercase;
}
 @media (min-width: 768px) {
    .sf-menu {
        display: inline-block;
    }
	 .mobile-nav {
        display: none;
        margin-top: 0;
    }
 }
 .telefono-mobile{
    color:#ffffff;
    font-size: 2rem;
    margin-bottom: 2rem;
 }
 .telefono-mobile a{
    color: #ffffff
 }
 /*FOTO ZONA DE MARKETING*/
 .camera_loader {
    display: none!important;
 }
 .camera_src {
    display: block!important;
}
 .camera_fakehover {
    height: 40rem!important;
    margin: -1.6rem 0 0 -4rem;
}

@media (min-width: 768px) {
    .camera_fakehover {
        height: 60rem!important;
        margin: -1.6rem 0 0 -4rem;
    }
}
.slider{
    height: 40rem;
    margin-top: var(--alturaHeaderMobile);
}
@media (min-width: 768px) {
    .slider {
        height: 58rem;
        margin-top: var(--alturaHeader);
    }
}

.diy-slideshow figure figcaption {
    position: absolute;
    width: 100%;
    text-align: center;
    font-size: 4rem !important;
    color: var(--colorPrincipal) !important;
    font-family: var(--fuenteTitulos);
    top: 70% !important;
    left: 50% !important;
     bottom: auto !important;
    right: auto !important;
    transform: translate(-50%, -50%);
    padding: 0 !important;
    background: none !important;
    border-radius: 0 !important;
    z-index: 2; 
  /*  text-shadow: 2px 2px 30px #000; */
  	background-color: rgba(255,255,255,0.6) !important;
  	padding:30px 50px !important;
  	font-weight:700 !important;
}
@media (min-width: 768px) {
    .diy-slideshow figure figcaption {
        top: 50% !important;
        font-size: 6.2rem !important;
      	text-align: left !important;
      	width: 60% !important;
      	left: 38% !important;
      	letter-spacing:1.5px;
    }
}
.span-mrk{
	display:block;
  	font-size: 2.6rem;
  	font-weight:400 !important;
  	letter-spacing:1.5px;
}

/*SOLO TEXTO*/
.solo-texto{
    padding: 10% 5%;
    background-color: #ffffff;
}
.solo-texto h1, h2{
    text-align: center;
    COLOR: VAR(--colorTercero);
}
.solo-texto p{
    text-align: center;
}
/**TEXTO Y FOTO**/
.texto-foto{
    padding: 10% 5%;
}
.texto-foto h1, h2{
    text-align: center;
    color: var(--colorTercero);

}
.texto-foto p{
    text-align: center;
}
.contenedor-main-foto h1,
.contenedor-main-foto h2 {
    color: #000; 
    text-align: center;
    
}
@media (min-width: 768px) {
    .contenedor-main-foto h1,
    .contenedor-main-foto h2 {
        text-align: left;
    }
    .contenedor-main-foto p{
        text-align: left;
    }
    .solo-texto{
        padding: 8% 20%;
        
    }
}
@media (min-width: 768px) {
    .contenedor-main-foto{
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 2rem;
        margin-top: 0;
        }
        .contenedor-texto-main {
        flex: 2;
        }
        .contenedor-foto-main{
            flex: 1;
        }
}
.contenedor-foto-main{
    background-repeat: no-repeat;
     background-size: cover;
     background-position: center center;
     min-height: 40rem;
     margin-top: 4rem;
}
@media (min-width: 768px) {
    .contenedor-foto-main{
         margin-top: 0;
    }
}
/*SECCIÓN MITAD TEXTO MITAD FOTO*/

  .mitad-texto {
    padding: 5rem 2rem;
    text-align: center;
  }
  @media (min-width: 768px) {
    .mitad-texto {
        padding: 2rem;
      }
  }
  .foto-mitad-izquierda, 
  .foto-mitad-derecha {
    background-size: cover;
    background-position: center;
    min-height: 400px;
  }
  .pag-5 .foto-mitad-izquierda, 
  .pag-5 .foto-mitad-derecha {
    background-size: 55%;
	background-repeat: no-repeat;
    background-color: var(--colorCuarto);
  }


  .principal.texto-foto-grid {
    background-color: #fff;
    padding: 5%;
  }
  .principal.texto-foto-grid.invertido {
    background-color: #fff;
    padding: 5%;
  }
  .mitad-texto h1,
  .mitad-texto h2{
    color: var(--colorTercero);
    text-align: center;
  }
  .mitad-texto p{
    text-align: center;
  }
  @media (min-width: 768px) {
    .mitad-texto {
        padding-left: calc((100vw - 120rem) / 4);  
        padding-right: calc((100vw - 120rem) / 4);  
        text-align: left;
      }
      
    .principal.texto-foto-grid {
        display: flex;
        flex-wrap: nowrap;
      }
      .mitad-texto, .foto-mitad-derecha, .foto-mitad-izquierda {
        flex: 1 1 50%;
        box-sizing: border-box;
        padding: 10rem 5rem;
      }
      .mitad-texto{
        
        border: 1px solid #eaeaea;
      }
       /* Para invertir la posición */
  .principal.texto-foto-grid.invertido {
    flex-direction: row-reverse;
  }
  }
 
/*SECCIÓN FOTO SOLAPADA*/
.contenedor-main{
    display: flex;
    flex-direction: column-reverse;
 }
 @media (min-width: 768px) {
    .contenedor-main{
        display: grid;
        grid-template-columns: repeat(6, 1fr) ;
        grid-template-rows: repeat(4, 2fr);
    }
     
 }

.contenido-main{
    background-color: #fff;
    padding: 5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
   
}

@media (min-width: 768px) {
    .contenido-main{
        grid-column: 3 / 7;
        grid-row: 1 / 4;
    }
}
.contenido-main h1, h2{
    text-align: center;
}
.contenido-main p{
    text-align: center;
}
@media (min-width: 768px) {
    .contenido-main h1, h2{
        
        text-align: left;
    }
    .contenido-main p{
        text-align: left;
    } 
}
.solapado{
    background-color: #faf6f3;
    padding: 8rem 0;
}
.solapar{
    background-color: #FFFFFF;
    z-index: 1;
}
.solapar h1,
.solapar h2{
    color: #000;
}
.solapar p{
    color: #000;
}
.img-main{
    background-repeat: no-repeat;
     background-size: cover;
     background-position: center center;
     min-height: 50rem;
}
@media (min-width: 768px) {
    .img-main{
        grid-column: 1 / 4;
        grid-row: 2 / 5;
    } 
}
/**SECCIÓN TEXTO INFEROR**/
/*Texto encima de fondo*/

.inferior {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    background-attachment: scroll;
    
}

@media (min-width: 768px) {
    .inferior {
        background-attachment: fixed;
    }
}


.texto-inferior{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: 60rem;
    padding: 10rem 0;
    position: relative;
    z-index: 2; 
}
@media (min-width: 768px) {
    .texto-inferior{
        min-height: 60rem;
    } 
}
.texto-inferior h1,
.texto-inferior h2 {
    color:#fff;
    text-align: center;
    max-width: 100%;

}
.texto-inferior p {
    color: #fff;
    text-align: center;

}
.inferior {
    position: relative;
  }
  
  .inferior::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5); 
    z-index: 1; 
  }
  
  /*FOTO DE FONDO INFERIOR CON RECUADRO*/
.inferior-recuadro{
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    padding: 2rem;
    background-attachment: scroll; 
   
}

@media (min-width: 768px) {
    .inferior-recuadro{
        padding: 20%;
        
    } 
}
.texto-inferior-recuadro{
    background-color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 2rem;
}
@media (min-width: 768px) {
    .texto-inferior-recuadro{
    padding: 5rem;
    }
}
.texto-inferior-recuadro h1,
.texto-inferior-recuadro h2{
    color:var(--colorPrincipal);
    text-align: center;
    max-width: 100%;

}
.texto-inferior-recuadro p {
    color:#000;
    text-align: center;

}
/*FOTO DE FONDO TEXTO LATERAL*/

.contenedor-inferior-derecha,
.contenedor-inferior-izquierda
 {
    background-size: cover;
    background-attachment: scroll;
    padding: 60px 0; 
}
@media (min-width: 768px) {
    .contenedor-inferior-derecha,
.contenedor-inferior-izquierda
 {
    background-attachment: fixed;
}
}
.contenedor-inferior-derecha-grid,
.contenedor-inferior-izquierda-grid {
  display: grid;
  grid-template-columns: 1fr;
  position: relative;
}

.texto-inferior-izquierda,
.texto-inferior-derecha {
  color: #ffffff;
  position: relative;
  z-index: 1; 
  padding: 4rem 2rem;
  text-align: center;
}
@media (min-width: 768px) {
    .texto-inferior-izquierda,
.texto-inferior-derecha {
  text-align: left;
  padding: 2rem;
}
}

.espacio-inferior-derecha,
.espacio-inferior-izquierda {
  display: none;
}

.contenedor-inferior-derecha-grid::before,
.contenedor-inferior-izquierda-grid::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.7); 
}

@media (min-width: 768px) {
  .contenedor-inferior-derecha-grid,
  .contenedor-inferior-izquierda-grid {
    grid-template-columns: 1fr 1fr;
  }

  .texto-inferior-izquierda,
  .texto-inferior-derecha {
    padding: 0;
    color: initial;
  }

  .espacio-inferior-derecha,
  .espacio-inferior-izquierda {
    display: block;
  }

  .contenedor-inferior-derecha-grid .texto-inferior-derecha {
    grid-column: 2 / 3;
  }

  .contenedor-inferior-derecha-grid .espacio-inferior-derecha {
    grid-column: 1 / 2;
  }

  .contenedor-inferior-derecha-grid::before,
  .contenedor-inferior-izquierda-grid::before {
    display: none;  
  }
}

.texto-inferior-derecha h1,
.texto-inferior-derecha h2,
.texto-inferior-izquierda h1,
.texto-inferior-izquierda h2
 {
    margin: 0;
    color:#fff;
      
    }
    .texto-inferior-derecha p,
    .texto-inferior-izquierda p {
        color:#FFF;
          
        }
/**CONTENEDOR ICONOS**/
/**CONTENEDOR ICONOS**/
.iconos {
    display: flex;
    flex-direction: column; 
    align-items: center; 
    
    gap: 1rem;
}

.icono {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
    gap: 2rem;
   
    background: #000;
    color: #fff;
    text-align: center;
    width: 100%;
}

@media (min-width: 768px) {
    .iconos {
        flex-direction: row; 
        justify-content: space-around;
        align-items: stretch; 
        flex-wrap: wrap;
    }
    
    .icono {
        flex: 1; 
    }
}


.contenedor-iconos-cajas .contenedor .iconos .icono {
    background-color: #000;
    color: #fff;
}
.contenedor-iconos-completo{
    background-color: #000;
}    
.contenedor-iconos-completo .contenedor .iconos .icono {
    background-color: #000000;
    color: #ffffff;
}
/*Servicios Iconos*/
.servicios-iconos{
    background-color: #fff;
    padding: 3rem 0;
}

@media (min-width: 768px) {
    .servicios-iconos{
        padding: 6rem 0; 
    }
}


.servicios-iconos img{
        max-height: 60px;
        
}
.servicios-iconos h1,
.servicios-iconos h2{
    color: var(--colorPrincipal);
    text-align: center;
}
.servicios-iconos  p{
    text-align: center;
    color: #000000;
}
.servicio-iconos p{

    color: #ffffff;
    font-size: 1.8rem;
    margin: 2rem 0 0 0;
    line-height: 1;
}
.margen-servicios-iconos{
    margin: 4rem 0;
}
.servicios-iconos .contenedor .iconos .icono {
    background-color: #fff;
    color: #fff;
}

/*ICONOS FONDO FOTOo*/
.servicios-iconos-fondo{
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    background-attachment: scroll;
    padding: 3rem 0;
    color: #ffffff;
    position: relative;
}

@media (min-width: 768px) {
    .servicios-iconos-fondo{
        padding: 6rem 0; 
        background-attachment: fixed;
    }
    .servicios-iconos h1,
    .servicios-iconos h2{
        color: var(--colorPrincipal);
        text-align: left;
    }
    .servicios-iconos  p{
        text-align: left;
        color: #000000;
    }
}
.servicios-iconos-fondo h1,
.servicios-iconos-fondo h2{
    text-align: center;
    color: #FFF;
    max-width: 100%;
}
.servicios-iconos-fondo  p{
    text-align: center;
    color: #FFF;
}
.servicio-iconos-fondo p{

    color: #FFFFFF;
    font-size: 1.8rem;
    margin: 2rem 0 0 0;
    line-height: 1;
}


.servicio-iconos-fondo{
    padding: 3rem;
    color: #ffffff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-bottom: 2rem;

}
@media (min-width: 768px) {
    .servicio-iconos-fondo{
        margin-bottom: 0;
    }
}
.overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.1);
    z-index: 1;
}

.contenido {
    position: relative;
    z-index: 2; /* Este valor es superior al z-index del overlay, por lo que el contenido estará por encima del overlay oscuro */
}
.servicios-iconos-fondo .contenedor .iconos .icono {
    background-color: transparent;
    color: #fff;
}
/**SECCIÓN ICONOS + FOTO GRID**/
.servicios-grid-grande{
    background-color: #ffffff;
    padding: 10% 5%;
}
.servicios-grid-grande h1,
.servicios-grid-grande h2{
    color: #000000;
    text-align: center;
    max-width: 100%;
}
.servicios-grid-grande p{
    color: #000000;
    text-align: center;
}
.margen-grid-grande .contenedor-copias {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

.margen-grid-grande .servicio-grid-grande-foto {
    background-size: cover;
    background-position: center center;
    min-height: 25rem;
    margin-bottom: 1rem;
}

.margen-grid-grande .contenedor-copias .icono {
    width: 100%;
}

.margen-grid-grande .servicio-grid-grande-foto,
.margen-grid-grande .contenedor-copias {
    width: 100%;
}

@media (min-width: 768px) {
    .margen-grid-grande {
        display: flex;
        gap: 1rem;
    }
    
    .margen-grid-grande .servicio-grid-grande-foto,
    .margen-grid-grande .contenedor-copias {
        flex: 1;
        margin-bottom: 0; /* Remover el margin-bottom en pantallas más grandes */
    }

    .margen-grid-grande .contenedor-copias {
        grid-template-columns: 1fr 1fr;
    }
}


.contenedor-copias .icono {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #000000;
    color: #ffffff;
}

/**SECCIÓN ICONOS TEXTO LATERAL**/

.servicios-iconos-lateral {
    background-color: #12213d;
    padding: 10% 5%;
}
.servicios-iconos-lateral h1,
.servicios-iconos-lateral h2{
 color: #fff;
 text-align: center;
}
.servicios-iconos-lateral p{
    color: #fff;
    text-align: center;
}
.servicios-iconos-lateral .iconos-lateral{
    background-color: transparent;
}
.contenedor-servicios-iconos-lateral {
    display: flex;
    flex-direction: column;
}

.iconos-servicios-iconos-lateral {
    display: flex;
    flex-direction: column;
    gap: 4rem;
}

.iconos-lateral {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    background: #000;
    color: #fff;
    text-align: center;
}

.icono-lateral {
    display: flex;
    align-items: center;
    justify-content: center;
}


.icono-lateral img {
    width: 66px;
    height: auto; 
}

@media (min-width: 768px) {
    .iconos-servicios-iconos-lateral {
        flex-direction: row;
        flex-wrap: wrap;
    }
    .iconos-lateral {
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        flex: 1 0 48%;
    }
    .icono-lateral {
        flex: 0 0 66px; 
        margin-right: 10px; 
    }
}

/**CARDS FOTO FONDO**/
.servicios-fotos{
    background-color: #eee;
    padding: 10% 5%;
}
.contenedor-servicio-fotos{
    display: grid;
    grid-gap: 2rem;
    margin: 3rem 0;


}


@media (max-width: 767px) {
    .contenedor-servicio-fotos {
        grid-template-columns: 1fr;
       
    }
}


@media (min-width: 768px) {
    
    .servicio-fotos-3, .servicio-fotos-6, .servicio-fotos-9, .servicio-fotos-15, .servicio-fotos-18 {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .servicio-fotos-4, .servicio-fotos-8, .servicio-fotos-12, .servicio-fotos-16, .servicio-fotos-20 {
        grid-template-columns: repeat(4, 1fr);
    }
    .servicio-fotos-2 {
        grid-template-columns: repeat(2, 1fr);
    }
    .servicio-fotos-5 {
        grid-template-columns: repeat(3, 1fr);
    }
    .servicio-fotos-7, .servicio-fotos-10, .servicio-fotos-11, .servicio-fotos-13, .servicio-fotos-14, .servicio-fotos-17, .servicio-fotos-19 {
        grid-template-columns: repeat(4, 1fr);
    }
    
}

.servicio-fotos{
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    position: relative;
    min-height: 30rem;

}
.servicio-fotos:before{
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.7); 
  }
  .servicio-fotos .text-wrapper {
    color: #fff;
    text-align: center;
    z-index: 2;
    position: relative;
}
  .servicios-fotos h1,
  .servicios-fotos h2{
    color: #000;
    text-align: center;
    max-width: 100%;
  }
  .servicios-fotos p{
    color: #000;
    text-align: center;
  }
  .servicio-fotos h2,
  .servicio-fotos h3,
  .servicio-fotos h4{
    color: #fff;
    text-align: center;
    z-index: 1;
  }
  .servicio-fotos p{
    color: #fff;
    text-align: center;
    z-index: 1;
  }

/**CARDS FOTO SUPERIOR**/
.servicios-cards{
    background-color: #fff;
    padding: 1% 5% 10%;
}
.contenedor-servicios-cards{
    display: grid;
    grid-gap: 8rem;
    margin: 6rem 0 6rem;
    align-items: start;
}

@media (max-width: 767px) {
    .contenedor-servicios-cards {
        grid-template-columns: 1fr;
    }
}

@media (min-width: 768px) {
    
    .servicio-card-3, .servicio-card-6, .servicio-card-9, .servicio-card-15, .servicio-card-18 {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .servicio-card-4, .servicio-card-8, .servicio-card-12, .servicio-card-16, .servicio-card-20 {
        grid-template-columns: repeat(4, 1fr);
    }
    .servicio-card-2 {
        grid-template-columns: repeat(2, 1fr);
    }
    .servicio-card-5 {
        grid-template-columns: repeat(3, 1fr);
    }
    .servicio-card-7, .servicio-card-10, .servicio-card-11, .servicio-card-13, .servicio-card-14, .servicio-card-17, .servicio-card-19 {
        grid-template-columns: repeat(4, 1fr);
    }
    
}


.servicio-card{
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    height: 100%;
    background: #fff;
    padding-top: 5%;
    border-bottom: 3px solid var(--colorSecundario);

}
.card-foto{
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    position: relative;
    min-height: 32rem;
    width: 100%;
}
.card-contenido{
    background: #fff;
    width: 100%;
    text-align: center;
    padding: 2rem;
}
  .servicios-cards h1,
  .servicios-cards h2{
    font-size:3rem;
    color: #000;
    text-align: center;
    max-width: 100%;
    margin-bottom:45px;
  }
  .servicios-cards p{
    color: #000;
    text-align: center;
  }
  .card-contenido h2,
  .card-contenido h3,
  .card-contenido h4{
    color: var(--colorPrincipal);
    text-align: center;
    font-size: 2.4rem;
    border-bottom: 2px solid var(--colorPrincipal);
    margin: 5%;
    padding-bottom: 5%;
  }
  .card-contenido p{
    color: #000;
    text-align: center;
	font-weight:500;
    font-size:2.2rem;
  }
  
/**SECCION CONTACTO**/
.contacto{
    background-color: #eeeeee;
    padding: 6rem 0;
}
@media (min-width: 768px) {
    .contacto{
        padding: 10rem 0;
    }
}
.contenedor-contacto{
    display: flex;
    flex-direction: column-reverse;
    gap: 2rem;
}
@media (min-width: 768px) {
    .contenedor-contacto{
        display: flex;
        flex-direction: row;
        gap: 2rem;
        justify-content: space-around;
    }
}
.formulario, .mapa{
    width: 100%;
}

.mapa iframe{
    height: 400px;
    width: 100%;
}
@media (min-width: 768px) {
    .mapa iframe{
        height: 550px;
    }
}
/**FOOTER**/
.footer{
    background-color: var(--fondoFooter);
    color: var(--colorTextoFooter);
    padding: 3rem 0 2rem 0;
}
@media (min-width: 768px) {
    .footer{
        padding: 3rem 0 0 0;
    }  
}
.footer a{
    color: var(--colorTextoFooter);
}
.contenedor-footer{
    text-align: center;
    padding-bottom: 2rem;
}
.textos-legales-contenedor{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
@media (min-width: 768px) {
    .contenedor-footer{
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: 1fr;
    }
    .nombre-empresa{
        grid-column: 2/3;
        grid-row: 1/2;
    }
    .direccion{
        grid-column: 1/2;
        grid-row: 2/3;
    }
    .horario{
        grid-column: 2/3;
        grid-row: 2/3;
    }
    .contacto-redes{
        grid-column: 3/4;
        grid-row: 2/3;

    }
    .textos-legales{
        grid-column: 1/4;
        grid-row: 3/4;
    }
    .contenedor-enlaces{
        display: flex;
        flex-wrap: wrap;
        text-align: center;
    }
    .textos-legales-contenedor{
        display: flex;
        flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
    }
}
.nombre-empresa p{
    text-transform: uppercase;
    /* font-weight: bold; */
    text-align: center;
    font-family: var(--fuenteTitulos);
    font-size: 2rem;
}
.redes{
    display: flex;
    justify-content: center;
    gap: 1.5rem;
    }
    .contacto-redes{
        text-align: center;
    }
    .contacto-redes a{
        font-size: 2.5rem;
    }
 
    .textos-legales{
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: .5rem;
        background: var(--barraFooter);
        padding: 2rem 0;
        color: var(--colorTextoBarraFooter);
        }
        .textos-legales a{
            color: var(--colorTextoBarraFooter);
        } 

    .copyright{
        display: flex;
    }
    .copyright span{
        display: none;
    }
    @media (min-width: 480px) {
        .copyright span{
            display: inline;
        }
    }

/*PÁGINAS SECUNDARIAS (AVISO LEGAL, AGRADECIMIENTO...*/
.secundarias .agradecimiento{
    padding: 10rem 0;
}
.secundarias .agradecimiento {
    font-size: 2rem;
    text-align: center;
}
.agradecimiento i{
    font-size: 5rem;
    color: green;
}
.secundarias .legal{
    padding: 10% 5%;
}
.secundarias .legal h1{
    font-family: var(--fuenteParrafos);
    font-size: 2.5rem;
}
.titulo-legal{
    font-size: 2rem;
    font-weight: bold;
}
  
/*FORMULARIO CONTACTO*/

form.contactForm {
	position: relative;
	display: block;
	text-align: left;
	margin: 0 auto;
	background: none;
	border-radius: 5px;
	box-shadow: none;
	padding: 10px;
}
form.contactForm .clear {
	clear: both;
}

form.contactForm legend {
	font-weight: bold;
	padding-top: 15px;
	font-size: 16px;
	min-height: 25px;
	display: none;
}
form.contactForm legend.FormTitle {
	display: none;
}
form.contactForm .formItem {
	position:relative;
	display:block;
	padding: 0px;
	margin-bottom: 5px;
	overflow: hidden;
}
form.contactForm .formItem.fullwidth {
	width: 100%;
	padding: 0px;
	float: none;
	clear: both;
}

form.contactForm br {
	display:none;
}
form.contactForm .singleText br {
	display:inline-block;
}
form.contactForm label {
	display: none;
}
form.contactForm span.two-column {
	display: block;
	float: left;
	width: 260px;
}
form.contactForm span.two-column span {
	display: inline-block;
	width: 10px;
	text-align: center;
}
form.contactForm .text-input, form.contactForm .contactSelect, form.contactForm .datepicker {
	border: none;
	font-family: "Lato", Arial, "Helvetica Neue", Helvetica, sans-serif;
	font-weight: normal;
	font-size: 16px;
	line-height: 30px;
	color: #333;
	padding: 5px 10px;
	outline: none !important;
	background: rgba(255,255,255,.8);
	width: 100%;
	height: auto;
	margin: 0px;
	border-radius: none;
	transition: background .4s, color .4s;
}
form.contactForm .contactSelect {
	height:30px;
	width:auto;
	line-height:30px;
	padding: 5px 10px;
}
form.contactForm .contactSelect option {
	line-height:30px;
}
form.contactForm textarea.text-input {
	height: 100px;
	overflow: auto;
	vertical-align:top;
}
form.contactForm .formItem.fullwidth textarea.text-input {
	width: 100%;
}
form.contactForm .text-input:focus, form.contactForm .datepicker:focus{
	color: #000;
	background: #fff;
}
form.contactForm input[type=radio], form.contactForm input[type=checkbox] {
	display: inline;
	width: auto;
	margin: 2px 5px 0px 0px;
	vertical-align: top;
}
form.contactForm .option {
	display: inline-block;
	padding: 5px 15px 0px 0px;
}
form.contactForm #file-uploader {
	margin: 10px 0 0;
}
form.contactForm #containerNS{
	position: relative;
	overflow: auto;
	padding: 5px 0px;
}
form.contactForm #containerNS #newsletterSubscriptionText{
	display: inline-block;
}
form.contactForm #containerNS #checkboxSubs{
	float: left;
}
form.contactForm small {
	display: block;
	font-size: 9px;
	color: #999;
}
form.contactForm .QapTcha {
	padding: 0;
	margin: 10px 0 0;
	width: auto;
	float: left;
}
form.contactForm .QapTcha #Icons {
	margin-right: 5px;
	margin-left: 5px;
}
form.contactForm .QapTcha .TxtStatus {
	display: block;
	clear: both;
	text-align: left;
	line-height: 25px;
	font-size: 11px;
	margin-bottom: 10px;
}
form.contactForm .required,
form.contactForm .QapTcha .TxtStatus.dropError {
	color: #FFF;
}
form.contactForm .QapTcha .dropError {
	color: #FFF;
}
form.contactForm .QapTcha .clr {
	display: none;
}
form.contactForm #QapTcha {
	display:block;
	margin:0px;
}
form.contactForm #messageCheckRecaptch {
	color: #FFF;
	font-size: 14px;
	font-weight: bold;
	font-family: "Lato", Arial, "Helvetica Neue", Helvetica, sans-serif;
}
form.contactForm .g-recaptcha > div {
	margin: 2px auto 5px;
}
form.contactForm .grecaptcha-badge {
	display: none;
}
form.contactForm .submitButton {
	margin: 0px;
	float: none;
}
form.contactForm input[type=submit], form.contactForm input.submit-button {
	font-family: "Lato", Arial, "Helvetica Neue", Helvetica, sans-serif;
	font-size: 16px;
	line-height: 30px;
	font-weight: normal;
	color: #fff;
	padding: 5px 10px;
	outline: none !important;
	background:#E81304;
	border: none;
	width: 100%;
	height: auto;
	transition: background .4s;
	z-index: 5;
	cursor: pointer;
	border-radius: 3px;
}
form.contactForm input[type=submit]:hover, form.contactForm input.submit-button:hover {
	background: #AB0E03;
}
form.contactForm input.submit-button[disabled],
form.contactForm input.submit-button[disabled]:hover {
	color: rgba(255,255,255,.6);
	cursor: default;
	background-color: #999;
	box-shadow: none;
	z-index: 15;
}
form.contactForm .private_policy {
	clear: both;
	text-align: right;
}
form.contactForm .private_policy_link {
	display: inline-block;
	font-size: 12px;
	color: #000;
}

form.contactForm .id_paragraph_text_1 .infoLabel{
	display:none;
}

#ui-datepicker-div{
	z-index:20 !important;
}
.contactForm .contact-field-item .contact-field-label{
	margin-top: -10px;
padding: 2px 0px;
display: block;
font-size: 15px;
}
.contactForm .form-submit-button {
    background: var(--colorPrincipal)!important;
    padding: 1.5rem;
    border: none;
    margin-bottom: 1rem;
    cursor: pointer;
    transition: background .4s,color .4s;
	width: 100%;
	color: #fff;
	text-transform: uppercase;
	border-radius: .5rem;
    font-weight: 300!important;

}
.contactForm .form-submit-button:hover{
	background:var(--colorSecundario)!important;
    
}
@media only screen and (max-width : 480px) {
	form.contactForm {
		width: auto;
	}
	form.contactForm .formItem {
		width: 100%;
		float: none;
		padding: 0!important;
	}
	form.contactForm .text-input, form.contactForm .contactSelect, form.contactForm .datepicker, form.contactForm .formItem.fullwidth textarea.text-input{
		width: 100%;
	}
	form.contactForm .g-recaptcha,
	form.contactForm .submitButton {
		float: none;
	}
	form.contactForm .submitButton {
		margin: 5px 0;
	}
}
@media only screen and (max-width : 350px) {
	form.contactForm {
		margin-left: -15px;
		margin-right: -15px;
		border-radius: 0;
	}
}
fieldset{
	border: none;
	padding: 1rem;
}
@media (min-width: 768px) {
	fieldset{
		display: grid;
		gap: 1rem;
		grid-template-columns: repeat(2, 1fr);
		grid-template-areas:
		"a a"
		"b c"
		"d e"
		"f f"
		;
	}
}

#contact-field-id_name_1{
	grid-area: a;
}
#contact-field-id_phone_1{
	grid-area: b;
}
#contact-field-id_email_1{
	grid-area: c;
}
#form1-select_1{
	grid-area: d;
}
#form1-single_line_text_1{
	grid-area: e;
}
#contact-field-id_comments_1{
	grid-area: f;
}
fieldset .contact-field-label{
	display: none !important;
}
.cta-banner {
    position: relative;
    background: rgba(255,255,255,.85);
    color: #333;
    border-radius: 10px;
    padding: 10px 5px;
    text-align: center;
    font-size: 22px;
    line-height: 1.2;
    font-weight: 400;
    margin-bottom: 20px;
}
.cta-banner span {
    position: relative;
    float: right;
    color: #333;
    font-size: 50px;
    line-height: 1;
    width: 100px;
}
.cta-banner span::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 98px;
    height: 98px;
    background: url(../images/bg-banner-cta.png) no-repeat center;
}
.cta-banner span i.fa {
    position: relative;
}
.contactForm .contact-field-item .contact-field-element .form-field {
	border: none;
	border-radius: .5rem;
	padding: 10px 10px;
  }
  .contactForm .gdpr_policy label {
	color: #000;
  }
  .contactForm .gdpr_policy label a {
	color: #000;
	text-decoration: underline;
  }
  .contactForm .g-recaptcha {
	display: grid;
	justify-content: start;
	margin-left: 1rem;
  }
  .gdpr_policy{
	margin-left: 1rem;
  }
  .contactForm .contact-field-item .contact-field-element .form-field {
    padding: 10px 10px!important;
}
.contactForm .form-submit-button {
    padding: 15px 10px!important;
}
.diy-slideshow figure figcaption {

font-family: var(--fuenteTitulos);
}
.destacado-marketing{
    color:#ecca61
}
.section-reviews{
    padding: 10% 5%;
    background-color: #f9f9f9;
}
.fila-reviews{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.review {
    flex: 0 0 23%; 
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 1rem;
    padding: 3rem 1.5rem;
    background-color: #ffffff;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    margin: 10px;
}

@media (max-width: 767px) {
    .review {
        flex: 0 0 90%; 
    }
}

.titulo-reviews {
    color: #000000;
    font-size: 2rem;
    font-weight: bold;
    text-align: center;
    margin: 0;

}

.texto-reviews {
    text-align: center;
    margin: 0;

}
.galeria{
    margin: 0.3rem 1rem;

}
.logo-grande{
    display: flex;
    justify-content: center;
}
.boton-pdf{
    display: flex;
    justify-content: center;
}
.boton-pdf a{
    background: #000000;
    padding: 1rem 5rem;
    color: #fff;
    text-transform: uppercase;
    transition: ease all .3s;
}
.boton-pdf a:hover{
    background: #7d272b;
}
.principal.texto-foto-grid-contacto {
    background-color: #fff;
  }
 .principal.texto-foto-grid-contacto {
        display: flex;
        flex-direction: column;
      }
@media (min-width: 768px) {
    .principal.texto-foto-grid-contacto {
        flex-direction: row;
        flex-wrap: nowrap;
      }
}
.mitad-texto-contacto{
    background-color: var(--colorCuarto);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 3rem;
  }
  .contenedor-seccion-contacto.mitad-texto-contacto h1,
  .contenedor-seccion-contacto .mitad-texto h2{
    color: #fff;
    text-align: center;
  }
  .mitad-texto-contacto p{
    color: #ffffff;
	font-size:2rem;
    text-align: center;
  }
  .mitad-texto-contacto a{
    color: #ffffff;
	font-size:2rem;
    cursor: pointer;
  }
  @media (min-width: 768px) {
    .mitad-texto-contacto {
        padding-left: calc((100vw - 120rem) / 4);  
        padding-right: calc((100vw - 120rem) / 4);  
        text-align: left;
      }
      
      .mitad-texto-contacto {
        flex: 1 1 50%;
        box-sizing: border-box;
        min-height: 60rem;
        padding: 0;
      }
}
.contenedor-contact{
    display: flex;
    flex-direction: column;
    padding: 3rem;
    text-align: center;
    font-size: 2rem;
}

.alinear-contacto{
    display: flex;
    justify-content: center;
    gap: 1rem;
}
.alinear-contacto img{
    width: 4rem;
}
.contacto-datos-redes{
    margin-top: 2rem;
}
.destacado{
    font-size: 1.6rem;
    font-family: var(--fuenteTitulos);
  /*  text-transform: uppercase; */
    font-weight: 500;
    letter-spacing: 2px;
}
.galeria-inferior{
    margin-top: 3rem;
}
.icono-logo{
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5%;
}
.fr-fic{
    width: 64px;
    height: 64px;
}

.diy-slideshow{
height:100%;
}
.diy-slideshow.zoom figure.show{
margin:0;
}

.diy-slideshow.fade figure.show {
    margin: 0;
}
.div-border-bottom{
	height:3px;
  	margin:90px 36% 0;
  	background-color: var(--colorSecundario);
}