img {
    display: block;
}

:root {
    --primary-color: #18232f;
    --secondary-color: #edf8ff;
    --high-light: #FF7600;
    --znb-sprit: url(/sites/zweb/images/notebook/home//znb-banner-sprite.png);
}

.zwc-main-sec {
    padding: 7em 0;
}

body h2 {
    font-size: 52px;
    line-height: 1.1;
}

p {
    font-size: 18px;
}

a.act-btn.cta-btn {
    padding: 15px 30px;
    border-radius: 3px;
    border: 0px;
}

.zwc-nb-main h1 {
    font-size: 90px;
    font-family: var(--primaryfont-semibold);
    margin-bottom: 0;
}

.zwc-nb-main h2 {
    font-size: 60px;
    font-family: var(--primaryfont-semibold);
}

.zw-other-lang .zwc-nb-main h2 {
    font-size: 50px;
}
.zwc-nb-main h3 {
    font-size: 50px;
    font-family: var(--zf-primary-bold);
}

/* --- Banner --- */
.zwc-banner-content {
    padding: 80px 0 0;
    text-align: center;
    margin: 0 auto;
}

.zwc-banner-wrapper p {
    font-size: 21px;
    max-width: 850px;
    margin: 20px auto;
}

.zwc-new-banner-flx {
    display: flex;
    justify-content: space-between;
    padding-top: 50px;
}

.zwc-new-banner-flx img {
    width: 100%;
}

.zwc-banner-col-1,
.zwc-banner-col-3 {
    width: 100%;
    max-width: 30%;
}

.zwc-banner-col-2 {
    width: 100%;
    max-width: 35%;
    position: relative;
    padding-top: 60px;
}

.zwc-banner-col-2::before {
    right: 100%;
    transition: all .5s ease-in-out;
}

.zwc-banner-col-2::before {
    content: "";
    position: absolute;
    left: -150px;
    right: -150px;
    bottom: 0;
    height: 4px;
    border-radius: 10px;
    background: #120909;
    z-index: 2;
}

.zwc-marker-main-1,
.zwc-marker-main-2 {
    position: absolute;
    display: flex;
    gap: 20px;
    align-items: flex-end;
}

.zwc-marker-main-1 {
    bottom: 0;
    left: -23%;
}

.zwc-marker-main-1 span,
.zwc-marker-main-2 span {
    background: var(--znb-sprit) 0px 0px / auto 107px no-repeat;
    display: block;
}

span.zwc-marker-1 {
    width: 42px;
    height: 111px;
    background-position: -1279px 0;
}

span.zwc-marker-2 {
    width: 32px;
    height: 111px;
    background-position: -1334px 0;
}

span.zwc-marker-3 {
    width: 43px;
    height: 75px;
    background-position: -1158px 10px;
}

span.zwc-marker-4 {
    width: 47px;
    height: 60px;
    background-position: -1220px 0;
    margin-bottom: 4px;
}

.zwc-marker-main-2 {
    bottom: 0;
    right: -25%;
}

.zwc-feature-icon {
    position: absolute;
    left: 0;
    max-width: 31px;
    top: 20%;
    border-radius: 5px;
}

.zwc-share {
    background: #fff;
    padding: 10px;
    width: 230px;
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.1) -20px 20px 40px;
    border: 1px solid #e6e6e6;
    position: relative;
}

.zwc-share .zwc-style-text {
    position: static;
    font-family: var(--zf-splfontserif-regular);
    font-size: 14px;
    margin-bottom: 5px;
}

.zwc-share-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

.zwc-share-wrapper span {
    background: var(--znb-sprit) 0px 0px / auto 60px no-repeat;
    width: 40px;
    height: 52px;
    display: block;
}

span.zwc-profile-1 {
    background-position: 0 0;
}

.zwc-acc-ctn img {
    display: none;
}

span.zwc-profile-2 {
    background-position: -41px 0;
}

span.zwc-profile-3 {
    background-position: -81px 0;
}

span.zwc-profile-4 {
    background-position: -123px 0;
}

span.zwc-profile-5 {
    background-position: -160px 0;
}

.zwc-bal-ele {
    background: var(--znb-sprit) 0px 0px / auto 70px no-repeat;
    width: 48px;
    height: 42px;
    display: block;
    position: absolute;
}

.zwc-bal-ele-rocket {
    background-position: -233px 0;
    right: 0;
    top: -20px;
    background-size: auto 60px;
    height: 43px;
    width: 35px;
}

.zwc-pro-launch {
    position: relative;
    max-width: 200px;
    margin-top: 120px;
    float: right;
}

.zwc-pro-launch-sticky {
    background: #b9edff;
    border-radius: 10px;
    color: #000;
    font-family: var(--zf-splfontserif-light);
    padding: 15px;
    position: relative;
    transform: rotate(0);
    transform-origin: 0 100%;
}

.zwc-pro-launch-sticky span {
    font-family: var(--zf-splfontserif-regular);
    font-size: 16px;
}

.zwc-pro-launch-sticky p {
    font-size: 13px;
    margin-top: 10px;
}

.zwc-sticky-bg {
    position: absolute;
    inset: 0;
    background: #a7a2e7;
    border-radius: 10px;
    z-index: -1;
    transform: rotate(0);
    transform-origin: 0 100%;
}

.zwc-bal-ele-calender {
    background-position: -335px 0;
    right: -27px;
    top: 0;
    background-size: auto 73px;
    height: 43px;
    width: 48px;
}

.zwc-style-text {
    font-family: var(--zf-splfont-cursive-one-regular);
    font-size: 26px;
    position: absolute;
    top: -55px;
    display: block;
}
.i18n-fr .zwc-style-text {
    font-size: 22px;
}
.i18n-th .zwc-style-text {
    font-size: 17px;
}
.zwc-banner-feature {
    position: relative;
}

.zwc-save-pic {
    max-width: 130px;
    margin: 0 auto;
}

.zwc-save-pic-main span {
    display: block;
    transform-origin: 0 100%;
}

.zwc-save-pic-1 {
    transform: rotate(0);
}

.zwc-save-pic span img {
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 40px;
}

.zwc-save-pic-2 {
    position: absolute;
    left: 0;
    top: 0;
    transform: rotate(0);
}

.zwc-bal-ele-thumb {
    background-position: -372px 0;
    right: -50px;
    top: 10px;
}

.zwc-audio {
    position: relative;
    max-width: 230px;
    margin-top: 150px;
}

.zwc-audio .zwc-style-text {
    left: 40px;
}

.zwc-audio-bar {
    background: #fff;
    padding: 0 20px;
    height: 63px;
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.zwc-audio-bar>div {
    position: relative;
}

.zw-other-lang .zwc-audio-bar>div {
    direction: ltr;
}

.zwc-audio-track {
    opacity: .5;
    height: 35px;
}

.zwc-audio-track-run {
    opacity: 1;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 35px;
    width: 0;
    background: url(/sites/zweb/images/notebook/home/znb-audio.svg) no-repeat 0 0 / cover;
    animation: audioTracking 5s ease-in-out infinite;
    animation-delay: 3s;
}

.zwc-bal-ele-mic {
    background-position: -231px 0;
    left: 0;
    top: -40px;
    background-size: auto 70px;
    height: 60px;
    width: 36px;
}

.zwc-audio .zwc-style-text {
    left: 40px;
}

.zwc-banner-ele span {
    position: absolute;
    background: var(--znb-sprit) no-repeat 0 0 / auto 300px;
    width: 40px;
    height: 40px;
    display: block;
}

span.zwc-bnr-icon-1 {
    bottom: 7%;
    left: 10%;
    background-position: -743px 12px;
    width: 79px;
    background-size: auto 86px;
}

span.zwc-bnr-icon-2 {
    bottom: 30%;
    left: 25%;
    background-position: -354px 12px;
    width: 19px;
    background-size: auto 50px;
    height: 43px;
}

span.zwc-bnr-icon-3 {
    bottom: 33%;
    left: 17%;
    background-position: -378px 22px;
    width: 19px;
    background-size: auto 50px;
    height: 43px;
}

span.zwc-bnr-icon-4 {
    bottom: 53%;
    left: 28%;
    background-position: -969px 22px;
    width: 16px;
    background-size: auto 93px;
    height: 39px;
}

span.zwc-bnr-icon-5 {
    bottom: 35%;
    right: 28%;
    background-position: -620px 12px;
    width: 50px;
    background-size: auto 78px;
    height: 69px;
}

span.zwc-bnr-icon-6 {
    bottom: 15%;
    right: 24%;
    background-position: -363px 12px;
    width: 27px;
    background-size: auto 60px;
    height: 48px;
}

/* ---- Rating Section ---- */
.zwc-rating-section {
    text-align: center;
}

.zwc-rating-section .content-wrap {
    border-radius: 20px;
    max-width: 1200px;
}

.zwc-rating-section h2,.zw-other-lang .zwc-rating-section h2 {
    margin: 0 auto 50px;
    max-width: 657px;
    font-size: 28px;
    font-family: var(--primaryfont-regular);
    display: inline-block;
    position: relative;
    padding-left: 160px;
    padding-right: 160px;
}

.zwc-rating-section h2 span {
    height: 9px;
    width: 140px;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

.zwc-rating-section h2 span:before,
.zwc-rating-section h2 span:after {
    content: "";
    background-image: linear-gradient(270deg, #9b9a98 0%, #fffcf8 100%);
    width: 100%;
    height: 1px;
    position: absolute;
    left: 0;
}

.zwc-rating-section h2 span:after {
    bottom: 0;
}

.zwc-rating-section h2 span:last-child {
    right: 0;
    left: auto;
}

.zwc-rating-section h2 span:last-child:before,
.zwc-rating-section h2 span:last-child:after {
    background-image: linear-gradient(90deg, #9b9a98 0%, #fffcf8 100%);
}

.zwc-rating-section ul {
    max-width: 920px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 0 15px;
}

.zwc-rating-section ul li {
    width: max-content;
}

.zwc-rating-img {
    min-height: 40px;
    display: flex;
    align-items: center;
}

.zwc-rating-section ul li img {
    max-width: 130px;
    margin: 0 auto;
}

.stars-container {
    position: relative;
    display: inline-block;
    color: transparent;
    font-size: 21px;
    letter-spacing: 2px;
    margin: 6px 0;
}

.stars-container:before {
    position: absolute;
    top: 0;
    left: 0;
    content: '\2605\2605\2605\2605\2605';
    color: #d0d0d0;
}

.stars-container:after {
    position: absolute;
    top: 0;
    left: 0;
    content: '\2605\2605\2605\2605\2605';
    color: #f9a826;
    overflow: hidden;
    transition: ease all 3s;
    -webkit-transition: ease all 3s;
    width: 0;
}

.counter-star {
    display: block;
    text-align: center;
    font-weight: 300;
    color: #888;
    font-size: 12px;
}

.current-value {
    font-size: 18px;
    color: #000;
}

.zwc-rating-section ul li.playstore img {
    max-width: 150px;
}

.zwc-rating-content.zwc-badge img {
    max-width: 120px;
}

.zwc-rating-content.zwc-badge img.zwc-batch-one {
    width: 101px;
}

.zwc-rating-content.zwc-badge img.zwc-batch-two {
    width: 90px;
    margin: 0;
}

/* --- Imagenation --- */
.zwc-block-flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.zwc-block-flex h2 {
    margin-bottom: 20px;
}

.zwc-block-flex p:last-child {
    margin-bottom: 0;
}

.zwc-block-left {
    max-width: 53%;
    width: 100%;
    position: relative;
}

.zwc-share-video video {
    max-width: 85%;
    display: block;
    margin: 0 auto;
}

.zwc-block-right {
    max-width: 38%;
    width: 100%;
}

.zwc-block-ctn,
.zwc-block-ss {
    max-width: 100%;
    margin: 0 auto;
    position: relative;
}

span.play-icon {
    width: 45px;
    height: 45px;
    background: #132c50;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(1.3);
    display: block;
    cursor: pointer;
}

span.play-icon::before {
    content: "";
    position: absolute;
    width: 55px;
    height: 55px;
    animation: 2s pulsate1 ease-out infinite;
    opacity: 1;
    border-radius: 50%;
    border: 7px solid #132c50;
    top: -5px;
    left: -5px;
    transform-origin: center;
}

span.play-icon::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-40%, -40%);
    transform-origin: center center;
    width: 0;
    height: 0;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-left: 12px solid #fff;
    z-index: 100;
    transition: all 400ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.zwc-imagination-sec {
    background: var(--secondary-color);
}

.zwc-imagination-sec .zwc-block-left {
    max-width: 57%;
    box-shadow: 0px 23px 36px #00000029;
    border-radius: 10px;
    overflow: hidden;
}

.zwc-order-change .zwc-block-left {
    order: 2;
}

@keyframes pulsate1 {
    0% {
        transform: scale(0.9);
        opacity: 1;
    }

    100% {
        transform: scale(1.2);
        opacity: 0;
    }
}

.zwc-page-title {
    margin-bottom: 70px;
    margin: 0 auto;
    max-width: 800px;
    text-align: center;
    position: relative;
}

.zwc-note-taker .zwc-page-title p {
    max-width: 500px;
    margin: 0 auto;
}

.zwc-ctn-main .zwc-page-title p {
    max-width: 700px;
    margin: 0 auto;
}

/* --- Note Taker ---*/
.zwc-note-taker {
    background: var(--primary-color);
    color: #fff;
    overflow: hidden;
}

a.btn-read {
    position: relative;
    padding-right: 25px;
    display: inline-block;
    color: #3480ff;
    font-size: 17px;
    font-family: var(--zf-primary-semibold);
    transition: all .5s ease;
}

a.btn-read:before {
    background: #3480ff;
    width: 18px;
    height: 2px;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    content: "";
    transition: all .5s ease;
}

a.btn-read:after {
    width: 10px;
    height: 10px;
    border-top: 2px solid #3480ff;
    border-right: 2px solid #3480ff;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    content: "";
    transform: rotate(45deg);
    transition: all .5s ease;
}

a.btn-read:hover:before,a.btn-read:hover:after {
    right: -10px;
}

/* ------- Tab Section ------- */
.zwc-page-title {
    text-align: center;
    max-width: 850px;
    margin: 0px auto 60px;
}

.zwc-tab-sec .zwc-page-title h2 {
    font-size: 30px;
}

.zwc-tab-sec .zwc-page-title p {
    max-width: 600px;
    margin: 15px auto 0px;
}

.zwc-tab-sec {
    background: var(--primary-color);
    color: #fff;
    border-radius: 15px;
    padding: 80px;
}

.zwc-tab-sec .zwc-page-title p {
    max-width: 600px;
    margin: 15px auto 0 auto;
}

.zwc-tab-sec .zwc-page-title h2 {
    font-size: 30px;
}

.zwc-left-tab-flex {
    display: flex;
    justify-content: center;
    gap: 60px;
    align-items: center;
    margin-top: 30px;
}

.zwc-left-tab-nav {
    width: 100%;
    max-width: 35%;
}

.zwc-left-tab-ctn {
    width: 100%;
    max-width: 45%;
}

.zwc-left-tab-nav li {
    position: relative;
    cursor: pointer;
}

.zwc-left-tab-nav li button {
    border: 0px;
    background: transparent;
    padding: 25px 0px;
    width: 100%;
    text-align: left;
    font-family: var(--zf-primary-medium);
    font-size: 24px;
    cursor: pointer;
    color: rgb(255, 255, 255);
    border-bottom: 1px solid rgb(95 95 95 / 20%);
    position: relative;
    padding-left: 35px;
}

.zwc-left-hide {
    opacity: 0;
    transform: translateY(50px);
    height: 0px;
}

.zwc-left-active {
    opacity: 1;
    transform: translateY(0px);
    height: auto;
    transition: all 0.5s ease-in-out 0s;
}

.zwc-left-tab-image {
    max-width: 85%;
    margin: 0px auto;
    border-radius: 10px;
    overflow: hidden;
}

.zwc-student {
    max-width: 95%;
}

.zwc-personal {
    max-width: 90%;
}

.zwc-left-tab-nav li.active button::before {
    content: "";
    position: absolute;
    left: 0px;
    height: 2.5px;
    bottom: -1px;
    background: var(--high-light);
    border-radius: 20px;
    width:100%;
}

.zwc-left-tab-nav li.active button {
    color: var(--high-light);
}

.zwc-left-tab-nav a {
    font-size: 14px;
    font-family: var(--zf-primary-regular);
    border-radius: 30px;
    margin: 20px 0;
    display: inline-block;
    padding: 8px 17px;
    color: #fff;
    border: 1px solid #fff;
}

@keyframes lineAnimation {
    0% {
        right: 100%;
    }

    100% {
        right: 0px;
    }
}

.zwc-left-tab-nav li p {
    margin-top: 20px;
    margin-bottom: 0;
    font-size: 16px;
}

.zwc-acc-ctn {
    display: none;
    margin-bottom: 15px;
}

.zwc-ip-address {
    margin: 10px 0;
}

.zwc-two-col {
    gap: 10px;
}

.zwc-two-col .zwc-ctn-card {
    max-width: 100%;
    flex: 50% 1 1;
    background: var(--primary-color);
    color: #fff;
    padding: 80px 100px;
    border-radius: 10px;
}

.zwc-two-col .zwc-ctn-card h3 {
    font-size: 40px;
}

.zwc-return-path .zwc-block-left {
    max-width: 750px;
    text-align: center;
    margin: 0 auto;
}

.zwc-path-icon {
    width: 60px;
    height: 60px;
    display: block;
    margin: 0 auto 15px auto;
    background: rgba(0, 0, 0, 0.5);
}

span.arrow {
    position: absolute;
    left: 0;
    top: 30px;
    width: 22px;
    height: 22px;
    border: 1px solid #ffff;
    border-radius: 100%;
}

.zwc-left-tab-nav li.active span.arrow {
    border-color: var(--high-light);
}

span.arrow::after {
    background: transparent;
    content: "";
    position: absolute;
    left: 0;
    right: 1px;
    top: 0;
    bottom: 0;
    margin: auto;
    border-left: 1px solid #fff;
    border-bottom: 1px solid #fff;
    width: 6px;
    height: 6px;
    transform: rotate(-135deg);
}

.zwc-left-tab-nav li.active span.arrow::after {
    border-color: var(--high-light);
    transform: rotate(-45deg);
    right: 0;
    top: -1px;
}

/* ------- Tab Section End ------- */

.zwc-ctn-main {
    background: var(--secondary-color);
}

.zwc-ctn-main .content-wrap {
    padding: 70px 50px;
}

.zwc-ctn-main .content-wrap::before {
    content: "";
    position: absolute;
    inset: -25px;
    border-radius: 30px;
    background: #fff;
    box-shadow: 0px 23px 76px #0000000B;
    ;
}

.zwc-note-card {
    display: flex;
    width: 100%;
}

.zwc-nc-left {
    max-width: 15%;
    width: 100%;
}

.zwc-nc-right {
    max-width: 85%;
    width: 100%;
}

.zwc-nc-item {
    border-radius: 20px;
    background-color: rgb(255, 179, 175);
    padding: 40px 30px;
    margin: 0px 5px;
    transition: all 0.3s ease-in-out 0s;
    transform: scale(0.95);
    min-height: 365px;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

.item-2 .zwc-nc-item {
    background: #FFE1A3;
}

.item-3 .zwc-nc-item {
    background: #78DAFB;
}

.item-5 .zwc-nc-item {
    background: #FFE1A3;
}

.item-6 .zwc-nc-item {
    background: #78DAFB;
}

.item-7 .zwc-nc-item {
    background: #FFE1A3;
}

.zwc-nc-item p {
    font-size: 17px;
}
.zw-other-lang .zwc-nc-item p {
   min-height: 170px;
}
.zwc-ctn-main a.btn-read:after {
    border-top: 2px solid #000;
    border-right: 2px solid #000;
}

.zwc-ctn-main a.btn-read:before {
    background: #000;
}

.zwc-page-title-bold h2 {
    font-family: var(--zf-primary-bold);
}

.zwc-nc-icon {
    width: 30px;
    height: 42px;
    display: block;
    background-image: var(--znb-sprit);
    background-size: 2290px;
    background-repeat: no-repeat;
    transform: scale(1.1);
}

.zwc-nc-text {
    background-position: -2020px 17px;
}

.zwc-nc-checklist {
    background-position: -2063px 5px
}

.zwc-nc-audios {
    background-position: -2103px 5px
}

.zwc-nc-photo {
    background-position: -2140px 7px;
    width: 32px;
}

.zwc-nc-smart {
    background-position: -2312px 13px;
    background-size: 2430px;
    width: 35px;
}

.zwc-nc-sketch {
    background-position: -2217px 6px;
}

.zwc-nc-file {
    background-position: -2254px 12px;
    width: 35px;
}

.zwc-nc-title {
    font-size: 26px;
    font-family: var(--zf-primary-semibold);
    margin: 15px 0 10px 0;
    display: block;
}


.zw-other-lang .zwc-nc-title {
    font-size: 22px;
}

.zwc-nc-item a {
    color: #000;
    font-family: var(--zf-primary-medium);
    display: inline-block;
    margin-top: 20px;
    width: max-content;
}

.zwc-nc-nav li {
    padding: 7px 0 7px 18px;
    margin-bottom: 20px;
    font-size: 18px;
    font-family: var(--zf-primary-regular);
    cursor: pointer;
    overflow: hidden;
    position: relative;
}

.zwc-nc-nav li:last-child {
    margin-bottom: 0;
}

.zw-other-lang .zwc-nc-nav li {
    padding: 7px 0 7px 7px;
    font-size: 14px;
}

.zwc-nc-nav::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 1px;
    background: #eddede;
}

.zwc-nc-nav {
    position: relative;
}

.zwc-nc-nav li div {
    display: flex;
}

.zwc-nc-nav span {
    width: 30px;
    height: 30px;
    display: inline-block;
    background-image: var(--znb-sprit);
    background-repeat: no-repeat;
    background-size: 1830px auto;
    margin-right: 10px;
    position: relative;

    /* top: 13px; */
}

.zw-other-lang .zwc-note-card {
    gap: 30px;
    direction: ltr;
}
.zw-other-lang .zwc-nc-nav .slick-list{
     min-width: 180px;
}


.zwc-text {
    background-position: -1613px 3px;
}

li.slick-slide.slick-current.slick-active .zwc-text {
    background-position: -1613px -34px;
}

.zwc-check {
    background-position: -1641px -1px;
}

li.slick-slide.slick-current.slick-active .zwc-check {
    background-position: -1641px -38px;
}

.zwc-audios {
    background-position: -1672px 0;
}

li.slick-slide.slick-current.slick-active .zwc-audios {
    background-position: -1672px -37px;
}

.zwc-photo {
    background-position: -1706px 0;
}

li.slick-slide.slick-current.slick-active .zwc-photo {
    background-position: -1706px -37px;
}

.zwc-smart {
    background-position: -1853px 4px;
    background-size: 1950px !important;
}

li.slick-slide.slick-current.slick-active .zwc-smart {
    background-position: -1853px -35px;
}

.zwc-sketch {
    background-position: -1768px 0;
}

li.slick-slide.slick-current.slick-active .zwc-sketch {
    background-position: -1768px -37px;
}

.zwc-file {
    background-position: -1799px 0;
}

li.slick-slide.slick-current.slick-active .zwc-file {
    background-position: -1799px -37px;
}

.zwc-nc-nav .slick-slide {
    float: none;
    width: 100% !important;
}

.zwc-nc-nav .slick-track {
    -webkit-transform: translate3d(0, 0, 0) !important;
    transform: translate3d(0, 0, 0) !important;
}

li.slick-slide.slick-current.slick-active {
    color: var(--high-light);
    font-family: var(--zf-primary-medium);
    position: relative;
}

.zwc-nc-nav li::before {
    top: 0;
    transition: all 0.3s ease;
    content: '';
    position: absolute;
    bottom: 100%;
    width: 3px;
    background: var(--high-light);
    left: 0;
}

.zwc-nc-nav li.slick-active::before {
    bottom: 0;

}

.item.slick-slide.slick-current.slick-active .zwc-nc-item {
    transform: scale(1);
}

.zwc-feature {
    background: var(--secondary-color);
    padding-top: 0;
    padding-bottom: 0;
}

.zwc-feature .zwc-page-title {
    margin-left: 0;
    text-align: left;
}

.zwc-feature .zwc-page-title p {
    max-width: 600px;
}

.zwc-feature .zwc-notebook-ai img {
    border: 1px solid #d0dfe8;
    border-radius: 20px;
    box-shadow: 0 0 20px #e0edf6;
    margin: auto;
    max-width: 600px;
    width: 100%;
}

.zwc-feature-sticky {
    position: sticky;
    top: 65px;
    z-index: 2;
    background: var(--secondary-color);
}

.zwc-feature-sticky-wrapper {
    width: max-content;
    margin: auto;
    position: relative;
}

.zwc-feature-sticky ul {
    display: flex;
    justify-content: center;
}

.zwc-feature-sticky ul li {
    font-size: 16px;
    font-family: var(--zf-primary-medium);
    cursor: pointer;
    padding: 15px 6px;
    border-bottom: 1px solid rgba(0, 0, 0, 10%);
}

.zwc-feature-sticky ul li:first-child {
    padding-left: 0;
}

.zwc-feature-sticky ul li:last-child {
    padding-right: 0;
}

.zwc-feature-sticky li span {
    padding: 0 10px;
    position: relative;
}

.zwc-feature-sticky ul li:hover,
.zwc-feature-sticky ul li.active {
    color: var(--high-light);
}

.zwc-move-line {
    width: 100px;
    height: 2px;
    background: var(--high-light);
    position: absolute;
    left: 0;
    bottom: 0;
    transition: all 0.3s ease-in-out;
}

.zwc-feature .zwc-block-flex {
    padding-top: 140px;
}

.zwc-main-block-ctn .content-wrap:first-child .zwc-block-flex {
    padding-top: 120px;
}

.zwc-main-block-ctn .content-wrap:nth-child(2) .zwc-block-flex {
    padding-top: 120px;
}

.zwc-main-block-ctn .content-wrap:nth-child(3) .zwc-block-flex {
    padding-top: 110px;
}

.zwc-main-block-ctn .content-wrap:nth-child(6) .zwc-block-flex {
    padding-top: 130px;
}

.zwc-main-block-ctn .content-wrap:last-child .zwc-block-flex {
    padding-top: 40px;
}

.zwc-feature .zwc-block-flex h2 {
    font-size: 46px;
    font-family: var(--zf-primary-bold);
}

.zwc-feature .zwc-block-flex a {
    font-family: var(--zf-primary-semibold);
}

.zwc-feature .zwc-scanner-video {
    text-align: center;
}

.zwc-feature .zwc-scanner-video video {
    max-width: 450px;
    width: 100%;
}

.zwc-testimonial {
    background: var(--primary-color);
    color: #fff;
}

.zwc-testimonial h2 {
    max-width: 700px;
}

.testi-details {
    margin-bottom: 20px;
}

.zwc-testi-card {
    background: #1D2B3B;
    border-radius: 14px;
    margin: 10px;
    padding: 40px;
    min-height: 600px;
}
.zwc-testimonial a.zwc-watch-video {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
    margin-top: 11px
}
.zwc-testi-card p {
    font-size: 17px;
}
.zwc-customer:has(.zwc-customer-img) {
    display: flex;
    gap: 15px;
    margin-bottom: 15px;
}
.zwc-testi-card .zwc-customer-img{
    width: 50px;
    border-radius: 50%;
}
.zwc-desc {
    font-size: 14px;
}

.zwc-name {
    font-size: 22px;
    font-family: var(--zf-primary-bold);
    margin: 10px 0 0 0;
    display: block;
}

.testi-details img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: block;
}

/* --- Cta Section --- */
ul.alt-list {
    display: flex;
    justify-content: center;
    padding: 30px 0px;
}

ul.alt-list li a {
    padding: 7px 17px 8px 48px;
    border: 1px solid rgb(5, 168, 46);
    display: block;
    color: rgb(0, 0, 0);
    position: relative;
    margin: 0px 6px;
    border-radius: 5px;
}

.i18n-ar .zwc-cta-sec ul.alt-list li a {
    text-align: right;
}

ul.alt-list li a::before {
    content: "";
    position: absolute;
    background: url(/sites/zweb/images/notebook/home/znotebook-home-sprite.png) -201px -105px / 460px no-repeat;
    width: 22px;
    height: 30px;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
}

.zwc-cta-sec .zwc-page-title,
.zwc-cta-sec .zwc-page-title h2 {
    margin-bottom: 0;
}

ul.alt-list li.google-keep a::before {
    background-position: -223px -105px;
}

ul.alt-list li.google-onenote a::before {
    background-position: -244px -105px;
    width: 30px;
}

ul.alt-list li.notion a::before {
    background-position: -276px -105px;
    width: 25px;
}

.zwc-cta-sec {
    text-align: center;
}

.zwc-wb-notebook {
    padding-right: 60px;
}

.zwc-wb-ss-1 {
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    overflow: hidden;
    max-width: 90%;
}

.zwc-wb-ss-2 {
    position: absolute;
    right: 0;
    bottom: 15%;
    max-width: 30%;
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    overflow: hidden;
}

.zwc-clip-web {
    padding-bottom: 60px;
}

.zwc-clip-ss1 {
    max-width: 75%;
    border-radius: 10px;
    overflow: hidden;
}

.zwc-clip-ss2 {
    position: absolute;
    right: 0px;
    bottom: 0px;
    max-width: 50%;

}

.zwc-clip-ss2 img {
    border-radius: 8px;
    overflow: hidden;
    box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 15px;
    border: 1px dashed #ccc;
}

.browser-icon {
    display: inline-block;
    position: absolute;
    top: 50%;
    left: -20px;
    background: #fff;
    padding: 8px 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    border-radius: 50px;
    transform: translateY(-30%);
    transition: all .7s ease;
    opacity: 0;
}

.browser-icon span.icon {
    /* background: url(../images/common-elements.svg); */
    background: url(/sites/zweb/images/commonroot/common-elements.svg);
    background-size: 954px auto;
    background-position: -772px 0;
    width: 30px;
    height: 30px;
    display: block;
    position: relative;
    margin-bottom: 10px;
    opacity: 0;
    transform: scale(0.2);
    transition: all .7s ease;
}

.browser-icon span.icon:last-child {
    margin-bottom: 0;
}

span.icon.chrome {
    background-position: -772px 0;
    transition-delay: 2s;
}

span.icon.edge {
    background-position: -922px 0;
    transition-delay: 2.1s;
}

span.icon.safari {
    background-position: -832px 0;
    transition-delay: 2.2s;
}

span.icon.firefox {
    background-position: -802px 0;
    transition-delay: 2.3s;
}

span.icon {
    background: url(/sites/zweb/images/notebook/home/znotebook-home-sprite.png) no-repeat;
    background-position: 0 0;
    background-size: 600px auto;
    position: absolute;
    width: 70px;
    height: 60px;
}

span.icon.cutter {
    background-position: -568px -12px;
    width: 35px;
    height: 35px;
    right: -16px;
    top: 110px;
}

.zwc-clip-web svg {
    position: absolute;
    top: 10%;
    right: 3%;
    width: 120px;
    opacity: .2;
}

#path1,
#path2,
#path3 {
    stroke-dasharray: 900;
    stroke-dashoffset: 900;
    animation-duration: 3s;
    animation-fill-mode: forwards;
    animation-delay: 0.5s;
}

#path3 {
    animation-delay: 1.5s;
}

.typing-search {
    margin: 0 auto;
    max-width: 500px;
}

.box {
    box-shadow: 1px 11px 30px rgb(0 0 0 / 10%);
    padding: 20px 20px;
    border-radius: 10px;
    width: 70px;
    height: 70px;
    position: relative;
    margin: 0 auto;
    transition: all .7s ease;
    border: 1.5px solid #000;
}

.middle-animated .box {
    width: 100%;
}

span.text-type {
    opacity: 0;
    width: 0;
    overflow: hidden;
    border-right: .05em solid #464545;
    white-space: nowrap;
    display: inline-block;
    font-size: 18px;
    font-family: var(--secondaryfont-semibold);
}

.quote svg {
    width: 55px;
    filter: invert(1);
    opacity: 0.1;
}

.zwc-testi-inner {
    padding-top: 60px;
}

.zwc-testimonial .slick-prev {
    position: absolute;
    top: 0;
    right: 60px;
    left: inherit;
}

.zwc-testimonial .slick-next {
    position: absolute;
    top: 0;
    right: 0;
    left: inherit;
}

.zwc-testimonial .slick-next,
.zwc-testimonial .slick-prev {
    width: 50px;
    height: 50px;
    border: 1px solid #fff;
    border-radius: 50%;
    transition: all .1s ease-in-out;
}

.zwc-testimonial .slick-next:after,
.zwc-testimonial .slick-next:before,
.zwc-testimonial .slick-prev:after,
.zwc-testimonial .slick-prev:before {
    content: "";
    position: absolute;
}

.zwc-testimonial .slick-prev:before {
    background: transparent;
    width: 10px;
    height: 10px;
    border-left: 2px solid #fff;
    border-bottom: 2px solid #fff;
    transform: rotate(45deg) translateY(-50%);
    top: 49%;
    left: 12px;
}

.zwc-testimonial .slick-next:before {
    background: transparent;
    width: 10px;
    height: 10px;
    border-left: 2px solid #fff;
    border-bottom: 2px solid #fff;
    transform: rotate(45deg) translateY(-50%);
    top: 42%;
    right: 15px;
    transform: rotate(-130deg);
}

.zwc-testimonial .slick-prev:after,
.zwc-testimonial .slick-next:after {
    width: 17px;
    height: 2px;
    background: #fff;
    bottom: 46%;
    left: 50%;
    transform: translateX(-50%);
}

.zwc-testimonial .zwc-customer-name strong{
    display: block;
    font-size: 17px;
}
.zwc-testimonial .zwc-customer-name{
    font-size: 14px;
}

.zwc-customer:has(.zwc-customer-img) .zwc-customer-name{
    width: 70%;
}
.middle-animated span.text-type {
    animation: 1s typing 1s steps(10, end), blink-caret .5s step-end infinite;
    animation-fill-mode: forwards;
    opacity: 1;
}

@keyframes typing {
    0% {
        width: 0;
    }

    100% {
        width: max-content;
    }
}

@keyframes blink-caret {

    0%,
    100% {
        border-color: transparent;
    }

    50% {
        border-color: gray;
    }
}

.typing-search svg {
    width: 20px;
    overflow: visible;
    position: absolute;
    top: 26px;
    left: 21px;
    transition: all .7s ease;
    opacity: .5;
}

.middle-animated .typing-search svg {
    left: inherit;
    right: 25px;
}

.search-thumb {
    display: flex;
    justify-content: space-between;
    margin-top: 40px;
}

.search-thumb img {
    max-width: 120px;
    border-radius: 5px;
    transform: translateY(20px);
    transition: all .7s ease;
    opacity: 0;
}

.middle-animated .search-thumb img {
    transform: translateY(0);
    opacity: 1;
}

.middle-animated .search-thumb img:nth-child(1) {
    transition-delay: 2s;
}

.middle-animated .search-thumb img:nth-child(2) {
    transition-delay: 2.2s;
}

.middle-animated .search-thumb img:nth-child(3) {
    transition-delay: 2.3s;
}

.middle-animated .search-thumb img:nth-child(4) {
    transition-delay: 2.4s;
}

.zwc-organize {
    max-width: 50%;
}

.zwc-organize img {
    border-radius: 0 13px 13px 0;
}

.zwc-organize-main {
    padding-bottom: 60px;
}

.zwc-organize-ss2 {
    position: absolute;
    bottom: 0px;
    right: 50px;
    max-width: 50%;
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.11) 4px 13px 48px;
}

.zwc-organize-ss2 img {
    border-radius: 10px;
}

.zwc-move {
    position: absolute;
    bottom: 23%;
    left: -14%;
    max-width: 34%;
}

.zwc-organize-icon {
    width: 58px;
    height: 64px;
    display: block;
    position: absolute;
    background-image: url(/sites/zweb/images/notebook/home/zwc-organize-icon.png);
    background-size: 210px;
    background-repeat: no-repeat;
    transition: all 0.5s ease-in-out;
}

.zwc-add {
    background-position: 1px 0;
    left: -6%;
    top: -10%;
}

.zwc-notifi {
    background-position: -63px 0px;
    bottom: -5%;
    right: -8%;
}

.zwc-secure {
    /* border: 1.5px solid #000; */
    /* border-radius: 15px; */
    overflow: hidden;
    /* box-shadow: 0px 14px 16px #00000029; */
    max-width: 90%;

}

.middle-animated ul li .stars-container.stars-4-5:after {
    width: 90%;
}

.middle-animated ul li .stars-container.stars-4-4:after {
    width: 88%;
}

.zwc-notebook-business {
    position: relative;
}

.zwc-notebook-business .content-wrap {
    padding: 40px 61px;
    border-radius: 11px;
    width: 64%;
    margin: auto;
    box-shadow: 8px 16px 25px #0000002e;
    border: 1px solid rgba(101, 90, 244, 1);
    background: linear-gradient(129.04deg, #FFC5BA -69.21%, #AFA9FF 103.58%);
}

.zw-other-lang .zwc-notebook-business .content-wrap {
    width: 90%;
}

.zw-other-lang .zwc-notebook-business .content-wrap{
    padding: 35px 35px;
}


.zwc-notebook-business:before {
    position: absolute;
    content: "";
    background: #fff;
    height: 50%;
    width: 100%;
    top: 0;
}

.zwc-notebook-business:after {
    position: absolute;
    content: "";
    background: #edf8ff;
    height: 50%;
    width: 100%;
    bottom: 0;
    z-index: -1;
}

.zwc-notebook-business .zwc-business-content {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
}

.zwc-nb-main .zwc-notebook-business h2 {
    font-size: 30px;
    color: #000;
    width: 60%;
    margin-bottom: 0;
    font-family: var(--primaryfont-semibold);
}

.zwc-notebook-business a {
    align-items: center;
    color: #fff;
    background: #000;
    font-size: 15px;
    border-radius: 3px;
    font-family: var(--primaryfont-bold);
    padding: 13px 15px;
}
  .i18n-ar .zwc-banner-col-2::before { left: 100%; right: unset; }
  .i18n-ar .zwc-banner-col-2::before { left: -150px; right: -150px; }
  .i18n-ar .zwc-marker-main-1 { right: -23%; left: unset; }
  .i18n-ar .zwc-marker-main-2 { left: -25%; right: unset; }
  .i18n-ar .zwc-feature-icon { right: 0; left: unset; }
  .i18n-ar .zwc-bal-ele-rocket { left: 0; right: unset; }
  .i18n-ar .zwc-pro-launch { float: left; }
  .i18n-ar .zwc-bal-ele-calender { left: -27px; right: unset; }
  .i18n-ar .zwc-save-pic-2 { right: 0; left: unset; }
  .i18n-ar .zwc-bal-ele-thumb { left: -50px; right: unset; }
  .i18n-ar .zwc-audio .zwc-style-text { right: 40px; left: unset; }
  .i18n-ar .zwc-audio-track-run { left: 0; right: 0; }
  .i18n-ar .zwc-bal-ele-mic { right: 0; left: unset; }
  .i18n-ar .zwc-audio .zwc-style-text { right: 40px; left: unset; }
  .i18n-ar span.zwc-bnr-icon-1 { right: 10%; left: unset; }
  .i18n-ar span.zwc-bnr-icon-2 { right: 25%; left: unset; }
  .i18n-ar span.zwc-bnr-icon-3 { right: 17%; left: unset; }
  .i18n-ar span.zwc-bnr-icon-4 { right: 28%; left: unset; }
  .i18n-ar span.zwc-bnr-icon-5 { left: 28%; right: unset; }
  .i18n-ar span.zwc-bnr-icon-6 { left: 24%; right: unset; }
  .i18n-ar .zwc-rating-section h2 { padding-left: 160px; padding-right: 160px; }
  .i18n-ar .zwc-rating-section h2 span { right: 0; left: unset; }
  .i18n-ar .zwc-rating-section h2 span:before, .i18n-ar .zwc-rating-section h2 span:after { right: 0; left: unset; }
  .i18n-ar .zwc-rating-section h2 span:last-child { left: 0; right: auto; }
  .i18n-ar .stars-container:before { right: 0; left: unset; }
  .i18n-ar .stars-container:after { right: 0; left: unset; }
  .i18n-ar span.play-icon { transform: translate(50%, -50%) scale(1.3); right: 50%; left: unset; }
  .i18n-ar span.play-icon::before { right: -5px; left: unset; }
  .i18n-ar span.play-icon::after { transform: translate(40%, -40%); border-right: 12px solid #fff; border-left: unset; right: 50%; left: unset; }
  .i18n-ar a.btn-read { padding-left: 25px; padding-right: unset; }
  .i18n-ar a.btn-read:before { left: 0; right: unset; }
  .i18n-ar a.btn-read:after {border-left: 2px solid #3480ff;border-right: unset;left: 0;right: unset;transform: rotate(-45deg);}
  .i18n-ar a.btn-read:hover:before { left: -10px; right: unset; }
  .i18n-ar a.btn-read:hover:after { left: -10px; right: unset; }
  .i18n-ar .zwc-tab-sec .zwc-page-title p { margin: 15px auto 0 auto; }
  .i18n-ar .zwc-left-tab-nav li button { text-align: right; padding-right: 35px; padding-left: unset; }
  .i18n-ar .zwc-startAnimate .zwc-left-tab-nav li.active button::before { right: 0; left: unset; }
  .i18n-ar .zwc-path-icon { margin: 0 auto 15px auto; }
  .i18n-ar span.arrow {right: 0;left: unset;}
  .other-lang section.zwc-main-sec.zwc-testimonial {
    display: none;
}
  .i18n-ar .zwc-ctn-main a.btn-read:after {border-left: 2px solid #000;border-right: unset;}
  .i18n-ar .zwc-nc-title { margin: 15px 0 10px 0; }
  .i18n-ar .zwc-nc-nav li { padding: 7px 18px 7px 0; }
  .i18n-ar .zwc-nc-nav span { margin-left: 10px; margin-right: unset; }
  .i18n-ar .zwc-nc-nav .slick-track { transform: translate3d(0,0,0) !important; }
  .i18n-ar .zwc-nc-nav li::before { right: 0; left: unset; }
  .i18n-ar .zwc-feature .zwc-page-title { text-align: right; margin-right: 0; margin-left: unset; }
  .i18n-ar .zwc-feature-sticky ul li:first-child { padding-right: 0; padding-left: unset; }
  .i18n-ar .zwc-feature-sticky ul li:last-child { padding-left: 0; padding-right: unset; }
  .i18n-ar .zwc-name { margin: 10px 0 0 0; }
  .i18n-ar ul.alt-list li a { padding: 7px 48px 8px 17px; }
  .i18n-ar ul.alt-list li a::before { right: 14px; left: unset; }
  .i18n-ar .zwc-wb-notebook { padding-left: 60px; padding-right: unset; }
  .i18n-ar .zwc-wb-ss-2 { left: 0; right: unset; }
  .i18n-ar .zwc-clip-ss2 { left: 0; right: unset; }
  .i18n-ar .browser-icon { right: -20px; left: unset; }
  .i18n-ar span.icon.cutter { left: -16px; right: unset; }
  .i18n-ar .zwc-clip-web svg { left: 3%; right: unset; }
  .i18n-ar span.text-type { border-left: .05em solid #464545; border-right: unset; }
  .i18n-ar .zwc-testimonial .slick-prev { left: 60px; right: inherit; }
  .i18n-ar .zwc-testimonial .slick-next { left: 0; right: inherit; }
  .i18n-ar .zwc-testimonial .slick-prev:before { border-right: 2px solid #fff; border-left: unset; right: 12px; left: unset; }
  .i18n-ar .zwc-testimonial .slick-next:before { border-right: 2px solid #fff; border-left: unset; left: 15px; right: unset; }
  .i18n-ar .zwc-testimonial .slick-prev:after, .i18n-ar .zwc-testimonial .slick-next:after { transform: translateX(50%); right: 50%; left: unset; }
  .i18n-ar .typing-search svg { right: 21px; left: unset; }
  .i18n-ar .middle-animated .typing-search svg { left: 25px; right: inherit; }
  .i18n-ar .zwc-organize img { border-radius: 0 0 13px 13px; }
  .i18n-ar .zwc-organize-ss2 { left: 50px; right: unset; }
  .i18n-ar .zwc-move { right: -14%; left: unset; }
  .i18n-ar .zwc-add { right: -6%; left: unset; }
  .i18n-ar .zwc-notifi { left: -8%; right: unset; }
  .i18n-ar .zwc-banner-content, .i18n-ar .zwc-rating-section, .i18n-ar .counter-star, .i18n-ar .zwc-page-title, .i18n-ar .zwc-page-title, .i18n-ar .zwc-return-path .zwc-block-left, .i18n-ar .zwc-feature .zwc-scanner-video, .i18n-ar .zwc-cta-sec { text-align: center; }
  .i18n-ar .zwc-banner-content *, .i18n-ar .zwc-rating-section *, .i18n-ar .counter-star *, .i18n-ar .zwc-page-title *, .i18n-ar .zwc-page-title *, .i18n-ar .zwc-return-path .zwc-block-left *, .i18n-ar .zwc-feature .zwc-scanner-video *, .i18n-ar .zwc-cta-sec * { text-align: center; }

.i18n-ar .zwc-nc-left .slick-list.draggable {
    direction: rtl;
}
@media screen and (min-width: 767px) {

    .middle-animated path#path1,
    .middle-animated path#path2,
    .middle-animated path#path3 {
        animation-name: draw;
    }

    @keyframes draw {
        100% {
            stroke-dashoffset: 0;
        }
    }

    .middle-animated .zwc-style-text-pic {
        animation: .5s ease-out 3s forwards running slideDown;
    }

    .middle-animated .zwc-audio .zwc-style-text {
        animation: .5s ease-out 2s forwards running slideDown;
    }

    .middle-animated .browser-icon span.icon {
        opacity: 1;
        transform: scale(0.9);
    }

    .middle-animated .browser-icon {
        transform: translateY(-50%);
        opacity: 1;
        transition-delay: 1.9s;
    }

    .zwc-block-ss,
    .zwc-style-text,
    .zwc-audio-bar,
    .zwc-bal-ele-mic,
    .zwc-save-pic-main,
    .zwc-bal-ele-thumb,
    .zwc-share,
    .zwc-share-wrapper span,
    .zwc-bal-ele-rocket,
    .zwc-sticky-main,
    .zwc-bal-ele-calender,
    .zwc-banner-ele,
    .zwc-noteboard,
    .zwc-wb-ss-1,
    .zwc-wb-ss-2,
    .zwc-clip-ss1,
    .zwc-clip-ss2,
    .zwc-organize,
    .zwc-organize-ss2,
    .zwc-organize-icon,
    .zwc-secure,
    .zwc-notebook-ai {
        opacity: 0;
    }

    .middle-animated .zwc-notifi {
        opacity: 1;
        transition-delay: 0.8s;
    }

    .middle-animated .zwc-add {
        opacity: 1;
        transition-delay: 1.2s;
    }

    .middle-animated .zwc-secure {
        animation: .5s ease-out .3s forwards slideDown;
    }

    .middle-animated .zwc-organize {
        animation: .5s ease-out .3s forwards slideDown;
    }

    .middle-animated .zwc-clip-ss1 {
        animation: .5s ease-out .3s forwards slideDown;
    }

    .middle-animated .zwc-clip-ss2 {
        animation: .5s ease-out .6s forwards slideDown;
    }

    .middle-animated .zwc-organize-ss2 {
        animation: .5s ease-out .6s forwards slideDown;
    }

    .middle-animated .zwc-wb-ss-1 {
        animation: .5s ease-out .3s forwards slideDown;
    }

    .middle-animated .zwc-wb-ss-2 {
        animation: .5s ease-out .6s forwards slideDown;
    }

    .middle-animated .zwc-noteboard {
        animation: .7s ease-out .3s forwards slideDown;
    }

    .middle-animated .zwc-notebook-ai {
        animation: .7s ease-out .3s forwards slideDown;
    }

    .middle-animated .zwc-block-ss {
        animation: .7s ease-out .3s forwards slideDown;
    }

    .middle-animated .zwc-banner-col-2::before {
        right: -150px;
    }

    .zwc-banner-main-img {
        opacity: 0;
        transform: scale(0.8) translateY(50px);
        transition: all .5s ease;
        transform-origin: bottom;
    }

    .middle-animated .zwc-banner-main-img {
        transform: none;
        opacity: 1;
        transition-delay: .8s;
    }

    .middle-animated .zwc-feature-icon {
        opacity: 1;
        transform: translateY(0);
    }

    .zwc-feature-icon {
        transition: all .3s ease-in-out;
        transition-delay: 2s;
        transform: translateY(10px);
        opacity: 0;
    }

    .zwc-marker-1,
    .zwc-marker-2,
    .zwc-marker-3,
    .zwc-marker-4 {
        opacity: 0;
        transform: translateY(20px);
        transition: all .3s ease-in-out;
    }

    .middle-animated .zwc-feature-icon {
        opacity: 1;
        transform: translateY(0);
    }

    .middle-animated .zwc-marker-1 {
        opacity: 1;
        transform: translateY(0);
        transition-delay: 1.2s;
    }

    .middle-animated .zwc-marker-2 {
        opacity: 1;
        transform: translateY(0);
        transition-delay: 1.5s;
    }

    .middle-animated .zwc-marker-3 {
        opacity: 1;
        transform: translateY(0);
        transition-delay: 1.8s;
    }

    .middle-animated .zwc-marker-4 {
        opacity: 1;
        transform: translateY(0);
        transition-delay: 2.1s;
    }

    .middle-animated .zwc-share {
        animation: .5s ease-out 4.3s forwards running slideDown;
    }

    .middle-animated .zwc-share .zwc-style-text {
        opacity: 1;
    }

    .zwc-save-pic-main,
    .zwc-share-wrapper span,
    .zwc-banner-ele {
        transition: all .5s ease-in-out;
    }

    .middle-animated .zwc-profile-1 {
        opacity: 1;
        transition-delay: 4.5s;
    }

    .middle-animated .zwc-profile-2 {
        opacity: 1;
        transition-delay: 4.7s;
    }

    .middle-animated .zwc-profile-3 {
        opacity: 1;
        transition-delay: 4.9s;
    }

    .middle-animated .zwc-profile-4 {
        opacity: 1;
        transition-delay: 5.1s;
    }

    .middle-animated .zwc-profile-5 {
        opacity: 1;
        transition-delay: 5.3s;
    }

    .middle-animated .zwc-bal-ele-rocket {
        animation: .5s ease-out 5.2s forwards running scaling;
    }

    .middle-animated .zwc-sticky-main {
        opacity: 1;
        transition-delay: 6s;
    }

    .middle-animated .zwc-pro-launch-sticky {
        transition: all .3s ease-in-out;
        transition-delay: 6s;
        transform: rotate(5deg);
        opacity: 1;
    }

    .middle-animated .zwc-sticky-bg {
        transition: all .3s ease-in-out;
        transition-delay: 6.2s;
        transform: rotate(-3deg);
    }

    .middle-animated .zwc-bal-ele-calender {
        animation: .5s ease-out 7s forwards running scaling;
    }

    .middle-animated .zwc-save-pic-main {
        opacity: 1;
        transition-delay: 3.5s;
    }

    .middle-animated .zwc-save-pic-1 {
        transition: all .3s ease-in-out;
        transition-delay: 3.8s;
        transform: rotate(-8deg);
    }

    .middle-animated .zwc-save-pic-2 {
        transition: all .3s ease-in-out;
        transition-delay: 3.8s;
        transform: rotate(8deg);
    }

    .middle-animated .zwc-style-text-pic {
        animation: .5s ease-out 3s forwards running slideDown;
    }

    .middle-animated .zwc-bal-ele-thumb {
        animation: .5s ease-out 4s forwards running scaling;
    }

    .middle-animated .zwc-audio-bar {
        animation: .5s ease-out 2.5s forwards running slideDown;
    }

    .zwc-audio-bar,
    .zwc-bal-ele-mic {
        opacity: 0;
    }

    .middle-animated .zwc-bal-ele-mic {
        animation: .5s ease-out 3s forwards running scaling;
    }

    .middle-animated .zwc-banner-ele {
        opacity: 1;
        transition-delay: 6s;
    }

    @keyframes slideDown {
        0% {
            visibility: hidden;
            opacity: 0;
            transform: translateY(30px);
        }

        100% {
            visibility: visible;
            opacity: 1;
            transform: translateY(0);
        }
    }

    @keyframes scaling {
        0% {
            opacity: 0;
            transform: scale(0.8);
        }

        100% {
            opacity: 1;
            transform: scale(1);
        }
    }

    @keyframes audioTracking {
        0% {
            width: 0;
        }

        50% {
            width: 187px;
        }

        75% {
            width: 187px;
        }

        100% {
            right: 100%;
            width: 0;
            opacity: 0;
        }
    }
}

@media only screen and (max-width:1440px) {
   .zwc-nb-main  .zwc-notebook-business h2 {
        font-size: 26px;
    }
    .zw-other-lang .zwc-feature-sticky ul li {
       padding: 15px 0;
    }
   .zw-other-lang .zwc-feature-sticky li span {
      padding: 0 5px;
   }
}

@media screen and (max-width: 1280px) {
    .zwc-feature-sticky ul li {
        font-size: 15px;
    }

    .zwc-notebook-business .content-wrap {
        width: 81%;
    }
.i18n-vi .product-header-top .menu li a{
     font-size: 14px;
}
.i18n-es-xl .zwc-nc-left {
    max-width: 16%;
}
.i18n-es-xl .zwc-nc-right {
    max-width: 84%;
}
}

@media screen and (max-width: 1199px) {
    .zwc-nb-main h1 {
        font-size: 54px;
    }

    .zwc-nb-main h2 ,.zw-other-lang .zwc-nb-main h2{
        font-size: 34px;
    }

    .zwc-feature-sticky {
        top: 0;
    }

    .zwc-feature-sticky ul li {
        font-size: 13px;
    }

    .zwc-testi-card {
        min-height: 679px;
    }

    .zwc-banner-col-2 .zwc-banner-main {
        margin-top: 7rem;
    }

    span.zwc-bnr-icon-1 {
        bottom: 3%;
    }

    .zwc-nc-left {
        max-width: 19%;
    }

    .zwc-nc-right {
        max-width: 79%;
    }

    .zwc-nc-item p {
        font-size: 16px;
    }

    .zwc-nc-title {
        font-size: 21px;
    }
   .zw-other-lang .zwc-nc-title {
        font-size: 22px;
   }

    .zwc-nc-item {
        justify-content: center;
    }

    .zwc-note-card {
        align-items: center;
    }

    .zwc-feature .zwc-block-flex h2 {
        font-size: 26px;
    }

    .zwc-notebook-business .content-wrap {
        padding: 33px 32px;
    }

  .i18n-ar .zwc-notebook-business .content-wrap { padding: 33px 32px; }
    .zwc-notebook-business .zwc-business-content {
        justify-content: center;
       flex-direction: column;
    }
    .zwc-nb-main .zwc-notebook-business h2 {
        text-align: center;
        margin-bottom: 20px;
        width: 100%;
        max-width: 420px;
        font-size: 26px;
    }
  .zw-other-lang .zwc-notebook-business .content-wrap {
      width: 65%;
  }
.zw-other-lang .zwc-nc-item p {
    min-height: 130px;
}
}

@media screen and (max-width: 1024px) {
    .zwc-nc-nav {
        display: none;
    }

    .zwc-main-block-ctn .content-wrap:first-child .zwc-block-flex {
        padding-top: 0;
    }

    zwc-nc-left {
        max-width: 0;
    }

    .zwc-nc-right {
        max-width: 100%;
    }

    .zwc-feature-sticky ul {
        display: none;
    }

    zwc-feature .zwc-block-flex h2 {
        font-size: 37px;
    }

    .zwc-move-line {
        display: none;
    }

    .item.slick-slide.slick-current.slick-active .zwc-nc-item {
        transform: scale(0.95);
    }
.zw-other-lang .zwc-note-card {
    gap: 0;
}
}

@media screen and (max-width: 991px) {
    span.zwc-bnr-icon-1 {
        bottom: 16%;
    }
    .search-thumb img {
        max-width: 95px;
    }

    .zwc-feature-sticky ul li {
        font-size: 11px;
        padding: 5px;
    }

    .zwc-feature-sticky ul {
        justify-content: center;
    }

    .zwc-feature-sticky {
        top: 0px;
    }

    .search-thumb img {
        max-width: 78px;
    }

    .zwc-testi-card {
        min-height: 656px;
    }

    .zwc-nb-main h1 {
        font-size: 49px;
    }

    .zwc-nb-main h2 ,.zw-other-lang .zwc-nb-main h2{
        font-size: 32px;
    }

    .zwc-nc-right {
        max-width: 100%;
    }

    .zwc-nc-left {
        max-width: 30%;
    }

    .zwc-rating-section ul {
        justify-content: space-around;
        flex-wrap: wrap;
        max-width: 441px;
    }

    .zwc-nc-item p {
        min-height: 108px;
    }

    .zwc-feature .zwc-block-flex h2 {
        font-size: 27px;
    }

    .zwc-pro-launch-sticky p {
        font-size: 11px;
    }

    .zwc-pro-launch-sticky span {
        font-size: 15px;
    }

    .zwc-pro-launch {
        max-width: 185px;
        margin-top: 15px;
    }

    span.zwc-bnr-icon-6 {
        right: 15%;
    }

    .zwc-marker-main-1 {
        left: -39%;
    }

    .zwc-marker-main-2 {
        right: -40%;
    }

    .zwc-save-pic {
        transform: scale(0.95);
    }

    .zwc-share {
        top: -1rem;
        right: 20px;
    }

    .zwc-audio {
        margin-top: 105px;
    }

    .zwc-audio {
        top: -2rem;
    }

    .zwc-banner-col-2 .zwc-banner-main {
        margin-top: 1rem;
    }

    .zwc-feature-icon {
        max-width: 32.5px;
        top: 26%;
    }

    .zwc-rating-section ul li {
        margin: 26px 20px 0;
        margin-bottom: 0;
    }

    .zwc-audio-bar {
        padding: 0 12px;
    }

    .zwc-audio,
    .zwc-sticky-main {
        display: none;
    }

    .zwc-banner-col-2 {
        max-width: 87%;
    }

    .zwc-banner-col-1,
    .zwc-banner-col-3 {
        width: 84%;
    }

    .zwc-new-banner-flx {
        overflow: hidden;
    }

    .zwc-main-sec {
        padding: 4em 0;
    }

    .zwc-feature .zwc-block-flex {
        padding-top: 110px;
    }

    .zwc-ctn-main .content-wrap::before {
        border-radius: 34px;
        inset: 0;
    }

    .zwc-feature .zwc-page-title {
        text-align: center;
        margin: auto;
    }

    .zwc-feature .zwc-page-title p {
        max-width: 600px;
        margin: auto;
    }

    .zwc-testimonial h2 {
        max-width: 390px;
    }

    .zwc-block-flex {
        flex-direction: column-reverse
    }

    .zwc-block-flex.zwc-order-change {
        flex-direction: column
    }

    .zwc-imagination-sec .zwc-block-left {
        max-width: 460px;
    }

    .zwc-block-left {
        max-width: 430px;
    }

    .zwc-block-right {
        max-width: 550px;
        margin-bottom: 52px;
        text-align: center;
    }

    .zwc-main-block-ctn .content-wrap:last-child .zwc-block-flex {
        padding-top: 100px;
    }

    .zwc-ctn-main {
        padding-bottom: 0;
    }
    .zwc-notebook-business a {
        font-size: 12px;
    }
  .i18n-ar .zwc-feature-sticky ul li { padding: 5px; }
  .i18n-ar span.zwc-bnr-icon-6 { left: 15%; right: unset; }
  .i18n-ar .zwc-marker-main-1 { right: -39%; left: unset; }
  .i18n-ar .zwc-marker-main-2 { left: -40%; right: unset; }
  .i18n-ar .zwc-share { left: 20px; right: unset; }
  .i18n-ar .zwc-rating-section ul li { margin: 26px 20px 0; }
  .i18n-ar .zwc-audio-bar { padding: 0 12px; }
  .i18n-ar .zwc-main-sec { padding: 4em 0; }
  .i18n-ar .zwc-feature .zwc-page-title { margin: auto; }
  .i18n-ar .zwc-feature .zwc-page-title p { margin: auto; }
  .i18n-ar .zwc-feature .zwc-page-title, .i18n-ar .zwc-block-right { text-align: center; }
  .i18n-ar .zwc-feature .zwc-page-title *, .i18n-ar .zwc-block-right * { text-align: center; }
  .zw-other-lang .zwc-notebook-business .content-wrap {
     width: 85%;
  }
    .zw-other-lang .zwc-nc-item p {
        min-height: 110px;
   }
}

@media screen and (max-width: 767px) {
    .zwc-nb-main h2 ,.zw-other-lang .zwc-nb-main h2{
        font-size: 29px;
        text-align: center;
        padding: 0;
    }
    .zwc-nb-main .zwc-notebook-business h2 {
        font-size: 26px;
  }
    .zwc-block-flex p:last-child {
        text-align: center;
        width: 81%;
        margin: auto;
    }

    .zwc-main-sec {
        padding: 4em 0;
    }

    .zwc-feature .zwc-page-title h2,
    .zwc-feature .zwc-page-title p {
        margin-bottom: 20px;
    }

    .zwc-imagination-sec h2 {
        text-align: center;
    }

    .zwc-block-right .zwc-feature .zwc-block-flex h2 .zwc-acc-ctn img {
        display: block;
        width: 59%;
        margin: 30px auto 10px;
    }

    .zwc-left-tab-image {
        display: none;
    }

    .zwc-nc-item p {
        min-height: 100%;
    }

    .zwc-banner-col-1,
    .zwc-banner-col-3 {
        display: none;
    }

    .zwc-banner-col-2 {
        max-width: 81%;
        padding: 0 65px;
        margin: auto;
    }

    .zwc-banner-ele {
        display: none;
    }

    .zwc-rating-section ul li {
        margin: 0 20px;
        margin-bottom: 26px;
    }

    .zwc-left-tab-flex {
        flex-direction: column;
        gap: 0;
    }

    .zwc-page-title {
        margin: 0 auto 34px;
    }

    .zwc-left-tab-nav {
        max-width: 100%;
    }

    .zwc-left-tab-ctn {
        max-width: 80%;
    }

    .zwc-note-card {
        flex-direction: column;
    }

    .zwc-nc-left {
        display: none;
    }

    .zwc-nc-right {
        max-width: 100%;
    }

    .zwc-feature-sticky {
        display: none;
    }

    .zwc-nc-nav li {
        margin-bottom: 16px;
        font-size: 19px;
    }

    .zwc-block-flex {
        flex-direction: column-reverse;
    }

    .zwc-block-flex.zwc-order-change {
        flex-direction: column;
    }

    .zwc-feature .zwc-page-title h2,
    .zwc-feature .zwc-page-title p {
        text-align: center;
    }

    ul.alt-list {
        flex-direction: column;
        width: 60%;
        margin: auto;
        text-align: left;
    }

    ul.alt-list li {
        margin: auto;
        margin-bottom: 12px;
        max-width: 220px;
        width: 100%;
    }

    span.zwc-marker-2 {
        display: none;
    }

    .zwc-feature-icon {
        max-width: 32px;
        top: -23px;
        left: 16px;
        right: 0;
    }

    .zwc-nb-main h2 {
        padding-left: 10px;
        padding-right: 10px;
    }

    .zwc-rating-section h2 span {
        display: none;
    }

    .zwc-ctn-main .content-wrap {
        padding: 60px 18px 0;
    }

    .zwc-banner-col-2::before {
        left: -93px;
        width: 865px;
        overflow: hidden;
    }

    .zwc-marker-main-2 {
        right: 0;
    }

    .zwc-main-banner {
        overflow: hidden;
    }

    .zwc-imagination-sec h2 {
        padding: 0;
    }

    .zwc-feature .zwc-block-flex h2 {
        padding-left: 0;
        font-size: 24px;
    }

    .zwc-ctn-main {
        overflow: hidden;
    }

    .search-thumb img {
        max-width: 65px;
    }

    .zwc-secure {
        max-width: 100%;
    }

    .zwc-rating-main-sec {
        padding: 4em 0 2em;
    }

    .zwc-imagination-sec {
        padding: 3.5em 0 4em;
    }

    .zwc-note-taker {
        padding: 4em 0 3.5em;
    }

    .zwc-ctn-main .content-wrap::before {
        border-radius: 0;
        inset: -57px;
    }

    .slick-dotted.slick-slider {
        margin-bottom: 53px;
    }

    .zwc-ctn-main {
        margin-top: 0;
        padding: 0;
    }

    .zwc-feature {
        padding: 64px 0 0;
    }

    .zwc-banner-content {
        padding: 45px 0 0;
    }

    .zwc-nb-main h1 {
        font-size: 37px;
        font-weight: bold;
    }

    .zwc-banner-wrapper p {
        max-width: 468px;
    }

    .zwc-acc-ctn img {
        display: block;
        width: 59%;
        margin: 32px auto 10px;
    }

    p {
        line-height: 1.4;
    }

    .zwc-testimonial h2 {
        max-width: 470px;
        margin: auto;
        margin-bottom: 60px;
    }

    .zwc-main-block-ctn .content-wrap:nth-child(2) .zwc-block-flex,
    .zwc-main-block-ctn .content-wrap:nth-child(3) .zwc-block-flex,
    .zwc-main-block-ctn .content-wrap:nth-child(4) .zwc-block-flex,
    .zwc-main-block-ctn .content-wrap:nth-child(5) .zwc-block-flex,
    .zwc-main-block-ctn .content-wrap:nth-child(6) .zwc-block-flex,
    .zwc-main-block-ctn .content-wrap:nth-child(7) .zwc-block-flex,
    .zwc-main-block-ctn .content-wrap:nth-child(8) .zwc-block-flex,
    .zwc-main-block-ctn .content-wrap:nth-child(9) .zwc-block-flex {
        padding-top: 80px;
    }

    .zwc-notebook-business .content-wrap {
        padding: 33px 15px;
    }

    .zwc-notebook-business a {
        width: auto;
        display: block;
    }

  .i18n-ar .zwc-nb-main h2 { text-align: center; }
  .i18n-ar .zwc-block-flex p:last-child { text-align: center; margin: auto; }
  .i18n-ar .zwc-main-sec { padding: 4em 0; }
  .i18n-ar .zwc-imagination-sec h2 { text-align: center; }
  .i18n-ar .zwc-block-right .zwc-feature .zwc-block-flex h2 .zwc-acc-ctn img { margin: 30px auto 10px; }
  .i18n-ar .zwc-banner-col-2 { padding: 0 65px; margin: auto; }
  .i18n-ar .zwc-page-title { margin: 0 auto 34px; }
  .i18n-ar .zwc-feature .zwc-page-title h2, .i18n-ar .zwc-feature .zwc-page-title p { text-align: center; }
  .i18n-ar ul.alt-list { margin: auto; text-align: right; }
  .i18n-ar .zwc-feature-icon { left: 0; right: 16px; }
  .i18n-ar .zwc-nb-main h2 { padding-left: 10px; padding-right: 10px; }
  .i18n-ar .zwc-ctn-main .content-wrap { padding: 60px 18px 0; }
  .i18n-ar .zwc-banner-col-2::before { right: -93px; left: unset; }
  .i18n-ar .zwc-marker-main-2 { left: 0; right: unset; }
  .i18n-ar .zwc-imagination-sec h2 { padding: 0; }
  .i18n-ar .zwc-feature .zwc-block-flex h2 { padding-right: 0; padding-left: unset; }
  .i18n-ar .zwc-rating-main-sec { padding: 4em 0 2em; }
  .i18n-ar .zwc-imagination-sec { padding: 3.5em 0 4em; }
  .i18n-ar .zwc-note-taker { padding: 4em 0 3.5em; }
  .i18n-ar .zwc-ctn-main { padding: 0; }
  .i18n-ar .zwc-feature { padding: 64px 0 0; }
  .i18n-ar .zwc-banner-content { padding: 45px 0 0; }
  .i18n-ar .zwc-acc-ctn img { margin: 32px auto 10px; }
  .i18n-ar .zwc-testimonial h2 { margin: auto; }
  .i18n-ar .zwc-notebook-business .content-wrap { padding: 33px 15px; }
  .i18n-ar .zwc-nb-main .zwc-notebook-business h2 { text-align: center; }
    .zwc-testi-card,.zwc-testi-card p {
        min-height: 100%;
    }
    .zwc-left-tab-nav li.active button::before {
        animation: none;
        width: 100%;
     }
}

@media (max-width: 480px) {
    .zwc-banner-col-2 {
        max-width: 100%;
    }

    .zwc-feature-icon {
        max-width: 7%;
        top: 0px;
        left: 32px;
    }

    .zwc-marker-main-1,
    .zwc-marker-main-2 {
        gap: 4px;
    }

    .zwc-rating-content.zwc-badge img.zwc-batch-two {
        margin: 0 auto;
    }

    .zwc-rating-section ul {
        max-width: 260px;
    }
  .i18n-ar .zwc-feature-icon { right: 32px; left: unset; }
  .i18n-ar .zwc-rating-content.zwc-badge img.zwc-batch-two { margin: 0 auto; }
}
.i18n-ja .zwc-nc-nav li {font-size: 16px;}