.mainDivPageConference{
	background: linear-gradient(-45deg, #a38c55, #e8db9d, #e5e5e5, #cfaf50);
	background-size: 400% 400%;
	animation: gradient 15s ease infinite;
}

@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}

.FolderLink{
	float: left;
	margin: 5px;
}

.imageAndDescriptionContainer{
	position: absolute;
	top: 20%;
	bottom: 20%;
	width: 100%;
	overflow: auto;
	scrollbar-width: thin;
}

.imageContainerDiv{
	height: 100%;
	float: left;
	width: 50%;
	text-align: center;
}

.imageConference{
	max-width: 100%;
	max-height: 100%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	box-shadow: 20px 15px 15px #888;
}

.descriptionConference{
	float: left;
	width: 50%;
}


.buttonDownloadConf{
	font-size: 9pt;
	padding: 5px;
	padding-left: 8px;
	padding-right: 8px;
	margin: 5px;
	bottom: 0;
}

.player{
	width: 80%;
	position: fixed;
	bottom: 0px;
}
.commentaire-container{
	background-color: #ffffff4f;
	padding: 20px;
	margin: 10px;
}

.comment-container {
	display: flex;
	background: white;
	padding: 5px;
}

.comment-container textarea{
	width: 100%;
	border: medium none;
	padding: 12px;
	color: #665e4a;
	resize: none;
}

.comment-container button {
	padding-left: 10px;
	padding-right: 10px;
	font-weight: bold;
}

.commentaire{
	background-color: white;
	padding: 10px;
	display: flex;
	margin-top: 10px;
}

.commentaire .user-icone{
	width: 50px;
}

@media (max-width: 991px){
	.player{
		width: 100%;
	}
}


@media (max-width: 767px){
	.imageAndDescriptionContainer{
		overflow: scroll;
		bottom: 30px;
	}

	.imageContainerDiv{
		height: 300px;
		float: inherit;
		width: 100%;
		text-align: center;
	}

	.imageConference{
		max-width: 80%;
		max-height: 100%;
	}

	.descriptionConference{
		float: inherit;
		width: 100%;
		text-align: center;
	}

	.buttonDownloadConf{
		position: relative;
	}
	
}