:root {
    --oscuro: #0B5B67;

    
    /* --verde1: #BEE6CE;
    --verde2: #BCFFDB;
    --verde3: #8DFFCD;
    --verde4: #68D89B;
    --verde5: #4F9D69; */


    --verde1: #075061;
    --verde2: #042434;    
    --verde3: #BFDDDE;
    --verde4: #228693;
    --verde5: #83C8D1;
}
body{
    background-image: url(lineas.jpg);
    background-position: center;
    background-attachment: fixed;
}
.headerFin{
    border: 3px solid #0B5B67;
}
.BFormulario{
    padding: 1rem 2rem;
    margin: 1rem 0;

    background-color: var(--verde3);
    border-radius: 0.5rem;
}
.formulario{
    display: flex;
    justify-content: space-evenly;

    align-items: center;
}
textarea{
    margin: 0px; 
    width: 276px;
    height: 16px;
}
.materia{
    border-radius: 0.5rem;
    
    
}
.primero{
    color: white;
    background-color: var(--verde1);
    border: 2px solid var(--verde1)
}
.segundo{
    color: white;
    background-color: var(--verde2);
    border: 2px solid var(--verde2);
}
.tercero{
    
    background-color: var(--verde3);
    border: 2px solid var(--verde3);
}
.cuarto{
    color: white;
    background-color: var(--verde4);
    border: 2px solid var(--verde4);
}
.quinto{
    color: white;
    background-color: var(--verde5);
    border: 2px solid var(--verde5);
}
.materia, .contenedorLista{
    margin: 1rem 2rem;
    
}
.contenedorLista{
    display: grid;
    grid-template-columns: 1fr 3fr;
    
    
}
.left{
    border-left: 2px solid white;
}
.abajo{
    border-bottom: 2px solid white;
    padding: 0.5rem;
}
input, textarea, select{
    padding: 0.5rem 1rem;
    border-radius: 0.5rem;
    border: none;
}
.tarea{
    word-break: break-word;
}
.titulo{
    font-size: 20px;
}
.titulo, .fecha{
    font-weight: 700;
}
.borrar{
    font-weight: 700;
    /* background-color: rgb(247, 108, 108); */
    border: 2px solid red;
    cursor: pointer;
}
.borrar:hover{
    /* background-color: #73f141; */
    border: 2px solid #48dd0d;
    font-weight: 700;
    

}
.foter{
    font-weight: 700;
    text-align: end;
}
@media (max-width: 680px){
    
    .formulario{
        display: grid;
    }
    .pregunta{
        margin: 1rem 1rem;
    }
    .contenedorLista{
        display: inherit;
    }
}