/**
 * @file
 * front.css
 * 
 * Styling for the Front Page
 * 
 * -------------------------------------------------
 * Attached thru `.theme`
 *
 ============================================================================ */

/*=======================================
   Global
=========================================*/

#block-letsgo-page-title {
  display: none;
}

/*----------------------------
  Buttons
  ----------------------------*/

.wp-block-media-text  {
  min-height: 25rem;
}

@media (max-width: 900px) {
  .page .wp-block-media-text {
    display: block;
  }
}

.wp-block-group:nth-child(2n + 3) {
  background: #efeeee
}

/* Elements */
h2 {
  text-transform: uppercase;
  margin: 0em 0 2em;
}

/* Media + Text */
.wp-block-media-text .wp-block-media-text__content {
  background: linear-gradient(rgba(255,255,255,1), rgba(255,255,255,0.5)),
  url(https://www.kindpng.com/picc/m/691-6910522_forest-silhouette-png-transparent-png.png) center 3em no-repeat;
  background-position: top, center bottom -3em;
  height: 100%;
  padding-top: 2em;
}

/*=======================================
   Hero Text
=========================================*/

.fp-hero {
  min-height: 17rem;
}

.fp-hero .wp-block-cover__inner-container {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}


.fp-hero-header {
    font-size: calc(1em + 3vw);
  text-transform: uppercase;
  letter-spacing: 2px;
  margin: 0;
}

.fp-hero .wp-block-buttons {
  margin: 1.5em 0 0;
}

.wp-block-button--hero a {
  padding: 0.5rem 1rem;

}

@media (min-width: 525px) {
  .fp-hero {
    min-height: 0;
    padding-bottom: 42%;
  }

  .wp-block-button--hero a {
    font-size: 1.2rem;
    font-weight: bold;
    padding: 0.9em 1em;
  }
}

@media (min-width: 980px) {
  .fp-hero-header {
    max-width: 17em;
    margin: 0 auto 1em;
    border: 1px solid #fff;
    text-align: center;
    padding: 0.8em 2em;
  }

  .fp-hero-header:before {
    content: '';
    float: right;
    width: 0.8em;
    height: 1px;
  }

  .wp-block-button--hero a {
    font-size: 1.4rem;
    padding: 0.9em 1em;
  }

}

/*==============================================================
  Responsive
================================================================*/
@media screen and (min-width: 750px) {
}

/*==============================================================
  Responsive
================================================================*/
@media screen and (min-width: 750px) {
}
