/* Liste de news ou bons plans, un par ligne avec photo et résumé */

.liste-h1 {
	color: #000;
	text-align: left;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 36px;
	padding: 10px 20px;
	font-weight: 300;
	letter-spacing: 1px;
	display: block;
	text-transform: uppercase;
	margin-top: 10px;
	border-bottom: 3px solid #414043;
}

.liste-h1 a, .liste-h1 a:hover {
	color:#000;
	text-decoration: none;
}

.liste-h2 {
	color: #000;
	text-align: left;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 28px;
	line-height: 42px;
	padding: 40px 20px 0px 10px;
	font-weight: 300;
	letter-spacing: 1px;
	display: block;
	position:relative;
	text-transform: uppercase;
	border-bottom: 3px solid #414043;
}

.titre-h1 {
	color: #000;
	text-align: left;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 28px;
	line-height: 44px;
	padding: 10px 20px 0px 20px;
	font-weight: 300;
	letter-spacing: 1px;
	display: block;
	text-transform: uppercase;
	border-bottom: 3px solid #414043;
}

.titre-h1.admin {
	color:#D50304;
	border-color:#D50304;
}

.titre-h1 a, .titre-h1 a:hover {
	color:#000;
	text-decoration: none;
}

.titre-h1.admin a {
	color:#D50304;
	border-color:#D50304;
}

.titre-h1.admin a:hover {
	text-decoration: underline;
}

.liste-blocnews {
	border-bottom: solid 1px #F3F3F3;
	border-collapse: collapse;
	position: relative;
	background-color: #FFFFFF;
	padding:20px;
	text-align: left;
}

.liste-blocnews:hover {
	background-color: #FAFAFA;
}

.liste-blocnews-photoholder {
	float: left;
	width: 28%;
	margin-right: 20px;
	position:relative;
}

.liste-blocnews-photo {
	width: 100%;
	border: solid #E0E0E0 1px;
	position:relative;
}

.liste-blocnews-details {
	margin-left:28%;
	padding-left: 20px;
}

.liste-blocnews-titre {
	font-size: 20px;
	line-height: 24px;
	padding-bottom: 8px;
}

.liste-blocnews:hover #breakingnews, .liste-blocnews:hover #breakingnewsexpire {
	color:#0099FF;
}

.liste-blocnews:hover .liste-blocnews-titre {
	color: #0099FF;
}

.liste-blocnews-resume {
	color:#5A5E66;
	font-size:13px;
	line-height: 18px;
}

.liste-blocnews-date {
	color:#c7c7c7;
	font-weight: bold;
	font-size:12px;
	padding-top: 8px;
}

.label-expire {
	background-color: #b0b0b0;
	border-radius: 4px;
	display: inline-block;
	color: #ffffff;
	font-size: 12px;
	line-height: 20px;
	font-weight: bold;
	padding: 1px 7px;
	margin-right: 6px;
	vertical-align: text-top;
}


@media screen and (max-width:500px){
	.liste-h1 {
		font-size:26px;
		padding: 10px 12px 4px 12px;
	}

	.liste-h2 {
		font-size:22px;
		padding: 20px 12px 4px 12px;
		line-height: 32px;
	}
	
	.liste-blocnews-resume {
		display:none;
	}
	
	.liste-blocnews-titre {
		font-size: 16px;
		line-height: 22px;
	}
	
	.liste-blocnews-date {
		font-weight: normal;
		padding-top: 0;
	}
	
	.liste-blocnews-photoholder {
		width: 36%;
		margin-right: 12px;
	}
	
	.liste-blocnews-details {
		margin-left:36%;
		padding-left: 12px;
	}
	
	.liste-blocnews {
		padding:12px;
	}
	
	.label-expire {
		line-height: 16px;
	}
}



/* Liste de news ou bons plans, un par ligne avec photo et résumé */
.dernieresnews-h1 {
	color: #fff;
	font-size: 14px;
	padding: 0 10px;
	line-height: 20px;
	padding: 10px 10px;
	font-weight: 300;
	letter-spacing: 1px;
	background-color: #414043;
	text-transform: uppercase;
}

.dernieresnews-h1 a, .dernieresnews-h1 a:hover {
	color:#fff;
	text-decoration: none;
}

.dernieresnews-bloc {
	box-sizing: border-box;
	/* padding:20px; */
}

.dernieresnews-news {
	position: relative;
	margin: 14px;
	text-align: left;
	display: grid;
	grid-template-columns: 106px auto;
	grid-gap: 10px;
}

.dernieresnews-news a {
	color: #000;
	text-decoration:none;
	display: inline-block;
	position: relative;
}

.dernieresnews-news:hover a {
	color:#0099FF;
	text-decoration:none;
}

.dernieresnews-titre {
	font-size: 14px;
	line-height: 20px;
	font-weight: bold;
	display: inline-block;
}

.dernieresnews-photo {
	border: solid #E0E0E0 1px;
	max-width: 100%;
	height: auto;
	box-sizing: border-box;
}





/* Liste sans images (derniers posts du forum) */
.derniersposts {
	padding: 14px;
}

.derniersposts-liste li {
	background-image : url(/images/plusloin.png);
	background-repeat:no-repeat;
	background-position:0px 3px;
	list-style:none;
	text-align:left;
	font-size:13px;
	color:#000000;
	padding-left:10px;
	margin-bottom: 10px;
}
	

.derniersposts-liste a {
        color:#000000;
        text-decoration:none;
}
.derniersposts-liste a:hover {
        text-decoration:underline;
}






/* Pagination */
.pagination {
	padding : 10px 16px;
}

.pagination-page {
	background-color:#ebebeb;
	border-radius: 4px;
	color:#000;
	text-decoration: none;
	font-size: 14px;
	line-height: 34px;
	padding: 0 8px;
	margin : 5px 4px;
	min-width:34px;
	display: inline-block;
	box-sizing: border-box;
}

.pagination-page:hover {
	text-decoration: none;
	background-color:#0099FF;
	color:#fff;
}

.pagination-active {
	background-color:#414043;
	border-radius: 4px;
	color:#fff;
	text-decoration: none;
	font-size: 14px;
	line-height: 34px;
	padding: 0 8px;
	margin : 5px 4px;
	min-width:34px;
	display: inline-block;
	box-sizing: border-box;
}

.pagination-inactive {
	background-color:#fafafa;
	border-radius: 4px;
	color:#C6C6C6;
	text-decoration: none;
	font-size: 14px;
	line-height: 34px;
	padding: 0 8px;
	margin : 5px 4px;
	min-width:34px;
	display: inline-block;
	box-sizing: border-box;
}

@media screen and (max-width:500px){
	.pagination {
		padding : 10px 4px;
	}
	
	.pagination-page {
		padding: 0 4px;
		margin : 5px 4px;
	}
}


/* Depeche - bon plan */

.depeche {
	color: #000000;
	text-align: left;
	font-size: 15px;
	line-height: 28px;
	font-weight: normal;
	margin: 20px;
}

.depeche h1 {
	font-size: 36px;
	line-height: 44px;
	font-weight: 300;
	letter-spacing: 0;
}

.depeche-h2 {
	text-align: left;
	font-size: 18px;
	font-weight: 300;
	text-transform: uppercase;
	letter-spacing: 1px;
	line-height: 24px;
	background-color: #fff;
	padding: 20px 20px 4px 0;
	margin: 0 20px;
	position:relative;
	border-bottom: solid 3px #414043;
}

.depeche-complement {
	text-align:left;
	font-size:14px;
	line-height: 24px;
	margin: 20px;
	padding: 20px;
	background-color:#f5f5f5;
}

.depeche-complement a {
	color: #000;
}

.news-share {
	padding: 0 20px;
	margin-bottom: 40px;
}

.news-share span {
	float: right;
	margin-left: 8px;
	font-size: 18px;
}

.news-share span a:hover {
	text-decoration: none;
}

.news-share span a:hover i {
	filter: brightness(120%);
}

.news-share span i {
	margin-left: 8px;
}

.news-share p {
	text-align: right;
	font-size: 13px;
	line-height: 20px;
	font-weight: bold;
}

.boutons-partage {
	margin: 0 20px;
}

.memesujet {
	margin: 20px 20px;
}





/* Réactions aux news */

.reaction-bloc {
	padding: 10px 0;
}

.reaction-news {
	margin: 10px 20px;
	background-color: #f5f5f5;
}

.reaction-news-infos {
	font-size: 14px;
	font-weight: bold;
	padding: 14px 14px 10px 14px;
}

.reaction-news-infos-auteur {
	float: left;
}

.reaction-news-infos-auteur a {
	color:#000;
	font-size: 14px;
}

.reaction-news-infos-auteur a:hover {
	text-decoration:underline;
}

.reaction-news-infos-date {
	text-align: right;
	font-size: 14px;
}

.reaction-news-avatar {
	width: 50px;
	max-height:100px;
}

.reaction-news-reaction {
	text-align: left;
	font-size: 14px;
	line-height: 26px;
	overflow-x: hidden;
	text-overflow: ellipsis;
	padding: 0 20px 10px 0;
}

.reaction-formulaire {
	margin: 10px 20px 0 20px;
	text-align: left;
}

.reaction-formulaire textarea {
	width: 100%;
	box-sizing: border-box;
	border: 1px solid #DCDCDC;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 26px;
}


@media screen and (max-width:500px) {
	.depeche, .depeche-complement, .reaction-formulaire, .boutons-partage {
		margin-left: 14px;
		margin-right: 14px;
	}

	.depeche-h2 {
		margin: 0 14px;
	}
	
	.reaction-news {
		margin: 10px 14px;
	}
}



/* Affichage des news sur la home */
.depeche-h2-accueil {
	text-align: left;
	font-size: 18px;
	font-weight: 300;
	text-transform: uppercase;
	letter-spacing: 1px;
	line-height: 24px;
	background-color: #fff;
	padding: 20px 20px 4px 10px;
	margin: 0 10px;
	border-bottom: solid 3px #414043;
}
.depeche-h2-accueil a, .depeche-h2 a {
	text-decoration: none;
	color:#000;
}

.depeche-h2-accueil a:hover, .depeche-h2 a:hover {
	text-decoration: none;
	color:#000;
}
.liste-blocnews-accueil {
	padding: 10px 10px;
	margin: 0 10px;
	border-bottom: solid 1px #F3F3F3;
	text-align: left;
}

.liste-blocnews-accueil:hover {
	background-color: #FAFAFA;
}

.liste-blocnews-accueil:hover .liste-blocnews-titre-accueil {
	color: #0099FF;
}
.liste-blocnews-accueil:hover #breakingnews {
	color: #0099FF;
}

.liste-blocnews-photoholder-accueil {
	float: left;
	width: 33%;
	margin-right: 14px;
	position:relative;
}

.liste-blocnews-details-accueil {
	margin-left: 33%;
	padding-left: 14px;
}

.liste-blocnews-titre-accueil {
	font-size: 16px;
	line-height: 20px;
	font-weight: bold;
	padding-bottom: 6px;
}

.liste-blocnews-resume-accueil {
	color:#909090;
	font-size:14px;
	line-height:20px;
}


.liste-blocnews-bouton {
	background-color: #414043;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	display: inline-block;
	color: #ffffff;
	font-size: 14px;
	line-height: 16px;
	padding: 6px 12px;
	margin-top: 10px;
}

.liste-blocnews-bouton:hover {
	background-color:#0099FF;
	color:#ffffff;
	text-decoration: none;
}

.liste-blocnews-bouton:active {
	background-color:#008eec;
}