.infoContent{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	width: 100%;
	height: calc(100% - 5px);
	margin-bottom: 0;
	padding: 0;
	align-items: center;
}
.lesson-nav-left{
	display: inline-block;
	width: 50px;
	height: 100%;
}

.lesson-nav-right{
	display: inline-block;
	width: 50px;
	height: 100%;
}
.next-button{
	height: 100% !important;
}
.view-box{
	height: 100%;
	flex-grow: 1;
	overflow: auto;
}
.infoRaam{
	display: block;
	max-width: 800px;
	min-width:320px;
	padding: 0 50px 50px 50px;
	margin: auto;
	margin-top: 30px;
}
.infoRaamFlex{
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	gap:30px;
	max-width: 800px;
	min-width:320px;
	padding: 20px;
	margin: auto;
}
.infoTitle-big{
	display: block;
	width: 100%;
	color: var(--title-fg);
	font-weight: bold;
	font-size: 140%;
	padding-bottom: 50px;
}

.infoTitle{
	color: var(--title-fg);
	font-weight: bold;
	width: 100%;
	padding: 20px 0 5px 0;
}
.lesson-view-box{
	display: inline-flex;
	flex-direction: column;
	flex-wrap: nowrap;
	flex-grow: 1;
	height: 100%;
	padding: 0;
	margin: 0;
	border: none;
	overflow: hidden;
}
.info-row{
	display: inline-flex;
	flex-direction: row;
	flex-wrap: wrap;
	width: 100%;
	height: fit-content;
	justify-content: flex-start;
	align-items: flex-start;
	align-content: flex-start;
	gap:10px;

}
.eu-logo{
	width: 150px;
	float: right;
}
.helpNr{
	color: var(--title-fg);
}
.flext-right{
	flex-direction: row-reverse!important;
}
.upper{
	text-transform: uppercase;
	font-size: 90%;
}
.input-txt{
	padding: 7px!important;
}
.ring {
	border-radius:50%;
	color: var(--title-bg);
	background: var(--title-fg);
	padding:2px 6px 0 6px;
	font-size: 90%;

}
.ringBig {
	border-radius:50%;
	background: var(--title-fg);
	padding:2px 3px 1px 3px;
	font-size: 90%;
	color: var(--title-bg);
}
.split{
	flex-basis: 45%;
}
.infoImg{
	width:50px;
	border:none;
	vertical-align: top;
}
.blockImg{
	border:none;
	min-width: 400px;
}
.blockImg img{
	width: 100%;
}
a.infolink {
    color: var(--link-fg);
    text-decoration: none;
    font-weight: bold;
    font-size:90%;
}

a.infolink:visited {
    color: var(--link-fg);
}
a.infolink:hover {
    text-decoration:underline;
}
.statusRaam{
	display: inline-grid;
	grid-template-columns: auto auto auto;
	gap:10px;
}
.statusTitle{
	color: var(--main-color1);
}
.statusOK{
	color: var(--correct);
	font-weight: bold;
}
.course-logo-txt{
	display: block;
	height: 50px;
	margin-top: 10px;
	margin-left: 10px;
}
.course-logo{
	width: 50px;
	height: 50px;
	border: none;
}

.info-footer {
	position: relative;
	display: inline-block;
	border: 0 none;
	width: 100%;
	height: 40px;
	left: 0;
	float: left;
	background-color: var(--gray-footer);
	text-align: center;
}
.footer{
	background-color: var(--gray-footer);
	border: none;
	padding: 0;
	z-index: 300;
	height: fit-content;
	display: none;
}
.button-row{
	padding: 30px 0 0 30px;
	text-align: center;
}
.formTitle{
	color: var(--main-color1);
}
@media screen and (min-width: 1600px), screen and (min-device-width: 1600px) {
	.infoRaam {
		max-width: 1200px;
	}

	.infoRaamFlex {
		max-width: 1200px;
	}
}
@media screen and (max-width: 1600px), screen and (max-device-width: 1600px) {
	.infoRaam {
		max-width: 800px;
	}

	.infoRaamFlex {
		max-width: 800px;
	}
}
@media screen and (max-width: 750px), screen and (max-device-width: 750px),screen and (orientation: portrait) {
	.infoRaam {
		width: 95%;
		min-width: 250px;
		padding: 0;
	}
	.blockImg {
		min-width: 300px;
	}
	.split{
		flex-basis: 100%;
		width: 95%;
	}
	.lesson-nav-left{
		display: none;
	}
	.lesson-nav-right{
		display: none;
	}
	.footer{
		display: block;
	}
}