.home {
    background-image: url(../img/fondo.png);
    background-size: cover;


}



/*main*/
main {
    padding-bottom: 50px;

}

.mainHome {
    display: grid;
    grid-template-columns: 1fr 3fr;
    grid-template-rows: 1fr;
    grid-column-gap: 0px;
    grid-row-gap: 0px;
}

/*recordatorios*/
.recordatorios {
    grid-area: 1 / 1 / 2 / 2;
    
}

.intRecordatorio{
    background-color: #ffffff7a;
    box-shadow: 5px 5px 10px 1px #a19b9b;
    border-radius: 10px;
}

.contHome {
    grid-area: 1 / 2 / 2 / 3;
}

/*cont*/

.barraTitulos {
    background-color: #2F6F4F;
    border-radius: 0px 15px 0px 15px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.btnVerTodas {
    color: #fff;
    text-decoration: none;
}

.tablaPlanificaciones{
    width: 100%;
}

.tRowHead{
    padding: 10px 20px 5px 20px;
}

.headAsignatura {
    background-color: #0A65FC;
    padding: 10px;
    border-radius: 10px 10px 0px 0px;
    color: #fff;
    text-align: center;
}

.tRowData{
    padding: 5px 0px;
    position: relative;
}

.tRowData:not(:last-child):not(:nth-last-child(2))::after {
    content: "";
    position: absolute;
    width: 1px;
    height: 20px;
    background-color: #333333;
    z-index: 10;
    right: 0;
    top: calc(50% - 10px);
}

.tRowData:first-child::before{
    content: "";
    position: absolute;
    width: 5px;
    height: 44px;
    border-radius: 0px 5px 5px 0px;
    
    z-index: 10;
    left: 0;
    top: calc(50% - 22px);
}



.rowData {
    padding: 10px;
    background-color: #E6E6E6;
    text-wrap: nowrap;
}

.rowDataIco {
    padding: 10px;
    background-color: #fff;
}

.btnEditar{
    width: 20px;
}



/*modulp implementaciones*/

.mensajeNada{
    align-self: center;
}

.planiImple{
    display: flex;
    flex-direction: column;
    border-radius: 30px 0px 0px 30px;

}

.cardImplementacion{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: #E6E6E6;
    border-radius: 0px 10px 10px 0px;
    height: 100%;
    padding: 10px;

}

.btnVerImp{
    text-decoration: none;
    background-color: #319966;
    color: #fff;
    padding: 5px 10px;
    border-radius: 5px;
    &:hover{
        background-color: #2d5c44
    }
}

/*modulp alumnos pai*/

.cardAlumnosP::after {
    content: "";
    width: 100%;
    height: 15px;
    background-color: #FFBB54;
    position: absolute;
    top: 0px;
    left: 0px;
    border-radius: 0px 0px 3px 3px;
}

.cardAlumnosP{
    position: relative;
    border-radius: 5px;
    text-decoration: none;
    color: #333333;
    background-color: #F3F3F3;
    box-shadow: 5px 5px 10px 1px #0000004b;
    padding: 30px 10px 10px 10px;
    height: 100%;
    display: flex;
    flex-flow: column;
    align-items: flex-start;
    justify-content: space-between;
    gap: 4px;
    
}

.verMasAlumno{
    color: #fff;
    padding: 3px 7px;
    background-color: #198754;
    text-decoration: none;
    border-radius: 5px;
    transition: all .3s;
      
    &:hover{
        background-color: #157347;
    }
}

.textoPai{
    color: #9747FF;
}




@media (max-width: 1200px) {}

@media (max-width: 991px) {
    .mainHome {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: auto;
        grid-column-gap: 0px;
        grid-row-gap: 0px;
    }

    .recordatorios{
        grid-area: 1 / 1 / 2 / 2;
    }

    .contHome{
        grid-area: 2 / 1 / 3 / 2;
    }



}

@media (max-width: 767px) {}

@media (max-width: 576px) {}

@media (max-width: 357px) {}






/*media al revez*/

@media (min-width: 357px) {
    footer {
        background-color: #fff;
        position: absolute;
        width: 100%;
        bottom: 0px;
    }
}


/*------coolores--------*/

.rojo::before, .backrojo{
    background-color: #D03A3A;
}

.azul::before, .backazul{
    background-color: #405B9A;
}

.salmon::before, .backsalmon{
    background-color: #EF854A;
}

.cafe::before, .backcafe{
    background-color: #631E00;
}

.rosado::before, .backrosado{
    background-color: #D372CA;
}

.amarillo::before, .backamarillo{
    background-color: #EACD36;
}

.violeta::before, .backvioleta{
    background-color: #7F2297;
}

.verde::before, .backverde{
    background-color: #35E146;
}

.burdeo::before, .backburdeo{
    background-color: #31001D;
}

.oliva::before, .backoliva{
    background-color: #869B4C;
}

.gris::before, .backgris{
    background-color: #858585;
}

.celeste::before, .backceleste{
    background-color: #7CA9FF;
}

.musgo::before, .backmusgo{
    background-color: #3E5905;
}

.naranjo::before, .backnaranjo{
    background-color: #942006;
}

.morado::before, .backmorado{
    background-color: #1A0052;
}