.popin-mask {
    position:absolute; z-index:1010;
    background:#070707;
}
.popin-loader {
    position:absolute; z-index:1011;
    padding:10px;
    background:#070707; color:#FFF;
}
.popin {
    position:absolute; z-index:1012;
    width:876px; min-height:566px;
    background:#FFF; color:#070707;
}

/* #popin-error */
#popin-error { width:468px; }
#popin-error .popin-header { border-bottom:1px solid #CCC; }

/* .popin-header */
.popin-header { position:relative; z-index:1; }
.popin-header .popin-close {
    position:absolute; top:17px; right:17px; z-index:1;
    overflow:hidden;
    margin:0; padding-top:27px;
    width:27px; height:0;
    background:url(http://yslexperience.com/img/common/popin-close.png) no-repeat;
}
.popin-header .popin-close:hover,
.popin-header .popin-close:focus { background-position:0 -27px; }

.popin-services {
    position:relative; left:50%;
    float:left;
    margin:0 auto;
}
.popin-services li {
    position:relative; right:50%;
    float:left;
    border-right:1px solid #E4E4E4;
}
li.popin-services-chance { border-left:1px solid #E4E4E4; }
li.popin-services-chance > a,
li.popin-services-share > a,
li.popin-services-selection > a {
    float:left;
    overflow:hidden;
    padding-top:85px;
    width:90px; height:0;
    background:url(http://yslexperience.com/img/common/pictos-popin.png) no-repeat;
}
li.popin-services-facebook { height:85px; }
li.popin-services-facebook > a,
li.popin-services-facebook .fb-like {
    float:left;
    margin:33px 20px 0;
}
 
li.popin-services-chance > a { background-position:0 0; }
li.popin-services-share > a { background-position:-92px 0; }
li.popin-services-selection > a { background-position:-183px 0; }
li.popin-services-chance > a:hover { background-position:0 -85px; }
li.popin-services-share > a:hover { background-position:-92px -85px; }
li.popin-services-selection > a:hover { background-position:-183px -85px; }

.popin-services-share-content {
    position:absolute; top:0; left:0; z-index:1;
    display:none;
    width:100%; height:120px;
    background:#FFF;
}
.popin-services-share-content ul {
    position:relative; left:50%;
    float:left;
    margin:45px auto 0;
}
.popin-services-share-content li:first-child { margin-right:15px; }
.popin-services-share-content li {
    position:relative; right:50%;
    float:left;
    border:none;
}
.popin-share-tumblr a {
    float:left;
    overflow:hidden;
    padding-top:20px;
    width:61px; height:0;
    background:url(../v1/share_2.png) no-repeat;
}

.popin-services-share-content-mask {
    position:absolute;
    top:0; left:0;
    width:100%; height:100%;
    background-color:#070707;
    opacity:0.6; filter:alpha(opacity=60);
}

/* .popin-scrolled */
.popin-scrolled .popin-header { padding-right:20px; }
.popin-scrolled .popin-close { right:37px; }
.popin-scrolled .popin-core { padding-top:40px; }
.popin-scrolled .scrollable {
    position:relative;
    overflow:hidden;
    height:440px;
}
.popin-scrolled .scrollable-content,
.popin-scrolled .scrollable-content-disabled {
    position:absolute; top:0; left:0;
    padding:1px 0; /* contain margins */
}
.popin-scrolled .scrollbar { position:absolute; top:0; right:0; }
.popin-scrolled .scrollbar-gutter {
    position:relative;
    width:20px; height:566px;
    background:#D5D5D5;
}
.popin-scrolled .scrollbar-face {
    position:absolute; top:0; left:0;
    overflow:hidden;
    width:20px;
    background:#070707;
}

/* .popin-core */
.popin-core { position:relative; }

/* #popin-editorial / #popin-slideshow */
#popin-slideshow { min-height:400px; }
#popin-editorial .popin-core,
#popin-slideshow .popin-core { color:#454545; }
#popin-editorial .scrollable-content,
#popin-editorial .scrollable-content-disabled,
#popin-slideshow .scrollable-content,
#popin-slideshow .scrollable-content-disabled {
    left:187px;
    width:482px;
}
#popin-editorial h1,
#popin-slideshow h1 { margin-bottom:40px; }
#popin-editorial h2,
#popin-editorial .question,
#popin-slideshow h2,
#popin-slideshow .question {
    margin:0 0 12px;
    color:#070707;
    font-family:YSLsansCDemi; font-size:18px;
    text-transform:uppercase;
    line-height:1.3;
}
#popin-editorial p,
#popin-slideshow p {
    margin:0 0 15px;
    font-family:DidotLTStdItalic; font-size:14px;
}
#popin-editorial a,
#popin-slideshow a { color:#070707; }
#popin-editorial a:hover,
#popin-editorial a:focus,
#popin-slideshow a:hover,
#popin-slideshow a:focus { text-decoration:none; }
#popin-editorial .slideshow,
#popin-slideshow .slideshow {
    padding:50px 197px;
    color:#999;
}
#popin-editorial .slideshow p,
#popin-slideshow .slideshow p { margin:0; }

/* #popin-product */
#popin-product .popin-core { padding:20px 155px 45px 100px; }
#popin-product .popin-core > img { float:left; }
#popin-product .content {
    float:right;
    margin-top:58px;
    width:272px;
}
#popin-product .popin-core p,
#popin-product .actions a {
    margin:0;
    color:#999;
    font-family:DidotLTStdItalic; font-size:14px;
    text-align:justify;
}
#popin-product .actions { margin-top:25px; }
#popin-product .actions a { float:right; }
#popin-product .actions a:hover,
#popin-product .actions a:focus { color:#070707; }
#popin-product .actions a:first-child {float:left;}
#popin-product .actions a.external {
    padding-left:20px;
    background:url(http://yslexperience.com/img/common/picto-external.png) no-repeat 0 0.429em;
}

/* #popin-video */
#popin-video-container {
    margin:0 auto;
    width:705px; height:388px;
    background:#070707 url(../img/common/popin-load-video.gif) no-repeat 50% 50%;
}

/* #popin-dispatch */
#popin-dispatch, .dispatch{
    width:750px; min-height:0;
    background:#FFF;
}
#popin-dispatch a, .dispatch a{
    color:#999;
    font-family:DidotLTStdItalic; font-size:14px;
}
#popin-dispatch a:hover, #popin-dispatch a:focus,
.dispatch a:hover, .dispatch a:focus {color:#070707;}

#popin-dispatch .popin-header, .dispatch .header{
    margin:0 50px 0;
    padding:40px 0 15px;
    border-bottom:1px solid #CCC;
}
#popin-dispatch .popin-header .popin-close{ right:-33px; }

#popin-dispatch h2, .dispatch h2{
    float:left;
    color:#070707;
    font-family:YSLsansCBold; font-size:20px;
    text-transform:uppercase;
}
#popin-dispatch h2 + a, .dispatch h2 + a{
    float:right;
    margin-top:7px;
}
#popin-dispatch .popin-core, .dispatch .content{
    margin:30px 50px 66px;
}
#popin-dispatch .section, .dispatch .section{
    float:left;
    margin-left:3%; padding-left:6%;
    width:18%; min-height:205px;
    border-left:1px dotted #070707;
}
#popin-dispatch .section:first-child,
.dispatch .section:first-child{
    margin-left:0; padding-left:0;
    border-left:none;
}
#popin-dispatch h3, .dispatch h3{
    margin:0 0 20px;
    color:#070707;
    font-family:YSLsansCDemi; font-size:13px;
    text-transform:uppercase;
    line-height:0.8;
}


/* =FAVORITES-LIBRARY
 -------------------------------------------------------------------- */
.popin-fav-lib {
    position:absolute; z-index:1013;
    padding:15px 50px 15px 30px;
    max-width:300px;
    background:#070707; color:#999;
    font-family:DidotLTStdItalic; font-size:14px;
}
.popin-fav-lib .popin-close {
    position:absolute; top:50%; right:10px;
    overflow:hidden;
    margin:-7px 0 0; padding-top:15px;
    width:15px; height:0;
    background:url(http://yslexperience.com/img/common/popin-fav-lib-close.png) no-repeat;
}
.popin-fav-lib .popin-close:hover,
.popin-fav-lib .popin-close:focus { background-position:0 -15px; }
.popin-fav-lib p { margin:0; }


/* =AUDIO
 -------------------------------------------------------------------- */
#popin-audio {
    width:240px; min-height:0;
    background-color:#070707;
}
#popin-audio .popin-header{height:55px;}
#popin-audio .popin-close { background-image:url(http://yslexperience.com/img/common/popin-close-white.png); }
#popin-audio .popin-core {
    padding-bottom:40px;
    text-align:center;
}
#popin-audio .popin-audio-infos {
    display:block;
    margin:10px 0;
    color:#FFF;
    font-family:DidotLTStdItalic; font-size:14px;
    line-height:1.3;
}
#popin-audio .popin-audio-infos span {
    display:block;
    font-family:YSLsansCDemi;
    text-transform:uppercase;
}
.popin-audio-player { height:91px; }


/* =TIPS
 -------------------------------------------------------------------- */
.popin-tips {
    position:fixed; top:90px; right:20px; z-index:1002;
    padding:25px 30px;
    max-width:200px;
    background:#070707; color:#999;
    font-family:DidotLTStdItalic; font-size:14px;
}


/* =INPAGEPOPINS
 -------------------------------------------------------------------- */
.inpage-popins { display:none; }


/* =TOOLTIP
 -------------------------------------------------------------------- */
.popin-tooltip {
    position:absolute; z-index:1020;
    padding:10px 15px;
    max-width:150px;
    text-align:center;
    background:#070707; color:#999;
    font-family:DidotLTStdItalic; font-size:13px;
}

/* =CLEARING
 -------------------------------------------------------------------- */
.dispatch,
.dispatch .header,
.dispatch .content,
.popin-core,
#popin-product .actions { overflow:hidden; }

.popin-header:after {
    display:block; clear:both;
    visibility:hidden;
    height:0;
    content:".";
}