#root{
    overflow: auto;
}
body{
    font-family: roboto !important;
    font-size: 16px;
    line-height: 28px;
    padding: 0;
    margin: 0;
    background: #ffffff;
    color: #141417;
    overflow: auto !important;
 }
 
 h1,h2,h3,h4,h5,h6{
    font-family: roboto !important;
     color: #041f42;
     text-transform: uppercase;
 }
 
 h3{
     font-size: 26px;
     line-height: 1.4;
     font-weight: 600;
 }
 
 section{
     position: relative;
 }
 .form-control:focus{
     box-shadow: none;
     border-color:inherit;
 }
 .bg-light-color{
     background:#f6f9ff;
 }
 .space-ptb{
     padding: 150px 0;
 }
 .space-pt{
     padding-top: 150px;
 }
 .space-pb{
     padding-bottom: 150px;
 }
 
 .btn-01{
     font-size: 18px;
     line-height: 28px;
     padding: 14px 28px;
     background: #323232;
     color: #ffffff;
     border: none;
     text-transform: uppercase;
     text-decoration: none !important;
     font-weight: 500;
 }
 
 .btn-lg-01{
     font-size: 18px;
     line-height: 28px;
     padding: 20px 32px;
     background: #323232;
     color: #ffffff;
     border: none;
     text-transform: uppercase;
     text-decoration: none !important;
     font-weight: 500;
 }
 
 .btn-primary-01{
     background: #42a4b1;
 }
 .btn-primary-01:hover,
 .btn-primary-01:active,
 .btn-primary-01:focus,
 .btn-primary-01:active:focus{
     background: #041f42;
     box-shadow: none;
     color: #fff
 }
 .btn-outline-01 {
     background: transparent;
     border: 2px solid #42a4b1;
     color: #42a4b1;
 }
 .btn-outline-01:hover,
 .btn-outline-01:focus,
 .btn-outline-01:active,
 .btn-outline-01:active:focus {
     background: #42a4b1;
     border: 2px solid #42a4b1;
     color: #ffffff;
 }
 .btn-01:focus{
     box-shadow: none;
 }
 
 .section-title {
     margin-bottom: 50px;
 }
 .section-title .title {
     font-size: 46px;
     font-weight: bold;
     color: #041f42;
     line-height: 1.3;
     margin-bottom: 20px;
 }
 
 .divider-bootstrap {
    border-bottom: 1px solid rgb(0 0 0 / 5%);
    padding-bottom: 20px;
 }
 
 .bg-half-overley:before {
     content: "";
     background: #42a4b1 !important;
     width: 100%;
     display: inline-block;
     position: absolute;
     top: 0;
     left: 0;
     height: 50%;
 }
 .bg-half-overley:after {
     content: "";
     background: url(../images/landing-page/bg-02.jpg);
     background-position: center bottom;
     background-size: cover;
     width: 100%;
     display: inline-block;
     position: absolute;
     top: 0;
     left: 0;
     height: 50%;
     opacity: 0.2;
 }
 
 .bg-light-yellow{
     background: #f6f4e6 !important;
 }
 .bg-light-red{
     background: #f2e5ec !important;
 }
 .bg-light-green{
     background: #e8fff1 !important;
 }
 .bg-light-orange{
     background: #fff0f0 !important;
 }
 .bg-light-skyblue{
     background: #cbf5ff !important;
 }
 
 /*header*/
 .header {
     position: absolute;
     z-index: 9;
     width: 100%;
     left: 0;
     top: 0;
     padding: 20px 60px;
 }
 .header .navbar-light .navbar-nav .nav-link {
     color: #000;
     font-weight: 500;
     padding: 10px 20px;
     text-transform: uppercase;
     font-size: 18px;
 }
 
 
 /*banner*/
 .banner {
     padding: 100px 60px;
     background: #eaf7fc;
     padding-bottom: 0;
 }
 .banner-img {
     height: 750px;
     position: relative;
     top: 40px;
 }
 .banner-img:before {
     position: absolute;
     content: "";
     left: 0;
     top: 0;
     width: 100%;
     height: 100%;
     background: #41a3b0b8;
 }
 .banner-img:after {
     position: absolute;
     content: "";
     width: 150px;
     height: 80px;
     background: #ffffff;
     transform: rotate(45deg);
     left: -50px;
     bottom: -40px;
 }
 .banner-img img{
     height: 100%;
 }
 .video{
     height: 750px;
     width: 100%;
     overflow: hidden;
 }
 .video video{
     height: 100%;
     /*max-width: 100vw;*/
 }
 .play-bt,
 .pause-bt{
     padding: 5px;
     border-radius: 1px solid #000;
     position: absolute;
     bottom:45px;
     right: 45px;
     cursor: pointer;
 }
 .play-bt i,
 .pause-bt i {
     width: 70px;
     height: 70px;
     display: flex;
     justify-content: center;
     align-items: center;
     border: 2px solid #fff;
     border-radius: 50px;
     color: #fff;
     font-size: 30px;
 }
 .banner  .banner-content {
     padding-right: 20%;
 }
 .banner .banner-content h1 {
     font-size: 78px;
     text-transform: none;
     font-weight: 900;
     margin-bottom: 30px;
 }
 .banner .banner-content p {
     font-size: 24px;
     line-height: 34px;
     margin-bottom: 40px;
 }
 .banner .banner-content .btn-01{
     font-size: 22px;
 }
 .mobile-img {
     position: absolute;
     bottom: 0px;
     left: 50%;
     transform: translateX(-50%);
     width: 300px;
 }
 .mobile-detail {
     position: absolute;
     z-index: 9;
     top: 140px;
     left: 20px;
     width: 260px;
     height: 400px;
     overflow: hidden;
 }
 .mobile-detail h6 {
     font-size: 13px;
     font-weight: 600;
 }
 .summery-box {
     background: #fff;
     padding: 15px;
     border-radius: 5px;
     margin-bottom: 15px;
 }
 .summery-box ul {
     list-style-type: none;
     padding: 0;
     margin: 0;
 }
 .summery-box ul li {
     font-size: 13px;
     font-weight: 500;
     line-height: 24px;
 }
 .summery-box ul li span {
     color: #626262;
     font-weight: normal;
     padding-right: 5px;
 }
 
 /*invest*/
 .smart-invest .container-fluid {
     padding: 0 60px;
 }
 .invest-image {
     position: relative;
     overflow: hidden;
     transition: all 0.5s ease;
     cursor: pointer;
 }
 .invest-image:before {
     position: absolute;
     top: 0;
     left: -75%;
     z-index: 2;
     display: block;
     content: '';
     width: 50%;
     height: 100%;
     background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
     background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
     -webkit-transform: skewX(-25deg);
     transform: skewX(-25deg);
 }
 .invest-image img {
     transform: scale(1);
     transition: all 0.5s ease;
 }
 .invest-image:hover:before {
     -webkit-animation: shine .75s;
     animation: shine .75s;
 }
 .invest-image:hover img {
     transform: scale(1.2);
 }
 .invest-box .invest-content {
     padding: 30px;
     text-align: center;
 }
 .invest-box .invest-content h4 {
     font-size: 20px;
     text-transform: none;
     font-weight: 600;
     margin-bottom: 10px;
 }
 .invest-box .invest-content p {
     margin-bottom: 0;
 }
 .invest-box .invest-content.balance{
     background: #ddecf6;
 }
 .invest-box .invest-content.growth{
     background: #d0e3d8;
 }
 .invest-box .invest-content.income1{
     background: #f5ede1;
 }
 
 /*feature*/
 .feature-box {
     margin: 0 10%;
     text-align: center;
 }
 .feature-box .feature-image {
     text-align: center;
     padding: 70px 50px;
     background: #e7e4fb;
     position: relative;
     cursor: pointer;
 }
 .feature-image img {
     position: relative;
     transition: all 0.8s ease;
     transform: rotate(0deg);
 }
 .feature-image:hover img {
     transform: rotate(360deg);
 }
 .feature-box .feature-image:before,
 .feature-box .feature-image:after {
     position: absolute;
     content: "";
     width: 70px;
     height: 70px;
     background: #f8f9fa;
     transform: rotate(45deg);
 }
 .feature-box .feature-image:before {
     left: -40px;
     bottom: -40px;
 }
 .feature-box .feature-image:after {
     right: -40px;
     top: -40px;
 }
 .feature-content {
     padding: 30px 15px;
 }
 .feature-content h6 {
     font-size: 22px;
     margin-bottom: 15px;
 }
 .feature-content p {
     margin-bottom: 20px;
 }
 
 .feature-content a{
     text-decoration: none;
     color: #041f42;
 }
 
 .mobile-screen-2 {
     position: relative;
 }
 .mobile-screen-2 .annual-cash-flow {
     width: 85%;
     margin: 0 auto;
     position: absolute;
     top: 22%;
     left: 50%;
     transform: translateX(-50%);
     height: 65%;
     overflow: hidden;
 }
 
 .mobile-screen-2 .annual-cash-flow .card {
     border-radius: 10px;
     border: none;
 }
 
 .mobile-screen-2 .annual-cash-flow .card-header {
     background: transparent;
     border-bottom: 1px solid #00000005;
     padding: 15px 20px;
 }
 .mobile-screen-2 .annual-cash-flow .card-header .card-title{
     margin-bottom: 0;
     text-transform: none;
 }
 #graph svg {
     height: 160px;
 }
 #graph2 svg {
     height: 160px;
 }
 span.income1 {
     font-size: 16px;
     color: #41A3AF;
     position: relative;
     font-weight: 500;
     padding-left: 20px;
     text-align: center;
     display: inline-block;
 }
 span.income1:before {
     position: absolute;
     content: "";
     background: #41a3b0;
     height: 14px;
     width: 14px;
     top: 7px;
     border-radius: 4px;
     left: 0px;
 }
 span.income-price1 {
     font-size: 15px;
     font-weight: 500;
     text-align: center;
     display: block;
     line-height: 24px;
 }
 span.taxes1 {
     font-size: 16px;
     color: #4c5c71;
     position: relative;
     padding-left: 20px;
     font-weight: 500;
     display: inline-block;
     padding-bottom: 0;
     text-align: center;
 }
 .taxes1:before {
     position: absolute;
     content: "";
     background: #4c5c71;
     height: 14px;
     width: 14px;
     top: 9px;
     left: 0px;
     border-radius: 4px;
 }
 span.taxes-price1 {
     font-size: 15px;
     font-weight: 500;
     text-align: center;
     display: block;
 }
 
 /*team*/
 .team-section.bg-half-overley:after {
     background: url(./images/landing-page/bg-01.jpg);
     background-position: center bottom;
     background-size: cover;
 }
 .team-section .container{
     position: relative;
     z-index: 9;
 }
 .team-item {
     padding: 20px;
     position: relative;
     padding-top: 40px;
 }
 .team-item:after {
     position: absolute;
     top: 0px;
     left: 50%;
     transform: translateX(-50%);
     width: 15px;
     height: 14px;
     background: #d4e2ed;
     content: "";
 }
 .team-item:before {
     position: absolute;
     content: "";
     width: 100%;
     background: #d4e2ed;
     bottom: 0;
     left: 0;
     height: 60%;
     z-index: -1;
 }
 .team-image {
     position: relative;
     transition: all 0.5s ease;
     overflow: hidden;
 }
 
 .team-image img {
     transform: scale(1);
     transition: all 0.5s ease;
 }
 .team-image:hover img {
     transform: scale(1.1);
 }
 
 .team-detail {
     text-align: center;
     padding-top: 30px;
 }
 .team-detail h5{
     text-transform: inherit;
 }
 
 .team-02.team-item:after,
 .team-02.team-item:before {
     background: #c9dcd8;
 }
 .team-03.team-item:after,
 .team-03.team-item:before {
     background: #dcdfce;
 }
 
 .team-04.team-item:after,
 .team-04.team-item:before {
     background: #f0e2bf;
 }
 
 
 /*step*/
 .step {
     text-align: center;
     position: relative;
 }
 .step-count {
     font-size: 26px;
     color: #323232;
     font-weight: 600;
     margin-bottom: 50px;
     display: block;
 }
 .step-icon {
     display: inline-block;
     margin: 0 auto;
     position: relative;
     width: 240px;
     height: 240px;
     padding-top: 35px;
 }
 .step-icon .icon {
     display: inline-flex;
     background: #b1cbea;
     border-radius: 100%;
     padding: 40px;
     border: 4px solid #fff;
     box-shadow: 0px 1px 10px 0px rgb(0 0 0 / 8%);
     position: relative;
 }
 .step-icon .icon:before {
     position: absolute;
     content: "";
     left: 50%;
     top: -50px;
     transform: translateX(-50%);
     width: 4px;
     height: 50px;
     background: #b1cbea;
 }
 .step-icon .icon:after {
     position: absolute;
     content: "";
     left: 50%;
     top: -56px;
     background: #b1cbea;
     width: 8px;
     height: 8px;
     border-radius: 50px;
     transform: translateX(-50%);
 }
 .step-name {
     display: block;
     font-size: 20px;
     font-weight: 500;
     margin-top: 30px;
     color: #627792;
 }
 .steo-01 .step-icon {
     background: url(../images/landing-page/step-icon-bg.png);
     background-size: contain;
     background-repeat: no-repeat;
 }
 .steo-02 .step-icon {
     background: url(../images/landing-page/step-02-icon-bg.png);
     background-size: contain;
     background-repeat: no-repeat;
 }
 .steo-02 .step-icon .icon,
 .steo-02 .step-icon .icon:before,
 .steo-02 .step-icon .icon:after{
     background: #a9dad0;
 }
 .steo-03 .step-icon {
     background: url(../images/landing-page/step-03-icon-bg.png);
     background-size: contain;
     background-repeat: no-repeat;
 }
 .steo-03 .step-icon .icon,
 .steo-03 .step-icon .icon:before,
 .steo-03 .step-icon .icon:after{
     background: #e2b0c9;
 }
 .steo-04 .step-icon {
     background: url(../images/landing-page/step-04-icon-bg.png);
     background-size: contain;
     background-repeat: no-repeat;
 }
 .steo-04 .step-icon .icon,
 .steo-04 .step-icon .icon:before,
 .steo-04 .step-icon .icon:after{
     background: #cdd09a;
 }
 .step-icon .icon img {
     position: relative;
     transition: all 0.8s ease;
     transform: rotate(0deg);
 }
 .step-icon:hover .icon img {
     transform: rotate(360deg);
 }
 
 /*testimonial*/
 .testimonial-section .container{
     position: relative;
     z-index: 9;
 }
 .testimonial-item {
     padding: 50px;
     background: #ffff;
     border-radius: 10px;
 }
 .testimonial-content {
     font-size: 24px;
     line-height: 34px;
     margin-bottom: 20px;
     color: #141417;
     text-transform: inherit;
 }
 .testimonial-name {
     font-size: 26px;
     line-height: 36px;
     color: #42a4b1;
     font-weight: 500;
 }
 
 /*faq*/
 .faq-list {
     margin-bottom: 40px;
 }
 .faq-question {
     margin-bottom: 15px;
     font-size: 22px;
     font-weight: 500;
     text-transform: inherit;
 }
 .faq-answer{
     color: #627792;
 }
 
 /*footer*/
 
 .footer{background:#041f42;padding: 100px 0 0 0;}
 .footer-top {
     padding-bottom: 50px;
 }
 .newslatter-form input{height: 50px;}
 .newslatter-form .submit-btn {color: #fff;background: #41a3b0;border-radius: 0;width: 100%;font-weight: 400;text-transform: capitalize;margin-top: 15px;padding: 12px 40px;border-radius: 6px;}
 
 .footer-widget{padding-right: 40px;}
 .footer-widget p{color: #fff;}
 .footer-logo {margin-bottom: 30px;}
 
 .footer-menu ul{padding-left: 0px;margin-bottom: 0px;}
 .footer-menu ul li{list-style: none;margin-bottom: 25px;}
 .footer-menu ul li a{color: #fff;text-decoration: none;}
 
 .sidebar-footer-menu{position: fixed;bottom: 40px;width: 290px;}
 
 .footer .footer-widget-title {font-size: 16px;line-height: 24px;font-weight: 600;color: #fff;margin-bottom: 40px;position: relative; text-transform: inherit;}
 .footer .footer-widget-title:after { content: '';width: 70px;height: 2px;background-color: #41a3b0;display: block;margin-top: 10px;}
 
 .footer-bottom{background: #001c40;padding: 20px 0px;}
 .footer-bottom .copyright p{margin-bottom: 0px;color: #fff;}
 .footer-bottom .socila {display: block; margin-bottom: 0px;}
 .footer-bottom .socila li a{color: #fff;}
 .footer-bottom .socila li {margin: 0;margin-right: 5px;display: inline-block;}
 .footer-bottom .socila li span {display: inline-block;color: #ffffff;margin-right: 12px;}
 
 .footer-contact.list-unstyled li{color: #fff;display: flex;margin-bottom: 20px;}
 .footer-contact.list-unstyled li .footer-contact-icon{padding-right: 15px;}
 .footer-contact-info a{color: #41a3b0;text-decoration: none;}
 .text-red{color:#e3324c !important;}
 .sidebar-nav ul li a.text-red i{color:#e3324c;}
 
 
 @media only screen and (max-width: 1500px) {
 
     .banner .banner-content h1 {
         font-size: 66px;
     }
 
 }
 
 @media only screen and (max-width: 1399px) {
 
     .banner .banner-content h1 {
         font-size: 62px;
     }
 
     .space-ptb {
         padding: 100px 0;
     }
 
     .testimonial-item {
         padding: 40px;
     }
     .testimonial-content {
         font-size: 20px;
         line-height: 30px;
     }
 
     .faq-question {
         font-size: 18px;
     }
     .header .navbar-light .navbar-nav .nav-link {
         padding: 10px 15px;
         font-size: 16px;
     }
 }
 
 @media only screen and (max-width: 1280px) {
 
     .banner .banner-content h1 {
         font-size: 52px;
     }
 
     .header{
         padding: 20px 30px;
     }
     .banner {
         padding: 80px 30px;
         padding-bottom: 0;
     }
     .header .navbar-light .navbar-nav .nav-link{
         padding: 10px 14px;
         font-size: 16px;
     }
 
 }
 
 @media only screen and (max-width: 1199px) {
 
     .header {
         padding: 20px 0px;
     }
     .banner {
         padding: 80px 0px;
         padding-bottom: 0;
     }
     .mobile-img{
         left: 55%;
     }
 
     .navbar-toggler {
         position: absolute;
         right: 15px;
         top: 50%;
         transform: translateY(-50%);
     }
     .navbar-collapse {
         position: absolute;
         top: 100%;
         left: 0;
         width: 100%;
         z-index: 9;
         background: #eaf7fc;
     }
     .navbar form {
         padding-right: 80px;
     }
 
 }
 
 @media only screen and (max-width: 991px) {
 
     .banner .banner-content{
         padding-right: 0;
         padding-top: 50px;
         padding-bottom: 30px;
     }
 
     .banner-img {
         height: 100%;
         top: 0;
     }
     .video {
         height: 100%;
     }
     .mobile-img {
         display: none;
     }
 
     .section-title .title {
         font-size: 28px;
     }
     .section-title {
         margin-bottom: 30px;
     }
     .space-ptb {
         padding: 60px 0;
     }
 
     .feature-box .feature-image:before, .feature-box .feature-image:after{
         width: 50px;
         height: 50px;
     }
     .feature-box .feature-image:before {
         left: -25px;
         bottom: -25px;
     }
     .feature-box .feature-image:after {
         right: -25px;
         top: -25px;
     }
     .feature-content{
         padding-bottom: 0;
     }
     .testimonial-item {
         padding: 20px;
     }
     .faq-list:last-child {
         margin-bottom: 0px;
     }
     .footer {
         padding: 60px 0 0 0;
     }
 
 }
 
 @media only screen and (max-width: 767px) {
 
     h3 {
         font-size: 22px;
     }
 
     .btn-01 {
         font-size: 16px;
         line-height: 26px;
         padding: 12px 20px
     }
 
     .banner .banner-content h1{
         margin-bottom: 10px;
     }
     .banner .banner-content p{
         margin-bottom: 10px;
     }
     .banner .banner-content .btn-01 {
         font-size: 18px;
     }
 
     .feature-box {
         margin: 0;
         overflow: hidden;
     }
 
     .testimonial-name {
         font-size: 22px;
         line-height: 32px;
     }
 
     .footer-menu ul li {
         margin-bottom: 10px;
     }
     .footer .footer-widget-title{
         margin-bottom: 20px;
     }
     .btn-lg-01{
             padding: 20px 30px;
     }
 
 }
 
 @media only screen and (max-width: 575px) {
 
     .navbar form{
         display: none !important;
     }
 
     .banner .banner-content h1 {
         font-size: 42px;
     }
     .banner .banner-content p {
         font-size: 18px;
         line-height: 28px;
     }
     .banner .banner-content .btn-01 {
         font-size: 16px;
     }
     .banner .banner-content {
         padding-top: 20px;
         padding-bottom: 20px;
     }
     .section-title .title {
         font-size: 24px;
     }
     .btn-lg-01{
         padding: 20px 30px;
     }
 
 
     .navbar-brand img{
         height: 30px;
     }
 
     .footer-widget,.footer-widget-title{
         text-align: center;
         padding: 0;
     }
     .footer .footer-widget-title:after{
         margin: 10px auto;
     }
     .footer-contact.list-unstyled li {
         color: #fff;
         display: block;
         margin-bottom: 20px;
         text-align: center;
     }
 
 }