body {
  margin: 0;
  color: #434d4b;
  background: #efe9cf;
  background-color:#fff;
  font-family: Arial, "Arial MT", Helvetica, sans-serif;
  font-family: "Open Sans", sans-serif;
  
  
  
  	//background-image:url('img/bg-sub.png');
	background-position:top center;
	background-size:200% auto;
  
  
}


.bg-sub-0{
	background-image:url('img/bg-sub.png');
}


  .swal2-title{
		margin-bottom:20px;
		line-height:30px;
	   }
	   
	   .swal2-timer-progress-bar{
			height:7px;
			border-radius:3px;
			background: rgb(239,0,122);
background: linear-gradient(90deg, rgba(239,0,122,1) 0%, rgba(255,39,0,1) 100%);
	   }
	   
	   .swal2-timer-progress-bar-container{
		background-color:#d6d6d6;
	   }
	   
	   .swal2-title{
		color:#333;
	   }
	   


.bg-sub-1{
	
	background-image:url('img/bg-sub-1-2.png');
	background-position:center center;
	background-size:200% auto;
	backgrounr-repeat:no-repeat;
	
	
}


.bg-sub-2{
	
	background-image:url('img/bg-sub-3.png');
	background-position:top center;
	background-size:200% auto;

	
	
}

.header{
	padding:40px;

	position:relative;
	
}

.header h1{
	font-size:38px;
	font-weight:750;
	line-height:45px;
	margin-top:150px;
}

.header p{
	margin:0px;
	font-size:20px;
	font-weight:600;
}

.img-m{
	margin:0px 20px;
}

.header-left img{
	height:40px;
}

.header-right{
	text-align:right;
}

.header-right img{
	height:34px;
}

.header .container{
	position:relative;
	padding-bottom:50px;

	
}

.gm1{
	position:absolute;
	left:0px;
	bottom:24px;
}	

.gm1 img{
	height:22px;
}


.gm2{
	    position: absolute;
    right: 25%;
    bottom: 65px;
    height: 50px;
}	
.gm2 img{
	height:100px;
	animation: gm2SideHint 2.8s ease-in-out infinite;
	filter: drop-shadow(0 5px 8px rgba(67, 77, 75, .14));
	will-change: transform;
}

.gm3{
	position:absolute;
	right:0%;
	bottom:21%;;
}

.gm3 img{
	height: 70px;
    opacity: 0.6;
}

.middle{
	padding:50px 0px;
}


.middle h2{
	margin: 0 0 30px;
    font-size: 25px;
    line-height: 30px;
    font-weight: 700;
    letter-spacing: 0;
}

.middle p{
	margin: 0 0 15px;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
}

.content p, .content li{
	font-size:14px;
}

.middle-right{
	    padding-top: 94px;
}

.tiles{
	padding:70px 0px;
	padding-bottom:45px;
	background-image:url('img/bg-2.jpg');
	background-position:Center;
	background-size: cover;
}

.tiles a{
	display:block;
	background-color:#efe9cf;
	text-align:center;
	padding:25px;
	color:#434d4b;
	text-decoration:none;
	position:relative;
	padding-bottom:35px;
	margin-bottom:25px;
	box-shadow: 0px 6px 10px 0px rgba(0, 0, 0, 0.25);
	
}

.tiles a span{
	display:block;
}

.tiles .icon{
	background-color:#ffffff;
	width:100px;
	line-height:100px;
	border-radius:50%;
	text-align:center;
	display:inline-block;
}

.tiles .icon img{
	width:40%;
}

.tiles .name{
	margin-top:20px;margin-bottom:0px;
	font-weight:700;
	font-size:22px;
	
	min-height:50px;
	line-height:25px;
}

.tiles .info{
	position:absolute;
	left:30px;right:30px;
	bottom:15px;
	font-size:11px;
	border:1px solid #e94e1b;
	border-radius:5px;
	line-height:22px;
}

.tiles a:hover{
	background-color:#434d4b;
	color:#efe9cf;
}

.footer {
	background-color:#434d4b;
	color:#dfdfdf;
	padding:50px 0px;
}

.footer a{
	color:#dfdfdf;
	text-decoration:none;
	font-size:14px;
}


.footer-left img{
	height:40px;
}

.footer p{
	margin:0px;
	line-height:18px;
}

.footer strong{
	display:block;margin-bottom:15px;
	font-size:20px;
}

/* --- Dynamic effects --- */
.header-right img {
	cursor: pointer;
	transition: transform .25s ease, opacity .25s ease, filter .25s ease;
}

.header-right img:hover {
	transform: scale(1.08) rotate(2deg);
	opacity: .85;
}

/* Subtelne podpowiedzi ruchu */
.gm1 img {
	animation: scrollHint 1.55s ease-in-out infinite;
	filter: drop-shadow(0 5px 7px rgba(67, 77, 75, .16));
	will-change: transform;
}

.gm3 img {
	animation: sideMoveHint 3.1s ease-in-out infinite;
	filter: drop-shadow(0 5px 8px rgba(67, 77, 75, .14));
	will-change: transform;
}

@keyframes scrollHint {
	0%, 100% { transform: translateY(0); opacity: .62; }
	50% { transform: translateY(5px); opacity: .82; }
}

@keyframes sideMoveHint {
	0%, 100% { transform: translateX(0); opacity: .52; }
	50% { transform: translateX(-5px); opacity: .66; }
}

@keyframes gm2SideHint {
	0%, 100% { transform: translateX(0); opacity: .78; }
	50% { transform: translateX(7px); opacity: .95; }
}

/* Tiles: entrance + hover animation */
.tiles .col-12 {
	animation: tileFadeUp .75s ease both;
}

.tiles .col-12:nth-child(1) { animation-delay: .05s; }
.tiles .col-12:nth-child(2) { animation-delay: .12s; }
.tiles .col-12:nth-child(3) { animation-delay: .19s; }
.tiles .col-12:nth-child(4) { animation-delay: .26s; }
.tiles .col-12:nth-child(5) { animation-delay: .33s; }
.tiles .col-12:nth-child(6) { animation-delay: .40s; }
.tiles .col-12:nth-child(7) { animation-delay: .47s; }
.tiles .col-12:nth-child(8) { animation-delay: .54s; }

.tiles a {
	overflow: hidden;
	transition: transform .32s ease, background-color .32s ease, color .32s ease, box-shadow .32s ease;
}

.tiles a::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,.32) 45%, transparent 70%);
	transform: translateX(-120%);
	transition: transform .65s ease;
	pointer-events: none;
}

.tiles a:hover {
	transform: translateY(-8px) scale(1.02);
	box-shadow: 0 16px 24px rgba(0, 0, 0, .28);
}

.tiles a:hover::before {
	transform: translateX(120%);
}

.tiles .icon {
	transition: transform .32s ease, box-shadow .32s ease;
}

.tiles a:hover .icon {
	transform: rotate(-4deg) scale(1.08);
	box-shadow: 0 8px 18px rgba(0, 0, 0, .18);
}

.tiles a:hover .icon img {
	animation: iconPop .45s ease;
}

@keyframes tileFadeUp {
	from { opacity: 0; transform: translateY(28px); }
	to { opacity: 1; transform: translateY(0); }
}

@keyframes iconPop {
	0% { transform: scale(1); }
	50% { transform: scale(1.16); }
	100% { transform: scale(1); }
}

/* Offcanvas w stylu wizualizacji */
#menu.offcanvas {
	width: min(405px, 100vw);
	background: linear-gradient(145deg, #f7ecd7 0%, #efe9cf 54%, #f6ddc6 100%);
	color: #434d4b;
	border-left: 1px solid rgba(67, 77, 75, .18);
	box-shadow: -18px 0 42px rgba(0, 0, 0, .20);
	overflow: hidden;
}

#menu::before,
#menu::after {
	content: "";
	position: absolute;
	pointer-events: none;
}

#menu::before {
	right: -115px;
	bottom: -75px;
	width: 300px;
	height: 430px;
	background: linear-gradient(145deg, rgba(233, 78, 27, .92), #ff5630);
	transform: skewX(-34deg);
	transform-origin: bottom right;
}

#menu::after {
	right: 64px;
	bottom: -60px;
	width: 38px;
	height: 430px;
	background: rgba(255, 255, 255, .72);
	transform: skewX(-34deg);
}

#menu .offcanvas-header,
#menu .offcanvas-body {
	position: relative;
	z-index: 1;
}

#menu .offcanvas-header {
	align-items: center;
	padding: 48px 29px 26px;
	border-bottom: 0;
}

#menu .offcanvas-title {
	margin: 0;
	font-size: 18px;
	font-weight: 800;
	letter-spacing: .3px;
	color: #434d4b;
	text-transform: uppercase;
}

#menu .btn-close {
	width: 34px;
	height: 34px;
	padding: 0;
	background-size: 24px;
	opacity: .95;
	box-shadow: none;
	transition: transform .25s ease, opacity .25s ease;
}

#menu .btn-close:hover {
	transform: scale(1.08) rotate(2deg);
	opacity: .78;
}

#menu .offcanvas-body {
	display: flex;
	flex-direction: column;
	min-height: calc(100% - 108px);
	padding: 44px 29px 28px;
}

#menu .slide-menu-nav {
	display: flex;
	flex-direction: column;
	gap: 0;
}

#menu .slide-menu-nav a {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 72px;
	padding: 10px 48px 10px 0;
	color: #434d4b;
	text-decoration: none;
	font-size: 34px;
	font-weight: 800;
	line-height: 1;
	letter-spacing: -.8px;
	border-bottom: 1px solid rgba(67, 77, 75, .18);
	transition: transform .25s ease, color .25s ease, padding-left .25s ease, border-color .25s ease;
}

#menu .slide-menu-nav a::after {
	content: "";
	position: absolute;
	right: 4px;
	top: 50%;
	width: 14px;
	height: 14px;
	border-top: 3px solid currentColor;
	border-right: 3px solid currentColor;
	transform: translateY(-50%) rotate(45deg);
	transition: right .25s ease, transform .25s ease, color .25s ease;
}

#menu .slide-menu-nav a:hover {
	padding-left: 10px;
	transform: translateX(-4px);
	color: #e94e1b;
	border-color: rgba(233, 78, 27, .35);
}

#menu .slide-menu-nav a:hover::after {
	right: 0;
	transform: translateY(-50%) rotate(45deg) scale(1.08);
}

#menu .menu-footer {
	margin-top: auto;
	padding-top: 56px;
	font-size: 17px;
	line-height: 1.25;
	color: #434d4b;
}

#menu .menu-footer strong {
	display: block;
	font-size: 26px;
	font-weight: 800;
	letter-spacing: -.4px;
}

#menu .menu-footer span {
	display: block;
	margin-top: 3px;
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
		transition-duration: .01ms !important;
	}
}

@media (max-width: 767px) {
	.tiles a:hover { transform: translateY(-4px); }
	#menu.offcanvas { width: 100vw; }
	#menu .offcanvas-header { padding: 48px 29px 24px; }
	#menu .offcanvas-body { padding: 42px 29px 28px; }
	#menu .slide-menu-nav a { min-height: 71px; font-size: 32px; }
	#menu::before { right: -130px; bottom: -85px; width: 285px; height: 390px; }
	#menu::after { right: 70px; bottom: -75px; height: 390px; }
}


/* Rower w headerze jako osobny obrazek — płynna animacja przez transform */
.header .container {
	position: relative;
	overflow: hidden;
}

.header .row,
.header .gm1,
.header .gm2,
.header .gm3 {
	position: relative;
	z-index: 2;
}

.header .gm1,
.header .gm2,
.header .gm3 {
	position: absolute;
}

.bike-float-bg {
	position: absolute;
	left: 50%;
	top: 50%;
	height: 86%;
	width: auto;
	max-width: none;
	pointer-events: none;
	user-select: none;
	z-index: 1;
	transform: translate3d(-50%, -50%, 0);
	animation: bikeImgFloat 5.5s ease-in-out infinite;
	will-change: transform;
	backface-visibility: hidden;
}

@keyframes bikeImgFloat {
	0%, 100% {
		transform: translate3d(-50%, -50%, 0);
	}
	50% {
		transform: translate3d(-50%, calc(-50% + 10px), 0);
	}
}

.only-mobile{
	display:none;
}



h3{
	background-image:url('img/h1.png');
	background-size:45px auto;
	line-height:31px;
	padding-bottom:7px;
	padding-top:7px;
	background-position:left 8px;
	background-repeat:no-repeat;
	padding-left:55px;
	font-weight:700;
	font-size:26px;
	margin-bottom:30px;
	margin-top:30px;
}

h1{
	font-weight:750;
	font-size:33px;
	margin-bottom:0px;
}

h1 .icon{
		background-color:#ffffff;
	width:60px;
	line-height:60px;
	border-radius:50%;
	text-align:center;
	display:inline-block;
}





h1 .icon  img{
	    width: 50%;
    margin-top: -5px;
    margin-right: -8px;
}


.content ul{
	padding-left:0px;
	list-style-type:none;
}

.content ul li{
	background-image:url('img/li.png');
	
	background-size:14px auto;
	padding-left:25px;
	background-position:left 6px;
	background-repeat:no-repeat;
	margin-bottom:15px;
	
	
}

.content{
	padding-bottom:100px;
}

.content .container{
	position:relative;
}


.shape {
    width: 100%;
    height:60px;
    background: #f24c0f;
	color:#fff;
	font-size:20px;
	line-height:60px;
	font-weight:600;
    clip-path: polygon(
        8% 0%,
        100% 0%,
        92% 100%,
        0% 100%
    );
}


.bike-sub{
	position:absolute;top:0px;right:320px;left:auto;
}

.bike-sub .rel{
	position:relative;
}

.bike-sub .bike-float-bg{
	height:562px;top:80px;
}



.input-box{
	margin-bottom:15px;
}

.input-box label{
	color:#434d4b;
	font-weight:750;
	margin-bottom:5px;
	display:block;
	font-size:14px;
}

.input-box .form-control{
	background-color:#434d4b;
	color:#fff5ec;
	font-size:12px;
	padding:15px 25px;
}


.input-box input::placeholder, .input-box textarea::placeholder {
  color:#fff5ec;
  opacity: 1;
}



.btn-day {
  width: 100px;

  height: 48px;
  line-height:48px;
  padding: 0px;
display:inline-block;
  border: 2px solid #5e6664;
  border-radius: 6px;
margin-right:5px;
  font-size: 12px;
  color: #434d4b;
  text-align:center;

  background-color: #fff;
	font-weight:750;
  outline: none;
  text-decoration:none;
}

.btn-day-active{
	border-color:#e94e1b;
	color:#e94e1b;
}

.date-wrapper {
  position: relative;
  display: inline-block;
}

.custom-date {
  width: 180px;
  height: 48px;
  padding: 0 14px 0 44px;

  border: 2px solid #5e6664;
  border-radius: 6px;

  font-size: 14px;
  color: #434d4b;

  background-color: #fff;
	font-weight:750;
  outline: none;
}

.custom-date-min{
	width: 140px;
}

.custom-date::placeholder{
	color: #434d4b;
	opacity:1;
}


.custom-date::-webkit-datetime-edit-fields-wrapper {
  color: #434d4b;
  opacity:1;
}

.custom-date::-webkit-datetime-edit-text {
  color: #434d4b;
  opacity:1;
}

.custom-date::-webkit-datetime-edit-month-field,
.custom-date::-webkit-datetime-edit-day-field,
.custom-date::-webkit-datetime-edit-year-field {
  color: #434d4b;
  opacity:1;
}

/* ukrycie natywnej ikonki */
.custom-date::-webkit-calendar-picker-indicator {
  opacity: 0;
  position: absolute;
  right: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

/* przycisk z ikoną po lewej */
.date-icon-btn {
  position: absolute;
  left: 12px;
  top: 45%;
  transform: translateY(-50%);

  border: none;
  background: transparent;
  cursor: pointer;

  font-size: 18px;
  padding: 0;

  z-index: 2;
}

.custom-date:focus {
  border-color: #5f6865;
  box-shadow: 0 0 0 2px rgba(95, 104, 101, 0.15);
}

/* ukrycie domyślnej ikonki */
.custom-date::-webkit-calendar-picker-indicator {
  opacity: 0;
  cursor: pointer;
}

/* placeholder-like kolor */
.custom-date::-webkit-datetime-edit {
  color: #6b6f6d;
}

/* focus */
.custom-date:focus {
  border-color: #5f6865;
  box-shadow: 0 0 0 2px rgba(95, 104, 101, 0.15);
}


.option-label{
	font-weight:400 !important;
	margin-right:17px;
	float:left;
	margin-top:10px;
}

.option-label input{
	margin-right:8px;
	float:left;
	width:16px;
	height:16px;
}

.option-label span{
	display: block;
    margin-top: -4px;
    float: left;
    font-size: 16px;
}


.option-label input[type='radio'] {
    accent-color: #e94e1b;
}

.checkbox-label input[type='checkbox'] {
    accent-color: #e94e1b;
	margin-right:5px;
}

.checkbox-label{
	display:block;
	width:100%;
	margin-bottom:10px;
}


@media (max-width: 991.98px) {

	.middle2{
		display:none;
	}
	
	.middle .middle-right{
		padding-top:0px;
	}
	
	.gm1{
		display:none;
	}
	
	.gm2{
		//display:none;
	}
	
	.header{
		background-position:right center;
		padding:30px 10px;
	}
	
	.header .container .bike-float-bg{
		display:none;
	}
	
	.only-mobile{
		display:block;
	}
	
	.header .container{
		padding-bottom:20px;
	}
	
	
	
	.bike-float-bg{
	
	    left: 18%;
		top: 73%;
		height: 49%;
	}
	
	.hide-mobile{
		display:none;
	}
	
	
	
}


/* Agenda route page */
.agenda-page h1 { margin-bottom: 18px; }
.agenda-hero { margin-bottom: 45px; }
.agenda-map-intro {
	position: relative;
	width: 86%;
	max-width: 500px;
	margin: 0 auto 40px;
	padding: 26px 24px 58px;
	background: rgba(239, 233, 207, .7);
	box-shadow: 0 12px 24px rgba(67, 77, 75, .12);
	clip-path: polygon(7% 0%, 100% 0%, 93% 100%, 0% 100%);
}
.agenda-map-intro img { width: 100%; display: block; }
.agenda-map-intro .shape { position: absolute; left: 12%; right: 12%; bottom: 16px; width: auto; }
.agenda-route {
	position: relative;
	max-width: 1020px;
	margin: 20px auto 0;
	padding: 25px 0 10px;
}
.agenda-route::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	width: 6px;
	transform: translateX(-50%);
	background: repeating-linear-gradient(to bottom, #e94e1b 0 22px, transparent 22px 36px);
	border-radius: 20px;
	opacity: .78;
}
.agenda-stop {
	position: relative;
	display: flex;
	width: 50%;
	padding: 0 55px 58px 0;
}
.agenda-stop-alt { margin-left: 50%; padding: 0 0 58px 55px; }
.agenda-marker {
	position: absolute;
	top: 10px;
	right: -31px;
	width: 62px;
	height: 62px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 8px 18px rgba(67, 77, 75, .16);
	z-index: 2;
	padding: 7px;
}
.agenda-stop-alt .agenda-marker { left: -31px; right: auto; }
.agenda-marker span {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background: #e94e1b;
	color: #fff;
	font-weight: 800;
	line-height: 48px;
	text-align: center;
	font-size: 18px;
}
.agenda-card {
	position: relative;
	width: 100%;
	background: #efe9cf;
	padding: 34px 50px 30px;
	box-shadow: 0 12px 24px rgba(67, 77, 75, .16);
	clip-path: polygon(7% 0%, 100% 0%, 93% 100%, 0% 100%);
}
.agenda-card::after {
	content: "";
	position: absolute;
	right: 18px;
	bottom: 18px;
	width: 54px;
	height: 9px;
	background: #e94e1b;
	transform: skewX(-34deg);
	opacity: .86;
}
.agenda-date {
	display: inline-block;
	background: #434d4b;
	color: #fff;
	font-weight: 800;
	font-size: 16px;
	line-height: 30px;
	padding: 0 18px;
	margin-bottom: 12px;
	clip-path: polygon(10% 0%, 100% 0%, 90% 100%, 0% 100%);
}
.agenda-card h2 {
	margin: 0 0 14px;
	font-size: 30px;
	line-height: 34px;
	font-weight: 800;
	color: #434d4b;
}
.agenda-card h4 {
	margin: 22px 0 10px;
	font-size: 16px;
	font-weight: 800;
	color: #e94e1b;
}
.agenda-card .agenda-lead { font-size: 15px; line-height: 23px; margin-bottom: 18px; }
.agenda-card small { font-size: 12px; line-height: 18px; color: #5e6866; }
.agenda-note {
	margin-top: 18px;
	margin-bottom: 0;
	font-weight: 700;
	color: #e94e1b;
}
.agenda-card ul { margin-bottom: 0; }
.agenda-card li strong { color: #434d4b; }
@media (max-width: 767px) {
	.agenda-map-intro { width: 100%; margin-top: 30px; }
	.agenda-route::before { left: 31px; transform: none; }
	.agenda-stop, .agenda-stop-alt {
		width: 100%;
		margin-left: 0;
		padding: 0 0 45px 82px;
	}
	.agenda-marker, .agenda-stop-alt .agenda-marker { left: 0; right: auto; }
	.agenda-card { padding: 28px 24px 28px; clip-path: polygon(5% 0%, 100% 0%, 95% 100%, 0% 100%); }
	.agenda-card h2 { font-size: 25px; line-height: 30px; }
}