@import 'https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=Montserrat:wght@400;500;600;700&display=swap';

gpj-story-virunga:not(:defined),
gpj-horizontal-timeline:not(:defined),
gpj-horizontal-timeline-item:not(:defined) {
	display: inline-block;  
	height: 100vh;  
	opacity: 0;  
	transition: opacity 0.3s ease-in-out;
}

.story-narrow-container {
  @apply w-full mx-auto px-8 sm:max-w-screen-sm md:max-w-screen-md;
}

.story-main-container {
  @apply w-full mx-auto px-8 sm:max-w-screen-sm md:max-w-screen-md xl:max-w-screen-lg 2xl:max-w-screen-2xl;
}

.story-medium-container {
  @apply w-full mx-auto px-8 sm:max-w-screen-sm md:max-w-screen-lg;
}


.prose-content > h1:first-child,
.prose-content > h2:first-child,
.prose-content > h3:first-child,
.prose-content > h4:first-child,
.prose-content > h5:first-child,
.prose-content > h6:first-child,
.prose-content > p:first-child,
.prose-block h1:first-child,
.prose-block h2:first-child,
.prose-block h3:first-child,
.prose-block h4:first-child,
.prose-block h5:first-child,
.prose-block h6:first-child,
.prose-block p:first-child {
  margin-top: 0px;
}

.prose-content > h1 {
  margin-bottom: 1.25rem;
  font-size: 2.25rem;
  line-height: 2.5rem;
}

@media (min-width: 768px) {
  .prose-content > h1 {
    font-size: 3rem;
    line-height: 1;
  }
}

.prose-content > h2 {
  margin-bottom: 1rem;
  margin-top: 2rem;
  font-size: 1.875rem;
  line-height: 2.25rem;
}

@media (min-width: 768px) {
  .prose-content > h2 {
    font-size: 2.5rem;
    line-height: 1;
  }
}

.prose-content > h3 {
  margin-bottom: 1.75rem;
  margin-top: 1.75rem;
  font-size: 1.5rem;
  line-height: 2rem;
}

@media (min-width: 768px) {
  .prose-content > h3 {
    font-size: 1.75rem;
    line-height: 130%;
  }
}

.prose-content > h4 {
  margin-bottom: 0.75rem;
  margin-top: 1.5rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
}

@media (min-width: 768px) {
  .prose-content > h4 {
    font-size: 1.5rem;
    line-height: 130%;
  }
}

.prose-content > h5 {
  margin-bottom: 0.625rem;
  margin-top: 1.5rem;
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 500;
}

@media (min-width: 768px) {
  .prose-content > h5 {
    font-size: 1.25rem;
    line-height: 140%;
  }
}

.prose-content > h6 {
  margin-bottom: 0.5rem;
  margin-top: 1.5rem;
  font-size: 17px;
  font-weight: 500;
}

@media (min-width: 768px) {
  .prose-content > h6 {
    font-size: 1.1rem;
    line-height: 140%;
  }
}

.prose-content > p {
  margin-bottom: 1.75rem;
}

.prose-content a {
  text-decoration: underline;
  color: #F64646;
}
.prose-content a:hover
.prose-content a:focus {
  color: #0078a0;
}
.prose-content a {
  text-decoration: underline;
  color: #F64646;
}

.prose-content > p:last-of-type {
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .prose-content > p {
    font-size: 1rem;
    line-height: 1.5rem;
  }
}

@media (min-width: 1024px) {
  .prose-content > p {
    font-size: 1.125rem;
    line-height: 1.75rem;
  }
}