:root {
  --color-primary: 215, 24, 42;
  --color-primary-alt: 207, 16, 34;
  --font-sans: 'Avenir Next';
  --font-serif: 'Georgia';
  --font-mono: 'Menlo';
  --font-headline: 'Avenir Next';
  --font-headline-brand: 'Avenir Next';
}

@font-face {
  font-family: 'Avenir Next';
  font-weight: 400;
  font-display: swap;
  src: url('/modules/assets/fonts/avenir-next/regular.woff') format('woff'),
    url('/modules/assets/fonts/avenir-next/regular.woff2') format('woff2');
}

h1,
h2,
h3,
h4,
h1 span,
h2 span,
h3 span,
h4 span {
  font-weight: 400 !important;
  text-transform: uppercase;
}

.font-black {
  font-weight: 700;
}

.btn {
  border-radius: 0px;
  font-size: 1rem;
  line-height: 1.5rem;
  text-transform: uppercase;
  font-weight: 400;
  cursor: pointer;
}

.btn-primary {
  color: #fcfcfc;
  background-color: rgb(var(--color-primary));
  border-color: rgb(var(--color-primary));
}

.btn-primary:hover {
  color: #fcfcfc;
  background-color: #000000;
  border-color: #000000;
}

.btn-primary-outline {
  color: rgb(var(--color-primary));
  background-color: transparent;
  border-color: rgb(var(--color-primary));
}

.btn-primary-outline:hover {
  color: #fcfcfc;
  background-color: rgb(var(--color-primary));
  border-color: rgb(var(--color-primary));
}

.btn-secondary {
  color: #fcfcfc;
  background-color: #2a2a2a;
  border-color: #2a2a2a;
}

.btn-secondary:hover {
  color: #fcfcfc;
  background-color: rgb(var(--color-primary));
  border-color: rgb(var(--color-primary));
}

.btn-secondary-outline {
  color: #2a2a2a;
  background-color: transparent;
  border-color: #2a2a2a;
}

.btn-secondary-outline:hover {
  color: #fcfcfc;
  background-color: #2a2a2a;
  border-color: #2a2a2a;
}

.btn-black {
  color: #fcfcfc;
  background-color: #000000;
  border-color: #000000;
}

.btn-black:hover {
  color: #000000;
  background-color: #fcfcfc;
  border-color: #fcfcfc;
}

.btn-black-outline {
  color: #000000;
  background-color: transparent;
  border-color: #000000;
}

.btn-black-outline:hover {
  color: #fcfcfc;
  background-color: #000000;
  border-color: #000000;
}

.btn-white {
  color: #000000;
  background-color: #fcfcfc;
  border-color: #fcfcfc;
}

.btn-white:hover {
  color: #fcfcfc;
  background-color: #000000;
  border-color: #000000;
}

.btn-white-outline {
  color: #fcfcfc;
  background-color: transparent;
  border-color: #fcfcfc;
}

.btn-white-outline:hover {
  color: #000000;
  background-color: #fcfcfc;
  border-color: #fcfcfc;
}

/* Composible search form styles */
select[data-osc-product='osc-hotel-select'] {
  border-radius: 0px;
  font-weight: 500;
}

button[data-osc-product='search-form-dates'] .font-bold,
[data-osc-product='search-rooms-button'] button,
[data-osc-product='search-rates-button'] button,
button[data-osc-product='shop-form-button'] {
  font-weight: 500;
}

button[data-osc-product='search-form-dates'] > div {
  border-color: rgb(215, 24, 42) !important;
}

[data-osc-product='search-rooms-button'] button,
[data-osc-product='search-rates-button'] button,
[data-osc-product='osc-hotel-select'] {
  padding-top: 0.875rem;
  padding-bottom: 0.875rem;
  text-transform: none !important;
}

@media screen and (min-width: 1024px) {
  [data-osc-product='shop-form-button'] {
    margin-top: 1.5rem;
    padding-top: 0.875rem;
    padding-bottom: 0.875rem;
  }
}

[data-osc-product='shop-form-button'] {
  align-self: flex-end;
  padding-top: 0.875rem;
  padding-bottom: 0.875rem;
}

@media (min-width: 1024px) {

  [data-osc-product='search-rooms-button'],
[data-osc-product='search-rates-button'] {
    margin: 0px;
    padding: 0px;
  }
}

[data-element-id='gallery-item-heading'] {
  font-size: 1.5rem;
  line-height: 2rem;
}

/* MEETINGS GROUP */
[data-osc='meetings-group'] h2 {
  font-size: 20px !important;
}

[data-osc='meetings-group'] > div > div {
  max-width: none;
}

@media (min-width: 768px) {
  [data-osc='meetings-group'] > div > div {
    max-width: 26rem;
  }
}