/***** actualites *****/
#blog .blog 							{ display: grid; grid-template-columns: 1fr 1fr 1fr; grid-gap: 60px 40px; margin: -20px auto;}
#blog .blog .item 						{ position: relative;}
#blog .blog .item a 					{ display: block; text-align: center;}
#blog .blog .item .photo 				{ position: relative; overflow: hidden; border-top-left-radius: 12px; border-top-right-radius: 12px;}
#blog .blog .item .photo img 			{ display: block; width: 100%; height: auto; transition: filter 400ms ease-in-out;}
#blog .blog .item .photo .date 			{ width: 105px; height: 30px; text-align: center; font-size: 11px; line-height: 30px; font-weight: 400; border-radius: 25em; background: var(--bgColorLight); color: var(--mainColor2); position: absolute; right: 20px; top: 20px; text-transform: uppercase; letter-spacing: 0.8px; z-index: 10;}
#blog .blog .item .titre 				{ padding: 12px 30px 17px 30px; font-weight: 500; border-bottom-left-radius: 12px; border-bottom-right-radius: 12px; background: var(--bgColorLight);color: var(--mainColor1); display: grid; align-items: center; min-height: 80px; line-height: 24px; transition: color 400ms ease-in-out;}

@media (min-width:1201px) {
#blog .blog .item a:hover .photo img	{ filter: brightness(0.65);}
#blog .blog .item a:hover .titre 		{ color: #ffb600;}
}
@media (max-width:1200px) {
#blog .blog 							{ grid-template-columns: 1fr 1fr; grid-gap: 20px;}
#blog .blog .item .photo 				{ border-top-left-radius: 10px; border-top-right-radius: 10px;}
#blog .blog .item .photo .date 			{ right: 15px; top: 15px;}
#blog .blog .item .titre 				{ border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;}
}
@media (max-width:1000px) {
#blog .blog 							{ margin: 0 auto;}
#blog .blog .item .photo .promo 		{ transform: scale(0.85); transform-origin: left top; left: 15px; top: 15px;}
}
@media (max-width:700px) {
#blog .top_page .chapo 					{ display: none;}
#blog .blog 							{ grid-template-columns: 1fr;}
#blog .blog .item .photo 				{ border-top-left-radius: 5px; border-top-right-radius: 5px;}
#blog .blog .item .photo .promo 		{ transform: scale(0.70);}
#blog .blog .item .photo .date 			{ width: 90px; height: 29px; font-size: 11px; line-height: 29px;}
#blog .blog .item .titre 				{ padding: 15px 25px; min-height: inherit; font-size: 14px; line-height: 20px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px;}
}


#blog .article .photo     				{ margin: 40px auto 50px auto; max-width: 750px;}
#blog .article .photo img				{ border-radius: 15px; width: 100%; height: auto;}
#blog .article .content h1,
#blog .article .content h3,
#blog .article .content h4,
#blog .article .content h5,
#blog .article .content h6 				{ font: 500 clamp(18px, 2vw, 30px)/140% "Poppins"; letter-spacing: 0; position: relative; margin: 40px 0 15px 0;}
#blog .article .content ul				{ margin-bottom: 15px;}

@media (max-width:1200px) {
#blog .article .photo img				{ margin: 40px 0; border-radius: 10px;}
#blog .article .content  				{ margin: 40px 0;}
}
@media (max-width:1000px) {
#blog .article .photo img				{ margin: 30px 0;}
#blog .article .content  				{ margin: 30px 0;}
}
@media (max-width:700px) {
#blog .article .photo img				{ margin: 25px 0; border-radius: 5px;}
#blog .article .content  				{ margin: 25px 0;}
#blog .article .content h1,
#blog .article .content h2,
#blog .article .content h3,
#blog .article .content h4,
#blog .article .content h5,
#blog .article .content h6 				{ font-size: 18px; line-height: 26px; margin: 20px 0 10px 0;}
#blog .article .content ul				{ margin-bottom: 10px;}
#blog .article .content ul li			{ padding-left: 18px;}
#blog .article .content ul li:before	{ top: 15px; width: 5px; height: 5px;}
}






