/*** uncss> filename: css/style.css ***/
@font-face {
	font-family: "Sofia Pro";
	src: url("../fonts/SofiaPro/SofiaPro-Light.woff2") format("woff2"), url("../fonts/SofiaPro/SofiaPro-Light.woff") format("woff");
	font-weight: 200;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: "Sofia Pro";
	src: url("../fonts/SofiaPro/SofiaPro-Regular.woff2") format("woff2"), url("../fonts/SofiaPro/SofiaPro-Regular.woff") format("woff");
	font-weight: 400;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: "Sofia Pro";
	src: url("../fonts/SofiaPro/SofiaPro-Medium.woff2") format("woff2"), url("../fonts/SofiaPro/SofiaPro-Medium.woff") format("woff");
	font-weight: 500;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: "Sofia Pro";
	src: url("../fonts/SofiaPro/SofiaPro-SemiBold.woff2") format("woff2"), url("../fonts/SofiaPro/SofiaPro-SemiBold.woff") format("woff");
	font-weight: 600;
	font-style: normal;
	font-display: swap
}

@font-face {
	font-family: "Sofia Pro";
	src: url("../fonts/SofiaPro/SofiaPro-Bold.woff2") format("woff2"), url("../fonts/SofiaPro/SofioPro-Bold.woff") format("woff");
	font-weight: 700;
	font-style: normal;
	font-display: swap
}

#routine-myorigines {
	font-family: "Sofia Pro";
	width: 100%;
	max-width: 1440px;
	margin: auto
}

#routine-myorigines *,
#routine-myorigines *::before,
#routine-myorigines *::after {
	box-sizing: border-box
}

#routine-myorigines p {
	margin-top: 0;
	margin-bottom: 22.5px
}

#routine-myorigines strong {
	font-weight: bolder
}

#routine-myorigines sup {
	position: relative;
	font-size: 16.875px;
	line-height: 0;
	vertical-align: baseline
}

#routine-myorigines sup {
	top: -11.25px
}

#routine-myorigines a {
	color: #0d6efd;
	text-decoration: underline
}

#routine-myorigines a:hover {
	color: #0a58ca
}

#routine-myorigines img {
	vertical-align: middle
}

#routine-myorigines button:focus:not(:focus-visible) {
	outline: 0
}

#routine-myorigines button:not(:disabled),
#routine-myorigines [type=button]:not(:disabled),
#routine-myorigines [type=reset]:not(:disabled),
#routine-myorigines [type=submit]:not(:disabled) {
	cursor: pointer
}

#routine-myorigines ::-moz-focus-inner {
	padding: 0;
	border-style: none
}

#routine-myorigines ::-webkit-datetime-edit-fields-wrapper,
#routine-myorigines ::-webkit-datetime-edit-text,
#routine-myorigines ::-webkit-datetime-edit-minute,
#routine-myorigines ::-webkit-datetime-edit-hour-field,
#routine-myorigines ::-webkit-datetime-edit-day-field,
#routine-myorigines ::-webkit-datetime-edit-month-field,
#routine-myorigines ::-webkit-datetime-edit-year-field {
	padding: 0
}

#routine-myorigines ::-webkit-inner-spin-button {
	height: auto
}

#routine-myorigines ::-webkit-search-decoration {
	-webkit-appearance: none
}

#routine-myorigines ::-webkit-color-swatch-wrapper {
	padding: 0
}

#routine-myorigines ::file-selector-button {
	font: inherit
}

#routine-myorigines ::-webkit-file-upload-button {
	font: inherit;
	-webkit-appearance: button
}

#routine-myorigines .img-fluid {
	max-width: 100%;
	height: auto
}

#routine-myorigines .container,
#routine-myorigines .container-fluid {
	width: 100%;
	padding-right: var(--bs-gutter-x, 12px);
	padding-left: var(--bs-gutter-x, 12px);
	margin-right: auto;
	margin-left: auto
}

@media(min-width: 576px) {
	#routine-myorigines .container {
		max-width: 540px
	}
}

@media(min-width: 768px) {
	#routine-myorigines .container {
		max-width: 720px
	}
}

@media(min-width: 992px) {
	#routine-myorigines .container {
		max-width: 960px
	}
}

@media(min-width: 1200px) {
	#routine-myorigines .container {
		max-width: 1140px
	}
}

@media(min-width: 1400px) {
	#routine-myorigines .container {
		max-width: 1440px
	}
}

#routine-myorigines .row {
	--bs-gutter-x: 24px;
	--bs-gutter-y: 0;
	display: flex;
	flex-wrap: wrap;
	margin-top: calc(var(--bs-gutter-y)*-1);
	margin-right: calc(var(--bs-gutter-x)*-0.5);
	margin-left: calc(var(--bs-gutter-x)*-0.5)
}

#routine-myorigines .row>* {
	flex-shrink: 0;
	width: 100%;
	max-width: 100%;
	padding-right: calc(var(--bs-gutter-x)*.5);
	padding-left: calc(var(--bs-gutter-x)*.5);
	margin-top: var(--bs-gutter-y)
}

#routine-myorigines .g-0 {
	--bs-gutter-x: 0
}

#routine-myorigines .g-0 {
	--bs-gutter-y: 0
}

@media(min-width: 768px) {
	#routine-myorigines .col-md-3 {
		flex: 0 0 auto;
		width: 25%
	}

	#routine-myorigines .col-md-6 {
		flex: 0 0 auto;
		width: 50%
	}
}

#routine-myorigines .visually-hidden-focusable:not(:focus):not(:focus-within) {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important
}

#routine-myorigines .d-none {
	display: none !important
}

#routine-myorigines .align-items-center {
	align-items: center !important
}

#routine-myorigines .mt-3 {
	margin-top: 22.5px !important
}

#routine-myorigines .mt-4 {
	margin-top: 33.75px !important
}

#routine-myorigines .mb-0 {
	margin-bottom: 0 !important
}

#routine-myorigines .mb-1 {
	margin-bottom: 5.625px !important
}

#routine-myorigines .mb-3 {
	margin-bottom: 22.5px !important
}

#routine-myorigines .mb-4 {
	margin-bottom: 33.75px !important
}

#routine-myorigines .px-0 {
	padding-right: 0 !important;
	padding-left: 0 !important
}

#routine-myorigines .px-3 {
	padding-right: 22.5px !important;
	padding-left: 22.5px !important
}

#routine-myorigines .pt-1 {
	padding-top: 5.625px !important
}

#routine-myorigines .pt-2 {
	padding-top: 11.25px !important
}

#routine-myorigines .pt-3 {
	padding-top: 22.5px !important
}

#routine-myorigines .pt-4 {
	padding-top: 33.75px !important
}

#routine-myorigines .pb-1 {
	padding-bottom: 5.625px !important
}

#routine-myorigines .pb-2 {
	padding-bottom: 11.25px !important
}

#routine-myorigines .pb-3 {
	padding-bottom: 22.5px !important
}

#routine-myorigines .pb-4 {
	padding-bottom: 33.75px !important
}

#routine-myorigines .pb-5 {
	padding-bottom: 67.5px !important
}

#routine-myorigines .text-center {
	text-align: center !important
}

#routine-myorigines .text-nowrap {
	white-space: nowrap !important
}

@media(min-width: 768px) {
	#routine-myorigines .d-md-inline-block {
		display: inline-block !important
	}

	#routine-myorigines .d-md-block {
		display: block !important
	}

	#routine-myorigines .d-md-none {
		display: none !important
	}

	#routine-myorigines .order-md-2 {
		order: 2 !important
	}

	#routine-myorigines .my-md-5 {
		margin-top: 67.5px !important;
		margin-bottom: 67.5px !important
	}

	#routine-myorigines .mt-md-0 {
		margin-top: 0 !important
	}

	#routine-myorigines .mt-md-1 {
		margin-top: 5.625px !important
	}

	#routine-myorigines .mt-md-2 {
		margin-top: 11.25px !important
	}

	#routine-myorigines .mt-md-5 {
		margin-top: 67.5px !important
	}

	#routine-myorigines .mb-md-0 {
		margin-bottom: 0 !important
	}

	#routine-myorigines .mb-md-5 {
		margin-bottom: 67.5px !important
	}

	#routine-myorigines .pt-md-0 {
		padding-top: 0 !important
	}

	#routine-myorigines .pt-md-1 {
		padding-top: 5.625px !important
	}

	#routine-myorigines .pt-md-2 {
		padding-top: 11.25px !important
	}

	#routine-myorigines .pt-md-5 {
		padding-top: 67.5px !important
	}

	#routine-myorigines .pe-md-3 {
		padding-right: 22.5px !important
	}

	#routine-myorigines .pb-md-0 {
		padding-bottom: 0 !important
	}

	#routine-myorigines .pb-md-1 {
		padding-bottom: 5.625px !important
	}

	#routine-myorigines .pb-md-2 {
		padding-bottom: 11.25px !important
	}

	#routine-myorigines .pb-md-3 {
		padding-bottom: 22.5px !important
	}

	#routine-myorigines .ps-md-0 {
		padding-left: 0 !important
	}

	#routine-myorigines .ps-md-2 {
		padding-left: 11.25px !important
	}

	#routine-myorigines .ps-md-4 {
		padding-left: 33.75px !important
	}

	#routine-myorigines .ps-md-5 {
		padding-left: 67.5px !important
	}
}

#routine-myorigines a {
	color: unset;
	text-decoration: none
}

#routine-myorigines a:hover {
	color: unset
}

#routine-myorigines p {
	font-size: 22.5px;
	line-height: 1.25
}

#routine-myorigines p sup {
	font-size: 50%
}

#routine-myorigines .hero-content {
	background-image: url("../images/background-hero.jpg");
	background-size: cover;
	min-height: 514.687px;
	display: flex;
	flex-direction: column;
	justify-content: center
}

#routine-myorigines .hero-content p {
	color: #fff;
	font-weight: 400
}

#routine-myorigines .hero-content .col-content-text {
	display: flex;
	flex-direction: column;
	justify-content: center
}

#routine-myorigines .hero-content .niveau1 {
	font-size: 45px;
	color: #fff;
	text-transform: uppercase;
	line-height: 1.2
}

#routine-myorigines .editorial-content-quinquonce .niveau2 {
	font-size: 45px;
	text-transform: uppercase;
	line-height: 1.2
}

#routine-myorigines .editorial-content-quinquonce .niveau3 {
	font-size: 28.125px
}

#routine-myorigines .editorial-content-quinquonce .row {
	padding: 21.093px
}

#routine-myorigines .editorial-content-quinquonce img {
	width: 696.093px;
	max-width: 100%
}

#routine-myorigines .routine-content-4 {
	background-color: #f0f4f5
}

#routine-myorigines .routine-content-4 img {
	height: 202.5px
}

#routine-myorigines .routine-content-4 .niveau3 {
	font-size: 23.906px;
	font-weight: bold;
	text-transform: uppercase;
	color: #2b626f
}

#routine-myorigines .routine-content-4 .niveau4 {
	font-size: 16.875px;
	font-weight: 500;
	text-transform: uppercase;
	color: #0c1b1f;
	line-height: 1.1
}

#routine-myorigines .routine-content-4 p {
	font-size: 16.875px
}

#routine-myorigines .routine-content-4 .hidden {
	visibility: hidden
}

@media(min-width: 1080px) {
	#routine-myorigines .routine-content-4>.row {
		padding-right: 70.312px
	}
}

/* MOBILE */


@media(max-width: 767.98px) {
	#routine-myorigines p {
		font-size: 14px;
		line-height: 1.2
	}

	#routine-myorigines .hero-content {
		background-image: url("../images/background-hero-mob.jpg");
		background-position: 50% 50%
	}

	#routine-myorigines .hero-content p {
		font-size: 17px
	}

	#routine-myorigines .hero-content .niveau1 {
		font-size: 24px;
		margin-top: 32px
	}

	#routine-myorigines .hero-content .img-products {
		max-width: 70%;
		margin-top: 32px
	}

	#routine-myorigines .editorial-content-quinquonce .niveau2 {
		font-size: 24px
	}

	#routine-myorigines .editorial-content-quinquonce .niveau3 {
		font-size: 17px
	}

	#routine-myorigines .editorial-content-quinquonce .row {
		padding: 0 20px
	}

	#routine-myorigines .editorial-content-quinquonce .text-me-neg-1 {
		margin-right: -10px
	}
}