@charset "UTF-8";
@media screen {
  /* RESET PAGE */
  html, body,
  div, span,
  h1, h2, h3, h4, h5, h6, p,
  a, em, font, img, strong,
  dl, dt, dd, ol, ul, li,
  form, label, fieldset, legend, input, select, textarea, button,
  table, caption, tbody, tfoot, thead, tr, th, td,
  header, main, footer,
  article, aside, canvas, embed,
  picture, figure, figcaption, hgroup,
  menu, nav, output, ruby, section, details, summary,
  address, blockquote, cite,
  time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    vertical-align: baseline;
    background: none;
    box-sizing: border-box;
  }
  header, main, footer,
  article, aside, canvas, embed,
  picture, figure, figcaption, hgroup,
  menu, nav, output, ruby, section, details, summary,
  address, blockquote, cite,
  time, mark, audio, video {
    display: block;
  }
  h1, h2, h3, h4, h5, h6 {
    font-weight: normal;
  }
  ul {
    list-style: none;
  }
  a {
    text-decoration: none !important;
  }
  a, figure, img {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
  }
  input, select, textarea, button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
  }
  table, tr, th, td {
    border-collapse: collapse;
    vertical-align: top;
  }
  html, body {
    height: 100%;
  }
  html {
    font-size: 16px;
  }
  body {
    font-size: 1rem; /*1rem = 16px*/
  }
}
/*ABSTRACT*/
/*colores*/
/*sizes ratio 1:25*/
/*radius*/
/*FONTS*/
@font-face {
  font-family: "Raleway-regular";
  src: url("../fonts/Raleway-Regular.ttf") format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "Raleway-medium";
  src: url("../fonts/Raleway-Medium.ttf") format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "Raleway-bold";
  src: url("../fonts/Raleway-Bold.ttf") format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "GreatVibes-regular";
  src: url("../fonts/GreatVibes-Regular.ttf") format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "Roboto-Regular";
  src: url("../fonts/Roboto-Regular.ttf") format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "Roboto-Medium";
  src: url("../fonts/Roboto-Medium.ttf") format("truetype");
  font-display: swap;
}
/*ANIMACIONES*/
/*BOTONES*/
a.primary,
input[type=submit].primary {
  display: inline-block;
  width: auto !important;
  padding: 0.7em 1em;
  font: normal 1em "Raleway-bold", Arial, Helvetica, sans-serif;
  color: #ffffff;
  border: 0.06em solid #AB9553;
  border-radius: 0.5em;
  background-color: #AB9553;
  text-align: center;
  cursor: pointer;
  transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out;
}

input[type=submit].primary {
  margin-bottom: 0;
}

a.primary.outline,
input[type=submit].primary.outline {
  color: #AB9553;
  background-color: transparent;
  transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out;
}

a.secondary,
input[type=submit].secondary {
  display: inline-block;
  width: auto !important;
  padding: 0.7em 1em;
  font: normal 1em "Raleway-bold", Arial, Helvetica, sans-serif;
  color: #ffffff;
  border: 0.06em solid #000;
  border-radius: 0.5em;
  background-color: #000;
  text-align: center;
  cursor: pointer;
  transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out;
}

a.secondary.outline,
input[type=submit].secondary.outline {
  font-family: "Raleway-regular", Arial, Helvetica, sans-serif;
  color: #000;
  background-color: transparent;
  transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out;
}

a.small,
input[type=submit].small {
  font-size: 0.9em;
}

a.big,
input[type=submit].big {
  font-size: 1.25em;
}

a.white,
input[type=submit].white {
  color: #ffffff !important;
  border-color: #ffffff !important;
}

a.siguiente,
input.siguiente {
  display: block;
  padding-right: 1.5em !important;
  background-image: url("../imagenes/flecha-derecha.svg");
  background-repeat: no-repeat;
  background-position: 90% 50%;
}

a.confirmar,
input.confirmar {
  display: block;
  padding-right: 2.5em !important;
  background-image: url("../imagenes/ic-tilde-blanco.svg");
  background-repeat: no-repeat;
  background-position: 90% 50%;
}

a.reservar,
input.reservar {
  font-family: "Raleway-regular", Arial, Helvetica, sans-serif !important;
  display: inline-block;
  padding-left: 3em !important;
  background-image: url("../imagenes/isologo-blanco.svg") !important;
  background-repeat: no-repeat;
  background-position: 1em 50%;
  background-size: 1.7em auto;
}

/*SOCIAL*/
.NavSocial a {
  width: 2.5em;
  height: 2.5em;
  display: inline-block;
}

a[title*=WhatsApp] {
  background: url("../imagenes/whatsapp.svg") no-repeat 50% 50%;
  background-size: 1.5em auto;
}

a[title*=Instagram] {
  background: url("../imagenes/instagram.svg") no-repeat 50% 50%;
  background-size: 1.5em auto;
}

a[title*=Facebook] {
  background: url("../imagenes/facebook.svg") no-repeat 50% 50%;
  background-size: 0.8em auto;
}

/*MODAL*/
a.cerrarx {
  cursor: pointer;
  display: inline-block;
  width: 2.5em;
  height: 2.5em;
  background: url("../imagenes/ic-equis-blanco.svg") no-repeat 50% 50%;
}

/*HOVER EFFECTS*/
@media (hover: hover) and (pointer: fine) {
  a.primary:hover,
  input[type=submit].primary:hover {
    color: #AB9553;
    background-color: #000000;
    border-color: #AB9553;
  }
  a.primary.outline:hover,
  input[type=submit].primary.outline:hover {
    color: #000;
    border-color: #000;
  }
  a.secondary:hover,
  input[type=submit].secondary:hover {
    color: #000;
    background-color: #000000;
  }
  a.secondary.outline:hover,
  input[type=submit].secondary.outline:hover {
    color: #b8b8b8;
    border-color: #b8b8b8;
    background: none !important;
  }
}
/*FORMULARIOS*/
.TituloForm {
  font: normal 1.5em "Raleway-bold", Arial, Helvetica, sans-serif;
  display: block;
  margin-bottom: 0.2em;
}

label,
legend {
  display: block;
  margin-bottom: 0.25em;
  font-size: 0.9em;
  color: #333333;
  display: block;
}

legend {
  margin-bottom: 1em;
}

label span,
legend span {
  font-family: "Raleway-bold", Arial, Helvetica, sans-serif;
  color: #AB9553;
}

p.AlertaTxtForm {
  flex: 1 1 100%;
  display: block;
  font: normal 0.7em "Raleway-medium", Arial, Helvetica, sans-serif;
  margin-bottom: 1.5em;
}

div.fila-campos {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 2em !important;
}

div.fila-campos span {
  flex: 1;
  margin-right: 1em;
}

div.fila-campos select {
  margin-bottom: 0.25em;
  max-width: 5em;
}

div.fila-campos p {
  font-family: "Roboto-Regular", Arial, Helvetica, sans-serif;
  font-size: 0.8em;
  color: #707070;
}

input.primary,
select.primary,
textarea.primary {
  font: normal 0.9em "Raleway-regular", Arial, Helvetica, sans-serif;
  border: 0.06em solid #b8b8b8;
  padding: 0.8em 1em;
  width: 100%;
  margin-bottom: 1.5em;
  text-align: left;
  border-radius: 0;
  background-color: #ffffff;
  color: #000000;
}

input[type=date] {
  min-height: 3em;
}

.radio-group {
  display: flex;
  flex-wrap: wrap;
  text-align: left;
  margin-bottom: 2em !important;
}

.radio-group > legend {
  flex: 1 1 100%;
}

.radio {
  display: inline-flex;
  text-align: left;
  margin-right: 2em;
}

.radio label {
  flex: 1;
  margin-bottom: 0;
}

.radio input[type=radio] {
  flex: 0 0 1.5em;
  width: 1.5em;
  height: 1.5em;
  margin-right: 0.8em;
  border: 0.06em solid #949494;
  border-radius: 50%;
}

.radio input[type=radio]:checked {
  border-color: #AB9553;
  background: url(../imagenes/dot-dorado.svg) no-repeat 50% 50%;
}

.checkbox-group {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  text-align: left;
  margin: 0 0 2em 0;
}

.checkbox-group input[type=checkbox] {
  flex: 0 0 1.2em;
  width: 1.2em;
  height: 1.2em;
  border: 0.06em solid #949494;
  margin-right: 0.4em;
}

.checkbox-group label {
  flex: 1;
  margin-bottom: 0;
  font-size: 0.8em;
  color: #707070;
}

.checkbox-group a {
  display: inline-block;
  font-size: 0.9em;
  color: #707070;
  text-decoration: underline !important;
}

.checkbox-group input[type=checkbox]:checked {
  background: url("../imagenes/ic-tilde.jpg") no-repeat 50% 50%;
}

label[for=terminos] {
  font-family: "Roboto-Regular", Arial, Helvetica, sans-serif;
  font-size: 0.7em;
}

/*giftcode*/
.giftcode-group {
  display: flex;
  justify-content: flex-start;
  width: 100%;
  text-align: left;
}

.giftcode-group input[type=text] {
  flex: 1;
  margin-bottom: 0;
  border-right: none;
}

.giftcode-group input[type=submit] {
  flex: 0 0 3em;
  border-radius: 0 0.5em 0.5em 0;
}

.giftcodeadd-group {
  display: flex;
  justify-content: flex-start;
  width: 100%;
  text-align: left;
}

.giftcodeadd-group input[type=text] {
  flex: 1;
  font-family: "Roboto-Regular", Arial, Helvetica, sans-serif;
  margin-bottom: 0;
  background: none !important;
  border-color: #AB9553;
  border-right: none !important;
  opacity: 1;
}

.giftcodeadd-group input[type=submit] {
  flex: 0 0 3em;
  width: 3em;
  align-self: stretch;
  background: url("../imagenes/ic-equis.svg") no-repeat 50% 50%;
  background-size: 1em auto;
  border: 0.06em solid #AB9553;
  border-left: none !important;
  cursor: pointer;
}

textarea.primary {
  height: 11.25em;
}

/*disabled*/
input.primary[disabled],
select.primary[disabled],
textarea.primary[disabled] {
  opacity: 1;
  background: none;
  background-color: #f2f2f2;
}

/*focus*/
input.primary:not([disabled]):focus,
textarea.primary:not([disabled]):focus,
select.primary:not([disabled]):focus {
  background-color: #f2f2f2;
  color: #000000;
  border-color: #AB9553;
}

/*...*/
/*SELECT*/
@supports ((-webkit-appearance: none) or (-moz-appearance: none) or (appearance: none)) {
  select.primary {
    padding-right: 2.18em;
    background: #ffffff url(../imagenes/flecha-abajo-negro.svg) no-repeat calc(100% - 0.8em) 50%;
    background-size: 0.7em auto;
  }
}
/*HOVER EFFECTS*/
@media (hover: hover) and (pointer: fine) {
  input.primary:not([disabled]):hover,
  textarea.primary:not([disabled]):hover,
  select.primary:not([disabled]):hover {
    border-color: #AB9553;
  }
}
/*TABLAS*/
/*tablas*/
table, tr, th, td {
  border-collapse: collapse;
  vertical-align: top;
}

table.primary {
  width: 100%;
  text-align: left;
}

table.primary thead {
  position: relative;
  overflow: hidden;
}

table.primary thead td {
  padding: 1em 1.5em;
  background-color: #000000;
}

table.primary thead td p {
  font-size: 0.9em;
  color: #ffffff;
}

table.primary tbody td {
  padding: 1.5em;
  background-color: #ffffff;
  border-bottom: 0.12em solid #f2f2f2;
}

table.primary tbody tr:last-child td {
  border: none;
}

table.responsive tbody td[data-info=adultos],
table.responsive tbody td[data-info=ninos],
table.responsive tbody td[data-info=infantes] {
  font-family: "Roboto-Medium", Arial, Helvetica, sans-serif;
}

table.primary tbody tr td:last-child {
  padding-top: 0.8em;
  padding-bottom: 0.8em;
}

table.primary tbody td p {
  font-size: 1em;
  color: #000000;
}

@media (max-width: 1200px) {
  table.responsive thead {
    display: none;
  }
  table.responsive,
  table.responsive tbody,
  table.responsive tbody tr {
    display: block;
    width: 100%;
    text-align: left !important;
  }
  table.responsive tbody {
    display: grid;
    grid-gap: 1em;
    width: 100%;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  }
  table.responsive tbody tr {
    background-color: #ffffff;
  }
  table.responsive tbody td {
    display: block;
    border: none;
    padding: 1em 1.5em !important;
  }
  table.responsive tbody td:first-child {
    background: #000000;
  }
  table.responsive tbody td[data-info=adultos],
  table.responsive tbody td[data-info=ninos],
  table.responsive tbody td[data-info=infantes] {
    display: inline-block !important;
    width: auto !important;
    vertical-align: top;
  }
  table.responsive tbody td:last-child {
    padding-bottom: 2em !important;
  }
  table.responsive tbody td:first-child p {
    color: #ffffff;
  }
  /*compras*/
  table.responsive tbody td::before {
    font-variant: small-caps;
    display: block;
    font-size: 0.9em;
    color: #949494;
  }
  table.responsive tbody td[data-info]::before {
    content: attr(data-info);
  }
  table.responsive tbody td[data-info=acciones]::before {
    content: "";
  }
  table.responsive tbody td p {
    font-size: 1em;
  }
}
@media (max-width: 600px) {
  table.responsive tbody {
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  }
}
/*PAGINADO*/
#NavPaginado {
  width: 100%;
  text-align: center;
  margin-top: 3.5em;
}

#NavPaginado ul {
  list-style: none;
  margin: 0 auto;
  width: 100%;
  max-width: 50em;
  display: flex;
  align-items: center;
  justify-content: center;
}

#NavPaginado li {
  flex: 0 0 auto;
  font-size: 1em;
  color: #4D4D4D;
  margin: 0 0.5em;
}

#NavPaginado li a {
  width: 2.5em;
  height: 2.5em;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

#NavPaginado li.PrevPaginado a {
  margin-right: 1em;
  background: url("../imagenes/nav-left.svg") no-repeat 50% 50%;
  background-size: 0.8em auto;
}

#NavPaginado li.NextPaginado a {
  margin-left: 1em;
  background: url("../imagenes/nav-rigth.svg") no-repeat 50% 50%;
  background-size: 0.8em auto;
}

#NavPaginado li.Number a {
  padding: 0.5em;
  border-bottom: 0.2em solid transparent;
}

/*select*/
#NavPaginado li.select a {
  color: #AB9553;
  font-weight: bold;
  cursor: default;
  border-bottom-color: #AB9553;
}

/*.......*/
/*NAV PASOS*/
@media screen {
  #NavFotantePasos {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9995;
    width: 100%;
    text-align: center;
    padding: 1.2em 0 0 0;
    pointer-events: none;
  }
  #NavPasos {
    display: inline-flex;
    align-self: center;
    background-color: #ffffff;
    padding: 0.5em;
    margin: 0 auto;
    border-radius: 2em;
    pointer-events: pointer;
  }
  /*a#BtnVolverPaso { flex: 0 0 auto; display: block; padding-left: 2em; font-size: $xxs; color: $bluegray; background: url("../imagenes/chevron-izq.svg") no-repeat 0 50%; background-size: 1em auto;}*/
  a#BtnVolverPaso {
    display: none;
  }
  #NavPasos > div {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    margin-right: 1em;
  }
  #NavPasos span {
    position: relative;
    overflow: hidden;
    flex: 0 0 auto;
    width: 2em;
    height: 2em;
    text-align: center;
    font-family: "Roboto-Medium", Arial, Helvetica, sans-serif;
    font-size: 0.7em;
    line-height: 0;
    border: 0.06em solid #000000;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0.5;
  }
  #NavPasos p {
    font-size: 0.7em;
    color: #000000;
    margin-left: 0.5em;
    display: none;
  }
  /*select*/
  #NavPasos > div.select span {
    opacity: 1;
  }
  #NavPasos > div.select p {
    display: block !important;
  }
  /*ok*/
  #NavPasos > div.ok span {
    opacity: 1;
    line-height: 50em;
    border: none;
    display: block;
    background: url("../imagenes/ic-paso-ok.svg") no-repeat 0 0;
    background-size: 100% auto;
  }
}
@media (max-width: 990px) {
  #NavFotantePasos {
    position: relative;
    top: auto;
    z-index: 0;
    margin-bottom: 1.5em;
    padding: 1em 1em 0 1em;
  }
}
/*MODALES*/
@media screen {
  .Modal {
    position: fixed;
    z-index: 9996;
    top: 0;
    left: 0;
    overflow-x: hidden;
    overflow-y: auto;
    width: 100%;
    height: 100%;
    padding: 2.5em;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.85);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    -webkit-overflow-scrolling: touch;
  }
  .Mobile .Modal {
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
  }
  .ContentModal {
    position: relative;
    margin: auto;
    width: 100%;
    max-width: 62em;
    text-align: left;
    background-color: #ffffff;
    border-radius: 0.5em;
    transform: translateY(-1.25em);
    transition: transform 0.3s ease-in-out;
  }
  .Modal a.cerrarx {
    position: absolute;
    z-index: 100;
    display: block !important;
    top: 2em;
    right: 2em;
  }
  /*modal general*/
  #ContentModalGeneral {
    text-align: center;
    padding: 2em;
  }
  #ContentModalGeneral p {
    font-size: 1.25em;
  }
  body[class*=modal] {
    overflow: hidden;
  }
  .modalgeneral #ModalGeneral,
  .modalreserva #ModalReserva {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto;
  }
  .modalgeneral #ContentModalGeneral,
  .modalreserva #ContentModalReserva {
    transform: translateY(0);
  }
}
@media (max-width: 1450px) {
  #ContentModalReserva {
    max-width: 20em;
  }
}
/*MISCELANEAS*/
::-webkit-scrollbar {
  width: 0.5em;
}

::-webkit-scrollbar-track {
  background: #f2f2f2;
  border-radius: 0.5em;
}

::-webkit-scrollbar-thumb {
  background: #b8b8b8;
  border-radius: 0.5em;
}

.smooth {
  overflow-y: scroll;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
}

/*LAYOUT GLOVAL*/
@media screen {
  body {
    margin: 0 auto;
    text-align: left;
    font-family: "Raleway-regular", Arial, Helvetica, sans-serif;
    background-color: #000000;
  }
  .SafeZone {
    width: 100%;
    min-height: 100%;
    margin: 0 auto;
  }
  .ViewportLargo {
    position: relative;
    width: 100%;
    height: 100%;
    margin: 0 auto; /*border: 1px solid green;*/
    max-width: 110em; /*1760px*/
  }
  .Viewport {
    position: relative;
    width: 100%;
    height: 100%;
    margin: 0 auto; /*border: 1px solid red;*/
    max-width: 100em; /*1600px*/
  }
  .ViewportCorto {
    position: relative;
    width: 100%;
    height: 100%;
    margin: 0 auto; /*border: 1px solid blue; */
    max-width: 56em; /*900px*/
  }
  /*img responsive*/
  img {
    max-width: 100%;
    display: block;
  }
}
@media (max-width: 1920px) {
  .Viewport {
    max-width: 85em;
  } /*1360px*/
  .ViewportLargo {
    padding: 0 2em;
    max-width: none !important;
  }
}
@media (max-width: 1470px) {
  .Viewport {
    max-width: 75em !important;
  } /*1200px*/
}
@media (max-width: 1300px) {
  .Viewport,
  .ViewportLargo,
  .ViewportCorto {
    padding: 0 2em;
    max-width: none !important;
  }
}
@media (max-width: 500px) {
  .Viewport,
  .ViewportLargo,
  .ViewportCorto {
    padding: 0 1.5em;
  }
}
/*HEADER*/
@media screen {
  header.primary {
    position: sticky;
    top: 0;
    left: 0;
    z-index: 9994;
    width: 100%;
    padding: 0.75em 0;
    text-align: left;
    background: rgba(0, 0, 0, 0.9);
  }
  #ContentHeader {
    display: flex;
    align-items: center;
  }
  a#BtnMenuMobile {
    display: block;
    position: absolute;
    z-index: 9900;
    top: 0.95em;
    left: 2em;
    width: 2.5em;
    height: 2.5em;
    cursor: pointer;
    background: url("../imagenes/ic-menu-blanco.svg") no-repeat 50% 50%, url("../imagenes/ic-equis-blanco.svg") no-repeat 50% 200px;
  }
  #Logo {
    flex: 0 0 10em;
    margin-left: 5.5em;
    display: flex;
  }
  #Logo a {
    display: block;
  }
  #Logo h1 {
    display: flex;
    align-items: center;
  }
  #MenuGeneral {
    position: fixed;
    z-index: 9000;
    overflow: hidden;
    top: 0;
    left: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-content: center;
    padding: 0;
    width: 100%;
    height: 0;
    padding: 0;
    background: rgba(0, 0, 0, 0.95);
    transition: height 0.7s ease-in-out;
  }
  #MenuGeneral > li {
    width: 100%;
    flex: 1 1 100%;
    height: auto;
    text-align: center;
  }
  #MenuGeneral > li#Iso {
    width: 100%;
    display: block;
    text-align: center;
    margin-bottom: 1.5em;
  }
  #MenuGeneral > li#Iso img {
    width: 2.5em;
    display: block;
    margin: 0 auto;
  }
  #MenuGeneral > li > a {
    display: block;
    width: 100%;
    padding-bottom: 0.15em;
    margin-bottom: 0.5em;
    text-align: center;
    font: normal 5em "GreatVibes-regular", Arial, Helvetica, sans-serif;
    color: #ffffff;
    background: url("../imagenes/separador-lineas.svg") no-repeat 50% 100%;
    background-size: 0.75em auto;
  }
  #MenuGeneral > li.select > a {
    color: #AB9553;
    cursor: default;
  }
  /*menumode*/
  .menumode {
    overflow: hidden;
  }
  .menumode a#BtnMenuMobile {
    background-position: 50% -200px, 50% 50%;
  }
  .menumode #MenuGeneral {
    height: 100%;
    padding-top: 1em;
    padding-bottom: 1em;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
  }
  /*.........*/
  #MenuSecundario {
    flex: 1;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding-right: 3em;
  }
  /*Panel Login*/
  #Login {
    position: relative;
    flex: 1;
  }
  #AccesosLogin {
    display: flex;
    align-items: center;
    justify-content: flex-end;
  }
  #AccesosLogin a#BtnRegistro {
    font-size: 0.9em;
    color: #ffffff;
    margin-right: 1em;
  }
  #AccesosLogin a#BtnLogin {
    flex: 0 0 2.3em;
    height: 2.3em;
    background: url("../imagenes/ic-pefil-vacio.svg") no-repeat 50% 50%;
    background-size: 2em auto;
  }
  #AccesosLogin a#BtnPerfil {
    flex: 0 0 2.3em;
    height: 2.3em;
    background: url("../imagenes/ic-pefil-lleno.svg") no-repeat 50% 50%;
    background-size: 2em auto;
  }
  #MenuSecundario .DownPanel {
    position: fixed;
    overflow: hidden;
    z-index: 9910;
    width: 100%;
    height: 0;
    max-height: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.95);
    transition: height 0.7s ease-in-out;
  }
  #Login a.cerrarx {
    display: block;
    width: 2em;
    height: 2em;
    position: absolute;
    top: 1em;
    right: 1.5em;
    background: url("../imagenes/ic-equis-blanco.svg") no-repeat 0 0;
  }
  #PanelLogin {
    top: 0;
    left: 0;
  }
  #LogAbierto {
    background-color: #ffffff;
    border-top: 0.25em solid #AB9553;
    padding: 3em 2.2em;
    text-align: center;
  }
  #FormPerfil {
    width: 100%;
    padding: 0;
    text-align: center;
  }
  #DatosPerfil {
    margin-bottom: 2em;
  }
  #DatosPerfil figure {
    display: inline-block;
    margin: 0 auto 1em auto;
  }
  p.NombreLog {
    font-size: 1.5em;
    display: block;
    margin-bottom: 0.7em;
  }
  #DatosPerfil a {
    display: block;
    margin: 0.5em auto;
    max-width: 12em;
  }
  a#BtnMisDatos {
    background: url("../imagenes/chevron-der.svg") no-repeat 90% 50%;
  }
  a#BtnMisReservas {
    background: url("../imagenes/ic-corazon.svg") no-repeat 10% 50%;
  }
  #AccionesCarrito {
    display: block;
    padding-top: 1em;
    border-top: 0.06em solid #b8b8b8;
  }
  #BtnCerrarSesion {
    display: block;
    margin: 0 auto;
    font-size: 0.9em;
    color: #667085;
    cursor: pointer;
    background: url("../imagenes/chevron-izq.svg") no-repeat 0 50%;
    background-size: 0.75em auto;
    padding-left: 1.3em;
    border: none;
  }
  /*loginmode*/
  .loginmode #MenuSecundario .DownPanel {
    height: 100%;
    max-height: none;
  }
  /*....*/
  /*Cambiar pais*/
  #CambiarPais {
    flex: 0 0 auto;
    margin-left: 1em;
  }
}
/*HOVER EFFECTS*/
@media (hover: hover) and (pointer: fine) {
  #MenuGeneral > li:not(.select):hover > a {
    color: #949494;
  }
}
@media (max-width: 700px) {
  a#BtnMenuMobile {
    top: 1em;
    left: 1em;
  }
  #Logo {
    flex: 1;
    margin-left: 4.5em;
  }
  #Logo a {
    max-width: 10em;
    margin: 0 auto;
  }
  #MenuSecundario {
    flex: 0 0 5em;
    padding-right: 1.5em;
  }
  #MenuGeneral > li > a {
    font-size: 4em;
  }
  #CambiarPais,
  a#BtnRegistro {
    display: none;
  }
}
/*FOOTER*/
@media screen {
  #TopFooter {
    background-color: #000000;
    padding-top: 2em;
    padding-bottom: 1em;
  }
  #ContentFooter {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }
  #LocationFooter {
    flex: 1;
    text-align: left;
  }
  #LocationFooter address,
  #LocationFooter p {
    font-style: normal;
    font-size: 1em;
    color: #ffffff;
  }
  #LocationFooter address {
    padding-left: 1.5em;
    background: url("../imagenes/ic-pin.svg") no-repeat 0 0;
  }
  p#Copy {
    display: block;
    margin-top: 0.8em;
    margin-bottom: 1em;
    font-size: 0.8em;
  }
  p#CreacionUno {
    display: block;
    font-family: Arial;
    font-size: 0.7em;
    color: #949494;
  }
  p#CreacionUno a {
    font-family: Arial;
    font-size: 0.8em;
    color: #949494;
  }
  #CambiarPaisFooter {
    display: none;
  }
  #SocialFooter {
    flex: 1;
  }
  #SocialFooter .NavSocial {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
  }
  #SocialFooter .NavSocial a {
    margin: 0 0.5em;
  }
}
@media (max-width: 700px) {
  #TopFooter {
    padding-bottom: 4em;
  }
  #ContentFooter {
    flex-direction: column;
  }
  #LocationFooter {
    order: 3;
    text-align: center;
  }
  #CambiarPaisFooter {
    order: 2;
    display: block;
    margin: 2em 0;
    text-align: center;
  }
  #CambiarPaisFooter p {
    display: block;
    text-align: center;
    font-family: "Raleway-regular", Arial, Helvetica, sans-serif;
    color: #ffffff;
  }
  #CambiarPaisFooter form {
    margin: 1em auto 0 auto;
  }
  #SocialFooter {
    order: 1;
  }
}
/*SELECCION DE PAIS*/
@media screen {
  #Presentacion {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 100%;
    min-height: 100vh;
    padding: 1.5em;
    background: url("../imagenes/fondo-telon.webp") no-repeat 50% 50%;
    background-size: cover;
  }
  #ContentPresentacion {
    width: -moz-fit-content;
    width: fit-content;
    max-width: 31em;
    background: #000000 url("../imagenes/fondo-login.jpg") no-repeat 50% 0;
    border: 0.06em solid #333333;
  }
  #TopFormPresentacion {
    padding: 3em 3em 0 3em;
    text-align: center;
  }
  #TopFormPresentacion h1 {
    width: 6em;
    margin: 0 auto 1.5em auto;
  }
  #TopFormPresentacion p.TxtBienvenido {
    display: block;
    text-align: center;
    font: normal 5em "GreatVibes-regular", Arial, Helvetica, sans-serif;
    color: #ffffff;
  }
  #BottomFormPresentacion {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 13em;
    margin-bottom: 2em;
    transition: height 0.3s ease-in-out;
  }
  #Pasos {
    display: flex;
    flex-wrap: nowrap;
    transition: transform 0.3s ease-in-out;
  }
  #Pasos > div {
    min-width: 100%;
    text-align: center;
  }
  p.TxtDecision {
    display: inline-block;
    text-align: center;
    margin: 0 auto;
    padding: 0.7em 0.5em;
    border-top: 0.06em solid #464646;
    border-bottom: 0.06em solid #464646;
    font-size: 0.9em;
    color: #ffffff;
  }
  /*Seleccion de país*/
  .check-gold {
    display: block;
    margin: 0;
    text-align: center;
  }
  .check-gold label {
    display: block;
    width: 100%;
    max-width: 13em;
    margin: 0 auto;
    padding: 0.5em;
    border-radius: 0.5em;
    text-align: center;
    font-family: "Raleway-medium", Arial, Helvetica, sans-serif;
    font-size: 1.25em;
    color: #ffffff;
    border: 0.06em solid #464646;
    cursor: pointer;
    transition: border-color 0.3s ease-in-out;
  }
  .check-gold input {
    width: 0;
    height: 0;
  }
  label[for=ingles] {
    background: url("../imagenes/ic-bandera-usa.png") no-repeat 0.5em 50%;
  }
  label[for=portugues] {
    background: url("../imagenes/ic-bandera-brasil.png") no-repeat 0.5em 50%;
  }
  label[for=espanol] {
    background: url("../imagenes/ic-bandera-espana.png") no-repeat 0.5em 50%;
  }
  .check-gold input[type=radio]:checked + label {
    border-color: #AB9553;
    color: #AB9553;
    background: url("../imagenes/ic-tilde.svg") no-repeat 95% 50%;
  }
  select.selectpais {
    width: 4.5em;
    font-family: "Raleway-regular", Arial, Helvetica, sans-serif;
    font-size: 0.8em;
    color: #ffffff;
    padding: 0.5em;
    border: 0.06em solid #464646;
    border-radius: 0.5em;
    background-color: #000000;
  }
  select.selectpais:focus {
    background-color: #000000;
  }
  /*.................*/
  #AccionesPaso2 {
    margin-top: 1.5em;
  }
  a#BtnCambioSede {
    font-size: 1em;
    display: block;
    margin-top: 2em;
    text-align: center;
    color: #ffffff;
  }
  #BottomFormPresentacion.next {
    height: 25em;
  }
  #BottomFormPresentacion.next #Pasos {
    transform: translateX(-100%);
  }
}
@supports ((-webkit-appearance: none) or (-moz-appearance: none) or (appearance: none)) {
  select.selectpais {
    padding-right: 2.18em;
    background: url(../imagenes/flecha-abajo.svg) no-repeat 90% 50%;
    background-size: 0.75em auto;
  }
}
/*HOVER EFFECTS*/
@media (hover: hover) and (pointer: fine) {
  .check-gold label:hover {
    border-color: #ffffff;
  }
}
@media (max-width: 500px) {
  #Presentacion {
    background: none;
  }
  #TopFormPresentacion p.TxtBienvenido {
    font-size: 4em;
  }
}
/*BIENVENIDO*/
@media screen {
  #HeroBienvenida {
    width: 100%;
    height: calc(100vh - 5em);
    background: url("../imagenes/internas/fondo-bienvenido.webp") no-repeat 50% 50%;
    background-size: cover;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
  }
  #ContentHeroBienvenida {
    height: auto;
  }
  #ContentHeroBienvenida > div {
    padding: 0 2.3em;
    max-width: 30em;
  }
  #ContentHeroBienvenida h3 {
    display: block;
    margin: 2em 0;
    font-size: 1.15em;
    line-height: 1.5em;
    color: #ffffff;
  }
}
/*HOVER EFFECTS*/
@media (hover: hover) and (pointer: fine) {
  a#BtnIniciarReserva:hover {
    border-color: #000000;
    color: #AB9553;
    background-color: #000000;
  }
}
@media (max-width: 500px) {
  #HeroBienvenida {
    background: url("../imagenes/internas/fondo-bienvenido-small.webp") no-repeat 50% 50%;
    background-size: cover;
  }
  #ContentHeroBienvenida > div {
    padding: 0 1.5em;
  }
  a#BtnIniciarReserva {
    min-width: 0;
    max-width: none;
    display: block;
  }
}
/*SELECCION TIPO MESA*/
@media screen {
  div[data-id=TipoMesa] {
    background-color: #111;
  }
  #TipoMesa {
    width: 100%;
    padding: 3em 0;
    background: url("../imagenes/internas/fondo-lux-violeta.webp") no-repeat 60% 50%;
    background-size: cover;
  }
  #TopCards {
    display: none;
  }
  #MapaAreas {
    padding: 0 3em 3em 3em;
  }
  #MapaAreas p {
    flex: 1;
    font-size: 1.25em;
    color: #ffffff;
    text-align: left;
    margin-bottom: 1em;
  }
  #ListaCards {
    display: grid;
    gap: 2em 1em;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  }
  .CardMesa {
    display: flex;
    flex-direction: column;
  }
  .CardMesa header {
    flex: 0 0 auto;
    padding: 2em 1.5em 1em 1.5em;
    border-bottom: none;
    text-align: center;
  }
  .MesaPlatea header {
    background: url("../imagenes/internas/mesa-platea.jpg") no-repeat 50% 50%;
    background-size: cover;
  }
  .MesaEjecutiva header {
    background: url("../imagenes/internas/mesa-ejecutiva.jpg") no-repeat 50% 50%;
    background-size: cover;
  }
  .MesaVip header {
    background: url("../imagenes/internas/mesa-vip.jpg") no-repeat 50% 50%;
    background-size: cover;
  }
  .MesaPremium header {
    background: url("../imagenes/internas/mesa-premium.jpg") no-repeat 50% 50%;
    background-size: cover;
  }
  h2.TituloTipoMesa {
    display: block;
    text-align: center;
    font-family: "Raleway-medium", Arial, Helvetica, sans-serif;
    font-size: 0.9em;
    color: #ffffff;
  }
  h2.TituloTipoMesa span {
    display: block;
    font-family: "GreatVibes-regular", Arial, Helvetica, sans-serif;
    font-size: 4.5em;
    text-transform: lowercase;
    color: #AB9553;
    text-align: center;
  }
  h2.TituloTipoMesa span:first-letter {
    text-transform: uppercase;
  }
  h2.TituloTipoMesa.big {
    font-size: 1em;
  }
  h2.TituloTipoMesa.big span {
    font-size: 4.8em;
  }
  .InfoMesa {
    flex: 1;
    padding: 2em 1.5em 0 1.5em;
    background-color: #000000;
    border-top: none;
    display: flex;
    flex-direction: column;
  }
  .TipoMesa {
    flex: 0 0 auto;
    display: block;
  }
  .TagTipoMesa {
    display: inline-block;
    font-size: 0.9em;
    color: #ffffff;
    padding: 0.5em;
    border: 0.06em solid #48331C;
    border-radius: 0.5em;
  }
  .TagTipoMesa.Privada {
    background-color: #AB9553;
    color: #000000;
    border-color: transparent;
  }
  .TipoMesa p {
    display: block;
    font-size: 0.8em;
    color: #b8b8b8;
    padding-left: 0.25em;
    padding-top: 0.5em;
  }
  .ServiciosMesa {
    flex: 1;
    margin-bottom: 1em;
  }
  .ServiciosMesa ul {
    display: block;
    margin: 1.5em 0 0.5em 0;
  }
  .ServiciosMesa li {
    display: block;
    padding: 1em 1em 1em 4em;
  }
  .ServiciosMesa li.ServicioComida {
    background: url("../imagenes/internas/ic-servicios-comida.png") no-repeat 0 50%;
  }
  .ServiciosMesa li.ServicioBebida {
    background: url("../imagenes/internas/ic-servicios-bebida.png") no-repeat 0 50%;
  }
  .ServiciosMesa li.ServicioTango {
    background: url("../imagenes/internas/ic-servicios-tango.png") no-repeat 0 50%;
  }
  .ServiciosMesa h3 {
    font-size: 0.8em;
    line-height: 1.5em;
    color: #ffffff;
  }
  p.AlertaMesa {
    display: block;
    padding: 1em 0 1em 2em;
    font-size: 0.7em;
    color: #949494;
    background: url("../imagenes/ic-alerta.svg") no-repeat 0 1em;
    background-size: 1.2em auto;
  }
  .PrecioMesa {
    flex: 0 0 9em;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding-top: 1em;
    margin: 0 0 2em 0;
    border-top: 0.06em solid #252525;
  }
  .PrecioAnterior {
    flex: 0 0 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }
  .PrecioAnterior p {
    flex: 0 0 auto;
    font: normal 1em "Roboto-Regular", Arial, Helvetica, sans-serif;
    text-decoration: line-through;
    color: #707070;
  }
  .TagDescuento {
    flex: 0 0 auto;
    margin-left: 1em;
    background-color: #AB9553;
    padding: 0.25em;
    font-family: "Roboto-Medium", Arial, Helvetica, sans-serif;
    font-size: 0.8em;
  }
  .PrecioActual {
    flex: 0 0 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
  }
  .PrecioActual * {
    color: #AB9553;
    font-family: "Roboto-Medium", Arial, Helvetica, sans-serif;
  }
  span.Moneda {
    flex: 0 0 auto;
    font-size: 1.5em;
    margin-right: 0.25em;
  }
  .PrecioActual p {
    flex: 0 0 auto;
    font-size: 2.4em;
  }
  span.PrecioUnidad {
    flex: 1 1 100%;
    font-size: 1em;
  }
  .PrecioMesa a {
    flex: 0 0 auto;
    margin-top: 0.5em;
  }
  .NotaPrecioMesa {
    flex: 0 0 auto;
    margin-top: 0.5em;
  }
  .NotaPrecioMesa p {
    display: block;
    font-size: 0.7em;
    line-height: 1.5em;
    color: #b8b8b8;
  }
  /*Modal Mapa*/
  #ContentModalMapa {
    width: auto;
  }
  .modalmapa #ModalMapa {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto;
  }
  .modalmapa #ContentModalMapa {
    opacity: 1;
    transform: translateY(0);
  }
}
@media (max-width: 1100px) {
  #TopCards {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 1em;
  }
  #TopCards p {
    flex: 1;
    font-size: 1.25em;
    color: #ffffff;
    text-align: left;
  }
  #TopCards p br {
    display: none;
  }
  #TopCards a {
    flex: 0 0 auto;
  }
  a.BtnPlano {
    display: inline-block;
    font-size: 0.8em;
    color: #ffffff;
    background: rgba(0, 0, 0, 0.7) url("../imagenes/ic-pin.svg") no-repeat 0.5em 50%;
    background-size: 1em auto;
    padding: 0.5em 0.5em 0.5em 2em;
    border-radius: 0.5em;
  }
  #MapaAreas {
    display: none;
  }
}
@media (max-width: 990px) {
  #TipoMesa {
    padding-top: 0;
  }
  #ReservaTipoMesa {
    padding-top: 2em;
  }
}
@media (max-width: 650px) {
  #TopCards p {
    flex: 1 1 100%;
    margin-bottom: 0.5em;
  }
  #TopCards p br {
    display: block;
  }
  a.BtnPlano {
    border: 0.06em solid #707070;
  }
}
@media (max-width: 500px) {
  #TipoMesa {
    background: url("../imagenes/internas/fondo-lux-violeta-small.webp") no-repeat 60% 50%;
    background-size: cover;
  }
}
/*DATOS DE RESERVA*/
@media screen {
  div[data-id=DatosReserva] {
    background-color: #E2E1E1;
  }
  #DatosReserva {
    width: 100%;
    min-height: 100vh;
    padding: 3em 0;
    background: url("../imagenes/internas/fondo-bailarines.webp") no-repeat 50% 50%;
    background-size: cover;
  }
  #ContentDatosReserva {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  #CardDatosReserva {
    display: block;
    width: 100%;
    max-width: 35em;
  }
  #CardDatosReserva header {
    width: 100%;
    padding: 4em 3.5em 2.5em 3.5em;
    background: url("../imagenes/internas/fondo-datos-reserva.jpg") no-repeat 50% 50%;
    background-size: cover;
  }
  #CardDatosReserva h2.TituloTipoMesa.big span {
    line-height: 1em;
  }
  #CardDatosReserva header p {
    display: block;
    text-align: center;
    font-size: 0.9em;
    color: #ffffff;
  }
  #FormDatosReserva {
    width: 100%;
    padding: 3.5em 3em;
    background-color: #ffffff;
  }
  #FormDatosReserva .TopForm {
    margin-bottom: 1.5em;
  }
  #DetalleTraslado {
    position: relative;
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.3s ease-in-out;
  }
  #FormDatosReserva .radio-group {
    margin-bottom: 1em !important;
  }
  #DropHabitacion,
  #DropOtro {
    position: relative;
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.3s ease-in-out;
  }
  /*open*/
  #DetalleTraslado.open {
    max-height: 20em;
  }
  #DropHabitacion.open,
  #DropOtro.open {
    max-height: 20em;
  }
  /*....*/
  #TotalReserva {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    border-top: 0.06em solid #949494;
    padding-top: 1em;
    padding-bottom: 1em;
  }
  #TotalReserva > p {
    flex: 0 0 auto;
    font-size: 1.25em;
  }
  #TotalReserva .PrecioActual {
    flex: 1;
    justify-content: flex-end;
    text-align: right;
  }
  #CardDatosReserva .siguiente {
    display: block;
    width: 100% !important;
  }
  /*Modal Tutorial*/
  #ContentModalSinLugar {
    position: relative;
    overflow: hidden;
    max-width: 35em;
    padding: 3em;
  }
  #ModalSinLugar > a.CloseModal {
    display: none !important;
  }
  #ContentModalSinLugar p {
    font-size: 1.25em;
    line-height: 1.35em;
    display: block;
    text-align: center;
  }
  .AccionesModal {
    display: flex;
    flex-wrap: wrap;
    margin-top: 1em;
  }
  .AccionesModal a {
    flex: 1;
    margin: 0 0.25em;
  }
  .modalsinlugar #ModalSinLugar {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto;
  }
  .modalsinlugar #ContentModalSinLugar {
    opacity: 1;
    transform: translateY(0);
  }
}
@media (max-width: 990px) {
  #DatosReserva {
    padding-top: 0;
  }
}
@media (max-width: 700px) {
  #CardDatosReserva {
    display: block;
  }
  #CardDatosReserva header {
    display: block;
    width: 100%;
    padding-top: 1.5em;
    padding-bottom: 1.2em;
    background: #000000;
  }
  #FormDatosReserva {
    display: block;
  }
}
@media (max-width: 500px) {
  #DatosReserva {
    background: none;
  }
  .AccionesModal a {
    flex: 1 1 100%;
    margin: 0 0 0.5em 0;
  }
  a#BtnCambiarMesa {
    order: 2;
  }
  a#BtnCambiarFecha {
    order: 1;
  }
}
/*SELECCION UBICACION MESA*/
@media screen {
  #MapaUbicacionMesa {
    height: calc(100vh - 6em);
    background-color: #E2E1E1;
  }
  #MapaMesas {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    height: 100%;
    margin-bottom: auto;
  }
  #Mapa {
    flex: 1;
    height: 100%;
    position: relative;
    overflow: auto;
  }
  #CanvasMapa img {
    max-width: none !important;
    display: block;
  }
  #Navegador {
    flex: 0 0 auto;
    text-align: center;
    padding: 2em 2em;
  }
  #ModuloNavegador {
    width: 100%;
    max-width: 18em;
    margin: 0 auto;
    background-color: #000000;
    border-radius: 0.5em;
  }
  #ContadorInvitados {
    text-align: center;
    padding: 2em 0.5em 1.5em 0.5em;
  }
  #ContadorInvitados p {
    font-size: 1em;
    color: #ffffff;
  }
  #ContadorInvitados span {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin: 0.5em auto;
    width: 2em;
    height: 2em;
    text-align: center;
    font-family: "Roboto-Medium", Arial, Helvetica, sans-serif;
    font-size: 1.25em;
    line-height: 0;
    color: #000000;
    background-color: #AB9553;
    border-radius: 50%;
  }
  #CantidadInvitados {
    padding: 0 0 0.5em 0;
  }
  #CantidadInvitados > p {
    font-size: 0.8em;
    text-align: left;
    color: #b8b8b8;
    padding: 0.5em 0.5em 0.5em 1.5em;
    margin-bottom: 1em;
    border-top: 0.06em solid #222;
    border-bottom: 0.06em solid #222;
  }
  #CantidadInvitados > div {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 0.5em 0;
    padding-left: 1.2em;
  }
  #CantidadInvitados > div > span {
    flex: 0 0 1.8em;
    height: 1.8em;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-family: "Roboto-Medium", Arial, Helvetica, sans-serif;
    font-size: 0.9em;
    line-height: 0;
    color: #000000;
    background-color: #AB9553;
    border-radius: 50%;
  }
  #CantidadInvitados div > p {
    font-size: 0.9em;
    color: #ffffff;
    margin-left: 0.5em;
  }
  #PlanoGeneral {
    margin-top: 1em;
    max-width: 12em;
  }
  #PlanoGeneral #BtnTriggerPlano {
    display: block;
    font-size: 0.7em;
    padding: 1em 0;
    color: #ffffff;
  }
  /*Modal Tutorial*/
  #ContentModalTutorial {
    position: relative;
    overflow: hidden;
    max-width: 35em;
    padding: 3em;
  }
  #ModalTutorial > a.CloseModal {
    display: none !important;
  }
  p.TituloModal {
    font-family: "Raleway-bold", Arial, Helvetica, sans-serif;
    font-size: 1.5em;
    display: block;
    padding-left: 3.3em;
  }
  ul#ListaTutorial {
    display: block;
  }
  ul#ListaTutorial li {
    margin: 2em 0;
    display: flex;
    flex-wrap: wrap;
  }
  ul#ListaTutorial figure {
    flex: 0 0 5em;
  }
  ul#ListaTutorial p {
    flex: 1;
    font-size: 1em;
    line-height: 1.5em;
  }
  a#BtnComenzar {
    margin-left: 5em;
  }
  .modaltutorial #ModalTutorial {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto;
  }
  .modaltutorial #ContentModalTutorial {
    opacity: 1;
    transform: translateY(0);
  }
  /*Modal Ubicacion*/
  #ContentModalUbicacion {
    width: auto;
    padding: 3em;
  }
  p.NumeroMesa {
    display: block;
    font: normal 1.9em "Raleway-bold", Arial, Helvetica, sans-serif;
  }
  p.LeyendaUbicacion {
    display: block;
    margin: 0.5em 0 1.5em 0;
  }
  #ModalUbicacion .AccionesForm a {
    margin-right: 0.5em;
  }
  .modalubicacion #ModalUbicacion {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto;
  }
  .modalubicacion #ContentModalUbicacion {
    opacity: 1;
    transform: translateY(0);
  }
  /*Modal Fin de Reserva*/
  #ContentModalFinReserva {
    width: auto;
    padding: 3em;
    background-color: #000000;
    text-align: center;
  }
  #ContentModalFinReserva figure {
    text-align: center;
  }
  #ContentModalFinReserva img {
    margin: 0 auto;
  }
  p.LeyendaFinReserva {
    display: block;
    margin: 1em 0;
    font-size: 1.5em;
    color: #ffffff;
  }
  a#BtnModificarReserva {
    display: block;
    margin-top: 1.5em;
    color: #ffffff;
  }
  .modalfinreserva #ModalFinReserva {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto;
  }
  .modalfinreserva #ContentModalFinReserva {
    opacity: 1;
    transform: translateY(0);
  }
  /*.............*/
}
/*HOVER EFFECTS*/
@media (hover: hover) and (pointer: fine) {
  #BtnFinalizarReserva:hover {
    border-color: #000000;
    color: #AB9553;
    background-color: #000000;
  }
  a#BtnModificarReserva:hover {
    color: #949494;
  }
}
@media (max-width: 990px) {
  #MapaMesas {
    flex-direction: column;
    height: calc(100vh - 11em);
  }
  #Mapa {
    width: 100%;
  }
  #Navegador {
    width: 100%;
    padding: 0.5em;
  }
  #ContadorInvitados p.TituloInvitados,
  #CantidadInvitados,
  #PlanoGeneral {
    display: none;
  }
  #ModuloNavegador {
    width: auto;
    display: inline-block;
    max-width: none;
    padding: 0 1em;
  }
  #ContadorInvitados {
    display: inline-flex;
    align-items: center;
    padding: 0.5em;
  }
  #ContadorInvitados p {
    flex: 1;
    text-align: left;
    margin-left: 0.5em;
  }
}
@media (max-width: 550px) {
  #ContentModalTutorial {
    display: block;
  }
  #ModalTxt a {
    display: block;
    width: 100%;
  }
  /*Modal Tutorial*/
  p.TituloModal {
    padding-left: 0;
  }
  ul#ListaTutorial li {
    display: block;
  }
  ul#ListaTutorial p {
    font-size: 0.9em;
  }
  a#BtnComenzar {
    margin-left: 0;
    display: block;
  }
}
/*CARRITO*/
@media screen {
  #CheckCarrito {
    width: 100%;
    padding: 3em 0;
    background-color: #f1f1f1;
  }
  #ContentCheckCarrito {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  #CardCarrito {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    max-width: 49em;
  }
  #CardCarrito header {
    flex: 0 0 auto;
    width: 340px;
    padding: 4em 3.5em 2.5em 3.5em;
    background: #000000 url("../imagenes/internas/fondo-carrito.jpg") no-repeat 50% 0;
    background-size: 100% auto;
  }
  #TipoReserva {
    text-align: center;
  }
  #CardCarrito h2 {
    line-height: 3.2em;
  }
  p.CantidadReserva {
    text-align: center;
    font: normal 1.15em "Roboto-Medium", Arial, Helvetica, sans-serif;
    color: #ffffff;
  }
  a#BtnDropReserva {
    display: none;
  }
  #InfoReserva {
    margin: 2em 0 1em 0;
  }
  p.TituloInfo {
    font-size: 0.8em;
    color: #949494;
    padding: 0.25em;
    border-top: 0.06em solid #464646;
    border-bottom: 0.06em solid #464646;
  }
  .ListaInfo {
    margin: 1em 0 2em 0;
  }
  .ListaInfo li {
    display: block;
    padding: 0.35em 0;
  }
  #InfoReserva .ListaInfo li {
    padding-left: 2em;
    background-repeat: no-repeat;
    background-position: 0 0.35em;
    background-size: 1.3em auto;
  }
  .ListaInfo li.InfoFecha {
    background-image: url("../imagenes/internas/ic-calendario.svg");
  }
  .ListaInfo li.InfoHora {
    background-image: url("../imagenes/internas/ic-reloj.svg");
  }
  .ListaInfo li.InfoSede {
    background-image: url("../imagenes/internas/ic-pin.svg");
  }
  .ListaInfo li.InfoTipoMesa {
    background-image: url("../imagenes/internas/ic-fecha.svg");
  }
  #InfoInvitados .ListaInfo li {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }
  #InfoInvitados .ListaInfo span {
    flex: 0 0 1.5em;
    height: 1.5em;
    background-color: #AB9553;
    font-family: "Roboto-Medium", Arial, Helvetica, sans-serif;
    color: #000000;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .ListaInfo p {
    font-size: 1em;
    color: #ffffff;
  }
  #InfoInvitados .ListaInfo p {
    flex: 1;
    margin-left: 0.5em;
  }
  #FormCarrito {
    flex: 1;
    padding: 3.5em 3em;
    background-color: #ffffff;
  }
  #Timer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 1em;
    margin-bottom: 1.5em;
    border-radius: 0.5em;
    background-color: #000000;
  }
  p#LeyendaTimer {
    flex: 1;
    font-size: 0.8em;
    text-align: left;
    color: #ffffff;
  }
  p#CuentaRegresiva {
    flex: 0 0 5em;
    font: normal 1.25em "Roboto-Medium", Arial, Helvetica, sans-serif;
    text-align: center;
    padding: 0.25em 1em;
    border-radius: 0.5em;
    background-color: #AB9553;
  }
  #GiftCode,
  #GiftAdd {
    display: block;
    margin-top: 2em;
  }
  #ResumenInvitados {
    margin-top: 1.5em;
  }
  #ResumenInvitados > div {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    margin-bottom: 0.8em;
  }
  #ResumenInvitados > div p:first-child {
    flex: 0 0 auto;
    font-family: "Roboto-Regular", Arial, Helvetica, sans-serif;
  }
  #ResumenInvitados > div p:last-child {
    flex: 1;
    text-align: right;
    font-family: "Roboto-Medium", Arial, Helvetica, sans-serif;
  }
  #ResumenSubTotal {
    padding: 0.5em 0;
    border-top: 0.06em solid #949494;
    border-bottom: 0.06em solid #949494;
  }
  #ResumenSubTotal > div {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    width: 100%;
    padding: 0.4em 0;
  }
  #ResumenSubTotal > div p:first-child {
    flex: 0 0 auto;
    font-family: "Roboto-Regular", Arial, Helvetica, sans-serif;
  }
  #ResumenSubTotal > div p:last-child {
    flex: 1;
    text-align: right;
    font-family: "Roboto-Medium", Arial, Helvetica, sans-serif;
  }
  #ResumenTotal p {
    font-size: 1.25em;
  }
  #MediosPago {
    margin-top: 2.5em;
  }
  #MediosPago p {
    font-size: 0.9em;
  }
  #MediosPago a {
    display: block;
    height: 3.5em;
    margin: 0.5em 0;
    border-radius: 0.5em;
  }
  a#BtnMercadoPago {
    border: 0.06em solid #b8b8b8;
    background: url("../imagenes/internas/ic-mercado-pago.png") no-repeat 50% 50%;
  }
  a#BtnPayPal {
    background: #FFC439 url("../imagenes/internas/ic-paypal.png") no-repeat 50% 50%;
  }
  #FormCarrito .AccionesForm {
    margin-top: 2em;
  }
  #FormCarrito .AccionesForm input[type=submit] {
    display: block;
  }
  /*modal*/
  #ContentModalModificarReserva {
    max-width: 30em;
    text-align: center;
    padding: 2em;
  }
  #ContentModalModificarReserva p {
    font-size: 1em;
    display: block;
    margin: 0 auto 1em auto;
  }
  #ContentModalModificarReserva a {
    display: inline-block;
    margin: 0 auto;
  }
  .modalmodificarreserva #ModalModificarReserva {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto;
  }
  .modalmodificarreserva #ContentModalModificarReserva {
    transform: translateY(0);
  }
}
@media (max-width: 850px) {
  p#LeyendaTimer {
    flex: 1 1 100%;
    margin-bottom: 0.5em;
  }
  p#CuentaRegresiva {
    flex: 1 1 100%;
  }
  p#LeyendaTimer br {
    display: none;
  }
}
@media (max-width: 750px) {
  #CardCarrito {
    display: block;
  }
  #CardCarrito header {
    width: 100%;
  }
}
@media (max-width: 500px) {
  #CheckCarrito {
    padding: 0;
  }
  #ContentCheckCarrito {
    padding: 0;
  }
  a#BtnDropReserva {
    display: inline-block;
    margin: 1.5em auto 0 auto;
  }
  #DropReserva {
    position: relative;
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.7s ease-in-out;
  }
  /*open*/
  #CardCarrito.open #DropReserva {
    max-height: 80em;
  }
  #CardCarrito.open a#BtnDropReserva span {
    display: none;
  }
  #CardCarrito.open a#BtnDropReserva::after {
    content: "Cerrar";
    display: block;
    font-size: 1em;
    color: #ffffff;
  }
  /*....*/
  #FormCarrito {
    padding-top: 1.5em;
    padding-left: 1.5em;
    padding-right: 1.5em;
  }
  #ResumenReserva {
    margin-top: 2em;
  }
  #GiftCode {
    margin-top: 1em;
  }
}
/*RESERVA OK*/
@media screen {
  #MensajeReserva {
    width: 100%;
    padding: 3em 0;
    background-color: #f1f1f1;
  }
  #ContentMensajeReserva {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  .CardMensajeReserva {
    width: -moz-fit-content;
    width: fit-content;
    max-width: 31em;
    text-align: center;
    padding: 4em 2em 3em 2em;
    background: #000000 url("../imagenes/fondo-login.jpg") no-repeat 50% 0;
    border: 0.06em solid #333333;
  }
  .Cartel {
    width: 4.7em;
    margin: 0 auto;
  }
  .CardMensajeReserva h2 {
    display: block;
    margin-top: 0.3em;
    font: normal 3.1em "GreatVibes-regular", Arial, Helvetica, sans-serif;
    color: #ffffff;
  }
  .CardMensajeReserva h3 {
    font-size: 1.9em;
    color: #AB9553;
  }
  .CardMensajeReserva div {
    display: block;
    padding-top: 1.5em;
  }
  .CardMensajeReserva p {
    display: block;
    margin-bottom: 1.5em;
    font-size: 1em;
    color: #ffffff;
  }
}
/*CONTACTO*/
/*REGISTRO COMPLETO - REGISTRO RAPIDO - RECUPERAR CONTRASEÑA - LOGIN*/
@media screen {
  #ModuloCuenta {
    width: 100%; /*min-height: 100vh;*/
    padding: 3em 0;
    background-color: #E2E1E1;
  }
  #ContentModuloCuenta {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  #ModuloForm {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    max-width: 47em;
  }
  #FormFoto {
    flex: 1;
    padding: 2.5em 3.5em;
    background: url("../imagenes/internas/fondo-cuenta.jpg") no-repeat 50% 50%;
    background-size: cover;
  }
  #FormCuenta {
    flex: 2;
    padding: 3.25em 3em;
    background-color: #ffffff;
  }
  #FormCuenta .TopForm {
    margin-bottom: 1.5em;
  }
  p.LeyendaForm {
    font-size: 0.8em;
  }
  .DestacadoExterno {
    display: flex;
    flex-wrap: wrap;
    margin: 0.5em 0 0 0;
    padding: 1em;
    background-color: #f2f2f2;
    border-radius: 0.5em;
  }
  .DestacadoExterno p {
    font-size: 0.8em;
    color: #333333;
  }
  .DestacadoExterno a {
    margin-left: 0.5em;
    font: normal 0.8em "Raleway-bold", Arial, Helvetica, sans-serif;
    color: #AB9553;
    text-decoration: underline !important;
  }
  #FormCuenta .AccionesForm input[type=submit] {
    width: 100% !important;
  }
  #ExtraForm {
    margin-top: 1.5em;
  }
  #ExtraForm div {
    display: flex;
    align-items: baseline;
  }
  #RecuperarPass {
    justify-content: center;
    margin-bottom: 1.5em;
  }
  #AccionExterna {
    border-top: 0.06em solid #b8b8b8;
    padding-top: 1em;
  }
  #ExtraForm p,
  #ExtraForm a {
    font-size: 0.9em;
    flex: 0 0 auto;
  }
  #ExtraForm a {
    margin-left: 0.5em;
    font: normal 0.9em "Raleway-bold", Arial, Helvetica, sans-serif;
    color: #AB9553;
    text-decoration: underline !important;
  }
  /*LOGIN*/
  #ModuloLogin {
    width: 100%;
    max-width: 26em;
    margin: 0 auto;
  }
  #LoginFoto {
    flex: 1 1 100%;
    background: none;
    padding: 0;
  }
  /*RECUPERAR*/
  p.LeyendaRecuperar {
    display: block;
    font-size: 0.8em;
    margin-bottom: 2em;
  }
  div[data-id=RecuperarPass] input#email {
    margin-bottom: 0.5em;
  }
}
@media (max-width: 700px) {
  #ModuloCuenta,
  #ContentModuloCuenta {
    padding: 0 !important;
  }
  #FormFoto {
    display: none;
  }
  #FormCuenta {
    padding: 2.5em 2.5em 3.5em 2.5em;
  }
  /*LOGIN*/
  #ModuloLogin {
    width: 100%;
    max-width: none;
  }
  #LoginFoto {
    display: none;
  }
}
/*CUENTA*/
@media screen {
  #MainCuenta {
    display: flex;
  }
  #BarraAuxiliar {
    flex: 0 0 auto;
    padding: 3em;
    background-color: #ffffff;
  }
  #BarraAuxiliar p {
    font-size: 1.25em;
  }
  #BarraAuxiliar p#NombreCuenta {
    font-size: 1.9em;
  }
  #NavCuenta {
    display: block;
    padding-top: 2em;
  }
  #NavCuenta a {
    display: block;
    font-size: 0.9em;
    line-height: 1.3em;
    color: #000000;
    padding: 1em 0 1em 2em;
  }
  a#BtnCuentaMisDatos {
    background: url("../imagenes/ic-perfil-clean.svg") no-repeat 0 50%, url("../imagenes/ic-perfil-clean-dorado.svg") no-repeat 0 50em;
  }
  a#BtnCuentaMisReservas {
    background: url("../imagenes/ic-pin-clean.svg") no-repeat 0 50%, url("../imagenes/ic-pin.svg") no-repeat 0 50em;
  }
  #NavCuenta a.select {
    color: #AB9553 !important;
    background-position: 0 50em, 0 50% !important;
  }
  #ContentCuenta {
    flex: 1;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    background-color: #F1F1F1;
    padding: 3em;
  }
  #TopCuenta {
    flex: 1 1 100%;
    text-align: left;
  }
  .FilterBarForm form div.fila-campos {
    align-items: flex-end;
  }
  .FilterBarForm form div.fila-campos span {
    flex: 0 0 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-right: 2em;
  }
  .FilterBarForm form div.fila-campos span.campo-full {
    flex: 1 !important;
    max-width: 25em;
  }
  .FilterBarForm form div.fila-campos span:last-child {
    margin-right: 0;
  }
  .FilterBarForm form label {
    flex: 0 0 auto;
    margin-right: 0.5em;
    margin-bottom: 0;
  }
  .FilterBarForm form input.primary,
  .FilterBarForm form select.primary {
    flex: 1;
    margin-bottom: 0;
    max-width: none !important;
  }
  #BottomCuenta {
    flex: 1 1 100%;
  }
}
@media (max-width: 1600px) {
  .FilterBarForm form label {
    max-width: 7em;
  }
}
@media (max-width: 1450px) {
  #MainCuenta {
    flex-direction: column;
  }
  #BarraAuxiliar {
    padding: 1em 2em;
  }
  #BarraAuxiliar p {
    display: none;
  }
  #NavCuenta {
    display: flex;
    justify-content: center;
    padding-top: 0;
  }
  #NavCuenta a {
    flex: 0 0 auto;
    margin: 0 2em;
  }
  #ContentCuenta {
    flex: 0 0 auto;
    display: block;
    text-align: center;
    padding: 2em;
  }
}
@media (max-width: 1300px) {
  .FilterBarForm form label {
    max-width: none;
    margin-bottom: 0.5em;
  }
  .FilterBarForm form div.fila-campos span {
    display: block;
    margin-bottom: 1em;
  }
  .FilterBarForm form div.fila-campos span.campo-full {
    flex: 1 1 100% !important;
    max-width: none;
    margin-right: 0;
  }
}
@media (max-width: 700px) {
  #BarraAuxiliar {
    padding-left: 0;
    padding-right: 0;
  }
  #NavCuenta a {
    flex: 0 0 auto;
    font-size: 0.9em;
    line-height: 1.2em;
    margin: 0 1.5em;
    padding: 2em 0 0 0;
  }
  #NavCuenta a[id] {
    background-position: 50% 0, 50% 50em;
  }
  #NavCuenta a[id].select {
    background-position: 50% 50em, 50% 0 !important;
  }
  .FilterBarForm form div.fila-campos span {
    flex: 1 1 100% !important;
    max-width: none;
    margin-right: 0;
  }
}
@media (max-width: 500px) {
  #BarraAuxiliar {
    background-color: #f2f2f2;
  }
  #ContentCuenta {
    padding: 0;
  }
  #TopCuenta {
    padding: 1.5em 1.5em 0 1.5em;
  }
  #BottomCuenta {
    padding: 1.5em 1.5em 4em 1.5em;
  }
  .FilterBarForm form div.fila-campos {
    margin-bottom: 0 !important;
  }
}
/*MIS DATOS*/
@media screen {
  #ModuloPerfil {
    width: 100%;
    max-width: 30em;
    margin: 0 auto;
    text-align: left;
    background-color: #ffffff;
    padding: 3em;
  }
  #TopContentCuenta {
    display: block;
    margin-bottom: 1.5em;
  }
  #TopContentCuenta p {
    font-size: 1.25em;
  }
}
@media (max-width: 500px) {
  #ContentCuenta input[type=submit].primary {
    display: block;
    width: 100% !important;
  }
}
/*MIS RESERVAS*/
@media screen {
  #GrupoReservas {
    width: 100%;
    max-width: 60em;
  }
  .CardReserva {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
  }
  main .CardReserva {
    margin-bottom: 1em;
  }
  .CardReserva header {
    flex: 0 0 10em;
    padding: 2em 0.5em;
    background: #000000 url("../imagenes/internas/fondo-card-reserva.jpg") no-repeat 50% 50%;
    background-size: cover;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .CardReserva header span {
    font-size: 3.1em;
    color: #DBBE68;
  }
  .InfoReserva {
    flex: 1;
    padding: 2em;
    display: flex;
    flex-wrap: wrap;
    text-align: left;
    background-color: #ffffff;
  }
  .DataReserva {
    flex: 1;
  }
  .TopDataReserva {
    margin-bottom: 0.5em;
  }
  .TopDataReserva .CodigoReserva {
    font-size: 0.9em;
    padding-left: 3em;
  }
  .TopDataReserva a {
    display: inline-block;
    margin-left: 1em;
    text-decoration: underline !important;
    font-size: 0.8em;
    color: #000000;
  }
  .BottomDataReserva {
    display: flex;
    flex-wrap: wrap;
  }
  .BottomDataReserva > div > p {
    font-size: 0.8em;
    display: block;
    margin-bottom: 1em;
  }
  .DatosReserva {
    flex: 1;
    max-width: 14em;
    padding-right: 2em;
  }
  .ListaReserva li {
    padding: 0.3em 0 0.3em 2em;
    background-repeat: no-repeat;
    background-position: 0 0.35em;
    background-size: 1.3em auto;
  }
  .ListaReserva li.InfoFecha {
    background-image: url("../imagenes/internas/ic-calendario.svg");
  }
  .ListaReserva li.InfoHora {
    background-image: url("../imagenes/internas/ic-reloj.svg");
  }
  .ListaReserva li.InfoSede {
    background-image: url("../imagenes/internas/ic-pin.svg");
  }
  .ListaReserva li.InfoTipoMesa {
    background-image: url("../imagenes/internas/ic-fecha.svg");
  }
  .ListaReserva p {
    font-size: 0.9em;
  }
  .InvitadosReserva {
    flex: 1;
    max-width: 14em;
    padding-right: 2em;
  }
  .ListaInvitadosReserva li {
    display: flex;
    align-items: center;
    margin-bottom: 0.5em;
  }
  .ListaInvitadosReserva span {
    flex: 0 0 1.5em;
    height: 1.5em;
    margin-right: 0.5em;
    background-color: #AB9553;
    font: normal 0.9em "Roboto-Medium", Arial, Helvetica, sans-serif;
    color: #000000;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .ListaInvitadosReserva p {
    font-size: 0.9em;
  }
  .PrecioReserva {
    flex: 1;
  }
  .PrecioReserva .PrecioActual > * {
    color: #000000;
  }
  p.TagEstado {
    display: inline-block !important;
    font-size: 0.8em;
    padding: 0.5em;
    text-align: center;
    background-color: #F1F1F1;
    background-repeat: no-repeat;
    background-position: 0.5em 50%;
    background-size: 1em auto;
    border-radius: 0.5em;
  }
  .PrecioReserva a {
    display: block;
    margin-top: 1em;
    text-decoration: underline !important;
    font-size: 0.8em;
    color: #000000;
  }
  /*ESTADOS*/
  /*reservado*/
  article[data-estado=reservado] p.TagEstado {
    padding-left: 2em;
    background-image: url("../imagenes/ic-ok.svg");
    color: #3E9900;
  }
  /*pendiente*/
  article[data-estado=pendiente] p.TagEstado {
    color: #FF7600;
  }
  /*pasado*/
  article[data-estado=pasado] .InfoReserva {
    filter: grayscale(100%);
  }
  article[data-estado=pasado] p.TagEstado {
    color: #000000;
  }
  article[data-estado=pasado] .PrecioReserva .PrecioActual > * {
    color: #b8b8b8 !important;
  }
}
@media (max-width: 1450px) {
  #GrupoReservas {
    margin: 0 auto;
    display: grid;
    gap: 1em;
    grid-template-columns: repeat(auto-fill, minmax(18em, 1fr));
  }
  .CardReserva {
    flex-direction: column;
  }
  .CardReserva header {
    background-size: cover;
    background-position: 0 0;
  }
  .InfoReserva {
    flex: 1;
    display: flex;
    flex-direction: column;
  }
  .DataReserva {
    display: flex;
    flex-direction: column;
  }
  .TopDataReserva {
    flex: 0 0 auto;
  }
  .TopDataReserva a {
    display: block;
    margin-left: 0;
    margin-bottom: 1em;
  }
  .BottomDataReserva {
    flex: 1;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
  }
  .DatosReserva {
    flex: 0 0 auto;
    max-width: none;
    margin-bottom: 2em;
  }
  .InvitadosReserva {
    flex: 1;
    max-width: none;
    margin-bottom: 2em;
  }
  .PrecioReserva {
    flex: 0 0 8em;
  }
}
@media (max-width: 500px) {
  #GrupoReservas {
    padding-top: 1em;
    padding-left: 1.5em;
    padding-right: 1.5em;
  }
  .CardReserva header {
    flex: 0 0 5em;
  }
}
/*CANCELAR RESERVAS*/
@media screen {
  .CodigoReserva {
    display: inline-block;
    padding: 0.5em 1em 0.5em 2.5em;
    font: normal 1.25em "Roboto-Regular", Arial, Helvetica, sans-serif;
    color: #ffffff;
    background: #AB9553 url("../imagenes/internas/ic-code.svg") no-repeat 1em 50%;
    margin-bottom: 1em;
  }
  div[data-id=CancelarReserva] .AccionesForm {
    display: flex;
    flex-wrap: wrap;
  }
  div[data-id=CancelarReserva] .AccionesForm a {
    flex: 0 0 auto;
  }
  div[data-id=CancelarReserva] .AccionesForm input[type=submit] {
    flex: 1;
    margin-left: 0.5em;
  }
}/*# sourceMappingURL=main.css.map */