body {
  font-family: 'Montserrat', sans-serif;
  background-color: #58585a;
  position: relative;
  font-size: 10px;
}
a,
a:hover,
a:focus {
  color: #fff;
  text-decoration: none;
}
img {
  position: relative;
  width: 100%;
  z-index: 2;
}
input.btn {
  width: 35%;
  float: right;
  color: #fff;
  background-color: #8dc63f;
  padding: 2px 10px;
  margin-top: 5px;
  border-radius: 5px;
  transition: all .3s ease-in-out;
}
/*form {
  position: absolute;
  top: 71.5%;
  left: 43.5%;
  width: 18vw;
}*/
form,
.form {
  position: absolute;
  top: 250.5%;
  left: 21.5%;
  width: 58vw;
}
input,
textarea {
  display: block;
  width: 100%;
  margin: 2% 0;
  font-size: 110%;
  padding: 2%;
  border: none;
  border-radius: 5px;
}
#form-messages {
  background-color: #fff;
  /*padding: 2%;*/
  position: absolute;
  bottom: 0;
}
@-webkit-keyframes offset {
  100% {
    height: 100vh;
  }
}
.bee {
  position: absolute;
  height: 50px;
  width: 50px;
}
.back-to-top {
  position: fixed;
  font-size: 5rem;
  color: #fff;
  bottom: 0;
  right: 0;
  display: inline-block;
  padding: 1rem;
  margin: 0rem 4rem;
}
.beard {
  position: absolute;
  bottom: calc(-273% + -300px);
  width: 35px;
  left: 51%;
  margin-right: -50%;
  transform: translate(-75%, -32%);
}
@media (min-width: 768px) {
  .beard {
    bottom: calc(-203.2% + -300px);
    width: 35px;
    left: 50.5%;
    margin-right: -50%;
    transform: translate(-75%, -32%);
  }
}
@media (min-width: 1190px) {
  .beard {
    bottom: 0;
    width: 35px;
    left: 50%;
    margin-right: -50%;
    transform: translate(-75%, -32%);
  }
}
.back-to-top:hover {
  cursor: pointer;
}
.pipe-bg {
  bottom: 0;
  height: 50vh;
  width: 100%;
  position: fixed;
  background-color: #1d54a4;
  z-index: -100;
  /*animation: wave 10s infinite;*/
}
.pipe-bg img {
  width: 10000px;
  margin-top: -35px;
  animation: wavenew 60s infinite;
}
@keyframes wavenew {
  0%, 100% {
    margin-left: -8000px;
  }
  50% {
    margin-left: 0;
  }
}
@keyframes wave {
  0%, 100% {
    transform: rotate(0);
    border-radius: 0;
  }
  10%, 80% {
    transform: rotate(1deg);
    border-radius: 30%;
  }
  50% {
    transform: rotate(-1deg);
    border-radius: 60%
  }
}
.contain-svg {
  height: 0;
  width: 100%;
  padding-top: 288%;
  position: relative;
}

svg {
  position: absolute;
  top: 0;
  left: 0;
}
.trans {
  fill: transparent!important;
}
.nav-big {
  position: absolute;
  top: 16%;
  left: 50%;
  margin-right: -50%;
  transform: translate(-50%);
  display: none;
}
.navbar-toggle {
  background-color: #fff;
}
.nav-mobile {
  display: block;
  position: absolute;
  top: 46.75%;
  left: 36.8%;
}
.navbar-toggle .icon-bar {
  display: block;
  width: 30px;
  height: 3px;
  border-radius: 1px;
}
span.icon-bar {
  background-color: #000;
}
div#bs-example-navbar-collapse-1 {
  position: absolute;
  top: 46px;
  left: -97%;
  border: none;
  box-shadow: none;
}
ul.nav.navbar-nav {
  background-color: #fff;
  min-width: 300px;
}
ul.nav.navbar-nav a {
  color: #000;
}
.nav-big a {
  font-size: 2rem;
}
.map {
  position: absolute;
  /*bottom: -300px;*/
  bottom: calc(-289% + -300px);
  width: 100%;
  z-index: 0;
}
form h2 {
  font-family: 'Montserrat', sans-serif;
  color: #fff;
  margin-bottom: 8%;
  font-size: 2rem;
  margin-left: 50px;
  font-weight: 100;
}
@media (min-width: 500px) {
  form h2 {
    font-size: 3rem;
  }
}
@media (min-width: 600px) {
  form {
    top: 251.5%;
  }
  form h2 {
    margin-left: 92px;
    margin-bottom: 10%;
  }
}
@media (min-width: 768px) {
  .nav-mobile {
    display: none;
  }
  .nav-big {
    top: 43%;
    display: block;
  }
  .nav-big a {
    font-size: 3rem;
  }
  .small-tablet .st12 {
    font-size: 16px;
  }
  form {
    top: 210.1%;
    width: 46vw;
    left: 26.5%;
  }
  .map {
    bottom: calc(-214% + -300px);
  }
}
@media (min-width: 900px) {
  form {
    top: 210.5%;
  }
  textarea {
    height: 145px;
  }
}
@media (min-width: 1190px) {
  .nav-big {
    top: 16%;
    display: block;
  }
  .nav-big a {
    font-size: 2rem;
  }
  form {
    top: 69%;
    width: 18vw;
    left: 43.5%;
  }
  form h2 {
    margin-bottom: 12%;
    font-size: 35px;
    margin-left: 0;
  }
  .map {
    bottom: -300px;
  }
  textarea {
    height: auto;
  }
}
@media (min-width: 1300px) {
  form h2 {
    margin-bottom: 10%;
  }
}

ul {
  padding: 0;
  margin: 0;
}

li {
  display: inline-block;
  margin: 20px;
  font-size: 20px;
}

.st55 {
  z-index: 20;
  padding: 20px;
}
.map iframe{
  pointer-events: none;
}

/* --------------------------
  SVG Styles
--------------------------- */

#top-img {
  position: relative;
  margin-bottom: -60px;
  z-index: 3;
}

.heading {
  font-size: 3em;
  font-weight: 600;
  color: #fff;
}

p {
  /*font-size: 1.4em;*/
  font-size: 0.7vw;
  font-weight: 100;
  letter-spacing: 1px;
}
.mobile,
.small-tablet {
  display: none;
}
.mobile-small {
  display: block;
}
@media (min-width: 768px) {
  .small-tablet {
    display: block;
  }
  .mobile-small,
  .mobile {
    display: none;
  }
}
@media (min-width: 1190px) {
  .mobile {
    display: block;
  }
  .mobile-small,
  .small-tablet {
    display: none;
  }
}



/*.wave {
  opacity: 1;
  position: absolute;
  top: 3%;
  left: 50%;
  background: blue;
  width: 500px;
  height: 500px;
  margin-left: -250px;
  margin-top: -250px;
  transform-origin: 50% 48%;
  border-radius: 43%;
  animation: drift 3000ms infinite linear;
}*/
/*.wave {
    opacity: 1;
    position: absolute;
    top: 175%;
    left: -25%;
    background: blue;
    width: 200vw;
    height: 200vw;
    margin-left: -250px;
    margin-top: -250px;
    transform-origin: 50% 48%;
    border-radius: 23%;
    animation: drift 3000ms infinite linear;
}*/
/*.wave.-two {
  animation: drift 7000ms infinite linear;
}*/
/*@keyframes drift {
  from { transform: rotate(0deg); }
  from { transform: rotate(360deg); }
}*/