.wrapper {
  height: 100%; width: 100%;
  position: relative;
}

* {
  font-family: 'Lato', 'Calibri,', sans-serif;
}

*::selection {
  background: #F0F0F0;
  color: #c9000b;
}

a {
  text-decoration: none;
  color: inherit;
}

a:hover {
  text-decoration: none;
  color: inherit;
}


.center {
  text-align: center !important;
}

.menu-items li:last-child {
  margin-right: 100px;
}

.jumbotron {
  margin-top: 45px;
  padding: 0;
  min-width: 100%; min-height: 50vh;
}
.carousel-inner {
  min-height: 50vh;
}
.slides {
  min-height: 50vh;

}
.slide1 {
  background: url("../img/carousel/car-1.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.slide2 {
  background: url("../img/carousel/car-2.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.slide3 {
  background: url("../img/carousel/car-3.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.slide4 {
  background: url("../img/carousel/car-4.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}



.overlay {
  background-color: #FFFFFF;
  text-align: left;
  position: relative;
  bottom: 10vh;
  -webkit-box-shadow: 0px 0px 115px -16px rgba(0,0,0,0.75);
  -moz-box-shadow: 0px 0px 115px -16px rgba(0,0,0,0.75);
  box-shadow: 0px 0px 115px -16px rgba(0,0,0,0.75);
}
.overlay-button {
  margin-top: 50px;
}
.overlay-text {
  padding: 30px;
}
.header {
  font-weight: 300;
  text-align: ;
  font-size: 2.5em;
}


.world-map {
  min-height: 70vh;
}
.header-world-map {
  margin-bottom: 40px;
  text-align: center;
}
.mapTooltip {
  position : fixed;
  background-color : #474c4b;
  moz-opacity:0.70;
  opacity: 0.70;
  filter:alpha(opacity=70);
  border-radius:0px;
  padding : 10px;
  z-index: 1000;
  max-width: 200px;
  display:none;
  color:#fff;
}
.map-text {
  margin-bottom: 50px;
}


.banner {
  width: 100%; height: 35vh;
  background-color: gray;
}
.services-banner {
  background: url("../img/services-banner.jpg");
  background-size: cover;
}
.ci-banner {
  margin-top: 150px;
  background: url("../img/ci-banner.jpg");
  background-position: center;
  background-size: cover;
}
.contactus-banner {
  margin-top: 5%;
  background: url("../img/contactus-banner.jpg");
  background-position: center;
  background-size: cover;
}


.menu-panels{
  text-align: center;
  vertical-align: top;
  margin-bottom: 40px;
}
.menu-panels li {
  list-style: none;
  display: inline-block;
  vertical-align: top;
}
.menu-card {
  max-width: 225px;
  padding: 20px;
  height: 345px;
  text-align: center;
  text-decoration: none;

  -webkit-transition: background-color 0.25s;
  transition: background-color 0.25s;
}
.menu-card:hover {
  background-color: #cccccc;
  text-decoration: none;
}
.active {
  background-color: #cccccc;
  text-decoration: none;
}
.active a {
  text-decoration: none;
  color: inherit;
}
.menu-icon {
  text-align: center;
}
.menu-icon img {
  margin: 0 auto;
  padding: 0;
}
.menu-text h2 {
  font-style: 'Lato', 'Calibri', sans-serif;
  font-weight: 300;
}


.panels-div {
  text-align: center;
}
.panel {
  margin: 0; padding: 0;
  margin: 0 auto;
  background-color: #FFFFFF;
  text-align: left;

  -webkit-box-shadow: 0px 0px 115px -16px rgba(0,0,0,0.75);
  -moz-box-shadow: 0px 0px 115px -16px rgba(0,0,0,0.75);
  box-shadow: 0px 0px 115px -16px rgba(0,0,0,0.75);
}
.panel-header {
  font-weight: 300;
  text-align: ;
  font-size: 2.5em;
}
.main-panel {
  padding-top: 70px;
}
.side-panel {
  text-align: center;
  padding: 5% 0;
}
.side-panel img {
  margin: 0 auto;
  padding: 15% 0;
  margin-left: 0; padding-left: 0;
}
.side-panel1 {
  background-color: #e6e6e6;
}
.side-panel2 {
  background-color: #bfe0ff;
}
.side-panel3 {
  background-color: #f1ffc9;
}
.side-panel4 {
  background-color: #ffd4e9;
}
.side-panel5 {
  background-color: #c9fff4;
}
.side-panel6 {
  background-color: #f4dfff;
}


.ci-nav li {
  margin-top: 2px;
  margin-left: 0;
  margin-right: 0;
  margin-bottom: 0;
  padding: 0;
  -webkit-transition: background-color 0.25s;
  transition: background-color 0.25s;
}
.ci-nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.ci-nav li:hover {
  background-color: #cccccc;
}
.ci-menu-item {
  display: inline-block;
  width: 100%;
}
.ci-menu-img {
  display: inline-block;
  text-align: center;
  padding-left: 20px;
}
.ci-menu-img img {
  margin: 0 auto;
}
.ci-menu-text {
  display: inline-block;
  padding-left: 10px;
}
.ci-nav-header {
  font-style: 'Lato', 'Calibri', sans-serif;
  font-weight: 300;
  font-size: 1.75em;
}
.ci-panels {
  overflow: hidden;
  position: relative;
  left: 25px;
  max-height: 450px;
}
.ci-panel-img {
  height: 100vh;
  text-align: center;
  padding: 5% 0;
}
.ci-panel-img img {
  margin: 0 auto;
  padding: 5% 0;
}
.ci-panel-text {
  padding-left: 10;
  padding-top: 40px;
  padding-right: 40px;
  padding-bottom: 40px;
}
.ci-slide1 {
  background-color: #c2e0ff;
}
.ci-slide2 {
  background-color: #fee0da;
}
.ci-slide3 {
  background-color: #e6e6e6;
}
.ci-slide4 {
  background-color: #bffffb;
}
.ci-slide5 {
  background-color: #f5ffc9;
}
.ci-slide6 {
  background-color: #e3ffec;
}


.contactus-header {
  color: #c9000b;
}
.contactus-overlay {
  min-height: 300px;
  overflow: hidden;
}
.contact-details {
  margin-top: 20px;
}
.g-map {
height: 450px;; width: 50%;;;
}


footer {
  margin: 0;
  padding: 20px;
  background-color: #c9000b;
  color: #FFFFFF;
}
footer > .container  {
  text-align: left;
}

footer > .container > p {
  padding-top: 10px;
}

.contact-link:hover {
  color:#c9000b;
}

.contact-details > h1 {
  font-weight: 300;
  text-align: ;
  font-size: 1.5em;
}

.social-media {
  position: fixed;
  bottom: 40%;
  right: 0;
}
.facebook {
  background-color: #3B5998;
}
.mail {
  background-color: #EB4823;
}
.instagram {
  background-color: #E95950;
}
.linkedin {
  background-color: #007bb5;
}
.twitter {
  background-color: #4099FF;
}
.social-media-icon {
  display: inline-block;
  width: 30px; height: 30px;
  transition: all .2s;
  border-radius: 200px 200px 200px 200px;
  -moz-border-radius: 200px 200px 200px 200px;
  -webkit-border-radius: 200px 200px 200px 200px;
  text-align: center;
  margin-bottom: 4px;
}
.social-media-icon img {
  position: relative;
  top: 5px;
  width: 20px;
  height: 20px;
  margin: 0 auto;
}
.social-media-icon:hover {
  height: 33px; width: 33px;
}


section {
  height: 100vh;
  width: 100%;
  text-align: center;
}
#bs-home {
  background-image:url("../img/bs-home-bg.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

#bs-clients {
  background-image:url("../img/bs-client-bg.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}


.bs-overlay {
  background-color: #FFFFFF;
  text-align: left;
  position: relative;
  bottom: 15vh;
  -webkit-box-shadow: 0px 0px 115px -16px rgba(0,0,0,0.75);
  -moz-box-shadow: 0px 0px 115px -16px rgba(0,0,0,0.75);
  box-shadow: 0px 0px 115px -16px rgba(0,0,0,0.75);
  padding: 20px;
}

.bs-overlay-top {
  background-color: #FFFFFF;
  text-align: left;
  position: relative;
  top: 25vh;
  -webkit-box-shadow: 0px 0px 115px -16px rgba(0,0,0,0.75);
  -moz-box-shadow: 0px 0px 115px -16px rgba(0,0,0,0.75);
  box-shadow: 0px 0px 115px -16px rgba(0,0,0,0.75);
  padding: 20px;
}

.home-overlay {
  width: 50%;
  max-width: 750px;
  margin-left: 45%;
}

.bs-overlay-plain {
  background-color: #FFFFFF;
  text-align: left;
  position: relative;
  -webkit-box-shadow: 0px 0px 115px -16px rgba(0,0,0,0.75);
  -moz-box-shadow: 0px 0px 115px -16px rgba(0,0,0,0.75);
  box-shadow: 0px 0px 115px -16px rgba(0,0,0,0.75);
  padding: 20px;
}

.clients {
  position: relative;
  bottom: 120px;
}

.client-overlay {
  width: 50%;
  max-width: 750px;
  margin-left: 5%;
}

#bs-about {
  position: relative;
  bottom: 40px;
  padding-right: 15%;
}

.panels {
  margin-top: 50px;
  text-align: center;
  width: 100%;
}

.bs-panels {
  margin: 0 auto;
  display: inline-block;
  vertical-align: top;
}

.bs-panels ul {
  display: inline-block;
  margin: 0 auto;
}

.bs-panels>ul>li {
  display: inline-block;
  list-style: none;
  width: 370px;
  vertical-align: top;
  transition: 0.3s;
  padding: 10px;
}

.bs-panels>ul>li:hover{
  -webkit-box-shadow: 0px 0px 115px -16px rgba(0,0,0,0.75);
  -moz-box-shadow: 0px 0px 115px -16px rgba(0,0,0,0.75);
  box-shadow: 0px 0px 115px -16px rgba(0,0,0,0.75);
}

.bs-panel-copy {
  padding-left: 10px;
  padding-right: 10px;
}

.bs-panel-copy>h3 {
  font-weight: 300;
  color: #c9000b;
}

.cta {
  position: relative;
  bottom: 50px;
}

.cta-overlay {
  background-color: #FFFFFF;
  text-align: left;
  position: relative;
  bottom: 20vh;
  -webkit-box-shadow: 0px 0px 115px -16px rgba(0,0,0,0.75);
  -moz-box-shadow: 0px 0px 115px -16px rgba(0,0,0,0.75);
  box-shadow: 0px 0px 115px -16px rgba(0,0,0,0.75);
  padding: 20px;
}

@media screen and (min-width: 1001px) and (max-width:1400px) {

  .menu-panels {
    text-align: center;
  }

  .menu-card {
    padding: 5px;
    width: 170px;
  }

  .menu-icon img{
    height: 100px; width: auto;
  }

}

@media screen and (max-width: 1000px) {

  .menu-panels {
    text-align: center;
  }
  .menu-panels ul {
    margin: 0 auto;
  }
  .menu-card {
    height: 120px; width: 100px;
  }
  .menu-icon img {
    height:50px; width: auto;
  }

  .menu-text h2 {
    font-size: 1em;
    text-align: center;
  }
  .menu-text > p {
    display: none;
  }
  .side-panel {
    height: 70px; width: 100%;
    padding: 0;
  }
  .side-panel img {
    height: 70px; width: auto;
    padding: 0;
  }
  .main-panel {
    padding-top: 20px;
    margin-bottom: 150px;
  }
  .panel-header {
    font-weight: 300;
    font-size: 1.5em;
  }

  .ci-nav {
    text-align: center;
    margin-bottom: 40px;
  }
  .ci-nav ul li {
    display: inline-block;
    height: 120px; width: 100px;
  }
  .ci-menu-img {
    display: block;
    text-align: center;
    padding: 0;
  }
  .ci-menu-img img {
    height: 70px; width: auto;
    margin: 0 auto;
    text-align: center;
  }
  .ci-menu-text {
    display: block;
    padding: 0;
    margin: 0;
  }
  .ci-menu-text h3 {
    font-size: 1em;
  }
  .ci-panels {
    max-height: none !important;
    overflow: visible;
    position: relative;
    left: 0;
  }
  .ci-panel-img {
    height: 70px;
    padding: 0;
  }
  .ci-panel-img img {
    height: 70px;
    padding: 0;
    margin: 0;
  }
  .ci-panel-text {
    padding-top: 10px;
  }

  .contactus-overlay {
    height: auto;
    overflow: visible;
  }
  .g-map {
    height: 300px; width: 300px;
  }



  .home-overlay {
    width: 100%;
    margin-left: 0;
    position: static;
  }

  #bs-about {
    position: relative;
    bottom: 0; top: 40px;
  }

  .bs-panels {
    position: relative;
    top: 50px;
    right: 20px;
  }

  .clients {
    position: static;
  }

  .client-overlay {
    width: 100%;
    margin-left: 0;
  }

  .social-media {
    position: fixed;
    bottom: 0;
  }

  .social-media ul {
    display: inline-block;
  }

  .wrapper {
    max-width: 100%;
    max-height: 100%;
    overflow: hidden;
  }
}