/*
Couleurs :
Rose : #E83966
Violet : #8B4192
Jaune : #FFDC13
Vert d'eau : #00A09A
Bleu : #005FAB
Vert : #00A06E
Gris foncé : #565656
Noir : #1C1C1B
*/

/*************** Général ***************/
#bw_overlay {
    position:fixed;
    top:0;
    bottom: 0;
    right:0;
    left:0;
    z-index:98;
    background:rgba(0, 0, 0, 0.5);
}
#bw_popup_niveau {
    position:fixed;
    top:150px;
    left:0;
    right:0;
    width:95%;
    max-width:900px;
    margin:0 auto;
    overflow:auto;
    background:#fff;
    padding:50px;
    -webkit-box-shadow: 0 0 15px 0 rgba(0,0,0,0.5);
    -moz-box-shadow: 0 0 15px 0 rgba(0,0,0,0.5);
    box-shadow: 0 0 15px 0 rgba(0,0,0,0.5);
    z-index:99;
    font-weight:bold;
}
#bw_popup_niveau #bw_close {
    position:absolute;
    top:20px;
    right:20px;
    color:#E83966;
    font-size:25px;
    cursor:pointer;
    width:20px;
}
#bw_popup_niveau .titre_popup{
    text-align:center;
    text-transform: uppercase;
    color:#E83966;
    font-size:25px;
    line-height: 29px;
}
#bw_popup_niveau .titre_popup::after,
#bw_popup_niveau #etape_0 .sous_titre_popup::after{
    content:'';
    display:block;
    width:100px;
    height:3px;
    background:#1C1C1B;
    margin:25px auto;
}
#bw_popup_niveau .sous_titre_popup{
    text-transform: uppercase;
    font-size:20px;
    line-height: 22px;
}

/************** ScrollBar **************/
.mCS-bw .mCSB_scrollTools .mCSB_draggerRail {
    width: 4px;
    background-color: rgba(0,0,0,.1);
}
.mCS-bw .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #E83966;
}

/*************** Etape 0 ***************/
#bw_popup_niveau #etape_0{
    text-align:center;
}
#bw_popup_niveau #etape_0 .titre_popup{
    margin-top:50px;
}
#bw_popup_niveau #etape_0 .titre_popup::after {
    display:none;
}
#bw_popup_niveau #etape_0 button {
    padding: 7px 25px;
    margin-top:25px;
}
#bw_popup_niveau #etape_0 #ne_plus_afficher {
    display:inline-block;
    color:#999;
    font-size:12px;
    margin-top:40px;
    cursor:pointer;
}

/*************** Etape 1 ***************/
#bw_popup_niveau #etape_1{
    display:none;
    text-align:center;
}
#bw_popup_niveau #etape_1 #liste_niveaux {
    margin:0 0 30px 0;
    height: 305px;
    overflow:auto;
}
#bw_popup_niveau #etape_1 #liste_niveaux ul {
    list-style: none;
    display:flex;
    padding:0;
    margin:0;
    flex-wrap: wrap;
}
#bw_popup_niveau #etape_1 #liste_niveaux li{
    list-style: none;
    margin:0;
    width:33%;
    padding:7px;
}
#bw_popup_niveau #etape_1 #liste_niveaux li label{
    display:block;
    width:100%;
    height:180px;
    font-size:16px;
    color:#fff;
    text-transform: uppercase;
    text-align: center;
    padding:80px 20px 50px 20px;
    cursor:pointer;
    opacity:1;
    position:relative;
}
#bw_popup_niveau #etape_1 #liste_niveaux li label input[type="radio"]{
    display:none;
    /*position: absolute;
    bottom:30px;
    right:50%;
    margin-right: -10px;*/
}
#bw_popup_niveau #etape_1 #liste_niveaux li label:hover {
    opacity:0.8;
    color:transparent;
}
#bw_popup_niveau #etape_1 #liste_niveaux li#niveau-0 label:hover {
    color:#fff;
}
#bw_popup_niveau #etape_1 #liste_niveaux li label .description {
    display:none;
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    padding: 15px;
    margin: 0;
    color: #fff;
    font-weight: normal;
    font-size: 12px;
    cursor: pointer;
    text-transform: none;
    transform: translateY(-50%);
}
#bw_popup_niveau #etape_1 #liste_niveaux li label:hover .description {
    display:block;
}

/*************** Etape 2 ***************/
#bw_popup_niveau #etape_2{
    display:none;
}

#bw_popup_niveau #etape_2 #form_infos .titre {
    color:#E83966;
}
#bw_popup_niveau #etape_2 #form_infos ul {
    list-style: none;
    font-weight: normal;
    margin:15px 0;
    padding:0;
}
#bw_popup_niveau #etape_2 #form_infos ul li {
    list-style: none;
    padding:5px 0;
}
#bw_popup_niveau #etape_2 #form_infos ul li label {
    cursor:pointer;
}
#bw_popup_niveau #etape_2 #form_infos input[type="text"] {
    border:none;
    border-bottom:2px solid #1C1C1B;
    padding:3px 0;
}

#bw_popup_niveau #etape_2 #button_2_retour {
    position: absolute;
    top: 20px;
    left: 20px;
    margin: 0;
    background:transparent;
    color:#E83966;
}
#bw_popup_niveau #etape_2 #button_2_retour img {
    display: inline-block;
    height: 20px;
    vertical-align: bottom;
    margin-right: 4px;
}

/*************** Etape 3 ***************/
#bw_popup_niveau #etape_3{
    display:none;
}