/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
body { font-family: "Open Sans", sans-serif; color: #444444; }
a { color: #ffc451; text-decoration: none; }
a:hover { color: #ffd584; text-decoration: none; }
h1, h2, h3, h4, h5, h6 { font-family: Arial, Helvetica, sans-serif; font-weight:normal }
h1 { margin: 0 0 5px 0; font-size: 2.85rem; }
h2 { margin: 0 0 5px 0; font-size: 2.25rem; }
h3 { margin: 0 0 5px 0; font-size: 1.85rem; }
h4 { margin: 0 0 5px 0; font-size: 1.5rem; }
h5 { margin: 0 0 5px 0; font-size: 1.2rem; }
h6 { margin: 0 0 5px 0; font-size: 1.1rem; }
p { margin: 0 0 5px 0; font-size: 1rem; }
.container, .container-sm, .container-xl, .container-xxl {    max-width: 1170px;}
#main { margin-top: 40px; padding:0 20px }
#main.inner-page { margin-top:130px;min-height: 400px; padding:0 }
.nopad { padding: 0 }
.nopadr { padding-right: 0 }
.nopadl { padding-left: 0 }
.nopad-xs {  }
.ctr { text-align: center }
.clr { clear: both; height: 0px; margin: 0px; padding: 0px; }
.clr5 { clear: both; height: 5px; margin: 0px; padding: 0px; }
.clr10 { clear: both; height: 10px; margin: 0px; padding: 0px; }
.clr20 { clear: both; height: 20px; margin: 0px; padding: 0px; }
.spc10 { display: block; width: 10px; }
.spc20 { display: block; width: 20px; }
.rht { text-align: right }
.lft { text-align: left }
#admin_menu { position: fixed; top:0; right:0; background:#F00; padding:1px 10px; z-index:1000; font-size: 14px; }
#admin_menu a { color:#fff }
.card-header.bg-dark { background-color: #333333 !important }
.alert-dark { color: #eee; background-color: #333333; border-color: #272727;}
.breadcrumbs { padding:10px 0 }
.breadcrumbs .container { position: relative }
#divBar { width:100%; position:relative; background: #09F; left:0; padding:15px;margin: -15px 0 10px }
#myModal .modal-content {background: none; text-align: center; border:none}
#myModal .modal-header { border:none}
#myModal .btn-close { background-color:#fff }
#myModal video { max-width: 100%;  height: auto; }
/*--------------------------------------------------------------
# Back to top button
--------------------------------------------------------------*/
.back-to-top { position: fixed; visibility: hidden; opacity: 0; right: 15px; bottom: 15px; z-index: 996; background: #ffc451; width: 40px; height: 40px; border-radius: 4px; transition: all 0.4s; }
.back-to-top i { font-size: 28px; color: #151515; line-height: 0; }
.back-to-top:hover { background: #151515; }
.back-to-top:hover i { color: #ffc451; }
.back-to-top.active { visibility: visible; opacity: 1; }
/*--------------------------------------------------------------
# specialoffer
--------------------------------------------------------------*/
#specialoffer_view { position: fixed; top: 114px; z-index: 10000; max-width: 400px; width: 360px; padding: 10px 0 0; background: #fff; border-radius: 12px; }
.specialoffer-contentimg { padding: 0 }
.specialoffer-contenttxt { padding: 10px; background: #eee; color: #201f1f; border-radius: 5px; border-top: 1px solid #f2f0f0; }
.specialoffer-contenttxt p { margin: 0 }
#specialoffer_view img { width: auto; max-width: 100% }
.specialoffer-body { padding: 10px }
#specialoffer-closer { width: auto; position: absolute; left: 0; top: -6px; cursor: pointer; font-size: 22px; color: #000; z-index: 100; }

#specialofferDiv { position: relative; }
#specialoffer_layer { display: none; width: 100%; height: 100%; background: rgba(0,0,0,.4); position: fixed; left: 0; top: 0; z-index: 1000; }
#specialoffer_view { background: #f7f7f7; box-shadow: 1px 1px 2px #999; position: fixed; top: -610px; right: 30px; border-radius: 10px; padding: 20px 20px 10px; z-index: 1001; width: 100%; max-width: 600px; left: 50%; margin-left: -300px; }
@media (max-width: 768px) {
#specialoffer_view { right:0; margin-left:0; left:0 }
}
/*--------------------------------------------------------------
# Preloader
--------------------------------------------------------------*/
#preloader { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 9999; overflow: hidden; background: #151515; }
#preloader:before { content: ""; position: fixed; top: calc(50% - 0px); left: calc(50% - 30px); border: 6px solid #ffc451; border-top-color: #151515; border-bottom-color: #151515; 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% {
 transform: rotate(0deg);
}
 100% {
 transform: rotate(360deg);
}
}
 @keyframes animate-preloader {  0% {
 transform: rotate(0deg);
}
 100% {
 transform: rotate(360deg);
}
}
/*--------------------------------------------------------------
# Disable aos animation delay on mobile devices
--------------------------------------------------------------*/
@media screen and (max-width: 768px) {
 [data-aos-delay] {
 transition-delay: 0 !important;
}
}
/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
#header { transition: all 0.5s; z-index: 997; padding: 25px 0 0; }
#header .logo { font-size: 32px; margin: 0; padding: 0; line-height: 1; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; }
#header .logo a { color: #fff; }
#header .logo a span { color: #ffc451; }
#header .logo img { max-height: 40px; }
/*--------------------------------------------------------------
#  Get Startet Button
--------------------------------------------------------------*/
.get-started-btn { color: #40acf9; border-radius: 20px; padding: 7px 25px 8px 25px; white-space: nowrap; transition: 0.3s; font-size: 14px; display: inline-block; border: 2px solid #40acf9; }
.navbar a.get-started-btn:hover { background: #40acf9; color: #fff; }
.get-started-btn:hover { color: #fff; }
@media (max-width: 600px) {
#header {padding: 0; }

}
@media (max-width: 992px) {
.get-started-btn { padding: 7px 20px 8px 20px; margin-right: 15px; }
}
/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
/**
* Desktop Navigation 
*/
#nav_menuDiv {padding: 6px 20px; border-radius: 30px;box-shadow: 1px 1px 3px #999;background: #fff; }
#nav_menu {background: #fff; padding: 0; margin-top:5px; border-top:1px solid #999 }
.navbar { padding: 0; width:100%;text-align: right;display: unset; }
.navbar ul { margin: 0; padding: 0; display: flex; list-style: none; align-items: center; }
.navbar li { position: relative; }
.navbar a, .navbar a:focus { display: flex; align-items: center; justify-content: space-between; padding: 5px 22px 0; font-size: 15px; font-weight: 600; color: #5db4f2; white-space: nowrap; transition: 0.3s; }
.navbar a i, .navbar a:focus i { font-size: 12px; line-height: 0; margin-left: 5px; }
.navbar a:hover, .navbar .active, .navbar .active:focus, .navbar li:hover > a { color: #0070c0; }
.navbar .dropdown ul { display: block; position: absolute; left: 14px; top: calc(100% + 30px); margin: 0; padding: 10px 0; z-index: 99; opacity: 0; visibility: hidden; background: #fff; box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25); transition: 0.3s;width: auto; }
.navbar .dropdown ul li { min-width: 200px; }
.navbar .dropdown ul a { padding: 5px 20px; font-size: 15px; text-transform: none; color: #151515; font-weight: 500; }
.navbar .dropdown ul a i { font-size: 12px; }
.navbar .dropdown ul a:hover, .navbar .dropdown ul .active:hover, .navbar .dropdown ul li:hover > a { background-color: #40acf9;; color:#eee }
.navbar .dropdown:hover > ul { opacity: 1; top: 100%; visibility: visible; }
.navbar .dropdown .dropdown ul { top: 0; left: calc(100% - 30px); visibility: hidden; }
.navbar .dropdown .dropdown:hover > ul { opacity: 1; top: 0; left: 100%; visibility: visible; }
@media (max-width: 1366px) {
.navbar .dropdown .dropdown ul { left: -90%; }
.navbar .dropdown .dropdown:hover > ul { left: -100%; }
}
@media (max-width: 600px) {
#header {padding: 0; }
#nav_menuDiv { border-radius: unset; padding:14px 6px }
}

/**
* Mobile Navigation 
*/
.mobile-nav-toggle { background: #fff; color: #333; font-size: 28px; cursor: pointer; display: none; line-height: 0; transition: 0.5s; border:1px solid #666 }
 @media (max-width: 991px) {
.mobile-nav-toggle { display:inline-block; margin: 10px 0 0 0; }
.navbar ul { display: none; }
}
.navbar-mobile { position: fixed; overflow: hidden; top: 0; right: 0; left: 0; bottom: 0; transition: 0.3s; z-index: 999;background: rgba(0,0,0,.5); }
.navbar-mobile .mobile-nav-toggle { position: absolute; top: 15px; right: 15px; }
.navbar-mobile ul { display: block; position: absolute; top: 55px; right: 15px; bottom: 15px; left: 15px; padding: 10px 0; background-color: #fff; overflow-y: auto; transition: 0.3s; }
.navbar-mobile a, .navbar-mobile a:focus { padding: 10px 20px; font-size: 15px; color: #151515; }
.navbar-mobile a:hover, .navbar-mobile .active, .navbar-mobile li:hover > a { color: #151515; background-color: #ffc451; }
.navbar-mobile .getstarted, .navbar-mobile .getstarted:focus { margin: 15px; }
.navbar-mobile .dropdown ul { position: static; display: none; margin: 10px 20px; padding: 10px 0; z-index: 99; opacity: 1; visibility: visible; background: #fff; box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25); }
.navbar-mobile .dropdown ul li { min-width: 200px; }
.navbar-mobile .dropdown ul a { padding: 10px 20px; color: #151515; }
.navbar-mobile .dropdown ul a i { font-size: 12px; }
.navbar-mobile .dropdown ul a:hover, .navbar-mobile .dropdown ul .active:hover, .navbar-mobile .dropdown ul li:hover > a { background-color: #ffc451; }
.navbar-mobile .dropdown > .dropdown-active { display: block; }
/*--------------------------------------------------------------
# home Section
--------------------------------------------------------------*/
#home { width: 100%; height: auto; min-height:300px; position: relative;  padding-top:160px;}
#home .container { position: relative; padding-top:0; text-align: center; }
#home h1 { margin: 0; font-size: 46px; font-weight: 700; line-height: 64px; color: #0070c0; font-family: "Poppins", sans-serif; }
#home h1 span { color: #ffc451; }
#home h2 { color: #0070c0; margin: 10px 0 0 0; font-size: 24px; }

@media (min-width: 1024px) {
#home { background-attachment: fixed; }
}
@media (max-width: 768px) {
#home { height: auto; }
#home h1 { font-size: 28px; line-height: 36px; }
#home h2 { font-size: 20px; line-height: 24px; }
}
/*--------------------------------------------------------------
# Sections General
--------------------------------------------------------------*/
section { padding: 60px 0; overflow: hidden; }
section.inner-page { padding: 30px 0 60px;  } 
.section-title { padding-bottom: 40px; }
.section-title h2 { font-size: 14px; font-weight: 500; padding: 0; line-height: 1px; margin: 0 0 5px 0; letter-spacing: 2px; text-transform: uppercase; color: #777777; font-family: "Poppins", sans-serif; }
.section-title h2::after { content: ""; width: 120px; height: 1px; display: inline-block; background: #f0c26b; margin: 4px 10px; }
.section-title p { margin: 0; margin: 0; font-size: 30px; font-weight: 700; text-transform: uppercase; font-family: "Poppins", sans-serif; color: #151515; }

@media (max-width: 600px) {
section { padding: 90px 0; overflow: hidden; }
}
/*--------------------------------------------------------------
# Breadcrumbs
--------------------------------------------------------------*/
.breadcrumbs h2 {font-size: 28px;padding: 0 10px 5px; }
/*--------------------------------------------------------------
# Home Wall
--------------------------------------------------------------*/
#home-wall { position:relative; width:100%; height:auto; min-height:700px; padding:0;margin: 60px 0; }
#home-wall .top-left { position:absolute; top:0; left:0;display: inline-flex; width: auto;}
#home-wall .btm-left { position:absolute; bottom:80px; left:0; display: inline-flex; width: auto; }
#home-wall .ctr-top { position:absolute; top:0; left: 50%; transform: translateX(-50%); width: auto; }
#home-wall .ctr-btm { position:absolute; bottom:-72px; left: 50%; transform: translateX(-50%);width: auto; }
#home-wall .top-rht { position:absolute; top:20px; right:0; display: inline-flex;width: auto; }
#home-wall .btm-rht { position:absolute; bottom:0; right:0; display: inline-flex;width: auto; }
@media (max-width: 500px) {
#home-wall .ctr-top { top:200px;width: 100%;  }
}
/*--------------------------------------------------------------
# About
--------------------------------------------------------------*/
.about .content h5 { font-weight: 400; font-size: 20px; font-family: "Poppins", sans-serif; color:#0070c0 }
/*--------------------------------------------------------------
# Clients
--------------------------------------------------------------*/
.clients { box-shadow: 1px 1px 3px #ddd; }
.clients .swiper-slide img { opacity: 0.5; transition: 0.3s; filter: grayscale(100); }
.clients .swiper-slide img:hover { filter: none; opacity: 1; }
.clients .swiper-pagination { margin-top: 20px; position: relative; }
.clients .swiper-pagination .swiper-pagination-bullet { width: 12px; height: 12px; background-color: #fff; opacity: 1; background-color: #ddd; }
.clients .swiper-pagination .swiper-pagination-bullet-active { background-color: #ffc451; }
/*--------------------------------------------------------------
# Features
--------------------------------------------------------------*/
.features { padding: 0;  }
#featuresDiv {background:#40acf9; border-top-left-radius: 25px; border-top-right-radius: 25px; min-height:300px; padding: 60px 20px }
.features .icon-box { padding-left: 15px; }
.features .icon-box h4 { font-size: 20px; font-weight: 700; margin: 5px 0 10px 60px; }
.features .icon-box i { font-size: 48px; float: left; color: #ffc451; }
.features .icon-box p { font-size: 15px; color: #848484; margin-left: 60px; }
.features .image { background-position: center center; background-repeat: no-repeat; background-size: cover; min-height: 400px; }
/*--------------------------------------------------------------
# use-cases
--------------------------------------------------------------*/
#services-support { background: #e1e1e1 }
#services-support p {font-size: .95rem; line-height: 1.2;}
#use-caseDiv .tab-content { padding:30px 10px 10px; background:#fff}
#use-caseDiv .nav-item { margin:0 20px }
#use-caseDiv .nav-pills .nav-link.active {border: 2px dotted; border-radius: 20px; background:none; color:#0d6efd }
.grad1 {  background-color: lavender; /* For browsers that do not support gradients */
  background-image: linear-gradient(0deg, lavender, white);}
#use-caseDiv .content { padding:30px 30px 0 }	
/*--------------------------------------------------------------
# Primary Features
--------------------------------------------------------------*/
#prim-featuresDiv { background:#5744ff; min-height:300px; padding:40px 30px; color:#fff; border-bottom-left-radius: 25px; border-bottom-right-radius: 25px;  }
.prim-icon { font-size:1.5rem; margin-bottom:10px}
.prim-title {font-size:1.2rem; margin-bottom:8px }
.prim-content {font-size:1.1rem }
/*--------------------------------------------------------------
# Integrations
--------------------------------------------------------------*/
#integrationsDiv {  min-height:300px; }
#integrationsDiv .title { font-size:2.6rem }
#integrationsDiv .sub-title { font-size:1.4rem; margin:12px 0  }

/*--------------------------------------------------------------
# Mosaic Wall
--------------------------------------------------------------*/
#industry-specific-info { padding:0 }
#moz-wall { position:relative; width:100%; height:auto; min-height:700px; padding:0 }
#moz-wall .top-left { position:absolute; top:10px; left:30px;display: inline-flex; width: auto;}
#moz-wall .btm-left { position:absolute; bottom:120px; left:0; display: inline-flex; width: auto; }
#moz-wall .ctr { position:absolute; top:50px; left: 50%; transform: translateX(-50%); width: auto; }
#moz-wall .top-rht { position:absolute; top:20px; right:0; display: inline-flex;width: auto; }
#moz-wall .btm-rht { position:absolute; bottom:10px; right:40px; display: inline-flex;width: auto; }
@media (max-width: 500px) {
#moz-wall .ctr-top { top:200px;width: 100%;  }
}
#white-board { position:relative;  margin-top:0; padding: 50px 0 0;}
#white-boardDiv { position:relative; width:100%; left:0; top:0; background:#fff; border: 1px solid #eeebeb; padding:3px; border-radius:40px}
#white-boardContent { min-height:200px; background:#eeebeb; border-radius: 40px; padding:50px; text-align:center }
#white-boardImg { position:absolute; right:40px; top:-40px; z-index:1 }
#white-board-footer { position:absolute; z-index:-2; background: #000; width:100%; left:0; padding:30px; margin-top:-50px }
/*--------------------------------------------------------------
# Appointment Page
--------------------------------------------------------------*/
#appointmentDiv img { width:auto; max-width:100% }
#appt-title { background:#222; color:#fff; text-align:center; padding:5px 0 }
#formDiv .form-row {margin: 5px 0 5px; }
#formDiv .form-control { color: #555 }
@media only screen and (min-width: 310px) {
#formDiv  {padding: 10px 5px; box-shadow: 1px 1px 3px #999;}
#formDiv h3 { font-size:20px }
#formDiv #infoForm { padding:0 5px }
.spcr { height: 0px }
}
@media only screen and (min-width: 768px) {
#formDiv  {padding: 10px; box-shadow: 1px 1px 3px #999;}
#loader { display:none }
#formDiv #infoForm { padding:0 20px }
}

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

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
#footer { background: black; padding: 0; color: #fff; font-size: 14px; }
#footer .footer-top { background: border-bottom: 1px solid #222222; padding: 60px 0 30px 0; }
#footer .footer-top .footer-info { margin: 30px 10px; }
#footer .footer-top .footer-info h3 { font-size: 28px; margin: 0 0 20px 0; padding: 2px 0 2px 0; line-height: 1; font-weight: 700; text-transform: uppercase; }
#footer .footer-top .footer-info h3 span { color: #ffc451; }
#footer .footer-top .footer-info p { font-size: 14px; line-height: 24px; margin-bottom: 0; font-family: "Raleway", sans-serif; color: #fff; }
#footer .footer-top .footer-info a, #footer .credits a { color:#0d6efd }
#footer .footer-top .social-links a { font-size: 18px; display: inline-block; background: #292929; color: #fff; line-height: 1; padding: 8px 0; margin-right: 4px; border-radius: 4px; text-align: center; width: 36px; height: 36px; transition: 0.3s; }
#footer .footer-top .social-links a:hover { background: #ffc451; color: #151515; text-decoration: none; }
#footer .footer-top h4 { font-size: 16px; font-weight: 600; color: #fff; position: relative; padding-bottom: 12px; }
#footer .footer-top .footer-links { margin-bottom: 30px; }

#footer .footer-top .footer-links a { color: #fff; transition: 0.3s;display: block;line-height: 1.7; }
#footer .footer-top .footer-links a:hover { color: #ffc451; }


#footer .credits { padding:10px 0 0; text-align: center; font-size: 13px; color: #fff;border-top: 1px solid #222; }
#footer .credits p {font-size: 13px;  }