@font-face {
    font-display: swap;
    font-family: Chillax-Extralight;
    font-style: normal;
    font-weight: 200;
    src: url('/Chillax_Complete/Fonts/WEB/fonts/Chillax-Extralight.woff2') format("woff2"), url('/Chillax_Complete/Fonts/WEB/fonts/Chillax-Extralight.woff') format("woff"), url('/Chillax_Complete/Fonts/WEB/fonts/Chillax-Extralight.ttf') format("truetype")
}

@font-face {
    font-display: swap;
    font-family: Chillax-Light;
    font-style: normal;
    font-weight: 300;
    src: url('/Chillax_Complete/Fonts/WEB/fonts/Chillax-Light.woff2') format("woff2"), url('/Chillax_Complete/Fonts/WEB/fonts/Chillax-Light.woff') format("woff"), url('/Chillax_Complete/Fonts/WEB/fonts/Chillax-Light.ttf') format("truetype")
}

@font-face {
    font-display: swap;
    font-family: Chillax-Regular;
    font-style: normal;
    font-weight: 400;
    src: url('/Chillax_Complete/Fonts/WEB/fonts/Chillax-Regular.woff2') format("woff2"), url('/Chillax_Complete/Fonts/WEB/fonts/Chillax-Regular.woff') format("woff"), url('/Chillax_Complete/Fonts/WEB/fonts/Chillax-Regular.ttf') format("truetype")
}

@font-face {
    font-display: swap;
    font-family: Chillax-Medium;
    font-style: normal;
    font-weight: 500;
    src: url('Chillax_Complete/Fonts/WEB/fonts/Chillax-Medium.woff2') format("woff2"), url('Chillax_Complete/Fonts/WEB/fonts/Chillax-Medium.woff') format("truetype")
}

@font-face {
    font-display: swap;
    font-family: Chillax-Semibold;
    font-style: normal;
    font-weight: 600;
    src: url('Chillax_Complete/Fonts/WEB/fonts/Chillax-Semibold.woff2') format("woff2"), url('Chillax_Complete/Fonts/WEB/fonts/Chillax-Semibold.woff') format("woff"), url('Chillax_Complete/Fonts/WEB/fonts/Chillax-Semibold.ttf') format("truetype")
}

@font-face {
    font-display: swap;
    font-family: Chillax-Bold;
    font-style: normal;
    font-weight: 700;
    src: url('/Chillax_Complete/Fonts/WEB/fonts/Chillax-Bold.woff2') format("woff2"), url('/Chillax_Complete/Fonts/WEB/fonts/Chillax-Bold.woff') format("woff"), url('/Chillax_Complete/Fonts/WEB/fonts/Chillax-Bold.ttf') format("truetype")
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

p {
    margin-bottom: 0;
    padding: 0;
}

.navbar-new {
    display: flex;
    justify-content: space-between;
    height: 90px;
    align-items: center;
}

.navbar-new .toggle-btn {
    padding-left: 1.875rem;
    width: 78px;
}

.navbar-new .logo {
    width: 100%;
    text-align: center;
}

.navbar-new .toggle-btn button {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MCIgaGVpZ2h0PSI5IiBmaWxsPSJub25lIiB2aWV3Qm94PSIwIDAgNDAgOSI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTguODg5IDQuNWMwIDIuNDg1LTEuOTkgNC41LTQuNDQ1IDQuNUMxLjk5IDkgMCA2Ljk4NSAwIDQuNVMxLjk5IDAgNC40NDQgMEM2LjkgMCA4Ljg5IDIuMDE1IDguODkgNC41Wk0yNC40NDQgNC41YzAgMi40ODUtMS45OSA0LjUtNC40NDQgNC41LTIuNDU1IDAtNC40NDQtMi4wMTUtNC40NDQtNC41UzE3LjU0NiAwIDIwIDBjMi40NTUgMCA0LjQ0NCAyLjAxNSA0LjQ0NCA0LjVaTTQwIDQuNUM0MCA2Ljk4NSAzOC4wMSA5IDM1LjU1NiA5IDMzLjEgOSAzMS4xMSA2Ljk4NSAzMS4xMSA0LjVTMzMuMTAxIDAgMzUuNTU2IDBDMzguMDEgMCA0MCAyLjAxNSA0MCA0LjVaIi8+PC9zdmc+);
    background-size: 50%;
    background-position: 50%;
    background-repeat: no-repeat;
    border: .125rem solid #fff;
    border-radius: 1.125rem;
    cursor: pointer;
    height: 2.75rem;
    margin: .125rem;
    width: 2.75rem;
    background-color: #FC5722;
}

.sidemenu-mobile {
    background: #0f73ba;
    height: 100%;
    left: 0;
    overflow: hidden;
    position: fixed;
    top: 0;
    transition: width .25s ease;
    width: 0;
    z-index: 25;
}

.sidemenu-mobile .toggle-btn {
    height: 5.625rem;
    padding: 1.25rem 1.875rem;
    width: 100%
}

.sidemenu-mobile button {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI1MCIgaGVpZ2h0PSI1MCIgZmlsbD0ibm9uZSIgdmlld0JveD0iMCAwIDUwIDUwIj48cGF0aCBmaWxsPSIjZmZmIiBkPSJNMS4zOTggMS4zOThhNC43NzQgNC43NzQgMCAwIDEgNi43NSAwbDE2Ljg4IDE2Ljg4TDQxLjkxIDEuMzk4YTQuNzc0IDQuNzc0IDAgMCAxIDYuNzUgNi43NWwtMTYuODggMTYuODhMNDguNjYgNDEuOTFhNC43NzQgNC43NzQgMCAwIDEtNi43NSA2Ljc1TDI1LjAyOSAzMS43OCA4LjE0OSA0OC42NmE0Ljc3NCA0Ljc3NCAwIDAgMS02Ljc1MS02Ljc1bDE2Ljg4LTE2Ljg4MS0xNi44OC0xNi44OGE0Ljc3NCA0Ljc3NCAwIDAgMSAwLTYuNzUxWiIvPjwvc3ZnPg==);
    background-size: 50%;
    background-position: 50%;
    background-repeat: no-repeat;
    border: .125rem solid #fff;
    border-radius: 1.125rem;
    cursor: pointer;
    height: 2.75rem;
    margin: .125rem;
    width: 2.75rem;
    background-color: #0f73ba;
}

.sidemenu-mobile .menu {
    height: calc(80vh - 5.625rem);
    padding: 1.25rem;
}

.sidemenu-mobile .menu nav {
    align-items: center;
    display: flex;
    height: 100%;
}

.sidemenu-mobile .menu nav ul {
    display: block;
    width: 100%;
    list-style: none;
    padding: 0;
}

.sidemenu-mobile .menu nav ul li {
    text-align: center;
    width: 100%;
    margin-bottom: .3125rem;
}

.sidemenu-mobile .menu nav ul li a {
    font-size: 1.875rem;
    color: #fff;
    font-family: Chillax-Semibold, Segoe UI, Tahoma, Geneva, Verdana, sans-serif;
}

.dropleft {
    background-color: #fc5722;
    color: #fff;
    font-family: Luckiest Guy, Impact, Haettenschweiler, Arial Narrow Bold, sans-serif, cursive;
    line-height: 1;
    font-size: 12px;
    text-align: center;
    text-transform: uppercase;
    font-weight: 500;
    min-width: 78px;
}

.location-btn {
    display: flex;
    text-align: left;
    width: 100%;
    justify-content: center;

    & .btn {
        background: #fb8c67f4;
        color: #fff;
        font-family: Luckiest Guy, sans-serif;
        height: 32px;
        border-radius: 48px;
        border: 2px solid #FFFFFF;
        width: 100px;
        cursor: pointer;
        font-weight: 800;
        display: flex;
        justify-content: center;
        align-items: baseline;
        margin: 0 10px;
        font-size: 14px;
        letter-spacing: 1.5px;
    }
}

.location-btn .btn.active {
    background-color: #fff;
    color: black;
}

.party-btn {
    border-bottom: .0625rem solid #fff;
    display: flex;
    text-align: left;
    /* width: 100%; */
    justify-content: center;
    margin-top: 15px;
    margin-left:1.875rem;
    margin-right: 1.875rem;
    & .btn {
        border: .0625rem solid #fff;
        border-bottom: 0;
        border-radius: .75rem .75rem 0 0;
        cursor: pointer;
        padding: .2rem .5rem .1rem;
        position: relative;
        background-color: #FC5722;
        color: #fff;
        font-family: Chillax-Medium, Segoe UI, Tahoma, Geneva, Verdana, sans-serif;
        font-weight: 600;
        font-size: 14px;
        margin-right: 10px;
        height: 27px;
    }
}

.party-btn .btn.active {
    background-color: #fff;
    color: black;
}

.party-content img {
    height: 390px;
    width: 100%;
}

#join,
#mine {
    display: none;
}

#mumbai {
    display: none;
}

.location-content {
    margin-top: 2px;
}

button:focus {
    outline: none !important;
}


.offer {
    z-index: 1;
    position: relative;
    border-radius: 24px;
    background: #FC5722;
    padding: 1.5625rem 10px 2rem 10px;
    background-color: black;
    border: .375rem solid #fff;
    border-radius: 7rem 4rem 7rem 4rem;
    margin: 0 2rem !important;
    border-radius: 4rem 2rem 4rem 2rem;
    background-color: black;
    border: .375rem solid #fff;
}

.t-head{
    color: #fff;
    font-family: Luckiest Guy, Impact, Haettenschweiler, Arial Narrow Bold, sans-serif, cursive;
    line-height: 1;
    font-size: 24px;
    text-align: center;
    text-transform: uppercase;
    font-weight: 500;
    margin-bottom: 1rem;
}

.timer {
    display: flex;
    gap: .5rem;
    justify-content: center;
    align-items: center;
}

.timer-box {
    width: 78px;
    padding: 10px;
    display: flex;
    border-radius: 5px;
    border: 1px solid rgba(255, 255, 255, .44);
    justify-content: center;
    flex-direction: column;
    align-items: center;

    & .value {
        font-size: 21px;
        font-weight: 500;
        line-height: 1;
        color: #fff;
        /* font-family: Chillax-Medium, Segoe UI, Tahoma, Geneva, Verdana, sans-serif; */
        font-family: Luckiest Guy, Impact, Haettenschweiler, Arial Narrow Bold, sans-serif, cursive;
    }

    & .label {
        font-size: 12px;
        line-height: 20px;
        font-weight: 400;
        color: #fff;
        font-family: Chillax-Medium, Segoe UI, Tahoma, Geneva, Verdana, sans-serif;
    }
}

.dashline2{
    position: relative;
    letter-spacing: 1.5px;
    color: #fff;
    font-family: Luckiest Guy, Impact, Haettenschweiler, Arial Narrow Bold, sans-serif, cursive;
    line-height: 1;
    font-size: 14px;
    text-align: center;
    text-transform: uppercase;
    font-weight: 500;
    margin-top: 1rem;
}
.dashline2:before{
    content: "";
    width: 28.5%;
    height: 1.1px;
    background: #eaeaea;
    position: absolute;
    top: 5px;
    left: 30px;
}

.dashline2:after{
    content: "";
    width: 28.5%;
    height: 1.1px;
    background: #eaeaea;
    position: absolute;
    left: auto;
    top: 5px;
    right: 30px;
}

.dashline{
    position: relative;
    letter-spacing: 1.5px;
    color: #fff;
    font-family: Luckiest Guy, Impact, Haettenschweiler, Arial Narrow Bold, sans-serif, cursive;
    line-height: 1;
    font-size: 14px;
    text-align: center;
    text-transform: uppercase;
    font-weight: 500;
    margin-top: 1rem;
}
.dashline:before{
    content: "";
    width: 27.5%;
    height: 1.1px;
    background: #eaeaea;
    position: absolute;
    left: 30px;
    top: 5px;
}

.dashline:after{
    content: "";
    width: 28%;
    height: 1.1px;
    background: #eaeaea;
    position: absolute;
    left: auto;
    top: 5px !important;
    right: 30px;
}