.loanamount-label {
    border: none;
    outline: none;
    margin-bottom: 16px;
}
.loanamount-group {
    display: flex;
    justify-content: space-between;
    align-items: center;    
    -webkit-box-align: center;
    -ms-flex-align: center;
}

.loantype {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    padding: 16px 10px;
    height: 100%;
    text-align: center;
}

.loantype > svg {
    margin-bottom: 10px;
}

#showmore ~ .box-group__item {
    /* hide all box below show more but display next box (show more box) */
    display: none;
}

#showmore + .box-group__item {
    /* display the show more box */
    display: block  ;
}

#showmore:checked ~ .box-group__item {
    /* show hidden loan types */
    display: block;
}

#showmore:checked + .box-group__item {
    /* hide show more */
    display: none;
}

.show-more-box {
    border: 1.5px solid #21CE99;
    border: 1.5px solid var(--primary-color);
    font-weight: bold;
}

    .show-more-box > span {
        font-weight: bold;
    }

.ellipsis {
    margin-top: 14px;
    display: flex;
    justify-content: center;
}

.ellipsis__dot {
    height: 8px;
    width: 8px;
    background-color: #21CE99;
    background-color: var(--primary-color);
    border-radius: 50%;
    margin: 0px 4px;
}