header {
	float: left;
	width: 100%;
	height: auto;
	background: #262626;
	background-image: url(../img/header.webp);
	background-repeat: repeat;
	background-size: cover;
	background-position: center;
	color: #fff;
}

#header {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	align-content: center;
	justify-content: space-around;
	padding: 50px 0;
	}
	
#header-left {margin: 0;}
#header-right {margin: 25px 0;}

/*** logo ***/
#logo *		{color: #fff;}
#logo 		{display: block;}
#logo a 	{font-size: 30px;}
#logo sup   {font-size: 1rem; margin: 0 3px;}
#logo span 	{display: block; font-size: 18px; font-weight: 400;}

/*** kurz na splátky ***/
#splatky {
	background: #00000085;
	padding: 15px 35px;
	margin: 25px auto;
	border-left: solid 3px #fff;
}
#splatky strong {display: inline-block; padding: 0 3px; font-weight: 700; font-size: 30px;}

/*** začiatok kurzu ***/
#kurz {
	display: flex;
	flex-direction: column;
	gap: 15px;
}
#kurz p {font-weight: 500; font-size: 18px; text-shadow: 1px 1px 3px #00000065;}
#kurz a {
	background: #c20d04;
	background: linear-gradient(180deg,rgba(194, 13, 4, 1) 0%, rgba(143, 10, 10, 1) 100%);
	box-shadow: 1px 1px 5px #00000025;
	text-shadow: 1px 1px 5px #00000080;
	text-align: center;
	line-height: 25px;
	color: #fff;
	font-weight: 500;
	padding: 10px 15px;
	border-radius: 5px;
} #kurz a:hover {
	background: #9a0808;
	/*background: linear-gradient(0deg,rgba(194, 13, 4, 1) 0%, rgba(143, 10, 10, 1) 100%);*/
}

.kurz-time {
	background: #ffffff50;
	box-shadow: 1px 1px 5px #00000025;
	text-align: right;
	line-height: 25px;
	font-weight: 700;
	padding: 10px 15px;
	border-radius: 5px;
	min-width: 140px;
}
.kurz-time img {width: 25px; float: left;}

#header-info 	 {
	display: flex;
	justify-content: center;
	align-items: center;
	background: #0b87dfa3;
	max-width: max-content;
	margin: 35px auto 15px auto;
	border-radius: 5px;
	border: solid 1px #85d0ff57;
}
#header-info img {padding: 10px 0px 10px 15px; width: 25px; height: auto;}
#header-info p 	 {line-height: 20px; padding: 10px 15px 10px 15px; font-weight: 600;}


@media screen and (max-width: 632px) {#header {flex-direction: column;} header {background-image: url(../img/header-small.webp);}}
@media screen and (max-width: 435px) {

#header-info {flex-direction: column; text-align: center; max-width: 300px;}
#header-info img {padding: 15px 0px 5px 0px;}
#header-info p 	 {padding: 10px 15px 25px 15px;}

	#logo {margin: auto; max-width: max-content;}
	#logo a {font-size: 26px;}
	#logo span {font-size: 15px; text-align: center;}

	#splatky {border-left: 0;}
	#splatky strong {font-size: 26px;}

	#kurz p {font-size: 16px; text-align: center; font-weight: 500;}
}