/* FUENTES */
@font-face {
    font-family: 'DR_TITLE';
    src: url('../assets/fuentes/titulo/deltarune.ttf');
}

@font-face {
    font-family: 'DR_TEXT';
    src: url('../assets/fuentes/letras/determination/determination.ttf');
}

body {

    background-color: black;

    font-family: 'DR_TEXT';
    color: white;

    image-rendering: pixelated;
    cursor: url('../assets/imgs/curse_hacker.png'), auto !important;

}

.navbar {
    background-color: rgb(0, 79, 223);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'DR_TITLE';
}

h1 {
    margin-bottom: 0;
}

h2 {
    font-size: 3rem;
}

p {
    font-size: 3vh;
}

.seccion_intro {
    background-image: url('../assets/imgs/gifs/fuenteoscurica-recorte.gif');
    background-size: contain;
    background-position: bottom center;
    background-repeat: no-repeat;
    margin-top: 56px;
    padding: 15vh 0;
    text-align: center;
}


.seccion_intro h2 {
    font-size: 4.3rem;
    text-shadow: -2px 0 #203288, 0 4px #203288, 4px 0 #203288, 0 -2px #203288;
    margin-left: auto;
    margin-right: auto;

    width: 69%;
}

.seccion_intro h3 {
    font-family: 'DR_TEXT';
    font-size: 3rem;
    text-shadow: -2px 0 #203288, 0 4px #203288, 4px 0 #203288, 0 -2px #203288;
    margin-bottom: 3rem;
}


.seccion_intro p {
    background-color: black;
    outline: white solid 6px;
    padding: 1rem;
    text-align: left;
    margin: 0 auto;
    width: 60%;
}

.seccion_transicion {
    background-image: url('../assets/imgs/gifs/fuenteoscurica-piso.gif');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: top;
    height: 60px;
    background-color: #004FDF;
}

.seccion_descargas {
    background: #004FDF;
    /* background: linear-gradient(180deg, rgba(0, 79, 223, 1) 0%, rgba(0, 110, 84, 1) 100%); */
    background: linear-gradient(180deg, rgba(0, 79, 223, 1) 0%, rgb(0, 0, 0) 100%);
    text-align: center;
    padding: 4rem 0;

}

.seccion_descargas h2 {
    margin-bottom: 2rem;
}


.seccion_galeria {
    background: black;
    text-align: center;
    padding: 3rem 0;

}

div .boton {
    padding: 1rem;
    text-decoration: none;
    background: linear-gradient(180deg, rgb(16, 139, 255) 0%, rgb(19, 35, 255) 100%);
    outline: white solid 6px;
    color: yellow;
    font-size: 1.3rem;
    border: none;
    margin: 2rem;
}

div .boton:hover {
    background: linear-gradient(180deg, rgb(37, 193, 255) 0%, rgb(16, 139, 255) 100%);
    outline: yellow solid 6px;
}

div .boton:focus {
    outline: yellow solid 6px;
}

div .btnSeleccion {
    background: black !important;
    color: white;
}

#btnDescarga {
    color: yellow;
}

button,
a {
    cursor: url('../assets/imgs/curse_hacker.png'), auto !important;
}

.caja_de_texto {
    margin: 0 auto;
    text-align: left;
    width: 60%;
    padding: 1rem;
    background-color: black;
    outline: white solid 6px;
}

@keyframes slide {
    0% {
        background-position: 0px 0px;
    }

    100% {
        background-position: 550px 550px;
    }

    /* 95.5 */
}

#battle_bg {
    background-image: url('../assets/imgs/fondos/battle_bg.jpg');
    background-attachment: fixed;
    background-size: 550px;
    animation: 30s linear infinite;
    animation-name: slide;
}

.seccion_galeria {
    border-top: solid white 6px;
}

.seccion_galeria h2 {
    margin: 1rem;
}

.seccion_galeria .info {
    width: 100%;
}

.carrusel {
    display: flex;
    justify-content: center;
    margin: 2rem;
}

#carouselCapturas,
#carouselTutorial {
    outline: solid 6px white;
}

.discraimer {
    margin: 0 auto;
    width: 60%;
    color: yellow;
    font-size: 2vh;
    text-align: left;
}

#sec_equipo {
    padding-top: 56px;
    padding-bottom: 2rem;
    background-image: url('../assets/imgs/fondos/IMAGE_DEPTHS.jpg');
    background-attachment: fixed;
    background-size: 800px;
    animation: 20s linear infinite;
    animation-name: slideWaters;
}

@keyframes slideWaters {
    0% {
        background-position: 0px 0px;
    }

    100% {
        background-position: 800px 600px;
    }
}

#sec_equipo h2,
h3 {
    text-align: center;
}

#sec_equipo h2 {
    margin-top: 7rem;
}

#sec_equipo h3 {
    font-size: 2rem;
    margin-top: 5rem;
}

.card_pres {
    background-color: black;
    outline: white 6px solid;
    padding: 2rem;
    margin: 2rem;
    width: 60%;
}

.card_pres img {
    margin-bottom: 1rem;
    width: 5rem;
}

#cartas {
    margin-top: 1rem;
    justify-items: center;
}



@keyframes fadeInUp {
    0% {
        /* transform: translateY(100%); */
        opacity: 0;
    }

    100% {
        /* transform: translateY(0%); */
        opacity: 1;
    }
}

.fadeInUp-animation {
    animation: 1.5s fadeInUp;
}

@media (min-width: 820px) {
    .seccion_transicion {
        background-size: 800px;
    }
}