body { background: #fff; color: #444; font-family: "Montserrat", sans-serif;}
a { color: #000; transition: 0.5s;}
.white{color: #fff;}
.blue{color: #74b5fc;}
a:hover, a:active, a:focus { color: #0067d5; outline: none; text-decoration: none;}
p { padding: 0; margin: 0 0 15px 0;}
h1, h2, h3, h4, h5, h6 {font-family: "Montserrat", sans-serif; font-weight: 400; margin: 0 0 20px 0; padding: 0;}
h1{width: 100%;}
.mtb{ margin: 35px 0;}
.container{max-width: 98%;}
.back-to-top { position: fixed; display: none; background: #1d49b6; color: #fff; width: 44px; height: 44px; text-align: center; line-height: 1; font-size: 16px; border-radius: 50%; right: 15px; bottom: 15px; transition: background 0.5s; z-index: 11;}
.back-to-top i { padding-top: 12px; color: #fff;}
.pb-45{ padding-bottom: 45px;}
.faq-heading{ border-bottom: #777; padding: 20px 60px;}
.faq-container{ display: flex; justify-content: center; flex-direction: column;}
.hr-line{ width: 100%; margin: auto;}
/* Style the buttons that are used to open and close the faq-page body */
.faq-page { /* background-color: #eee; */ color: #444; cursor: pointer; padding: 30px 20px; width: 100%; border: none; outline: none; transition: 0.4s; margin: auto;}
.faq-body{ margin: auto; /* text-align: center; */width: 100%; padding: auto;}
.blog-block img{ max-width: 100%; width: 100%; object-fit: contain;}
.association img{ max-width: 20%; width: 100%; margin: 25px 2px 0 0; background: #f7f7f7; padding: 6px;border-radius: 2px;}
.association{ margin-top: 25px;}
.graphs-list{ list-style:circle; margin-left: 30px}
.graphs-list li{ margin-bottom: 10px;}
/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active, .faq-page:hover { background-color: #F9F9F9;}
.text-center{ text-align: center;}
/* Style the faq-page panel. Note: hidden by default */
.faq-body { padding: 0 18px; background-color: white; display: none; overflow: hidden;}
.faq-page:after { content: '\02795'; /* Unicode character for "plus" sign (+) */ font-size: 13px; color: #777; float: right; margin-left: 5px;}
.active:after { content: "\2796"; margin-top: 10px; border: none; background-color: none !important; display: none; /* Unicode character for "minus" sign (-) */}
#preloader { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 9999; overflow: hidden; background: #fff;}
#preloader:before {content: ""; position: fixed; top: calc(50% - 30px); left: calc(50% - 30px); border: 6px solid #f2f2f2; border-top: 6px solid #1d49b6; border-radius: 50%; width: 60px; height: 60px;-webkit-animation: animate-preloader 1s linear infinite; animation: animate-preloader 1s linear infinite;}
@-webkit-keyframes animate-preloader {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes animate-preloader {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
#header { height: 80px; transition: all 0.5s; z-index: 997; transition: all 0.5s; padding: 20px 0; background: #fff; box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.3);}
#header.header-scrolled, #header.header-pages { height: 60px; padding: 10px 0;}
#header .logo h1 { font-size: 36px; margin: 0; padding: 0; line-height: 1; font-weight: 400; letter-spacing: 3px; text-transform: uppercase;}
#header .logo h1 a, #header .logo h1 a:hover { color: #00366f; text-decoration: none;}
#header .logo img { padding: 0; margin: 2px 0; max-height: 45px;}
.main-pages { margin-top: 60px;}
#intro { width: 100%; position: relative; background: url("../img/shape-31.png") 50px 100px no-repeat; background-size: initial; background-color: #fff; padding: 160px 0 50px 0; box-shadow: 0px 0px 10px rgba(127, 137, 161, 0.3);}
#intro .intro-img { width: 50%; float: right;}
#intro .intro-info { width: 50%; float: left; margin-top: 30px;}
#intro .intro-info h1 { color: #000; margin-bottom: 40px; font-size: 48px; font-weight: 700; font-family: "Manrope", Sans-serif;}
#intro .intro-info h1 span { color: #1e49b6;}
#intro .intro-info .btn-get-started, #intro .intro-info .btn-services { font-family: "Montserrat", sans-serif; font-size: 14px; font-weight: 600; letter-spacing: 1px; display: inline-block; padding: 10px 32px; border-radius: 50px; transition: 0.5s; margin: 0 20px 20px 0; color: #fff;}
#intro .intro-info .btn-get-started { background: #1d49b6; border: 2px solid #1d49b6; color: #fff;}
#intro .intro-info .btn-get-started:hover { background: none; border-color: #fff; color: #fff;}
#intro .intro-info .btn-services { border: 2px solid #fff;}
#intro .intro-info .btn-services:hover { background: #1d49b6; border-color: #1d49b6; color: #fff;}
.img-left, .img-right{ width: 100%;}
.main-nav, .main-nav * { margin: 0; padding: 0; list-style: none;}
.main-nav > ul > li { position: relative; white-space: nowrap; float: left;}
.main-nav a { display: block; position: relative; color: #004289; padding: 10px 15px; transition: 0.3s; font-size: 14px; font-family: "Montserrat", sans-serif; font-weight: 500;}
.main-nav a:hover, .main-nav li.active > a, .main-nav li:hover > a { color: #000; text-decoration: none;}
.main-nav .drop-down ul { display: block; position: absolute; left: 0; top: calc(100% + 30px); z-index: 99; opacity: 0; visibility: hidden; padding: 10px 0; background: #fff; box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25); transition: ease all 0.3s;}
.main-nav .drop-down:hover > ul { opacity: 1; top: 100%; visibility: visible;}
.main-nav .drop-down li { min-width: 180px; position: relative;}
.main-nav .drop-down ul a { padding: 10px 20px; font-size: 13px; color: #004289;}
.main-nav .drop-down ul a:hover, .main-nav .drop-down ul li.active > a, .main-nav .drop-down ul li:hover > a { color: #000;}
.main-nav .drop-down > a:after { content: "\f107"; font-family: FontAwesome; padding-left: 10px;}
.main-nav .drop-down .drop-down ul { top: 0; left: calc(100% - 30px);}
.main-nav .drop-down .drop-down:hover > ul { opacity: 1; top: 0; left: 100%;}
.main-nav .drop-down .drop-down > a { padding-right: 35px;}
.main-nav .drop-down .drop-down > a:after { content: "\f105"; position: absolute; right: 15px;}
.mobile-nav { position: fixed; top: 0; bottom: 0; z-index: 9999; overflow-y: auto; left: -260px; width: 260px; padding-top: 18px; background: rgba(19, 39, 57, 0.8); transition: 0.4s;}
.mobile-nav * { margin: 0; padding: 0; list-style: none;}
.mobile-nav a {  display: block; position: relative; color: #fff; padding: 10px 20px; font-weight: 500;}
.mobile-nav a:hover, .mobile-nav .active > a, .mobile-nav li:hover > a { color: #74b5fc; text-decoration: none;}
.mobile-nav .drop-down > a:after { content: "\f078"; font-family: FontAwesome; padding-left: 10px; position: absolute; right: 15px;}
.mobile-nav .active.drop-down > a:after { content: "\f077";}
.mobile-nav .drop-down > a { padding-right: 35px;}
.mobile-nav .drop-down ul { display: none; overflow: hidden;}
.mobile-nav .drop-down li { padding-left: 20px;}
.mobile-nav-toggle { position: fixed; right: 0; top: 0; z-index: 9998; border: 0; background: none; font-size: 24px; transition: all 0.4s; outline: none !important; line-height: 1; cursor: pointer; text-align: right;}
.mobile-nav-toggle i { margin: 18px 18px 0 0; color: #004289;}
.mobile-nav-overly { width: 100%; height: 100%; z-index: 9997; top: 0; left: 0; position: fixed; background: rgba(19, 39, 57, 0.8); overflow: hidden; display: none;}
.mobile-nav-active { overflow: hidden;}
.mobile-nav-active .mobile-nav { left: 0;}
.mobile-nav-active .mobile-nav-toggle i { color: #fff;}
.free-demo{ float: right; margin-left: 10px;}
.section-header h3 { font-size: 36px; color: #1d49b6; text-align: center; font-weight: 500; position: relative;}
.section-header p { text-align: center; margin: auto; font-size: 15px; padding-bottom: 60px; color: #556877; width: 100%;}
.section-bg { background: #ecf5ff;}
.section-bg1 { background: #f1f0f0;}
#about { background: #fff; padding: 60px 0;}
.about-container img.img-fluid{ object-fit: contain; width: 100%;}
#about .about-container .background { margin: 0px 0 20px 0;}
#about .about-container .content { background: #fff;}
#about .about-container .title { color: #333; font-weight: 700; font-size: 32px;}
#about .about-container p { line-height: 26px;}
#about .about-container p:last-child { margin-bottom: 0;}
#about .about-container .icon-box { background: #fff; background-size: cover; padding: 0 0 30px 0;}
#about .about-container .icon-box .icon { float: left; background: #fff; width: 64px; height: 64px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; text-align: center; border-radius: 50%; border: 2px solid #1d49b6; transition: all 0.3s ease-in-out;}
#about .about-container .icon-box .icon i { color: #1d49b6; font-size: 24px;}
#about .about-container .icon-box:hover .icon { background: #1d49b6;}
#about .about-container .icon-box:hover .icon i { color: #fff;}
#about .about-container .icon-box .title { margin-left: 80px; font-weight: 600; margin-bottom: 5px; font-size: 18px;}
#about .about-container .icon-box .title a { color: #1d49b6;}
#about .about-container .icon-box .description { margin-left: 80px; line-height: 24px; font-size: 16px;}
#about .about-extra { padding-top: 60px;}
#about .about-extra h4 { font-weight: 600; font-size: 24px;}
#features { padding: 60px 0 40px 0; box-shadow: inset 0px 0px 12px 0px rgba(0, 0, 0, 0.1);}
#features .box { padding: 30px; position: relative; overflow: hidden; border-radius: 10px; margin: 0 10px 40px 10px; background: #fff; box-shadow: 0 10px 29px 0 rgba(68, 88, 144, 0.1); transition: all 0.3s ease-in-out; min-height: 312px;}
#features .box:hover { -webkit-transform: translateY(-5px); transform: translateY(-5px);}
#features .icon { position: absolute; left: -10px; top: calc(50% - 32px);}
#features .icon i { font-size: 64px; line-height: 1; transition: 0.5s;}
#features .title { margin-left: 0px; font-weight: 600; margin-bottom: 15px; font-size: 18px; color: #1d49b6; font-family: "Montserrat", sans-serif;}
#features .title a { color: #1d49b6;}
#features .box:hover .title a { color: #1d49b6;}
#features .description { font-size: 15px; margin-left: 20px; line-height: 24px; margin-bottom: 0;}
#why-us { padding: 60px 0; background: #004a99;}
#why-us .section-header h3, #why-us .section-header p { color: #fff;}
#why-us .card {background: #00458f; border-color: #00458f; border-radius: 10px; margin: 0 15px; padding: 15px 0; text-align: center; color: #fff; transition: 0.3s ease-in-out; height: 100%;}
#why-us .card:hover { background: #003b7a; border-color: #003b7a;}
#why-us .card i { font-size: 48px; padding-top: 15px; color: #bfddfe;}
#why-us .card h5 { font-size: 22px; font-weight: 600;}
#why-us .card p { font-size: 15px; color: #d8eafe;}
#why-us .card .readmore {color: #fff; font-weight: 600; display: inline-block; transition: 0.3s ease-in-out; border-bottom: #00458f solid 2px;}
#why-us .card .readmore:hover { border-bottom: #fff solid 2px;}
#why-us .counters { padding-top: 40px;}
#why-us .counters span { font-family: "Montserrat", sans-serif; font-weight: bold; font-size: 48px; display: block; color: #fff;}
#why-us .counters p {padding: 0; margin: 0 0 20px 0; font-family: "Montserrat", sans-serif; font-size: 14px; color: #cce5ff;}
#portfolio { padding: 60px 0; box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.1);}
#portfolio #portfolio-flters { padding: 0; margin: 5px 0 35px 0; list-style: none; text-align: center;}
#portfolio #portfolio-flters li { cursor: pointer; margin: 15px 15px 15px 0; display: inline-block; padding: 6px 20px; font-size: 12px; line-height: 20px; color: #1d49b6; border-radius: 50px; text-transform: uppercase; background: #ecf5ff; margin-bottom: 5px; transition: all 0.3s ease-in-out;}
#portfolio #portfolio-flters li:hover, #portfolio #portfolio-flters li.filter-active { background: #1d49b6; color: #fff;}
#portfolio #portfolio-flters li:last-child { margin-right: 0;}
#portfolio .portfolio-item { position: relative; overflow: hidden; margin-bottom: 30px;}
#portfolio .portfolio-item .portfolio-wrap { overflow: hidden; position: relative; border-radius: 6px; margin: 0;}
#portfolio .portfolio-item .portfolio-wrap:hover img { opacity: 0.4; transition: 0.3s;}
#portfolio .portfolio-item .portfolio-wrap .portfolio-info { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; text-align: center; opacity: 0; transition: 0.2s linear;}
#portfolio .portfolio-item .portfolio-wrap .portfolio-info h4 { font-size: 22px; line-height: 1px; font-weight: 700; margin-bottom: 14px; padding-bottom: 0;}
#portfolio .portfolio-item .portfolio-wrap .portfolio-info h4 a { color: #fff;}
#portfolio .portfolio-item .portfolio-wrap .portfolio-info h4 a:hover { color: #1d49b6;}
#portfolio .portfolio-item .portfolio-wrap .portfolio-info p { padding: 0; margin: 0; color: #e2effe; font-weight: 500; font-size: 14px; text-transform: uppercase;}
#portfolio .portfolio-item .portfolio-wrap .portfolio-info .link-preview, #portfolio .portfolio-item .portfolio-wrap .portfolio-info .link-details { display: inline-block; line-height: 1; text-align: center; width: 36px; height: 36px; background: #1d49b6; border-radius: 50%; margin: 10px 4px 0 4px;}
#portfolio .portfolio-item .portfolio-wrap .portfolio-info .link-preview i, #portfolio .portfolio-item .portfolio-wrap .portfolio-info .link-details i { padding-top: 6px; font-size: 22px; color: #fff;}
#portfolio .portfolio-item .portfolio-wrap .portfolio-info .link-preview:hover, #portfolio .portfolio-item .portfolio-wrap .portfolio-info .link-details:hover { background: #3395ff;}
#portfolio .portfolio-item .portfolio-wrap .portfolio-info .link-preview:hover i, #portfolio .portfolio-item .portfolio-wrap .portfolio-info .link-details:hover i { color: #fff;}
#portfolio .portfolio-item .portfolio-wrap:hover { background: #003166;}
#portfolio .portfolio-item .portfolio-wrap:hover .portfolio-info { opacity: 1;}
#testimonials { padding: 35px 0; box-shadow: inset 0px 0px 12px 0px rgba(0, 0, 0, 0.1);}
#testimonials .section-header { margin-bottom: 40px;}
#testimonials .testimonial-item .testimonial-img { width: 120px; border-radius: 50%; border: 4px solid #fff; float: left; height: 120px;}
.testimonial-item{width: 100%;float: left;}
#testimonials .testimonial-item h3 { font-size: 20px; font-weight: bold; margin: 0; color: #111; width: 100%;   float: left;}
#testimonials .testimonial-item h4 { font-size: 14px; color: #999; margin: 0 0 15px 0; margin-left: 140px;}
#testimonials .testimonial-item p { font-style: italic; margin: 0;}
#testimonials .owl-nav, #testimonials .owl-dots { margin-top: 5px; text-align: center;}
#testimonials .owl-dot { display: inline-block; margin: 0 5px; width: 12px; height: 12px; border-radius: 50%; background-color: #ddd;}
#testimonials .owl-dot.active { background-color: #1d49b6;}
.ecom-img {vertical-align: middle;display: inline-block;margin-left: 80px;width: 140px;}
.ecom-text{ vertical-align: middle;display: inline-block;width: calc(100% - 231px);}
#team { background: #fff; padding: 60px 0; box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.1);}
#team .member { text-align: center; margin-bottom: 20px; position: relative; border-radius: 50%; overflow: hidden;}
#team .member .member-info { opacity: 0; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; position: absolute; bottom: 0; top: 0; left: 0; right: 0; transition: 0.2s;}
#team .member .member-info-content { margin-top: 50px; transition: margin 0.2s;}
#team .member:hover .member-info { background: rgba(0, 62, 128, 0.7); opacity: 1; transition: 0.4s;}
#team .member:hover .member-info-content { margin-top: 0; transition: margin 0.4s;}
#team .member h4 { font-weight: 700; margin-bottom: 2px; font-size: 18px; color: #fff;}
#team .member span { font-style: italic; display: block; font-size: 13px; color: #fff;}
#team .member .social { margin-top: 15px;}
#team .member .social a { transition: none; color: #fff;}
#team .member .social a:hover { color: #1d49b6;}
#team .member .social i { font-size: 18px; margin: 0 2px;}
#clients { padding: 60px 0; box-shadow: inset 0px 0px 12px 0px rgba(0, 0, 0, 0.1);}
.marketplaces-text{width: 100%;float: left;padding: 2px 10px;}
#clients .clients-wrap { margin-bottom: 30px;}
.no-gutters>.col, .no-gutters>[class*=col-] { padding-right: 15px; padding-left: 15px;}
#clients .client-logo { padding: 64px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; border-right: 1px solid #d6eaff; border-bottom: 1px solid #d6eaff; overflow: hidden; background: #fff; height: 160px;}
#clients .client-logo:hover img { -webkit-transform: scale(1.2); transform: scale(1.2);}
#clients img {  transition: all 0.4s ease-in-out;}
#contact { box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.1); padding: 60px 0; overflow: hidden; float: left; width: 100%;}
#contact .section-header { padding-bottom: 30px;}
#contact .contact-about h3 { font-size: 36px; margin: 0 0 10px 0; padding: 0; line-height: 1; font-family: "Montserrat", sans-serif; font-weight: 300; letter-spacing: 3px; text-transform: uppercase; color: #1d49b6;}
#contact .contact-about p { font-size: 14px; line-height: 24px; font-family: "Montserrat", sans-serif; color: #888;}
#contact .social-links { padding-bottom: 20px;}
#contact .social-links a { font-size: 18px; display: inline-block; background: #fff; color: #1d49b6; line-height: 1; padding: 8px 0; margin-right: 4px; border-radius: 50%; text-align: center; width: 36px; height: 36px; transition: 0.3s; border: 1px solid #1d49b6;}
#contact .social-links a:hover { background: #1d49b6; color: #fff;}
#contact .info { color: #1d49b6;}
#contact .info i {font-size: 32px; color: #1d49b6; float: left; line-height: 1;}
#contact .info p { padding: 0 0 10px 36px; line-height: 28px; font-size: 14px;}
#contact .form #sendmessage { color: #1d49b6; border: 1px solid #1d49b6; display: none; text-align: center; padding: 15px; font-weight: 600; margin-bottom: 15px;}
#contact .form #errormessage { color: red; display: none; border: 1px solid red; text-align: center; padding: 15px; font-weight: 600; margin-bottom: 15px;}
#contact .form #sendmessage.show, #contact .form #errormessage.show, #contact .form .show { display: block;}
#contact .form .validation { color: red; display: none; margin: 0 0 20px; font-weight: 400; font-size: 13px;}
#contact .form input, #contact .form textarea { border-radius: 0; box-shadow: none; font-size: 14px;}
#contact .form button[type="submit"] { background: #1d49b6; border: 0; border-radius: 20px; padding: 8px 30px; color: #fff; transition: 0.3s;}
#contact .form button[type="submit"]:hover { background: #0067d5; cursor: pointer;}
#footer { background: #00428a; padding: 0 0 30px 0; color: #eee; font-size: 14px; float: left; width: 100%;}
#footer .footer-top { background: #004a99; padding: 60px 0 30px 0;}
#footer .footer-top .footer-info { margin-bottom: 30px;}
#footer .footer-top .footer-info h3 { font-size: 34px; margin: 0 0 20px 0; padding: 2px 0 2px 0; line-height: 1; font-family: "Montserrat", sans-serif; color: #fff; font-weight: 400; letter-spacing: 3px; text-transform: uppercase;}
#footer .footer-top .footer-info p { font-size: 13px; line-height: 24px; margin-bottom: 0; font-family: "Montserrat", sans-serif; color: #ecf5ff;}
#footer .footer-top .social-links a { font-size: 18px; display: inline-block; background: #5d8af9; color: #fff; line-height: 1; padding: 8px 0; margin-right: 4px; border-radius: 50%; text-align: center; width: 36px; height: 36px; transition: 0.3s;}
#footer .footer-top .social-links a:hover {background: #012852; color: #fff;}
#footer .footer-top h4 {font-size: 14px; font-weight: bold; color: #fff; text-transform: uppercase; position: relative; padding-bottom: 10px;}
#footer .footer-top .footer-links { margin-bottom: 30px;}
#footer .footer-top .footer-links ul { list-style: none; padding: 0; margin: 0;}
#footer .footer-top .footer-links ul li { padding: 8px 0;}
#footer .footer-top .footer-links ul li:first-child { padding-top: 0;}
#footer .footer-top .footer-links ul a { color: #ecf5ff;}
#footer .footer-top .footer-links ul a:hover { color: #74b5fc;}
#footer .footer-top .footer-contact { margin-bottom: 30px;}
#footer .footer-top .footer-contact span img{ width: 10%;}
#footer .footer-top .footer-contact a{ color: #fff;}
#footer .footer-top .footer-contact p {line-height: 26px;}
#footer .footer-top .footer-newsletter { margin-bottom: 30px;}
#footer .footer-top .footer-newsletter input[type="email"] { border: 0;padding: 6px 8px; width: 65%;}
#footer .footer-top .footer-newsletter input[type="submit"] { background: #ff6565; border: 0; width: 35%; padding: 6px 0; text-align: center; color:#fff; transition: 0.3s; cursor: pointer; font-weight: 700;}
#footer .footer-top .footer-newsletter input[type="submit"]:hover { background: #0062cc;}
#footer .copyright { text-align: center; padding-top: 30px;}
#footer .credits { text-align: center; font-size: 13px; color: #f1f7ff;}
#footer .credits a { color: #bfddfe;}
#footer .credits a:hover { color: #f1f7ff;}
.poweredby img{ max-width: 30%; width: 100%;}
.poweredby{ margin-top: 20px; text-align: left;}
.integrations-main { width: 100%;height: 100%;background-size: cover;float: left;}
.integrations-main  .btm{margin-bottom: 15px;}
.inte-headers{ width: 100%;  float: left;  text-align: center;  margin-top: 30px;}
.inte-headers h3{ font-family: "Montserrat", sans-serif; font-weight: 500; color: #1644b5;}
.read-more{ background-color: #1d49b6; color: #fff; padding: 8px 16px 9px; border-radius: 20px;}
.read-more:hover{ color: #fff; background-color: #0067d5;}
.home-box div.linkread-more{ text-align: center;}
.cta-integration{width: 100%;float: left;text-align: center; padding: 50px 0; background: linear-gradient(295deg, #a24bcf, #4b79cf, #a743a2); background-size: 800% 800%; animation: AnimationName 34s ease infinite;}
@keyframes cta-integration {
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}
.cta-integration p {color: #fff;font-size: 40px;margin: 10px 0;}
.integrations{width: 100%; float: left;}
  .integrations .icon-box { padding: 30px; position: relative; overflow: hidden; background: #fff; box-shadow: 0 0 29px 0 rgba(68, 88, 144, 0.12); transition: all 0.3s ease-in-out; border-radius: 8px; z-index: 1; }
  .integrations .icon-box::before { content: '';  position: absolute; background: #e1f0fa; right: -60px;  top: -40px;  width: 100px;  height: 100px;  border-radius: 50px; transition: all 0.3s; z-index: -1;}
  .integrations .icon-box:hover::before { background: #3498db; right: 0; top: 0; width: 100%; height: 100%;  border-radius: 0px; }
  .integrations .icon { margin: 0 auto 20px auto; padding-top: 10px; display: inline-block; text-align: center; border-radius: 50%; width: 60px; height: 60px; background: #3498db; transition: all 0.3s ease-in-out;}
  .intro-info span a:hover{color: #fff;}
  #why-us h3 a:hover{color: #fff;}
  .integrations .icon i {font-size: 36px;line-height: 1; color: #fff; }
  .integrations .title { font-weight: 700; margin-bottom: 15px; font-size: 18px; color: #000;font-family: "Montserrat", sans-serif;}
  .integrations .title a { color: #111; }
  #main .card{min-height: 350px; height: auto;}
  .section-header h3 a:hover {color: #0067d5;}
  .integrations .description {font-size: 15px; line-height: 28px; margin-bottom: 0; color: #000;}
  .integrations .icon-box::before .title {color: #fff;}
  .integrations .icon-box:hover .title a, .integrations .icon-box:hover .description { color: #fff; }
  .integrations .icon-box:hover .icon { background: #fff;}
    .integrations .icon-box:hover .icon i { color: #3498db;}
.integration-offline{width: 100%;float: left; padding: 20px 20px;background: #1d49b6; background-attachment: fixed; background-size: cover; color: white; border-radius: 0px; margin-bottom: 20px; text-align: center;}
.integration-offline h3{color: #fff;font-size: 50px;font-weight: 400;line-height: 60px;}
.integration-offline p{font-size: 23px;}
.main_title_2 { margin-bottom: 45px;}
.main_title, .main_title_2 { text-align: center; position: relative;}
.main_title_2 span { width: 120px; height: 2px; background-color: #e1e1e1; display: block; margin: auto;}
.main_title_2 span em { width: 60px; height: 2px; background-color: #3552A0; display: block; margin: auto;}
.main_title_2 h2 { margin: 25px 0 0;}
.box_grid { background-color: #fff; display: block; position: relative; margin-bottom: 30px; -webkit-box-shadow: 0 0 30px 0 rgba(0, 0, 0, .1); -moz-box-shadow: 0 0 30px 0 rgba(0, 0, 0, .1); box-shadow: 0 0 30px 0 rgba(0, 0, 0, .1);}
.home-box{ padding-bottom: 30px; overflow: hidden;}
.home-box .head-title{ margin-bottom: 0; text-align: center;}
.home-box .head-title img{ max-width: 40%;}
.box-common .box_grid{ display: flex; flex-direction: column;}
.box-common .box_grid h3 { color: #1d49b6; font-weight: 500; font-size: 23px; display: flex; align-items: center; text-align: center; font-family: "Montserrat", sans-serif; justify-content: center;}
.box-common .box_grid h1 { color: #1d49b6; font-weight: 800; font-size: 27px; display: flex; align-items: center; font-family: "Montserrat", sans-serif;}
.title-span{margin-left: 20px;}
.head-title{width: 100%; float: left;padding: 0px 30px; margin-top: 30px;}
.box_grid .wrapper { padding: 10px 30px; height: 330px; min-height: auto;}
.box_grid .wrapper1 { padding: 20px 30px; /* height: 420px; */ min-height: auto;}
.box_grid .wrapper2 { padding: 20px 30px; /* height: 370px; */ min-height: auto;}
.box-common .box_grid h4 { padding: 0px 10px; margin-bottom: 15px;}
.fees-div { background: #f3fbff; padding: 10px;}
.box_grid ul li:first-child {margin-right: 0;}
.box_grid ul li {margin-right: 15px;cursor: pointer;}
.box_grid ul li:first-child a { background: #fff; border: 2px solid #ff0000; color: #ff0000; padding: 5px 20px; font-weight: 500; line-height: 1; -moz-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; transition: all .3s ease-in-out; -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px;}
ol, ul { list-style: none; padding: 0;}
.card-body.blue-box { background: #172b4db3; color: #fff;}
.card-body.cadetblue-box { background-color: cadetblue; color: #fff;}
.card-body.skyblue-box { background: #0052cca1; color: #fff;}
.uc-title{ width: 100%; float: left; text-align: center;  background-color: #7a98dcd4;}
.uc-title h1{margin: 15px 0;color: #000 !important;}
.use-case-main {width: 100%;float: left; color: #514B64;}
.inner-ul{ padding: 3px 25px; width: 100%;}
.img-left{ display: inline-block; float: left; margin: 0 15px 15px 0;}
.img-right{ float: right; display: inline-block; margin: 0 0px 15px 15px;}
.comcash {width: 100%;float: left;}
.comcash .wrapper {height: auto;}
.use-case-main h1{color: #1545b3;}
.inner-ul i{ font-size: 10px; }
.rounded-lg { border-radius: 1rem !important; margin-bottom: 15px;}
.game-shop .rounded-lg {min-height: 555px;}
.liquor-store .rounded-lg {min-height: 690px;}
.food-store .rounded-lg {min-height: 520px;}
.gift-shop .rounded-lg {min-height: 520px;}
.clothing-brand .rounded-lg {min-height: 566px;}
.text-small { font-size: 0.9rem !important;}
.custom-separator { width: 5rem; height: 6px; border-radius: 1rem;}
.text-uppercase { letter-spacing: 0.2em;}
.skc-main{width: 100%;float:left;background-color: #4EA9C7;padding: 15px;color: #fff;}
.skc-img{width: 100%;float: left;margin-top: 20px;}
.skc-img img{width: 75%;}
.skc-main h1 {text-align: center;}
.skc-main .inner-ul{padding: 2px 70px;margin-top: 20px;}
.skc-main .inner-ul i{color: #fff;}
/* trusted by styles */
.trust-box-desktop {justify-content: space-between;display: flex;}
.trust-col { width: 11%; flex-direction: column; justify-content: center; align-items: center; display: flex;}
.trust-logo-box { width: 130px; height: 130px; background-color: #fff; border: 1px solid #e4e4e4; border-radius: 3px; justify-content: center; align-items: center; margin-top: 5px; margin-bottom: 5px; padding: 20px; display: flex;}
.btn-demo{ background-color: #ff6565; padding: 5px 15px; color: #fff; font-weight: 600; font-size: 16px; border: none; border-radius: 4px; outline: none; cursor: pointer;}
.btn-demo:hover{ color: #000;}

/* Testimonials */
.snip1533 { box-shadow: 0 0 5px rgba(0, 0, 0, 0.15); color: #9e9e9e; display: inline-block; font-family: 'Roboto', Arial, sans-serif; font-size: 16px; margin: 35px 0px 35px 0; /* max-width: 310px; min-width: 250px; position: relative; */ text-align: center; width: 100%; height: 375px; overflow: hidden; background-color: #ffffff; border-radius: 5px; border-top: 5px solid #1745b2;}
.snip1533 *, .snip1533 *:before { -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.1s ease-out; transition: all 0.1s ease-out;}
.snip1533 figcaption { padding: 13% 10% 12%;}
.snip1533 figcaption:before { -webkit-transform: translateX(-50%); transform: translateX(-50%); background-color: #fff; border-radius: 50%; box-shadow: 0 0 10px rgba(0, 0, 0, 0.25); color: #000000; content: "\f10e"; font-family: 'FontAwesome'; font-size: 32px; font-style: normal; left: 50%; line-height: 60px; position: absolute; top: 0px; width: 60px;}
.snip1533 h3 { color: #3c3c3c;font-size: 25px;font-weight: 400; line-height: 24px; margin: 10px 0 0px;}
.snip1533 h4 {font-weight: 400; margin: 0; opacity:1;  /* font-size: 14px; */}
.snip1533 blockquote { font-style: italic; font-weight: 300; margin: 0 0 20px;}

@media (min-width: 992px) {
  #testimonials .testimonial-item p { width: 100%; float: left;}
  #header .btn-demo{ font-size: 14px !important;}
  /* .main-nav{ float: left !important;} */
  .main-nav a{ padding: 10px; font-size: 13px;}
  #header .logo img { max-height: 40px;}

}

@media (max-width: 991px) {
  #header { height: 60px; padding: 10px 0;}
  #header .logo h1 { font-size: 28px; padding: 8px 0;}
  #intro {padding: 140px 0 60px 0;}
  #intro .intro-img { width: 80%;float: none; margin: 0 auto 25px auto;}
  #intro .intro-info { width: 80%; float: none; margin: auto; text-align: center;}
  #why-us .card { margin: 0; }
  #header .logo img{ max-height: 40px; margin-top: 0;}
  .btn-demo{ margin-right: 30px;}
  .mobile-nav .active{background-color: #023564 !important;}
  .box-common .box_grid h3{ font-size: 18px;}
  .home-box{width: 100%;}
  #about .about-container .background{ text-align: center;}
  .about-container img.img-fluid{ width: auto;}
  #intro .intro-info h1{ font-size: 38px;}
  #about .about-container .icon-box .icon{ width: 47px; height: 47px;}
  .poweredby img{max-width: 25%;}
  #footer .footer-top .footer-newsletter input[type="submit"]{ width: 21%;}
  #footer .footer-top .footer-newsletter input[type="email"]{ width: 50%;}
}

@media (max-width: 768px) {
  .back-to-top { bottom: 15px; }
  ol.breadcrumb{ width: 100% !important;}
  .poweredby img{ max-width: 15%;}
  
}

@media (max-width: 767px) {
  #intro .intro-info { width: 100%; }
  #intro .intro-info h1 { font-size: 34px; margin-bottom: 30px; }
  .section-header p { width: 100%; }
  #testimonials .testimonial-item { text-align: center; }
  #testimonials .testimonial-item .testimonial-img { float: none; margin: auto; }
  #testimonials .testimonial-item h3, #testimonials .testimonial-item h4, #testimonials .testimonial-item p { margin-left: 0; }
  .poweredby img{ max-width: 18%;}
  #footer .footer-top .footer-newsletter input[type="submit"]{width: 17%;}
  #footer .footer-top .footer-newsletter input[type="email"]{width: 40%;}
  #contact .form button[type="submit"]{ margin-top: 10px;}
  .img-left, .img-right{ max-width: 100%; margin-right: 0;}
}

@media (max-width: 992px) and (min-width: 480px) {
  #intro {padding: 100px 0 20px 0; }
  .box_grid .wrapper1 { height: auto; padding: 10px; }
  .box_grid .wrapper2 {height: auto;padding: 10px;}
  .about-extra p{ margin-top: 0 !important;}
}

@media (max-width: 480px) {
  .box-common .box_grid h3 {font-size: 22px;}
  .box-common .box_grid h1 {font-size: 24px;}
  .head-title { padding: 10px; }
  .box_grid .wrapper1 { height: auto; padding: 10px;}
  .box_grid .wrapper1 p {margin: 0 0 5px 0;}
  .box_grid .wrapper2 { padding: 10px; height: auto; }
  .box_grid .wrapper { padding: 10px; height: auto; }
  .ecom-img{ width: 100%; margin: 0; }
  .ecom-text{ width: 100%; float: left;}
  #header .btn-demo{ display: none;}
  .association img, .poweredby img{ max-width: 23%;}
  #footer .footer-top .footer-newsletter input[type="submit"]{width: 32%;}
  #footer .footer-top .footer-newsletter input[type="email"]{ width: 57%;}
  .about-extra p{ margin-top: 0 !important;}
}