/* ------- Content Elements ------ */
:root {
	--coverHeight:800px;
	--heroHeight:750px;
	--headerHeight:75px;
}
h1,h2 {
	font-size:var(--szMassive);
	font-weight:bold;
	text-transform:uppercase;
	color:var(--colorGP);
}
h2 {
	font-size:var(--szHuge);
}
.bg-white {
	background-color:white;
}
.bg-grey {
	background-color:var(--bgGrey);
}
.invers {
	background-color:var(--colorGP);
	color:white;
}
.ersatz {
	display:none;
}
.ersatz img {
	display:block;
	width:100%;
	max-width:100%;
	height:auto;
}
.page-header {
	height:var(--headerHeight);
	width:100%;
	position:fixed;
	left:0;
	top:0;
	z-index:1000;
	padding:1rem;
	border-bottom:1px solid #333;
	background-color:white;
	overflow:hidden;
	display:flex;
	justify-content:flex-start;
	align-items:center;
}
.header-logo {
	position:fixed;
	top:20px;
	z-index:5000;
	left:50%;
	transform:translateX(-50%);
	height:110px;
	width:auto;
}
.top-menu {
	margin-left:auto;
}
.menu-button {
	cursor:pointer;
	white-space:nowrap;
}
.menu-button img {
	height:1rem;
	display:inline-block;
	vertical-align:middle;
}
.menu-button span {
	display:inline-block;
	vertical-align:middle;
	text-transform:uppercase;
	font-size:var(--szLarger);
	margin:0 0.5rem;
}

.lang-menu {
	display:flex;
	margin-bottom:1.5rem;
	border-bottom:1px solid var(--colorLine);
}
.lang-menu a {
	display:block;
	flex:1 1 auto;
	padding:0.5rem 1.5rem;
	color:var(--colorGP);
	text-align:center;
}
.lang-menu a:hover,
.lang-menu a.active {
	background-color:var(--colorHilite);
	color:var(--colorGPonHilite);
}

.main-menu ul {
	list-style-type:none;
	margin:0;
	padding:0;
	font-size:var(--szLarger);
}
.main-menu li {
	display:block;
	line-height:1;
	margin:0;
	padding:0;
}
.main-menu a {
	display:block;
	padding:0.5rem 1.5rem;
}
.main-menu a:hover,
.main-menu a.active {
	background-color:var(--colorHilite);
	color:var(--colorGPonHilite);
}

main {
	padding-top:var(--headerHeight);
}
footer {
	background-color:var(--bgFooter);
	padding:2rem;
}
.side-panel {
	position:fixed;
	top:calc(var(--headerHeight) + 0px);
	right:0;
	width:240px;
	height:100vh;
	background-color:white;
	z-index:9000;
	transform:translateX(100%);
	transition:all 0.4s ease;
}
.side-panel.active {
	transform:translateX(0);
	box-shadow:0 0 8px rgba(0,0,0,0.2);
}

.button {
	background-color:var(--colorHilite);
	color:var(--colorGPonHilite);
	line-height:1;
	font-size:var(--szMedium);
	font-weight:300;
	text-transform:uppercase;
	padding:5px 2rem;
	border-radius:1rem;
}
.backlink {
	padding:1rem 0 2rem 0;
	text-align:center;
}

/* --- Scroller --- */

.single-scroller {
	margin:1rem 0;
	padding:0 20px;
	position:relative;
	overflow:hidden;
	height:30px;
	font-size:var(--szLarger);
}
.rail {
	width:100%;
	display:flex;
	flex-wrap:nowrap;
	position:absolute;
	left:0;
	top:0;
	transform:translateX(0);
	transition:all 0.5s ease;
}
.scroller-entry {
	display:inline-block;
	padding:4px 0;
	margin:0;
	text-align:center;
	flex:1 0 100%;
}
.scroller-entry b {
	display:inline-block;
	margin-right:0.5rem;
}
.single-scroller .controls {
	position:absolute;
	left:0;
	top:0;
	width:100%;
}
.single-scroller .controls .prv,
.single-scroller .controls .nxt {
	position:absolute;
	left:0;
	top:0;
	width:20px;
	text-align:center;
	display:block;
	cursor:pointer;
	background-color:white;
}
.single-scroller .controls .nxt {
	left:auto;
	right:0;
}
.controls .prv::after {
	content: "⟨";
	display:block;
	font-size:20px;
}
.controls .nxt::after {
	content:"⟩";
	display:block;
	font-size:20px;
}
@media (max-width:420px) {
	.scroller-entry {
		font-size:var(--szNormal);
	}
}


/* -------- Cover ---------- */

.cover {
	height:var(--coverHeight);
	background-position:center center;
	background-size:cover;
	position:relative;
}
.cover.ersatz {
	height:auto;
}
.ersatz .cover-text {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}
.cover.icons-bottom.ersatz .row {
	padding-top:1.5rem;
}

.cover h1, .cover h2 {
	font-size:var(--szMassive);
	color:white;/*var(--colorHilite);*/
	font-weight:600;
	line-height:0.95;
	display:inline;
}
.cover span {
	background-color:var(--colorHilite);
	padding:0 0.5rem;
}
.cover .subline {
	display:inline;
	font-size:var(--szReallyLarge);
	line-height:1;
}
.cover .text {
	font-size:var(--szLarge);
	color:white;
	font-weight:300;
	text-align:center;
}
.cover .text-center {
	text-align:center;
}

.cover .text-bottom {
	flex-direction:column;
	align-items:center;
	justify-content:flex-end;
	padding-bottom:3rem;
}
.cover .text-top {
	flex-direction:column;
	align-items:center;
	justify-content:flex-start;
	padding:3rem 2rem;
}
.cover .text-split {
	flex-direction:column;
	align-items:center;
	justify-content:flex-start;
	padding:3rem 2rem;
}
.cover .text-split .text {
	margin-top:auto;
}
.cover .text-bottom.icons-bottom {
	padding-bottom:0;
}
.cover .container.text-bottom.icons-bottom {
	max-width:calc(var(--wFull) + 5rem);
}
.cover .text-bottom.icons-bottom .row {
	width:100%;
	background-color:white;
	padding:3rem 3rem 0 3rem;
}
.cover .text-bottom.icons-bottom .text {
	text-align:left;
}
.cover .text-bottom.icons-bottom h1,
.cover .text-bottom.icons-bottom h2 {
	font-weight:300;
}


.icons-bottom .icons {
	display:flex;
	flex-direction:column;
}
.icons-bottom .icons .icns {
	display:flex;
	flex-wrap:nowrap;
	gap:0.5rem;
	padding:0 1rem 0 0;
	width:100%;
	margin-top:auto;
}
.icons .icns img {
	width:inherit;
	flex:1 1 auto;
	display:inline-block;
}



/* -------- Riders ---------- */

.riders {
	padding:2rem 0;
}
.rider {
	margin-bottom:1rem;
}
.rider dl {
	font-size:var(--szMedium);
	display:flex;
	align-items:flex-start;
	justify-content:flex-start;
	flex-wrap:wrap;
	width:100%;
}
.rider dt {
	margin:0;
	padding:0;
	flex:1 1 33%;
	font-weight:300;
	border-bottom:1px solid var(--colorHilite);
	padding:3px 0;
}
.rider dd {
	margin:0;
	padding:0;
	flex:1 1 66%;
	font-weight:600;
	border-bottom:1px solid var(--colorHilite);
	padding:3px 0;
}
.rider-picture {
	position:relative;
	flex:1 1 auto;
	min-width:50%;
}
.rider-picture img {
	display:block;
	width:100%;
	height:auto;
}
.rider .social-media-icons {
	position:absolute;
	left:1rem;
	top:1rem;
	opacity:0.5;
}
.rider-data {
	background-color:white;
	padding:2.5rem;
	position:relative;
	flex:1 1 auto;
}
.rider-data h3 {
	font-size:var(--szEvenLarger);
	margin:0 0 1.7rem 0;
	padding:0;
	line-height:1;
	text-transform:uppercase;
	font-weight:600;
}
.rider-data h3 span {
	background-color:var(--colorRed);
	color:white;
	line-height:1;
	padding:2px 2px 1px 2px;
	display:inline-block;
}

.social-media-icon {
	display:inline-block;
	line-height:1;
	width:40px;
	height:40px;
	margin:0 0.25rem;
	background:transparent url(/template/icons/www.png) no-repeat center center;
}
.social-media-icon.twitter { background-image:url(/template/icons/twitter.png);}
.social-media-icon.fb { background-image:url(/template/icons/facebook.png);}
.social-media-icon.insta { background-image:url(/template/icons/instagram.png);}


/* -------- Races ---------- */
.races {
	padding:1rem 0;
}
.races .container {
	padding:1rem 1.5rem;
	background-color:var(--bgGrey);
}
/*
.races .col {
	background-color:var(--bgGrey);
	padding:0.5rem 1.5rem 1.5rem 1.5rem;
	flex-shrink:1;
}
.races .col + .col {
	margin-left:1.5rem;
}
.races .inner {
	background-color:white;
}
*/
.two-cols {
	columns:2;
	column-fill:balance;
	column-gap:1.5rem;
}

.race {
	padding:5px;
	font-size:var(--szMediumLarge);
	font-weight:300;
	border-bottom:1px solid var(--bgGrey);
	background-color:white;
}
.race.next {
	background-color:var(--colorRed);
	color:white;
}
.race-name,.race-date {
	flex:1 1 50%;
	padding:5px;
}
.race-name {
	font-weight:bold;
	flex:1 1 40%;
}
.race-link {
	flex:1 0 10%;
	display:inline-block;
	width:2em;
	background:transparent url(external_link-blue.svg) no-repeat center;
	background-size:0.75em;
}
.race.next .race-link {
	background-image:url(external_link-white.svg);
}

/* ------ Results ----- */
.results {
	padding:0 0;
}
.results .text {
	text-align:center;
}
.results .ext-link {
	display:inline-block;
	line-height:1;
	background:var(--colorGP) url(external_link-white.svg) no-repeat right 1.25rem center;
	background-size:0.95em;
	color:white;
	padding:0.75rem 4rem 0.75rem 1.75rem;
	border-radius:1.75rem;
	font-size:var(--szLarger);
	text-transform:uppercase;
	font-weight:300;
}
.results .ext-link:active {
	transform:scale(0.97);
}

.results .ext-link.results-race {
	background-color:white;
	background-image:url(external_link-blue.svg);
	color:black;
}
.results .ext-link + .ext-link {
	margin-left:1rem;
}
.results .text h2 {
	color:white;
	text-shadow:1px 1px 4px rgba(0,0,0,0.5);
}



/* -------- Team ---------- */

.team {
	padding:2rem 0;
}
.team-hero {
	margin-bottom:2rem;
}
.team-hero img {
	display:block;
}
.team-hero h1,.team-hero h2 {
	color:var(--colorHilite);
	font-size:var(--szMassive);
}
.team-hero .text-center {
	text-align:center;
}
.team .col {
	padding:0 2rem 0 2rem;
	border-left:1px solid var(--colorHilite);
}
.team .col:first-child {
	border-left:none;
}
.team-member {
	text-align:center;
	font-size:var(--szMediumLarge);
	margin-bottom:1.5rem;
}

/* -------- Sponsors ---------- */

.sponsors {
	padding:2rem 0;
}
.sponsors-cover {
	height:var(--heroHeight);
}
.sponsors-cover > .container {
	background-position:center center;
	background-size:contain;
	background-repeat:no-repeat;

	padding:1rem 0;
}
.sponsors-cover.ersatz {
	height:auto;
}
.sponsors h1, .sponsors h2 {
	font-size:var(--szMassive);
	color:var(--colorGP);
	font-weight:600;
}
.sponsors h3 {
	font-size:var(--szVeryLarge);
	color:var(--colorGP);
	font-weight:600;
	line-height:1;
	margin:1.5rem 0 0.5rem 0;
}
.sponsors-logos {
	padding:1rem 0;
	border-bottom:1px solid var(--colorHilite);
}
.sponsors-logos:last-child {
	border-bottom:none;
}
.sponsors-logos .row {
	flex-wrap:wrap;
	flex-gap:1rem;
	gap:1rem;
}
.sponsors-logos img {
	display:block;
	width:160px;
	height:160px;
	object-fit:contain;
}

/* --------- News Teaser ----------- */
.teasers .items {
	display:flex;
	width:100%;
	justify-content:flex-start;
	align-items:flex-start;
	flex-wrap:wrap;
	gap:1rem;

}
.teaser.item {
	width:252px;
	height:252px;
	padding:1rem;
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
	position:relative;
}
.teaser.item .overlay {
	position:absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
	background-color:var(--overlayGP);
	color:var(--colorGPonHilite);
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	font-size:var(--szMedium);
	font-weight:400;
	text-align:center;
	padding:1rem;
	opacity:0.9;
	transition:all 0.4s ease;
}
.overlay .deco.plus {
	position:absolute;
	right:1rem;
	bottom:0rem;
	font-size:var(--szHuge);
	font-weight:300;
	color:var(--colorHilite);
}
.news {
	padding:2rem 0;
}
.news .teaser.item .date {
	color:var(--colorGPonHilite);
	font-weight:bold;
}
.teaser.item:hover .overlay {
	background-color:var(--overlayHoverGP);
	color:var(--colorGPonHilite);
	opacity:1;
}
.teaser.item:hover .overlay .deco.plus {
	right:0.8rem;
	bottom:-0.4rem;
	font-size:var(--szMassive);
}
.teasers .buttons {
	text-align:center;
	padding:2rem 0;
}

/* -------- Jumbolinks ----------- */

.jumbolinks {
	padding:2rem 0;
}
.jumbolinks .text {
	padding:2rem;
	background-color:var(--bgGrey);
	font-size:var(--szMedium);
	/*padding-right:var(--w1col);*/
	margin-bottom:0.5rem;
}
.jumbolinks .text h1,.jumbolinks .text h2 {
	font-weight:300;
	font-size:var(--szHuge);
	margin-bottom:1rem;
	
}
.jumbolinks .row {
	flex-wrap:wrap;
	gap:1rem;
	justify-content:space-between;
}
.jumbolink {
	width:340px;
	height:340px;
	flex:0 0 auto;
	background:var(--colorGP) no-repeat center center;
	background-size:auto 115px;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	color:var(--colorHilite);
	padding:1rem;
	margin:0.5rem 0;
	transition:all 0.3s ease;
}
.jumbolink.no-image {
	height:170px;
}
.container .jumbolink img,
.jumbolink img {
	display:block;
	height:115px;
	width:auto;
	margin-bottom:1rem;
}

.jumbolink .caption {
	margin-top:1rem;
	text-align:center;
}
.jumbolink .line-1 {
	display:block;
	font-size:var(--szLarge);
	color:var(--colorHilite);
	text-transform:uppercase;
	font-weight:600;
}
.jumbolink .line-2 {
	display:block;
	font-size:var(--szLarge);
	color:white;
	text-transform:uppercase;
	font-weight:300;
}
.jumbolink.bg-white .line-1,
.jumbolink.bg-white .line-2 {
	color:var(--colorGP);
	
}
.jumbolink:hover {
	box-shadow:0 0 12px rgba(0,0,0,0.4);
}

/* -------- Galleries --------- */


.galleries {
	padding:2rem 0;
}
.galleries .teaser.item .title {
	color:var(--colorGPonHilite);
	font-size:var(--szMedium);
	font-weight:600;
	text-align:center;
}
.galleries .teaser.item .date {
	color:white;
	font-size:var(--szMedium);
	font-weight:300;
	text-align:center;
}


/* --- Gallery --- */

.gallery {
	padding:2rem 0;
}
.gallery .subline {
	display:inline-block;
	padding:0 2rem;
	font-weight:600;
	font-size:var(--szReallyLarge);
	color:#aaa;
}
.gallery .row {
	flex-wrap:wrap;
	gap:1rem;
}
.pictures figure {
	width:329px;
	height:220px;
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
	position:relative;
	overflow:hidden;
}

.pictures figure a {
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	text-align:center;
	width:100%;
	height:100%;
	background-color:#000;
	line-height:0;
}
.pictures figure a img {
	display:inline-block;
	line-height:1;
	width:100%;
	height:100%;
	object-fit:contain;
}
.pictures figcaption {
	position:absolute;
	left:0;
	right:0;
	bottom:-40px;
	padding:5px 10px;
	background-color:rgba(0,0,0,0.5);
	color:#fff;
	transition: all 0.2s ease-out;
	line-height:1;
}
.pictures figure:hover figcaption {
	bottom:0;
}

/* ---- Article ---- */
.article {
	padding:75px 0 75px 0;
	font-size:var(--szMedium);
}
.article .text {
	line-height:1.5;
}
.article article p {
	margin-bottom:1rem;
}
.article .text p:last-of-type {
	margin-bottom:0;
}
.article article h1 {
	font-size:40px;
	font-weight:bold;
	margin:0 0 1em 0;
}
.article article h2 {
	font-size:20px;
	font-weight:bold;
	margin:0 0 1em 0;
}
.article article h3 {
	font-weight:bold;
	color:#ff0202;
	margin:0 0 0.5em 0;
}
.article aside {
	flex:0 1 auto;
	padding:0 0 0 2rem;
}
.article aside .box {
	line-height:1.5;
	background-color:#fff;
	padding:28px;
}
.article aside .box+.box {
	margin-top:25px;
}
.article aside .box.wImage+.box.wImage {
	margin-top:75px;
}
.article aside .heading {
	min-height:70px;
	margin-bottom:20px;
	position:relative;
}
.article aside .head {
	font-size:var(--szHuge);
}
.article aside .subhead {
	font-size:var(--szMedium);
	display:block;
	color:#ff0202;
	font-weight:bold;
}
.article aside .heading.wImage {
	padding-left:175px;
}
.article aside .heading img {
	display:block;
	position:absolute;
	bottom:0px;
	left:0;
}


.picture .frame {
	display:block;
	min-height:300px;
	background-color:transparent;
	background-size:100% auto;
	background-position: top center;
}

.picture_link {
	display:block;
}
.picture_link img {
	display:block;
	width:100%;
	height:auto;
}

.container img {
	max-width:100%;
	height:auto;
}
/* --------- Downloads ----------- */
.downloads {
	padding:2rem 0;
	font-size:var(--szLarger);
	color:var(--colorGP);
}
.downloads-list {
	list-style-type:square;
}
.downloads-list span, .downloads-list a {
	display:inline-block;
	line-height:1.1;
	padding:2px;
	cursor:pointer;
}
.downloads-list li.active > span,
.downloads-list li:hover > span {
	background-color:var(--colorHilite);
	color:var(--colorGPonHilite);
}
.downloads-list.level-2 > li > .downloads-folder {
	font-weight:400;
}
.downloads-list.level-1 > li > .downloads-folder {
	font-weight:600;
}
.downloads-list.level-3 {
	list-style-type:none;
	padding-left:1rem;
}

.downloads-folder {
	vertical-align:top;
}
.downloads-folder > span { 
	display:inline-block;
	margin-right:0.2rem;
	overflow:hidden;
	vertical-align:middle;
}
.dl-num {
}
.dl-track {
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
	width:200px;
}
.dl-date {
	color:var(--overlayGP);
}

.downloads-file::before {
	content:"▸ ";
}
.downloads-file:hover {
	text-decoration:underline;
}

/* ---- Footer ---- */
.footer {
}
.footer .menu {
	color:white;
}
.footer .menu a {
	display:block;
}


/* ----- Text Image ------ */

.text-image {
	padding:2rem 0;
}
.text-image .row {
	margin:0.5rem 0;
}
.text-image .text-col {
	font-size:var(--szLarger);
}
.text-image .text-col.with-bgcolor {
	padding:1rem;
}
.text-image.image-above .row,
.text-image.image-below .row {
	flex-direction:column;
	justify-content:flex-start;
	align-items:flex-start;
}
.text-image.image-above .text-col {
	order:3;
}
.text-image.image-left .text-col {
	order:3;
}
.text-image.image-right .row,
.text-image.image-left .row {
	gap:1.5rem;
}
.text-image.no-image .image-col {
	display:none;
}
.text-image.no-text .text-col {
	display:none;
}
.text-image .link {
	margin:2rem 0;
	text-align:center;
}
.text-image.promo-teaser .text-col {
	display:none;
}
.promo-link img {
	line-height:1;
	display:none;
	width:100%;
	height:auto;
}
@media all and (min-width:1060px) {
	.promo-link img:first-child { display:inline-block;	}
}
@media all and (max-width:1059px) {
	.promo-link img:nth-child(2) { display:inline-block;	}
}
@media all and (max-width:545px) {
	.promo-link img:nth-child(2) { display:none; }
	.promo-link img:nth-child(3) { display:inline-block; }
}

.contact-boxes {
	padding:2rem 0 2rem 0;
}
.contact-boxes h2 {
	margin-bottom:1rem;
}
.contact-boxes .row {
	gap:20px;
	flex-wrap:wrap;
}

.contact-box {
	padding-top:85px;
	max-width:300px;
}
.contact-image {
	position:relative;
}
.contact-image img {
	display:block;
	width:150px;
	height:150px;
	object-fit:contain;
	object-position:center;
	position:absolute;
	left:50%;
	top:-65px;
	transform:translateX(-50%);
}
.contact-text {
	padding:100px 1rem 2rem 1rem;
	font-size:var(--szLarger);
	min-height:200px;
}
.contact-text h3 {
	text-align:center;
	margin:0 0 0.5rem 0;
}



/* ============ resp ============= */
@media all and (max-width:1059px) {

	.row {
		align-items:flex-start;
		justify-content:center;
	}
	.article .row {
		flex-wrap:wrap;
	}
	.article .col-md-6 {
		flex:1 1 100%;
	}
	.article aside {
		padding:75px 0 2rem 0;
	}
	.teasers .items {
		justify-content:center;
	}
	.col-md-6 {
		padding:0.5rem;
	}
	.header-logo {
		left:1rem;
		top:12px;
		height:50px;
		transform:none;
	}
	.jumbolinks .text {
		padding-right:2rem;
	}
	.jumbolinks .row {
		justify-content:flex-start;
	}
	.icons-bottom .icons .icns {
		flex-wrap:wrap;
		justify-content:flex-start;
		align-items:flex-start;
	}
	.icons .icns img {
		display:inline-block;
		width:55px;
		height:55px;
		flex:0 0 auto;
		object-fit:contain;
		margin:5px;
	}
}
@media all and (max-width:850px) {
	.two-cols {
		columns:1;
	}
}
@media all and (max-width:950px) {
	.rider {
		padding-left:0;
		padding-right:0;
	}
	.rider.row {
		flex-wrap:wrap;
	}
	.col-md-6 {
		flex:1 1 auto;
		padding:0.5rem 0;
	}
	.rider dl {
		display:block;
		line-height:1.2;
	}
	.rider dt {
		border-bottom:none;
		padding:3px 0 0 0;
	}
	.rider dd {
		padding-top:0;
	}
	
	.rider .col {
		padding:0;
	}
	.rider .col.rider-data {
		padding:1rem;
	}

}

@media all and (max-width:546px) {

	.team .col-md-4 {
		flex:1 1 100%;
		border:none;
	}
	.pictures figure {
		width:100%;
		height:auto;
	}
	.pictures figure img {
		width:100%;
		height:auto;
	}
	.row {
		flex-wrap:wrap;
	}
	.cover .col+.col {
		padding-top:2rem;
	}
	.teasers .item {
		width:47%;
	}
	.jumbolink, .jumbolink.no-image {
		width:100%;
		height:auto;
		padding:1rem 1rem 2rem 1rem;
	}
	.jumbolink img {
		display:none;
	}
	.col.icons {
	}
	.icons-bottom .icons .icns {
		display:block;
	}
	.icons .icns img {
		display:inline-block;
		width:55px;
		height:55px;
		object-fit:contain;
		margin:5px;
	}
	.with-ersatz {
		display:none;
	}
	.ersatz {
		display:block;
	}
	.two-cols {
		columns:1;
	}
	.results .text h2,
	.results .text h1 {
		display:none;
	}
	.results .ext-link + .ext-link {
		margin:1rem 0 0 0;
	}
	.downloads-list {
		padding-left:1rem;
	}
}