/* Bison Motorhomes: static restoration of the Wix site (home page, 2021 to 2024).
   Layout, sizes and colours are carried over from the original theme:
   980px column, transparent header over a fixed full-page photo, Anton menu,
   thin slab headline in white, Futura tagline, translucent white footer strip.
   The Wix-licensed faces (Museo Slab 100, Futura LT Book) are replaced by
   open-licence look-alikes (Roboto Slab Thin, Jost). Anton, Niconne and
   Open Sans are the faces the original used. */

@font-face { font-family: "Anton"; src: url("../fonts/anton-400-latin.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Niconne"; src: url("../fonts/niconne-400-latin.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Open Sans"; src: url("../fonts/opensans-400-latin.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Roboto Slab"; src: url("../fonts/robotoslab-100-latin.woff2") format("woff2"); font-weight: 100; font-style: normal; font-display: swap; }
@font-face { font-family: "Jost"; src: url("../fonts/jost-400-latin.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }

:root {
  --color_2: 0, 0, 0;
  --color_11: 255, 255, 255;
  --color_12: 209, 209, 209;
  --color_13: 143, 142, 142;
  --color_15: 42, 42, 42;
  --color_19: 6, 158, 192;
  --site-width: 980px;
  --font-slab: "Roboto Slab", "museo-slab-w01-100", Rockwell, serif;
  --font-futura: Futura, "Jost", "Century Gothic", sans-serif;
}

html, body { margin: 0; padding: 0; }
body {
  font-size: 10px;
  font-family: Arial, Helvetica, sans-serif;
  color: rgb(var(--color_2));
  background-color: rgb(var(--color_12));
  min-height: 100%;
}
h1, h2, h3, h4, h5, h6, p, ul, li { margin: 0; padding: 0; }
ul { list-style: none; }
a { color: inherit; }

/* Page background: the original photo, fixed behind the whole page */
#pageBackground {
  position: fixed;
  inset: 0;
  z-index: -1;
  background: rgb(var(--color_12)) url("../images/bison-motorhomes-background.jpg") center center / cover no-repeat;
}

/* Restoration notice (added) */
.restore-notice {
  background: rgba(255, 255, 255, 0.94);
  border-bottom: 2px solid rgb(var(--color_13));
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
  padding: 10px 16px;
}
.restore-notice p {
  max-width: var(--site-width);
  margin: 0 auto;
  font: normal normal normal 14px/1.45 "Open Sans", Arial, sans-serif;
  color: rgb(var(--color_15));
  text-align: center;
}

.inner {
  width: var(--site-width);
  max-width: 100%;
  margin: 0 auto;
  box-sizing: border-box;
}

/* Header: centred logo (139x170, shown from its 2x file) and the menu below it */
.site-logo {
  display: block;
  width: 139px;
  height: 170px;
  margin: 0 auto -7px;
}
.site-logo img {
  display: block;
  width: 139px;
  height: 170px;
  object-fit: cover;
}
#DrpDwnMn1 { margin: 12px 0 8px; }
#DrpDwnMn1 ul {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  text-align: center;
}
#DrpDwnMn1 li { padding: 0 5px; }
#DrpDwnMn1 a {
  display: block;
  font: normal normal normal 20px/1.4em "Anton", Impact, sans-serif;
  color: rgb(var(--color_2));
  text-decoration: none;
  transition: color 0.4s ease 0s;
}
#DrpDwnMn1 a:hover,
#DrpDwnMn1 li.selected a { color: rgb(var(--color_19)); }

/* Main page content */
#PAGES_CONTAINER { min-height: 500px; }
.font_3 {
  font: normal normal 100 100px/0.8em var(--font-slab);
  color: rgb(var(--color_11));
  letter-spacing: 0em;
}
.explore {
  width: 700px;
  max-width: 100%;
  margin: 28px auto 18px;
  text-align: center;
}
.tagline {
  width: 884px;
  max-width: 100%;
  margin: 0 auto;
  font: normal normal normal 23px/normal var(--font-futura);
  color: #292929;
  text-align: center;
}

/* Added closing section with the outbound links, in the footer strip's style */
.touring {
  width: 700px;
  max-width: 100%;
  box-sizing: border-box;
  margin: 46px auto 0;
  padding: 22px 32px 24px;
  background: rgba(255, 255, 255, 0.82);
  border-bottom: 2px solid rgb(var(--color_13));
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.6), inset 0 -1px 1px rgba(0, 0, 0, 0.6), 0 0 5px rgba(0, 0, 0, 0.6);
  text-align: center;
}
.touring h2 {
  font: normal normal normal 30px/1.2em "Niconne", cursive;
  color: rgb(var(--color_2));
  margin-bottom: 8px;
}
.touring p {
  font: normal normal normal 15px/1.6 "Open Sans", Arial, sans-serif;
  color: rgb(var(--color_15));
}
.touring a { color: rgb(var(--color_15)); text-decoration: underline; }
.touring a:hover { color: rgb(var(--color_19)); }

/* Footer: translucent strip with the "Find us" block */
#SITE_FOOTER { min-height: 316px; }
.strip {
  margin-top: 53px;
  height: 103px;
  background: rgba(var(--color_11), 0.5);
  border-bottom: 2px solid rgb(var(--color_13));
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.6), inset 0 -1px 1px rgba(0, 0, 0, 0.6), 0 0 5px rgba(0, 0, 0, 0.6);
  display: flex;
  align-items: center;
}
.find-us { width: 160px; margin: 0 auto; text-align: center; }
.font_6 {
  font: normal normal normal 18px/1.3em "Niconne", cursive;
  color: rgb(var(--color_2));
}
.font_8 {
  font: normal normal normal 14px/1.3em "Open Sans", Arial, sans-serif;
  color: rgb(var(--color_2));
}

/* 404 page */
.notfound p { margin-top: 10px; }

/* Phones: the original was a fixed 980px Wix layout; this only stops it breaking */
@media (max-width: 1000px) {
  .inner { padding-left: 16px; padding-right: 16px; }
}
@media (max-width: 760px) {
  .font_3 { font-size: 56px; }
  .explore { margin-top: 20px; }
  .tagline { font-size: 19px; }
  #DrpDwnMn1 a { font-size: 18px; }
  .touring { padding: 18px 18px 20px; margin-top: 32px; }
  .touring h2 { font-size: 27px; }
}
@media (max-width: 400px) {
  .font_3 { font-size: 46px; }
}
