html {
  scroll-behavior: smooth;
  overflow-x: hidden;
}

.circular {
  width: 77px;
  height: 77px;
  border-radius: 50%;
  position: relative;
  overflow: hidden;
}
.circular img {
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

body {
  font: 20px Montserrat, sans-serif;
  line-height: 1.8;
  color: #f5f6f7;
}

p {
  font-size: 16px;
}

.margin {
  margin-bottom: 45px;
  font-weight: bold;
}

.bg-1 {
  /* BG of Display Picture */
  background-color: rgb(0, 104, 128);
  /* Green */
  color: #ffffff;
}

.bg-2 {
  /*  */
  background-color: #474e5d;
  /* Dark Blue */
  color: #ffffff;
}

.bg-3 {
  background-color: #ffffff;
  /* White */
  color: #555555;
}

.bg-4 {
  background-color: #2f2f2f;
  /* Black Gray */
  color: #fff;
}

.container-fluid {
  padding-top: 70px;
  padding-bottom: 70px;
}

.navbar {
  padding-top: 15px;
  padding-bottom: 15px;
  border: 0;
  border-radius: 0;
  margin-bottom: 0;
  font-size: 12px;
  letter-spacing: 5px;
}

.navbar-nav li a:hover {
  color: #1abc9c !important;
}

#contact {
  background-color: #496381;
  color: #f7f7f7;
}

footer {
  margin: 0;
}