
:root{
    /* --bg-1:transparent url('../static_2.0/img/trainingjobs/Hero BG.svg') 0% 0% no-repeat padding-box; */
    /* --bg-2:transparent url('../static_2.0/img/trainingjobs/CTA BG.svg') 0% 0% no-repeat padding-box; */
    /* --bg-3:transparent url('../static_2.0/img/trainingjobs/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('https://www.animaker.com/static_2.0/img/trainingjobs/icon-arrow-white.svg') 0% 0% no-repeat padding-box;
    --bg-11: transparent url('https://www.animaker.com/static_2.0/img/trainingjobs/Logo.svg') 0% 0% no-repeat padding-box;
    --bg-12: transparent url('https://www.animaker.com/static_2.0/img/trainingjobs/logo-scrolled.svg') 0% 0% no-repeat padding-box;
    --bg-13: transparent url('https://www.animaker.com/static_2.0/img/trainingjobs/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/trainingjobs/Logo.svg"); */
    /* width: 200px; */
    width: 140px;
    /* 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/trainingjobs/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{
    background: transparent linear-gradient(270deg, #EF3297 0%, #FAD34F 100%) 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 26px;
    font: normal normal 600 21px/29px 'Lexend Deca', 'sans-serif';
    font: normal normal bold 18px/27px 'Poppins', 'sans-serif';
    letter-spacing: 0px;
    color: #FFFFFF;
    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;
}
img.hero-image {
    margin-top: 30px;
    width: 100%;
    /* max-width: 950px; */
}
img.best-screen-recorder{
    width: 100%;
}
nav.navbar.fixed-top + .header-section{
    /* padding-top: 22%; */
    /* margin-top: 90px; */
    padding-top: 130px;
}
.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: 80px 0;
}
#section-12{
    background: #FAFAFA 0% 0% no-repeat padding-box;
}
#section-12 h2{
    font:var(--lato-bold-32px);
    margin-bottom: 12px;
}
#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: -50px; */
    padding: 80px 0;
}
.header-section .btn-lg{
    margin: 18px auto;
}
h1{
    color: #1D1D1D;
    font: normal normal bold 50px/70px 'Poppins', 'sans-serif';
    letter-spacing: 0px;
}
h6{
    margin: 30px 0;
    font: normal normal normal 18px/27px 'Poppins', 'sans-serif';
    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{
    text-align: center;
}
.animaker-tool-container{
    margin: 0 auto 70px auto;
}
img.tool-icon{
    width: 100%;
    max-width: 64px;
    /* margin: 0 24px; */
    cursor: pointer;
}
h2{
    font: normal normal bold 32px/48px 'Poppins', 'sans-serif';
    letter-spacing: 0px;
    color: #2D2D2D;;
    text-align: center;
    margin-bottom: 25px;
}
#section-2 h2{
    font: normal normal bold 32px/48px 'Poppins', 'sans-serif';
    margin-bottom: 0;
}
#section-2 h2.small{
    font: normal normal bold 32px/48px 'Poppins', 'sans-serif';
    letter-spacing: 0px;
    color: #FFFFFF;
    margin: 40px auto 40px auto;
}
h5{
    font: normal normal normal 18px/32px 'Open Sans', 'sans-serif';
    letter-spacing: 0px;
    color: #54536C;
    text-align: center;
    margin-bottom: 20px;
}
#section-2{
    background: transparent linear-gradient(216deg, #9458F0 0%, #4E41F1 100%) 0% 0% no-repeat padding-box;
    background-image: url('https://www.animaker.com/static_2.0/img/trainingjobs/pattern-bg.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
#section-2 h2,
#section-8 h2{
    color:white;
}
#section-2,
#section-6,
#section-8{
    padding: 80px 0;
    /* background-color:#fbf9fe; */
}
#section-6 h3{
    margin-bottom: 16px;
}
.faded-bg{
    position: relative;
}
.faded-bg::after{
    content:'';
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    left:0;
}
.faded-bg > *{
    position:relative;
    z-index:1;
}
#section-8.faded-bg::after{
    background: transparent linear-gradient(46deg, #9458F0 0%, #4E41F1 100%) 0% 0% no-repeat padding-box;
    opacity: 0.8;
}
.row.medal-container {
    margin: 20px auto auto;
}
.row.medal-container .col{
    display: flex;
    justify-content: center;
}
img.medal-image {
    width: 100%;
    max-width: 133px;
    margin: 0 40px;
}
hr{
    border: 2px dashed #000000;
    opacity: 0.11;
    width: 240px;
    margin: 50px auto;
    background-color: transparent;
}
.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("https://www.animaker.com/static_2.0/img/trainingjobs/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('https://www.animaker.com/static_2.0/img/trainingjobs/edit-icon.svg');
    cursor: pointer;
}
.play-template-icon{
    display: inline-block;
    width: 70px;
    height: 70px;
    background-image: url('https://www.animaker.com/static_2.0/img/trainingjobs/play-icon.svg');
    cursor: pointer;
}
.video-container:hover>span.play-icon::after{
    display: none;
}
.play-button {
    height: 50px;
    width: 50px;
    background-image: url('https://www.animaker.com/static_2.0/img/trainingjobs/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: 80px 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; */
    /* ENALBE IT FOR VIDEO */
}
#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;
}
.content-center {
    justify-content: center;
    align-items: center;
    display: flex;
    flex-direction: column;
}
.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/24px 'PT 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 600 22px/33px 'Poppins', 'sans-serif';
    letter-spacing: 0px;
    color: #2D2D2D;
}
.header-section h3{
    margin-bottom: 0;
}
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: 1004px;
}
.card-section .card{
    text-align: center;
    padding: 30px;
    background:var(--bg-9);
    box-shadow: 0px 0px 6px #00000026;
    border-radius: 20px;
    border: none;
    height: 387px;
    /* 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: 24px 0 0 0;
    font: normal normal normal 18px/24px 'PT Sans', 'sans-serif';
    letter-spacing: 0px;
    color: #2D2D2D;
}
.card-section h4{
    font: normal normal bold 21px/19px 'PT Sans', 'sans-serif';
    letter-spacing: 0px;
    color: #2D2D2D;
    text-align: center;
    margin: 32px 0 5px 0;
}

.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 .card:hover{
    /* transform: scale(1.01);
    transition-timing-function: linear;
    transition-duration: 0.10s; */
    -moz-box-shadow: 0 0 10px #fff;
    -webkit-box-shadow: 0 0 10px #fff;
    box-shadow: 0px 0px 10px #fff;
}
.card-section span{
    font: normal normal normal 14px/19px 'PT Sans', 'sans-serif';
    letter-spacing: 0px;
    color: #2D2D2D;
    /* position: absolute; */
    left:40%;
}
.card-section a.purple,
.card-section span.purple{
    margin-top: 50px;
    font: normal normal normal 14px/24px 'PT Sans', 'sans-serif';
    letter-spacing: 0.11px;
    color: #8B70F4;
    text-decoration: none;
}
.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 .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{
  text-align: left;
  font-family: inherit;
}
footer h6{
 margin-top:0;
}
footer .container{
  width:80%;
}

/* 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.consider-animaker,
  .swiper.review-swiper{
      height: auto;
  }
  .swiper.review-swiper{
    padding: 20px;
}
  .swiper.animaker-tools{
      /* margin-top: 20px; */
      height: 380px;
  }
  .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: 40px 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('https://www.animaker.com/static_2.0/img/trainingjobs/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, .modal .btn-primary){
    /* box-shadow: 0px 3px 6px #00000029; */
    transform: translateY(-3px);
    -webkit-transform: translateY(-3px);
}
/* 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;
}



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: 80px 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: 460px;
    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;
}

.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: 45px auto auto auto;
    justify-content: space-around;
}
.img-container,
.explore-section-right{
    /* background-color: #A87BFF; */
    position: relative;
    /* padding: 100px; */
    /* border-radius: 15px; */
}
.img-container{
    display: none;
}
.explore-section .nav.flex-column.hide-md{
    padding-right: 0;
}
.img-container,
.explore-section-right.faded-bg::after{
    background: transparent linear-gradient(220deg, #9458F0 0%, #4E41F1 100%) 0% 0% no-repeat padding-box;
    border-radius: 20px;
    opacity: 0.8;
}
.sound-line-bg{
    background-image: url('https://www.animaker.com/static_2.0/img/trainingjobs/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;
    padding: 0;
}
#section-4 .row.explore-list > div:nth-child(2){
    align-items: baseline;
    padding-bottom: 15px;
    padding-left: 24px;
}
.explore-list h3{
    margin: 7px auto 15px 0;
}
.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("https://www.animaker.com/static_2.0/img/trainingjobs/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("https://www.animaker.com/static_2.0/img/trainingjobs/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; */
}
.row.security-container .col,
.row.animaker-tool-container .col,
.row.medal-container .col{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
}
img.security-image {
    width: 100%;
    max-width: 210px;
    margin: 45px 47px 0 47px;
}
#section-12 .container{
    width: 70%;
    margin: auto;
}
.modal button.btn-close{
    margin: 12px 12px 12px auto;
}
img.enterprise-modal-mascot {
    width: 100%;
    max-width: 210px;
    margin: 0 auto;
    display: block;
}
.modal h3{
    font : normal normal 800 35px/53px 'Poppins', 'sans-serif';
    text-align:center;
    margin-top: 10px;
}
.form-element{
    margin: 16px 0;
}
#signupModal .modal-dialog{
    width: 825px;
    height: 468px;
    max-width: none;
}
#onboardModal .modal-dialog{
    width: 785px;
    height: 587px;
    max-width: none;
}
.modal .btn-primary,
.modal .btn-primary:active{
    font: normal normal bold 18px/5px 'PT Sans', 'sans-serif';
    letter-spacing: 0px;
    color: #FFFFFF;
    width: 100%;
    border-radius: 4px;
    height: 40px;
    margin: 30px auto 22px auto;
    box-shadow:none;
    -webkit-box-shadow:none;
    text-decoration: none;
}
.modal form{
    padding-right: 44px;
}
.modal input.form-control{
    border-color: #F1F3F5;
    background: #F1F3F5 0% 0% no-repeat padding-box;
    border-radius: 4px;
    height: 40px;
}
.modal input.form-control:hover{
    border:1px solid #FFCA00;
}
.modal select.userCountryCode:hover{
    outline: 1px solid #FFCA00;
}
.modal input.form-control:focus{
    box-shadow: none;
}
.modal input.form-control:focus-within,
.modal select.userCountryCode:focus-within{
    border:1px solid rgba(14,19,24,.45)
}
.modal input.form-control.valid-input{
    border:1px solid #28a745;
}
.modal select.userCountryCode.valid-input,
.modal select.userCountryCode:focus-visible{
    outline: 1px solid #28a745;
}
.modal input.form-control.invalid-input,
.modal select.userCountryCode.invalid-input{
    border:2px solid #dc3545;
}
.modal .form-element.phone-number input.form-control{
    /* width: calc(100% - 140px); */
}
.modal select.userCountryCode{
    border: none;
    border-color: #F1F3F5;
    background: #F1F3F5 0% 0% no-repeat padding-box;
    border-radius: 4px;
    height: 40px;
    width: 90%;
}
.modal input.form-control:focus{
    box-shadow: none;
}
.modal input.form-control:focus-within{
    border:1px solid rgba(14,19,24,.45)
}
.modal input.form-control.valid-input{
    border:1px solid #28a745;
}
.modal input.form-control.invalid-input{
    border:2px solid #dc3545;
}
.modal span{
    font: normal normal normal 14px/5px 'PT Sans', 'sans-serif';
    letter-spacing: 0px;
    color:#C2C3C4;
    /* margin-top: 22px; */
    text-align: center;
    display: inline;
}
.modal span a{
    text-decoration: none;
}
.modal span.error-text{
    display: contents;
    color: #dc3545;
}
.modal label.col-form-label{
    font: normal normal bold 15px/5px 'PT Sans', 'sans-serif';
    letter-spacing: 0px;
    color: #2D2D2D;
    margin-bottom: 12px;
}
.modal .modal-body{
    padding-bottom: 60px;
}
.modal-backdrop{
    background-color: #414965;
}
.modal-backdrop.show{
    opacity: 0.8;
}
.form-element.phone-number .col-4{
    position: relative;
    height:64px;
}
label.selected-country-code{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-66%, -80%);
    text-align: center;
    padding-top: 4px;
    background: #F1F3F5 0% 0% no-repeat padding-box;
    border-radius: 4px;
    height: 35px;
    width: 76%;
    pointer-events: none;
}
.form-element.phone-number{
    height: 98px;
}

img.animaker-logo,
img.onboard-specialist{
    width: 100%;
    max-width: 146px;
    margin: auto;
    display: block;
}
img.onboard-specialist{
    margin: 25px auto;
}
#onboardModal h3{
    margin-top: 25px;
    font: normal normal 800 35px/53px 'Poppins', 'sans-serif';
    letter-spacing: 0px;
    color: #2D2D2D;
}
#onboardModal h4{
    font: normal normal bold 22px/29px 'PT Sans', 'sans-serif';
    letter-spacing: 0px;
    color: #2D2D2D;
}
#onboardModal span{
    font: normal normal normal 18px/23px 'PT Sans', 'sans-serif';
    letter-spacing: 0px;
    color: #54536C;
}
#onboardModal.modal .modal-body{
    text-align: center;
    padding: 0 60px 60px;
}
#onboardModal.modal .btn-primary,
#onboardModal.modal .btn-primary:active{
    background: transparent linear-gradient(270deg, #EF3297 0%, #FAD34F 100%) 0% 0% no-repeat padding-box;
    border-radius: 20px;
    max-width:220px;
    margin:32px auto auto;
}
.consider-animaker-container{
    padding: 50px;
    height: 100%;
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    right: 0;
    bottom: 0;
    transform: translate(-50%, -35%);
}
img.consider-animaker,
img.tool-image {
    width: 100%;
}
img.consider-animaker.img-3{
    margin-top: 20px;
}
img.consider-animaker.img-4{
    /* margin-top: -20px; */
}
img.tool-image{
    max-width: 600px;
    display: flex;
    margin: auto;
}
.animaker-tool-container{
    width: 80%;
    margin: auto;
    max-width: 625px;
}
.animaker-tool-container.icon-list{
    height: 120px;
    width: 56%;
    margin: 20px auto;
}
img.tool-icon.active{
    max-width: 100px;
    max-height: 100px;
    -moz-box-shadow: 0px 0px 12px #fff6;
    -webkit-box-shadow: 0px 0px 12px #fff6;
    box-shadow: 0px 0px 12px #fff6;
    border-radius:20px;
}
img#tool-1.active{
    content: url('https://www.animaker.com/static_2.0/img/trainingjobs/tool-icon-1-active.svg');
}
img#tool-2.active{
    content: url('https://www.animaker.com/static_2.0/img/trainingjobs/tool-icon-2-active.svg');
}
img#tool-3.active{
    content: url('https://www.animaker.com/static_2.0/img/trainingjobs/tool-icon-3-active.svg');
}
img#tool-4.active{
    content: url('https://www.animaker.com/static_2.0/img/trainingjobs/tool-icon-4-active.svg');
}
img#tool-5.active{
    content: url('https://www.animaker.com/static_2.0/img/trainingjobs/tool-icon-5-active.svg');
    /* height: 75px;
    max-width: 75px; */
}
img.tool-image.tool-image-2 {
    margin-top: 30px;
}
img.tool-image.tool-image-4 {
    margin-top: 20px;
    max-width: 550px;
}
img.tool-image.tool-image-5 {
    margin-top: 20px;
}



@-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}
        }


        /* footer */

        footer {
  padding: 80px 0;
  background: #2E293E;
}

footer * {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
  font-family: 'PT Sans', sans-serif;
}

footer h5 {
  font-weight: 800;
  font-size: 1.5rem;
  margin-bottom: 30px;
  letter-spacing: 0px;
  color: #F99420;
}

footer h6 {
  color: #fff;
  font-weight: 600;
  font-size: 1.0625rem;
  margin-bottom: 20px;
  font-family: 'Lato', sans-serif;
}

footer ul li a {
  display: inline-block;
  color: #8A8A8A;
  font-size: 17px;
  padding: 8px 0;
  line-height: 1.2;
  transition: all 0.3s linear;
  -webkit-transition: all 0.3s linear;
  -moz-transition: all 0.3s linear;
  position: relative;
}

footer ul li a:before {
  content: '';
  border: 0px;
  width: 100%;
  height: 1.5px;
  background: #F1821E;
  position: absolute;
  left: 0px;
  bottom: 0px;
  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 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);
}

footer .address .comp {
  font-size: 1.125rem;
  color: #AFAFAF;
  line-height: 1.4;
  margin-bottom: 5px;
}

footer .address .comp span {
  color: #F1821E;
  font-weight: 700;
}

footer .address p {
  font-size: 0.9375rem;
  color: #AFAFAF;
  line-height: 1.7;
  margin-bottom: 10px;
}

footer .address p a {
  color: #AFAFAF;
  text-decoration: none;
  transition: all 0.3s linear;
  -webkit-transition: all 0.3s linear;
  -moz-transition: all 0.3s linear;
}

footer .address p a:hover {
  color: #fff;
}

footer .address .social {
  margin: 0px 0 0 -10px;
  padding-top: 10px;
}

footer .address .social svg {
  width: 15px;
  height: 15px;
}

footer .address .social a {
  padding: 10px 10px;
  transition: all 0.3s linear;
  -webkit-transition: all 0.3s linear;
  -moz-transition: all 0.3s linear;
  opacity: .5;
}

footer .address .social a:hover {
  opacity: 1;
}

footer .logo {
  text-align: center;
  padding: 70px 0 20px;
}

footer .slogan {
  font-size: 2.5rem;
  font-weight: 900;
  color: #fff;
  text-align: center;
  margin-bottom: 10px;
}

footer .slogan span {
  color: #F1821E;
}

footer .copyright {
  font-size: 1rem;
  color: #AFAFAF;
  text-align: center;
  line-height: 1.5;
}

footer .copyright a {
  color: #F1821E;
  transition: all 0.3s linear;
  -webkit-transition: all 0.3s linear;
  -moz-transition: all 0.3s linear;
}

footer .copyright a:hover {
  color: #fff;
  text-decoration: none;
}

footer .company {
  display: -webkit-box;
  display: -ms-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  max-width: 650px;
}

footer .company li a {
  font-size: 1rem;
  line-height: 1.2;
  color: #1A1A1A;
  display: block;
  transition: all 0.3s linear;
  -webkit-transition: all 0.3s linear;
  -moz-transition: all 0.3s linear;
}

footer .company li a:hover {
  color: #F1821E;
  text-decoration: none;
}

 /* 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{
        padding-top: 130px;
    }
    .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{
        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-radius: 20px;
        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{
        padding: 70px 0;
    }
    .reasons-section{
        padding: 50px 0 0 0;
    }
    footer{
        /* padding: 60px 0; */
    }
    /* 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{
        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/trainingjobs/icon-expand.png');
        width: 21px;
        display: block;
        margin-right: 20px;
    }
    ul.faq-section li[aria-expanded='true'] .icon-expand{
        content:url('https://www.animaker.com/static_2.0/img/trainingjobs/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 0;
    }
    .swiper.language-swiper{
        height: calc(100% + 30px);
    }
    .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;
    }
    img.mascot-image{
        margin-top: 70px;
    }
    .animaker-tool-container{
        margin-top: 20px;
        max-width: none;
    }
    #signupModal.modal .modal-dialog,
    #onboardModal.modal .modal-dialog{
        width: 90%;
        margin: auto;
    }
    .modal form{
        padding-right: 0;
    }
    .modal input.form-control,
    .modal button.btn-primary{
        width: 70%;
        margin: 0 auto;
    }
    #signupModal.modal button.btn-primary{
        margin: 0 auto 32px auto;
    }
    img.enterprise-modal-mascot{
        /* max-width: 250px; */
    }
    .animaker-tool-container.icon-list{
        width: 80%;
        margin-top: 60px;
        height: 100px;
    }
    .animaker-tool-container{
        width: 100%;
    }
    .consider-animaker-container{
        position: inherit;
        transform: none;
    }
    .img-container{
        display: block;
        padding: 30px;
    }
    img.consider-animaker{
        margin: auto !important;
    }
    .col-lg-6.col-lg-offset-1.explore-section-right.faded-bg{
        display: none;
    }
    ul.collapsable-menu-vertical.show-md{
        padding-bottom: 0;
    }
    .form-element.phone-number{
    width: 70%;
    margin: 16px auto;
  }
  label.selected-country-code{
      width: 80%;
      transform: translate(-55%, -82%);
      padding-top: 6px;
  }
  .modal .form-element.phone-number input.form-control{
      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('https://www.animaker.com/static_2.0/img/trainingjobs/icon-menu-white.svg');
    }
    .navbar-light .navbar-toggler .navbar-toggler-icon{
        background-image: url('https://www.animaker.com/static_2.0/img/trainingjobs/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/trainingjobs/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/trainingjobs/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{
        margin-top: 30px;
    }
    #section-8{
        padding: 60px 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: 0;
        padding-top: 0;
    }
    nav.navbar.fixed-top + .header-section{
        margin-top: 0;
        padding-top: 50px;
    }
    ul.step-icon-list > li{
        flex:100%;
    }
    ul.step-icon-list > li + li{
        margin-top: 30px;
    }
    #section-8 .card-section{
        width: 100%;
    }
    img.mascot-image{
        width: 91%;
    }

    #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: 60%;*/
         width: auto;
    }
    /* .sound-line-bg.bottom{
        background-position:310px 50px ;
    } */
    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: 460px;
    }
    .animaker-tool-container,
    .row.medal-container{
        margin-top: 0;
    }
    img.medal-image{
        margin: 0;
        max-width: 200px
    }
    #section-2 h2{
        font-size: 30px;
        line-height: 44px;
    }
    img.enterprise-modal-mascot{
        max-width: 130px;
    }
    .modal .modal-body{
        padding-top: 0;
    }
    #onboardModal.modal .modal-body{
        padding: 15px;
    }
    .animaker-tool-container.icon-list{
        width: auto;
        margin-top: 30px;
        height: 80px;
    }
    img.tool-icon{
        max-width: 50px;
        max-height: 50px;
    }
    img.tool-icon.active{
        max-width: 70px;
        max-height: 70px;
        width: 70px;
        height: 70px;
    }
    .swiper.animaker-tools{
        height: auto;
    }
    #section-2 h2.small{
        margin-top: 0;
    }
    .modal h3{
        font : normal normal 800 30px/50px 'Poppins', 'sans-serif';
    }
    label.selected-country-code{
        width: 70%;
        transform: translate(-63%, -82%);
    }

    footer ul {
    margin-bottom: 30px;
    padding-bottom: 30px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  }
  footer .showMore {
    padding: 0 0 30px;
  }
  }

  @media screen and (max-width: 579px) {
  footer {
    padding: 50px 0 30px;
  }
  footer .slogan {
    font-size: 1.5rem;
  }
}
