@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800');
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css");
@import url('https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i&display=swap&subset=vietnamese');
.alignleft {
   float: left;
   margin-right: 15px;
}

.alignright {
   float: right;
   margin-left: 15px;
}

.aligncenter {
   display: block;
   margin: 0 auto 15px;
}

a:focus, input:focus, button:focus, textarea:focus {
   outline: 0 solid;
}

img {
   max-width: 100%;
   height: auto;
}

h1,
h2,
h3,
h4,
h5,
h6 {
   font-family: 'Open Sans', sans-serif;
   margin: 0 0 15px;
   line-height: 1.3;
   color: #454545;
   /* font-size: 30px; */
   font-weight: 400;
}

h1 {
   font-size: 3.6rem;
}
h2 {
   color: rgb(106, 68, 162);
   font-size: 3rem;
}
h3 {
   font-size: 2.4rem;
}
h4 {
   font-size: 1.8rem;
}
h5 {
   font-size: 1.4rem;
}
h6 {
   font-size: 1.2rem;
}


body {
   font-family: 'Open Sans', sans-serif;
   color: #5f5e5e;
   font-size: 14px;
   line-height: 28px;
   font-size: 15px;
}

a:hover {
   text-decoration: none
}









/*
   ===========>
  >>> Digitas homepage-1<<<
   ===========>
*/

/*dropdown*/
.main_menu li ul li {
   margin-left: 0px;
   border-radius: 5px;
}

.right-menu ul li ul {
   position: absolute;
   top: 45px;
   width: 171px;
   padding-left: 0;
   box-shadow: 0px 1px 4px #666;
}
.right-menu ul li ul {
   position: absolute;
   top: 52px;
   left: 30px;
   background: #ffffff;
   border-radius: 5px;
}
.right-menu ul li ul {
   width: 179px;
   padding-left: 0;
   box-shadow: 0px 1px 4px #666;
   padding-bottom: 4px;
   padding-right: 5px;
   padding-top: 5px;
}

.right-menu ul li ul {
   opacity: 0;
   visibility: hidden;
   transition: .3s;
}
.right-menu ul li ul li:last-child {
   background: #ffffff;
   position: relative;
}

.right-menu ul li ul li:first-child {
   background: #ffffff;
   position: relative;
}

.right-menu ul li{
   position: relative;
   transition: .3s;
}
.right-menu ul li ul li a {
   color: #222;
}

.right-menu ul li ul li {
   padding: 6px 100px 6px 15px;
   display: inline-block;
   transition: .3s;
   border-bottom: 1px solid transparent;
}

.right-menu ul li:hover ul {
   opacity: 1;
   visibility: visible;
   left: 0px;
}

.right-menu ul li ul li:nth-child(2) {
   background: #D0CFCC;
}
.right-menu ul li ul li:hover {
   background: #D0CFCC;
   border-bottom: 1px solid #F3F2F2;
}
.right-menu ul li ul li:nth-child(2) {
   border-bottom: 1px solid #F3F2F2;
}
.right-menu ul li ul li:hover a {
   color: #6a44a2;
}
.right-menu.menk ul li ul li a:hover {
   color: #366700;
}

.right-menu.menk ul li ul li a {
   transition: .3s;
   color: #222;
}
.right-menu.mmj ul li ul li a:hover {
   color: #1270c8;
}
.right-menu.mmj ul li ul li a{
   transition: .3s;
   color: #222;
}

/*dropdown*/
.main_menu a:focus {
   color: #4bc7f8;
}

.main-menu,
.main-menu a {
   color: #5f5e5e;
}

/* .header-area.headroom--not-top .main-menu,
.header-area.headroom--not-top a, */
.site-header.absolute .main-menu,
.site-header.absolute .main-menu a {
   color: rgb(255, 255, 255);
}

/* .right-menu {
   padding-top: 15px;
} */

.main-menu {
   padding-top: 40px;
   padding-bottom: 30px;
}

.main-menu > .row {
   display: flex;
   align-items: flex-end;
}

/* .logo img {
   width: 100px;
   margin-top: 9px;
} */

.header-area {
   width: 100%;
   background-color: #fff;
   box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.05);
   /* margin-bottom: 30px; */
}

.absolute .header-area {
   position: absolute;
   z-index: 1;
   background-color: transparent;
   box-shadow: none;
}

.slicknav_menu {
   display: none;
}

.main_menu {
   list-style: outside none none;
   margin: 0;
   padding: 0;
   text-align: right;
}

.main_menu li {
   display: inline-block;
   margin-left: 30px;
}

.main_menu a:hover,
.site-header.absolute a:hover,
.header-area.headroom--not-top a:hover {
   color: #4bc7f8;
}

.main_menu a {
   font-size: 16px;
   font-weight: 400;
   transition: .3s;
   padding-bottom: 20px;
   text-decoration: none;
}



.right-menu.menk ul a:hover {
   color: rgb(179, 237, 115);
}

.right-menu.mmj ul li a:hover {
   color: rgb(18, 112, 200);
}

/*header area End*/

/*hero area start*/

.hero-area {
   /*background: rgba(0, 0, 0, 0) url("../img/hero-bg.png") no-repeat scroll right top;*/
   display: flex;
   flex-direction: column;
   height: 700px;
   justify-content: center;
   position: relative;
   background: linear-gradient(312deg,#a240c9 0,#0a5aae 50%,#004e92 100%);
}

.hero-area::before {
   background: #0c82e0 none repeat scroll 0 0;
   content: "";
   height: 100%;
   left: 0;
   opacity: 0.7;
   position: absolute;
   top: 0;
   width: 100%;
   z-index: -1;
}

.hero-area .container {
   position: relative;
}

.main_menu a {
   margin: 35px 0;
}


.hero-img {
   height: 700px;
}
.hero-img svg,
.hero-img img {
   /* bottom: 50px; */
   bottom: 60px;
   left: 50px;
   position: absolute;
   width: calc(100% - 50px);
}
/* .vc_col-md-7.hero-img img,
.col-md-7.hero-img img {
   bottom: 0;
   left: 50px;
   position: absolute;
} */
.vc_col-sm-5.hero-content .vc_column-inner,
.col-sm-5.hero-content {
   padding-right: 0;
   padding-left: 18px;
}

.hero-content p {
   font-size: 15px;
   font-weight: 400;
   line-height: 25px;
   margin-bottom: 15px;
}

.hero-content {
   margin-top: 260px;
   color: #ffffff;
}

.hero-content h1 {
   font-size: 50px;
   line-height: 60px;
   font-weight: 600;
   color: #ffffff;
   margin-bottom: 18px;
}


p.video {
   font-size: 18px;
   font-weight: 300;
   margin: 0;
   padding-top: 35px;
   position: relative;
}

.hero-video.mfp-iframe.video-play {
   display: inline-flex;
   margin-top: 60px;
   text-decoration: none;
   color: #ffffff;
}

a.hero-video {
   font-size: 18px;
   font-weight: 300;
}

a.hero-video:hover {
   color: #ffffff;
}

.hero-img {
   position: relative;
}

/* .hero-img img {
   bottom: 42px;
   position: absolute;
   right: -55px;
} */

.hero-area3 h1 {
   color: #ffffff;
}


a.scroll-down {
   display: inline-block;
   background: #ffffff;
   border-radius: 50%;
   position: absolute;
   bottom: -16px;
   transition: .9s;
   width: 40px;
   height: 40px;
   line-height: 35px;
   /* z-index: 99999; */
   z-index: 9;
   left: 50%;
   transform: translateX(-50%);
   border: 1px solid #DAF0F5;
}
.scroll-down i{
   color: #8183C0;
   transition: .3s;
}
.scroll-down:hover i.fa {
   transform: translateY(14%);
   color: green;
}
.scroll-down:hover {
   box-shadow: 0 0px 15px #ddd;
}
.scroll-down.scrolling2 {
   top: 155px;
}

/*hero area End*/
/*progress-area-start*/
.progress-contentright {
   padding-top: 120px;
   height: 480px;
}
.progress-contentright h2 {
   font-weight: 400;
   color: #6a44a2;
   font-size: 30px;
}
.progress-contentright p {
   font-size: 15px;
   font-weight: 400;
   color: #5f5e5e;
}

.progress-pagess-area {
   position: relative;
   padding-top: 30px;
}

.progres-leftimgg {
   position: absolute;
   left: -285px;
}

.progres-leftimgg img {
   width: 790px;
}

.service-text1 {
   padding-bottom: 90px;
   text-align: center;
}
.service-text1 h5 {
   margin-top: 20px;
}

.progress-right-content {
   margin-top: 185px;
}


.progress-image {
   height: 100%;
   left: -75px;
   padding-right: 10px;
   position: absolute;
   top: 35px;
   width: 51%;
}

.progress-image img {
   width: 100%;
}


.progress-bar-area {
   position: relative;
   height: 525px;
}

.progress-right-content h5 {
   margin-top: -24px;
}

.progress-right-content p {
   font-size: 15px;
   font-weight: 400;
   line-height: 28px;
   color: #5f5e5e;
}
/*services-area-start*/

p.plus-icon i {
   border-radius: 50%;
   color: rgb(255, 255, 255);
   font-size: 16px;
   height: 30px;
   padding: 8px 0 0 9px;
   width: 30px;
}

i.color1 {
   background-color: rgb(83, 87, 174);
}

i.color2 {
   background: #f38b38;
}

i.color3 {
   background: #52ba9b;
}

i.color4 {
   background: #ef4846;
}

.plus-icon span {
   color: rgb(50, 50, 50);
   font-size: 20px;
   font-weight: 600;
   padding-left: 12px;
}

.single-service p {
   color: rgb(125, 125, 125);
   font-size: 15px;
   font-weight: 400;
   line-height: 28px;
   margin-top: 15px;
}

p.plus-icon {
   display: inline-flex;
   margin: 0;
}

.service-right {
   position: static;
   right: -45px;
}

.services-area.se {
   overflow: hidden;
   padding-bottom: 54px;
   padding-top: 15px;
}

.single-service.to.ty {
   padding-top: 100px;
}

/*services area End*/
/*feature logo area start*/

.feature-logo-area {
   margin-bottom: 45px;
   margin-top: 120px;
}

.feature-logo-right {
   margin-top: 17px;
   padding-left: 15px;
}

.feature-logo-right p, .feature-bottom-left p {
   color: rgb(95, 94, 94);
   font-size: 15px;
   font-weight: 400;
   line-height: 28px;
   margin-top: 30px;
}

.feature-bottom-left {
   margin-top: 125px;
}

/*feature logo area end*/

/*feature bottom area start*/

.feature-bottom-left h5 {
   margin-bottom: 0;
   line-height: 15px;
}

.feature-bottom-right img {
   width: 100%;
   margin-bottom: 65px;
}

.feature-bottom-area {
   position: relative;
}

.feature-bottom-area::after {
   position: absolute;
   content: "";
   width: 100%;
   height: 100px;
   bottom: 0;
   left: 0;
   z-index: -1;
}

.feature-bottom-area::after {
   background-image: -ms-linear-gradient(bottom, #F4F4FF 0%, #FEFEFF 100%);

   /* Mozilla Firefox */
   background-image: -moz-linear-gradient(bottom, #F4F4FF 0%, #FEFEFF 100%);

   /* Opera */
   background-image: -o-linear-gradient(bottom, #F4F4FF 0%, #FEFEFF 100%);

   /* Webkit (Safari/Chrome 10) */
   background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #F4F4FF), color-stop(100, #FEFEFF));

   /* Webkit (Chrome 11+) */
   background-image: -webkit-linear-gradient(bottom, #F4F4FF 0%, #FEFEFF 100%);

   /* W3C Markup */
   background-image: linear-gradient(to top, #F4F4FF 0%, #FEFEFF 100%);
}

/*feature bottom area end*/

/*skils area start*/

.skils-area {
   overflow: hidden;
   padding-bottom: 138px;
}

.skill-content {
   margin-bottom: 90px;
   margin-top: 145px;
   text-align: center;
}

.single-item-carousel i.fa-paint-brush {
   font-size: 20px;
}

.single-item-carousel i.fa.fa-code {
   font-size: 24px;
}

.single-item-carousel i.fa-wordpress {
   font-size: 22px;
}

.single-item-carousel h4 {
   color: rgb(50, 50, 50);
   font-size: 20px;
   font-weight: 600;
   margin-bottom: 15px;
   margin-top: 15px;
}

.single-item-carousel p {
   color: rgb(95, 94, 94);
   font-size: 15px;
   font-weight: 400;
   line-height: 28px;
}

.single-item-carousel {
   text-align: center;
   margin: 15px;
   padding-top: 10px;
   padding-bottom: 20px;
   transition: .3s;
   padding-left: 15px;
   padding-right: 15px;
}
.single-item-carousel p br {
   display: none;
}

.skils-area .owl-dots div {
   border-radius: 50%;
   display: inline-block;
   height: 15px;
   margin: 0 5px;
   text-align: center;
   width: 15px;
   background: #f4f4ff;
}

.skils-area .owl-dot.active {
   background: rgb(106, 68, 162) none repeat scroll 0 0;
   border: 1px solid rgba(0, 0, 0, 0);
}

.skils-area .owl-dots {
   margin-top: 35px;
   text-align: center;
}

.single-item-carousel i {
   height: 60px;
   width: 60px;
   border-radius: 50%;
   background: #f4f4ff;
   line-height: 58px;
}

.single-item-carousel:hover {
   box-shadow: 0px 5px 12px #f3f3f9;
}

/*skils area end*/

/*masonry area start*/

.masonry-area {
   padding-bottom: 85px;
}

.masonry-content {
   text-align: center;
}

.masonry-menu button {
   background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
   border: medium none;
   color: rgb(95, 94, 94);
   font-size: 16px;
   font-weight: 600;
   padding: 0 20px;
   position: relative;
}

.masonry-menu.text-center {
   padding-top: 78px;
}

.masonry-menu.text-center {
   padding-bottom: 5px;
   padding-top: 80px;
}

.masonry-menu button::after {
   background: rgb(95, 94, 94) none repeat scroll 0 0;
   content: "";
   height: 2px;
   position: absolute;
   right: 0;
   top: 58%;
   transform: translateX(50%) translateY(15%);
   width: 7px;
}

.masonry-menu button:last-child::after {
   opacity: 0;
   visibility: hidden;
}

.masonry-menu.text-center button:hover {
   color: #6a44a2;
}

.masonry-menu.text-center button {
   transition: .3s;
}

/*masonry area end*/
/*subscribe area start*/

.subscribe-area {
   background: rgb(158, 158, 255) none repeat scroll 0 0;
   display: flex;
   padding-bottom: 80px;
   padding-top: 78px;
   width: 100%;
   margin-bottom: 12px;
}

.subscribe-content p {
   color: rgb(255, 255, 255);
   font-size: 30px;
   font-weight: 400;
   margin-top: 11px;
}

.subscribe-form form input[type="email"] {
   background: rgb(158, 158, 255) none repeat scroll 0 0;
   border: 1px solid rgb(138, 124, 220);
   font-size: 15px;
   font-weight: 400;
   padding: 10px 0 15px 16px;
   width: 456px;
}

.subscribe-color1 input[type=email]::-webkit-input-placeholder { /* Chrome/Opera/Safari */
 color: #6a44a2;
}


.subscribe-form form input[type="submit"] {
   color: #6a44a2;
   font-size: 15px;
   font-weight: 600;
   height: 53px;
   position: absolute;
   right: 15px;
   top: 0px;
   width: 185px;
   border: none;
}

/*subscribe area end*/
/*team member area start*/

.team-member-text {
   padding-bottom: 80px;
   padding-top: 134px;
   text-align: center;
}

.single-member {
   text-align: center;
   padding-bottom: 30px;
   padding-top: 20px;
   transition: .3s;
   padding-right: 22px;
   padding-left: 22px;
}

.single-member.m1{
   box-shadow: 0px 3px 25px #f3f3f9;
}

.single-member.m2{
   box-shadow: 0px 3px 25px #fef7f1;
}

.single-member.m3 {
   box-shadow: 0px 3px 25px #fef2f2;
}

.single-member.box-shadows:hover {
   box-shadow: 0px 3px 20px #f3f3f9;
}

.team-contact a:hover {
   border: 1px solid rgb(83, 87, 174);
}

.team-contact a {
   border: 1px solid rgba(0, 0, 0, 0);
   border-radius: 50%;
   color: rgb(95, 94, 94);
   display: inline-block;
   font-size: 15px;
   height: 35px;
   line-height: 32px;
   margin: 0 3px;
   width: 35px;
   transition: .3s;
}

p.names {
   font-size: 18px;
   font-weight: 600;
   margin-top: 33px;
}

.names:hover {
   color: rgb(83, 87, 174);
   transition: all 0.3s ease 0s;
}

p.owner {
   color: rgb(95, 94, 94);
   font-size: 14px;
   font-weight: 400;
   margin-bottom: 15px;
}

.sw {
   margin-top: -5px;
}

/*team member area End*/
/*customar coment area start*/

.customer-comment-text {
   padding-bottom: 115px;
   padding-top: 115px;
   text-align: center;
}

.color1 i {
   color: #5357ae;
   font-size: 25px;
}

.color2 i {
   color: #f38b38;
   font-size: 25px;
}

.color3 i {
   color: #ef4846;
   font-size: 25px;
}

.likee {
   margin-bottom: 30px;
}

.namest {
   color: rgb(95, 94, 94);
   font-size: 15px;
   font-weight: 400;
   line-height: 28px;
}

.ia a {
   color: #333;
   font-size: 15px;
   margin-top: 20px;
   display: inline-block;
}

.ceo1.ceo1a,
.ceo1.ceo1b,
.ceo1.ceo1c {
   position: relative;
   margin: 0;
   margin-top: 20px;
}

.ceo1.ceo1a::after, .ceo1.ceo1b::after, .ceo1.ceo1a::after, .ceo1.ceo1b::after, .ceo1.ceo1c::after {
   position: absolute;
   width: 100px;
   height: 1px;
   content: "";
   /* left: 34%; */
   bottom: 32px;
   left: 50%;
   margin-left: -50px;
}

.ceo1.ceo1a::after {
   background: #dfe0fe;
}

.ceo1.ceo1b::after {
   background: #fee7d5;
}

.ceo1.ceo1c::after {
   background: #fcd7d7;
}

.single-member span {
   color: rgb(95, 94, 94);
   font-size: 14px;
   font-weight: 400;
}

/*customar coment area End*/

/*logo area start*/
.single-logo1 img {
   height: 62px;
}
.logo-areass.logo2-carousel {
   padding-top: 165px;
   padding-bottom: 70px;
}
.single-logo1 {
   padding-top: 15px;
   padding-bottom: 15px;
   padding-left: 32px;
   padding-right: 32px;
   border: 1px solid transparent;
   transition: .3s;
}
.single-logo1:hover{
   border: 1px solid #CCEEF9;
}
.logo-areass {
   padding-top: 120px;
   padding-bottom: 10px;
}
.logo-areass.logo3-carousel {
   padding-top: 110px;
   padding-bottom: 0;
}

/*logo area End*/

/*social contact area start*/

.social-contact-text {
   padding-bottom: 138px;
   padding-top: 135px;
   text-align: center;
}

/*social contact area End*/

/*contact form area start*/

.main-contact-form form input {
   /* display: inline-block; */
   /* margin-right: 25px; */
   /* width: 360px; */
   border: none;
}

.main-contact-form.co1 form input {
   /* display: inline-block; */
   /* margin-right: 25px; */
   /* width: 360px; */
   border: none;
   background: #f9f9f9;
}

.main-contact-form form input:nth-child(3),
.main-contact-form form .wpcf7-form-control-wrap:nth-child(3) input {
   margin-right: 0;
}

.main-contact-form form input[type="text"],
.main-contact-form form input[type="email"],
.main-contact-form form input[type="tel"] {
   border-bottom: 1px solid rgb(229, 212, 255);
   padding: 15px 12px;
   font-size: 15px;
   font-weight: 400;
   color: #767676;
}

.social-contact-area {
   padding-bottom: 104px;
}

p.no1 {
   color: rgb(95, 94, 94);
   font-size: 16px;
   font-weight: 400;
   margin-top: 30px;
}

.single-member2 i {
   color: rgb(106, 68, 162);
   font-size: 25px;
}

.single-member2 {
   text-align: center;
}

.main-contact-form.co1 form textarea {
   resize: none;
   border: 1px solid transparent;
   background: #f9f9f9;
   width: 100%;
   height: 170px;
   margin-top: 25px;
   padding-left: 12px;
   font-size: 15px;
   padding-top: 12px;
}

.main-contact-form form textarea {
   resize: none;
   border: 1px solid transparent;
   border-bottom: 1px solid #eadcff;
   width: 100%;
   height: 100px;
   margin-top: 30px;
}

.submit-button input[type="submit"] {
   color: #383838;
   font-size: 16px;
   font-weight: 400;
   padding: 6px 0;
   transition: .3s;
   border: 1px solid #ccc;
   background: #f9f9f9;    
}
.submit-button input[type="submit"]:hover {
   background: #8589e0;
   color: #ffffff;
   border: 1px solid #8589e0 !important;
}

.submit-button input {
   border: 1px solid rgb(103, 67, 156);
   border-radius: 24px;
   display: inline-block;
   width: 110px;
   background: transparent;
}
.submit-button {
   padding-top: 60px;
   padding-bottom: 140px;
}

/*contact form area End*/

/*footer area start*/

.footer-area a {
   color: rgb(255, 255, 255);
}

.single-footer h5 {
   color: rgb(255, 255, 255);
   font-size: 25px;
   font-weight: 600;
   margin-bottom: 22px;
}

.footer-l {
   padding-left: 50px;
}

.single-footer p {
   font-size: 15px;
   font-weight: 400;
   line-height: 28px;
}

.single-footer ul,
.single-footer .main_menu {
   list-style: outside none none;
   margin-top: 32px;
   padding: 0;
   text-align: inherit;
}

.single-footer li,
.single-footer .main_menu li {
   line-height: 31px;
}

.single-footer .main_menu li {
    display: block;
    margin: 0;
}

.single-footer a {
   color: rgb(255, 255, 255);
   font-size: 15px;
   font-weight: 300;
   text-decoration: none;
}

.main-footer-bg {
   padding-bottom: 17px;
   padding-top: 55px;
}

.footer-area {
   background:  #024180;
   color: #fff;
   /*overflow: hidden;
   margin-top: 10px;*/
}

p.phons {
   font-size: 16px;
   font-weight: 400;
}

p.know1 {
   font-size: 20px;
   font-weight: 600;
   position: relative;
   display: inline-block;
}

p.know1::after {
   background: #ffffff;
   content: "";
   height: 2px;
   left: 0;
   position: absolute;
   top: 35px;
   width: 30px;
}

.footer-l1 {
   padding-left: 56px;
}

.footer2 {
   padding-left: 75px;
}

.footerff {
   padding-left: 24px;
}

.main-footer-bgs {
   overflow: hidden;
}

.authorg {
   font-size: 15px;
   padding-bottom: 15px;
   padding-top: 45px;
   text-align: center;
}
.authorg:hover a {
   color: #4bc7f8;
   text-decoration: underline;
}
.authorg{
   transition: .4s;
}
.subscribe-form.subscribe-color1 input::placeholder {
   color: #6a44a2;
}

/*footer area End*/


/**********************************/

.number-one {
 transform: translateY(-10px) translateZ(0);
 opacity: 0;
 animation: fadeNumberDown-10 4821ms ease-in-out infinite;
 animation-fill-mode: forwards;
}

.number-two {
 transform: translateY(-20px) translateZ(0);
 opacity: 0;
 animation: fadeNumberDown-20 2293ms ease-in-out infinite;
 animation-delay: 3179ms;
 animation-fill-mode: forwards;
}

.number-three {
 transform: translateY(-30px) translateZ(0);
 opacity: 0;
 animation: fadeNumberDown-30 3144ms ease-in-out infinite;
 animation-delay: 1412ms;
 animation-fill-mode: forwards;
}

.number-four {
 transform: translateY(-50px) translateZ(0);
 opacity: 0;
 animation: fadeNumberDown-50 4552ms ease-in-out infinite;
 animation-delay: 298ms;
 animation-fill-mode: forwards;
}

.number-five {
 transform: translateY(-60px) translateZ(0);
 opacity: 0;
 animation: fadeNumberDown-60 2172ms ease-in-out infinite;
 animation-delay: 5149ms;
 animation-fill-mode: forwards;
}

.number-six {
 transform: translateY(-70px) translateZ(0);
 opacity: 0;
 animation: fadeNumberDown-70 4754ms ease-in-out infinite;
 animation-delay: 2377ms;
 animation-fill-mode: forwards;
}

.number-seven {
 transform: translateY(-80px) translateZ(0);
 opacity: 0;
 animation: fadeNumberDown-80 5956ms ease-in-out infinite;
 animation-delay: 1848ms;
 animation-fill-mode: forwards;
}

.number-eight {
 transform: translateY(-90px) translateZ(0);
 opacity: 0;
 animation: fadeNumberDown-90 4734ms ease-in-out infinite;
 animation-delay: 3271ms;
 animation-fill-mode: forwards;
}

.number-nine {
 transform: translateY(-100px) translateZ(0);
 opacity: 0;
 animation: fadeNumberDown-100 2979ms ease-in-out infinite;
 animation-delay: 1552ms;
 animation-fill-mode: forwards;
}

.number-ten {
 transform: translateY(-110px) translateZ(0);
 opacity: 0;
 animation: fadeNumberDown-110 2951ms ease-in-out infinite;
 animation-delay: 4141ms;
 animation-fill-mode: forwards;
}

.number-eleven {
 transform: translateY(-120px) translateZ(0);
 opacity: 0;
 animation: fadeNumberDown-120 2579ms ease-in-out infinite;
 animation-delay: 2860ms;
 animation-fill-mode: forwards;
}

.number-twelve {
 transform: translateY(-150px) translateZ(0);
 opacity: 0;
 animation: fadeNumberDown-150 5990ms ease-in-out infinite;
 animation-delay: 4671ms;
 animation-fill-mode: forwards;
}

.number-thirteen {
 transform: translateY(-160px) translateZ(0);
 opacity: 0;
 animation: fadeNumberDown-160 3933ms ease-in-out infinite;
 animation-delay: 1401ms;
 animation-fill-mode: forwards;
}


.number-fourteen {
 transform: translateY(-160px) translateZ(0);
 opacity: 0;
 animation: fadeNumberDown-160 3933ms ease-in-out infinite;
 animation-delay: 1401ms;
 animation-fill-mode: forwards;
}

.number-fifteen {
 transform: translateY(-160px) translateZ(0);
 opacity: 0;
 animation: fadeNumberDown-160 3933ms ease-in-out infinite;
 animation-delay: 1401ms;
 animation-fill-mode: forwards;
}

.number-sixteen {
 transform: translateY(-160px) translateZ(0);
 opacity: 0;
 animation: fadeNumberDown-160 3933ms ease-in-out infinite;
 animation-delay: 1401ms;
 animation-fill-mode: forwards;
}

@keyframes hover {
 0% {
   transform: translateY(0);
 }
 25% {
   transform: translateY(-3px);
 }
 75% {
   transform: translateY(3px);
 }
 100% {
   transform: translateY(0);
 }
}
@keyframes fadeNumberDown-10 {
 0% {
   transform: translateY(-10px) translateZ(0);
   opacity: 0;
 }
 40% {
   opacity: 0.4;
 }
 60% {
   opacity: 0.4;
 }
 100% {
   transform: translateY(140px) translateZ(0);
   opacity: 0;
 }
}
@keyframes fadeNumberDown-20 {
 0% {
   transform: translateY(-20px) translateZ(0);
   opacity: 0;
 }
 40% {
   opacity: 0.4;
 }
 60% {
   opacity: 0.4;
 }
 100% {
   transform: translateY(140px) translateZ(0);
   opacity: 0;
 }
}
@keyframes fadeNumberDown-30 {
 0% {
   transform: translateY(-30px) translateZ(0);
   opacity: 0;
 }
 40% {
   opacity: 0.4;
 }
 60% {
   opacity: 0.4;
 }
 100% {
   transform: translateY(130px) translateZ(0);
   opacity: 0;
 }
}
@keyframes fadeNumberDown-50 {
 0% {
   transform: translateY(-50px) translateZ(0);
   opacity: 0;
 }
 40% {
   opacity: 0.4;
 }
 60% {
   opacity: 0.4;
 }
 100% {
   transform: translateY(110px) translateZ(0);
   opacity: 0;
 }
}
@keyframes fadeNumberDown-60 {
 0% {
   transform: translateY(-60px) translateZ(0);
   opacity: 0;
 }
 40% {
   opacity: 0.4;
 }
 60% {
   opacity: 0.4;
 }
 100% {
   transform: translateY(90px) translateZ(0);
   opacity: 0;
 }
}
@keyframes fadeNumberDown-70 {
 0% {
   transform: translateY(-70px) translateZ(0);
   opacity: 0;
 }
 40% {
   opacity: 0.4;
 }
 60% {
   opacity: 0.4;
 }
 100% {
   transform: translateY(80px) translateZ(0);
   opacity: 0;
 }
}
@keyframes fadeNumberDown-80 {
 0% {
   transform: translateY(-80px) translateZ(0);
   opacity: 0;
 }
 40% {
   opacity: 0.4;
 }
 60% {
   opacity: 0.4;
 }
 100% {
   transform: translateY(80px) translateZ(0);
   opacity: 0;
 }
}
@keyframes fadeNumberDown-90 {
 0% {
   transform: translateY(-90px) translateZ(0);
   opacity: 0;
 }
 40% {
   opacity: 0.4;
 }
 60% {
   opacity: 0.4;
 }
 100% {
   transform: translateY(60px) translateZ(0);
   opacity: 0;
 }
}
@keyframes fadeNumberDown-100 {
 0% {
   transform: translateY(-100px) translateZ(0);
   opacity: 0;
 }
 40% {
   opacity: 0.4;
 }
 60% {
   opacity: 0.4;
 }
 100% {
   transform: translateY(60px) translateZ(0);
   opacity: 0;
 }
}
@keyframes fadeNumberDown-110 {
 0% {
   transform: translateY(-110px) translateZ(0);
   opacity: 0;
 }
 40% {
   opacity: 0.4;
 }
 60% {
   opacity: 0.4;
 }
 100% {
   transform: translateY(30px) translateZ(0);
   opacity: 0;
 }
}
@keyframes fadeNumberDown-120 {
 0% {
   transform: translateY(-120px) translateZ(0);
   opacity: 0;
 }
 40% {
   opacity: 0.4;
 }
 60% {
   opacity: 0.4;
 }
 100% {
   transform: translateY(20px) translateZ(0);
   opacity: 0;
 }
}
@keyframes fadeNumberDown-150 {
 0% {
   transform: translateY(-150px) translateZ(0);
   opacity: 0;
 }
 40% {
   opacity: 0.4;
 }
 60% {
   opacity: 0.4;
 }
 100% {
   transform: translateY(10px) translateZ(0);
   opacity: 0;
 }
}
@keyframes fadeNumberDown-160 {
 0% {
   transform: translateY(-160px) translateZ(0);
   opacity: 0;
 }
 40% {
   opacity: 0.4;
 }
 60% {
   opacity: 0.4;
 }
 100% {
   transform: translateY(10px) translateZ(0);
   opacity: 0;
 }
}