/* #TRUSTPILOT INTEGRATION
================================================== */
.bar-5 {height: 6px; background-color: #00B679; border-radius: 6px}
.bar-4 {height: 6px; background-color: #73CF11; border-radius: 6px}
.bar-3 {height: 6px; background-color: #FFCE00; border-radius: 6px}
.bar-2 {height: 6px; background-color: #FF8622; border-radius: 6px}
.bar-1 {height: 6px; background-color: #FF3722; border-radius: 6px}

.animate{
    animation: progress 2s linear;
    -moz-animation: progress 2s linear;
    -webkit-animation: progress 2s linear;
    -ms-animation: progress 2s linear;
    -o-animation: progress 2s linear;
}

@-webkit-keyframes progress {
    from { width:0% }
    to { width:100%; }
}


#pagination .page{ width:50px;height:50px; }


/* Couleurs */

.clrVerified { color:#417505; }
.clrVertTp { color:#00B67A; }
.clrVertTp::placeholder { color:#00B67A; }
.clrGrisTp { color: #929292; }
.clrGrisTp::placeholder { color: #929292; }
.clrBleuTp { color:#0066CC ; }
.clrBleuTp::placeholder { color: #0066CC; }

.fullH { height:100%; }

.sortSelected { border-bottom:4px solid #0066CC!important;font-weight:bold;color:#0066cc; }

input::-webkit-calendar-picker-indicator{ margin:0 }

#fancy-filter input[type="checkbox"] + label:before { content:'';display:block;width:1rem;height:1rem;border:1px solid #000;position:absolute;left:.3125rem;top:50%;transform:translateY( -50% );-webkit-transition:all .12s, border-color .08s;transition:all .12s, border-color .08s; }
#fancy-filter input[type="checkbox"]:checked + label:before { width:.625rem;top:calc( 50% - .625rem );left:.5rem;border-radius:0;border-top-color:transparent;border-left-color:transparent;-webkit-transform:rotate( 45deg );transform:rotate( 45deg ); }

/* Styling Input Materiel Design =============== */
.md-input { font-family:'Roboto','Helvetica','Arial',sans-serif; }
.md-input input, .md-input textarea { font-size:18px;padding:8px 16px;display:block;width:100%;border:none;border-bottom:1px solid rgba(0, 0, 0, 0.12); }
.md-input textarea { border:1px solid rgba(0, 0, 0, 0.12);resize:none; }
.md-input input:focus, .md-input textarea:focus { outline:none; }
/* LABEL ======================================= */
.md-input label { color:#999;font-size:18px;font-weight:normal;position:absolute;pointer-events:none;left:16px;top:10px;transition:0.2s ease all;-moz-transition:0.2s ease all;-webkit-transition:0.2s ease all; }
/* active state */
.md-input input:focus ~ label, .md-input input:valid ~ label, .md-input textarea:focus ~ label, .md-input textarea:valid ~ label { top:-20px;font-size:14px;color:#0066cc; }
/* BOTTOM BARS ================================= */
.md-input .bar { position:relative;display:block;width:100%; }
.md-input .bar:before, .md-input .bar:after { content:'';height:2px;width:0;bottom:0;position:absolute;background:#0066cc;transition:0.2s ease all;-moz-transition:0.2s ease all;-webkit-transition:0.2s ease all; }
.md-input .bar:before { left:50%; }
.md-input .bar:after { right:50%; }
/* active state */
.md-input input:focus ~ .bar:before, .md-input input:focus ~ .bar:after, .md-input textarea:focus ~ .bar:before, .md-input textarea:focus ~ .bar:after { width:50%; }

.rating + label { color:#F5A623; }
.rating:checked + label ~ label { color:#cccccc; }
.rating + label:hover ~ label { color:#cccccc; }

/* Ripple effect =============================== */
.ripple { background-position:center;transition:background 0.8s; }
.ripple:hover { background:#2477ce radial-gradient(circle, transparent 1%, #2477ce 1%) center/15000%; }
.ripple:active { background-color: #4d89d0; background-size: 100%; transition: background 0s; }

/* Button style */
button.ripple { border:none;border-radius:2px;padding:12px 18px;font-size:16px;text-transform:uppercase;cursor:pointer;color:white;background-color:#0066cc;box-shadow:0 0 4px #999;outline:none; }
.btn-close { width:1.5rem;height:1.5rem;top:15px;right:15px; }


::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}
::-webkit-scrollbar-track {
    background: transparent;
}
::-webkit-scrollbar-thumb {
    background-color: rgba(0,0,0, 0.2);
    border-radius: 1px;
}
::-webkit-scrollbar-thumb:hover {
    background-color: rgba(0,0,0, 0.3);
}


/*
MAD-SELECT by Roko CB
*/
.mad-select .material-icons{
    vertical-align: middle;
}
.mad-select{
    position:relative;
    vertical-align:middle;
    border-bottom: 1px solid rgba(0,0,0,0.12);
    padding-right: 8px;
}
.mad-select ul {
    list-style: none;
    display:inline-block;
    margin:0; padding:0;
}
.mad-select li{
    vertical-align: middle;
    white-space: nowrap;
    height:24px;
    line-height:24px;
    display: none;
    padding: 8px 16px;
    margin:0;
    box-sizing: initial;
}
.mad-select > ul:first-of-type{
    width:inherit;
}
.mad-select > ul:first-of-type li.selected{
    display: inline-block;
    height: 24px;
    max-width: calc(100% - 24px);
    overflow: hidden;
    text-overflow: ellipsis;
}
.mad-select i.material-icons{
    opacity: 0.5;
    margin:0;
    padding:0;
}
/*jQ*/
.mad-select ul.mad-select-drop{
    position: absolute;
    z-index: 9999;
    visibility: hidden; opacity:0;
    background: #fff;
    box-shadow: 0 1px 4px rgba(0,0,0,0.2);
    top: 0;
    left: 0;
    transition: 0.24s;
    max-height: 0;
    overflow: hidden;
    overflow-y: auto;
    width:100%;
}
.mad-select ul.mad-select-drop.show{
    visibility: visible; opacity: 1;
    max-height: 160px; /* COMMENT IF YOU DON?T NEED MAX HEIGHT */
    scrollbar-width: thin;
}
.mad-select ul.mad-select-drop li{
    display: block;
    transition: background 0.24s;
    cursor: pointer;
}
.mad-select ul.mad-select-drop li.selected{
    background: rgba(0,0,0,0.07);
}
.mad-select ul.mad-select-drop li:hover{
    background: rgba(0,0,0,0.04);
}

#quality img, #price img, #uses img { box-sizing: content-box; }

#trustpilot {
    display:none;
}

#trustpilot .post-review {
    cursor: pointer;
}

#trustpilot .product-review-page {
    display: none;
}

#trustpilot .product-review .more-content {
    display: none;
}

#trustpilot .product-review .toggle-content {
    cursor: pointer;
    text-decoration: underline;
}


    .tpstarswidth { height: 15px; width: 15px; }
    .tpverified   { width: 13px; height: 13px; }

/* Mobile */
@media only screen and (max-device-width: 46.875rem) {

    .tpstarswidth-sm             { width: 13px; height: 13px; }
    .tpverified-sm               { width: 13px; height: 13px; }
    .pagination-border           { border: 2px solid #DCDCDC; width: 96px!important; height: 94px; }

    #fancy-filter .toScale { transform:scale(2);}
    #fancy-filter input[type="checkbox"] + label:before { width:2rem;height:2rem; }
    #fancy-filter input[type="checkbox"]:checked + label:before { width:1.25rem;top:calc( 50% - 1.25rem ); }

    .ml100-sm { margin-left:6.25rem!important; }

    #sticky-buttons {position:sticky;bottom:40px;}
    .filter-button { margin:auto;border-radius:5vh;width:50vw;padding:10px; }
    #backToTop-sm { display:none;background:rgba(0, 0, 0, 0.2); }
    #backToTop-sm.active { display:block; }
}