

@font-face {
  font-family: 'OptimaDisplayBook';
  src: url('/media/boutiques/fonts/optimadisplay-book-webfont.eot');
  src: url('/media/boutiques/fonts/optimadisplay-book-webfont.eot?#iefix') format('embedded-opentype'),
  url('/media/boutiques/fonts/optimadisplay-book-webfont.woff') format('woff'),
  url('/media/boutiques/fonts/optimadisplay-book-webfont.ttf') format('truetype'),
  url('/media/boutiques/fonts/optimadisplay-book-webfont.svg#OptimaDisplayBook') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'OptimaDisplayLight';
  src: url('/media/boutiques/fonts/optimadisplay-light-webfont.eot');
  src: url('/media/boutiques/fonts/optimadisplay-light-webfont.eot?#iefix') format('embedded-opentype'),
  url('/media/boutiques/fonts/optimadisplay-light-webfont.woff') format('woff'),
  url('/media/boutiques/fonts/optimadisplay-light-webfont.ttf') format('truetype'),
  url('/media/boutiques/fonts/optimadisplay-light-webfont.svg#OptimaDisplayLight') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'OptimaDisplayUltraLight';
  src: url('/media/boutiques/fonts/optimadisplay-ultralight-webfont.eot');
  src: url('/media/boutiques/fonts/optimadisplay-ultralight-webfont.eot?#iefix') format('embedded-opentype'),
  url('/media/boutiques/fonts/optimadisplay-ultralight-webfont.woff') format('woff'),
  url('/media/boutiques/fonts/optimadisplay-ultralight-webfont.ttf') format('truetype'),
  url('/media/boutiques/fonts/optimadisplay-ultralight-webfont.svg#OptimaDisplayUltraLight') format('svg');
  font-weight: normal;
  font-style: normal;
}


@font-face {
  font-family: 'AkzidenzGroteskBQBOL';
  src: url('/media/boutiques/fonts/akzidenzgrotesk-bold-webfont.eot');
  src: url('/media/boutiques/fonts/akzidenzgrotesk-bold-webfont.eot?#iefix') format('embedded-opentype'),
  url('/media/boutiques/fonts/akzidenzgrotesk-bold-webfont.woff') format('woff'),
  url('/media/boutiques/fonts/akzidenzgrotesk-bold-webfont.ttf') format('truetype'),
  url('/media/boutiques/fonts/akzidenzgrotesk-bold-webfont.svg#Akzidenz') format('svg');
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: 'AkzidenzGrotesk';
  src: url('/media/boutiques/fonts/akzidenzgrotesk-regular-webfont.eot');
  src: url('/media/boutiques/fonts/akzidenzgrotesk-regular-webfont.eot?#iefix') format('embedded-opentype'),
  url('/media/boutiques/fonts/akzidenzgrotesk-regular-webfont.woff') format('woff'),
  url('/media/boutiques/fonts/akzidenzgrotesk-regular-webfont.ttf') format('truetype'),
  url('/media/boutiques/fonts/akzidenzgrotesk-regular-webfont.svg#Akzidenz') format('svg');
  font-weight: normal;
  font-style: normal;
}



@font-face {
  font-family: 'Conv_HelveticaNeueLight';
  src: url('/media/boutiques/fonts/HelveticaNeueLight.eot');
  src: url('/media/boutiques/fonts/HelveticaNeueLight.eot?#iefix') format('embedded-opentype'),
  url('/media/boutiques/fonts/HelveticaNeueLight.woff') format('woff'),
  url('/media/boutiques/fonts/HelveticaNeueLight.ttf') format('truetype'),
  url('/media/boutiques/fonts/HelveticaNeueLight.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Conv_HelveticaNeueBold';
  src: url('/media/boutiques/fonts/HelveticaNeueBold.eot');
  src: url('/media/boutiques/fonts/HelveticaNeueLight.eot?#iefix') format('embedded-opentype'),
  url('/media/boutiques/fonts/HelveticaNeueBold.woff') format('woff'),
  url('/media/boutiques/fonts/HelveticaNeueBold.ttf') format('truetype'),
  url('/media/boutiques/fonts/HelveticaNeueBold.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'HelveticaNeueLTStd-LtCn';
  src: url('/media/boutiques/fonts/HelveticaNeueLTStd-LtCn.eot');
  src: url('/media/boutiques/fonts/HelveticaNeueLTStd-LtCn.eot?#iefix') format('embedded-opentype'),
  url('/media/boutiques/fonts/HelveticaNeueLTStd-LtCn.woff') format('woff'),
  url('/media/boutiques/fonts/HelveticaNeueLTStd-LtCn.ttf') format('truetype'),
  url('/media/boutiques/fonts/HelveticaNeueLTStd-LtCn.svg#HelveticaNeueLTStd-LtCn') format('svg');
  font-weight: normal;
  font-style: normal;
}


/*******    TEMP local fontS   *****

@font-face{
  font-family: 'OptimaDisplayLight';
  src:url('../webfonts/optimadisplay-light-webfont-webfont.ttf');
  font-weight: normal;
  font-style: normal;
}
  
@font-face{
  font-family: 'AkzidenzGrotesk';
  src:url('../webfonts/AkzidenzGrotesk-Regular.otf');
  font-weight: normal;
  font-style: normal;
}
  
@font-face{
  font-family: 'AkzidenzGroteskBQBOL';
  src:url('../webfonts/AkzidenzGrotesk-Bold.otf');
  font-weight: normal;
  font-style: normal;
}

*/

body{

}
/* Header bar */
.page-header {
  background: #bc1b11;
}

.page-navigation a.level-1 {
  color: #ffffff;
}

.page-utilities__signin-text {
  color: #ffffff;
}

.page-utilities__cart-button {
  border-left: 1px solid #ffffff;
}

.page-utilities__search-button {
  border-left: 1px solid #ffffff;
}

.page-branding a.page-branding__logo {
  background: url('/media/boutiques/modern-muse-le-rouge/logo-white.png');
  background-size: 100%;
  background-repeat: no-repeat;
}

.page-utilities__cart-icon {
  background-image: url('/media/boutiques/modern-muse-le-rouge/bag-white.png');
}

.page-utilities__search-icon {
  background-image: url('/media/boutiques/modern-muse-le-rouge/search-white.png');
}

.page-navigation__menu_text {
  color: #ffffff;
}

.page-navigation__menu-icon {
  background-image: url('/media/boutiques/modern-muse-le-rouge/menu-white.png');
}

/* Header bar - End */

#toolbar div.toolbar-menu { /* red g-nav over-ride */
  background:#ae0f10 !important;
}

#le-rouge__spinner{
  position:fixed;
  width:100%;
  height:100%;
  top:0;
  left:0;
  text-align:center;
  background:white;
  z-index:100;
}
/*              generic styles          */ 

a.le-rouge__link{
  color: white;
  font-weight: 800;
  font-size: 97%;
  text-transform: uppercase;
  letter-spacing: 2.5px;
  text-decoration: none;
  /*border-bottom: 2px solid white;*/
  display: inline-block;
}
a.le-rouge__link:hover{
  opacity:0.7;
}

.le-rouge__section{     
  position:relative;
  margin:auto;
  width:100%;
  height:100%;
  min-width:768px;
  max-width:1366px;
  font-family: 'AkzidenzGrotesk';
  font-size:13.66px;
}
.le-rouge__header{
  font-family: 'OptimaDisplayLight';
  font-size: 682%;;
  color: black;
  letter-spacing: -2px;
  line-height: 90%;
  position: absolute;
  z-index: 3;

}
.le-rouge__sub-header{
  font-family: 'AkzidenzGrotesk';
  font-size: 111%;
  color: black;
  text-transform: uppercase;
  position: absolute;
  z-index: 3;
  letter-spacing: 3px;
  line-height: 150%;
}
.le-rouge__quick-shop{
  font-family: 'AkzidenzGroteskBQBOL';
  font-size:12px;
  letter-spacing: 2px;
  color:black;
  padding:8px 18px;
  border:1px solid #A0A0A0;
  text-transform:uppercase;
  text-decoration:none;
  position:absolute;
}
.le-rouge__quick-shop:hover{
  color:white;
  background:#bc1b11;
  border:1px solid #bc1b11;
}


.le-rouge__link p {
  -webkit-margin-before: 0;
  border-bottom: 2px solid white;
}

/*              section 1  - top        */ 

#le-rouge__top{
  position:relative;
  top:0;
  left:0;
  width:100%;
  min-width:768px;
  max-width:1366px;
  font-family: 'AkzidenzGrotesk';
  color:white;   
}

#le-rouge__top-bg{
  width:100%;
}

.le-rouge__top-pos{
  position: absolute;
  text-align: center;
  width: 52%;
  right: 0%;
}
#le-rouge__top-sur-title{
  top: 9%;
  font-size: 147%;
  text-transform: uppercase;
  letter-spacing: 10.5px;
  opacity: 0;
}
#le-rouge__top-title{
  top: 14%;
  font-size: 754%;
  line-height: 100%;
  text-transform: uppercase;
  letter-spacing: 25px;
  opacity: 0;
}
#le-rouge__top-sub-title{
  top: 40%;
  font-size: 364%;
  text-transform: uppercase;
  letter-spacing: 25px;
  opacity: 0;
}
#le-rouge__top-tag-line{
  top: 51%;
  font-size: 170%;
  text-transform: uppercase;
  letter-spacing: 7.5px;
  opacity: 0;
}

#le-rouge__top-play-video{
  position: absolute;
  top: 66%;
  right: 22.1%;
  font-size: 105%;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  text-align: center;
  color: #FFF;
  width: 12%;
  opacity:0;
}
#le-rouge__top-video-link img{
  width:73%;
  margin-bottom: 12%;
}
#le-rouge__top-play-video a span {
  display: inline-block;
  -webkit-margin-before: 0;
  border-bottom: 2px solid white;
  letter-spacing: 2px;
}

.le-rouge__link .le-rouge__hover-link {
  top: 43%;
}


/*                TOP VIDEO                */

#le-rouge__top-video{
  display:none;
  position:fixed;
  top:0px;
  left:0;
  width:100%;
  height:100%;
  z-index:1000;
  text-align: center;
}
.le-rouge__video-bg{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:black;
  opacity:1;
}
.le-rouge__video-fg{
  margin: auto;
  position: absolute;
  width: 100%;
  height: 100%;
  right: 0;
  top:0px;
  left: 0;
  min-width: 1024px;
}
.le-rouge__close-x{
  font-size: 45px;
  font-family: 'OptimaDisplayLight';
  color: white;
  position: absolute;
  width: 55px;
  top: 0%;
  right: 0;
  line-height: 50px;
  text-align: center;
  cursor:pointer;
  z-index: 100;
}
.le-rouge__close-x img{
  vertical-align:inherit;
}
.le-rouge__close-x:hover{
  opacity:0.6;
}
#le-rouge__video-container{
  margin:auto;
  width: 100%;
  height: 88%;
  margin-top: 36px;
}
.le-rouge__video-container iframe{
  height: 87%;
  width: 95%;
}

#le-rouge__top-video-link:hover{
  opacity: 0.7;
}

#player{/* loaded youtube player div in iframe */
  outline:none;
}


.le-rouge__controls-mask{
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
}

.le-rouge__controls {
  position: absolute;
  top: 80%;
  left: 6%;
  right:6%;
  margin:auto;
  width: 86.4%;
  height: 20px;
  padding-top: 20px;
  max-width: 1124px;
}
.le-rouge__button {
  background: transparent no-repeat left top;
  display: inline-block;
  cursor: pointer;
  border: 0px;
  display: inline-block;
  vertical-align: middle;
  padding: 0;
  text-transform: uppercase;
  text-decoration: none;
  text-align: center;
  border-radius: 0;
}
.le-rouge__full_btn {
  background-image: url(/media/boutiques/envy-shine/images/button_full-screen.png);
  margin-top: 20px;
  width: 25px;
  height: 25px;
  margin-left: 30px;
}

.le-rouge__play_btn {
  margin-top: 6px;
  width: 25px;
  height: 25px;
  background-image: url(/media/boutiques/envy-shine/images/button_play.png);
  background-position: 50% 50%;

}
.le-rouge__play_btn.active {
  background-image: url(/media/boutiques/envy-shine/images//button_pause.png);
}

.le-rouge__scrubber {
  margin-top: 12px;
  height: 1px;
  border-top: 1px solid #fff;
  border-top: 1px solid rgba(255, 255, 255, .25);
  width: 90%;
  display: inline-block;
}

.le-rouge__inner_scrubber {
  width: 0px;
  height: 1px;
  opacity: 1;
  background-color: #FFF;
}

#le-rouge__video-container iframe {
  display:none;
  width: 100%;
  height: 98%;
  max-width:1280px;
  margin: auto;
  margin-top: 45px;
}

/*              section 2  - video links        */ 

#le-rouge__videos-section{
 text-align:center;
}
#le-rouge__videos-header{
  font-family: 'AkzidenzGroteskBQBOL';
  font-size:18px;
  text-transform:uppercase;
  color:#c01a14;
  margin:15px 0;
  letter-spacing:3px;
}
#le-rouge__video-links > img{
  width:100%;
}

#le-rouge__video-links > div{
  opacity: 0;
}

.le-rouge__video-hover{
  display:none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 87%;
  background: #9f0000;
  z-index: 2;
  opacity: 0.2;
}
#le-rouge__video-links .le-rouge__link-video > img{
  width:100%;
}
.le-rouge__link.le-rouge__hover-link span{
  display: block;
  -webkit-margin-before: 0;
  border-bottom: 2px solid white;
  margin-top: 3%;
  font-size: 106%;
  line-height: 93%;
  margin-left: -1px;
}
#le-rouge__your-look-5-link span{
 display: block;
 -webkit-margin-before: 0;
 border-bottom: 2px solid white;
 margin-top: 3%;
 font-size: 100%;
 line-height: 91%;
 margin-left: 1px;
}
#le-rouge__your-look-1 span{
  display: block;
  -webkit-margin-before: 0;
  border-bottom: 2px solid white;
  margin-top: 3%;
  font-size: 100%;
  line-height: 93%;
  margin-left: -1px;
}
a.le-rouge__hover-link{
  display: none;
  position: absolute;
  bottom: 16%;
  left: 8%;
  z-index: 3;
  text-align: left;
  font-size: 65%;
}
a.le-rouge__hover-link img{
  width: 30.5%;
  margin-bottom: 6%;
}
#le-rouge__video-links a.le-rouge__hover-link:hover{
  opacity:1;
}
.le-rouge__link-video:hover .le-rouge__video-hover,
.le-rouge__link-video:hover .le-rouge__hover-link{
  display:block;
}
#le-rouge__video-links .le-rouge__link-video{
  display:inline-block;
  position: relative;
  width: 18.4%;
  box-sizing: border-box;
  margin-right: 1.5%;
  font-size:140%;
  letter-spacing:1px;
  cursor:pointer;
}
#le-rouge__video-links .le-rouge__link-video:last-child{
  margin-right:0;
}

/*              section 3 - perfume         */ 

#le-rouge__perfume{
  margin-top: 80px;
}
#le-rouge__perfume-header{
  width: 30%;
  left: 8.5%;
  top: 25.2%;
  line-height: 98%;
  font-size: 621%;
}
#le-rouge__perfume-sub-header{
  width: 21%;
  top: 58.2%;
  left: 9%;
}

#le-rouge__perfume-swap-container{
  width:65.74%;
  position:relative;
  top:0px;
  margin-left: 32%;
}

#le-rouge__perfume-scroll-trigger{
  position:absolute;
  top:150px;
  left:0px;
}
#le-rouge__perfume-swap-1 {
  height: 100%;
  position:absolute;
  left:0px;
  z-index:2;
  overflow:hidden;
} 
.le-rouge__perfume-img{
  width:100%;
}
#le-rouge__perfume-quick-shop{
  top: 78.3%;
  left: 9%;
}

/*              section 4  - what's your look        */ 
.le-rouge__your-look{
  position:relative;
  cursor:pointer;
}
.le-rouge__your-look-txt-container{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin-top: 500%; 
}
.le-rouge__your-look .le-rouge__quick-shop{
  color:black;
  background:white;
  border:1px solid white;
  display:none;
}
.le-rouge__your-look:hover .le-rouge__quick-shop{
  z-index:2;
  display:block;
}
.le-rouge__your-look .le-rouge__quick-shop:hover{
  color:white;
  background:black;
}
img.le-rouge__your-look-default{
 transition: opacity .25s ease-in-out;
 position:relative;
 z-index:2;
}
.le-rouge__your-look:hover .le-rouge__your-look-default{
  opacity:0;
}
.le-rouge__your-look img.le-rouge__your-look-hover{
  /*  display:none;*/
  position:absolute;
  top:0;
  left:0;
}
.le-rouge__your-look div.le-rouge__your-look-hover{
 display:none;
}
.le-rouge__your-look:hover .le-rouge__your-look-hover{
  display:block;
}
.le-rouge__your-look > img{
  width:100%;
}

#le-rouge__your-look-title {
  margin-top: 14%;
  position: relative;
  padding-left: 69%;
  font-family: 'AkzidenzGroteskBQBOL';
  font-size:130%;
  text-transform:uppercase;
  color:#c01a14;
  letter-spacing:3px;
  width:100%;
}
#le-rouge__your-look-1{
  width: 56%;
  margin-left: 4%;
  margin-top:7%;
  cursor: default;
}
#le-rouge__your-look-1-link{
  position: absolute;
  left: 4%;
  bottom: 9%;
  top: 83%;
  z-index: 3;
}
#le-rouge__your-look-1-txt{
 position: absolute;
 top: 101.7%;
 left: 3.7%;
 font-size: 118%;
}

#le-rouge__your-look-1-link img {
  width: 26%;
  margin-bottom: 4.5%;
}
#le-rouge__your-look-1-swap-1 img{
  width: 100%;
  height: 100%;
}
#le-rouge__your-look-1-swap-2 img{
  width: 100%;
  height: 100%;
}
#le-rouge__your-look-2{
  width: 32%;
  margin-top: -21%;
  margin-left: 66%;
}
#le-rouge__your-look-2-sur-header{
  position: absolute;
  top: 20%;
  left: 8.5%;
  font-family: 'AkzidenzGroteskBQBOL';
  font-size: 130%;
  text-transform: uppercase;
  color: #c01a14;
  letter-spacing: 3px;  
}
#le-rouge__your-look-2-header{
  top: 26.5%;
  color: black;
  left: 7%;
  letter-spacing: -6px;
}
.le-rouge__your-look:hover #le-rouge__your-look-2-header{
  color:white;
}
#le-rouge__your-look-2-sub-header{
  color: white;
  top: 56%;
  text-transform: none;
  font-family: 'AkzidenzGrotesk';
  letter-spacing: 1px;
  font-size: 117%;
  left: 9%;
  width: 70%;
}
#le-rouge__your-look-2-quick-shop{
  top: 68%;
  left: 9%;
}

#le-rouge__your-look-3{
  width: 31.48%;;
  margin-top: -13%;
  margin-left: 10%;                 
}
#le-rouge__your-look-3-sur-header{
  font-size: 119%;
  color: white;
  top: 25%;
  left: 8%;
  font-family: 'AkzidenzGroteskBQBOL';
  font-size: 130%;
  text-transform: uppercase;
  letter-spacing: 3px;
}
#le-rouge__your-look-3-header{
  font-size: 579%;
  width: 103%;
  top: 32%;
  color: white;
  left: -1%;
}
#le-rouge__your-look-3-sub-header{
  top: 61%;
  color: white;
  left: 9%;
  text-transform: none;
  letter-spacing: 1px;
  font-size: 131%;
}
#le-rouge__your-look-3-quick-shop{
  top: 68%;
  left: 9%;
}
#le-rouge__your-look-4{
  width: 31.41%;
  margin-top: -21%;
  margin-left: 54%;
}
#le-rouge__your-look-4-header{
  width: 160%;
  font-size: 617%;
  left: -15%;
  top: 92%;
  letter-spacing: -5px;  
}
#le-rouge__your-look-4-sur-header{
  top:85%;
  left:-13.7%;
  font-family: 'AkzidenzGroteskBQBOL';
  font-size: 130%;
  text-transform: uppercase;
  letter-spacing: 3px;
}
.le-rouge__your-look:hover #le-rouge__your-look-4-sur-header{
  /*display:block;
  visibility:hidden;*/
}
#le-rouge__your-look-4-sub-header{
  color: white;
  top: 65%;
  text-transform: none;
  font-family: 'AkzidenzGrotesk';
  letter-spacing: 1px;
  font-size: 124%;
  left: 6%;
  width: 81%;
}
#le-rouge__your-look-4-quick-shop{
  top: 74%;
  left: 6%;
}

#le-rouge__your-look-5{
  width: 31%;
  margin-top: -12%;
  margin-left: 6%;
}

#le-rouge__your-look-5-txt{
  position: absolute;
  top: 102.5%;
  left: 6.7%;
  font-size: 118%;
}
#le-rouge__your-look-5-link{
  position: absolute;
  left: 6.8%;
  bottom: 9%;
  top: 72.9%;
  z-index: 3;
}
#le-rouge__your-look-5-link p{
  margin-top:5%;
}

#le-rouge__your-look-5-link img{
  width: 30.5%;
  margin-bottom: 4.5%;
}



/*              section 5  - product carouseL       */ 


.mpp__header.off {
  text-align: center;
  margin-top: 97px;
  position: relative;
  font-size: 810%;
  color: black;
  letter-spacing: -6.6px;
  line-height: 90%;
  z-index: 3;
}

.mpp__product-grid {
  margin-top: -30px;
}

.mpp__product-sort-container {
  display: none;
}




#le-rouge__prod-carousel{
  margin-top: 50px;
}

#le-rouge__prod-carousel-header{
  text-align: center;
  margin-top: 97px;
  position: relative;
  font-size: 950%;
}
#le-rouge__prod-carousel-products{
  text-align:center;
  margin-top:-35px;
}

#le-rouge__your-look-5-swap-1 {
  height: 100%;
  position:absolute;
  left:0px;
  z-index:2;
  overflow:hidden;
} 

#le-rouge__your-look-1-swap-1 {
  height: 100%;
  position:absolute;
  left:0px;
  z-index:2;
  overflow:hidden;
}

/*              SOCIAL FEED                    */

#le-rouge__social-sur-header{
  text-align: center;
  font-family: 'AkzidenzGroteskBQBOL';
  font-size: 18px;
  text-transform: uppercase;
  color: black;
  margin: 15px 0;
  letter-spacing: 3px;
  margin-top: 97px;
}
#le-rouge__social-header{
  font-family: 'OptimaDisplayLight';
  text-align: center;
  position: relative;
  font-size: 950%;
}

/* Watch Video Link */
#le-rouge__your-look-1-link p {
  -webkit-margin-before: 0;
  margin-top: 5%;
}   


/*              MEDIA QUERIES       */ 

@media screen and (max-width: 960px) and (min-width: 601px) {
  /* Be Noticed header for iPad */
  .mpp__header.off {
    font-size: 75px;
    letter-spacing: normal;
  }
  .le-rouge__video-fg {
   min-width: 0;
 } 
}


@media only screen and (max-width: 1350px) {

  #le-rouge__top-bg{

  }

}


@media only screen and (max-width: 1250px) {

  #le-rouge__top-bg{

  }
  .le-rouge__section{
  }

}
@media only screen and (max-width: 1150px) {

  #le-rouge__top-bg{

  }

}

@media only screen and (max-width: 1024px) {

  #le-rouge__top-bg{

  }

}