* { /* Voir ici : http://blog.goetter.fr/post/27612618411/box-sizing-et-pourquoi-pas */
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}
body, html {
	min-width: 1280px; /* Permet d'éviter le bug du background coupé sur iPad */
}
.hideMobile {
	display: initial;	
}
.hideTablette {
	display: initial;	
}
.colonneCentrale {
	width: 1280px;
	padding: 0 55px;
}
h1 {
	padding: 47px 0 70px 0;	
}


/****************** LIEN ARTICLE GENERIQUE ******************/

.apercuArticleContainer {
	width: 242px;
	height: 392px;
	margin: 44px 19px 0 0;
}
.apercuArticleDate {
	margin-top: 12px;	
}
.apercuArticleTitre {
	font-size: 28px;
	line-height: 29px;
	margin-top: 8px;
}
.apercuArticleChapo {
	font-size: 16px;
	line-height: 23px;
}
.apercuArticleEnSavoirPlus {
	margin-top: 12px;	
}




/****************** HEADER ******************/

#logoHome {
	width: 406px;
	left: 49px;
}
#logo {
	width: 232px;
	left: 55px;
}


	
/****************** FOOTER ******************/

#footer {
	height: 264px;
}
#logoFooter {
	left: 56px;
	width: 300px;
}
#footerNbContainerBig {
	top: 61px;
	left: 453px;
}
.footerNbContainer {	
	margin-right: 40px;
}


#footerMenuContainer {
	top: 145px;
	left: 453px;
}
.footerMenu {
	margin-right: 27px;
}

#footerSitewide {
	top: 205px;
	left: 453px;
}

#footerCopyright {
	top: 175px;
	left: 453px;
}


#footerColorz {
	top: 175px;
	right: 60px;
}


#footerReseauxSociauxContainer {
	top: 89px;
	right: 53px;
}



#footerInstagramMosaique img {
	width: 12.5%; 
}
#footerInstagramMosaique a:hover img {
	background-color: green;
	opacity: 0.9;	
}


#footerInstagramTitre {
	font-size: 44px;
	padding: 62px 0 28px 0px;
}
#footerInstagramTitreItalic {
	font-size: 44px;
}





/****************** PAGE D'ACCUEIL ******************/

.homeTitreBlanc {
	font-size: 60px;
	line-height: 60px;
	letter-spacing: -3px;
}

.homeTitre {
	font-size: 59px;
	line-height: 59px;
	margin-top: 15px;
}

#homeContainerTop {
	height: 1028px;
}


#homeMainArticleImgContainer {
	left: 355px; 
	width: 570px;
	height: 570px;
}
#homeMainArticleBackground {
	left: -55px; 
	top: 360px; 
	width: 530px; 
	height: 185px; 
}
#homeMainArticleContainer {
	left: -55px; 
	top: 360px; 
	width: 530px; 
	height: 185px; 
	line-height:185px;
	padding: 0 30px;
}
#homeMainArticleTitre {
	font-size: 45px;
	line-height: 46px;
}
#homeMainArticleTitreSmall {
	font-size: 36px; /* avant 41 */
	/*font-size: 40px;*/
	line-height: 40px;
}


#homeBreveTopBackground {
	left: 55px; 
	top: 227px; 
	width: 270px; 
	height: 412px; 
}
#homeBreveTopContainer {
	left: 55px; 
	top: 227px; 
	width: 270px; 
	height: 412px; 
	padding: 32px 40px 0 28px;
}
#homeBreveTopTxt {
	font-size: 28px;
	line-height: 32px;
}


#homeSecondArticleContainer {
	left: 954px; 
	top: 80px; 
	width: 270px; 
	height: 270px; 
}
#homeSecondArticleDegrade {
	width: 270px; 
	height: 270px; 
}
#homeSecondArticleTitre {
	font-size: 28px;
	line-height: 31px;
}


#homePDJContainer {
	left: 894px; 
	top: 400px; 
	width: 270px; 
	height: 360px; 
}
#homePDJTitre {
	font-size: 28px;
	line-height: 31px;
}


#homeConseilContainer {
	left: 595px; 
	top: 692px; 
	width: 330px; 
	padding: 30px 36px 30px 25px;
}
#homeConseilTitre {
	font-size: 40px;
	line-height: 41px;
}


#homeLookbookContainer {
	left: 152px; 
	top: 598px; 
	width: 370px; 
	height: 370px; 
}
#homeLookbookDegrade {
	width: 370px; 
	height: 370px; 
}
#homeLookbookTitre {
	font-size: 34px;
	line-height: 35px;
}


#homeActuDuMomentContainer {
	padding: 34px 0 28px 0;
}
#homeActuDuMomentContainer .smallTitre {
	font-size: 24px;
}

#homeTouteLactuContainer {	
	top: 10px;
	left: 659px;
}


#homeSuivreTDMContainer {
	padding: 51px 0 48px 0;
}
.homeSuivreTDMSocialContainer {
	margin-top: 41px;
}


#homeBrevesContainer {
	top: -611px;
	right: 55px;
	width: 370px;
	padding: 24px 20px 28px 20px;
}
#homeBrevesTitre {
	font-size: 40px;
}
#homeBrevesImage {
	margin-top: 22px;	
}
#homeBrevesImage a {
    max-height: 450px;
}
#homeBrevesTexte {
	font-size: 30px;
	line-height: 32px;
}


#homeConseilsContainer {
	width: 370px;
}
#homeEntreNousBigContainer {
	padding: 46px 0 59px 0;
	overflow: hidden;
}
#homeConseilsContainer {
	padding: 22px 28px 28px 28px;
}
.homeConseilsItem {
	font-size: 16px;
	line-height: 22px;
}
#homeEntreNousTitreContainer {
	margin-left: 25px;
}
#homeEntreNousTitreContainer img {
	width: 83px;
}
#homeEntreNousTitre {
	font-size: 58px;
	line-height: 59px;
	left: 99px;
	top: 0px;
}
#homeEntreNousTitreBis {
	font-size: 17px;
	left: 103px;
	top: 57px;
}
#homeEntreNousContainer .bigBouton {
	top: 18px;
	right: 0px;
}
#homeEntreNousContainer .apercuArticleContainer {
	width: 370px;
	height: 430px;
	margin-left: 25px;
	margin-top: 30px;
}


#homeTendancesContainer {
	padding: 34px 0 61px 0;
}
#homeTendancesContainer .apercuArticleContainer {
	width: 370px;
	margin-right: 30px;
}
#homeToutesTendancesContainer {
	top: -3px;
	right: 55px;
}


#homeLookbooksContainer {
	padding: 34px 0 50px 0;
}
#homeLookbooksImageContainer {
	width: 588px;
}
#homeLookbooksTitre {
	font-size: 48px;
	line-height: 45px;
}
#homeLookbooksTitre .italicBlancLight {
	font-size: 38px;
}


#homeIdeesShoppingContainerBig {
	width: 1116px;
	/*width: 558px;*/
	right: -22px;
	top: -15px;
}
#homeIdeesShoppingContainer {
	margin: 0;
}
#homeIdeesShoppingContainer button {
	margin: 0 0 15px 15px;
	width: 170px;
	height: auto;
}
#homeIdeesShoppingContainer img {
	
}
#homeIdeesShoppingContainerBig .bigBouton {
	margin-top: 21px;
}



#homeNewsletterForm {
	width: 500px;	
}	



/****************** PAGE RUBRIQUES ******************/

#rubriquesContainer .apercuArticleContainer {
	width: 370px;
	height: 450px;
	margin-right: 30px;
	margin-top: 0px;
}
#rubriquesContainer #homeSuivreTDMContainer {
	margin: 10px 0 60px 0;
}
#rubriquesMenu {
	margin: -30px auto 50px auto; 
}




/****************** ARCHIVES ******************/
	
#menuArchivesContainer {
	width: 500px;
	margin: 0px auto 60px auto;
}	





/****************** ARTICLES ******************/

#articleCarouselContent {
	width: 520px;
}
#articleCarouselImageContainer img {
	width: 500px;
}


.articleMemeThemeConseilContainer {
	height: 427px;
	line-height: 427px;
	padding: 0px 27px 0px 27px;
}
.articleMemeThemeConseilTitre {
	font-size: 42px;
	line-height: 45px;
}


#articleCommentairesAddContainerGlobal {
	min-height: 540px;
}
#articleCommentairesContainer, #articleCommentairesAddContainer, #articleCommentairesAddContainerBig {
	width: 569px;
}
.articleCommentairesTitre {
	display: block;
	margin: 10px 0 30px 0;
	font-size: 27px;
}
#articleCommentairesFormNom {
	float: left;
	width: 48%;
}
#articleCommentairesFormEmail {
	float: right;
	width: 48%;
}


/****************** CONSEILS ******************/

#conseilH1 {
	font-size: 50px;
	line-height: 50px;
	margin-bottom: -25px;
}
.conseilSousTitre {
	font-size: 34px;
	line-height: 34px;
	letter-spacing: -1px;
	padding: 0 0 20px 0;
	margin: -5px 0 3px -1px;
}
#conseilQuestion {
	margin-bottom: -15px;
	line-height: 23px;
}

#conseilsBandeauBouton {
	right: 57px;
}


#conseilsDerniersConseilsContainer {
	padding: 40px 0 10px 0;
}
#conseilsDerniersConseilsContainer .homeTitre {
	text-align: left;
	padding-bottom: 36px;
}
.conseilsDerniersConseils { 
	width: 269px;
	height: 269px;
	line-height: 269px;
	padding: 0 30px;
	margin: 0 30px 30px 0;
}
.conseilsDerniersConseilsTitre {
	font-size: 30px;
	line-height: 31px;
}
#conseilsDerniersConseilsList {
	margin-top: 23px;
}
.conseilsDerniersConseilsListColumn {
	width: 350px;
	margin-right: 58px;
}


#conseilsSoloDate {
	margin: -55px 0 57px 0;
}
#conseilsSoloQuestion, #conseilsSoloReponse {
	padding: 33px 0 57px 0;
}


#conseilsSoloQuestion .colonneCentrale, #conseilsSoloReponse .colonneCentrale {
	width: 920px;
}
#conseilsSoloContainer {
	width: 850px;
}



#conseilsSoloLettresContainer a {
	padding: 7px 15px;
}



/****************** TAGS ******************/

.tagsAffilMarque {
	font-size: 20px; 
}


#tagsBandeauTxt {
	font-size: 34px; 
	margin: 28px 0 0 30px;
}
#tagsBandeauConseilsTxt {
	font-size: 25px;
	margin: 32px 0 0 20px;
}

#tagsTendancesContainer {
	width: 1040px; 
	overflow: auto;
}
#tagsTendancesContainer img {
	float: left;	
}
#tagsTendances {
	margin: 20px 0 0 20px; 
	float: right;
	width: 200px;
}
.tagsTendancesItem { 
	width: 100%;
}




/****************** PIECES DU JOUR ******************/

#PDJContainerBig .colonneCentrale {
	padding: 0 55px;
}



/****************** LOOKBOOKS ******************/

#lookbooksImageContainer {
	width: 563px;
}
#lookbooksTitre {
	font-size: 48px;
	line-height: 45px;
}
#lookbooksTitre .italicBlancLight {
	font-size: 38px;
}

#lookbooksMenuTop {
	margin-top: -20px;
}

.lookbooksMarquesListeColumnBig {
	padding-left: 197px;
}

#lookbooksTopMarques {
	width: 1169px;
}

#lookbooksTopSaisons {
	width: 1169px;
}



/****************** BREVES ******************/

a.brevesImage {
	width: 370px;
	height: 493px;
	margin: 0 26px 26px 0;
}
button.brevesImage {
	width: 370px;
	height: 493px;
	margin: 0 26px 26px 0;
	overflow: hidden;      /* rien ne dépasse du cadre */
}
.brevesDate {
	font-size: 45px;
	margin: 30px 0 45px 0;
	letter-spacing: -2px;
}
.brevesTexte {
    font-size: 28px;
    line-height: 31px;
}
.brevesConseil {
	display: inline-block;
	width: 370px;
	height: 493px;
	line-height: 493px;
	padding: 0px 30px;
	margin: 0 26px 26px 0;
}


#brevesLightboxPart2 #articleCommentairesFormNom, #brevesLightboxPart2 #articleCommentairesFormEmail {
	float: none;
	width: 100%;
}
#brevesLightboxPart2 .titreMedium {
	margin-top: 0px;
	font-size: 46px;
	line-height: 46px;
}




/****************** A Propos ******************/

#aProposImage {
	width: 560px;	
	float: left;
	margin: 0 30px 30px 0;
}



/****************** Recherche ******************/

.rechercheConseilsContainer {
	height: 350px;
	line-height: 350px;
	padding: 0px 25px 0px 25px;
	margin-top: 30px;
	margin-bottom: 0px;
}
.rechercheConseilsTitre {
	margin-bottom: 14px;
}




/****************** Sélecteur de langue ******************/

#langSelectorBox {
	position: absolute;
	top: 165px;
	right: 365px;
}




/****************** A LAISSER EN BAS ******************/

.titreMedium {
	font-size: 50px;
	line-height: 50px;
}
.titreSmall {
	font-size: 40px;
	line-height: 40px;
}




/****************** Nouveau menu des conseils ******************/

/* ===============================
   styleWide2.css ? mega-menu WIDE
   =============================== */

/* grille du header */
#menuHeader {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 38px;
}
#menuHeader > li { display: inline-block; margin: 0; padding: 0; }

/* items */
#menuHeader .menu-item { position: static; display: inline-block; width: auto; }
#menuHeader .menu-item .label { padding-right: 0 !important; white-space: nowrap; }

/* coupe la flèche mobile en wide */
#menuHeader .menu-item .menu-arrow { display: none !important; }

/* -------- Alignement & placement -------- */
:root{
  --header-h: 30px;       /* hauteur réelle du header */
  --mega-offset: -276px;  /* + => décale à DROITE ; ? => à GAUCHE */
}

/* MEGA MENU (dans le flux de la page : défile avec la page) */
#menuHeader .menu-item > .dropdown{
  position: absolute;                  /* <-- plus de fixed */
  top: var(--header-h);                /* collé sous le header */
  left: 50%;
  transform: translateX(calc(-50% + var(--mega-offset)));
  width: 100vw;
  max-width: 1170px;
  background: #fff;
  z-index: 1000;

  /* nettoyage d?anciens restes */
  margin-left: 0 !important;
  overflow: visible;                   /* pas de scrollbar interne */
  max-height: none;

  /* état caché par défaut */
  opacity: 0;
  visibility: hidden;
  pointer-events: none;

  /* fondu uniquement */
  transition: opacity .18s ease-out, visibility 0s linear .18s;
}

/* Visible tant qu?on survole l?item OU la dropdown (ou focus clavier) */
#menuHeader .menu-item:hover > .dropdown,
#menuHeader .menu-item > .dropdown:hover,
#menuHeader .menu-item:focus-within > .dropdown,
#menuHeader .menu-item > .dropdown:focus-within{
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transition: opacity .18s ease-out, visibility 0s;
}

/* Verrou global du méga-menu pendant 1s après chargement */
body.dropdown-locked #menuHeader .menu-item > .dropdown,
body.dropdown-locked #menuHeader .menu-item:hover > .dropdown,
body.dropdown-locked #menuHeader .menu-item:focus-within > .dropdown,
body.dropdown-locked #menuHeader .menu-item > .dropdown:hover,
body.dropdown-locked #menuHeader .menu-item > .dropdown:focus-within {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: none !important; /* pas de petit fondu pendant le lock */
}

/* Accessibilité : coupe les anims si demandé */
@media (prefers-reduced-motion: reduce){
  #menuHeader .menu-item > .dropdown { transition: none; }
}