/* Chrome, Safari, Edge, Opera */
input.number-no-arrow::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number].number-no-arrow {
    -moz-appearance: textfield;
}

.membership-card {
    width: 300px;
    position: relative;
}

.membership-card .membership-card__details .member-id{
    position: absolute;
    top: 6.1rem;
    left: 1.8rem;
}

.membership-card .membership-card__details .member-since{
    position: absolute;
    top: 7.95rem;
    left: 5.8rem;
    font-size: 11px;
}

.membership-card .membership-card__details .valid-date{
    position: absolute;
    bottom: 2.08rem;
    left: 5.8rem;
    font-size: 11px;
}

.membership-card .membership-card__details .member-name{
    position: absolute;
    bottom: 0rem;
    left: 1.8rem;
}

.membership-card .membership-card__details .member-name h5{
    text-transform: uppercase;
    font-size: 13px;
}

.membership-card .qr-code{
    position: absolute;
    right: 12px;
    top: 18px;
}

.membership-card .qr-code img{
    width: 58px;
}

/* print styles */
.print.membership-card {
    width: 600px;
    position: relative;
}

.print.membership-card .membership-card__details .member-id {
    top: 12.4rem;
    left: 3.6rem;
}

.print.membership-card .membership-card__details .member-id h5{
    font-size: 30px;
}

.print.membership-card .membership-card__details .member-name h5{
    font-size: 20px;
}

.print.membership-card .membership-card__details .member-name {
    bottom: 1rem;
    left: 3.6rem;
}

.print.membership-card .membership-card__details .member-since {
    top: 16.1rem;
    left: 12rem;
    font-size: 18px;
}

.print.membership-card .membership-card__details .valid-date {
    bottom: 4.6rem;
    left: 12rem;
    font-size: 18px;
}

.print.membership-card .qr-code {
    position: absolute;
    left: 470px;
    right: auto;
    top: 40px;
}

.print.membership-card .qr-code img{
    width: auto;
}