@import url(reset.css);
@import url(fonts.css);
html, body { min-height: 100vh; }

html { background-color: #202f2f; color: #bdbdbd; font-size: 12px; font-weight: 100; }

@media (min-width: 768px) { html { font-size: 16px; } }

body { display: grid; grid-template: "header" auto "nav" auto "main" 1fr "footer" auto / 1fr; font-family: "Amble", sans-serif; line-height: 1.2; }

@media (min-width: 768px) { body { grid-template: "header header" auto "nav nav" auto "main sidebar" 1fr "footer footer" auto / 1fr auto; } }

body > header { grid-area: header; }

body > nav { grid-area: nav; }

body > main { grid-area: main; }

body > .main-sidebar { grid-area: sidebar; }

body > footer { grid-area: footer; }

a { color: inherit; text-decoration: none; }

a:hover, a:visited { color: inherit; }

em { font-style: italic; }

strong { font-weight: bold; }

:not(header) > h1, header.allow-h-style > h1 { font-size: 3.0517578125rem; font-family: "Sansita One", serif; color: #e7e4e4; text-transform: uppercase; }

:not(header) > h2, header.allow-h-style > h2 { font-size: 2.44140625rem; font-family: "Sansita One", serif; color: #e7e4e4; text-transform: capitalize; }

:not(header) > h3, header.allow-h-style > h3 { font-size: 1.953125rem; font-family: "Sansita One", serif; color: #e7e4e4; }

:not(header) > h4, header.allow-h-style > h4 { font-size: 1.5625rem; font-family: "Sansita One", serif; color: #e7e4e4; }

:not(header) > h5, header.allow-h-style > h5 { font-size: 1.25rem; font-family: "Sansita One", serif; color: #e7e4e4; }

:not(header) > h1, :not(header) > h2, :not(header) > h3, :not(header) > h4, :not(header) > h5, :not(header) > h6, header.allow-h-style > h1, header.allow-h-style > h2, header.allow-h-style > h3, header.allow-h-style > h4, header.allow-h-style > h5, header.allow-h-style > h6 { margin: 1em 0; line-height: 1.2; }

p { line-height: 1.4; margin: .7em 0; }

p a { color: #d19494; }

section { margin: 4rem 0; }

ul { list-style-type: disc; padding-left: 2em; }

figure { width: 100%; padding: 1rem; display: flex; flex-direction: column; gap: 1rem; }

figure > img { order: 1; margin: 0 auto; max-width: 100%; max-height: 100%; object-fit: contain; object-position: center; }

@media (min-width: 768px) { figure > img { max-width: calc(100% - 8rem); } }

figure > figcaption { order: 2; text-align: center; font-size: 0.8rem; font-style: italic; }

/**********************************************************************************************************************/
body > header { display: grid; grid-template: "logo" auto "nav" auto / 1fr; align-items: baseline; gap: 0 1rem; background: linear-gradient(260deg, #141f1f 0, #141f1f 1.5em, #e7e4e4 2em, #bf4040 10em); color: #e7e4e4; }

@media (min-width: 768px) { body > header { grid-template: "logo nav" auto / auto 1fr; } }

body > header > .logo { padding: 1rem; grid-area: logo; font-family: "Hansen", serif; font-size: 3rem; line-height: 1; text-transform: uppercase; background: #bf4040; }

body > header > nav { grid-area: nav; }

.main-navbar { padding: 1rem; display: flex; text-transform: uppercase; font-weight: bold; }

.main-navbar .navbar-item { position: relative; }

.main-navbar .navbar-item > .navbar-link { display: inline-block; padding: .5em; }

.main-navbar .navbar-item .navbar-item-children { display: none; position: absolute; background: #bf4040; border: 4px solid #c76b6b; box-shadow: rgba(0, 0, 0, 0.4) 0.25rem 0.25rem 0.5rem 0; }

.main-navbar .navbar-item .navbar-item-children > .navbar-item { min-width: 10em; }

.main-navbar .navbar-item .navbar-item-children > .navbar-item > .navbar-link { width: 100%; }

.main-navbar .navbar-item > .navbar-item-children.open, .main-navbar .navbar-item .navbar-item > .navbar-item-children.open { display: block; }

@media (hover: hover) { .main-navbar .navbar-item:hover > .navbar-item-children, .main-navbar .navbar-item .navbar-item:hover > .navbar-item-children { display: block; } }

.main-navbar .navbar-item:hover { background-color: #c76b6b; }

body > main { max-width: 60em; padding: 1rem; background-color: #141f1f; }

body > .main-sidebar { display: none; padding: 1rem; }

@media (min-width: 768px) { body > .main-sidebar { display: block; } }

body > footer { padding: 1rem; font-size: .8rem; color: #696e6e; text-align: center; }

@media (min-width: 768px) { body > footer { text-align: left; } }

table { border: 1px solid #939595; }

table th, table td { padding: .25em .5em; }

table th { background-color: #939595; color: #141f1f; font-weight: bold; }

table tr:nth-child(even) { background-color: #2e3636; }

figure.content-figure { display: flex; justify-content: center; }

.img__no-picture-available { border: 1px dashed #2e3636; background-image: repeating-conic-gradient(#2e3636 0% 25%, transparent 0% 50%); background-size: 20px 20px; background-position: center center; height: 100%; min-height: 4rem; display: flex; justify-content: center; align-items: center; color: #939595; font-weight: bold; text-transform: uppercase; text-shadow: #939595 0 0 0.5em; }

.megabuttons-container { width: 100%; display: grid; grid-template: 10rem / 1fr; grid-auto-rows: 10rem; gap: 1rem; }

@media (min-width: 768px) { .megabuttons-container { grid-template: 10rem / 1fr 1fr; } }

.megabutton { background-color: #bf4040; display: flex; justify-content: center; align-items: center; color: #bdbdbd; text-transform: uppercase; font-size: 1.25rem; letter-spacing: .5em; transition: all 1s ease; }

.megabutton:hover { font-size: 1.5625rem; background-color: #c76b6b; }

.livery, .track { display: flex; justify-content: center; align-items: center; position: relative; overflow: hidden; height: 12rem; box-shadow: inset #141f1f 0 0 4em 0; }

.livery > .content, .track > .content { display: flex; justify-content: center; align-items: center; display: inline-flex; width: 100%; height: 100%; flex-direction: column; z-index: 10; font-size: 1em; color: #e7e4e4; text-transform: uppercase; text-shadow: #141f1f 0 0.5rem 0.5rem; transition-duration: 1s; transition-property: font-size, color, opacity; }

.livery header, .track header { font-weight: bold; font-size: 1.25rem; color: #e7e4e4; letter-spacing: .5em; z-index: 10; transition-duration: 1s; transition-property: font-size; }

.livery > .image-link, .track > .image-link { display: flex; justify-content: center; align-items: center; }

.livery > img, .track > img, .livery > .image-link, .track > .image-link { width: 100%; position: absolute; object-position: center center; object-fit: cover; z-index: 0; filter: contrast(40%) brightness(60%) blur(1px); transition-duration: 1s; transition-property: filter, transform; }

.livery:hover > .content, .track:hover > .content { font-size: 1.1em; color: #696e6e; opacity: .6; }

.livery:hover header, .track:hover header { font-size: 1.375rem; }

.livery:hover > img, .track:hover > img, .livery:hover > .image-link, .track:hover > .image-link { filter: contrast(100%) brightness(100%) blur(0px); transform: scale(1.1); }

.liveries-container, .tracks-container { display: flex; flex-direction: column; gap: 1rem; }

.livery .livery-details, .livery .track-details, .track .livery-details, .track .track-details { display: flex; flex-wrap: wrap; color: #bdbdbd; font-size: .9em; margin: .5em 0; }

.livery .livery-details > :not(:first-child)::before, .livery .track-details > :not(:first-child)::before, .track .livery-details > :not(:first-child)::before, .track .track-details > :not(:first-child)::before { content: '\2022'; margin: 0 1em; }

.picture-gallery { position: relative; display: flex; flex-direction: column; background-color: #767676; }

.picture-gallery .picture-gallery__pictures { display: flex; justify-content: start; gap: 1rem; height: 10rem; padding: 1rem; overflow: hidden; }

@media (min-width: 768px) { .picture-gallery .picture-gallery__pictures { height: 10rem; } }

.picture-gallery .picture-gallery__pictures .picture-gallery__picture { flex: 0 0 10rem; cursor: pointer; }

.picture-gallery .picture-gallery__pictures .picture-gallery__picture > img { transition: transform 1s ease; }

.picture-gallery .picture-gallery__pictures .picture-gallery__picture > img:hover { transform: scale(1.1); }

.picture-gallery .picture-gallery__pictures .picture-gallery__picture > figcaption { max-height: 3em; overflow: hidden; text-overflow: ellipsis; }

.picture-gallery .picture-gallery__picture { position: relative; overflow: hidden; width: 100%; height: 100%; padding: 0; }

.picture-gallery .picture-gallery__picture > img { width: 100%; max-width: 100%; height: 100%; object-fit: contain; object-position: center center; }

.picture-gallery .picture-gallery__picture > figcaption { overflow-y: scroll; position: absolute; bottom: 0; width: 100%; max-height: 50%; background-color: rgba(0, 0, 0, 0.4); font-size: 0.8rem; text-align: center; padding: .5em; }

.picture-gallery .picture-gallery__front-window { width: 100%; height: 20rem; padding: 1rem; display: flex; justify-content: center; align-items: center; }

@media (min-width: 768px) { .picture-gallery .picture-gallery__front-window { height: 36rem; } }

.picture-gallery .picture-gallery__controls { position: absolute; top: 0; left: 0; bottom: 0; right: 0; pointer-events: none; }

.picture-gallery .picture-gallery__controls .picture-gallery__control { background: transparent; color: #bdbdbd; border: none; font-size: 4rem; padding: 1rem; cursor: pointer; pointer-events: auto; text-shadow: #141f1f 0 0.5rem 0.5rem; }

.picture-gallery .picture-gallery__controls .picture-gallery__control:hover { color: #bdbdbd; }

@media (hover: hover) { .picture-gallery .picture-gallery__controls .picture-gallery__control { color: #bdbdbd; } }

.picture-gallery .picture-gallery__controls .picture-gallery__control[data-action="scroll-pictures-left"], .picture-gallery .picture-gallery__controls .picture-gallery__control[data-action="scroll-pictures-right"] { position: absolute; top: 0; width: 6rem; height: 10rem; font-size: 2rem; }

@media (min-width: 768px) { .picture-gallery .picture-gallery__controls .picture-gallery__control[data-action="scroll-pictures-left"], .picture-gallery .picture-gallery__controls .picture-gallery__control[data-action="scroll-pictures-right"] { height: 10rem; } }

.picture-gallery .picture-gallery__controls .picture-gallery__control[data-action="prev"], .picture-gallery .picture-gallery__controls .picture-gallery__control[data-action="next"] { position: absolute; top: 10rem; width: 6rem; height: 20rem; padding: 2rem; }

@media (min-width: 768px) { .picture-gallery .picture-gallery__controls .picture-gallery__control[data-action="prev"], .picture-gallery .picture-gallery__controls .picture-gallery__control[data-action="next"] { top: 10rem; height: 36rem; } }

.picture-gallery .picture-gallery__controls .picture-gallery__control[data-action="prev"], .picture-gallery .picture-gallery__controls .picture-gallery__control[data-action="scroll-pictures-left"] { left: 0; text-align: left; }

.picture-gallery .picture-gallery__controls .picture-gallery__control[data-action="prev"]:hover, .picture-gallery .picture-gallery__controls .picture-gallery__control[data-action="scroll-pictures-left"]:hover { background: linear-gradient(to right, #141f1f 0%, transparent 100%); }

.picture-gallery .picture-gallery__controls .picture-gallery__control[data-action="next"], .picture-gallery .picture-gallery__controls .picture-gallery__control[data-action="scroll-pictures-right"] { right: 0; text-align: right; }

.picture-gallery .picture-gallery__controls .picture-gallery__control[data-action="next"]:hover, .picture-gallery .picture-gallery__controls .picture-gallery__control[data-action="scroll-pictures-right"]:hover { background: linear-gradient(to left, #141f1f 0%, transparent 100%); }

.picture-gallery .picture-gallery__controls .picture-gallery__control[data-action="scroll-pictures-left"] { background: linear-gradient(to right, #141f1f 0%, transparent 100%); }

.picture-gallery .picture-gallery__controls .picture-gallery__control[data-action="scroll-pictures-right"] { background: linear-gradient(to left, #141f1f 0%, transparent 100%); }

.info__item { display: flex; padding: .5em 0; }

.info__item__label { flex: 0 0 8em; }

@media (min-width: 768px) { .info__item__label { flex: 0 0 12em; } }

.info__item__value.no-value { color: #696e6e; font-style: italic; }

.track-pictures { border: 2px solid #939595; padding: 1em; margin: 1em 0; display: grid; grid-template: "header" auto "logo" auto "main" auto "map" auto / 1fr; gap: 1rem; /*padding-top: 0;*/ }

.track-pictures > header { background-color: #939595; color: #141f1f; font-weight: bold; padding: .5em; margin: -1em -1em 1em -1em; text-transform: uppercase; }

@media (min-width: 768px) { .track-pictures { grid-template: "header header" auto "main logo" auto "main map" auto / auto auto; } }

.track-pictures > header { grid-area: header; margin-bottom: 0; }

.track-pictures > .track-pictures__logo { grid-area: logo; }

.track-pictures > .track-pictures__main { grid-area: main; }

.track-pictures > .track-pictures__map { grid-area: map; }

.track-pictures > .track-pictures__logo > img, .track-pictures > .track-pictures__main > img, .track-pictures > .track-pictures__map > img { max-width: 100%; max-height: 100%; }

.track-description { margin: 4rem 0; }

.track-info { border: 2px solid #939595; padding: 1em; margin: 1em 0; }

.track-info > header { background-color: #939595; color: #141f1f; font-weight: bold; padding: .5em; margin: -1em -1em 1em -1em; text-transform: uppercase; }

.main-picture { width: 100%; }

.main-picture > img { width: 100%; }

.livery-info { border: 2px solid #939595; padding: 1em; margin: 1em 0; }

.livery-info > header { background-color: #939595; color: #141f1f; font-weight: bold; padding: .5em; margin: -1em -1em 1em -1em; text-transform: uppercase; }

.post-info { margin-top: -2rem; margin-bottom: 8rem; font-size: .8em; color: #696e6e; }

.post-info .date { color: #bdbdbd; }

.post-info .author { color: #bdbdbd; }

/*# sourceMappingURL=styles.css.map */