.zwc-center-min-title,
.zwc-forms-main h2,
.zwc-forms-main h3,
.zwc-forms-main h4 {
    font-family: var(--zf-primary-bold);
}
.zwc-cta-content,
.zwc-list-three-col,
.zwc-page-title {
    text-align: center;
}
:root {
    --banner-bg: #1c222d;
    --primary-color: #10b75b;
    --highlight-text: #4276fb;
    --zof-sprit: url(/sites/zweb/images/forms/nonprofit/zof-sprite.svg);
}
h1 {
    font: 64px/1.1 var(--zf-primary-bold);
    margin-bottom: 15px;
    letter-spacing: -0.5px;
}
.zwc-content-sec-1 .zwc-page-title,
.zwc-content-sec-3 .zwc-center-content p:last-child,
.zwc-page-title,
p {
    margin-bottom: 0;
}
.zw-product-header,
.zwc-banner {
    background: var(--banner-bg);
    position: relative;
}
.zwc-page-title p a.zwc-highlight-link {
    color: var(--highlight-text);
    font-family: var(--primaryfont-semibold);
}
.zw-product-header::before,
.zwc-banner::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background-image: radial-gradient(#d9d9d9 1.5px, transparent 0);
    background-size: 40px 40px;
    background-position: 0 0;
    opacity: 0.1;
}
.zwc-forms-main h2 {
    font-size: 50px;
    line-height: 1.1;
    margin-bottom: 25px;
    letter-spacing: -0.4px;
}
.zwc-forms-main h3 {
    font-size: 34px;
    line-height: 1.2;
    margin-bottom: 25px;
}
.zwc-banner-ctn h1 span,
.zwc-forms-main h3 span {
    color: var(--primary-color);
}
.zwc-forms-main h4 {
    font-size: 26px;
    line-height: 1.3;
    margin-bottom: 15px;
}
.zwc-flx {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
}
section {
    padding: 130px 0;
}
img {
    display: block;
}
a {
    display: inline-block;
}
.zwc-bg-line span,
.zwc-pos-abs {
    position: absolute;
}
.zwc-banner,
.zwc-box-sec-main .zwc-col-left,
.zwc-content-sec-3 .zwc-col-left,
.zwc-ctn-list li {
    position: relative;
}
.zwc-banner .content-wrap {
    position: relative;
    z-index: 2;
}
.zwc-col-left,
.zwc-col-right {
    width: 100%;
    max-width: 50%;
    position: relative;
}
.zwc-col-left-40 {
    width: 100%;
    max-width: 40%;
}
.zwc-col-right-60 {
    width: 100%;
    max-width: 60%;
}
.zwc-padding-0 {
    padding: 0;
}
.zwc-max-80 {
    max-width: 80%;
    margin: 0 auto;
}
.zwc-max-70 {
    max-width: 70%;
    margin: 0 auto;
}
.zwc-banner-ctn {
    margin: auto;
    color: #fff;
}
.zwc-banner-ctn p {
    font-size: 18px;
    max-width: 80%;
}
.zwc-banner-ele-1 {
    width: 40px;
    height: 40px;
    background: #fff;
    border-radius: 50%;
    top: 1%;
    left: 20%;
    
}

.zwc-banner-ele-1::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 40px;
    height: 40px;
    display: block;
    background: var(--zof-sprit) no-repeat -192px -39px/230px;
   
}

.zwc-banner-ele-2 {
    width: 100px;
    height: 73px;
    background: var(--zof-sprit) no-repeat 0 0/200px;
    border-radius: 10px;
    bottom: 22%;
    left: -5%;
    display: block;
   

}
.cta-btn {
    padding: 13px 30px;
    border-radius: 3px;
    margin: 30px 0 0;
}
.zwc-banner .zwc-banner-image {
    position: relative;
    display: flex;
    justify-content: flex-end;
    padding-top: 90px;
}
.zwc-banner-image img {
    border-radius: 8px;
    width: 100%;
}
.zwc-main-banner {
    border-radius: 10px;
    width: 100%;
    max-width: 50%;
    position: relative;
    z-index: 2;
}
.zwc-banner-bg-img {
    max-width: 80%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}
.zwc-banner-bg img,
.zwc-col-left img {
    width: 100%;
}
.zwc-page-title {
    margin-bottom: 30px;
}
.zwc-page-title h2 {
    margin: 0 auto 20px;
}
.zwc-page-title p {
    max-width: 780px;
    margin: 0 auto;
}
.zwc-center-min-title {
    font-size: 20px;
    padding-bottom: 10px;
    line-height: 1.4;
}
.zwc-center-content {
    max-width: 640px;
    margin: auto;
}
.zwc-center-content h3 {
    margin-bottom: 20px;
}
.zwc-content-sec-1 .zwc-page-title h2 {
    max-width: 100%;
}
.zwc-cirlce-ele {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
}
.zwc-col-title {
    font: 22px var(--zf-primary-semibold);
}
.zwc-content-sec-3 .zwc-center-content {
    text-align: center;
    max-width: 900px;
}
.zwc-col-left h3 span {
    color: var(--highlight-text);
}
.zwc-ctn-list span {
    font: 20px var(--zf-primary-semibold);
    display: block;
    font-size: 20px;
}
.zwc-col-wrapper {
    gap: 60px;
    flex-wrap: nowrap;
    align-items: center;
    margin: 0 auto;
}
.zwc-reverse-col {
    flex-direction: row-reverse;
}
.zwc-content-sec-3 .zwc-page-title {
    /* padding-bottom: 60px; */
}
.zwc-donate-forms{
    max-width: 60%;
    padding-top: 40px;
}
.zwc-payment-logo{
    position: relative;
    max-width: 100%;
}
.zwc-payment-logo ul li span.stripe img {
    filter: brightness(0) invert(1);
    max-width: 65%;
}
.zwc-payment-main span.checkout{
    padding: 10px;
}
.zwc-payment-logo span.checkout img {
    max-width: 90%;
}
.zwc-payment-logo ul li span.stripe {
    background: #6772E5;
    padding: 15px 18px;
    max-width: 80%;
}
.zwc-payment-logo ul li span.squre{
    background: #000000;
    max-width: 80%;
    top: -20px;
    position: relative;
}
.zwc-payment-logo ul li span.squre img{
    filter: brightness(0) invert(1);
}
.zwc-payment-logo ul li span.paypal{
    box-shadow: -3px 2px 2px 0px rgba(0, 0, 0, 0.15);
}
.zwc-payment-logo ul li span.instmojo {
    background: #2b3077;
    max-width: 85%;
}
.zwc-payment-logo ul li span.paytm{
    background: #102851;
    max-width: 75%;
    padding: 10px;
}
.zwc-payment-logo ul li span.paytm img{
    max-width: 70%;
}
.zwc-payment-logo ul li span.paytab{
    max-width: 85%;
    padding: 10px;
}
.zwc-donate-form-field {
    right: 0;
    bottom: 0;
    max-width: 55%;
}
.zwc-doante-ele {
    top: 0;
    right: 10%;
    max-width: 30%;
}
.zwc-ctn-box-sec {
    background: var(--banner-bg);
    border-radius: 50px;
    overflow: hidden;
}
.zwc-box-sec-main .zwc-col-right {
    padding: 0 80px;
    color: #fff;
}
.zwc-box-sec-main .zwc-col-left img {
    object-fit: cover;
    width: 100%;
}
.zwc-zof-icon {
    background: var(--zof-sprite) no-repeat 0 0/200px;
    display: block;
}
.zwc-box-sec-main .zwc-zof-icon {
    width: 60px;
    height: 60px;
    margin-bottom: 30px;
    background: #cfe44a;
    border-radius: 50%;
    position: relative;
}
.zwc-box-sec-main .zwc-zof-icon::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    height: 40px;
    display: block;
    background-repeat: no-repeat;
    background-image: var(--zof-sprit);
    transform: translate(-50%, -50%);
}
.zwc-zof-icon-1::before {
    background-position: -117px 5px;
    width: 30px;
}
.zwc-zof-icon-2::before {
    background-position: -147px 5px;
    width: 40px;
}
.zwc-chat-note {
    top: 50%;
    right: 10%;
    width: 91px;
    height: 100px;
    background: url(/sites/zweb/images/forms/nonprofit/chat-note.svg) 0 0/89px no-repeat;
    transform: translateY(-50%);
}
.zwc-chat-msg {
    background: url(/sites/zweb/images/forms/nonprofit/chat-msg.svg) 0 0/89px no-repeat;
    right: inherit;
    left: 9%;
}
.zwc-payment-main-pattern {
    position: absolute;
    max-width: 88%;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: -20px;
}
.zwc-payment-logo ul {
    position: relative;
    top: 60px;
}
.zwc-payment-logo ul li {
    flex-basis: 30%;
    padding: 0 0 10px;
    position: relative;
    top: -80px;
}
.zwc-payment-main span {
    display: block;
    padding: 17px;
    background-color: #fff;
    border-radius: 7px;
    box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.1);
    background-repeat: no-repeat;
    margin: 0 auto;
}
.zwc-payment-logo ul li span > img {
    max-width: 80%;
    margin: 0 auto;
    display: block;
}
.zwc-payment-logo ul li span.paytab img {
    width: 70%;
}
.zwc-payment-logo ul li:nth-child(2),
.zwc-payment-logo ul li:nth-child(5),
.zwc-payment-logo ul li:nth-child(8) {
    margin-top: 80px;
}
.zwc-volunteer-forms {
    max-width: 70%;
    float: right;
    position: relative;
    z-index: 2;
    padding-bottom: 100px;
}
.zwc-volunteer-forms img {
    border-radius: 20px;
}
.zwc-volunteer-ss {
    left: 0;
    bottom: 0;
    max-width: 40%;
    width: 100%;
}
.zwc-volunteer-forms .zwc-outline-circle {
    top: 13%;
    border: 0;
    background-color: #d9d9d9b2;
}
.zwc-volunteer-forms .zwc-outline-circle-2 {
    bottom: 10%;
    right: -5%;
    left: inherit;
    height: 120px;
    width: 120px;
    top: inherit;
    border: 0;
    background-color: #d9d9d9b2;
}
.zwc-balance-ele span {
    display: block;
    z-index: -1;
}
.zwc-outline-circle {
    width: 70px;
    height: 70px;
    top: 30%;
    left: -6%;
    border-radius: 50%;
    background: #fff;
    border: 5px solid rgba(6, 154, 73, 0.5);
}
.zwc-line {
    width: 80px;
    height: 75px;
    bottom: -2%;
    right: 20%;
    background: var(--forms-sprite) no-repeat -389px 0/470px;
}
.zwc-content-sec-8 {
    padding-top: 0;
}
.zwc-cta-content {
    max-width: 900px;
    margin: 0 auto;
}
.zwc-cta-content h2 {
    font-size: 50px;
}
.zwc-auto-notification {
    width: 85%;
    display: block;
    margin: auto;
}
.zwc-cta-section a.cta-btn {
    margin-top: 0;
}
.zwc-list-points {
    margin: 0 auto;
}
.zwc-list-points li {
    padding: 20px 0 25px 40px;
    position: relative;
    font: 17px/1.6 var(--zf-primary-regular);
}
.zwc-list-points li a {
    text-decoration: underline;
    color: #000;
}
.zwc-list-points li::before {
    content: "";
    position: absolute;
    left: 0;
    width: 25px;
    height: 25px;
    background: var(--zof-sprit) no-repeat -105px -39px/200px;
    border-radius: 50%;
    top: 21px;
}
.zwc-bg-ctn-2 .zwc-list-points li::before {
    background-position: -138px -39px;
}
.zwc-content-sec-8 .zwc-page-title h2,
.zwc-content-sec-8 .zwc-page-title h4,
.zwc-content-sec-8 .zwc-page-title p {
    max-width: 100%;
    text-align: left;
}
.zwc-content-sec-8 .zwc-bg-content-sec {
    max-width: 85%;
    padding: 120px;
    background: var(--banner-bg);
    color: #fff;
    border-radius: 30px 30px 0 0;
    margin: 0 auto;
}
.zwc-content-sec-8 .zwc-bg-ctn-2 {
    background: #000;
    border-radius: 0 0 30px 30px;
    padding-top: 80px;
}
.zwc-svg-animate {
    position: absolute;
    right: -25%;
    bottom: 0;
}
.zwc-col-donor-ctn{
    max-width: 45%;
}
.zwc-donor-img{
    max-width: 55%;
}
@keyframes banner-line-top {
    0% {
        width: 0;
    }
    100% {
        width: 150px;
    }
}
@keyframes banner-line-bottom {
    0% {
        width: 0;
    }
    100% {
        width: 45%;
    }
}
@keyframes banner-line-left {
    0% {
        height: 0;
    }
    100% {
        height: 240px;
    }
}
@keyframes dash {
    0% {
        stroke-dashoffset: -210;
    }
    100% {
        stroke-dashoffset: 0;
    }
}
@media screen and (min-width: 991px) {
    @keyframes zoom {
        0%,
        100% {
            transform: scale(0.9);
        }
        50% {
            transform: scale(1);
        }
    }
}
@media screen and (min-width: 767px) {

.zwc-banner-ele-1 {
    animation: 7s ease-out 0.9s infinite forwards floating;
}
@keyframes floating {
    0%, 100% {
        transform: translateY(15px);
    }

    50% {
        transform: translateY(0);
    }
}
.zwc-banner-ele-2{
    animation: 7s ease-out 0.9s infinite forwards floating-reverse;
}
@keyframes floating-reverse {
    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(15px);
    }
}
    .zwc-banner-bg-img,
    .zwc-donate-form-field,
    .zwc-donate-forms,
    .zwc-main-banner,
    .zwc-volunteer-forms,
    .zwc-volunteer-ss {
        opacity: 0;
    }
    .zwc-banner-ele-1,
    .zwc-banner-ele-2,
    .zwc-doante-ele,
    .zwc-outline-circle {
        opacity: 0;
        transition: 0.3s ease-in-out;
    }
    .zwc-chat-note{
        transform: translateY(100px);
        transition: all .3s ease-in-out;
    }
    .middle-animated .zwc-chat-note{
        transform: translateY(0);
    }
    .middle-animated .zwc-banner-ele-1,
    .middle-animated .zwc-outline-circle {
        transition-delay: 1s;
        opacity: 1;
    }
    .middle-animated .zwc-banner-ele-2,
    .middle-animated .zwc-doante-ele {
        transition-delay: 1.3s;
        opacity: 1;
    }
    .middle-animated .zwc-main-banner,
    .middle-animated .zwc-volunteer-forms {
        animation: 0.3s ease-out 0.2s forwards slideDown;
    }
    .middle-animated .zwc-banner-bg-img,
    .middle-animated .zwc-donate-forms,
    .middle-animated .zwc-volunteer-ss {
        animation: 0.3s ease-out 0.5s forwards slideDown;
    }
    .middle-animated .zwc-donate-form-field {
        animation: 0.3s ease-out 1s forwards slideDown;
    }
    .zwc-payment-logo ul li{
        transform: scale(0.8);
        opacity: 0;
    }
    .middle-animated .zwc-payment-logo ul li {
        transform: scale(1);
        transition: all .4s ease-in-out;
        opacity: 1;
    }
    .middle-animated .zwc-payment-logo ul li:nth-child(2){
        transition-delay: .3s;
    }
    .middle-animated .zwc-payment-logo ul li:nth-child(3){
        transition-delay: .6s;
    }
    .middle-animated .zwc-payment-logo ul li:nth-child(4){
        transition-delay: .8s;
    }
    .middle-animated .zwc-payment-logo ul li:nth-child(5){
        transition-delay: 1s;
    }
    .middle-animated .zwc-payment-logo ul li:nth-child(6){
        transition-delay: 1.2s;
    }
    .middle-animated .zwc-payment-logo ul li:nth-child(8){
        transition-delay: 1.7s;
    }
    @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.2);
        }
        100% {
            opacity: 1;
            transform: scale(1);
        }
    }
}
@media only screen and (max-width: 1400px) {
    .zwc-col-icon {
        max-width: 200px;
    }
}
@media only screen and (max-width: 1199px) {
    section {
        padding: 80px 0;
    }
    h1 {
        font-size: 54px;
    }
    .zwc-banner-wrapper {
        max-width: 650px;
        margin: 0 auto;
        text-align: center;
    }
    .zwc-banner-wrapper .zwc-col-left,
    .zwc-banner-wrapper .zwc-col-right,
    .zwc-max-70,
    .zwc-max-80 {
        max-width: 100%;
    }
    .zwc-ctn-box-sec .zwc-col-right {
        padding: 70px 40px;
    }
    .zwc-banner-image {
        margin-top: 80px;
        max-width: 100%;
    }
    .zwc-banner-ctn p {
        max-width: 650px;
        margin :0 auto;
    }
    .zwc-col-icon img.zwc-file-upload-ss {
        width: 120px;
    }
    .zwc-content-sec-8 .zwc-bg-content-sec {
        max-width: 95%;
        padding: 80px;
    }
    .zwc-payment-logo ul li:nth-child(2), .zwc-payment-logo ul li:nth-child(5), .zwc-payment-logo ul li:nth-child(8){
        margin-top: 60px;
    }
}
@media only screen and (max-width: 991px) {
    section {
        padding: 70px 0;
    }
    h1 {
        font-size: 44px;
    }
    .zwc-banner-image {
        gap: 20px;
    }
    .zwc-ctn-box-sec .zwc-col-left,
    .zwc-ctn-box-sec .zwc-col-right {
        max-width: 100%;
    }
    .zwc-ctn-box-sec {
        max-width: 710px;
        margin: 0 auto;
    }
    .zwc-box-sec-main .zwc-col-left {
        height: 400px;
       display:flex;
       align-items :center;
       overflow:hidden;
    }
   .zwc-col-left.zwc-donor-img {
    align-items: flex-start;
    }
    .zwc-box-sec-main .zwc-zof-icon {
        margin: 0 auto 30px;
    }
    .zwc-forms-main h2,
    .zwc-page-title h2 {
        font-size: 38px;
    }
    .zwc-forms-main h3 {
        font-size: 30px;
        margin-bottom: 25px;
    }
    .zwc-banner-ctn p {
        max-width: 550px;
        font-size: 15px;
    }
    .zwc-page-title {
        margin-bottom: 40px;
    }
    .zwc-col-icon {
        max-width: 230px;
    }
    .zwc-content-sec-3 .zwc-center-content {
        max-width: 640px;
    }
    .zwc-col-wrapper {
        flex-direction: column;
        padding-top: 0;
        gap: 40px;
    }
    .zwc-col-right {
        padding-top: 0;
        text-align: center;
    }
    .zwc-col-left,
    .zwc-col-right {
        max-width: 500px;
    }
    .zwc-content-sec-8 .zwc-bg-content-sec {
        padding: 50px;
    }
    .zwc-payment-logo ul li:nth-child(2),
    .zwc-payment-logo ul li:nth-child(5),
    .zwc-payment-logo ul li:nth-child(8) {
        margin: 0;
    }
    .zwc-payment-logo ul li span.squre{
        top: 0;
    }
    .zwc-payment-logo ul,
    .zwc-payment-logo ul li {
        top: 0;
    }
    .zwc-payment-main-pattern {
        display: none;
    }
   .zwc-payment-logo ul li span {
    max-width: 100% !important;
    min-height: 60px;
    box-shadow: 3px 3px 8px rgba(0,0,0,0.1);
    display: flex;
    align-items: center;
}
    .zwc-payment-logo ul li span.paypal{
        box-shadow: 3px 3px 8px rgba(0,0,0,0.1);
    }
    .zwc-content-sec-3 .zwc-page-title {
        padding-bottom: 0;
    }
    .zwc-svg-animate {
    
        right: -46%;
    }
}
@media only screen and (max-width: 767px) {
    h1 {
        font-size: 28px;
        line-height: 1.15;
    }
    .zwc-banner-image {
        margin-top: 60px;
        gap: 15px;
    }
    .zwc-banner-image img {
        border-radius: 5px;
    }
    .zwc-forms-main h2,
    .zwc-page-title h2 {
        font-size: 26px;
    }
    .zwc-forms-main h3 {
        font-size: 20px;
        line-height: 1.3;
        margin-bottom: 20px;
    }
    .zwc-forms-main h4 {
        font-size: 20px;
    }
    .zwc-banner a.cta-btn {
        padding: 10px 25px;
    }
    .zwc-center-content {
        max-width: 500px;
        text-align: center;
    }
    .zwc-ctn-list span {
        font-size: 18px;
    }
    .zwc-page-title p {
        font-size: 16px;
        margin: auto;
    }
    .zwc-col-wrapper {
        max-width: 100%;
    }
    .zwc-banner {
        padding: 50px 0;
    }
    .zwc-ctn-box-sec .zwc-col-right {
        border-radius: 0;
        padding: 60px 30px;
    }
    .zwc-ctn-box-sec {
        border-radius: 15px;
    }
    .zwc-content-sec-8 .zwc-bg-content-sec {
        padding: 50px 30px;
        border-radius: 0;
    }
    .zwc-content-sec-8 .zwc-bg-ctn-2 {
        border-radius: 0 0 15px 15px;
    }
    .zwc-banner-ele-1,
    .zwc-banner-ele-2 {
        transform: scale(0.8);
    }
    .zwc-balance-ele{
        display: none;
    }
}
@media only screen and (max-width: 480px) {
    .zwc-col-title {
        font-size: 20px;
    }
    .zwc-content-sec-8 .content-wrap,
    .zwc-payment-logo ul li span > img {
        width: 100%;
    }
    .zwc-content-sec-8 .zwc-bg-content-sec {
        max-width: 100%;
    }
    .zwc-forms-main h2,
    .zwc-page-title h2 {
        font-size: 24px;
    }
    .zwc-payment-logo ul {
        justify-content: center;
        gap: 10px;
    }
    .zwc-payment-logo ul li {
        flex-basis: 45%;
    }
    .zwc-box-sec-main .content-wrap {
        max-width: 100%;
        width: 100%;
    }
    .zwc-svg-animate{
        display: none;
    }
}
.zwc-template-main{
    padding: 90px 0 90px 0;
    position: relative;
}
.zwc-template-sec-title{
    max-width: 800px;
    margin: 0 auto 50px auto;
    text-align: center;
}
.zwc-template-sec-title h2{
     font-size:clamp(24px, 4vw, 46px);
    text-align: center;
}
.zwc-template-sec-title p{
    margin-bottom: 0;
}
.zwc-page-secondry-btn a{
    background: #000;
    color: #fff;
    padding: 12px 50px 12px 24px;
    border-radius: 50px;
    display: inline-block;
    text-decoration: none;
    margin-top: 22px;
    font-family: var(--zf-primary-medium);
    text-transform: uppercase;
    font-size: 15px;
    position: relative;
}
.zwc-page-secondry-btn a::before {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    width: 16px;
    height: 12px;
    display: block;
    transform: translateY(-50%);
    margin-right: 21px;
    background: url(//www.zohowebstatic.com/sites/zweb/images/forms/home/forms-nav-arrow.svg) 0 0 / 100% no-repeat;
    filter: invert(1);
}
.zwc-page-secondry-btn a:hover{
    background: var(--zwc-link-clr);
}
.zwc-template-main::before{
    content: '';
    position: absolute;
    inset: 0;
    max-width: 100%;
    margin: 0 auto;
     background: #f5f5f5;
}
.zwc-template-inner {
    padding-bottom: 60px;
}
.zwc-template-inner .item > div{
    position: relative;
    overflow: hidden;
    height: 390px;
}
.zwc-template-inner .item > div::before{
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    opacity: 0;
    transition: all 0.3s ease-in-out;
    border-radius: 5px;
    z-index: 2;
}
.zwc-view-temp{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: #049949;
    color: #fff;
    padding: 12px 20px 12px 50px;
    border-radius: 50px;
    font-family: var(--zf-primary-semibold);
    font-size: 15px;
    margin-top: 10px;
    transition: all 0.3s ease-in-out;
    visibility: hidden;
    opacity: 0;
    white-space: nowrap;
    z-index: 2;
}
.zwc-view-temp::before {
    content: "";
    position: absolute;
    left: 16px;
    top: 50%;
    background: url(https://www.zohowebstatic.com/sites/zweb/images/commonroot/common-elements.svg) no-repeat;
    background-size: 1800px auto;
    background-position: -1754px -78px;
    width: 24px;
    height: 15px;
    filter: invert(1);
    transform: translateY(-50%);
}
.zwc-view-temp:hover{
    background: #000;
}
.zwc-template-inner .item:hover > div::before{
    opacity: 1;
}
.zwc-template-inner .item:hover .zwc-view-temp{
    margin-top: 0;
    visibility: visible;
    opacity: 1;
}
.zwc-template-inner .slick-list {
    overflow: visible;
}
.zwc-template-inner .item > div img {
    width: 100%;
    border-radius: 5px;
    max-width: 100%;
    display: block;
     transition: transform 3s ease;
}
.zwc-template-inner .item{
    margin-left: 20px;
}
.zwc-template-main .slick-next:after, .zwc-template-main .slick-next:before, .zwc-template-main .slick-prev:after, .zwc-template-main .slick-prev:before {
   display: none;
}
.zwc-template-inner .slick-next, .zwc-template-inner .slick-prev {
    height: 40px;
    width: 40px;
    background: #f7f7f7;
    bottom: 0;
    top: inherit;
    border-radius: 50%;
    border: 1px solid #000;
    transform: translateY(100%);
}
.zwc-template-inner .slick-prev.slick-arrow {
    left: 0;
    right: 60px;
    margin: 0 auto;
}
.zwc-template-inner .slick-arrow::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 18px;
    height: 11px;
    display: block;
    background: transparent;
    background: url(https://www.zohowebstatic.com/sites/zweb/images/forms/home/forms-nav-arrow.svg) -1px 0 / 16px no-repeat;
    transform: translate(-7px, -5px);
}
.zwc-template-inner .slick-prev.slick-disabled, .zwc-template-inner .slick-next.slick-disabled {
    opacity: 1;
    border-color: #ddd;
    cursor: auto;
}
.zwc-template-inner .slick-prev.slick-arrow::after {
    transform: rotate(-180deg) translate(10px, 5px);
}
.zwc-template-inner .slick-next {
    left: 0;
    right: -60px;
    margin: 0 auto;
}
.zwc-template-inner .slick-disabled::after {
    opacity: 0.3;
}
@media screen and (max-width: 1200px) {
   .zwc-template-inner .slick-list {
        overflow: hidden;
    }
    .zwc-template-main::before{
        max-width: 100%;
    }
    .zwc-template-main {
        padding: 70px 0 90px 0;
    }
    .zwc-template-inner {
        padding-bottom: 40px;
    }
    .zwc-template-inner .item > div {
        height: auto;
    }
    .zwc-template-inner .item > div img{
        height: 320px;
        object-fit: cover;
        object-position: top;
    }
}
@media screen and (max-width: 767px) {

}