@charset "UTF-8";

/* ICOMOON STYLES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@font-face {
  font-family: "icomoon";
  src: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/123941/icomoon_copy.eot");
  src: url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/123941/icomoon_copy.eot") format("embedded-opentype"), url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/123941/icomoon_copy.woff") format("woff"), url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/123941/icomoon_copy.ttf") format("truetype"), url("https://s3-us-west-2.amazonaws.com/s.cdpn.io/123941/icomoon_copy.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^=icon-],
[class*=" icon-"] {
  font-family: "icomoon";
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  position: absolute;
  top: 50%;
  transition: all 0.3s ease;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

[class^=icon-]:not(.icon-play),
[class*=" icon-"]:not(.icon-play) {
  margin-top: -6.5px;
  right: 0;
}

.icon-play:before {
  content: "";
}

.icon-circle-right:before {
  content: "";
}

/* GENERAL STYLES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
body {
  background: lightgray;
}

body,
h3 {
  color: white;
}

p {
  font-size: 0.9em;
}

h3 {
  text-transform: uppercase;
  font-size: 1em;
  padding: 0.5em 0;
  margin: 0.5em 0;
}

#LogoSSPBCS-Desktop-Text {
  background-color: transparent !important;
}

img {
  margin-bottom: 20px;
  max-width: 100%;
  height: auto;
  border-radius: 5px;
}

/* MEGA MENU POSITIONING STYLES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.top-bar-section .has-dropdown {
  position: static;
}

.top-bar-section .has-dropdown a {
  position: relative;
}

.top-bar-section .has-dropdown.moved {
  position: static;
}

.top-bar-section .has-dropdown.moved>a:after {
  display: block;
}

/* DROPDOWN GENERAL STYLES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.top-bar .top-bar-section .has-dropdown .m-menu {
  border-top: 1px solid #4E4E4E;
}

.top-bar .top-bar-section .has-dropdown .m-menu a {
  display: block;

  transition: opacity 0.3s ease;
}

.top-bar .top-bar-section .has-dropdown .m-menu a:hover {
  opacity: 1;
}

/* TOP LINKS INSIDE DROPDOWN STYLES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.column li:not(:first-child) a {
  border-top: 1px solid #262626;
}

.column li:not(:last-child) a {
  border-bottom: 1px solid #4E4E4E;
}

.column li a:hover i {
  right: 3px;
}

/* BOTTOM LINKS INSIDE FIRST DROPDOWN STYLES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.intro .icon-play {
  position: absolute;
  color: rgba(0, 0, 0, 0.4);
  font-size: 2.5em;
  left: 50%;
  transform: translate(-50%, -50%);
  transition: color 0.3s ease;
}

.intro:hover .icon-play {
  color: rgba(0, 0, 0, 0.7);
}

/* TARGET DIV INSIDE SECOND DROPDOWN STYLES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.column>img {
  margin: 1em 0;
}

.info-wrap h3 {
  width: 50%;
  padding-bottom: 5px;
  border-bottom: 1px solid #4E4E4E;
}

.info {
  display: none;
}

.info-visible {
  display: block;
}

.dt {
  margin-top: 50px;
  text-align: center;
  font-size: 2em;
  padding: 0 20px;
}

.p {
  color: black;
  text-align: center;
  position: fixed;
  bottom: 0;
  width: 100%;
}

/* TEMPLATEPRINCIPAL */
.contain-to-grid {
  width: 100%;
  background: #9f2241 !important;
}

.top-bar-section ul li {
  background: #9f2241 !important;
}

.top-bar-section ul li a.parent-link {
  text-align: center !important;
  font-weight: bold !important;
  text-transform: uppercase !important;
}

.top-bar .top-bar-section ul li:hover:not(.has-form)>a {
  background: #870327 !important
}

.top-bar .top-bar-section ul.m-menu .row i.icon-circle-right {
  right: 10px !important;
}

.top-bar .top-bar-section ul.m-menu .row {
  margin: 0px !important;
  /* background-color: #9f2241 !important;
    max-width: none; */
}

.top-bar .top-bar-section .has-dropdown .m-menu h3 {
  color: #fff !important;
  text-transform: uppercase;
  font-size: 1em;
  padding: 0.5em 0;
  margin: 0.5em 0;
}

.contain-to-grid .top-bar,
.top-bar .top-bar-section .has-dropdown,
.top-bar .top-bar-section .has-dropdown .m-menu li {
  height: auto;
  background-color: #9f2241 !important;
}

.name {
  /* background-color: #9f2241 !important; */
}

.top-bar.expanded .toggle-topbar a {
  /* color: #ffffff; */
}

li:hover {
  /* background-color: #7c1a34;  */
}

.m-menu a {
  /* display: block;
    opacity: .8; 
    transition: opacity 0.3s ease; */
}


/* MENÚ EN DIFERENTES RESOLUCIONES */
/* Ocultar en pantallas mayores a 768px (modo escritorio) */
@media (min-width: 769px) {
  .title-area .name {
    display: none;
  }

  #LogoSSPBCS-Desktop {
    display: inline;
  }


  /* Center all header content on desktop */
  .navbar {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
  }
}


/* Mostrar en móviles (pantallas menores o iguales a 768px) */
@media (max-width: 768px) {
  .title-area {
    display: block !important;
    /* Force block display */
    visibility: visible !important;
    /* Force visibility */
    text-align: center;
    position: relative;
    width: 100%;
    margin: 0 auto !important;
    /* Ensure centering */
    max-width: 100%;
    /* Or specific width if needed */
  }

  .top-bar.expanded .title-area {
    background: #9f2241 !important;

  }

  /* Center the name/logo container */
  .title-area .name {
    display: inline-block !important;
    /* Force display */
    float: none;
    margin: 0;
    height: 45px;
    /* Ensures vertical alignment matches logo height */
  }

  /* Ensure the toggle button stays to the right */
  .title-area .toggle-topbar {
    display: block !important;
    /* Force show on mobile */
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9999 !important;
    /* Ensure it's absolutely on top of everything */
  }

  /* Style the menu button text explicitly */
  .title-area .toggle-topbar a {
    color: #fff !important;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 0.9rem;
    padding: 0 15px;
    /* Give it some hit area */
    display: inline-block;
  }

  /* Ensure the span inside is visible and styled */
  .title-area .toggle-topbar a span {
    display: inline-block;
  }

  .title-area .name img {
    margin: 0 !important;
    /* Remove any default margins that might offset centering */
    vertical-align: middle;
  }

  /* Force flex-column to stack items vertically */
  .navbar {
    display: flex !important;
    flex-direction: column !important;
    padding: 0 !important;
    min-height: auto !important;
  }

  /* Show the desktop logo container block */
  /* Hide the desktop logo container block on mobile */
  #LogoSSPBCS-Desktop {
    display: none !important;
  }

  /* Show the menu bar block below */
  #menuMovilResponsivo {
    display: block !important;
    width: 100%;
  }

  /* Completely hide the center tag container on mobile to avoid empty space */
  .contain-to-grid center {
    display: none !important;
  }

  /* Force menu section to be hidden by default on mobile unless expanded */
  .top-bar .top-bar-section {
    display: none;
  }

  /* When expanded, show it */
  .top-bar.expanded .top-bar-section {
    display: block;
    margin-top: 10px;
    /* Adjust spacing as needed */
  }
}

@media only screen and (min-width: 40.063em) {

  .top-bar .top-bar-section>ul>.divider,
  .top-bar .top-bar-section>ul>[role="separator"] {
    border-bottom: none;
    border-top: none;
    border-right: solid 1px #ffffff;
    /*
    clear: none;
    height: 2.8125rem;
    width: 0; */
  }

  .top-bar .top-bar-section>ul>li:not(.has-form)>a:not(.button) {
    padding: 0 0.9375rem;
    line-height: 2.8125rem;
    background: #9f2241 !important;
  }

  .top-bar .top-bar-section ul.m-menu li:not(.has-form):not(.active)>a:not(.button) {
    color: #FFFFFF !important;
    background: #870327 !important;
    opacity: 0.8 !important;
  }

  .top-bar .top-bar-section ul.m-menu li:not(.has-form):not(.active):hover>a:not(.button) {
    opacity: 1.0 !important;
  }

  .top-bar .top-bar-section>ul>li:not(.has-form)>a:not(.button) {
    padding: 0 0.9375rem;
    line-height: 2.8125rem;
    background: #9f2241 !important;
  }

  /* Center the menu container in desktop mode */
  .top-bar .top-bar-section {
    text-align: center !important;
  }

  /* Make the main UL inline-block so it can be centered, overriding float:left */
  .top-bar .top-bar-section>ul {
    float: none !important;
    display: inline-block !important;
    text-align: left;
    /* Reset text align for menu items if needed */
  }
}

.top-bar.expanded {
  margin-top: 10px !important;
}

.top-bar {
  margin-top: 35px !important;
  background: #9f2241 !important;
}