/* ADD YOUR CUSTOM CSS HERE */
/*.emultlist_layout_contant .emultlist_listing_image img {
  object-fit: fill !important;
}
.sesbasic_dashboard_content {
  overflow: visible !important;
} VS650**/

/** CUSTOM COD **/
body {
    background-color:#fff !important;
}
h3 {
   font-weight: 600 !important;
}
a:link {
    color: #191919 !important;
}
.sesatoz_features_wrapper > h3 {
  font-size: 40px !important;
  font-weight: 800 !important;
}
.sesatoz_features_wrapper > p, .sesatoz_feature_item_cont h3 {
  font-size: 18px !important;
}
.header_logo a img {
  max-height: 65px !important;
}
.sesatoz_feature_item_main .sesatoz_feature_item:nth-child(6n+1), .sesatoz_feature_item_main .sesatoz_feature_item:nth-child(6n+2), .sesatoz_feature_item_main .sesatoz_feature_item:nth-child(6n+3), .sesatoz_feature_item_main .sesatoz_feature_item:nth-child(6n+4), .sesatoz_feature_item_main .sesatoz_feature_item:nth-child(6n+5), .sesatoz_feature_item_main .sesatoz_feature_item:nth-child(6n+6) {
  margin-left: 0 !important;
}
.sesatoz_main_menu > ul > li > a span {
  color: #fff !important;
  font-weight: 400;
}
#global_page_estore-profile-index .tabs_alt > ul > li.tab_open .tab_pulldown_contents_wrapper {
  margin-top: 5px !important;
  position: relative !important;
}
.popup_visible #sesbasic_popup_slide {
  background-color: #fff !important;
}
.sesbasic_tooltip_content {
  background-color: #fff !important;
}
.advance_header_main .layout_core_menu_mini #core_menu_mini_menu > ul > li a.show_icons span._linktxt {
  color: #fff !important;
}
.advance_header_main .layout_core_menu_mini #core_menu_mini_menu > ul > li > .core_mini_auth span {
   color: #000 !important;
}
.header_fixed_scroll .header_background_opacity {
  opacity: 1 !important;
}
ul.form-errors > li {
  width: 100%;
}
ul.form-errors > li:before {
  float: left;
}
.header_fixed_outside .layout_page_header {
  background-color: #f2c643;
}
.sesatoz_content_inner, .sesatoz_content_carousel .slick-list, div.sesatoz_highlights_cont.clearfix {
  max-width: 1300px !important;
  margin: auto;
}
.sesatoz_highlights_wrapper {
  padding: 50px 0 50px !important;
}
.app_second_left > h3, .app_second_left > h5, html .header_searchbox_selectbox .exp_select span {
    color: #fff !important;
}
.app_second_left > h5 {
  font-size: 18px !important;
  line-height: 24px !important;
  margin-right: 30px !important;
}
.app_second_left .support {
  padding: 15px !important;
  background-color: #fff !important;
  width: 26%;
  display: flex;
  border-radius: 50px;
  color: #191919 !important;
}
.app_second_left .support a {
  text-transform: uppercase;
  font-weight: 600;
  margin: 0 10px;
}
.app_second_left > .mobile-friendly {
  font-size: 14px !important;
  font-weight: 500;
}
.header_one .sesadvheader_main_menu > ul > li > a > span {
  text-transform: uppercase;
  color: #fff;
  font-weight: 600;
}
.sesatoz_features_three_item ._icon, .sesatoz_features_three_item ._icon img {
  height: 300px !important;
  width: 300px !important;
}
.sesalbum_cover_user_options_drop_btn .sesalbum_option_box {
  background-color: #f9f9f9;
} 
.layout_core_menu_mini #core_menu_mini_menu > ul > li a.show_icons i {
  color:#fff !important;
}
.layout_core_menu_mini #core_menu_mini_menu > ul > li a.show_icons {
    background: #545454 !important;
}
.layout_core_menu_mini #core_menu_mini_menu > ul > li a:hover.show_icons {
    background:#FFC107 !important;
}

/* ============================================================
 * TRM7 - SE 7.8.0 upgrade: rules that were absent from the new
 * theme.css/styles.css but were rendered by the 6.5.2 stack.
 * Restoring them here in sesatoz-custom.css since this file is
 * loaded last and won't be touched by future SES module updates.
 * ============================================================ */

/* --- 1. Hide the mobile nav drawer + hamburger toggle on desktop ----------
 *
 * The Sesatoz menu-main widget renders BOTH the mobile nav (#atoz_mobile_nav)
 * AND the desktop nav (.sesatoz_main_menu). Without these rules the mobile
 * drawer renders as a stacked column over the page on desktop.
 *
 * TRM7 v2: bumped specificity by adding #atoz_mobile_nav id selector and
 * !important since the previous .sesatoz_mobile_nav rule was being beaten
 * by a more-specific rule elsewhere in the cascade. The id selector + class
 * compound is high enough that no theme/module rule will override it.
 */
#atoz_mobile_nav.sesatoz_mobile_nav,
.sesatoz_mobile_nav#atoz_mobile_nav {
  display: none !important;
}
.atoz_mobile_nav_toggle {
  display: none !important;
}
@media (max-width: 767px) {
  .atoz_mobile_nav_toggle {
    display: inline-block !important;
  }
  /* Hide desktop nav on mobile - it's the .sesatoz_main_menu WITHOUT the
     #atoz_mobile_nav id (CSS can't easily express "hasn't this id" but we
     can express "isn't the mobile drawer" with :not). */
  .header_main_menu .sesatoz_main_menu:not(#atoz_mobile_nav) {
    display: none !important;
  }
  #atoz_mobile_nav.sesatoz_mobile_nav,
  .sesatoz_mobile_nav#atoz_mobile_nav {
    display: block !important;
    position: fixed;
    top: 0 !important;  /* override the inline style="top: 0px" set by widget JS */
    left: -100%;
    width: 280px;
    max-width: 80vw;
    height: 100vh;
    background: var(--theme-header-background-color, #fff);
    overflow-y: auto;
    z-index: 9998;
    transition: left .25s ease;
    box-shadow: 2px 0 8px rgba(0, 0, 0, .15);
  }
  #atoz_mobile_nav.sesatoz_mobile_nav.show-nav {
    left: 0;
  }
  #atoz_mobile_nav .navigation > li > a {
    display: block;
    padding: 12px 16px;
    color: var(--theme-header-menu-link-color, inherit);
    border-bottom: 1px solid rgba(0, 0, 0, .06);
  }
}

/* --- 2. Yellow underline accent below section headings -------------------
 *
 * The horizontal yellow "----" with center dot beneath section headings.
 */
.sesatoz_features_wrapper > h3:after,
.sesatoz_highlights_wrapper > h3:after,
.sesatoz_content_carousel_wrapper > h3:after,
.sesatoz_content_wrapper > h3:after,
.sesatoz_group_wrapper > h3:after,
.sesatoz_video_wrapper > h3:after,
.sesatoz_pages_carousel_wrapper > h3:after,
.atoz_member_block_heading h2:after,
.sesatoz_features_two_wrapper > h3:after,
.sesatoz_features_three_wrapper > h3:after,
.sesatoz_static_buttons_inner > h3:after,
.sesatoz_ongoing_contest_inner > h3:after,
#global_page_core-index-index #global_content .layout_middle .generic_layout_container > h3:after {
  content: "";
  display: block;
  width: 70px;
  height: 3px;
  background: var(--theme-color, var(--sesatoz-theme-color, #f2c643));
  margin: 8px auto 0;
  position: relative;
}

.sesatoz_features_wrapper > h3:before,
.sesatoz_highlights_wrapper > h3:before,
.sesatoz_content_carousel_wrapper > h3:before,
.sesatoz_content_wrapper > h3:before,
.sesatoz_group_wrapper > h3:before,
.sesatoz_video_wrapper > h3:before,
.sesatoz_pages_carousel_wrapper > h3:before,
.atoz_member_block_heading h2:before,
.sesatoz_features_two_wrapper > h3:before,
.sesatoz_features_three_wrapper > h3:before,
.sesatoz_static_buttons_inner > h3:before,
.sesatoz_ongoing_contest_inner > h3:before,
#global_page_core-index-index #global_content .layout_middle .generic_layout_container > h3:before {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--theme-color, var(--sesatoz-theme-color, #f2c643));
  position: absolute;
  left: 50%;
  margin-left: -4px;
  margin-top: 0;
  bottom: -3px;
  z-index: 2;
}
.sesatoz_features_wrapper > h3,
.sesatoz_highlights_wrapper > h3,
.sesatoz_content_carousel_wrapper > h3,
.sesatoz_content_wrapper > h3,
.sesatoz_group_wrapper > h3,
.sesatoz_video_wrapper > h3,
.sesatoz_pages_carousel_wrapper > h3,
.atoz_member_block_heading h2,
.sesatoz_features_two_wrapper > h3,
.sesatoz_features_three_wrapper > h3,
.sesatoz_static_buttons_inner > h3,
.sesatoz_ongoing_contest_inner > h3 {
  text-align: center;
  position: relative;
  padding-bottom: 16px;
}

/* --- 3. Footer "EXPLORE" yellow triangle bullet points ---------------------
 *
 * TRM7 v2: scoped to the actual emitted markup which is
 * .footer_menu_links .footer_main_links ul > li - more specific than the
 * earlier rule, and removes the conflict where the bullet was rendering
 * twice / overlapping text.
 */
#global_footer .footer_menu_links .footer_main_links ul > li,
.layout_sesatoz_footer .footer_menu_links .footer_main_links ul > li {
  list-style: none !important;
  padding-left: 14px;
  position: relative;
  margin-bottom: 6px;
}
#global_footer .footer_menu_links .footer_main_links ul > li:before,
.layout_sesatoz_footer .footer_menu_links .footer_main_links ul > li:before {
  content: "\f0da";  /* Font Awesome caret-right */
  font-family: "Font Awesome 6 Free", "FontAwesome";
  font-weight: 900;
  color: var(--theme-color, var(--sesatoz-theme-color, #f2c643));
  position: absolute;
  left: 0;
  top: 1px;
  font-size: 12px;
}
/* Some SE versions emit a CSS bullet ::marker - kill it so we don't double-bullet */
#global_footer .footer_menu_links .footer_main_links ul > li::marker,
.layout_sesatoz_footer .footer_menu_links .footer_main_links ul > li::marker {
  content: "";
}

/* Section headers get a yellow underline accent. */
.sesatoz_footer_inner > ul > li > h4,
#global_footer .footer_menu_links > h4,
#global_footer .footer_social_links > h4,
.layout_sesatoz_footer h4 {
  position: relative;
  display: inline-block;
  padding-bottom: 6px;
  margin-bottom: 16px;
}
.sesatoz_footer_inner > ul > li > h4:after,
#global_footer .footer_menu_links > h4:after,
#global_footer .footer_social_links > h4:after,
.layout_sesatoz_footer h4:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 30px;
  height: 2px;
  background: var(--theme-color, var(--sesatoz-theme-color, #f2c643));
}

/* --- 4. Footer social icons - yellow circular backgrounds ----------------- */
.footer_social_links a,
#global_footer .footer_social_links a,
.layout_sesatoz_footer .footer_social_links a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--theme-color, var(--sesatoz-theme-color, #f2c643));
  color: #fff;
  margin-right: 8px;
  transition: opacity .15s;
  text-decoration: none;
}
.footer_social_links a:hover,
#global_footer .footer_social_links a:hover {
  opacity: .85;
  color: #fff;
}
.footer_social_links a i,
#global_footer .footer_social_links a i {
  color: #fff;
  font-size: 14px;
}

/* --- 5. Static-buttons widget filled-yellow style ------------------------- */
/*.sesatoz_static_buttons .button,
.layout_sesatoz_static_buttons .sesatoz_static_buttons a.button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 15px 30px;
  background: var(--theme-color, var(--sesatoz-theme-color, #f2c643));
  color: var(--theme-button-font-color, #000);
  font-weight: 600;
  text-decoration: none;
  border-radius: 4px;
  transition: opacity .15s, transform .15s;
  margin: 0 8px;
}*/
.sesatoz_static_buttons .button:hover,
.layout_sesatoz_static_buttons .sesatoz_static_buttons a.button:hover {
  /* TRM7 - orig site goes yellow -> dark on hover with text going dark -> white.
     Drive both via --theme-button-background-color-hover (defined as #000 in
     theme-variables.css) and --theme-button-font-color-hover (#fff). */
  background: var(--theme-button-background-color-hover, #000);
  color: var(--theme-button-font-color-hover, #fff);
  text-decoration: none;
}
.sesatoz_static_buttons .button i {
  margin-right: 0;
}

/* --- 6. Member cloud yellow polaroid frames (Connect With COD Members) ---
 *
 * Each <a> in .atoz_member_block_members has its <img> shifted by
 * transform: translate(-12px, -12px). The yellow polaroid border is
 * actually the parent <a>'s background showing through where the image
 * has shifted off. Set background + position to make the frame visible.
 */
/*.atoz_member_block_members > a {
  background: var(--theme-color, var(--sesatoz-theme-color, #f2c643)) !important;
  border-radius: 4px;
  overflow: visible;
  display: inline-block;
}TRM-IN THEME.CSS*/
.atoz_member_block_members > a > img {
  border-radius: 2px;
  box-shadow: 2px 2px 6px rgba(0, 0, 0, .15);
}

/* --- 7. Header Login + Sign Up filled yellow buttons ----------------------
 *
 * The .core_mini_auth (Login) and .core_mini_signup (Sign Up) links in the
 * header should render as filled yellow buttons with dark text. Currently
 * rendering as plain underlined text.
 */
.layout_core_menu_mini #core_menu_mini_menu > ul > li > a.core_mini_auth,
.layout_core_menu_mini #core_menu_mini_menu > ul > li > a.core_mini_signup,
#core_menu_mini_menu > ul > li > a.core_mini_auth,
#core_menu_mini_menu > ul > li > a.core_mini_signup {
  background: var(--theme-color, var(--sesatoz-theme-color, #f2c643)) !important;
  color: #000 !important;
  border-radius: 4px !important;
  padding: 8px 16px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  text-transform: none;
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  border: 0 !important;
  margin-left: 6px;
  width: auto !important;
  height: auto !important;
}
.layout_core_menu_mini #core_menu_mini_menu > ul > li > a.core_mini_auth span,
.layout_core_menu_mini #core_menu_mini_menu > ul > li > a.core_mini_signup span,
#core_menu_mini_menu > ul > li > a.core_mini_auth span,
#core_menu_mini_menu > ul > li > a.core_mini_signup span {
  color: #000 !important;
  font-weight: 600 !important;
}
.layout_core_menu_mini #core_menu_mini_menu > ul > li > a.core_mini_auth i,
.layout_core_menu_mini #core_menu_mini_menu > ul > li > a.core_mini_signup i,
#core_menu_mini_menu > ul > li > a.core_mini_auth i,
#core_menu_mini_menu > ul > li > a.core_mini_signup i {
  color: #000 !important;
}
.layout_core_menu_mini #core_menu_mini_menu > ul > li > a.core_mini_auth:hover,
.layout_core_menu_mini #core_menu_mini_menu > ul > li > a.core_mini_signup:hover,
#core_menu_mini_menu > ul > li > a.core_mini_auth:hover,
#core_menu_mini_menu > ul > li > a.core_mini_signup:hover {
  opacity: .9;
}

/* --- 8. Card title yellow underline (Events / Blogs / Albums grids) -------
 *
 * Each card with an image + title (Forever Young, All White Affair, MEDays,
 * etc.) has a yellow underline beneath its title text. Implemented as an
 * :after on the h3 inside the card body.
 */
.sesatoz_content_item h3,
.sesatoz_highlights_item h3,
.sesatoz_content_item_inner h3,
.sesatoz_highlights_item_inner h3 {
  position: relative;
  display: inline-block;
  padding-bottom: 4px;
}
.sesatoz_content_item h3:after,
.sesatoz_highlights_item h3:after,
.sesatoz_content_item_inner h3:after,
.sesatoz_highlights_item_inner h3:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 3px;
  background: var(--theme-color, var(--sesatoz-theme-color, #f2c643));
}

/* ============================================================
 * END TRM7 7.8.0 upgrade rules
 * ============================================================ */

/* ========= WHAT I ADDED THAT SHOULD BE IN STYLES.CSS OF MODULE ========== */
.header_transparency .layout_sesatoz_header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 11;
}
.header_top {
    background:transparent !important;
}

.header_transparency .header_top, .header_transparency .sesmenu_main_menu, .header_transparency .sesatoz_main_menu > ul > li > a {
  background: none !important;
}

.header_transparency .layout_sesatoz_header .header_main_menu {
  background: rgba(0, 0, 0, 0.48) !important;
  margin-top: 75px;
}
/* TRM - ADDED FOR LOGIN AND SIGN UP PAGES */
div#sesatoz_main_menu.header_main_menu.clearfix {
    background: rgba(0, 0, 0, 0.48) !important;
}
.user_auth_link.menu_core_mini.core_mini_auth.show_icons {
    border: 1px solid #000 !important;
}
span._linktxt, i.minimenu_icon.fa-sign-in-alt:before {
    color: #090909 !important;
}
/* END TRM */

.header_transparency .layout_sesatoz_header .sesatoz_main_menu > ul > li > a::before {
  height: 40%;
  width: 1px;
  left: auto;
  right: 0;
  opacity: .5;
  top: 17px;
  background: #fff;
}

/* SECOND ROUND OF CSS ADDED */
.sesatoz_features_wrapper {
  padding: 50px 0;
  width: 100%;
}
.sesatoz_features_wrapper > h3,
.sesatoz_highlights_wrapper > h3,
.sesatoz_content_carousel_wrapper > h3,
.sesatoz_content_wrapper > h3,
.sesatoz_group_wrapper > h3,
.sesatoz_video_wrapper > h3,
.sesatoz_pages_carousel_wrapper > h3,
.atoz_member_block_heading h2,
.sesatoz_features_two_wrapper > h3,
.sesatoz_features_three_wrapper > h3,
.sesatoz_static_buttons_inner > h3,
.sesatoz_ongoing_contest_inner > h3,
#global_page_core-index-index #global_content .layout_middle .generic_layout_container > h3 {
  background: none;
  font-size: 30px;
  margin: 0;
  text-transform: capitalize;
  padding-bottom: 10px;
}
.sesatoz_features_wrapper > p, .sesatoz_highlights_wrapper > p, .sesatoz_content_carousel_wrapper > p, .sesatoz_content_wrapper > p, .sesatoz_group_wrapper > p, .sesatoz_video_wrapper > p, .sesatoz_pages_carousel_wrapper > p, .atoz_member_block_heading > p, .sesatoz_features_two_wrapper > p, .sesatoz_features_three_wrapper > p, .sesatoz_ongoing_contest_inner > p {
  font-size: 14px;
  margin-top: 20px;
  padding: 0 100px;
  text-align: center;
}
.sesatoz_text_light {
  color: #999;
}
.sesatoz_features_wrapper > h3 + div, .sesatoz_features_wrapper > h3 + p + div {
  margin-top: 40px;
}
.sesatoz_features_block .sesatoz_feature_inner {
  clear: both;
  overflow: hidden;
  position: relative;
  min-height: 450px;
  margin: 0 auto;
  width: 100%;
  display: flex;
  flex-wrap: nowrap;
}
.sesatoz_feature_item_cont {
  display: block;
  border-width: 1px;
  padding: 8px 10px;
  margin-left: 60px;
  margin-top: -45px;
  border-radius: 8px;
  background-color: #fff !important;
}
.sesatoz_bg {
  background-color: #FFF;
}
/*.sesatoz_features_block .sesatoz_feature_bg {
  overflow: hidden;
  text-align: center;
  margin: 0 auto;
  margin-top: 0px;
  border-radius: 100%;
  background-size: 100%;
  padding: 20px;
  width: 450px;
  height: 450px;
  position: relative;
  margin-top: 30px;
}*/
.sesatoz_features_block .sesatoz_feature_bg :before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  margin: auto;
  border-radius: 100%;
  bottom: 0;
  width: 95%;
  height: 95%;
  opacity: .4;
}
.sesatoz_features_block .sesatoz_feature_bg::before, .sesatoz_features_block .sesatoz_feature_bg::after, .sesatoz_group_cont::before, .sesatoz_pages_carousel_item_cont .pages_title::before, .sesatoz_newsletter_wrapper {
  background: #FFD11B !important;
}

.sesatoz_feature_item_cont .sesatoz_bg {
  background-color: #fff !important;
}
.sesatoz_features_block .sesatoz_feature_bg a {
  position: absolute;
  top: 40%;
  width: 100px;
  height: 100px;
  left: 0;
  right: 0;
  margin: auto;
  line-height: 100px;
  font-size: 40px;
  border-radius: 100px;
  text-align: center;
  z-index: 9;
  box-shadow: 0 0 10px #cccccc;
  background: #FFD11B !important;
}
.sesatoz_features_block .sesatoz_feature_bg ::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  margin: auto;
  border-radius: 100%;
  bottom: 0;
  width: 95%;
  height: 95%;
  opacity: 1;
}

.sesatoz_features_block .sesatoz_feature_bg a:hover {
  background: #191919;
}
.sesatoz_features_block .sesatoz_feature_bg a i {
  margin-left: 10px;
  color: #191919;
}


@media only screen and (min-width: 769px) {
  .sesatoz_feature_item:nth-child(2n+1) .sesatoz_feature_item_cont {
    text-align: left;
  }
}





/* ========= WHAT I ADDED THAT SHOULD BE IN THEME.CSS OF A TO Z THEME ========== */
.sesatoz_main_menu > ul > li > a span {
  color: #fff !important;
  font-weight: 400;
}

@media only screen and (min-width: 769px) {
  .sesatoz_main_menu > ul {
    margin: 0;
    padding: 0;
    display: table;
    width: 100%;
  }
  .sesatoz_main_menu > ul > li {
    display: table-cell;
    float: none;
    position: relative;
    overflow: visible;
  }
  .sesatoz_main_menu > ul > li.active > a {
    color: #191919;
    background: #F2C71A;
  }
  .sesatoz_main_menu > ul > li > a:link, .sesatoz_main_menu > ul > li > a:visited {
    color: #191919;
    text-decoration: #191919;
    overflow: hidden;
  }
  .sesatoz_main_menu > ul > li > a {
    user-select: none;
    outline: none;
    display: block;
    padding: 0 15px;
    line-height: 45px;
    /*font-size: 15px; TRM*/
    letter-spacing: 1px;
    font-weight: 400;
    text-transform: uppercase;
    text-align: center;
    position: relative;
  }
  .sesatoz_main_menu > ul > li > a::before, .sesatoz_main_menu > ul > li:last-child > a::after {
    content: "";
    position: absolute;
    height: 100%;
    width: 1px;
    background: #191919 !important;
    left: 0;
    opacity: .1;
  }
  .sesatoz_main_menu > ul > li > a:hover, .sesatoz_main_menu > ul > li.active > a {
    color: #191919;
  }
  .sesatoz_main_menu > ul > li > a span {
    float: left;
  }
  .sesatoz_main_menu > ul > li > a i, .sesatoz_main_menu > ul > li > a span {
    float: none !important;
    display: inline-block;
    vertical-align: middle;
    margin: 0 !important;
  }
}

/* SECOND ROUND OF CSS ADDED */
.sesatoz_bxs, .sesatoz_bxs * {
  box-sizing: border-box;
}
.layout_page_footer {
  content: "";
  background-color: rgba(0, 0, 0, 0.8) !important;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  color: #fff !important;
}
.sesatoz_footer_inner .footer_contact_info > li > i {
  color: #FFD11B !important;
}
.footer-newsletter input {
  background-color: #FFF !important;
  color: #6D6D6D !important;
}
.footer-newsletter button {
  background-color: #FFD11B !important;
  color: #191919 !important;
}
.footer_links li a, .footer_main_links ul li a {
    color: #cccccc !important;
}


/* ========= WHAT I ADDED THAT SHOULD BE IN ALL-MIN.CSS ========== */
.fa-play::before {
  content: "\f04b" !important;
}


/* --- 9. Main-menu submenu hover dropdown (desktop) -----------------------
 *
 * The Sesatoz menu-main widget renders submenus as <ul class="main_menu_submenu">
 * inside each parent <li>. Without these rules they render visible by default,
 * stacking under (or on top of) the page content. The 6.5.2 site had hide
 * default + show-on-hover rules that didn't carry over to 7.8.0.
 *
 * Default state: hidden absolute-positioned dropdown.
 * On hover: revealed below the parent menu item.
 */
.sesatoz_main_menu > ul {
  position: relative;
}
.sesatoz_main_menu > ul > li {
  position: relative;
}
/* Hide submenus by default */
.sesatoz_main_menu > ul > li > ul.main_menu_submenu,
.sesatoz_main_menu > ul > li > ul.sesatoz_toggle_sub_menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 200px;
  /*background: var(--theme-color, var(--sesatoz-theme-color, #f2c643));TRM*/
  list-style: none;
  margin: 0;
  padding: 8px 0;
  z-index: 9000;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .15);
  border-radius: 0 0 4px 4px;
}
/* Show on hover of the parent <li> */
.sesatoz_main_menu > ul > li:hover > ul.main_menu_submenu,
.sesatoz_main_menu > ul > li:hover > ul.sesatoz_toggle_sub_menu {
  display: block;
  background: rgba(0, 0, 0, 0.44) !important;
}
/* Style the items inside the dropdown */
.sesatoz_main_menu > ul > li > ul.main_menu_submenu > li,
.sesatoz_main_menu > ul > li > ul.sesatoz_toggle_sub_menu > li {
  list-style: none;
  margin: 0;
  padding: 0;
  display: block;
  width: 100%;
}
.sesatoz_main_menu > ul > li > ul.main_menu_submenu > li > a,
.sesatoz_main_menu > ul > li > ul.sesatoz_toggle_sub_menu > li > a {
  display: block;
  padding: 8px 16px;
  color: var(--theme-button-font-color, #000);
  text-decoration: none;
  white-space: nowrap;
  transition: background .15s;
}
.sesatoz_main_menu > ul > li > ul.main_menu_submenu > li > a:hover,
.sesatoz_main_menu > ul > li > ul.sesatoz_toggle_sub_menu > li > a:hover {
  background: rgba(0, 0, 0, .12);
  text-decoration: none;
}
.sesatoz_main_menu > ul > li > ul.main_menu_submenu > li > a span,
.sesatoz_main_menu > ul > li > ul.sesatoz_toggle_sub_menu > li > a span {
  color: var(--theme-button-font-color, #fff) !important;
  font-weight: 500;
}

/* Hide the JS-driven toggle-arrow icon on desktop (it's for the mobile drawer
 * collapse/expand behavior, not for the desktop hover menu). */
@media (min-width: 768px) {
  .sesatoz_main_menu > ul > li > a > i.expcoll-icon.sesatoz_menu_main {
    display: none;
  }
}

/* --- 10. (REMOVED) Play-button triangle override ---------------------------
 *
 * Earlier versions of this file included rules that hid the <i class="fa fa-play">
 * icon and drew a CSS triangle in its place. Those rules were overzealous - the
 * [class*="play_btn"] / [class*="video_play"] wildcards matched parent containers
 * around the actual play button (which uses the original FA mechanism), and the
 * visibility:hidden + :after triangle rules ended up suppressing the working
 * play icon instead of fixing it.
 *
 * The original Font Awesome icon mechanism (`.fa-play:before { content: "\f04b" }`)
 * works correctly on its own - removing the override restores it.
 */

/* --- 11. Mini-menu Login / Sign Up icon glyphs ----------------------------
 *
 * The Sesatoz menu-mini widget was updated to emit Flaticon class names
 * (fi fi-rr-sign-in-alt, fi fi-rr-user-add) but the Flaticon CSS isn't
 * loaded on this site - so the <i> elements render empty.
 *
 * Fix: emit a Font Awesome glyph via :before content on the empty <i>,
 * targeted by class. If Flaticon loads later, its glyph wins (Flaticon's
 * own :before rule has higher specificity through the .fi class).
 *
 * Glyph references (Font Awesome 6 Free):
 *   sign-in-alt   -> \f2f6 (right-to-bracket)
 *   user-add/plus -> \f234 (user-plus)
 */
.layout_core_menu_mini #core_menu_mini_menu > ul > li .core_mini_auth i.fi.fi-rr-sign-in-alt:before,
.layout_core_menu_mini #core_menu_mini_menu > ul > li .core_mini_auth i.minimenu_icon:before {
  content: "\f2f6";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  font-style: normal;
  display: inline-block;
}
.layout_core_menu_mini #core_menu_mini_menu > ul > li .core_mini_signup i.fi.fi-rr-user-add:before,
.layout_core_menu_mini #core_menu_mini_menu > ul > li .core_mini_signup i.minimenu_icon:before {
  content: "\f234";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  font-style: normal;
  display: inline-block;
}
/* Make sure the icon container is sized/aligned correctly */
.layout_core_menu_mini #core_menu_mini_menu > ul > li .core_mini_auth i,
.layout_core_menu_mini #core_menu_mini_menu > ul > li .core_mini_signup i {
  font-size: 14px;
  line-height: 1;
  color: #000;
  margin-right: 4px;
  display: inline-block !important;
  width: auto !important;
  height: auto !important;
}

/* --- 12. Main menu defensive visibility (AJAX navigation guard) -----------
 *
 * SE's AJAX navigation strips inline <style> and <script> blocks from
 * widget output. If the menu-main widget relied on JS to set the menu's
 * display state, that state can be lost after AJAX nav, leaving the menu
 * DOM intact but invisible until full page reload.
 *
 * These rules force visibility through the cascade so even if the JS that
 * normally sets display didn't run after AJAX nav, the menu still renders.
 *
 * Scoped to (min-width: 768px) so they don't fight section 1's mobile rules.
 *
 * TRM7 v3: also forces an explicit yellow background and dark text color
 * so the menu items are visible even on pages where the cascade leaves
 * the .header_main_menu background transparent. Diagnosed via DevTools:
 * on AJAX-navigated pages, the menu container had its expected dimensions
 * but text was white-on-transparent, making items invisible.
 */
@media (min-width: 768px) {
  .header_main_menu,
  .header_main_menu_container,
  .layout_sesatoz_menu_main,
  .header_main_menu .sesatoz_main_menu:not(.sesatoz_mobile_nav),
  .header_main_menu .sesatoz_main_menu:not(#atoz_mobile_nav) {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  .header_main_menu_container {
    margin: 0 auto;
    max-width: 1200px;
  }
  /* Force the brand-yellow background on the menu bar regardless of cascade.
   * Without this, on AJAX-navigated pages the menu can render on a
   * transparent (or near-page-background) bar - invisible against light
   * page content. */
  .header_main_menu,
  div.header_main_menu#sesatoz_main_menu {
    /*background: var(--theme-header-background-color, var(--sesatoz-header-background-color, #f2c643)) !important;
    min-height: 47px;TRM*/
  }
  /* Make sure the menu's <ul> renders flex/horizontal and not collapsed */
  .header_main_menu .sesatoz_main_menu:not(#atoz_mobile_nav) > ul.navigation {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
  }
  /* And each <li> stays inline */
  .header_main_menu .sesatoz_main_menu:not(#atoz_mobile_nav) > ul.navigation > li {
    display: inline-block !important;
    list-style: none;
  }
  /* Force the menu link text dark/visible regardless of what other rules
   * say about color. The earlier customization at the top of this file
   * sets `.sesatoz_main_menu > ul > li > a span { color: #fff }` which is
   * fine when the bar is on a dark hero image but invisible against the
   * yellow bar. Bump the specificity so visible text wins. */
  .header_main_menu .sesatoz_main_menu:not(#atoz_mobile_nav) > ul.navigation > li > a,
  .header_main_menu .sesatoz_main_menu:not(#atoz_mobile_nav) > ul.navigation > li > a span {
    color: #FFF !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    /*padding: 12px 16px;TRM*/
    display: inline-block;
  }
  .header_main_menu .sesatoz_main_menu:not(#atoz_mobile_nav) > ul.navigation > li > a:hover,
  .header_main_menu .sesatoz_main_menu:not(#atoz_mobile_nav) > ul.navigation > li > a:hover span {
    color: #fff !important;
  }
}

/* --- 16. Constrain minimenu_search_box width on desktop -------------------
 *
 * Diagnosed via DevTools console snippet on /networks (broken state):
 *
 *   header_top_container computed width: 1200px (display: table)
 *   Direct children of header_top_container:
 *     header_logo                       width: 150px
 *     sesatoz_header_currencydropdown   width: 6px
 *     mobile_search_toggle_btn          width: 0   (correctly hidden)
 *     minimenu_search_box               width: 672px <- TOO WIDE
 *     header_minimenu                   width: 371px (squeezed)
 *
 * The search box is consuming over half the upper row, pushing Login/Sign Up
 * into a tight strip and causing the visible overlap with the main menu row.
 *
 * Root cause: theme.css has `.minimenu_search_box { width: 100%; }` as a
 * default rule (no media query). When inside a display:table parent with
 * display:table-cell siblings, "100%" tells the cell to claim as much of
 * the table's width as possible. orig didn't have this rule on desktop -
 * the search box took its natural input-element size.
 *
 * Fix: cap the search box at a reasonable desktop width. Using auto width
 * with a max-width matches orig's behavior.
 */
@media (min-width: 992px) {
  .header_top_container > #minimenu_search_box.minimenu_search_box,
  #minimenu_search_box.minimenu_search_box {
    width: auto !important;
    max-width: 350px;
    padding-left: 20px;
  }
  .header_top_container > #minimenu_search_box .header_searchbox input[type="text"] {
    width: 200px;
  }
}

/* --- 17. Restore header_top to normal document flow ---------------------
 *
 * Diagnosed via DevTools (children of .layout_sesatoz_header):
 *
 *   header_top:        rect={top:65, height:65}, display:block, position:FIXED
 *   header_main_menu:  rect={top:65, height:52}, display:block, position:static
 *
 * .header_top is rendered with position:fixed somewhere in theme.css. That
 * takes it out of normal flow - which means it doesn't push down its
 * sibling .header_main_menu. Both end up at the same y-coordinate even
 * though they're meant to stack vertically (upper row, then menu row).
 *
 * The earlier attempt (margin-top:65px on .header_main_menu) didn't work
 * because position:fixed elements move with their reference point - when
 * the menu's margin-top pushed the parent down, header_top's "auto" top
 * position got pushed down with it, keeping them overlapping.
 *
 * Fix: override .header_top's position back to static so it stacks
 * normally as the first sibling of its parent. The menu then naturally
 * follows below it without needing any margin-top hack.
 *
 * NOTE: This rule is scoped to inner pages via body:not(.header_transparency)
 * so the homepage's existing fixed-overlay header behavior (which IS what
 * the page design intends, with translucent dark menu over hero) stays
 * intact.
 */
body:not(.header_transparency) .layout_sesatoz_header .header_top {
  position: static !important;
}

/* === Section 18: Active menu state highlight (TRM7 SE7.8) === */
/*.sesatoz_main_menu:not(.sesatoz_mobile_nav) > ul.navigation > li.active > a,
.sesatoz_main_menu:not(.sesatoz_mobile_nav) > ul.navigation > li.active:hover > a {
  background: #FFC107 !important;
  color: #000 !important;
}*/
/* === Section 18 (revised): Active menu state highlight (TRM7 SE7.8) === */
.sesatoz_main_menu:not(.sesatoz_mobile_nav) > ul.navigation > li.active {
  background: #FFC107 !important;
}
.sesatoz_main_menu:not(.sesatoz_mobile_nav) > ul.navigation > li.active > a,
.sesatoz_main_menu:not(.sesatoz_mobile_nav) > ul.navigation > li.active:hover > a {
  background: transparent !important;
  color: #000 !important;
}

/* === Section 19: Force global_wrapper flush to header (TRM7 SE7.8) === */
.sesdbslide_full_width #global_wrapper {
  margin-top: 0 !important;
}

/* === Section 20: Spread main menu items edge-to-edge (TRM7 SE7.8) === */
.sesatoz_main_menu:not(.sesatoz_mobile_nav) > ul.navigation {
  justify-content: space-between !important;
}

/* === Section 21 (revised): Login button (mini menu) — border + hover === */
.layout_core_menu_mini #core_menu_mini_menu > ul > li > a.user_auth_link.core_mini_auth,
.header_minimenu .layout_core_menu_mini #core_menu_mini_menu > ul > li > a.user_auth_link.core_mini_auth {
  border: 1px solid #FFFFFF !important;
  color: #FFFFFF !important;
}
.layout_core_menu_mini #core_menu_mini_menu > ul > li > a.user_auth_link.core_mini_auth:hover,
.header_minimenu .layout_core_menu_mini #core_menu_mini_menu > ul > li > a.user_auth_link.core_mini_auth:hover {
  background: #FFFFFF !important;
  color: #000000 !important;
  border-color: #FFFFFF !important;
}


.sesslider, .sesslider_wrapper, .layout_sesdbslide_slideshow,
.sesslider li, .sesslider_wrapper li {
  transition: opacity 1s ease !important;
}

/* === Section 23: Menu link fills cell, bar at cell edge, text centered === */
.sesatoz_main_menu:not(.sesatoz_mobile_nav) > ul.navigation > li {
  flex: 1 1 0 !important;
}
.sesatoz_main_menu:not(.sesatoz_mobile_nav) > ul.navigation > li > a {
  display: block !important;
  text-align: center !important;
  width: auto !important;
}

/* ============================================================
 * END TRM7 7.8.0 upgrade rules
 * ============================================================ */

._guestmenu .layout_core_menu_mini #core_menu_mini_menu > ul > li .core_mini_signup {
  border: 1px solid #FFD11B !important;
  background-color: #FFD11B !important;
}
.header_transparency .layout_page_header .layout_core_menu_mini #core_menu_mini_menu > ul > li .core_mini_auth {
    border: 1px solid #FFFFFF !important;
}

.dept_nine_dots {
    color: #fff !important;
}
a:hover#dept_launcher_btn.show_icons {
    color: #FFD11B;
}

.fa {
    line-height: 2.3 !important;
}
div.header_minimenu._isrounded, div.header_minimenu._isrounded._guestmenu {
    float: right;
}
div.layout_page_user_signup_index, div.layout_page_user_auth_login {
    margin-top: 140px;
}

/********** QUICKLINKS *************/
.quicklinks {
    display: flex !important;
}