.sliderContainer {

	/* positioning values */
	padding-top:42%;
	height:0px;
	position: relative;
	overflow: hidden; /*thats the important attribute */
	text-align:left;
	
	/* animation values */
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-flow: row nowrap;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
	-webkit-box-align: end;
	-webkit-align-items: flex-end;
	-ms-flex-align: end;
	align-items: flex-end;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.slideNav {
	width: 12px;
	height: 12px;
	margin: 2rem 12px;
	z-index: 5;
	outline: 6px solid #ccc;
	outline-offset: -6px;
	box-shadow: 0 0 0px 0px #333;
	cursor: pointer;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.slideNav:checked {
	-webkit-animation: check 0.8s linear forwards;
	animation: check 0.8s linear forwards;
}
.slideNav:checked:nth-of-type(1) ~ .sliderElements {
	left: 0%;
}
.slideNav:checked:nth-of-type(2) ~ .sliderElements {
	left: -100%;
}
.slideNav:checked:nth-of-type(3) ~ .sliderElements {
	left: -200%;
}
.slideNav:checked:nth-of-type(4) ~ .sliderElements {
	left: -300%;
}
.slideNav:checked:nth-of-type(5) ~ .sliderElements {
	left: -400%;
}
.slideNav:checked:nth-of-type(6) ~ .sliderElements {
	left: -500%;
}

.sliderElements {
	position: absolute;
	top: 0;
	left: 0;
	width: 600%;
	-webkit-transition: left 0.8s;
	transition: left 0.8s;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-flow: row nowrap;
	-ms-flex-flow: row nowrap;
	flex-flow: row nowrap;
}

.sliderElementContainer {
	width:600%;
}

.sliderElementPicture {
	width:100%
}

#sliderOverlayLogo {
	background-image: url("/grph/scout_adac_356.png");
	width:356px;
	height:163px;
	z-index:4;
	position: absolute;
	top:55px;
	left:5px;
}

#sliderOverlayText {
	background-color: #000046;
	padding: 15px;
	position:absolute;
	top:15px;
	right:15px;
	z-index:4;
	font-size:36px;
	color:#FFFFFF;
}

@-webkit-keyframes check {
  50% {
    outline-color: #333;
    box-shadow: 0 0 5px 5px black;
  }
  100% {
    outline-color: #333;
    box-shadow: 0 0 0px 0px black;
  }
}

@keyframes check {
  50% {
    outline-color: #333;
    box-shadow: 0 0 5px 5px black;
  }
  100% {
    outline-color: #333;
    box-shadow: 0 0 0px 0px black;
  }
}

.infoEntryText {
	text-overflow: ellipsis;
	white-space: nowrap; 
	height:25px;
	overflow: hidden;
}

.infoEntryText p, .newsPreviewText p  {
	margin:0px;
}




/* Design 2024 */

.banderoleBackground, .banderoleRegister {
	width:100%;
	background-color:lightgrey;
}

.banderole {
	width:70%;
	margin:auto;
}

.banderoleNewsHeadline {
	color:#000046;
	text-align:center;
	width:100%;
	font-size:50px;
	padding-top:30px;
	padding-bottom:15px;
}

.newsContainer {
	width: 71%;
	margin: auto;
	display:grid;
	grid-template-columns:33.33333% 33.33333% 33.33333%;
	row-gap:30px;
}

.newsEntryContainer {
	margin:8px;
}

.newsImage {
	height:250px;
	width:100%;
	background-repeat:no-repeat;
	background-position:center;
	background-size:contain;
	background-color:#DFDFDF;
}

.newsTitle {
	color:#000046;
	font-size:28px;
	line-height:56px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	height:60px;
}

.newsSpacer {
	width:100%;
	border-top:1px solid #eb7517;
	margin-top:5px;
	margin-bottom:15px;
}

.newsPreviewText {
	width:100%;
	padding-bottom:5px;
	height:60px;
}

.newsLink {
	margin-top:5px;
	text-decoration:underline;
	font-size:14px;
	cursor:pointer;
}

.nixLink {
	margin-top:5px;
	color:#AFAFAF;
	font-size:14px;
}

#newsDetailsContainer {
	position: fixed;
	width: 50%;
	border: 1px solid black;
	top: 50px;
	background-color: white;
	margin: auto;
	left: 25%;
	padding: 15px;
	z-index:6;
	overflow-y: scroll;
}

#newsDetailsContainer div.newsPreviewText {
	height:unset;
}

.hidden {
	display:none;
}

.button {
	background-color: #000046;
	padding: 15px;
	font-size: 16px;
	color:#FFFFFF;
	border-width:0px;
	cursor:pointer;
}

.loadMoreNEwsButtonContainer {
	width:100%;
	text-align:center;
}

#loadMoreNewsButton {
	width:200px;
}

#loadMoreNewsButton .loadingIcon {
	margin:auto;
}

#toEventsListButton {
	font-weight:bold;text-align:right;font-size:16px;cursor:pointer;line-height:20px;
	height:20px;
}

.toEventsListButtonIcon {
	display:block;
	float:right;
	width: 20px;
	height: 20px;
	line-height: 20px;
	background-position: center;
	background-size: 18px 18px;
	background-repeat: no-repeat;
	margin-left:5px;
}

.registrationButtons {
	display:grid;
	grid-template-columns:50% 50%;
}

.registrationButtons div {
	background-color: #000046;
	padding: 15px;
	padding-left:55px;
	z-index: 4;
	font-size: 36px;
	color: #FFFFFF;
	background-image: url("/grph/registration.svg");
	background-size: 36px 36px;
	background-repeat: no-repeat;
	background-position: 10px center;
	cursor: pointer;
}

.registrationButtons div a, .registrationButtons div a:hover, .registrationButtons div a:active, .registrationButtons div a:visited {
	color:#FFFFFF;
	text-decoration:none;
}

@media (max-width: 1024px) {
	.banderole {
		width:100%;
	}
	
	#sliderOverlayText {
		font-size:20px;
		top:10px;
		right:5px;
		padding:5px;
	}
	
	.banderoleNewsHeadline {
		font-size:30px;
		padding-top:5px;
		padding-bottom:5px;
	}
	
	.newsTitle {
		font-size:25px;
		line-height:30px;
		height:30px;
		margin-top:5px;
		margin-bottom:5px;
	}
	
	.newsPreviewText {
		height:unset;
	}
	
	#banderoleNextEvent .newsPreviewText {
		height:30px;
	}
	
	#toEventsListButton {
		margin-top:5px;
		margin-bottom:20px;
		
	}
	
	.toEventsListButtonIcon {
		margin-right:2px;
	}
	
	.newsEntryContainer {
		margin-bottom:15px;
	}
	
	#newsDetailsContainer {
		top:2%;
		width:88%;
		left:2%;
		max-height:80%;
	}
}

@media (max-width: 1023px) {
	.newsContainer {
		width:100%;
		grid-template-columns:100%;
		row-gap: 2px;
	}

	.registrationButtons {
		grid-template-columns:100%;
	}

	.registrationButtons div {
		font-size:20px;
		background-size:25px 25px;
	}
}

@media (min-width: 1024px) and (max-width: 1740px) {
	.newsContainer {
		width:94%;
	}
	
	.newsImage {
		height:200px;
	}

	.registrationButtons div {
		font-size:25px;
		background-size:30px 30px;
		padding: 5px;
		padding-left:45px;
	}
}

@media (min-width: 1920px) {
	.newsContainer, .banderole {
		width:1400px;
	}
}