/* -------------------------------------------------------------------------
 * Typography
 * ------------------------------------------------------------------------- */

body {
  font-family: 'Lato';
  color: #401f40 !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Catamaran';
  font-weight: 800 !important;
}

/* -------------------------------------------------------------------------
 * Navbar styles
 * ------------------------------------------------------------------------- */

.navbar-custom {
  padding-top: 0.05rem;
  padding-bottom: 0.05rem;
  background-color: rgba(255, 255, 255, 0);
}

.nav-item .nav-link {
  font-size: 1rem !important;
  color: #6e185c !important;
  font-weight: 900 !important;
}

.nav-item .nav-link:hover {
  color: #401f40 !important;
}

.navbar-custom .navbar-nav .nav-item .nav-link {
  text-transform: uppercase;
  font-size: 0.9rem;
  font-weight: 700;
  letter-spacing: 0.1rem;
}

.navbar-brand .rounded-circle {
  background-color: rgba(255, 255, 255, 0.7);
}

.navbar-light {
  transition: background-color 200ms linear;
}

/* Identical to .navbar-expanded */
.navbar-scrolled {
  background-color: #fff !important;
  border-bottom: 1px solid #6e185c;
  transition: background-color 200ms linear;
}

/* -------------------------------------------------------------------------
 * Header styles
 * ------------------------------------------------------------------------- */

header.masthead {
  padding-top: calc(7rem + 72px);
  padding-bottom: 7rem;
  background: url(../img/mi-min-YGctel-oqYY-unsplash-edited.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;  
}

header.masthead .masthead-content .masthead-heading {
  font-size: 4rem !important;
}

header.masthead .masthead-content .masthead-subheading {
  font-size: 2rem !important;
}

header.masthead .masthead-content .lead {
  font-size: 1.4rem !important;
  font-weight: 400 !important;
}

/* -------------------------------------------------------------------------
 * Footer styles
 * ------------------------------------------------------------------------- */

footer {
  background-color: #331933;
}

/* -------------------------------------------------------------------------
 * Mobile (smaller screens) styles
 * ------------------------------------------------------------------------- */
 
/* Content is center aligned for smaller screens */
@media (max-width: 1199px) {
  .align-sections-center-mobile {
    text-align: center;
  }

  .align-items-center-mobile {
    display: inline-block;
    text-align: left;
  }

  nav.navbar {
    text-align: center;
  }

  /* Identical to .navbar-scrolled (but the transition animation is sped up). If
   * the navbar is expanded on mobile, the background of the navbar should be
   * white regardless of whether the user has scrolled. */
  .navbar-expanded {
    background-color: #fff !important;
    border-bottom: 1px solid #6e185c;
    transition: background-color 50ms linear;
  }
}