/* Include Lato font */

@import url('https://fonts.googleapis.com/css?family=Lato:100,100italic,200,200italic,300,300italic,400,400italic,500,500italic,600,600italic,700,700italic,800,800italic,900,900italic&display=swap');



/* Include Outfit font */

@import url('https://fonts.googleapis.com/css?family=Outfit:100,100italic,200,200italic,300,300italic,400,400italic,500,500italic,600,600italic,700,700italic,800,800italic,900,900italic&display=swap');



/* Include Playfair Display font */

@import url('https://fonts.googleapis.com/css?family=Playfair+Display:100,100italic,200,200italic,300,300italic,400,400italic,500,500italic,600,600italic,700,700italic,800,800italic,900,900italic&display=swap');



/* Include DM Sans font */

@import url('https://fonts.googleapis.com/css?family=DM+Sans:100,100italic,200,200italic,300,300italic,400,400italic,500,500italic,600,600italic,700,700italic,800,800italic,900,900italic&display=swap');



/* Include Poiret One font */

@import url('https://fonts.googleapis.com/css?family=Poiret+One:100,100italic,200,200italic,300,300italic,400,400italic,500,500italic,600,600italic,700,700italic,800,800italic,900,900italic&display=swap');





/* Your existing styles can go below this */

h1,

h2,

h3,

h4,

h5 {

    font-family: 'Playfair Display', serif;

    text-transform: inherit;

}



/* Add more styles as needed */



html,

body {

    font-family: "DM Sans", Sans-serif;

    color: #000;

    font-size: 14px;

    font-weight: 500;

    overflow-x: hidden;

    max-width: 100vw;

}



@font-face {

    font-family: 'Playlist Script';

    src: url('../fonts/Playlist-Script.otf') format('opentype');

    /* Replace with the actual path to your font file */

}



h1,

h2,

h3,

h4,

h5 {

    font-family: 'Playfair Display', serif;

    text-transform: inherit;

}



a {

    color: #585858;

    text-decoration: none;

}



a:hover {

    color: #ff9ed6;

}



.logo img {

    max-width: 170px;

}



#header-sticky {

    transition: background-color 0.7s ease, box-shadow 0.7s ease;

    scroll-behavior: smooth;

}



#header-sticky.sticky {

    position: fixed;

    top: 0;

    width: 100%;

    z-index: 1000;

    background-color: #ffffff;

    /* Change to your desired background color */

    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);

    /* Optional: Add a box shadow */

    transition: .5s all ease;

    animation: fadeInHeader 1s ease forwards;

}

@keyframes fadeInHeader {
    0% {
        opacity: 0;
        transform: translateY(-100%);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}



.navbar {
    position: absolute;
    
    width: 100%;

    z-index: 1000;
    background-color: #ffffff;
    
    padding-top: 0px;

    margin-top: 40px;

    padding-bottom: 0px;

}



.navbar-brand {

    padding: 0;

}



.navbar-nav {

    height: 100%;

    /* Set the height of the navbar-nav */

    display: flex;

    align-items: stretch;

    /* Make items stretch vertically */

}



.navbar-nav .nav-item {

    flex-grow: 1;

    /* Allow nav-items to grow and fill the available vertical space */

    display: flex;

    align-items: center;

    /* Vertically center the content within nav-item */

}





.active{

    

   color: #E74DA680 !important;

  

}

.nav-item:hover a {

    /* color: #DBA8B9; */

    color: #000;

    opacity: 1 !important;

}



.navbar-nav:hover>li>a {

    opacity: .5;

}



.navbar-nav>li>a {

    padding: 10px 15px 10px 15px;

}



.login a {

background-image: linear-gradient(90deg, #FFA69E7A 0%, #E74DA680 100%) !important;

   color: white !important;

   border-radius:5px;

   font-weight:bold;

    /*text-shadow: */

    /*    -1px -1px 0 #861657,  */

    /*     1px -1px 0 #861657,*/

    /*    -1px  1px 0 #861657,*/

    /*     1px  1px 0 #861657;*/

}



.navbar-toggler {

    border: none;

    cursor: pointer;

}



#sidebar {

    height: 100%;

    width: 0;

    position: fixed;

    z-index: 9999;

    top: 60px;

    right: 0;

    background-color: #111;

    overflow-x: hidden;

    transition: 0.5s;

    padding-top: 60px;

}



#sidebar a {

    padding: 8px 8px 8px 32px;

    text-decoration: none;

    font-size: 18px;

    color: #ffffff;

    display: block;

    transition: 0.3s;

}



#sidebar a:hover {

    color: #f1f1f1;

}



#sidebar .close-btn {

    position: absolute;

    top: 0;

    right: 25px;

    font-size: 30px;

    margin-left: 50px;

}



.welcomebar {

    background-image: linear-gradient(90deg, #FFA69E7A 0%, #E74DA680 100%);    font-family: inherit;

    position: fixed;

    background-color:white;

    opacity:100%;

    left: 0;

    right: 0;

    z-index: 9999999;

    text-align: center;

}



.welcomebar .welcome-text p {

    padding: 10px 0px;

    margin: 0;

}



/* home banner styling */



.main-banner {

    background-image: url(../images/banner/SnatchedHPBannerNew.png);

    background-position: center center;

    background-repeat: no-repeat;

    background-size: cover;

    height: 110vh;

    width: 100%;

    border-style: solid;

    border-width: 0px 20px 0px 20px;

    border-color: #FFFFFF;

    transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;

    margin-top: 0em;

    margin-bottom: 0em;

    padding: 0px 15px 0px 15px;

    position: relative;

}



.overlay {

    height: 100%;

    width: 100%;

    top: 0;

    left: 0;

    position: absolute;

    background-color: transparent;

    background-image: linear-gradient(90deg, #FFFFFF 35%, #FFA69E2B 75%);

    opacity: 0.75;

    transition: background 0.3s, border-radius 0.3s, opacity 0.3s;

}



.main-banner .container {

    height: 100%;

}



.main-banner .container .row {

    height: 100%;

    align-items: center;

}



.banner-content {

    position: relative;

    margin-top:10%;

}



h6.banner_heading {

    font-size: 12px;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: 0.6px;

    padding: 12px 20px 10px 20px;

    margin: 0px 0px 24.5px 0px;

    background-color: #232036;

    border-radius: 50px 50px 50px 50px;

    color: #fff;

    width: fit-content;

}



.brand_name {

    color: #404040;

    font-family: "Playlist Script", cursive;

    font-size: 65px;

    font-weight: 300;

    text-transform: capitalize;

    margin: 20px 0px 0px 0px;
    
    -webkit-font-smoothing: antialiased;

}



p.banner-para {

    color: #494949;

    font-family: "DM Sans", Sans-serif;

    font-size: 16px;

    line-height: 28px;

    letter-spacing: 0px;

    margin: 1em 0em 2em 0em;

    width:500px;

}



.banner_btn:hover {

    color: #FFFFFF;

    background-color: #232036;

    border-color: #1C4E4E;

}



.banner_btn {

    font-family: "DM Sans", Sans-serif;

    font-size: 12px;

    color: #F6F3EF;

    fill: #F6F3EF;

    background-color: #C88CAF;

    border-style: none;

    border-radius: 100px 100px 100px 100px;

    padding: 18px 25px 18px 25px;

    transition: .3s ease;

    text-transform: uppercase;

    font-weight: 600;

}







/* how it works */

.works_heading {

    /* padding: 40px; */

    text-align: center;

}



.works_heading h2.heading {

    font-size: 36px;

    font-weight: 500;

    text-transform: none;

    margin: 0em 0em 0em 0em;

    line-height: 42px;

    letter-spacing: 0.8px;

}



span.split-inner {

    font-family: "DM Sans", Sans-serif;

    font-size: 16px;

    font-weight: 400;

    line-height: 26px;

    display: block;

    /* padding: 10px; */

}



.item_heading h3 {

    font-size: 18px;

    /*text-transform: uppercase;*/

    line-height: 27px;

    text-align: center;

    font-weight: bold;

    font-family: "Playfair Display";

}



.item_content .item-para {

    font-family: "DM Sans", Sans-serif;

    font-size: 16px;

    font-weight: 300;

    color: #000000A8;

    text-align: center;

    max-width: 250px;

    margin: 0 auto;

}



.item_image img {

    max-width: 220px;

    margin: 0 auto;

    display: block;

}



.col-lg-4.position-relative {

    position: relative;

}



.col-lg-4.position-relative .icon-after {

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

}



.col-lg-4.position-relative .icon-after i {

    font-size: 24px;

    /* Adjust the font size as needed */

}



.works_item:hover {

    transform: scale(1.1);

    transition: .5s all ease-in-out;

}



.works_item {

    transition: background .3s, border .3s, border-radius .3s, box-shadow .3s, transform var(--e-transform-transition-duration, .4s);

}





/* subscribe section */

.subscribe .heading_content {

    text-align: center;

    justify-content: center;

    display: flex;

    flex-direction: column;

    align-items: center;

    padding: 10px 0px;

    flex-wrap: wrap;

    max-width: 700px;

    margin: 0 auto;

}



.subscribe .heading_content h2.subscribe_heading {

    color: #000000;

    font-size: 36px;

    font-weight: 500;

    text-transform: none;

    margin: 0em 0em 0em 0em;

}





.subscribe_section {

    background-color: transparent;

    background-image: linear-gradient(90deg, #FFA69E7A 0%, #E74DA680 100%);

    position: relative;

    padding-top: 80px;

}



p.subscribe_para {

    font-family: "DM Sans", Sans-serif !important;

    font-size: 16px;

    font-weight: 300;

    line-height: 26px;

    letter-spacing: 0.16px;

    margin: 0px;

    padding: 0% 0% 0% 0%;

    color: #313131;

    width:auto;

}



.subscribe_heading span {

    padding: 1px;

    border-bottom: 3px solid #faa39b;

    position: relative;

    overflow: hidden;

    z-index: 1;

}



.subscribe_heading span::before {

    content: "";

    position: absolute;

    bottom: 0;

    left: 0;

    width: 100%;

    height: 0;

    background-color: #faa39b;

    transition: height 0.5s ease;

    z-index: -1;

}



.subscribe_heading:hover span::before {

    height: 100%;

}





.subscribe .nav-tabs {

    justify-content: center;

    position: relative;

    border: none;

    /*gap: 10px;*/

}



.subscribe .nav-tabs .nav-link.active {

    background: transparent;

    border: none;

    color: #bb3a7b !important;

    /* margin-inline-end: 1em; */

}



.subscribe .nav-tabs .nav-link {

    font-family: "Lato", Sans-serif;

    font-size: 27px;

    font-weight: bold;

    text-transform: uppercase;

    letter-spacing: 1px;

    color: #000;

    padding: 0;

}



.subscribe .nav-tabs .nav-link:focus,

.subscribe .nav-tabs .nav-link:hover {

    border: none;

}



.subscribe .nav-tabs .nav-link {

    border: none;

}





.subscribe .nav-tabs .nav-link:before {

    content: "";

    display: inline-block;

    width: 30px;

    height: 30px;

    position: absolute;

    bottom: 3px;

    left: calc(50% - 15px);

    border-radius: 50em;

    background-color: #fff;

    transform: scale(.5);

    opacity: 0;

    transition: transform .65s cubic-bezier(.23, 1, .32, 1), opacity .65s cubic-bezier(.23, 1, .32, 1);

}



.subscribe .nav-tabs .nav-link {

    position: relative;

    display: flex;

    align-items: end;

}



.subscribe .nav-tabs li:first-child a:before {

    left: auto;

    right: 2px;

}



.subscribe .nav-tabs .nav-link.active:before {

    opacity: 1;

    transform: scale(1);

}



.subscribe .nav-tabs li:first-child a:after {

    border-radius: 50em 0 0 50em;

    width: 36px;

}



.subscribe .nav-tabs li:last-child a:after {

    border-radius: 0 50em 50em 0;

    width: 36px;

}



.subscribe .nav-tabs li a:after {

    content: "";

    display: inline-block;

    width: 100%;

    height: 36px;

}



.subscribe .nav-tabs .nav-link:after {

    background-color: #00000040;

}



.subscribe .nav-tabs li:first-child a:after,

.subscribe .nav-tabs li:last-child a:after {

    width: 36px

}





.subscribe .nav-tabs li:first-child a {

    flex-direction: row

}



.subscribe .nav-tabs li:first-child a:before {

    left: auto;

    right: 2px

}



.subscribe .nav-tabs li:first-child a:after {

    border-radius: 50em 0 0 50em

}



.subscribe .nav-tabs li:first-child .lqd-tabs-nav-txt {

    margin-inline-end: 1em

}



.subscribe .nav-tabs li:last-child a {

    flex-direction: row-reverse

}



.subscribe .nav-tabs li:last-child a:before {

    left: 2px

}



.subscribe .nav-tabs li:last-child a:after {

    border-radius: 0 50em 50em 0

}



.subscribe .nav-tabs li:last-child .lqd-tabs-nav-txt {

    margin-inline-start: 1em;

}



.subscribe .nav-tabs .nav-link span {

    font-family: "Lato", Sans-serif;

    font-size: 27px;

    font-weight: bold;

    text-transform: uppercase;

    letter-spacing: 1px;

    margin: 0px 30px 0px 10px;

}



.subscribe_tab_content {

    display: flex;

    align-items: center;

    justify-content: center;

    flex-direction: column;

    flex-wrap: wrap;

    padding: 20px 0px;

    text-align: center;

}



.subscribe_tab_content h2.subscribe_heading {

    color: #232036;

}



.subscribe_top {

    overflow: hidden;

    position: absolute;

    left: 0;

    width: 100%;

    line-height: 0;

    direction: ltr;

    top: -1px;

}



.subscribe_top svg {

    width: 100%;

}



.subscribe_top svg {

    height: 80px;

    transform: translateX(-50%) rotate(180deg);

    display: block;

    width: calc(100% + 1.3px);

    position: relative;

    left: 50%;

}



svg.lqd-custom-shape {

    fill: #fff;

    transform-origin: center;

}



.pricing_card .card .card-header {

    padding: 15px;

}



.pricing_card {

    text-align: center;

}



.pricing_card .card .card-header h4.price-heading {

    font-size: 22px !important;

    font-weight: 500 !important;

    color: #333639;

    margin-top: 20px;

}



.pricing_card .card .card-header span.price {

    font-size: 36px;

    font-family: 'DM Sans', sans-serif;

    font-weight: 300;

    display: block;

    margin: 10px 0px;

    color: #333639;

}



.pricing_card .card .card-header p.value {

    opacity: .8;

    font-size: 16px;

    line-height: 1.5625em;

}



ul.price_points {

    list-style: none;

    padding: 0;

    min-height: 150px;

}



ul.price_points li {

    padding: 10px;

    color: #616161;

    font-size: 14px;

}



ul.price_points li i {

    color: #00cb99;

    margin-right: 10px;

}



.btn_two {

    font-family: "DM Sans", Sans-serif;

    font-size: 12px;

    background-color: transparent;

    background-image: linear-gradient(90deg, #FFA69E 0%, #861657 100%);

    border-radius: 4px 4px 4px 4px;

    color: #fff;

    font-weight: bold;

    text-transform: uppercase;

    line-height: 13px;

    letter-spacing: 2px;

    border-radius: 5px 5px 5px 5px;

    padding: 1.7em 4em 1.7em 4em;

    border: none;

}



.btn_two:hover {

    border-color: transparent;

    background-color: var(--color-primary);

    color: #fff;

    transform: translate3d(0, -2px, 0);

    box-shadow: 0 12px 28px rgba(0, 0, 0, .12);

}



.pricing_card .card.bg-dark .card-header h4.price-heading {

    color: #FDA49D;

}



.pricing_card .card.bg-dark .card-header span.price {

    color: #E8E8E8;

}



.pricing_card .card.bg-dark ul.price_points li i {

    color: #FDA49D;

}



.pricing_card .card.bg-dark ul.price_points li {

    color: #E8E8E8;

}



.pricing_card .card.bg-dark .card-header {

    border-color: #FDA49D;

}



.brands h2.subscribe_heading {

    color: #20484f;

    font-size: 18px;

    font-weight: bold;

    line-height: 1.2em;

    margin: 0em 0em 2em 0em;

    text-align: center;

}



.subscribe .brands {

    /*padding-top: 30px;*/

    overflow: hidden;

}



.owl-carousel .owl-item img {

    max-width: 150px;

}



.subscribe .brands {

    margin: 40px 0px 0px 0px;

}



.subscribe .brands .swiper-slide img {

    max-width: 100%;

}



.subscribe .brands .cancel_anytime {

    text-align: center;

    /*margin: 2em 0em 4em 0em;*/

    font-family:"Outfit";

    font-size:16px;

}



.cancel_anytime p{

    text-align: center;

    font-family:"Outfit";

    font-size:16px;

    font-weight:300;

}



section.contact_section {

    background: #fdfdfd;

    padding: 50px 0px;

}



section.contact_section .card {

    box-shadow: 0px 40px 80px 0px rgb(83 94 132 / 24%);

    padding: 30px;

    max-width: 914px;

    margin: 0 auto;

    border-radius: 15px;

    border: none;

    background-color: #fafbfe;

}



h2.contact_heading {

    font-size: 36px;

    font-weight: 500;

    margin: 0em 0em 0.5em 0em;

    line-height: 1.2em;

    text-transform: capitalize;

    color: #20484f;

    position: relative;

    

}

.contact_heading span a{

    font-family: "Outfit";

    line-height: 1.6em;

}



.contact_section .card p.contact_para {

    font-family: "DM Sans", Sans-serif;

    font-size: 16px;

    line-height: 28px;

    letter-spacing: 0px;

    margin: 0em 0em 2em 0em;

    color: #20484f;

    max-width: 375px;

}



.contact_section .card .contact_form .form-control {

    border-radius: 20px;

    padding: 10px;

}



.contact_section .social_icons a {

    width: 25px;

    height: 25px;

    display: inline-block;

    background: #20484f;

    color: #fff;

    font-size: 17px;

    text-align: center;

    margin-right: 10px;

    border-radius: 3px;

    padding: 2px;

    

    width: 28px !important;

    height: 28px !important;

    border-radius: 50%;

    /*text-align: center;*/

}



.contact_section .social_icons {

    margin: 25px 0px;

}



.contact_section .contact_social {

    padding-left: 20px;

    background: #fafbfe;

    height: 100%;

}



.contact_section .animate_btn {

    width: 100%;

    border-radius: 20px;

    padding: 10px;

}





.animate_btn {

    color: #ffffff !important;

    box-shadow: 0 10px 30px 0px rgb(0 0 0 / 10%);

    cursor: pointer;

    background-color: #C88CAF;

    border: 2px solid #C88CAF;

    position: relative;

    display: inline-block;

    overflow: hidden;

    vertical-align: middle;

    font-size: 14px !important;

    line-height: 25px;

    font-family: "Rubik", sans-serif;

    font-weight: 500;

    text-align: center;

    padding: 7px 20px;

    text-transform: capitalize;

    border-radius: 5px;

    z-index: 1;

    transition: all 500ms ease;

}



.animate_btn::before {

    background-color: transparent;

    background-image: linear-gradient(90deg, #FFA69E 0%, #861657 100%);

    position: absolute;

    content: "";

    width: 0%;

    height: 100%;

    left: 0px;

    top: 0px;

    z-index: -1;

    transition: all 500ms ease;

}



.animate_btn:hover:before {

    width: 100%;

}



.banner_ready {

    position: relative;

    background-image: url(../images/banner/11.jpg);

    background-position: center;

    height: 100%;

    background-repeat: no-repeat;

    background-size: cover;

    text-align: center;

    padding: 100px 0px;

}



.btn_banner {

    margin-top: 20px;

    padding: 20px;

    border-radius: 40px;

}



.footer_logo img {

    max-width: 200px;

}



section.footer {

    background-image: linear-gradient(90deg, #FFA69E7A 0%, #E74DA680 100%) !important;

    background: transparent;

    padding: 70px 0px;

}



.footer h2.follow_us {

    font-family: "DM Sans", Sans-serif;

    font-size: 20px;

    font-weight: 600;

    margin: 0em 0em 0em 0em;

    padding: 20px 0px;

}



.footer_social {

    display: flex;

    align-items: center;

    gap: 30px;

    color: #000;

    flex-wrap: wrap;

}



.footer_social>a>i {

    color: #000;

    font-size: 30px;

}



h3.footer_heading {

    font-size: 17px;

    text-transform: uppercase;

    letter-spacing: 1px;

    margin: 0em 0em 2.4em 0em;

    color: #20484f;

}



ul.footer_links {

    list-style: none;

    padding: 0;

    color: #000;

    font-family: "DM Sans", Sans-serif;

    font-size: 16px;

}



ul.footer_links>li {

    margin-bottom: 10px;

}



ul.footer_links>li>a:hover {

    color: #000000;

}



.banner_down img {

    width: 100%;

    transform: rotate(360deg);

    position: absolute;

    left: 0;

    bottom: -2px;

    object-fit: cover;

    object-position: center;

    height: 12px;

    filter: invert(1);

}



.view_pricing {

    display: flex;

    align-items: center;

    justify-content: space-around;

    padding: 20px 0px;

    background-color: transparent;

    background-image: linear-gradient(90deg, #FFA69F 0%, #FF9ED573 100%);

    border-radius: 100px 100px 100px 100px;

    margin-bottom: 50px;

    margin-top: 30px;

}



.view_pricing h2.contact_heading {

    margin: 0;

    font-size: 28px;

}



.btn_text {

    position: relative;

    z-index: 3;

}



.get_box:hover .btn_text {

    transition: opacity .65s, transform .85s;

    transition-timing-function: cubic-bezier(.15, .85, .31, 1);



}



.get_box {

    --icon-font-size: 20px;

    font-family: "DM Sans", Sans-serif;

    color: #F6F3EF;

    fill: #F6F3EF;

    background-color: #232036;

    border-radius: 5em 5em 5em 5em;

    padding: 1.3em 2.7em;

    font-size: 11px;

    font-weight: bold;

    text-transform: uppercase;

    line-height: 13px;

    letter-spacing: 2px;

}



.get_box:hover {

    color: #000000;

    background-color: #FFFFFF;

}



.about.banner {

    position: relative;

    background-image: url(../images/banner/boxes.jpg);

    background-position: center;

    height: 100%;

    background-repeat: no-repeat;

    background-size: cover;

    text-align: center;

    /* padding: 100px 0px; */

}



.about.banner .container {

    position: relative;

    color: #fff;

    min-height: 80vh;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-direction: column;

    flex-wrap: wrap;

}



.about.banner .overlay {

    background-color: #000000;

    opacity: 0.32;

    transition: background 0.3s, border-radius 0.3s, opacity 0.3s;

    background-image: none;

}



.about.banner h3 {

    font-family: "Playlist Script", Sans-serif;

    font-size: 40px;

    font-weight: 100;

    line-height: 1.3em;

    margin: 0em 0em 0.45em 0em;

}



.about.banner p {

    font-family: "DM Sans", Sans-serif;

    font-size: 16px;

    line-height: 24px;

    margin-bottom: 30px;

}



section.what_we_do .image_sec img {

    height: 520px;

    object-fit: cover;

    width: 100%;

    border-radius: 10px;

}



section.what_we_do {

    padding: 80px 0px;

}



section.what_we_do .content_sec .card {

    box-shadow: 0px 25px 50px 0px rgba(38.00000000000003, 53.000000000000036, 65.00000000000006, 0.12);

    border: none;

    border-radius: 12px;

    padding: 60px;

}



section.what_we_do .content_sec .card h3 {

    color: #20484f;

    font-size: 40px;

    font-weight: 200;

    line-height: 1.1em;

    margin: 0em 0em 0.5em 0em;

}



section.what_we_do .content_sec .card p {

    font-family: "DM Sans", Sans-serif;

    font-size: 16px;

    margin: 0em 0em 0em 0em;

    padding: 0px 0px 0px 0px;

    color: #8c8c8c;

}



.how_we_started {

    background-color: transparent;

    background-image: linear-gradient(90deg, #FFA69F 0%, #FFCFEA 100%);

    position: relative;

}



.how_we_started_top {

    overflow: hidden;

    position: absolute;

    left: 0;

    width: 100%;

    line-height: 0;

    direction: ltr;

    top: -1px;

}



.how_we_started_top svg {

    transform: translateX(-50%) rotate(180deg);

    display: block;

    width: calc(100% + 1.3px);

    position: relative;

    left: 50%;

}



.how_we_started_top.bottom svg {



    transform: rotate(180deg);

}



.how_we_started_bottom {

    transform: rotate(180deg);

    bottom: -1px;

    overflow: hidden;

    position: absolute;

    left: 0;

    width: 100%;

    line-height: 0;

    direction: ltr;

}



.how_we_started_bottom svg {

    transform: translateX(-50%) rotate(180deg);

    display: block;

    width: calc(100% + 1.3px);

    position: relative;

    left: 50%;

}



.btn_image {

    display: flex;

    align-items: center;

    justify-content: end;

}



.btn_image img {

    position: absolute;

}



.faq .heading {

    text-align: center;

    margin-top: 125px;

    margin-bottom: 0px;

    padding: 60px 0px 0px 0px;

}



.contact_text {

    padding: 30px 0px 100px 0px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 30px;

    flex-wrap: wrap;

}



.contact_text p.contact {

    background: #ff9ed6;

    margin: 0;

    padding: 10px;

    border-radius: 20px;

}



.contact_text p.contact_side {

    color: #8f7a7a;

    display: block;

    margin: 0;

}



.contact_text p.contact_side a {

    display: block;

    color: #ff9ed6;

    text-decoration: underline;

    font-size: 17px;

}



.faq .accordion-button::after {

    content: '+';

    float: right;

    transition: transform 0.3s;

    background-image: none;

    transform: none;

}



.faq .accordion-button[aria-expanded="true"]::after {

    content: '-';

    background-image: none;

    transform: none;

}



.faq .accordion-button:not(.collapsed)::after {

    background-image: none

}



.faq .accordion-button {

    font-size: 16px;

    background-color: #F7F7F8 !important;

    border-color: #02010100 !important;

    color: #7a7a96 !important;



    overflow: hidden;

}



.faq .accordion-item {

    font-family: "DM Sans", Sans-serif;

    font-size: 16px;

    border-color: #02010100;

}



.faq .accordion-item {

    margin-bottom: 18px;

    width: 100%;



    padding: 0;

}



.faq button.accordion-button {

    border-radius: 30px !important;

}



.faq .accordion-button:not(.collapsed) {

    color: #000000 !important;

    background-color: transparent !important;

    background-image: linear-gradient(90deg, #FFA69F 0%, #FF9ED5 100%);

}



.faq .accordion-body p {

    font-family: "Outfit";

    font-weight: 400;

    color: #7a7aa5;

    font-size: 15px;

    margin-bottom: 0px;

}



.faq .accordion-body {

    padding: 1em 1em;

}



.faq .accordion-button:focus {

    box-shadow: 0 15px 30px rgba(0, 0, 0, .1);

}



.scrollable {

    height: 100vh;

}



.not_scrollable {

    height: 100vh;

}



.scrollable-side {

    overflow-y: scroll;

    scrollbar-width: thin;

    scrollbar-color: transparent transparent;

    height: 100vh;

    margin-bottom: 50px;

}



.scrollable-side::-webkit-scrollbar {

    width: 0.5rem;

}



.scrollable-side::-webkit-scrollbar-thumb {

    background-color: transparent;

}



.divider span {

    border-top: #000;

    display: flex;

    margin: 0;

    direction: ltr;

    width: 100%;

    height: 2px;

    color: #000;

    background: #000;

}



.divider {

    padding-top: 10px;

    padding-bottom: 10px;

}



.blog_heading h2.contact_heading {

    font-size: 30px;

    font-weight: bold;

    line-height: 45px;

    letter-spacing: 0.12px;

    margin: 0em 0em 0em 0em;

}



.divider span.gray {

    color: #e5e5e5;

    background: #e5e5e5;

}



.blogs a.blog_box {

    display: flex;

    align-items: center;

    gap: 30px;

    box-shadow: none;

    text-decoration: none;

    background: #f7f7f7;

    padding: 30px;

    cursor: pointer;

    position: relative;

    overflow: hidden;

    transition: transform 0.3s;

}



.blogs {

    margin: 20px 0px;

}



.blog_content h2.h5 {

    font-size: 27px;

    text-decoration: underline;

    line-height: 34px;

    letter-spacing: 0px;

    font-weight: 700;

    word-wrap: break-word;

    text-align: start;

    color: #000000;

}



.blog_content p {

    color: #181b31;

    font-size: 15px;

    line-height: 18px;

    text-align: start;

}









.blog_image {

    position: relative;

}



.blog_image img {

    /*max-width: 300px;*/

    height: 300px;

    object-fit: cover;

    object-position: center;

    position: relative;

}









.blog_content {

    padding: 20px;

    text-align: center;

}

.blog_image i{

    transform: translateX(-20px); /* Initial position off to the left */

  opacity: 0; /* Initially hidden */

  transition: .3s ease;

  position: absolute;

}



.blog_box:hover .blog_image i {

    position: absolute;

    z-index: 1;

    color: #fff;

    font-size: 25px;

    transition: .3s ease;

    transform: translateX(0); /* Move to center on hover */

  opacity: 1; /* Make the icon visible on hover */

}

.blog_box:hover .blog_image{

    position: relative;

    display: flex;

    align-items: center;

    justify-content: center;

    background: #000;

}



.blog_box:hover .blog_image img {

    filter: brightness(0);

}





.subscribe_btn {

    padding: 13px 40px;

    border: 0;

    outline: 0;

    color: #fff;

    text-shadow: none;

    transition: background .3s ease,color .3s ease,border .3s ease;

    border-radius: 50em;

    font-size: 19px;

    color: #FFFFFF;

    background: #222222;

    display: block;

}

.subscribe_btn:hover{

    color: #fff;

}



.blog_subscribe img.img-fluid {

    max-width: 100%;

    object-fit: cover;

    object-position: center;

    border-radius: 10px;

}

.blogs a.blog_box

{

    border-radius: 10px;

}



.step_form .heading {

    display: flex;

    align-items: center;

    justify-content: center;

    flex-direction: column;

}

.btn_round{

    border-radius: 30px !important;

}

.bg_purple{

    /* background-image: #232036 !important; */

    background-image: linear-gradient(90deg, #524d77 0%, #232036 100%) !important;

}

.plans-box{

    padding: 0px 16px !important;

}

@media only screen and (max-width:996px){

p.banner-para {

    font-size: 12px;

    line-height: 20px;

    

}

p.banner-para {

    color: #494949;

    font-family: "DM Sans", Sans-serif;

    font-size: 14px;

    line-height: 20px;

    letter-spacing: 0px;

    margin: 1em 0em 2em 0em;

    width:650px !important;

}

    

}

@media only screen and (max-width:768px){



p.banner-para {

    color: #494949;

    font-family: "DM Sans", Sans-serif;

    font-size: 13px;

    line-height: 20px;

    letter-spacing: 0px;

    margin: 1em 0em 2em 0em;

    width:500px !important;

}

.plangrid{

    

    margin-left: 19px;

    margin-right: 19px;

}

.main-banner{

        height:105vh;

    }

}



@media only screen and (max-width:576px){



p.banner-para {

    color: #494949;

    font-family: "DM Sans", Sans-serif;

    font-size: 13px;

    line-height: 20px;

    letter-spacing: 0px;

    margin: 1em 0em 2em 0em;

    width:312px !important;

}

p.subscribe_para{

    width: 340px;

    font-size: 15px;

}





.plangrid{

    

    margin-left: 19px !important;

    margin-right: 19px !important;

}

.view_pricing .contact_heading{

    font-size: 20px !important;

    padding: 15px;

    display: flex;

    justify-content: center;

    text-align: center;

}

.get_box{

    padding: 14px !important;

    margin-right: 30px !important;

}

.row .brands .brands-container{

    width:358px !important;

}

.welcome-text {

padding: 0px 10px;

    

}

 .main-banner{

        height:100vh;

    }

    .checkoutdiv{

        display:flex;

        justify-content:center;

    }

    .subscribe .nav-tabs .nav-item{

    margin-bottom:12px;

}



}

@media only screen and (max-width:362px)and (min-width:361px){
    
    #header-sticky {
        margin-top: 58px !important;
        /* z-index: 99999 !important; */
    }
}




@media only screen and (max-width:429px){

.plangrid{

    

    margin-left: 19px !important;

    margin-right: 19px !important;

}

.plangrid col-lg-4{

    

    margin-left: 0px !important;

    margin-right: 0px !important;

}

.row .brands .brands-container{

    width:358px !important;

}

.view_pricing .contact_heading{

    font-size: 20px !important;

    padding: 15px;

    display: flex;

    justify-content: center;

    text-align: center;

}

.get_box{

    padding: 10px !important;

    margin-right: 30px !important;

}

.welcome-text {

padding: 0px 10px;

    font-size:13px !important;



    

}

h6.banner_heading {

    text-align:center;

}

 .checkoutdiv{

        display:flex;

        justify-content:center;

    }

.plans-box{

    padding: 0px 0px !important;

}

.subscribe .nav-tabs .nav-item{

    margin-bottom:12px;

}

}

@media only screen and (max-width:388px){

    #header-sticky{

        margin-top:55px;

    }

    .banner_heading{

        text-align:center;

    }

    .plangrid{

    

    margin-left: 19px !important;

    margin-right: 19px !important;

}

.plangrid col-lg-4{

    

    margin-left: 0px !important;

    margin-right: 0px !important;

}

h6.banner_heading {

    text-align:center;

}

.welcome-text {

    font-size:13px !important;

}

.checkoutdiv{

        display:flex;

        justify-content:center;

    }

.plans-box{

    padding: 0px 0px !important;

}

.subscribe .nav-tabs .nav-item{

    margin-bottom:12px;

}

}



@media only screen and (max-width:360px){

    .welcome-text{

        font-size:12px !important;

    }

}

.slick-slide {

    margin: 0px 20px;

}



.slick-slide img {

    width: 60%;

}



.slick-slider

{

    position: relative;

    display: block;

    box-sizing: border-box;

    -webkit-user-select: none;

    -moz-user-select: none;

    -ms-user-select: none;

            user-select: none;

    -webkit-touch-callout: none;

    -khtml-user-select: none;

    -ms-touch-action: pan-y;

        touch-action: pan-y;

    -webkit-tap-highlight-color: transparent;

}



.slick-list

{

    position: relative;

    display: block;

    overflow: hidden;

    margin: 0;

    padding: 0;

}

.slick-list:focus

{

    outline: none;

}

.slick-list.dragging

{

    cursor: pointer;

    cursor: hand;

}



.slick-slider .slick-track,

.slick-slider .slick-list

{

    -webkit-transform: translate3d(0, 0, 0);

       -moz-transform: translate3d(0, 0, 0);

        -ms-transform: translate3d(0, 0, 0);

         -o-transform: translate3d(0, 0, 0);

            transform: translate3d(0, 0, 0);

}



.slick-track

{

    position: relative;

    top: 0;

    left: 0;

    display: block;

}

.slick-track:before,

.slick-track:after

{

    display: table;

    content: '';

}

.slick-track:after

{

    clear: both;

}

.slick-loading .slick-track

{

    visibility: hidden;

}



.slick-slide

{

    display: none;

    float: left;

    height: 100%;

    min-height: 1px;

}

[dir='rtl'] .slick-slide

{

    float: right;

}

.slick-slide img

{

    display: block;

}

.slick-slide.slick-loading img

{

    display: none;

}

.slick-slide.dragging img

{

    pointer-events: none;

}

.slick-initialized .slick-slide

{

    display: block;

}

.slick-loading .slick-slide

{

    visibility: hidden;

}

.slick-vertical .slick-slide

{

    display: block;

    height: auto;

    border: 1px solid transparent;

}

.slick-arrow.slick-hidden {

    display: none;

}