/* Themify Customize Styling */
body {	background-image: none;
	background-color: #ffffff;
	font-family:Arial, Helvetica, sans-serif;
	color: #000000; 
}
#pagewrap {	
	background-color: #ffffff; 
}
#content {	width: auto; 
}
#headerwrap {	background-image: none;
	background-color: #ffffff;margin: auto; 
}
#header {	background-image: none;
	background-color: #ffffff;height: auto;margin: auto;
	font-family:Arial, Helvetica, sans-serif;	font-style:normal;
	font-weight:normal;
	text-decoration:none;
	text-transform:none;
	color: #000000; 
}
#headerwrap.fixed-header, .transparent-header #headerwrap.fixed-header {	background-image: none;
	background-color: #ffffff; 
}
.fixed-header #header, .fixed-header #site-description {	
	font-family:Arial, Helvetica, sans-serif; 
}
.fixed-header #header {	
	color: #000000; 
}
#site-logo, #site-logo a, .header-horizontal #site-logo, .header-minbar #site-logo, .header-leftpane #site-logo, .header-slide-out #site-logo, .boxed-compact #site-logo, .header-top-bar #site-logo img {		width: 100px;
	height: 38px; 
}
#site-logo, #site-logo a, .header-horizontal #site-logo, .header-minbar #site-logo, .header-leftpane #site-logo, .header-slide-out #site-logo, .boxed-compact #site-logo, .header-top-bar #site-logo a {		width: 100px; 
}
#site-description {	display: none; 
}
#main-nav a {		font-weight:normal;
 
}
#headerwrap #mobile-menu.sidemenu-on {	
	background-color: rgba(0,0,0,0.00); 
}
#headerwrap #mobile-menu.sidemenu-on nav a:hover, #headerwrap #mobile-menu.sidemenu-on nav .current-menu-item > a {	
	background-color: rgba(0,0,0,0.00);
	color: rgba(0,0,0,0.00); 
}
#footerwrap {	
	background-color: #000000; 
}

/* Themify Custom CSS */
a[rel="next"],
a[rel="prev"] {
  display: none;
}

#pagewrap {
  padding-top: 100px !important;
}

#headerwrap + * {
  margin-top: 30px !important;
}


header.header-on-scroll #site-logo img {
  transform: none !important;
  height: auto !important;
  width: auto !important;
}
#headerwrap {
  position: fixed !important;
  background-color: #fff !important;
  height: 100px !important;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999; /* assegura que quedi al damunt del contingut */
}
#site-logo {
  position: relative;
  top: 50%;
  left: -28%;
  transform: translateY(-15%);
}

#main-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px; /* Ajusta este valor para definir el espacio interior del header */
  list-style: none;
}

#main-nav li.themify-logo-menu-item {
  margin: 0 auto;
}

#main-nav li {
  padding: 0 5px;
}

#header,
header.header-on-scroll {
  background-color: #fff !important;
  line-height: normal !important;  /* Esto ayuda a centrar verticalmente el contenido si es texto */
  box-sizing: border-box;
  padding: 0 !important;
}

/* Asegura que el contenedor del header (o wrapper) no agregue espacios adicionales */
#headerwrap {
  height: 100px !important;
}

#main-nav li a {
  color: #000 !important;
  line-height: normal !important;  /* Para que los enlaces queden verticalmente alineados */
}

document.addEventListener("DOMContentLoaded", function(){
    var pagewrap = document.getElementById("pagewrap");
    if( pagewrap ) {
        pagewrap.removeAttribute("style");
    }
});

/* ============================
   Ajustes para pantallas verticales
   ============================ */
@media only screen and (max-width: 768px) {
  /* Aumenta la altura del header (opcional) */
  #headerwrap {
    height: 100px !important;
  }
  
  /* Aumenta el padding superior para compensar la nueva altura */
  #pagewrap {
    padding-top: 100px !important;
  }
  
 #site-logo {
    top: 30px !important;  / Opcionalmente, elimina la transformación para reposicionar el logo de forma natural */
    transform: none !important;
    left: auto !important; /* Si deseas centrar el logo horizontalmente, puedes usar margin auto o text-align en el contenedor */
    margin: 0 auto;
  }
}

@media only screen and (max-width: 768px) {
  /* Asegura que el menú contenedor se mantenga igual */
  .mobile_menu_active .sidemenu {
    width: 300px; /* O el ancho que desees */
    padding: 50px 25px 20px; /* Conservamos estos valores */
    /* Otras propiedades heredadas se mantienen */
  }
  
  /* Convierte la lista de navegación en un bloque vertical */
  .mobile_menu_active .sidemenu nav#main-nav-wrap ul#main-nav {
    display: block;
    padding: 0;
    margin: 0;
    list-style: none;
  }
  
  /* Cada ítem del menú se muestra en bloque y ocupa el 100% del ancho */
  .mobile_menu_active .sidemenu nav#main-nav-wrap ul#main-nav li {
    display: block;
    width: 100%;
    margin-bottom: 10px; /* Espaciado entre ítems (opcional) */
  }
  
  /* Los enlaces también se muestran como bloque para abarcar toda la línea */
  .mobile_menu_active .sidemenu nav#main-nav-wrap ul#main-nav li a {
    display: block;
    width: 100%;
    text-align: left; /* O 'center' si prefieres que queden centrados */
    padding: 5px 10px; /* Opcional: agrega algo de padding interno */
  }
  
  /* Oculta los submenús por defecto para evitar que aparezcan desplegados */
  .mobile_menu_active .sidemenu nav#main-nav-wrap ul#main-nav li ul.sub-menu {
    display: none;
  }
}
@media only screen and (max-width: 767px) {
 #site-logo {
    position: relative; /* Asegura que podamos usar top o margin-top */
    margin-top: 15px !important; / Alternativamente, si prefieres usar top:
    top: 20px !important; */
  }
}

@media only screen and (max-width: 767px) {
  /* Reduce la altura del header en móvil */
  #headerwrap {
    height: 55px !important;
  }
  
  #header {
    height: 40px !important;
    padding: 0 !important;
  }
  
  /* Ajusta el espaciado superior del contenedor principal */
  #pagewrap {
    padding-top: 70px !important;
  }
}

#menu-icon,
#menu-icon:before {
  color: #000 !important;
}


@media screen and (max-width: 976px) { /* Themify Customize Styling */
body {	
	background-color: #ffffff;
	font-family:Arial, Helvetica, sans-serif; 
}
#headerwrap {	
	background-color: #ffffff; 
}
#header {	
	background-color: #ffffff;
	font-family:Arial, Helvetica, sans-serif; 
}
#headerwrap.fixed-header, .transparent-header #headerwrap.fixed-header {	
	background-color: #ffffff; 
}
.fixed-header #header, .fixed-header #site-description {	
	font-family:Arial, Helvetica, sans-serif; 
}
#site-logo, #site-logo a, .header-horizontal #site-logo, .header-minbar #site-logo, .header-leftpane #site-logo, .header-slide-out #site-logo, .boxed-compact #site-logo, .header-top-bar #site-logo img {		width: 100px;
	height: 38px; 
}
#site-logo, #site-logo a, .header-horizontal #site-logo, .header-minbar #site-logo, .header-leftpane #site-logo, .header-slide-out #site-logo, .boxed-compact #site-logo, .header-top-bar #site-logo a {		width: 100px; 
}
#headerwrap #mobile-menu.sidemenu-on {	
	background-color: #ffffff; 
}
#headerwrap #mobile-menu.sidemenu-on nav li {	
	color: #000000; 
}
 }@media screen and (max-width: 768px) { /* Themify Customize Styling */
body {	
	background-color: #ffffff;
	font-family:Arial, Helvetica, sans-serif; 
}
#headerwrap {	
	background-color: #ffffff; 
}
#header {	
	background-color: #ffffff;
	font-family:Arial, Helvetica, sans-serif;
	color: rgba(0,0,0,0.00); 
}
#headerwrap.fixed-header, .transparent-header #headerwrap.fixed-header {	
	background-color: #ffffff; 
}
.fixed-header #header, .fixed-header #site-description {	
	font-family:Arial, Helvetica, sans-serif; 
}
#site-logo, #site-logo a, .header-horizontal #site-logo, .header-minbar #site-logo, .header-leftpane #site-logo, .header-slide-out #site-logo, .boxed-compact #site-logo, .header-top-bar #site-logo img {		width: 100px;
	height: 38px; 
}
#site-logo, #site-logo a, .header-horizontal #site-logo, .header-minbar #site-logo, .header-leftpane #site-logo, .header-slide-out #site-logo, .boxed-compact #site-logo, .header-top-bar #site-logo a {		width: 100px; 
}
#headerwrap #mobile-menu.sidemenu-on {	
	background-color: rgba(0,0,0,0.00); 
}
#headerwrap #mobile-menu.sidemenu-on nav a:hover, #headerwrap #mobile-menu.sidemenu-on nav .current-menu-item > a {	
	background-color: rgba(0,0,0,0.00);
	color: rgba(0,0,0,0.00); 
}
 }@media screen and (max-width: 480px) { /* Themify Customize Styling */
body {	
	background-color: #ffffff;
	font-family:Arial, Helvetica, sans-serif;
	color: rgba(0,0,0,0.00); 
}
#pagewrap {	
	background-color: #ffffff; 
}
#headerwrap {	
	background-color: rgba(0,0,0,0.00); 
}
#header {	
	background-color: rgba(0,0,0,0.00);
	font-family:Arial, Helvetica, sans-serif;
	color: #ffffff; 
}
#headerwrap.fixed-header, .transparent-header #headerwrap.fixed-header {	
	background-color: rgba(0,0,0,0.00); 
}
.fixed-header #header, .fixed-header #site-description {	
	font-family:Arial, Helvetica, sans-serif; 
}
.fixed-header #header {	
	color: rgba(0,0,0,0.00); 
}
#site-logo, #site-logo a, .header-horizontal #site-logo, .header-minbar #site-logo, .header-leftpane #site-logo, .header-slide-out #site-logo, .boxed-compact #site-logo, .header-top-bar #site-logo img {		width: 100px;
	height: 38px; 
}
#site-logo, #site-logo a, .header-horizontal #site-logo, .header-minbar #site-logo, .header-leftpane #site-logo, .header-slide-out #site-logo, .boxed-compact #site-logo, .header-top-bar #site-logo a {		width: 100px; 
}
#headerwrap #mobile-menu.sidemenu-on {	background-image: none;
	background-color: #ffffff; 
}
#headerwrap #mobile-menu.sidemenu-on nav li {	
	color: rgba(0,0,0,0.00); 
}
#footerwrap {	
	background-color: rgba(0,0,0,0.00); 
}
 }