body {
  /* background-color: #212529; */
  background-color: #fefefe;
  font-family: 'Montserrat', sans-serif;
}

h1 {
  font-family: 'Krona One', sans-serif;
  font-size: x-large;
}


.fadeElement {
  opacity: 0;
}

.zoom {
  transition: transform 0.2s;
}

.zoom:hover {
  transform: scale(1.05);
}

.greenText {
  color: #26CBAB;
}

.active {
  color: #26CBAB !important;
}

.greenBg {
  background-color: #26CBAB;
}

.blackBg {
  background-color: #1a1a1a;
}

.menuFont {
  font-size: 12px;
  letter-spacing: 1px;
}

.bannerBg {
  background-image: url("../images/banner.png");
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
}

.colleaguesBg {
  background-image: url("../images/ourcolleagues.jpg");
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
}

.floorPlansBg {
  background-image: url("../images/floorplans.jpg");
  background-repeat: no-repeat;
  background-position: center top;
  background-size: cover;
}

.progressBar {
  width: 100%;
  max-width: 300px;
  height: 17px;
  border: 2px solid #ffffff;
  padding: 3px;
}

.progressBarLeft {
  width: 50%;
  height: 8px;
  background-color: #26CBAB;
}

.progressBarRight {
  width: 50%;
  height: 8px;
  background-color: #000000;
  opacity: 0.6;
}

.progressBar2 {
  width: 100%;
  max-width: 300px;
  border: 4px solid #f2f2f2;
  padding: 0px;
}

.progressBarLeft2 {
  width: 50%;
  height: 8px;
  background-color: #26CBAB;
}

.progressBarRight2 {
  width: 50%;
  height: 8px;
  background-color: #f2f2f2;
  opacity: 0.6;
}

.progressFont {
  font-family: 'Krona One', sans-serif;
  font-size: 16px;
}

.bigHeaderFont {
  font-family: 'Krona One', sans-serif;
  font-size: 4.5rem;
}

.bannerBox {
  height: 160px;
  background-color: #ffffff;
  position: relative;
  top: -60px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 10px;
  padding: 10px 10px 40px 10px;
  box-shadow: 4px 9px 12px 1px #a4f2e3;
  font-size: 12px;
}

.bannerBox img {
  max-width: 100%;
  width: 60px;
  height: 60px;
}

.contactBox {
  height: 150px;
  width: 190px;
  background-color: #26CBAB;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 10px;
  padding: 10px 10px 40px 10px;
  font-size: 16px;
}

#galleryBig {
  display: block;
}

#gallerySmall {
  display: none;
}

.text-justify {
  text-align: justify;
}

.gradient {
  background: linear-gradient(to bottom, #1a1a1a, #229681);
}

.picBoxes {
  font-size: .875em;
}

.picBoxes img {
  width: 60px;
  height: 60px;
}

/* Gallery */
.r {
  display: flex;
  flex-wrap: wrap;
  padding: 0 4px;
}

/* Create four equal columns that sits next to each other */
.c {
  flex: 33%;
  max-width: 33%;
  padding: 0 4px;
}

.c50 {
  flex: 50%;
  max-width: 50%;
  /* padding: 0 4px; */
}

.c img {
  margin-top: 8px;
  vertical-align: middle;
  width: 100%;
}

.c50 img {
  margin-top: 8px;
  vertical-align: middle;
  width: 100%;
}

.grecaptcha-badge {
  visibility: hidden;
}

.nav-link {
  font-size: 12px;
}

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 800px) {
  .c {
    flex: 75%;
    max-width: 75%;
    margin: auto;
  }
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .c {
    flex: 100%;
    max-width: 100%;
  }
}

/* end of gallery */


@media (max-width: 768px) {
  .bigHeaderFont {
    font-size: 2.5rem;
  }

  .progressFont {
    font-size: 14px;
  }
}

@media (max-width: 576px) {
  .bigHeaderFont {
    font-size: 2.0rem;
  }

  .progressFont {
    font-size: 12px;
  }

  #galleryBig {
    display: none;
  }

  #gallerySmall {
    display: block;
  }
}

@media (min-width: 768px) {
  .bannerBox {
    max-width: 120px;
  }
}