﻿/************* Bug Resolve *************/
.cyb-configurateur__midconfig {
    width: 100%;
    display: flex;
    flex-direction: column;
    height: auto;
    background: #1a1a1a;
    padding: 40px 0
}

.carac-gaming-courte .carac-gaming {
    position: initial;
}

.configurateur .carac-gaming {
    width: 100% !important;
}

.cyb-configurateur__midconfig__container {
    width: 1400px;
    margin: auto;
}

.cyb-configurateur__midconfig__container__title {
    width: 1000px;
    margin: auto;
    display: flex;
    line-height: 1.3;
}

    .cyb-configurateur__midconfig__container__title h2 {
        color: var(--blanc);
        font-weight: var(--semibold);
        text-align: center;
        font-size: var(--size_h3);
        transition: 0.3s;
        margin: auto;
        text-transform: uppercase;
        margin-bottom: var(--val_30);
    }

.configurateur__midconfig__container__title h2:hover {
    opacity: 0.9;
}

.cyb-configurateur__midconfig__container__configs {
    display: flex;
    gap: var(--val_40);
    flex-direction: row;
    justify-content: space-around;
}

    .cyb-configurateur__midconfig__container__configs article {
        width: 32%;
        padding: var(--val_20);
        border: 1px solid #5b5b5b;
        display: flex;
        flex-direction: row;
        justify-content: center;
        cursor: pointer;
        position: relative;
    }

        .cyb-configurateur__midconfig__container__configs article:hover {
            border: 1px solid yellow;
            cursor: pointer;
        }

            .cyb-configurateur__midconfig__container__configs article:hover img {
                transform: scale(1.1);
            }

        .cyb-configurateur__midconfig__container__configs article div {
            width: 50%;
            display: flex;
        }

            .cyb-configurateur__midconfig__container__configs article div img {
                width: 100%;
                margin: auto;
                transition: 0.3s;
            }

        .cyb-configurateur__midconfig__container__configs article ul {
            width: 50%;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }

            .cyb-configurateur__midconfig__container__configs article ul li {
                width: 100% !important;
                padding-left: 20% !important;
            }

            .cyb-configurateur__midconfig__container__configs article ul .proc1 {
                background: url("https://www.cybertek.fr/images/img-gamer/proc.svg");
                filter: brightness(0) saturate(100%) invert(100%) sepia(7%) saturate(2%) hue-rotate(6deg) brightness(115%) contrast(100%);
                background-repeat: no-repeat;
                background-size: 22px;
                background-position: left center;
            }

            .cyb-configurateur__midconfig__container__configs article ul .ram1 {
                background: url("https://www.cybertek.fr/images/img-gamer/ram.svg");
                filter: brightness(0) saturate(100%) invert(100%) sepia(7%) saturate(2%) hue-rotate(6deg) brightness(115%) contrast(100%);
                background-repeat: no-repeat;
                background-size: 22px;
                background-position: left center;
            }

            .cyb-configurateur__midconfig__container__configs article ul .ssd1 {
                background: url("https://www.cybertek.fr/images/img-gamer/ssd.svg");
                filter: brightness(0) saturate(100%) invert(100%) sepia(7%) saturate(2%) hue-rotate(6deg) brightness(115%) contrast(100%);
                background-repeat: no-repeat;
                background-size: 22px;
                background-position: left center;
            }

            .cyb-configurateur__midconfig__container__configs article ul .cg1 {
                background: url("https://www.cybertek.fr/images/img-gamer/carte-graphique.svg");
                filter: brightness(0) saturate(100%) invert(100%) sepia(7%) saturate(2%) hue-rotate(6deg) brightness(115%) contrast(100%);
                background-repeat: no-repeat;
                background-size: 22px;
                background-position: left center;
            }

            .cyb-configurateur__midconfig__container__configs article ul .windows1 {
                background: url("https://www.cybertek.fr/images/img-gamer/windows.svg");
                filter: brightness(0) saturate(100%) invert(100%) sepia(7%) saturate(2%) hue-rotate(6deg) brightness(115%) contrast(100%);
                background-repeat: no-repeat;
                background-size: 22px;
                background-position: left center;
            }

            .cyb-configurateur__midconfig__container__configs article ul .wifi1 {
                background: url("https://www.cybertek.fr/images/img-gamer/wifi.svg");
                filter: brightness(0) saturate(100%) invert(100%) sepia(7%) saturate(2%) hue-rotate(6deg) brightness(115%) contrast(100%);
                background-repeat: no-repeat;
                background-size: 22px;
                background-position: left center;
            }

            .cyb-configurateur__midconfig__container__configs article ul .watercooling1 {
                background: url("https://www.cybertek.fr/images/img-gamer/watercooling.svg");
                filter: brightness(0) saturate(100%) invert(100%) sepia(7%) saturate(2%) hue-rotate(6deg) brightness(115%) contrast(100%);
                background-repeat: no-repeat;
                background-size: 22px;
                background-position: left center;
            }

.image-config-gamer-pc {
    display: flex;
}

    .image-config-gamer-pc * {
        margin: auto;
    }

.carac-gaming-courte h2 h3 {
    color: var(--blanc);
    font-size: 0.8vw;
    font-family: 'Montserrat';
    text-transform: uppercase;
    font-weight: var(--semibold);
    width: 100%;
}

.carac-gaming-courte .prix {
    color: var(--blanc);
    font-size: 0.8vw;
    text-transform: uppercase;
    font-weight: var(--semibold);
    width: 100%;
    font-size: 0.8vw;
    margin-top: var(--val_10);
}

@media screen and (max-width: 1460px) {
    .cyb-configurateur__midconfig__container {
        width: 1100px;
    }

    .cyb-configurateur__midconfig__container__title {
        width: 600px;
    }
}

@media screen and (max-width: 1160px) {
    .cyb-configurateur__midconfig__container {
        width: calc(100% - 60px)
    }

    .cyb-configurateur__midconfig__container__configs article {
        padding: 40px 15px;
    }
}

@media screen and (max-width: 960px) {
    .cyb-configurateur__midconfig__container__configs {
        flex-wrap: wrap;
    }

        .cyb-configurateur__midconfig__container__configs article {
            padding: var(--val_20);
            width: 45%;
        }

            .cyb-configurateur__midconfig__container__configs article img {
                margin-top: auto !important;
                margin-bottom: auto !important;
            }

            .cyb-configurateur__midconfig__container__configs article ul {
                justify-content: space-evenly;
                width: 40%;
            }

    .image-config-gamer-pc {
        width: 60% !important;
    }
}

@media screen and (max-width: 768px) {
    .cyb-configurateur__midconfig__container__configs article {
        width: 400px;
    }

    .cyb-configurateur__midconfig__container__title {
        width: 400px;
    }

    .configurateur .carac-gaming-courte li {
        font-size: 13px !important;
    }
}

@media screen and (max-width: 480px) {
    .cyb-configurateur__midconfig__container__configs article {
        width: 100%;
    }

    .cyb-configurateur__midconfig__container__title {
        width: calc(100% - 40px);
    }

    .cyb-configurateur__midconfig__container__configs article ul {
        justify-content: center;
    }
}

@media screen and (max-width: 410px) {
    .cyb-configurateur__midconfig__container__configs article {
        flex-direction: column;
    }

    .image-config-gamer-pc {
        width: 90% !important;
        margin: auto !important
    }

    .cyb-configurateur__midconfig__container__configs article ul {
        width: 70%;
        margin: auto;
        margin-top: 10px
    }

    .configurateur .carac-gaming-courte li {
        font-size: var(--size_p);
    }
}
/***************************************/
/* FONTS */
@font-face {
    font-family: "Eraser";
    src: url(../fonts/Eraser.woff);
}

.config-content {
    width: 890px;
    float: left;
}

.recap-conf {
    width: 370px;
    float: right;
    position: relative;
}

.choix-bureau .relative-bureau-2 .bureau-conf.anim7 {
    height: auto;
    width: 0;
}


.head-config img {
    width: 50px;
}

.recap-conf.masquer-recap .recap-produit-conf {
    display: none;
}

.recap-conf.masquer-recap:hover .recap-produit-conf {
    display: block;
}


.datatoto10 img {
    width: 100%;
    object-fit: contain;
}

.cbk_configurateur__title {
    padding: 40px var(--marg_0_20);
    color: var(--noir);
    text-transform: uppercase;
    font-size: var(--size_h1);
    font-weight: 900;
    text-align: center;
}

.cbk_configurateur__subtitle {
    font-size: var(--size_h4);
    font-weight: var(--medium);
    text-align: center;
}



.txt-fil-config {
    color: var(--noir);
    font-family: 'Outfit', sans-serif;
    font-size: var(--size_p);
    text-transform: uppercase;
    position: relative;
    line-height: var(--val_25);
}

.recap-conf .txt-fil-config {
    height: auto;
}

.txt-fil-config span {
    text-transform: uppercase;
}

.chiffre-fil {
    font-family: "DINPro-Bold";
    color: var(--jaune);
    float: left;
    font-size: var(--size_h1);
    margin-top: 0;
    line-height: 38px;
    margin-left: var(--val_10);
}

.recap-conf .content-fil-config {
    background: var(--noir);
}

.recap-conf.masquer-recap .content-fil-config {
    background: black url(../landing-pages/images/configurateur/filte-fleche-w.png) no-repeat 72% center;
}

.img-fil-config {
    background: var(--jaune);
    float: left;
    margin: 0 6px 0 2px;
    padding: 0 5px;
    line-height: 38px;
}

.fil-ariane-config li {
}

.img-fil-config img {
    vertical-align: middle;
    max-height: var(--val_30);
    max-width: 26px;
}

.fil-ariane-config ul {
    position: relative;
    background: var(--blanc);
    border: 1px solid var(--noir);
    box-sizing: border-box;
    overflow: hidden;
    border-radius: 0;
}

    .fil-ariane-config ul::before {
        position: absolute;
        width: 90%;
        height: 3px;
        background: #a9a9a9;
        display: block;
        right: 0px;
        content: "";
        z-index: 1;
    }

.fil-ariane-config li {
    text-align: center;
    width: 25%;
    font-weight: var(--semibold);
    float: left;
    position: relative;
}

    .fil-ariane-config li:hover .chiffre-fil {
        color: var(--bleu);
    }

    .fil-ariane-config li::after {
        content: '';
        display: block;
        left: 100%;
        position: absolute;
        background: url(/images_produits/cybertek/configurateur/sep-noir-fil-2.png) no-repeat center;
        width: var(--val_5);
        height: var(--val_25);
        top: 0;
        z-index: 1;
    }

    .fil-ariane-config li:first-child:after {
        background: url(/images_produits/cybertek/configurateur/sep-noir-fil-3.png) no-repeat center;
        transform: translateX(-50%);
    }

.ajout-conf {
    font-size: var(--size_p);
}

.modif-conf {
    font-size: var(--size_p);
}

.fil-ariane-config li:first-child {
    background: var(--noir);
}

.fil-ariane-config li:nth-child(2) {
    background: var(--noir);
}

    .fil-ariane-config li:nth-child(2) .txt-fil-config {
        color: var(--blanc);
    }

.fil-ariane-config li:first-child .txt-fil-config {
    color: var(--blanc);
}

.fil-ariane-config li:nth-child(2)::after {
    background: url(/images_produits/cybertek/configurateur/sep-noir-fil.png) no-repeat center;
}

.options .fil-ariane-config li:nth-child(3) .txt-fil-config {
    color: var(--blanc);
}

.options .fil-ariane-config li:nth-child(3) {
    background: var(--noir);
}

.recap-configurateur .fil-ariane-config {
    margin-top: 0;
}

    .recap-configurateur .fil-ariane-config li:nth-child(4) {
        background: var(--noir);
    }

        .recap-configurateur .fil-ariane-config li:nth-child(4) .txt-fil-config {
            color: var(--blanc);
        }

.recap-configurateur.options .fil-ariane-config li:nth-child(3)::after {
    background: url(/images_produits/cybertek/configurateur/sep-noir-fil-3.png) no-repeat center;
}

.options .fil-ariane-config li:nth-child(3)::after {
    background: url(/images_produits/cybertek/configurateur/sep-noir-fil.png) no-repeat center;
}

.options .fil-ariane-config li:nth-child(2):after {
    background: url(/images_produits/cybertek/configurateur/sep-noir-fil-3.png) no-repeat center;
}


.p1-config ul .img-fil-config {
    background: #a9a9a9;
}


.p1-config ul li:hover .chiffre-fil {
    color: var(--bleu);
}

.p1-config ul li:hover .img-fil-config {
    background: var(--bleu);
}

.config-all li:hover .img-fil-config {
    background: var(--bleu);
}

.p1-config ul .chiffre-fil {
    color: #a9a9a9;
}

.fil-ariane-config li.recap-conf :hover .chiffre-fil {
    background: var(--noir);
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal {
    z-index: 6;
}

.mCSB_scrollTools .mCSB_buttonDown, .mCSB_scrollTools .mCSB_buttonLeft, .mCSB_scrollTools .mCSB_buttonRight, .mCSB_scrollTools .mCSB_buttonUp {
    opacity: .7;
}

    .mCSB_scrollTools .mCSB_buttonDown:hover, .mCSB_scrollTools .mCSB_buttonLeft:hover, .mCSB_scrollTools .mCSB_buttonRight:hover, .mCSB_scrollTools .mCSB_buttonUp:hover {
        opacity: 1;
    }

.config-all ul li:last-child:hover .img-fil-config {
    background: var(--jaune);
}

.config-all.options li:nth-child(2) .chiffre-fil {
    color: var(--bleu);
}

.config-all.options li:nth-child(2) .img-fil-config {
    background: var(--bleu);
}

.config-all.options.recap-configurateur li:nth-child(3) .chiffre-fil {
    color: var(--bleu);
}

.config-all.options.recap-configurateur li:nth-child(3) .img-fil-config {
    background: var(--bleu);
}

.p1-config ul li:first-child .img-fil-config {
    background: var(--jaune);
}

.p1-config ul li:first-child .chiffre-fil {
    color: var(--jaune);
}

.p1-config ul li:nth-child(5) .img-fil-config {
    background: none;
}

.fil-ariane-config li:nth-child(2) .content-fil-config {
}

.fil-ariane-config li:nth-child(3) .content-fil-config {
}

.fil-ariane-config li:nth-child(4) .content-fil-config {
}

.config-avance-bureau .fil-ariane-config ul::before {
    display: none !important;
}

.config-avance-bureau .fil-ariane-config ul::after {
    display: none !important;
}

.fil-ariane-config {
    margin-top: var(--val_15);
}

.txt-option-config {
    margin: 0 auto;
    text-align: left;
}

    .txt-option-config p {
        font-size: var(--size_p);
        text-align: justify;
        text-align-last: left;
        font-family: 'Outfit', sans-serif;
        color: var(--noir);
        line-height: 14px;
        font-weight: var(--medium);
    }

.choix-bureau-game .txt-option-config .titre-config {
    color: var(--noir);
    font-size: 16px;
    text-transform: uppercase;
    margin-bottom: var(--val_10);
    border-bottom: 1px solid var(--noir);
    display: inline-block;
    padding-bottom: var(--val_5);
    margin-top: 0px;
    line-height: 18px;
    border-top: none;
    text-align-last: left;
}

.txt-option-config .titre-config {
    color: var(--bleu);
    font-size: var(--size_h4);
    text-transform: uppercase;
    margin-bottom: var(--val_10);
    border-top: 2px solid var(--bleu);
    display: inline-block;
    padding-top: var(--val_5);
    margin-top: var(--val_10);
    line-height: 18px;
}

.choix-bureau-game li {
    display: inline-block;
    width: 410px;
    position: relative;
    cursor: pointer;
}

.choix-du-config1 .global-bt {
    position: absolute;
    height: 0%;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    width: 100%;
    z-index: 10;
    overflow: hidden;
    transition: all 0.5s;
}

.hexagon-home:hover .global-bt {
    height: 100%;
}

    .hexagon-home:hover .global-bt a div {
        opacity: 1;
    }

.hexagon-home .global-bt a div {
    opacity: 0;
    transition: all 1.5s;
}

.choix-du-config1 .global-bt a:first-child {
    background: rgba(255,255,255,0.8);
    color: var(--noir);
    font-size: 28px;
    font-weight: var(--semibold);
    line-height: 50%;
    display: block;
    height: 50%;
    position: relative;
    width: 100%;
    text-transform: uppercase;
    transition: all 0.5s;
}

    .choix-du-config1 .global-bt a:first-child:hover {
        background: rgba(255,255,255,1);
    }


    .choix-du-config1 .global-bt a:first-child div {
        color: var(--noir);
    }

.choix-du-config1 .global-bt a div {
    text-transform: uppercase;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 100%;
    z-index: 11;
}

.choix-du-config1 .global-bt a:last-child:hover {
    background: rgba(0,0,0,1);
}

.choix-du-config1 .global-bt a:last-child {
    background: rgba(0,0,0,0.8);
    font-size: 28px;
    font-weight: var(--semibold);
    display: block;
    line-height: 50%;
    height: 50%;
    position: relative;
    width: 100%;
    text-transform: uppercase;
    transition: all 0.5s;
}

    .choix-du-config1 .global-bt a:last-child div {
        color: var(--blanc);
    }

.choix-du-config1 {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--val_20);
    text-align: center;
}

.choix-bureau-game .sep-home {
    display: block;
    height: var(--val_15);
    width: var(--val_15);
    background: var(--gris_200);
    position: absolute;
    top: 50%;
    transform: rotate(-45deg);
}

.choix-bureau-game .sep-home-li {
    width: var(--val_15);
    cursor: default;
}

.choix-bureau-game {
    padding: 40px 0;
}

    .choix-bureau-game .sep1 {
        position: absolute;
        left: 31%;
    }

    .choix-bureau-game .sep2 {
        position: absolute;
        left: 68%;
    }

.hexagon-home .contenu h2 {
    color: var(--noir);
    font-size: 28px;
    text-transform: uppercase;
    line-height: var(--val_25);
    font-weight: 900;
    margin-bottom: var(--val_15);
}

.hexagon-home .contenu p {
    text-align: center;
    text-align-last: center;
    font-size: var(--size_p);
    margin: 10px 15px;
    overflow: hidden;
    line-height: 16px;
    height: 48px;
}

.hexagon-home .contenu {
    box-sizing: border-box;
    border: 1px solid #c2c2c2;
    background: var(--blanc);
    padding-top: 110px;
    margin-top: -110px;
}

.config-mid {
    width: 100%;
    height: 340px;
    background: var(--noir);
    background-size: contain;
    margin-top: 6px;
    overflow: hidden;
    position: relative
}

    .config-mid .gaming-page {
        background: none !important;
    }

    .config-mid .titre-mid {
        text-transform: uppercase;
        font-size: 16px;
        color: var(--blanc);
        font-weight: var(--semibold);
    }

.contenu-marg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 100%;
}

    .contenu-marg .titre-mid {
        display: inline-block;
        text-align: center;
        padding: 8px 30px;
        margin-bottom: var(--val_15);
    }

.contenu-marg {
    text-align: center;
}

    .contenu-marg .gaming-page section article {
        margin-bottom: 0;
    }

    .contenu-marg .carac-gaming-courte, .contenu-marg .exlu-internet {
        text-align: left;
    }

.foot-config-l {
    display: inline-block;
    vertical-align: middle;
    width: 34%;
}


    .foot-config-l img {
        width: 90%;
    }

.foot-config-r {
    width: 66%;
    margin-bottom: var(--val_40);
    display: inline-block;
    vertical-align: middle;
    background: var(--blanc);
    border: 1px solid #c2c2c2;
    box-sizing: border-box;
    padding: var(--val_15);
}

.referencement-config {
    clear: both;
}

    .referencement-config .titre-text-config:first-child {
        margin-top: 0;
    }

.text-ref {
    display: inline-block;
    vertical-align: middle;
    box-sizing: border-box;
    padding: var(--val_15);
    width: 75%;
    background: var(--blanc);
    border: 1px solid #c2c2c2;
}

.foot-config-rr {
    display: inline-block;
    vertical-align: middle;
    width: 25%;
    text-align-last: center;
    text-align: center;
}

.referencement-config .titre-text-config {
    color: var(--noir);
    font-size: var(--val_30);
    margin-bottom: var(--val_15);
    text-transform: uppercase;
    padding-top: var(--val_5);
    margin-top: var(--val_20);
    font-weight: 900;
    display: inline-block;
}

.foot-config-r .titre-text-config {
    color: var(--noir);
    font-weight: 900;
    font-size: var(--val_30);
    margin-bottom: var(--val_20);
    text-transform: uppercase;
    line-height: var(--val_30);
}

.foot-config-r p {
    font-size: var(--size_p);
    line-height: 18px;
}

.foot-config-r a {
    display: inline-block;
    background: #ffcf00 url(../landing-pages/images/configurateur/computer-1.png) no-repeat 35px center;
    padding: 10px 40px 10px 80px;
    color: var(--noir);
    margin-top: var(--val_20);
    font-size: var(--size_h4);
}

.referencement-config {
    border-top: 1px dashed #d6d6d6;
    padding-top: var(--val_40);
}

.foot-config-r a:hover {
    background: #ffd933 url(../landing-pages/images/configurateur/computer-1.png) no-repeat 35px center;
}

.referencement-config {
    text-align: justify;
    text-align-last: left;
    font-size: 0px;
    margin-bottom: var(--val_20);
    line-height: 14px;
    overflow: hidden;
}

    .referencement-config p {
        font-size: var(--size_p);
    }

.foot-config {
    margin-top: var(--val_10);
    font-size: 0;
}

.list-jaune .list-1-choix {
    background: url(../landing-pages/images/configurateur/gaming-list-b-1.png) no-repeat center;
}

.list-jaune .list-2-choix {
    background: url(../landing-pages/images/configurateur/gaming-list-f-2.png) no-repeat center;
}

.list-bleu .list-1-choix {
    background: url(../landing-pages/images/configurateur/gaming-list-j-1.png) no-repeat center;
}

.list-bleu .list-2-choix {
    background: url(../landing-pages/images/configurateur/gaming-list-f-2.png) no-repeat center;
}

.list-fonce .list-1-choix {
    background: url(../landing-pages/images/configurateur/gaming-list-j-1.png) no-repeat center;
}

.list-fonce .list-2-choix {
    background: url(../landing-pages/images/configurateur/gaming-list-b-2.png) no-repeat center;
}

.list-1-choix {
    margin-bottom: 45px;
}

.choix-bureau-game .global-list .choix-configu {
    width: 100%;
    height: 87px;
    background-size: 100%;
    position: relative;
}

.choix-bureau-game .mode-list {
    width: 801px;
}

.txt-list-choix {
    font-size: var(--size_p);
}

.titre-list-choix {
    font-size: var(--size_p);
    display: inline-block;
    border-bottom: 2px solid var(--noir);
    padding-bottom: 3px;
    margin-bottom: var(--val_10);
    text-transform: uppercase;
}

.position-choix {
    position: absolute;
    left: 142px;
    top: 42%;
    transform: translateY(-50%);
    width: 75%;
}

.global-list {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
}

.hexagon-home, .choix-configu {
    transition: transform 0.2s;
}



.choix-du-config .hexagon-home:hover {
    transform: none;
}

.choix-du-config .hexagon-home {
    cursor: default;
}

.sep3 {
    display: none;
}

.choix-du-config {
    clear: both;
    position: relative;
}

.choix-du-config1 .retour-choix {
    background: url(../landing-pages/images/configurateur/croix-ferme.png) no-repeat;
    position: absolute;
    top: 0;
    left: 0;
    height: 32px;
    cursor: pointer;
    width: 32px;
    z-index: 3;
}

.choix-bureau-game .mode-list {
    opacity: 0;
    position: absolute;
    right: -8000px;
    z-index: 1;
}

    .choix-bureau-game .mode-list.anim-fadein {
        width: 801px;
        z-index: 3;
        display: block;
        right: 0;
    }



.mode-list.anim-fadein {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
    animation-duration: 0.5s;
    animation-delay: 0.6s;
    animation-fill-mode: both;
}



.choix-du-config1 .retour-choix {
    display: none;
}

.choix-du-config1.choix-du-config .choix-2 {
    display: block;
}

.choix-du-config1.choix-du-config2 .choix-1 {
    display: block;
}

.choix-du-config1.choix-du-config3 .choix-3 {
    display: block;
}


.choix-du-config1 .hexagon-home.anim5 {
}

.choix-du-config1 .sep-home-li.anim6 {
}

.mode-list.anim-fadeout {
    -webkit-animation-name: anim-fadeout;
    animation-name: anim-fadeout;
    animation-duration: 0.5s;
    animation-fill-mode: both;
}

.choix-du-config1 .hexagon-home.right-anim {
    -webkit-animation-name: right-anim;
    animation-name: right-anim;
    animation-duration: 0.5s;
    animation-delay: 0.6s;
    animation-fill-mode: both;
}

.right-anim-hexa {
    -webkit-animation-name: right-anim-hexa;
    animation-name: right-anim-hexa;
    animation-duration: 0.5s;
    animation-delay: 0.6s;
    animation-fill-mode: both;
}


.anim-fadein {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
    animation-duration: 0.5s;
    animation-delay: 0.6s;
    animation-fill-mode: both;
}

.choix-du-config3 .sep3 {
    display: block;
}

.choix-bureau-game .sep3 {
    position: absolute;
    left: 120%;
}

.config-all.recap-configurateur .foot-config {
    margin-top: 50px;
}

.config-all .chiffre-fil {
    color: #a9a9a9;
}

.config-all .fil-ariane-config li:nth-child(3), .config-all .fil-ariane-config li:nth-child(4) {
    cursor: initial;
}

.config-all li:nth-child(3):hover .chiffre-fil, .config-all li:nth-child(4):hover .chiffre-fil {
    color: #a9a9a9;
}

.config-all li:nth-child(3):hover .img-fil-config, .config-all li:nth-child(4):hover .img-fil-config {
    background: #a9a9a9;
}

.p1-config .fil-ariane-config li:nth-child(2), .p1-config .fil-ariane-config li:nth-child(3), .p1-config .fil-ariane-config li:nth-child(4) {
    cursor: initial;
}

.p1-config li:nth-child(2):hover .chiffre-fil, .p1-config li:nth-child(3):hover .chiffre-fil, .p1-config li:nth-child(4):hover .chiffre-fil {
    color: #a9a9a9;
}

.p1-config li:nth-child(2):hover .img-fil-config, .p1-config li:nth-child(3):hover .img-fil-config, .p1-config li:nth-child(4):hover .img-fil-config {
    background: #a9a9a9;
}

.config-all.options .fil-ariane-config li:nth-child(4) {
    cursor: initial;
}


.config-all.recap-configurateur .fil-ariane-config li:nth-child(3), .config-all.recap-configurateur .fil-ariane-config li:nth-child(4) {
    cursor: pointer;
}


.config-all .img-fil-config {
    background: #a9a9a9;
}

.config-all li:nth-child(2) .chiffre-fil {
    color: var(--jaune);
}

.config-all li:nth-child(2) .img-fil-config {
    background: var(--jaune);
}

.config-all .fil-ariane-config li:nth-child(2) .content-fil-config {
}


.options .fil-ariane-config ul::before {
    position: absolute;
    width: 52%;
    height: 3px;
    background: var(--jaune);
    display: block;
    right: 495px;
    content: "";
    z-index: 2;
}

.config-all.options li:nth-child(4) .content-fil-config {
}

.config-all li:nth-child(4) .content-fil-config {
}


.options .fil-ariane-config ul::after {
    position: absolute;
    width: 90%;
    height: 3px;
    background: #a9a9a9;
    display: block;
    left: 10%;
    content: "";
    z-index: 1;
}


.config-all.options li:nth-child(3) .chiffre-fil {
    color: var(--jaune);
}

.config-all.options li:nth-child(3) .img-fil-config {
    background: var(--jaune);
}



.options.recap-configurateur .fil-ariane-config ul::after {
    position: absolute;
    width: 40%;
}

.config-all.options .fil-ariane-config li:nth-child(3) .content-fil-config {
}

.config-all .fil-ariane-config li:nth-child(3) .content-fil-config {
}

.recap-configurateur.config-all ul li:nth-child(4) .img-fil-config {
    background: var(--jaune);
}

.recap-configurateur.config-all ul li:nth-child(4) .chiffre-fil {
    color: var(--jaune);
}

.recap-configurateur.options .fil-ariane-config ul::before {
    position: absolute;
    width: 98%;
    height: 3px;
    background: var(--jaune);
    display: block;
    right: 0;
    content: "";
    z-index: 2;
}

.detail-recap {
    background: var(--gris_200) url(../landing-pages/images/configurateur/fleche-bot.png) no-repeat 186px center;
    overflow: hidden;
    display: block;
    clear: both;
    color: var(--blanc);
    line-height: 18px;
    font-size: var(--size_p);
    text-transform: uppercase;
    text-align: center;
    padding-right: var(--val_20);
    font-weight: var(--medium);
}

.sauvergade-config {
    color: var(--noir);
    text-transform: uppercase;
    font-size: var(--size_p);
    text-align: center;
    line-height: var(--val_20);
    margin: 10px 5px;
    background: white url(../landing-pages/images/configurateur/save-1.png) no-repeat left center;
    width: auto;
    float: left;
    padding: 0 5px 0 35px;
    box-sizing: border-box;
    border: 1px solid var(--noir);
    line-height: 26px;
    cursor: pointer;
}



.novice .appli-recap div:first-child {
    background: white url(../landing-pages/images/configurateur/pro-1.png) no-repeat left center;
    float: left;
    color: var(--noir);
}

.appli-recap div:nth-child(2) {
    background: white url(../landing-pages/images/configurateur/partage-1.png) no-repeat left center;
}

.appli-recap div:last-child {
    float: right;
    color: var(--blanc);
    background: black url(../landing-pages/images/configurateur/vide.png) no-repeat left center;
}

.sauvergade-config:hover {
}

.choix-bureau .bureau-conf {
    width: 20%;
    float: left;
    margin-bottom: var(--val_25);
}

.choix-bureau .relative-bureau {
    width: 100%;
    position: relative;
    margin-top: var(--val_15);
    min-height: 500px;
}

.recap-conf .anim7.sauve-valide {
    display: block;
}

.choix-bureau .bureau-conf.active-conf .content-choix {
    cursor: pointer;
    width: 100%;
    height: 100%;
}

.choix-bureau .bureau-conf.active-conf.anim8 .content-choix {
    cursor: default;
    display: none;
}

.choix-bureau .absolute-content img {
    height: 125px;
    max-width: 125px;
    width: 125px;
    object-fit: contain;
    margin: 0 auto;
}

.choix-bureau .absolute-content {
    text-align: center;
    height: 233px;
}

    .choix-bureau .absolute-content .supprim-option img {
        position: absolute;
        top: 0;
        right: 0;
        width: 28px;
        height: 28px;
    }

.choix-bureau .absolute-content {
    position: relative;
}

.choix-bureau .anim-repeat .absolute-content:after {
    background: url(../landing-pages/images/configurateur/right-arrowright.gif) no-repeat center;
    left: -25px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    content: "";
    display: block;
    height: var(--val_25);
    width: 50px;
    background-size: 50px;
}

.absolute-content img:nth-child(2) {
    display: none !important;
}

.options .absolute-content img:nth-child(2) {
    display: block !important;
}

.options .active-confi .absolute-content img:nth-child(2) {
    display: none !important;
}

.absolute-content img.img-choix-hover-1 {
    display: none !important;
}

.titre-conf {
    color: #828282;
    font-size: var(--size_p) !important;
    background: none;
    margin: 0 auto 15px;
    text-transform: uppercase;
    line-height: var(--val_25);
    height: var(--val_25);
    font-weight: var(--medium) !important;
    text-align: center;
}

.modif-conf {
    background: var(--noir);
    font-weight: var(--semibold);
    color: var(--blanc);
    cursor: pointer;
    text-align: center;
    height: var(--val_30);
    line-height: var(--val_30);
    width: 90%;
    text-transform: uppercase;
    margin: 10px auto 0;
    display: none;
}

.ajout-conf {
    background: var(--blanc);
    border: 2px solid var(--noir);
    text-transform: uppercase;
    box-sizing: border-box;
    font-weight: var(--semibold);
    color: var(--noir);
    cursor: pointer;
    text-align: center;
    height: var(--val_30);
    line-height: var(--val_30);
    width: 90%;
    margin: 10px auto 0;
    display: none;
}

.active-conf .anim-repeat .ajout-conf {
    display: block;
}

.active-conf .anim-repeat .modif-conf {
    display: none;
}

.active-conf .modif-conf {
    display: block;
}

.active-conf .titre-conf {
    color: var(--noir);
    font-weight: var(--semibold);
}



.choix-bureau .sep-home {
    display: block;
    height: var(--val_10);
    width: var(--val_10);
    background: var(--gris_200);
    position: absolute;
    top: 50%;
    transform: rotate(-45deg);
}

.choix-bureau .sep-home-li {
    display: none;
}

.choix-bureau .boitier {
    left: 0;
    top: 0;
}

.choix-bureau .proc {
    left: 21.3%;
    top: 0;
}

.choix-bureau .carte-mere {
    left: 42.6%;
    top: 0;
}

.choix-bureau .memoire {
    left: 63.9%;
    top: 0;
}

.choix-bureau .carte-graph {
    left: 85%;
    top: 0;
}

.choix-bureau .ssd {
    left: 0;
    top: 54%;
}

.choix-bureau .hdd {
    left: 16.8%;
    top: 54%;
}

.choix-bureau .alim {
    left: 33.6%;
    top: 54%;
}

.choix-bureau .venti {
    left: 50.9%;
    top: 54%;
}

.choix-bureau .hddssd {
    left: 68%;
    top: 54%;
}

.choix-bureau ul .li-sep-dernier .sep-home-li {
    opacity: 0;
}

.choix-bureau ul .li-sep-dernier.anim8 .sep-home-li {
    opacity: 1;
}


.configurateur .gaming-page section article {
    width: 20%;
    margin: 0 2% 0;
}

.configurateur .carac-gaming .prix {
    color: var(--blanc);
}

.configurateur .contenu-marg .exlu-internet {
    display: none;
}

.configurateur .gaming-page section article {
    border: 1px solid var(--blanc);
}

    .configurateur .gaming-page section article:nth-child(3n+1) {
        margin-left: 10%;
    }

    .configurateur .gaming-page section article:nth-child(3n) {
        margin-right: 10%;
    }

.configurateur .carac-gaming {
    width: 100%;
}

.carac-gaming h3 {
    color: var(--blanc);
    font-size: 0.8vw;
    font-family: 'Montserrat';
    text-transform: uppercase;
    font-weight: var(--semibold);
    width: 100%;
}

.configurateur .contenu-marg .exlu-internet {
    text-align: center;
}

.configurateur .carac-gaming-courte li:nth-child(3n) {
    margin-right: 0;
}

.configurateur .gaming-page .link-fiche h2 {
    color: var(--blanc);
    text-transform: uppercase;
    text-align: center;
    font-size: 0.6vw;
    font-weight: var(--semibold);
    margin-bottom: 5%;
    letter-spacing: 0.1vw;
    text-shadow: none;
}

.configurateur .carac-gaming-courte li {
    padding-left: 18%;
    color: var(--blanc);
    line-height: 215%;
    font-size: 0.6vw;
    float: left;
    width: 31%;
    margin-right: 1%;
}

.titre-list-choix input {
    font-weight: var(--semibold);
}

.configurateur .windows {
    margin-top: 0px;
}

.configurateur .image-config-gamer-pc .link-fiche .option-m {
    position: absolute;
    color: var(--jaune);
    border-radius: 100%;
    border: 1px solid var(--jaune);
    background: var(--noir);
    width: 35%;
    height: 28%;
    text-align: center;
    top: 0;
    font-size: 0.5vw;
    text-transform: uppercase;
    left: 0;
    padding-top: 4%;
}

.configurateur .carac-gaming .prix.prixBarre::after {
    width: 37%;
}

.configurateur .contenu-marg .carac-gaming-courte {
    clear: both;
}

.configurateur .image-config-gamer-pc {
    float: left;
    width: 44%;
    position: relative;
}

.fil-ariane-config .recap-conf {
    float: right;
    cursor: pointer;
    margin-right: 0;
    z-index: 6000;
    width: 284px;
    height: 42px;
}

.liblle-recap {
    font-size: var(--size_p);
    float: left;
    width: 210px;
    white-space: nowrap;
    overflow: hidden;
    line-height: var(--val_30);
}

.img-recap-conf {
    float: left;
    width: var(--val_30);
    margin-right: var(--val_5);
    margin-left: var(--val_5);
}

.recap-produit-conf .jassemble {
    line-height: var(--val_30);
    float: left;
    font-size: var(--size_p);
}

.liblle-recap.ncut-txt {
    overflow: initial;
}

.recap-produit-conf .switch {
    width: 42px;
    height: var(--val_20);
    background: #107200;
    z-index: 0;
    margin: 0;
    padding: 0;
    border: none;
    cursor: pointer;
    position: relative;
    float: right;
    border-radius: 16px;
    margin-left: 0;
    line-height: var(--val_30);
    margin-top: var(--val_5);
}

.recap-produit-conf .assemble {
    font-size: var(--size_p);
    float: left;
    line-height: var(--val_30);
}

.fil-ariane-config .recap-conf span {
    color: var(--noir);
}

.recap-produit-conf .montage-conf {
    margin: 8px 0;
}

.fil-ariane-config .recap-conf .content-fil-config {
    background: var(--jaune);
    margin-left: 0;
    position: relative;
}

.recap-conf .txt-fil-config p {
    color: var(--blanc);
    font-size: 16px;
    font-weight: var(--medium);
    text-transform: uppercase;
    text-align: center;
    line-height: var(--val_40);
}

.recap-conf .txt-fil-config span {
    font-family: 'Outfit', sans-serif;
    font-size: var(--val_20);
    font-weight: var(--semibold);
    text-decoration: none;
    margin-top: 3px;
    color: var(--blanc);
    display: none;
}

.novice .recap-conf .txt-fil-config span {
    font-family: 'Outfit', sans-serif;
    font-size: var(--size_h4);
    font-weight: var(--semibold);
    text-decoration: none;
    margin-top: 3px;
}

.recap-conf .img-fil-config {
    background: var(--jaune);
    line-height: 24px;
}

ul .posi-option.pc-center.sauve-valide a {
    display: block;
    height: 210px;
    width: 100%;
    padding: 62px 0;
    background: var(--jaune);
    overflow: hidden;
    box-sizing: border-box;
    border-radius: var(--val_10);
}

    ul .posi-option.pc-center.sauve-valide a:hover {
        background: #ffe266;
    }


a:hover .recap-go.action {
    background: #ffe266;
}

.recap-go:hover {
    background: #282828;
}

ul .posi-option.pc-center.sauve-valide.passer-option:hover a {
    background: #282828;
}

ul .posi-option.pc-center.sauve-valide.passer-option a {
    background: var(--noir);
}

.recap-conf .chiffre-fil {
    background: var(--noir);
    color: var(--jaune);
    font-size: var(--val_20);
    height: 42px;
    margin-top: 0;
    padding: 0 5px;
}

    .recap-conf .chiffre-fil span {
        color: var(--jaune);
        display: block;
        font-size: var(--size_p);
        position: relative;
        font-weight: var(--semibold);
        text-align: center;
        line-height: 18px;
    }

    .recap-conf .chiffre-fil .etape-dessus {
        border-bottom: 2px solid var(--jaune);
    }

.recap-conf .etap {
    float: left;
    text-transform: uppercase;
    color: var(--noir);
    font-weight: var(--semibold);
    transform: rotate(-90deg);
    margin-top: var(--val_15);
    margin-right: -16px;
    font-size: var(--size_p);
    margin-left: 0;
    position: absolute;
    left: -10px;
    font-size: var(--size_p);
}

.config-choix {
    clear: both;
    position: relative;
    z-index: 40;
}

.fil-ariane-config .recap-produit-conf ul::before {
    display: none !important;
}

.fil-ariane-config .recap-produit-conf ul::after {
    display: none !important;
}

.recap-produit-conf {
    background: #eee;
    width: 100%;
    border: 1px solid var(--noir);
    overflow: hidden;
    box-sizing: border-box;
    z-index: 50;
    position: relative;
}

.total-conf-recap {
    background: #e4e4e4;
    line-height: 44px;
    font-weight: var(--semibold);
    text-transform: uppercase;
    display: inline-block;
    vertical-align: middle;
    font-size: var(--size_p);
    text-transform: uppercase;
    text-align: center;
    width: 100%;
}



    .total-conf-recap p {
        text-transform: uppercase;
    }

    .total-conf-recap span {
        vertical-align: middle;
        font-size: var(--size_h4);
        color: #b90c0b;
    }

.recap-conf:hover .recap-produit-conf {
    display: block;
}

.recap-produit-conf ul {
    overflow: hidden;
}

.dispo-conf {
    border-radius: 100%;
    width: var(--val_10);
    height: var(--val_10);
    background: green;
    display: inline-block;
    margin-right: var(--val_5);
    margin-left: var(--val_10);
    float: right;
    margin-top: var(--val_10);
}

.fil-ariane-config .recap-conf .prix-conf-recap {
    color: #b60e20;
}

.li-recap-conf {
    clear: both;
    overflow: hidden;
    margin: 8px 0;
}

.sep-recap-conf {
    background: url(../landing-pages/images/configurateur/sep-recap.png) no-repeat center center;
    height: 13px;
    width: 100%;
}

.fil-ariane-config .recap-produit-conf li {
    height: 24px;
    float: none;
    z-index: 2;
    margin-right: 0px;
    font-size: var(--size_p);
    line-height: 28px;
    font-style: italic;
    cursor: initial !important;
    width: 100%;
}

.prix-conf-recap {
    float: right;
    margin-right: var(--val_10);
    font-weight: var(--semibold);
    font-style: normal;
    line-height: var(--val_30);
    width: 80px;
    text-align: right;
}

.novice .prix-conf-recap {
    width: 120px;
}



.avance-choix {
    width: 1280px;
    clear: both;
}

.choix-bureau .active-conf.click-conf {
    top: 50%;
    transform: translateY(-50%);
    left: 0;
}

.filtre-conf li {
    float: left;
    margin-right: var(--val_5);
}

    .filtre-conf li .filtres-configurateur {
        float: left;
    }

        .filtre-conf li .filtres-configurateur .titre-filtres {
            border: 1px solid var(--noir);
            float: left;
            text-transform: uppercase;
            font-family: 'Outfit', sans-serif;
            font-size: var(--size_p);
            padding-right: var(--val_20);
            line-height: 27px;
            padding-left: var(--val_5);
            cursor: pointer;
            background: url(../landing-pages/images/configurateur/filte-fleche.png) no-repeat 95% center;
            -webkit-appearance: none;
            -moz-appearance: none;
            appearance: none;
            height: 28px;
            font-weight: var(--semibold);
        }

.filtre-conf {
    font-size: 0;
    margin-bottom: var(--val_20);
}



    .filtre-conf .ul {
        float: left;
    }

    .filtre-conf .filtre-conf {
        color: var(--noir);
        font-family: 'Outfit', sans-serif;
        display: inline-block;
        vertical-align: middle;
        background: #a9a9a9;
        text-align: center;
        padding: 3px 20px 3px;
        text-transform: uppercase;
        font-size: var(--size_p);
        margin-top: 2px;
        font-weight: var(--semibold);
        height: 24px;
        display: none;
        margin-right: 12px;
    }

    .filtre-conf .tri-mos {
        border: 1px solid var(--noir);
        display: inline-block;
        vertical-align: middle;
        text-transform: uppercase;
        font-family: 'Outfit', sans-serif;
        font-size: var(--size_p);
        padding-right: 0px;
        line-height: 27px;
        padding-left: var(--val_5);
        cursor: pointer;
        background: var(--noir);
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        height: 27px;
        position: relative;
        margin-right: 0px;
        margin-left: 24px;
        float: right;
        color: var(--blanc);
    }

.tri-mos .sactive {
    display: none;
}

.filtre-conf .tri-mos:hover .mode-affich {
    display: block;
}

.filtre-conf .tri-mos p {
    font-size: var(--size_p);
    text-transform: uppercase;
    font-weight: var(--semibold);
    color: var(--blanc);
}

.configurateur .tarif-filtre {
    line-height: 29px;
    margin-left: var(--val_25);
    cursor: pointer;
    vertical-align: middle;
}

.configurateur .product_masked {
    font-size: var(--size_p);
    text-transform: uppercase;
}

.filtre-conf .mode-affich {
    background: var(--blanc);
    position: absolute;
    top: 27px;
    padding: var(--val_10);
    z-index: 3000;
    font-size: var(--size_p);
    line-height: var(--val_20);
    min-width: 140px;
    border: 1px solid grey;
    right: -1px;
    text-align: left;
}


.filtre-conf .liste-filtres-2 {
    display: inline-block;
    vertical-align: middle;
    position: relative;
}

.filtre-conf .filtre-conf.filtre_on {
    cursor: pointer;
    background: #132643;
    color: var(--blanc);
    display: block;
}

.filtre-conf .list {
    color: var(--blanc);
    background: url(../landing-pages/images/configurateur/mode-list-w.png) no-repeat 5px center;
}

.plop-gamer .filtre-conf .list-is-mobile,
.plop-gamer .filtre-conf .list {
    color: var(--noir);
    background: url(/images/mode-list.png) no-repeat 5px center;
}

    .plop-gamer .filtre-conf .list:hover {
        color: var(--noir);
        background: url(/images/mode-list.png) no-repeat 5px center;
    }

.anim8 .retour-choix {
    display: inline-block;
    z-index: 3000;
}

.retour-choix {
    background: black url(../landing-pages/images/configurateur/retour.png) no-repeat 5px center;
    cursor: pointer;
    z-index: 3;
    display: none;
    padding-left: var(--val_20);
    color: var(--blanc);
    line-height: var(--val_25);
    text-transform: uppercase;
    font-weight: var(--semibold);
    font-size: var(--size_p);
    padding-right: var(--val_10);
}

.choix-bureau .relative-bureau-2 {
    width: 1280px;
}

.plop-gamer.novice .choix-bureau .relative-bureau-2 {
    background: var(--blanc);
}

.info-pc-puis {
    display: inline-block;
    vertical-align: middle;
    width: 82%;
}

.choix-jeux-termine {
    background: var(--jaune);
    color: var(--noir);
    text-align: center;
    line-height: var(--val_40);
    font-size: var(--val_20);
    text-transform: uppercase;
    z-index: 2000;
    padding: var(--marg_0_20);
    cursor: pointer;
    font-weight: var(--semibold);
    display: inline-block;
    vertical-align: bottom;
    margin-bottom: var(--val_15);
    margin-left: var(--val_15);
}

.avance-choix section {
    clear: both;
}

.produit_sel::after {
    position: absolute;
    z-index: 10;
    background: url(../landing-pages/images/configurateur/checked.png) no-repeat center center;
    width: 60px;
    height: 60px;
    display: block;
    content: "";
    top: 50%;
    background-size: 60px;
    left: 50%;
    transform: translate(-50%,-50%);
    opacity: 1;
}

.produit_sel::before {
    position: absolute;
    z-index: 9;
    background: rgba(0,0,0,0.6);
    width: 100%;
    height: 100%;
    display: block;
    content: "";
    top: 0px;
    left: 0%;
    opacity: 1;
}

.mode-liste .img-conf-list {
    display: inline-block;
    vertical-align: middle;
}

.mode-liste .titre-conf-inte {
    display: inline-block;
    vertical-align: middle;
    width: 68%;
    padding-left: var(--val_10);
}

.mode-liste .couleur-stock {
    display: inline-block;
    vertical-align: middle;
    margin-top: 0;
    width: 10%;
}

.mode-liste .price-conf-inte {
    display: inline-block;
    vertical-align: middle;
    margin-top: 0;
    width: 10%;
}

.mode-liste .mCSB_scrollTools {
    display: none !important;
}

.mode-liste .prod-all-conf {
    vertical-align: middle;
    display: inline-block;
    width: 90%;
}

.mode-liste .pop-up-detail {
    display: inline-block;
    vertical-align: middle;
    margin-top: 0;
    text-align: center;
}

.novice .place-img-conf {
    display: none;
}

.novice .ng-hide #Section4 .mode-list-conf li {
    height: 290px;
}

.novice .produit_sel::after {
    top: 50%;
    transform: translate(-50%,-50%);
}

.novice #Section3 .titre-conf-inte {
    line-height: 14px;
    font-size: var(--size_p);
}

.novice #Section3 .place-img-conf {
    display: block;
}

.novice #Section3 .mode-list-conf li {
    height: 315px;
}

.mode-list1 .produit_sel::after {
    position: absolute;
    z-index: 10;
    background: url(/images/checked.png) no-repeat center center;
    width: 23px;
    height: 23px;
    display: block;
    content: "";
    top: 4px;
    background-size: 23px;
    left: 75%;
    transform: translateX(-50%);
    opacity: 0.8;
}

.tri-mos div div:hover {
    color: var(--bleu);
}

.tri-mos div {
    cursor: pointer;
    line-height: 26px;
    display: block;
    text-indent: 0;
    padding-left: 34px;
    text-transform: uppercase;
    font-size: var(--size_p);
    font-weight: var(--semibold);
    padding-right: var(--val_5);
}

.tri-mos .list:hover {
    background: url(/images/mode-list-h.png) no-repeat 5px center;
}

.filtre-conf .list.sactive {
    background: url(/images/mode-list-h.png) no-repeat 5px center;
}

.tri-mos .mos {
    background: url(../landing-pages/images/configurateur/mode-mosa-w.png) no-repeat left center;
    margin-right: var(--val_5);
    color: var(--blanc);
}

    .tri-mos .mos:hover {
        background: url(../landing-pages/images/configurateur/mode-mosa-w.png) no-repeat left center;
        margin-right: var(--val_5);
        color: var(--blanc);
    }

.plop-gamer .tri-mos .mos-is-mobile,
.plop-gamer .tri-mos .mos {
    color: var(--noir);
    background: url(../landing-pages/images/configurateur/mode-mosa.png) no-repeat left center;
}

.tri-mos {
    line-height: 27px;
    margin-left: var(--val_10);
}

    .tri-mos .mos:hover {
        background: url(../landing-pages/images/configurateur/mode-mosab.png) no-repeat left center;
    }

    .tri-mos .mos.sactive {
        background: url(../landing-pages/images/configurateur/mode-mosab.png) no-repeat left center;
    }


.mode-mosa {
    overflow: hidden;
    clear: both;
}

    .mode-mosa .mCustomScrollBox {
        padding-top: 45px;
    }


    .mode-mosa li {
        float: left;
        width: 249px;
        position: relative;
        text-align: center;
    }


        .mode-mosa li .titre-conf-inte span {
            display: block;
            height: 24px;
            overflow: hidden;
        }


.plop-gamer .mode-mosa li .supprim-option img {
    border: 1px #ffcf00 solid;
    border-radius: 100%;
}

.price-conf-inte {
    color: var(--noir);
    font-size: var(--size_h4);
    font-weight: var(--semibold);
    width: 100px;
    margin: 10px auto 0;
    background: rgba(255,255,255,0.5);
}

.mode-mosa li:nth-child(2n) {
}

.mode-mosa li {
    cursor: pointer;
    transition: all 0.5s;
}


    .mode-mosa li .img-logo-conf {
        display: none;
    }

.pop-up-detail {
    position: relative;
    z-index: 999;
    width: 100px;
    border: 1px solid var(--noir);
    margin: 10px auto 0;
    line-height: var(--val_25);
    font-weight: var(--semibold);
    text-transform: uppercase;
    font-size: var(--size_p);
    background: var(--noir);
    color: var(--blanc);
    transition: all 0.5s;
}

    .pop-up-detail:hover {
        background: var(--blanc);
        color: var(--noir);
    }


.mode-mosa li:last-child {
    margin-right: 0;
}

.mode-mosa .sous-titre-conf, .mode-mosa .couleur-stock {
}

.mode-list1 li .img-conf-list {
    display: none;
}

.mode-list1 li {
    width: 1000px;
    height: 42px;
    position: relative;
    background: url(../landing-pages/images/configurateur/list-bleu-bureau-conf.png) no-repeat center;
    background-size: auto auto;
    margin-bottom: var(--val_5);
    cursor: pointer;
    transition: all 0.5s;
    background-size: 100% 42px;
}

    .mode-list1 li:hover {
        transform: scale(1.02);
    }

.mode-list1 {
    clear: both;
    margin-top: 0px;
    height: 370px;
}

    .mode-list1 img {
        max-height: 26px;
        max-width: 65px;
        position: absolute;
        top: 50%;
        transform: translate(-50%,-50%);
        left: 50%;
    }

    .mode-list1 .titre-conf-inte {
        font-size: var(--size_p);
        text-transform: uppercase;
        color: var(--noir);
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        left: 88px;
        overflow: hidden;
        width: 650px;
        white-space: nowrap;
    }

        .mode-list1 .titre-conf-inte span {
            font-size: var(--size_p);
            text-transform: uppercase;
            color: var(--noir);
        }

        .mode-list1 .titre-conf-inte p {
            font-size: var(--size_p);
            text-transform: uppercase;
            color: var(--noir);
            white-space: nowrap;
        }

    .mode-list1 .price-conf-inte {
        margin: 0;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        background: none;
    }

    .mode-list1 .price-conf-inte {
        margin: 0;
        background: none;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        text-align: center;
        left: 90%;
        display: block;
        height: 22px;
    }

#Section6 .mode-list1 .price-conf-inte {
    left: 88%;
}

.mode-list1 .produit-selected-del .supprim-option {
    display: block;
    left: 98%;
    top: 50%;
    transform: translateY(-50%);
}

.mode-listmosa.mode-list1 li:nth-child(2n) .produit-selected-del .supprim-option {
    display: block;
    left: 98%;
    top: 50%;
    transform: translateY(-50%);
}

.mode-list1 .produit-selected-del .supprim-option::after {
    display: none;
}

#Section7 .mode-list1 .price-conf-inte {
    left: 88%;
}

.couleur-stock {
    display: block;
    border-radius: 100%;
    right: 120px;
    margin-top: var(--val_10);
    text-transform: uppercase;
    font-size: var(--size_p);
    color: green;
    font-weight: var(--semibold);
}

.mode-mosa .couleur-stock {
}

.mode-list1 .pop-up-detail {
    cursor: pointer;
    background: var(--bleu);
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    text-transform: uppercase;
    font-size: var(--size_p);
    color: var(--blanc);
    padding: 0 10px;
    line-height: var(--val_30);
    right: 156px;
}





.mode-list1 .mCSB_container {
    width: 100%;
}

.mode-list1 .mCSB_scrollTools {
    height: 100%;
}

    .mode-list1 .mCSB_scrollTools .mCSB_draggerRail {
        margin: 0 6px;
    }

.mode-list1 .mCSB_scrollTools {
    width: 12px;
}

    .mode-list1 .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
        right: -1px;
    }

    .mode-list1 .mCSB_scrollTools .mCSB_buttonDown {
        background-position: -113px -20px;
    }

.mode-mosa .mCS-inset.mCSB_scrollTools .mCSB_buttonRight:hover {
    opacity: 1;
}

.mode-mosa .mCS-inset.mCSB_scrollTools .mCSB_buttonRight {
    background-image: url(../landing-pages/images/configurateur/right-arrow.png);
    background-position: 0;
    height: var(--val_35);
    width: var(--val_35);
    top: 150px;
    opacity: .9;
    border: 1px solid var(--blanc);
    border-radius: 100%;
}

.mode-mosa .mCS-inset.mCSB_scrollTools .mCSB_buttonLeft:hover {
    opacity: 1;
}

.mode-mosa .mCS-inset.mCSB_scrollTools .mCSB_buttonLeft {
    background-image: url(../landing-pages/images/configurateur/left-arrow.png);
    background-position: 0;
    height: var(--val_35);
    width: var(--val_35);
    top: 150px;
    border: 1px solid var(--blanc);
    border-radius: 100%;
}

.mode-list1 .compatible-1 {
    display: none;
}

.mode-mosa .mCS-inset.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
    height: var(--val_5);
}

.global-conf {
    opacity: 0;
    right: 0px;
    z-index: 1;
    display: none !important;
    width: 1280px;
}

    .global-conf.fadeIn {
        display: block !important;
    }

.choix-bureau .relative-bureau-2 .bureau-conf {
    margin-bottom: var(--val_15);
    margin-top: var(--val_5);
    float: none;
    clear: both;
}

.bt-en-voir-plus {
    text-align: center;
}

.mode-list-conf li {
    display: inline-block;
    width: 19%;
    text-align: center;
    box-sizing: border-box;
    margin-bottom: var(--val_25);
    padding: var(--val_5);
    cursor: pointer;
    position: relative;
    vertical-align: middle;
    border: 1px solid var(--noir);
    background: var(--blanc);
    height: 380px !important;
    margin-right: 1.25%;
    overflow: hidden;
}

.mode-liste .mode-list-conf li {
    width: 100%;
    text-align: left;
    height: auto;
    margin-bottom: var(--val_5);
}

.titre-conf-inte .sous-titre-conf {
    color: #a9a9a9;
    font-weight: normal;
}

.mode-liste .mode-list-conf li img {
    width: 200px !important;
    height: 200px !important;
    object-fit: contain;
}

.mode-liste .place-img-conf {
    display: none;
}



.mode-list-conf li:hover .img-conf-list img {
    transform: scale(1.07);
    z-index: 1;
}

.mode-list-conf li .img-conf-list img {
    transition: all 0.3s;
}

.mode-list-conf li:nth-child(5n) {
    margin-right: 0;
}

/*.mode-list-conf li img {
    width: 200px !important;
    height: 200px !important;
    object-fit: contain;
}*/

.mode-list-conf li .place-img-conf img {
    max-width: 100px;
    max-height: 32px;
}

.place-img-conf {
    background: rgba(255, 255, 255,0.8);
    padding: 2px 5px;
    left: 0;
    position: absolute;
    transform: inherit;
    top: 0;
    z-index: 9;
}

.titre-conf-inte {
    font-size: var(--size_p);
    font-weight: var(--semibold);
    overflow: hidden;
    line-height: 14px;
    height: 60px;
    position: relative;
    z-index: 5;
    padding: 2px 0;
    background: rgba(255,255,255,0.8);
}



#mCSB_1_container {
    width: 100% !important;
}


.global-conf.fadeIn {
    right: 0;
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
    animation-duration: 0.5s;
    animation-delay: 0.6s;
    animation-fill-mode: both;
    z-index: 2000;
    clear: both;
}



.global-conf.anim-fadeout {
    -webkit-animation-name: anim-fadeout;
    animation-name: anim-fadeout;
    animation-duration: 0.5s;
    animation-fill-mode: both;
}




.non-oui {
    position: absolute;
    top: 68%;
    left: 50%;
    width: 120px;
    transform: translateX(-50%);
}

    .non-oui div {
        float: left;
        background: #a9a9a9;
        padding: 3px 5px;
        text-transform: uppercase;
        color: var(--blanc);
        font-size: var(--size_p);
        border: 1px solid var(--blanc);
    }

    .non-oui .choix-non {
        float: right;
    }

.active-conf .non-oui div {
    cursor: pointer;
}

.active-conf .non-oui .choix-active {
    background: var(--bleu);
}

.active-conf .non-oui div:hover {
    background: var(--bleu);
}

.anim-repeat:hover {
}

.valid-compo {
    background: #132643;
    width: 300px;
    margin: 0 auto;
    color: var(--blanc);
    font-weight: var(--semibold);
    text-transform: uppercase;
    text-align: center;
    padding: 15px 0px;
    margin-top: var(--val_25);
    opacity: 0;
}

    .valid-compo:hover {
        background: #132643 url(/images/hover-bouton.png) no-repeat left center;
    }

    .valid-compo.active-validation {
        display: block;
    }

.active-validation {
    -webkit-animation-name: active-validation;
    animation-name: active-validation;
    animation-duration: 0.5s;
    animation-fill-mode: both;
    animation-delay: 0.6s;
}

.choix-bureau-option .choix-bureau {
    margin-top: var(--val_25);
    position: relative;
    width: 100%;
}

ul .posi-option {
    float: left;
    width: 20%;
    margin-bottom: var(--val_20);
}

.posi-option .pose {
}


ul .posi-option.pc-center {
    height: 196px;
    width: 170px;
    z-index: 1000;
    cursor: default;
}


.pc-center .absolute-content .titre-conf {
    background: var(--bleu);
    text-align: center;
}

.pc-center .absolute-content img {
    max-height: 110px;
    max-width: 110px;
    transform: translate(-50%,-50%);
    position: absolute;
    top: 55%;
    left: 50%;
}


.periphe .titre-conf, .pack-clavier .titre-conf, .carte-son .titre-conf {
    line-height: 14px;
}

.pack-clavier .titre-conf, .multifonction .titre-conf {
    width: 128px;
}

.posi-option.anim8::after {
    display: none;
}

.posi-option.anim8 .pose {
}

.posi-option {
    cursor: pointer;
}

    .posi-option.anim8 {
        cursor: default;
    }

        .posi-option.anim8 .pose {
            display: none;
        }

            .posi-option.anim8 .pose:hover {
                transform: none;
            }


.active-confi .titre-conf {
    color: var(--noir);
    font-weight: var(--semibold);
}



.select-barre::after {
    -webkit-animation-name: select-barre;
    animation-name: select-barre;
    animation-duration: 0.5s;
    animation-delay: 1.1s;
    animation-fill-mode: both;
}



ul .posi-option.pc-center .absolute-content {
}


.recap-configurateur .config-choix {
    width: 100%;
    float: left;
    margin-bottom: var(--val_20);
}

.recap-configurateur .txt-option-config {
    width: 100%;
    margin-top: var(--val_20);
    margin-bottom: var(--val_20);
}

.recap-configurateur .pose {
    display: inline-block;
    vertical-align: middle;
}

    .recap-configurateur .pose img {
        max-height: 44px;
        max-width: 44px;
        vertical-align: middle;
    }

.recap-configurateur .sep-home-li {
    display: none;
}


.plop-gamer li.recap-conf-li:nth-child(2n) {
    background: #f3f3f3;
}

li.recap-conf-li:nth-child(2n) {
    background: var(--blanc);
}

.recap-configurateur ul li:nth-child(2n) .sep-home-li {
    margin-left: 17px;
}


.recap-configurateur .sep-home {
    display: block;
    height: var(--val_10);
    width: var(--val_10);
    background: var(--gris_200);
    position: absolute;
    top: 50%;
    transform: rotate(-45deg);
}

.recap-configurateur .champ-recap img {
    max-height: 26px;
    max-width: 65px;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    left: 50%;
}

.recap-configurateur .champ-recap {
    width: 832px;
    height: 32px;
    position: relative;
    margin-bottom: 0px;
    transition: all 0.5s;
    display: inline-block;
    vertical-align: middle;
}


.champ-recap .titre-conf-inte {
    font-size: var(--size_p);
    height: 28px;
    text-transform: uppercase;
    color: var(--noir);
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 88px;
    overflow: hidden;
    background: none;
    width: 458px;
}

    .champ-recap .titre-conf-inte span {
        font-size: var(--size_p);
        text-transform: uppercase;
        color: var(--noir);
    }

    .champ-recap .titre-conf-inte p {
        font-size: var(--size_p);
        text-transform: uppercase;
        color: var(--noir);
        white-space: nowrap;
    }

.champ-recap .couleur-stock {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 12px;
    height: 12px;
    background: green;
    display: block;
    border-radius: 100%;
    right: 120px;
    margin-top: 0;
}

.champ-recap .price-conf-inte {
    margin: 0;
    background: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    text-align: center;
    left: 87%;
    height: 22px;
}

.champ-recap .pop-up-detail {
    cursor: pointer;
    background: var(--bleu);
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    text-transform: uppercase;
    font-size: var(--size_p);
    margin-top: 0;
    color: var(--blanc);
    padding: 0 10px;
    line-height: var(--val_30);
    text-align: center;
    right: 156px;
    background: var(--noir);
    color: var(--blanc);
}

.recap-conf-li {
    width: 100%;
    overflow: hidden;
    position: relative;
    padding: var(--val_5);
}

.config-choix .recap-conf-li {
}

    .config-choix .recap-conf-li:nth-child(2n) .pose {
    }

.panier-config {
    position: fixed;
    width: 370px;
}

    .panier-config .titre-recap {
        color: var(--blanc);
        font-size: 16px;
        font-weight: var(--medium);
        text-transform: uppercase;
        text-align: center;
        line-height: var(--val_40);
        background: var(--noir);
    }

.price-conf-total {
    border: 1px solid var(--gris_200);
    padding: var(--val_10);
    background: var(--blanc);
    overflow: hidden;
}

.price-conf {
    color: #b60e20;
    font-size: var(--size_h3);
    font-weight: var(--semibold);
    float: left;
}

.img-total {
    float: right;
    line-height: var(--val_25);
}

    .img-total a {
        display: inline-block;
        margin-left: var(--val_10);
    }

.recap-configurateur .ajout-panier.ajout-fiche-produit {
    font-size: var(--size_h4);
    color: var(--noir);
    text-transform: uppercase;
    line-height: var(--val_35);
    height: var(--val_35);
    margin-top: var(--val_15);
    margin-bottom: 0;
    cursor: pointer;
    font-weight: var(--semibold);
}

.sep-recap {
    display: block;
    clear: both;
    height: 2px;
    background: var(--gris_200);
    margin: var(--marg_10_0);
}

.panier-config .montage-conf p {
    font-size: var(--size_p);
    float: left;
    width: 136px;
}

.panier-config .carton-conf p {
    font-size: var(--size_p);
    float: left;
    width: 136px;
}

.montage-conf {
    overflow: hidden;
}

.relative-panier {
    position: relative;
    width: 370px;
    float: right;
    clear: both;
    margin-top: 0px;
}

.switch {
    width: 42px;
    height: var(--val_20);
    background: #107200;
    z-index: 0;
    margin: 0;
    padding: 0;
    border: none;
    cursor: pointer;
    position: relative;
    float: right;
    border-radius: 16px;
    margin-left: 88px;
}


.recap-configurateur .switch {
    margin: 0;
}

.switch::after {
    content: ' ';
    height: 18px;
    width: 18px;
    border-radius: 100%;
    z-index: 2;
    background: #FFFFFF;
    position: absolute;
    -webkit-transition-duration: 300ms;
    transition-duration: 300ms;
    top: 1px;
    left: 1px;
}

.switchOn, .switchOn:before {
    background: #949494 !important;
}

    .switchOn:after {
        left: 23px !important;
    }

.montage-conf p span {
    font-weight: var(--semibold);
    font-size: var(--size_p);
}

.img-princ-conf {
    position: relative;
    width: 238px;
    height: 92px;
    margin: 0 auto;
}

    .img-princ-conf .img-bureautique {
        background: rgba(255, 255, 255, 0.7);
        position: absolute;
        width: 234px;
        height: 88px;
        top: 2px;
        left: 2px;
        transition: background 0.5s;
    }

        .img-princ-conf .img-bureautique img {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%,-50%);
            width: auto;
        }

.hexagon-home:hover .img-princ-conf .img-bureautique {
    background: rgba(255, 255, 255, 0);
}

.jaune .img-princ-conf .img-bureautique {
    background: rgba(0, 0, 0, 0.6);
}

.jaune.hexagon-home:hover .img-princ-conf .img-bureautique {
    background: rgba(0, 0, 0, 0);
}


.novice .choix-bureau .proc {
    left: 63.9%;
    top: 0;
}

.novice .choix-bureau .boitier {
    left: 42.6%;
    top: 0;
}

.novice .choix-bureau .prix-configu {
    left: 0;
    top: 0;
}

.novice .choix-bureau .jeux-gamer {
    top: 0;
    left: 21.3%;
}

.novice .choix-bureau .memoire {
    left: 85%;
    top: 0;
}

.novice .choix-bureau .carte-graph {
    left: 0%;
    top: 54%;
}

.prix-configurateur {
    width: 120px;
    border: 1px solid #949494;
    line-height: var(--val_25);
    position: absolute;
    top: 70px;
    font-weight: var(--semibold);
    color: var(--noir);
    box-shadow: none;
    transform: translateX(-50%);
    left: 50%;
    text-align: center;
}

.sep-1-jeux {
    width: 120px;
    position: absolute;
    transform: translateX(-50%);
    left: 50%;
    height: 1px;
    background: var(--noir);
    top: 108px;
}

.util-logi {
    font-size: var(--size_p);
    position: absolute;
    transform: translateX(-50%);
    left: 50%;
    top: 23px;
    color: var(--noir);
    width: 120px;
    font-weight: var(--semibold);
    background: rgba(255,255,255,0.8);
    padding: var(--marg_5_0);
}

.choix-bureau .jeux-gamer .absolute-content img {
    top: 69%;
}

.novice .mode-mosa li img {
    max-width: 140px !important;
    max-height: 140px !important;
}


.novice .choix-proc .mode-mosa img {
    max-width: 120px;
    max-height: 120px;
    margin-top: 9px;
}

.text-auto {
    font-size: var(--size_p);
    font-style: italic;
    text-transform: uppercase;
}


    .text-auto span {
        font-size: var(--val_20);
        font-style: italic;
        text-transform: uppercase;
        display: block;
    }

.novice .mode-mosa .auto-choix img {
    width: 144px;
    margin-top: 4px;
    margin-bottom: var(--val_10);
}

.novice .choix-memoire .mode-mosa li.auto-choix img {
    position: relative;
    transform: none;
    top: 0;
    left: 0;
    margin-top: var(--val_20);
}

.novice .choix-memoire .mode-mosa li img {
    max-width: 100px;
    max-height: 100px;
    margin-top: 9px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.novice .choix-bureau .ssd {
    left: 21.3%;
    top: 54%;
}

.novice .choix-bureau .hddssd {
    left: 63.9%;
    top: 54%;
}

.novice .choix-bureau .hdd {
    left: 42.6%;
    top: 54%;
}

.novice .choix-prix-configu .mode-mosa li img {
    max-width: 130px;
    max-height: 130px;
    margin-top: var(--val_5);
    width: auto;
}

.novice .choix-ssd .mode-mosa li img {
    max-width: 100px;
    max-height: 100px;
    margin-top: 8px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.novice .choix-hdd .mode-mosa li img {
    max-width: 100px;
    max-height: 100px;
    margin-top: 6px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}


.active-confi .modif-conf {
    display: block;
}

.recap-go {
    text-transform: uppercase;
    color: var(--noir);
    font-weight: var(--semibold);
    display: none;
    line-height: 18px;
    font-size: var(--size_h4);
    text-align: center;
    width: auto;
    background: var(--noir);
    clear: both;
    color: var(--blanc);
    margin: 0 5px;
    margin-bottom: 0px;
    line-height: var(--val_35);
    margin-bottom: var(--val_5);
}

    .recap-go.action {
        display: block;
        background: var(--jaune);
        color: var(--noir);
    }

.sauvegarde {
    position: absolute;
    font-size: var(--size_p);
    color: var(--blanc);
    width: 162px;
    border: 1px solid var(--blanc);
    top: 52%;
    text-transform: uppercase;
    left: 50%;
    transform: translateX(-50%);
    line-height: var(--val_20);
}

.couleur-dispo::before {
    content: "";
    display: inline-block;
    width: 12px;
    height: 12px;
    background: green;
    display: block;
    border-radius: 100%;
    float: left;
    position: absolute;
    left: var(--val_5);
    top: 50%;
    transform: translateY(-50%);
}

.dispo-recap-config {
    position: relative;
    margin-top: var(--val_10);
    height: 24px;
}

.couleur-dispo.rouge::after {
    background: var(--rouge);
}

.couleur-dispo p {
    font-size: var(--size_p);
    float: left;
    padding-left: var(--val_20);
}

    .couleur-dispo p span {
        font-weight: var(--semibold);
    }

.sauvegarde-recap img {
    width: 18px;
}

.sauvegarde-recap {
    position: absolute;
    bottom: 0;
    right: -100px;
}

    .sauvegarde-recap img:first-child {
        margin-right: var(--val_10);
    }

.configurateur .noUi-target {
    background: var(--blanc);
    border-radius: 4px;
    border: 1px solid var(--gris_200);
    box-shadow: none;
    width: 130px;
    margin: 1px auto;
    margin-bottom: 0px;
}

.configurateur #dv_prix {
    margin: 5px 0 0 10px;
    vertical-align: middle;
    display: inline-block;
}

.supp-option {
    position: absolute;
    right: 0px;
    top: 50%;
    transform: translateY(-50%);
    width: 12px;
    height: 16px;
    cursor: pointer;
}

.supprim-option {
    position: absolute;
    top: var(--val_5);
    right: var(--val_5);
    z-index: 12;
    display: none;
}

.couleur-dispo {
    overflow: hidden;
    position: relative;
}


.choix-du-config1 .hexagon-home.anim5 {
    -webkit-animation-name: anim5;
    animation-name: anim5;
    animation-duration: 0.5s;
    animation-fill-mode: both;
}

.choix-bureau-option .anim8 .supprim-option {
    display: none;
}

.choix-du-config1 .hexagon-home.anim5 {
    -webkit-animation-name: anim5;
    animation-name: anim5;
    animation-duration: 0.5s;
    animation-fill-mode: both;
}

.choix-du-config1 .sep-home-li.anim6 {
    -webkit-animation-name: anim6;
    animation-name: anim6;
    animation-duration: 0.5s;
    animation-fill-mode: both;
}

.mode-list.anim-fadeout {
    -webkit-animation-name: anim-fadeout;
    animation-name: anim-fadeout;
    animation-duration: 0.5s;
    animation-fill-mode: both;
}

.choix-du-config1 .hexagon-home.right-anim {
    -webkit-animation-name: right-anim;
    animation-name: right-anim;
    animation-duration: 0.5s;
    animation-delay: 0.6s;
    animation-fill-mode: both;
}

.right-anim-hexa {
    -webkit-animation-name: right-anim-hexa;
    animation-name: right-anim-hexa;
    animation-duration: 0.5s;
    animation-delay: 0.6s;
    animation-fill-mode: both;
}


.anim-fadein {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
    animation-duration: 0.5s;
    animation-delay: 0.6s;
    animation-fill-mode: both;
}

.anim2 {
    -webkit-animation-name: fadeOut;
    animation-name: fadeOut;
    animation-duration: 0.5s;
    animation-fill-mode: both;
}

.hddssd .titre-conf {
    line-height: 14px;
}

.active-confi .supprim-option {
    display: block;
}

.mode-list-conf li .supprim-option img {
    width: 25px !important;
    height: 25px !important;
}

.configurateur .mCSB_scrollTools {
    opacity: 1;
}

.posi-option div {
    z-index: 2;
}

.posi-novice {
    position: absolute;
    right: var(--val_25);
    top: 50%;
    transform: translateY(-50%);
    width: 12px;
    height: 16px;
}

ul .pc-center.posi-novice {
    right: 0;
    background: url(../landing-pages/images/configurateur/pc-center-option-v-f.png) no-repeat center;
    transition: all 0.5s;
    width: 170px;
    height: 196px;
    top: 77%;
}

.choix-bureau .posi-novice .absolute-content {
    position: absolute;
    width: 170px;
    height: 196px;
    right: 0;
    top: 0;
    text-align: center;
}

.price-conf-3x {
    font-size: var(--size_p);
    font-weight: normal;
    color: var(--noir);
    text-align: center
}


    .price-conf-3x span {
        color: #b60e20;
        font-weight: var(--semibold);
        font-size: 16px;
    }

.img-total a:first-child {
    margin-left: 0;
}

.sauvergarder-conf {
    background: var(--gris_200);
    color: var(--blanc);
    text-transform: uppercase;
    font-size: var(--size_p);
    text-align: center;
    margin: var(--marg_5_0);
    line-height: var(--val_20);
    cursor: pointer;
}

.vider-conf {
    text-align: center;
    text-transform: uppercase;
    font-size: var(--size_p);
    cursor: pointer;
    line-height: 16px;
    border: 1px solid var(--blanc);
    color: var(--gris_200);
}

.sauvergarder-conf:hover {
    background: #505050;
}

.vider-conf:hover {
    border: 1px solid var(--gris_200);
}

.txt-list-choix input {
    background: none;
    display: block;
    height: var(--val_30);
    text-align: left;
    white-space: pre-wrap; /* css-3 */
    white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
    white-space: -pre-wrap; /* Opera 4-6 */
    white-space: -o-pre-wrap; /* Opera 7 */
    word-wrap: break-word; /* Internet Explorer 5.5+ */
    cursor: pointer;
    height: 13px;
}

.detail-produit {
    display: none;
}

    .detail-produit.ng-scope {
        position: fixed;
        width: 100%;
        height: 100%;
        top: 0%;
        left: 0%;
        z-index: 9999;
        display: block;
        -webkit-font-smoothing: subpixel-antialiased;
        backface-visibility: hidden;
        -webkit-filter: blur(0);
    }

.background-shadow {
    background: rgba(0,0,0,0.5);
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 9998;
}

.detail-produit-bck {
    background: var(--blanc);
    width: 820px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    padding: 0px;
}

    .detail-produit-bck .close {
        position: absolute;
        top: -18px;
        right: -18px;
        background-image: url(fancybox_sprite.png);
        text-indent: -4000px;
        cursor: pointer;
        height: 36px;
        width: 36px;
    }

    .detail-produit-bck .titre {
        color: var(--blanc);
        line-height: var(--val_35);
        text-transform: uppercase;
        font-size: var(--size_p);
        text-align: center;
        height: var(--val_35);
        font-weight: var(--semibold);
        width: 100%;
        margin: 0 auto;
        overflow: hidden;
        white-space: nowrap;
        background: var(--noir);
    }

    .detail-produit-bck .image {
        width: 38%;
        float: left;
        margin-left: 0px;
    }

        .detail-produit-bck .image img {
            width: auto;
            max-height: 306px;
            margin: 0 auto;
        }

    .detail-produit-bck .right-conf {
        width: 62%;
        float: right;
        overflow: hidden;
        margin-top: var(--val_10);
        margin-bottom: var(--val_10);
    }

.login-cfg .detail-produit-bck .right-conf {
    width: 100%;
    float: none;
}

.mCSB_container {
    width: 100% !important;
}

.choix-bureau .anim-repeat.alerte .absolute-content::after {
    left: var(--val_20);
}

.detail-produit-bck .productParameterGroupsFirst h3 {
    font-weight: var(--semibold);
    width: 225px;
    margin-bottom: var(--val_10);
    text-transform: uppercase;
}

.detail-produit-bck .spec td {
    font-size: var(--size_p);
}

.bt-en-voir-plus div {
    font-size: var(--size_p);
    width: 115px;
    text-transform: uppercase;
    background: url(../landing-pages/images/configurateur/croix-plus.png) no-repeat center top;
    padding-top: var(--val_30);
    font-weight: var(--semibold);
    margin: 0 auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    text-align: center;
}

.choix-bureau .relative-bureau-2 .bureau-conf.anim7 .content-choix {
    display: none;
}




.detail-produit-bck .prix {
    color: #b60e20;
    font-weight: var(--semibold);
    font-size: var(--size_h2);
    margin-top: var(--val_15);
}

.detail-produit-bck .ajouter-config {
    background: #ffcf00 url(/images/hover-bouton.png) no-repeat -500px center;
    border: 1px solid var(--jaune);
    transition: background .5s,color .5s;
    text-transform: uppercase;
    color: var(--gris_200);
    padding: var(--marg_10_20);
    cursor: pointer;
    font-weight: var(--semibold);
    max-width: 240px;
    line-height: initial !important;
    width: 100%;
    text-align: center;
    transition: all 0s;
    font-size: var(--size_p);
    float: left;
    margin-top: var(--val_20);
    clear: both;
}

    .detail-produit-bck .ajouter-config span {
        text-transform: uppercase;
        font-size: var(--size_p);
    }

    .detail-produit-bck .ajouter-config:hover {
        background: #ffcf00 url(/images/hover-bouton.png) no-repeat left center;
    }

.detail-produit-bck .spec div span:first-child {
    font-weight: var(--semibold);
}

.mode-list1 .bt-en-voir-plus div {
    top: 50%;
    left: 0%;
    position: absolute;
    transform: translateY(-50%);
    font-size: var(--size_p);
    width: 300px;
    text-transform: uppercase;
    background: url(../landing-pages/images/configurateur/croix-plus.png) no-repeat 28px top;
    font-weight: var(--semibold);
    padding-left: 9%;
    text-align: left;
    padding-top: 0;
    height: var(--val_25);
    line-height: var(--val_25);
    color: var(--bleu);
}



.recap-configurateur .place-img-conf {
    width: 75px;
    background: none;
    height: 32px;
}

.filtre-conf ul li:last-child {
    margin-right: var(--val_10);
}

.filtre-conf ul {
    display: inline-block;
    vertical-align: middle;
    position: relative;
}

.avoir-plus-dinfo a {
    display: block;
    font-size: var(--size_p);
    font-weight: var(--semibold);
    margin-top: var(--val_15);
    width: auto;
    padding-bottom: 3px;
    text-transform: uppercase;
    border: 1px solid var(--noir);
    line-height: var(--val_20);
    padding: 0 5px;
    width: 240px;
    font-size: var(--size_p);
    text-align: center;
    background: var(--noir);
    color: var(--blanc);
    transition: all 0.5s;
}

    .avoir-plus-dinfo a:hover {
        background: var(--blanc);
        color: var(--noir);
    }

.ram-capa {
    position: absolute;
    left: 42px;
    font-weight: var(--semibold);
    top: 172px;
    font-size: var(--size_h4);
    background: var(--noir);
    padding: 2px 5px;
    color: var(--blanc);
    line-height: 24px;
    z-index: 8;
    border: 1px solid var(--noir);
}

.mode-liste .ram-nb {
    left: 605px;
    top: 50%;
    text-align: center;
    width: 68px;
    transform: translateY(-50%);
}

.mode-liste .ram-capa {
    left: 550px;
    top: 50%;
    transform: translateY(-50%);
}

.mode-liste .mode-list-conf .bt-en-voir-plus {
    height: 70px;
}

.mode-list1 .ram-capa {
    position: absolute;
    left: 63%;
    font-weight: var(--semibold);
    top: 49%;
    font-size: var(--size_h4);
    background: #132643;
    padding: 2px 5px;
    color: var(--blanc);
    line-height: 24px;
    z-index: 2;
    transform: translate(-50%,-50%);
    width: 46px;
    text-align: center;
}

.mode-list1 .ram-nb {
    right: 30%;
    top: 49%;
    z-index: 2;
    background: #132643;
    transform: translate(50%,-50%);
    text-align: center;
}

.ram-nb {
    position: absolute;
    right: 42px;
    font-weight: var(--semibold);
    top: 172px;
    font-size: var(--size_h4);
    background: var(--blanc);
    padding: 2px 5px;
    color: var(--noir);
    line-height: 12px;
    border: 1px solid;
    box-sizing: border-box;
    z-index: 8;
}

    .ram-nb span:last-child {
        display: block;
        font-size: var(--size_p);
        font-weight: normal;
    }

        .ram-nb span:last-child span {
            display: inline-block;
        }

    .ram-nb span span {
        display: inline-block;
    }

#Section4 .mode-mosa li .img-conf-list {
    margin-top: 14px;
}

.novice #Section4 .mode-mosa li .img-conf-list {
    margin-top: var(--val_5);
}

.config-all .config-mid {
    width: 100%;
    height: 340px;
    background: var(--gris_200);
    background-size: cover;
    margin-top: 6px;
    overflow: hidden;
    position: relative;
}

.filtres-configurateur .liste-filtres {
    background: var(--blanc);
    position: absolute;
    top: 34px;
    padding: var(--val_10);
    z-index: 9999;
    font-size: var(--size_p);
    line-height: var(--val_20);
    min-width: 140px;
    border: 1px solid var(--noir);
}

    .filtres-configurateur .liste-filtres div label {
        cursor: pointer;
    }

    .filtres-configurateur .liste-filtres div input {
        cursor: pointer;
    }


.filtres-configurateur .valider {
    background: var(--noir);
    text-align: center;
    font-size: var(--size_p);
    color: var(--blanc);
    text-transform: uppercase;
    margin-top: var(--val_10);
    line-height: var(--val_25);
    cursor: pointer;
}

    .filtres-configurateur .valider:hover {
        background: #282828;
    }



.carac-gaming-courte .proc1 {
    background: url(/images/img-gamer/proc-2.png) no-repeat left center;
    background-size: 17%;
}

.carac-gaming-courte .ram1 {
    background: url(/images/img-gamer/ram-2.png) no-repeat left center;
    background-size: 17%;
}

.carac-gaming-courte .ssd1 {
    background: url(/images/img-gamer/ssd-2.png) no-repeat left center;
    background-size: 17%;
}

.carac-gaming-courte .hdd1 {
    background: url(/images/img-gamer/hdd-2.png) no-repeat left center;
    background-size: 17%;
}

.carac-gaming-courte .cg1 {
    background: url(/images/img-gamer/cg-2.png) no-repeat left center;
    background-size: 17%;
}

.carac-gaming-courte .windows1 {
    background: url(/images/img-gamer/window2-2.png) no-repeat left center;
    background-size: 17%;
}

.livraison-conf {
    background: url(../landing-pages/images/configurateur/livraison.png) no-repeat left center;
    padding-left: 28px;
    background-size: 22px;
    font-size: var(--size_p);
    margin-top: 8px;
    font-weight: var(--semibold);
    text-transform: uppercase;
}

.modifier-conf {
    position: absolute;
    top: 130px;
    color: var(--blanc);
    font-size: var(--size_p);
    background: #132643;
    width: 120px;
    margin: 0 auto 15px;
    text-transform: uppercase;
    line-height: var(--val_25);
    transform: translateX(-50%);
    left: 50%;
    z-index: 1000;
    display: none;
    height: var(--val_25);
}

.posi-option:hover .modifier-conf {
    display: block;
}

.modifier-conf:hover {
    background: #425169;
}

.img-fin-compo {
    width: 30%;
    float: left;
    margin-left: 0%;
}

    .img-fin-compo img {
        width: 100%;
    }

.fin-compo {
    width: 68%;
    float: right;
    margin-top: var(--val_30);
    margin-right: 2%;
}

.txt-fin-compo {
    font-size: var(--size_p);
    padding-bottom: 4px;
    border-bottom: 1px solid var(--noir);
    margin-bottom: var(--val_15);
    font-weight: 800;
    text-transform: uppercase;
}

.conf-bouton-compo {
    clear: both;
    width: 100%;
    margin-bottom: var(--val_10);
    overflow: hidden;
}

    .conf-bouton-compo .modifier-confi {
        float: left;
    }

    .conf-bouton-compo .ajouter-config {
        float: right;
        position: relative;
        margin-right: 2%;
        bottom: 0;
        width: auto;
        right: 0;
        width: 230px;
        line-height: var(--val_20);
        font-size: var(--size_p);
        clear: none;
        margin-top: 0;
    }

.modifier-confi {
    width: auto;
    background: var(--noir);
    color: var(--blanc);
    text-align: center;
    text-transform: uppercase;
    line-height: var(--val_30);
    margin: 4px 0 4px 10%;
    padding: 0 5px;
    font-size: var(--size_p);
    cursor: pointer;
}

    .modifier-confi:hover {
        background: var(--gris_200);
    }

.phrase-montage {
    font-size: var(--size_p);
    text-align: right;
}

    .phrase-montage span {
        font-weight: var(--semibold);
        font-size: 16px;
    }

.prix-deconfig {
    color: #b60e20;
    font-weight: var(--semibold);
    font-size: var(--size_h3);
    float: right;
    clear: both;
    width: 100%;
    text-align: right;
    margin-bottom: var(--val_10);
}

.modifier-confi span {
    text-transform: uppercase;
    line-height: var(--val_30);
}

.prix-deconfig p span {
    font-size: var(--size_p);
    display: block;
}

.partage-config .modifier-confi {
    position: absolute;
    bottom: 50px;
    left: 31%;
    width: 100px;
    text-align: center;
}

.prix-deconfig p {
    font-size: var(--size_p);
    display: inline-block;
    vertical-align: middle;
}

.fin-compo .switch {
    margin-top: var(--val_5);
}

.phrase-montage .garanti-montage {
    font-size: var(--size_p);
    font-weight: normal;
}

.slot {
    font-size: var(--size_p);
    margin-top: var(--val_20);
    font-weight: var(--semibold);
}


.slot-1 {
    border: 1px solid var(--noir);
    float: left;
    text-transform: uppercase;
    font-family: 'Outfit', sans-serif;
    font-size: var(--size_p);
    padding-right: var(--val_20);
    line-height: 27px;
    padding-left: var(--val_5);
    cursor: pointer;
    background: url(../landing-pages/images/configurateur/filte-fleche.png) no-repeat 95% center;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    height: 27px;
    font-weight: var(--semibold);
    width: 200px;
    text-align: center;
    margin-bottom: var(--val_5);
    margin-top: var(--val_5);
}

.disque-cfg .slot-1 {
    width: 108px;
}

.prix-calc {
    display: block;
    float: none;
    clear: both;
    margin-top: var(--val_5);
    font-size: var(--size_p);
    font-weight: var(--semibold);
}

    .prix-calc span {
        color: #b60e20;
        font-weight: var(--semibold);
        font-size: var(--val_20);
    }

.ajouter-config.slot-2 {
    background: var(--noir);
    color: var(--blanc);
    text-align: center;
    text-transform: uppercase;
    font-size: var(--size_p);
    cursor: pointer;
    height: 55px;
    border: 1px solid var(--noir);
    line-height: 17px;
    float: left;
}

.detail-produit-bck .ajouter-config.slot-3 {
    font-size: var(--size_p);
    line-height: 17px;
    height: 55px;
    float: right;
    clear: none;
    margin-right: var(--val_10);
}

.detail-produit-bck .ajouter-config.slot-2:hover {
    background: black url(/images/hover-bouton.png) no-repeat left center;
}

.background-shadow .loading {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 200px;
}

.filtres-configurateur .liste-filtres {
    display: none;
}

.detail-produit-bck .spec div span {
    font-size: var(--size_p);
}

.detail-produit-bck .spec div {
    width: 320px;
    line-height: 12px;
}

.choix-bureau .absolute-content img.img-choix-default {
    max-width: 125px;
    max-height: 125px;
    width: 125px;
    vertical-align: middle;
}

.img-choix-hover-2 {
    display: none !important;
}

.slot-4 {
    width: 290px;
    color: var(--rouge);
    font-size: var(--size_p);
    margin-top: var(--val_5);
}

.valider-config {
    position: absolute;
    background: var(--jaune);
    color: var(--noir);
    text-align: center;
    text-transform: uppercase;
    font-weight: var(--semibold);
    line-height: var(--val_30);
    z-index: 5000;
    transform: translateX(-50%);
    cursor: pointer;
    font-size: var(--size_h3);
    left: 85.8%;
    top: 58.6%;
    height: 221px;
    width: 172px;
    box-sizing: border-box;
    padding: 64px 0px 0 0px;
}

    .valider-config.sauvergade-config {
        position: static;
        top: var(--val_10);
        background: #ffcf00 !important;
        color: var(--noir);
        width: auto;
        text-align: center;
        text-transform: uppercase;
        font-weight: var(--semibold);
        line-height: var(--val_30);
        z-index: 5000;
        transform: translateX(0%);
        cursor: pointer;
        display: block;
        clear: both;
        padding: 0;
        height: auto;
        border: none;
        box-sizing: border-box;
        line-height: var(--val_40);
        font-size: var(--size_h4);
        position: initial;
        float: none;
    }



        .valider-config.sauvergade-config:hover {
            background: #ffcf00 url(/images/hover-bouton.png) no-repeat left center;
        }


.novice .valider-config div {
    position: absolute;
    top: 50%;
    color: var(--noir);
    text-align: center;
    text-transform: uppercase;
    font-weight: var(--semibold);
    left: 50%;
    transform: translate(-50%,-50%);
    cursor: pointer;
    font-size: var(--size_h4);
    width: 100%;
}

.prix-recap.frais {
    float: right;
    margin-top: var(--val_10);
    clear: both;
    font-size: var(--size_p);
}

    .prix-recap.frais p {
        display: inline-block;
        vertical-align: middle;
    }

    .prix-recap.frais span {
        font-weight: var(--semibold);
        width: 130px;
        display: inline-block;
        text-align: right;
        font-size: var(--size_p);
        vertical-align: middle;
    }

.prix-deconfig span.ng-binding {
    width: 130px;
    display: inline-block;
    text-align: right;
}

.prix-recap.frais.verif-conf {
    width: 100%;
    float: right;
    text-align: right;
    margin-top: var(--val_10);
    margin-bottom: var(--val_10);
}

    .prix-recap.frais.verif-conf p {
        width: 215px;
        text-align: right;
    }


    .prix-recap.frais.verif-conf span {
        background: url(../landing-pages/images/configurateur/check-mark.png)no-repeat right center;
        text-indent: -5000px;
        font-size: 0;
        height: var(--val_25);
        background-size: var(--val_25);
    }

.produit-selected-del .supprim-option {
    display: block;
}



.txt-fin-compo span {
    display: block;
    font-size: var(--size_p);
    font-weight: normal;
}

.mode-listmosa li:nth-child(2n) .produit-selected-del .supprim-option::after {
    top: 7px;
    left: -9px;
}

.mode-listmosa li:nth-child(2n) .produit-selected-del .supprim-option {
    top: 165px;
    left: 220px;
}






ul .posi-option.pc-center.sauve-valide {
    transition: transform 0.5s;
    padding: 0 10px;
}



.passer-option .recap-go {
    color: var(--blanc);
    display: block;
}

    .passer-option .recap-go.action {
        display: none;
    }


.mCSB_scrollTools.mCSB_scrollTools_horizontal {
    height: 28px;
}

body.configurateur .news_cont {
    display: none;
}

.plop-gamer {
    background: var(--blanc);
    background-attachment: fixed;
    background-size: cover;
}

    .plop-gamer .choix-bureau .sep-home {
        background: var(--blanc);
    }

    .plop-gamer .txt-option-config p {
        color: var(--noir);
    }

.txt-option-config .titre-config {
    border: none;
    color: var(--noir);
    font-size: 34px;
    font-weight: 900;
    text-align: left;
    line-height: inherit;
    margin: 0;
}

.plop-gamer .active-conf .titre-conf {
    background: none;
    color: var(--noir);
    font-weight: var(--semibold);
}

.choix-bureau .relative-bureau-2 .bureau-conf.active-conf .content-choix {
    display: none;
}


.plop-gamer .filtre-conf li .filtres-configurateur .titre-filtres {
    border: 1px solid var(--noir);
    color: var(--noir);
    background: url(../landing-pages/images/configurateur/filte-fleche.png) no-repeat 95% center;
}

.plop-gamer .filtre-conf .tri-mos {
    border: 1px solid var(--noir);
    color: var(--noir);
    background: var(--blanc);
}

    .plop-gamer .filtre-conf .tri-mos p {
        color: var(--noir);
    }

.configurateur.plop-gamer .product_masked {
    color: var(--noir);
}



.options .anim7 {
    display: none;
}







.plop-gamer.recap-configurateur {
    overflow: hidden;
}

    .plop-gamer.recap-configurateur .sep-home {
        background: var(--blanc);
    }

.plop-gamer .tri-mos .mos-is-mobile.sactive,
.plop-gamer .tri-mos .mos.sactive {
    background: url(../landing-pages/images/configurateur/mode-mosa-j.png) no-repeat left center;
}

.plop-gamer .tri-mos .mos:hover {
    background: url(../landing-pages/images/configurateur/mode-mosa-j.png) no-repeat left center;
}

.plop-gamer .tri-mos div div:hover {
    color: var(--jaune);
}

.plop-gamer .tri-mos .list:hover {
    background: url(../landing-pages/images/configurateur/mode-list-h-j.png) no-repeat 5px center;
}

.plop-gamer .filtre-conf .list-is-mobile.sactive,
.plop-gamer .filtre-conf .list.sactive {
    background: url(../landing-pages/images/configurateur/mode-list-h-j.png) no-repeat 5px center;
}

.plop-gamer .filtre-conf .filtre-conf.filtre_on {
    color: var(--noir);
    background: var(--jaune);
}




.liste-filtres-close {
    display: none;
}

.detail-produit-bck #formulaire_login {
    background: none;
    border: none;
    box-shadow: none;
    width: 300px;
    margin: 0 auto;
    text-align: center
}

    .detail-produit-bck #formulaire_login input {
        margin: 5px 0px 0;
        padding: var(--val_5);
        width: 288px;
        border: 1px solid gray;
    }

    .detail-produit-bck #formulaire_login .ui-mini input {
        width: 300px;
        cursor: pointer;
    }

.detail-produit-bck .sep-compte {
    margin: 10px auto;
}

.detail-produit-bck .btn_mpd {
    display: block;
    padding-left: 0;
    text-align: center;
}

.detail-produit-bck .choix-bureau .bureau-conf {
    float: none;
    width: 100%;
    text-align: center;
}

.plop-gamer .valider-config {
    background: url(../landing-pages/images/configurateur/pc-center-option-v-j2.png) no-repeat center;
    color: var(--noir);
}

.valider-config {
    background: url(../landing-pages/images/configurateur/pc-center-option-v-j2.png) no-repeat center;
    color: var(--noir);
}

.step .price-conf-inte {
    display: none !important;
}


.noUi-handle-lower .noUi-tooltip {
    bottom: -26px;
}

.alerte-modif-produit .right-conf p {
    font-size: var(--size_p);
}

.alerte-modif-produit .detail-produit-bck .right-conf {
    width: 50%;
    float: right;
    margin-top: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 8%;
}

.alerte-modif-produit .right-conf .souhaite-conti {
    font-size: 16px;
    font-weight: var(--semibold);
    margin-top: var(--val_15);
}

.alerte-modif-produit .detail-produit-bck .ajouter-config {
    background: #ffcf00 url(/images/hover-bouton.png) no-repeat -500px center;
    border: 1px solid var(--jaune);
    transition: background .5s,color .5s;
    text-transform: uppercase;
    color: var(--gris_200);
    padding: var(--marg_0_20);
    cursor: pointer;
    font-weight: var(--semibold);
    line-height: 38px;
    width: 100px;
    text-align: center;
    bottom: -60px;
    transition: all 0s;
    left: 0;
}

    .alerte-modif-produit .detail-produit-bck .ajouter-config:last-child {
        background: var(--noir);
        border: 1px solid var(--noir);
        transition: background .5s,color .5s;
        text-transform: uppercase;
        color: var(--gris_200);
        padding: var(--marg_0_20);
        cursor: pointer;
        font-weight: var(--semibold);
        line-height: 38px;
        width: 100px;
        text-align: center;
        bottom: -60px;
        transition: all 0s;
        left: 150px;
        color: var(--blanc);
        clear: none;
        margin-left: var(--val_10);
    }

        .alerte-modif-produit .detail-produit-bck .ajouter-config:last-child:hover {
            background: #282828 url(/images/hover-bouton.png) no-repeat left center;
        }

        .alerte-modif-produit .detail-produit-bck .ajouter-config:last-child a {
            color: var(--blanc);
        }

    .alerte-modif-produit .detail-produit-bck .ajouter-config:hover {
        background: #ffcf00 url(/images/hover-bouton.png) no-repeat left center;
    }

.pas-decompo .detail-produit-bck .right-conf {
    float: none;
    text-align: center;
    margin: 115px auto;
    font-weight: var(--semibold);
}

.pas-decompo .detail-produit-bck .ajouter-config {
    margin: 15px auto 0;
    float: none;
}

.rea-compo .detail-produit-bck .right-conf {
    float: none;
    text-align: center;
    margin: 115px auto;
    font-weight: var(--semibold);
}

.rea-compo .detail-produit-bck .ajouter-config {
    position: absolute;
    width: 100px;
    bottom: 52px;
    left: 53%;
}

.confirm-save-config {
    color: rgb(255, 255, 255);
    width: 100%;
    background: rgba(0,0,0,0.9);
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    text-align: center;
}

    .confirm-save-config span {
        position: fixed;
        top: 50%;
        font-size: var(--size_h4);
        font-weight: var(--semibold);
        left: 50%;
        text-transform: uppercase;
        transform: translate(-50%,-50%);
    }

.compatible .compatible::before {
    background: url(../landing-pages/images/configurateur/good.png) no-repeat;
    content: "";
    display: block;
    position: absolute;
    top: 2px;
    right: 2px;
    width: var(--val_25);
    height: var(--val_25);
    z-index: 5;
}

.novice .compatible .compatible {
    display: none;
}



.plop-gamer .compatible .compatible::before {
    border-radius: 100%;
}



.no-compatible .no-compatible::before {
    background: #ff6100 url(../landing-pages/images/configurateur/warning-2.png) no-repeat 4px 3px;
    display: block;
    position: absolute;
    top: 2px;
    right: 2px;
    width: var(--val_25);
    height: var(--val_25);
    z-index: 5;
    background-size: 18px;
    content: "";
    border-radius: 100%;
}





.plop-gamer .compatible .compatible::after {
}

.no-compatible:nth-child(2n) .no-compatible:after {
    top: 160px;
    left: 32px;
    transform: rotate(45deg);
}

.no-compatible .no-compatible::after {
    background: #ff6100;
    content: "";
    display: block;
    transform: rotate(-45deg);
    position: absolute;
    top: 0px;
    right: 0px;
    width: 2px;
    height: var(--val_25);
    z-index: -1;
}

.plop-gamer .no-compatible .no-compatible::after {
    background: var(--jaune);
}

.no-compatible:nth-child(2n) .no-compatible:after {
    top: 160px;
    left: 32px;
    transform: rotate(45deg);
}



.novice li.gta {
    background: url(../landing-pages/images/configurateur/jeux/gta.png) no-repeat !important;
}

.novice li.battlefield5 {
    background: url(../landing-pages/images/configurateur/jeux/battlefield5.png) no-repeat !important;
}

.novice li.callofduty {
    background: url(../landing-pages/images/configurateur/jeux/call-of.jpg) no-repeat !important;
}

.novice li.rocket {
    background: url(../landing-pages/images/configurateur/jeux/rocket.png) no-repeat !important;
}

.novice li.fortnite {
    background: url(../landing-pages/images/configurateur/jeux/fortnite.png) no-repeat !important;
}

.novice li.lol {
    background: url(../landing-pages/images/configurateur/jeux/lol.png) no-repeat !important;
}

.novice li.csgo {
    background: url(../landing-pages/images/configurateur/jeux/csgo.png) no-repeat !important;
}

.novice li.wow {
    background: url(../landing-pages/images/configurateur/jeux/wow.png) no-repeat !important;
}


.novice li.fifa {
    background: url(../landing-pages/images/configurateur/jeux/fifa.png) no-repeat !important;
}

.novice li.rainbow {
    background: url(../landing-pages/images/configurateur/jeux/rainbow.png) no-repeat !important;
}

.novice li.dota2 {
    background: url(../landing-pages/images/configurateur/jeux/dota2.png) no-repeat !important;
}

.novice li.fallout {
    background: url(../landing-pages/images/configurateur/jeux/fallout.png) no-repeat !important;
}

.novice li.tombraider {
    background: url(../landing-pages/images/configurateur/jeux/tombraider.png) no-repeat !important;
}

.novice li.assassin {
    background: url(../landing-pages/images/configurateur/jeux/assassin.png) no-repeat !important;
}

.novice li.flight {
    background: url(../landing-pages/images/configurateur/jeux/flight.png) no-repeat !important;
}

.novice li.blender {
    background: url(../landing-pages/images/configurateur/jeux/blender.png) no-repeat !important;
}

.novice li.adobe {
    background: url(../landing-pages/images/configurateur/jeux/adobe.png) no-repeat !important;
}

.novice li.thedivision {
    background: url(../landing-pages/images/configurateur/jeux/the-division2.png) no-repeat !important;
}

.novice li.apex {
    background: url(../landing-pages/images/configurateur/jeux/apex.png) no-repeat !important;
}

.novice li.protools {
    background: url(../landing-pages/images/configurateur/jeux/protools.png) no-repeat !important;
}

.novice li.archicad {
    background: url(../landing-pages/images/configurateur/jeux/archicad.png) no-repeat !important;
}

.novice li.autocad {
    background: url(../landing-pages/images/configurateur/jeux/autocad.png) no-repeat !important;
}

.novice li.cinema4d {
    background: url(../landing-pages/images/configurateur/jeux/cinema4d.png) no-repeat !important;
}

.novice li.cubase {
    background: url(../landing-pages/images/configurateur/jeux/cubase.png) no-repeat !important;
}


.novice li.office {
    background: url(../landing-pages/images/configurateur/jeux/office.png) no-repeat !important;
}

.novice li.google {
    background: url(../landing-pages/images/configurateur/jeux/google.png) no-repeat !important;
}


.novice li.compta {
    background: url(../landing-pages/images/configurateur/jeux/compta.png) no-repeat !important;
}

.novice li.vocal {
    background: url(../landing-pages/images/configurateur/jeux/vocal.png) no-repeat !important;
}

.novice li.amongus {
    background: url(../landing-pages/images/configurateur/jeux/among-us.jpg) no-repeat !important;
}

.novice li.cyberpunk {
    background: url(../landing-pages/images/configurateur/jeux/cyberpunk.jpg) no-repeat !important;
}

.novice li.fallguys {
    background: url(../landing-pages/images/configurateur/jeux/fall-guys.jpg) no-repeat !important;
}

.novice li.assassincreed {
    background: url(../landing-pages/images/configurateur/jeux/assassin.jpg) no-repeat !important;
}

.novice li.flightsimulator {
    background: url(../landing-pages/images/configurateur/jeux/flight-simulator.jpg) no-repeat !important;
    margin-top: 0;
}

.novice .mode-list1 li.gta {
    background: url(../landing-pages/images/configurateur/jeux/gta.png) no-repeat !important;
}

.novice .mode-list1 li.battlefield5 {
    background: url(../landing-pages/images/configurateur/jeux/battlefield5.png) no-repeat !important;
}

.novice .mode-list1 li.rocket {
    background: url(../landing-pages/images/configurateur/jeux/rocket.png) no-repeat !important;
}

.novice .mode-list1 li.fortnite {
    background: url(../landing-pages/images/configurateur/jeux/fortnite.png) no-repeat !important;
}

.novice .mode-list1 li.lol {
    background: url(../landing-pages/images/configurateur/jeux/lol.png) no-repeat !important;
}

.novice .mode-list1 li.csgo {
    background: url(../landing-pages/images/configurateur/jeux/csgo.png) no-repeat !important;
}

.novice .mode-list1 li.wow {
    background: url(../landing-pages/images/configurateur/jeux/wow.png) no-repeat !important;
}


.novice .mode-list1 li.fifa {
    background: url(../landing-pages/images/configurateur/jeux/fifa.png) no-repeat !important;
}

.novice .mode-list1 li.rainbow {
    background: url(../landing-pages/images/configurateur/jeux/rainbow.png) no-repeat !important;
}

.novice .mode-list1 li.dota2 {
    background: url(../landing-pages/images/configurateur/jeux/dota2.png) no-repeat !important;
}

.novice .mode-list1 li.fallout {
    background: url(../landing-pages/images/configurateur/jeux/fallout.png) no-repeat !important;
}

.novice .mode-list1 li.tombraider {
    background: url(../landing-pages/images/configurateur/jeux/tombraider.png) no-repeat !important;
}

.novice .mode-list1 li.assassincreed {
    background: url(../landing-pages/images/configurateur/jeux/assassin.jpg) no-repeat !important;
}

.novice .mode-list1 li.blender {
    background: url(../landing-pages/images/configurateur/jeux/blender.png) no-repeat !important;
}

.novice .mode-list1 li.adobe {
    background: url(../landing-pages/images/configurateur/jeux/adobe.png) no-repeat !important;
}

.novice .mode-list1 li.protools {
    background: url(../landing-pages/images/configurateur/jeux/protools.png) no-repeat !important;
}

.novice .mode-list1 li.archicad {
    background: url(../landing-pages/images/configurateur/jeux/archicad.png) no-repeat !important;
}

.novice .mode-list1 li.autocad {
    background: url(../landing-pages/images/configurateur/jeux/autocad.png) no-repeat !important;
}

.novice .mode-list1 li.cinema4d {
    background: url(../landing-pages/images/configurateur/jeux/cinema4d.png) no-repeat !important;
}

.novice .mode-list1 li.cubase {
    background: url(../landing-pages/images/configurateur/jeux/cubase.png) no-repeat !important;
}


.novice .mode-list1 li.office {
    background: url(../landing-pages/images/configurateur/jeux/office.png) no-repeat !important;
}

.novice .mode-list1 li.google {
    background: url(../landing-pages/images/configurateur/jeux/google.png) no-repeat !important;
}


.novice .mode-list1 li.compta {
    background: url(../landing-pages/images/configurateur/jeux/compta.png) no-repeat !important;
}

.novice .mode-list1 li.vocal {
    background: url(../landing-pages/images/configurateur/jeux/vocal.png) no-repeat !important;
}

.novice .mode-list1 li.amongus {
    background: url(../landing-pages/images/configurateur/jeux/among-us.jpg) no-repeat !important;
}

.novice .mode-list1 li.cyberpunk {
    background: url(../landing-pages/images/configurateur/jeux/cyberpunk.jpg) no-repeat !important;
}

.novice .mode-list1 li.fallguys {
    background: url(../landing-pages/images/configurateur/jeux/fall-guys.jpg) no-repeat !important;
}

.novice .mode-list1 li.flightsimulator {
    background: url(../landing-pages/images/configurateur/jeux/flight-simulator.jpg) no-repeat !important;
}


.mode-mosa.jeux li .titre-conf-inte {
    line-height: 24px;
    font-weight: var(--semibold);
    font-size: var(--size_p);
    border-radius: 15px 15px 0 0;
}

.rea-compo p {
    font-size: var(--size_p);
}


    .rea-compo p span {
        font-size: var(--size_p);
        font-weight: normal;
    }

    .rea-compo p span {
        font-size: var(--size_p);
        font-weight: normal;
    }

.rea-compo .detail-produit-bck .ajouter-config10 {
    left: 30%;
}

.rea-compo .detail-produit-bck .ajouter-config11 {
    background: #282828;
    border: 1px solid var(--noir);
}

    .rea-compo .detail-produit-bck .ajouter-config11 span {
        color: var(--blanc);
    }

    .rea-compo .detail-produit-bck .ajouter-config11:hover {
        background: black url(/images/hover-bouton.png) no-repeat left center;
    }

.pas-decompo p span {
    font-weight: normal;
    font-size: var(--size_p);
}

.alerte-modif-produit .detail-produit-bck .image {
    width: 30%;
    float: left;
    margin-left: 82px;
}

    .alerte-modif-produit .detail-produit-bck .image img {
        width: auto;
        max-height: 150px;
        clear: both;
        display: block;
        margin: 0 auto 8px;
    }

    .alerte-modif-produit .detail-produit-bck .image:after {
        position: absolute;
        content: "";
        display: block;
        background: url(../landing-pages/images/configurateur/recycling.png) no-repeat;
        background-size: var(--val_30);
        width: var(--val_30);
        height: var(--val_30);
        top: 47%;
        left: 25%;
    }

.novice .passer-avance {
    left: 87%;
    background: url(../landing-pages/images/configurateur/pc-center-option-v-f.png) no-repeat center;
    width: 170px;
    height: 196px;
    top: 56%;
    position: absolute;
    color: white
}

    .novice .passer-avance a {
        text-transform: uppercase;
        color: var(--blanc);
        font-weight: var(--semibold);
        position: absolute;
        top: 38%;
        left: 50%;
        transform: translateX(-50%);
        width: 130px;
        line-height: 18px;
        font-size: var(--size_h4);
        text-align: center;
    }


.novice .titre-conf-inte {
    font-size: var(--size_p);
    text-transform: uppercase;
    margin-top: var(--val_10);
    line-height: 24px;
}

    .novice .titre-conf-inte span {
        text-transform: uppercase;
    }

.novice #Section2 .titre-conf-inte {
    display: none;
}

.novice #Section2 .auto-choix-2 .titre-conf-inte {
    display: block;
}

.novice .mode-list-conf li {
    height: 282px;
    background-size: 100% 100% !important;
}

.novice #Section9 .mode-list-conf li {
    height: 315px;
}

.novice .mode-list-conf ul {
    font-size: 0;
}

.novice .choix-prix-configu .mode-mosa li img {
    max-height: 144px !important;
    max-width: 144px !important;
}

.image-pre .spec {
    font-size: var(--size_p);
    position: absolute;
    top: 50%;
    transform: translateY(-50%)
}

    .image-pre .spec strong {
        display: inline-block;
        margin-top: var(--val_20);
    }

.image-pre .detail-produit-bck .right-conf {
    width: 60%;
    float: right;
    margin-top: var(--val_10);
}

.image-pre .modifier-confi {
    text-align: center;
    text-transform: uppercase;
    line-height: var(--val_30);
    padding: 0 5px;
    font-size: var(--size_p);
    cursor: pointer;
    position: absolute;
    bottom: 50px;
    left: 47%;
    transform: translateX(-50%);
    background: var(--jaune);
    color: var(--noir);
    font-weight: var(--semibold);
    width: 100px;
    margin: 0;
}

    .image-pre .modifier-confi:hover {
        background: #ffcf00 url(/images/hover-bouton.png) no-repeat left center;
    }

.novice .mode-mosa.jeux li img {
    display: none;
}

.novice .choix-hddssd .mode-mosa li img, .novice .choix-boitier .mode-mosa li img {
    max-height: 110px !important;
    max-width: 110px !important;
}

.h100 {
    height: 100%;
}



.novice .no-compatible .no-compatible::before {
    background: #ff6100 url(../landing-pages/images/configurateur/warning-2.png) no-repeat center;
    content: "";
    display: block;
    position: absolute;
    top: 2px;
    right: 2px;
    width: var(--val_35);
    height: var(--val_35);
    background-size: 70%;
    border: 2px solid #ff6100;
}

.novice .choix-prix-configu .mode-mosa li.auto-choix img {
    width: 144px;
    margin-top: 4px;
    margin-bottom: var(--val_10);
}

.ferme2 .modifier-confi {
    width: 200px;
    background: var(--noir);
    color: var(--blanc);
    text-align: center;
    text-transform: uppercase;
    line-height: var(--val_30);
    margin: 4px 0 4px 0%;
    padding: 0 5px;
    font-weight: var(--semibold);
    font-size: var(--size_p);
    position: absolute;
    bottom: var(--val_30);
    left: 50%;
    transform: translateX(-50%);
}

.ferme2 .detail-produit-bck .right-conf {
    width: 58%;
    float: right;
    margin-top: var(--val_10);
    margin-right: 5%;
}

.ferme2 .absolute-content img {
    display: block !important;
}


.novice #step-1096 .produit-novice {
    display: none !important;
}

.plop-gaming .choix-jeux-termine {
    top: 16px;
}

.choix-jeux-termine:hover {
    background: #ffcf00 url(/images/hover-bouton.png) no-repeat left center;
}

.novice .price-conf-inte.prix-fourchette {
    color: #b60e20;
    font-size: 16px;
    font-weight: var(--semibold);
    width: auto;
    margin: 0px auto 0;
    line-height: 16px;
}

.legend-no p {
    display: inline-block;
    vertical-align: middle;
}

.novice .legend-no p {
    color: var(--noir);
}

.novice .recap-conf .img-fil-config {
    background: var(--jaune);
    float: left;
    margin: 0 0px 0 2px;
    padding: 0 5px;
    line-height: 42px;
}

.novice .recap-conf .txt-fil-config {
    padding-right: 0;
}



.novice .price-conf-inte {
    font-size: 16px;
}

.pas-decompo strong {
    font-size: var(--val_20);
}

.novice .recap-produit-conf {
    width: 100%;
    right: 0;
}

.novice .liblle-recap {
    width: 170px;
}

.choix-bureau .bureau-conf.valider {
    background: url(../landing-pages/images/configurateur/pc-center-option-v-g2.png) no-repeat center center;
    position: absolute;
    color: var(--noir);
    text-align: center;
    text-transform: uppercase;
    font-weight: var(--semibold);
    line-height: var(--val_30);
    z-index: 5000;
    transform: translateX(-50%);
    cursor: pointer;
    font-size: var(--size_h3);
    left: 92.5%;
    top: 53.7%;
    height: 221px;
    width: 172px;
    box-sizing: border-box;
}

.valider .titre-conf {
    top: 50%;
    height: auto;
    line-height: var(--val_30);
    font-size: var(--size_h3);
    transform: translate(-50%,-50%);
    background: none;
}



.plop-gamer .choix-bureau .bureau-conf.valider.active-conf .content-choix {
    background: none;
}

.choix-bureau .valider .absolute-content {
    height: 221px;
    width: 172px;
}

.novice .fil-ariane-config .recap-produit-conf li {
    height: 24px;
    float: none;
    z-index: 2;
    margin-right: 0px;
    font-size: var(--size_p);
    line-height: 24px;
    font-style: italic;
    width: 255px;
}

.novice .legend-no {
    color: var(--blanc);
    display: inline-block;
    vertical-align: middle;
    font-size: var(--size_p);
}

.novice.plop-gamer .legend-no {
    color: var(--blanc);
    display: inline-block;
    vertical-align: middle;
    font-size: var(--size_p);
}

.legend-no img {
    width: var(--val_30);
    display: inline-block;
    vertical-align: middle;
    margin-right: var(--val_5);
    background: #ff6100;
    padding: var(--val_5);
    border-radius: 37%;
}

.legend-no {
    float: right;
}

.novice .legend-no {
    color: var(--noir);
    display: inline-block;
    vertical-align: middle;
    font-size: var(--size_p);
}

.laisser-message {
    position: fixed;
    right: 50px;
    background: var(--blanc);
    border-radius: 10px 10px 0 0;
    bottom: -304px;
    transition: bottom 0.5s;
    border: 1px solid var(--noir);
    z-index: 9999;
}

.phone-mail {
    z-index: 9999;
    position: fixed;
    right: var(--val_10);
    bottom: var(--val_30);
}

    .phone-mail div.hover,
    .phone-mail div:hover {
        background: var(--jaune);
    }

    .phone-mail div {
        background: #818181;
        width: 36px;
        border-radius: 100%;
        margin-top: var(--val_10);
        height: 36px;
        line-height: var(--val_35);
        vertical-align: middle;
        text-align: center;
        cursor: pointer;
    }

.laisser-message2 .text-message {
    font-size: var(--size_p);
    font-family: "Montserrat";
    padding: 0 10px;
}

.laisser-message2 .info-message {
    font-size: var(--size_p);
    margin-top: var(--val_20);
    margin-bottom: var(--val_10);
    font-style: italic;
}

.laisser-message2 .text-message span {
    font-weight: var(--semibold);
}

.phone-mail img {
    vertical-align: middle;
}

.laisser-message {
    position: fixed;
    right: 50px;
    background: var(--blanc);
    border-radius: var(--val_10);
    bottom: var(--val_30);
    transition: bottom 0.5s;
    border: 1px solid var(--noir);
    z-index: 9999;
    box-shadow: 2px 3px 3px var(--noir);
    width: 326px;
    display: none;
}

    .laisser-message .leave-message {
        position: absolute;
        top: 8px;
        right: var(--val_10);
        width: var(--val_20);
        height: var(--val_20);
        background: url(/images/leave.png) no-repeat;
        cursor: pointer;
    }

.novice .hddssd .titre-conf {
    line-height: var(--val_25);
    font-size: var(--size_p);
}

.laisser-message.nobottom {
    bottom: var(--val_30);
}

.laisser-message .list-fields {
    padding: 0 10px;
    margin-bottom: var(--val_10);
}

.laisser-message input.errorc,
.laisser-message textarea.errorc {
    border-color: #f00;
}

.laisser-message input {
    border: 1px solid var(--noir);
    display: block;
    line-height: 24px;
    width: 195px;
    padding: 2px 5px;
}

.laisser-message label {
    display: block;
    margin-bottom: 3px;
    font-size: var(--size_p);
}

.laisser-message textarea {
    width: 100%;
    box-sizing: border-box;
    padding: 2px 5px;
    border: 1px solid var(--noir);
    height: 139px;
}

.laisser-message .titre-message {
    background: var(--jaune);
    color: var(--noir);
    text-transform: uppercase;
    font-size: var(--size_p);
    text-align: left;
    font-weight: var(--semibold);
    border-radius: 10px 10px 0 0;
    background-size: var(--val_20);
    border-bottom: 1px solid var(--noir);
    margin-bottom: var(--val_10);
    font-family: "Montserrat";
    padding: 4px 0px 4px 10px;
}

.gotop {
    top: 68px;
}

.message-left {
    float: left;
    width: 48%;
}

.message-right {
    float: right;
    width: 48%;
}

.laisser-message input {
    width: 100%;
    box-sizing: border-box;
    font-size: var(--size_p);
}

#mess-msg {
    font-size: var(--size_p);
}

.message-left div {
    margin-bottom: var(--val_10);
}

.laisser-message .button {
    clear: both;
}

    .laisser-message .button button {
        text-align: center;
        background: var(--jaune);
        color: var(--noir);
        box-shadow: none;
        font-size: 16px;
        text-transform: uppercase;
        font-weight: var(--semibold);
        font-family: 'Outfit', sans-serif;
        width: 207px;
        line-height: var(--val_25);
        border: 1px solid var(--noir);
        margin-top: var(--val_10);
        cursor: pointer;
    }

        .laisser-message .button button:hover {
            background: #ffcf00 url(/images/hover-bouton.png) no-repeat left center;
        }

.rea-compo strong {
    font-size: var(--val_20);
}

.rea-compo p {
    font-size: 16px;
}

.partage-config .right-conf {
    margin-right: 5%;
}

.partage-config .modifier-confi {
    position: absolute;
    bottom: 50px;
    left: 36%;
    width: 100px;
    text-align: center;
}

.novice .tri-mos {
    display: none;
}

.recap-produit-conf sup {
    font-size: var(--size_h6);
    vertical-align: top;
}

.bt-filtre-mob {
    display: inline-block;
}

.ferme2 .spec {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 50%;
}

.ferme2 .choix-bureau .sep-home-li {
    display: none;
}

.background-shadow-filtre {
    display: none;
    background-color: transparent;
}

.partage-config .spec {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 46%;
}

.detail-produit .menu_fiche_produit .prodfiche_dispo {
    position: relative;
    left: 0;
    padding-left: var(--val_25);
    background-position: 5px center;
    padding-right: var(--val_5);
    display: inline-block;
    margin-top: 0;
    margin-bottom: 0;
    height: var(--val_20);
    line-height: var(--val_20);
    padding-top: 0;
    padding-bottom: 0;
}

    .detail-produit .menu_fiche_produit .prodfiche_dispo span {
        position: relative;
        left: 0;
        right: 0;
        top: 0;
        display: inline;
        width: auto;
        padding-left: 0;
        padding-right: 0;
    }

.detail-produit .menu_fiche_produit {
    text-align: left;
    width: auto;
    border: none;
    background: none;
    float: none;
    padding: 0;
    z-index: -1;
}

.detail-produit-bck .absolute-content img.img-choix-hover-1 {
    display: block !important;
}

.mode-list-conf li:hover img {
    transform: scale(0.98);
}

.recomnd-jeux {
    background: var(--noir);
    overflow: hidden;
    line-height: var(--val_30);
    padding: 5px 10px 5px 10px;
    width: 100%;
    transition: width 0.5s;
}

    .recomnd-jeux p {
        color: var(--blanc);
        text-transform: uppercase;
        font-weight: var(--semibold);
        line-height: 16px;
        font-size: 16px;
    }

.recomande.recomnd-jeux .budg {
    color: var(--noir);
    text-transform: uppercase;
    border-left: 2px solid;
    line-height: var(--val_30);
}

.recomnd-jeux div {
    float: left;
    color: var(--blanc);
    margin-right: var(--val_10);
    font-size: var(--size_p);
    line-height: 14px;
}

.proc-2 {
    background: url(/images/img-gamer/proc-2.png) no-repeat left center;
    background-size: 14px;
    padding-left: 16px;
}

.recomande .proc-2 {
    background: url(/images/img-gamer/proc.png) no-repeat left center;
    background-size: 14px;
    padding-left: 16px;
}

.ram-2 {
    background: url(/images/img-gamer/ram-2.png) no-repeat left center;
    background-size: 14px;
    padding-left: 16px;
}

.recomande .ram-2 {
    background: url(/images/img-gamer/ram.png) no-repeat left center;
    background-size: 14px;
    padding-left: 16px;
}

.cg-2 {
    background: url(/images/img-gamer/img-gamer/cg-2.png) no-repeat left center;
    background-size: 14px;
    padding-left: 16px;
}

.recomande .cg-2 {
    background: url(/images/img-gamer/cg-2.png) no-repeat left center;
    background-size: 14px;
    padding-left: 16px;
}

.recomnd-jeux .budg {
    margin-right: 0;
    font-weight: var(--semibold);
    float: right;
    font-size: 16px;
    padding: 0 5px;
}

.minimal.recomnd-jeux .budg {
    color: var(--blanc);
    text-transform: uppercase;
    border-left: 2px solid;
    line-height: var(--val_30);
}

.minimal {
    margin-bottom: var(--val_10);
    width: 80%;
}

.recomande {
    background: var(--blanc);
    border: 2px solid var(--noir);
    box-sizing: border-box;
    margin-bottom: var(--val_15);
}

    .recomande div {
        color: var(--noir);
    }

    .recomande p {
        color: var(--noir);
    }



.modif-nono-recap {
    width: 300px;
    text-align: center;
    margin: 0 auto;
    clear: both;
    background: var(--bleu);
    color: var(--blanc);
    display: block;
    text-transform: uppercase;
    line-height: var(--val_30);
    margin-top: var(--val_15);
}

    .modif-nono-recap:hover {
        transform: scale(1.05);
    }

.plop-gamer .modif-nono-recap {
    background: var(--jaune);
    color: var(--noir);
}


.plop-pro.modif-nono-recap {
    background: #132643;
}


.choix-jeux-gamer .mode-mosa li .titre-conf-inte span {
    font-size: var(--size_p);
}

.choix-jeux-gamer .mode-mosa .auto-choix .titre-conf-inte span {
    font-size: var(--size_p);
}

.recomnd-jeux .fl-mini {
    float: left;
}

.mode-mosa .no-recommandation img {
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
}

.no-recommandation {
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
}

.laisser-message .button input:hover,
.laisser-message .button button:hover,
.laisser-message .button div:hover {
    background: #ffcf00 url(/images/hover-bouton.png) no-repeat left center;
}

.laisser-message .button input,
.laisser-message .button button,
.laisser-message .button div {
    float: none;
    margin: 0 auto 10px;
    display: block;
    background: #ffcf00 url(/images/hover-bouton.png) no-repeat -500px center;
    border: 1px solid var(--jaune);
    text-transform: uppercase;
    color: var(--noir);
    text-align: center;
    line-height: var(--val_30);
    cursor: pointer;
}

.copyok {
    padding-top: var(--val_10);
    display: none;
}

.liencopy {
    width: 380px;
    height: 90px;
    font-size: var(--size_p);
    cursor: pointer;
    border: none;
}

    .liencopy:hover {
        text-decoration: underline;
        font-weight: var(--semibold);
    }

.options-panier ul li {
    padding-bottom: var(--val_5);
    font-size: var(--size_p);
}

.options-panier ul {
    padding: 15px 0 15px 5px;
    font-size: var(--size_p);
}

.copyok {
    color: green;
    font-weight: var(--semibold);
    text-transform: uppercase;
}

.tri-mos .list-is-mobile {
    background: url(../landing-pages/images/configurateur/mode-list-w.png) no-repeat 5px center;
}

.tri-mos .mos-is-mobile {
    background: url(../landing-pages/images/configurateur/mode-mosa-w.png) no-repeat 5px center;
}

@media screen and (min-width: 320px) and (max-width: 480px) {
    .recap-conf,
    .config-content {
        float: none !important;
        margin: 0 auto !important;
    }

    .detail-produit-bck .ajouter-config span {
        font-size: var(--size_p);
    }

    .ram-capa,
    .ram-nb {
        top: 150px !important;
    }
}

.ajouter-config.cbk_configurateur__ajout-final {
    width: fit-content;
}

#configurateur-cyber {
    background: var(--blanc);
}

.produit-selected-del .supprim-option {
    max-width: var(--val_25);
}

.cbk_configurateur__img-wrapper {
    width: 200px;
    height: 200px;
    margin: 0 auto;
}

.cbk_configurateur__img-wrapper--simplefie {
    width: 200px;
    height: 250px;
    margin: 0 auto;
}

    .cbk_configurateur__img-wrapper--simplefie img,
    .cbk_configurateur__img-wrapper img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }

@media screen and (max-width: 1300px) {

    .cbk_configurateur__img-wrapper {
        width: 180px;
    }

    .cbk_configurateur__img-wrapper--simplefie {
        width: 150px;
    }
}

@media screen and (min-width: 480px) and (max-width: 768px) {
    .detail-produit-bck .ajouter-config.slot-3 {
        float: left;
    }

    .text-ref {
        float: none;
        width: 100%;
    }
}

@media screen and (max-width: 768px) {
    .cbk_configurateur__title {
        font-size: calc(24px + (40 - 24) * ((100vw - 320px) / (1920 - 300)));
    }

    .cbk_configurateur__subtitle {
        font-size: calc(12px + (18 - 12) * ((100vw - 320px) / (1920 - 300)));
    }

    .foot-config-r {
        width: 100%;
    }
}

@media screen and (max-width: 480px) {
    .cbk_configurateur__img-wrapper--simplefie,
    .cbk_configurateur__img-wrapper {
        width: 140px;
    }
}

@media screen and (min-width: 1921px) {
    .recap-conf-li {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 80%;
    }
}
