.CommonHeaderButtonComponent {
  padding: 3rem 0 2rem;
  position: relative;
}
.CommonHeaderButtonComponent:before {
  content: " ";
  background-image: url("/css/images/icons/boat_3.svg");
  background-repeat: no-repeat;
  background-position: left bottom;
  position: absolute;
  left: 0;
  bottom: 0;
  height: 40rem;
  width: 40rem;
}
.CommonHeaderButtonComponent h1, .CommonHeaderButtonComponent h2, .CommonHeaderButtonComponent h3, .CommonHeaderButtonComponent h4, .CommonHeaderButtonComponent h5, .CommonHeaderButtonComponent h6 {
  color: #080709;
}
.CommonHeaderButtonComponent h1 > span, .CommonHeaderButtonComponent h2 > span, .CommonHeaderButtonComponent h3 > span, .CommonHeaderButtonComponent h4 > span, .CommonHeaderButtonComponent h5 > span, .CommonHeaderButtonComponent h6 > span {
  color: #FFFFFF;
}
.CommonHeaderButtonComponent.isDark h1, .CommonHeaderButtonComponent.isDark h2, .CommonHeaderButtonComponent.isDark h3, .CommonHeaderButtonComponent.isDark h4, .CommonHeaderButtonComponent.isDark h5, .CommonHeaderButtonComponent.isDark h6 {
  color: #113A4E;
}
.CommonHeaderButtonComponent.isDark h1 > span, .CommonHeaderButtonComponent.isDark h2 > span, .CommonHeaderButtonComponent.isDark h3 > span, .CommonHeaderButtonComponent.isDark h4 > span, .CommonHeaderButtonComponent.isDark h5 > span, .CommonHeaderButtonComponent.isDark h6 > span {
  color: #7CB9D0;
}
.CommonHeaderButtonComponent .bg1 {
  background-repeat: no-repeat;
  background-size: cover;
  height: 20rem;
  position: relative;
  box-shadow: 0 0 25px rgba(0, 0, 0, 0.42);
  border-radius: 5px;
}
.CommonHeaderButtonComponent .bg1 > div {
  position: absolute;
  top: 30%;
  right: 5%;
  bottom: 5%;
  width: 30%;
}
@media (max-width: 767px) {
  .CommonHeaderButtonComponent .bg1 > div {
    width: 90%;
  }
}
.CommonHeaderButtonComponent .bg1 > div h3 {
  color: #FFFFFF;
}
