footer {

    bottom: 0;

    height: 50px;

    margin-top: 2.5%;

    position: absolute;

    width: 100%;

}


.about {

    background-color: #3967B4;

    height: 100%;

    position: relative;

    width: 125px;

    z-index: 5;

}


.about-text {

    color: #F3F3F3;

    margin-left: 10px;

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

}


.about-toggle {

    cursor: pointer;

    position: absolute;

    bottom: 0;

    height: 50px;

    opacity: 0;

    width: 125px;

    z-index: 6;

}


.about-toggle:checked ~ .about-details {

    background-color: #3967B4;

    transform: translateY(-100%);

}


.about-details {

    background-color: #3967B4;

    height: 500px;

    position: absolute;

    transition: transform .5s;

    width: 100%;

    z-index: 4;

}


.tagline {

    margin-top: 1rem;

    text-align: center;

}


.about-message {

    margin-top: 1rem;

    text-align: center;

}