/* @changelog 2026-03-25 [FIX] (Gérald) Ajustement de présentation du blog (2026-75834) */
 img{
	vertical-align: bottom;
	 height: auto;
	 max-width: 100%;
	 width: auto; 
 }

 /*GESTION DE LA LISTE*/
 .blogPostsList .headExpertise {
	 padding-bottom: 0;
 }
  body.blogNew{

	/*disposition specifique*/
	@media (min-width: 768px) {
	  
	.list_article_wrap .globalWrapper{
	  display: grid;
	  grid-template-columns: repeat(3, 1fr);
	  grid-template-rows: repeat(2, 1fr);
	  grid-column-gap: 0px;
	  justify-content: center;
	  grid-row-gap: 0px;
	}
	.blogItem {
	  position: relative;
	  width: 94%;
	  max-width:100%;
	}

	/*premiere info*/
	.globalWrapper .blogItem:first-child{
	  width: 98%;
	  grid-area: 1 / 1 / 2 / 4;
	  margin: 0 1% 3%;
	  
	  display: flex;
	  flex-wrap: wrap;
	}
	.globalWrapper .blogItem:first-child .htmlbg{
	  width: 70%;
	  height: 100%;
	}
	.globalWrapper .blogItem:first-child .blogDescription{
	  position: relative;
	  width: 30%;
	  display: flex;
	  flex-direction: column;
	  left: unset;
	  bottom:unset;
	  gap: 1rem;
	  height: 100%;
	  padding: 40px 20px;
	  
	  .desHide{
		display: block;
		height: auto;
	  }
	  
	}
	
  }
  /**/
  
  /*pagination*/
  .list_article_wrap .pager{
  		position: relative;
  		z-index: 1;
  		display: flex;
  		flex-wrap: wrap;
  		justify-content: center;
  		align-items: center;
  		gap:0.25rem;
  }
 
 .list_article_wrap .pager a,
 .list_article_wrap .pager a:visited{
		display: inline-block;
		margin:0;
		padding:5px 10px;
		text-align: center;
		white-space: nowrap;
		vertical-align: middle;
		touch-action: manipulation;
		cursor: pointer;
		user-select: none;
		border-radius: 3px;
		text-transform: uppercase;
		font-size: 1.2rem;
		line-height: 2.4rem;
		text-decoration: none;
		font-weight: 700;
		text-transform: uppercase;
		background: transparent;
		color: #003f76;
		border: 2px solid #053c72;
		transition: background, color 0.2ms;
	}
 .list_article_wrap .pager a:hover{
		background: #003f76;
		color: #FFFFFF;
		border-color: #053c72;
	}
	.list_article_wrap .pager  a.pager_current_page,
	.list_article_wrap .pager  a.pager_current_page:hover,
	.list_article_wrap .pager  a.pager_current_page:visited,
	.list_article_wrap .pager  a.pagerCurrentPage,
	.list_article_wrap .pager  a.pagerCurrentPage:hover,
	.list_article_wrap .pager  a.pagerCurrentPage:visited{
		background: #003f76;
		color: #FFFFFF;
		border-color: #053c72;
	}
  
}
/*------*/

/*DETAIL BLOG POST*/
/*sidebar*/
.PostDetail .sidebar{
	padding:3rem 6rem; 
}
@media (max-width: 767px) {
	.PostDetail .sidebar{
		padding:0 15px 4rem; 
	}
}


/*auteur billet*/
.PostDetail [id="authorBillet"]{
	[id="authorPicture"]{
		margin-bottom: 1rem;
		figure{
			max-width:120px;
			aspect-ratio: 1/1;
			border-radius: 50%;
			overflow: hidden;
			display: flex;
			justify-content: center;
			align-items: center;
			border:3px solid #0c3054; 
		}
		img{
			object-fit: cover;
			height: 100%;
		}
	}
	[id="authorDetail"]{
		font-size: 1.4rem;
		line-height: 1.6;
		color:#1d1d1b;
		
		&:after{
			content:"";
			display: block;
			width: 3.5rem;
			height: 2px;
			background: #1d1d1b;
			margin: 1rem 0;
		}
	}
}

.PostDetail .TextDetail table{
	width:100% !important;
}

/*------*/


 /*WIDGET CATEGORIES*/
 .categorieBox{
	 margin:3rem 0 6rem;
	 .h4{
		 display: none;
	 }
	 ul{
		 display: flex;
		 flex-wrap: wrap;
		 gap:1rem;
		 justify-content:center;
		 align-items: center;
	 }
	 ul li{
		 padding: 0;
		 background: transparent
	 }
	 li a{
		   display: inline-block;
		   padding: 6px 12px;
		   margin-bottom: 0;
		   text-align: center;
		   white-space: nowrap;
		   vertical-align: middle;
		   touch-action: manipulation;
		   cursor: pointer;
		   user-select: none;
		   
		   border-radius: 3px;
		   text-transform: uppercase;
		   font-size: 1.2rem;
		   line-height: 2.4rem;
		   text-decoration: none;
		   font-weight: 700;
		   text-transform: uppercase;

		   background: transparent;
		   color: #003f76;
		   border: 2px solid #053c72; 
		   
		   transition: background, color 0.2ms;
	 }
	 li a:hover{
		 background: #003f76;
		 color: #fff !important;
		 transition: background, color 0.2ms; 
	 }
	 /*active*/
	 /*
	 background: #003f76;
		color: #fff;
		border: 2px solid transparent; 
		
		hover: 
		background: transparent;
		   color: #003f76;
		   border: 2px solid #053c72;
		*/	
 }
.FakeRight .categorieBox{
  margin:7rem 0 3.5rem;
  .h4{
	  display: block;
	  margin: 0 0 2rem;
  }
  ul{
	  justify-content: flex-start;
  }
  ul li{
	  list-style: none;
	  &:marker{
		  display: none;
	  }
  }
}
@media (max-width: 767px) {
	.FakeRight .categorieBox{
	  margin:2rem 0 3rem;
  	}
}
 
 
 /*SIMULATION MODE ACTIF PAR CATEGORIE*/
 body.blogNew.all{
	.categorieBox li a[title='Blog']{
		background: #003f76;
		color: #fff;
		border: 2px solid transparent; 
		cursor: default;
	}
	.categorieBox li a[title='Blog']:hover{
		background: transparent;
		color: #003f76 !important;
		border: 2px solid #053c72;
	}
}
 body.blogNew.portes{
	.categorieBox li a[title='Portes métalliques']{
		background: #003f76;
		color: #fff;
		border: 2px solid transparent; 
		cursor: default;
	}
	.categorieBox li a[title='Portes métalliques']:hover{
		background: transparent;
		color: #003f76 !important;
		border: 2px solid #053c72;
	}
}
 body.blogNew.controle{
	.categorieBox li a[title*='Contrôle']{
		background: #003f76;
		color: #fff;
		border: 2px solid transparent; 
		cursor: default;
	}
	.categorieBox li a[title*='Contrôle']:hover{
		background: transparent;
		color: #003f76 !important;
		border: 2px solid #053c72;
	}
}
 body.blogNew.desenfumage{
	.categorieBox li a[title='Désenfumage']{
		background: #003f76;
		color: #fff;
		border: 2px solid transparent; 
		cursor: default;
	}
	.categorieBox li a[title='Désenfumage']:hover{
		background: transparent;
		color: #003f76 !important;
		border: 2px solid #053c72;
	}
}
 body.blogNew.automatiques{
	.categorieBox li a[title='Portes automatiques']{
		background: #003f76;
		color: #fff;
		border: 2px solid transparent; 
		cursor: default;
	}
	.categorieBox li a[title='Portes automatiques']:hover{
		background: transparent;
		color: #003f76 !important;
		border: 2px solid #053c72;
	}
}
 body.blogNew.solaire{
	.categorieBox li a[title='Protection solaire']{
		background: #003f76;
		color: #fff;
		border: 2px solid transparent; 
		cursor: default;
	}
	.categorieBox li a[title='Protection solaire']:hover{
		background: transparent;
		color: #003f76 !important;
		border: 2px solid #053c72;
	}
}

 body.blogNew.securisation{
	.categorieBox li a[title='Sécurisation']{
		background: #003f76;
		color: #fff;
		border: 2px solid transparent; 
		cursor: default;
	}
	.categorieBox li a[title='Sécurisation']:hover{
		background: transparent;
		color: #003f76 !important;
		border: 2px solid #053c72;
	}
}