:root {
	--bs-primary: #06a3da;
	--bs-primary-rgb: 6, 163, 218;
	--bs-secondary: #091e3e;
	--bs-secondary-rgb: 9, 30, 62;
	--bs-link-hover-color-rgb: var(--bs-primary-rgb);
	--bs-heading-font-family: "Marcellus", serif;
    --bs-heading-color: var(--bs-secondary);
	--bs-body-font-family: 'Open Sans';
	--bs-body-color: #878c97;
	--bs-gray: #faf6f3;
	--bs-gray-200: #f2f2f2;
	--bs-light: #EEF9FF;
    --bs-light-rgb: 238, 249, 255;

}

/* Heading */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--bs-heading-font-family);
    font-weight: 400;
    letter-spacing: 1px;
}

/* Button */
.btn {
    --bs-btn-font-family: var(--bs-heading-font-family);
	--bs-btn-border-radius: .15rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 400;
    letter-spacing: 1px;
}

/* Button Primary */
.btn-primary {
	--bs-btn-color: #fff;
    --bs-btn-bg: var(--bs-primary);
    --bs-btn-border-color: var(--bs-btn-bg);
    --bs-btn-hover-color: var(--bs-btn-bg);
    --bs-btn-hover-bg: var(--bs-btn-color);
    --bs-btn-hover-border-color: var(--bs-btn-bg);
    --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
    --bs-btn-active-color: var(--bs-btn-bg);
    --bs-btn-active-bg: transparent;
    --bs-btn-active-border-color: var(--bs-btn-bg);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--bs-btn-color);
    --bs-btn-disabled-bg: var(--bs-primary);
    --bs-btn-disabled-border-color: var(--bs-primary);
}

/* Button Primary */
.btn-outline-primary {
	--bs-btn-color: var(--bs-primary);
    --bs-btn-bg: #fff;
    --bs-btn-border-color: var(--bs-btn-color);
    --bs-btn-hover-color: var(--bs-btn-bg);
    --bs-btn-hover-bg: var(--bs-btn-color);
    --bs-btn-hover-border-color: var(--bs-btn-bg);
    --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb);
    --bs-btn-active-color: var(--bs-btn-bg);
    --bs-btn-active-bg: var(--bs-btn-color);
    --bs-btn-active-border-color: var(--bs-btn-bg);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--bs-btn-color);
    --bs-btn-disabled-bg: var(--bs-primary);
    --bs-btn-disabled-border-color: var(--bs-primary);
}

/* Button Primary */
.btn-secondary {
	--bs-btn-color: #fff;
    --bs-btn-bg: var(--bs-secondary);
    --bs-btn-border-color: var(--bs-btn-bg);
    --bs-btn-hover-color: var(--bs-btn-bg);
    --bs-btn-hover-bg: var(--bs-btn-color);
    --bs-btn-hover-border-color: var(--bs-btn-bg);
    --bs-btn-focus-shadow-rgb: var(--bs-secondary-rgb);
    --bs-btn-active-color: var(--bs-btn-bg);
    --bs-btn-active-bg: transparent;
    --bs-btn-active-border-color: var(--bs-btn-bg);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--bs-btn-color);
    --bs-btn-disabled-bg: var(--bs-secondary);
    --bs-btn-disabled-border-color: var(--bs-secondary);
}

/* Button White */
.btn-white {
    --bs-btn-color: #000;
    --bs-btn-bg: #fff;
    --bs-btn-border-color: #fff;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--bs-primary);
    --bs-btn-hover-border-color: var(--bs-primary);
    --bs-btn-focus-shadow-rgb: 211,212,213;
    --bs-btn-active-color: #000;
    --bs-btn-active-bg: #f8f8f8;
    --bs-btn-active-border-color: #fff;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #000;
    --bs-btn-disabled-bg: #fff;
    --bs-btn-disabled-border-color: #fff;
}

/* Button Gray */
.btn-gray {
    --bs-btn-color: #000;
    --bs-btn-bg: var(--bs-gray);
    --bs-btn-border-color: var(--bs-gray);
    --bs-btn-hover-color: var(--bs-gray);
    --bs-btn-hover-bg: var(--bs-primary);
    --bs-btn-hover-border-color: var(--bs-primary);
    --bs-btn-focus-shadow-rgb: 211,212,213;
    --bs-btn-active-color: #000;
    --bs-btn-active-bg: #f8f8f8;
    --bs-btn-active-border-color: var(--bs-gray);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #000;
    --bs-btn-disabled-bg: var(--bs-gray);
    --bs-btn-disabled-border-color: var(--bs-gray);
}

/* Button Small */
.btn-sm {
    --bs-btn-font-size: .8rem;
    --bs-btn-padding-x: 1rem;
    --bs-btn-padding-y: .75rem;
    --bs-btn-border-radius: var(--bs-border-radius);
    --bs-btn-line-height: 1;
}

/* Button Large */
.btn-group-lg>.btn, 
.btn-lg {
    --bs-btn-font-size: .8rem;
    --bs-btn-padding-x: 2rem;
    --bs-btn-padding-y: 1rem;
    --bs-btn-border-radius: .25rem;
    --bs-btn-line-height: 1;
}

@media screen and (min-width:1200px) {
    .btn-group-lg>.btn, 
    .btn-lg {
        --bs-btn-font-size: 1rem;
        --bs-btn-padding-x: 2.5rem;
        --bs-btn-padding-y: 1rem;
        --bs-btn-border-radius: .25rem;
        --bs-btn-line-height: 1.5;
    }
}

/* Rounded Circle */
.btn.rounded-circle {
    width: 45px;
    height: 45px;
    --bs-btn-font-size: 1.25rem;
}
.btn.rounded-square {
    width: 45px;
    height: 45px;
    --bs-btn-font-size: 1.25rem;
    --bs-btn-border-radius: var(--bs-border-radius);
}

/* Progress Bar */
.progress {
    --bs-progress-bar-bg: var(--bs-primary);
    --bs-progress-border-radius: 0;
    --bs-progress-height: .5rem
}

/* Dropdown */
.dropdown-item.active, .dropdown-item:active {
	--bs-dropdown-link-active-bg: var(--bs-primary);
}

/* Background */
.bg-gray {
    background-color: var(--bs-gray);
}
.bg-gray-100 {
    background-color: var(--bs-gray-100);
}
.bg-gray-200 {
    background-color: var(--bs-gray-200);
}

/* Breadcrumb */
.breadcrumb {
    --bs-breadcrumb-divider: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Cpath d='M2.5 0L1 1.5 3.5 4 1 6.5 2.5 8l4-4-4-4z' fill='%236c757d'/%3E%3C/svg%3E");
}

/* Pagination */
.pagination {
    --bs-pagination-color: var(--bs-secondary);
    --bs-pagination-hover-color: var(--bs-white);
    --bs-pagination-bg: var(--bs-gray);
    --bs-pagination-hover-bg: var(--bs-primary);
    --bs-pagination-active-color: var(--bs-pagination-hover-color);
    --bs-pagination-active-bg:  var(--bs-pagination-hover-bg);
    --bs-pagination-focus-color: var(--bs-pagination-hover-color);
    --bs-pagination-focus-bg:  var(--bs-pagination-hover-bg);
    --bs-pagination-border-width: 0;
    --bs-pagination-padding-x: 1rem;
}
.pagination .page-item:not(:last-child) {
    margin-right: .75rem;
}
.pagination .page-item .page-link {
    border-radius: var(--bs-pagination-border-radius);
}