/*
Theme Name: Hello Elementor Child
Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-elementor
Author: Elementor Team
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
Tags: accessibility-ready,flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready
Version: 3.4.9.1781208641
Updated: 2026-06-11 20:10:41

*/



/* ============================================
   PODCAST TEMPLATES — Gateway theme styles
   ============================================ */

/* Brand variables (required by podcast styles below) */
:root {
  --size-content-maxwidth: 1111px;
  --size-text-h2: 40px;
  --size-text-detail: 10px;
  --size-text-body: 14px;
  --size-block-margin: 24px;
  --font-name-headings: "Playfair Display", Georgia, serif;
  --font-name-body: "Roboto", sans-serif;
  --color-brand-white: #ffffff;
  --color-brand-black: #000000;
  --color-brand-charc: #212121;
  --color-brand-blue: #718ba3;
  --color-brand-sandy: #f8f8f8;
  --color-brand-shade: #f4f4f4;
  --color-brand-iron: #5E646C;
}

/* Page layout */
.page:not(.editor-content) {
  margin-top: 40px;
  margin-bottom: 40px;
}

.inner {
  max-width: var(--size-content-maxwidth);
  margin: 0 auto;
  padding: 0 16px;
}

@media only screen and (max-width: 600px) {
  .inner {
    padding: 0 8px;
  }
}

.row {
  margin-top: 30px;
  margin-bottom: 30px;
}

.columns {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 20px;
}

.columns .span-4 { grid-column: span 4; }
.columns .span-6 { grid-column: span 6; }
.columns .span-8 { grid-column: span 8; }
.columns .span-12 { grid-column: span 12; }

@media only screen and (max-width: 782px) {
  .columns .span-6-on-medium { grid-column: span 6; }
  .columns .span-12-on-medium { grid-column: span 12; }
}

@media only screen and (max-width: 600px) {
  .columns .span-6-on-small { grid-column: span 6; }
  .columns .span-12-on-small { grid-column: span 12; }
}

/* Subscribe button (parent show page) */
.button {
  --color: var(--color-brand-blue);
  text-decoration: none;
  padding: 8px 32px;
  color: var(--color);
  border: 2px solid var(--color);
  display: inline-block;
}

.button.filled {
  color: var(--color-brand-white);
  background-color: var(--color);
}

.button span {
  text-decoration: underline;
}

/* Show cover header (parent podcast) */
.cover-page-block {
  --content-width: calc(var(--size-content-maxwidth) * 0.7);
  border: 12px solid var(--color-brand-black);
  padding: 12px;
  text-align: center;
}

@media only screen and (max-width: 600px) {
  .cover-page-block {
    border-width: 6px;
    padding: 10px;
  }
}

.cover-page-block .inside {
  background-color: var(--color-brand-white);
  padding: 60px 30px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

@media only screen and (max-width: 600px) {
  .cover-page-block .inside {
    padding-left: 12px;
    padding-right: 12px;
  }
}

.cover-page-block h1 {
  max-width: var(--content-width);
  margin-top: 0;
  margin-bottom: 0.4em;
}

@media only screen and (max-width: 600px) {
  .cover-page-block h1 {
    font-size: var(--size-text-h2);
    margin: 0;
  }
}

.cover-page-block .cover-page-text {
  max-width: var(--content-width);
  text-align: justify;
  text-align-last: center;
  margin-bottom: 0;
}

.cover-page-block .cover-page-text p:first-child {
  margin-top: 0;
}

.cover-page-block .cover-page-text p:last-child {
  margin-bottom: 0;
}

.cover-page-block .cover-page-buttons {
  margin-top: 30px;
}

.cover-page-block .cover-page-buttons:empty {
  display: none;
}

/* Pagination (show episode list) */
.pagination-links {
  display: flex;
}

.pagination-links .page-numbers {
  display: block;
  padding: 8px;
  margin: 0 2px;
  text-decoration: none;
  color: var(--color-brand-black);
  font-weight: normal;
  text-transform: uppercase;
  line-height: 1em;
  min-width: 1em;
  text-align: center;
}

.pagination-links .current {
  background: var(--color-brand-blue);
  color: white;
}

/* Podcast grid cards & episode hero */
.podcast-grid-item {
  position: relative;
  background-color: var(--color-brand-white);
  color: var(--color-brand-black);
  padding-bottom: 20px;
}

section.black .podcast-grid-item,
.podcast-grid-item.dark {
  background: var(--color-brand-charc);
  color: var(--color-brand-white);
}

section.black .podcast-grid-item h3 a,
.podcast-grid-item.dark h3 a {
  color: var(--color-brand-white);
}

.podcast-grid-item .insides {
  display: flex;
  flex-direction: column;
}

.podcast-grid-item .content {
  padding: 20px;
}

.podcast-grid-item .excerpt {
  margin-bottom: 20px;
}

.podcast-grid-item .bottom {
  text-align: right;
  position: absolute;
  bottom: 20px;
  left: 20px;
  right: 20px;
}

.podcast-grid-item .image {
  order: -1;
  position: relative;
  display: block;
  overflow: hidden;
  background-color: rgba(0, 0, 0, 0.1);
}

.podcast-grid-item .image:before {
  content: "";
  display: block;
  padding-top: 100%;
}

.podcast-grid-item .image img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.podcast-grid-item.no-image .image {
  display: none;
}

.podcast-grid-item .title a {
  text-decoration: none;
}

/* Episode hero (single episode page) */
.podcast-grid-item.hero {
  padding-bottom: 0;
}

.podcast-grid-item.hero .excerpt {
  display: none;
}

.podcast-grid-item.hero .insides {
  flex-direction: row;
  position: relative;
  align-items: center;
  max-width: var(--size-content-maxwidth);
  margin-left: auto;
  margin-right: auto;
  min-height: 600px;
}

@media only screen and (max-width: 600px) {
  .podcast-grid-item.hero .insides {
    flex-direction: column;
  }
}

.podcast-grid-item.hero .content {
  width: 50%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  z-index: 9;
}

@media only screen and (max-width: 600px) {
  .podcast-grid-item.hero .content {
    width: 100%;
    box-sizing: border-box;
  }

  .podcast-grid-item.hero .content audio {
    width: 100%;
  }
}

.podcast-grid-item.hero .image {
  order: 1;
  width: 50%;
  margin: 100px 0 100px 100px;
}

@media only screen and (max-width: 600px) {
  .podcast-grid-item.hero .image {
    width: 60%;
    order: -1;
    margin: 30px 0;
  }
}

/* Show name tag link on episode cards */
a.tag {
  display: inline-block;
  background-color: var(--color-brand-blue);
  color: white;
  text-decoration: none;
  font-weight: normal;
  padding: 4px 8px;
  font-size: var(--size-text-detail);
  line-height: 1em;
  border-radius: 3px;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}

/* Archive sidebar (list of all shows) */
.sidebar {
  background: var(--color-brand-shade);
  padding: 30px;
}

.sidebar .section:not(:first-child) {
  margin-top: 20px;
}

.sidebar .section > .title {
  font-size: var(--size-text-detail);
  text-transform: uppercase;
}

.sidebar:not(.no-separators) .section:not(:last-child) {
  border-bottom: 1px dotted #bbb;
  padding-bottom: 20px;
}

.terms-list a {
  font-family: var(--font-name-headings);
  font-weight: 700;
  color: var(--color-brand-black);
  display: block;
  padding: 16px 12px;
  font-size: 1.1em;
  border-bottom: 1px dotted #bbb;
  text-decoration: none;
}

/* Audio player & YouTube embed */
audio {
  display: block;
  margin: 2em 0;
  min-width: 40%;
}

.podcast-youtube-container {
  margin-bottom: 40px;
}

.embed-container {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100%;
}

.embed-container iframe,
.embed-container object,
.embed-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}