/* SECTION REPONSE */
#section-dernier-evenement {
	position: relative;
	width: calc(100%);
	margin: 0 auto;
	padding: 0;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-content: center;
	align-items: stretch;
	background-color: #F3D8D6;
	border-top: 1px solid #555;
	min-height: 80px;
}

#section-dernier-evenement #no-event.hide {
	text-align: left;
	line-height: 80px;
	padding: 0 40px 0 40px;
	width: 100%;
	display: flex;
	flex-direction: row;
	align-items: center;
}
#section-dernier-evenement #no-event p,
#section-dernier-evenement #no-event a { flex: 1; }
#section-dernier-evenement #no-event p { font-size: 1.5rem; }
#section-dernier-evenement #no-event a { flex: 0.5; }
#section-dernier-evenement #no-event a button { padding: 10px; width: 100%; }
#section-dernier-evenement #no-event.display { display: none; }

#section-dernier-evenement #titre { 
	flex: 1;
	font-size: 1.6vw;
	text-align: left;
	padding: 0;

	position: relative;
	background-color: #C83832; /*rgba(8, 139, 73, 1); /*#0D5047;*/
	text-align: right;
	color: #FFF;

	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	align-content: center;
	padding: 40px 0 40px 0;
}

#section-dernier-evenement.hide #titre { display: none; }

#section-dernier-evenement #titre  #cadre { 
	border: 2px solid #FFF; 
	border-radius: 5px;
	padding: 0px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin: 0 40px 0 40px;
	padding-bottom: 20px;
	width: calc(100% - 80px);
}

#section-dernier-evenement #titre #contenu h1 { text-transform: uppercase; width: calc(100% - 20px); padding: 10px; background-color: white; color: #C83832; }

#section-dernier-evenement #titre #mb-contenu { display: none; }

#section-dernier-evenement #titre #contenu {
	text-align: center;
	padding: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	background-color: transparent;
	width: calc(100%);
}

#section-dernier-evenement.hide #contenu { height: 50px; }

#section-dernier-evenement #contenu #boutons,
#section-dernier-evenement #titre #boutons {
	flex: 0.4;
	text-align: center;
	padding: 0;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	margin-top: 20px;
	width: 100%;
}

#section-dernier-evenement #contenu #boutons { display: none; }

#section-dernier-evenement #titre #boutons a { margin: 0 auto; text-align: center; width: 100%; }

#section-dernier-evenement #titre #boutons .bouton,
#section-dernier-evenement #contenu #boutons .bouton {
	color: white;
	font-size: 1.1rem;
	border: 2px solid #FFF;
	border-radius: 5px;
	padding: 5px;
	margin-top: 20px;
	width: calc(100% - 10px);
	text-transform: uppercase;
	cursor: pointer;
}

#section-dernier-evenement #titre #boutons .bouton {
	width: calc(100% - 90px);
	margin: 0 auto;
	text-align: center;
}

#section-dernier-evenement #titre #boutons .bouton:hover {
	background-color: white;
	color: #0D5047;
}

#section-dernier-evenement #titre #contenu #date {
	border: 0; /*1px solid #FFF;*/
	padding: 0;
	margin-top: 20px;
	border-radius: 5px;
	width: 100%;
}

#section-dernier-evenement #titre #date p {
	color: #FFF;
	padding: 0;
	margin: 0;
	font-size: 1.7rem;
	text-transform: capitalize;
	text-align: center;
}

#section-dernier-evenement #titre #date p:first-child { padding: 10px; }
#section-dernier-evenement #titre #date p:nth-child(2) { padding: 20px; font-size: 5rem; margin-bottom: 10px; }
#section-dernier-evenement #titre #date p:nth-child(3) { font-size: 3rem; margin-bottom: 10px; }
#section-dernier-evenement #titre #date p:last-child { background-color: #FFF; padding: 10px; color: red; width: calc(100% - 20px); text-align: center; }
#section-dernier-evenement #titre #date p:last-child { background-color: transparent; padding: 10px; color: white; width: calc(100% - 20px); text-align: center; }

#section-dernier-evenement #titre h1 { font-size: 1.2rem; color: #FFF; padding: 0; text-transform: capitalize; }
#section-dernier-evenement #titre img { width: 30%; margin-right: 20px; padding: 5px; }

#section-dernier-evenement #contenu {
	flex: 3;	
	display: flex;
	flex-direction: row;
	background-color: #F3D8D6;
	padding: 40px;
}
#section-dernier-evenement.hide #contenu { display: none; }

#section-dernier-evenement #contenu #texte {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding-right: 20px;
}

#section-dernier-evenement #contenu #texte p { flex: 2; }
#section-dernier-evenement #contenu #texte h1 { text-align: left; }
#section-dernier-evenement #contenu #texte h2 { text-transform: uppercase; color: #D2312A; text-align: left; font-size: 1.1rem; }
#section-dernier-evenement #contenu #texte #duration { display: flex; align-items: flex-end; color: #FF0000; font-size: 1.2rem; }
#section-dernier-evenement #contenu #texte a { color: blue; }
#section-dernier-evenement #contenu #texte a:hover { text-decoration: underline; }

#section-dernier-evenement #contenu #flyer { flex: 0.4; }
#section-dernier-evenement #contenu #flyer img { 
	width: 100%; 
	height: 100%;
	padding: 0px; 
	-webkit-box-shadow: 2px 5px 14px 0px rgba(0,0,0,0.27); 
	box-shadow: 2px 5px 14px 0px rgba(0,0,0,0.27);
	object-fit: cover;
	object-position: top;
}
#section-dernier-evenement.hide #flyer { display: none; }

@media only screen and (max-width: 768px) {

	#section-dernier-evenement { padding: 0; min-height: calc(100vh - 8vh); }

	#section-dernier-evenement #titre { padding: 0; }

	#section-dernier-evenement #titre  #cadre { 
		border: 1px solid #FFF; 
		border-radius: 5px;
		padding: 0px;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		margin: 0 20px 0 20px;
		padding-bottom: 20px;
		width: calc(100% - 40px);
	}

	#section-dernier-evenement #titre #contenu #date { margin-top: 5px; }

	#section-dernier-evenement #titre #date p {	font-size: 1.3rem; }
	#section-dernier-evenement #titre #date p:nth-child(2) { padding: 10px; font-size: 4rem; margin-bottom: 10px; }		
	
	#section-dernier-evenement #contenu #flyer { display: none; }
	#section-dernier-evenement #titre #boutons { display: none; }

	#section-dernier-evenement #contenu { flex: 2.6; flex-direction: column; padding: 20px; }
	#section-dernier-evenement #contenu #texte { padding: 0; }
	#section-dernier-evenement #contenu #boutons {	
		width: 100%;
		padding: 0;
		display: flex;
		justify-content: flex-end;
		text-align: right;
		margin-top: 20px;
		margin-right: 0;
	}
	#section-dernier-evenement #contenu #boutons .bouton { border-color: #555; color: #555; font-size: 0.8rem; }

}

@media only screen and (max-width: 500px) {

	#section-dernier-evenement {
		position: relative;
		display: block;
		margin: 0;
		padding: 0;
		height: auto;
		min-height: 60vh;
		width: calc(100%);
	}

	#section-dernier-evenement.hide { min-height: unset; }

	#section-dernier-evenement #no-event.hide {
		margin: 0;
		padding: 10px;
		line-height: unset;
		width: calc(100% - 20px);
		flex-direction: column;
		align-items: center;
		align-content: center;
		justify-content: center;
	}
	#section-dernier-evenement #no-event p,
	#section-dernier-evenement #no-event a { 
	}

	#section-dernier-evenement #no-event p { font-size: 1.5rem; line-height: 1.8rem; text-align: center; }
	#section-dernier-evenement #no-event a { margin-top: 20px; margin-bottom: 20px; }
	#section-dernier-evenement #no-event a button { padding: 10px; width: 100%; }

	#section-dernier-evenement #titre { 
		padding: 10px;
		width: calc(100% - 20px);
		display: block;
	}

	#section-dernier-evenement #titre #cadre { padding: 0; margin: 0; border: 0; width: 100%; }

	#section-dernier-evenement #titre #contenu { display: none; }
	#section-dernier-evenement #titre #cadre #mb-contenu { 
		display: block; 
		margin: 0;
		padding: 0;
		width: calc(100% - 0px);
	}

	#section-dernier-evenement #titre #cadre #mb-contenu div { 
		padding: 0;
		margin: 0;
		color: #FFF;
		font-size: 1.1rem;
		line-height: 1.3rem;
		width: 100%;
		text-align: left;
	}

	#section-dernier-evenement #titre #boutons { display: none; }

	#section-dernier-evenement #contenu #boutons {	
		position: relative;
		margin: 0;
		padding: 0;
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		min-width: 100%;
		width: 100%;
	}

	#section-dernier-evenement #contenu #boutons a { 
		padding: 0;
		bottom: 0;
		width: 100%; 
		min-width: 100%;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		text-align: center;		
	}
	
	#section-dernier-evenement #contenu #boutons .bouton {
		color: white;
		font-size: 1.2rem;
		border: 2px solid #555;
		border-radius: 5px;
		padding: 5px 5px 5px 5px;
		margin-top: 20px;
		margin-bottom: 20px;
		width: calc(100% - 10px);
		text-transform: uppercase;
		cursor: pointer;
		background-color: #555;
	}

	#section-dernier-evenement #contenu { display: block; width: calc(100% - 20px); padding: 10px; }
	#section-dernier-evenement #contenu #texte { display: block; width: 100%; }
	#section-dernier-evenement #contenu #texte h1 { font-size: 1.4rem; }
	#section-dernier-evenement #contenu #texte h2 { font-size: 1.0rem; margin-bottom: 10px; }

	#section-dernier-evenement #contenu #texte p { font-size: 1.1rem; line-height: 1.3rem; }
	#section-dernier-evenement #contenu #texte #duration { font-size: 1rem; margin-bottom: 10px; }


	#section-dernier-evenement #contenu #flyer { 
		display: flex; 
	}
	
	#section-dernier-evenement #contenu #flyer img { 
		width: 100%; 
		-webkit-box-shadow: unset; 
		box-shadow: unset;	
		background-color: #FFF;
		padding: 0; 
		margin-top: 10px; 
		border: 2px solid #555; 
		border-radius: 5px; 		
	}
}