.MyContent {
	display: block;
	font-family: "Gotham SSm book A", "Gotham SSm book B", Gotham, Helvetica, Arial, sans-serif;
	margin-left: auto;
	margin-right: auto;
	max-width: 1250px;
	position: relative;
	width: 100%;
	text-align: center;
	padding-bottom: 60px;
	z-index: 1;
}
#main {
	margin-top: 0;
}
#main .breadcrumb {
	display: none;
}
.MyContent .product-quickshop {

	display: inline-block!important;
	
}
.MyContent .product-tile {
	color: #999;
	display: inline-block;
	margin: 20px auto 0;
	padding: 0;
	position: relative;
	text-align: center;
	width: 170px;
}
.MyContent span.red {
	color: #be0f34;
	font-size: 14px;
	text-transform: uppercase;
	line-height: 1em;
	font-family: "Gotham SSm book A", "Gotham SSm book B", Gotham, Helvetica, Arial, sans-serif;
}
.MyContent h1 {
	margin: 0;
	padding: 0;
	font-family: ClarinsRegular, Clarins;
	font-size: 60px;
	font-weight: normal;
	line-height: 1em;
	text-align: center;
	margin-top: 20px;
	padding-left: 20px;
	padding-right: 20px;
}
.MyContent a:hover {
	color: #000;
}

@media only screen and (max-width:761px) {
.MyContent h1 {
	font-size: 50px;
}
}
.MyContent h1 span {
	display: inline-block;
}
.MyContent #Main-Header {
	margin-bottom: -50px;
}
.MyContent #Main-Header a:hover {
	color: #000;
}

@media only screen and (max-width:1023px) {
.MyContent #Main-Header {
	margin-bottom: -40px;
}
}

@media only screen and (max-width:761px) {
.MyContent #Main-Header {
/*margin-bottom:0px;*/
}
}
.MyContent #Main-Header .MobileOnly {
	display: none;
}

@media only screen and (max-width:761px) {
.MyContent #Main-Header .MobileOnly {
	display: block;
}
}
.MyContent #Main-Header p, .MyContent #Main-Header-2 p {
	margin: 10px;
	font-size: 16px;
	line-height: 1.4em;
	text-align: center;
	margin-top: 5px;
}

@media only screen and (max-width:761px) {
.MyContent #Main-Header-2 {
	display: none;
}
}
.MyContent .FullWidthBanner {
	margin: 0;
	padding: 0;
	width: 1600px;
	margin-left: -175px;
	text-align: center;
	display: block;
	position: relative;
}

@media only screen and (max-width:1249px) {
.MyContent .FullWidthBanner {
	margin-left: calc(50% - 800px);
}
}

@media only screen and (max-width:1023px) {
.MyContent .FullWidthBanner {
	margin-left: 0;
	width: 100%;
}
}
.MyContent .FullWidthBanner img {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

@media only screen and (max-width:1023px) {
.MyContent .FullWidthBanner img {
	max-width: 100%;
}
}

@media only screen and (max-width:761px) {
.MyContent .FullWidthBanner img {
	width: 170%;
	max-width: 1600px;
	margin-left: -35%;
}
}
/*LOOKS MOSAIC*/

.MyContent #Ages-Mosaic {
	width: 1064px;
	margin-left: auto;
	margin-right: auto;
	display: block;
	font-size: 0;
	z-index: 1;
	margin-bottom: -80px;
}

@media only screen and (max-width:1023px) {
.MyContent #Ages-Mosaic {
	padding-top: 70px;
	margin-top: -50px;
	width: calc(100% - 20px);
	margin-bottom: 0px;
}
}

@media only screen and (max-width:761px) {
.MyContent #Ages-Mosaic {
	padding-top: 55px;
	margin-top: -50px;
	margin-bottom: 0px;
		width: calc(100% - 4px);
}
}
.MyContent #Ages-Mosaic ul {
	padding: 0px;
	margin: 0px;
	list-style: none;
	display: block;
	position: relative;
	background-color: #FFFFFF;
	font-size: 0;
}
.MyContent #Ages-Mosaic ul li {
	padding: 0px;
	margin: 0px;
	display: inline-block;
	text-align: center;
	margin: 20px;
	vertical-align: top;
}

@media only screen and (max-width:1023px) {
.MyContent #Ages-Mosaic ul li {
	width: calc(33% - 20px);
	margin: 10px;
}
}

@media only screen and (max-width:761px) {
.MyContent #Ages-Mosaic ul li {
	margin: 2px;
	width: calc(33% - 4px);
}
}
.MyContent #Ages-Mosaic ul li a {
	text-decoration: none;
	color: #000;
	font-size: 24px;
	line-height: 1em;
	font-family: ClarinsRegular, Clarins;
	text-align: center;
	padding-top: 15px;
}

@media only screen and (max-width:761px) {
.MyContent #Ages-Mosaic ul li a {
	/*font-size: 16px;
	font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
	line-height: 21px;*/
	padding-top: 8px;
}
}
.MyContent #Ages-Mosaic ul li a img {
	display: block;
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
}
.MyContent #Ages-Mosaic ul li a span {
	text-align: center;
	padding-top: 15px;
	display: block;
}
.MyContent #Ages-Mosaic ul li a span:last-child {
	padding-top: 5px;
}

@media only screen and (max-width:761px) {
.MyContent #Ages-Mosaic ul li a span {
	padding-top: 15px;
}
}
/*AGE TEMPLATE */
.MyContent .Anchor-Age {
	height: 60px;
}
#Pick-Your-favorite {
	margin-top: -60px;
}

@media only screen and (max-width:1023px) {
.MyContent .Anchor-Age {
	height: 40px;
}
#Pick-Your-favorite {
	margin-top: -40px;
}
}
.MyContent .Header-Age-Title {
	max-width: 1170px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	display: block;
	margin-top: 60px;
	margin-bottom: 0px;
	background-repeat: no-repeat;
	background-color: #eaf1f3;
	font-size: 0;
}
#Age-Header-30-Title {
	background-color: #e1ebee;
}
#Age-Header-40-Title {
	background-color: #eaf1f3;
}
#Age-Header-50-Title {
	background-color: #eaf1f3;
}

@media only screen and (max-width:1023px) {
.MyContent .Header-Age-Title {
	margin-top: 0px;
}
}

@media only screen and (max-width:761px) {
.MyContent .Header-Age-Title {
	margin-top: 0px;
	margin-bottom: -50px;
	display: flex;
	flex-direction: column-reverse;
	max-width: 585px;
	z-index: 2;
}
}
.MyContent .Header-Age-Title .InlineBlock {
	position: relative;
	display: inline-block;
	width: 50%;
	vertical-align: middle;
}

@media only screen and (max-width:761px) {
.MyContent .Header-Age-Title .InlineBlock {
	width: 100%;
}
.MyContent .Header-Age-Title .InlineBlock:first-child {
	flex: 1;
	padding-top: 40px;
	padding-bottom: 40px;
	background-color:#FFF;
}
.MyContent .Header-Age-Title .InlineBlock:last-child {
	flex: 1;
}
}
.MyContent .Header-Age-Title img {
	max-width: 100%;
}
.MyContent .Header-Age-Title h2 {
	margin: 0;
	font-family: ClarinsRegular, Clarins;
	font-size: 50px;
	font-weight: normal;
	line-height: 1em;
	text-align: center;
	padding: 20px;
	position: relative;
	padding-bottom: 0;
	padding-top: 10px;
}
.MyContent .Header-Age-Title a:hover h2 {
	color: #000;
}

@media only screen and (max-width:761px) {
.MyContent .Header-Age-Title h2 {
	font-size: 40px;
	padding-top: 0;
	margin-bottom: 0px;
}
}
.MyContent .Header-Age-Title p:last-child {
	font-size: 16px;
	padding: 15px;
	margin: 0;
}
/*-------------------------------*/
.MyContent .Header-Age {
	margin: 0px;
	max-width: 1170px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	display: block;
	background-repeat: no-repeat;
	background-color: #FFF;
	width: 100%;
	text-align: center;
	margin-bottom: -50px;
}

@media only screen and (max-width:761px) {
.MyContent .Header-Age {
	padding-top: 20px;
	display: flex;
	flex-direction: column;
}
}
.MyContent .Header-Age .Ingredient {
	position: relative;
	display: inline-block;
	width: 600px;
	text-align: right;
	padding-top: 30px;
}

@media only screen and (max-width:761px) {
.MyContent .Header-Age .Ingredient {

	margin-left: 0;
	order: 1;
	width: 100%;
	height: 150px;
	overflow: hidden;
	
}
}
.MyContent .Header-Age .Ingredient img {
	position: relative;
	display: block;
	margin-left:auto;
	margin-right:0;
}
@media only screen and (max-width:761px) {
.MyContent .Header-Age .Ingredient img {
	
	width: 100%;
}
}
.MyContent .Header-Age .Ingredient span {
	position: absolute;
	display: block;
	font-size: 14px;
	line-height: 20px;
}
#Age-Header-30 .Ingredient span{
    right: 51%;
    text-align: right;
    top: 18%;
}
#Age-Header-30 .Ingredient span:last-child {
	left: 100%;
	right:auto;
	text-align: left;
	top: 18%;
}
#Age-Header-40 .Ingredient span{
    right: 51%;
    text-align: right;
    top: 18%;
}
#Age-Header-40 .Ingredient span:last-child {
	left: 100%;
	right:auto;
	text-align: left;
	top: 18%;
}
#Age-Header-50 .Ingredient span{
    right: 51%;
    text-align: right;
    top: 18%;
}
#Age-Header-50 .Ingredient span:last-child {
	left: 100%;
	right:auto;
	text-align: left;
	top: 18%;
}
.MyContent .Header-Age .Video {
	position: absolute;
	display: block;
	/* float: left; */
	/* margin-top: -250px; */
	/* height: 50px; */
	/* width: 60%; */
	top: 180px;
	left: 0;
	padding: 0;
}

@media only screen and (max-width:761px) {
.MyContent .Header-Age .Video {
	position: relative;
	display: block;
	float: none;
	margin-top: 0px;
	height: auto;
	width: 100%;
	flex: 0;
	order: 3;
	top: 0;
}
}
.MyContent .Header-Age .Video a {
	display: inline-block;
	position: relative;
z-index: 1;
}
.MyContent .Header-Age .Video a img {
	display: block;
	position: relative;
	max-width: 100%;
}
.MyContent .Header-Age .Video a::after {
	content: " ";
	position: absolute;
	display: block;
	bottom: 15px;
	left: 15px;
	width: 50px;
	height: 50px;
	background-image: url("img/video-play.png");
	background-repeat: no-repeat;
}
.MyContent .Header-Age .FloatingBox {
	position: relative;
	display: block;
	text-align: center;
	clear: both;
	margin-top: -303px;
}
@media only screen and (max-width:761px) {
.MyContent .Header-Age .FloatingBox {
		margin-top: 0px;
	position: relative;
	display: block;
	text-align: center;
	clear: both;
	padding: 0px;
	flex: 1;
	order: 2;/*margin-top:-200px;*/
}
}
.MyContent .Header-Age .FloatingBox .wrapper {
	border: 8px #efefef solid;
	background-color: #FFF;
	width: 282px;
	padding: 40px;
	display: inline-block;

	text-align: center;
	margin-right: -50px;
	
	z-index: 2;
position: relative;
}

@media only screen and (max-width:761px) {
.MyContent .Header-Age .FloatingBox .wrapper {
	width: calc(100% - 56px);
	margin-top: 0px;
padding: 20px;
padding-bottom:40px;
padding-top:40px;
	margin: 0;
}
}
.MyContent .Header-Age .FloatingBox .wrapper h3 {
	margin: 0;
	font-family: ClarinsRegular, Clarins;
	font-size: 35px;
	font-weight: normal;
	line-height: 1em;
	text-align: center;
	padding: 0px;
	padding-top: 20px;
}
.MyContent .Header-Age .FloatingBox .wrapper p {
	margin: 0;
	padding: 0;
	padding-top: 20px;
	font-size: 14px;
	line-height: 17px;
}
.MyContent .Header-Age .FloatingBox .wrapper p.Title {
	display: inline;
	color: #be0f34;
	text-transform: uppercase;
}
.MyContent .Header-Age .FloatingBox .wrapper a {
	display: inline-block;
	color: #000;
	text-transform: uppercase;
	text-decoration: none;
	font-size: 11px;
	line-height: 14px;
	font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
	border-bottom: 1px solid #bfbfbf;
	position:relative;
	

}
.MyContent .Header-Age .FloatingBox .wrapper a::before{
	content:" ";
	background-image:url(img/video-play-link.png);
	background-repeat:no-repeat;
	display:block;
	position:absolute;
	width:19px;
	height:19px;
	left: -25px;
	bottom: -2px;

}
.MyContent .Header-Age .FloatingBox .wrapper a:hover {
	color: #be0f34;
	border-bottom: 1px solid #be0f34;
}
.MyContent .Header-Age .Packshot {
	position: absolute;
	display: block;
	bottom: 0px;
	right: 0;
	width: 215px;
}
.MyContent .Header-Age .Packshot .Product-Name {
	min-height: 10px;
}

@media only screen and (max-width:761px) {
.MyContent .Header-Age .Packshot {
	position: relative;
	display: block;
	bottom: auto;
	right: auto;
	width: auto;
	flex: 1;
	order: 4;
}
}
.MyContent .Product-Name {
	margin: 0;
	padding: 0;
	font-family: ClarinsRegular, Clarins;
	font-size: 22px;
	font-weight: normal;
	line-height: 1em;
	color: #be0f34;
	min-height: 48px;
}
.MyContent .Product-Text {
	margin: 0;
	padding: 0;
	font-family: ClarinsRegular, Clarins;
	font-size: 22px;
	font-weight: normal;
	line-height: 1em;
	color: #be0f34;
	min-height: 48px;
}
.MyContent .Product-Price {
	margin: 0;
	padding: 0;
	font-size: 16px;
	padding-top: 10px;
}
.MyContent p.btn-link {
	margin: 0;
	padding: 0;
}
.MyContent p.btn-link a {
	text-align: center;
	background-color: #FFF;
	display: inline-block;
	color: #000;
	padding: 16px 30px;
	text-transform: uppercase;
	text-decoration: none;
	font-size: 11px;
	line-height: 10px;
	font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
	border: 2px solid #e5e5e5;
	min-width: 16px;
	margin-top: 20px;
}
/*-------------------------------------*/
.MyContent .Routine-Age {
	margin: 0px;
	max-width: 944px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	display: block;
	background-repeat: no-repeat;
	background-color: #FFF;
	width: 100%;
	text-align: center;
}
.MyContent .Routine-Age h3 {
	margin: 0;
	padding: 0;
	font-family: ClarinsRegular, Clarins;
	font-size: 40px;
	font-weight: normal;
	line-height: 1em;
	color: #000;
	margin-top: 30px;
	margin-bottom:30px;
}

@media only screen and (max-width:761px) {
.MyContent .Routine-Age h3 {
	margin: 20px;
	font-size: 35px;
}
}
.MyContent .Routine-Age h4 {
	margin: 0;
	padding: 0;
	font-family: ClarinsRegular, Clarins;
	font-size: 35px;
	font-weight: normal;
	line-height: 1em;
	color: #000;
}
.MyContent .Routine-Age h4 span.red {
	display: block;
	font-size: 14px;
	font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
	padding-bottom: 8px;
}

@media only screen and (max-width:761px) {
.MyContent .Routine-Age h4 {
	padding-top: 20px;
}
.MyContent .Routine-Age ul li p.Text {
	max-width: 150px!important;
}
}
.MyContent .Routine-Age ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display:-webkit-flex;
	display: flex;
	position: relative;
	font-size: 0;
	-webkit-flex-wrap:wrap;
	flex-wrap:wrap;
	
}
.MyContent .Routine-Age ul li p.Text {
	font-size: 14px;
	line-height: 17px;
	min-height: 119px;
}
.MyContent .Routine-Age ul li .Product-Name {
	display: block;
	margin-left: auto;
	margin-right: auto;
	max-width: 280px;
	position: relative;
	font-size: 14px;
	font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
	text-transform: uppercase;
	color: #000;
	padding-top: 20px;
	min-height: 10px;
	line-height:1.4em;
}
.MyContent .Routine-Age ul li .Product-Text {
	display: block;
	margin-left: auto;
	margin-right: auto;
	max-width: 280px;
	position: relative;
	font-size: 14px;
	font-family: "Gotham SSm book A", "Gotham SSm book B", Gotham, Helvetica, Arial, sans-serif;
	color: #000;
	padding-top: 5px;
	min-height: 10px;
	line-height:1.4em;
}
.MyContent .Routine-Age ul li .Packshot {
	display: flex;
	position: relative;
	width:100%;
	vertical-align:bottom;
	justify-content:center;
	align-items:flex-end;
}
.MyContent .Routine-Age ul li .Packshot img{
	width: 180px;
}
.MyContent .Routine-Age ul li .Product-Info {
	display: inline-block;
	position: relative;
		width:210px;
		text-align:left;
		padding-bottom:15px;
		font-size:11px;
}
.MyContent .Routine-Age ul li .Product-Info .fa{
	color:#be0f34;
}
.MyContent .Routine-Age ul li .Product-Reviews {
	font-size:12px;
}
.MyContent .Routine-Age ul li {
	margin: 20px;
	padding: 0;
	display: flex;
	width: calc(50% - 40px);
	position: relative;
	margin-bottom: 0px;
	vertical-align: top;
	-webkit-flex-direction: column;
	-webkit-justify-content: space-between;
	
	flex-direction: column;
	justify-content: space-between;
}
.MyContent .Routine-Age ul li .product-tile{
	margin-left: 0px;
	text-align:left;
}
@media only screen and (max-width:761px) {
.MyContent .Routine-Age ul li {
	margin: 20px;
	width: calc(100% - 40px);
}
}
.MyContent .Routine-Age ul li .TitleTip {
	min-height: 10px;
}

@media only screen and (max-width:761px) {
.MyContent .Routine-Age ul li .TitleTip {
	min-height: 10px;
}
}
.MyContent .MobileTitle {
	margin: 0;
	padding: 0;
	font-size: 16px;
	line-height: 22px;
	display: block;
	border-bottom: #ececec solid 2px;
	padding-right: 35px;
	position: relative;
	text-align: left;
	padding-top: 20px;
	padding-bottom: 20px;
	cursor: pointer;
}
.MyContent .MobileTitle span{
font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
font-size:10px;
padding-bottom:5px;
display:block;
}
.MyContent .Header-Age .MobileTitle {
	margin-left: 20px;
	margin-right: 20px;
}
.MyContent .MobileTitle::after {
	clear: both;
	content: "-";
	font-size: 24px;
	color: #9f9f9f;
	text-align: center;
	position: absolute;
	width: 35px;
	line-height: 35px;
	right: 0;
	top: calc(50% - 17px);
	font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
}

@media only screen and (max-width:761px) {
.MyContent .MobileToggle {
	margin-top: 0!important;
	margin-bottom: 0!important;
	border-bottom: #ececec solid 2px;
}
.MyContent .MobileToggle.Closed  {
	border-bottom: #fff solid 2px;
}
.MyContent .MobileToggle.Closed div {
	display: none;
}
.MyContent .MobileToggle.Closed .MobileTitle {
	display: block;
	margin-bottom: 0;
}
.MyContent .MobileToggle.Closed .MobileTitle::after {
	content: "+";
}
.MyContent .MobileToggle.Closed  .Packshot {
	display: none;
}
}

@media only screen and (min-width:762px) {
.MyContent .MobileTitle {
	display: none;
}
}
/*new*/
/*Tablet*/
@media only screen and (max-width:1024px) {
#Age-Header-30 .Ingredient span:last-child {
	left: 90%;
	right:auto;
	text-align: left;
	top: 23%;
}
}
@media only screen and (max-width:1024px) {
#Age-Header-40 .Ingredient span:last-child {
	left: 90%;
	right:auto;
	text-align: left;
	top: 23%;
}
}
@media only screen and (max-width:1024px) {
#Age-Header-50 .Ingredient span:last-child {
	left: 90%;
	right:auto;
	text-align: left;
	top: 23%;
}
}

@media only screen and (max-width:768px) {
#Age-Header-30 .Ingredient span:last-child {
	left: 100%;
	right:auto;
	text-align: left;
	top: 10%;
}
}

@media only screen and (max-width:768px) {
#Age-Header-40 .Ingredient span:last-child {
	left: 100%;
	right:auto;
	text-align: left;
	top: 10%;
}
}
@media only screen and (max-width:768px) {
#Age-Header-50 .Ingredient span:last-child {
	left: 100%;
	right:auto;
	text-align: left;
	top: 10%;
}
}


/*mobile*/
@media only screen and (max-width:320px) {
#Age-Header-30 .Ingredient span{
    right: 69%;
    text-align: right;
    top: 72%;
}
}
@media only screen and (max-width:320px) {
#Age-Header-40 .Ingredient span{
    right: 69%;
    text-align: right;
    top: 72%;
}
}
@media only screen and (max-width:320px) {
#Age-Header-50 .Ingredient span{
    right: 69%;
    text-align: right;
    top: 72%;
}
}
@media only screen and (max-width:320px) {
#Age-Header-30 .Ingredient span:last-child {
	left: 38%;
	right:auto;
	text-align: left;
	top: 18%;
}
}
@media only screen and (max-width:320px) {
#Age-Header-40 .Ingredient span:last-child {
	left: 38%;
	right:auto;
	text-align: left;
	top: 18%;
}
}
@media only screen and (max-width:320px) {
#Age-Header-50 .Ingredient span:last-child {
	left: 38%;
	right:auto;
	text-align: left;
	top: 18%;
}
}
@media only screen and (max-width:568px) {
#Age-Header-30 .Ingredient span{
    right: 74%;
    text-align: right;
    top: 62%;
}
}
@media only screen and (max-width:568px) {
#Age-Header-40 .Ingredient span{
    right: 74%;
    text-align: right;
    top: 62%;
}
}
@media only screen and (max-width:568px) {
#Age-Header-50 .Ingredient span{
    right: 74%;
    text-align: right;
    top: 62%;
}
}
@media only screen and (max-width:568px) {
#Age-Header-30 .Ingredient span:last-child {
	left: 40%;
	right:auto;
	text-align: left;
	top: 21%;
}
}
@media only screen and (max-width:568px) {
#Age-Header-40 .Ingredient span:last-child {
	left: 40%;
	right:auto;
	text-align: left;
	top: 21%;
}
}

@media only screen and (max-width:568px) {
#Age-Header-50 .Ingredient span:last-child {
	left: 40%;
	right:auto;
	text-align: left;
	top: 21%;
}
}