/*--------------GLOBAL ----------*/

/*---------------------------------------------*/
section.MyContainer{
   /*padding-bottom:60px;*/
}
.primary-content {
	padding-bottom:0px;
}
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: normal;
    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: normal;
    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:-0.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 0.2s ease-in-out;
	background-color:#FFF;
    
}
section.MyContainer  .MyBtnLink:hover{
	border:2px solid #eaeaea;
	color:#FFF;
	background-color:#000;
}
/*-----MARGIN BLOCKS ---*/

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;}

/*--------text alignment--------*/

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:#FFFFFF;
	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:0px;
	}
	article[data-col="2"] .MyCol:last-child{
		margin-bottom:0px;
	}
}

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:0px;
	}
	article[data-col="3"] .MyCol:last-child{
		margin-bottom:0px;
	}
}


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 0.3s ease 0s, background-color 0.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,0.7);
border: 2px solid rgba(0,0,0,0.7);
}
/*--------------- color  ---------------------*/

section.MyContainer *[data-color="red"]{color:#be0f34!important;}
section.MyContainer *[data-color="white"]{color:#FFF!important;}

/*--------------- IMAGE  ---------------------*/
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:0px;
	}
}

/*---------------------------------------------*/
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:0px;
		padding-right:0px;
	}	
}
/*---------------------------------------------*/

.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) * 0.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,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 white;
	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:0px;
	}
}
section.MyContainer .MyIngredient .MyText strong{
	display:block;
	font-size:14px;
	font-weight:normal;
	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:0px;
	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%;
	/*margin-bottom:50%;*/

}
@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:375px;
		height:auto;
	}
}
.MyQuestionCard::before{
	content:attr(data-content);
	position:absolute;
	top:50%;
	left:0px;
	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:0px;	
	top:0px;
	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)!important;
}

.MyColorBlock-3.Anim .MyQuestionCard:nth-child(0n+1){
	animation:FadeIn 0.5s ease-in 0s both;
}

.MyColorBlock-3.Anim .MyQuestionCard:nth-child(0n+2){
	animation:FadeIn 0.5s ease-in 0.5s both;
}

.MyColorBlock-3.Anim .MyQuestionCard:nth-child(0n+3){
	animation:FadeIn 0.5s ease-in 1s both;
}

.MyColorBlock-3.Anim .MyQuestionCard:nth-child(0n+4){
	animation:FadeIn 0.5s ease-in 1.5s both;
}

.MyColorBlock-3.Anim .MyQuestionCard:nth-child(0n+5){
	animation:FadeIn 0.5s ease-in 2s both;
}

.MyColorBlock-3.Anim .MyQuestionCard:nth-child(0n+6){
	animation:FadeIn 0.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:normal;
	position:absolute;
	left:0px;	
	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:0px;
	width:100%;
	font-size:35px;
}
.MyQuestionCard:first-child .MyQuestion p{
margin:0px;
	padding:0px;

}


.MyQuestionCard .MyQuestionLink{
	position:absolute;
	left:0px;	
	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:bold;
	text-decoration:underline;
	

}
.MyQuestionCard .MyAnswer{
	position:absolute;
	left:0px;	
	top:0px;
	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:normal;
	display:block;
	padding-bottom:30px;

}

.MyQuestionCard .MyAnswer p.MyText{
	margin:0;
	font-weight:normal;
	position:absolute;
	left:0px;	
	top:0;
	padding:40px;
	width:calc(100% - 80px);
	/*transform:translateY(-50%);*/
	text-align:left;
	font-size:14px;
}
@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;
	}
}