@media screen and (min-width: 296px) and (max-width: 1023px) {
body {
    font-size: clamp(0.68rem, 0.489rem + 1.033vw, 1.15rem);
    margin-left: 1rem;
    margin-right: 2rem;
    background-image: url('assets/dashboard-background.png');
    background-size: 100% 100%;
    font-family: Helvetica, Arial, sans-serif;
}
h1 {font-size: 1.8em;} h2 {font-size: 1.55em;} h3 {font-size: 1.35em;}
h4, h5, h6 {font-size: 1.2em;}
a.odoo {
    color: orange;
    text-decoration: underline;
}
article a.odoo {
    color: darkblue;
    text-decoration: underline;
}
.tabContent {
    position: relative;
    width: auto;
    display: none;
    overflow: hidden;
    padding: 0.375rem 0.75rem;
    border: 2px solid #fff8bd;
    border-top: 8px solid #fff8bd;
    
    background-color: #00000040;
    color: #fffbdc;
}
.defaultTab {
    display: block;
}
.tabSection {
    width: 100%;
    height: min-content;
    border-right: 2px solid #fff8bd;
}
img, video {
    width: 100%;
    height: auto;
}
.smantha {
    border: 0.2em solid #528fd4;
}
section.boyfloats article{
    text-align: justify;
    margin-top: 0.625rem;
    border: 0.2em solid #d4ad52;
    background-color: #fff8bd;
    color:black;
}
section.boyfloats article button {
    width: 1.875rem;
}
div.boyfloats section div.fog {
    border: 0.5px solid white;
}
div.boyfloats section article {
    background-color: #fff8bdaa;
    color:black;
} div.boyfloats section article img {
    width: 67%;
}
div.diagratic {
    float: none;
}.evengroot {
    width: 49%;
    height:9.5%;
}
.neanderthals {
    text-align: left;
    color: white;
    font-size: 1.1em;
}
.bars {
    width: 6.25rem;
    background-color: #5f9ea0;
    border: 1.5px solid white;
}
.navbar {
    width: 48%;
    max-width: 100%;
    padding-top: 0.815rem;
    text-align: center;
    font-size: 1.6rem;
}
.sidebar, .sidebarbar {
    display: none;
}
.navbar a {
    display: block;
    background-color: #d0bfa6;
    color: black;
    font-weight: normal;
    text-decoration: underline dotted;
}
.navbar a:hover {
    background-color: #fffbdc;
}
.navbar a.active {
    background-color: #fff8bd;
    color: crimson;
    font-weight: bold;
    text-decoration: none;
}
.noprob, .problematic {
    display: grid;
    grid-template-columns: repeat(2, 40%);
    gap: 2em;
}
.inlinblock {
    width: 100%;
    margin-right: 0.5rem;
} .vidfile {
    grid-column: 1 / 2;
    margin-top: 1.2em;
        width: 220%;
} .problematic .inlinblock {
    display: inline-block;
    margin-right: 2.5rem;
}
table {
    width: 100%;
    text-wrap: nowrap;
}
table, table td, video {
    border: 2px solid #d4ad52;
    background-color: #fff8bd;
    color: black;
}
table td.field {
    border: none; text-align: center;
}
table td.field input[type="text"] {
    width: 100%;
}
.outputPHP {
    background-color: white;
    color: black;
    font-size: 60%;
}}