.zw-product-header {
    /* background-color: #010213; */
    position: absolute;
    /* top: 65px; */
    left: 0;
    right: 0;
    z-index: 10;
}

.zwc-inner-wrap h1 {
    font-size: 72px;
    margin-bottom: 30px;
    line-height: 1.15;
}

.zwc-inner-wrap h2 {
    font-size: 50px;
    line-height: 1.25;
}

.zwc-inner-wrap h3 {
    font-size: 25px;
}

.zwc-inner-wrap p {
    line-height: 1.8;
    margin-bottom: 0;
}

.zgt-section .content-wrap {
    padding: 100px 0 110px;
}

.zwc-advantages .content-wrap {
    padding: 125px 0 120px;
}

.zwc-bottom-ban .content-wrap {
    padding: 95px 0 110px;
}
.zwc-banner.zgt-section .content-wrap {
    padding-top: 0;
}
.zwc-banner .content-wrap {
    padding-bottom: 120px;
}

.zwc-banner {
    padding-top: 145px;
}
.zwc-how-to .content-wrap{
    padding-top: 95px;
}
/* -------- Banner Section -------- */
.zwc-banner {
    background-color: #010213;
    color: #FFFFFF;
    position: relative;
    overflow: hidden;
}

.zwc-banner::before {
    content: '';
    width: 95%;
    right: -30px;
    height: 1700px;
    background-image: url(/sites/zweb/images/zeptomail/homepage/header-gradient.svg);
    position: absolute;
    top: 0;
    background-repeat: no-repeat;
}

.zwc-banner .content-wrap::before {
    /* content: '';
    width: 95%;
    right: -30px;
    height: 1700px;
    background-image: url(/sites/zweb/images/zeptomail//homepage/header-gradient.svg);
    position: absolute;
    top: 0;
    background-repeat: no-repeat; */
    /* content: " ";
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: radial-gradient(#15173E, #010213 75%); */
    /* transform: rotate(45deg); */
}
.zwc-left-sec{
    margin-bottom: 60px;
}
.zwc-banner-con {
    display: grid;
    grid-template-columns: 42% 350px;
    gap: 100px;
    align-items: center;
    justify-content: space-evenly;
}

.zwc-left-sec>p {
    margin-bottom: 55px;
}

.zwc-right-sec {
    line-height: 0;
    max-width: 350px;
    display: grid;
}

.zwc-right-sec>svg {
    justify-self: center;
}

.zwc-right-sec .zwc-svg-user-application span::before {
    content: '';
    display: inline-block;
    height: 21px;
    width: 21px;
    /* background-color: lightblue; */
    background: url(/sites/zweb/images/zeptomail/getting-started/smtp-icons.png) no-repeat;
    background-size: 366px auto;
    filter: drop-shadow(0 0 8px #4DFD9A88);
    background-position: -172px -11px;
}

.zwc-right-sec .zwc-svg-user-application span::after {
    content: 'User Application';
    grid-row: 1/2;
    grid-column: 2/3;
}

.zwc-right-sec .zwc-svg-smtp span::after {
    content: 'SMTP';
}

.zwc-right-sec .zwc-svg-smtp span::after {
    color: #4BFD9A;
}

.zwc-right-sec .zwc-svg-smtp {
    top: 35%;
    left: 0;
    /* left: 15px; */
}

.zwc-right-sec .zwc-svg-api span::after {
    content: 'API';
}

.zwc-right-sec .zwc-svg-api {
    top: 40%;
    right: 0;
    /* right: 15px; */
}

.zwc-right-sec .zwc-svg-inbox span::after {
    content: 'Inbox';
}

.zwc-right-sec .zwc-svg-inbox {
    /* top: 40%;
    right: 15px; */
    align-self: self-end;
}

.zwc-right-sec .zwc-svg-words span::after {
    font-size: 14px;
}

.zwc-right-sec {
    position: relative;
    /* right: -30px;
    top: -30px;
    width: min(450px, 100%); */
    text-align: center;
}

.zwc-right-sec .zwc-svg-words {
    border-radius: 100px;
    display: grid;
    grid-template-columns: 1fr;
    position: absolute;
    min-width: 28%;
    width: 100%;
    max-width: 31.12%;
    max-width: 110px;
    justify-self: center;
}

.zwc-right-sec .zwc-svg-user-application {
    min-width: 51%;
    max-width: 140px;
}

.zwc-right-sec .zwc-svg-words::before {
    content: '';
    position: absolute;
    height: 109%;
    width: 103%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 100px;
    background-image: linear-gradient(to bottom, #7A7CB4, #2C2E5A);
}

.zwc-right-sec .zwc-svg-smtp::before {
    background-image: linear-gradient(to bottom, #4dfd9a94, #2B2E6E);
}

.zwc-right-sec .zwc-svg-words span {
    position: relative;
    z-index: 2;
    background-color: #1f2042;
    padding: 10px 20px;
    border-radius: 100px;
    font-size: 0px;
    font-family: var(--zf-primary-regular);
    color: #B0B1C1;
}

.zwc-right-sec .zwc-svg-user-application span {
    color: #4BFD9A;
    background-color: #0c0d26;
    display: grid;
    grid-template-columns: max-content 1fr;
    grid-gap: 0 8px;
    align-items: center;
}

.zwc-our-icon {
    position: absolute;
    bottom: 55px;
    right: 75px;
    height: 100px;
    width: 100px;
    padding: 0%;
    background-image: linear-gradient(to bottom, #0C0D26, #03041C);
    border-radius: 20px;
    transform: translate(-50%, -50%);
    border: 1px solid #666DFC;
    z-index: 2;
    overflow: hidden;
}

.zwc-our-icon.start-animate {
    /* animation: glowWord 1s ease-in-out; */
}

.zwc-right-sec .zwc-svg-words.start-animate,
.zwc-our-icon.start-animate {
    animation: glowWord 1s ease-in-out;
}

.zwc-right-sec .zwc-svg-words.start-animate {
    animation-delay: 1s;
}

.zwc-our-icon.start-animate {
    animation-delay: 2.5s;
}

@keyframes glowWord {
    0% {
        box-shadow: 0 0 0px 0px #656dFC;
    }

    50% {
        box-shadow: 0 0 15px 0px #656dFC;
    }

    100% {
        box-shadow: 0 0 0px 0px #656dFC;
    }
}

/* -------- Banner Section -------- */

/* -------- How to send mail section --------*/

.zwc-how-to-con>h2 {
    margin-bottom: 30px;
    /* max-width: 700px; */
    max-width: 890px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    font-size: 54px;
}

.slider-lst>li {
    border: 1px solid;
    padding: 7px 25px;
    border-radius: 30px;
    cursor: pointer;
}

.slider-lst>li.active {
    color: #fff;
    background-color: #000;
}

.slider-lst {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    position: relative;
    /* z-index: 3; */
}

.zwc-slider-body {
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
    /* margin-top: 85px; */
}

.zwc-slider-body:not(:last-of-type) {
    margin-bottom: 85px;
}

.zwc-slider-wrap {
    position: relative;
}

.zwc-slider-head {
    margin-bottom: 35px;
    position: sticky;
    top: 65px;
    padding: 20px;
    background-color: #fff;
    z-index: 4;
}

.zwc-slider-head::before {
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    height: 70px;
    top: 35%;
    left: 0;
    background: linear-gradient(white 60%, #ffffff00 100%);
}

.slider-img {
    background-image: linear-gradient(125deg, #08083c, #000002 70%);
    /* background: linear-gradient( 125deg,red,#000002 70%); */
    border-radius: 26px;
    display: grid;
    align-items: center;
    justify-content: center;
    padding: 80px 50px;
}
.zwc-slider-02 .slider-img{
    /* align-items: flex-start; */
    justify-content: flex-start;
    padding-left: 85px;
}
.slider-img>img {
    /* border-radius: 20px; */
}
.zwc-slider-02 .slider-img{
    display: none;
}
.zwc-slider-con>h2 {
    max-width: 500px;
    margin-bottom: 50px;
}

.zwc-slider-con>h2>span {
    display: block;
}

.slider-defn {
    margin-top: 90px;
}

.slider-desc h3 {
    font-size: 40px;
    max-width: 340px;
}

.slider-desc {
    display: grid;
    grid-template-columns: max-content 54%;
    justify-content: space-between;
}

.slider-con-feat {
    display: grid;
    grid-template-columns: repeat(3, max-content);
    gap: 15px;
    padding-top: 70px;
    /* justify-content: center; */
}

.feature-con {
    background-color: #F7F7F7;
    border-radius: 26px;
    max-width: 350px;
    padding: 40px;
}

.feature-con>h4 {
    font-size: 20px;
    max-width: 210px;
    /* display: grid; */
    /* grid-template-columns: max-content 1fr; */
    /* align-items: start; */
}


.slider-con-def {
    padding-bottom: 60px;
    position: relative;
}

.slider-con-def::after {
    content: "";
    display: flex;
    width: 100%;
    height: 1px;
    background: linear-gradient(45deg, transparent, #c6c6c6, transparent);
    position: absolute;
    bottom: 0;
    /* top: 0; */
    left: 0;
}

.slider-con-uses {
    padding-top: 55px;
}

.slider-img-mobile {
    display: none;
}

/* -------- How to send mail section --------- */

/* -------- Advantages section --------- */
.zwc-advantages {
    /* background-image: radial-gradient(at 50% 40%,#121438, #010213); */
    color: #fff;
}

.zwc-advantages-sec {
    display: grid;
    justify-content: center;
    gap: 30px;
    /* grid-template-columns: ; */
}

.zwc-advan {
    /* background-image: linear-gradient(166deg, #1B1D5B, #07081F); */
    background-image: radial-gradient(circle at 18% 0%, #1e226c 6%, #090a22 80%, #08091f);
    border: 1px solid #56587E;
    border-radius: 26px;
    padding: 60px 45px;
    max-width: 520px;
    display: grid;
    grid-gap: 55px;
}

.zwc-advan.zwc-advan-01{
    grid-area: 1/1/2/2;
    padding-bottom: 0;
}

.zwc-advan-02 {
    grid-area: 1/2/2/3;
}

.zwc-advan-03 {
    grid-area: 2/1/3/2;
}

.zwc-advan-04 {
    grid-area: 2/2/3/3;
}

.zwc-advan-03 .zwc-advan-web-img {
    display: flex;
}

.zwc-advan-04 .zwc-advan-web-img {
    position: relative;
    max-width: 100px;
    /* padding: 60px 0 0; */
    margin: 0 auto;
    /* overflow: hidden; */
}

.zwc-advan-04 .zwc-advan-web-img:not(.slick-initialized) {
    display: flex;
    max-width: 300px;
}

.zwc-advan-web-img .slick-list {
    overflow: visible;
}

.zwc-advan-con {
    /* padding-bottom: 45px; */
    /* padding: 60px 0 0; */
}

.zwc-advan-04 .zwc-advan-img {
    /* padding-top: 55px; */
    position: relative;
    padding: 80px 0 50px;
    overflow: hidden;
    margin: 0 auto;
    /* max-width: 300px; */
    width: 300px;
    max-width: 100%;
}

.zwc-advan-img:not(.zwc-advan-04 .zwc-advan-img) {
    line-height: 0;
    width: fit-content;
    margin: auto;
}

.zwc-advan-04 .zwc-advan-img>span {
       /* content: "24x7 Support"; */
       font-size: 15px;
       position: absolute;
       top: 0px;
       left: 0;
       right: 0;
       margin-inline: auto;
       width: fit-content;
       /* left: 50%; */
       /* transform: translateX(-50%); */
       background-color: #0C0D26;
       border: 1px solid #3C3E6D;
       padding: 10px 20px;
       border-radius: 100px;
}
.zwc-advan-04 .zwc-advan-img>span::after {
    content: "24x7 Support";
    color: rgb(127, 238, 157);
    font-family: var(--primaryfont-bold);
}
.zwc-advan-04 .zwc-advan-img>span::before {
    content: " ";
    color: rgb(127, 238, 157);
    width: 10px;
    height: 10px;
    display: inline-block;
    background-color: rgb(127, 238, 157);
    position: relative;
    left: 0;
    border-radius: 50%;
    margin-right: 10px;
    box-shadow: 0 0 12px 2.5px rgb(127, 238, 157);
}
.adavn-icon {
    width: 110px;
    height: 100px;
    background-image: linear-gradient(166deg, #1F2042, #07081D);
    border-radius: 15px;
    position: relative;
    border: 1px solid #56587E;
}

.adavn-icon:first-of-type {
    /* border: 1px solid; */
}


.adavn-icon::before {
    content: ' ';
    display: grid;
    width: 43px;
    height: 40px;
    background: url(/sites/zweb/images/zeptomail/getting-started/smtp-icons.png) no-repeat;
    background-size: 366px auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.adavn-icon {
    transform: scale(1);
    opacity: .5;
    transition: transform 0.5s ease, border 0.5s ease, box-shadow 0.5s ease, opacity 0.5s ease;
}

.adavn-icon.zwc-slide-active {
    border: 1px solid rgb(82, 87, 197);
    transform: scale(1.2);
    z-index: 2;
    box-shadow: 0 0 40px -5px #656DFC76;
    opacity: 1;
}

.adavn-icon.zwc-slide-hidden {
}

.adavn-icon3::before {
    background-position: -86px 0;
    height: 42px;
}

.adavn-icon1::before {
    background-position: -44px 0;
    height: 42px;
}

.adavn-icon1.zwc-slide-active::before {
    background-position: -238px 0;
}

.adavn-icon2.zwc-slide-active::before {
    background-position: -195px 0;
}

.adavn-icon3.zwc-slide-active::before {
    background-position: -281px 0;
}

.zwc-advan-img {
    position: relative;
}

.zwc-advan-03 .zwc-advan-img::before {
    /* content: " ";
    display: inline-block;
    width: 30px;
    height: 30px;
    position: absolute;
    background-color: rgb(120, 225, 148);
    border-radius: 50%;
    top: 50px;
    right: 70px; */
}

.zwc-advan-03 .zwc-advan-img>img::before {
    /* content: " ";
    display: block;
    width: 30px;
    height: 30px;
    position: absolute;
    border-radius: 50%;
    top: 50px;
    right: 70px;
    animation: slide 1s infinite 3s;
  background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,0.8) 50%,rgba(128,186,232,0) 99%,rgba(125,185,232,0) 100%);  */
}

.zwc-advan-03 .zwc-advan-img::after {
    /* content: " ";
    display: block;
    width: 7px;
    height: 13px;
    border: solid black;
    border-width: 0 2px 2px 0;
    transform: rotate(38deg);
    position: absolute;
    top: 57px;
    right: 81px; */
}

.zwc-advan-01 .zwc-advan-img>img {
    border-radius: 15px 15px 0 0;
    border: 1px solid #2B2E51;
}

.zwc-advan-01 .circle-aniamte {
    position: absolute;
    top: 33%;
    left: 38%;
}

.zwc-advan-01 .circle-aniamte>span {
    position: absolute;
    z-index: 2;
    font-size: 25px;
}

.zwc-advan-01 .circle-aniamte>span::before {
    content: '';
    width: calc(20px + 2px);
    height: calc(20px + 2px);
    /* border: 1px solid #fff; */
    background-color: #51538D;
    position: absolute;
    /* left: -1px;
    top: -1px; */
    border-radius: 50%;
    opacity: 1;
    /* animation: glowFadeOut 2.5s ease-in-out 1.8s infinite; */
    top: -11px;
    left: -5px;
    z-index: -1;
}

.zwc-advan-01 .circle-aniamte::after {
    content: '';
    position: absolute;
    /* border: 1px solid #fff; */
    /* background-color: #fff; */
    width: 40px;
    height: 40px;
    border-radius: 50%;
    filter: drop-shadow(0 3px 45px #2A2C55);
    animation: glowFadeOut 2.5s ease-in-out 0.9s infinite;
    top: -20px;
    left: -14px;
    z-index: 1;
}

.zwc-advan-01 .circle-aniamte::before {
    content: '';
    position: absolute;
    /* border: 1px solid #fff; */
    /* background-color: #fff; */
    width: 40px;
    height: 40px;
    border-radius: 50%;
    filter: drop-shadow(0 3px 45px #2A2C55);
    animation: glowFadeOut 2.5s ease-in-out infinite;
    top: -20px;
    left: -14px;
    z-index: 1;
}

@keyframes glowFadeOut {
    0% {
        transform: scale(.8);
        background-color: #373866;
        opacity: 1;
    }


    100% {
        transform: scale(1.5);
        background-color: #2A2C55;
        opacity: 0;
    }
}


.zwc-advan-02 .zwc-advan-img {
    /* position: relative; */
    top: -50%;
    transform: translateY(50%);
}

.zwc-advan-02 .secondary-img-sec>img {
    
}

.zwc-advan-02 .zwc-advan-img::before {}

.zwc-advan-02 .zwc-advan-img>div {
    position: relative;
}

.zwc-advan-02 .tick-icon {
   
}

.mail-icon {
    display: grid;
    align-items: center;
    justify-content: center;
    width: 70px;
    height: 70px;
    background-image: linear-gradient(180deg, #1f2042, #0a0b21);
    border: 1px solid #56587E;
    border-radius: 10px;
    position: absolute;
    top: -40px;
    right: -10px;
    z-index: 2;
    box-shadow: 0 0 35px -5px #656DFC76;
    animation: floting-animation 3.5s infinite ease-in-out forwards;

}

.mail-icon::before {
    content: " ";
    background: url(/sites/zweb/images/zeptomail/getting-started/smtp-icons.png) no-repeat;
    background-size: 366px auto;
    background-position: -131px -3px;
    width: 41px;
    height: 31px;
    filter: drop-shadow(0px 0px 12px #4afd98);
}

.zwc-advan-img {
}

.zwc-advan-02 .secondary-img-sec {
    position: absolute;
    top: 65%;
    left: 13%;
    overflow: hidden;
    width: 75%;
    border-radius: 10px;
    opacity: 0;
}

.zwc-advan-02 .secondary-img-sec::before {
    content: '';
    position: absolute;
    width: 100px;
    height: 100%;
    background-image: linear-gradient(120deg,
            rgba(255, 255, 255, 0) 30%,
            rgba(255, 255, 255, 0.1),
            rgba(255, 255, 255, 0) 70%);
    top: 0;
    left: -100px;
    /* animation: shine 2s infinite linear; */
    z-index: 2;
}

.zwc-advan-03 .secondary-img-sec {
    position: relative;
    bottom: 0;
    left: 0;
    filter: drop-shadow(0 0 6px #656DFC76);
}

.zwc-advan-03 .zwc-advan-img>div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}

.tick-aniamte-sec>p {
    max-width: 200px;
    text-align: center;
}

.zwc-advan-03 .secondary-img-sec::before {
    content: " ";
    display: inline-block;
    background: url(/sites/zweb/images/zeptomail/getting-started/smtp-icons.png) no-repeat;
    background-size: 316px auto;
    background-position: -278px 0;
    width: 45px;
    height: 40px;
    position: absolute;
    top: -50%;
    transform: translateY(50%);
    left: 0;
}

.zwc-advan-03 .secondary-img-sec>div {
    -webkit-clip-path: polygon(65% 0, 100% 27%, 100% 100%, 0 100%, 0 0);
    clip-path: polygon(65% 0, 100% 27%, 100% 100%, 0 100%, 0 0);
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 2;
    top: 0;
    left: 0;
}

.zwc-advan-03 .secondary-img-sec>div::before {
    content: '';
    position: absolute;
    width: 100px;
    height: 100%;
    background-image: linear-gradient(120deg,
            rgba(255, 255, 255, 0) 40%,
            rgba(255, 255, 255, 0.1),
            rgba(255, 255, 255, 0) 70%);
    top: 0;
    /* left: 60px; */
    left: -100px;
    /* animation: shine 2s infinite linear; */
    z-index: 2;
}

.zwc-advan-03 .secondary-img-sec>div::after {
    /* content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    box-shadow: 0 0 40px -5px #656DFC76;
    top: 0;
    left: 0; */
}

@keyframes shine {
    0% {
        left: -100px
    }

    20% {
        left: 100%
    }

    100% {
        left: 100%
    }
}

.zwc-advan-mob-image {
    display: none;
}

.tick-class,
.zwc-advan-03 .tick-anime {
    display: inline-block;
    width: 30px;
    height: 30px;
    position: absolute;
    background-color: rgb(249, 221, 91);
    border-radius: 50%;
    right: 9%;
    bottom: -15px;
    transform: rotate(38deg);
    opacity: 0;
}

.zwc-advan-03 .tick-anime {
    background-color: rgb(127, 238, 157);
    opacity: 1;
    top: -50%;
    right: 43%;
    opacity: 0;
}

.zwc-advan-03 .tick-anime::before {
    content: " ";
    display: block;
    width: 7px;
    height: 13px;
    border: solid black;
    border-width: 0 2px 2px 0;
    position: absolute;
    bottom: 10px;
    left: 11px;
    opacity: 0;
}

.zwc-advan-02 .zwc-advan-img.zwe-ob .tick-class.anime-end {
    animation: scale-animation .4s 1 linear forwards;
    animation-delay: .5s;
    /* opacity: 1; */
}

.tick-class::before {
    content: " ";
    display: block;
    width: 7px;
    height: 13px;
    border: solid black;
    border-width: 0 2px 2px 0;
    position: absolute;
    bottom: 10px;
    left: 11px;
    opacity: 0;

}

.anime-end.tick-class::before {
    animation: arrow-animation .4s 1 linear forwards;
    animation-delay: 1s;
}

@keyframes scale-animation {
    0% {
        transform: scale(.5) rotate(38deg);
        opacity: 0;
    }

    60% {
        transform: scale(1.25) rotate(38deg);
        opacity: 1;
    }

    100% {
        transform: scale(1) rotate(38deg);
        opacity: 1;
    }
}

@keyframes arrow-animation {
    0% {
        border-width: 0 0px 2px 0;
        width: 0;
        height: 0;
        opacity: 0;
    }

    50% {
        border-width: 0 2px 2px 0;
        width: 7px;
        height: 0;
        opacity: 1;
    }

    100% {
        border-width: 0 2px 2px 0;
        width: 7px;
        height: 13px;
        opacity: 1;
    }
}

@keyframes transform-animation {
    0% {
        transform: translateY(50%);
        opacity: 0;
    }

    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes floting-animation {
    0% {
        transform: scale(1);
        box-shadow: 0 0 30px -5px #656DFC76;
    }

    50% {
        transform: scale(.92);
        box-shadow: 0 0 40px 0px #656DFC76;
    }

    100% {
        transform: scale(1);
        box-shadow: 0 0 30px -5px #656DFC76;
    }
}

.zwc-advan-02 .zwc-advan-img.zwe-ob .secondary-img-sec {
    animation: transform-animation .4s 1 linear forwards;
    /* opacity: 1; */
}

.dots-anime-sec {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

.dots-anime-sec>span {
    width: 10px;
    height: 10px;
    /* border: 1px solid; */
    border-radius: 50%;
    background-color: rgb(127, 238, 157);
    position: relative;
    z-index: 2;
    opacity: 1;
    /* animation: dot-animation .7s 1 ease-in-out forwards;  */
}

.dots-anime-sec>span:nth-child(2) {
    animation-delay: .8s;
}

.dots-anime-sec>span::before {
    content: " ";
    display: inline-block;
    width: calc(100% + 10px);
    height: calc(100% + 10px);
    /* border: 1px dashed rgb(127, 238, 157); */
    border: 1px solid rgb(127, 238, 157);
    border-radius: 50px;
    position: relative;
    /* top: -5px;
   left: -5px; */
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    /* transition: border 2s ease; */
}

.dots-anime-sec>span::before {
}

.tick-aniamte-sec {
    position: relative;
    display: grid;
    gap: 20px;
    /* align-self: self-end; */
    width: 50%;
}

@keyframes bar-animation {
    0% {
        /* width: 50%; */
        background-size: 100% auto;
        opacity: 1;
    }

    100% {
        /* width: 100%; */
        background-size: 200% auto;
        opacity: 1;
    }
}

@keyframes dot-animation {
    0% {
        opacity: 0.5;
        transform: scale(.85);
        filter: grayscale(1);
    }

    70% {
        transform: scale(1.15);
    }

    100% {
        opacity: 1;
        transform: scale(1);
        filter: grayscale(0);
    }
}

.dots-anime-sec::before {
    content: ' ';
    display: inline-block;
    width: 100%;
    height: 1px;
    /* border-bottom: 1px solid #4D4F74; */
    position: absolute;
    /* opacity: 1;  */
    background-image: linear-gradient(to right, rgb(127, 238, 157) 50%, #4D4F74 50%);
    background-size: 100% auto;
}

.dots-anime-sec>span:nth-child(3) {
    opacity: .5;
    filter: grayscale(1);
    transform: scale(.85);
}

.zwc-advan-img.zwe-op .dots-anime-sec::before {
    animation: bar-animation 2s 1 ease-in-out forwards;
}

.zwc-advan-img.zwe-op .dots-anime-sec>span:nth-child(1) {
    /* animation: none; */
    opacity: 1;
}

.zwc-advan-img.zwe-op .dots-anime-sec>span:nth-child(2) {
}

.zwc-advan-img.zwe-op .dots-anime-sec>span:nth-child(3) {
    animation: dot-animation .4s 1 ease-in-out forwards;
    animation-delay: 1.5s;
}

.tick-aniamte-sec.anime-end .tick-anime {
    /* opacity: 1; */
    /* animation: dot-animation .7s 1 ease-in-out forwards;  */
    animation: scale-animation .4s 1 linear forwards;
}

.tick-aniamte-sec.anime-end .tick-anime::before {
    animation: arrow-animation .4s 1 linear forwards;
    animation-delay: .4s;
}

.zwc-advan-web-img:not(.slick-initialized) .adavn-icon2 {
    border: 1px solid #5257c5;
    transform: scale(1.2);
    z-index: 2;
    box-shadow: 0 0 40px -5px #656DFC76;
    opacity: 1
}

.zwc-advan-web-img:not(.slick-initialized) .adavn-icon2::before {
    background-position: -194px 0;
}

/* -------- Advantages section --------- */


/* -------- Bottom section -------- */
.zwc-bottom {
    background-image: radial-gradient(at 50% 40%, #121438, #010213);
    color: #fff;
}

.zwc-bottom-ban {
    /* background-color: rgb(5, 6, 26); */
    color: #fff;
}

.zwc-bottom-ban .content-wrap {
    max-width: 1660px;
    margin: 0 auto;
    /* background-color: #131539; */
    border-radius: 30px;
    /* background-color: #194D40; */
    position: relative;
    overflow: hidden;
    width: 96%;
}

.zwc-bottom-ban .content-wrap::before {
    content: '';
    height: 100%;
    width: 115%;
    background-image: radial-gradient(ellipse at 50% 0%, #1D2381 0%, #15173E, #010213 80%);
    position: absolute;
    top: 0;
    left: 50%;
    right: 0;
    margin: auto;
    transform: translateX(-50%);
}

.zwc-bottom-con {
    /* max-width: 500px; */
    text-align: center;
    position: relative;
    margin: 0 20px;
}

.zwc-bottom-con>h2 {
    max-width: 790px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 35px;
}

.zwc-bottom-con>h2 {}

/* -------- Bottom section -------- */



/* -------- Code styles ------- */
.zwc-code-integration-wrap-inner {
    /* background-image: linear-gradient(to bottom, #16173b, #03030d); */
    /* border-radius: 30px; */
    /* overflow: hidden; */
    /* padding: 0 0px 0 20px; */
    /* border: 1px solid #56587e; */
    position: relative;
}
.zwc-code-copied-info {
    position: absolute;
    top: 0;
    /* right: 0; */
    /* bottom: 0; */
    left: 0;
    height: 100%;
    width: 100%;
    /* margin: auto; */
    z-index: 3;
    /* transform: translate(-50%, -50%); */
    text-align: center;
    display: grid;
    align-items: center;
    -webkit-backdrop-filter: blur(4px) brightness(0.5);
    backdrop-filter: blur(4px) brightness(0.5);
    border-radius: 30px;
    opacity: 0;
    visibility: hidden;
    font-size: 20px;
    font-family: var(--zf-primary-bold);
    color: #fff;
}
.zwc-code-copied-info.zwc-active {
    animation: fadeInOut 1.5s ease;
}
@keyframes fadeInOut {
    0% {
        opacity: 0;
        visibility: hidden;
    }
    
    50% {
        opacity: 1;
        visibility: visible;
    }
    100% {
        opacity: 0;
        visibility: hidden;
    }
}
.zwc-integration-code-lang {
    display: grid;
    grid-auto-flow: column;
    justify-items: center;
    grid-gap: 15px;
    max-width: 560px;
    margin: 0 1em 10px;
    transform: translateX(-15px);
    /* padding: 0 1em; */
}
.zwc-integration-code-lang .zwc-code-lang-active[data-lang] {
    color: #000;
    font-family: var(--zf-primary-semibold);
}

.zwc-integration-code-lang span[data-lang] {
    color: #bbb;
    padding: 4px 15px;
    cursor: pointer;
    border-radius: 10px;
    position: relative;
    z-index: 2;
    /* z-index: 5; */
    font-size: 0px;
    transition: color 0.4s ease;
}
.zwc-integration-code-lang span[data-lang]::before {
    font-size: 19px;
}
.zwc-integration-code-lang span[data-lang="curl"]::before {
    content: 'Curl';
}
.zwc-integration-code-lang span[data-lang="js"]::before {
    content: 'Node.js';
}
.zwc-integration-code-lang span[data-lang="c"]::before {
    content: 'C#';
}
.zwc-integration-code-lang span[data-lang="python"]::before {
    content: 'Python';
}
.zwc-integration-code-lang span[data-lang="php"]::before {
    content: 'PHP';
}
.zwc-integration-code-lang span[data-lang="java"]::before {
    content: 'Java';
}
.zwc-integration-code-lang span.zwc-tab-slider {
    position: absolute;
    width: 65px;
    height: 100%;
    /* background-color: #000003; */
    background-color: #4dfd9a;
    border-radius: 10px;
    left: 5px;
    opacity: 1;
    visibility: visible;
    transition: width 0.4s ease, left 0.4s ease, opacity 0.4s ease, visibility 0.4s ease;
}
.zwc-integration-code {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    max-height: 450px;
    position: relative;
}

.zwc-integration-code .zwc-copy-btn {
    display: grid;
    position: absolute;
    font-size: 0;
    z-index: 3;
    top: 10px;
    right: 25px;
    cursor: pointer;
    padding: 18px 16px 12px 22px;
    border-radius: 8px;
    min-width: 0;
    text-align: center;
    background-color: #2a2c4f;
    transition: background-color 0.3s ease;
    transform: scale(0.75);
}

.zwc-integration-code .zwc-copy-btn::before, .zwc-integration-code .zwc-copy-btn::after {
    grid-row: 1/2;
    grid-column: 1/2;
    content: '';
}
.zwc-integration-code .zwc-copy-btn::before {
    height: 26px;
    width: 20px;
    border: solid #ccc;
    border-width: 1px 0 0 1px;
    display: inline-block;
    border-radius: 4px 0 0 0;
    transform: translate(-5px, -5px);
}
.zwc-integration-code .zwc-copy-btn::after {
    height: 25px;
    width: 20px;
    border: 1px solid #ccc;
    display: inline-block;
    border-radius: 4px;
}



.zwc-integration-code .zwc-code-active {
    opacity: 1;
    z-index: 2;
}
:not(pre)>code[class*="language-"], pre[class*="language-"] {
    background: none;
}
.zwc-integration-code pre {
    opacity: 0;
}
.zwc-integration-code pre {
    grid-column: 1/2;
    grid-row: 1/2;
}
code[class*="language-"], pre[class*="language-"] {
    color: #a4a4dd;
}

.zwc-code-integration-wrap ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

.zwc-code-integration-wrap ::-webkit-scrollbar-track {
    /* box-shadow: inset 0 0 5px red; */
    border-radius: 10px;
}

/* Handle */
.zwc-code-integration-wrap ::-webkit-scrollbar-thumb {
    /* background-image: radial-gradient(#49fd9887, transparent); */
    background: #2A2C4D;
    border-radius: 10px;
}

.zwc-code-integration-wrap ::-webkit-scrollbar-thumb:horizontal {
    background: #2A2C4D;
}

/* Handle on hover */
.zwc-code-integration-wrap ::-webkit-scrollbar-thumb:hover {
    /* background-image: radial-gradient(#49fd9887, transparent); */
    /* background: #49fd9887; */
    background: #2A2C4D;
}

/* For corner patch */
.zwc-code-integration-wrap ::-webkit-scrollbar-corner{
    background: transparent;
    width: 0;
    height: 0;
}

@supports(scrollbar-color: red blue) {
    .zwc-code-integration-wrap {
        scrollbar-color: #2a2c4f transparent;
        scrollbar-width: thin;
    }
}
.zwc-code-integration-wrap {
    background-image: linear-gradient(125deg, #08083c, #000002 70%);
    /* background: linear-gradient( 125deg,red,#000002 70%); */
    border-radius: 26px;
    /* display: grid; */
    align-items: center;
    justify-content: center;
    padding: 80px 0 80px 55px ;
    position: relative;
    overflow: hidden;
}
code[class*="language-"], pre[class*="language-"]{
    font-size: 16px;
}
.zwc-code-integration-wrap-inner{
    /* max-width: 700px; */
}
/* -------- Code styles ------- */




/* -------- media Query ------- */
@media only screen and (max-width:1399px) {
    .zwc-inner-wrap h1 {
        font-size: 66px;
    }

    .zwc-inner-wrap h2 {
        font-size: 44px;
    }

    .zwc-how-to-con>h2 {
        font-size: 48px;
        max-width: 700px;
    }

    .zwc-inner-wrap h3 {
        font-size: 23px;
    }

    .slider-desc h3 {
        font-size: 39px;
    }

    .slider-img,.zwc-code-integration-wrap {
        max-width: 900px;
        margin-inline: auto;
    }

    .zwc-slider-con>h2 {
        text-align: center;
        margin-inline: auto;
    }

    .slider-desc {
        max-width: 990px;
        margin-inline: auto;
    }
    .slider-defn {
        margin-top: 80px;
    }
    .slider-con-feat {
        padding-top: 60px;
    }
.zwc-slider-02 .slider-img-web{
    max-width: 580px;
}
.zwc-slider-02 .slider-img {
    padding-left: 70px;
}
}

@media only screen and (max-width:1299px) {
    .zwc-inner-wrap h1 {
        font-size: 60px;
    }

    .zwc-inner-wrap h2 {
        font-size: 41px;
    }

    .zwc-how-to-con>h2 {
        /* font-size: 51px; */
    }

    .slider-desc h3 {
        font-size: 33px;
    }

}

@media only screen and (max-width:1199px) {
    .zwc-inner-wrap h1 {
        font-size: 56px;
    }

    .zwc-inner-wrap h2 {
        font-size: 41px;
    }

    .zwc-how-to-con>h2 {
        max-width: 650px;
        /* margin-bottom: 0px; */
        /* font-size: 48px; */
    }

    .slider-desc h3 {
        font-size: 30px;
    }

    .zgt-section .content-wrap {
        padding: 85px 0 95px;
    }

    .zwc-advantages .content-wrap {
        padding: 105px 0 100px;
    }

    .zwc-bottom-ban .content-wrap {
        padding: 80px 0 95px;
    }

    .zwc-banner {
        padding-top: 135px;
    }
    .zwc-banner .content-wrap {
        padding-bottom: 105px;
    }
    .zwc-how-to .content-wrap {
        padding-top: 80px;
        padding-bottom: 90px;
    }
    .zwc-slider-head,
    .zwc-how-to-con>h2 {
        /* margin-bottom: 40px; */
    }

    .feature-con {
        max-width: 315px;
    }

    .slider-con-feat {
        justify-content: space-evenly;
    }

    .zwc-slider-head {
        top: 0;
    }

    .zwc-advan {
        max-width: 490px;
    }

    .zwc-advan-01 .circle-aniamte {
        /* top: 92px;
        left: 155px; */
    }

    .zwc-advan-02 .zwc-advan-img>div>img:not(:first-child) {
        top: 90px;
        left: 50px;
        max-width: 280px;
    }

    .slider-img>img {
        /* max-width: 850px; */
    }

    .feature-con>h4 {
        max-width: 100%;
    }

    .zwc-advantages-sec {
        gap: 25px;
    }

    .slider-desc h3 {
        max-width: 300px;
    }

    .slider-desc {
        /* justify-content: space-around; */
    }
    .slider-img,.zwc-code-integration-wrap{
        max-width: 800px;
    }
    .slider-desc{
        max-width: 800px;
    }
    .zwc-slider-02 .slider-img-web{
        max-width: 560px;
    }
    .zwc-slider-con .slider-img{
        padding: 55px;
    }
    .zwc-slider-con>h2 {
        margin-bottom: 35px;
    }
    .slider-defn {
        margin-top: 70px;
    }
    .zwc-code-integration-wrap{
        padding: 55px 0 55px 55px;
    }
}

@media only screen and (max-width:1024px) {
    .zwc-inner-wrap h1 {
        /* font-size: 66px; */
    }

    .feature-con {
        max-width: 300px;
    }

    .zwc-banner-con {
        display: grid;
        grid-template-columns: 44% 350px;
        gap: 60px;
    }

    .zwc-our-icon {
        /* bottom: 30px;
        right: 52px; */
    }

    .zwc-advan {
        max-width: 430px;
    }

    .zwc-advan-01 .circle-aniamte {
        top: 85px;
        left: 145px;
    }

    .zwc-advan-02 .zwc-advan-img>div>img:not(:first-child) {
        top: 80px;
        left: 45px;
        max-width: 270px;
        transform: scale(.9);
    }


}

@media only screen and (max-width:991px) {
    .zwc-inner-wrap h1 {
        font-size: 48px;
        max-width: 450px;
        margin-left: auto;
        margin-right: auto;
    }

    .zwc-inner-wrap h2 {
        font-size: 36px;
    }

    .zwc-how-to-con>h2 {
        /* font-size: 42px; */
        max-width: 520px;
    }
    .zwc-left-sec{
        margin-bottom: 0;
    }
    .slider-desc h3 {
        font-size: 27px;
        max-width: 100%;
    }
    .zwc-left-sec>p {
        margin-bottom: 45px;
    }
    .zgt-section .content-wrap {
        padding: 70px 0 80px;
    }

    .zwc-advantages .content-wrap {
        padding: 85px 0 85px;
        /* padding: 85px 0 80px; */
    }

    .zwc-bottom-ban .content-wrap {
        padding: 70px 0 85px;
    }

    .zwc-banner.zgt-section .content-wrap {
        padding-bottom: 85px;
    }
    .zwc-how-to .content-wrap {
        padding-top: 65px;
    }
    .zwc-banner {
        padding-top: 120px;
    }

    .zwc-banner::before {
        background-image: url(/sites/zweb/images/zeptomail/homepage/header-gradient-tab.svg);
        width: 1000px;
        height: 900px;
        right: 0;
        left: 0;
        margin: auto;
    }

    .zwc-banner-con {
        grid-template-columns: auto;
        text-align: center;
        max-width: 660px;
        margin-left: auto;
        margin-right: auto;
    }

    .zwc-slider-head,
    .slider-con-def::after {
        display: none;
    }

    .zwc-slider-body {
        text-align: center;
    }

    .zwc-slider-con>h2,
    .slider-desc h3 {
        margin-left: auto;
        margin-right: auto;
    }

    .slider-desc,
    .slider-con-feat {
        grid-template-columns: auto;
        align-items: center;
        justify-content: center;
    }

    .feature-con {
        max-width: 520px;
    }

    .slider-para {
        max-width: 600px;
    }

    .feature-con>h4 {
        grid-template-columns: repeat(2, max-content);
        justify-content: center;
    }

    .slider-desc {
        padding: 0;
    }

    .slider-desc:not(:last-of-type) {
        padding-bottom: 45px;
    }

    .slider-defn {
        margin-top: 60px;
    }

    .slider-con-feat {
        padding-top: 55px;
        gap: 40px;
    }

    .zwc-advantages-sec {
        grid-template-columns: auto;
    }

    .zwc-advan {
        grid-area: auto;
        /* text-align: center; */
    }

    .zwc-slider-head,
    .zwc-how-to-con>h2 {
        /* margin-bottom: 50px; */
    }

    .zwc-slider-body:not(:last-of-type) {
        margin-bottom: 70px;
    }

    /* .zwc-slider-body{
        margin-top: 0;
    }
    .zwc-slider-body:not(:last-of-type){
        margin-bottom: 85px;
    } */
    .zwc-advan-img {
        display: none;
    }

    .zwc-right-sec {
        justify-self: center;
    }

    .zwc-right-sec>svg {
        width: 80%;
    }

    .zwc-our-icon {
        right: 50px;
    }

    .zwc-right-sec .zwc-svg-user-application {
        min-width: 60%;
    }

    .slider-img>img {
        /* max-width: 650px; */
    }

    .slider-img {
        padding: 50px 40px;
    }

    .zwc-advan-mob-image {
        display: block;
        line-height: 0;
    }

    /* .slider-img-mobile{
        display: block;
    } */
    .zwc-advan-01 .zwc-advan-mob-image>img {
        border-radius: 15px 15px 0 0;
        grid-row: 1/2;
        grid-column: 1/2;
    }

    .zwc-advan-mob-image {
        position: relative;
    }

   
    /* .slider-img{
        max-width: 700px;
    } */
    /* .slider-desc{
        max-width: 820px;
    } */
    .zwc-advan-01 .zwc-advan-mob-image::before {
        /* content: ' ';
        display: inline-block;
        width: calc(100% - 30px);
        height: calc(100% - 30px);
        border: 1px solid #56587E;
        position: absolute;
        border-radius: 15px; */
        content: ' ';
        display: inline-block;
        width: calc(100% + 1px);
        height: calc(100% + 1px);
        border: 1px solid #2B2E51;
        /* position: absolute; */
        border-radius: 15px 15px 0 0;
        grid-row: 1/2;
        grid-column: 1/2;
        position: relative;
    }
    .zwc-advan-mob-image {
        display: grid;
        align-items: center;
        justify-content: center;
    }
    .slider-img,.zwc-code-integration-wrap{
        max-width: 730px;
    }
    .zwc-slider-02 .slider-img{
        padding: 9% 9%;
    }
    code[class*="language-"], pre[class*="language-"] {
        font-size: 14px;
    }
    .zwc-integration-code-lang span[data-lang]::before {
        /* font-size: 17px; */
    }
    .zwc-integration-code{
        max-height: 430px;
    }
}

@media only screen and (min-width:768px) and (max-width:991px) {
    .zwc-inner-wrap h1 {
        margin-bottom: 25px;
    }
    .zwc-advan {
        grid-template-columns: 1fr 1fr;
        max-width: none;
    }

    .zwc-advan {
        padding: 30px;
        grid-gap: 25px;
        align-items: center;
    }

    .zwc-advan.zwc-advan-01{
        padding-bottom: 30px;
    }

    .zwc-advan-mob-image {
        height: 100%;
        display: grid;
        align-items: center;
        justify-content: center;
        padding: 30px;
        background-color: #000;
        border-radius: 20px;
        /* width: fit-content; */
    }

    .zwc-advan-02 .zwc-advan-mob-image>img {
        transform: translateX(2%);
    }
    .zwc-advan-03 .zwc-advan-mob-image>img{
        transform: translateX(-4%);
    }

    .zwc-advan-01 .zwc-advan-mob-image>img ,   .zwc-advan-01 .zwc-advan-mob-image::before {
        border-radius: 15px;}
    }
@media only screen and (max-width:767px) {
    .zwc-inner-wrap h1 {
        font-size: 40px;
        max-width: 380px;
    }

    .zwc-inner-wrap h2 {
        font-size: 32px;
    }

    .slider-desc h3 {
        font-size: 25px;
    }

    .zwc-banner-con {
        max-width: 470px;
    }

    .zwc-how-to-con>h2 {
        /* font-size: 40px; */
    }

    .zwc-slider-head,
    .zwc-how-to-con>h2 {
        margin-bottom: 40px;
    }

    .zgt-section .content-wrap {
        padding: 60px 0 70px;
    }

    .zwc-advantages .content-wrap {
        padding: 75px 0 75px;
    }

    .zwc-bottom-ban .content-wrap {
        padding: 60px 0 70px;
    }

    .zwc-banner.zgt-section .content-wrap {
        padding-top: 20px;
    }

    .zwc-banner {
        padding-top: 90px;
    }
    .zwc-how-to .content-wrap {
        padding-top: 55px;
        padding-bottom: 65px;
    }
    .slider-img,
    .feature-con,
    .zwc-advan,
    .zwc-code-integration-wrap {
        border-radius: 15px;
    }

    .zwc-bottom-con>h2 {
        max-width: 700px;
    }

    .zwc-slider-01 .slider-img>img {
        /* max-width: 570px; */
        border-radius: 15px 0 0 0 ;
    }

    .zwc-right-sec {
        /* justify-self: center; */
        /* transform: scale(.8) translateY(-50px); */
        max-width: 250px;
    }

    .slider-img-mobile {
        display: block;
        line-height: 0;
    }

    .slider-img-web {
        display: none;
    }

    .zwc-right-sec .zwc-svg-words span {
        padding: 5px 15px;
    }

    .zwc-right-sec .zwc-svg-words {
        max-width: 80px;
    }

    .zwc-right-sec .zwc-svg-user-application {
        max-width: 180px;
    }

    .zwc-right-sec .zwc-svg-smtp {
        left: -5%;
    }

    .zwc-right-sec .zwc-svg-api {
        right: -5%;
    }

    .zwc-our-icon {
        width: 80px;
        height: 80px;
    }

    .zwc-our-icon {
        right: 45px;
    }

    .slider-img {}
    .slider-img-mobile{
        align-self: self-end;
    }
    .zwc-slider-01 .slider-img{
        justify-content: end;
        padding-right: 0;
        padding-bottom: 0;
        padding-top: 75px;
        overflow: hidden;
    }
    .zwc-advan-con{
        text-align: center;
    }
    .zwc-advan{
        padding: 40px 20px;
    }
    .zwc-advan-01{
        /* padding-bottom: 0; */
    }
    .zwc-slider-body:not(:last-of-type) {
        margin-bottom: 60px;
    }
    .slider-con-feat,.zwc-advantages-sec  {
        gap: 30px;
    }
    .slider-img {
        /* max-width: 470px; */
    }
    .zwc-advan{
        grid-gap: 35px;
    }
    .slider-desc:not(:last-of-type) {
        padding-bottom: 40px;
    }
    .slider-con-feat {
        padding-top: 50px;
    }
    .slider-defn {
        margin-top: 50px;
    }
    .slider-desc {
        max-width: 500px;
    }
    code[class*="language-"], pre[class*="language-"] {
        font-size: 12px;
    }
    .zwc-integration-code-lang span[data-lang]::before {
        font-size: 15px;
    }
    .zwc-integration-code-lang {
        grid-gap: 8px;
    }
    
.slider-img, .zwc-code-integration-wrap {
    max-width: 560px;
}
.zwc-code-integration-wrap {
    padding: 45px 0 30px 30px;
}
.zwc-slider-01 .slider-img>img{
    max-width: 450px;
}
.zwc-integration-code-lang span[data-lang] {
    padding: 6px 12px;
}
.zwc-integration-code-lang{
    margin: 0 5px 10px;
}
.zwc-code-integration-wrap ::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}
}
@media only screen and (max-width: 600px){
    
.zwc-slider-01 .slider-img>img {
    max-width: 410px;
}

}
@media only screen and (max-width:480px) {
    .zwc-inner-wrap h1 {
        font-size: 34px;
    }

    .zwc-inner-wrap h2 {
        font-size: 28px;
    }

    .slider-desc h3 {
        font-size: 22px;
        margin-bottom: 10px;
    }

    .feature-con>h4 {
        grid-template-columns: auto;
        gap: 10px;
    }

    .feature-con>h4::before {
        justify-self: center;
    }

    .feature-con
    /* ,.zwc-advan  */
    {
        padding: 30px 20px;
    }

    .slider-desc:not(:last-of-type) {
        padding-bottom: 35px;
    }
    .slider-con-feat {
        padding-top: 45px;
    }
    .zwc-slider-con>h2 {
    }

    .slider-defn {
        margin-top: 40px;
    }
    .zwc-slider-01 .slider-img{
        padding: 35px 0 0 35px;
    }
    .slider-img>img {
    }
    .feature-con>h4 {
    }
    .zwc-slider-01 .slider-img>img {
        max-width: 100%;
    }
    .zwc-integration-code-lang {
        grid-auto-flow: row;
        grid-template-columns: repeat(3, 1fr);
        grid-gap: 0;
    }
    .zwc-integration-code-lang span.zwc-tab-slider {
        display: none;
        opacity: 0;
        visibility: hidden;
    }
    .zwc-integration-code-lang .zwc-code-lang-active[data-lang] {
        background-color: #4dfd9a;
    }
    .zwc-integration-code-lang span[data-lang] {
        padding: 8px 12px;
    }
    .zwc-integration-code .zwc-copy-btn {
        right: 15px;
    }
    .zwc-code-integration-wrap {
        padding: 20px 0px 20px 15px;
    }
    .zwc-advan-04 .zwc-advan-mob-image>img{
        max-width: 230px;
    }
    .zwc-slider-01 .slider-img>img{
        border-radius: 10px 0 0 0;
    }
}

/* -------- media Query ------- */


