.zw-template-inner a {
    color: #000;
    text-decoration: underline;
    font-family:var(--primaryfont-semibold);
}

.zw-product-header{
    background: #ffebe1;
}
a.cta-btn {
    background: var(--primary-btn-color);
    border-radius: 3px;
    padding: 11px 30px;
    text-decoration:none;
    color:#fff;
    font-family: var(--primaryfont-semibold);
}
/* banner section styles starts */

.zwc-banner-section{
    position: relative;
    overflow: hidden;
    background: linear-gradient(180deg, #FFEBE1 22.95%, #FFE1D1 56.08%);

}
.zwc-banner-section h1{
    font-size: 60px;
    font-family: var(--secondaryfont-semibold);
}
.zwc-banner-section p{
    font-size: 19px;
    margin-bottom: 38px;
}
.zwc-banner-section .zwc-row{
   display: flex;
   align-items: center;
   justify-content: space-between;
}
.zwc-banner-section .zwc-content{
    flex-basis: 50%;
    width: auto;
    max-width: 600px;
}
.zwc-banner-section .zwc-image{
    position: relative;
    flex-basis: 50%;
    padding: 80px 0;
}

.zwc-banner-section .zwc-image img.zwc-img-1{
    position: relative;
    left: 9%;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 41%;
    border-radius: 27px;
    box-shadow: -3px 7px 61px #00000038;
    border: 3px solid #000;
}
.zwc-banner-section .zwc-image img.zwc-img-2{
    position: absolute;
    right: 52px;
    width: 62%;
    bottom: 0;
}
.zwc-banner-section span.icon{
    position: absolute;
    background-image: url(/sites/zweb/images/salesiq/whatsapp/zwc-whatpp-sprite.png);
    background-size: 459px;
    background-repeat: no-repeat;
}
.zwc-banner-section span.icon.icon-1{
    width: 20px;
    height: 20px;
    background-position: -83px -18px;
    bottom: 15%;
    left: -2%;
    background-size: 649px;
}

.zwc-banner-section span.icon.icon-2{
    width: 42px;
    height: 42px;
    background-position: 0 -12px;
    top: 25%;
    right: 29%;
    background-size: 612px;
}

.zwc-banner-section span.icon.icon-3{
    width: 65px;
    height: 65px;
    top: 40%;
    border: 1px solid #fff;
    right: 7%;
    background-color: #efefef;
    background-size: 43px;
    background-position: center;
    transform: rotate(-20deg);
    box-shadow: 1px 1px 5px #00000026;
    border-radius: 7px;
    background-image: url(/sites/zweb/images/otherbrandlogos/whatsapp-icon.svg)
}

.zwc-banner-section span.icon.icon-4{
    width: 30px;
    height: 30px;
    background-position: -51px -15px;
    bottom: 27%;
    right: 4%;
    background-size: 691px;
    border-radius: 7px;
}
.zwc-banner-section span.icon.icon-5{
    width: 65px;
    height: 65px;
    top: 40%;
    border: 1px solid #fff;
    right: 7%;
    background-color: #efefef;
    background-size: 43px;
    background-position: center;
    box-shadow: 1px 1px 5px #00000026;
    border-radius: 7px;
    background-image: url(/sites/zweb/images/otherbrandlogos/meta-business-partner.svg)
}

@keyframes winkanimate {
    0% {
        background-position: 0 0
    }

    100% {
        background-position: 0 -6125px
    }
}


/* banner section styles ends */


/* Two column section styles starts */
.zwc-two-column-section{
    background-color: #fff2f0;
    padding: 40px 0;
}
.zwc-two-column-section .content-wrap:nth-child(even) .zwc-row {
    flex-direction: row-reverse;
}
.zwc-two-column-section .zwc-row {
    display: flex;
    align-items: center;
    gap: 139px;
    padding: 60px 0;
    max-width: 1100px;
    margin: auto;
}
.zwc-two-column-section .zwc-col-image{
  position: relative;
}
.zwc-two-column-section .zwc-col {
    width: 50%;
}

.zwc-two-column-section .zwc-icon{
    position: absolute;
    background: url(/sites/zweb/images/salesiq/whatsapp/zwc-whatpp-sprite.png);
    background-repeat: no-repeat;
    background-size: 730px;
}
.zwc-two-column-section .zwc-stop-missing .zwc-icon.zwc-icon-1{
    background-position: -440px -15px;
    top: 36%;
    left: -7%;
    width: 66px;
    height: 70px;
}
.zwc-two-column-section .zwc-stop-missing .zwc-icon.zwc-icon-2{
    background-position: -367px -18px;
    top: 27%;
    right: 10%;
    width: 66px;
    height: 70px;
}
.zwc-two-column-section .zwc-auto-communicate .zwc-col-image .zwc-image-1{
    width: 100%;
    max-width: 300px;
    border-radius: 30px;
    border: 3px solid #000;
}
.zwc-two-column-section .zwc-auto-communicate .zwc-col-image .zwc-image-2{
    position: absolute;
    width: 180px;
    right: -60px;
    bottom: 60px;
}
.zwc-two-column-section .zwc-auto-communicate .zwc-col-image .zwc-icon-1 {
    background-position: -507px -15px;
    bottom: 30%;
    left: -18%;
    width: 66px;
    height: 70px;
}
.zwc-two-column-section .zwc-auto-communicate .zwc-col-image .zwc-icon-2{
    top: 19%;
    right: 1%;
    background: none;
}
.zwc-two-column-section .zwc-auto-communicate .zwc-col-image .zwc-icon-2 .zwc-animate-arrow-tail {
    opacity:0;
}
/* .zwc-two-column-section .middle-animated .zwc-auto-communicate .zwc-col-image .zwc-icon-2 .zwc-animate-arrow-tail {
    opacity: 1;
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    animation: zwc-draw-left-to-right 2s ease forwards 1s;
  }
  
  @keyframes zwc-draw-left-to-right {
    to {
      stroke-dashoffset: 0;
    }
  } */

  .zwc-two-column-section .middle-animated .zwc-auto-communicate .zwc-icon-2 .zwc-animate-arrow-tail {
    stroke: black;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 1000;
    opacity: 1;
  }
  

.zwc-two-column-section .zwc-row.zwc-box-wrap-1 {
    background: rgba(55, 16, 13, 1);
    padding: 50px 140px;
    gap: 100px;
    border-radius: 25px;
    color: #fff;
    max-width: 100%;
    margin: 80px auto;
    position: relative;
    overflow: hidden;
}
.zwc-two-column-section .zwc-row.zwc-box-wrap-1:after{
    position: absolute;
    content: "";
    width: 200px;
    height: 140px;
    background-image: url(/sites/zweb/images/salesiq/whatsapp/zwc-streamline-shape.png);
    background-size: 200px;
    left: -55px;
    bottom: -2px;
}
.zwc-two-column-section .zwc-box-wrap-1 .zwc-col-image{
    text-align: center;
}

.zwc-two-column-section .zwc-box-wrap-1 .zwc-col-image img{
    width: 70%;
    margin: auto;
    border: 3px solid #000;
    border-radius: 30px;
}
.zwc-two-column-section .zwc-keep-your-whatapp .zwc-col-image{
    text-align: center;
}
.zwc-two-column-section .zwc-keep-your-whatapp .zwc-col-image img{
    width: 80%;
    border-radius: 15px;
    box-shadow: 1px 11px 21px #0000001f;
}
.zwc-two-column-section .zwc-keep-your-whatapp.zwc-broadcast .zwc-col-image img{
   width: 100%;
}
.zwc-two-column-section .zwc-keep-your-whatapp .zwc-icon-1{
    background-position: -580px -15px;
    bottom: -2%;
    right: 1%;
    width: 66px;
    height: 70px;
}

.zwc-two-column-section .zwc-row.zwc-box-wrap-2{
    background: #f9dbdb;
    padding: 90px 140px;
    gap: 100px;
    border-radius: 25px;
    max-width: 100%;
    margin: 80px auto;
}
.zwc-two-column-section .zwc-row.zwc-box-wrap-2 .zwc-image-1{
    width: 70%;
}
.zwc-two-column-section .zwc-row.zwc-box-wrap-2 .zwc-image-2{
    position: absolute;
    width: 40%;
    top: -6px;
    right: -1%;
    border-radius: 15px;
    box-shadow: -8px 1px 16px #00000021; 
}
.zwc-two-column-section .zwc-row.zwc-box-wrap-2 .zwc-icon-1{
    background-position: -210px -15px;
    top: -4%;
    left: -11%;
    width: 56px;
    height: 62px;
}
.zwc-two-column-section .zwc-row.zwc-box-wrap-2 .zwc-icon-2{
    bottom: 19%;
    right: 57%;
    width: 46px;
    height: 46px;
    background: url(/sites/zweb/images/otherbrandlogos/whatsapp-icon-white.svg) no-repeat;
    background-size: 30px;
    background-position: center;
    background-color: rgba(38, 211, 100, 1);
    border-radius: 50%;
}
.zwc-two-column-section .zwc-row.zwc-box-wrap-2 .zwc-icon-3{
    background-position: -278px -15px;
    bottom: 8%;
    right: 6%;
    width: 81px;
    height: 70px;
}
.zwc-two-column-section .zwc-row.zwc-box-wrap-2 .zwc-icon-4{
    background: none;
    bottom: 50%;
    right: 36%;
    transform: rotate(-55deg);
}
.zwc-two-column-section .zwc-row.zwc-box-wrap-2 .zwc-icon-4 .zwc-animate-arrow-tail {
   opacity: 0;
}
/* .zwc-two-column-section .middle-animated .zwc-row.zwc-box-wrap-2 .zwc-icon-4 .zwc-animate-arrow-tail {
    opacity: 1;
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    animation: zwc-draw-left-to-right 2s ease forwards 1s;
  }
  
  @keyframes zwc-draw-left-to-right {
    to {
      stroke-dashoffset: 0;
    }
  } */



.zwc-two-column-section .middle-animated .zwc-row.zwc-box-wrap-2 .zwc-icon-4 .zwc-animate-arrow-tail {
    stroke: black;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 1000;
    opacity: 1;
}

.middle-animated .zwc-animate-arrow-tail.tail {
  stroke-dashoffset: 1000;
  animation: drawTail 4s ease forwards 0.5s;
}

.middle-animated .zwc-animate-arrow-tail.head {
  stroke-dashoffset: 1000;
  animation: drawHead 4s ease forwards 1s;
}

@keyframes drawTail {
  to {
    stroke-dashoffset: 0;
  }
}

@keyframes drawHead {
  to {
    stroke-dashoffset: 0;
  }
}

.zwc-two-column-section .zwc-scale-your-customer .zwc-image-1{
   width: 100%;
   border-radius: 30px;
}
.zwc-two-column-section .zwc-scale-your-customer .zwc-image-2{
    border: 1.5px solid rgba(0, 30, 255, 1);
    border-radius: 10px;
    box-shadow: -8px 1px 16px #00000021;
    width: 60%;
    position: absolute;
    right: 5%;
    bottom: 8%;
}
/* Two column section styles ends */

/* cta setcion styles starts */

.zwc-cta-section{
    background-color: rgba(55, 16, 13, 1);
    text-align: center;
    padding: 60px 0;
}

.zwc-cta-section h2{
    color: #fff;
    font-size: 44px;
    width: 61%;
    margin: 0 auto 31px;
}

/* cta setcion styles ends */


.zwc-banner-section span.icon.icon-5 {
    width: 155px;
    height: 85px;
    top: auto;
    bottom: 23%;
    border: 1.2px solid #157FFC;
    left: -37px;
    background-color: #fff;
    background-size: 123px;
    background-position: center;
    box-shadow: 1px 7px 23px #00000063;
    border-radius: 7px;
    background-image: url(/sites/zweb/images/otherbrandlogos/meta-business-partner.svg);
    animation: scaling ease 1s forwards, floating 10s ease 1s infinite;
}



/* Nova promoation css start */

.zwc-nova-promote-banner{
    background-image: url(/sites/zweb/images/salesiq/zwc-common/zwc-nova-banner.jpg);
    background-size: cover;
    color: #fff;
    display: flex;
    align-items: center;
    padding: 30px 70px;
    max-width: 1060px;
    margin: 80px auto;
}

.zwc-nova-promote-banner p{
   margin-bottom:0;
   max-width: 550px;
}
.zwc-nova-promote-banner a{
  color:#000;
  background:#fff;
  padding: 20px 70px;
  border-radius: 5px;
  font-size: 15px;
  font-family: var(--primaryfont-semibold);
  text-decoration: none;
}
.zwc-nova-promote-banner .zwc-col-1 {
    width:60%;
}
.zwc-nova-promote-banner .zwc-col-2 {
    text-align: right;
   width:40%;
}

/* Nova promoation css end*/

/* Responsive styles starts */
@media screen and (max-width:1440px){
    .zwc-banner-section h1 {
        font-size: 42px;
    }
    .zwc-cta-section h2 {
        font-size: 32px;
        width: auto;
        max-width: 600px;
    }
    .zwc-two-column-section .zwc-auto-communicate .zwc-col-image .zwc-image-1 {
        max-width: 220px;
        border-radius: 20px;
    }
    .zwc-two-column-section .zwc-auto-communicate .zwc-col-image{
        max-width: 360px;
    }
    .zwc-two-column-section .zwc-auto-communicate .zwc-col-image .zwc-image-2 {
        width: 140px;
        right: -40px;
        bottom: 60px;
    }
    .zwc-two-column-section .zwc-auto-communicate .zwc-col-image .zwc-icon-1 {
        background-position: -401px -15px;
        left: -21%;
        width: 57px;
        height: 52px;
        background-size: 580px;
    }
    .zwc-two-column-section .zwc-auto-communicate .zwc-col-image .zwc-icon-2 {
        top: 9%;
        right: -5%;
    }    
    .zwc-two-column-section .zwc-keep-your-whatapp .zwc-col-image {
        text-align: center;
        max-width: 350px;
    }
}
@media screen and (max-width:1199px){
    .zwc-two-column-section .zwc-row.zwc-box-wrap-1,.zwc-two-column-section .zwc-row.zwc-box-wrap-2 {
        padding: 90px 60px;
    }
    .zwc-two-column-section .zwc-auto-communicate .zwc-col-image .zwc-icon-1{
        display: none;
    }
.zwc-banner-section span.icon.icon-5 {
    width: 105px;
    height: 65px;
    top: auto;
    bottom: 23%;
    left: -7px;
    background-size: 80px;
}
}

@media screen and (max-width:1024px){
    .zwc-banner-section h1 {
        font-size: 34px;
    }
    .zwc-banner-section .zwc-content {
        margin: auto;
    }
    .zwc-banner-section h1,.zwc-banner-section p {
        width: 100%;
    }
    .zwc-banner-section span.icon.icon-6 {
        bottom: -12%;
    }
    .zwc-banner-section span.icon.icon-1 {
        top: -9%;
    }
}

@media screen and (max-width:991px){
    .zwc-banner-section {
        padding-top: 40px;
    }
    .zwc-banner-section .zwc-row {
        flex-direction: column;
    }
    .zwc-banner-section .zwc-content {
        text-align: center;
    }
    .zwc-two-column-section .zwc-row,.zwc-two-column-section .content-wrap:nth-child(even) .zwc-row {
        gap: 40px;
        flex-direction: column;
        padding: 50px 0;
    }
    .zwc-two-column-section .zwc-col {
        width: 100%;
        max-width: 450px;
    }
    .zwc-two-column-section .zwc-col.zwc-col-content {
        text-align: center;
    }
    .zwc-two-column-section .zwc-row.zwc-box-wrap-1, .zwc-two-column-section .zwc-row.zwc-box-wrap-2 {
        padding: 50px 40px;
        max-width: 700px;
        gap: 30px;
        margin: 50px auto;
    }
    .zwc-two-column-section .zwc-box-wrap-1 .zwc-col-image img {
        border-radius: 18px;
    }
   .zwc-nova-promote-banner{
    padding: 40px 30px;
        margin: 30px auto;
   }
   .zwc-nova-promote-banner a {
    padding: 20px 20px;
   }
}

@media screen and (max-width:767px){
    .zwc-banner-section {
        padding-top: 30px;
    }
    .zwc-banner-section span.icon.icon-3 {
        right: 5%;
    }
    .zwc-banner-section .zwc-image img.zwc-img-2 {
        left: 39%;
        width: 56%;
    }
    .zwc-banner-section span.icon.icon-4 {
        right: 0;
    }
    .zwc-banner-section span.icon.icon-1 {
        top: -7%;
    }
    .zwc-cta-section h2 {
        font-size: 25px;
    }
    .zwc-two-column-section .zwc-col-image {
        max-width: 300px;
    }
    .zwc-two-column-section .zwc-row, .zwc-two-column-section .content-wrap:nth-child(even) .zwc-row {
        gap: 30px;
    }
    .zwc-two-column-section .zwc-stop-missing .zwc-icon.zwc-icon-1 {
        left: -15%;
    }
    .zwc-two-column-section .zwc-stop-missing .zwc-icon.zwc-icon-2 {
        right: 0;
    }
    .zwc-two-column-section .zwc-row.zwc-box-wrap-2 .zwc-icon-1,.zwc-two-column-section .zwc-row.zwc-box-wrap-2 .zwc-icon-3,.zwc-two-column-section .zwc-row.zwc-box-wrap-2 .zwc-icon-4 {
        display: none;
    }
    .zwc-two-column-section .zwc-auto-communicate .zwc-col-image {
        max-width: 300px;
    }
    .zwc-two-column-section .zwc-auto-communicate .zwc-col-image .zwc-image-2 {
        width: 90px;
        right: -22px;
        bottom: 140px;
    }
    .zwc-two-column-section .zwc-auto-communicate .zwc-col-image .zwc-icon-2 {
        top: 9%;
        right: -23%;
    }
    .zwc-two-column-section .zwc-keep-your-whatapp .zwc-icon-1 {
        background-position: -419px -12px;
        width: 50px;
        height: 49px;
        background-size: 530px;
    }
   .zwc-banner-section span.icon.icon-5 {
       width: 103px;
       height: 55px;
       bottom: 24%;
       left: 0;
       background-size: 73px;
   }
   .zwc-nova-promote-banner {
        max-width: 470px;
        justify-content: center;
        flex-direction: column;
        gap: 30px;
        background-size:cover;
    }
   .zwc-nova-promote-banner .zwc-col-1,.zwc-nova-promote-banner .zwc-col-2 {
    width: 100%;
    text-align: center;
   }
   .zwc-nova-promote-banner a{
      width: max-content;
      margin: auto;
      padding: 20px 30px;
      display:block;
   }
}



@media screen and (max-width:480px){
    .zwc-banner-section .zwc-image {
        padding: 52px 0 80px;
    }    

    .zwc-banner-section span.icon.icon-6 {
        left: 6%;
        bottom: -32%;
    }
    .zwc-banner-section .zwc-image img.zwc-img-1 {
        width: 52%;
    }
    .zwc-banner-section span.icon.icon-1 {
        top: -22%;
    }
    .zwc-banner-section span.icon.icon-2 {
        right: 23%;
    }
    .zwc-banner-section span.icon.icon-4 {
        bottom: 23%;
        right: 1px;
    }
    .zwc-two-column-section .zwc-row, .zwc-two-column-section .content-wrap:nth-child(even) .zwc-row {
        padding: 40px 0;
    }
    .zwc-two-column-section .zwc-row.zwc-box-wrap-1, .zwc-two-column-section .zwc-row.zwc-box-wrap-2 {
        margin: 40px auto;
        padding: 50px 30px;
    }
    .zwc-two-column-section .zwc-row.zwc-box-wrap-1:after,
    .zwc-two-column-section .zwc-auto-communicate .zwc-col-image .zwc-image-2,
    .zwc-two-column-section .zwc-auto-communicate .zwc-col-image .zwc-icon-2{
        display: none;
    }
    .zwc-two-column-section .zwc-auto-communicate .zwc-col-image {
        text-align: center;
    }
    .zwc-two-column-section .zwc-row.zwc-box-wrap-2 .zwc-image-2 {
        border-radius: 9px;
    }
    .zwc-two-column-section .zwc-stop-missing .zwc-icon.zwc-icon-1 {
        display: none;
    }
    .zwc-banner-section span.icon.icon-1{
        display: none;
    }
}




@media screen and (min-width:768px){
/* Animation styles starts */
    .content-wrap .zwc-image .icon{
        opacity: 0;
        transition: all 0.5s ease;
    }
    
    .content-wrap .zwc-image .icon-3{
       animation: scaling ease 1s forwards, floatingrev 10s ease 1s infinite;
    }
    .content-wrap .zwc-image .icon-4{
        animation: scaling ease 1s forwards,floating 10s ease 1s infinite;
    }
    
    .middle-animated .zwc-image .icon{
        opacity: 1;
        transition-delay: 1s;
    }

    .zwc-fadeinup,.zwc-scaling1, .zwc-scaling2, .zwc-scaling3, .zwc-scaling4,.zwc-fade-left,.zwc-fade-right {
      opacity: 0;
    }

    .middle-animated .zwc-fadeinup{
      animation: fadeInUp 1s ease 0.2s forwards;
    }
    
    .middle-animated .zwc-scaling1 {
      animation: scaleUp 2s ease 0.5s forwards;
    }
    
    .middle-animated .zwc-scaling2 {
      animation: scaleUp 3s ease 0.5s forwards;
    }
    
    .middle-animated .zwc-scaling3 {
      animation: scaleUp 4s ease 0.5s forwards;
    }
    
    .middle-animated .zwc-scaling4 {
      animation: scaleUp 5s ease 0.5s forwards;
    }

    .middle-animated .zwc-fade-left{
        animation: .7s ease-out .3s forwards slideLeft;
    }
    .middle-animated .zwc-fade-right{
        animation: .7s ease-out .3s forwards slideRight;
    }
    .middle-animated .zwc-box-wrap-2 .zwc-fade-left{
        animation: .7s ease-out 1.2s forwards slideLeft;
    }
    
    .middle-animated .zwc-auto-communicate .zwc-fadeinup{
      animation-delay:1.3s;
     }

    @keyframes rotate {
        0% {
            transform: rotate(0)
        }

        100% {
            transform: rotate(360deg)
        }
    }

    @-webkit-keyframes rotate {
        0% {
            transform: rotate(0)
        }

        100% {
            transform: rotate(360deg)
        }
    }

    @keyframes floatingrev {
        0% {
            transform: translateY(30px)
        }

        50% {
            transform: translateY(0)
        }

        100% {
            transform: translateY(30px)
        }
    }

    @-webkit-keyframes floatingrev {
        0% {
            transform: translateY(30px)
        }

        50% {
            transform: translateY(0)
        }

        100% {
            transform: translateY(30px)
        }
    }

    @keyframes slideLeft {
        0% {
            opacity: 0;
            transform: translate3d(20px,0,0)
        }

        100% {
            transform: translate3d(0,0,0);
            opacity: 1
        }
    }

    @keyframes slideRight {
        0% {
            opacity: 0;
            transform: translate3d(-20px,0,0)
        }

        100% {
            transform: translate3d(0,0,0);
            opacity: 1
        }
    }

    @keyframes slideIn {
        from {
            transform: translateX(30px);
            opacity: 0;
        }
        to {
            transform: translateX(0);
            opacity: 1;
        }
    }
    
    @keyframes floating {
        0% {
            transform: translateY(0px)
        }
    
        50% {
            transform: translateY(30px)
        }
    
        100% {
            transform: translateY(0px)
        }
    }
    @-webkit-keyframes floating {
        0% {
            transform: translateY(0px)
        }
    
        50% {
            transform: translateY(30px)
        }
    
        100% {
            transform: translateY(0px)
        }
    } 
    @keyframes floatingrev {
        0% {
            transform: translateY(0px)
        }
      50% {
            transform: translateY(-30px)
        }
    
        100% {
            transform: translateY(0px)
        }
    }
    
    
    @keyframes scaling {
        0% {
            transform: scale(0.2)
        }
    
        100% {
            transform: scale(1);
            opacity: 1;
        }
    }

    @keyframes fadeInUp {
        from {
        opacity: 0;
        transform: translate3d(0, 50px, 0);
        }
        to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
        }
    }
    
    @keyframes fadeInDown {
        from {
        opacity: 0;
        transform: translate3d(0, -50px, 0);
        }
        to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
        }
    }
    
    @keyframes scaleUp {
        from {
        opacity: 0;
        transform: scale(0.3);
        }
        to {
        opacity: 1;
        transform: scale(1);
        }
    }
    /* Animation styles ends */
    
    }


/* Responsive styles ends */