/* MENU */
body{
    width: 100vw;
}
.c-title::before {
    content: "_";
    color: var(--consola);
}

#title, #proyectos, #curaduria{
    color: var(--fondo);
    -webkit-text-stroke: 1.5px black;
}

.p-title:hover{
    -webkit-text-stroke: 0px white;
}

.cu-title:hover{
    -webkit-text-stroke: 0px white;
}

.zoom {
    font-size: 0.8em;
    display: block;
    color:blue;
    margin-bottom: 1em;
}

#consola{
    color:var(--consola);
}

#logo path{
    fill: var(--negro);
}

/* CONTENT */

#content-consola{
    left: 0;
    top:55%;
    position: fixed;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    font-family: var(--typo);
    color: var(--texto);
    width: 100%;
    text-shadow: solid rgb(255, 0, 0) 0 0 0 1px;
}

#content-consola h2{
    font-size: 0.8rem;
}

#records{
    position: relative;
    width: 20%;
}

#videos{
    position: relative;
    width: 30%;
}

#detalles{
    position: relative;
    width: 30%;
}

#detalles p{
    margin: 0;
    margin-bottom: 0.5em;
}

#detalles strong{
    text-decoration: underline 1pt black;
}

.text{
    font-size: 0.8rem;
    line-height: 1rem;
    text-indent: 1rem;
}

@media (max-width: 700px){

    body{
        margin: 0;
        height: 100vh;
        width: 100vw;
        overflow-y: scroll;
    }

    details p{
        height: fit-content;
        width: 100%;
        margin-left: -3.5em;
    }

    .c-title::before {
        content: none;
    }

    #p-step9{
        display: block;
    }

    #title{
        display:none;
    }

    #proyectos{
        margin-left: 2%;
    }

    #logo{
        display: none;
    }

    #logo-mobile{
        display: block;
    }

    #cu-step9{
        display: block;
    }

    #proyectos, #curaduria{
        -webkit-text-stroke: 1.5px rgb(164, 164, 164);
    }

    #consola{
        margin-right: 2.5%;
    }

    #content-consola{
        display: flex;
        position: relative;
        width: fit-content;
        height: fit-content;
        flex-direction: column;
        top: 10%;
        left: 1.4em;
        overflow-y: scroll;
        padding-bottom: 20%;
    }

    #records{
        position: relative;
        width: 80vw;
    }

    #detalles{
        position: relative;
        width: 80vw;
    }



    #videos{
        position:relative;
        width: 80%;
    }

}