body,
html {
  width: 100%;
  height: 100%;
  
}

body {
  font-family: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;

}



hr {
  max-width: 50px;
  border-width: 3px;
  border-color: #037bae;
}

hr.light {
  border-color: #fff;
}

a {
  color: #037bae;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  transition: all 0.2s;
}

a:hover {
  color: #037bae;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;
}

.bg-primary {
  background-color: #ffffff !important;
  margin-top: -2px;
}

.bg-dark {
  background-color: #212529 !important;
}

.text-faded {
  color: rgba(255, 255, 255, 0.7);
}

section {
  padding: 8rem 0;
}

.section-heading {
  margin-top: 0;
  font-weight: 500;
  text-transform: uppercase;
  margin-bottom: 20px;
  font-size: 2rem
}

/* BEGIN Main Header Styling*/
#heading-paragraph-bellow {
    text-align: center;
    color: #037bae;
    padding-top: 70px;

}

#main-header{
  margin-bottom: 80px;
}

#main-header-title{
    padding-top: 150px;
}

/* END Main Header Styling*/


.fixed-height-custom{
  min-height: 900px !important;
}


@media (max-width: 992px) {
              .section-heading {margin-top: 20px;}
}


::-moz-selection {
  color: #fff;
  background: #212529;
  text-shadow: none;
}

::selection {
  color: #fff;
  background: #212529;
  text-shadow: none;
}

img::selection {
  color: #fff;
  background: transparent;
}

img::-moz-selection {
  color: #fff;
  background: transparent;
}

#mainNav {
  border-bottom: 1px solid rgba(33, 37, 41, 0.1);
  background-color: #fff;
  font-family: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  transition: all 0.2s;

}


.navbar-brand {
    display: inline-block;
    padding-top: 0.3125rem;
    padding-bottom: 0.3125rem;
    margin-right: 1rem;
    font-size: 3.25rem;
    line-height: inherit;
    white-space: nowrap;

    height: 56px;
    width: 160px;
    background-image: url("../img/iClarity-white.png");
    background-size: cover;
  }

#mainNav .navbar-brand {
  font-weight: 800;
  color: #037bae;
  font-family: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;
}


#mainNav .navbar-brand:focus, #mainNav .navbar-brand:hover {
  color: #037bae;
}

#mainNav .navbar-nav > li.nav-item > a.nav-link,
#mainNav .navbar-nav > li.nav-item > a.nav-link:focus {
  font-size: 0.9rem;
  font-weight: 500;
  text-transform: capitalize;
  color: #212529;
}

#mainNav .navbar-nav > li.nav-item > a.nav-link:hover,
#mainNav .navbar-nav > li.nav-item > a.nav-link:focus:hover {
  color: #F05F40;
  color: #037bae;
}

#mainNav .navbar-nav > li.nav-item > a.nav-link.active,
#mainNav .navbar-nav > li.nav-item > a.nav-link:focus.active {
  color: #037bae !important;
  background-color: transparent;
}

#mainNav .navbar-nav > li.nav-item > a.nav-link.active:hover,
#mainNav .navbar-nav > li.nav-item > a.nav-link:focus.active:hover {
  background-color: transparent;
}

.menu-arrow {font-size: 10px;}


.header-h2 {padding-right: 140px !important; text-align: left; font-size: 42px; }
@media (max-width: 992px) {
  .header-h2 {font-size: 22px !important; text-align: left; padding: 0px !important; margin-left: 10px; }
  .masthead .container-fluid .row {margin-top: 0px !important;}

 }


.app-builder {border: 1px solid #ffffff; border-radius: 10px; font-weight: 800;}

.iclarity-head {font-size: 20px !important; font-weight: 400; line-height: 30px; text-align: left; }

@media (max-width: 992px) {
                .iclarity-head {font-size: 14px !important; font-weight: 200; line-height: 30px; padding: 10px; text-align: justify;}
}

.header-info {text-align: left; margin-top: 10em;}
@media (max-width: 992px) {
            .header-info {text-align: left; margin: 0px;}
          }

#services {padding-top: 0px !important; background-color: transparent !important; margin-top: 2px; }
@media (max-width: 992px) {
          #services {padding-bottom: 10px !important;}
}


h1.grow-head {font-size: 40px; text-transform: uppercase; font-weight: 400; text-align: center !important;}

h1.eng {font-size: 30px; text-align: center; text-transform: uppercase; padding-bottom: 30px;}
@media (max-width: 992px) {
        h1.grow-head {font-size: 45px; text-transform: uppercase; text-align: center !important;}

h1.eng {font-size: 28px; text-align: center; text-transform: uppercase; font-weight: 300; padding-bottom: 0px;}


}


#services .container { background-color: transparent;}

.statistics-container {background-color: #f8f8f8; padding: 40px 0px;}

.statistics {margin-top: 50px; margin-bottom: 50px;}

h1.statistic {color: #037bae !important; font-weight: 800 !important; margin-bottom: 20px;}

.statistics p { color: #037bae; font-weight: 400; font-size: 20px; padding: 0px 40px;}

.platforms {margin-top: 60px; margin-bottom: 100px;}

.platforms .col-lg-10 {border-top: 2px solid #cccccc; border-bottom: 2px solid #cccccc;}

.platforms .img-fluid {margin: 20px; height: 35px; opacity: 0.7; filter: alpha(opacity=70);}

@media (max-width: 992px) { .platforms {margin-top: 20px; margin-bottom: 20px;}

}


.partners {margin-top: 100px; margin-bottom: 100px;}

.partners .img-fluid {margin: 20px; height: 35px;}

.partners .col-lg-10 {border-top: 2px solid #cccccc; border-bottom: 2px solid #cccccc;}


@media (max-width: 992px) { .partners {margin-top: 20px; margin-bottom: 20px;}

}

@media (min-width: 992px) {
  #mainNav {
    border-color: transparent;
    background-color: transparent;
  }
  #mainNav .navbar-brand {
    color: #ffffff;
  }
  #mainNav .navbar-brand:focus, #mainNav .navbar-brand:hover {
    color: #fff;
  }
  .dropdown-content a {text-transform: capitalize;}
  #mainNav .navbar-nav > li.nav-item > a.nav-link {
    padding: 10px 30px;
  }
  #mainNav .navbar-nav > li.nav-item > a.nav-link,
  #mainNav .navbar-nav > li.nav-item > a.nav-link:focus {
    color: #ffffff;
  }
  #mainNav .navbar-nav > li.nav-item > a.nav-link:hover,
  #mainNav .navbar-nav > li.nav-item > a.nav-link:focus:hover {
    color: #cccccc;
  }
  #mainNav.navbar-shrink {
    border-bottom: 1px solid rgba(33, 37, 41, 0.1);
    background-color: #fff;
  }
  #mainNav.navbar-shrink .navbar-brand {
    color: #037bae;
    margin-left: 0px; float: left;
    background-image: url("../img/iClarity-blue.png");
  }
  #mainNav.navbar-shrink .navbar-brand:focus, #mainNav.navbar-shrink .navbar-brand:hover {
    color: #037bae;
  }
  #mainNav.navbar-shrink .navbar-nav > li.nav-item > a.nav-link,
  #mainNav.navbar-shrink .navbar-nav > li.nav-item > a.nav-link:focus {
    color: #212529;
  }
  #mainNav.navbar-shrink .navbar-nav > li.nav-item > a.nav-link:hover,
  #mainNav.navbar-shrink .navbar-nav > li.nav-item > a.nav-link:focus:hover {
    color: #037bae;
  }
}

.lang-bar-scroll {color: #212529 !important;}



header.masthead {
  padding-top: 10rem;
  padding-bottom: 0px;
  background-image: url("../img/Home-Page-no-phone.jpg");
  background-position: bottom center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-repeat: no-repeat;

}

header.masthead .col-lg-7 {margin-top: 220px; }

header.masthead .div-overlay { width: 90%; background-color: black; padding: 20px; border-radius: 10px; background-color: rgba(0, 0, 0, 0.3);
background: rgba(0, 0, 0, 0.3);}


header.masthead hr {
  margin-top: 30px;
  margin-bottom: 30px;
}


@media (max-width: 768px) {

}

@media (min-width: 768px) {
  header.masthead p {
    font-size: 1.45rem;
  }


}

@media (min-width: 992px) {
  header.masthead {
    height: 100vh;
    min-height: 650px;
    padding-top: 0;
    padding-bottom: 0;
  }
  
}




@media (max-width: 992px) {
  .navbar-brand {
    background-image: url("../img/iClarity-blue.png");
  }

  header.masthead {
  padding-top: 10rem;
  padding-bottom: 0px;
  background-image: url("../img/header-small.jpg");
  background-position: bottom center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;

}

header.masthead .col-lg-7 {
  margin-top: 0px;
}

#heading-paragraph-bellow {
  color: #ffffff;
  padding-top: 10px;

}

#main-header {
  margin-bottom: 0px;
}

#main-header-title {
  padding-top: 0px;
}

}

.service-box {
  max-width: 400px;
}



#portfolio {background: url('../img/industry-background.jpg') no-repeat; padding: 0px; height: 1000px; background-size: 1920px 1000px; }

#portfolio p  {text-align: center; color: #ffffff; font-size: 20px; font-weight: 200; }

@media (max-width: 992px) {

#portfolio {background: url('../img/industry-background-small.jpg') repeat-y; padding-top: 20px; height: auto; }
#portfolio p {font-size: 14px !important;}
#portfolio .col-lg-12 {padding-bottom: 40px;}
}


#portfolio img { border-radius: 15px; /*margin-bottom: 16px; width: 365px;*/}

.industry { float: center; margin: 8px;  }
.industry-1  .img-fluid {margin: 10px; box-shadow: 3px 5px 10px 3px rgba(7, 7, 7, 0.35);
-moz-box-shadow: 3px 5px 10px 3px rgba(7, 7, 7, 0.35);
-webkit-box-shadow: 3px 5px 10px 3px rgba(7, 7, 7, 0.35);}

.industry-1 .col {text-align: center;}

header.about {
  padding-top: 10rem;
  padding-bottom: 0px;
  background-image: url("../img/about-us.jpg");
  background-position: bottom center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-repeat: no-repeat;
  min-height: 650px;
}

#thank-you {background-image: url("../img/thank-you-background.jpg");}

#privacy-policy {background-image: url("../img/privacy-policy-background.jpg");}

@media (max-width: 768px)  { 
header .col-lg-5 {padding-top: 50px; }

}

header.partner {
  padding-top: 10rem;
  padding-bottom: 0px;
  background-image: url("../img/become-a-partner-background.jpg");
  background-position: bottom center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-repeat: no-repeat;
  min-height: 650px;
}

@media (max-width: 768px) {
header.partner {padding-top: 0px; min-height: 400px; background-image: url("../img/become-a-partner-background-small.jpg");}



}

header.partner .container-fluid {padding-top: 100px;}
header.about .container-fluid {padding-top: 100px;}

#benefits {padding-top: 20px; padding-bottom: 60px;}
#benefits .col-md-4 {text-align: center; padding: 30px;} 
#benefits img {margin-bottom: 20px;}
#benefits p {color: #888888; }
#benefits h5 {font-weight: 700;}

#case-studies {background-image: url("../img/case-studies-background.jpg"); }

h2.testimonials-h2 {text-transform: uppercase; font-weight: 500; font-size: 2rem; margin-bottom: 40px;}

@media (max-width: 992px) {
header.about .container-fluid { padding-top: 0px !important; }
  }


.about-h1 {font-weight: 600; font-size: 2.5rem; text-transform: uppercase; text-align: left;}
@media (max-width: 992px) {
      .about-h1 {text-align: center;}
}

.industry-head-img {margin-left: 0px; margin-right: 100px; }
.industry-h1 {margin-top: 100px; text-transform: uppercase !important; text-align: left !important; font-weight: 600; font-size: 2.5rem}

header.industry-header {
  padding-top: 10rem;
  padding-bottom: 0px;
  background-position: bottom center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-repeat: no-repeat;
  min-height: 750px;
}

#tourist-boards {background-image: url("../img/tourist-boards-background.jpg");}
#retail {background-image: url("../img/retail-supermarket-background.jpg");}
#horeca {background-image: url("../img/horeca-background.jpg");}
#media {background-image: url("../img/media-background.jpg");}
#hr-training {background-image: url("../img/hr-training-background.jpg");}
#banks-and-telcos {background-image: url("../img/banks-and-telcos-background.jpg");}

@media (max-width: 768px) {
#tourist-boards {min-height: 450px;}
#retail {min-height: 370px;}
#horeca {min-height: 440px;}
#media {min-height: 460px;}
#hr-training {min-height: 560px;}
#banks-and-telcos {min-height: 550px;}
}


header.industry-header .col-lg-10 p  { text-align: left; padding-right: 50px; font-size: 20px; font-weight: 400;}
header.industry-header .btn-light {text-align: left; font-weight: bolder; -webkit-box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.66);
    -moz-box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.66);
    box-shadow: 1px 3px 8px 0px rgba(0,0,0.0.66);}}
@media (min-width: 741px) and (max-width: 1092px)  {
header.industry-header .col-lg-10 img {width: 200px;}
header.industry-header .col-lg-10 p {font-size: 14px;}
header.industry-header {min-height: 500px;}
.industry-h1 {margin-top: 20px;font-size: 28px; }
}



#press {padding-top: 0px; padding-bottom: 100px;}
#press h3 {text-transform: uppercase !important; font-weight: 500 !important; font-size: 2rem; margin-bottom: 60px;}
@media (max-width: 992px) {
#press h3 {margin-top: 20px; margin-bottom: 20px;}
}

#press img { border-radius: 15px; box-shadow: 3px 5px 10px 3px rgba(7, 7, 7, 0.35);
-moz-box-shadow: 3px 5px 10px 3px rgba(7, 7, 7, 0.35);
-webkit-box-shadow: 3px 5px 10px 3px rgba(7, 7, 7, 0.35);}

.press-1  .img-fluid {margin: 10px;}
.press-1 .col {text-align: center;}

#industry-build {padding: 50px 0px 20px 0px; background-color: #f5f6f8; margin-top: 70px;}
#industry-build h3 {text-transform: uppercase !important; font-weight: 500 !important; font-size: 2rem; margin-bottom: 0px; padding-top: 10px; text-align: left; }
#industry-build hr {border-width: 4px; border-color: #1a99f6; margin-left: 0px; width: 30px; }
#industry-build p {text-align: left; color: #888888; margin-top: 40px; font-size: 18px;  }
#industry-build img {margin-left: 60px; margin-right: 100px;}

#industry-second {padding: 50px 0px 20px 0px; background-color: #ffffff; margin-top: 70px;}
#industry-second h3 {text-transform: uppercase !important; font-weight: 500 !important; font-size: 2rem; margin-bottom: 0px; padding-top: 10px; text-align: left; }
#industry-second hr {border-width: 4px; border-color: #1a99f6; width: 30px; }
#industry-second p {text-align: left; color: #888888; font-size: 18px; margin-top: 40px; }
#industry-second img {margin-left: 40px; margin-right: 50px; margin-bottom: 180px; margin-top: 80px;}
#choose-us {padding-top: 20px; padding-bottom: 60px;}
#pricing-tables {background-color: #f5f6f8; padding-top: 40px;}
#pricing-tables h3 {text-transform: uppercase !important; font-weight: 500 !important; font-size: 2rem; margin-bottom: 40px; padding-top: 10px;}

.fa-check {color: #72C7EB; font-size: 20px; text-align: left; margin-left: 10px; }
.fa-times {color: #9FA7AF; font-size: 20px; text-align: left; margin-left: 10px;}
.blue-price {color: #1a99f6; font-size: 14px; text-align: left; margin-left: 10px;}
.gray-price {color: #9FA7AF; font-size: 14px; text-align: left; margin-left: 10px;}
.plan-description {background-color: #ffffff; border-top: 4px solid #1a99f6; padding-top: 10px; text-align: center; margin-bottom: 20px;
-webkit-box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.23);
-moz-box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.23);
box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.23);}
.plan-description h2 { text-transform: uppercase; text-align: center; font-weight: 600; margin-top: 20px; margin-bottom: 0px; font-size: 40px; } 
.plan-description h4 {text-align: center; text-transform: uppercase; font-weight: 600;}
.plan-description h5 {color:  #9FA7AF; font-size: 22px; } 
h2.contact-head {color: #199af6; font-weight: 600; font-size: 29px; text-transform: lowercase; margin-bottom: 56px;}
.blue-icon {color: #199af6;}
.price-head {height: 100px; background-color: #ffffff;}
#pricing-tables .btn-primary {background-color: #1a99f6; color: #ffffff; margin-bottom: 20px; margin-top: 30px; padding: 7px 8px; text-align: center; }
#projects {padding-top: 80px;} 
#projects .img-fluid {border-radius: 10px; margin-bottom: 14px;
  -webkit-box-shadow: 1px 3px 14px 0px rgba(0,0,0,0.46);
-moz-box-shadow: 1px 3px 14px 0px rgba(0,0,0,0.46);
box-shadow: 1px 3px 14px 0px rgba(0,0,0,0.46); }
#projects h4 {text-transform: uppercase; font-weight: 500;} 
#projects p {color: #1a99f6; font-weight: 500;}
#projects .btn-primary {background-color: #1a99f6; color: #ffffff; margin-bottom: 60px; margin-top: 0px; padding: 10px 20px; text-align: center;
-webkit-box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.66);
-moz-box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.66);
box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.66); }
@media (min-width: 768px) and (max-width: 1200px)  {
#projects .btn-primary {margin-top: 70px;}
}

.customers {text-transform: uppercase; font-weight: 600; text-align: center; margin-bottom: 20px;}
#testimonials {background-color: #f5f6f8; padding-top: 40px; padding-bottom: 40px; margin-bottom: 60px;}




@media (max-width: 741px) {


.industry-head-img {width: 0px;}
.industry-h1 {margin-top: 0px; font-size: 22px; text-align: center !important;} 
#industry-build img {margin: 20px;}
.industry-p-img {width: 330px;}
#industry-second {margin-top: 0px;}
#industry-second img {margin: 0px !important;}
#choose-us {padding-top: 0px; padding-bottom: 0px;}
#pricing-tables {padding-bottom: 0px;}
header.industry-header {
  padding-top: 8rem;
  padding-bottom: 0px;
  background-position: bottom center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-repeat: no-repeat;
 
}
#retail {background-image: url("../img/retail-supermarket-background-small.jpg");}

#industry-build {margin-top: 0px;}
header.industry-header .col-lg-10 p {text-align: justify; padding: 10px !important; font-size: 14px; font-weight: 500;}
#projects {padding-top: 40px; padding-bottom: 0px;}
#case-studies {background-image: url("../img/case-studies-background-small.jpg"); min-height: 350px; padding-top: 7rem;}
#projects .btn-primary { margin-bottom: 20px;} 
#testimonials {padding-top: 0px;}
}



#company {padding-top: 0px; padding-bottom: 40px;}
#company h3 {text-transform: uppercase !important; font-weight: 500 !important; font-size: 2rem; margin-top: 30px;}
@media (max-width: 768px) { 
#company {padding-bottom: 10px;  }

}


#company p {text-align: justify; color: #888888; font-size: 20px; line-height: 1.5;}
#what-we-do {background-color: #f5f6f8; padding-top: 0px; padding-bottom: 0px;}
#what-we-do h3 {text-transform: uppercase !important; font-weight: 500 !important; font-size: 2rem; padding-top: 200px;}
#what-we-do p {text-align: left; color: #888888; font-size: 20px; line-height: 1.5; text-align: justify;}
#what-we-do img {margin: 0px 20px 20px 0px;}


#choose-us h3 {text-transform: uppercase !important; font-weight: 500 !important; font-size: 2rem; margin-bottom: 50px; padding-top: 10px; text-align: center; }
#choose-us h5 {font-weight: 800; text-align: center;}
#choose-us .col p {font-size: 14px; color: #888888;}
#choose-us img {margin-right: 20px;}

@media (min-width: 741px) and (max-width: 1092px)  { .press-1 .img-fluid {margin: 10px; width: 200px;}
#press .col-lg-12 {padding-bottom: 40px;}
#press .container-fluid {padding-top: 20px;}
.industry-p-img {width: 260px;}
}

.industry-info {margin: 0 auto; width: 50%}
@media (min-width: 741px) and (max-width: 1092px)  { .industry-1 .img-fluid {margin: 10px; width: 200px; }
#portfolio {background: url('../img/industry-background-small.jpg') repeat-y; height: auto; }
#portfolio .col-lg-12 {padding-bottom: 40px;}
#portfolio .container-fluid {padding-top: 20px;}
}

.industry-info {margin: 0 auto; width: 50%}



.text-block {  background-color: black;
    color: white;
    padding-left: 20px;
    padding-right: 20px; }

@media (max-width: 992px) {

      .industry-info {margin: 0 auto; width: 80%}

}

#portfolio .container-fluid {padding-top: 150px; height: auto;}


@media (max-width: 992px) {
              #portfolio p  {text-align: justify; color: #ffffff; font-size: 20px; }
              #portfolio .container-fluid {margin-top: 0px; padding-top: 140px; height: auto;}
              #portfolio {height: auto;}
            }


#portfolio h2 {color: #ffffff; font-weight: 500; font-size: 2rem }

.portfolio-box {
  position: relative;
  display: block;
  max-width: 650px;
  margin: 0 auto;
}

.portfolio-box .portfolio-box-caption {
  position: absolute;
  bottom: 0;
  display: block;
  width: 100%;
  height: 100%;
  text-align: center;
  opacity: 0;
  color: #fff;
  background: rgba(240, 95, 64, 0.9);
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  transition: all 0.2s;

}

.portfolio-box .portfolio-box-caption .portfolio-box-caption-content {
  position: absolute;
  top: 50%;
  width: 100%;
  transform: translateY(-50%);
  text-align: center;
}

.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-category,
.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-name {
  padding: 0 15px;
  font-family: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;
}

.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-category {
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
}

.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-name {
  font-size: 18px;
}

.portfolio-box:hover .portfolio-box-caption {
  opacity: 1;
}

.portfolio-box:focus {
  outline: none;
}

#contact { background: url('../img/Footer.jpg') no-repeat; background-position: center center; padding-top: 70px; padding-bottom: 30px;}
#contact p {color: #ffffff; font-size: 18px; font-weight: 700; }
#contact h2 {color: #ffffff;}
#contact img {margin: 0px 10px;}
.copyright {font-size: 12px !important;}
#contact .email {font-size: 18px !important; font-weight: 400 !important;}

#contact-us {padding: 0px !important;}

#contact-us .container-fluid {background-color: #f5f6f8; padding: 50px;}

#contact-us .col-lg-8 {margin-top: 20px;}

#contact-us h3 {text-transform: uppercase; font-weight: 600; margin-bottom: 40px; margin-top: 10px;}

@media (min-width: 768px) {
  .portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-category {
    font-size: 16px;
  }
  .portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-name {
    font-size: 22px;
  }
}

.text-primary {
  color: #037bae !important;
}

.btn {
  font-weight: bolder;
  text-transform: uppercase;
  border: none;
  border-radius: 10px;
  font-family: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;
  color: #037bae;
  padding: 10px 30px;
}

.btn-xl {
  padding: 0.8rem 2rem;
}

.btn-primary {
  background-color: #ffffff;
  border-color: #037bae;
  -webkit-box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.66);
    -moz-box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.66);
    box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.66);
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
  color: #fff;
  background-color: #4b4441 !important;
}

.btn-primary:active, .btn-primary:focus {
  box-shadow: 0 0 0 0.2rem rgba(240, 95, 64, 0.5) !important;
}

.button-home-left {background: url('../img/coalition-loyalty-button.png') no-repeat; width: 200px; height: 200px; border: 0px; text-transform: uppercase; outline: none !important;
  box-shadow: none; width: 200px; }

#services p {padding: 10px; color: #037bae; font-weight: 400; font-size: 20px;}

.float-center {margin: 10px; float: center; margin: 20px; height: 35px;}



.menu-arrow {font-size: 12px;}


/*navivagation css*/

li a, .dropbtn {
    display: inline-block;
    color: white;
    text-align: center;
    padding: 0.5rem 1.5rem;
    text-decoration: none;
    text-transform: capitalize;
}

li a:hover {
  text-decoration: none; color: #1c99f5;}

li .dropdown:hover .dropbtn {color: red;}

li.dropdown {
    display: inline-block;
    font-size: .8rem;
    font-weight: 500;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #ffffff;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    border-radius: 4px;
}

.dropdown-content a {
    color: #037bae;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
}

.dropdown-content a:hover {background-color: #e8e8e8;}

.dropdown:hover .dropdown-content {
    display: block;
}


/*contact form css*/

.contact-form-box {background-color: #ffffff; padding: 20px 70px 30px 70px; border-top: 4px solid #1a99f6; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px;
-webkit-box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.23);
-moz-box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.23);
box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.23);}

input[type=text], select, textarea {
    width: 100%;
    padding: 12px;
    border: 2px solid #e0e0e0;
    border-radius: 10px;
    box-sizing: border-box;
    margin-top: 6px;
    margin-bottom: 16px;
    resize: vertical;
    font-size: 17px;
}

input[type=submit] {
    background-color: #1a99f6;
    color: white;
    padding: 12px 28px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    text-transform: uppercase;
    font-weight: bold;
    -webkit-box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.66);
    -moz-box-shadow: 1px 3px 8px 0px rgba(0,0,0,0.66);
    box-shadow: 1px 3px 8px 0px rgba(0,0,0.0.66);}
}

input[type=submit]:hover {
    background-color: black;
}

.container change the class name !!! {
    border-radius: 10px;
    background-color: #f2f2f2;
    padding: 20px;
}

label {font-size: 24px;}

.contact-form {font-size: 20px; font-weight: 200;}

#inline {width: 100%; height: auto; display: flex;}

@media (max-width: 992px)  {

        input[type=text], select, textarea { padding: 10px;  font-size: 14px;}
        .contact-form-box  {padding: 0px; }
        #contact-us .container-fluid {background-color: #ffffff; padding-top: 0px;} 
        .contact-form-box { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;}
        #press {padding-bottom: 20px;}
        label {font-size: 14px;}


}



.gradient-top { height: 300px;
    background-color: #fafbfc;
    /* IE9, iOS 3.2+ */
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0idnNnZyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSI0MS41JSIgeTE9IjEwMy41JSIgeDI9IjU4LjUlIiB5Mj0iLTMuNSUiPjxzdG9wIHN0b3AtY29sb3I9IiNmNWY2ZjgiIHN0b3Atb3BhY2l0eT0iMSIgb2Zmc2V0PSIwLjUiLz48c3RvcCBzdG9wLWNvbG9yPSIjZmZmZmZmIiBzdG9wLW9wYWNpdHk9IjEiIG9mZnNldD0iMC41Ii8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI3ZzZ2cpIiAvPjwvc3ZnPg==);
    background-image: -webkit-gradient(linear, 41.5% 103.5%, 58.5% -3.5%,color-stop(0.5, rgb(245, 246, 248)),color-stop(0.5, rgb(255, 255, 255)));
    /* Android 2.3 */
    background-image: -webkit-linear-gradient(84deg,rgb(245, 246, 248) 50%,rgb(255, 255, 255) 50%);
    /* IE10+ */
    background-image: linear-gradient(6deg,rgb(245, 246, 248) 50%,rgb(255, 255, 255) 50%);
    background-image: -ms-linear-gradient(84deg,rgb(245, 246, 248) 50%,rgb(255, 255, 255) 50%);
}
 
/* IE8- CSS hack */
@media \0screen\,screen\9 {
    .gradient {
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffffff",endColorstr="#fff5f6f8",GradientType=0);
    }
}


@media (max-width: 992px) {

  .gradient-top {visibility: hidden; height: 0px;}

}






.gradient-bottom { height: 270px;
    background-color: #fafbfc;
    /* IE9, iOS 3.2+ */
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0idnNnZyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSI0My4xJSIgeTE9IjEwMi45JSIgeDI9IjU2LjklIiB5Mj0iLTIuOSUiPjxzdG9wIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIgb2Zmc2V0PSIwLjUiLz48c3RvcCBzdG9wLWNvbG9yPSIjZjVmNmY4IiBzdG9wLW9wYWNpdHk9IjEiIG9mZnNldD0iMC41Ii8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI3ZzZ2cpIiAvPjwvc3ZnPg==);
    background-image: -webkit-gradient(linear, 43.1% 102.9%, 56.9% -2.9%,color-stop(0.5, rgb(255, 255, 255)),color-stop(0.5, rgb(245, 246, 248)));
    /* Android 2.3 */
    background-image: -webkit-linear-gradient(85deg,rgb(255, 255, 255) 50%,rgb(245, 246, 248) 50%);
    /* IE10+ */
    background-image: linear-gradient(5deg,rgb(255, 255, 255) 50%,rgb(245, 246, 248) 50%);
    background-image: -ms-linear-gradient(85deg,rgb(255, 255, 255) 50%,rgb(245, 246, 248) 50%);
}
 
/* IE8- CSS hack */
@media \0screen\,screen\9 {
    .gradient {
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#fff5f6f8",endColorstr="#ffffffff",GradientType=0);
    }
}


@media (max-width: 992px) {

  .gradient-bottom {visibility: hidden; height: 0px;}

}

.pricing {
    text-align: center;
}


.pricing-plan {background-color: #ffffff; border-top: 4px solid #1a99f6;}





.testimonial-face {width: 100px; margin: 40px; /*border-radius: 100px; border: 2px solid #1a99f6;*/}

.col-center {
  margin: 0 auto;
  float: none !important;
}
.carousel {
  margin: 50px auto;
  padding: 0 70px;
}

.carousel-inner {-webkit-box-shadow: 9px 10px 21px -6px rgba(74,74,74,0.7);
-moz-box-shadow: 9px 10px 21px -6px rgba(74,74,74,0.7);
box-shadow: 9px 10px 21px -6px rgba(74,74,74,0.7); border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px; padding-bottom: }

.carousel .item {
  background-color: #ffffff;
  color: #999;
  font-size: 14px;
    text-align: center;
  overflow: hidden;
    min-height: 200px;
    
    border-top: 4px solid #1a99f6; }
.carousel .item .img-box {
  width: 135px;
  height: 135px;
  margin: 0 auto;
  padding: 5px;
  border: 1px solid #ddd;
  border-radius: 50%;
}
.carousel .img-box img {
  width: 100%;
  height: 100%;
  display: block;
  border-radius: 50%;
}
.carousel .testimonial {
  padding: 50px 40px 0px 10px; text-align: left;
}
.carousel .overview { 
  font-style: italic;
}
.carousel .overview b {
  text-transform: uppercase;
  color: #7AA641;
}
.carousel .carousel-control {
  width: 40px;
    height: 40px;
    margin-top: -20px;
    top: 50%;
  background: none;
}
.carousel-control i {
    font-size: 68px;
  line-height: 42px;
    position: absolute;
    display: inline-block;
  color: rgba(0, 0, 0, 0.8);
    text-shadow: 0 3px 3px #e6e6e6, 0 0 0 #000;
}
.carousel .carousel-indicators {
  bottom: -40px;
}
.carousel-indicators li, .carousel-indicators li.active {
  width: 10px;
  height: 10px;
  margin: 1px 3px;
  border-radius: 50%;
}
.carousel-indicators li { 
  background: #999;
  border-color: transparent;
  box-shadow: inset 0 2px 1px rgba(0,0,0,0.2);
}
.carousel-indicators li.active {  
  background: #555;   
  box-shadow: inset 0 2px 1px rgba(0,0,0,0.2);
}


.sign-up-button-a {position: fixed; bottom: 20px; right: 20px; height: 100px; width: 100px; display: block; cursor: pointer;}

@media (max-width: 768px) {
.sign-up-button-a {position: fixed; bottom: 30px; right: 10px; height: 50px; width: 50px; display: block; cursor: pointer;}
.sign-up-button-a img {width: 50px;}
}