@font-face {
  font-family: 'fontello';
  src: url('data:application/octet-stream;base64,d09GRgABAAAAAAx0AA8AAAAAFVwAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABHU1VCAAABWAAAADsAAABUIIslek9TLzIAAAGUAAAAQgAAAFZWZmEIY21hcAAAAdgAAABeAAABhgMiBVpjdnQgAAACOAAAABQAAAAoDX/91GZwZ20AAAJMAAAFkAAAC3CKkZBZZ2FzcAAAB9wAAAAIAAAACAAAABBnbHlmAAAH5AAAAfAAAAJi9VKj7mhlYWQAAAnUAAAAMAAAADYXdYf1aGhlYQAACgQAAAAbAAAAJAc8A1ZobXR4AAAKIAAAAAwAAAAMCW4AAGxvY2EAAAosAAAACAAAAAgAQgExbWF4cAAACjQAAAAgAAAAIADVDB5uYW1lAAAKVAAAAXQAAALNzZ0XGHBvc3QAAAvIAAAALwAAAEDcKrkUcHJlcAAAC/gAAAB6AAAAhudDLb54nGNgZGBg4GIwYLBjYHJx8wlh4MtJLMljkGJgYYAAkDwymzEnMz2RgQPGA8qxgGkOIGaDiAIAJjsFSAB4nGNgZFZlnMDAysDAVMW0h4GBoQdCMz5gMGRkAooysDIzYAUBaa4pDA4MbgzBzEH/sxiimIMZpgOFGUFyALEQCh0AAHicvY/BDYAwDAMvaekDMQgP5ugC/fBi/y2KGxWJARCWHMtOFCXAAiTxEDPYhTFwKrXIE2vkOWaK1HAqrXf5RzWiXgl1lcJHsLfxr7b+gi3qPt24vU6Op9qk30Z1CH0AAHicY2BAAxIQyBz8PxMZAwA/KAdZeJytVml300YUHXlJnIQsJQstamHExGmwRiZswYAJQbJjIF2crZWgixQ76b7xid/gX/Nk2nPoN35a7xsvJJC053Cak6N3583VzNtlElqS2AvrkZSbL8XU1iaN7DwJ6YZNy1F8KDt7IWWKyd8FURCtltq3HYdERCJQta6wRBD7HlmaZHzoUUbLtqRXTcotPekuW+NBvVXffho6yrE7oaRmM3RoPbIlVRhVokimPVLSpmWo+itJK7y/wsxXzVDCiE4iabwZxtBI3htntMpoNbbjKIpsstwoUiSa4UEUeZTVEufkigkMygfNkPLKpxHlw/yIrNijnFawS7bT/L4vead3OT+xX29RtuRAH8iO7ODsdCVfhFtbYdy0k+0oVBF213dCbNnsVP9mj/KaRgO3KzK90IxgqXyFECs/ocz+IVktnE/5kkejWrKRE0HrZU7sSz6B1uOIKXHNGFnQ3dEJEdT9kjMM9pg+Hvzx3imWCxMCeBzLekclnAgTKWFzNEnaMHJgJWWLKqn1rpg45XVaxFvCfu3a0ZfOaONQd2I8Ww8dWzlRyfFoUqeZTJ3aSc2jKQ2ilHQmeMyvAyg/oklebWM1iZVH0zhmxoREIgIt3EtTQSw7saQpBM2jGb25G6a5di1apMkD9dyj9/TmVri501PaDvSzRn9Wp2I62AvT6WnkL/Fp2uUiRen66Rl+TOJB1gIykS02w5SDB2/9DtLL15YchdcG2O7t8yuofdZE8KQB+xvQHk/VKQlMhZhViFZAYq1rWZbJ1awWqcjUd0OaVr6s0wSKchwXx76Mcf1fMzOWmBK+34nTsyMuPXPtSwjTHHybdT2a16nFcgFxZnlOp1mW7+s0x/IDneZZntfpCEtbp6MsP9RpgeVHOh1jeUELmnTfwZCLMOQCDpAwhKUDQ1hegiEsFQxhuQhDWBZhCMslGMLyYxjCchmGsLysZdXUU0nj2plYBmxCYGKOHrnMReVqKrlUQrtoVGpDnhJulVQUz6p/ZaBePPKGObAWSJfIml8xzpWPRuX41hUtbxo7V8Cx6m8fjvY58VLWi4U/Bf/V1lQlvWLNw5Or8BuGnmwnqjapeHRNl89VPbr+X1RUWAv0G0iFWCjKsmxwZyKEjzqdhmqglUPMbMw8tOt1y5qfw/03MUIWUP34NxQaC9yDTllJWe3grNXX27LcO4NyOBMsSTE38/pW+CIjs9J+kVnKno98HnAFjEpl2GoDrRW82ScxD5neJM8EcVtRNkja2M4EiQ0c84B5850EJmHqqg3kTuGGDfgFYW7BeSdconqjLIfuRezzKKT8W6fiRPaoaIzAs9kbYa/vQspvcQwkNPmlfgxUFaGpGDUV0DRSbqgGX8bZum1Cxg70Iyp2w7Ks4sPHFveVkm0ZhHykiNWjo5/WXqJOqtx+ZhSX752+BcEgNTF/e990cZDKu1rJMkdtA1O3GpVT15pD41WH6uZR9b3j7BM5a5puuiceel/TqtvBxVwssPZtDtJSJhfU9WGFDaLLxaVQ6mU0Se+4BxgWGNDvUIqN/6v62HyeK1WF0XEk307Ut9HnYAz8D9h/R/UD0Pdj6HINLs/3mhOfbvThbJmuohfrp+g3MGutuVm6BtzQdAPiIUetjrjKDXynBnF6pLkc6SHgY90V4gHAJoDF4BPdtYzmUwCj+Yw5PsDnzGHQZA6DLeYw2GbOGsAOcxjsMofBHnMYfMGcdYAvmcMgZA6DiDkMnjAnAHjKHAZfMYfB18xh8A1z7gN8yxwGMXMYJMxhsK/p1jDMLV7QXaC2QVWgA1NPWNzD4lBTZcj+jheG/b1BzP7BIKb+qOn2kPoTLwz1Z4OY+otBTP1V050h9TdeGOrvBjH1D4OY+ky/GMtlBr+MfJcKB5RdbD7n74n3D9vFQLkAAQAB//8AD3icjY5Bi9NQFIXffS9973Wa5KXpS5pmYiMTTMsUWrFNQmltigh1NoKKTmfRAUWhDiouKrPpRqmCuHJjZ+N6mMXQpb/EXyD4M9SkC3Hp6nLOvee7BwFCv0/gJ7mPaqg7vq4DwTBRAAqAKKBjRAieIozVOwwo1egBQtlhrSyDsFzmBbdVLQdRN+olcRJ3b/jAgj1Gr0CXBeXlclnb7fXvtfb3lBf7QvvGN1/g+8XnQafn+UT5Ko1wefGrlQHzDs/JR/IAfULDcX+1fPPq5bOnx48e3p2kGgKYfHg/uhl3mg2/7hiCg0C3MWSp19lOhYN3b588vjUmBdm6xqp10KEDVZuGHWxtVdgBS2YjiZgObeilEIncToHRNsQpNNowAh+SRlb+X6MRxraPo62yfYh62ahayQjqWICV5q6AJK4DFbD91IIGq24NcjKbq1x42txnXpP114siNnSPprZnQ1q0pbqzOOuzpkv9ueYJrs5nhsGlebleX3JhKoaYzTWqXi3l+ZD3z7K8bjo8lXUJKXdMFZcW6wzgsb8AoWPTYDnBcBT9R2XAPZfSwZHlKfb54WZVsiXH6uRUSOxop5MdqhpucbU5PLdoXR4NGK95fFAhrmuSYDoNpOPgypB5Luf/z6C7HhtWsOPIHEFM10V/ALWTX5R4nGNgZGBgAGJLIW3heH6brwzczC+AIgy3zJW0EPT/TOYXzMFALgcDE0gUAOX2CI54nGNgZGBgDvqfBSRfMDCASUYGVMAMAFz3A5oAA+gAAAHmAAADoAAAAAAAAABCATEAAQAAAAMAjAABAAAAAAACABAAIABzAAAATQtwAAAAAHicdZDNSsNAFEa/0frXgoqCW+9KWsQ0BtwUCoWKbnQj0q2kaZqkpJkymRb6Gr6DD+NL+Cx+TaciFhMmc+6ZO3cmF8AZvqCwfu441qxwyGjNOzhA1/Eu/b3jGvnJ8R4aeHW8T//muI5rJI4bOMc7K6jaEaMJPhwrnKoTxzs4VpeOd+lvHNfIXcd7uFDPjvfpI8d1DFTpuIEr9dnXs6XJktRKs9+SwA98GS5FU2VFmEs4t6k2pfRkrAsb57n2Ij3d8EuczPPQbMLNPIhNmelCbj1/ox7jIjahjUer6uUiCawdy9joqTy4DJkZPYkj66XWzjrt9u/z0IfGDEsYZGxVCgtBk7bFOYBfDcGQGcLMdVaGAiFymhBz7kirlZJxj2PMqKCNmZGTPUT8Trf8Cynh/pxVzNbq33hAWp2RVV5wy7r+VtYjqagyw8qOfu5eYsHTAlrLXatbmupWgoc/NYT9WK1NaCJ6r+qKpe2gzfef//sG1FOERXicY2BigAAuBuyAmZGJkZmRhYEjLTE5NSk/P5u7OC+/PC0nMTtVN5+BAQBlxQfPAHicY/DewXAiKGIjI2Nf5AbGnRwMHAzJBRsZWJ02MTAyaIEYm7lYGDkgLAEmMIvNaRfTAaA0J5DN7rSLwQHCZmZw2ajC2BEYscGhI2Ijc4rLRjUQbxdHAwMji0NHckgESEkkEGzmYWHk0drB+L91A0vvRiYGFwAOuiP8AAA=') format('woff'),
       url('data:application/octet-stream;base64,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PiywNSsjIC5GsAIlRlJYIDxZLrErARQrLbA/LLA2K4ogIDywBCNCijgjIC5GsAIlRlJYIDxZLrErARQrsARDLrArKy2wQCywABawBCWwBCYgLkcjRyNhsAlDKyMgPCAuIzixKwEUKy2wQSyxCAQlQrAAFrAEJbAEJSAuRyNHI2EgsAQjQrAJQysgsGBQWCCwQFFYswIgAyAbswImAxpZQkIjIEewBEOwAmIgsABQWLBAYFlmsAFjYCCwASsgiophILACQ2BkI7ADQ2FkUFiwAkNhG7ADQ2BZsAMlsAJiILAAUFiwQGBZZrABY2GwAiVGYTgjIDwjOBshICBGI0ewASsjYTghWbErARQrLbBCLLA1Ky6xKwEUKy2wQyywNishIyAgPLAEI0IjOLErARQrsARDLrArKy2wRCywABUgR7AAI0KyAAEBFRQTLrAxKi2wRSywABUgR7AAI0KyAAEBFRQTLrAxKi2wRiyxAAEUE7AyKi2wRyywNCotsEgssAAWRSMgLiBGiiNhOLErARQrLbBJLLAII0KwSCstsEossgAAQSstsEsssgABQSstsEwssgEAQSstsE0ssgEBQSstsE4ssgAAQistsE8ssgABQistsFAssgEAQistsFEssgEBQistsFIssgAAPistsFMssgABPistsFQssgEAPistsFUssgEBPistsFYssgAAQCstsFcssgABQCstsFgssgEAQCstsFkssgEBQCstsFossgAAQystsFsssgABQystsFwssgEAQystsF0ssgEBQystsF4ssgAAPystsF8ssgABPystsGAssgEAPystsGEssgEBPystsGIssDcrLrErARQrLbBjLLA3K7A7Ky2wZCywNyuwPCstsGUssAAWsDcrsD0rLbBmLLA4Ky6xKwEUKy2wZyywOCuwOystsGgssDgrsDwrLbBpLLA4K7A9Ky2waiywOSsusSsBFCstsGsssDkrsDsrLbBsLLA5K7A8Ky2wbSywOSuwPSstsG4ssDorLrErARQrLbBvLLA6K7A7Ky2wcCywOiuwPCstsHEssDorsD0rLbByLLMJBAIDRVghGyMhWUIrsAhlsAMkUHiwARUwLQBLuADIUlixAQGOWbABuQgACABjcLEABUKyAAEAKrEABUKzCgQBCCqxAAVCsxACAQgqsQAGQroCwAABAAkqsQAHQroAQAABAAkqsQMARLEkAYhRWLBAiFixA2REsSYBiFFYugiAAAEEQIhjVFixAwBEWVlZWbMMBAEMKrgB/4WwBI2xAgBEAAA=') format('truetype');
}

* {
    --orange: #db3739;
    --light-blue: #99d8f9;
    --dark-blue: #143157;
    --diner-pink: #dc006c;
    --bright-blue: #42bdff;
    --error-red: #ffcccc;
    --light-yellow: #ffff99;
    --bright-yellow: #ffff00;
}

body {
    display: grid;
    grid-template-columns: [leftside] auto [mainarea] 60em [rightside] auto;
    grid-template-rows: [flash] auto [header] auto [nav] auto [picrow] auto [noticerow] auto [mainarea] auto [picfooter] auto [footer] auto;
    margin: 0;
    padding: 0;
    font: 13pt Helvetica, sans-serif;
}

h1, h2, h3, h4, h5, h6 {
    width: 100%;
    color: var(--light-blue);
}

a {
    color: var(--light-blue);
    text-decoration: none;
}

p {
    width: 100%;
}

hr {
    color: var(--light-blue);
    width: 100%;
}

#flash {
    grid-row: flash;
    grid-column: mainarea;
    background-color: red;
    color: white;
    padding: 0 1em;
}

#flash a, #flash a:visited {
    color: white;
    text-decoration: underline;
}

cite {
    display: block;
    text-align: right;
    text-decoration: italic;
    line-height: 3em;
    color: var(--light-blue);
}

header, nav, main, footer, #pic-bar {
    grid-column: mainarea;
}

header {
    display: flex;
    grid-row: header;
    min-height: 180px;
    border-bottom: 0.2em solid black;
}

.no-webp header,
.has-webp header {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.no-webp header {
    background-image:
        linear-gradient(15deg, rgba(0,163,218,0.3) 0%, rgba(0,0,163,0.3) 18%, rgba(0,163,218,0.3) 30%, rgba(0,163,218,0.3) 40%, rgba(0,0,163,0.3) 56%, rgba(0,163,218,0.3) 70%, rgba(0,163,218,0.3) 80%, rgba(0,0,163,0.3) 100%),
        url("/images/header.jpg");
}

.has-webp header {
    background-image:
        linear-gradient(15deg, rgba(0,163,218,0.3) 0%, rgba(0,0,163,0.3) 18%, rgba(0,163,218,0.3) 30%, rgba(0,163,218,0.3) 40%, rgba(0,0,163,0.3) 56%, rgba(0,163,218,0.3) 70%, rgba(0,163,218,0.3) 80%, rgba(0,0,163,0.3) 100%),
        url("/images/header.webp");
}

header h1 { display: none; }

header a {
    display: block;
    position: relative;
    top: 1.5em;
    left: 2em;
    border: 0.2em solid black;
    height: 180px;
    width: 180px;
    border-radius: 100%;
    background: white url("/images/snowmobile-logo.svg") 55% 55% no-repeat;
    background-size: 90%;
}

nav {
    grid-row: nav;
}

main {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-evenly;
    gap: 1em;

    grid-row: mainarea;
    margin-top: 1em;
    padding: 1em;
    padding-bottom: 7em;

    color: white;
    background: var(--dark-blue) url("/images/snowmobile-snow.svg") repeat-x bottom;
}

figure {
    margin: 0;
    padding: 0;
}

figcaption {
    font-size: 0.7em;
    font-style: italic;
    text-align: left;
}

figcaption .credit {
    font-weight: bold;
}

.underline-highlight {
    text-decoration: underline;
    font-weight: bolder;
    color: var(--bright-yellow);
}

main > div { flex: 1; }
main #friends h2 { display: none; }

main #friends {
    display: flex;
    justify-content: center;
    align-self: center;
}

main .center-pad {
    padding: 1em 3em;
    text-align: center;
}

#pic-bar {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-evenly;
    gap: 1em;
    padding: 1em;
    grid-row: picrow;
    background-image: linear-gradient(to top, var(--light-blue) 0%, var(--bright-blue) 100%);
}

#pic-bar div {
    height: 247px;
    width: 313px;
}

#pic-bar div:first-child  { background-position: 0 0; }
#pic-bar div:nth-child(2) { background-position: 626px 0; }
#pic-bar div:last-child   { background-position: 313px 0; }

#page-home.no-webp #pic-bar div { background-image: url("/images/home-sprite.jpg"); }
#page-error.no-webp #pic-bar div { background-image: url("/images/home-sprite.jpg"); }
#page-reservations.no-webp #pic-bar div { background-image: url("/images/reservations-sprite.jpg"); }
#page-testimonials.no-webp #pic-bar div { background-image: url("/images/reservations-sprite.jpg"); }
#page-news.no-webp #pic-bar div { background-image: url("/images/news-sprite.jpg"); }
#page-contact.no-webp #pic-bar div { background-image: url("/images/contact-sprite.jpg"); }

#page-home.has-webp #pic-bar div { background-image: url("/images/home-sprite.webp"); }
#page-error.has-webp #pic-bar div { background-image: url("/images/home-sprite.webp"); }
#page-reservations.has-webp #pic-bar div { background-image: url("/images/reservations-sprite.webp"); }
#page-testimonials.has-webp #pic-bar div { background-image: url("/images/reservations-sprite.webp"); }
#page-news.has-webp #pic-bar div { background-image: url("/images/news-sprite.webp"); }
#page-contact.has-webp #pic-bar div { background-image: url("/images/contact-sprite.webp"); }

/*
 * Site Navigation
 */
nav ul {
    display: flex;
    gap: 0.5em;
    flex-flow: row wrap;
    justify-content: flex-start;
    margin: 1em 0;
    padding: 0 1em 0 1em;
}

nav a {
    color: black;
}

nav li.selected a, nav li.selected:before {
    color: var(--orange);
}

nav li {
    order: 2;
    flex-grow: 0;
    display: inline-block;
    list-style: none;
    line-height: 1.2em;
}

nav li:before {
    content: 'S';
    font-family: 'fontello';
    font-size: 1.2em;
    color: var(--light-blue);
    padding-right: 0.1em;
}

nav #facebook {
    order: 1;
    flex-grow: 1;
}

nav #facebook:before {
    content: '';
}

nav #facebook span {
    display: none;
}

nav #facebook a {
    font-family: 'fontello';
    display: inline-block;
    background-color: #1e367a;
    color: white;
    font-size: 1.3rem;
    line-height: 1.5em;
    border-radius: 50%;
    width: 1em;
    height: 1.5em;
    padding: 0 0 0 0.5em;
}

/*
 * Footer
 */
footer {
    display: flex;
    flex-flow: row wrap;
    gap: 1em;
    justify-content: space-evenly;
    grid-row: footer;
    color: var(--dark-blue);
    text-align: center;
    padding: 2em 1em;
}

footer p {
    margin: 0.5em 0;
}

footer a {
    color: var(--dark-blue);
    text-decoration: underline;
}

footer .phone {
    position: relative;
    font-weight: bolder;
    background-image: url("/images/snowmobile-logo-no-text.svg");
    background-size: 100px 71px;
    background-repeat: no-repeat;
    min-width: 6.3em;
    min-height: 6em;
    margin: 0 1em;
}

footer .phone p {
    position: absolute;
    bottom: 0;
}

footer #copyright {
    font-size: 0.75em;
    margin-top: 1em;
}

/* 
 * Home Page
 */
main #friends ul {
    padding: 0;
    margin: 0;
}

main #friends ul li {
    list-style: none;
}

main #friends ul a {
    display: inline-block;
    position: relative;
    height: 111px;
    width: 314px;
    border: 1px solid var(--diner-pink);
}

.no-webp main #friends ul a {
    background-image: url("/images/diner-cabins-sprite.jpg");
}

.has-webp main #friends ul a {
    background-image: url("/images/diner-cabins-sprite.webp");
}

main #friends .cabins { background-position: 314px 0; }
main #friends .diner span { display: none; }

main #friends .cabins span {
    display: block;
    position: relative;
    font-size: 0.8em;
    line-height: 0.8em;
    font-weight: 900;
    text-align: center;
    color: var(--diner-pink);
    text-transform: uppercase;
    top: 99px;
}

/*
 * Contact Page
 */
#page-contact main {
    display: grid;
    grid-gap: 0;
    grid-template-rows: repeat(3, auto);
    grid-template-columns: repeat(1, 1fr);
    grid-template-areas:
        "header"
        "copy"
        "locations";
}

#page-contact h1 {
    grid-area: header;
}

#page-contact #contact-info {
    grid-area: copy;
}

#page-contact #locations {
    grid-area: locations;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    gap: 2em;
}

#page-contact #locations .closed {
    color: white;
    background: red;
    display: block;
    padding: 3px;
    text-align: center;
}

#page-contact figcaption { display: none; }

/*
 * Rates and Reservations Pages
 */
.notice {
    grid-row: noticerow;
    grid-column: mainarea;
    display: block;
    padding: 0 1.5em;
    margin: 1em 0 0 0;
    background-color: var(--dark-blue);
}

.notice p {
    text-align: center;
    color: white;
    font-weight: bolder;
    font-size: 1.3em;
    background-color: var(--dark-blue);
}

#reservations-coming-soon {
    background: repeating-linear-gradient(
        45deg,
        #d00 0px,
        #d00 20px,
        #0d0 10px,
        #0d0 40px
    );
}

#reservations-coming-soon p {
    line-height: 3em;
}

#reservations-missing-date {
    border: 20px solid var(--orange);
}

noscript {
    grid-row: noticerow;
    grid-column: mainarea;
}

.notice.error {
    border: 20px solid red;
    background-color: var(--error-red);
}

.notice.error p {
    color: black;
    background-color: var(--error-red);
}

/*
 * Rates Page
 */
#page-rates #pic-bar {
    display: none;
}

#page-rates #rates {
    grid-row: picrow;
    grid-column: mainarea;
    padding: 1em;
    background-image: linear-gradient(to top, var(--light-blue) 0%, var(--bright-blue) 100%);
    overflow-y: scroll;
}

/*
 * Reservations Page
 */
#reservation-policy {
    list-style: none;
    padding: 20px 0;
}

#reservation-policy h2 {
    margin: 0 0 13px 0;
}

#usfs-disclaimer {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-evenly;
    gap: 1em;
    margin: 2em 2em 0 2em;

    font-size: 0.8em;
    font-style: italic;
}

#usfs-disclaimer p, #usfs-disclaimer img {
    flex: 1;
}

#usfs-disclaimer img {
    max-width: 10em;
}

#safety-video {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-evenly;
}

#safety-video iframe {
    width: 560px;
    height: 315px;
}

.fine-print {
    text-align: left;
    font-style: italic;
    font-size: 0.8rem;
    font-weight: normal;
    margin: 1em 0;
    padding: 0;
    list-style-type: "* ";
}

thead .fine-print,
tr.header .fine-print,
tr.inline-header .fine-print {
    text-align: center;
    display: block;
    font-weight: lighter;
    text-transform: none;
}

#rates tr.header,
#rates tr.inline-header {
    vertical-align: top;
}

#rates table {
    text-align: center;
    width: 100%;
    border-collapse: collapse;
}

#rates table td {
    padding: 0.5em 0.3em;
}

#rates table th {
    text-align: left;
    background-color: var(--dark-blue);
    color: white;
    font-weight: bold;
    text-transform: uppercase;
    padding: 0.3em;
}

#rates table thead td,
#rates table tr.header td,
#rates table tr.inline-header td {
    font-size: 1.1em;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
}

#rates table tr.inline-header {
    border-top: 3px solid var(--dark-blue);
}

#rates table tr td:first-child {
    text-align: left;
    font-weight: bolder;
    min-width: 9em;
}

#rates table th.grouping {
    background-color: var(--orange);
    color: white;
}

#rates a {
    color: black;
    text-decoration: underline;
}

/*
 * Responsive Styles
 */
/* Larger devices but somewhat arbitrarily chosen */
@media (max-width: 1500px), (max-width: 900px) {
    /* Drop side columns */
    body {
        grid-template-columns: [leftside] 0 [mainarea] auto [rightside] 0;
    }

    /* Move the picture bar above the footer and drop the margin */
    main {
        margin-top: 0;
    }

    #pic-bar {
        grid-row: picfooter;
    }

    /* Hide the image gap on the left */
    .has-webp header, .no-webp header {
        background-position-x: -2px;
    }
}

/* Mobile Devices */
@media (max-width: 900px) {
    /* Center the logo on the screen */
    header {
        justify-content: center;
    }

    header a {
        top: 1em;
        left: auto;
    }

    /* Spread out the nav to make it easier to tap */
    nav ul {
        gap: 1em;
        margin: 2em 0 1em 0;
    }

    /* Move the FB button to the header and make it glow to stand out */
    nav #facebook {
        position: absolute;
        top: 1em;
        left: 1em;
        /* Double because one glow wasn't obvious enough. */
        filter: 
            drop-shadow(0 0 0.5rem var(--light-yellow))
            drop-shadow(0 0 0.5rem var(--light-yellow));
    }

    /* Leave space for Facebook button */
    #flash {
        padding-top: 3em;
    }

    /* Make home page center pad spread out a bit */
    main .center-pad {
        padding: 1em;
    }

    /* Limit picture size to fit on screen */
    #page-news img {
        max-width: 80vw;
    }

    /* Make the lines a little less spread out */
    #reservations-coming-soon p {
        line-height: 2em;
    }

    /* Make the safety video fit the screen */
    #safety-video iframe {
        margin: auto;
        width: 90vw;
        height: 50vw;
    }

    /* Make sure phone number is still visible above FareHarbor button */
    footer {
        margin-bottom: 3em;
    }
}

/* Small iPhone Rates Table Wrap */
@media (max-width: 450px) {
    #page-rates #rates {
        padding: 0;
        font-size: 90%;
    }
}
