/* RECURSODE DE https://www.manypixels.co/ */
/* obtencion de gradientes https://webgradients.com/ */

*{
    list-style: none; /* para eliminar el estilo de la lista ul*/
    box-sizing: border-box;
    margin: 0;
    /*padding: 0;*/
    box-sizing: border-box;

}

.element2.element ul.listanormal {
    /* Estilos para la lista dentro de .element2.element */
    list-style-type: square; /* Cambia el estilo del marcador a puntos */
    padding-left: 20px; /* Agrega un espacio a la izquierda para los elementos de la lista */
  }
  
  .element2.element ul.listanormal li {
    /* Estilos para los elementos de la lista dentro de .element2.element */
    margin-bottom: 5px; /* Agrega un espacio entre cada ítem de la lista */
  }

.neon{
    min-height: 100vh;
    justify-content: center;
    color: navy;
    letter-spacing: 1rem;
    font-size: 2.5em;
    font-family: 'rajdani';
    text-shadow: 0px 0px 20px cyan, 0px 0px 40px cyan, 0px 0px 60px cyan;

}
.titulo{
    font-size: 40px;
    margin-bottom: 15px;
    color: #fff;
    
}
.linea-horizontal {

    border-bottom: 3px solid #ccc; /* Estilo de la línea horizontal */
    width: 100%; /* Ancho del 100% para adaptarse al contenedor */
    position: relative; /* Para colocar la línea al final del contenedor */
    bottom: -10px; /* Para que la línea esté en la parte inferior del contenedor */
}

p.normal, 
a.normal {
    font-size: 1em; 
    line-height: normal; 
    color:navy;
    text-align: left; /* Centrar texto */
}
p.mediano, 
a.mediano {
    font-size: 1.2em; 
    line-height: normal; 
    color:navy;
    text-align: center; /* Centrar texto */
}

/* Estilos para clase 'grande' */
a.grande,
p.grande {
    font-size: 1.4; /* Tamaño de fuente más grande */
    line-height: normal; 
    color:navy;
    text-align: left; /* Centrar texto */
}

/* Estilos para clase 'masgrande con color de fondo' */

a.masgrandebg,
p.masgrandebg{
    font-size: 1.8; /* Tamaño de fuente aún más grande */
    line-height: normal; 
    color:white;
    background-color: red;
    text-align: center; /* Centrar texto */
    /* Otros estilos si es necesario */
}

/* Estilos para clase 'masgrande' */
a.masgrande,
p.masgrande{
    font-size: 1.8; /* Tamaño de fuente aún más grande */
    line-height: normal; 
    color:navy;
    text-align: left; /* Centrar texto */
    /* Otros estilos si es necesario */
}



.copy{
    font-weight: 300;
    font-size: 25px;
    text-align: justify;
    color: #fff; /* Color de texto */
}

.imagen-inferior-derecha {
    position: absolute;
    bottom: 0;
    right: 0;
 

    /* Ajusta el tamaño de la imagen según sea necesario */
    width: 100%;
    height: 100%;
  }

  /* Media query para dispositivos móviles o pantallas pequeñas */
  
  
@media screen and (max-width: 767px) {
  

    .imagen-inferior-derecha {
        width: 28%;
        height: 28%;
    }
    a {
        font-size: .8em; /* Reducir tamaño de fuente para enlaces en móviles */
    }

    p {
        font-size: .8em; /* Reducir tamaño de fuente para párrafos en móviles */
    }
    .titulo{
        font-size: 1.3em;
    }
    .copy{
        font-size: 1em;
    }
    
    .neon{
        font-size: 1em;
    }
    .menu .item a {
    font-size: 1.5em;
  }
  .modal__container-inicio {
        padding: 2rem 1.5rem; /* Ajusta el padding en pantallas más pequeñas */
    }
    
     
.element1 img {
    
   max-width: 100%;
    width: 90%; /* Ajusta el ancho de la imagen según tu diseño */
}
  p.mediano, 
    a.mediano {
    font-size: 0.9em; 
    line-height: normal; 
    color:navy;
    text-align: Left; /* Centrar texto */
}
a.masgrandebg,
p.masgrandebg{
    font-size: 1.4em; /* Tamaño de fuente aún más grande */
    line-height: normal; 
    color:white;
    background-color: red;
    text-align: center; /* Centrar texto */
    /* Otros estilos si es necesario */
}

}





/* Para Tablet*/





@media screen and (min-width: 768px) and (max-width: 1023px) { 
  

    .imagen-inferior-derecha {
        width: 20%;
        height: 30%;
    }
    
   
    
    
    .neon {
        font-size: 1.6em; /* Reducir tamaño de fuente para móviles */
    }

    a {
        font-size: 0.8 em; /* Reducir tamaño de fuente para enlaces en móviles */
    }

    p {
        font-size: 0.8 em; /* Reducir tamaño de fuente para párrafos en móviles */
    }
    
    .titulo{
        font-size: 1.2em;
    }
    .copy{
        font-size: 1.2em;
    }
     .menu .item a {
    font-size: 1em;
  }
  
  .modal__container-inicio {
        padding: 2rem 1.5rem; /* Ajusta el padding en pantallas más pequeñas */
    }
    
    
      p.mediano, 
    a.mediano {
    font-size: 1.0em; 
    line-height: normal; 
    color:navy;
    text-align: Left; /* Centrar texto */
}
a.masgrandebg,
p.masgrandebg{
    font-size: 1.3em; /* Tamaño de fuente aún más grande */
    line-height: normal; 
    color:white;
    background-color: red;
    text-align: center; /* Centrar texto */
    /* Otros estilos si es necesario */
}
}

@media screen and (min-width: 1024px) {
    .imagen-inferior-derecha {
        max-width: 100%; /* Establece un ancho máximo para pantallas HD */
        width: 20%;
        height: 30%;

        /* Puedes ajustar el valor de max-width según lo que necesites */
    }
    
    
/* Estilos para clase 'grande' */

a.grande,
p.grande {
    font-size: 1.2em; /* Tamaño de fuente más grande */
    line-height: normal; 
    color:navy;
    text-align: left; /* Centrar texto */
}

/* Estilos para clase 'masgrande' */
a.masgrande,
p.masgrande{
    font-size: 1.6em; /* Tamaño de fuente aún más grande */
    line-height: normal; 
    color:navy;
    text-align: left; /* Centrar texto */
    /* Otros estilos si es necesario */
}

/* Estilos para clase 'masgrande' */
a.masgrandebg,
p.masgrandebg{
    font-size: 1.6em; /* Tamaño de fuente aún más grande */
    line-height: normal; 
    color:white;
    background-color: red;
    text-align: center; /* Centrar texto */
    /* Otros estilos si es necesario */
}


}




.contenedor-titulos.h1{
    margin-top: -100px; /* Ajusta este valor según sea necesario */
    font-size: 30px;
    color: #00008B;
    text-align: center;
    /*margin-top: 300px; /* Ajustar el valor para mover el título hacia abajo */
    margin-bottom: 15px;
}

h2.titulo {
    font-size: 30px;
    color: #00008B;
    text-align: center;
    margin-top: 100px; /* Ajustar el valor para mover el título hacia abajo */
    margin-bottom: 15px;
  }


.contenedor-titulos{
    margin-top: -60px;
    padding: 1px 0;
    /*
    background: #F09819;  /* fallback for old browsers */
    /*background: -webkit-linear-gradient(to right, #EDDE5D, #F09819);  /* Chrome 10-25, Safari 5.1-6 */
    /*background: linear-gradient(to right, #EDDE5D, #F09819); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    
    position: relative;

}

.contenedor{
    padding: 60px 0;
    width: 90%;
    max-width: 1200px;
    margin: auto;
   overflow: hidden;
}
.contenedor-subtitulo{
    padding: 80px 0;
    height: 55%;
    width: 90%;
    max-width: 1200px;
    margin: auto;
   overflow: hidden;
}


.espacio{
    height: 100px; /* Altura específica */
    background-color: #f3d3ea; /* Color de fondo (solo como ejemplo) */
}

.presentacion{
    width: 100%;
    height: 500px;
    background: #eb11a9;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #4286f4, #373B44);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #18284888, #2b498fb7), url(../images/York-hd.png) ; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

    background-size: cover;
    /*background-attachment: fixed;*/
    position: relative;
    
}



#imShowBox .grabbable { cursor: grab; cursor: -webkit-grab; }
#imShowBox .grabbing { cursor: grabbing; cursor: -webkit-grabbing; }
#imShowBoxWrapper > div { transition: opacity 1s; }#imShowBoxWrapper.imHideShowBoxControls > div { opacity: 0; }
#imShowBoxWrapper.imHideShowBoxControls > div#imShowBox { opacity: 1; }