body {
    font-family: 'Open Sans', sans-serif;
    display: flex;
    height: 100vh;
    flex-direction: column;
    justify-content: space-between;
    margin: 0;
    padding: 0;
    position: relative;
    align-items: center;
    background-color: #142C48;
}


.bf-hexagon {
  clip-path: polygon(40% 7.67949%, 43.1596% 6.20615%, 46.52704% 5.30384%, 50% 5%, 53.47296% 5.30384%, 56.8404% 6.20615%, 60% 7.67949%, 81.65064% 20.17949%, 84.50639% 22.17911%, 86.97152% 24.64425%, 88.97114% 27.5%, 90.44449% 30.6596%, 91.34679% 34.02704%, 91.65064% 37.5%, 91.65064% 62.5%, 91.34679% 65.97296%, 90.44449% 69.3404%, 88.97114% 72.5%, 86.97152% 75.35575%, 84.50639% 77.82089%, 81.65064% 79.82051%, 60% 92.32051%, 56.8404% 93.79385%, 53.47296% 94.69616%, 50% 95%, 46.52704% 94.69616%, 43.1596% 93.79385%, 40% 92.32051%, 18.34936% 79.82051%, 15.49361% 77.82089%, 13.02848% 75.35575%, 11.02886% 72.5%, 9.55551% 69.3404%, 8.65321% 65.97296%, 8.34936% 62.5%, 8.34936% 37.5%, 8.65321% 34.02704%, 9.55551% 30.6596%, 11.02886% 27.5%, 13.02848% 24.64425%, 15.49361% 22.17911%, 18.34936% 20.17949%);
  -webkit-clip-path: polygon(40% 7.67949%, 43.1596% 6.20615%, 46.52704% 5.30384%, 50% 5%, 53.47296% 5.30384%, 56.8404% 6.20615%, 60% 7.67949%, 81.65064% 20.17949%, 84.50639% 22.17911%, 86.97152% 24.64425%, 88.97114% 27.5%, 90.44449% 30.6596%, 91.34679% 34.02704%, 91.65064% 37.5%, 91.65064% 62.5%, 91.34679% 65.97296%, 90.44449% 69.3404%, 88.97114% 72.5%, 86.97152% 75.35575%, 84.50639% 77.82089%, 81.65064% 79.82051%, 60% 92.32051%, 56.8404% 93.79385%, 53.47296% 94.69616%, 50% 95%, 46.52704% 94.69616%, 43.1596% 93.79385%, 40% 92.32051%, 18.34936% 79.82051%, 15.49361% 77.82089%, 13.02848% 75.35575%, 11.02886% 72.5%, 9.55551% 69.3404%, 8.65321% 65.97296%, 8.34936% 62.5%, 8.34936% 37.5%, 8.65321% 34.02704%, 9.55551% 30.6596%, 11.02886% 27.5%, 13.02848% 24.64425%, 15.49361% 22.17911%, 18.34936% 20.17949%);
  position: fixed;
  animation: hexAnim 9s ease-in-out infinite;
}
.bf-hexagon--big {
  width: 50vw;
  height: 50vw;
  animation-delay: 1s;
}
.bf-hexagon--small {
  width: 45vw;
  height: 45vw;
}
.bf-hexagon--left-top {
  background: linear-gradient(145deg, transparent 65%, #245896 100%);
  top: -25vw;
  left: -15vw;
}
.bf-hexagon--right-bottom {
  background: linear-gradient(-45deg, transparent 65%, #245896 100%);
  bottom: -25vw;
  right: -15vw;
}

@keyframes hexAnim {
  0%, 100% {
    transform: translate(0) rotate(0) scale(1);
  }
  50% {
    transform: translate(2vw, 2vh) rotate(15deg) scale(1.05);
  }
}


.header {
    text-align: center;
    color: #fff;
    padding: 40px;
    font-size: 3vh;
}

.title {
    font-size: 6vh;
    text-align: center;
    color: #fff;
    font-weight: 700;
    margin: 0 0 1vh 0; 
}

.description {
    font-size: 3vh;
    text-align: center;
    color: #fff;
    font-weight: 400;
    margin: 0;
}
header,
section,
footer {
  z-index: 1;
}

footer {
    padding: 40px;
}

.link-text a {
    color: #fff;
    margin: 0 20px;
    text-align: center;
    text-decoration: none;
}

.link-text span {
  text-decoration: underline;
}

.link-text a:hover {
    color: 	#7FAADC;
}

.link-text {
    padding-top: 60px;
    align-content: center;
    text-align: center;
}

ul {
    list-style: none;
    display: inline-flex;
    margin: 0;
    padding: 0;
}

ul li { 
    padding: 0 15px;
}

ul li a {
    color: #fff;
}

ul li a:hover {
    color: 	#7FAADC;
}