@media all and (orientation:portrait){ 
.tabelrij{
    display: flex;
    flex-direction: column;
    color:#175B99;
    background-color:white;
        border-bottom:#175B99;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    font-size: 18px;
    padding: 3px;

}
.tabelrij:hover{
        color: white;
        background-color:#F49712;
        border-bottom:white;
    cursor: pointer;
}    
.tabelheader{
    display: flex;
    flex-direction: column;
    border-bottom:#175B99;
    border-bottom-style: solid;
    border-bottom-width: 2px;
    padding: 3px;
    font-size: 12px;

}
.tabeltitel{
    display: flex;
    flex-direction: column;
    color:#175B99;
    width: 300px;
    text-align: left;
    font-size: 14px;
    background-color: #F49712;

}
.tabelkolom{
    display: flex;
    flex-direction: column;
    width: 300px;
    text-align: left;


}
.tabelkolomgroot{
    display: flex;
    flex-direction: column;
    text-align: left;


}
.tabelkolomklein{
    display: flex;
    flex-direction: column;
    width: 20%;
    text-align: left;
    text-decoration: none;


}
}
@media all and (orientation:landscape){ 
    .tabelrij{
        display: flex;
        flex-direction: row;
        color:#175B99;
        background-color:white;
        border-bottom:#175B99;
        border-bottom-style: solid;
        border-bottom-width: 1px;
        font-size: 18px;
        padding: 10px;
    
    }
    .tabelrij:hover{
        color: white;
        background-color:#F49712;
        border-bottom:white;
    cursor: pointer;
    }    
    .tabelheader{
        display: flex;
        flex-direction: row;
        border-bottom:#175B99;
        border-bottom-style: solid;
        border-bottom-width: 2px;
        padding: 10px;
    
    }
    .tabeltitel{
        display: flex;
        flex-direction: column;
        color:#175B99;
        width: 300px;
        text-align: left;
        font-size: 22px;
        background-color: #F49712;
    
    }
    .tabelkolom{
        display: flex;
        flex-direction: column;
       
        text-align: left;
        text-decoration: none;
    
    
    }
    .tabelkolomgroot{
        display: flex;
        flex-direction: column;
        width: 80%;
        text-align: left;
        text-decoration: none;
    
    
    }
    .tabelkolomklein{
        display: flex;
        flex-direction: column;
        width: 20%;
        text-align: left;
        text-decoration: none;
    
    
    }


    }