@charset "utf-8";
/* CSS Document */

@font-face {
    font-family: 'raleway';
    /* L'Url est le pointage du dossier depuis la feuille de style et non pas depuis la page */
    src: url('fonts/Raleway-Regular.ttf') format('truetype');
		font-weight: normal;
		font-style: normal;
}

@font-face {
    font-family: 'fugazone';
    /* L'Url est le pointage du dossier depuis la feuille de style et non pas depuis la page */
    src: url('fonts/FugazOne-Regular.ttf') format('truetype');
		font-weight: normal;
		font-style: normal;
}

* { box-sizing: border-box; }
img { width:100%; height:auto; }
a { text-decoration:none; }

html { height:100%; }
body { margin:0; padding:0; font-size:1vw; background-color:#FFFFFF; color:#000000; font-family: 'raleway',Arial, Times, Helvetica, sans-serif; text-align:center; position:relative; min-height:100%; margin-bottom:100px; }
footer { position:absolute; bottom:0; right:0; left:0; }

.flecheHaut { width:0; height:0; border-right:7px solid transparent; border-left:7px solid transparent; border-bottom:10px solid #FFF; margin:5px auto; }
.flecheDroite { width:0; height:0; border-top:7px solid transparent; border-bottom:7px solid transparent; border-left:10px solid #FFF; margin:5px auto; }
.flecheBas { width:0; height:0; border-right:7px solid transparent; border-left:7px solid transparent; border-top:10px solid #FFF; margin:5px auto; }
.flecheGauche { width:0; height:0; border-top:7px solid transparent; border-bottom:7px solid transparent; border-right:10px solid #FFF; margin:5px auto; }

.supBandeau { width:100%; background-color:#FFFFFF; }
	.supBandeauBox { width:100%; max-width:1600px; margin:0 auto; display:flex; padding:20px 0; }
		.supBandeauBox-logo { width:50%; text-align:left; }
			.supBandeauBox-logo div {  max-width:70px; margin-top:12px; padding-right:10px; float:left; font-size:0px; }
			.supBandeauBox-logo h1 { padding-bottom:0; margin-bottom:0; }
		.supBandeauBox-pub { width:50%; min-height:100%; position:relative; }
			.supBandeauBox-pubBox { width:100%; position:absolute; height:72px; display:table; }
				.supBandeauBox-pubBox div { width:100%; vertical-align:middle;display:table-cell; background-color:#F0F0F0; border:#666666 1px dotted; border-radius:6px; }
				.supBandeauBox-pubBox a { color:#FA000B; }

.menu { width:100%; padding:0px 20px; background-color:#FA000B; }
.menuMobile { display:none; }

.mainContent { width:100%; padding:0 20px 100px 20px; background-color:#FFFFFF; }
	.mainContentBande { width:100%; max-width:1600px; margin:1% auto; }
		.bandeTitreRubrique { width:100%; margin:2% 0; background-color:#F7F7F7;  background-image:linear-gradient(to bottom, #FBFBFB, #F1F1F1); background-repear:repeat-x; text-align:left; padding:0.5% 2%; border-left:#000 8px solid;  border-bottom:2px solid #D6D6D6; color:#FA000B; }
			.bandeTitreRubrique h1 { font-size:135%; font-style:italic; letter-spacing:-1px; font-family:'fugazone',Arial, Times, Helvetica, sans-serif; }
				.bandeTitreRubrique h1 a:link, .bandeTitreRubrique h1 a:visited { color:#FA000B; }
				.bandeTitreRubrique h1 a:hover, .bandeTitreRubrique h1 a:active { color:#333333; }

.mainContainer { width:100%; display:flex; }
	.mainContainerColLeft { width:80%; display:flex; flex-wrap:wrap; align-content:flex-start; }
		.eventDetails_title { width:100%; display:flex; flex-wrap:wrap; align-items:center; border-bottom:#FA0008 5px solid; background-color:#CCCCCC; padding:0 1vw; margin-bottom:1vw; position:relative; }
			.eventDetails_title h2 { margin:0; padding:1.9vw 0; }
			.eventDetails_title_close { position:absolute; right:1vw; bottom:1.8vw; font-size:1.5em; }
				.eventDetails_title_close a:link, .eventDetails_title_close a:visited { color:#FA0008; }
				.eventDetails_title_close a:hover, .eventDetails_title_close a:active { color:#000000; }
			.eventDetails_labels { width:100%; display:flex; flex-wrap:wrap; margin-bottom:1vw; align-items:center; }
			.eventDetails_labels_box { margin:0 0.5vw; padding:0.5vw 1vw; border-bottom:#000000 3px solid; background-color:#CCCCCC; display:flex; flex-wrap:wrap; align-items:center; }
				.eventDetails_labels_box:first-child { margin-left:0; }
				.eventDetails_labels_box span { padding-right:0.5vw; color:#FA0008; }
				.eventDetails_labels_box span img { width:auto; max-height:18px; }
			.eventDetails_labels_boxFB { margin:0 0.5vw; font-size:2.5vw; }
				.eventDetails_labels_boxFB a:link, .eventDetails_labels_boxFB a:visited { color:#0000FF; }
				.eventDetails_labels_boxFB a:hover, .eventDetails_labels_boxFB a:active { color:#FA0008; }
		.eventDetailsPrint { width:40%; font-size:0; }
		.eventDetailsBox { width:60%; display:flex; flex-direction:column; padding-left:2vw;}
			.eventDetailsBox_line { width:100%; display:flex; flex-wrap:wrap; align-items:center; padding:0.5vw 0; text-align:left; border-bottom:#000000 1px dotted; }
				.eventDetailsBox_line_picto { width:10%; text-align:center; }
				.eventDetailsBox_line_label { width:20%; }
				.eventDetailsBox_line_text { width:70%; }
					.eventDetailsBox_line_text a:link, .eventDetailsBox_line_text a:visited { color:#FA0008; }
					.eventDetailsBox_line_text a:hover, .eventDetailsBox_line_text a:active { color:#000000; }
					.eventDetailsBox_line_text h4 { margin:0; padding:0; }
			/* INFOBULLE */
			.eventDetailsBox_picto { width:100%; display:flex; flex-wrap:wrap; align-items:center; padding:0.5vw 0; text-align:left; border-bottom:#000000 1px dotted; }
				.eventInfoBulle { min-width:auto; margin:0.25vw; background-color:#333333; text-align:center; font-size:2vw; padding:0.5vw; }
					.eventInfoBulle a { width:100%; padding:0.5vw; color:#FFFFFF; }
						.eventInfoBulle a:hover, .eventInfoBulle a:active { color:#FA0008; }
						.eventInfoBulle a span { position:absolute; max-width:400px; margin-top:23px; margin-left:-35px; color:#FFFFFF; background:rgba(0,0,0,.9); padding:0.5vw; border-radius:8px; box-shadow:0 0 2px rgba(0,0,0,.5); transform:scale(0) rotate(-12deg); transition:all .25s; opacity:0; z-index:2; font-size:0.25vw; }
						.eventInfoBulle a:hover span, .eventInfoBulle a:focus span { transform:scale(1) rotate(0); opacity:1; font-size:0.25vw; }
	
	.mainContainerColRight { width:20%; padding-left:4%; display:flex; flex-wrap:wrap; align-content:flex-start; }
		.mainContainerColRight_title { width:100%; padding:2.25vw 0; background:#CCCCCC; border-bottom:#FA0008 5px solid; }
		.mainContainerColRight_box { width:100%; padding:0.5vw 0; display:flex; flex-wrap:wrap; }
			.mainContainerColRight_box_print { width:100%; font-size:0; }
			.mainContainerColRight_box_title { width:100%; padding:0.5vw 0; background-color:rgba(250, 0, 11); text-shadow:2px 2px 5px #000000; color:#FFFFFF; }




.bottom { bottom:0; left:0; right:0; }

@media only screen and (max-width: 900px) {
	.menu { display:none; }
	.menuMobile { display:block; width:100%; padding:0px 20px; background-color:#FA000B; }

	.mainContainer { width:100%; display:block; }
		.mainContainerColLeft { width:100%; display:flex; flex-direction:column; padding-bottom:5vw; }
		.mainContainerColRight { width:100%; display:block; }
}

@media only screen and (max-width: 640px) {
	body { font-size:4vw; height:100%; padding-bottom:100vw; display:inline-table; }
	
	.supBandeau { display:block; }
		.supBandeauBox { width:90%; height:100%; display:table; padding:0; margin-top:10px; }
			.supBandeauBox-logo { width:100%; display:table-row; font-size:5vw; }
				.supBandeauBox-logo div {  margin-top:0; }
				.supBandeauBox-logo h1 { margin-top:0; }
			.supBandeauBox-pub { display:table-row; position:static; }
				.supBandeauBox-pubBox { position:static;margin:10px 0px; font-size:3vw; }
				.boxEventPub-containerMiddle { font-size:3vw; }
	
	.bandeTitreRubrique h1 { font-size:5vw; }
	.cartoucheBTN { font-size:5vw; }

	.eventDetails_title { font-size:4vw; order:1; margin-bottom:0; padding-bottom:0; }
	.eventDetails_labels { margin-bottom:0; order:3; }
		.eventDetails_labels_box { width:100%; margin:1vw 0; padding:2vw 4vw; }
			.eventDetails_labels_box span { padding-right:2vw; }
			.eventDetails_labels_boxFB { margin:0 auto; font-size:10vw; }
	.eventDetailsPrint { width:100%; order:2; }
	.eventDetailsBox { width:100%; padding-left:0;order:4; }
		.eventDetailsBox_line { padding:2vw 0; font-size:6vw; }
			.eventDetailsBox_line_picto { width:10%; text-align:center; }
			.eventDetailsBox_line_label { width:90%; }
			.eventDetailsBox_line_text { width:100%; text-align:center; }
				.eventDetailsBox_line_text a:link, .eventDetailsBox_line_text a:visited { color:#FA0008; }
				.eventDetailsBox_line_text a:hover, .eventDetailsBox_line_text a:active { color:#000000; }
				.eventDetailsBox_line_text h4 { margin:0; padding:0; }

	.bottom { position:absolute; bottom:0; left:0; right:0; padding-top:100px; }
}