/* Définition des polices */

@font-face {
    font-family: 'rochester';
    src: url('polices/Rochester-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'ralewaysemibold';
    src: url('polices/raleway-semibold-webfont.eot');
    src: url('polices/raleway-semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('polices/raleway-semibold-webfont.woff2') format('woff2'),
         url('polices/raleway-semibold-webfont.woff') format('woff'),
         url('polices/raleway-semibold-webfont.ttf') format('truetype'),
         url('polices/raleway-semibold-webfont.svg#ralewaysemibold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'ralewaylight';
    src: url('polices/raleway-light-webfont.eot');
    src: url('polices/raleway-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('polices/raleway-light-webfont.woff2') format('woff2'),
         url('polices/raleway-light-webfont.woff') format('woff'),
         url('polices/raleway-light-webfont.ttf') format('truetype'),
         url('polices/raleway-light-webfont.svg#ralewaylight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'brawler';
    src: url('polices/Brawler.otf');
    font-weight: normal;
    font-style: normal;
}

/*------------------------------------------------------------------------------------*/
/*-------------------------------- Contenu de la page --------------------------------*/
/*------------------------------------------------------------------------------------*/

.contenu
{
	margin-bottom: 100px;
}

@media all and (min-width: 500px) and (max-width: 750px)
{
	.contenu
	{
		font-size: 17px;
	}
}

@media all and (max-width: 500px)
{
	.contenu
	{
		font-size: 15px;
	}
}

@media all and (max-width: 280px)
{
	.contenu
	{
		margin-bottom: 50px;
	}
}

.contenu_texte
{
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;      /* TWEENER - IE 10 */
	display: -webkit-flex;     /* NEW - Chrome */
	display: -moz-flex;		   /* Firefox 18+*/
	display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
	-webkit-box-orient: vertical;
	-moz-box-orient: vertical;
	-ms-flex-direction: column;
	-webkit-flex-direction: column;
	-moz-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: center;
	-moz-box-pack: center;
	-ms-flex-pack: center;	
	-webkit-justify-content: center;
	-moz-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	-moz-align-items: center;
	align-items: center;
	margin: auto;
	padding: 0px;
	margin-top: 75px;
	/*overflow: hidden;*/
}

@media all and (min-width: 280px) and (max-width: 880px)
{
	.contenu_texte
	{
		margin-top: 75px;
	}
}

@media all and (max-width: 280px)
{
	.contenu_texte
	{
		margin-top: 40px;
	}
}

/* Partie gauche du contenu*/

.contenu_gauche
{
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;      /* TWEENER - IE 10 */
	display: -webkit-flex;     /* NEW - Chrome */
	display: -moz-flex;		   /* Firefox 18+*/
	display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
	-webkit-box-orient: vertical;
	-moz-box-orient: vertical;
	-ms-flex-direction: column;
	-webkit-flex-direction: column;
	-moz-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: justify;
	-moz-box-pack: justify;
	-ms-flex-pack: justify;	
	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
	justify-content: space-between;
	-webkit-box-align: end;
	-moz-box-align: end;
	-ms-flex-align: end;
	-webkit-align-items: flex-end;
	-moz-align-items: flex-end;
	align-items: flex-end;
	position: absolute;
	left: 0;
}

.logo_contenu
{
	overflow:hidden;
	margin: 10px 20px 10px 20px;
	padding: 0px;
}

#coups_oeil
{
	width: 195px;
}

#coups_coeur
{
	width: 225px;
}

.category
{
	position: relative;
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;      /* TWEENER - IE 10 */
	display: -webkit-flex;     /* NEW - Chrome */
	display: -moz-flex;		   /* Firefox 18+*/
	display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
	-webkit-box-orient: horizontal;
	-moz-box-orient: horizontal;
	-ms-flex-direction: row;
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	flex-direction: row;
	-webkit-box-pack: end;
	-moz-box-pack: end;
	-ms-flex-pack: end;	
	-webkit-justify-content: flex-end;
	-moz-justify-content: flex-end;
	justify-content: flex-end;
	-webkit-box-align: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	-moz-align-items: center;
	align-items: center;
	margin: 0px;
	padding: 0px;
	text-decoration: none;
}

#coups_oeil-category
{
	left: 135px;
	-webkit-transition: all 1s;
    -moz-transition: all 1s;
    -ms-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s;
}

#coups_oeil-category:hover
{
	left: 0px;
}

#coups_coeur-category
{
	left: 165px;
	-webkit-transition: all 1s;
    -moz-transition: all 1s;
    -ms-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s;
}

#coups_coeur-category:hover
{
	left: 0px;
}

.category p
{
	color: #6e6e6e;
	font-family: ralewaysemibold;
	margin: 0px;
	margin-left: 10px;
	padding: 0px;
}

#coups_oeil-texte
{
	width: 125px;
	font-size: 1.2em;
}

#coups_coeur-texte
{
	width: 155px;
	font-size: 1.2em;
}

.logo
{
	height: 60px;
	width: 60px;
	position: relative;
	margin: 0px;
	padding:0px;
}

.svg-logo
{
	position: absolute;
	height: 100%;
	width: 100%;
}


@media all and (min-width: 1200px) and (max-width: 1300px)
{
	#coups_oeil
	{
		width: 155px;
	}
	#coups_coeur
	{
		width: 180px;
	}
	#coups_oeil-category
	{
		left: 110px;
	}
	#coups_coeur-category
	{
		left: 140px;
	}
	#coups_oeil-texte
	{
		width: 100px;
		font-size: 1em;
	}
	#coups_coeur-texte
	{
		width: 130px;
		font-size: 1em;
	}
	.logo
	{
		height: 40px;
		width: 40px;
	}
}

@media all and (min-width: 1000px) and (max-width: 1200px)
{
	.contenu_gauche
	{
		left: 5%;
	}
	#coups_oeil
	{
		width: 100%;
	}
	#coups_coeur
	{
		width: 100%;
	}
	#coups_oeil-category
	{
		left: 0px;
	}
	#coups_coeur-category
	{
		left: 0px;
	}
	.category p
	{
		display: none;
	}
	.logo
	{
		height: 40px;
		width: 40px;
	}
}

@media all and (min-width: 880px) and (max-width: 1000px)
{
	.contenu_gauche
	{
		left: 10px;
	}
	.logo_contenu
	{
		overflow:hidden;
		margin: 10px 0px 10px 0px;
		padding: 0px;
	}
	#coups_oeil
	{
		width: 100%;
	}
	#coups_coeur
	{
		width: 100%;
	}
	#coups_oeil-category
	{
		left: 0px;
	}
	#coups_coeur-category
	{
		left: 0px;
	}
	.category p
	{
		display: none;
	}
	.logo
	{
		height: 40px;
		width: 40px;
	}
}

@media all and (max-width: 880px)
{
	.contenu_gauche
	{
		display: none;
	}
}

/*logo coups d'oeil*/
.svg-logo #path6576
{
	fill:#6e6e6e;
}

/*logo coups de coeur*/
.svg-logo #path5886
{
	fill:none;
	stroke:#6e6e6e;
}

.svg-logo #path5903
{
	fill:#6e6e6e;
}

.svg-logo #path5905, .svg-logo #path5905-0
{
	fill:#6e6e6e;
	fill-opacity:1;
	stroke:#6e6e6e;
}

/* Partie centrale du contenu*/

.contenu_entete
{
	position: relative;
	width: 95%;
	margin: auto;
}

@media all and (max-width: 880px)
{
	.contenu_entete
	{	
		position: static;
		height: auto;
		min-height: 0px;
		overflow: hidden;
	}
}

.contenu_entete img
{
	width: 100%;
	margin: 0px;
	padding: 0px;
}

.contenu_central_titres
{
	max-width: 750px;
	width: 94.7%;
	position: absolute;
	bottom: -30px;
	left: 50%;
	margin: 0px 0px 0px -386px;
	background: #ffffff;
	padding: 5px 10px 10px 10px;
	border: white solid 2px;
	border-radius: 5px;
	font-family: georgia;
}

@media all and (max-width: 880px)
{
	.contenu_central_titres
	{
		position: static;
		margin: 0px;
	}
}

.contenu_central_titres h1
{
	padding: 0px;
	margin: 0px;
	font-size: 2em;
	color: #6e6e6e;
	line-height: 1.5;
}


.contenu_central_titres h2
{
	padding: 0px;
	margin: 0px;
	font-size: 1.2em;
	color: #6e6e6e;
	line-height: 1.5;
	font-style: italic;
}


@media all and (min-width: 400px) and (max-width: 600px)
{
	.contenu_entete h1
	{	
		font-size: 1.8em;
	}
	.contenu_entete h2
	{	
		font-size: 1.1em;
	}
}

@media all and (min-width: 320px) and (max-width: 400px)
{
	.contenu_entete h1
	{	
		font-size: 1.6em;
	}
	.contenu_entete h2
	{	
		font-size: 1em;
	}
}

@media all and (max-width: 320px)
{
	.contenu_entete h1
	{	
		font-size: 1.4em;
	}
	.contenu_entete h2
	{	
		font-size: 0.9em;
	}
}

@media all and (max-width: 280px)
{
	.contenu_entete h1
	{	
		font-size: 1.2em;
	}
	.contenu_entete h2
	{	
		font-size: 0.8em;
	}
}

.contenu_central
{
	max-width: 750px;
	width: 90%;
	color: #6e6e6e;
	font-size: 1em;
	text-align: justify;
	line-height: 1.5;
	margin: 0px;
	padding: 30px 10px 0px 10px;
}

@media all and (max-width: 880px)
{
	.contenu_central
	{
		padding: 20px 10px 0px 10px;
	}
}

.contenu_central_resume
{
	font-family: brawler;/*ralewaysemibold;*/
}

.contenu_central_citation
{
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;      /* TWEENER - IE 10 */
	display: -webkit-flex;     /* NEW - Chrome */
	display: -moz-flex;		   /* Firefox 18+*/
	display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
	-webkit-box-orient: horizontal;
	-moz-box-orient: horizontal;
	-ms-flex-direction: row;
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	flex-direction: row;
	-webkit-box-pack: center;
	-moz-box-pack: center;
	-ms-flex-pack: center;	
	-webkit-justify-content: center;
	-moz-justify-content: center;
	justify-content: center;
	-webkit-box-align: start;
	-moz-box-align: start;
	-ms-flex-align: start;
	-webkit-align-items: flex-start;
	-moz-align-items: flex-start;
	align-items: flex-start;
	width: 80%;
	font-size: 1.1em;
	font-style: italic;
	color: #5e94be;
	margin: auto;
	font-family: brawler;
}

.contenu_central_citation p
{
	width: 90%;
	margin: auto;
}

.guillemet_citation
{
	height: 30px;
	width: 30px;
	position: relative;
	margin: 0px 5px 0px 5px;
	padding:0px;
}

.svg-guillement-citation
{
	position: absolute;
	height: 100%;
	width: 100%;
}

#guillemet_citation_droite
{
	-moz-box-align-self: end;
	-webkit-box-align-self: end;
	-ms-flex-item-align: end;
	-webkit-align-self: flex-end;
	-moz-align-self: flex-end;
	align-self: flex-end;
}

.contenu_central_photo_double, .contenu_central_photo_simple
{
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;      /* TWEENER - IE 10 */
	display: -webkit-flex;     /* NEW - Chrome */
	display: -moz-flex;		   /* Firefox 18+*/
	display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
	-webkit-box-orient: horizontal;
	-moz-box-orient: horizontal;
	-ms-flex-direction: row;
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	flex-direction: row;
	-webkit-box-pack: justify;
	-moz-box-pack: justify;
	-ms-flex-pack: justify;	
	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
	justify-content: space-between;
	-webkit-box-align: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	-moz-align-items: center;
	align-items: center;
	margin: 50px 0px 50px 0px;
}

.contenu_central_photo_double img
{
	width: 49.5%;
	height: auto;
}

.contenu_central_photo_simple img
{
	width: 100%;
	height: auto;
}

@media all and (min-width: 400px) and (max-width: 600px)
{
	.contenu_central_photo_double, .contenu_central_photo_simple
	{	
		margin: 40px 0px 40px 0px;
	}
}

@media all and (max-width: 400px)
{
	.contenu_central_photo_double, .contenu_central_photo_simple
	{	
		margin: 30px 0px 30px 0px;
	}
}

.note_bas_page
{
	font-size: 0.8em;
	vertical-align: top;
	cursor: pointer;
}

.texte_barre
{
	text-decoration: line-through;
}

.contenu_navigation
{
	max-width: 650px;
	width: 80%;
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;      /* TWEENER - IE 10 */
	display: -webkit-flex;     /* NEW - Chrome */
	display: -moz-flex;		   /* Firefox 18+*/
	display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
	-webkit-box-orient: horizontal;
	-moz-box-orient: horizontal;
	-ms-flex-direction: row;
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	flex-direction: row;
	-webkit-box-pack: justify;
	-moz-box-pack: justify;
	-ms-flex-pack: justify;	
	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
	justify-content: space-between;
	-webkit-box-align: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	-moz-align-items: center;
	align-items: center;
	margin: 0px;
	padding: 20px 10px 80px 10px;
}

@media all and (max-width: 880px)
{
	.contenu_navigation
	{
		padding: 10px 10px 20px 10px;
	}
}

.contenu_navigation a
{
	display: block;
}

.fleche_navigation
{
	text-decoration: none;
	color: #6e6e6e;
}
	
.logo_fleche
{
	height: 40px;
	width: 40px;
	position: relative;
}

@media all and (max-width: 500px)
{
	.logo_fleche
	{
		height: 30px;
		width: 30px;
	}
}

.fleche_navigation p
{
	display: none;
	margin: 0px;
	line-height: 40px;
	height: 40px;
}

@media all and (max-width: 500px)
{
	.fleche_navigation p
	{
		line-height: 30px;
		height: 30px;
	}
}

.svg_logo_fleche
{
	position: absolute;
	height: 100%;
	width: 100%;
}

.fleche_navigation:hover p
{
	display: block;
}

.fleche_navigation:hover .logo_fleche
{
	display: none;
}

/* Bannière du bas*/
.banniere_bas
{
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;      /* TWEENER - IE 10 */
	display: -webkit-flex;     /* NEW - Chrome */
	display: -moz-flex;		   /* Firefox 18+*/
	display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
	-webkit-box-orient: horizontal;
	-moz-box-orient: horizontal;
	-ms-flex-direction: row;
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	flex-direction: row;
	-webkit-box-pack: center;
	-moz-box-pack: center;
	-ms-flex-pack: center;	
	-webkit-justify-content: center;
	-moz-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	-moz-align-items: center;
	align-items: center;
	margin: 0px;
	padding: 0px;
}

@media all and (max-width: 880px)
{
	.banniere_bas
	{
		margin-top: 0px;
	}
}

.category_banniere
{
	width: 60px;
	height: 60px;
	margin: 10px;
	cursor: pointer;
}

@media all and (max-width: 320px)
{
	.category_banniere
	{
		margin: 5px;
	}
}

#coeurs_banniere, #commentaires_banniere, #trombone_banniere
{
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;      /* TWEENER - IE 10 */
	display: -webkit-flex;     /* NEW - Chrome */
	display: -moz-flex;		   /* Firefox 18+*/
	display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
	-webkit-box-orient: horizontal;
	-moz-box-orient: horizontal;
	-ms-flex-direction: row;
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	flex-direction: row;
	-webkit-box-pack: center;
	-moz-box-pack: center;
	-ms-flex-pack: center;	
	-webkit-justify-content: center;
	-moz-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	-moz-align-items: center;
	align-items: center;
	text-decoration: none;
}

#suivi_banniere
{
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;      /* TWEENER - IE 10 */
	display: -webkit-flex;     /* NEW - Chrome */
	display: -moz-flex;		   /* Firefox 18+*/
	display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
	-webkit-box-orient: vertical;
	-moz-box-orient: vertical;
	-ms-flex-direction: column;
	-webkit-flex-direction: column;
	-moz-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: center;
	-moz-box-pack: center;
	-ms-flex-pack: center;	
	-webkit-justify-content: center;
	-moz-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	-moz-align-items: center;
	align-items: center;
	position: relative;
}

.logo_banniere
{
	height: 30px;
	width: 30px;
	position: relative;
}

@media all and (max-width: 320px)
{
	.logo_banniere
	{
		height: 20px;
		width: 20px;
		position: relative;
	}
}

.svg-logo_banniere
{
	position: absolute;
	height: 100%;
	width: 100%;
}

#coeurs_banniere p, #commentaires_banniere p, #trombone_banniere p
{
	display: none;
	margin: 0px;
	margin-left: 5px;
	padding: 0px;
	color: #6e6e6e;
}

#coeurs_banniere:hover p, #commentaires_banniere:hover p, #trombone_banniere:hover p
{
	display: block;
}

.logo_banniere_bis
{
	display: none;
	-webkit-box-orient: horizontal;
	-moz-box-orient: horizontal;
	-ms-flex-direction: row;
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	flex-direction: row;
	-webkit-box-pack: center;
	-moz-box-pack: center;
	-ms-flex-pack: center;	
	-webkit-justify-content: center;
	-moz-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	-moz-align-items: center;
	align-items: center;
	position: absolute;
	top: 50px;
	left: -35px;
	background: #e7e7e7;
	border-radius: 7px;
}

.logo_banniere_ter
{
	display: none;
	position: absolute;
	top: 40px;
	left: 25%;
	width: 20px;
	height: 20px;
}

#suivi_banniere:hover .logo_banniere_bis
{
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;      /* TWEENER - IE 10 */
	display: -webkit-flex;     /* NEW - Chrome */
	display: -moz-flex;		   /* Firefox 18+*/
	display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
}

#suivi_banniere:hover .logo_banniere_ter
{
	display: block;
}

.logo_suivi
{
	width: 20px;
	height: 20px;	
	position: relative;
	margin: 5px;
	fill: #ffffff;
}

.svg-logo_suivi
{
	position: absolute;
	height: 20px;
	width: 20px;
}

.logo_suivi:hover
{
	fill:#6e6e6e;
}

.svg-logo_banniere_ter
{
	position: absolute;
	height: 100%;
	width: 100%;
}

/*commentaires*/

.comments
{
	display: none;
	-webkit-box-orient: vertical;
	-moz-box-orient: vertical;
	-ms-flex-direction: column;
	-webkit-flex-direction: column;
	-moz-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: center;
	-moz-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	-moz-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	-moz-align-items: center;
	align-items: center;
	margin: 10px auto 0px auto;
	padding: 0px;
	max-width: 700px;
	width: 85%;
}

.comments.show_comments
{
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;      /* TWEENER - IE 10 */
	display: -webkit-flex;     /* NEW - Chrome */
	display: -moz-flex;		   /* Firefox 18+*/
	display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
}

.comments_affichage
{
	width: 100%;
	margin: 0px;
	padding: 0px;
}

.section_comments
{
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;      /* TWEENER - IE 10 */
	display: -webkit-flex;     /* NEW - Chrome */
	display: -moz-flex;		   /* Firefox 18+*/
	display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
	-webkit-box-orient: vertical;
	-moz-box-orient: vertical;
	-ms-flex-direction: column;
	-webkit-flex-direction: column;
	-moz-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: start;
	-moz-box-pack: start;
	-ms-flex-pack: start;
	-webkit-justify-content: flex-start;
	-moz-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-box-align: start;
	-moz-box-align: start;
	-ms-flex-align: start;
	-webkit-align-items: flex-start;
	-moz-align-items: flex-start;
	align-items: flex-start;
	width: 100%;
	margin: 10px 0px 10px 0px;
	padding: 0px;
}

.section_comments_info
{
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;      /* TWEENER - IE 10 */
	display: -webkit-flex;     /* NEW - Chrome */
	display: -moz-flex;		   /* Firefox 18+*/
	display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
	-webkit-box-orient: horizontal;
	-moz-box-orient: horizontal;
	-ms-flex-direction: row;
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	flex-direction: row;
	-webkit-box-pack: start;
	-moz-box-pack: start;
	-ms-flex-pack: start;
	-webkit-justify-content: flex-start;
	-moz-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-box-align: end;
	-moz-box-align: end;
	-ms-flex-align: end;
	-webkit-align-items: flex-end;
	-moz-align-items: flex-end;
	align-items: flex-end;
	margin: 0px;
	padding: 0px;
}

.section_comments_pseudo
{
	font-family: rochester;
	font-size: 1.3em;
	margin: 0px 10px 0px 0px;
	padding: 0px 0px 0px 0px;
	color: #5e94be;
	width: 110px;
}

.section_comments_nous
{
	font-family: rochester;
	font-size: 1.3em;
	margin: 0px 10px 0px 0px;
	padding: 0px 0px 0px 0px;
	color: #fb7373;
	width: 110px;
}

@media all and (max-width: 440px)
{
	.section_comments_pseudo, .section_comments_nous
	{
		margin: 0px 5% 0px 0px;
	}
}

@media all and (max-width: 380px)
{
	.section_comments_pseudo, .section_comments_nous
	{
		font-size: 1.2em;
		width: 70px;
	}
}

.section_comments_date
{
	font-family: ralewaysemibold;
	font-size: 0.9em;
	margin: 0px 0px 0px 10px;
	padding: 0px 0px 0px 0px;
	width: 70%;
}

@media all and (max-width: 380px)
{
	.section_comments_date
	{
		font-size: 0.8em;
		-webkit-box-align-self: end;
		-moz-box-align-self: end;
		-ms-flex-item-align: end;
		-webkit-align-self: flex-end;
		-moz-align-self: flex-end;
		align-self: flex-end;
	}
}

@media all and (max-width: 280px)
{
	.section_comments_date
	{
		width: 100px;
	}
}

.section_comments_contenu
{
	width: 95%;
	padding: 5px 0px 5px 20px;
	margin: 0px;
	text-align: justify;
	font-size: 0.9em;
	overflow: hidden;
}

@media all and (max-width: 440px)
{
	.section_comments_contenu
	{
		width: 90%;
		padding: 5px 0px 5px 10%;
	}
}

/* formulaire */

#svg-loader-img
{
	display: none;
}

#svg-loader-img.attente
{
	display: block;
	position: fixed;
	top: 40%;
	left: 48%;
	z-index: 901;
	width: 5%;
}

form
{
	width: 100%;
	font-size: 0.9em;
}

.form_comment
{
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;      /* TWEENER - IE 10 */
	display: -webkit-flex;     /* NEW - Chrome */
	display: -moz-flex;		   /* Firefox 18+*/
	display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
	-webkit-box-orient: horizontal;
	-moz-box-orient: horizontal;
	-ms-flex-direction: row;
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	flex-direction: row;
	-webkit-box-pack: justify;
	-moz-box-pack: justify;
	-ms-flex-pack: justify;	
	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
	justify-content: space-between;
	-webkit-box-align: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	-moz-align-items: center;
	align-items: center;
	margin: 0px;
	padding: 0px;
	margin: 40px 0px 0px 0px;
}

@media all and (max-width: 500px)
{
	.form_comment
	{
		-webkit-box-orient: vertical;
		-moz-box-orient: vertical;
		-ms-flex-direction: column;
		-webkit-flex-direction: column;
		-moz-flex-direction: column;
		flex-direction: column;
		-webkit-box-align: start;
		-moz-box-align: start;
		-ms-flex-align: start;
		-webkit-align-items: flex-start;
		-moz-align-items: flex-start;
		align-items: flex-start;
	}
}


.form_comment_info
{
	margin: 0px 0px 10px 20px;
	padding: 0px;
}

@media all and (max-width: 800px)
{
	.form_comment_info
	{
	width: 40%;
	min-width: 150px;
	}
}

@media all and (max-width: 380px)
{
	.form_comment_info
	{
	margin: 0px 0px 10px 0px;
	}
}

.form_comment_info label
{
	margin: 0px 5px 0px 5px;
	padding: 0px;
}

@media all and (max-width: 500px)
{
	.form_comment_info:first-child label
	{
		margin: 0px 45px 0px 5px;
	}
}

.form_comment_info input
{
	margin: 0px 5px 0px 5px;
	padding: 3px;
	border-radius: 1px;
	border: #5e94be 1px solid;
	font-family: Verdana;
	font-size: 0.9em;
}

@media all and (max-width: 400px)
{
	.form_comment_info input
	{
		display: block;
	}
}

.form_comment_contenu
{
	margin: 10px 0px 10px 20px;
	padding: 0px;
}

@media all and (max-width: 380px)
{
	.form_comment_contenu
	{
		margin: 10px 0px 10px 0px;
	}
}

.form_comment_contenu textarea
{
	width: 100%;
	height: 100px;
	padding: 3px;
	border-radius: 1px;
	border: #5e94be 1px solid;
	font-family: Verdana;
	font-size: 0.9em;
}

@media all and (max-width: 500px)
{
	.form_comment_contenu textarea
	{
		width: 95%;
	}
}

.form_comment_publier
{
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;      /* TWEENER - IE 10 */
	display: -webkit-flex;     /* NEW - Chrome */
	display: -moz-flex;		   /* Firefox 18+*/
	display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
	-webkit-box-orient: horizontal;
	-moz-box-orient: horizontal;
	-ms-flex-direction: row;
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	flex-direction: row;
	-webkit-box-pack: center;
	-moz-box-pack: center;
	-ms-flex-pack: center;	
	-webkit-justify-content: center;
	-moz-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-moz-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	-moz-align-items: center;
	align-items: center;
	margin: 20px 0px 10px 20px;
	padding: 0px;
}

@media all and (max-width: 380px)
{
	.form_comment_publier
	{
		margin: 0px 0px 10px 0px;
	}
}

.form_comment_publier input
{
	font-family: ralewaylight;
	font-size: 1em;
	cursor: pointer;
	background-color: #ffffff;
	text-decoration: none;
	color: #5e94be;
	border-radius: 1px;
	border: #5e94be 1px solid;
	padding: 7px 12px 7px 12px;
}

@media all and (max-width: 250px)
{
	.form_comment_publier input
	{
		padding: 7px 5px 7px 5px;
	}
}

.form_comment_publier input:hover
{
	opacity: 0.5;
}