* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

.removeStyle {
    margin: 0;
    padding: 0;
}

.logo_quadra_livre {
    padding: 10px;
    max-width: 250px;
}

.button {
    position: relative;
    display: inline-block;
    color: black;
    text-decoration: none;
    padding: 10px 20px;
    border-radius: 8px;
    width: 95%;
    font-size: 1.2em;
    border: solid 2px rgba(255, 255, 255, 0.365);
    color: white;
    overflow: hidden;
}
.button::after {
    display: flex;
    justify-content: center;
    align-items: center;
    content: 'Agendar Agora';
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    opacity: 0;
    background-color: rgb(86, 86, 86);
    color: white;
    width: 0%;
    height: 100%;
}
.button:hover::after {
    opacity: 1;
    transition: .4s;
    width: 100%;
}


.body-header {
    padding: 30px 20px;
    background-color: rgb(30, 30, 30);
    color: white;
    border: solid 1px black;
}



.horario {
    margin: 20px;

    & .card-header {
        background-color: rgb(45, 45, 45);
        display: flex;
        font-size: 1.1em;
        font-weight: bold   ;
        align-items: center;
        justify-content: space-between;
        gap: 6px;
        color: rgb(172, 172, 172);

        & .spanCite {
            display: inline-block;
            background-color: rgb(172, 172, 172);
            width: 20px;
            height: 2px;
            margin-right: 5px;
        }
    }

    
    
    & .card-body {
        background-color: rgb(239, 237, 237);
        border: solid 1px black;

        & .blockquote {
            display: flex;
            justify-content: space-around;

        }
    }

    .footer {
        border: solid 1px rgba(0, 0, 0, 0.475);
    }
}








.form {
    padding: 25px;

    & input {
        background-color: rgb(230, 227, 227);
    }
    & select {
        background-color: rgb(230, 227, 227);
    }
}