
:root{
    --bg-1:transparent url('https://www.animaker.com/static_2.0/img/subtitlegenerator/Hero BG@2x.png') 0% 0% no-repeat padding-box;
    --bg-9: #FFFFFF 0% 0% no-repeat padding-box;
    --text-color-1:#1D1D1D;
    --text-color-2:#54536C;
    --text-color-3:#676772;
    --text-color-4:#ffffff;
    --text-color-5:#111111;
    --text-color-6:#9B9B9B;
    --text-color-7:#F86A6E;
    --text-color-8:#AFAFAF;
    --text-color-9:#F1821E;
    --text-color-10:#F76B6B;
    --border-color-1:rgba(84, 83, 108, 0.19);
    --border-color-2:#FFE8F2;
    --border-color-3:linear-gradient(178deg, #F67062 0%, #FC5296 100%);
    --box-shadow-value-1:0px 0px 6px #00000014;
    --box-shadow-value-2:0px 3px 6px #00000029;
}

body{
    letter-spacing: 0px;
    font-family: 'Inter', 'sans-serif' !important;
}


.btn-primary,
.btn-primary:active{
    color: var(--text-color-4);
    font-size: 18px;
    font-weight: 600;
    background: transparent linear-gradient(83deg, #A87BFF 0%, #DF7EFC 100%) 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 28px;
    font: normal normal 600 21px/29px 'Lexend Deca', 'sans-serif';
    border: none ;
    display: block;
}
.btn-primary:active:focus,
.btn-primary:focus{
    box-shadow: 0px 3px 6px #00000029;
}
.btn-lg{
    width: 320px;
    height: 56px;
    margin: 10px 0;
    padding: 13px;
}
.container-fluid{
    padding: 0;
}

.dark-bg{
    /* background:var(--bg-1); */
    /* background-size: cover; */
    color: var(--text-color-4) !important;
}
.light-bg{
    color: var(--text-color-5);
}
.quote-image{
    width: 100%;
    max-width: 38px;
    margin: 18px auto 0 auto;
}
#section-11,
#section-12{
    background: #FAFAFA 0% 0% no-repeat padding-box;
    padding: 100px 0;
}
#section-12{
    background-color: white;
    padding-bottom: 0;
    padding-top:0;
}
#section-12 h2{
    margin-bottom: 20px;
}
.header-section{
    height: 100%;
    display: flex;
    justify-content: center;
    flex-basis: auto;
    flex-direction: column;
    margin-top: 80px;
}
.header-section .btn-lg{
    margin: 18px 0;
}
span.disclaimer-txt{
    /* font: normal normal normal 13px/18px 'Open Sans', 'sans-serif'; */
    letter-spacing: 0px;
    color: #898989;
    width: 320px;
}
.header-section span.disclaimer-txt,
#section-8 span.disclaimer-txt{
    text-align: center;
    display: block;
}
.header-text{
    padding-left: 80px;
}
h2{
    letter-spacing: 0px;
    color: #1D1D1D;
    text-align: center;
    margin-bottom: 25px;
}
h5{
    letter-spacing: 0px;
    color: #54536C;
    text-align: center;
    margin-bottom: 20px;
}
#section-2 h5{
    margin-bottom: 80px;;
}

#section-6 h3{
    margin-bottom: 16px;
}
#section-8{
    background: #FAFAFA 0% 0% no-repeat padding-box;
    padding: 120px 0 0 0;
}
#section-3,
#section-4{
    padding: 120px 0;
}
#section-5{
    padding: 120px 0 200px 0;
    background-color: #FAFAFA;
}
#section-4 .row > * {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.header-section .row > *{
    display: flex;
    flex-direction: column;
    justify-content: center;
    /* align-items: center; */
}

h4{
    /* font:var(--DM-serif-regular-36px); */
    letter-spacing: 0.29px;
    color:var(--text-color-1);
    font-weight: 600;
    line-height: 1.5;
}
article{
    /* font:var(--lato-regular-18px); */
    color:#54536c;
    margin-top: 0;
    max-width:443px;
    font-size: 18px;
    line-height: 1.4;
}

.dark-bg h2,
.dark-bg h5{
    color:var(--text-color-4);
}
#section-6{
    /* background: var(--bg-6); */
    padding: 120px 0;
}
#section-4 article{
    font: normal normal normal 18px/32px 'Open Sans', 'sans-serif';
    letter-spacing: 0px;
    color: #54536C;
}
#section-6 article{
    font: normal normal normal 18px/26px 'Open Sans', 'sans-serif';
    letter-spacing: 0px;
    color: #54536C;
}

.step-section{
    padding-top: 60px;
}
.step-image{
    /* max-width: 74px; */
    /* margin-bottom: 26px; */
    display: flex;
    margin-left: auto;
}
h3{
    font: normal normal bold 24px/32px 'Lexend Deca', 'sans-serif';
    letter-spacing: -0.48px;
    color: #1D1D1D;
}
#section-7{
    padding: 0 0 120px 0;
}
#section-7 h2{
    font-weight: 600;
}
#section-7 h5{
    font:normal normal normal 18px/26px 'Open Sans', 'sans-serif';
}
#section-7 h3{
    margin-bottom: 15px;
}

#section-9{
    padding: 120px 0;
}

.card-section{
    /* padding: 60px 0;
    width: 80%; */
    margin: auto;
    max-width: 950px;
}
.card-section .card{
    text-align: center;
    padding: 30px;
    background:var(--bg-9);
    box-shadow: 0 0 10px rgb(0 0 0 / 15%);
    border-radius: 5px;
    border: none;
    height: 400px;
    /* justify-content: center; */
}
.card .gx-0 > *{
    display: flex;
    /* align-items: center; */
    justify-content: center;
    flex-direction: column;
}
.card .gx-0 > div:first-child{
    align-items: center;
}
.card-section article{
    text-align: center;
    margin: 40px 0 0 0;
    font: normal normal normal 15px/26px 'Open Sans', 'sans-serif';
    letter-spacing: 0px;
    color: #54536C;
}
.card-section h4{
    /* font: var(--lato-bold-16px); */
    letter-spacing: 0px;
    color: var(--text-color-2);
    text-align: center;
    margin: 20px 0;
    font-size: 21px;
}

.card-section .card-image{
    /* width: 100%; */
    max-width: 101px;
    border-radius: 50%;
    position: absolute;
    top: -70px;
    /* box-shadow: 0 0 10px rgb(0 0 0 / 15%); */
}
.card-section span{
    font: var(--lato-regular-12px);
    letter-spacing: 0px;
    color: var(--text-color-2);
    position: absolute;
    left:40%;
}
.card-section span.play-button{
    left: 0;
}
.swiper-slide video{
    border-radius: 10px;
    width: 100%;
    height: 100%;

}
ul.faq-section {
    margin-top: 45px;
}
ul.faq-section li{
    padding: 35px 50px 35px 35px;
}
ul.faq-section li a.nav-link{
    font:var(--lato-regular-18px-22px);
    letter-spacing: 0px;
    color: var(--text-color-2);
    cursor: pointer;
    padding-left: 0;
    padding: 0;
}
ul.faq-section li[aria-expanded='true'],
ul.faq-section li.active{
    background: #F4F4F4 0% 0% no-repeat padding-box;
    border-radius: 4px;
}
ul.faq-section li[aria-expanded='true'] .icon-expand,
ul.faq-section li.active .icon-expand{
    display: none;
}
.icon-expand{
    cursor: pointer;
}
.icon-collapse{
    display: none;
    cursor: pointer;
}
ul.faq-section li[aria-expanded='true'] .icon-collapse,
ul.faq-section li.active .icon-collapse{
    display: block;
    visibility: hidden;
}

ul.faq-section li[aria-expanded='true'] a.nav-link,
ul.faq-section li.active a.nav-link{
    font: normal normal bold 18px/24px 'Open Sans', 'sans-serif';
    letter-spacing: 0px;
    color: #54536C;
    padding-bottom: 10px;
    padding: 0;
}
ul.faq-section li[aria-expanded='true'] a.nav-link span,
ul.faq-section li.active a.nav-link span{
    margin-bottom: 15px;
    display: block;
}
ul.faq-section li:after{
    display: block;
    content:'';
    border:1px solid #F4F4F4;
    position: relative;
    top: 35px;
}
ul.faq-section li .flex-item{
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 20px;
}
.faq-section-content{
    font: normal normal normal 16px/24px 'Open Sans', 'sans-serif';
    letter-spacing: 0px;
    color: #54536C;
}

.faq-section a{
    color: inherit;
    text-decoration: none;
    cursor: pointer;
}

footer h5{
  text-align: left;
  font-family: inherit;
}
footer h6{
 margin-top:0;
}
footer .container{
  width:80%;
}


.swiper {
    /* width: 600px; */
    height: 600px;
  }
  .swiper.language-swiper{
      height: 350px;
  }
  .swiper-slide{
      top:100px;
      position: relative;
      cursor: pointer;
  }
  .swiper.language-swiper .swiper-slide{
    cursor: pointer;
    top: 0;
}
  .slide-content{
      position: relative;
  }
.custom-swiper-btn-left,
.custom-swiper-btn-right{
    display: inline-flex;
    position: initial;
    margin: 0 20px;
}
.swiper-button-next:after,
.swiper-button-prev:after{
    display: none;
}

button.navbar-toggler{
    border: none;
    color:transparent;
}
button.navbar-toggler:focus{
    box-shadow: none;
}


.reasons-section .accordion-item,
.faq-section .accordion-item{
    background: none;
    border:none;
}
.icon-expand{
    content:url('https://www.animaker.com/static_2.0/img/subtitlegenerator/icon-expand.png');
    width: 21px;
    display: block;
    /* margin-right: 20px; */
}
/* Educational Video Maker */
h6{
    /* width: 410px; */
}
.highlight-heading{
    color: #FFDA60;
}
.btn-primary:hover:not(nav .btn-primary){
    background:#ffca00 !important;
}
.show-md{
    display: none;
}
.hide-md{
    display: block;
}

/* HEADER MOBILE ICON CSS */

.flex-row > *{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    align-self: center;
    text-align: center;
}
img.usecase-icons {
    margin: 50px 0  25px 0;
    width: 100%;
    max-width: 80px;
    cursor: pointer;
}
#section-6 .container{
    width: 80%;
    margin: auto;
}

.more-pages-section h2{
    margin-bottom: 65px;
}
.more-pages-section img{
    width: 100%;
}
.more-pages-section .card{
    border-radius: 6px;
    box-shadow: 0px 0px 6px #00000014;
    border: none;
}
.card-header{
    padding: 0;
}
.card-content{
    padding: 30px;
    text-align: center;
}
.card-content span{
    font: normal normal normal 12px/32px 'Open Sans', 'sans-serif';
    letter-spacing: 0px;
    color: #C4C4C4;
}
.card-content h4{
    font: normal normal normal 18px/25px 'Lexend Deca', 'sans-serif';
    letter-spacing: -0.36px;
    color: #54536C;
}
.card-content a{
    font: normal normal normal 12px/32px 'Open Sans', 'sans-serif';
    letter-spacing: 0px;
    color: #54536C;
    cursor: pointer;
    text-decoration: none;
}
#section-2 a.btn-primary{
    margin-top: 70px;
}

#section-3 h2,
#section-5 h2{
    letter-spacing: -0.96px;
}


#section-11 .container{
    width: 70%;
}

img.mascot-image {
    width: 100%;
    max-width: 500px;
}
#section-12 .container{
    width: 70%;
    margin: auto;
}


@-moz-keyframes rotateMenu {
    0% {
      transform: rotateX(-90deg);
    }
    70% {
      transform: rotateX(20deg);
    }
    100% {
      transform: rotateX(0deg);
    }
  }
  @-webkit-keyframes rotateMenu {
    0% {
      transform: rotateX(-90deg);
    }
    70% {
      transform: rotateX(20deg);
    }
    100% {
      transform: rotateX(0deg);
    }
  }
  @-o-keyframes rotateMenu {
    0% {
      transform: rotateX(-90deg);
    }
    70% {
      transform: rotateX(20deg);
    }
    100% {
      transform: rotateX(0deg);
    }
  }
  @keyframes rotateMenu {
    0% {
      transform: rotateX(-90deg);
    }
    70% {
      transform: rotateX(20deg);
    }
    100% {
      transform: rotateX(0deg);
    }
  }

  @keyframes scale-fade-effect {
    0%   {opacity:0.5;}
    25%  {opacity:0.3;transform:scale(1.2, 1.5);}
    50%  {opacity:0.5;}
    75%  {opacity: 0.7;}
    100% {opacity:1}
    }
    @keyframes scale-fade-effect1 {
        0%   {opacity:0.5;}
        25%  {opacity:0.3;transform:scale(1.2, 1.5);}
        50%  {opacity:0.5;}
        75%  {opacity: 0.7;}
        100% {opacity:1}
        }

 /* Medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {
    body{
        text-align: center;
    }
    .navbar .container,
    h1,
    article{
        max-width: none;
    }
    nav.navbar .navbar-logo,
    nav.navbar.fixed-top .navbar-logo{
        background-position: center;
    }
    .navbar .container{
        justify-content: center;
    }
    nav.navbar li.nav-item{
        padding: 0 5px;
    }
    .video-maker #section-1{
        height: 135.09vw;
    }
   .header-section {
        /* padding: 50px 0; */
        margin-top: 100px;
    }
    .header-text{
        padding-left: 0;
    }
    nav.navbar.fixed-top + .header-section{
        margin-top: 180px;
    }
    .header-section .btn-lg{
        margin: 18px auto;
    }
    .header-section img{
        /* margin-top: 50px; */
    }
    .header-section span.disclaimer-txt {
        margin-bottom: 30px;
    }

    br.line-break-md{
        display: none;
    }
    h1,
    h2{
        margin-bottom: 30px;
    }
    #section-2,
    #section-3,
    #section-5,
    #section-6 {
        padding: 90px 0;
    }
    #section-2 .container,
    #section-3 .container,
    #section-5 .container,
    #section-7 .container{
        width: auto;
    }

    .template-image-gallery {
        padding-top: 30px;
    }
    span.disclaimer-txt{
        /* position:initial; */
    }
    span.disclaimer-txt,
    .header-section span.disclaimer-txt,
    #section-8 span.disclaimer-txt{
        width: auto;
    }
    
    .nav-item.view-more,
    #section-8 h2,
    #section-8 h5{
        text-align: center;
    }

    #section-9,
    #section-7{
        padding: 70px 0;
    }
    .reasons-section{
        padding: 50px 0 0 0;
    }
    /* footer{

    }
    footer .nav-item,
    footer h3,
    footer h4,
    footer h6,
    footer address{
        text-align: left;
    }
    footer h3{
        margin-top: 30px;
    }
    footer .col-md-4 {
        padding: 0 30px;
    }
    footer h4{
        margin-top: 60px;
    }
    footer h7 span{
        display: block;
        margin-top: 30px;
    } */
    .card-section {
        padding: 60px 20px;
        width: auto;
    }
    #section-5 h5,
    #section-7 h2{
        margin-bottom: 60px;
    }
    .reasons-section img{
        width: 100%;
    }
    .article-section-1 + .article-section-1{
        margin: 60px 0 0 0;
    }
    .icon-expand{
        content:url('https://www.animaker.com/static_2.0/img/subtitlegenerator/icon-expand.png');
        width: 21px;
        display: block;
        margin-right: 20px;
    }
    ul.faq-section li[aria-expanded='true'] .icon-expand,
    ul.faq-section li.active .icon-expand{
        content:url('https://www.animaker.com/static_2.0/img/subtitlegenerator/icon-collapse.png');
        display: block;
    }
    ul.faq-section .faq-section-content .flex-item{
        /* display: none; */
    }
    .video-maker #section-1{
        background-image: none;
    }
    .article-section-1 .col-lg-10{
        align-items:center;
    }
    #section-5 .article-section-1 h4{
        margin: 25px 0 0;
        text-align: center;
        padding: 0;
    }
    #section-5 .article-section-1 article{
        margin: 25px 0 50px 0;
        text-align: center;
    }
    .hide-md{
        display: none;
    }
    .show-md{
        display: block;
    }


    ul.step-icon-list{
        flex-wrap: wrap;
    }
    ul.step-icon-list > li{
        width: 100%;
        flex:50%;
    }
    ul.step-icon-list > li:nth-child(even){
        display: none;
    }
    ul.step-icon-list > li:nth-child(n+5){
        margin-top: 30px;
    }
    #section-2 .card-section{
        padding: 0;
        margin: 0 -36px;
    }
    #section-2 .card-section > .col{
        padding: 0;
    }
    .facebook-videos .human_like,
    .animaker-clients{
        margin-top: 70px;
    }
    .animaker-clients-section h5,
    .credit-section h2,
    .credit-section h5{
        text-align: center;
    }
    #section-8{
        padding: 90px 0;
    }
    #section-8 .card-section{
        /* width: 80%; */
        padding: 0;
    }
    .more-pages-section .row > div:nth-child(3){
        margin-top: 70px;
    }
    #section-11,
    #section-12{
        padding: 70px 0;
    }
    #section-12{
        padding-bottom: 0;
    }
    .credit-section > div:first-child,
    .flex-row.credit-section > div:nth-child(2){
        align-items: center;
    }
    #section-4 article{
        margin: 40px auto;
    }
    .swiper.language-swiper{
        height: calc(100% + 30px);
    }
    #section-7 .container{
        max-width: none;
    }
    .animaker-users-description{
        border-radius: 0;
        margin: 0 -12px;
    }
    .animaker-clients-section{
        padding-top: 90px;
    }
    .animaker-clients-section,
    .animaker-users-description > div,
    #section-11 .container{
        width: 100%;
        margin: auto;
    }
    .explore-section .nav.flex-column.hide-md{
        padding-right: 0;
    }
    footer .container{
      width:100%;
    }

}

 /* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
    :root{
        --DM-serif-regular-40px: normal normal normal 35px/43px 'DM Serif Display', sans-serif;
        --DM-serif-regular-36px: normal normal normal 31px/34px 'DM Serif Display', sans-serif;
    }
    
    /* .navbar-nav .dropdown-toggle::after{
        display: none;
    } */
    div#collapsibleNavbar.show{
        transform: translateX(0);
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
    }
    ul.navbar-nav li:nth-child(2),
    .dropdown-menu ul:nth-child(2) li:last-child {
        padding-bottom: 0;
    }
    nav.navbar ul >li .dropdown-menu,
    #collapsibleNavbar > ul > li:nth-child(2):hover >.dropdown-menu{
        position: static;
        opacity: 1;
        -webkit-box-orient: vertical;
        flex-direction: column;
        transform: scaleY(1);
        -webkit-transform: scaleY(1);
        -moz-transform: scaleY(1);
        background: 0 0;
        box-shadow: 0 0;
        -webkit-box-shadow: 0 0;
        -moz-box-shadow: 0 0;
        padding: 0 0 0 20px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
    nav.navbar li.nav-item{
        width: 100%;
        border-bottom: 1px dotted rgba(255,255,255,.3);
        text-align: left;
        padding: 20px 0;
    }
    nav.navbar li li.nav-item:last-child{
        border: none;
    }
    .navbar-dark .navbar-toggler .navbar-toggler-icon{
        background-image: url('https://www.animaker.com/static_2.0/img/subtitlegenerator/icon-menu-white.svg');
    }
    .navbar-light .navbar-toggler .navbar-toggler-icon{
        background-image: url('https://www.animaker.com/static_2.0/img/subtitlegenerator/icon-menu-black.svg');
    }
    .navbar-toggler[aria-expanded = 'true']{
        padding-right: 6px;
    }
    .navbar-dark .navbar-toggler[aria-expanded = 'true'] .navbar-toggler-icon{
        background-image: url('https://www.animaker.com/static_2.0/img/subtitlegenerator/icon-close-white.svg');
        width: 40px;
        padding-right: 0;
    }
    .navbar-light .navbar-toggler[aria-expanded = 'true'] .navbar-toggler-icon{
        background-image: url('https://www.animaker.com/static_2.0/img/subtitlegenerator/icon-close-black.svg');
        width: 40px;
        padding-right: 0;
    }
    #navbar_top .d-flex{
        flex-wrap: inherit;
        flex: auto;
    }
    button.navbar-toggler{
        margin-left: auto;
    }
    .header-section h1{
        margin-top: 50px;
    }
    #section-2,
    #section-3,
    #section-4,
    #section-5 {
        padding: 60px 0;
    }
    .step-section{
        padding-top: 0;
    }
    .step-image{
        margin-top: 30px;
    }
    .reasons-section {
        padding: 20px 0 0 0;
    }
    .btn-lg{
        width: 90%;
        margin: 10px auto;
    }
    .header-section .btn-lg{
        margin: 18px auto;
    }
    #section-11,
    #section-12{
        padding: 60px 0;
    }
    #section-12{
        padding-bottom: 0;
    }
    ul.faq-section li{
        padding: 25px 15px;
    }
    #section-6{
        padding: 90px 0 30px 0;
    }

    #section-4 .row > div{
        margin-top: 50px;
    }
    #section-4 .btn-primary,
    #section-2 a.btn-primary{
        margin-top: 30px;
    }
    #section-8{
        padding: 20px 0;
    }
    /* footer h2{
        margin: 0;
        padding-left: 15px;
    } */
    .footer-section-1,
    .footer-section-2,
    .animaker_users_description{
        padding: 40px 0;
    }
    .video-maker #section-1{
        height: 225.09vw;
    }
    div#collapsibleNavbar.show{
        z-index: 1;
    }
    .article-section-1 + .article-section-1{
        margin: 30px 0 0 0;
    }
    h1{
        font: normal normal bold 42px/50px 'Lexend Deca', 'sans-serif';
    }
    h2{
        font: normal normal bold 38px/46px 'Lexend Deca', 'sans-serif';
    }
    h6{
        margin: 15px 0;
    }
    .card-section .card{
        padding: 40px 20px;
        margin: auto;
        height: auto;
    }
    .card-section article,
    .card-section h4,
    #section-8 h2,
    #section-8 h5{
        text-align: center;
    }
    .card-section .card-image{
        margin-bottom: 20px;
    }
    .swiper.language-swiper{
        height: auto;
        width: calc(100% + 14px);
        padding-bottom: 30px;
    }
    #section-2 .col{
        padding: 0;
        margin:0 -12px
    }
    #section-2 .card-section{
        margin: 0 -10px;
    }
    #section-6 .container,
    #section-12 .container{
        width: 100%;
    }

    .header-section{
        margin-top: 80px;
    }
    nav.navbar.fixed-top + .header-section{
        margin-top: 90px;
    }
    ul.step-icon-list > li{
        flex:100%;
    }
    ul.step-icon-list > li + li{
        margin-top: 30px;
    }
    #section-8 .card-section,
    img.mascot-image{
        width: 100%;
    }

    #section-4 .row > div,
    .facebook-videos{
        margin-top: 0;
    }
    /* .sound-line-bg.top{
        background-position: 5px 20px;
    } */
    .sound-line-bg{
        /* background-image: none; */
        background-size: 70%;
         /* width: auto; */
    }
    .sound-line-bg.bottom{
        background-position:280px 45px ;
    }
    div#expolre-section-video {
        padding: 100px 10px;
    }
    #section-6 h2{
        font:normal normal bold 34px/42px 'Lexend Deca', 'sans-serif';
    }
    ul.faq-section li:after{
        top: 25px;
    }
    .icon-expand{
        margin-right: 0;
    }
    .swiper.review-swiper{
        height: 520px;
    }
    .explore-section{
        margin: 30px -12px 0 -12px;
    }
    .explore-section-right{
        border-radius: 0;
        margin: 0 -10px;
        padding: 100px 20px;
    }
    .swiper.explore-swiper,
    .swiper.explore-swiper-video {
        height: auto;
    }
    
    .explore-slider-content img {
        width: 46px;
        height: 46px;
        display: inline-flex;
    }
    .explore-slider-content h3{
        display: inline-flex;
        position: relative;
        top: 5px;
        left:5px;
    }
    
    .swiper.explore-swiper .swiper-slide,
    .swiper.explore-swiper-video .swiper-slide {
        top: 0;
    }
    .explore-slider-content {
        padding: 50px 30px 0 30px;
    } 
    div#explore-icon-left {
        left: 40px;
        top: 25%;
    }
    div#explore-icon-right {
        right: 40px;
        top: 25%;
    }
    .swiper.explore-swiper .swiper-pagination-bullet.swiper-pagination-bullet-active{
        background: #FFD23C;
    }
    .swiper.explore-swiper .swiper-pagination-bullet {
        height: 10px;
        width: 10px;
        background: #F4F4F4;
        opacity: 1;
    }
  }



/* NEWLY ADDED */
#section-1{
    background-color: #8E5AFF;
    background: var(--bg-1);
    background-size: cover;
    background-position: bottom;
}
.header-text{
    padding-left: 15px;
}
.header-text h1{
    font: normal normal 800 45px/55px 'Inter', sans-serif;
    letter-spacing: 0px;
    color: #FFFFFF;
}
.header-text .btn-primary{
    color: #1D1D1D;
    background: transparent linear-gradient(99deg, #FFF28D 0%, #FFCE00 100%) 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 28px;
    width: 320px;
    height: 56px;
}
img.hero-graphic-image{
    width: 100%;
}
.header-section{
    padding: 300px 0 200px 0;
    margin-top: -80px;
}
.header-section h6{
    font: normal normal normal 24px/32px 'Inter', sans-serif;
    letter-spacing: 0px;
    color: #F2EAFF;
}
.header-section span.disclaimer-txt{
    font: normal normal normal 14px/17px 'Inter', sans-serif;
    letter-spacing: 0px;
    color: #F2EAFF;
}
#section-2{
    background-color: #FAF4FF;
    padding: 70px;
}
img.Brand-Logos{
    width: 65%;
    margin-top: 60px;
    max-width: 700px;
}
img.Badges-Stack{
    /* width: 100%; */
    margin-top: 60px;
}
#section-2 h5,
#section-3 h5{
    font: normal normal normal 20px/38px 'Inter', sans-serif;
    letter-spacing: 0px;
    color: #1D1D1D;
    margin:0;
}
#section-3{
    padding:70px 0;
}
#section-3 h2{
    margin: 140px 0 60px 0;
    font: normal normal 800 55px/65px 'Inter', sans-serif;
    letter-spacing: 0px;
    color: #1D1D1D;
}
#section-4 h2{
    font: normal normal 800 55px/65px 'Inter', sans-serif;
    letter-spacing: 0px;
    color: #1D1D1D;
}
.explore-section .nav.flex-column.hide-md{
    border-left: 8px solid #EDEDED;
    border-radius: 8px;
}
.explore-section ul li:after{
    display: block;
    content:'';
    background: transparent radial-gradient(closest-side at 69% 27%, #7D56FF 0%, #B861FF 100%) 0% 0% no-repeat padding-box;
    width: 5px;
    height: 100%;
    border-radius: 4px;
}
#section-11, #section-9{
    background: #FFFF 0% 0% no-repeat padding-box;
}
#section-9{
    padding-top:0;
}

.more-pages-section h2{
    text-align: left;
    font: normal normal bold 24px/32px 'Inter', sans-serif;
    letter-spacing: 0.19px;
    color: #2D2D2D;
}
.more-pages-section .card{
    box-shadow: none;
    background-color: transparent;
}
.more-pages-section .card-header{
    border: none;
    background-color: transparent;
}
#section-8{
    padding-bottom: 120px;
}
#section-8 .card-section span{
    position: initial;
}
#section-8 .card-section h4{
    margin-bottom: 0;
}
#section-12{
    background: url('https://www.animaker.com/static_2.0/img/subtitlegenerator/CTA BG.svg') 0% 0% no-repeat padding-box;
    background-size: cover;
    padding: 140px 0;
}
#section-12 h2{
    font: normal normal bold 45px/42px 'Inter',sans-serif;
    letter-spacing: 0px;
    color: #FFFFFF;
}
#section-12 h5{
    font: normal normal 300 18px/26px 'Inter',sans-serif;
    letter-spacing: 0px;
    color: #F2EAFF;
}
#section-12 a.btn.btn-primary.btn-lg{
    background: transparent linear-gradient(99deg, #FFF28D 0%, #FFCE00 100%) 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 28px;
    width: 320px;
    height: 56px;
    font: normal normal bold 21px/29px 'Inter',sans-serif;
    letter-spacing: 0px;
    color: #1D1D1D;
}
#section-12 span.disclaimer-txt{
    font: normal normal 300 13px/16px 'Inter',sans-serif;
    letter-spacing: 0px;
    color: #F2EAFF;
}
img.usecase-icons{
    width: 90%;
    margin: auto;
    max-width: none;
    margin-bottom: 40px;
}
#section-6 h2{
    font: normal normal 800 55px/65px 'Inter',sans-serif;
    letter-spacing: 0px;
    color: #1D1D1D;
}
#section-6 h5{
    margin: 5px 0 50px 0;
    font: normal normal 300 24px/32px 'Inter',sans-serif;
    letter-spacing: 0px;
    color: #54536C;
}
#section-6 .container{
    width: 70%;
}
#section-6 h3{
    font: normal normal bold 26px/32px 'Inter',sans-serif;
    letter-spacing: 0px;
    color: #1D1D1D;
    margin: 12px 0 25px 0;
}
#section-6 article{
    font: normal normal 300 18px/30px 'Inter',sans-serif;
    letter-spacing: 0px;
    color: #54536C;
}
#section-6 .step{
    background: #F8F8F8 0% 0% no-repeat padding-box;
    border-radius: 12px;
    font: normal normal 500 14px/32px 'Inter',sans-serif;
    letter-spacing: 0px;
    color: #54536C;
    padding: 3px 14px;
}
#section-6, #section-4{
    padding: 60px 0;
}
.owl-carousel.mobileSlider img {
    width: 100%;
}
.reasons h5 {
    font-size: 2.25rem;
    line-height: 1.4;
    text-align: center;
    color: #1D1D1D;
    margin: 0 auto;
  }
  
  .reasons h5 + p {
    font-size: 1.125rem;
    line-height: 1.4;
    color: #54536C;
    text-align: center;
    margin: 0 auto 70px;
  }
  
  .reasons .flex {
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  
  .reasons .desktopSlider {
    display: -webkit-box;
    display: -ms-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        /* justify-content: space-between; */
            justify-content: initial;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    /* width: 35%; */
    width: 42%;
    border-left: 8px solid #EDEDED;
    border-radius: 4px;
    /* margin: 70px 0 70px 15px; */
    /* margin:82px 0 82px 15px; */
  }
  .reasons.cl-ir .desktopSlider{
    margin:70px 0 70px 15px;
  }
  .reasons.cr-il .desktopSlider{
    /* margin:82px 0 82px 15px; */
    margin:120px auto 120px 50px;
    width: 40%;
  }
  
  .reasons .desktopSlider .cust-nav {
    position: relative;
    cursor: pointer;
    padding: 0 0 10px 46px;
    margin:0;
  }
  /* .reasons.cl-ir .desktopSlider .cust-nav{
    padding: 0 0 10px 46px;
  }
  .reasons.cr-il .desktopSlider .cust-nav{
    padding: 0 0 10px 46px;
  } */
  .reasons .desktopSlider .cust-nav.active{
    padding-top: 20px;
    /* margin:0; */
  }
  
  .reasons .desktopSlider .cust-nav:before {
    content: '';
    border: 0px;
    width: 8px;
    height: 0%;
    left: -7.5px;
    top: 0px;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    /* background: #f67062;
    background: linear-gradient(135deg, #f67062 0%, #fc5296 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f67062', endColorstr='#fc5296',GradientType=1 ); */
    background: #7D56FF;
    background: transparent radial-gradient(closest-side at 69% 27%, #7D56FF 0%, #B861FF 100%) 0% 0% no-repeat padding-box;
    border: 1px solid #00000000;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7D56FF', endColorstr='#B861FF',GradientType=1 );
    position: absolute;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
  }

  .reasons .desktopSlider .cust-nav .title,
  .reasons .mobileSlider .title {
    font: normal normal 500 18px/40px 'Inter',sans-serif;
    letter-spacing: 0px;
    color: #898989;
    margin: 0;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
  }
  
  .reasons .desktopSlider .cust-nav .title + p,
  .reasons .mobileSlider p {
    margin: 0;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    height: 0px;
    overflow: hidden;
    line-height: 1.4;
    font: normal normal 300 16px/30px 'Inter',sans-serif;
    letter-spacing: 0px;
    color: #54536C;
  }
  
  .reasons .desktopSlider .cust-nav.active:before {
    height: 100%;
    bottom: 0;
  }
  
  .reasons .desktopSlider .cust-nav.active .title {
    color: #1D1D1D;
    font-size: 30px;
    font-weight: 800;
    margin: -5px 0 20px 0;
  }
  .reasons .desktopSlider .cust-nav .title br{
    display: none;
  }
  .reasons .desktopSlider .cust-nav.active .title br{
    display: block;
  }
  
  .reasons .desktopSlider .cust-nav.active .title + p,
  .reasons .mobileSlider .cust-nav.active p {
    /* height: 86px; */
    /* height: 125px; */
    height: auto;
    /* margin: 7px 0; */
  }
  
  .reasons .mobileSlider {
    /* margin-left: auto; */
    /* width: 670px; */
    width: 50%;
    display: -webkit-box;
    display: -ms-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .reasons.cl-ir{
    margin-left: auto;
  }
  .reasons.cr-il{
    margin-left: auto;
  }
  .reasons.cr-il .flex{

  }
  .reasons .mobileSlider .title {
    display: none;
  }
  
  .reasons .mobileSlider p {
    display: none;
  }
  
  .reasons .mobileSlider .item img {
    /* margin: 30px 0; */
    max-width: 100%;
    height: auto;
  }
  .header-section h6,
  .header-section span.disclaimer-txt{
    font-weight: 300;
  }
  img.usecase-icons.cutomise{
    margin-bottom: 30px;
  }
  #subtitle2 h2{
    margin-bottom: 60px;
  }
  #section-11{
    padding-top: 30px;
  }
  .card-section{
    max-width: 1046px;
  }
.card-section article{
    font: normal normal 300 18px/30px 'Inter',sans-serif;
    letter-spacing: 0px;
    color: #54536C;
  }
.card-section h4{
    font: normal normal bold 16px/24px 'Inter',sans-serif;
    letter-spacing: 0px;
    color: #1D1D1D;
  }
.card-section span{
    font: normal normal 300 12px/24px 'Inter',sans-serif;
    letter-spacing: 0px;
    color: #54536C;
  }
  .card-section .card{
    padding: 30px;
    height: 500px;
  }
  .swiper{
    height: 670px;
  }
  .swiper-slide{
    cursor: default;
  }
  
  
  h2{
    font: normal normal 800 55px/46px 'Inter',sans-serif;
    letter-spacing: 0px;
    color: #1D1D1D;
  }
  ul.faq-section li a.nav-link{
    font: normal normal 300 18px/21px 'Inter',sans-serif;
    letter-spacing: 0px;
    color: #54536C;
  }
  ul.faq-section li[aria-expanded='true'] a.nav-link,
  ul.faq-section li.active a.nav-link{
    font-weight: bold;
  }
  .faq-section-content{
    font: normal normal 300 18px/30px 'Inter',sans-serif;
    letter-spacing: 0px;
    color: #54536C;
  }
  .card-content h4{
    font: normal normal bold 20px/25px 'Inter',sans-serif;
    letter-spacing: 0.16px;
    color: #2D2D2D;
  }

  header{
    height: 80px;
    background: transparent;
    width: 80%;
    left: 10%;
    padding: 0;
  }
  .navigation{
    padding: 0;
  }
  .submenu-indicator-chevron{
    border-color: white;
  }
  header.scrolled{
    /* background: transparent; */
    box-shadow: none;
  }
  .header_area.scrolled .submenu-indicator-chevron{
    border-color: black;
  }
  header .nav-menu > li > a{
    font: normal normal normal 15px/19px 'Inter',sans-serif;
    letter-spacing: 0px;
    color: white;
  }
  header.scrolled .nav-menu > li > a{
    color: #2D2D2D;
  }
  header.scrolled {
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    /* background-color: rgba(255, 255, 255, 0.5);   */
    background-color: #f8e2fd;
    box-shadow: 0px 0px 6px #D689FFB9;
    border: 1px solid rgb(255 255 255 / 50%);
    border-radius: 0px 0px 15px 15px;
    opacity: 1;
    /* width: 80%; */
    /* left: 10%; */
    /* height:80px; */
  }
  header .nav-brand img{
    margin-left: 15px;
    width: 80%;
  }
  header.scrolled .nav-brand img{
    content: url('https://www.animaker.com/static_2.0/img/subtitlegenerator/Logo@2x.png');
  }
  header .nav-menu li a.signup{
    background: transparent linear-gradient(110deg, #FFF28D 0%, #FFCE00 100%) 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #DD92EB9A;
    border: 1px solid #FFF0AA;
    border-radius: 28px;    
    height: 37px;
    width: 96px;
    font: normal normal bold 12px/15px 'Inter',sans-serif;
    letter-spacing: 0px;
    color: #1D1D1D;
  }
  .collapse-action-icon{
    content: url('https://www.animaker.com/static_2.0/img/subtitlegenerator/icon-expand@2x.png');
    width: 21px;
    display: block;
    cursor: pointer;
  }
  ul.faq-section li[aria-expanded='true'] .collapse-action-icon,
  ul.faq-section li.active .collapse-action-icon{
    content: url('https://www.animaker.com/static_2.0/img/subtitlegenerator/icon-collapse@2x.png');
  }
  ul.faq-section li a.nav-link{
    cursor: default;
  }

  @media (max-width: 991.98px){
    .animaker-subtitle.no-scroll header{
        height: 100%;
      }
      .animaker-subtitle.no-scroll header .nav-menu > li > a{
        color:#1D1D1D;
      }
    header{
        width: 100%;
        left:0;
    }
    .navigation-portrait{
        height: auto;
    }
    .nav-brand{
        margin-left: 0;
    }
    .header-section{
        margin-top: 0;
        padding: 80px 0;
    }
    header.scrolled{
        border-radius: 0;
    }
    #section-2{
        padding: 40px 0;
    }
    img.Brand-Logos{
        width: 100%;
        margin-top: 30px;
    }
    #section-3{
        padding: 40px 0;
    }
    img.Badges-Stack{
        width: 100%;
        margin-top: 30px;
    }
    #section-3 h2{
        margin: 60px 0 20px 0;
        font:normal normal 800 35px/45px 'Inter', sans-serif
    }
    #section-6,
    #section-4{
        padding: 30px 0;
    }
    #section-6 .container{
        width: 100%;
    }
    #section-6 h5{
        margin-bottom: 20px;
    }
    img.usecase-icons{
        margin-top: 40px;
    }
    h2,
    #section-6 h2,
    #section-4 h2,
    #section-12 h2{
        font:normal normal 800 35px/45px 'Inter',sans-serif
    }
    .more-pages-section h2{
        text-align: center;
    }
    #section-8 {
        padding-bottom: 60px;
    }
    .swiper.review-swiper{
        height: 630px;
    }
    #section-12{
        padding: 60px 0;
    }
    .reasons .desktopSlider{
        display: none;
    }
    .reasons .mobileSlider .title,
    .reasons .mobileSlider p{
        display: block;
    }
    .reasons .mobileSlider{
        width: 100%;
        padding-bottom: 30px;
    }
    #subtitle2 h2,
    .reasons .mobileSlider .title {
        margin-bottom: 30px;
    }
    .reasons .mobileSlider .title{
        font:normal normal 500 18px/28px 'Inter',sans-serif;
    }
    .reasons .mobileSlider p{
        margin-top: 30px;
        height: auto;
    }
    .reasons .mobileSlider .owl-nav {
        position: absolute;
        top: 97.5%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
    .reasons .mobileSlider .owl-nav .owl-prev,
    .reasons .mobileSlider .owl-nav .owl-next{
        display: inline-block;
        padding: 0 10px !important;
    }
    .reasons .mobileSlider .owl-nav .owl-prev span{
        display: block;
        content: url('https://www.animaker.com/static_2.0/img/subtitlegenerator/icon-left-arrow.svg');
    }
    .reasons .mobileSlider .owl-nav .owl-next span{
        display: block;
        content: url('https://www.animaker.com/static_2.0/img/subtitlegenerator/icon-right-arrow.svg');
    }
    .reasons .mobileSlider .owl-stage-outer{
        padding-bottom: 40px;
    }
    ul.faq-section li a.nav-link .flex-grow-1{
        text-align: left;
    }
    .faq-section-content{
        text-align: left;
    }
    ul.faq-section li.active .collapse-action-icon {
        margin-top: -10px;
    }
  }


  @media (max-width: 767.98px){

  }
  