/*reposived*/
@media screen and (max-width: 768px) {
    .navBar-container {
        flex-direction: row;
        align-items: center;
        justify-content: flex-start; /* icons will start from left */
        bottom: 0;
        top: auto;
        height: 60px;
        background-color: #fff;
        box-shadow: 0px -2px 10px rgba(0,0,0,0.1);
        position: fixed;
        width: 100%;
        z-index: 2000;
        padding: 0 10px;
    }

    .nav-links ul {
        display: flex;
        padding: 0;
        margin: 0;
        gap: 15px; /* spacing between icons */
    }

    .nav-links li {
        margin: 0;
        display: flex;
        justify-content: center; /* center inside each li */
        align-items: center;
    }

    .nav-links .link, 
    .nav-links .links {
        display: none; /* hide text labels */
    }


    .nav-links video {
        width: 35px;
        height: 35px;
    }

    .content-container {
        margin-top: 20%;
    }
}



@media screen and (max-width: 768px) {
    .menuBar video {
        display: block;
    }

    .contentBtn {
        display: none; /* hide initially sa mobile */
        height: auto;
        position: absolute;
        left: 80%;
        transform: translateX(-50%);
        bottom: 60px; /* adjust above video */
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
}