.card-section
{
    color: white;
    background-color: hsla(0, 0%, 0%, 0.7);
}

.card-general
{
    color: rgb(0, 0, 0);
    background-color: hsla(0, 0%, 100%, 0.7);
}

.collapse-link {
    color: rgb(0, 0, 0);
    text-decoration: none;
}

.header-dark
{
    color: white;
    background-color: hsla(0, 0%, 7%, 0.8);
}

.page-background 
{
    background-color: hsla(0, 0%, 100%, 0.6); 
    margin-bottom: 0px;
}

.form-dark
{
    color: white;
    background-color: hsla(0, 0%, 0%, 0.5);
}

.card, .btn, .form-control
{ 
    border-radius: 0; 
    --bs-card-border-radius: 0;
    --bs-border-radius: 0;
}

.justify
{
    text-align: justify;
    text-justify: auto;
}

.btn-pupil
{
    color: white;
    background-color: hsla(0, 0%, 0%, 0.7);
    --bs-btn-hover-border-color: hsla(0, 0%, 0%, 0.2);
    --bs-btn-hover-bg: hsla(0, 0%, 100%, 0.9);
    --bs-btn-hover-color: black;
    --bs-btn-font-size: 1.5rem;

    transition: color .15s ease-in-out,
        background-color .15s ease-in-out,
        border-color .15s ease-in-out,
        box-shadow .15s ease-in-out;
}

.btn-teacher
{
    color: white;
    background-color: hsla(0, 0%, 0%, 0.7);
    --bs-btn-hover-border-color: hsla(0, 0%, 0%, 0.2);
    --bs-btn-hover-bg: hsla(0, 0%, 100%, 0.9);
    --bs-btn-hover-color: black;
    --bs-btn-font-size: 1.5rem;

    transition: color .15s ease-in-out,
        background-color .15s ease-in-out,
        border-color .15s ease-in-out,
        box-shadow .15s ease-in-out;
}

.btn-form-submit
{
    color: black;
    background-color: hsla(0, 100%, 100%, 0.7);
    --bs-btn-hover-border-color: hsla(0, 100%, 100%, 0.2);
    --bs-btn-hover-bg: hsla(0, 0%, 0%, 0.8);
    --bs-btn-hover-color: white;
    --bs-btn-font-size: 1.5rem;

    transition: color .15s ease-in-out,
        background-color .15s ease-in-out,
        border-color .15s ease-in-out,
        box-shadow .15s ease-in-out;
}