@charset "utf-8";

/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
/* font-family: "Inter", sans-serif; */
@import url('https://fonts.googleapis.com/css2?family=Urbanist:ital,wght@0,100..900;1,100..900&display=swap');
/* font-family: "Urbanist", sans-serif; */

/* 	-----------------------------------------------------
    ------------------- General Styles ------------------
    ----------------------------------------------------- */
* {
    margin: 0;
    padding: 0;
    outline: none;
    box-sizing: border-box;
}

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

body {
    margin: 0;
    padding: 0;
    font-family: "Inter", sans-serif;
    color: #4F4E50;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
    font-size: 100%;
    overflow-x: hidden;
}

a {
    outline: none;
    outline-style: none;
    outline-width: 0;
    color: #4F4E50;
    text-decoration: none;
}

a:hover,
a:active,
a:focus {
    outline: none;
    outline-style: none;
    outline-width: 0;
    color: #FFBA00;
    text-decoration: none;
}

.clearfix:before,
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    overflow: hidden;
}

.clearfix:after {
    clear: both
}

.clearfix {
    zoom: 1
}

[contenteditable="true"]:focus {
    outline: none;
}

*:focus {
    outline: none;
}

img {
    margin: 0;
    padding: 0;
    outline-style: none;
    outline-width: 0;
    max-width: 100%;
    height: auto;
}

.text-center {
    text-align: center;
}

.text-left {
    text-align: left !important;
}

.text-right {
    text-align: right !important;
}

.d-block {
    display: block;
}

.d-flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.image-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1;
}

.container {
    margin: 0 auto;
    width: 100%;
    max-width: 1230px;
    padding: 0 30px;
}

.ctg-text {
    display: inline-block;
    font-size: 12px;
    line-height: 9px;
    font-weight: 400;
    border-radius: 20px;
    padding: 6px;
}

.ctg-daily {
    color: #12B347;
    background: rgba(18, 179, 71, 0.1);
}

.ctg-weekly {
    color: #FCB205;
    background: rgba(252, 178, 5, 0.1);
}

.ctg-monthly {
    color: #9747FF;
    background: rgba(151, 71, 255, 0.1);
}

.ctg-quarterly {
    color: #0049D0;
    background: rgba(0, 73, 208, 0.1);
}

.ctg-yearly {
    color: #EC2180;
    background: rgba(236, 33, 128, 0.1);
}

.ctg-pending {
    color: #F60F54;
    background: rgba(246, 15, 84, 0.1);
}

.ctg-submit {
    color: #00CCB3;
    background: rgba(0, 204, 179, 0.1);
}

.btn-arrow {
    width: 45px;
    height: 45px;
    background: rgba(0, 147, 206, 0.1);
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
}


.btn-arrow:hover {
    background: rgb(0, 147, 206);
}

.btn-arrow:hover img {
    filter: brightness(0) invert(1);
}

.select-box {
    position: relative;
    min-width: 150px;
}

.select-box::after {
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translate(0, -50%);
    content: "\e90c";
    font-family: 'icomoon' !important;
    font-size: 20px;
    line-height: 1;
    color: #4F4E50;
}

.select-box select {
    appearance: none;
    width: 100%;
    height: 45px;
    border: 1px solid #BDCAD0;
    border-radius: 8px;
    font-size: 16px;
    line-height: 1;
    font-weight: 400;
    color: #4F4E50;
    cursor: pointer;
    padding: 0 14px;
}

@media only screen and (max-width:760px) {
    .container {
        padding: 0 15px;
    }
}

@media only screen and (min-width:761px) and (max-width:1023px) {
    .container {
        padding: 0 20px;
    }
}

@font-face {
    font-family: 'icomoon';
    src: url('../fonts/icomoon.eot?lnoxt2');
    src: url('../fonts/icomoon.eot?lnoxt2#iefix') format('embedded-opentype'),
        url('../fonts/icomoon.ttf?lnoxt2') format('truetype'),
        url('../fonts/icomoon.woff?lnoxt2') format('woff'),
        url('../fonts/icomoon.svg?lnoxt2#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

[class^="icon-"],
[class*=" icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'icomoon' !important;
    speak: never;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-alarm:before {
    content: "\e93e";
}

.icon-money:before {
    content: "\e93f";
}

.icon-participants:before {
    content: "\e940";
}

.icon-about:before {
    content: "\e909";
}

.icon-back:before {
    content: "\e90a";
}

.icon-contest-list-active:before {
    content: "\e90b";
}

.icon-dd-arrow:before {
    content: "\e90c";
}

.icon-dd-arrow-right:before {
    content: "\e90d";
}

.icon-delete:before {
    content: "\e90e";
}

.icon-edit:before {
    content: "\e90f";
}

.icon-edit-picture .path1:before {
    content: "\e910";
}

.icon-edit-picture .path2:before {
    content: "\e911";
    margin-left: -1em;
    color: rgb(255, 255, 255);
}

.icon-email:before {
    content: "\e912";
}

.icon-flag .path1:before {
    content: "\e913";
    color: rgb(248, 153, 57);
}

.icon-flag .path2:before {
    content: "\e914";
    margin-left: -1em;
    color: rgb(255, 255, 255);
}

.icon-flag .path3:before {
    content: "\e915";
    margin-left: -1em;
    color: rgb(30, 137, 67);
}

.icon-flag .path4:before {
    content: "\e916";
    margin-left: -1em;
    color: rgb(42, 44, 122);
}

.icon-flag .path5:before {
    content: "\e917";
    margin-left: -1em;
    color: rgb(255, 255, 255);
}

.icon-flag .path6:before {
    content: "\e918";
    margin-left: -1em;
    color: rgb(255, 255, 255);
}

.icon-flag .path7:before {
    content: "\e919";
    margin-left: -1em;
    color: rgb(255, 255, 255);
}

.icon-flag .path8:before {
    content: "\e91a";
    margin-left: -1em;
    color: rgb(255, 255, 255);
}

.icon-flag .path9:before {
    content: "\e91b";
    margin-left: -1em;
    color: rgb(255, 255, 255);
}

.icon-flag .path10:before {
    content: "\e91c";
    margin-left: -1em;
    color: rgb(255, 255, 255);
}

.icon-flag .path11:before {
    content: "\e91d";
    margin-left: -1em;
    color: rgb(255, 255, 255);
}

.icon-flag .path12:before {
    content: "\e91e";
    margin-left: -1em;
    color: rgb(255, 255, 255);
}

.icon-flag .path13:before {
    content: "\e91f";
    margin-left: -1em;
    color: rgb(255, 255, 255);
}

.icon-flag .path14:before {
    content: "\e920";
    margin-left: -1em;
    color: rgb(255, 255, 255);
}

.icon-flag .path15:before {
    content: "\e921";
    margin-left: -1em;
    color: rgb(255, 255, 255);
}

.icon-flag .path16:before {
    content: "\e922";
    margin-left: -1em;
    color: rgb(255, 255, 255);
}

.icon-flag .path17:before {
    content: "\e923";
    margin-left: -1em;
    color: rgb(255, 255, 255);
}

.icon-flag .path18:before {
    content: "\e924";
    margin-left: -1em;
    color: rgb(255, 255, 255);
}

.icon-flag .path19:before {
    content: "\e925";
    margin-left: -1em;
    color: rgb(255, 255, 255);
}

.icon-flag .path20:before {
    content: "\e926";
    margin-left: -1em;
    color: rgb(255, 255, 255);
}

.icon-google .path1:before {
    content: "\e927";
    color: rgb(22, 126, 230);
}

.icon-google .path2:before {
    content: "\e928";
    margin-left: -1em;
    color: rgb(18, 179, 71);
}

.icon-google .path3:before {
    content: "\e929";
    margin-left: -1em;
    color: rgb(15, 153, 62);
}

.icon-google .path4:before {
    content: "\e92a";
    margin-left: -1em;
    color: rgb(255, 213, 0);
}

.icon-google .path5:before {
    content: "\e92b";
    margin-left: -1em;
    color: rgb(255, 75, 38);
}

.icon-google .path6:before {
    content: "\e92c";
    margin-left: -1em;
    color: rgb(217, 63, 33);
}

.icon-hamburger:before {
    content: "\e92d";
}

.icon-home-active:before {
    content: "\e92e";
}

.icon-logout:before {
    content: "\e92f";
}

.icon-my-contests:before {
    content: "\e930";
}

.icon-my-contests-active:before {
    content: "\e931";
}

.icon-my-profile-active:before {
    content: "\e932";
}

.icon-notifications:before {
    content: "\e933";
}

.icon-notifications-active .path1:before {
    content: "\e934";
    color: rgb(255, 0, 0);
}

.icon-notifications-active .path2:before {
    content: "\e935";
    margin-left: -1em;
    color: rgb(79, 78, 80);
}

.icon-refresh:before {
    content: "\e936";
}

.icon-refund-policy:before {
    content: "\e937";
}

.icon-search:before {
    content: "\e938";
}

.icon-smartphone:before {
    content: "\e939";
}

.icon-terms-and-conditions:before {
    content: "\e93a";
}

.icon-upload:before {
    content: "\e93b";
}

.icon-user:before {
    content: "\e93c";
}

.icon-wallet:before {
    content: "\e93d";
}

.icon-contest-list:before {
    content: "\e900";
}

.icon-home:before {
    content: "\e901";
}

.icon-link-arrow .path1:before {
    content: "\e902";
    color: rgb(0, 147, 206);
    opacity: 0.15;
}

.icon-link-arrow .path2:before {
    content: "\e903";
    margin-left: -1em;
    color: rgb(0, 147, 206);
}

.icon-my-contest:before {
    content: "\e904";
}

.icon-my-profile:before {
    content: "\e905";
}

.icon-view .path1:before {
    content: "\e906";
    color: rgb(0, 147, 206);
    opacity: 0.1;
}

.icon-view .path2:before {
    content: "\e907";
    margin-left: -1em;
    color: rgb(0, 147, 206);
}

.icon-view .path3:before {
    content: "\e908";
    margin-left: -1em;
    color: rgb(0, 147, 206);
}

/* 	-----------------------------------------------------
    -------------------- Header Styles ------------------
    ----------------------------------------------------- */
.header-section {
    margin: 0;
    padding: 15px 0;
    width: 100%;
    min-height: 80px;
    background-color: #FFFFFF;
    border-bottom: 1px solid #CBCED1;
    transition: all .4s ease-in-out;
}

.header-section.sticky {
    width: 100%;
    background-color: #FFFFFF;
    position: fixed;
    top: 0;
    z-index: 9;
    transition: all .4s ease-in-out;
}

.header-section .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header-section figure {
    margin: 0;
    padding: 0;
    height: 50px;
}

.header-section figure img,
.header-section figure a {
    margin: 0;
    padding: 0;
    height: 50px;
}

.header-section aside {
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header-section aside .menu {
    margin: 0;
    padding: 0;
}

.header-section aside .menu ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0 40px;
}

.header-section aside .menu ul li {
    margin: 0;
    padding: 0;
    font-size: 16px;
    font-weight: 400;
    line-height: 40px;
    color: #4F4E50;
    text-transform: uppercase;
}

.header-section aside .menu ul li a {
    color: #4F4E50;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 0 5px;
    transition: .5s;
}

.header-section aside .menu ul li a:hover,
.header-section aside .menu ul li a.active {
    color: #0093CE;
    transition: .5s;
}

.header-section aside .menu ul li a i {
    font-size: 20px;
}

.header-section aside .menu ul li a.active i {
    color: #0093CE;
    transition: .5s;
}

.header-section aside .login a {
    margin: 0 30px 0 40px;
    padding: 10px 20px;
    background-color: #0093CE;
    border-radius: 6px;
    font-size: 18px;
    font-weight: 500;
    line-height: 20px;
    text-align: center;
    color: #FFFFFF;
    transition: all .4s ease-in-out;
}

.header-section aside .login a:hover {
    background-color: #1E1E28;
    color: #FFFFFF;
    transition: all .4s ease-in-out;
}

.header-mobile-section {
    display: none;
    margin: 15px;
    padding: 10px;
    width: calc(100% - 30px);
    min-height: 60px;
    background-color: #FFFFFF;
    border-radius: 12px;
    box-shadow: 0px 2px 15px 0px #DFEAEB;
}

.header-mobile-section figure img {
    height: 40px;
}

.header-mobile-section aside {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
}

.header-mobile-section aside a {
    width: 40px;
    height: 40px;
    background-color: #E0F8FF;
    border-radius: 6px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    color: #4F4E50;
}

.header-section .menubar {
    width: 46px;
    height: 46px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.main-menu {
    margin: 0;
    padding: 0;
    position: fixed;
    left: 0;
    top: 80px;
    width: 100%;
    height: 0;
    max-height: max-content;
    background-color: #F4F7F8;
    border-radius: 0;
    z-index: 9;
    overflow: hidden;
    transition: height 0.4s ease-in-out;
}

.main-menu.oppenned {
    height: 100%;
    max-height: max-content;
}

.main-menu ul.page-links {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
}

.main-menu ul.page-links li {
    width: 33.33%;
    display: block;
    font-size: 32px;
    line-height: 1;
    font-weight: 600;
    color: #1E1E28;
    border: 1px solid #D9D9D9;
}

.main-menu ul.page-links li:first-child,
.main-menu ul.page-links li:nth-child(2),
.main-menu ul.page-links li:nth-child(4),
.main-menu ul.page-links li:nth-child(5) {
    border-right: 0;
    border-bottom: 0;
}

.main-menu ul.page-links li:nth-child(6),
.main-menu ul.page-links li:nth-child(3) {
    border-bottom: 0;
}

.main-menu ul.page-links li:nth-child(7),
.main-menu ul.page-links li:nth-child(8) {
    border-right: 0;
}

.main-menu ul.page-links li a {
    color: #1E1E28;
    display: block;
    transition: all .4s ease-in-out;
    padding: 25px 30px;
}

.main-menu ul.page-links li a:hover,
.main-menu ul.page-links li a.active {
    color: #FFFFFF;
    background: #0093CE;
    transition: all .4s ease-in-out;
}

.main-menu ul.social-links {
    margin: 0;
    padding: 0;
    list-style: none;
}

.main-menu ul.social-links li {
    margin: 0 20px 0 0;
    display: inline-block;
    font-size: 24px;
    font-weight: normal;
    line-height: 1.4;
    color: #FFFFFF;
    transition: all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.main-menu ul.social-links li a {
    color: #FFFFFF;
    display: block;
    transition: all .4s ease-in-out;
}

.main-menu ul.social-links a:hover {
    color: #ecba09;
    transition: all .4s ease-in-out;
}

.c-hamburger {
    margin: 0;
    padding: 0;
    width: 40px;
    height: 40px;
    display: block;
    overflow: hidden;
    font-size: 0;
    text-indent: -9999px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: transparent;
    box-shadow: none;
    border-radius: none;
    border: none;
    cursor: pointer;
    -webkit-transition: background 0.3s;
    transition: background 0.3s;
}

.c-hamburger:focus {
    outline: none;
}

.c-hamburger span {
    display: block;
    width: 40px;
    height: 40px;
    background: url(../images/menu-open.svg) no-repeat center;
}

.c-hamburger.is-active span {
    background: url(../images/menu-close.svg) no-repeat center;
}

@media only screen and (max-width:760px) {
    .header-section {
        display: none;
    }

    .header-mobile-section {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .main-menu {
        top: 0;
        height: 100%;
        max-height: unset;
        padding: 30px;
        left: -300px;
        width: 300px;
        transition: 0.3s;
    }

    .main-menu.oppenned {
        left: 0;
        height: 100%;
        max-height: unset;
    }

    .main-menu ul.page-links {
        display: block;
    }

    .main-menu ul.page-links li {
        width: auto;
        border: none;
        margin: 15px 0;
        font-size: 16px;
    }

    .main-menu ul.page-links li a {
        padding: 0;
    }

    .main-menu ul.page-links li a:hover,
    .main-menu ul.page-links li a.active {
        background: transparent;
        color: #0093CE;
    }

    .main-menu ul.social-links li {
        margin: 0 20px 0 0;
        font-size: 18px;
    }

    .main-menu ul.social-links li a {
        color: #1E1E28;
    }
}

@media only screen and (min-width:761px) and (max-width:1023px) {
    .header-section aside .menu ul {
        gap: 0 15px;
    }

    .header-section aside .menu ul li {
        font-size: 14px;
    }

    .header-section aside .login a {
        font-size: 16px;
    }

    .header-section aside .login a {
        margin: 0 15px 0 30px;
    }

    .main-menu ul.page-links li {
        font-size: 18px;
    }

    .main-menu ul.page-links li a {
        padding: 18px 18px;
    }
}

/* 	-----------------------------------------------------
    -------------------- Banner Styles ------------------
    ----------------------------------------------------- */
.banner-section {
    padding: 30px 0;
}

.banner-js .item {
    padding: 0 15px;
}

.banner-wrapper {
    padding: 40px;
    min-height: 400px;
    background-color: #0093CE;
    border-radius: 22px;
    overflow: hidden;
    position: relative;
    z-index: 1;
}

.banner-wrapper article {
    width: 100%;
    max-width: 430px;
}

.banner-wrapper .d-flex {
    justify-content: flex-start;
    gap: 20px;
    margin-bottom: 1rem;
}

.banner-wrapper h1 {
    font-size: 32px;
    font-weight: 700;
    line-height: 1;
    color: #FFFFFF;
    text-transform: uppercase;
    padding: 1rem 0;
}

.banner-wrapper h5 {
    font-size: 20px;
    font-weight: 400;
    line-height: 1;
    color: #1E1E28;
    padding: 10px 25px;
    background-color: #FFFFFF;
    border-radius: 50px;
    display: inline-block;
}

.banner-wrapper h5 strong {
    color: #0B48B9;
}

.banner-wrapper p {
    font-size: 20px;
    font-weight: 400;
    line-height: 1.4;
    color: #FFFFFF;
}

.banner-wrapper .daily {
    color: #12B347 !important;
}

.banner-wrapper .weekly {
    color: #FCB205 !important;
}

.banner-wrapper .monthly {
    color: #9747FF !important;
}

.banner-wrapper .quarterly {
    color: #0049D0 !important;
}

.banner-wrapper .yearly {
    color: #EC2180 !important;
}

.banner-wrapper .btn a {
    margin: 1.5rem 0 0 0;
    padding: 15px 25px;
    background-color: #00CCB3;
    border-radius: 50px;
    font-size: 22px;
    font-weight: 500;
    line-height: 1;
    color: #FFFFFF;
    display: inline-block;
    transition: .5s;
}

.banner-wrapper .btn a:hover {
    background-color: #ecba09;
    transition: .5s;
}

@media only screen and (max-width:760px) {
    .banner-section {
        padding: 0 15px;
    }

    .banner-js .item {
        padding: 0;
    }

    .banner-wrapper {
        padding: 20px;
        border-radius: 8px;
        min-height: 300px;
    }

    .banner-wrapper article {
        max-width: 100%;
    }

    .banner-wrapper .d-flex {
        margin: 0;
        gap: 5px;
    }

    .banner-wrapper h1 {
        font-size: 24px;
    }

    .banner-wrapper h5 {
        font-size: 14px;
        padding: 5px 15px;
    }

    .banner-wrapper p {
        font-size: 16px;
    }

    .banner-wrapper .btn a {
        padding: 10px 15px;
        font-size: 16px;
    }
}

/* 	-----------------------------------------------------
    ------------------- Content Styles ------------------
    ----------------------------------------------------- */
.content-section {
    min-height: 400px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 700;
    line-height: 1.2;
    color: #1E1E28;
    padding: 10px 0;
}

.content-section h1 {
    font-size: 44px;
}

.content-section h2 {
    font-size: 36px;
}

.content-section h3 {
    font-size: 32px;
}

.content-section h4 {
    font-size: 28px;
    font-weight: 600;
}

.content-section h5 {
    font-size: 22px;
    font-weight: 600;
}

.content-section h6 {
    font-size: 18px;
    font-weight: 600;
}

.content-section p {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    color: #4F4E50;
    padding: 10px 0;
}

.content-section ul {
    margin: 0;
    padding: 0 0 0 15px;
    list-style: disc;
}

.content-section ul li {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.4;
    color: #4F4E50;
    margin: 5px 0;
}

.content-section ul ul {
    list-style: circle;
}

.content-section ol {
    margin: 0;
    padding: 0 0 0 18px;
    list-style: decimal;
}

.content-section ol li {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.4;
    color: #4F4E50;
    margin: 5px 0;
}

.content-section ol ol {
    list-style: lower-roman;
}

.btn-group {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 15px;
}

.btn-01 {
    margin: 10px 0;
    padding: 10px 65px 10px 20px;
    cursor: pointer;
    position: relative;
    display: inline-block;
    background: #FFFFFF url(../images/link-arrow.svg) no-repeat right;
    border: 1px solid #0093CE36;
    font-size: 18px;
    font-weight: 500;
    line-height: 24px;
    transition: opacity 0.25s, background-color 0.25s;
    color: #0093CE !important;
}

.btn-01:before,
.btn-01:after {
    content: "";
    position: absolute;
    display: block;
    width: 1.625rem;
    height: 1.625rem;
    border: 2px solid transparent;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    transition: width 0.3s, height 0.3s;
}

.btn-01:before {
    top: 0;
    right: 0;
    border-top-color: #0093CE;
    border-right-color: #0093CE;
}

.btn-01:after {
    left: 0;
    bottom: 0;
    border-bottom-color: #0093CE;
    border-left-color: #0093CE;
}

.btn-01:hover:before,
.btn-01:hover:after {
    width: 100%;
    height: 100%;
}

.section-title {
    display: flex;
    justify-content: center;
    align-items: center;
}

.btn-01-mobile {
    display: none;
    justify-content: flex-start;
    align-items: center;
    gap: 5px;
    font-size: 16px;
    color: #0093CE;
}

.btn-01-mobile a {
    margin: 0;
    padding: 0;
    background-color: transparent;
    border: none;
    border-bottom: 2px solid #0093CE;
    border-radius: 0;
    font-family: "Inter", sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    color: #0093CE !important;
    text-align: center;
    white-space: nowrap;
    cursor: pointer;
    transition: all .4s ease-in-out;
}

@media only screen and (max-width:760px) {
    .content-section {
        padding-bottom: 80px;
    }

    .content-section h1 {
        font-size: 30px;
    }

    .content-section h2 {
        font-size: 24px;
    }

    .content-section h3 {
        font-size: 22px;
    }

    .content-section h4 {
        font-size: 20px;
    }

    .content-section h5 {
        font-size: 18px;
    }

    .content-section h6 {
        font-size: 16px;
    }

    .content-section p {
        font-size: 14px;
    }

    .content-section ul li {
        font-size: 14px;
    }

    .content-section ol li {
        font-size: 14px;
    }

    .btn-01 {
        font-size: 14px;
        padding: 10px 60px 10px 15px;
    }

    .section-title {
        justify-content: space-between;
    }

    .btn-01-mobile {
        display: flex;
    }
}

.recent-contestst-section {
    padding: 20px 0 50px 0;
}

.title-search-filter {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
}

.title-search-filter aside {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
}

.search {
    position: relative;
}

input[type="search"] {
    margin: 0;
    padding: 10px 15px;
    width: 100%;
    max-width: 270px;
    height: 44px;
    background-color: #FFFFFF;
    border: 1px solid #BDCAD0;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    color: #1E1E28;
}

.search input[type="search"] {
    padding-right: 37px;
}

.search button[type="submit"] {
    margin: 0;
    padding: 0;
    width: 44px;
    height: 44px;
    background: none;
    border: none;
    font-size: 24px;
    color: #4F4E50;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    position: absolute;
    right: 0;
    top: 0;
}

.no-item {
    display: none;
    padding: 0 0 25px 0;
    border-bottom: 1px solid #37455033;
}

.open-category-list {
    display: none;
}

.category-group {
    position: relative;
}

ul.category-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}

ul.category-list li {
    margin: 0;
    padding: 10px 15px;
    font-size: 18px;
    font-weight: 500;
    line-height: 22px;
    color: #0093CE;
    background: #0093CE1A;
    border: 1px solid #0093CE33;
    border-radius: 8px;
    cursor: pointer;
}

ul.category-list li.active {
    background-color: #0093CE;
    border-color: #0093CE;
    color: #FFFFFF;
}

.contests {
    margin: 25px 0;
    border-top: 1px solid #37455033;
}

.contest-item {
    padding: 25px 0;
    border-bottom: 1px solid #37455033;
    display: flex;
    justify-content: space-between;
}

.contest-item figure {
    margin: 0;
    padding: 0;
    width: 230px;
    height: 150px;
    border-radius: 8px;
    overflow: hidden;
    position: relative;
    z-index: 1;
}

.contest-item article {
    width: calc(100% - 430px);
    padding: 0 20px;
}

.contest-item article h4 {
    padding: 5px 0;
    font-weight: 700;
}

.contest-item article p {
    padding: 5px 0;
    font-size: 18px;
}

.contest-item article p a {
    color: #0093CE;
    font-weight: 600;
    text-decoration: underline;
}

.contest-item aside {
    width: 200px;
    padding-left: 20px;
    border-left: 1px solid #37455033;
}

.contest-item aside p {
    padding: 5px 0;
    display: flex;
    align-items: center;
    gap: 0 5px;
}

.contest-item aside p i {
    font-size: 20px;
}

.contest-item aside .price {
    font-size: 20px;
    font-weight: 600;
    color: #1E1E28;
}

.contest-item .daily,
.contest-item .weekly,
.contest-item .monthly,
.contest-item .quarterly,
.contest-item .yearly {
    padding: 0;
    background-color: transparent;
    border-radius: 0;
}

.btn-watch {
    margin: 5px 0;
    padding: 5px 15px;
    width: auto;
    height: 36px;
    background-color: #3745501A;
    border: none;
    border-radius: 50px;
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
    text-align: center;
    color: #0A0E11;
    cursor: pointer;
}

.btn-watching {
    margin: 5px 0;
    padding: 5px 15px;
    width: auto;
    height: 36px;
    background-color: #37455099;
    border: none;
    border-radius: 50px;
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
    text-align: center;
    color: #FFFFFF;
    cursor: pointer;
}

@media only screen and (max-width:760px) {
    .recent-contestst-section {
        padding: 30px 0;
    }

    .title-search-filter {
        flex-wrap: wrap;
    }

    .title-search-filter h3 {
        width: 100%;
        padding: 0;
    }

    .title-search-filter aside {
        flex-wrap: wrap;
        width: 100%;
    }

    .search {
        width: 100%;
    }

    input[type="search"] {
        max-width: 100%;
    }

    .category-group {
        width: 100%;
    }

    .open-category-list {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 10px 15px;
        font-size: 16px;
        font-weight: 500;
        line-height: 22px;
        color: #0093CE;
        background: #0093CE1A;
        border: 1px solid #0093CE33;
        border-radius: 8px;
        cursor: pointer;
        transition: 0.3s ease;
    }

    ul.category-list {
        width: 100%;
        background: #0093CE1A;
        border: 1px solid #0093CE33;
        border-top: 0;
        border-radius: 0 0 8px 8px;
        z-index: 2;
        display: none;
        flex-wrap: wrap;
    }

    ul.category-list li {
        width: 100%;
        font-size: 16px;
        border: none;
        border-top: 1px solid #0093CE33;
        border-radius: 0px;
    }

    .open-category-list i {
        transition: 0.3s ease;
    }

    .category-group.active .open-category-list i {
        transform: rotate(180deg);
    }

    .contests {
        margin: 15px 0;
    }

    .contest-item {
        padding: 15px 0;
        flex-wrap: wrap;
    }

    .no-item {
        padding: 0 0 15px 0;
    }

    .contest-item figure {
        width: 100%;
    }

    .contest-item article {
        width: 100%;
        padding: 10px 0;
    }

    .contest-item article p {
        font-size: 16px;
    }

    .contest-item aside {
        width: 100%;
        padding-left: 0px;
        padding-top: 10px;
        border-left: none;
        border-top: 1px solid #37455033;
    }

    .contest-item aside p {
        padding: 5px 0;
        display: flex;
        align-items: center;
        gap: 0 5px;
    }

    .contest-item aside p i {
        font-size: 20px;
    }

    .contest-item aside .price {
        font-size: 20px;
        font-weight: 600;
        color: #1E1E28;
    }

    .contest-item .daily,
    .contest-item .weekly,
    .contest-item .monthly,
    .contest-item .quarterly,
    .contest-item .yearly {
        padding: 0;
        background-color: transparent;
        border-radius: 0;
    }

    .btn-watch {
        margin: 5px 0;
        padding: 5px 15px;
        width: auto;
        height: 36px;
        background-color: #3745501A;
        border: none;
        border-radius: 50px;
        font-size: 18px;
        font-weight: 500;
        line-height: 26px;
        text-align: center;
        color: #0A0E11;
        cursor: pointer;
    }

    .btn-watching {
        margin: 5px 0;
        padding: 5px 15px;
        width: auto;
        height: 36px;
        background-color: #37455099;
        border: none;
        border-radius: 50px;
        font-size: 18px;
        font-weight: 500;
        line-height: 26px;
        text-align: center;
        color: #FFFFFF;
        cursor: pointer;
    }
}

@media only screen and (min-width:761px) and (max-width:1023px) {
    .title-search-filter {
        flex-wrap: wrap;
        width: 100%;
    }

    .title-search-filter h3 {
        width: 100%;
        padding: 0;
    }

    .title-search-filter aside {
        flex-wrap: wrap;
        width: 100%;
    }

    .title-search-filter aside .search {
        width: 25%;
    }

    ul.category-list {
        gap: 3px;
    }

    ul.category-list li {
        font-size: 14px;
        padding: 8px 15px;
    }
}

@media only screen and (min-width:1024px) and (max-width:1200px) {
    ul.category-list li {
        font-size: 16px;
    }
}

.contests-stats-section {
    padding: 50px 0;
    background-color: #EAFCFF;
    text-align: center;
}

.contests-stats-section section {
    margin: 30px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 30px;
}

.contests-stats-section .stats {
    width: calc(25% - 20px);
    min-height: 124px;
    background: #FFFFFF;
    border-radius: 12px;
    box-shadow: 0px 2px 15px 0px #D3F0F5;
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    font-size: 24px;
    font-weight: 400;
    line-height: 1.2;
    color: #4F4E50;
}

.contests-stats-section .stats strong {
    display: block;
    font-size: 32px;
    font-weight: 700;
}

.contests-stats-section .stats .image-overlay {
    position: absolute;
    top: auto;
    bottom: 5px;
    left: 5px;
    width: calc(100% - 10px);
    height: 42px;
    object-fit: cover;
    z-index: -1;
}

.black {
    color: #3E3D58 !important;
}

.green {
    color: #129D4E !important;
}

.yellow {
    color: #E9B600 !important;
}

.orange {
    color: #EE9B6E !important;
}

#counter span.title {
    display: block;
    white-space: nowrap;
}

@media only screen and (max-width:760px) {
    .contests-stats-section {
        padding: 20px 0;
    }

    .contests-stats-section section {
        margin: 10px 0;
        gap: 10px;
    }

    .contests-stats-section .stats {
        width: calc(25% - 5px);
        min-height: 70px;
        border-radius: 8px;
        font-size: 12px;
    }

    .contests-stats-section .stats strong {
        font-size: 16px;
    }

    .contests-stats-section .stats .image-overlay {
        display: none;
    }
}

.oops-section {
    padding: 60px 0;
    background-color: #F4F7F8;
}

.oops-section .container {
    max-width: 990px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 50px;
}

.oops-section figure,
.oops-section article {
    width: 50%;
}

.oops-section p {
    font-size: 22px;
}

@media only screen and (max-width:760px) {
    .oops-section {
        padding: 30px 0;
    }

    .oops-section .container {
        flex-wrap: wrap;
        gap: 20px;
    }

    .oops-section figure,
    .oops-section article {
        width: 100%;
    }

    .oops-section p {
        font-size: 18px;
    }

    .oops-section .btn-01 {
        display: inline-block;
    }
}

.recent-winners-section {
    padding: 50px 0 0 0;
    text-align: center;
}

.winners-js {
    margin: 15px -15px 0 -15px;
}

.winners-js .item {
    padding: 15px;
}

.winner {
    background-color: #FFFFFF;
    border-radius: 10px;
    box-shadow: 0px 0px 15px 0px #DFEAEB;
    padding: 5px;
}

.winner figure img {
    border-radius: 5px;
}

.winner .avatar {
    margin: -35px auto 0 auto;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    overflow: hidden;
}

.winner h4 {
    font-weight: 700;
}

.daily {
    background-color: #12B3471A;
    border-radius: 20px;
    padding: 7px 15px;
    font-size: 16px;
    color: #12B347;
    display: inline-block;
}

.weekly {
    background-color: #FCB2051A;
    border-radius: 20px;
    padding: 7px 15px;
    font-size: 16px;
    color: #FCB205;
    display: inline-block;
}

.monthly {
    background-color: #9747FF1A;
    border-radius: 20px;
    padding: 7px 15px;
    font-size: 16px;
    color: #9747FF;
    display: inline-block;
}

.quarterly {
    background-color: #0049D01A;
    border-radius: 20px;
    padding: 7px 15px;
    font-size: 16px;
    color: #0049D0;
    display: inline-block;
}

.yearly {
    background-color: #EC21801A;
    border-radius: 20px;
    padding: 7px 15px;
    font-size: 16px;
    color: #EC2180;
    display: inline-block;
}


@media only screen and (max-width:760px) {
    .recent-winners-section {
        padding: 20px 0;
    }

    .winners-js {
        margin: 0 -15px;
    }

    .daily,
    .weekly,
    .monthly,
    .quarterly,
    .yearly {
        font-size: 14px;
    }
}

@media only screen and (min-width:761px) and (max-width:1023px) {}

@media only screen and (min-width:1024px) and (max-width:1230px) {}

.watchlists-section {
    padding: 50px 0;
    background-color: #EAFCFF;
}

@media only screen and (max-width:760px) {
    .watchlists-section {
        padding: 20px 0;
    }

    .watchlists-section .contestst-wrapper .contestst {
        background-color: #EAFCFF;
    }
}

.how-It-works-section {
    padding: 75px 0;
}

.how-It-works-section .container {
    display: flex;
    justify-content: space-between;
    gap: 30px;
}

.how-It-works-section figure,
.how-It-works-section article {
    margin: 0;
    padding: 0;
    width: 50%;
}

.how-It-works-section figure img {
    border-radius: 12px;
}

.how-It-works-section article h4 {
    padding: 0;
}

.how-It-works-section article .btn-01 {
    display: inline-block !important;
}

.how-It-works-section article ol {
    margin: 10px 0 0 40px;
    padding: 0;
    list-style-type: none;
    counter-reset: ordered;
}

.how-It-works-section article li {
    margin-bottom: 15px;
    font-size: 18px;
    font-weight: 500;
    position: relative;
}

.how-It-works-section article li::after {
    width: 30px;
    height: 30px;
    background-color: #E9E9E9;
    border-radius: 50%;
    content: counter(ordered);
    counter-increment: ordered;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 16px;
    font-weight: 500;
    color: #374550;
    margin-left: -40px;
    padding: 0;
    position: absolute;
    left: 0;
}

.how-It-works-section article li::before {
    content: "";
    width: 1px;
    height: 100%;
    background-color: #E9E9E9;
    position: absolute;
    left: -25px;
    top: 15px;
}

.how-It-works-section article li:last-child::before {
    display: none;
}


@media only screen and (max-width:760px) {
    .how-It-works-section {
        padding: 25px 0;
    }

    .how-It-works-section .container {
        flex-wrap: wrap;
        gap: 15px;
    }

    .how-It-works-section figure,
    .how-It-works-section article {
        width: 100%;
    }

    .how-It-works-section figure img {
        border-radius: 8px;
    }

    .how-It-works-section article li {
        font-size: 16px;
    }
}

@media only screen and (min-width:761px) and (max-width:1023px) {}

@media only screen and (min-width:1024px) and (max-width:1230px) {}

/* 	-----------------------------------------------------
    -------------------- Footer Styles ------------------
    ----------------------------------------------------- */
.footer-section {
    background-color: #26304E;
    text-align: center;
}

.footer-section figure {
    padding: 50px 0;
}

.footer-section ul.links {
    margin: 0;
    padding: 20px 0;
    list-style: none;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0 40px;
    border: 1px solid #FFFFFF66;
    border-width: 1px 0;
}

.footer-section ul.links li {
    margin: 0;
    padding: 0;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.4;
    color: #FFFFFF;
}

.footer-section ul.links li a {
    color: #FFFFFF;
    transition: .5s;
}

.footer-section ul.links li a:hover,
.footer-section ul.links li a.active {
    color: #ecba09;
    transition: .5s;
}

.footer-section .social {
    padding: 50px 0;
    background-color: #26304E;
    color: #FFFFFF;
    position: relative;
    text-align: center;
    white-space: nowrap;
}

.footer-section .social:before {
    border-bottom: 1px solid #FFFFFF66;
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    width: 100%;
}

.footer-section .social-list {
    background-color: inherit;
    margin: 0;
    padding: 0 30px;
    position: relative;
    z-index: 1;
    list-style: none;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 30px;
}

.footer-section .social-list li a {
    width: 50px;
    height: 50px;
    background-color: #FFFFFF1A;
    border-radius: 50%;
    font-size: 24px;
    color: #FFFFFF;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: .5s;
}

.footer-section .social-list li a:hover {
    background-color: #ecba09;
    transition: .5s;
}

.footer-section p {
    padding: 0 0 30px 0;
    font-size: 20px;
    font-weight: 400;
    line-height: 1.4;
    color: #FFFFFF;
}

.footer-mobile-section {
    display: none;
    background-color: #FFFFFF;
    border-top: 1px solid #AAD7FF;
    width: 100%;
    min-height: 80px;
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 999;
}

.footer-mobile-section ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer-mobile-section ul li {
    width: 25%;
    font-size: 10px;
    font-weight: 400;
    line-height: 1.4;
    color: #4F4E50;
    text-transform: uppercase;
    text-align: center;
}

.footer-mobile-section ul li a {
    display: block;
    padding: 20px 0;
    color: #4F4E50;
    transition: .5s;
}

.footer-mobile-section ul li a i {
    display: block;
    font-size: 20px;
    margin-bottom: 5px;
}

.footer-mobile-section ul li a.active {
    color: #0093CE;
    position: relative;
    z-index: 1;
    transition: .5s;
}

.footer-mobile-section ul li a.active::after {
    content: "";
    width: 6px;
    height: 2px;
    background-color: #0093CE;
    border-radius: 2px;
    position: absolute;
    left: 50%;
    bottom: 15px;
    transform: translate(-50%, 0);
}

@media only screen and (max-width:760px) {
    .footer-section {
        display: none;
    }

    .footer-mobile-section {
        display: block;
    }
}

@media only screen and (min-width:761px) and (max-width:1023px) {
    .footer-section ul.links {
        flex-wrap: wrap;
        gap: 20px 30px;
    }

    .footer-section ul.links li {
        font-size: 16px;
    }

    .footer-section p {
        font-size: 18px;
    }
}

@media only screen and (min-width:1024px) and (max-width:1230px) {
    .footer-section ul.links {
        gap: 0 30px;
    }
}


/* contest popup style */
.contest-popup {
    position: fixed;
    top: 0;
    right: -100%;
    z-index: 10;
    width: 100%;
    max-width: 740px;
    height: 100%;
    background: #FFFFFF;
    opacity: 0;
    transition: 0.4s;
}

.contest-popup.show {
    right: 0;
    opacity: 1;
}

.contest-popup-scroll {
    overflow: hidden auto;
    height: 100%;
    scrollbar-width: thin;
    padding: 24px;
}

.popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9;
    width: 100%;
    height: 100%;
    background: rgba(16, 10, 46, 0.5);
    visibility: hidden;
    opacity: 0;
    transition: 0.4s;
}

.popup-overlay.active {
    visibility: visible;
    opacity: 1;
}

.contest-popup-image img {
    display: block;
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-radius: 8px;
}

.contest-popup-body {
    margin: 20px 0 70px 0;
}

.contest-detail-price {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}

.tag-text-flex {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.tag-text-flex span:first-child {
    display: inline-block;
    font-size: 14px;
    line-height: 10px;
    font-weight: 400;
    color: #1E1E28;
    background: #FFD5B6;
    border-radius: 20px;
    padding: 6px;
}

.contest-title-detl h5 {
    font-size: 20px;
    line-height: 1.2em;
    font-weight: 600;
    color: #1E1E28;
    padding: 10px 0 6px 0;
}

.contest-title-detl p {
    font-size: 14px;
    padding: 0;
}

.contest-title-detl p strong {
    font-weight: 500;
    color: #1E1E28;
}

.price-and-watch h5 {
    padding: 0 0 18px 0;
}

.price-and-watch .btn-watch {
    margin: 0;
}

.contest-popup-col {
    border: 1px solid #DBE3E7;
    border-radius: 6px;
    padding: 16px;
    margin-top: 16px;
}

ul.price-listing {
    list-style: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}

ul.price-listing li {
    font-size: 14px;
    line-height: 1;
    font-weight: 400;
    color: #4F4E50;
    margin: 0;
}

ul.price-listing li strong {
    font-size: 16px;
    font-weight: 600;
    color: #1E1E28;
}

.contest-popup-col .popup-col-heading {
    font-size: 16px;
    line-height: 1;
    font-weight: 500;
    color: #1E1E28;
    border-bottom: 1px solid #DBE3E7;
    padding: 0 16px 12px 16px;
    margin: 0 -16px;
}

.contest-popup-col p {
    padding: 10px 0 0 0;
}

.contest-popup-col p a {
    display: inline-block;
    font-weight: 600;
    text-decoration-line: underline;
    color: #0093CE;
}

.contest-popup-col p a:hover {
    text-decoration: none;
}

.contest-popup-footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    border-top: 1px solid #DBE3E7;
    padding: 12px 24px 0 24px;
    margin: 0 -24px;
}

.contest-popup-footer a {
    font-size: 16px;
    line-height: 12px;
    font-weight: 500;
    color: #FFFFFF;
    border-radius: 6px;
    background: #0093CE;
    padding: 16px 64px;
}

.contest-popup-footer a:hover,
.contest-popup-footer a:first-child {
    background: rgba(0, 147, 206, 0.2);
    color: #0093CE;
}

.contest-popup-footer a:first-child:hover {
    background: rgba(0, 147, 206, 1);
    color: #FFFFFF;
}

/* .cat-list a {
    font-size: 16px;
    line-height: 12px;
    font-weight: 500;
    color: #FFFFFF;
    border-radius: 6px;
    background: #0093CE;
    padding: 16px 64px;
}

.cat-list a:hover,
.cat-list a:first-child {
    background: rgba(0, 147, 206, 0.2);
    color: #0093CE;
}

.cat-list a:first-child:hover {
    background: rgba(0, 147, 206, 1);
    color: #FFFFFF;
} */

.close-popup {
    position: absolute;
    top: 16px;
    left: -20px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    background: #FFFFFF;
    border: 1px solid #1E1E28;
    border-radius: 50%;
    cursor: pointer;
    transition: 0.3s;
}

.close-popup:hover {
    background: #F60F54;
    border-color: #F60F54;
}

.close-popup:hover img {
    filter: brightness(0) invert(1);
}

@media (max-width: 1199px) {
    .contest-popup {
        max-width: 680px;
    }
}

@media (max-width: 767px) {
    .contest-popup {
        max-width: 340px;
    }

    .contest-popup-scroll {
        padding: 15px;
    }

    .contest-popup-body {
        margin: 15px 0 30px 0;
    }

    ul.price-listing {
        gap: 15px 0;
    }

    .contest-popup-footer a {
        font-size: 14px;
        padding: 12px 20px;
    }
}


/* LOGIN PAGE STYLE */
.header-section.default-header {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2;
    width: 100%;
    min-height: auto;
    background: transparent;
    box-shadow: none;
    padding: 20px 0 0 0;
}

.default-header figure a {
    display: block;
}

.back-home-btn a {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 18px;
    line-height: 22px;
    font-weight: 400;
    color: #374550;
    transition: 0.4s;
}

.back-home-btn a span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    background: #FFFFFF;
    border: 1px solid #BCC3C7;
    border-radius: 50%;
    transition: 0.4s;
}

.back-home-btn a:hover {
    text-decoration: underline;
    color: #f3c315;
}

.back-home-btn a:hover span {
    background: #f3c315;
    border-color: #f3c315;
}

.back-home-btn a:hover span img {
    filter: brightness(0) invert(1);
}

@media (max-width: 767px) {
    .default-header figure {
        display: block;
        max-width: 135px;
        height: auto;
    }

    .back-home-btn a {
        font-size: 14px;
        line-height: 1;
    }
}

.page-content {
    position: relative;
    z-index: 1;
    min-height: 100vh;
    background: #F4F7F8;
    padding-top: 140px;
}

.page-content .container {
    position: relative;
}

.dot-shape {
    position: absolute;
    top: -22px;
    right: 0;
    z-index: -1;
    max-height: 150px;
}

.hand-with-camera {
    display: none;
    position: absolute;
    bottom: 0;
    left: 14.583vw;
    z-index: -1;
}

.form-content-wrap {
    max-width: 500px;
    background: #FFFFFF;
    box-shadow: 0px 2px 24px rgba(234, 240, 243, 0.5);
    border-radius: 12px;
    padding: 25px 15px;
    margin: 0 auto;
}

.form-heading {
    text-align: center;
    margin-bottom: 20px;
}

.form-heading h4 {
    font-size: 24px;
    line-height: 1;
    font-weight: 700;
    color: #0A0E11;
    padding: 0 0 10px 0;
}

.form-heading p {
    font-size: 14px;
    line-height: 1.222223em;
    font-weight: 400;
    color: #4F4E50;
}

.form__flex {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    gap: 16px 0;
}

.form__column {
    position: relative;
}

.form__column input,textarea {
    width: 100%;
    height: 44px;
    border: 1px solid #BDCAD0;
    border-radius: 6px;
    font-size: 14px;
    color: #4F4E50;
    padding: 0 12px;
}

.form__column textarea {
    width: 100%;
    height: 44px;
    border: 1px solid #BDCAD0;
    border-radius: 6px;
    font-size: 14px;
    color: #4F4E50;
    padding: 0 12px;
}
.form__column textarea::placeholder {
    font-size: 14px;
    color: #374550;
}

.form__column textarea:focus {
    border-color: #0093CE;
}

.form__column input::placeholder {
    font-size: 14px;
    color: #374550;
}

.form__column input:focus {
    border-color: #0093CE;
}

.form__column .input-icon {
    position: absolute;
    top: 12px;
    right: 12px;
    font-size: 20px;
    line-height: 1;
    color: rgba(55, 69, 80, 0.7);
}

.form__column .input-icon img {
    max-width: 20px;
    opacity: 0.8;
}

.form__column .input-icon .close {
    display: none;
}

.form__column .input-icon.show .close {
    display: block;
}

.form__column .input-icon.show .open {
    display: none;
}

.form__column .iti--allow-dropdown {
    position: relative;
    width: 100%;
}

.iti__flag-container {
    margin: 4px;
}

.iti--separate-dial-code .iti__selected-flag {
    background: #F4F7F8;
    border-radius: 4px;
    padding: 0 5px 0 5px;
}

.iti__selected-dial-code {
    font-family: 'Inter';
    font-weight: 400;
    font-size: 14px;
    line-height: 17px;
    color: #1E1E28;
}

.iti__arrow {
    position: relative;
    border: none;
    background: url(../images/dd-arrow.png) no-repeat center 1px;
    width: 20px;
    height: 20px;
    margin-left: 4px;
}

.iti__country-list {
    top: 50px;
}

.check-forgot-col {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.checkbox-wrap input {
    display: none;
}

.checkbox-wrap label {
    position: relative;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #1E1E28;
    padding-left: 28px;
}

.checkbox-wrap label::before {
    position: absolute;
    content: "";
    top: 50%;
    left: 0;
    transform: translate(0, -50%);
    width: 20px;
    height: 20px;
    background: #377CF4;
    box-shadow: inset 0px 3px 4px rgba(0, 0, 0, 0.35);
    border-radius: 4px;
}

.checkbox-wrap label::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 7px;
    width: 4px;
    height: 10px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
    background: transparent;
    border-radius: 0;
    opacity: 0;
}

.checkbox-wrap input:checked+label::after {
    opacity: 1;
}

.forgot-pass a {
    font-size: 14px;
    line-height: 1;
    font-weight: 500;
    text-decoration-line: underline;
    color: #0093CE;
}

.forgot-pass a:hover {
    text-decoration: none;
    color: #1E1E28;
}

.submit-col button {
    border: none;
    width: 100%;
    height: 44px;
    background: #0093CE;
    border-radius: 6px;
    font-weight: 500;
    font-size: 16px;
    line-height: 1;
    color: #FFFFFF;
    cursor: pointer;
}

.form-devider {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: center;
    padding: 16px 0;
}

.form-devider::before {
    position: absolute;
    content: "";
    top: 50%;
    left: 0;
    transform: translate(0, -50%);
    z-index: -1;
    width: 100%;
    height: 1px;
    background: #C5D1D6;
}

.form-devider span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: #FFFFFF;
    border: 1px solid #C5D1D5;
    border-radius: 50%;
    font-style: italic;
    font-weight: 400;
    font-size: 12px;
    line-height: 15px;
    color: #1E1E28;
}

.login-with-google button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    height: 44px;
    background: #FFFFFF;
    border: 1px solid rgba(0, 0, 0, 0.25);
    border-radius: 6px;
    font-weight: 400;
    font-size: 14px;
    line-height: 1;
    color: #1E1E28;
    cursor: pointer;
}

.form-bottom-btn p {
    font-size: 14px;
    line-height: 1.2em;
    font-weight: 400;
    color: #374550;
    text-align: center;
    margin-top: 16px;
}

.form-bottom-btn p a {
    font-weight: 600;
    color: #0093CE;
    text-decoration: underline;
}

@media (min-width: 768px) {
    .form-content-wrap {
        padding: 32px 25px;
    }

    .form-heading h4 {
        font-size: 32px;
        padding: 0 0 15px 0;
    }

    .form-heading p {
        font-size: 18px;
    }

    .form__column input {
        font-size: 16px;
    }

    .checkbox-wrap label {
        font-size: 16px;
    }

    .forgot-pass a {
        font-size: 16px;
    }

    .submit-col {
        margin-top: 8px;
    }

    .form-devider {
        padding: 24px 0;
    }

    .login-with-google button {
        height: 48px;
    }

    .form-bottom-btn p {
        font-size: 18px;
    }

    .dot-shape {
        top: -36px;
        right: 50px;
        max-height: unset;
    }
}

@media (min-width: 1200px) {
    .form-content-wrap {
        margin: 0 75px 0 auto;
    }

    .hand-with-camera {
        display: block;
    }

    .dot-shape {
        right: 30px;
    }

    .submit-col button:hover {
        background: #2d73f6d7;
    }

    .login-with-google button:hover {
        background: rgba(18, 179, 71, 0.3);
        border-color: rgba(18, 179, 71, 0.3);
    }

    .form-bottom-btn p a:hover {
        text-decoration: none;
        color: #263137;
    }
}


/* INNER BANNER STYLE */
.inner-banner {
    background: #F4F7F8;
}

.inner-banner h1 {
    font-size: 32px;
    line-height: 1;
    font-weight: 600;
    color: #1E1E28;
    padding: 26.5px 0;
}

@media (max-width: 767px) {
    .inner-banner h1 {
        font-size: 26px;
    }
}

.contest--list .title-search-filter {
    flex-direction: row-reverse;
}

.search-filter-panel {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
}

@media (max-width: 1199px) {
    .contest--list .title-search-filter {
        flex-direction: column-reverse;
        align-items: flex-start;
    }

    .contest--list ul.category-list {
        gap: 10px;
    }
}

@media (max-width: 767px) {
    .select-box {
        width: 100%;
    }
}


/* Contests Submissions style */
.inner-banner.inner-banner--transparent {
    background: transparent;
}

.breadcum-wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 24px;
    padding: 24px 0;
}

.back-previous a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    font-size: 22px;
    line-height: 1;
    color: #1E1E28;
}

.back-previous a:hover {
    color: #0093CE;
}

ul.breadcum-listing {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 0 0 0 -4px;
}

ul.breadcum-listing li {
    position: relative;
    font-size: 16px;
    line-height: 20px;
    font-weight: 400;
    color: #4F4E50;
    padding: 0 24px 0 4px;
}

ul.breadcum-listing li.current,
ul.breadcum-listing li:hover {
    font-weight: 500;
    color: #1E1E28;
}

ul.breadcum-listing li::after {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    content: "\e90d";
    font-size: 18px;
    line-height: 1;
    color: #889299;
    font-family: 'icomoon' !important;
}

ul.breadcum-listing li:last-child {
    padding: 0 0 0 4px;
}

ul.breadcum-listing li:last-child:after {
    display: none;
}

ul.breadcum-listing li a {
    color: #4F4E50;
}

.contest-submissions {
    margin: 0 0 80px 0;
}

.submissions-title-serach {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 30px;
}

.submissions-title-serach h3 {
    line-height: 1;
    padding: 0;
}

.submissions-title-serach .select-box {
    width: 28%;
    min-width: 180px;
}

.submissions-title-serach .select-box select {
    height: 36px;
    border-radius: 6px;
}

.submissions-title-serach .select-box::after {
    color: #889299;
}

.submissions-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
}

.submissions-card {
    width: calc(25% - 22.5px);
    cursor: pointer;
}

.submissions-card-image {
    position: relative;
    overflow: hidden;
    border-radius: 6px;
}

.subms-card-img {
    display: block;
    width: 100%;
    height: 155px;
    object-fit: cover;
}

.icon-overlay {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(11.9737px);
    transition: 0.3s;
}

.submissions-card:hover .icon-overlay {
    opacity: 0;
}

.submited-person-details {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding-top: 12px;
}

.submited-person-details img {
    display: block;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    object-fit: cover;
}

.submited-person-details p {
    font-size: 18px;
    line-height: 1;
    font-weight: 500;
    color: #4F4E50;
    padding: 0 0 0 10px;
}

@media (max-width: 1199px) {
    .contest-submissions {
        margin: 0 0 60px 0;
    }

    .submissions-title-serach .select-box {
        width: 30%;
    }

    .submissions-card {
        width: calc(33.33% - 20px);
    }

    .submited-person-details p {
        font-size: 16px;
    }
}

@media (max-width: 767px) {
    .breadcum-wrap {
        gap: 12px;
    }

    .back-previous a {
        width: 25px;
        height: 25px;
    }

    ul.breadcum-listing li {
        font-size: 14px;
        line-height: 18px;
        padding: 0 22px 0 4px;
    }

    ul.breadcum-listing li::after {
        width: 18px;
        height: 18px;
        font-size: 16px;
    }

    .contest-submissions {
        margin: 0 0 45px 0;
    }

    .submissions-title-serach {
        gap: 15px 0;
    }

    .submissions-wrap {
        gap: 20px;
    }

    .submissions-card {
        width: calc(50% - 10px);
    }

    .subms-card-img {
        height: 130px;
    }

    .icon-overlay img {
        max-width: 30px;
    }

    .submited-person-details img {
        width: 25px;
        height: 25px;
    }

    .submited-person-details p {
        font-size: 14px;
    }
}

/* Contests Submissions style */

/* MY CONTEST PAGE STYLE */
.my-contest-page {
    padding: 30px 0 100px 0;
}

.my-contest-page .search input {
    min-width: 250px;
}

ul.tabs-listing {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    list-style: none;
    padding-left: 0;
}

ul.tabs-listing li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 18px;
    line-height: 22px;
    font-weight: 500;
    color: #0093CE;
    background: rgba(0, 147, 206, 0.1);
    border: 1px solid rgba(0, 147, 206, 0.2);
    border-radius: 8px;
    cursor: pointer;
    user-select: none;
    transition: 0.3s;
    padding: 6px 8px 6px 16px;
    margin: 0;
}

ul.tabs-listing li.active {
    background: #0093CE;
    border-color: #0093CE;
    color: #FFFFFF;
}

ul.tabs-listing li span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: #FFFFFF;
    border-radius: 50%;
    font-weight: 500;
    font-size: 14px;
    line-height: 1;
    color: #1E1E28;
    transform: 0.3s;
}

ul.tabs-listing li.active span {
    color: #0093CE;
}

.tabs-content {
    /* display: none; */
    margin-top: 30px;
}

.my-contest-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
}

.my-contest-cards {
    width: calc(33.33% - 20px);
    background: #FFFFFF;
    border: 1px solid #DBE3E7;
    border-radius: 12px;
    overflow: hidden;
    padding: 5px;
}

.js-my-contest-slider .slick-dots {
    bottom: 12px;
    padding: 0;
}

.slick-list>div {
    font-size: 0;
}

.my-contest-slider-col img {
    display: block;
    width: 100%;
    height: 208px;
    object-fit: cover;
    border-radius: 8px;
}

.my-contest-details {
    padding: 10px 5px 5px 5px;
}

.my-contest-details h4 {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    font-size: 20px;
    line-height: 1;
    font-weight: 700;
    color: #1E1E28;
    padding: 0;
}

.my-contest-details h3 {
    font-size: 18px;
    line-height: 1.22223em;
    font-weight: 600;
    color: #1E1E28;
    padding: 10px 0 6px 0;
}

.my-contest-status {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}

.my-contest-status p {
    font-size: 14px;
    line-height: 1;
    padding: 0;
}

.my-contest-status p strong {
    font-weight: 500;
    color: #1E1E28;
}

@media (max-width: 1199px) {
    .my-contest-page {
        padding: 20px 0 70px 0;
    }

    ul.tabs-listing {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 10px;
    }

    .my-contest-page .search-filter-panel {
        width: 100%;
    }

    .my-contest-cards {
        width: calc(50% - 15px);
    }
}

@media (max-width: 767px) {
    .my-contest-page {
        padding: 20px 0 50px 0;
    }

    .my-contest-cards {
        width: 100%;
    }

    .my-contest-slider-col img {
        height: 185px;
    }
}

/* MY CONTEST PAGE STYLE */

/* Submission 23/04/25 */

.submission-block {
    background: #F4F7F8;
}

.submission-block .recent-contestst-section {
    padding: 0px 0 20px 0;
}

.submission-block .contest-item {
    padding: 20px 0 20px;
    border-top: 1px solid #37455033;
    border-bottom: 1px solid #37455033;
    display: flex;
    justify-content: space-between;
}

/*  */
.images-uploads {
    padding: 30px 0 30px;
}

.images-uploads .form-group {
    width: 100%;
    height: 400px;
    background: rgba(0, 147, 206, 0.1);
    border: 1px solid rgba(0, 147, 206, 0.1);
    border-radius: 20px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-bottom: 30px;
}

.images-uploads .form-group label {
    text-align: center;
}

.upload-icon {
    width: 120px;
    height: 120px;
    background: #FFFFFF;
    border: 2.48949px solid rgba(0, 147, 206, 0.3);
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
}

.upload-icon i {
    font-size: 60px;
    color: #0093CE;
}

.images-uploads .form-group label h3 {
    font-weight: 500;
    font-size: 20px;
    line-height: 25px;
    text-align: center;
    color: #1E1E28;
}

.images-uploads .form-group label p {
    font-weight: 400;
    font-size: 20px;
    line-height: 25px;
    text-align: center;
    color: #4F4E50;
}

.images-uploads .form-group input {
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 5;
}

.images-uploads .form-group::after {
    content: "";
    position: absolute;
    top: 10px;
    left: 10px;
    width: calc(100% - 20px);
    height: calc(100% - 20px);
    border: 2px dashed #0093CE;
    border-radius: 10px;
}

.img-thumbs-hidden {
    display: none;
}

.wrapper-thumb {
    position: relative;
    display: inline-block;
    background: #FFFFFF;
    border: 1px solid #DBE3E7;
    border-radius: 12px;
    padding: 5px 5px 12px 5px;
    margin-bottom: 30px;
    width: 100%;
}

.wrapper-thumb::before {
    content: "Add Image Title";
    position: absolute;
    top: 221px;
    left: 9px;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 19px;
    color: #4F4E50;
}

.img-preview-thumb {
    border-radius: 0.25rem;
    width: 100%;
    height: 208px;
    object-fit: cover;
    border-radius: 8px;
    margin-bottom: 36px;
}

.img-caption {
    width: calc(100% - 6px);
    height: 45px;
    background: #FFFFFF;
    border: 1px solid #BDCAD0;
    border-radius: 8px;
    padding: 10px 14px;
    margin-left: 3px;

}

.img-caption::placeholder {
    font-family: 'Inter';
    font-weight: 400;
    font-size: 16px;
    line-height: 19px;
    color: #4F4E50;
}

.remove-btn {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 18px;
    color: #fff;
    top: 10px;
    right: 10px;
    width: 32px;
    height: 32px;
    background: rgba(0, 0, 0, 0.2);
    border-radius: 10px;
    font-weight: bold;
    cursor: pointer;
}

.remove-btn:hover {
    box-shadow: 0px 0px 3px grey;
    transition: all .3s ease-in-out;
}

.images-uploads-button {
    background: #F4F7F8;
    border: 1px solid #BBC2C6;
    border-radius: 10px;
}

.images-uploads-button {
    padding: 20px 16px;
    margin-top: 0px;
}

.pay-button a {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    text-align: center;
    color: #FFFFFF;
    padding: 12px 4px;
    background: #0093CE;
    border: #0093CE 1px solid;
    width: 100%;
    display: inline-block;
    border-radius: 6px;
}

.pay-button a:hover {
    background: #000;
    color: #fff;
}

.pay-button a:last-child {
    border: #0093CE 1px solid;
    background: transparent;
    color: #0093CE;
}

.pay-button a:last-child:hover {
    border-color: #000;
    color: #000;
}

.pay-button a+a {
    margin-top: 12px;
}

.images-uploads-button__content {
    padding-bottom: 15px;
}

.images-uploads-button__content p {
    padding: 0 0 0px;
}

@media (min-width:768px) {
    .images-uploads .form-group label h3 {
        font-size: 32px;
        line-height: 39px;
    }

    .images-uploads .form-group label p {
        font-size: 24px;
        line-height: 29px;
    }

    .images-uploads .form-group::after {
        top: 22px;
        left: 25px;
        width: calc(100% - 50px);
        height: calc(100% - 44px);
        border: 2px dashed #0093CE;
        border-radius: 10px;
    }

    .img-thumbs {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        margin: 0 -15px;
    }

    .wrapper-thumb {
        width: calc(50% - 30px);
        margin: 0 15px 30px;
    }
}


@media (min-width:1200px) {
    .images-uploads {
        padding: 30px 0 80px;
    }

    .wrapper-thumb {
        width: calc(33.333% - 30px);
        margin: 0 15px 30px;
    }

    .images-uploads-button {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
    }

    .images-uploads-button__content {
        margin-right: 30px;
        width: calc(100% - 245px);
        padding-bottom: 0px;
    }

    .images-uploads-button__content p {
        padding: 0 0 0px;
    }

    .alert-octagon {
        width: 30px;
        margin-right: 10px;
    }

    .pay-button {
        width: 175px;
    }

    .pay-button {
        position: relative;
        margin: -12px 0 -12px;
    }
}

/* Gallery */

.btn-upload {
    display: inline-block;
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 10px 24px 10px 12px;
    background: #0093CE;
    border-radius: 6px;
    font-weight: 500;
    font-size: 16px;
    line-height: 19px;
    color: #FFFFFF;
    border: none;
}

.btn-upload img {
    margin-right: 10px;
}

.btn-upload i {
    margin-right: 10px;
    font-size: 24px;
}

.btn-upload:hover {
    color: #fff;
    background: #000;
}

.gallery-item {
    background: #FFFFFF;
    border: 1px solid #DBE3E7;
    border-radius: 12px;
    padding: 5px 5px 9px 5px;
    margin-bottom: 30px;
}

.gallery-item p {
    font-weight: 400;
    font-size: 16px;
    line-height: 19px;
    color: #4F4E50;
    padding: 6px 0 6px 7px;
}

.gallery-item img {
    width: 100%;
    height: 208px;
    object-fit: cover;
    border-radius: 8px;
}

@media (min-width:768px) {
    .gallery-wrap {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        margin: 0 -15px;
    }

    .gallery-item {
        width: calc(50% - 30px);
        margin: 0 15px 30px;
    }
}

@media (min-width:1200px) {
    .gallery-item {
        width: calc(33.33% - 30px);
        margin: 0 15px 30px;
    }
}


.btn-daily-contest {
    display: inline-block;
    padding: 3px 6px;
    background: rgba(18, 179, 71, 0.1);
    border-radius: 20px;
    font-family: "Inter", sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 17px;
    color: #12B347;
}

.btn-daily-contest:hover {
    color: #fff;
    background: #000;

}

.Watchlists-content__left h3 {
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 22px;
    color: #1E1E28;
}

.Watchlists-content__left p {
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 17px;
    color: #4F4E50;
    padding: 0;

}

.Watchlists-content {
    display: flex;
    justify-content: space-between;
    margin: 10px 7px 0;
    position: relative;
}

.Watchlists-content__right {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
}

.Watchlists-content__right p {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-size: 20px;
    line-height: 24px;
    text-align: right;
    color: #1E1E28;
    padding: 0;
}

.btn-participate {
    color: #0093CE;
    background: rgba(0, 147, 206, 0.1);
    padding: 4px 6px;
    color: #0093CE !important;
}

.btn-participate:hover {
    color: #fff !important;
}

.btn-weekly {
    background: rgba(252, 178, 5, 0.1);
    color: #FCB205;
}

.btn-monthly {
    color: #9747FF;
    background: rgba(151, 71, 255, 0.1);
}

.btn-quarterly {
    color: #0049D0;
    background: rgba(0, 73, 208, 0.1);
}

.btn-yearly {
    color: #EC2180;
    background: rgba(236, 33, 128, 0.1);
}

.js-Watchlists-image .slick-dots {
    bottom: 20px;
}

.js-Watchlists-image .slick-dots li {
    width: 8px;
    height: 8px;
}

.js-Watchlists-image .slick-dots li button {
    width: 8px;
    height: 8px;
}

.js-Watchlists-image .slick-dots li button::before {
    width: 8px;
    height: 8px;
    background: rgba(236, 186, 9, 0.3);
}

.js-Watchlists-image .slick-dots li.slick-active button::before {
    background-color: #ECBA09;
    width: 8px;
    height: 8px;
}


/*  */



.custom-popup {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    font-family: Arial;
    background: rgba(0, 0, 0, 0.4);
    z-index: 150;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 1;
    /* pointer-events: none; */
    transition: opacity 110.145ms 0ms;
}

.custom-popup__holder {
    max-width: 450px;
    width: 100%;
    height: auto;
    background: #fff;
    border-radius: 20px;
    padding: 32px 24px 24px;
    display: flex;
    flex-flow: column wrap;
    justify-content: space-between;
    position: relative;
    opacity: 1;
    transform: translateY(-100px);
    transition: opacity 400ms, transform 400ms;
    transition-delay: 300ms;
}

.custom-popup__title {
    font-size: 28px;
    line-height: 30px;
    margin-bottom: 40px;
}

.custom-popup__content {
    flex: 1;
    font-size: 22px;
    line-height: 24px;
}

.custom-popup__footer {
    font-size: 28px;
    line-height: 30px;
}

.custom-popup__close {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 30px;
    height: 30px;
    cursor: pointer;
    transition: 0.3s transform;
}

.custom-popup__close:before,
.custom-popup__close:after {
    content: "";
    position: absolute;
    left: 15px;
    top: 3px;
    display: block;
    width: 2px;
    height: 26px;
    background: #000;
    transform: rotate(45deg);
}

.custom-popup__close:after {
    left: 15px;
    top: 3px;
    transform: rotate(-45deg);
}

.custom-popup__close:hover {
    transform: rotate(90deg);
}

.custom-popup.is-active {
    opacity: 1;
    pointer-events: auto;
}

.custom-popup.is-active .custom-popup__holder {
    opacity: 1;
    transform: translateY(0);
}

.succesfully-icon {
    width: 100px;
    height: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 28px;
    background: rgba(0, 204, 179, 0.1);
    border-radius: 80px;
    margin: 0 auto;
}

.custom-popup__content h2 {
    font-weight: 600;
    font-size: 32px;
    line-height: 41px;
    text-align: center;
    color: #1E1E28;
    padding: 10px 0 0 0;
}

.custom-popup__content p {
    font-weight: 400;
    font-size: 18px;
    line-height: 22px;
    text-align: center;
    color: #4F4E50;
    padding: 22px 0 22px;
}

.custom-popup__content p span {
    display: block;
}

.custom-popup__button a {
    width: 100%;
    display: inline-block;
    font-weight: 500;
    font-size: 18px;
    line-height: 22px;
    text-align: center;
    color: #0093CE;
    padding: 11px 24px;
    background: #FFFFFF;
    border: 1px solid #0093CE;
    border-radius: 6px;
}

.custom-popup__button a:hover {
    border: 1px solid #000;
    color: #000;
}

.custom-popup__button a+a {
    margin-top: 12px;
}

.custom-popup__button a:last-child {
    background: #0093CE;
    color: #fff;
}

.custom-popup__button a:last-child:hover {
    background: transparent;
    border: 1px solid #000;
    color: #000;
}

@media (min-width:768px) {
    .succesfully-icon {
        width: 140px;
        height: 140px;
    }
}

.contests-stats {
    background: #F4F7F8;
    padding: 30px 0;
}

.contests-stats h1 {
    margin-bottom: 20px;
}

.contest-stats-card {
    padding: 22px 16px;
    background: #fff;
    border-radius: 12px;
    margin-bottom: 20px;
}

.contest-stats-card:last-child {
    margin-bottom: 0px;
}

.contest-stats-card h3 {
    font-weight: 900;
    font-size: 32px;
    line-height: 39px;
    text-align: center;
    color: #3E3D58;
    padding-bottom: 0;
    padding-top: 4px;
}

.contest-stats-card p {
    font-weight: 400;
    font-size: 24px;
    line-height: 16px;
    text-align: center;
    color: #4F4E50;
}

@media (min-width:768px) {
    .contests-stats__flex {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin: -15px 0;
    }

    .contest-stats-card {
        width: calc(50% - 30px);
        margin: 15px;
    }


    .contest-stats-card:last-child {
        margin-bottom: 15px;
    }

}

@media (min-width:1200px) {
    .contests-stats {
        padding: 30px 0 60px;
    }

    .contest-stats-card {
        width: calc(25% - 30px);
        margin: 15px;
    }
}


/*  */
.collapse {
    display: none;
}

.collapse.in {
    display: block;
}

.from-col {
    margin-bottom: 24px;
}

.w-100 {
    width: 100% !important;
}

.from-col label {
    font-family: "Inter", sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 17px;
    color: #374550;
    display: block;
    margin-bottom: 10px;
}

.from-col textarea {
    width: 100%;
    min-height: 80px;
    background: #fff;
    border-radius: 6px;
    border: #BDCAD0 1px solid;
    font-weight: 400;
    font-size: 14px;
    color: #374550;
    padding: 10px 12px;
    resize: none;
}

.from-col textarea::placeholder {
    font-family: "Inter", sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    color: #374550;
}

.from-col textarea[readonly] {
    background: #F4F7F8;
    border: #BDCAD0 1px solid;
    color: #374550;
}

.disabled input[type="email"][readonly],
.disabled input[type="text"][readonly] {
    background: #F4F7F8 !important;
    border: #BDCAD0 1px solid;
    color: #374550;
}

.from-col select[disabled] {
    background: #F4F7F8;
    border: #BDCAD0 1px solid;
    color: #374550;
}


.from-col input[type="text"],
.from-col input[type="date"],
.from-col input[type="datetime"],
.from-col input[type="datetime-local"],
.from-col input[type="email"],
.from-col input[type="month"],
.from-col input[type="number"],
.from-col input[type="password"],
.from-col input[type="search"],
.from-col input[type="tel"],
.from-col input[type="url"],
.from-col input[type="week"],
.from-col input[type="date"] {
    width: 100%;
    height: 44px;
    background: #fff;
    border-radius: 6px;
    border: #BDCAD0 1px solid;
    font-weight: 400;
    font-size: 14px;
    color: #374550;
    padding: 10px 12px;
}

.select {
    position: relative;
}

.select select {
    width: 100%;
    height: 44px;
    background: #fff;
    border-radius: 6px;
    border: #BDCAD0 1px solid;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-weight: 400;
    font-size: 14px;
    color: #374550;
    padding: 10px 12px;
}

.select::before {
    content: "\e90c";
    font-family: "icomoon";
    position: absolute;
    top: 50%;
    transform: translate(0, -50%);
    right: 12px;
    font-size: 15px;
    color: #1E1E28;
}

.my-profile-view {
    padding: 40px 0;
}

.my-profile-view__header {
    padding-bottom: 40px;
}

.my-profile-view-left {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding-bottom: 20px;
}

.my-profile-view-left h3 {
    font-weight: 600;
    font-size: 25px;
    line-height: 30px;
    color: #1E1E28;
    margin-left: 20px;
}

.my-profile-view-left h3 span {
    display: block;
    font-weight: 400;
    font-size: 18px;
    line-height: 22px;
    color: #4F4E50;
}

.my-profile__image {
    width: 92px;
    height: 92px;
    border: #0093CE 2px solid;
    border-radius: 100%;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.my-profile-image {
    width: 41px;
    height: 38px;
    object-fit: cover;
}

.my-profile__image::before {
    content: "";
    position: absolute;
    top: 5px;
    left: 5px;
    width: calc(100% - 10px);
    height: calc(100% - 10px);
    background: rgba(0, 147, 206, 0.1);
    border-radius: 100%;
}

.camera-icon {
    width: 36px;
    height: 36px;
    background: #0093CE;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    bottom: 0;
    right: 0;
}

.btn-edit {
    display: inline-block;
    background: #0093CE;
    padding: 10px 24px;
    font-size: 16px;
    font-weight: 500;
    color: #fff;
    border-radius: 6px;
    border: none;
}

.btn-edit i {
    margin-right: 10px;
}

.btn-edit:hover {
    color: #fff;
    background: #000;
}

@media (min-width:768px) {
    .my-profile-form__flex {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        margin: 0 -12px;
    }

    .from-col {
        width: calc(50% - 24px);
        margin: 0 12px 24px;
    }

    .my-profile-view__header {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

}

@media (min-width: 1200px) {
    .my-profile-view {
        padding: 40px 0;
    }

    .from-col {
        width: calc(33.33% - 24px);
        margin: 0 12px 24px;
    }
}

.switch-button-flex {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.switch-button-flex p {
    font-weight: 400;
    font-size: 18px;
    line-height: 22px;
    color: #374550;
    padding: 0;
}

.switch-button label {
    margin-bottom: 0px;
}

.switch {
    display: inline-block;
    position: relative;
    width: 50px;
    height: 25px;
    border-radius: 20px;
    background: #E9E9E9;
    transition: background 0.28s cubic-bezier(0.4, 0, 0.2, 1);
    vertical-align: middle;
    cursor: pointer;
    margin-left: 15px;
}

.switch::before {
    content: '';
    position: absolute;
    top: 1px;
    left: 2px;
    width: 22px;
    height: 22px;
    background: #6D6D6D;
    border-radius: 50%;
    transition: left 0.28s cubic-bezier(0.4, 0, 0.2, 1), background 0.28s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}

.switch:active::before {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28), 0 0 0 20px rgba(128, 128, 128, 0.1);
}

input:checked+.switch {
    background: #D9EFF8;
}

input:checked+.switch::before {
    left: 27px;
    background: #0093CE;
}

input:checked+.switch:active::before {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28), 0 0 0 20px rgba(0, 150, 136, 0.2);
}

#dvPassport {
    display: inline-block;
    width: 100%;
}

.green-color {
    color: #129D4E !important;
}

.won {
    color: #E9B600 !important;
}

.Watchlists {
    color: #EE9B6E !important;
}

@media (min-width:768px) {
    #dvPassport {
        display: inline-flex;
        width: 100%;
    }
}

/* About */

.about-us {
    padding: 0 0 50px 0;
}

.about-us ol {
    position: relative;
    list-style-type: none;
    margin-left: 9px;
    counter-reset: ordered;
}

.about-us ol::after {
    content: "";
    position: absolute;
    top: 0;
    left: 4px;
    background: #E9E9E9;
    width: 1px;
    height: 100%;
    z-index: -1;
}

.about-us ol li {
    position: relative;
    margin-bottom: 17px;
    padding-left: 15px;
}

.about-us ol li::after {
    content: counter(ordered);
    counter-increment: ordered;
    position: absolute;
    top: -2px;
    left: -27px;
    width: 28px;
    height: 28px;
    background: #E9E9E9;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16px;
    font-weight: 500;
    color: #374550;
}

@media (min-width:768px) {
    .row {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .row:nth-child(even) {
        flex-direction: row-reverse;
    }

    .col-6 {
        width: calc(50% - 30px);
        margin: 0 15px 30px;
    }
}

@media (min-width: 1200px) {
    .about-us h2 {
        font-weight: 700;
        font-size: 28px;
        line-height: 34px;
        color: #263137;
        padding-bottom: 0;
    }

    .about-us p {
        color: #374550;
    }

    .col-6 {
        margin: 0 15px 80px;
    }
}

.terms-conditions {
    padding-bottom: 50px;
}

.terms-item {
    border-top: 1px solid #CBCED1;
    padding: 12px 0;
}

.terms-item h3 {
    font-weight: 600;
    font-size: 20px;
    line-height: 24px;
    color: #1E1E28;
}

.terms-item ul {
    margin-left: 10px;
}

.terms-item:last-child {
    border-bottom: 1px solid #CBCED1;
}

@media (min-width:768px) {
    .terms-item h3 {
        font-size: 24px;
        line-height: 29px;
    }
}

@media (min-width:1200px) {
    .terms-conditions h2 {
        padding-bottom: 25px;
        padding-top: 0px;
    }

    .terms-item {
        padding: 14px 0;
    }

    .terms-conditions {
        padding-bottom: 80px;
    }
}

/* Notifications */

@media (min-width:1200px) {
    .header-section aside .login.notifications a {
        display: flex;
        justify-content: center;
        align-items: center;
        background: #E0F8FF;
        padding: 6px;
        border-radius: 6px;
    }

    .notifications h2 {
        font-weight: 600;
        font-size: 32px;
        line-height: 39px;
        color: #1E1E28;
        text-align: center;
        padding: 0 0 24px;
        border-bottom: #CBCED1 1px solid;
    }

    .notification-item__link {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        border-bottom: #CBCED1 1px solid;
        padding: 11px 16px;
    }

    .notification-item__link:hover {
        background: rgba(219, 227, 231, 0.3);
    }

    .notification-item__link.active {
        background: rgba(219, 227, 231, 0.3);
    }

    .notification-item__link:hover .notification-content h3 span {
        color: #0093CE;
    }

    .notification-item__link.active .notification-content h3 span {
        color: #0093CE;
    }

    .notification-icon {
        margin-right: 12px;
        width: 48px;
        height: 48px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .notification-content {
        width: calc(100% - 60px);
    }

    .notification-content h3 {
        font-weight: 600;
        font-size: 18px;
        line-height: 22px;
        color: rgba(30, 30, 40, 0.7);
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0 0 7px;
    }

    .notification-content h3 span {
        width: 200px;
        text-align: right;
        font-size: 14px;
        line-height: 17px;
        font-weight: 500;
        color: #374550;
    }

    .notification-content p {
        font-size: 14px;
        line-height: 20px;
        color: #4F4E50;
    }
}


.avatar-upload {
    position: relative;
    max-width: 92px;
}

.avatar-upload .avatar-edit {
    position: absolute;
    right: 0px;
    z-index: 1;
    bottom: 0px;
}

.avatar-upload .avatar-edit input {
    display: none;
}

.avatar-upload .avatar-preview {
    width: 92px;
    height: 92px;
    position: relative;
    border-radius: 100%;
    border: 6px solid #F8F8F8;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
}

.avatar-upload .avatar-preview>div {
    width: 100%;
    height: 100%;
    border-radius: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.avatar-edit label.camera-icon {
    position: absolute;
}

/* 01.05.2025 */
.header-mobile-section aside .login a {
    background-color: #0093CE;
    color: #fff;
    width: unset;
    height: unset;
    font-size: 14px;
    padding: 10px 15px;
    font-weight: 600;
}

.winners-js .winner figure img {
    height: 134px;
    object-fit: cover;
}

@media (min-width:761px) {
    .login.notifications a{
        display: inline-flex;
        justify-content: center;
        align-items: center;
        background: #E0F8FF !important;
        padding: 0px !important;
        border-radius: 0px;
        width: 40px;
        height: 40px;
    }

    
}

@media (min-width:1200px) {
    .winners-js .winner figure img {
        height: 148px;
        width:100%;
    }
}

/*chiranjit*/
.pagingnation-section ul {
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    list-style-type: none;
}

.pagingnation-section ul li {
    padding: 0;
    margin: 0;
    line-height: 1em;
}

.pagingnation-section {
    margin-top: 30px;
}

.pagingnation-section ul li a {
    width: 32px;
    height: 32px;
    border: 1px solid #DFE3E8;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: #202020;
    font-weight: 700;
    line-height: 1em;
}

.pagingnation-section ul li:last-child a {
    background-color: #0093ce;
    color: #fff;
}

.pagingnation-section ul li:first-child a {
    background-color: #241B02;
    color: #fff;
    border-color: #241B02;
}

.pagingnation-section ul li a:hover {
    border-color: #241B02;
}
.pagingnation-section ul li a.active{
 background-color: #fcb205;
}


.icon-left-arrow:before {
    content: "\e920";
}

.icon-right-arrow:before {
    content: "\e921";
}