
.MyContent {
	width: 100%;
	display: block;
	position: relative;
	max-width: 1250px;
	min-width: 320px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	font-size:0;
}
.MyContent p{
	margin:0 auto;
	font-family: "Gotham SSm book A", "Gotham SSm book B", Gotham, Helvetica, Arial, sans-serif;
	font-size: 14px;
	line-height: 1.4em;
	color: #000;
	text-align: center;
	
}
.MyContent img{
display:block;
	position: relative;
	max-width:100%;
}
.MyContent .MyBlock {
	display:block;
	max-width:1170px;
	padding-top:70px;
}

.MyContent .Wrapper {
	display:block;
	position:relative;
	text-align:center;
}

@media only screen and (max-width:1169px) and (min-width:762px){
.MyContent #VIDEO-BLOCK {
	width:calc(60% - 40px)
}
.MyContent #ANIM-BLOCK {
	width:calc(40% - 40px)
}
.MyContent #PACKSHOT-1{
	width:calc(50% - 40px)
}
.MyContent #PACKSHOT-2{
	width:calc(50% - 40px);
}

}
@media only screen and (max-width:761px){
	.MyContent .Wrapper {
	margin-top:20px;
}
.MyContent #PACKSHOT-1{
	width:calc(100% - 40px);
	text-align:center;
	margin:0;
}
.MyContent #PACKSHOT-2{
	width:calc(100% - 40px);
	position:absolute;
	top:0;
	margin:0;
	left:50%;
	transform:translateX(-50%);
	animation:AnimFadeInOut_1 ease-in-out 8s infinite;
	text-align:center;
}
.MyContent #SWEET-NEROLI img,
.MyContent #WONDER-FIG img{
	margin:0 auto;
	
}
}
@keyframes AnimFadeInOut_1{
	0%{
		opacity:0;
	}
	40%{
		opacity:0;
	}
	50%{
		opacity:1;
	}
	90%{
		opacity:1;
	}
	100%{
		opacity:0;
	}
}
.MyContent .InlineBlock {
	display: inline-block;
	margin:20px;
	vertical-align:middle;
}
.MyContent  .Text{
	position:relative;
	display:block;
	max-width:700px;
	margin:0 auto;
	padding-left:20px;
	padding-right:20px;
}
.MyContent h2 {
	display: inline-block;
	font-family: ClarinsRegular, Clarins;
	font-size: 35px;
	font-weight: normal;
	line-height: 1em;
	margin: 0;
	padding: 0;
	position: relative;
	text-align: center;
	z-index: 1;
	padding-bottom:16px;


}
@media only screen and (max-width:761px) {
.MyContent h2 {
		margin: 0 20px;	
}
}

.MyContent  .BtnLink{
	margin:0;
	margin-top:18px;
	
}

.MyContent  .BtnLink a {
	font-family: "Gotham SSm medium A", "Gotham SSm medium B", Gotham, Helvetica, Arial, sans-serif;
	font-size: 11px;
	text-transform: uppercase;
	color: #FFF;
	text-decoration: none;
	position: relative;
	background-color: #000;
	padding: 18px 30px;
	display: inline-block;
	line-height: 14px;
	border:2px solid #FFF;
	transition:ease-in-out 0.5s; 
}
.MyContent .BtnLink a:hover {
	color: #000;
	background-color: #FFF;
	border:2px solid #8b8b8b;
}

.MyContent p.VideoLink{
	display:inline-block;
	position: relative;
	padding:0;
	margin:0;
	text-align:left;
	line-height:0;
	font-size:0;
}

.MyContent p.VideoLink a::before {
	content: " ";
	display: inline-block;
	background-image: url(img/VideoPlayBtn.png);
	background-repeat: no-repeat;
	background-position: left bottom;
	position: absolute;
	left: calc(50% - 25px);
	height: 50px;
	width: 50px;
	top:calc(50% - 25px);
	z-index:2;
}
.MyContent  .AnimRetail{
	position:relative;
}

.MyContent  .AnimRetail img{
	position:absolute;
	width:100%;
	top:0;
	left:0;
}
.MyContent  .AnimRetail img:nth-child(1){
}
.MyContent  .AnimRetail img:nth-child(2){
	animation:AnimFadeInOut_2 ease-in-out 9s infinite;
}
.MyContent  .AnimRetail img:nth-child(3){
	animation:AnimFadeInOut_3 ease-in-out 9s infinite;
}

@keyframes AnimFadeInOut_2{
	0%{
		opacity:0;
	}
	30%{
		opacity:0;
	}
	36%{
		opacity:1;
	}
	66%{
		opacity:1;
	}
	67%{
		opacity:0;
	}
	100%{
		opacity:0;
	}
}
@keyframes AnimFadeInOut_3{
	0%{
		opacity:0;
	}
	62%{
		opacity:0;
	}
	66%{
		opacity:1;
	}
	96%{
		opacity:1;
	}
	100%{
		opacity:0;
	}
}
.MyContent  .AnimRetail img:first-child{
	position:relative;
}

@media only screen and (max-width:1023px) and (min-width:768px) {
	.MyContent .MyBlock h2 br{
		display:none;
	}
} 