.hub-beauty{
	background-color: #F2E9DB;
	padding-bottom: 4rem;
	max-width: 144rem;
	margin: 0 auto;
}

@media (min-width: 64em) {
	.hub-beauty{
		margin: 0 auto 4rem;
	}
}

.hub-beauty .img-responsive{
	display: block;
	max-width: 100%;
	height: auto;
}

.hub-beauty .img-responsive-full{
	display: block;
	max-width: 100%;
	height: auto;
	width: 100%;
}

.hub-beauty sup{
	font-size: 60%;
}

.o-hidden{
	overflow-y: hidden;
}

.hub-beauty .flickity-page-dots .dot{
	width: 10px;
	height: 10px;
}

.hub-beauty .floor-margin{
	margin-bottom: 4rem;
}

.hub-beauty .text-italic{
	font-style: italic;
}

.hub-beauty .occitane-serif{
	font-family: "LOccitaneSerif", ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
}

.hub-beauty .big-title{
	font-family: "LOccitaneSerifCondensed", "LOccitaneSerif", ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
	font-size: 6rem;
	line-height: 1.2;
	font-weight: 500;
	margin: 0;
	text-transform: uppercase;
}

.hub-beauty .big-title span.big-title-small{
	font-size: 2rem;
}

.hub-beauty .title{
	font-family: "LOccitaneSerifCondensed", "LOccitaneSerif", ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
	font-size: 3.2rem;
	line-height: 4rem;
	font-weight: 300;
	margin: 0 0 2rem;
	text-transform: uppercase;
}

.hub-beauty .med-title{
	font-family: "LOccitaneSerif", ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
	font-size: 3rem;
	line-height: 3rem;
	font-weight: 300;
	margin: 2rem 0;
	text-transform: uppercase;
}

.hub-beauty .subtitle{
	font-size: 2.2rem;
	line-height: 2.6rem;
	margin: 0 0 2rem;
	font-weight: 400;
}

.hub-beauty .subsubtitle{
	font-size: 1.8rem;
	line-height: 2.4rem;
	margin: 0;
	font-weight: 400;
}

.hub-beauty .med-paragraph{
	font-size: 1.6rem;
	line-height: 2.4rem;
	margin: 0 0 1rem;
}

.hub-beauty .paragraph{
	display: block;
	font-size: 1.4rem;
	line-height: 2rem;
	margin: 0;
}

.hub-beauty .xs-paragraph{
	font-size: 1.2rem;
	line-height: 1.8rem;
	margin: 0;
}

@media (max-width: 63.99875em) {
	.hub-beauty .number{
		font-size: 8rem;
	}

	.hub-beauty .big-title{
		font-size: 3.5rem;
	}

	.hub-beauty .title{
		font-size: 3.2rem;
		line-height: 3.2rem;
	}

	.hub-beauty .subtitle{
		font-size: 1.8rem;
		line-height: 2.4rem;
	}

	.hub-beauty .subsubtitle{
		font-size: 1.4rem;
		line-height: 2.1rem;
	}

	.hub-beauty .hidden-m{
		display: none;
	}

	.hub-beauty .floor-margin{
		margin-bottom: 4rem;
	}
}

.hub-beauty .c-white{
	color: #FFF;
}

.hub-beauty .light-black{
	color: rgba(0, 0, 0, 0.75);
}

.hub-beauty .xlight-black{
	color: rgba(0, 0, 0, 0.4);
}

.hub-beauty .text-underline{
	text-decoration: underline;
}

.hub-beauty a{
	color: inherit;
}

.hub-beauty .a-button {
	background-color: #3F2B2E;
	border: 0.1rem solid rgba(63, 43, 46, 0.3);
	line-height: 2.2rem;
	border-radius: .4rem;
	color: #FFF;
	margin: 0;
}

body:not(.touch) .hub-beauty .a-button:hover, body:not(.touch) .hub-beauty a:hover .a-button{
	background-color: #34292C;
}

.hub-beauty .a-button.a-button-white {
	background-color: #f6f7f7;
	border: .1rem solid #f6f7f7;
	line-height: 2.2rem;
}

body:not(.touch) .hub-beauty .a-button.a-button-white:hover{
	background-color: transparent;
	border: .1rem solid #001022;
}

.hub-beauty .a-button.a-button-reverse {
	background-color: #001022;
	border: .1rem solid #001022;
	color: #FFF;
	line-height: 2.2rem;
	margin-top: 3rem;
}

body:not(.touch) .hub-beauty .a-button.a-button-reverse:hover{
	background-color: transparent;
	color: #001022;
}

.hub-beauty .arrow-cta{
	margin-left: .6rem;
}

.hub-beauty .cta-underline{
	position: relative;
	overflow: visible;
	cursor: pointer;
}

.hub-beauty .cta-underline::after{
	content: "";
	position: absolute;
	bottom: -0.1rem;
	left: 0;
	width: calc(100% - 1.4rem);
	height: 1px;
	background-color: #FFF;
	transition: width ease-out 0.3s;
}

body:not(.touch) .hub-beauty .cta-underline:hover::after{
	width: 0;
	transition: width ease-out 0.3s;
}

.hub-beauty .mark{
	background-color: #F2E9DB;
	padding: .6rem 1.2rem;
	display: inline-block;
	margin-top: 2rem;
}

/* INTRO */
.hub-beauty .floor-intro{
	text-align: center;
	position: relative;
}

.hub-beauty .floor-intro .text-container{
	position: absolute;
	bottom: 0;
	left: 0;
	height: 100%;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.hub-beauty .floor-intro .text-container::before{
	content: "";
	background: linear-gradient(to top, rgba(0, 0, 0, 0.56), transparent);
	height: 50%;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}

.hub-beauty .floor-intro .text-container::after{
	content: "";
	background: rgba(0, 0, 0, 0.56);
	height: 50%;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
}

.hub-beauty .floor-intro .text-inner{
	position: relative;
	z-index: 2;
}

@media (max-width: 63.99875em) {
	.hub-beauty .floor-intro .text-inner{
		padding: 3rem 1.5rem;
	}
}

/* EDITO */
.hub-beauty .floor-edito{
	text-align: center;
}

@media (max-width: 63.99875em) {
	.hub-beauty .floor-edito{
		padding: 0 1.5rem;
	}
}

/* MOSAIQUE */
.hub-beauty .floor-mosaique .list-categ{
	display: flex;
	gap: 2rem;
	flex-wrap: wrap;
	max-width: 124rem;
	margin: 0 auto;
	width: 90%;
}

.hub-beauty .floor-mosaique .list-categ__item{
	position: relative;
	width: calc(50% - 1rem);
}

.hub-beauty .floor-mosaique .list-categ__item .text-container{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	text-align: center;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.56), transparent);
	display: flex;
  	flex-direction: column;
	padding: 0 1rem;
}

.hub-beauty .floor-mosaique .list-categ__item .text-container::before {
  content: "";
  height: 17.6rem;
}

.hub-beauty .floor-mosaique .list-categ__item .text-container::after {
  content: "";
  height: 3rem;
}

@media (max-width: 40em) {
	.hub-beauty .floor-mosaique .list-categ__item{
		width: 100%;
	}
}