@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700&display=swap');
    @import url("../fonts/edwardian/stylesheet.css");
    @import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css");
    * {
        margin: 0;
        padding: 0;
    }
    
    html {
        height: 100%;
    }
    
    body {
        background: #fff;
        font-size: 16px;
        font-family: 'Roboto', sans-serif;
        font-size: 16px;
        font-weight: 400;
        line-height: 22px;
        color: #000;
    }
    
    input:focus,
    button:focus,
    a:focus {
        outline: none !important;
        box-shadow: none !important;
    }
    
    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        font-weight: 500;
        color: #000;
    }
    
    h1 {
        font-size: 36px;
    }
    
    h2 {
        font-size: 34px;
        margin-bottom: 35px;
    }
    
    h3 {
        font-size: 28px;
        margin-bottom: 30px;
    }
    
    h4 {
        font-size: 20px;
        margin-bottom: 20px;
    }
    
    h5 {
        font-size: 18px;
    }
    
    h6 {
        font-size: 14px
    }
    
    a {
        color: #5267f4;
    }
    
    p {
        line-height: 28px;
    }
    
    .color-light-gray {
        color: #969a9d;
    }
    
    .color-red {
        color: #f93634;
    }
    
    .color-white {
        color: #fff;
    }
    
    .background-blue {
        background-color: #5267f4;
    }
    
    .background-red {
        background-color: #d24848;
    }
    
    .bg-yellow {
        background-color: #f9ba41!important;
    }
    
    .bg-sky-blue {
        background-color: #71abd9!important;
    }
    
    .gradient-ciyan {
        background-color: #34d8b3!important;
    }
    
    .Search-box-gradient {
        background: #78D8DF;
        background: -webkit-linear-gradient(left, #78D8DF, #C08FB1);
        background: -moz-linear-gradient(left, #78D8DF, #C08FB1);
        background: linear-gradient(to right, #78D8DF, #C08FB1);
        ;
    }
    
    .theme-gradient {
        background: rgb(92, 214, 222)!important;
        background: linear-gradient( 90deg, rgba(92, 214, 222, 1) 0%, rgba(85, 231, 188, 1) 100%)!important;
    }
    
    .f-size-11 {
        font-size: 11px;
    }
    
    .f-size-12 {
        font-size: 12px;
    }
    
    .pf-size-14 {
        font-size: 114px;
    }
    
    .pf-size-16 {
        font-size: 16px;
    }
    
    .pf-size-18 {
        font-size: 18px;
    }
    
    .f-weight-100 {
        font-weight: 100;
    }
    
    .f-weight-200 {
        font-weight: 200;
    }
    
    .f-weight-300 {
        font-weight: 300;
    }
    
    .f-weight-400 {
        font-weight: 400;
    }
    
    .f-weight-500 {
        font-weight: 500;
    }
    
    .f-weight-600 {
        font-weight: 600;
    }
    
    .f-weight-700 {
        font-weight: 700;
    }
    
    .f-weight-800 {
        font-weight: 800;
    }
    
    .f-weight-900 {
        font-weight: 900;
    }
    
    .f-weight-bold {
        font-weight: bold;
    }
    
    .p-0 {
        padding: 0px !important;
    }
    
    .p-5 {
        padding: 5px !important;
    }
    
    .p-10 {
        padding: 10px !important;
    }
    
    .p-15 {
        padding: 15px !important;
    }
    
    .p-20 {
        padding: 20px !important;
    }
    
    .p-25 {
        padding: 25px !important;
    }
    
    .p-30 {
        padding: 30px !important;
    }
    
    .p-35 {
        padding: 35px !important;
    }
    
    .p-40 {
        padding: 40px !important;
    }
    
    .p-45 {
        padding: 45px !important;
    }
    
    .p-50 {
        padding: 50px !important;
    }
    
    .p-55 {
        padding: 55px !important;
    }
    
    .p-60 {
        padding: 60px !important;
    }
    
    .p-65 {
        padding-top: 65px !important;
    }
    
    .p-70 {
        padding: 70px !important;
    }
    
    .p-75 {
        padding: 75px !important;
    }
    
    .p-80 {
        padding: 80px !important;
    }
    
    .p-85 {
        padding: 85px !important;
    }
    
    .p-90 {
        padding: 90px !important;
    }
    
    .p-95 {
        padding: 95px !important;
    }
    
    .p-100 {
        padding: 100px !important;
    }
    
    .pt-0 {
        padding-top: 0px !important;
    }
    
    .pt-5 {
        padding-top: 5px !important;
    }
    
    .pt-10 {
        padding-top: 10px !important;
    }
    
    .pt-15 {
        padding-top: 15px !important;
    }
    
    .pt-20 {
        padding-top: 20px !important;
    }
    
    .pt-25 {
        padding-top: 25px !important;
    }
    
    .pt-30 {
        padding-top: 30px !important;
    }
    
    .pt-35 {
        padding-top: 35px !important;
    }
    
    .pt-40 {
        padding-top: 40px !important;
    }
    
    .pt-45 {
        padding-top: 45px !important;
    }
    
    .pt-50 {
        padding-top: 50px !important;
    }
    
    .pt-55 {
        padding-top: 55px !important;
    }
    
    .pt-60 {
        padding-top: 60px !important;
    }
    
    .pt-65 {
        padding-top: 65px !important;
    }
    
    .pt-70 {
        padding-top: 70px !important;
    }
    
    .pt-75 {
        padding-top: 75px !important;
    }
    
    .pt-80 {
        padding-top: 80px !important;
    }
    
    .pt-85 {
        padding-top: 85px !important;
    }
    
    .pt-90 {
        padding-top: 90px !important;
    }
    
    .pt-95 {
        padding-top: 95px !important;
    }
    
    .pt-100 {
        padding-top: 100px !important;
    }
    
    .pr-0 {
        padding-right: 0 !important;
    }
    
    .pr-5 {
        padding-right: 5px !important;
    }
    
    .pr-10 {
        padding-right: 10px !important;
    }
    
    .pr-15 {
        padding-right: 15px !important;
    }
    
    .pr-20 {
        padding-right: 20px !important;
    }
    
    .pr-25 {
        padding-right: 25px !important;
    }
    
    .pr-30 {
        padding-right: 30px !important;
    }
    
    .pr-35 {
        padding-right: 35px !important;
    }
    
    .pr-40 {
        padding-right: 40px !important;
    }
    
    .pr-45 {
        padding-right: 45px !important;
    }
    
    .pr-50 {
        padding-right: 50px !important;
    }
    
    .pr-55 {
        padding-right: 55px !important;
    }
    
    .pr-60 {
        padding-right: 60px !important;
    }
    
    .pr-65 {
        padding-right: 65px !important;
    }
    
    .pr-70 {
        padding-right: 70px !important;
    }
    
    .pr-75 {
        padding-right: 75px !important;
    }
    
    .pr-80 {
        padding-right: 80px !important;
    }
    
    .pr-85 {
        padding-right: 85px !important;
    }
    
    .pr-90 {
        padding-right: 90x !important;
        ;
    }
    
    .pr-95 {
        padding-right: 95px !important;
    }
    
    .pr-100 {
        padding-right: 100x !important;
        ;
    }
    
    .pb-0 {
        padding-bottom: 0px !important;
    }
    
    .pb-5 {
        padding-bottom: 5px !important;
    }
    
    .pb-10 {
        padding-bottom: 10px !important;
    }
    
    .pb-15 {
        padding-bottom: 15px !important;
    }
    
    .pb-20 {
        padding-bottom: 20px !important;
    }
    
    .pb-25 {
        padding-bottom: 25px !important;
    }
    
    .pb-30 {
        padding-bottom: 30px !important;
    }
    
    .pb-35 {
        padding-bottom: 35px !important;
    }
    
    .pb-40 {
        padding-bottom: 40px !important;
    }
    
    .pb-45 {
        padding-bottom: 45px !important;
    }
    
    .pb-50 {
        padding-bottom: 50px !important;
    }
    
    .pb-55 {
        padding-bottom: 55px !important;
    }
    
    .pb-60 {
        padding-bottom: 60px !important;
    }
    
    .pb-65 {
        padding-bottom: 65px !important;
    }
    
    .pb-70 {
        padding-bottom: 70px !important;
    }
    
    .pb-75 {
        padding-bottom: 75px !important;
    }
    
    .pb-80 {
        padding-bottom: 80px !important;
    }
    
    .pb-85 {
        padding-bottom: 85px !important;
    }
    
    .pb-90 {
        padding-bottom: 90px !important;
        ;
    }
    
    .pb-95 {
        padding-bottom: 95px !important;
    }
    
    .pb-100 {
        padding-bottom: 100px !important;
    }
    
    .pl-0 {
        padding-left: 0px !important;
    }
    
    .pl-5 {
        padding-left: 5px !important;
    }
    
    .pl-10 {
        padding-left: 10px !important;
    }
    
    .pl-15 {
        padding-left: 15px !important;
    }
    
    .pl-20 {
        padding-left: 20px !important;
    }
    
    .pl-25 {
        padding-left: 25px !important;
    }
    
    .pl-30 {
        padding-left: 30px !important;
    }
    
    .pl-35 {
        padding-left: 35px !important;
    }
    
    .pl-40 {
        padding-left: 40px !important;
    }
    
    .pl-45 {
        padding-left: 45px !important;
    }
    
    .pl-50 {
        padding-left: 50px !important;
    }
    
    .pl-55 {
        padding-left: 55px !important;
    }
    
    .pl-60 {
        padding-left: 60px !important;
    }
    
    .pl-65 {
        padding-top: 65px !important;
    }
    
    .pl-70 {
        padding-left: 70px !important;
    }
    
    .pl-75 {
        padding-left: 75px !important;
    }
    
    .pl-80 {
        padding-left: 80px !important;
    }
    
    .pl-85 {
        padding-left: 85px !important;
    }
    
    .pl-90 {
        padding-left: 90px !important;
        ;
    }
    
    .pl-95 {
        padding-left: 95px !important;
    }
    
    .pl-100 {
        padding-left: 100px !important;
    }
    
    .m-0 {
        margin: 0px !important;
    }
    
    .m-5 {
        margin: 5px !important;
    }
    
    .m-10 {
        margin: 10px !important;
    }
    
    .m-15 {
        margin: 15px !important;
    }
    
    .m-20 {
        margin: 20px !important;
    }
    
    .m-25 {
        margin: 25px !important;
    }
    
    .m-30 {
        margin: 30px !important;
    }
    
    .m-35 {
        margin: 35px !important;
    }
    
    .m-40 {
        margin: 40px !important;
    }
    
    .m-45 {
        margin: 45px !important;
    }
    
    .m-50 {
        margin: 50px !important;
    }
    
    .m-55 {
        margin: 55px !important;
    }
    
    .m-60 {
        margin: 60px !important;
    }
    
    .m-65 {
        margin: 65px !important;
    }
    
    .m-70 {
        margin: 70px !important;
    }
    
    .m-75 {
        margin: 75px !important;
    }
    
    .m-80 {
        margin: 80px !important;
    }
    
    .m-85 {
        margin: 85px !important;
    }
    
    .m-90 {
        margin: 90px !important;
        ;
    }
    
    .m-95 {
        margin: 95px !important;
    }
    
    .m-100 {
        margin: 100px !important;
    }
    
    .mt-0 {
        margin-top: 0px !important;
    }
    
    .mt-5 {
        margin-top: 5px !important;
    }
    
    .mt-10 {
        margin-top: 10px !important;
    }
    
    .mt-15 {
        margin-top: 15px !important;
    }
    
    .mt-20 {
        margin-top: 20px !important;
    }
    
    .mt-25 {
        margin-top: 25px !important;
    }
    
    .mt-30 {
        margin-top: 30px !important;
    }
    
    .mt-35 {
        margin-top: 35px !important;
    }
    
    .mt-40 {
        margin-top: 40px !important;
    }
    
    .mt-45 {
        margin-top: 45px !important;
    }
    
    .mt-50 {
        margin-top: 50px !important;
    }
    
    .mt-55 {
        margin-top: 55px !important;
    }
    
    .mt-60 {
        margin-top: 60px !important;
    }
    
    .mt-65 {
        margin-top: 65px !important;
    }
    
    .mt-70 {
        margin-top: 70px !important;
    }
    
    .mt-75 {
        margin-top: 75px !important;
    }
    
    .mt-80 {
        margin-top: 80px !important;
    }
    
    .mt-85 {
        margin-top: 85px !important;
    }
    
    .mt-90 {
        margin-top: 90px !important;
        ;
    }
    
    .mt-95 {
        margin-top: 95px !important;
    }
    
    .mt-100 {
        margin-top: 100px !important;
    }
    
    .mr-5 {
        margin-right: 5px !important;
    }
    
    .mr-10 {
        margin-right: 10px !important;
    }
    
    .mr-15 {
        margin-right: 15px !important;
    }
    
    .mr-20 {
        margin-right: 20px !important;
    }
    
    .mr-25 {
        margin-right: 25px !important;
    }
    
    .mr-30 {
        margin-right: 30px !important;
    }
    
    .mr-35 {
        margin-right: 35px !important;
    }
    
    .mr-40 {
        margin-right: 40px !important;
    }
    
    .mr-45 {
        margin-right: 45px !important;
    }
    
    .mr-50 {
        margin-right: 50px !important;
    }
    
    .mr-55 {
        margin-right: 55px !important;
    }
    
    .mr-60 {
        margin-right: 60px !important;
    }
    
    .mr-65 {
        margin-right: 65px !important;
    }
    
    .mr-70 {
        margin-right: 70px !important;
    }
    
    .mr-75 {
        margin-right: 75px !important;
    }
    
    .mr-80 {
        margin-right: 80px !important;
    }
    
    .mr-85 {
        margin-right: 85px !important;
    }
    
    .mr-90 {
        margin-right: 90px !important;
        ;
    }
    
    .mr-95 {
        margin-right: 95px !important;
    }
    
    .mr-100 {
        margin-right: 100px;
    }
    
    .mb-0 {
        margin-bottom: 0px !important;
    }
    
    .mb-5 {
        margin-bottom: 5px !important;
    }
    
    .mb-10 {
        margin-bottom: 10px !important;
    }
    
    .mb-15 {
        margin-bottom: 15px !important;
    }
    
    .mb-20 {
        margin-bottom: 20px !important;
    }
    
    .mb-25 {
        margin-bottom: 25px !important;
    }
    
    .mb-30 {
        margin-bottom: 30px !important;
    }
    
    .mb-35 {
        margin-bottom: 35px !important;
    }
    
    .mb-40 {
        margin-bottom: 40px !important;
    }
    
    .mb-45 {
        margin-bottom: 45px !important;
    }
    
    .mb-50 {
        margin-bottom: 50px !important;
    }
    
    .mb-55 {
        margin-bottom: 55px !important;
    }
    
    .mb-60 {
        margin-bottom: 60px !important;
    }
    
    .mb-65 {
        margin-bottom: 65px !important;
    }
    
    .mb-70 {
        margin-bottom: 70px !important;
    }
    
    .mb-75 {
        margin-bottom: 75px !important;
    }
    
    .mb-80 {
        margin-bottom: 80px !important;
    }
    
    .mb-85 {
        margin-bottom: 85px !important;
    }
    
    .mb-90 {
        margin-bottom: 90px !important;
        ;
    }
    
    .mb-95 {
        margin-bottom: 95px !important;
    }
    
    .mb-100 {
        margin-bottom: 100px !important;
    }
    
    .ml-0 {
        margin-left: 0px !important;
    }
    
    .ml-5 {
        margin-left: 5px !important;
    }
    
    .ml-10 {
        margin-left: 10px !important;
    }
    
    .ml-15 {
        margin-left: 15px !important;
    }
    
    .ml-20 {
        margin-left: 20px !important;
    }
    
    .ml-25 {
        margin-left: 25px !important;
    }
    
    .ml-30 {
        margin-left: 30px !important;
    }
    
    .ml-35 {
        margin-left: 35px !important;
    }
    
    .ml-40 {
        margin-left: 40px !important;
    }
    
    .ml-45 {
        margin-left: 45px !important;
    }
    
    .ml-50 {
        margin-left: 50px !important;
    }
    
    .ml-55 {
        margin-left: 55px !important;
    }
    
    .ml-60 {
        margin-left: 60px !important;
    }
    
    .ml-65 {
        margin-top: 65px !important;
    }
    
    .ml-70 {
        margin-left: 70px !important;
    }
    
    .ml-75 {
        margin-left: 75px !important;
    }
    
    .ml-80 {
        margin-left: 80px !important;
    }
    
    .ml-85 {
        margin-left: 85px !important;
    }
    
    .ml-90 {
        margin-left: 90px !important;
        ;
    }
    
    .ml-95 {
        margin-left: 95px !important;
    }
    
    .ml-100 {
        margin-left: 100px !important;
    }
    
    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl {
        max-width: 1200px;
    }
    
    .btn {
        border-radius: 17px;
        border: none;
    }
    
    .btn-danger {
        background-color: #ff0054;
    }
    
    .navbar-light .navbar-nav .nav-link {
        color: #fff;
        font-weight: 400;
    }
    
    .right-area .btn {
        font-size: 12px;
        padding: 5px 25px;
    }
    
    .header {
        background: rgb(107, 31, 180);
        background: linear-gradient(90deg, rgba(107, 31, 180, 1) 0%, rgba(157, 35, 163, 1) 100%);
        padding: 20px 0;
    }
    
    .header .navbar ul li a {
        padding: 0 15px !important;
    }
    
    .notification a .count {
        position: absolute;
        background: #ff0054;
        width: 18px;
        height: 18px;
        border-radius: 100%;
        color: #fff;
        padding: 0;
        right: 7px;
        top: -2px;
        font-size: 13px;
        text-align: center;
        line-height: 17px;
    }
    
    nav.navbar.navbar-expand-lg {
        padding: 0;
    }
    
    .account-icon {
        position: relative;
        top: -7px;
        margin-right: 5px;
    }
    
    li.nav-item.notification {
        position: relative;
        top: -6px;
    }
    
    .notification>a>img,
    .account-icon {
        width: 22px;
    }
    
    .header .navbar ul li a {
        transition: 300ms color;
    }
    
    .header .navbar ul li.active a,
    .header .navbar ul li a:hover {
        color: #ffde00;
    }
    
    .banner {
        position: relative;
    }
    
    .search-partner {
        position: absolute;
        width: 100%;
        z-index: 3;
        bottom: 37%;
    }
    
    .search-partner h1 {
        background: rgb(255, 0, 84);
        background: linear-gradient(90deg, rgba(255, 0, 84, 1) 0%, rgba(165, 0, 93, 1) 100%);
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-weight: 500;
    }
    
    .search-partner .search-box {
        max-width: 100%;
        /* color-theme */
        background: rgb(180 32 98 / 70%);
        background: linear-gradient(90deg, rgb(180 32 98 / 70%) 0%, rgb(255 0 87 / 49%) 100%);
        /* color-theme */
        display: block;
        color: #fff;
        padding: 30px;
    }
    
    .search-partner .search-box button {
        background-color: #ffde00;
        color: #000;
    }
    
    .search-partner .search-box button:hover {
        box-shadow: 2px 3px 1px rgb(47 47 47);
        color: #fff;
    }
    
    .form-control {
        width: 100% !important;
        height: 51px;
        display: block !important;
        border-radius: 10px;
        padding: 0 10px;
        color: #363636;
        border: 1px solid #c2c2c2;
    }
    
    .search-box .btn-danger {
        height: 39px;
    }
    
    .right-radius-0 {
        border-top-right-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
    }
    
    .left-radius-0 {
        border-top-left-radius: 0 !important;
        border-bottom-left-radius: 0 !important;
    }
    
    .country-code {
        width: 95px !important;
    }
    
    .form-no-border .form-control {
        border: none !important;
    }
    
    .black-card label {
        color: #ffffff;
        margin-bottom: 7px !important;
    }
    
    .features .container {
        background: #f4f4f1;
        position: relative;
    }
    
    .features .container:after {
        content: "";
        width: 100%;
        height: 4px;
        background: rgb(255, 78, 0);
        background: linear-gradient(90deg, rgba(255, 78, 0, 1) 0%, rgba(255, 222, 0, 1) 50%, rgba(255, 0, 84, 1) 100%);
        position: absolute;
        left: 0;
    }
    
    .features h5 {
        font-size: 20px;
    }
    
    .features {
        margin-top: -123px;
        position: relative;
        z-index: 3;
    }
    
    .search-partner .container {
        padding: 0 70px;
    }
    
    .intro {
        background: #ebebe9 url(../img/intro-bg.jpg) top right no-repeat;
        background-size: contain;
    }
    
    .intro-bg {
        background: url(../img/love-bg.png) 102% 11% no-repeat;
    }
    
    .main-content p {
        margin-bottom: 30px;
    }
    
    .list li {
        background: url(../img/list-icon.png) no-repeat;
        list-style: none;
        padding: 4px 0 21px 39px;
    }
    
    .intro img {
        transform: rotate(-19deg);
        border: 5px solid #fff;
        border-radius: 15px;
        max-width: 309px;
    }
    
    .intro-bg img:first-child {
        position: relative;
        z-index: 1;
        margin-left: 155px;
    }
    
    .intro-bg img:nth-child(2) {
        margin-top: -125px;
    }
    /* color-theme open */
    
    .stories {
        background: #ffff url(../img/story-bg.png)center repeat !important;
        background-size: cover;
    }
    
    .stories h2,
    .stories p,
    .stories .story-item h4,
    .stories .story-item p {
        color: #fff;
    }
    
    .footer {
        background: rgb(107, 31, 180);
        background: linear-gradient(90deg, rgba(107, 31, 180, 1) 0%, rgba(157, 35, 163, 1) 100%);
    }
    /* color-theme close */
    
    .story-item {
        display: block;
        text-align: center;
        margin-bottom: 25px;
        padding: 24px 12px 12px;
    }
    
    .story-item p::before {
        content: '"';
        display: inline-block;
    }
    
    .story-item p::after {
        content: '"';
        display: inline-block;
    }
    
    .story-img {
        overflow: hidden;
        border-radius: 100%;
        border: 9px solid #ffff;
        box-shadow: 0px 3px 18px 3px hsl(0deg 0% 0% / 13%);
    }
    
    .story-item .story-img {
        transition: 300ms;
    }
    
    .story-item:hover .story-img {
        transform: translateY(-15px);
    }
    
    .story-item h4 {
        margin-bottom: 10px;
        margin-top: 30px;
    }
    
    .owl-theme .owl-dots .owl-dot {
        display: inline-block;
        zoom: 1;
        background: transparent !important;
        padding: 5px;
    }
    
    .owl-theme .owl-dots .owl-dot.active span,
    .owl-theme .owl-dots .owl-dot:hover span {
        background: #ff0054 !important;
    }
    
    .register {
        background: #5a347f url(../img/love-bg-02.png) left center no-repeat;
        color: #fff;
    }
    
    .text-white {
        color: #fff;
    }
    
    .btn-reg {
        background: #fff;
        border: none;
        padding: 18px 20px;
        font-size: 20px;
        border-radius: 30px;
        width: 100%;
    }
    
    .white-card {
        background: #fff;
    }
    
    .card-shadow {
        box-shadow: 0px 0px 13px 3px rgb(0 0 0 / 10%);
    }
    
    .match-search .search-box {
        padding: 35px 25px;
    }
    
    .ml-n-10 {
        margin-left: -10px;
    }
    
    .mr-n-10 {
        margin-right: -10px;
    }
    
    .match-search .btn {
        border-radius: 10px !important;
    }
    
    .footer ul {
        list-style: none;
    }
    
    .footer ul li {
        line-height: 25px;
    }
    
    .footer ul li a {
        display: block;
        color: #fff;
        padding: 2px 0;
    }
    
    .footer p {
        line-height: 23px;
        color: #fff;
    }
    
    .footer h6 {
        color: #fff;
    }
    
    .footer ul li a:hover {
        color: #000000;
        text-decoration: none;
    }
    
    .copyright {
        background: #000000;
        color: #989898;
    }
    
    .copyright a {
        color: #989898
    }
    
    .copyright a:hover {
        color: #ff0054;
        text-decoration: none;
    }
    
    .lite-gray-bg {
        background-color: #f2f2f2;
        color: #000;
    }
    
    .happy-story-item p {
        line-height: 23px;
    }
    
    .happy-story-item button {
        padding: 3px 25px;
        font-size: 12px;
    }
    
    .happy-story-item img {
        width: 100%;
    }
    
    .privacy-policy {
        font-size: 13px;
        line-height: 20px;
    }
    
    .privacy-policy p {
        line-height: 23px;
        color: #ffff;
    }
    
    .privacy-policy h6 {
        color: #fff;
    }
    
    body .width-80 {
        width: 80px !important;
    }
    
    .f-weight-400 {
        font-weight: 400;
    }
    
    .form-group {
        position: relative;
        padding-top: 15px;
    }
    
    .form-login .form-group {
        width: 100%;
        display: flex;
        margin: 0 0 20px;
        padding: 0;
    }
    
    .focus-blue:focus {
        border: 1px solid #8590c6;
    }
    
    label.form-label {
        color: #949695;
    }
    
    .form-field::placeholder {
        color: transparent;
    }
    
    .form-field:placeholder-shown~.form-label {
        font-size: 16px;
        cursor: text;
        top: 20px;
        color: #949695;
    }
    
    .form-label,
    .form-field:focus~.form-label {
        position: absolute;
        top: 0;
        display: block;
        transition: 0.2s;
        font-size: 12px;
    }
    
    .form-field:focus~.form-label,
    .form-field~.form-label {
        font-size: 12px;
        color: #131313;
        font-weight: 400;
    }
    
    .single-line {
        border-bottom: 2px solid #D9D9D9 !important;
        padding: 7px 0 !important;
    }
    
    .form-field:focus {
        border-bottom-color: #5368f7 !important;
    }
    
    .form-group {
        position: relative;
    }
    
    .form-field {
        font-family: inherit;
        width: 100%;
        border: 0;
        outline: 0;
        font-size: 16px;
        color: #a8a9ab;
        padding: 7px 0;
        background: transparent;
        transition: border-color 0.2s;
        font-weight: 400;
    }
    
    .owl-carousel .owl-nav button.owl-next,
    .owl-carousel .owl-nav button.owl-prev {
        font-size: 39px !important;
        background: rgb(144 144 144 / 14%) !important;
        color: #fff !important;
        width: 40px !important;
        height: 40px !important;
        border-radius: 0 !important;
        padding: 11px 10px !important;
    }
    
    .owl-carousel .owl-nav button span {
        margin-top: -4px;
        display: block;
    }
    
    .owl-nav {
        position: absolute;
        width: 100%;
        top: 50%;
    }
    
    button.owl-prev {
        left: 0;
        position: absolute;
    }
    
    button.owl-next {
        right: 0;
        position: absolute;
    }
    
    .form__field:focus~.form-label {
        color: #009788;
    }
    
    .form-field:focus {
        padding-bottom: 6px;
        border-bottom: 2px solid #5267f4;
    }
    
    .basic-details .card-body .card-title {
        margin-bottom: 37px;
    }
    
    .card .form-group {
        padding-top: 15px;
        margin-top: 0;
        margin-bottom: 38px;
    }
    
    .width-100 {
        width: 100%;
    }
    
    .width-90 {
        width: 90%;
    }
    
    .btn-shadow {
        box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.18);
    }
    
    .btn-primary {
        background: #5467f2;
    }
    
    .btn-primary:hover {
        background: #475ae4;
    }
    
    .mb-80 {
        margin-bottom: 80px;
    }
    
    .header-search {
        padding: 21px;
        border: none;
        background: #f3f3f3;
    }
    
    button,
    button:focus {
        outline: none;
        box-shadow: none;
    }
    
    .search-holder {
        margin-left: 25px;
    }
    
    button.navbar-toggler {
        border: none;
        padding: 0;
        color: #000;
        border-color: #000;
    }
    
    .login-container {
        max-width: 320px;
        padding: 15px;
        display: flex;
        flex-direction: column;
        width: 100%;
    }
    
    .login-container .logo {
        text-align: center;
    }
    
    .login-page {
        display: flex;
        justify-content: center;
        align-items: center;
        min-height: 100%;
    }
    
    .form-login label {
        height: 40px;
        padding: 11px;
        background-color: #fff !important;
        border-bottom-left-radius: 3px;
        border-top-left-radius: 3px;
        margin-bottom: 0;
    }
    
    .form-login ::-webkit-input-placeholder {
        color: #9f9f9f;
    }
    
    .form-login :-ms-input-placeholder {
        color: #9f9f9f;
    }
    
    .form-login ::placeholder {
        color: #9f9f9f;
    }
    
    .hidden {
        border: 0;
        clip: rect(0 0 0 0);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        width: 1px;
    }
    
    .login-container p {
        font-size: 13px;
        color: #111214;
        margin: 11px 0;
        font-weight: 600;
    }
    
    .login-container .logo p {
        margin-bottom: 18px;
    }
    
    .form-login .form-group input[type="text"],
    .form-login .form-group input[type="password"],
    .form-login button {
        border-radius: 3px;
    }
    
    .form-login .form-group input[type="text"],
    .form-login .form-group input[type="password"] {
        width: 100%;
        height: 40px;
        border: none;
        font-size: 13px;
        margin: 0;
        border-bottom-left-radius: 0;
        border-top-left-radius: 0;
    }
    
    .form-login .btn-submit {
        width: 100%;
        border: none;
        height: 40px;
        border-radius: 3px;
        color: #fff;
        text-transform: uppercase;
        font-weight: 500;
        margin-top: 4px;
    }
    
    .field-shadow {
        box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.12);
    }
    
    .card-holder {
        background-color: #fff;
        box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.12);
        border-radius: 3px;
    }
    
    .card {
        width: 100%;
        background: rgb(180, 32, 98);
        background: linear-gradient(90deg, rgba(180, 32, 98, 1) 0%, rgba(255, 0, 87, 1) 100%);
        box-shadow: none;
        border: none;
        box-shadow: 0px 0px 13px 3px rgb(0 0 0 / 10%);
        border-radius: 15px;
    }
    
    .nav-tabs .nav-link {
        font-weight: 500;
        color: #969a9d;
        padding: 0 15px;
    }
    
    .nav-tabs .nav-link:hover {
        border-color: transparent;
    }
    
    .nav-tabs .nav-link.active {
        color: #616bb0;
        background-color: transparent;
        border: none;
        border-bottom: 2px solid #616bb0;
    }
    
    .nav-tabs {
        border-bottom: none;
    }
    
    .date-filter {
        position: absolute;
        right: 0;
        top: -63px;
    }
    
    button.btn.btn-status {
        display: block;
        padding: 3px 5px;
        color: #fff;
        width: 100%;
        font-weight: 400;
    }
    
    .btn-gray {
        background: #92979b;
        color: #fff;
    }
    
    .btn-dark-blue {
        background: #374572;
        color: #fff;
    }
    
    .btn-brown {
        background: #625c5c;
        color: #fff;
    }
    
    .page-item .page-link {
        color: #878789;
        padding: 2px 8px;
        font-size: 13px;
    }
    
    .rs-icon {
        width: 7px;
        color: red;
    }
    
    .no-border td,
    .no-border th {
        border: none !important;
    }
    
    .table thead th {
        border-bottom: 1px solid #e8e8e8 !important;
        padding-bottom: 35px;
    }
    /* .table tbody tr:first-child td {
    padding-top: 23px;
    } */
    
    .btn-gray-medium,
    .btn-gray-medium:hover {
        background-color: #92979b;
        color: #fff;
    }
    
    .btn-lite-blue,
    .btn-lite-blue:hover {
        background-color: #5267f4;
        color: #fff;
    }
    
    .tab-content .card-holder .row div {
        display: flex;
        align-items: center;
    }
    
    .tab-pane {
        position: relative;
    }
    
    .header-transparent {
        background: transparent;
        box-shadow: none;
        padding: 10px 0;
    }
    
    .b-radius {
        border-radius: 13px;
    }
    
    .reg-page-status,
    .reg-page-status h5 {
        color: #fff;
    }
    
    .reg-page-status p {
        font-size: 12px;
    }
    
    .reg-page-status h5 {
        margin-bottom: 0;
    }
    
    .status-mark {
        display: inline-block;
        width: 23px;
        height: 24px;
        background: #5268F4;
        border-radius: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #fff;
    }
    
    .status-item {
        padding: 15px 15px 0;
        position: relative;
    }
    
    .status-mark {
        position: absolute;
        left: -26px;
        overflow: hidden;
    }
    
    .status-mark.active {
        overflow: hidden;
        text-indent: -100px;
        border: 3px solid #5268f4;
        background: #fff;
    }
    
    .status-mark.completed {
        background: #27CC93;
    }
    
    .black-bg {
        position: fixed;
        width: 39%;
        background: #1C1E21;
        height: 100%;
        top: 0;
        right: 0;
        z-index: -1;
    }
    
    .form-input {
        width: 100%;
        height: 40px;
        border: none;
        font-size: 13px;
        margin: 0;
        padding: 10px 15px;
        display: block;
        border-radius: 5px;
    }
    
    label {
        color: #000000;
        margin-bottom: 5px !important;
    }
    
    .btn-light,
    .btn-light:hover {
        box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.12);
        color: #92979B;
    }
    
    .file-upload {
        position: relative;
        display: inline-block;
    }
    
    .file-upload-label {
        display: block;
        padding: 9px 15px;
        color: #fff;
        background: #21D199;
        border-radius: 5px;
        font-size: 14px;
    }
    
    .upload-blue .file-upload-label {
        background: #5268F4;
    }
    
    .file-upload-input {
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        font-size: 1;
        width: 0;
        height: 100%;
        opacity: 0;
    }
    
    .text-gray {
        color: #92979B;
    }
    
    .company-item button {
        background: transparent;
        border: none;
    }
    
    .company-item span {
        display: block;
        margin-top: 20px;
    }
    
    .company-item {
        display: flex;
    }
    
    .company-item button {
        background: transparent;
        border: none;
        box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.12);
        padding: 25px 10px;
        display: block;
        width: 100%;
        border-radius: 5px;
    }
    
    .is-10 {
        width: 10px;
    }
    
    .is-15 {
        width: 15px;
    }
    
    .is-20 {
        width: 120px;
    }
    
    .is-25 {
        width: 25px;
    }
    
    .is-30 {
        width: 30px;
    }
    
    .is-35 {
        width: 35px;
    }
    
    .is-40 {
        width: 40px;
    }
    
    .owl-dots,
    .owl-nav {
        display: none;
    }
    
    .feature-item {
        border-right: 1px solid #000000;
    }
    
    .feature-item:last-child {
        border-right: none;
    }
    
    .feature-item img {
        transition: 300ms;
    }
    
    .features .feature-item:hover img {
        transform: translateY(-25px);
    }
    
    .animation-1 {
        transition: transform 0.5s ease;
        animation: ani1 5s ease-in-out infinite;
        transform-origin: bottom center;
    }
    
    @keyframes ani1 {
        0%,
        100% {
            transform: translateY(0) rotate(-19deg);
        }
        50% {
            transform: translateY(-10px) rotate(-10deg);
        }
    }
    
    .icon-cercle {
        width: 80px;
        height: 80px;
        background-color: #f4f4f1;
        display: block;
        border-radius: 100%;
    }
    
    .step-1 .icon-cercle {
        background-image: url(../img/login-step-1.png) !important;
        background-repeat: no-repeat;
        background-position: 20px 17px;
        transition: 300ms;
    }
    
    .step-1.finish .icon-cercle {
        background-position: -39px 17px;
    }
    
    .step-2 .icon-cercle {
        background-image: url(../img/login-step-2.png) !important;
        background-repeat: no-repeat;
        background-position: 19px 16px;
        transition: 300ms;
    }
    
    .step-2.finish .icon-cercle {
        background-position: -51px 16px
    }
    
    .step-3 .icon-cercle {
        background-image: url(../img/login-step-3.png) !important;
        background-repeat: no-repeat;
        background-position: 28px 31px;
        transition: 300ms;
    }
    
    .step-3.finish .icon-cercle {
        background-position: -28px 31px;
    }
    
    .finish .icon-cercle {
        background-color: #ff0054;
    }
    
    .active .icon-cercle {
        background-color: #ffe1ec;
    }
    
    .progress-holder h5 {
        font-weight: 500;
    }
    
    .progress-holder {
        padding: 0 50px;
        position: relative;
    }
    
    .line1,
    .line2 {
        width: 100%;
        height: 4px;
        background: #d9d9d9;
        z-index: -1;
        position: absolute;
        left: 12%;
        width: 40%;
        top: 41px;
    }
    
    .line2 {
        left: inherit;
        right: 8%;
    }
    
    .step.finish .line1,
    .step.finish .line2 {
        background: #ff0054 !important;
    }
    
    .card label {
        font-size: 14px;
        color: #fff;
    }
    
    .sign-in .card button {
        color: #000;
        background-color: #ffde00;
    }
    
    .card button:hover {
        box-shadow: 2px 3px 1px rgb(47 47 47);
    }
    
    .Sign-in .card button {
        background-color: #ffde00;
    }
    
    .Sign-in .card button:hover {
        color: #fff;
    }
    
    .card .form-control {
        height: 46px;
        border: none;
    }
    
    .next-btn {
        background-image: url(../img/arrow.png);
        background-position: 90% 10px;
        background-repeat: no-repeat;
    }
    
    .prev-btn {
        background-image: url(../img/arrow2.png);
        background-position: 15px 10px;
        background-repeat: no-repeat;
    }
    
    .check-adjust {
        position: relative;
        margin-right: 10px;
        top: 1px;
    }
    
    [type="radio"]:checked,
    [type="radio"]:not(:checked) {
        position: absolute;
        left: -9999px;
    }
    
    [type="radio"]:checked+label,
    [type="radio"]:not(:checked)+label {
        position: relative;
        padding-left: 28px;
        cursor: pointer;
        line-height: 20px;
        display: inline-block;
        color: #fff;
    }
    
    [type="radio"]:checked+label:before,
    [type="radio"]:not(:checked)+label:before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 20px;
        height: 20px;
        border: 1px solid #c2c2c2;
        border-radius: 100%;
        background: #fff;
    }
    
    [type="radio"]:checked+label:after,
    [type="radio"]:not(:checked)+label:after {
        content: '';
        width: 10px;
        height: 10px;
        background: #ffde00;
        position: absolute;
        top: 5px;
        left: 5px;
        border-radius: 100%;
        -webkit-transition: all 0.2s ease;
        transition: all 0.2s ease;
    }
    
    [type="radio"]:not(:checked)+label:after {
        opacity: 0;
        -webkit-transform: scale(0);
        transform: scale(0);
    }
    
    [type="radio"]:checked+label:after {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    
    label.cust-upload input[type="file"] {
        position: absolute;
        top: -100px;
    }
    
    .cust-upload {
        border-radius: 4px;
        padding: 8px 16px;
        margin: 2px;
        background: #e0e0e0;
        display: inline-block;
        color: #8c8c8c;
        margin-right: 15px;
        position: relative;
        overflow: hidden;
    }
    
    .text-small {
        font-size: 13px;
    }
    
    .text-light-gray {
        color: #fff;
    }
    
    .textarea-md {
        height: 100px !important;
    }
    
    .inner-banner {
        position: relative;
    }
    
    .btn-yellow {
        background-color: #ffde00;
        padding: 5px 30px;
        border: 3px solid #dfff;
    }
    
    .inner-banner h2 {
        font-family: 'edwardian_script_itcregular';
    }
    
    .inner-banner .banner-content {
        bottom: 30%;
        position: absolute;
    }
    
    .inner-banner {
        color: #fff;
    }
    
    .inner-banner h2 {
        color: #fff;
    }
    
    .breadcrumb {
        background: transparent;
        justify-content: flex-end;
        font-size: 13px;
    }
    
    .breadcrumb,
    .breadcrumb a {
        color: #797979;
    }
    
    .breadcrumb a:hover {
        color: #ff0054;
        text-decoration: none;
    }
    
    .breadcrumb-item+.breadcrumb-item::before {
        content: ">";
        padding-right: 4px;
        color: #cacaca;
    }
    
    .breadcrumb-item+.breadcrumb-item {
        padding-left: 5px;
    }
    
    .filter-holder {
        border: 1px solid #858585;
        padding: 0;
    }
    
    .filter-holder h6 {
        background: #e0e0e0;
        padding: 12px 15px;
    }
    
    .filter-holder label {
        color: #474747;
        margin-bottom: 7px !important;
        font-size: 13px;
    }
    
    .radio-red-color [type="radio"]:checked+label:after,
    .radio-red-color [type="radio"]:not(:checked)+label:after {
        background: #ff0054;
    }
    
    .form-control {
        width: 100% !important;
        height: 35px;
        display: block !important;
        border-radius: 10px;
        padding: 0 10px;
        color: #363636;
        border: 1px solid #c2c2c2;
        font-size: 12px;
    }
    
    .field-text-small .form-control {
        font-size: 12px;
        color: #8c8c8c;
    }
    
    .card-lite {
        width: 100%;
        background: transparent;
        box-shadow: none;
        border: none;
        box-shadow: 0px 0px 5px 1px rgb(0 0 0 / 10%);
        border-radius: 0px;
        font-size: 13px;
        color: #3a3a3a;
    }
    
    .filter-search .profile-img {
        max-width: 200px;
        margin: 10px 0 10px 10px;
    }
    
    .filter-search .profile-img img {
        border-radius: 10px;
    }
    
    .btn-green,
    .btn-red,
    .btn-orange {
        color: #fff;
    }
    
    .btn-green:hover,
    .btn-red:hover,
    .btn-green:active,
    .btn-red:active,
    .btn-orange:hover,
    .btn-orange:active {
        color: #fff;
    }
    
    .btn-normal,
    .btn-lite-gray {
        color: #646464;
    }
    
    .btn-green {
        background-color: #00a108;
    }
    
    .btn-red {
        background-color: #ff0054;
    }
    
    .btn-normal {
        background-color: #fff;
        border: 1px solid #b2b2b2;
    }
    
    .btn-lite-gray {
        background-color: #f4f4f4;
        border: 1px solid #b2b2b2;
    }
    
    .btn-normal.btn-sm,
    .btn-lite-gray.btn-sm,
    .btn-green.btn-sm,
    .btn-red.btn-sm {
        padding: 5px 35px;
        height: 32px;
    }
    
    .btn.btn-sm {
        font-size: 11px;
    }
    
    .dots span {
        width: 7px;
        height: 7px;
        border-radius: 100%;
        border: 1px solid #b2b2b2;
        display: inline-block;
    }
    
    .profile-details .btn-green {
        background-image: url(../img/send-icon.png);
        background-repeat: no-repeat;
        background-position: 10px 8px;
    }
    
    .profile-details .btn-red {
        background-image: url(../img/contact-icon.png);
        background-repeat: no-repeat;
        background-position: 12px 10px;
    }
    /* .profile-details .btn-normal {
        background-image: url(../img/shortlist-icon.png);
        background-repeat: no-repeat;
        background-position: 12px 10px;
    }
    
    .profile-details .btn-normal {
        background-image: url(../img/shortlist-icon.png);
        background-repeat: no-repeat;
        background-position: 14px 11px;
    } */
    
    .pagination .page-item .page-link {
        color: #878789;
        padding: 9px 5px;
        font-size: 13px;
        border-radius: 100%;
        width: 35px;
        height: 35px;
        margin: 4px;
        text-align: center;
    }
    
    .pagination .page-item .page-link:hover {
        background-color: #ff0054;
        color: #fff;
    }
    
    .next-page a,
    .prew-page a {
        border: none;
    }
    
    .pagination-holder {
        display: flex;
        justify-content: center;
    }
    
    .pagination .active {
        background-color: #ff0054;
        color: #fff !important;
    }
    
    .no-radius {
        border-radius: 0;
    }
    
    .tab {
        display: none;
    }
    
    .tab input[type="text"],
    .tab input[type="password"],
    .tab input[type="email"],
    .tab input[type="number"],
    .tab select,
    .tab textarea {
        width: 100% !important;
        height: 35px;
        display: block !important;
        border-radius: 10px;
        padding: 0 10px;
        color: #363636;
        border: 1px solid #c2c2c2;
        font-size: 12px;
        height: 46px;
        outline: none;
    }
    
    .tab input[type="text"]:focus,
    .tab input[type="password"]:focus,
    .tab input[type="email"]:focus,
    .tab input[type="number"]:focus,
    .tab select:focus,
    .tab textarea:focus {
        outline: none;
        box-shadow: none;
    }
    
    .tab textarea {
        height: 100px !important;
    }
    
    .header .btn-normal {
        border: none;
    }
    
    .upload-btn-wrapper {
        position: relative;
        overflow: hidden;
        display: inline-block;
    }
    
    .upload-btn-wrapper input[type=file] {
        font-size: 100px;
        position: absolute;
        left: 0;
        top: 0;
        opacity: 0;
    }
    
    .profile-page .profile-img {
        border-radius: 100%;
        width: 180px;
        border: 5px solid #fff;
        box-shadow: 0px 0px 7px 1px rgb(0 0 0 / 17%);
        height: 180px;
        display: inline-block;
        margin-top: -65px;
        position: relative;
        background: #fff;
    }
    
    .change-dp {
        position: absolute;
        bottom: 15px;
        right: 0;
        z-index: 9;
    }
    
    .change-dp button {
        width: 27px;
        height: 27px;
        display: inline-block;
        position: relative;
        background: #ff0054 url(../img/icon-set-01.png) no-repeat;
        background-position: -6px -1px;
        border-radius: 100%;
    }
    
    .profile-img span {
        display: block;
        overflow: hidden;
        border-radius: 100%;
    }
    /* .profile-page .profile-img img {
        width: 170px;
        height: 170px;
    } */
    
    .profile-desc span {
        font-size: 12px;
    }
    
    .account-type {
        background: #ff0054;
        padding: 8px 15px 6px;
        border-radius: 10px;
        color: #fff;
        margin-top: 6px;
    }
    
    .text-normal {
        font-size: 12px;
        text-transform: none;
    }
    
    .icon-edit {
        display: block;
        font-size: 13px;
        padding: 0px 15px 6px;
        border-radius: 10px;
        color: #000000;
    }
    
    .icon-edit .icon {
        display: inline-block;
        width: 25px;
        height: 23px;
        background: url(../img/icon-set-01.png) no-repeat;
        background-position: -88px 0px;
        position: relative;
        top: 4px;
    }
    
    .account-type .icon {
        display: inline-block;
        width: 25px;
        height: 25px;
        background: url(../img/icon-set-01.png) no-repeat;
        background-position: -130px 0px;
        position: relative;
        top: 4px;
    }
    
    .verified-sign {
        font-size: 12px;
        color: #4258ff;
    }
    
    .verified-sign .icon {
        width: 22px;
        height: 24px;
        display: inline-block;
        position: relative;
        top: 4px;
        background: url(../img/icon-set-01.png) no-repeat;
        background-position: -44px 0px;
    }
    
    .progress {
        height: 12px !important;
        border-radius: 0;
    }
    
    .bg-danger {
        background: #ff0054 !important;
    }
    
    .profile-page {
        font-size: 12px;
    }
    
    .nav-tabs {
        border: 1px solid #3a3a3a;
        text-transform: uppercase;
    }
    
    .nav-tabs .nav-link {
        font-weight: 600;
        color: #3a3a3a;
        padding: 0 15px;
        font-size: 14px;
        padding: 8px 20px 13px;
        border: none;
    }
    
    .nav-tabs .nav-link.active {
        color: #ff0054;
        background-color: transparent;
        border: none;
    }
    
    .member-id {
        position: absolute;
        right: 30px;
        top: 16px;
        font-weight: 600;
    }
    
    .vertical-tab .nav-tabs {
        border: none;
    }
    
    .vertical-tab .nav-tabs a {
        display: block;
        padding: 12px 15px 20px;
        color: #3a3a3a;
        border-bottom: 1px solid #dbdbdb;
        text-decoration: none;
    }
    
    .vertical-tab .nav-tabs .active a,
    .vertical-tab .nav-tabs li:hover a {
        background-color: #ff0054;
        color: #fff;
    }
    
    .about-tab li a .icon {
        width: 29px;
        height: 24px;
        display: inline-block;
        position: relative;
        top: 4px;
        background: url(../img/icon-set-01.png) no-repeat;
        background-position: -6px -72px;
        margin-right: 10px;
        transition: all 300ms;
    }
    
    .about-tab .personal a .icon {
        background-position: -6px -72px;
    }
    
    .about-tab .personal.active a .icon,
    .about-tab .personal:hover a .icon {
        background-position: -7px -114px;
    }
    
    .about-tab .bio a .icon {
        width: 30px;
        height: 29px;
        background-position: -110px -72px;
    }
    
    .about-tab .bio.active a .icon,
    .about-tab .bio:hover a .icon {
        background-position: -110px -113px;
    }
    
    .about-tab .family a .icon {
        background-position: -57px -73px;
    }
    
    .about-tab .family.active a .icon,
    .about-tab .family:hover a .icon {
        background-position: -57px -112px;
    }
    
    .about-tab .professional a .icon {
        background-position: -163px -72px;
    }
    
    .about-tab .professional.active a .icon,
    .about-tab .professional:hover a .icon {
        background-position: -163px -115px;
    }
    
    .about-tab .interests a .icon {
        height: 35px;
        background-position: -218px -72px;
    }
    
    .about-tab .interests.active a .icon,
    .about-tab .interests:hover a .icon {
        background-position: -218px -115px;
    }
    
    .vertical-tab .nav-tabs a {
        display: flex;
        align-items: center;
    }
    
    .vertical-tab .nav-tabs a span {
        position: relative;
        top: 6px;
    }
    
    .tab-normal a.nav-link {
        position: relative;
    }
    
    .tab-normal .nav-item a::after {
        content: "|";
        display: inline-block;
        position: absolute;
        right: 0;
        top: 15px;
    }
    
    .nav-item.partner .nav-link::after {
        display: none;
    }
    
    .member-content li a .icon {
        width: 32px;
        height: 22px;
        display: inline-block;
        position: relative;
        top: 6px;
        background: url(../img/icon-set-01.png) no-repeat;
        margin-right: 4px;
        transition: all 300ms
    }
    
    .member-content li.about a .icon {
        background-position: -7px -41px;
    }
    
    .member-content li.photos a .icon {
        width: 33px;
        height: 24px;
        background-position: -64px -41px;
    }
    
    .member-content li.partner a .icon {
        background-position: -7px -41px;
    }
    
    .table td,
    .table th {
        padding: 4px 15px;
        border-top: none;
    }
    
    th {
        font-weight: 400;
    }
    
    .table-striped tbody tr {
        background: #f8f8f8;
    }
    
    .table-striped tbody tr:nth-of-type(odd) {
        background-color: #fdfdfd;
    }
    
    td.right-border {
        border-right: 1px solid #e6e6e6;
    }
    
    .profile-page p {
        line-height: 20px;
        margin-bottom: 25px;
    }
    
    .vertical-tab .card {
        min-height: 360px;
    }
    
    .partner-btn-holder .account-type {
        padding: 0px 15px 6px;
        margin-top: 0;
        border-radius: 17px;
        height: 32px;
    }
    
    .partner-btn-holder .account-type .icon {
        height: 22px;
        top: 0px;
    }
    
    .btn-right-align {
        position: absolute;
        right: 0;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        top: 0;
    }
    
    .partner-btn-holder .btn-normal {
        margin-bottom: 70px;
    }
    
    .main-content .dropdown-menu {
        min-width: 100px;
        padding: 0;
        text-align: left;
        box-shadow: 0px 0px 5px 1px rgb(0 0 0 / 10%);
        border: none;
        border-radius: 6px;
        overflow: hidden;
    }
    
    .main-content .dropdown-menu .dropdown-item {
        padding: 3px 15px;
        font-size: 12px;
    }
    
    .main-content .dropdown-menu .dropdown-item:hover,
    .main-content .dropdown-menu .dropdown-item:active {
        background-color: #ff0054;
        color: #fff;
    }
    
    .partner-page .nav-tabs .nav-item.photos a::after {
        display: none;
    }
    
    .tab-curved li a {
        border-radius: 40px;
        border: 1px solid #a0a0a0;
        color: #3a3a3a;
        text-align: center;
        font-size: 14px;
        padding: 15px;
    }
    
    .tab-curved span.count {
        width: 25px;
        height: 25px;
        display: inline-block;
        border-radius: 100%;
        background: #ff0054;
        color: #fff;
        font-size: 12px;
        padding-top: 2px;
        margin-left: 15px;
    }
    
    .tab-curved li a.active {
        background: #ff0054;
        color: #fff;
    }
    
    .tab-curved a.active span.count {
        background: #fff;
        color: #000;
    }
    
    .btn-orange {
        background-color: #ff4e00;
        color: #fff;
        padding: 5px 35px;
    }
    
    .profile-page .partner-tab .profile-img {
        border-radius: 10px;
        width: inherit;
        border: none;
        box-shadow: none;
        height: inherit;
        display: inline-block;
        margin-top: 0;
        background: transparent;
        overflow: hidden;
    }
    
    .profile-page .partner-tab .profile-img img {
        width: inherit;
        height: inherit;
    }
    
    .profile-page .partner-tab .card-body .row .row {
        background: #f4f4f4;
        margin: 0;
        padding: 10px;
    }
    
    .premium-badge {
        position: absolute;
        bottom: 9px;
        z-index: 9;
        background: #ff0054;
        border-radius: 0px 10px 10px 0px !important;
        font-size: 10px;
        color: #fffd;
        padding: 0px 11px;
    }
    
    .tab-curved .btn-normal.btn-sm,
    .tab-curved .btn-orange.btn-sm,
    .tab-curved .btn-lite-gray.btn-sm,
    .tab-curved .btn-green.btn-sm,
    .tab-curved .btn-red.btn-sm {
        padding: 5px 26px;
        height: 29px;
        font-size: 10px !important;
    }
    
    .accepted {
        background-image: url(../img/tick.png) !important;
        background-size: 13px;
    }
    
    .btn-delete {
        background-image: url(../img/delete.png) !important;
        background-position: center;
        background-size: 13px;
        background-repeat: no-repeat;
        text-indent: -1000px;
        overflow: hidden;
    }
    
    .profile-page .tab-curved .btn-green {
        background-image: url(../img/send-icon.png);
        background-repeat: no-repeat;
        background-position: 10px 8px;
        background-size: 13px;
    }
    
    .profile-page .owl-dots {
        display: none;
    }
    
    .profile-page .owl-nav {
        position: absolute;
        width: 100%;
        top: 38%;
    }
    
    .profile-page .owl-nav button {
        margin: 0 !important;
    }
    
    .modal-dialog .close {
        position: absolute;
        right: -8px;
        top: -5px;
        width: 25px;
        height: 25px;
        background: #f00;
        opacity: 1;
        color: #fff;
        font-weight: 300;
        font-size: 14px;
        z-index: 100;
        border-radius: 2px;
    }
    
    .modal-dialog .close:hover {
        opacity: 1 !important;
    }
    
    .modal-dialog img {
        width: 100%;
    }
    
    .modal-content {
        border-radius: 0;
    }
    
    .my-account img {
        width: 34px;
        height: 34px;
        border-radius: 100%;
    }
    
    .header .dropdown.my-account {
        top: -7px;
    }
    
    .my-account button {
        padding: 0 15px !important;
    }
    
    .dropdown-toggle::after {
        border: none;
        width: 15px;
        height: 15px;
        background-image: url(../img/arrow-dark.png);
        background-repeat: no-repeat;
        background-position: center;
        background-size: 10px;
        top: 9px;
        position: relative;
    }
    
    .dropdown-menu {
        font-size: 14px;
    }
    
    .header .navbar ul li .dropdown a {
        transition: 300ms color;
        border-bottom: 1px solid #f3f3f3;
        padding: 6px 15px !important;
        color: #4a4a4a;
        padding: 6px 15px !important;
    }
    
    .header .my-account a:hover {
        color: #ff0054!important;
    }
    
    .header .navbar ul li .dropdown a:hover,
    .header .navbar ul li .dropdown a:active {
        background-color: transparent;
    }
    
    .header .navbar ul li .dropdown a:last-child {
        border-bottom: none;
    }
    
    .dropdown .dropdown-menu {
        position: absolute;
        /* padding: 0; */
        box-shadow: 0px 3px 4px 1px rgb(0 0 0 / 5%);
        border-color: #efefef;
        border-radius: 10px;
    }
    
    .lite-gray-color {
        color: #a8a8a8;
    }
    
    .icon-rs {
        width: 30px;
        height: 30px;
        display: inline-block;
        background-image: url(../img/rs.png);
        background-repeat: no-repeat;
        background-position: center;
        background-size: 19px;
    }
    
    .package-item {
        font-size: 13px;
        text-align: center;
        color: #ffffff;
        transition: 500ms all;
    }
    
    .package-item:hover {
        transform: translate(0, -15px);
    }
    
    .discount {
        background-color: #ffffff;
        color: rgb(0, 0, 0);
        padding: 1px 5px;
        display: block;
        border-radius: 15px;
        margin: 25px 0;
    }
    
    .package-item h5 .package-item h5 span,
    .package-item h5,
    .package-item h1 {
        color: #fff;
    }
    
    .package-item .list li {
        background: url(../img/list-icon-green.png) no-repeat;
        padding: 0px 0 20px 30px;
        background-size: 20px;
    }
    
    .card-body {
        padding: 15px;
    }
    /* my account dropdown css here 13/02/2021 */
    
    .my-account a:hover {
        text-decoration: none;
    }
    
    .my-account .dropdown-menu {
        width: 400px;
        max-width: 400px;
        padding: 25px 15px 15px;
    }
    
    .my-account .dropdown-menu h5 span {
        font-size: 14px;
        color: #868686;
        font-weight: 400;
    }
    
    .text-orange {
        color: #ffa500 !important;
    }
    
    .my-account .dropdown-menu .bottom-border {
        border-bottom: 1px solid #e7e7e7;
    }
    
    .my-account .dropdown-menu i::before {
        font-size: 18px;
        margin-right: 5px;
        color: #ffa500;
    }
    
    .my-account .dropdown-menu ul {
        margin: 0;
        padding-right: 20px;
    }
    
    .my-account .dropdown-menu ul li {
        list-style: none;
        margin-bottom: 8px;
    }
    
    .right-border {
        border-right: 1px solid #e7e7e7;
    }
    
    .header .my-account .dropdown-menu ul li a {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    .header .my-account .dropdown-menu .user-item {
        padding-left: 20px;
        padding-right: 20px;
    }
    
    .header .my-account .dropdown-menu .user-item a {
        padding-left: 3px !important;
    }
    /* my account dropdown css end here 13/02/2021 */
    
    .package-item button {
        position: absolute;
        bottom: 20px;
        left: 26%;
        font-size: 14px;
        padding: 8px 32px;
        border-radius: 35px;
        background-color: #fff;
        color: #000;
    }
    
    .package-item button:hover {
        background-color: #ffde00;
        color: #000;
    }
    
    .font-roboto {
        font-family: 'Roboto', sans-serif !important;
    }
    
    footer {
        font-size: 13px;
    }
    
    .file-upload {
        display: block;
        text-align: left;
        font-size: 12px;
    }
    
    .file-upload .file-select {
        display: block;
        color: #34495e;
        cursor: pointer;
        height: 40px;
        line-height: 40px;
        text-align: left;
        overflow: hidden;
        position: relative;
    }
    
    .file-upload .file-select .file-select-button {
        background: #ffde00;
        padding: 0px 15px;
        display: inline-block;
        height: 40px;
        line-height: 40px;
        border-radius: 10px;
        cursor: pointer;
    }
    
    .file-upload .file-select .file-select-name {
        line-height: 40px;
        display: inline-block;
        padding: 0 10px;
        color: #fff
    }
    
    .file-upload.active .file-select {
        border-color: #3fa46a;
        transition: all .2s ease-in-out;
        -moz-transition: all .2s ease-in-out;
        -webkit-transition: all .2s ease-in-out;
        -o-transition: all .2s ease-in-out;
    }
    
    .file-upload.active .file-select .file-select-button {
        background: #3fa46a;
        color: #FFFFFF;
        transition: all .2s ease-in-out;
        -moz-transition: all .2s ease-in-out;
        -webkit-transition: all .2s ease-in-out;
        -o-transition: all .2s ease-in-out;
    }
    
    .file-upload .file-select input[type=file] {
        z-index: 100;
        cursor: pointer;
        position: absolute;
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
        opacity: 0;
        filter: alpha(opacity=0);
    }
    
    .file-upload .file-select.file-select-disabled {
        opacity: 0.65;
    }
    
    .file-upload .file-select.file-select-disabled:hover .file-select-button {
        background: #dce4ec;
        color: #666666;
        padding: 0 10px;
        display: inline-block;
        height: 40px;
        line-height: 40px;
    }
    
    .file-upload .file-select.file-select-disabled:hover .file-select-name {
        line-height: 40px;
        display: inline-block;
        padding: 0 10px;
    }
    
    .text-dark-gray {
        color: #2d2d2d;
    }
    
    .text-vsm {
        font-size: 10px;
    }
    
    .active .file-select-name {
        color: #3fa46a;
    }
    
    .notification .dropdown-toggle::after {
        display: none;
    }
    
    .notification .dropdown-menu {
        min-width: 270px;
        font-size: 13px;
        box-shadow: 0px 3px 4px 1px rgb(0 0 0 / 5%);
        border-color: #efefef;
        border-radius: 10px;
        padding: 15px;
    }
    
    .dropdown-menu {
        font-size: 13px;
        border-radius: 10px;
        padding: 15px;
    }
    
    .header .navbar .notification .dropdown-menu a {
        display: block;
        color: #4a4a4a;
        padding: 0 !important;
    }
    
    .header .notification .dropdown-menu a:hover {
        text-decoration: none;
        color: #ff0054!important;
    }
    
    .notification .dropdown-menu li {
        border-bottom: 1px solid #f3f3f3;
        padding-bottom: 7px;
        margin-bottom: 7px;
    }
    
    .top-text-light {
        font-size: 10px;
        margin-top: -3px;
        color: #929292;
    }
    
    .top-text-heading {
        line-height: 20px;
    }
    
    .header .dropdown-menu {
        top: 65px;
    }
    
    .upload-multiple-photos {
        position: absolute;
        right: 0;
        top: -52px;
    }
    
    .upload-multiple-photos .file-select .file-select-button {
        background: transparent;
        padding: 0px 15px;
        display: inline-block;
        height: 37px;
        line-height: 37px;
        border-radius: 10px;
        cursor: pointer;
        color: #333;
        font-size: 12px;
    }
    
    .upload-multiple-photos .file-select .file-select-button .icon {
        width: 33px;
        height: 24px;
        display: inline-block;
        position: relative;
        top: 7px;
        background: url(../img/icon-set-01.png) no-repeat;
        background-position: -64px -41px;
        margin-right: 4px;
        transition: all 300ms;
    }
    
    .upload-multiple-photos.file-upload.active .file-select .file-select-button {
        background: inherit;
        color: inherit;
    }
    
    .loader {
        border: 9px solid #f3f3f3;
        border-radius: 50%;
        border-top: 9px solid #ff0054;
        border-bottom: 9px solid #ffde00;
        width: 65px;
        height: 65px;
        -webkit-animation: spin 2s linear infinite;
        animation: spin 2s linear infinite;
    }
    
    @-webkit-keyframes spin {
        0% {
            -webkit-transform: rotate(0deg);
        }
        100% {
            -webkit-transform: rotate(360deg);
        }
    }
    
    @keyframes spin {
        0% {
            transform: rotate(0deg);
        }
        100% {
            transform: rotate(360deg);
        }
    }
    
    .loader-holder {
        height: 100%;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 9999;
        background: #fff;
    }
    
    .navbar-collapse .navbar-toggler {
        display: none;
    }
    
    .bottom-border {
        border-bottom: 3px solid #ff0054;
        padding-bottom: 10px;
    }
    
    .matches .owl-dots {
        display: block;
    }
    
    .search-result .card .row {
        margin: 0;
    }
    
    #MemberPhotos .btn-delete {
        position: absolute;
        top: 0;
        right: 0;
        background: #ffebeb;
        width: 26px;
        height: 26px;
        background-repeat: no-repeat;
        border-radius: 0;
        background-position: center;
        border-radius: 0px 0px 0px 9px;
        background-size: 14px;
    }
    /*==================login after home css start here==================== */
    
    .profile-sec {
        padding: 30px 0px;
    }
    
    .profile-sec .profile-card {
        padding: 20px;
        border-radius: 20px;
        background: rgb(92, 214, 222);
        background: linear-gradient(90deg, rgba(92, 214, 222, 1) 0%, rgba(85, 231, 188, 1) 100%);
    }
    
    .profile-card .avatar {
        border-radius: 100%;
        border: 5px solid #fff;
        position: relative;
        display: inline-block;
        width: 110px;
        height: 110px;
        background-color: #fff;
        box-shadow: 0px 0px 7px 1px rgb(0 0 0 / 17%);
    }
    
    .profile-card .avatar .change-dp {
        bottom: -5px;
    }
    
    .profile-card .avatar span {
        border-radius: 100%;
        overflow: hidden;
        display: block;
    }
    
    .profile-card .avatar img {
        width: 100px;
        height: 100px;
    }
    
    .profile-card .profile-short h3 {
        font-size: 20px;
        color: #fff;
        text-transform: uppercase;
        display: inline-block;
        margin-bottom: 15px;
    }
    
    .profile-card .profile-short h6 {
        color: #fff;
        font-weight: 400;
    }
    
    .profile-card .profile-short i::before {
        font-size: 14px;
        color: #ff0054;
    }
    
    .profile-card .profile-short h3 span {
        font-size: 13px;
        text-transform: capitalize;
        font-weight: 400;
    }
    
    .profile-card .profile-short .account-type {
        font-size: 13px;
        padding: 7px 20px;
    }
    
    .profile-card .profile-short .account-type .icon {
        margin-right: 5px;
    }
    
    .profile-card .progress-sec {
        width: 60%;
    }
    
    .profile-card .progress-sec span {
        font-size: 15px;
        color: #fff;
    }
    
    .profile-card .profile-r-top {
        width: 100%;
    }
    
    .profile-card .profile-r-top .profile-edit i::before {
        margin-right: 5px;
    }
    
    .profile-card .profile-highlight {
        display: flex;
        flex-direction: column;
    }
    
    .profile-btns {
        margin-top: 53px;
    }
    
    .profile-btns i::before {
        margin-right: 5px;
        color: #ff0054;
    }
    
    .btn-common {
        font-size: 13px;
        padding: 5px 20px;
        border: 0px;
        width: 100%;
    }
    
    .btn-common:hover {
        background-color: #ff0054;
        color: #ffff;
    }
    
    .btn-common:hover i::before {
        color: #fff;
    }
    /* ======home content main section==== */
    
    section.home-main-sec {
        padding: 50px 0px;
    }
    
    section.home-main-sec .card-body {
        border-radius: 20px;
        padding: 0px;
        background-color: #fff;
        box-shadow: 0px 0px 13px 3px rgb(0 0 0 / 10%);
    }
    
    section.home-main-sec .card-body .card-head {
        padding: 15px 15px;
        background-color: #d94899;
        border-radius: 20px 20px 0px 0px;
    }
    
    section.home-main-sec .card-body .card-head2 {
        background-color: #fff;
    }
    
    section.home-main-sec .card-body .card-head h3 {
        font-size: 18px;
        font-weight: 500;
        color: #fff;
        margin-bottom: 0px;
    }
    
    section.home-main-sec .card-body .card-head2 h3 {
        color: #1C1E21;
        font-weight: 500;
    }
    
    section.home-main-sec .card-body .card-head2 .view-all a {
        color: #1C1E21;
        font-weight: 500;
    }
    
    section.home-main-sec .card-body .card-head .view-all .bi-chevron-right::before {
        font-size: 13px;
        line-height: 1.1;
    }
    
    section.home-main-sec .card-body .card-grid-main {
        padding: 30px 20px;
    }
    
    section.home-main-sec .card-grid .figure {
        border-radius: 20px;
        position: relative;
        border: 1px solid #ccc;
        display: block;
    }
    
    .account-type-tag {
        position: absolute;
        left: 0px;
        bottom: 10px;
        border: 16px solid #ff0054;
        border-left: 0;
        border-right: 10px solid transparent;
        line-height: 0;
        width: 100px;
        color: white;
        z-index: 1;
        -webkit-filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.3));
        filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.3));
    }
    
    .account-type-tag span {
        position: relative;
        padding: 0px 0px 0px 8px;
        text-align: center;
        font-size: 15px;
    }
    
    section.home-main-sec .card-grid .figure img {
        border-radius: 20px;
        width: 100%;
    }
    
    section.home-main-sec .card-grid .profile-desc {
        padding: 15px 0px 0px 0px;
    }
    
    section.home-main-sec .card-grid .profile-desc h4 {
        font-size: 15px;
        color: #3a3a3a;
        margin-bottom: 10px;
    }
    
    section.home-main-sec .card-grid .profile-desc span {
        font-size: 13px;
        display: block;
    }
    
    section.home-main-sec .card-grid .profile-desc .respnd-btn a {
        font-size: 13px;
        font-weight: 500;
        color: #8f8f8f;
    }
    
    section.home-main-sec .card-grid .profile-desc .respnd-btn .accpt a {
        color: #ff0054;
    }
    
    .card-grid .profile-desc .view-profile {
        font-size: 13px;
        font-weight: 500;
        color: #ff0054;
        text-transform: uppercase;
        text-decoration: none;
    }
    
    .view-all a {
        font-size: 13px;
        color: #fff;
        font-weight: 500;
    }
    
    section.home-main-sec .s-lable {
        font-size: 16px;
        color: #fff;
        margin-bottom: 5px;
    }
    
    section.home-main-sec .form-control {
        font-size: 14px;
        font-weight: 400;
        height: 45px;
    }
    
    section.home-main-sec .search-box .btn-danger {
        height: 45px;
        background-color: #e936a1;
    }
    
    section.home-main-sec .match-search {
        margin-bottom: 30px;
    }
    
    section.home-main-sec .discover-match nav {
        padding: 30px 15px 0px;
    }
    
    section.home-main-sec .discover-match .nav-tabs {
        border: none;
        text-transform: capitalize;
    }
    
    section.home-main-sec .discover-match .nav-tabs .nav-link {
        font-weight: 500;
        padding: 5px 20px;
        border: 1px solid #ccc;
        border-radius: 30px;
        margin-right: 10px;
    }
    
    section.home-main-sec .discover-match .nav-tabs .nav-link.active {
        background-color: #ff0054;
        color: #fff;
    }
    
    section.home-main-sec .filtered-match .f-match-row {
        padding: 10px 0px;
        border-bottom: 1px solid #cccc;
    }
    
    section.home-main-sec .filtered-match .f-match-row:last-child {
        border: none;
    }
    
    section.home-main-sec .filtered-match .f-match-row .f-match-img {
        border-radius: 20px;
        height: 100px;
        width: 100px;
        margin-right: 20px;
    }
    
    section.home-main-sec .filtered-match .f-match-row .f-match-img img {
        border-radius: 20px;
    }
    
    section.home-main-sec .filtered-match .f-match-row .profile-desc {
        padding: 0px;
    }
    
    .success-story .story-main {
        padding: 40px 20px;
    }
    
    .success-story .story-main img {
        border-radius: 20px;
    }
    
    .success-story .couples-details h3 {
        font-size: 18px;
        font-weight: 500;
        margin: 20px 0px;
    }
    
    .success-story .couples-details a {
        font-size: 14px;
        color: #ff0054;
        font-weight: 500;
    }
    
    .card-body .notification-count {
        padding: 20px;
    }
    
    .card-body .notification-count .count-card {
        padding: 10px 10px;
        border-radius: 20px;
    }
    
    .card-body .notification-count h3 {
        font-size: 35px;
        color: #fff;
        margin-bottom: 0px;
    }
    
    .card-body .notification-count .request-recvd {
        background-color: #26c4ec;
        height: 200px;
        background-image: url(../img/count1-bg.png);
        background-repeat: no-repeat;
        background-size: cover;
    }
    
    .card-body .notification-count .request-recvd h5 {
        padding-top: 70px;
    }
    
    .card-body .notification-count .My-intrst {
        background-color: #17d96e;
        height: 90px;
        background-image: url(../img/count2-bg.png);
        background-repeat: no-repeat;
        background-size: cover;
    }
    
    .card-body .notification-count .shortlisted {
        background-color: #ec51ad;
        height: 90px;
        background-image: url(../img/count3-bg.png);
        background-repeat: no-repeat;
        background-size: cover;
    }
    
    .card-body .notification-count h5 {
        font-size: 20px;
        color: #fff;
        margin-bottom: 0px;
        font-weight: 400;
    }
    
    .card-body .add-bnr {
        padding: 20px;
    }
    /* media query start here */
    
    @media screen and (max-width: 1300px) {
        .intro img {
            width: 49% !important;
        }
        .search-partner {
            bottom: 35%;
        }
    }
    
    @media screen and (max-width: 1220px) {
        .profile-page .partner-tab .profile-img {
            width: 100%;
            flex-basis: 100%;
            max-width: 100%;
            text-align: center;
            margin-bottom: 25px;
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        .profile-page .partner-tab .profile-img img {
            width: 170px;
            border-radius: 10px;
        }
        .premium-badge {
            position: inherit;
            border-radius: 15px !important;
            max-width: 150px;
        }
        .profile-page .profile-details {
            width: 100%;
            flex-basis: 100%;
            max-width: 100%;
            padding: 15px !important;
        }
        .profile-page .filter-btn-holder {
            justify-content: center;
        }
    }
    
    @media screen and (max-width: 1100px) {
        .search-result .profile-img {
            max-width: 240px;
        }
        .search-result .profile-img img {
            width: 100%;
        }
        .btn.btn-sm {
            font-size: 9px;
        }
        .filter-btn-holder {
            display: flex;
            flex-wrap: wrap
        }
        .filter-btn-holder button {
            flex: 0 0 40%;
            margin-bottom: 10px;
        }
        .search-result .profile-img {
            text-align: center;
            flex-basis: 100%;
            max-width: 100%;
            padding: 25px;
        }
        .profile-details {
            padding: 40px;
            max-width: 100%;
            flex: 100%;
            background: #f2f2f2;
        }
        .search-result .profile-img img {
            max-width: 200px;
        }
        .inner-banner .banner-content {
            bottom: 13%;
        }
        .filter-holder {
            margin-bottom: 30px;
        }
    }
    
    @media screen and (max-width: 1024px) {
        .features {
            margin-top: -26px;
        }
        .intro {
            margin-top: 0 !important;
        }
    }
    
    @media screen and (max-width: 992px) {
        .card {
            padding: 15px !important;
        }
        .search-result {
            padding-left: 0 !important;
        }
        .banner-content h2 {
            font-size: 24px;
            margin-bottom: 20px;
        }
        .navbar {
            position: absolute;
            right: 15px;
            display: flex;
            justify-content: flex-end;
            z-index: 99;
        }
        .navbar-collapse {
            background: #fff;
            text-align: right;
            padding: 15px;
        }
        .navbar-collapse li.nav-item {
            margin-bottom: 15px;
        }
        button.navbar-toggler {
            margin-top: -10px;
        }
        .header .row {
            position: relative;
        }
        .search-box label {
            margin-left: 0 !important;
        }
        .search-partner h1 {
            margin-bottom: 73px !important;
        }
        .search-partner {
            bottom: 18%;
        }
        .package-item button {
            left: 39%;
        }
        .navbar-collapse {
            background: rgb(16 9 9 / 96%);
            text-align: right;
            padding: 15px;
            position: fixed;
            right: 0;
            bottom: 0;
            left: 0;
            height: 100%;
            text-align: center;
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;
            border: 5px solid #fff;
            overflow-y: scroll;
        }
        .navbar-collapse .navbar-toggler {
            display: block;
        }
        .header .dropdown.my-account {
            top: 0;
            background: #fff;
            height: 50px;
            width: 83px;
            display: flex;
            align-items: center;
            border-radius: 15px;
            margin-top: 0;
            margin-right: 15px;
        }
        li.nav-item.notification {
            top: 0;
            background: #fff;
            height: 50px;
            width: 50px;
            display: flex;
            align-items: center;
            border-radius: 15px;
            margin-top: 0;
        }
        .header ul.navbar-nav {
            display: flex;
            justify-content: center;
            flex-basis: 100%;
            width: 100%;
            flex-direction: row;
            align-items: center;
        }
        .navbar-light .navbar-nav .nav-link {
            color: #ffffff;
        }
        .navbar-nav .dropdown-menu {
            position: absolute;
        }
        .header .navbar-collapse li.nav-item {
            margin-bottom: 0;
            margin-top: 0;
        }
        .header .navbar-collapse button.navbar-toggler {
            position: absolute;
            right: 10px;
            background: #ff0054ad;
            top: 33px;
            padding: 5px;
            padding: 1px 8px 4px;
            font-weight: 300;
            border-radius: 7px;
        }
        .header .navbar-collapse button.navbar-toggler::after {
            content: "X";
            color: #fff;
            font-size: 15px;
        }
        .card-body .notification-count h5 {
            font-size: 16px;
        }
        .card-body .notification-count h3 {
            font-size: 30px;
        }
    }
    
    @media screen and (max-width: 902px) {
        .search-partner {
            position: inherit;
        }
        .search-partner h1 {
            text-align: center;
            margin-top: 40px;
            margin-bottom: 55px !important;
        }
        .search-partner h5 {
            text-align: center;
        }
        .features {
            margin-top: 50px;
        }
        .intro-bg {
            display: none;
        }
        li.nav-item {
            display: block;
            margin: 13px 0;
            text-align: right;
        }
        .search-partner .container {
            padding: 0;
        }
        .search-partner {
            padding: 0 15px;
        }
        .nav-tabs .nav-item {
            margin-top: 0;
        }
        .intro {
            background-image: none;
        }
    }
    
    @media screen and (max-width: 768px) {
        .register {
            text-align: center;
        }
        .register .btn-reg {
            margin-top: 40px;
        }
        .file-upload {
            flex-direction: column;
            justify-content: flex-start;
            align-items: flex-start !important;
        }
        .profile-top {
            position: relative;
        }
        .edit-holder {
            position: absolute;
            bottom: 45px;
        }
        .member-content {
            flex-direction: column;
            align-items: flex-start;
        }
        .tab-normal .nav-item a::after {
            display: none;
        }
        .nav-tabs .nav-item {
            width: 100%;
            text-align: left;
            border-bottom: 1px solid #3a3a3a;
        }
        .member-id {
            right: 15px;
            top: -29px;
        }
        .partner-page .member-highlights {
            flex-direction: column;
        }
        .search-partner .search-box {
            background: #560621;
        }
        .card-body .notification-count .request-recvd {
            height: auto;
        }
        .card-body .notification-count .request-recvd h5 {
            padding-top: 0px;
        }
        section.home-main-sec {
            padding: 0px 0px;
        }
        section.home-main-sec .card-body .card-head h3 {
            font-size: 16px;
        }
        section.home-main-sec .discover-match .nav-tabs .nav-link {
            margin: 5px 0px;
            border-radius: 0px;
        }
        section.home-main-sec .discover-match nav {
            padding: 20px 15px 0px;
        }
    }
    
    @media screen and (max-width: 575px) {
        .header .dropdown.my-account {
            position: inherit;
        }
        .my-account .dropdown-menu {
            width: 96%;
            max-width: 100%;
            padding: 25px 15px 15px;
            margin: 2%;
            right: 0;
            left: 0;
            top: 60%;
        }
        .line1,
        .line2 {
            left: 18%;
            width: 37%;
            top: 34px;
        }
        .line2 {
            left: inherit;
            right: 18%;
        }
        .card {
            padding: 25px !important;
        }
        .card-body {
            padding: 0;
        }
        footer.footer {
            text-align: center;
        }
        .feature-item {
            margin-bottom: 30px;
            border-right: none;
        }
        .logo {
            max-width: 145px;
        }
        button.navbar-toggler {
            margin-top: -25px;
        }
        .step-2.finish .icon-cercle {
            background-position: -59px 10px;
        }
        .step-3 .icon-cercle {
            background-position: 19px 24px;
        }
        .step-1.finish .icon-cercle {
            background-position: -49px 10px;
        }
        .icon-cercle {
            width: 65px;
            height: 65px;
        }
        .step-2 .icon-cercle {
            background-position: 11px 9px;
        }
        .progress-holder h5 {
            font-size: 12px;
        }
        .step-1 .icon-cercle {
            background-position: 13px 9px;
        }
        .banner-content h2 {
            display: none;
        }
        .inner-banner .banner-content {
            bottom: 30%;
        }
        .member-highlights {
            flex-direction: column;
            align-items: center;
        }
        .profile-page .profile-img {
            margin-bottom: 25px;
        }
        .profile-desc {
            text-align: center;
        }
        .verified-sign {
            display: block;
            margin-left: 0 !important;
        }
        .edit-holder {
            position: inherit;
            bottom: inherit;
            text-align: center;
            justify-content: center !important;
        }
        .member-id {
            right: 0;
            top: -15px;
            width: 100%;
            text-align: center;
        }
        .member-content {
            margin-top: 15px;
        }
        .partner-btn-holder button,
        .partner-btn-holder span {
            flex: 0 0 40%;
            margin-bottom: 10px;
        }
        .partner-btn-holder {
            display: -ms-flexbox;
            display: flex;
            -ms-flex-wrap: wrap;
            flex-wrap: wrap;
            justify-content: center;
        }
        .btn-right-align {
            position: relative;
            display: block;
            flex-direction: row;
            top: inherit;
        }
        .partner-btn-holder .btn-normal {
            margin-bottom: 0;
        }
        .partner-btn-holder .dots {
            position: absolute;
            top: 10px;
        }
        .tab-curved {
            flex-direction: column;
        }
        li.nav-item {
            margin: 5px 0;
        }
        .package-item button {
            left: 37%;
        }
        .header ul.navbar-nav {
            flex-direction: column;
        }
        .header .navbar-collapse li.nav-item {
            margin-bottom: 20px;
        }
        .header .dropdown.my-account {
            margin-right: 0;
        }
        .story-img {
            max-width: 200px;
        }
        .story-item {
            display: flex;
            flex-direction: column;
            align-items: center;
        }
        .profile-card .progress-sec {
            width: 100%;
        }
        .profile-card .profile-short h3 {
            font-size: 16px;
        }
        .profile-card .profile-short h6 {
            font-size: 14px;
        }
    }
    
    @media screen and (max-width: 400px) {
        body .header .my-account .dropdown-menu span a {
            display: block;
            padding: 0 !important;
        }
        .header .my-account .dropdown-menu .user-item {
            flex-direction: column;
        }
        .header .my-account .dropdown-menu .user-item ul {
            border-right: none;
        }
        .progress-holder h5 {
            display: none;
        }
        .line {
            margin-top: -15px;
        }
        .partner-btn-holder button,
        .partner-btn-holder span {
            flex-basis: 100%;
        }
    }