section.MyContainer
{
}

.primary-content
{
padding-bottom:0}

section.MyContainer ul
{
	color:#000;
	font-size:14px;
	font-style:normal;
	font-weight:400;
	line-height:1.5em;
	margin:10px 0 0;
	padding:0;
font-family:"Gotham SSm book A","Gotham SSm book B",Helvetica,Arial,sans-serif}

section.MyContainer ul li
{
padding:0}

section.MyContainer p
{
	color:#000;
	font-size:16px;
	font-style:normal;
	font-weight:400;
	line-height:1.5em;
	margin:10px 0 0;
	padding:0;
font-family:"Gotham SSm book A","Gotham SSm book B",Helvetica,Arial,sans-serif}

@media (max-width:761px)
{
	section.MyContainer p
	{
	font-size:14px}
}

section.MyContainer h1
{
	color:#000;
	font-family:ClarinsRegular,"Times New Roman",Times,serif;
	font-size:50px;
	font-weight:400;
	line-height:1em;
	margin:0;
padding:0}

@media (max-width:761px)
{
	section.MyContainer h1
	{
		font-size:35px;
		font-weight:400;
		line-height:1em;
	text-align:center}
}

section.MyContainer h2
{
	color:#000;
	font-family:ClarinsRegular,"Times New Roman",Times,serif;
	font-size:35px;
	font-weight:400;
	line-height:1em;
	margin:0;
padding:0}

@media (max-width:761px)
{
	section.MyContainer h2
	{
		font-size:25px;
	text-align:center}
}

section.MyContainer h2[data-overlay-prev=true]
{
margin-top:-.5em}

section.MyContainer .MyBtnLink
{
	margin:4px;
	color:#000;
	display:inline-block;
	clear:both;
	text-decoration:none;
	border:2px solid #eaeaea;
	line-height:12px;
	font-size:12px;
	padding:22px;
	padding-top:19px;
	padding-bottom:19px;
	transition:all .2s ease-in-out;
background-color:#FFF}

section.MyContainer .MyBtnLink:hover
{
	border:2px solid #eaeaea;
	color:#FFF;
background-color:#000}

section.MyContainer [data-m-top="20"]
{
margin-top:20px}

section.MyContainer [data-m-top="30"]
{
margin-top:30px}

section.MyContainer [data-m-top="40"]
{
margin-top:40px}

section.MyContainer [data-m-top="50"]
{
margin-top:50px}

section.MyContainer [data-m-top="60"]
{
margin-top:60px}

section.MyContainer [data-m-Bottom="20"]
{
margin-bottom:20px}

section.MyContainer [data-m-Bottom="30"]
{
margin-bottom:30px}

section.MyContainer [data-m-Bottom="40"]
{
margin-bottom:40px}

section.MyContainer [data-m-Bottom="50"]
{
margin-bottom:50px}

section.MyContainer [data-m-Bottom="60"]
{
margin-bottom:60px}

section.MyContainer [data-align=center]
{
text-align:center}

section.MyContainer [data-align=left]
{
text-align:left}

section.MyContainer [data-align=right]
{
text-align:right}

section.MyContainer [data-align=justify]
{
text-align:justify}

article
{
	width:100%;
	display:block;
	position:relative;
	background-color:#FFF;
	font-size:0;
	text-align:center;
	max-width:1250px;
	margin-left:auto;
margin-right:auto}

article[data-col="1"] .MyCol
{
	width:calc(100% - 40px);
	display:inline-block;
	position:relative;
	margin-left:20px;
	margin-right:20px;
	vertical-align:middle;
max-width:1210px}

article[data-col="2"] .MyCol
{
	width:calc(50% - 40px);
	display:inline-block;
	position:relative;
	margin-left:20px;
	margin-right:20px;
	vertical-align:middle;
max-width:545px}

@media (max-width:761px)
{
	article[data-col="2"] .MyCol
	{
		width:calc(100% - 40px);
		margin-top:20px;
	margin-bottom:20px}

	article[data-col="2"] .MyCol:first-child
	{
	margin-top:0}

	article[data-col="2"] .MyCol:last-child
	{
	margin-bottom:0}
}

article[data-col="3"] .MyCol
{
	width:calc(33.33% - 40px);
	display:inline-block;
	position:relative;
	margin-left:20px;
	margin-right:20px;
	vertical-align:middle;
max-width:376px}

article[data-col="3"] .MyCol[data-colspan="2"]
{
	width:calc(66.66% - 40px);
	display:inline-block;
	position:relative;
	margin-left:20px;
	margin-right:20px;
	vertical-align:middle;
max-width:793px}

@media (max-width:761px)
{
	article[data-col="3"] .MyCol
	{
		width:calc(100% - 40px);
		margin-top:20px;
	margin-bottom:20px}

	article[data-col="3"] .MyCol:first-child
	{
	margin-top:0}

	article[data-col="3"] .MyCol:last-child
	{
	margin-bottom:0}
}

section.MyContainer p.MyPrice
{
font-size:22px}

@media (max-width:761px)
{
	section.MyContainer p.MyPrice
	{
	text-align:center}
}

section.MyContainer p.MyShopLink a
{
	background-color:#000;
	border:2px solid #000;
	color:#fff;
	cursor:pointer;
	display:inline-block;
	font-family:"Gotham SSm medium A","Gotham SSm medium B",Helvetica,Arial,sans-serif;
	font-size:12px;
	height:12px;
	line-height:12px;
	min-width:150px;
	padding-bottom:19px;
	padding-top:19px;
	text-align:center;
	text-decoration:none;
transition:opacity .3s ease 0s,background-color .3s ease 0s}

@media (max-width:761px)
{
	section.MyContainer p.MyShopLink
	{
	text-align:center}
}

section.MyContainer p.MyShopLink a:hover
{
	background-color:rgba(0,0,0,.7);
border:2px solid rgba(0,0,0,.7)}

section.MyContainer [data-color=red]
{
color:#be0f34!important}

section.MyContainer [data-color=white]
{
color:#FFF!important}

article img.FullWidth
{
width:100%}

section.MyContainer [data-max-size="420"]
{
max-width:420px!important}

section.MyContainer [data-max-size="512"]
{
max-width:512px!important}

section.MyContainer [data-max-size="780"]
{
max-width:780px!important}

section.MyContainer [data-max-size="1024"]
{
max-width:1024px!important}

section.MyContainer [data-max-size="1250"]
{
max-width:1250px!important}

section.MyContainer [data-max-size="1600"]
{
max-width:1600px!important}

section.MyContainer img.FullWidthBanner
{
width:100%}

@media (max-width:761px)
{
	section.MyContainer img.FullWidthBanner
	{
		width:150%;
	margin-left:-25%}
}

article.MyFullWidthBlock
{
	display:block;
	position:relative;
	font-size:0;
	text-align:center;
	width:2000px;
	max-width:2000px;
margin-left:-375px}

article.MyFullWidthBlock .wrapper
{
	width:100%;
display:inline-block}

article.MyFullWidthBlock img.FullWidth
{
	width:auto;
	display:block;
	margin-left:auto;
margin-right:auto}

@media (max-width:1249px)
{
	article.MyFullWidthBlock
	{
		width:100%;
	margin-left:0}

	article.MyFullWidthBlock img.FullWidth
	{
		width:100%;
	display:block}
}

@media (max-width:761px)
{
	article.MyFullWidthBlock
	{
	overflow:hidden}

	article.MyFullWidthBlock img.FullWidth
	{
		width:150%;
	margin-left:-25%}

	article.MyFullWidthBlock img.StickToLeftForMobile.FullWidth
	{
	margin-left:0}

	article.MyFullWidthBlock img.StickToRightForMobile.FullWidth
	{
	margin-left:-50%}
}

section.MyContainer article .MyFloatingBox
{
	padding:40px;
	width:calc(50% - 80px);
	max-width:505px;
	display:block;
	right:50%;
	top:50%;
	transform:translateY(-50%);
position:absolute}

section.MyContainer article[data-max-size="1024"] .MyFloatingBox
{
max-width:512px}

section.MyContainer article .MyFloatingBox[data-position=left]
{
right:50%}

section.MyContainer article.MyFloatingBox[data-position=center]
{
	right:50%;
transform:translateX(50%)}

section.MyContainer article .MyFloatingBox[data-position=right]
{
left:50%}

section.MyContainer article [data-bgcolor=white]
{
background-color:#FFF}

section.MyContainer article .MyFloatingBox .wrapper
{
padding:40px}

@media (max-width:761px)
{
	section.MyContainer article .MyFloatingBox[data-position]
	{
		padding:40px;
		width:calc(100% - 80px);
		max-width:761px;
		right:auto;
		top:auto;
		left:auto;
		transform:none;
	position:relative}

	section.MyContainer article .MyFloatingBox
	{
	text-align:center}

	section.MyContainer article .MyFloatingBox .wrapper
	{
	padding:0}
}

section.MyContainer p.MyTitle
{
	font-size:22px;
	font-style:normal;
	font-weight:400;
	font-family:"Gotham SSm medium A","Gotham SSm medium B",Helvetica,Arial,sans-serif;
	max-width:800px;
	margin-left:auto;
margin-right:auto}

@media (max-width:761px)
{
	section.MyContainer p.MyTitle
	{
	font-size:14px}
}

section.MyContainer p.MyTextBlock
{
	padding-left:50px;
padding-right:50px}

@media (max-width:761px)
{
	section.MyContainer p.MyTextBlock
	{
		padding-left:0;
	padding-right:0}
}

.MyVideoThumbnail
{
	max-width:326px;
width:100%}

@media (max-width:761px)
{
	.MyVideoThumbnail
	{
	margin-top:-50%}
}

.MyVideoBanner
{
width:100%}

@media (max-width:761px)
{
	.MyVideoBanner
	{
		width:1024px;
	margin-left:calc((100% - 512px) * .5)}
}

@media (max-width:512px)
{
	.MyVideoBanner
	{
		width:200%;
		max-width:6000px;
	margin-left:-10%}
}

@media (max-width:761px)
{
	#Logo-Arthritis
	{
		display:block;
		margin-left:auto;
		margin-right:auto;
	margin-bottom:-30px}
}

section.MyContainer p.MyReadMoreLink a
{
	font-size:11px;
text-decoration:underline}

section.MyContainer p.MyCloseLink a
{
	font-size:11px;
text-decoration:underline}

section.MyContainer [data-open="0"] p.MyCloseLink
{
display:none}

section.MyContainer [data-open="1"] p.MyCloseLink
{
display:block}

section.MyContainer [data-open="0"] p.MyReadMoreLink
{
display:block}

section.MyContainer [data-open="1"] p.MyReadMoreLink
{
display:none}

section.MyContainer [data-open="0"] .MyExcerpt
{
display:none}

section.MyContainer [data-open="1"] .MyExcerpt
{
display:block}

section.MyContainer #Paragraphe-2 p.MyReadMoreLink a
{
color:#be0f34}

section.MyContainer #Paragraphe-2 p.MyCloseLink a
{
color:#be0f34}

.box-wrapper
{
	border:12px solid #efefef;
padding:40px}

section.MyContainer p.MyVideoLink
{
	display:block;
line-height:0}

section.MyContainer p.MyVideoLink a
{
	display:inline-block;
	position:relative;
	margin:0;
padding:0}

section.MyContainer p.MyVideoLink a img
{
	display:block;
	margin:0;
padding:0}

section.MyContainer p.MyVideoLink a::before
{
	content:" ";
	display:block;
	position:absolute;
	width:50px;
	height:50px;
	left:12px;
	bottom:12px;
	background-color:rgba(0,0,0,.5);
z-index:1}

section.MyContainer p.MyVideoLink a::after
{
	content:" ";
	display:block;
	position:absolute;
	left:30px;
	bottom:30px;
	overflow:hidden;
	z-index:2;
	border-top:8px solid transparent;
	border-left:15px solid #fff;
border-bottom:8px solid transparent}

section.MyContainer .MyIngredient
{
	position:absolute;
	right:20px;
	top:20px;
	z-index:10;
	width:320px;
user-select:none}

@media (max-width:761px)
{
	section.MyContainer .MyIngredient
	{
		position:relative;
		right:auto;
		top:auto;
		z-index:10;
		width:100%;
		user-select:none;
	text-align:center}
}

section.MyContainer .MyIngredient .MyName
{
	text-decoration:underline;
	cursor:pointer;
display:inline-block}

section.MyContainer .MyIngredient .MyText
{
	position:absolute;
	left:calc(100% + 20px);
	top:50%;
	display:none;
	background-color:#FFF;
	border:2px solid #e5e5e5;
	text-align:left;
	padding:20px;
	transform:translateY(-50%);
	width:100%;
font-size:12px}

@media (max-width:761px)
{
	section.MyContainer .MyIngredient .MyText
	{
		position:relative;
		left:auto;
		top:auto;
		transform:none;
	width:calc(100% - 44px)}
}

section.MyContainer .MyIngredient .MyText[data-open="0"]
{
display:none}

section.MyContainer .MyIngredient .MyText[data-open="1"]
{
display:block}

section.MyContainer .MyIngredient .MyText::before
{
	content:" ";
	position:absolute;
	left:-10px;
	top:50%;
	display:block;
	background-color:#FFF;
	border-left:2px solid #e5e5e5;
	border-top:2px solid #e5e5e5;
	transform:translateY(-50%) rotate(-45deg);
	width:15px;
height:15px}

@media (max-width:761px)
{
	section.MyContainer .MyIngredient .MyText::before
	{
		left:50%;
	top:0}
}

section.MyContainer .MyIngredient .MyText strong
{
	display:block;
	font-size:14px;
	font-weight:400;
padding-bottom:8px}

section.MyContainer ul.MyBulletList
{
	list-style:none;
	text-align:left;
	display:inline-block;
position:relative}

section.MyContainer ul.MyBulletList li
{
	text-align:left;
	padding:0;
	margin:0;
	display:block;
	position:relative;
	padding-left:20px;
	font-size:16px;
	padding-bottom:15px;
min-height:25px}

@media (max-width:761px)
{
	section.MyContainer ul.MyBulletList li
	{
	font-size:14px}
}

section.MyContainer ul.MyBulletList li::before
{
	content:"";
	font-size:25px;
	position:absolute;
	top:0;
	left:0;
	width:20px;
height:20px}

section.MyContainer ul.MyCheckBoxList
{
	list-style:none;
	text-align:left;
	display:inline-block;
position:relative}

section.MyContainer ul.MyCheckBoxList li
{
	text-align:left;
	padding:0;
	margin:0;
	display:block;
	position:relative;
	padding-left:40px;
	font-size:16px;
	padding-bottom:15px;
min-height:25px}

section.MyContainer ul.MyCheckBoxList li::before
{
	content:" ";
	background-image:url(img/checkbox.png);
	position:absolute;
	top:0;
	left:0;
	background-repeat:no-repeat;
	background-position:top left;
	width:25px;
height:25px}

@media (max-width:761px)
{
	section.MyContainer ul.MyCheckBoxList li
	{
	font-size:14px}
}

.MyColorBlock-1
{
	background-color:#29100b;
color:#FFF}

.MyColorBlock-1 *
{
color:#FFF!important}

.MyColorBlock-1 .MyCol
{
vertical-align:top!important}

.MyColorBlock-1 .MyTextBox
{
	border:1px solid #FFF;
	padding:20px;
	text-align:center;
	margin-top:30px;
margin-bottom:30px}

.MyColorBlock-1 h2
{
	margin-top:30px!important;
margin-bottom:30px!important}

.MyColorBlock-1 .MyTextBox strong
{
	display:block;
font-size:1.5em}

.MyColorBlock-1 .MyTextBox a
{
	display:block;
	text-transform:uppercase;
font-size:11px}

.MyColorBlock-1 .HandMenWithChild
{
width:200%}

@media (max-width:1249px)
{
	.MyColorBlock-1 .HandMenWithChild
	{
		width:150%;
	margin-left:0}
}

@media (max-width:761px)
{
	.MyColorBlock-1 .MyCol:first-child
	{
	margin-top:50%!important}

	.MyColorBlock-1 .MyCol:last-child
	{
		margin:0!important;
		padding:0!important;
		position:absolute;
		top:0;
		left:0;
		width:100%!important;
		max-width:761px;
	text-align:right}

	.MyColorBlock-1 .HandMenWithChild
	{
		width:70%;
	margin-bottom:0}
}

.MyColorBlock-2
{
background-color:#f4f2f1}

.MyColorBlock-3
{
	background-color:#e1eefb;
padding-bottom:60px}

.MyQuestionCard
{
	height:600px;
	background-color:#FFF;
	margin-bottom:40px;
opacity:0}

@media (max-width:761px)
{
	.MyQuestionCard
	{
		min-height:400px;
	height:auto}
}

.MyQuestionCard::before
{
	content:attr(data-content);
	position:absolute;
	top:50%;
	left:0;
	text-align:center;
	font-size:250px;
	font-family:"Gotham SSm book A","Gotham SSm book B",Helvetica,Arial,sans-serif;
	width:100%;
	transform:translateY(-50%);
	color:#e7f1fc;
z-index:1}

.MyQuestionCard:first-child::before
{
	font-family:ClarinsRegular,"Times New Roman",Times,serif;
color:#FFF}

.MyQuestionCard .MyQuestion
{
	position:absolute;
	left:0;
	top:0;
	text-align:center;
	width:100%;
	z-index:2;
	height:100%;
cursor:pointer}

.MyColorBlock-3.Anim .MyQuestionCard:first-child
{
	background-color:transparent;
	border:1px solid #FFF;
width:calc(33.33% - 42px);
}

.MyColorBlock-3.Anim .MyQuestionCard:nth-child(0n+1)
{
animation:FadeIn .5s ease-in 0s both}

.MyColorBlock-3.Anim .MyQuestionCard:nth-child(0n+2)
{
animation:FadeIn .5s ease-in .5s both}

.MyColorBlock-3.Anim .MyQuestionCard:nth-child(0n+3)
{
animation:FadeIn .5s ease-in 1s both}

.MyColorBlock-3.Anim .MyQuestionCard:nth-child(0n+4)
{
animation:FadeIn .5s ease-in 1.5s both}

.MyColorBlock-3.Anim .MyQuestionCard:nth-child(0n+5)
{
animation:FadeIn .5s ease-in 2s both}

.MyColorBlock-3.Anim .MyQuestionCard:nth-child(0n+6)
{
animation:FadeIn .5s ease-in 2.5s both}

@keyframes FadeIn
{
	from
	{
	opacity:0}

	to
	{
	opacity:1}
}

@media (max-width:761px)
{
	.MyQuestionCard:first-child
	{
	width:calc(100% - 42px)!important}
}

.MyQuestionCard:first-child .MyQuestion
{
	height:auto;
	top:50%;
	transform:translateY(-50%);
cursor:normal}

.MyQuestionCard .MyQuestion h3
{
	font-size:25px;
	margin:0;
	font-family:ClarinsRegular,"Times New Roman",Times,serif;
	font-weight:400;
	position:absolute;
	left:0;
	top:50%;
	padding:30px;
	width:calc(100% - 60px);
transform:translateY(-50%)}

.MyQuestionCard:first-child .MyQuestion h3
{
	position:relative;
	left:auto;
	top:auto;
	transform:none;
	padding:0;
	width:100%;
font-size:35px}

.MyQuestionCard:first-child .MyQuestion p
{
	margin:0;
padding:0}

.MyQuestionCard .MyQuestionLink
{
	position:absolute;
	left:0;
	bottom:20px;
	text-align:center;
	width:100%;
z-index:3}

@media (max-width:761px)
{
	.MyQuestionCard .MyAnswer .MyQuestionLink
	{
		position:relative;
		left:auto;
		bottom:auto;
	padding-bottom:30px}
}

.MyQuestionCard .MyQuestionLink a
{
	color:#be0f34;
	font-size:11px;
	font-weight:700;
text-decoration:underline}

.MyQuestionCard .MyAnswer
{
	position:absolute;
	left:0;
	top:0;
	text-align:center;
	width:100%;
	height:100%;
	z-index:3;
	display:none;
	background-color:#FFF;
cursor:pointer}

@media (max-width:761px)
{
	.MyQuestionCard .MyAnswer
	{
		position:relative;
		left:auto;
	top:auto}
}

.MyQuestionCard .MyAnswer p.MyText strong
{
	font-size:35px;
	font-family:ClarinsRegular,"Times New Roman",Times,serif;
	font-weight:400;
	display:block;
padding-bottom:30px}

.MyQuestionCard .MyAnswer p.MyText
{
	margin:0;
	font-weight:400;
	position:absolute;
	left:0;
	top:0;
	padding:35px;
	width:calc(100% - 80px);
	text-align:left;
    font-size:14px;
    line-height:18px;
}

@media (max-width:761px)
{
	.MyQuestionCard .MyAnswer p.MyText
	{
		position:relative;
		left:auto;
	top:auto}
}

.MyQuestionCard .MyAnswer:target
{
display:block}

@media (max-width:761px)
{
	#MyTexture
	{
	display:none}
}