* {
    margin: 0;
    padding: 0;
    font-family: Arial, Helvetica, sans-serif;
}

#logo {
    width: 8rem;
    margin: 2rem 0 0 0;
}

#whatsapp{
    width: 2rem;
}

main {
    width: 100vw;
    height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow-x: hidden;
}

h1 {
    margin: 2rem 0;
    color: rgb(20, 20, 111);
}

table {
    border-collapse: collapse;
    width: 40vw;
    overflow: hidden;
}

thead {
    text-align: left;
}

thead tr {
    background-color: rgb(20, 20, 111);
    color: white;
}

th,
td {
    padding: .5rem 1rem;
    border-bottom: 1px solid rgb(68, 68, 221);
}

.flex{
    display: flex;
    align-items: center;
    gap: 1rem;
    margin: 1rem 0;
}

p{
    padding-bottom: 3rem;
    text-align: center;
}

a{
    color:rgb(20, 20, 111);
    font-weight: bold;
}

@media screen and (max-width: 767px) {
    th {
        padding: .5rem .5rem;
        font-size: 1rem;
    }

    td {
        font-size: .8rem;
        padding: .5rem;
        border-bottom: 1px solid rgb(68, 68, 221);
    }

    tr td:first-child, tr th:first-child {
        padding-left: 1rem;
        max-width: 40vw;
    }

    tr td:last-child, tr th:last-child {
        padding-right: 1rem;
    }

    table{
        width: 100vw;
    }

    h1{
        font-size: 1.5rem;
    }

    p{
        padding: 1rem 0 2rem 0 ;
    }

    .flex{
        margin-top: 2rem;
    }

    p{
        font-size: .8rem;
    }

}