body {
      font-family: Verdana, sans-serif;
    }

    header {
      height: 70px;
      width: 100%;
      background: white;
      position: fixed;
      top: 0;
      left: 0;
      z-index: 100;
    }

    span {
      width: 18px;
      height: 18px;
      border: 1px solid black;
      background-color: gray;
      font-family:Verdana, sans-serif; border-radius: 50px; position:absolute; text-align: center; font-size: 16px;
    }

    .DISPONIBLE {
      background-color: white;
    }

    .VENDIDO {
      background-color: green;
    }

    .OPCIONADO-RESERVADO {
      background-color: blue;
    }
.contenedor{ 	width: 85%; 	margin: auto;  }
.header-flex {
    display: flex; /* Habilita Flexbox */
    /* Distribuye el espacio: Elemento 1 a la izquierda, 2 al centro, 3 a la derecha */
    justify-content: space-between; 
    align-items: center; /* Alinea verticalmente los ítems (logos e indicadores) */
    width: 100%; /* Ocupa todo el ancho disponible del .contenedor (85% de la página) */
    /* border: 1px solid red; */ /* Puedes usar esto temporalmente para ver el área de acción /**/
}

/* Ajuste de los indicadores */
.conven {
    /* Ya no necesita 'position: fixed' */
    /* Ya no necesita 'width: 100%' */
    text-align: center; 
}
.reg{width: 85%; margin: auto; margin-top: 90px; text-align: right;}
.regresar{padding: 10px; background-color: orange; border-radius: 5px; text-decoration: none; color: white; font-weight: bold; transition: .5s}
.regresar:hover{background-color: orangered;}
.dis{text-align: center; font-weight: bold;}
.tcon{border-radius: 15px; border:1px solid #DBDBEA}
.conve{text-align: left; font-weight: bold; color: white;}
.pisomosaiko{width: 90px; height: 17px; left:700px; border-radius:0; background-image: url('img/MosaikoBtn01.png');  background-size: cover; color:black; cursor:pointer; }
.pisomosaiko:hover{background-image: url('img/MosaikoBtn02.png');}