.time-table {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.time-table p{
    background-color: #e7e8ec;
    border-radius: 5px;
    padding: 5px;
    font-size: 14px;
}
.btn-contact {
    margin-top: 20px;
}

.contact-form {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.form-input {
    border-radius: 5px;
    border: transparent 1px;
    padding: 10px;


}
 .invalid {
    border: solid red 1px;
    color: darkred;
}
.form-msg {
    font-size: 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    justify-content: center;
    right: 0;
    position: absolute;
    transition: .2s


}
.form-msg.show {
}

.alert{
    padding: 10px;
    color: white;
    border-radius: 5px;

    animation: fadein .1s;
    z-index: 1;
}

.alert.fadeout{
    /*opacity: 0!important;*/
    /*scale: 0!important;*/

    transform: scale(0);
    transition: .2s;

}

@keyframes fadein {
    from { opacity: 0; scale: .4}
    to { opacity: 1; scale: 1}
}
.spinner {
    position: absolute;
    right: 0;
    width: 100%;
    display: flex;
    justify-content: right;
    color: rgba(39, 140, 39, 0.96);
}
.danger {
    background-color: red;
}
.alert.danger:before {
    font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\21";
    padding-right: 10px;

}

.alert.succes:before {
    font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f00c";
    padding-right: 10px;
}
.succes {
    background-color: green;
}

.btn:disabled {
    background: lightgray!important;
    cursor: default;
}
@media only screen and (min-width: 500px) {

    .time-table {
        display: flex;
        flex-direction: row;
        justify-content: left;
        gap: 5px;
    }
}