@import url('https://fonts.googleapis.com/css2?family=Inconsolata:wght@550&display=swap'); 

body{
    overflow:auto;
    background-color:rgb(26, 18, 11);
    font-family: 'Inconsolata', Verdana, Geneva, Tahoma, sans-serif;
}

h1{
    font-size : 2em;
    text-align: center;
    color:rgb(229, 229, 203)
}

/* #O1S_container, #A1R_container{
    text-align: center;
    width:fit-content;
    padding: 2.5%;
    background-color: #efefef;
} */

table{
    cursor: hand;
    width: 85%;
    border-style:none;
    text-align: center;
    background:rgb(60, 42, 33);
    padding: 2.5%;
    margin-left: 7.5%;
}

td{
    width: 12.5%;
    margin: 0px;
    padding: 2%;
    border: 1px solid #D5CEA3;
    box-shadow: 0 0 10px rgba(170, 82, 23, 0.534);
}

tr{
    background-color: rgba(241, 144, 64, 0.52);
    padding: 0;
    color:rgb(0, 0, 0);
}

thead > tr{
    background-color: rgba(38, 16, 238, 0.801);
    color:white;
}


iframe{
    display: block;
    height : 75vh;
    width: 70%;
    align-self:center;
    margin-left:15%;
}



@media (max-width:600px) {
    table {
        width: 95vw;
        margin-left: 1vw;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    tbody {
        display: flex;
        flex-direction: row;
    }

    tr {
        display: flex;
        flex-direction: column;
    }

    td{
        font-size:0.8em;
        height: 10vh;
        width: 15vw;
        box-sizing:border-box;
        vertical-align: middle;
        padding : 15% 0;
        overflow-y:auto;
        overflow-wrap: break-word;
        border-style: ridge;
    }

    thead > tr > td{
        width: 27vw;
    }

    .breadcrumb{
        width: 100%;
        height: 100%;
    }
    
    iframe{
        width:100%;
        margin:0;
    }
}