/* ---------- Layout ---------- */

.size_radio_button #prductsize .row.narrow-gutter{
    display:flex;
    flex-wrap:wrap;
}

.size_radio_button #prductsize .row.narrow-gutter > div{
    flex:0 0 auto;
    width:auto;
    max-width:none;
    padding:0 8px 8px;
}

/* ---------- Control ---------- */

.size_radio_button #prductsize .custom-control{
    padding-left:0;
    position:relative;
}

.size_radio_button #prductsize .custom-control-input{
    position:absolute;
    opacity:0;
}

/* Hide image only */

.size_radio_button #prductsize .custom-control-label img{
    display:none !important;
}

/* Make clickable label look like button */

.size_radio_button #prductsize .custom-control-label{
    display:flex;
    align-items:center;
    justify-content:center;
    width:130px;
    height:46px;
    border:1px solid #d7d7d7;
    border-radius:4px;
    background:#fff;
    cursor:pointer;
    transition:.2s;
    padding:0;
    margin:0;
}

.size_radio_button #prductsize .custom-control-label::after{
    content:attr(for);
    display:none;
}

/* Text */

.size_radio_button #prductsize .custom-control > label:last-child{
    position:absolute;
    inset:0;
    display:flex;
    justify-content:center;
    align-items:center;
    width:130px;
    height:46px;
    margin:0;
    pointer-events:none;
    font-weight:600;
    color:#1d2d4a;
}

/* Selected */

.size_radio_button #prductsize .custom-control-input:checked + .custom-control-label{
    background:#6ebb7c;
    border-color:#6ebb7c;
}

.size_radio_button #prductsize .custom-control-input:checked + .custom-control-label + label{
    color:#fff;
}

/* Hover */

.size_radio_button #prductsize .custom-control-label:hover{
    border-color:#6ebb7c;
}

/* Remove Bootstrap radio */

.size_radio_button #prductsize .custom-control-label::before,
.size_radio_button #prductsize .custom-control-label::after{
    display:none !important;
}

/* ========================= */
/* Tablet (≤991px) */
/* ========================= */

@media (max-width:991px){

    .size_radio_button #prductsize .custom-control-label,
    .size_radio_button #prductsize .custom-control > label:last-child{
        width:110px;
        height:42px;
        font-size:14px;
    }

    .size_radio_button #prductsize .row.narrow-gutter > div{
        padding:0 6px 6px;
    }
}

/* ========================= */
/* Mobile (≤767px) */
/* ========================= */

@media (max-width:767px){

    .size_radio_button #prductsize .row.narrow-gutter > div{
        flex:1 0 calc(50% - 12px);
        max-width:calc(50% - 12px);
        padding:0 6px 6px;
    }

    .size_radio_button #prductsize .custom-control-label,
    .size_radio_button #prductsize .custom-control > label:last-child{
        width:100%;
        height:42px;
        font-size:13px;
    }
}

/* ========================= */
/* Small Mobile (≤480px) */
/* ========================= */

@media (max-width:480px){

    .size_radio_button #prductsize .row.narrow-gutter > div{
        flex:1 0 100%;
        max-width:100%;
    }

    .size_radio_button #prductsize .custom-control-label,
    .size_radio_button #prductsize .custom-control > label:last-child{
        width:100%;
        height:40px;
        font-size:13px;
    }
}
.navbar-nav .mobileDropdownBottom .dropdown-toggle:after {
    transform: rotate(360deg);
}

.stretch-top.middle-white-bg{
    margin-top:0;
}