:root {
    --bs-link-color: #333;
    --bs-link-hover-color: #444;

    --Sky-blue: #F4F9FF;
    --Text-primary: #333;
    --Text-secondary: #666;
    --Light-grey: #F2F2F2;
    --Dark-grey: #424349;
    --Dark-grey-2: #313238;
    --Red-light: #D82418;
    --Red-main: #B9190E;
    --Red-dark: #970E05;
    --Secondary-fill-hovered: rgba(151, 14, 5, 0.06);
    --Secondary-fill-pressed: rgba(216, 36, 24, 0.20);

    --bs-primary-rgb: 151, 14, 5;

}
.btn {
    --bs-btn-border-radius: 8px;
    font-size: 1em;
    font-weight: 500;
    padding: .375em 1.3em;
    position: relative;
    overflow: hidden;
}
.btn.btn-sm{
    font-size: .85em;
}
@media screen and (min-width: 1400px) {
    .btn.btn-lg {
        font-size: 1.3em;
        padding: .55em 1.8em;
    }
}

.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: #B9190E;
    --bs-btn-border-color: #B9190E;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #970E05;
    --bs-btn-hover-border-color: #970E05;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--Red-light);
    --bs-btn-active-border-color: var(--Red-light);
}
.btn-outline-primary {
    --bs-btn-color: #B9190E;
    --bs-btn-border-color: #B9190E;
    --bs-btn-hover-color: #B9190E;
    --bs-btn-active-color: #B9190E;
    --bs-btn-hover-bg: rgba(151, 14, 5, 0.06);
    --bs-btn-hover-border-color: #B9190E;
    --bs-btn-active-bg: var(--Secondary-fill-pressed);
    --bs-btn-active-border-color: var(--Secondary-fill-pressed);
}
.btn-outline-secondary {
    --bs-btn-color: #333;
    --bs-btn-bg: #F7F7F7;
    --bs-btn-border-color: #dfdfdf;
    --bs-btn-hover-color: #B9190E;
    --bs-btn-active-color: #B9190E;
    --bs-btn-hover-bg: rgba(151, 14, 5, 0.06);
    --bs-btn-hover-border-color: #B9190E;
    --bs-btn-active-bg: var(--Secondary-fill-pressed);
    --bs-btn-active-border-color: #B9190E;
}

.text-color-primary {
    color: var(--Red-main);
}

.btn.btn-link {
    padding: .375rem 0;
    font-size: 1rem;
    font-weight: 400;
}

/* ripple */
.btn span.ripple {
    position: absolute;
    border-radius: 50%;
    transform: scale(0);
    animation: ripple 600ms linear;
    background-color: rgba(255, 255, 255, 0.7);
    z-index: 3;
    box-shadow: 0 0 1em #fff;
}

@keyframes ripple {
    to {
        transform: scale(4);
        opacity: 0;
    }
}

/* btn-disabled */
.btn.disabled,
.btn:disabled,
fieldset:disabled .btn {
    background-color: #666;
    border-color: #666;

}

/* a.btn:hover {
    text-decoration: none;
    color: var(--bs-btn-hover-color);
} */

/* NOTE Bootstrap cover xxxl 1524px */

@media screen and (min-width: 1584px) {
    .container {
        max-width: 1524px;
    }
}

/* NOTE Bootstrap cover < 600px */

@media screen and (max-width: 600px) {
    #wpadminbar {
        position: fixed;
        top: 0;
    }
}


/* headers mobile */
article h1 {
    font-size: 1.5rem;
    font-weight: 700;
}
article h2 {
    font-size: 1.35rem;
}
article h3 {
    font-size: 1.3rem;
}
article h4 {
    font-size: 1.2rem;
}
article h5 {
    font-size: 1rem;
}

blockquote {
    margin: 2em 0 1em;
    position: relative;
    padding: .3em .3em .3em 1em;
    border-top: 3px solid #B9190E;
    border-bottom: 3px solid #B9190E;
}
blockquote p {
    margin: 0;
}
blockquote:before {
    content: "”";
    display: block;
    width: 100%;
    left: 0;
    font-size: 4em;
    top: -.75em;
    position: absolute;
    font-weight: 700;
    color:#B9190E
}

/* headers desktop */
@media screen and (min-width: 992px) {
    article h1 {
        font-size: 2.5rem;
    }
    article h2 {
        font-size: 2rem;
    }
    article h3 {
        font-size: 1.75rem;
    }
    article h4 {
        font-size: 1.5rem;
    }
    article h5 {
        font-size: 1.25rem;
    }
    blockquote {
        margin: .25em .25em 2em 2.5rem;
        border: none;
        border-left: 3px solid #B9190E;
    }
    blockquote:before {
        top: 0;
        left: -2.5rem;
    }
    /* gutter for rows */
    .row.g-40 {
        --bs-gutter-x: 40px;
        --bs-gutter-y: 40px;
    }
}

.modal-backdrop {
    background: rgba(0,0,0, 0.7);
    z-index: 1051;
    backdrop-filter: blur(2.5px) grayscale(.5);
}
.modal-backdrop.show {
    opacity: 1;
}
.fslightbox-container,
.scrim {
    background: rgba(0,0,0, .7)!important;
    backdrop-filter: blur(2.5px) grayscale(.5);
}

@media screen and (min-width: 576px) {
    .modal-dialog.modal-lg {
        max-width: 660px;
    }
}