Lambda-School-Labs/kansha-fe

.btn {
    text-align: center;
    font-size: 1.6rem;
    border-radius: 2px;
    cursor: pointer;
    transition: all 300ms ease;
}

.btn-get-started {
    color: $color-white;
    background-color: $color-primary;
    border: 0.7px solid $color-primary;
    border-radius: 0.6rem;
    width: 19.2rem;
    height: 4.4rem;
    cursor: pointer;
    transition: all 300ms ease;

    &:hover {
        background-color: $color-secondary;
        border: 0.7px solid $color-secondary;
    }
}

.btn-learn-more {
    background-color: $color-white-dark;
    color: $color-primary;
    border: 0.7px solid $color-primary;
    width: 9rem;
    height: 2.5rem;
    margin-left: 2rem;
    cursor: pointer;
    transition: all 300ms ease;

    &:hover {
        background-color: $color-primary;
        color: $color-white;
    }
}

.btn-onboarding-confirm {
    color: $color-white;
    background-color: $color-primary;
    border: 0.7px solid $color-primary;
    width: 16rem;
    height: 4rem;
    margin-top: 0.5rem;
    margin-left: 0.5rem;
    border-radius: 0.5rem;
    cursor: pointer;
    transition: all 300ms ease;

    &:hover {
        color: $color-primary;
        background-color: $color-white-dark;
    }
}

.active {
    color: $color-primary;
}

.btn-filter {
    color: $color-primary;
    background: $color-white-dark;
    border: 0.25px solid $color-gray-light;
    border-radius: 2.3rem;
    width: 12rem;
    height: 4.4rem;
    cursor: pointer;
    transition: all 300ms ease;
    font-size: 1.8rem;

    &:hover {
        color: white;
        background-color: $color-primary;
        border: 0.7px solid $color-primary;
    }
}
.btn-modal {
    color: $color-white;
    background-color: $color-primary;
    border: 0.7px solid $color-primary;
    border-radius: 0.6rem;
    width: 9rem;
    height: 3rem;
    margin-top: 1.5rem;
    cursor: pointer;
    transition: all 300ms ease;

    &:hover {
        background-color: $color-secondary;
        border: 0.7px solid $color-secondary;
    }
}