#navBar{
    margin: auto;
    padding: 10px 6vw;
    min-height: 60px;
    /* border-bottom: 1px solid rgb(70, 64, 64); */
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* margin-bottom: 1vw; */
    color: white;
    /* mix-blend-mode: difference; */
    background-color: black;
    background-image: linear-gradient(to right, #434343 0%, black 100%);
    background-image: linear-gradient(to left, #09203f 0%, #537895 100%);
    /* font-size: 110%; */
    /* display: none; */
}


@media (max-width:900px) {
    #navBar{
        flex-direction: column;
        gap: 2vw;
        padding: 5vw;
        /* margin-bottom: 4vw; */
    }
    
    
    #navBar > span:nth-child(1){
        transform: scale(1.2);
    }
}

#navBar > span:nth-child(1){
    cursor: pointer;
    display: flex;
    align-items: center;
    column-gap: 0.5vw;
}

#navBar > span:nth-child(1) span:nth-child(1){
    content: url("../Resources/PWImages/Physics_wallah_logo.svg.png");
    width: 45px;
    aspect-ratio: 1;
    filter: invert(1);
}


#navBar > span:nth-child(1) span:nth-child(2){
    font-weight: 600;
}

#navBar > div {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

#navBar div a{
    padding: 5px 15px;
    text-align: center;
    margin: 0 10px;
    border-radius: 10px;
    text-decoration: none;
    color: white;
    font-weight: 500;
    transition: all .2s;
    /* border: 1px solid black; */
}

#navBar div a:hover{
    background-color: rgb(206, 188, 188);
    transform: scale(1.1);
    background-color: black;
}

#navBar button{
    padding: 5px 25px;
    text-decoration: none;
    color: white;
    background-color: transparent;
    border: none;
    border: 1px solid grey;
    border-radius: 20px;
    transition: background-color 0.2s , color 0.1s, transform 0.2s;
    font-weight: 500;
}


#navBar button:hover{
    background-color: white;
    /* color: black; */
    transform: scale(1.2);
}

#navBar button a{
    text-decoration: none;
    color: white;
    transition: background-color 0.2s , color 0.1s, transform 0.2s;


}

#navBar button a:hover{
    /* background-color: white; */
    color: black;
}