/*** spÊcifique DIY ***/
.page_entreprise_offre_diy header .logo img {width: 60%; margin: auto}

/*** configurateur ***/

.page_entreprise_offre_diy .shaker-entreprise .reps li a{
    color:#FFFFFF;
    opacity: 0.8;
    text-decoration: none;
    position: relative;
    margin-top:0rem;
}

.page_entreprise_offre_diy .shaker-entreprise .reps li a:hover{
    opacity: 1;
    text-decoration: none;
}

.page_entreprise_offre_diy .shaker-entreprise .reps li a.selected{
    opacity: 1;
    font-weight: bold;
}


.page_entreprise_offre_diy .shaker-entreprise .reps li a .radio {

    background-image: url("/00DATA/themes/happykits/entreprise/offres/diy/radio-transparent.svg");
    background-repeat: no-repeat;
    background-position: 0 0;
    /*position: absolute;
    left:-4rem;*/
    height: 3rem;
    width: 3rem;
    background-size: 100% auto;

}

.page_entreprise_offre_diy .shaker-entreprise .reps li a .radio:after {

    content:"";
    position: absolute;
    width: 1em;
    height: 1rem;
    background-color: #2FCCC4;
    border-radius: 100%;
    left:1rem;
    top:1.2rem;
    opacity: 0;

}

.page_entreprise_offre_diy .shaker-entreprise .reps li a.selected .radio,.page_entreprise_offre_diy .shaker-entreprise .reps li a:hover .radio {
    background-image: url("/00DATA/themes/happykits/accueil/shaker/radio-selected.svg");
}

.page_entreprise_offre_diy .shaker-entreprise .reps li a.selected .radio:after,.page_entreprise_offre_diy .shaker-entreprise .reps li a:hover .radio:after {
    opacity: 1;
}

.page_entreprise_offre_diy .reponses .q-possible {
    background-image: url(/00DATA/themes/happykits/entreprise/offres/diy/question-possible.svg);
}
.page_entreprise_offre_diy .reponses .q-encours {
    background-image: url(/00DATA/themes/happykits/entreprise/offres/diy/question-encours.svg);
}
.page_entreprise_offre_diy .reponses .q-valide {
    background-image: url(/00DATA/themes/happykits/entreprise/offres/diy/question-valide.svg);
}

.page_entreprise_offre_diy .kit-card .star {z-index: 200;opacity: 0}
.page_entreprise_offre_diy .kit-card .star.starred {opacity: 1 !important}
.page_entreprise_offre_diy .kit-card:hover .star {opacity: 0.8}

/*** catalogue ***/
.catalogue .kit-card .row.content {background: #FFF;border-radius: 1rem;box-shadow: 0px 0px 30px 0px #CCC;}
.catalogue .kit-card::after {content: none}
.catalogue .kit-card .vignette {border-radius: 0.5rem}

/*** ccm ***/
.page_entreprise_offre_diy .hk-border-medium::after {
    content: ' ';
    background: url(/00DATA/themes/happykits/entreprise/offres/diy/bg-ccm.svg) 50% 50% no-repeat;
    background-size: 100% 100%;
    width: 100%;
}

.page_entreprise_offre_diy .counter {top: -4rem;right: -3rem;}
.c-max{max-width: 920px;}
.counter {position: absolute;top: -1rem;right: -5rem;border-radius: 100%;width: 7rem;height: 7rem;}
.counter span {position: absolute;display: block;position: absolute;top: 50%;left: 50%;transform: translate3d(-50%,-50%,0);}
.container-comment {position: relative;}
.mt-10{margin-top: 10rem;}
.mt-15{margin-top: 15rem;}
.vh-80{height: 80vh;}

@media screen and (max-width: 768px) {
    .counter {position: absolute;top: -3rem;right: 40%;transform: scale(0.7);}
    .vh-80{height: auto;}
    .mt-10{margin-top: 3rem;}
    .mt-15{margin-top: 3rem;}
}

/*** photos ***/
.page_entreprise_offre_diy .photos .img-responsive {
    width: 100%;
    height: auto;
}

/*** offres
.bg-top {
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: top center;
    background-image: url(/00DATA/themes/happykits/entreprise/bg-offre-top.png);
    z-index:-1;
}
***/
.bg-top::after {
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: top center;
    background-image: url(/00DATA/themes/happykits/entreprise/bg-offre-top.png);
    z-index: -10;
    content: ' ';
    display: block;
    position: absolute;
    top: 47%;
    left: 50%;
    transform: translate3d(-50%,-50%,0);
    width: 100%;
    height: 100%;
}

.page_entreprise_offre_diy .bottom-nav {
    border-top: none;
}