body{
    margin:0;
    font-family: Verdana;
}

header{
    background: #1d4a96;
    color: white;
    border: 1px solid  #1d4a96;
}
table{
    border-collapse: collapse;
}
td, th{
    padding: 5px 10px;
    border: 1px solid grey;
}
main{
    padding: 1em 2em;
}

@media ( max-width: 30em ){
    table{
        width: 100%;
        font-size: .9em;
    }
    table tr{
        display: flex;
        flex-direction: column;
        border: 1px solid grey;
        padding: 1em;
        margin-bottom: 1em;
    }

    table td, th{
        border:none; 
    }

    table td[data-titulo]::before{
        content: attr( data-titulo );
        width: 90px;
        color: rgb(59, 59, 59);
        font-weight: bold;
    }

    table td[data-titulo]{
        display: flex;
    }

    table thead{
        display: none;
    }
}