/* GANTRY5 DEVELOPMENT MODE ENABLED.
 *
 * WARNING: This file is automatically generated by Gantry5. Any modifications to this file will be lost!
 *
 * For more information on modifying CSS, please read:
 *
 * http://docs.gantry.org/gantry5/configure/styles
 * http://docs.gantry.org/gantry5/tutorials/adding-a-custom-style-sheet
 */

@charset "UTF-8";
/* ==========================================================================
   SOUL TO SOUL MEDIUM MASTER SCSS - REV. EILEEN CASEY
   ========================================================================== */
/* ----------------------------Universal Gold HEADINGS FOR PAGES--------------------- */
h1, h2, h3, h4 {
  font-family: "Cinzel Decorative", serif !important;
  color: #FFD700 !important;
  letter-spacing: 2px;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
  /* Adds depth and protection */
}
b, strong {
  color: #D4AF37 !important;
  font-weight: 700;
  /* Makes it slightly more substantial */
}
/* ---------END------Universal Gold HEADINGS FOR PAGES--------------------- */
/* ----------------Universal Image Framing-------------------------------- */
.item-page img {
  border: 2px solid #ffffff;
  /* Antique Gold */
  padding: 8px;
  background-color: #120404;
  /* Midnight Merlot Matting */
  transition: all 0.4s ease;
  /* Makes the glow smooth */
  box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.5);
  margin-bottom: 20px;
}
/* The Activation Glow */
.item-page img:hover {
  border-color: #FFD700;
  /* Switches to Electric Gold */
  box-shadow: 0px 0px 20px rgba(212, 175, 55, 0.6);
  /* Gold Glow */
  transform: scale(1.02);
  /* Very subtle lift effect */
}
/* -------------END--Universal Image Framing-------------------------------- */
/* --- 1. THE CANVAS --- */
html, body, #g-page-surround {
  background: radial-gradient(circle at center, #8b0000 0%, #4a0000 50%, #000000 100%) no-repeat center center fixed !important;
  background-size: cover !important;
}
/* --- THE CORNERS --- */
/* Ensure you have added 'anchored-filigree-section' to the Gantry Section Attributes */
/* --- FILIGREE CORNERS (Desktop Only) --- */
/* This 'media' line tells the browser to only run this code on larger screens */
@media (min-width: 769px) {
  /* Top Section Corners */
  /* Bottom Section Corners */
  .anchored-filigree-section {
    position: relative;
    z-index: 1;
  }
  .anchored-filigree-section::before {
    content: "";
    position: absolute;
    top: 20px;
    left: 20px;
    width: 150px;
    height: 150px;
    background: url('https://soultosoulmedium.com/images/gold-filigree.png') no-repeat;
    background-size: contain;
    pointer-events: none;
    z-index: -1;
    opacity: 0.7;
  }
  .anchored-filigree-section .g-container::before {
    content: "";
    position: absolute;
    top: 20px;
    right: 20px;
    width: 150px;
    height: 150px;
    background: url('https://soultosoulmedium.com/images/gold-filigree.png') no-repeat;
    background-size: contain;
    transform: scaleX(-1);
    pointer-events: none;
    z-index: -1;
    opacity: 0.7;
  }
  .anchored-bottom-filigree {
    position: relative;
    z-index: 1;
  }
  .anchored-bottom-filigree::after {
    content: "";
    position: absolute;
    bottom: 20px;
    left: 20px;
    width: 150px;
    height: 150px;
    background: url('https://soultosoulmedium.com/images/gold-filigree.png') no-repeat;
    background-size: contain;
    transform: scaleY(-1);
    pointer-events: none;
    z-index: -1;
    opacity: 0.7;
  }
  .anchored-bottom-filigree .g-container::after {
    content: "";
    position: absolute;
    bottom: 20px;
    right: 20px;
    width: 150px;
    height: 150px;
    background: url('https://soultosoulmedium.com/images/gold-filigree.png') no-repeat;
    background-size: contain;
    transform: scale(-1, -1);
    pointer-events: none;
    z-index: -1;
    opacity: 0.7;
  }
}
/* End of Desktop-Only Media Query */
/* --- 2. GLOBAL CENTERING --- */
.home-logo-new, .ministry-branding-header {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  width: 100% !important;
}
/* --- 3. LOGO & NAME STYLING --- */
.ministry-logo {
  width: 100% !important;
  max-width: 130px !important;
  height: auto !important;
  margin: 20px 0 10px 0 !important;
  filter: drop-shadow(0px 4px 12px rgba(0, 0, 0, 0.6));
}
.rev-name {
  font-family: "Cinzel Decorative", serif !important;
  color: #D4AF37 !important;
  font-size: clamp(2.2rem, 6vw, 3.5rem) !important;
  text-transform: uppercase !important;
  text-shadow: 2px 2px 15px #000 !important;
  font-weight: bold !important;
  letter-spacing: 4px !important;
  margin-top: -15px !important;
  margin-bottom: 5px !important;
  display: block !important;
}
@media only screen and (max-width: 768px) {
  .rev-name {
    line-height: 1.1 !important;
    margin-top: 5px !important;
  }
}
.rev-subtitle {
  color: #ffffff !important;
  font-size: 1rem !important;
  text-transform: uppercase !important;
  opacity: 0.9 !important;
  font-weight: bold !important;
  display: block !important;
  letter-spacing: 10px !important;
  margin-top: -10px !important;
}
@media only screen and (max-width: 768px) {
  .rev-subtitle {
    line-height: 1.3 !important;
    letter-spacing: 8px !important;
    margin-top: 0px !important;
    font-size: 0.9rem !important;
  }
}
/* ------ 4. THE LIVING PORTRAIT (VIDEO CIRCL AND MISSION AREA) ------- */
/* ------ 1. THE ROW (The "Invisible Glue") ------- */
.ministry-hero-row {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
  flex-wrap: nowrap !important;
}
/* ------------ 2. THE MISSION & ABOUT CONTAINER --------- */
/* This ensures both the Mission Title particle and the Custom HTML particle align */
.ministry-mission-container, .g-particle {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.ministry-mission-container .mission-title, .g-particle .mission-title {
  font-family: "Cinzel Decorative", serif !important;
  color: #FFD700 !important;
  font-size: 2.5rem !important;
  margin-bottom: 0.5rem !important;
  text-transform: uppercase;
}
.ministry-mission-container .mission-text, .g-particle .mission-text {
  font-family: "Montserrat", sans-serif !important;
  color: #ffffff !important;
  /* This fixes the red text */
  font-size: 1.2rem !important;
  line-height: 1.8 !important;
  max-width: 550px;
  margin: 0 auto !important;
  opacity: 1 !important;
  /* Ensures it's fully bright */
}
.ministry-mission-container .mission-originality, .g-particle .mission-originality {
  font-family: "Cinzel Decorative", serif !important;
  color: #FFD700 !important;
  font-size: 1.1rem !important;
  border-top: 1px solid rgba(255, 214, 0, 0.4) !important;
  padding-top: 1rem !important;
  margin-top: 1.5rem !important;
  display: inline-block;
}
/* --------- 3. THE LIVING PORTRAIT -------------- */
.portrait-living-frame {
  /* Fixed size ensures it stays a circle and doesn't "fight" the 25% column */
  width: 250px !important;
  height: 250px !important;
  flex-shrink: 0;
  position: relative;
  border: 6px solid #FFD700;
  border-radius: 50%;
  box-shadow: 0 0 20px rgba(255, 215, 0, 0.6);
  background: #000;
  overflow: hidden;
}
.portrait-living-frame .portrait-video-mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-mask-image: url('https://soultosoulmedium.com/images/vidoe_circle.png');
  mask-image: url('https://soultosoulmedium.com/images/vidoe_circle.png');
  -webkit-mask-size: cover;
  -mask-size: cover;
}
.portrait-living-frame .portrait-video-mask iframe {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 200%;
  transform: translate(-50%, -50%) scale(1.1, 1) !important;
  object-fit: cover;
}
/* -----------  THE MISSION ABOUT WRAPPER in the container -------- */
.mission-about-wrapper {
  display: flex;
  flex-direction: column;
  text-align: center;
  padding-top: 20px;
}
.mission-about-wrapper .mission-about-text {
  font-family: "Montserrat", sans-serif !important;
  color: #ffffff !important;
  font-size: 1.2rem !important;
  line-height: 1.8 !important;
}
.mission-about-wrapper .mission-about-text .highlight-gold {
  color: #FFD700 !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  font-size: 0.95em;
}
.mission-about-wrapper .mission-originality {
  font-family: "Cinzel Decorative", serif !important;
  color: #FFD700 !important;
  font-size: 1.1rem !important;
  border-top: 1px solid rgba(255, 214, 0, 0.4) !important;
  padding-top: 1.5rem !important;
  margin-top: 1.5rem !important;
  letter-spacing: 2px !important;
  display: inline-block;
}
/* --- 4. MOBILE STACKING --- */
@media (max-width: 768px) {
  .ministry-hero-row {
    flex-direction: column !important;
  }
  .ministry-mission-container {
    align-items: center;
    text-align: center;
    padding-right: 0;
    margin-bottom: 30px;
  }
}
/* ---------- TESTIMONIAL CALLOUT STYLING ------------- */
.testimonial-callout {
  text-align: center;
  padding: 40px 20px;
  margin: 20px auto;
  max-width: 800px;
}
.testimonial-callout a {
  text-decoration: none !important;
  display: inline-block;
  transition: transform 0.3s ease;
}
.testimonial-callout h3 {
  font-family: "Cinzel Decorative", serif !important;
  color: #FFD700 !important;
  /* Electric Gold */
  font-size: 2rem !important;
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-bottom: 5px !important;
  text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8);
}
.testimonial-callout p {
  font-family: "Montserrat", sans-serif !important;
  color: #ffffff !important;
  font-size: 1.1rem;
  letter-spacing: 4px;
  text-transform: uppercase;
  opacity: 0.9;
}
/* Hover Effect: The text lifts and glows slightly */
.testimonial-callout a:hover {
  transform: translateY(-3px);
}
.testimonial-callout a:hover h3 {
  color: #ffffff !important;
  /* Flips to white on hover for a "lit up" effect */
  text-shadow: 0 0 15px rgba(255, 215, 0, 0.7);
}
/* --------- UNIQUE CIRCULAR ICON MENU (NO TEXT) ------------- */
.soul-icon-menu {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  /* Pushes icons to the very edges of the container */
  justify-content: space-between !important;
  /* Removes the width limits */
  width: 100% !important;
  max-width: 100% !important;
  /* This allows it to use the whole screen */
  /* Removes any side padding from the container */
  padding: 30px 0 !important;
  margin: 0 !important;
}
.soul-icon-item {
  flex: 1 !important;
  /* Tells each icon to take up equal space */
  text-align: center;
  /* REDUCE THIS to make them go wider */
  padding: 0 !important;
}
.soul-icon-item img {
  /* Increase these values to your liking */
  width: 225px !important;
  height: 225px !important;
  border-radius: 50%;
  object-fit: cover;
  border: none !important;
  background: transparent !important;
  /* This ensures the grow effect still looks smooth */
  transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.soul-icon-item img:hover {
  /* On hover, they will get even larger */
  transform: scale(1.2);
}
.soul-icon-item img:hover {
  transform: scale(1.2);
}
/* Mobile Overrides for the Circular Icon Menu */
@media (max-width: 768px) {
  .soul-icon-menu {
    flex-wrap: wrap !important;
  }
  .soul-icon-item {
    flex: 0 0 45% !important;
    margin-bottom: 25px;
  }
  .soul-icon-item img {
    width: 110px !important;
    height: 110px !important;
  }
}
/* Mobile Fix: If the screen is too narrow for one line, they will stack neatly */
@media (max-width: 768px) {
  .soul-nav-container {
    flex-wrap: wrap;
  }
  .soul-nav-item {
    flex: 0 0 33%;
    /* Shows 3 on one line, 2 on the next for mobile */
    margin-bottom: 15px;
  }
  .soul-nav-item img {
    width: 100px;
    height: 100px;
  }
}
/* ------------------------------------------------------ ------------------------------------- EVERYTHING UNDER THESE LINES IS FOR THE VARIOUS PAGE ITEMS -------
------------------------------------------------------ ---------------------------------------------------------------------------------- --- */
/* ----------- CONTAINED NAVIGATION BAR -------------- */
/* --- TRANSPARENT BOXED NAVIGATION BAR --- */
.page-dropdown-menu {
  /* 0.4 last # is transparency Lower for more-- */
  background-color: rgba(41, 10, 10, 0.2) !important;
  margin-top: 50px !important;
  /* Adds space ABOVE the bar */
  /* --- ADD THESE TO STOP SIDE-TO-SIDE STRETCHING --- */
  max-width: 1200px;
  /* Limits the width of the bar */
  margin-left: auto !important;
  /* Centers it from the left */
  margin-right: auto !important;
  /* Centers it from the right */
  border-top: 2px solid #D4AF37 !important;
  /* Your Gold Crown */
  padding: 25px 20px !important;
  display: block !important;
  visibility: visible !important;
  border-radius: 4px;
  z-index: 9999 !important;
  position: relative;
  /* Optional: Blurs the background behind the transparency for a 'glass' look */
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}
/* 2. THIS ONLY HAPPENS WHEN YOU HOVER */
.page-dropdown-menu .g-menu-item-container:hover {
  background-color: #631616 !important;
  /* Slightly lighter on hover */
  transition: background-color 0.3s ease;
}
/* 3. The Dropdown Box */
.page-dropdown-menu .g-dropdown {
  background-color: #4A1010 !important;
  /* Matches the bar color */
  border: 1px solid #D4AF37 !important;
  /* Framed in Antique Gold */
  box-shadow: none !important;
}
/* 4. Dropdown Links and Hover */
.page-dropdown-menu .g-dropdown .g-menu-item-title {
  color: #F5F5F5 !important;
  /* Off-White */
}
.page-dropdown-menu .g-menu-item-container:hover {
  background-color: #631616 !important;
  /* Even lighter highlight on hover */
}
/* --- ENSURE MENU IS VISIBLE ON ALL SCREENS --- */
@media (max-width: 992px) {
  .page-dropdown-menu {
    display: block !important;
    /* Forces the bar to stay visible */
    width: 100% !important;
    margin: 0 !important;
    border-radius: 0 !important;
  }
}
/* --- ---------------------------------------------------- --- */
/* -------- MODULE SPECIFIC LIVING PORTRAIT ------------ */
/* --- MODULE PORTRAIT ONLY (Safe Zone) --- */
.mod-portrait-living-frame {
  width: 210px !important;
  /* Slightly larger to bypass YouTube's 'Small Player' block */
  height: 210px !important;
  position: relative;
  border: 4px solid #FFD700;
  border-radius: 50%;
  background: #000;
  overflow: hidden;
  margin: 0 auto;
}
.mod-portrait-video-mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.mod-portrait-video-mask iframe {
  position: absolute;
  top: 50% !important;
  left: 50% !important;
  width: 320% !important;
  /* Zooms the 'Short' to fill the gold circle */
  height: 100% !important;
  transform: translate(-50%, -50%) !important;
}
/* --- MODULE FOR PAGES CIRCULAR MENU --- */
/* --- GLOBAL IMAGE-BASED CIRCULAR MENU --- */
.global-soul-nav-wrapper {
  width: 100%;
  display: flex !important;
  justify-content: center !important;
  /* Centers the whole menu */
  padding: 20px 0 !important;
}
.global-soul-menu-row {
  display: flex !important;
  flex-direction: row !important;
  /* Forces them into a line */
  flex-wrap: wrap;
  /* Allows them to drop to a second line on small phones */
  justify-content: center;
  gap: 20px;
  /* This is the space between the circles */
  margin: 0 auto;
}
.global-soul-item {
  width: 120px;
  /* Adjust this to change the size of the circles */
  height: 120px;
  border-radius: 50%;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none !important;
  box-shadow: none !important;
  background: none !important;
}
.global-soul-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border: none !important;
}
/*# sourceMappingURL=custom_35.css.map */