/* Menu Styling */
menu{
    width: 100%;
    height: 350px;
    background: linear-gradient( to left, var(--black40), var(--black40)), url('../asset/images/background/bg2.jpg');
    background-position: center;
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
    
}
menu > h1{
    color: var(--white);
    text-transform: uppercase;
}


/* Membership Styling */
.membership{
    border-radius: 25px !important;
}
.membership > .heading{
    background-color: var(--orange);
    text-align: center;
    height: 70px;
    position: relative;
    border-top-left-radius: 25px;
    border-top-right-radius: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.membership > .heading > h2{
    color: var(--white);
}
.membership > .heading > i{
    color: var(--orange);
    text-align: center;
    position: absolute;
    font-size: 3rem;
    bottom: -15px;
}

.membership > .detail ul li{
    list-style: none;
    padding: 0px;
    line-height: 40px;
    font-weight: bold;
    padding-left: var(--p6);
    font-size: 1.2rem;
}
.membership > .detail ul li > i{
    font-size: 1.5rem;
}
.membership > .detail ul li > i.yes{
    color: var(--green);
}
.membership > .detail ul li > i.no{
    color: var(--orange);
}
.membership > .detail > h1{
    text-align: center;
}



/* Medium devices (tablets, 768px and up) */
@media (max-width: 767.98px) { 
    menu{
        height: 250px;
    }
}
/* Small devices (landscape phones, 576px and up) */
@media (max-width: 575.98px) { 
    menu{
        height: 200px;
    }
}