@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');


/* --------------------
 * GENERAL
 * -------------------- */


body {
  background-color: #58b9a7 !important;
  font-family: "Lato", sans-serif;
  font-weight: 400;
  font-style: normal;
}


/* --------------------
 * HEADER
 * -------------------- */

 header {
   position: fixed;
   width: 100%;
   text-align: center;
   padding: 1.5rem 0;
   z-index: 999;
 }

 header ul {
   margin: 0 auto;
   padding: 0;
 }

 header ul li {
   display: inline-block;
   margin: 0 .5rem;
 }

 header ul li a {
   color: #fff !important;
   text-decoration: none;
   -webkit-transition: opacity .5s ease;
   transition: opacity .5s ease;
 }

 header ul li a:hover,
 header ul li a:focus {
   opacity: .5;
   text-decoration: underline;
 }


/* --------------------
 * INTRO
 * -------------------- */

.intro {
  position: relative;
  padding: 6rem 1rem 2rem 1rem;
}

.intro img {
  display: block;
  margin: 0 auto 4rem auto;
}

.intro .intro--text {
  color: #ffffff;
  font-size: 24px;
}

.intro .intro--text a {
  color: #ffffff !important;
  text-decoration: underline;
  -webkit-transition: opacity .5s ease;
  transition: opacity .5s ease;
}

.intro .intro--text a:hover,
.intro .intro--text a:focus {
  opacity: .5;
}


/* --------------------
 * MEDIA QUERIES
 * -------------------- */


@media screen and (min-width: 992px) {

  .intro {
    height: 100vh;
  }


  .intro .intro--block {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
}