.actualites {
	width: 100%;
	float: left;
	background: #f6f6f6;
	padding: 40px 0px;
	position: relative;
	.actualites__item {
		position: relative;
		width: 50%;
		display: block;
		margin-bottom: 40px;
		cursor: pointer;
		&:first-child {
			text-align: left;
			.more {
				right: 50%;
			}
			.description {
				left: 50%;
			}
		}
		&:nth-child(2) {
			text-align: right;
			float: right;
			.more {
				left: 50%;
			}
			.description {
				right: 50%;
				&__title {
					float: right;
				}
			}
		}
		.more {
			position: absolute;
			bottom: 0;
			a {
				background: $main-dark-color;
				display: block;
				width: 30px;
				height: 30px;
				padding: 7.5px;
			}
		}
		.description {
			position: absolute;
			bottom: 0;
			width: 50%;
			&__date {
				padding: 10px 32px;
				font-family: $AkzidenzGroteskStd-Regular;
				background: $main-dark-color;
			}
			&__title {
				background: #fff;
				color: $main-dark-color;
				padding: 20px 32px;
				text-transform: uppercase;
				text-decoration: underline;
				font-size: 20px;
				width: 140%;
			}
		}
	}
	.actualites__listitem {
		width: 25%;
		float: left;
		padding: 5px;
		margin-bottom: 20px;
		cursor: pointer;
		.description {
			position: relative;
			padding: 20px 20px 0px 20px;
			background: #fff;
			&__date {
				font-family: $AkzidenzGroteskStd-Regular;
				padding: 7px 23px;
				background: $main-dark-color;
				position: absolute;
				left: 0;
				bottom: 100%;
				cursor: inherit;
			}
			&__title {
				color: $main-dark-color;
				font-size: 20px;
				text-transform: uppercase;
			}
			.more {
				width: 30px;
				height: 30px;
				margin-top: 20px;
				a {
					background: $main-dark-color;
					width: 30px;
					height: 30px;
					padding: 7.5px;
					position: absolute;
					right: 0;
				}
			}
		}
	}
	.actualites__item--open {
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		position: relative;
		overflow: hidden;
		width: 100%;
		display: none;
		.image {
			position: relative;
			width: 50%;
			float: left;
			z-index: 1;
			height: 80vh;
			background-size: cover !important;
			background-position: center !important;
			.arrows {
				position: absolute;
				right: 0;
				bottom: 40px;
				width: 40px;
				height: 40px;
				background: #fff;
				padding: 10px;
				cursor: pointer;
				img {
					height: 15px;
				}
			}
		}
		.description__wrapper {
			padding: 40px 0px;
			width: 45%;
			float: left;
			position: absolute;
			z-index: 0;
			right: 5%;
			transition: -webkit-transform 1s ease;
			transition: transform 1s ease;
			transition: transform 1s ease, -webkit-transform 1s ease;
			-webkit-transform: translateX(-100%);
					transform: translateX(-100%);
			z-index: 0;
			&--open {
				-webkit-transform: translateX(0);
						transform: translateX(0);
			}
			.description {
				padding: 50px;
				background: $main-dark-color;
				overflow: auto;
				height: calc(80vh - 80px);
				.title {
					text-transform: uppercase;
					font-size: 24px;
					text-decoration: underline;
				}
				.title--secondary {
					text-decoration: none;
					font-size: 18px;
					margin: 15px 0px 10px 0px;
					text-transform: uppercase;
				}
				.content {
					font-family: $AkzidenzGroteskStd-Regular;
					margin-top: 20px;
					ul {
						padding: 0px;
						list-style-position: inside;
					}
				}
			}
			.cross {
				position: absolute;
				display: block;
				top: 60px;
				right: 20px;
				cursor: pointer;
				img {
					height: 18px;
				}
			}
			.download {
				display: block;
				position: absolute;
				right: 20px;
				bottom: 60px;
				img {
					height: 30px;
				}
			}
		}
	}
}

@media all and (max-width: $desktop-lg) {
	.actualites {
		.actualites__item {
			width: 70%;
		}
	}
}


@media all and (max-width: $desktop-sm) {
	.actualites {
		.actualites__item {
			width: 70%;
			&:first-child {
				.more {
					right: 70%;
				}
				.description {
					left: 0%;
				}
			}
			&:nth-child(2) {
				.more {
					left: 70%;
				}
				.description {
					right: 0%;
				}
			}
			.more {
				display: none;
			}
			.description {
				width: 100%;
				&__date {
					padding: 10px 15px;
				}
				&__title {
					width: 100%;
					padding: 10px 15px;
				}
			}
		}
		.actualites__listitem {
			width: 50%;
		}
		.actualites__item--open {
			-webkit-flex-direction: column;
				-ms-flex-direction: column;
					flex-direction: column;
			.image {
				width: 100%;
				.arrows {
					bottom: 0;
					width: 	80px;
					img {
						margin: 0px 10px;
					}
				}
			}
			.description__wrapper {
				padding-top: 0px;
				padding-bottom: 0px;
				width: 100%;
				position: relative;
				right: 0;
				.description {
					height: 350px !important;
					.title {
						font-size: 20px;
					}
				}
				.cross {
					position: absolute;
					display: block;
					top: 20px;
					right: 20px;
					img {
						height: 18px;
					}
				}
				.download {
					display: block;
					position: absolute;
					right: 20px;
					bottom: 20px;
					img {
						height: 30px;
					}
				}
			}
		}
	}
}

@media all and (max-width: $tablet) {
	.actualites {
		.actualites__item {
			width: 100%;
		}
		.actualites__listitem {
			width: 100%;
		}
	}
}