@charset "utf-8";

form{ margin : 0; }
.imgblock{ display: block; }
a{ background : none; text-decoration : none; color: #3d3d3d; }
a img { border:0; }
a:hover{ color: #919191; }
.negrita{ font-weight:bold; }

html, body {
  height: 100%;
  margin: 0;
}

body{
    margin : 0;
    padding: 0;
    color: #FFF;
    font-family: "Cairo", Arial, Helvetica, sans-serif;
    font-size   : 14px;
    height: 100vh; /* Ensures the body covers the full viewport height */
      /* width: 100vw; Ensures the body covers the full viewport width */
    width: 100%;  /* Ensures the body covers the full viewport width */
}

.pageUp {
  display: flex;
  justify-content: center;  /* center horizontally */
  width: 100%;
  background-image: url('../images/fondoGeneral.png'); /* Replace with your image path */
  background-size: cover; /* Scales the image to cover the entire element while preserving aspect ratio */
  background-position: center center; /* Centers the image horizontally and vertically */
  background-repeat: no-repeat; /* Prevents the image from repeating */
  overflow: hidden;
}

.page {
  display: flex;
  flex: 1;
  flex-direction: column;
  min-height: 100vh; /* full viewport height */
  max-width: 1920px;
  margin: 0 auto;
}

.container {
  display: flex;
  flex: 1; /* grow to fill space above footer */
  
}

.sidebar {
  flex: 0 0 25%; /* fixed width sidebars */
  overflow:hidden;
}
.sidebarLeft {
  max-width: 380px;
}
.sidebarRight {
  max-width: 310px;
}

.main {
  flex: 1; /* main grows to fill remaining space */
  min-width: 50%; /* collapse breakpoint */
}

/* Footer always full width */
#footer {
  color: white;
  text-align: center;
  display: flex;
}
#footer .imgFooter{
  width: 100%;
  max-width: 963px;
  min-width: 490px;
  position: relative;
  top:7px;
  display:block;
  margin: 0 auto;
}
#footer .imgFooterText{
  display:none;
  padding-top:10px;
  padding-bottom:10px;
  border-top:2px solid #15DDFF;
}

#footer .imgColektor{
  position: relative;
  display: inline-block;
  top:12px;
}
#footer .main {
  
}
#footer .sidebar {
  
}
#footer .sidebarLeft {
  align-items: center;        /* vertical center */
  height: 100%;
  display: flex;
}
#footer .sidebarRight {
  align-items: center;        /* vertical center */
  height: 100%;
  display: flex;
}
#footer .text {
  text-align: center;
  width: 100%;
}


#menuResponsive{
  display: none;
}

/* When too narrow, hide sidebars */
@media (max-width: 980px) {
  .sidebar, #footer .sidebar {
    display: none;
  }
  .main, #footer .main {
    min-width: 100%;
  }
  #menuResponsive{
    display: block;
  }
  
  #footer .imgFooter{
    display:none;
  }
  #footer .imgFooterText{
    display:block;
  }
}