
*{
  font-family: 'Lato', sans-serif;
}
html {
  height: 100%;
  scroll-behavior: smooth;
}
body::-webkit-scrollbar {
  min-height: 100%;
  width: 12px;
}
body::-webkit-scrollbar-track {
  background: #51504e;        
}
body::-webkit-scrollbar-thumb {
  background-color: #20509d5b;    
  border-radius: 20px;       
  border: 3px solid #51504e;  
}
h1,p{
  color: #f9fbfb;
}
/* Navbar */
.navbar-dark .navbar-nav .nav-link {
  margin-right: 15px !important;
  letter-spacing: 1px;
}
.bg-dark {
  transition: 2s;
  background-color: #1a1919 !important;
  opacity: .87;
  padding: 15px;
}
.navbar-dark .navbar-nav .nav-link {
  color: #f9fbfb;
}
.scroll {
  transition: 2s;
  background-color: #51504e !important;
  opacity: 1 !important;
}
/*navbar end*/

/*jumbotron*/
.jumbotron {
  height: 100vh !important;
  background: url("../../img/_frontend/header-img.jpg") no-repeat center center; 
  -webkit-background-size: 100% 100%;
  -moz-background-size: 100% 100%;
  -o-background-size: 100% 100%;
  background-size: cover;
  border-radius: 0rem !important;
}
.cust-jumbo{
  margin-top: 150px !important;
}
.cust-jumbo h1{
  font-weight: 700;
}
.btn-get {
  margin-right: 20px;
  font-weight: bold;
  background-color: #204f9d !important;
  border-color: #204f9d !important;
  opacity: .8;
  height: 45px !important;
  padding: 10px !important;
}
.btn-get:hover {
  background-color: #df2526 !important;
  border-color: #df2526 !important;
}
.btn-free {
  background-color:transparent !important;
  border-color: #f9fbfb !important;
}
/*end*/

/*content*/
.content-area {
  margin-top: 120px;
}
#content-desc {
  color: #5b5b5b;
  font-weight: 700;
}
.section-title {
  margin-top: 5%;
  margin-left: 3%;
}
.section-title h6 {
  color: #0f74b6;
}
.section-title h3 {
  font-weight:700;
  letter-spacing: 3px;
  color: #5b5b5b;
}
.section-title h6::after {
  content: "";
  width: 80px;
  height: 2px;
  display: inline-block;
  background: #df2526;
  margin: 4px 10px;
}
.services {
  margin-top: 40px;
}
.article-heading {
  margin-top: 50px;
  color: #51504e;
}
.article-heading h3{
  font-weight: 700;
}
.article-content {
  margin-top: 30px;
  margin-right: 3%;
}
.article-content p{
  color:#51504e;
}
.article-content H5{
  font-weight: 700;
}
.team {
  margin-top: 15px;
}
.team img{
  width: 100px;
}
.cust-team{
  margin-top: 10px;
}

/*.card {
  margin: 0 auto;
  width: 18rem;
  margin-bottom: 10px;
  border-color: #0f74b630;
}*/
.card-btn {
  margin-top: 10px;
  background-color: #df2526;
  border-color: #df2526;
  /*width: 120px;*/
}
.mod-btn {
  padding-bottom: 5px !important;
}
.mod-free {
  padding-top: 15px;
}
.mod-free a {
  color: #df2526;
}
.mod-free h6{
  font-weight: bold;
}
.modal-header {
  background-color: #51504e;
  color: #f9fbfb;
}
.modal-body p{
  color: #51504e;
}
.modal-body h5 {
  font-weight: bold;
}
#mod-title {
  text-align: center !important;
}
#plan-free {
  margin-top: 50px;
}
#app-free {
  margin-top: 50px;
}
.row-inner {
  border-radius: 5px;
  border-color: #51504e;
  margin-top: 15px;
  padding: 30px;
}
.row-inner h4{
  font-weight: 700;
  color: #5b5b5b;
  margin-top: 10px;
}
.row-inner h4:hover{
  color: #0f74b6;
}
.row-inner a:hover {
  text-decoration: none;
}
.fa-desktop:before {
  color: #0f74b6; 
  font-size: 1.5em;
}
.fa-bar-chart:before {
  color: #0f74b6; 
  font-size: 1.5em;
}
.fa-user:before {
  color: #0f74b6; 
  font-size: 1.5em;
}
.fa-database:before {
  color: #0f74b6; 
  font-size: 1.5em;
}
.fa-laptop:before {
  color: #e8ebec; 
  font-size: 1.5em;
}
.fa-cube:before {
  color: #e8ebec; 
}
.fa-cubes:before {
  color: #e8ebec; 
}
.fa-code:before {
  color: #e8ebec; 
}
.fa-2x {
  margin-top: 15px;
}
.fa-3x {
  margin-top: 13px;
}
.fa-weixin:before {
  color: #e8ebec; 
  font-size: 1.5em;
}
.footer-ico {
  margin-top: -3px;
}

.fa-chevron-right::before {
  color: #f6f9fa; 
  font-size: .5em;
}
.fa-twitter:before{
  font-size: 1.5rem;
}
.fa-facebook-f:before{
  font-size: 1.5rem;
}
.fa-instagram:before{
  font-size: 1.5rem;
}
.fa-google-plus:before{
  font-size: 1.5rem;
}
.fa-address-card::before {
  color: #0f74b6;
}
.fa-phone::before {
  color: #0f74b6;
}
.fa-envelope::before {
  color: #0f74b6;
}
.fa-check-circle::before {
  color: #0f74b6;
}
.fa-user-plus::before {
  color: #0f74b6;
}
.fa-university::before {
  color: #0f74b6;
}
.fa-sort-numeric-asc::before {
  color: #0f74b6;
}
.fa-user-secret::before {
  color: #0f74b6;
}
.fa-expand::before {
  color: #0f74b6;
}
.fa-edit::before {
  color: #0f74b6;
}
.fa-shield::before {
  color: #f6f9fa;
}

#register {
  padding: 0 10% 0 10%;
}
#contact-form h4{
  color: #0f74b6;
  margin-bottom: 30px;
}
#login-form h4{
  color: #0f74b6;
  margin-bottom: 30px;
}
/*Register page*/
.separator {
  display: flex;
  align-items: center;
  text-align: center;
  font-style: italic;
}
.separator::before,
.separator::after {
  content: '';
  flex: 1;
  border-bottom: 1px solid #5b5b5b;
}
.separator:not(:empty)::before {
  margin-right: .25em;
}
.separator:not(:empty)::after {
  margin-left: .25em;
}
.fb-btn {
}
.g-btn {
  background-color: #df2526;
  border-color: #df2526;
}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
#row-cust {
  margin-top: 10px !important;
}
#footer {
  color: #f6f9fa;
  font-size: 14px;
  background: #5b5b5b;
  margin-top: 5%;
}
#footer h3{
  font-weight: 700  ;
}
#footer-info a {
  color: #f6f9fa;
}

#footer .footer-top {
  padding: 30px 0 15px 0px;
  background: #5b5b5b;
}

#footer .footer-top .footer-contact {
  margin-bottom: 30px;
}

#footer .footer-top .footer-contact h4 {
  font-size: 22px;
  margin: 0 0 30px 0;
  padding: 2px 0 2px 0;
  line-height: 1;
  font-weight: 700;
}

#footer .footer-top .footer-contact p {
  font-size: 14px;
  line-height: 24px;
  margin-bottom: 0;
  font-family: "Raleway", sans-serif;
  color: #f6f9fa;
}

#footer .footer-top h4 {
  font-size: 16px;
  font-weight: bold;
  color: #f6f9fa;
  position: relative;
  padding-bottom: 12px;
}

#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 i {
padding-right: 2px;
color: #f6f9fa;
font-size: 18px;
line-height: 1;
}

#footer .footer-top .footer-links ul li {
  padding: 5px 0;
  display: flex;
  align-items: center;
}

#footer .footer-top .footer-links ul li:first-child {
  padding-top: 0;
}

#footer .footer-top .footer-links ul a {
  color: #f6f9fa;
  transition: 0.3s;
  display: inline-block;
  line-height: 1;
}

#footer .footer-top .footer-links ul a:hover {
  text-decoration: none;
  color: #48539e;
}

#footer .footer-newsletter {
  font-size: 15px;
}

#footer .footer-newsletter h4 {
  font-size: 16px;
  font-weight: bold;
  color: #444444;
  position: relative;
  padding-bottom: 12px;
}

#footer .footer-newsletter form {
  margin-top: 30px;
  background: #fff;
  padding: 6px 10px;
  position: relative;
  border-radius: 50px;
  text-align: left;
  border: 1px solid #e4e3e6;
}

#footer .footer-newsletter form input[type="email"] {
  border: 0;
  padding: 4px 8px;
  width: calc(100% - 100px);
}

#footer .footer-newsletter form input[type="submit"] {
  position: absolute;
  top: 0;
  right: -2px;
  bottom: 0;
  border: 0;
  background: none;
  font-size: 16px;
  padding: 0 20px;
  background: #48539e;
  color: #fff;
  transition: 0.3s;
  border-radius: 50px;
  box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1);
}

#footer .footer-newsletter form input[type="submit"]:hover {
background: #00664b;
}

#footer .credits {
  padding-top: 5px;
  font-size: 13px;
  color: #444444;
}

#footer .social-links a {
  font-size: 18px;
  display: inline-block;
  background: #48539e;
  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 .social-links a:hover {
  background: #5462b8;
  color: #fff;
  text-decoration: none;
}
.footer-rights {
  background-color: #3c3c3c;
  height: 80px;
}
#rights-inner {
  padding-top: 30px !important;
}
.social {
  display: block;
  margin-top: 20px;
  letter-spacing: 2px;
}
#myBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: #df2526;
  color: white;
  cursor: pointer;
  padding:  5px 10px 5px 10px;
  border-radius: 5px;
}
#myBtn:hover {
  background-color: #555;
}

/* contact form*/
#success-message {
  opacity: 0;
}
.col-xs-12.col-sm-12.col-md-12.col-lg-12 {
  padding: 5% 3% 5% 3%;
}
/*#cust-form {
  -webkit-box-shadow: 2px 7px 31px -2px rgba(0,0,0,0.76);
  -moz-box-shadow: 2px 7px 31px -2px rgba(0,0,0,0.76);
  box-shadow: 2px 7px 31px -2px rgba(0,0,0,0.76);
  margin: auto;
  max-width: 400px;
}*/
address {
  padding: 0 3% 0 3%;
}
address a {
  color: #3c3c3c;
}
.margin-top-25 {
  margin-top: 25px;
}
.form-title {
  padding: 25px;
  font-size: 30px;
  font-weight: 300;
  font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
}
/*.form-group .form-control {
  border-bottom: 1px;
  border-style: none none solid none;
  border-radius:0; 
  border-color: #444444;
}
.form-group .form-control:focus {
  box-shadow: none;
  border-width: 0 0 2px 0;
  border-color: #444444;
}*/
textarea {
  resize: none;
}
.btn-mod.btn-large {
  height: auto;
  padding: 13px 52px;
  font-size: 15px;
}
.btn-mod.btn-border {
  color: #444444;
  border: 1px solid #444444;
  background: transparent;
}
.btn-mod, a.btn-mod {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 4px 13px;
  color: #fff;
  background: rgba(34,34,34, .9);
  border: 1px solid transparent;
  font-size: 11px;
  font-weight: 400;
  text-transform: uppercase;
  text-decoration: none;
  letter-spacing: 2px;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  -webkit-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);
  -moz-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);
  -o-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);
  -ms-transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);
  transition: all 0.2s cubic-bezier(0.000, 0.000, 0.580, 1.000);
}
.btn-mod.btn-border:hover, .btn-mod.btn-border:active, .btn-mod.btn-border:focus, .btn-mod.btn-border:active:focus {
  color: #fff;
  border-color: #444444;
  background: #444444;
  outline: none;
}
.about-content {
  padding: 0 5% 0 5%;
}
.misvin {
  margin-top: 50px; 
  padding: 0 2.5% 0 2.5%;
}
.mission p{
  color: #5b5b5b;
  padding: 0 5% 0 5%;
}
.vission p{
  color: #5b5b5b;
  padding: 0 5% 0 5%;
}
.vission ul li{
  list-style-type: none;
}
.nav-cust-btn{
  width: auto;
  top: 22px;
  color: #f9fbfb !important;
  border-color: #df2526 !important;
}
.nav-cust-btn:hover {
  background-color: #df2526;
}
.btn-group-sm>.btn, .btn-sm {
  background-color: #24252717!important;
  border-color: #24262700!important;
}
.trial-upper {
  height: 200px;
  background-color: #646c6f;
  clip-path: polygon(100% 0, 100% 61%, 50% 80%, 0 61%, 0 0);
}
.trial-upper h5 {
  color: white;
  margin-top: 5px;
  font-weight: 700;
}
.trial-desc {
  background-color: #646c6f;
  border-radius: 15px;
  color: white;
  padding: 20px;
  max-width: 700px;
}
.trial-desc-cont p{
  color: white;
}
.card-trial {
  min-height:350px;
  border-radius: 5px;
  margin-top: 0!important;
}
.circle {
  width: 75px;
  height: 75px;
  margin-top: 25px !important;
  shape-outside: circle();
  clip-path: circle();
  background: #3bafda;
}
.card-plan .card-body {
  min-height: 350px;
  max-height: 350px;  
}
.card-app .card-body {
  min-height: 120px;
  max-height: 120px;  
}

@media (min-width: 1440px) {
  .card-trial {
    width: 300px!important;
  }
  .card {
    padding-bottom: 20px;
  }
  #basic-plan {
    margin-left: 60% !important;
  }
  #advance-plan {
    margin-right: 40% !important;
  }
}

@media (min-width: 1024px) {
  .cust-jumbo h1 {
      font-size: 3rem;
  }
  .trial-desc-cont {
    height: 315px;
  }
  .card-trial {
    width: 240px;
  }
}

@media only screen and (max-width: 768px) {
}

@media only screen and (max-width: 500px) {
  .btn-mod.btn-large {
     padding: 6px 16px;
     font-size: 11px;
  }
  .form-title {
      font-size: 20px;
}
}

@media (min-width: 320px) {
  .cust-jumbo h1 {
      font-size: 2rem;
  }
  .trial-desc {
    width: 285px;
    margin: auto;                 
  }
  .card-trial {
    margin-top: 3%!important;
  }
  #basic-plan {
    margin: auto !important;
  }
  #advance-plan {
    margin-right: auto !important;
  }
}

/* Flash messages */
.message {
    padding: 1rem;

    background: #eff8ff;
    color: #2779bd;

    border-color: #6cb2eb;
    border-width: 1px;
    border-style: solid;
    border-radius: 4px;
    margin-bottom: 2rem;
}
.message.hidden {
    display: none;
}
.message.success {
    background: #e3fcec;
    color: #1f9d55;
    border-color: #51d88a;
}
.message.error {
    background: #fcebea;
    color: #cc1f1a;
    border-color: #ef5753;
}

/* error message */
.is-invalid~.invalid-feedback, .is-invalid~.invalid-tooltip, .was-validated :invalid~.invalid-feedback, .was-validated :invalid~.invalid-tooltip {
    text-align: left;
}

.text-blue {
  color: #0f74b6;  
}

/* timeline */
ul.timeline {
    list-style-type: none;
    position: relative;
}
ul.timeline:before {
    content: ' ';
    background: #0e74b6bf;
    display: inline-block;
    position: absolute;
    left: 29px;
    width: 2px;
    height: 100%;
    z-index: 400;
}
ul.timeline > li {
    margin: 20px 0;
    padding-left: 20px;
}
ul.timeline > li:before {
    content: ' ';
    background: white;
    display: inline-block;
    position: absolute;
    border-radius: 50%;
    border: 3px solid #0e74b6;
    left: 20px;
    width: 20px;
    height: 20px;
    z-index: 400;
}

.changelog-title {
    font-weight: bold;
    font-size: 1.35em;
    color: #0e74b6;
}

.changelog-content {
    font-size: 1.1em;
} 