@import "accordion.css";
@import "alerts.css";
@import "badges.css";
@import "breadcrumb.css";
@import "buttons.css";
@import "cards.css";
@import "featured-news.css";
@import "footer.css";
@import "forms.css";
@import "header.css";
@import "homepage.css";
@import "on-this-page.css";
@import "latest-news.css";
@import "lists.css";
@import "subnav.css";
@import "table.css";
@import "typography.css";
@import "intro-innerpage.css";
@import "menu.css";


:root {
    --white: #FFFFFF;
    --black: #000000;
    --dsps-teal: #006B8C;
    --dsps-teal-10: #003F52;
    --dsps-yellow: #FDB928;
    --dsps-yellow-10: #EFC100;
    --dsps-yellow-20: #D89506;
    --dsps-dark-blue: #000D2D;
    --dsps-grey-0: #F7F7F7;
    --dsps-grey-10: #F3F3F3;
    --dsps-grey-20: #DFDFDF;
    --dsps-grey-30: #6A6A6A;
    --dsps-grey-40: #707070;
    --dsps-grey-50: #212121;
    --img-border-radius: 5px;
    --dsps-accordion-btn-active-icon: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="%23ffffff" class="bi bi-chevron-down" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708"/></svg>');
}

/* background colors */
.bg-teal {
    background-color: var(--dsps-teal)
}

.bg-teal-10 {
    background-color: var(--dsps-teal-10)
}

.bg-yellow {
    background-color: var(--dsps-yellow)
}

.bg-yellow-10 {
    background-color: var(--dsps-yellow-10)
}

.bg-yellow-20 {
    background-color: var(--dsps-yellow-20)
}

.bg-grey {
    background-color: var(--dsps-grey-0)
}

.bg-grey-10 {
    background-color: var(--dsps-grey-10)
}

.bg-grey-20 {
    background-color: var(--dsps-grey-20)
}

.bg-grey-30 {
    background-color: var(--dsps-grey-30)
}

.bg-grey-40 {
    background-color: var(--dsps-grey-40)
}

.bg-grey-50 {
    background-color: var(--dsps-grey-50)
}

html {
    font-size: 20px;
    /* default setting: 1rem = 16px */
    color: var(--dsps-grey-50);
    scroll-padding-top: 150px;
}

body {
    font-family: 'Archivo Regular', sans-serif;
    font-size: .8rem;
    background-color: var(--white);
}

a {
    color: var(--dsps-teal);
}

    a:hover {
        text-decoration: underline;
    }

    a.icon {
        padding-right: 38px;
        background-repeat: no-repeat;
        background-size: 2rem;
        background-position: right center;
    }

.icon.arrow-right {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="16" fill="%23006B8C" class="bi bi-arrow-right" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M1 8a.5.5 0 0 1 .5-.5h11.793l-3.147-3.146a.5.5 0 0 1 .708-.708l4 4a.5.5 0 0 1 0 .708l-4 4a.5.5 0 0 1-.708-.708L13.293 8.5H1.5A.5.5 0 0 1 1 8"/></svg>');
}

a.text-link:hover {
    text-decoration: underline;
}

.component {
    display: block;
}

img {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
    font-style: italic;
}

.img-desktop {
    display: block;
}

.img-mobile {
    display: none;
}

@media (min-width:768px) {
    .component-spacer-6 {
        padding: 3rem 0;
    }

    .component-spacer-4 {
        padding: 2rem 0;
    }
	.component-spacer-2 {
		padding: 1.2rem 0;
	}
}

@media (max-width:767px) {

	.component-spacer-6,
	.component-spacer-4	 {
        padding: 1.5rem 0;
    }

	.component-spacer-2 {
		padding: .75rem 0;
	}

	.img-desktop {
		display: none;
	}

    .img-mobile {
        display: block;
    }
}
/* ACCESSIBILITY */
.skip-to-content-link {
    background: var(--white);
    color: var(--dsps-dark-blue);
    height: 30px;
    left: 50%;
    padding: 8px;
    position: absolute;
    transform: translateY(-100%);
    transition: transform 0.3s;
    z-index: 999;
}

    .skip-to-content-link:focus {
        transform: translateY(200%);
        z-index: 500;
        outline: 2px solid darkorange;
        outline-offset: 2px;
    }

@supports selector(:focus-visible) {
    :is(a, button, input, .dropdown-toggle):focus-visible {
        outline: 2px solid #0d6efd;
        outline-offset: 2px;
    }
}
/* Back to top */
#btn-back-to-top:before {
    font-family: 'bootstrap-icons';
    display: flex;
    content: "\F145";
    justify-content: center;
    align-items: center;
    height: 100%;
    font-size: 2rem;
}

#btn-back-to-top {
    position: fixed;
    height: 50px;
    width: 50px;
    border-radius: 50%;
    background-color: var(--dsps-yellow);
    color: var(--dsps-dark-blue) !important;
    bottom: 50px;
    right: 50px;
    display: none;
    z-index: 5;
    box-shadow: 3px 3px 4px rgba(0, 0, 0, .25);
    cursor: pointer;
    text-decoration: none !important;
}

a.skip-to-content-link {
    background: var(--dsps-teal);
    color: var(--white);
    height: auto;
    display: flex;
    justify-self: center;
    padding: 8px 16px;
    position: absolute;
    transform: translateY(-100%);
    transition: transform 0.3s;
}

    a.skip-to-content-link:visited {
        color: var(--white) !important;
    }

    a.skip-to-content-link:focus {
        transform: translateY(0%);
        z-index: 1005;
        outline: 2px solid darkorange;
        outline-offset: 2px;
    }

.no-display {
	display: none;
}

.page404 h1 {
	color: var(--dsps-teal);
}

/* PRINT STYLES */
@media print {
	/* HIDE GENERAL */
	/* Header and Navigation */
	header.sticky-top {
		position: relative;
	}

	.bg-body-tertiary {
		background-color: var(--white) !important;
	}

	.nav {
		display: none;
	}
	/* Breadcrumb and Subnav */
	.comp-breadcrumb {
		display: none;
	}

	.comp-subnav {
		display: none;
	}
	/* Main content */
	sidebar {
		display: none;
	}
	/* Footer */
	#btn-back-to-top {
		display: none;
	}

	footer {
		display: none;
	}

	/* HIDE COMPONENT LIST: */
	/* Promo */
	.comp-promo {
		display: none;
	}
	/* Accordion Switch */
	.comp-accordion-switch {
		display: none;
	}
	/* Go to top */
	#btn-back-to-top {
		display: none !important;
	}
	/* SPECIAL PRINT STYLES FOR COMPONENTS */
	/* General */
	body {
		background-color: var(--white);
		color: var(--black);
	}
	/* Headings */
	h1 {
		color: var(--black);
	}
	/* Accordion */
	.accordion-collapse {
		display: block !important;
		height: auto !important;
		visibility: visible !important;
	}

	.accordion-button.collapsed::after {
		transform: var(--bs-accordion-btn-icon-transform);
	}

	.accordion-button:focus {
		box-shadow: none;
		border-color: transparent;
	}
	/* Intro */
	.comp-general-intro-info, .comp-search-intro-info, .comp-intro-news {
		background-image: none;
		background-color: var(--white);
		color: var(--black);
	}

	.comp-general-intro-info a, .comp-search-intro-info a, .comp-intro-news a {
		color: var(--dsps-yellow) !important;
	}

	.comp-general-intro-info a:hover, .comp-search-intro-info a:hover, .comp-intro-news a:hover {
		color: var(--dsps-yellow-20) !important;
		text-decoration: underline;
	}

	img.intro-img {
		overflow: hidden;
	}

	.intro-lead {
		color: var(--black);
	}
}