:root {
    --bg: rgb(60, 56, 65);
    --bgsize: 50%;
    --buttonvposition: 10%;
    --color: #bfa626;
    --lightaqua: #349c9e;
    --darkaqua: #456e73;
    --verydarkaqua: #2f403e;
    --aquagradient: linear-gradient(to bottom, #456e73, #2f403e);
    --mutedtext: #bc8500;
    --logoorange: #d29400;
    --darkbronze: #6d623c;
    --lightbronze: #a69342ff;
    --textcolor: #a69342ff;
}

@font-face {
    font-family: 'Dosis';
    font-optical-sizing: auto;
    font-weight: 200 800;
    font-style: normal;
    font-display: swap;
    src: url('../font/Dosis/Dosis-VariableFont_wght.ttf') format('woff2');
}

a {
    color: #137b3b;
}

/* Navbar CSS */
.toggler-main-navbar {
    font-size: 1.25rem;
    line-height: 1;
    background: 0 0;
}

#main-navbar {
    display: none;
    /* margin-top: -6px; */
    /* z-index: +1; */
}

#main-navbar ul {
    z-index: +1;
    list-style: none;
    padding: 0;
    /* margin-top: -6px; */
    margin: 0;
    /* margin-top: -6px; */
    /* color: #d29400; */
    /* background-image: linear-gradient(to bottom, #456e73, #2f403e); */

    background: #000;
}

#main-navbar ul li {
    z-index: +1;
    display: block;
    float: none;
    /* margin-top: -6px; */
    /* background: #191d20; */
    /* color: #bc8500;
  text-shadow: 3px, 3px, 1px #303335; */
    background-image: linear-gradient(to bottom, #456e73, #2f403e);
}

#main-navbar ul ul li {
    background: #252a2d;
}

#main-navbar ul ul {
    margin: auto 10px;
}

#main-navbar ul ul ul li {
    background: #303335;
}

#main-navbar ul li a {
    display: block;
    padding: 1em;
    text-decoration: none;
    white-space: nowrap;
    color: #a69342ff;
    text-shadow: 1px 1px 1px #252a2d;
    font-family: Arial, Helvetica, sans-serif;
}

#main-navbar ul li a:hover {
    color: #a69342ff;
}

.menu-item {
    background-color: #00000000;
    color: #a69342ff;
    border: none;
}

/*Media queries*/
@media only screen and (min-width: 767px) {
    #main-navbar {
        display: block !important;
    }

    .toggler-main-navbar {
        display: none;
    }

    /*Set the parent <li>’s CSS position property to ‘relative’.*/
    #main-navbar ul li {
        position: relative;
        float: left;
    }

    /*The CSS to hide the sub menus.*/
    #main-navbar li ul {
        display: none;
    }

    /*Displays the dropdown menu on hover.*/
    #main-navbar li:hover>ul {
        display: block;
        position: absolute;
    }

    #main-navbar li:hover li {
        float: none;
    }

    #main-navbar li ul li {
        border-top: 0;
    }

    #main-navbar ul ul {
        margin: 0;
    }

    /*Displays second level dropdown menus to the right of the first level dropdown menu.*/
    #main-navbar ul ul ul {
        left: 100%;
        top: 0;
    }

    /*Simple clearfix.*/
    #main-navbar ul:before,
    #main-navbar ul:after {
        content: " ";
        /* 1 */
        display: table;
        /* 2 */
    }

    #main-navbar ul:after {
        clear: both;
    }
}

#menu-response {
    background-color: #00000066;
    border-radius: 15px;
    display: none;
    flex-direction: column;
    position: absolute;
    top: 30%;
    left: 10%;
    width: 80%;
    height: 60%;
    /* height: fit-content; */
    align-content: center;
    z-index: 1;
}

.menu-response-element {
    /* position: relative; */
    padding: 10px;
    text-align: center;
    font-family: 'Dosis';
    font-size: 1.4em;
    color: beige;
    animation: 2s, linear .1s menu-loader;
}

@keyframes menu-loader {
    0% {
        top: 50%;
        left: 50%;
        font-size: 4vh;
    }

    25% {
        top: 40%;
        left: 40%;
        font-size: 3.5vh;
    }

    50% {
        top: 30%;
        left: 30%;
        font-size: 3vh;
    }

    75% {
        top: 20%;
        left: 20%;
        font-size: 2.5vh;
    }

    100% {
        top: 10%;
        left: 10%;
        font-size: 1.5vh;
    }
}

.orbit-container {
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 150px;
    height: 150px;
    transform-style: preserve-3d;
}

model-viewer::part(control-panel) {
    display: none;
}