/* font Utitly */
.fw-600{
    font-weight: 600 !important;
}

/* button Utitly */
.btn{
    padding: 10px 24px;
}
.btn-gumleaf-outline, .btn-amber, .btn-gumleaf {
    font-weight: 600;
    border-width: 2px;
}
.btn-pastel-green {
    --bs-btn-color: var(--sqz-colour-black-text);
    --bs-btn-bg: #fff;
    --bs-btn-border-color: #E5F7F2;
    --bs-btn-hover-color: var(--sqz-colour-black-text);
    --bs-btn-hover-bg: #E5F7F2;
    --bs-btn-hover-border-color: #E5F7F2;
    --bs-btn-focus-shadow-rgb: 60, 153, 110;
    --bs-btn-active-color: var(--sqz-colour-black-text);
    --bs-btn-active-bg: #E5F7F2;
    --bs-btn-active-border-color: #E5F7F2;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #198754;
    --bs-btn-disabled-border-color: #198754;
}
.btn-amber {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--sqz-colour_amber);
    --bs-btn-border-color: var(--sqz-colour_amber);
    --bs-btn-hover-color: var(--sqz-colour_amber);
    --bs-btn-hover-bg: transparent;
    --bs-btn-hover-border-color: var(--sqz-colour_amber);
    --bs-btn-focus-shadow-rgb: 60, 153, 110;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--sqz-colour_amber);
    --bs-btn-active-border-color: var(--sqz-colour_amber);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #198754;
    --bs-btn-disabled-border-color: #198754;
}
.btn-gumleaf-outline {
    --bs-btn-color: var(--sqz-colour_gumleaf);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: var(--sqz-colour_gumleaf);
    --bs-btn-hover-color: #fff !important;
    --bs-btn-hover-bg: var(--sqz-colour_gumleaf);
    --bs-btn-hover-border-color: var(--sqz-colour_gumleaf);
    --bs-btn-focus-shadow-rgb: 60, 153, 110;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--sqz-colour_gumleaf);
    --bs-btn-active-border-color: var(--sqz-colour_gumleaf);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #198754;
    --bs-btn-disabled-border-color: #198754;
}
.btn-gumleaf {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--sqz-colour_gumleaf);
    --bs-btn-border-color: var(--sqz-colour_gumleaf);
    --bs-btn-hover-color: var(--sqz-colour_gumleaf);
    --bs-btn-hover-bg: transparent;
    --bs-btn-hover-border-color: var(--sqz-colour_gumleaf);
    --bs-btn-focus-shadow-rgb: 60, 153, 110;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--sqz-colour_gumleaf);
    --bs-btn-active-border-color: var(--sqz-colour_gumleaf);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #198754;
    --bs-btn-disabled-border-color: #198754;
}
a.btn.btn-gumleaf-outline {
    color: var(--sqz-colour_gumleaf) !important;
}

a.btn.btn-gumleaf-outline:hover {
    color: #fff !important;
}

a.btn.btn-gumleaf-outline.active {
    color: #fff !important;
}

/* Utitly */
.w-66{
    width: 66% !important;
}

/*// Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) {

    .w-sm-unset {
        width: unset !important;
    }
}


/*// Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {
    /* Utitly */
    .w-md-66 {
        width: 66% !important;
    }

    .overflow-x-md-unset {
        overflow-x: unset !important;
    }
}

/*// Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {
}

/*// the breakpoint where the menu goes from mobile to web */
@media (min-width: 1024px) {
    .overflow-x-web-unset {     /* we are calling this breakpoint "web" */
        overflow-x: unset !important;
    }
}