/* 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";
.items-row {
  border: 1px solid #e0e0e0;
  /* Adds a light grey border */
  border-radius: 8px;
  /* Rounds the corners */
  padding: 15px;
  /* Creates space between the content and the border */
  margin-bottom: 30px;
  /* Adds space between each boxed item */
  background-color: #ffffff;
  /* Sets a white background inside the box (optional) */
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  /* Adds a subtle shadow (optional) */
}
.platform-content {
  border: 1px solid #e0e0e0;
  /* Adds a light grey border */
  border-radius: 8px;
  /* Rounds the corners */
  padding: 15px;
  /* Creates space between the content and the border */
  margin-bottom: 30px;
  /* Adds space between each boxed item */
  background-color: #ffffff;
  /* Sets a white background inside the box (optional) */
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  /* Adds a subtle shadow (optional) */
}
/* Horizontal Menu Styling for .horz_menu */
.horz_menu {
  list-style: none;
  /* Removes default bullet points */
  margin: 0;
  padding: 0;
  /* Removes default padding from the ul */
  display: flex !important;
  /* Forces the UL to lay out its children horizontally */
  flex-wrap: wrap;
  /* Allows items to wrap if space runs out */
  justify-content: center;
  /* Centers the menu items horizontally (optional) */
  align-items: flex-start !important;
  /* IMPORTANT: Align items to the TOP, not center, to prevent baseline issues */
  width: 100%;
  /* Ensure the flex container takes full width */
  line-height: 1.2 !important;
  /* Ensure consistent line-height for the entire menu context */
}
.horz_menu li {
  margin: 0;
  /* Resetting margins here to control spacing via padding/separator */
  padding: 0;
  border: none !important;
  border-bottom: none !important;
  display: flex;
  /* Keep this to align the link and separator inside the LI */
  align-items: flex-start !important;
  /* Force alignment to the TOP within each LI */
  vertical-align: top !important;
  /* Also for li itself, not just its content */
  width: auto !important;
  /* Prevent 100% width override */
  flex-basis: auto !important;
  /* Prevent flex-basis from forcing full width */
  flex-shrink: 0;
  /* Prevent items from shrinking too much */
  flex-grow: 0;
  /* Prevent items from growing to fill space */
}
.horz_menu li a {
  display: block;
  /* Makes the entire link area clickable */
  padding: 8px 10px;
  /* Adjusted padding (reduce further if needed) */
  text-decoration: none;
  /* Removes underline from links */
  color: #ffffff;
  /* White text for visibility */
  background-color: #333333;
  /* Dark background for the "buttons" */
  border-radius: 5px;
  /* Slightly rounded corners for the "buttons" */
  white-space: nowrap;
  /* Keep text on single line */
  transition: all 0.3s ease;
  /* Smooth transition for hover effects */
  border: none !important;
  /* Ensure no borders on links */
  line-height: inherit !important;
  /* Inherit line-height from parent (UL) */
  margin: 0 !important;
  /* Ensure no top/bottom margins */
  vertical-align: top !important;
  /* Final vertical alignment for the link content */
}
.horz_menu li a:hover {
  background-color: #007bff;
  color: #ffffff;
  text-decoration: none;
}
/* Add vertical separator between list items */
.horz_menu li:not(:last-child)::after {
  content: "|";
  /* The separator character */
  color: #cccccc;
  /* Color of the separator */
  margin: 0 5px !important;
  /* Adjusted margin for separator (reduce further if needed) */
  font-size: 1.2em;
  /* Adjust size if needed */
  line-height: 1 !important;
  /* Explicit line-height for separator */
  /* *** THIS IS THE KEY CHANGE for pixel nudging *** */
  position: relative;
  /* Allows 'top' property to work */
  top: 7px;
  /* Experiment with 1px, 2px, 3px etc. to move it down */
  vertical-align: baseline !important;
  /* Reset vertical-align, let 'top' take over */
}
/* Specific adjustment for the last item - likely unnecessary now, but kept as a safeguard */
.horz_menu li:last-child {
  margin-right: 0 !important;
}
/* Target the specific block ID and the class within it */
#blackbarBB-prop .platform-content {
  background-color: #312F38;
  /* Or any color you want */
  border: none;
}
.mod_googleSearch_cse {
  /* --- Your existing styles --- */
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  /* --- New styles to add --- */
  background-color: #f2f2f2;
  /* A nice light grey color */
  padding-top: 5px;
  /* Adds 5px of space inside the top of the container */
  margin-top: 15px;
  /* Adds 15px space above the element */
  margin-bottom: 15px;
  /* Adds 15px space below the element */
  border-radius: 15px;
  /* Sets the corner radius to 15px */
  border: 1px solid transparent;
  /* Creates an invisible border */
}
/* New style for the button inside the DIV */
.mod_googleSearch_cse button, .mod_googleSearch_cse input[type="submit"] {
  /* Reduced padding */
  padding: 0.75rem 1.6rem !important;
}
/* Override all forms on the site */
form {
  margin: 0 0 0 !important;
}
/* --- HOMEPAGE SLIDER OVERRIDE (using the custom Block ID) --- */
/* This rule targets the unique ID you just created */
#homepage-slider-block .platform-content {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
/* =================================================================== */
/* === LATEST VIDEOS ITEM STYLING (DEFINITIVE FINAL FIX) === */
/* =================================================================== */
/* --- 1. Main Container (RESTORING FLEXBOX) --- */
.customnoblock.mainvideo.rt-largetitle {
  display: flex;
  /* FIX: Re-enables horizontal layout */
  flex-wrap: wrap;
  gap: 1.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}
/* --- 2. Main Video "Card" Styling (FINAL CENTERING) --- */
.customnoblock.mainvideo.rt-largetitle > div {
  /* Horizontal Layout Properties (Must be kept for 3-column layout) */
  flex: 1 1 30%;
  min-width: 250px;
  /* FIX: Center the content inside the responsive card */
  align-items: center;
  /* This centers the content (video, text block) horizontally */
  background: #ffffff;
  border: none !important;
  box-shadow: none !important;
  border-radius: 8px !important;
  padding: 0 !important;
  display: flex;
  flex-direction: column;
}
/* --- 3. Image and Hover Container (Width is controlled by pixels, not flex) --- */
.customnoblock.mainvideo.rt-largetitle .rt-image {
  position: relative;
  overflow: hidden;
  /* FIX: Force container to image size (215x147) and add border-radius */
  width: 215px !important;
  height: 147px !important;
  border-radius: 8px !important;
  /* Ensure the image doesn't stretch the container */
  max-width: 100%;
  /* Other styling cleanup */
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
/* FIX: Apply border-radius directly to the <img> element for reliability */
.customnoblock.mainvideo.rt-largetitle .rt-image img {
  border-radius: 8px !important;
}
/* --- 4. The Hover Bar (No changes—this should now be correct) --- */
.customnoblock.mainvideo.rt-largetitle .image-description {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: auto;
  background: rgba(14, 116, 184, 0.9);
  color: white;
  font-weight: bold;
  text-align: left;
  padding: 0.5rem 1rem;
  box-sizing: border-box;
  font-size: 0.9rem;
  line-height: 1.2;
  opacity: 0;
  transform: translateY(100%);
  transition: opacity 0.3s ease, transform 0.3s ease;
}
/* --- 5. The "+" Symbol (No changes) --- */
.customnoblock.mainvideo.rt-largetitle .corner-symbol {
  position: absolute;
  right: 10px;
  bottom: 0px;
  top: auto !important;
  color: white;
  font-size: 1.5rem;
  font-weight: normal;
  opacity: 0;
  transition: opacity 0.3s ease;
}
/* --- 6. The Hover Trigger (No changes) --- */
.customnoblock.mainvideo.rt-largetitle .rt-image:hover .image-description, .customnoblock.mainvideo.rt-largetitle .rt-image:hover .corner-symbol {
  opacity: 1;
  transform: translateY(0);
}
/* --- 7. Text Styling Below the Image (FINAL SPACING) --- */
.customnoblock.mainvideo.rt-largetitle .rt-center {
  /* FIX: Reduce top padding for tighter vertical spacing */
  padding: 5px 1rem 1rem;
  flex-grow: 1;
  text-align: center;
  /* FIX: Center the text */
}
.customnoblock.mainvideo.rt-largetitle .rt-center h3 {
  margin-top: 0 !important;
}
.customnoblock.mainvideo.rt-largetitle .rt-center h3 a {
  font-size: 0.85rem;
  line-height: 1.3;
  font-weight: bold;
  color: #0e74b8;
  text-decoration: none;
}
.customnoblock.mainvideo.rt-largetitle .rt-center p {
  font-size: 0.9rem;
  color: #555;
  /* FIX: Remove default top margin to pull text closer to the link */
  margin-top: 0 !important;
}
/* FIX: Hide the floating spacer element that causes a gap */
.customnoblock.mainvideo.rt-largetitle .clear {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}
/*# sourceMappingURL=custom_32.css.map */