
:root{
    /* --bg-1:transparent url('../static_2.0/img/voicegenerator/Hero BG.svg') 0% 0% no-repeat padding-box; */
    /* --bg-2:transparent url('../static_2.0/img/voicegenerator/CTA BG.svg') 0% 0% no-repeat padding-box; */
    /* --bg-3:transparent url('../static_2.0/img/voicegenerator/Floral\ BG.svg') 0% 0% no-repeat padding-box; */
    --bg-4: #FFF3F8 0% 0% no-repeat padding-box;
    --bg-5: #FFE8F2 0% 0% no-repeat padding-box;
    --bg-6: #FAFAFA 0% 0% no-repeat padding-box;
    --bg-7:transparent linear-gradient(178deg, #F67062 0%, #FC5296 100%) 0% 0% no-repeat padding-box;
    --bg-8:#212121 0% 0% no-repeat padding-box;
    --bg-9: #FFFFFF 0% 0% no-repeat padding-box;
    --bg-10: transparent url('../static_2.0/img/voicegenerator/icon-arrow-white.svg') 0% 0% no-repeat padding-box;
    --bg-11: transparent url('../static_2.0/img/voicegenerator/Logo.svg') 0% 0% no-repeat padding-box;
    --bg-12: transparent url('../static_2.0/img/voicegenerator/logo-scrolled.svg') 0% 0% no-repeat padding-box;
    --bg-13: transparent url('../static_2.0/img/voicegenerator/icon-arrow-black.svg') 0% 0% no-repeat padding-box;
    --btn-primary-color:transparent linear-gradient(180deg, #FFDA60 0%, #FF9241 100%) 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%);
    --lato-regular-15px:normal normal normal 15px/18px 'Lato', sans-serif;
    --lato-regular-15px-27px:normal normal normal 15px/27px 'Lato', sans-serif;
    --lato-regular-15px-33px:normal normal normal 15px/33px 'Lato', sans-serif;
    --lato-regular-15px-34px:normal normal normal 15px/34px 'Lato', sans-serif;
    --lato-regular-18px: normal normal normal 18px/24px 'Lato', sans-serif;
    --lato-regular-18px-22px: normal normal normal 18px/22px 'Lato', sans-serif;
    --lato-regular-16px: normal normal normal 16px/24px 'Lato', sans-serif;
    --lato-regular-16px-27px: normal normal normal 16px/27px 'Lato', sans-serif;
    --lato-regular-12px: normal normal normal 12px/24px 'Lato', sans-serif;
    --lato-bold-15px: normal normal bold 15px/18px 'Lato', sans-serif;
    --lato-bold-18px: normal normal bold 18px/24px 'Lato', sans-serif;
    --lato-bold-16px: normal normal bold 16px/24px 'Lato', sans-serif;
    --lato-bold-21px: normal normal bold 21px/25px 'Lato', sans-serif;
    --lato-bold-26px: normal normal bold 26px/44px 'Lato', sans-serif;
    --lato-bold-26px-30px: normal normal bold 26px/30px 'Lato', sans-serif;
    --lato-bold-24px: normal normal bold 24px/46px 'Lato', sans-serif;
    --lato-bold-24px-17px: normal normal bold 24px/17px 'Lato', sans-serif;
    --lato-bold-32px: normal normal bold 32px/42px 'Lexend Deca', sans-serif;
    --lato-900-24px-17px: normal normal 900 24px/17px 'Lato', sans-serif;
    --lato-900-24px-34px: normal normal 900 24px/34px 'Lato', sans-serif;
    --lato-900-40px-24px: normal normal 900 40px/24px 'Lato', sans-serif;
    --lato-900-22px-17px:normal normal 900 22px/17px 'Lato', sans-serif;
    --DM-serif-regular-40px: normal normal normal 40px/48px 'DM Serif Display', sans-serif;
    --DM-serif-regular-36px: normal normal normal 36px/44px 'DM Serif Display', sans-serif;
    --PT-sans-regular-18px: normal normal normal 18px/24px 'PT Sans', sans-serif;
    --Open-sans-regular-13px: normal normal normal 13px/18px 'Open Sans', sans-serif;
    --Open-sans-regular-15px: normal normal normal 15px/20px 'Open Sans', sans-serif;
    --box-shadow-value-1:0px 0px 6px #00000014;
    --box-shadow-value-2:0px 3px 6px #00000029;
}

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

nav.navbar{
    padding: 0;
}
.navbar-nav{
    -webkit-box-align: center;
    align-items: center;
}
nav.navbar .nav-link,
.navbar-dark .navbar-nav .nav-link,
.navbar-dark .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link,
.navbar-light .navbar-nav .nav-link:hover{
    /* color:var( --text-color-4); */
    color:var( --text-color-1);
    font:var(--Open-sans-regular-15px);
}
#collapsibleNavbar > ul > li > div > ul > li > a.nav-link{
    color:var(--text-color-1);
    white-space: nowrap;
}
#collapsibleNavbar > ul > li > div > ul > li > a.nav-link:hover{
    color:var(--text-color-9);
    background-color: transparent;
}
nav.navbar li.nav-item {
    padding: 0 15px;
}
nav.navbar .btn-primary{
    padding: 0px 24px;
    justify-content: center;
    height: 32px;
    margin: 4px 0 0 0;
    font:var(--lato-bold-15px);
    background: #FFDA60;
    color: #000;
    box-shadow: none;
}
nav.navbar ul >li .dropdown-menu{
    opacity: 0;
    display: -webkit-box;
    display: -ms-box;
    display: -ms-flexbox;
    display: flex;
    transform: scaleY(0);
    -webkit-transform: scaleY(0);
    -moz-transform: scaleY(0);
    transition: all .3s ease-out;
    -webkit-transition: all .3s ease-out;
    -moz-transition: all .3s ease-out;
    margin-top: 0;
    border: 0;
    box-shadow: 0 0 15px rgb(0 0 0 / 15%);
    -webkit-box-shadow: 0 0 15px rgb(0 0 0 / 15%);
    -moz-box-shadow: 0 0 15px rgba(0,0,0,.15);
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;

}
#collapsibleNavbar > ul > li:nth-child(2):hover >.dropdown-menu {
    opacity: 1;
    display: block;
    transform: scaleY(1);
    -webkit-transform: scaleY(1);
    -moz-transform: scaleY(1);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 0;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    padding: 20px;
 }
.collapse.navbar-collapse{
    justify-content: right;
}
nav.navbar .navbar-logo{
    /* content: url("../static_2.0/img/voicegenerator/Logo.svg"); */
    width: 200px;
    /* display: block; */
}
nav.navbar.fixed-top{
    background: var(--bg-9);
    transition: all .3s linear;
    -webkit-transition: all .3s linear;
    box-shadow: var(--box-shadow-value-1);
}
nav.navbar.fixed-top .navbar-logo{
    /* content: url("../static_2.0/img/voicegenerator/logo-scrolled.svg"); */
}
nav.navbar.fixed-top .nav-link{
    color:var(--text-color-5);
}

 .navbar-nav .dropdown-menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: block;
}
.navbar-nav .dropdown-item{
    padding: .45rem 1rem;
}
.navbar-nav .dropdown:hover .dropdown-menu ul li a.nav-link:hover{
    color:var(--text-color-9);
    background-color: transparent;
}
ul.navbar-nav > li > a.nav-link:hover{
    text-decoration: underline;
}
nav ul.navbar-nav > li:last-child > a.nav-link:hover{
    text-decoration: none;
}
.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;
}

.video-maker #section-1{
    /* background-color: #40c495; */
    /* background-image:  url('../static_2.0/img/voicegenerator/Banner\ bottom.png'), url('../static_2.0/img/voicegenerator/Banner\ top.png'), url('../static_2.0/img/voicegenerator/Grid.png');
    background-position: bottom -140px center, top 0px center,  center;
    background-repeat: no-repeat;
    background-size: 85%, 85%, 100%;*/
    height: 65.09vw;
    /* background: url('../static_2.0/img/voicegenerator/instagram-video-bg.svg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat; */
}
nav.navbar.fixed-top + .header-section{
    /* padding-top: 22%; */
    margin-top: 90px;
}
.dark-bg{
    /* background:var(--bg-1); */
    /* background-size: cover; */
    color: var(--text-color-4) !important;
}
.light-bg{
    color: var(--text-color-5);
}
/* #section-4.dark-bg,
#section-8.dark-bg,
#section-12.dark-bg{
    background:var(--bg-2);
    background-size: cover;
    padding: 90px 0;
} */
/* .sub-section{
    background: var(--bg-3);
    background-size: cover;
    margin-top: 50px;
    background-position: center;
    padding: 75px 50px;
}
.sub-section h3{
    font:var(--lato-bold-26px-30px);
    margin: 10px 0 0;
} */
.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{
    font:var(--lato-bold-32px);
    margin-bottom: 20px;
}
#section-12 h5{
    font:var(--PT-sans-regular-18px);
}
#section-11 h3
#section-12 h3{
    font: var(--lato-bold-24px-17px);
    letter-spacing: 0px;
    color:var(--text-color-2);
    opacity: 1;
}
.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;
}
h1{
    color: #1D1D1D;
    font: normal normal bold 75px/80px 'Lexend Deca', 'sans-serif';
    letter-spacing: -1.5px;
}
h6{
    margin: 30px 0;
    font: normal normal normal 18px/32px Open Sans;
    letter-spacing: 0px;
    color: #54536C;
}
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{
    /* font:var(--Open-sans-regular-13px); */
    /* position: absolute;
    transform: translate(50px, 0px); */
    /* width: 320px; */
    text-align: center;
    display: block;
}
.header-text{
    padding-left: 80px;
}
h2{
    font: normal normal bold 48px/56px 'Lexend Deca', 'sans-serif';
    letter-spacing: 0px;
    color: #1D1D1D;
    text-align: center;
    margin-bottom: 25px;
}
h5{
    font: normal normal normal 18px/32px 'Open Sans', 'sans-serif';
    letter-spacing: 0px;
    color: #54536C;
    text-align: center;
    margin-bottom: 20px;
}
#section-2 h5{
    margin-bottom: 80px;;
}
#section-2,
#section-6,
#section-8{
    padding: 100px 0;
    /* background-color:#fbf9fe; */
}
#section-2 .container,
#section-3 .container,
#section-5 .container,
#section-7 .container{
    /* width: 70%; */
}
#section-6 h3{
    margin-bottom: 16px;
}
#section-8{
    background: #FAFAFA 0% 0% no-repeat padding-box;
    padding: 120px 0 0 0;
}
.bottom-logos{
    margin: 50px 0;
}
.template-image-gallery{
    padding-top: 50px;
}
.template-image-gallery .col{
    padding: 0;
}
.template-image-gallery .col+.col{
    padding-left: 18px;
}
.template-image{
    width: 100%;
    -webkit-box-shadow: var(--box-shadow-value-2);
    box-shadow: var(--box-shadow-value-2);
    border-radius: 5px;
}
.video-template{
    box-shadow: 0 3px 6px #00000029;
    -webkit-box-shadow: 0 3px 6px #00000029;
    border-radius: 5px;
    position: relative;
    width: 100%;
}
span.play-icon{
    position: relative;
    /* cursor: pointer; */
}
.video-container,
.videoSection{
    position: relative;
}
.videoSection video {
    width: 100%;
    height: 100%;
    /* border-radius: 4px; */
    /* border-bottom-left-radius: 5px; */
    /* box-shadow: 0 3px 6px #0000001A */
    padding: 10px;
}
.video-container:hover>img {
    opacity: .5;
}
.moments_menus{
    opacity: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    text-align: center;
    transform: translateX(-50%) translateY(-50%);
}
.video-container:hover>.moments_menus {
    opacity: 1;
}
span.play-icon:after {
    display: block;
    content: url("../static_2.0/img/voicegenerator/play-icon.svg");
    position: absolute;
    left: 100%;
    transform: translate(-100%, -100%);
    width: 50px;
    height: 50px;
}
.edit-template-icon{
    display: inline-block;
    width: 70px;
    height: 70px;
    background-image: url('../static_2.0/img/voicegenerator/edit-icon.svg');
    cursor: pointer;
}
.play-template-icon{
    display: inline-block;
    width: 70px;
    height: 70px;
    background-image: url('../static_2.0/img/voicegenerator/play-icon.svg');
    cursor: pointer;
}
.video-container:hover>span.play-icon::after{
    display: none;
}
.play-button {
    height: 50px;
    width: 50px;
    background-image: url('../static_2.0/img/voicegenerator/video_play_icon.png');
    background-repeat: no-repeat;
    background-position: 0 0;
    background-size: 100%;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    position: absolute;
    cursor: pointer;
    transform: translate(10%, 10%);
}
#section-3{
    background-color: #ECE5FF;
}
#section-3,
#section-4{
    padding: 120px 0;
}
#section-5{
    padding: 120px 0 200px 0;
    background-color: #FAFAFA;
}
#section-3 h2{
    /* max-width: 720px; */
    /* margin: 0 auto 0 auto;   */
}
.template-gallery-section {
    /* width: 90%; */
    margin: 40px auto auto;
}
.template-gallery-section > *{
    padding: 10px;
    display: flex;
    flex-direction: column;
}
.template-gallery-section a{
    cursor: pointer;
    text-align: center;
    color:#a2a2a2;
    text-decoration: none;
    margin: 60px auto;
}
.template-gallery-section a:hover{
    color: #2d2d2d;
}
#section-4 .row > * {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
#section-4 .row > div:nth-child(5),
#section-4 .row > div:nth-child(6){
    /* margin-top: 100px; */
}
.article-section-1{
    /* padding-top:150px; */
}
.article-section-1 + .article-section-1{
    margin-top: 90px;
}
.header-section .row > *,
/* #section-2 .row > *, */
.row.article-section-1 > *,
.row.reasons-section > *{
    display: flex;
    flex-direction: column;
    justify-content: center;
    /* align-items: center; */
}
#section-2 .row > *{
    /* position: relative; */
}
.animaker_users_description {
    background-image: linear-gradient(to right, #9458F0, #4E41F1);
    background-size: cover;
    height: 100%;
    width: 100%;
    padding: 75px 0;
    position: relative;
}
.animaker_users_description span{
    text-align: center;
}
figcaption{
    color: #FFCD01;
    /* font-family: 'PT Sans'!important; */
    font-size: 32px;
    padding-top: 20px;
    font-weight: 600;
}
figcaption .btn-primary:hover{
    /* color: var(--text-color-5); */
}
.template-image-gallery > .col-lg-3.col-md-6:hover .template-image{
    opacity: 0.5;
}
.template-image-gallery > .col-lg-3.col-md-6:hover figcaption{
    /* z-index: 1; */
    /* -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    visibility: visible; */

}
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;
}
ul.collapsable-menu-vertical{
    border-left: 1px solid var(--border-color-1);
}
ul.collapsable-menu-vertical li span.border-image{
    background: var(--bg-7);
}
ul.collapsable-menu-vertical li a.nav-link{
    font: var(--lato-bold-24px);
    letter-spacing: 0.19px;
    color:var(--text-color-6);
    cursor: pointer;
    padding: 16px 16px 16px 32px;
}
ul.collapsable-menu-vertical li[aria-expanded = 'true'] a.nav-link{
    color:var(--text-color-1);
    padding-left: 26px;
}
ul.collapsable-menu-vertical li[aria-expanded = 'true']{
    border: 6px solid transparent;
    border-image-source: var(--border-color-3);
    border-image-repeat: none;
    border-image-slice: 1;
    border-image-width: 0 0 0 6px;
    border-image-outset:3px;
}
ul.collapsable-menu-vertical li div.collpase-sub-text{
    font: var(--lato-regular-16px);
    letter-spacing: 0px;
    color:var(--text-color-2);
    padding: 0;
    /* max-width: 260px; */
}
ul.collapsable-menu-vertical li div.collpase-sub-text img{
    display: none;
}
.reasons-section{
    padding: 90px 0 0 0;
}
.reasons-image-section{
    align-items: center;
}
.reasons-image-section .collapsing{
    transition: none;
}
#section-9{
    padding: 120px 0;
}
/* .sub-section .col-lg-4{
    margin-top: 100px;
}
.sub-section article{
    max-width: 267px;
    color: var(--text-color-2);
} */
#section-10{
    background: var(--bg-6);
    padding: 70px 0 0 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%;

}
/* .card-section #language-slider > .swiper-slide.swiper-slide-visible.swiper-slide-active span.play-button, */
.card-section #language-slider > .swiper-slide.swiper-slide-visible.swiper-slide-active video{
    /* z-index: 9; */
}
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'] {
    background: #F4F4F4 0% 0% no-repeat padding-box;
    border-radius: 4px;
}
ul.faq-section li[aria-expanded='true'] .icon-expand{
    display: none;
}
.icon-expand{
    cursor: pointer;
}
.icon-collapse{
    display: none;
    cursor: pointer;
}
ul.faq-section li[aria-expanded='true'] .icon-collapse{
    display: block;
}

ul.faq-section li[aria-expanded='true'] 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{
    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;
}
/* footer{
    font:var(--lato-regular-15px-34px);
    color:var(--text-color-8);
}
footer h3{
    padding-bottom: 30px;
    color:var(--text-color-4);
    margin: 0;
    font-weight: 600;
} */

.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%;
}
/* footer .nav-item a{
    color:#777;
    text-decoration: none;
}
img.show-more{
    margin:50px auto;
    cursor: pointer;
}
footer h4{
    font:var(--lato-900-24px-34px);
    color:var(--text-color-4);
    margin-bottom: 24px;
}
footer h5{
    font:var(--lato-regular-18px);
    color:var(--text-color-8);
    letter-spacing: 0px;
    text-align: left;
    margin:0;
    margin-top: -5p
}
footer h5 span{
    font:var(--lato-bold-18px);
    color:var(--text-color-9);
}
footer h6{
    font:var(--lato-regular-15px-33px);
    color:var(--text-color-8);
    margin:0;
}
footer address{
    margin-top: 18px;
    font:var(--lato-regular-15px-27px);
    color:#777;
}
ul.social-icons-list li{
    display: flex;
}
ul.social-icons-list li + li{
    margin-left: 15px;
}
ul.social-icons-list li:first-child{
    padding: 0;
}
.footer-logo{
    margin: 80px 0 26px 0;
} */
h7{
    font:var(--lato-900-40px-24px);
    color:var(--text-color-4);
}
h7 span{
    color:var(--text-color-9);
}
/* span.copy-right-text{
    font:var(--lato-regular-16px-27px);
}
span.copy-right-text span{
    color:var(--text-color-10)
} */
.navbar-nav .dropdown-toggle::after{
    background: var(--bg-13);
    display: inline-block;
    height: 10px;
    width: 10px;
    margin-top: 0px;
    border: none;
    position: relative;
    top: 7px;
}
.fixed-top .navbar-nav .dropdown-toggle::after{
    background: var(--bg-13);
}
.navbar-nav .dropdown-toggle:hover:after {
    top: 4px;
    transform: rotate(180deg);
}
.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;
}
  .swiper-slide.swiper-slide-visible.swiper-slide-active{
    /* cursor: pointer; */
  }
  .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;
}
.custom-swiper-btn-left{
    /* padding-right: 50px; */
}
.navbar-nav .dropdown-menu.show{
    animation: rotateMenu 600ms ease-in-out forwards;
    transform-origin: top center;
}
button.navbar-toggler{
    border: none;
    color:transparent;
}
button.navbar-toggler:focus{
    box-shadow: none;
}
/* footer ul.nav.flex-column li{
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
}
footer ul li a{
    position: relative;
}
footer ul li a:before {
    content: '';
    border: 0px;
    width: 100%;
    height: 1.5px;
    background: #F1821E;
    position: absolute;
    left: 0px;
    bottom: -5px;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    transform: scaleX(0);
    -webkit-transform: scaleX(0);
    -moz-transform: scaleX(0);
    -webkit-transform-origin: left;
    transform-origin: left;
  }
footer ul.nav.flex-column li:hover {
    color: #fff;
    text-decoration: none;

}
footer ul li a:hover {
    text-decoration: none;
    color: #fff;
}
footer ul li a:hover:before {
    transform: scaleX(1);
    -webkit-transform: scaleX(1);
    -moz-transform: scaleX(1);
} */

.reasons-section .accordion-item,
.faq-section .accordion-item{
    background: none;
    border:none;
}
.icon-expand{
    content:url('../static_2.0/img/voicegenerator/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;
}
/* footer h2{
    color:#F5811A;
    font: var(--lato-bold-26px);
    text-align: left;
    margin-bottom: 50px;
}
.footer-section-1{
    background-color: #24202f;
    padding: 100px 0 70px 0;
}
.footer-section-2{
    background-color: #2b2538;
    padding: 100px 0 70px 0;
} */
.show-md{
    display: none;
}
.hide-md{
    display: block;
}
ul.collapsable-menu-vertical{
    width: 100%;
    padding-bottom: 70px;
}
ul.collapsable-menu-vertical li.accordion-item{
    border: none;
}

/* HEADER MOBILE ICON CSS */
.video_mobile_wrap{
    width: 300px;
    height: 600px;
    margin: 0 auto;
    background: #fff;
    border-radius: 25px;
    position: relative;
}
.video_mobile_wrap_header{
    width: 100%;
    text-align: center;
    padding-top: 10px;
    margin-bottom: 20px;
}
.header_circle1{
    height: 15px;
    width: 15px;
    background-color: #837FE5;
    border-radius: 50%;
    display: inline-block;
    vertical-align: bottom;
    /* margin: 0 10px; */
    margin-right: 5px;
}
.header_circle2{
    height: 7px;
    width: 7px;
    background-color: #837FE5;
    border-radius: 50%;
    display: inline-block;
    vertical-align: text-bottom;
    margin-right: 5px;
}
.header_circle3{
    height: 9px;
    width: 70px;
    background-color: #837FE5;
    border-radius: 30px;
    display: inline-block;
    vertical-align: text-bottom;
}
.header_circle4{
    height: 30px;
    width: 30px;
    background-color: #837FE5;
    border-radius: 50%;
    display: inline-block;
    vertical-align: text-bottom;
}
.volume_btn1{
  height: 9px;
  width: 80px;
  background-color: #fff;
  border-radius: 30px;
  display: inline-block;
  vertical-align: text-bottom;
  border-top-left-radius: 30px;
  /* border-bottom-left-radius: 30px; */
  border-top-right-radius: 30px;
  transform: rotate(270deg);
  position: absolute;
  right: -42px;
  top: 156px;
  /* border-radius: 27px; */
}
.volume_btn2{
  height: 9px;
  width: 40px;
  background-color: #fff;
  border-radius: 30px;
  display: inline-block;
  vertical-align: text-bottom;
  border-top-left-radius: 30px;
  /* border-bottom-left-radius: 30px; */
  border-top-right-radius: 30px;
  transform: rotate(270deg);
  position: absolute;
  left: -22px;
  top: 248px;
}
.volume_btn3{
    height: 9px;
    width: 50px;
    background-color: #fff;
    border-radius: 30px;
    display: inline-block;
    vertical-align: text-bottom;
    border-top-left-radius: 30px;
    /* border-bottom-left-radius: 30px; */
    border-top-right-radius: 30px;
    transform: rotate(270deg);
    position: absolute;
    left: -27px;
    top: 173px;
}
.react_icon1{
    display: inline-block;
    position: absolute;
    background: url('../static_2.0/img/voicegenerator/insta_react_icon2.svg') no-repeat;
    top: 10%;
    right: -44%;
    width: 108px;
    height: 100px;
}
.react_icon2{
    display: inline-block;
    position: absolute;
    background: url('../static_2.0/img/voicegenerator/insta_react_icon1.svg') no-repeat;
    top: -12%;
    width: 90px;
    height: 90px;
    left: -41%;
}
.react_icon3{
  display: inline-block;
  position: absolute;
  background: url('../static_2.0/img/voicegenerator/insta_react_icon3.svg') no-repeat;
  top: -15%;
  right: 21%;
  width: 65px;
  height: 65px;
}
.crowd-logo-caption{
    margin: 30px 0 0 15px;
}
.crowd-logo-caption::before{
    content: url('../static_2.0/img/voicegenerator/g2Crowdlogo.svg');
    width: 115px;
    height: 32px;
    top: 10px;
    position: relative;
    text-align: center;
}

ul.step-icon-list {
    display: flex;
    list-style: none;
    margin: auto;
    padding: 0;
    justify-content: center;
    /* max-width: 900px; */
}
ul.step-icon-list > li{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    text-align:center;
}
ul.step-icon-list > li:nth-child(even) {
    margin-top: 30px;
}
.step-icon.sound-wave-icon{
  /* animation:scale-fade-effect; */
  /* animation-duration: 4s; */
  /* animation-iteration-count:1; */
}
img.step-icon.sound-wave-icon.one {
    /* animation-delay: 0s; */
    margin: 0 -30px 0 -5px;
}

img.step-icon.sound-wave-icon.two {
    /* animation-delay: .3s; */
    margin:0 0 0 -35px;
}

img.step-icon.sound-wave-icon.three {
    /* animation-delay: .6s; */
    margin: 0 -5px 0 -5px;
}
ul.step-icon-list > li:nth-child(odd) img.step-icon{
    width: 100%;
    max-width: 120px;
}
.video-caption-txt{
    display: block;
    text-align: center;
    font: normal normal bold 18px/26px 'Open Sans', 'sans-serif';
    letter-spacing: 0px;
    color: #54536C;
    margin-top: 20px;
}
.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;
}
.animaker-users-description{
    background: transparent linear-gradient(113deg, #7D56FF 0%, #B861FF 100%) 0% 0% no-repeat padding-box;
    border-radius: 20px;
    opacity: 0.9;
    padding: 120px 0;
}
.animaker-users-description > div,
#section-6 .container{
    width: 80%;
    margin: auto;
}
.animaker-clients-section{
    padding: 120px 0 0 0;
    width: 90%;
    margin: auto;
}
.animaker-clients-section > *{
    justify-content: center;
    display: flex;
    flex-direction: column;
}
.animaker-users{
    margin-top: 36px;
}
.animaker-clients-section h2,
.animaker-clients-section h5{
    color:black;
    text-align: left;
}
.credit-section h2,
.credit-section h5{
    text-align: left;
}
.credit-section > div:first-child{
    align-items: baseline;
}
.credit-section span.disclaimer-txt{
    /* width: 320px; */
}
.animaker-clients{
    width: 100%;
    max-width: 500px;
    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;
}
.pyramid-image-group{
    height: 320px;
}
.pyramid-image-group .col {
    padding: 0;
    position: relative;
}
.pyramid-image-group img.pyramid-image {
    /* width: 100%; */
    position: absolute;
    bottom: 0;
    /* opacity: 0.5; */
    /* filter:blur(3px); */
}
.pyramid-image-group span{
    font: normal normal medium 20px/56px 'Lexend Deca', 'sans-serif';
    letter-spacing: -0.4px;
    color: #DBDBDB;
}
#section-2 a.btn-primary{
    margin-top: 70px;
}
.pyramid-image-group .col:nth-child(1) img{
    z-index: 1;
    left: 38%;
    right: -54px;
}
.pyramid-image-group .col:nth-child(1) span{
    position: absolute;
    bottom: -25px;
    transform: translate(145px, 10px);
}

.pyramid-image-group .col:nth-child(2) img{
    z-index: 2;
}
.pyramid-image-group .col:nth-child(2) span{
    position: absolute;
    bottom: -25px;
    transform: translate(95px, 10px);
}
.pyramid-image-group .col:nth-child(3) img{
    z-index: 3;
    /* opacity: 1; */
    /* filter:none; */
}
.pyramid-image-group .col:nth-child(3) span{
    position: absolute;
    bottom: -25px;
    transform: translate(125px, 10px);
}
.pyramid-image-group .col:nth-child(4) img{
    z-index: 2;
}
.pyramid-image-group .col:nth-child(4) span{
    position: absolute;
    bottom: -25px;
    transform: translate(125px, 10px);
}
.pyramid-image-group .col:nth-child(5) img{
    z-index: 1;
}
.pyramid-image-group .col:nth-child(5) span{
    position: absolute;
    bottom: -25px;
    transform: translate(70px, 10px);
}
#section-3 h2,
#section-5 h2{
    letter-spacing: -0.96px;
}
.real-section .container{
    width: 70%;
}
.real-section video{
    /* box-shadow: 0px 3px 10px #0000000F; */
    border-radius: 17px;
}
.facebook-videos{
    margin-top: 50px;
}
.swiper-3d .swiper-slide-shadow-left{
    background-image: none;
    background-color: #ffffff78;
    height: 480px;
    top: -80px;
}
.swiper-3d .swiper-slide-shadow-right{
    background-image: none;
    background-color: #ffffff78;
    /* left: 32px; */
}
.pyramid-image-group.swiper{
    height: 600px;
}
.explore-section {
    /* width: 90%; */
    margin: 70px auto auto auto;
}
.explore-section-right{
    background-color: #A87BFF;
    position: relative;
    /* padding: 100px; */
    border-radius: 15px;
}
.explore-section .nav.flex-column.hide-md{
    padding-right: 100px;
}
.sound-line-bg{
    background-image: url('../static_2.0/img/voicegenerator/Sound\ Lines.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    height: 140px;
    width: 500px;
    position: absolute;
    /* animation:scale-fade-effect1; */
    animation-duration: 5s;
    animation-iteration-count:infinite;
}
.sound-line-bg.top{
    background-position: 0 0;
    top: 0;
    left: 0;
}
.sound-line-bg.bottom{
    background-position: 200px 0px;
    bottom:0;
    right: 0;
}
div#expolre-section-video {
    padding: 100px 30px;
}
video#explore-video-list {
    border-radius: 15px;
}
#section-4 .row.explore-list > div:nth-child(1){
    justify-content: flex-start;
    align-items:end;
}
#section-4 .row.explore-list > div:nth-child(2){
    align-items: baseline;
    padding-bottom: 15px;
    /* margin-bottom: 15px; */
}
.explore-list h3{
    margin-top: 7px;
}
.explore-section ul li{
    cursor: pointer;
}
progress {
    border-radius: 7px;
    height: 1px;
    margin-top: 20px;
    width: 100%;
  }
  progress::-webkit-progress-bar {
    /* background-color: yellow; */
    border-radius: 7px;
    background-color: #EDEDED;
    transition: width 1s linear;
  }
  .explore-section ul li.active progress::-webkit-progress-value{
    background-color: #FFD23C;
    border-radius: 7px;
    height: 3px;
    position: relative;
    top: -1px;
    transition: width 1s linear;
  }
  .explore-section ul li.active progress::-moz-progress-bar {
    background-color: #FFD23C;
    border-radius: 7px;
    height: 3px;
    position: relative;
    top: -1px;
    transition: width 1s linear;
  }
  .facebook-videos .human_made,
  .facebook-videos .human_like{
      position: relative;
  }
.facebook-videos .play-button{
    height: 51px;width: 50px;
    background-image: url("../static_2.0/img/voicegenerator/video_play_icon.png");background-repeat: no-repeat;background-position: 0 0;
    background-size: 100%;
    top: 0;
    bottom: 0;left: 0;right: 0;margin: auto;
    position: absolute;cursor:pointer;z-index:108;
    transform: translate(0,0);
}
.facebook-videos .pause-button{
    height: 50px;width: 50px;
    background-image: url("../static_2.0/img/voicegenerator/video_pause_icon.png");
    background-repeat: no-repeat;background-position: 0 0;background-size: 100%;
    top: 0;
    bottom: 0;left: 0;right: 0;margin: auto;
    position: absolute;cursor:pointer;z-index:108;
    display: none;
}
#section-11 .container{
    width: 70%;
}
.flex-row.credit-section > div:nth-child(1){
    /* align-items: baseline; */
    /* padding-left: 100px; */
}
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;
    }
    .template-gallery-section a{
        margin-bottom: 0;
    }
    .step-image{
        margin-top: 60px;
    }
    .template-image{
        margin: 14px 0;
    }
    /* .sub-section article, */
    ul.collapsable-menu-vertical li div.collpase-sub-text{
        margin:auto;
    }
    ul.collapsable-menu-vertical li div.collpase-sub-text{
        max-width: none;
    }
    ul.collapsable-menu-vertical li div.collpase-sub-text img{
        display: block;
        margin-top: 20px;
    }
    .row.reasons-section .reasons-image-section{
        display: none;
    }
    ul.collapsable-menu-vertical,
    ul.collapsable-menu-vertical li[aria-expanded = 'true']{
        border: none;
    }
    ul.collapsable-menu-vertical li[aria-expanded = 'true'] {
        border: 1px solid #efefef;
    }
    ul.collapsable-menu-vertical li a.nav-link,
    ul.collapsable-menu-vertical li[aria-expanded = 'true'] a.nav-link{
        padding: 15px;
    }
    .article-section-1{
        padding: 0;
    }
    ul.collapsable-menu-vertical li h3{
        margin: 0;
    }
    .article-section-1 h4{
        /* margin-top: 50px; */
    }
    .article-section-1 img,
    .article-section-1 video{
        margin: 50px 0 0 0;
    }
    .article-section-1 .step-image{
        margin: 0;
    }
    .article-section-1 .col-lg-2,
    .article-section-1 .col-lg-10{
        display: flex;
        justify-content: flex-start;
        align-items: center;
        flex-basis: auto;
        flex-direction: column;
    }
    .article-section-1 .col-lg-10{
        align-items: flex-start;
    }
    #section-5 .article-section-1 h4,
    #section-5 .article-section-1 article{
        text-align: left;
    }
    .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('../static_2.0/img/voicegenerator/icon-expand.png');
        width: 21px;
        display: block;
        margin-right: 20px;
    }
    ul.faq-section li[aria-expanded='true'] .icon-expand{
        content:url('../static_2.0/img/voicegenerator/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-collapse{
        position: absolute;
        background: rgba(0, 0, 0, 0.8);
        left: 0px;
        top: 0px;
        -webkit-box-direction: normal;
        flex-direction: column;
        padding: 10px 20px 20px;
        min-height: 100%;
        width: 240px;
        transform: translateX(-100%);
        -webkit-transform: translateX(-100%);
        transition: all .3s linear;
        -webkit-transition: all .3s linear;
        height: 100vh;
        overflow-y: scroll;
    }
    /* Hide scrollbar for Chrome, Safari and Opera */
    .navbar-collapse::-webkit-scrollbar {
        display: none;
    }

    /* Hide scrollbar for IE, Edge and Firefox */
    .navbar-collapse{
        -ms-overflow-style: none;  /* IE and Edge */
        scrollbar-width: none;  /* Firefox */
    }
    .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;
    }
    .navbar-collapse .dropdown-menu,
    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;
    }
    .navbar-collapse a.nav-link{
        color:var(--text-color-4) !important;
    }
    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('../static_2.0/img/voicegenerator/icon-menu-white.svg');
    }
    .navbar-light .navbar-toggler .navbar-toggler-icon{
        background-image: url('../static_2.0/img/voicegenerator/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('../static_2.0/img/voicegenerator/icon-close-white.svg');
        width: 40px;
        padding-right: 0;
    }
    .navbar-light .navbar-toggler[aria-expanded = 'true'] .navbar-toggler-icon{
        background-image: url('../static_2.0/img/voicegenerator/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;
    }
  }
