:root {
--c-all-dark:	#524FA1;

--c-cb-dark:	#74811E;
--c-ol-dark:	#005892;
--c-pr-dark:	#A32A2B;
--c-hk-dark:	#7B3E91;
--c-pa-dark:	#804720;
--c-pl-dark:	#467758;
--c-br-dark:	#E08700;
--c-kp-dark:	#198EAD;

--c-cb-alt:	#005892;
--c-ol-alt:	#F5A99D;
--c-pr-alt:	#FCCA80;
--c-hk-alt:	#9CCD9A;
--c-pa-alt:	#9CCD9A;
--c-pl-alt:	#E08700;
--c-br-alt:	#198EAD;
--c-kp-alt:	#A32A2B;

--c-cb-light:	#C5D76A;
--c-ol-light:	#A4BDE3;
--c-pr-light:	#C89870;
--c-hk-light:	#E9ABCE;
--c-pa-light:	#F5A99D;
--c-pl-light:	#9CCD9A;
--c-br-light:	#FCCA80;
--c-kp-light:	#9FD5D8;

--c-all-light:	#fab913;

--c-dominant:				#dedede; /*#fab913;*/
--c-dark:					#38257f; 
--c-btn-primary-bg:			#dedede; /*#a8abab;*/
--c-btn-primary-clr:		#38257f;
--c-btn-secondary-bg:		#fff;
--c-btn-secondary-clr:		#38257f;
--c-btn-secondary-border:	2px solid #38257f;
--c-btn-tertiary-clr:		#458cab;

--c-gray-transparent: rgba(30 30 30 / .2);
--c-blue:		var(--c-kp-light);
--c-green:		var(--c-pl-dark);
--c-orange:		var(--c-dominant);
--c-lightorange:		var(--c-pa-light);
--c-red:		#E5004B;
--c-gold-dark:	#b58922;
--c-gold-light: #d7bd8a;

--fs-h1:		2.4rem;
--fs-h2:		1.75rem;
--fs-h1-fluid:	clamp(1.3rem, 0.8556rem + 1.4222vw, 2.1rem); /* 16px 500px 1400px https://xgkft.csb.app/ */
--t-smaller:	12px;

}

/* layout */
  
body {background: #FFF; position: relative; }

.h {background: rgba(255,255,255,.95); position: fixed; width: 100%; left: 0; top: 0; z-index: 999; box-shadow: 0px 0px 5px gray; text-align: left;}
	.h ul {padding-left: 0px;}
	.h__container {display: flex; width: 90%; max-width: 1180px; margin: 0 auto; height: 100%; position: relative;}
	.h__logo {}
	.h__logo img {display: block; height: 30px; margin-block: 15px; width: auto;}
	.h .btn {margin-block: 0 !important;}
	.h__socials {position: absolute; right: 35px; height: 60px; display: flex; align-items: center;}
	.h__socials > * {display: inline-block;  margin-inline: .1rem; }
	.h__socials-item {width: 30px; height: 30px;}
	.h__socials-item svg {height: 70%; width: 70%; margin: 15%;}
	.h__socials-item--fb svg {height: 60%; width: 60%; margin: 20%;}
	.h__socials-item path, .h__socials-item circle {fill: #000;}

	.pg__n-launcher {position: absolute; right: 0; top: 0; height: 100%; display: flex;} 
		.pg__n-launcher svg {height: 30%; width: auto; margin: auto; } 
		.pg__n-launcher path {fill: #000;}
	
	.h > .container {z-index: 99;}
	
	@media all and (min-width: 1200px) {
		.h > .container {width: auto; justify-content: center;}
		.h__socials {left: 0; position: fixed; right: auto; padding: 15px 2rem; top: 0px; height: auto;}
		.scrolled .h__socials {padding: 10px 2rem; }
		.h__socials > * {top: 0px;}
		.h__logo img {height: 50px; margin: 10px 0 10px 0;}
		.scrolled .h__logo img {height: 40px; }
	}
	
.n {background: rgba(255,255,255,.95); z-index: 101; position: absolute; right: 0; text-align: left;
	box-shadow: inset 0 5px 7.5px -5px gray, -5px 5px 5px rgba(0,0,0,0.05); width: 100%; max-width: 340px;
	max-height: calc(100vh - 64px);
	overflow-y: auto;
	display: none;
}
	.n:before {content: ""; position: absolute; width: 10px; height: 100%; right: 100%; top: 0; background: linear-gradient(rgba(0,0,0,.01), rgba(0,0,0,0)), linear-gradient(to left, rgba(0,0,0,.03), rgba(0,0,0,0) 80%);}
	
	.top-beh {display: inline-block; margin-right: .5rem;}
	.top-beh svg {height: 40px; display: block;}
	
	.n__user { padding: 1rem 10px; z-index: 20;}
	.n__nav {position: relative;}
	.n__nav a {color: #000; text-decoration: none; display: block; white-space: nowrap; }
	.n ul > li {display: flex; flex-wrap: wrap; align-items: center;}

	.n__nav a.txt {flex: 1; padding: 0 10px; line-height: 40px;  }
	.n .close {display: none;}
	.n__nav ul {flex: 1 100%; display: none; font-size: .9rem; border-top: 1px solid #bdbdbd; padding: 10px 20px 10px 0px; margin-top: 10px;}
	.n__subnav a.txt {line-height: 30px;}
	.n__item ul .icon {display: none;}
	
	.n__item.active > .close {display: block;}
	.n__item.active > .open {display: none;}
	.n__item.active > ul {display: block;}
	
	.n__item.active > .close {order: 1;}
	.n__item.active > a.txt {order: 2;}
	.n__item.active > ul {order: 3;}
				
		@media all and (min-width: 500px) {
			.h {text-align: center;}
		}
		
		@media screen and (orientation: landscape) {
			.n__item > .open {margin-right: 20px;}
		}
	
		@media all and (min-width: 1200px) {

			.pg__n-launcher {display: none;}

			.n {display: block; width: 100%; max-width: 100%; max-height: none; overflow: visible; text-align: center; font-size: .9rem; box-shadow: none; border-top: 1px solid #bdbdbd; }
			.n:after {content: ""; position: absolute; width: 100%; height: 10px; left: 0; bottom: -10px; box-shadow: inset 0 5px 7.5px -5px rgba(0,0,0,.2); z-index: 1;}
			.n .icon {display: none;}
			.n__cart .icon {display: inline-block;}
			.n__cart .icon {margin: 0;}
			.n__cart {z-index: 10;}
			
			.n__user {position: fixed; top: 0; right: 0; padding: 15px 2rem; }
			.scrolled .n__user {padding: 10px 2rem;}
			.n__nav {max-width: 1180px; margin: auto; display: flex; z-index: 10}
			.n__item {flex: 1; display: block; position: relative;}
			
			.n__nav > .n__item > a.txt {line-height: 50px; }
			.n__subnav a.txt { padding: 0 1rem; text-align: left;}
			.n__subnav a:hover {text-decoration: underline;}
			.n__nav > .n__item.hover {background: var(--bs-primary-bg-subtle);}
			.n__nav > .n__item.hover > a.txt {font-weight: bold; }
			.n__nav > .n__item.hover > ul {display: block; position: absolute; top: 50px; left: 0; min-width: 100%; background: inherit; margin: 0;}

			
		}

.pg__wrap {overflow: hidden; padding-top: 60px;}

	@media all and (min-width: 1200px) {
		.pg__wrap {padding-top: 120px;}
	}
	
.pg__container {padding-block: 3rem;}


.pg .required .hf-validated {border: 1px solid var(--bs-primary-border-subtle);}
.pg .required .hf-invalid { border-color: tomato; }
.pg .required .hf-validated.hf-valid {border-color: yellowgreen;}
.pg .required .fRadio .hf-validated.hf-invalid {box-shadow: 0 0 0 3px tomato, inset 0 0 0 0px #000; border-color: transparent; border-width: 3px;}
.pg .required .fRadio .hf-validated.hf-valid {border-color: transparent;}
.pg .required .fRadio .hf-validated.hf-valid:checked {box-shadow: 0 0 0 2px #a7a7a7, inset 0 0 0 10px yellowgreen; border-color: #fff; border-width: 3px; }
.pg .hf-warning {color: tomato; font-size: 14px; padding: .3em 0;}

/* icons */

[class^="icon-"],
[class*=" icon-"] {
  display: inline-block;
  width: 1em;
  height: 1em;
  margin: 0px;
  padding: 0px;
  vertical-align: middle;
  top: -.2em;
  position: relative;
  /* background-color: red; */
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  box-sizing: content-box;
}

.icon-arr-down	{background-image: url("img/icons/ico-arr-down.svg"); }
.icon-arr-up	{background-image: url("img/icons/ico-arr-up.svg"); }
.icon-arr-rgt	{background-image: url("img/icons/ico-arr-rgt.svg"); }
.icon-arr-lft	{background-image: url("img/icons/ico-arr-lft.svg"); }
.icon-menu		{background-image: url("img/icons/ico-menu.svg"); }
.icon-pdf		{background-image: url("img/icons/ico-pdf.svg"); }
.icon-image		{background-image: url("img/icons/ico-image.svg"); }
.icon-fb		{background-image: url("img/icons/ico-fb.svg"); }
.icon-google	{background-image: url("img/icons/ico-google.svg"); }
.icon-tee		{background-image: url("img/icons/ico-tee.svg"); }

.icon-white.icon-fb		{background-image: url("img/icons/ico-fb-w.svg"); }
.icon-white.icon-google	{background-image: url("img/icons/ico-google-w.svg"); }


/* DBG */

#dbg {position: fixed; right: 10px; top: 10px; font-size: 11px; font-family: Courier; background: #ffff99; padding: 15px; text-align: left; z-index: 999; max-width: 500px; max-height: 100vh; overflow: auto; color: #333;}
#dbg a {position: absolute; text-decoration: none; height: 20px; line-height: 22px; width: 20px; text-align: center; background: darkorange; color: #fff; font-weight: bold; font-size: 20px; right: 0px; top: 0px; z-index: 1000; color: #333;}
#dbg a:hover {background: transparent; color: #333;}

/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/* 
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#000;}
#colorbox{outline:0;}
    #cboxContent{margin-top:20px;background:#000; margin-bottom: 40px;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{border:5px solid #000; background:transparent; padding: 28px;}
        #cboxTitle{position:fixed; top: .5rem; left:0; color:#ccc; line-height: 1.4em; width: 100%; text-align: center;}
        #cboxCurrent{position:fixed; bottom: .5rem; left:0px; color:#ccc; line-height: 1.4em; width: 100%; text-align: center;	}
        #cboxLoadingGraphic{background:url(img/loading.gif) no-repeat center center;}

        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
        #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }
        
        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}
        
        #cboxSlideshow{position:absolute; top:-20px; right:90px; color:#fff;}                                                                        
        #cboxPrevious{position:absolute; top:50%; left:5px; margin-top:-32px; background:url(img/controls.png) no-repeat top left; width:28px; height:65px; text-indent:-9999px;}
        #cboxPrevious:hover{background-position:bottom left;}
        #cboxNext{position:absolute; top:50%; right:5px; margin-top:-32px; background:url(img/controls.png) no-repeat top right; width:28px; height:65px; text-indent:-9999px;}
        #cboxNext:hover{background-position:bottom right;}
        #cboxClose{position:absolute; top:10px; right:0px; display:block; background:url(img/controls.png) no-repeat top center; width:38px; height:19px; text-indent:-9999px;}
        #cboxClose:hover{background-position:bottom center;}
		
/* defaults */

.offscreen { clip-path: inset(100%);clip: rect(1px 1px 1px 1px); /* IE 6/7 */ clip: rect(1px, 1px, 1px, 1px); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; }
.onscreen { position:relative; clip:auto; width:auto; height:auto; overflow:auto; }

h1 {margin-bottom: 3rem;}
h1, h2, h3, .h3 {font-weight: bold;}

.btn:not(.btn-sm, .btn-lg) {font-weight: bold; --bs-btn-font-size: .875rem; --bs-btn-padding-y: .544rem}
.btn-lg {font-weight: bold;}
.btn:has(.feather) {padding-right: calc(1.5 * var(--bs-btn-padding-x));}

.pg__btn-subnav {position: relative; top: -.5rem; margin-bottom: 1.5rem; display: flex; gap: .1em; flex-wrap: wrap;}

.full-bg {position: relative;}
.full-bg :last-child {position: relative; }
.full-bg:before {content: ""; position: absolute; width: 200vw; height: 100%; top: 0; left: -50vw;}
.full-bg--primary:before {background: var(--bs-primary-bg-subtle);}

a[disabled] {cursor: not-allowed;}
.text > * {margin-block: 1.5rem;}
.form > * {margin-block: 1.5rem;}

.required .form-label {position: relative;}
.required .form-label:after {content: "*"; color: var(--bs-red); padding-left: .15em}

.main {margin: auto;}
.main-xl {max-width: 1600px;}
.main-lg {max-width: 1200px;}
.main-sm {max-width: 600px;}

.feather {
	display: inline-block;
	position: relative;
	vertical-align: top;
	width: 1.5em;
	height: 1.5em;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
	fill: none;
	margin-right: .5em;
}

td .feather, p .feather, .card-header .feather {height: 1em; width: 1em; stroke-width: 1.5; top: .25em; margin-inline: .25em;}

/* racepicker */
.shopadd {text-align: center;}

/*.shopadd__button-line {display: grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); grid-auto-rows: 1fr; gap: 1rem; max-width: 98vw; }*/
.shopadd__button-line {max-width: 98vw; display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem}

.shopadd__button {
	vertical-align: top; flex: 0 0 clamp(8rem, 3.824vw + 6.776rem, 12rem);
	aspect-ratio: 1/1; font-weight: bold; line-height: 1.1; 
	font-size: 1rem; font-size: clamp(1.125rem, 1.0025510204081634rem + 0.6122448979591837vw, 1.5rem);
	}
.shopadd__button small {font-weight: normal; font-size: 0.75rem; font-size: clamp(0.75rem, 0.675rem + 0.375vw, 1.125rem); display: block;}
.shopadd__button button {background: #f2f2f2; border: 0; display: grid; align-items: center; justify-items: center; width: 100%; height: 100%; padding: .75em; text-decoration: none; border-radius: .5em; font-weight: bold;
	color: var(--bs-body-color) !important;}
.shopadd__button button:hover {background: #FFF}
.shopadd__button span {text-wrap: balance;}

.shopadd__buttonmultiple {
	vertical-align: top; flex: 0 0 clamp(8rem, 3.824vw + 6.776rem, 12rem);
	}
	
.shopadd__buttonmultiple-title {
	font-size: 1rem; font-size: clamp(1.125rem, 1.0025510204081634rem + 0.6122448979591837vw, 1.5rem); font-weight: bold; line-height: 1.1; margin-bottom: .5rem; min-height: 4.95rem; display: grid; place-items: center;
}
.shopadd__buttonmultiple-card {background: #f2f2f2; border: 0; display: grid; align-items: center; justify-items: center; width: 100%; height: 100%; padding: .75em; text-decoration: none; border-radius: .5em; padding-block: 1rem;}
.shopadd__buttonmultiple-card:hover {background: #FFF}
.shopadd__buttonmultiple-card .form-check {text-align: left; width: 100%; background: var(--bs-gray-300); padding-left: 2rem;}
.shopadd__buttonmultiple small {font-weight: normal; font-size: 0.75rem; font-size: clamp(0.75rem, 0.675rem + 0.375vw, 1.125rem); display: block; margin-top: .5em;}

.shopadd__section-title {font-size: 1.2rem; position: relative; margin-inline: auto; display: inline-block; }
.shopadd__section-title:before,
.shopadd__section-title:after { content: ""; position: absolute; top: calc(50% - 1px); width: 50vw; height: 0px; color: inherit; border-top: var(--bs-border-width) solid; opacity: .25;	}
.shopadd__section-title:before {right: calc(100% + 2rem); }
.shopadd__section-title:after {left: calc(100% + 2rem); }

.raceblocks {max-width: 1200px; margin-inline: auto;}

/* order */
.shoporder {text-align: center;}

.cards {display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; justify-content: center; margin-block: 1.5rem;}
.cards label {cursor: pointer;}
.cards img {height: 5vw; max-height: 25px; display: block;}


/* stepper */
.stepper__step {padding-inline: 1rem; gap: 1rem; padding-block: 1rem; border-radius: 10px;}
.stepper__step:hover {background: #ffffffaa;}
.stepper__step-ico {width: 2rem;}
.stepper__step-label {font-size: 14px; line-height: 1.2; }
.stepper__separator {flex: 1; height: 1px; border-bottom: 1px dashed rgba(0,0,0,.125);}

/* gallery */
.gal {
  display: flex;
  flex-wrap: wrap;
  gap: .1rem;
}
.gal figure {margin: 0;}
.gal a, .gal img {display: block; width: 100%; height: 100%;}
/*
.gal > figure, .gal::after {
	margin: 0;
	--ratio: calc(var(--w) / var(--h));
	--row-height: 10rem;
	flex-basis: calc(var(--ratio) * var(--row-height));
}

.gal > figure {
  flex-grow: calc(var(--ratio) * 100);
}

.gal::after {
  --w: 2;
  --h: 1;
  content: '';
  flex-grow: 1000000;
}
*/
/* overrides */

a {text-decoration-color: color-mix(in srgb, currentColor 25%, transparent);}
a:hover {text-decoration: none;}

.btn-secondary {--bs-btn-hover-bg: #333;}
.form-text {padding-inline: .8em; font-size: .7em; display: block;}
.dropdown-toggle-split {border-left: 1px solid #fff;}
.modal h5, .modal h6 {font-weight: bold;}
.form-switch {padding-left: 3rem;}
.form-switch .form-check-input {margin-left: -3rem;}

a[title="ČEZ RunTour Winter Edition 2026"]:before {content: "❄️ ";}
a[title="ČEZ RunTour 2024"]:before {content: "☀️ ";}
a[title="ČEZ RunTour 2025"]:before {content: "☀️ ";}
a[title="ČEZ RunTour 2026"]:before {content: "☀️ ";}

.upl-buttons {display: flex; align-items: center; flex-wrap: wrap; gap: 1rem;}

.form-check-input:checked { background-color: var(--bs-secondary); } /* more contrast */

/* utilities */
@media all and (min-width: 768px) {
	.w-md-50 {width: 50% !important;}
}
.gap-10 {gap: 1rem;}
.mw-1200px {max-width: 1200px;}

.h__langs-ico {
    border-radius: 50px;
    width: 1.3em;
    height: 1.3em;
    object-fit: cover;
	vertical-align: text-bottom;
}

.tourswitch {}
	.tourswitch__item--2583.active { box-shadow: 0px -4.8px #fab913;}
	.tourswitch__item--2683.active { box-shadow: 0px -4.8px #fab913;}
	.tourswitch__item--2687.active { box-shadow: 0px -4.8px #03B0E8;}