body{
    background-image:   url("../img/bg4.jpg");
    background-repeat:  no-repeat;
    background-size:    cover;
}

#navbar{
    background-image:   linear-gradient(to bottom, rgba(255,255,255,.5), rgba(255,255,255,.125)49%, rgba(0,0,0,.25)50%, rgba(255,255,255,.25)100%);
    backdrop-filter:    blur(15px);
    box-shadow:         rgba(0,0,0,1) 0 0 5px;
    border-radius:      50px;
}

#navbtn{
    padding:            5px;
}
#navbtn>button{
    background:         rgba(255,255,255,.1);
    padding:            0 25px 0 25px;
    font-size:          24px;
    color:              white;
    text-shadow:        black 0 0 5px;
    box-shadow:         black 0 0 2px;
    background-image:   linear-gradient(to bottom, rgba(255,255,255,.5), rgba(255,255,255,.125)49%, rgba(0,0,0,.25)50%, rgba(255,255,255,.25)100%);
    border:             solid rgba(0,0,0,.25) 1px;
    border-radius:      50px;
    transition:         ease-in .25s;
}
#navbtn>button:hover{
    background:         rgba(0,200,200,1);
    box-shadow:         rgba(0,255,255,1) 0 0 10px;
    background-image:   linear-gradient(to bottom, rgba(255,255,255,.5), rgba(255,255,255,.125)49%, rgba(0,0,0,.25)50%, rgba(255,255,255,.25)100%);
}
#navbtn>button:active{
    background:         rgba(0,64,64,1);
    box-shadow:         rgba(0,127,127,1) 0 0 10px;
    text-shadow:        rgba(0,255,255,1) 0 0 5px;
    background-image:   linear-gradient(to bottom, rgba(255,255,255,.5), rgba(255,255,255,.125)49%, rgba(0,0,0,.25)50%, rgba(255,255,255,.25)100%);

}

#featurebar{
    position:           absolute;
    left:               0px;
    bottom:             0px;
    width:              100%;
    text-align:         center;
    color:              red;
    text-shadow:        black 0 0 5px;
    background-image:   repeating-linear-gradient(45deg, yellow 25%, yellow 50%, black 50%, black 75%);
}