.mobileOnly {
    display: none;
}

/*=======================================================================*/

/*                          HEADER

/*=======================================================================*/
body>header nav>ul>li.on>a, 
body>header nav>ul>li:active>a,
body>header nav>ul>li>a.on {background:#fff; color:var(--dark-purple)}

body>header nav>ul>li:is(:hover, :focus-within)>a {
	background: #fff;
	color:var(--bright-purple);
}

body>header nav {margin:0; padding:0 1rem; background: var(--light-grey)}

body>header .header-top {
	position: relative;
	z-index: 1;
}

body>header .header-top .logo:is(:hover, :focus-visible) {
	filter: grayscale(1);
	opacity: 0.5;
}

body>header .account-links {
	align-items: center;
	display: flex;
	white-space: nowrap;
}

body>header #searchWrapper {
	background: #fff;
	border-radius: 10px;
	box-shadow: 0 4px 10px 0 rgba(0,0,0,0.125);
	float: none;
	padding: 1em;
	position: absolute;
	right: 1em;
	top: 100%;
}

body>header #searchWrapper input {
	height: 2em;
	padding: 0 0.5em;
}

body>header #searchWrapper input[type=submit] {
	padding: 0 1em;
}

body>header #searchWrapper input[type=submit]:is(:hover, :focus-visible) {
	background: var(--dark-blue);
}




/* FLEX ------------------------------ */

.flex .quarter {width: calc(25% - 0.75em);}
.flex .third {width: calc(33.333% - 0.6875em);}
.flex .half {width: calc(50% - 0.5em);}
.flex .two-thirds {width: calc(66.666% - 0.3125em);}
.flex .three-quarters {width: calc(75% - 0.25em);}

/* gap */
.gap-5 {gap: 0.3125em;}
.gap-5 > .quarter {width: calc(25% - 0.25em);}
.gap-5 > .third {width: calc(33.333% - 0.25em);}
.gap-5 > .half {width: calc(50% - 0.1875em);}
.gap-5 > .two-thirds {width: calc(66.666% - 0.0625em);}
.gap-5 > .three-quarters {width: calc(75% - 0.0625em);}

.gap-10 {gap: 0.625em;}
.gap-10 > .quarter {width: calc(25% - 0.5em);}
.gap-10 > .third {width: calc(33.333% - 0.4375em);}
.gap-10 > .half {width: calc(50% - 0.3125em);}
.gap-10 > .two-thirds {width: calc(66.666% - 0.1875em);}
.gap-10 > .three-quarters {width: calc(75% - 0.125em);}

.gap-15 {gap: 0.9375em;}
.gap-15 > .quarter {width: calc(25% - 0.75em);}
.gap-15 > .third {width: calc(33.333% - 0.625em);}
.gap-15 > .half {width: calc(50% - 0.5em);}
.gap-15 > .two-thirds {width: calc(66.666% - 0.3125em);}
.gap-15 > .three-quarters {width: calc(75% - 0.1875em);}

.gap-20 {gap: 1.43em;}
.gap-20 > .quarter {width: calc(25% - 1.125em);}
.gap-20 > .third {width: calc(33.333% - 1em);}
.gap-20 > .half {width: calc(50% - 0.75em);}
.gap-20 > .two-thirds {width: calc(66.666% - 0.4375em);}
.gap-20 > .three-quarters {width: calc(75% - 0.3125em);}

.gap-30 {gap: 1.875em;}
.gap-30 > .quarter {width: calc(25% - 1.4375em);}
.gap-30 > .third {width: calc(33.333% - 1.25em);}
.gap-30 > .half {width: calc(50% - 0.9375em);}
.gap-30 > .two-thirds {width: calc(66.666% - 0.625em);}
.gap-30 > .three-quarters {width: calc(75% - 0.4375em);}

.gap-40 {gap: 2.5em;}
.gap-40 > .quarter {width: calc(25% - 1.875em);}
.gap-40 > .third {width: calc(33.333% - 1.6875em);}
.gap-40 > .half {width: calc(50% - 1.25em);}
.gap-40 > .two-thirds {width: calc(66.666% - 0.8125em);}
.gap-40 > .three-quarters {width: calc(75% - 0.625em);}

.gap-50 {gap: 3.125em;}
.gap-50 > .quarter {width: calc(25% - 2.375em);}
.gap-50 > .third {width: calc(33.333% - 2.125em);}
.gap-50 > .half {width: calc(50% - 1.5625em);}
.gap-50 > .two-thirds {width: calc(66.666% - 1em);}
.gap-50 > .three-quarters {width: calc(75% - 0.75em);}





/*=======================================================================*/

/*                          DESKTOP STYLES            

/*=======================================================================*/

main h1 {
	display: flex;
	justify-content: space-between;
}

main h1 span:last-child {
	flex-shrink: 0;
}

main h1.text-align-center {
	justify-content: center;
}

.manageLinks {
	gap: 1.5em;
	justify-content: flex-end;
}

#policy .manageLinks {
	justify-content: flex-end;
}

main .two-columns .white-box + .white-box {margin-top: 0;}

main .dashboardList li > strong {
    min-width: 200px;
    display: inline-block;
}

.white-box {
    background: #fff;
    padding:2em;
}

.white-box + .white-box {
    margin-top:1em;
}

output#list > div {
    display: flex;
    width: 100%;
    gap: 8px;
}

.repeater {
    display: flex;
    flex-wrap: wrap;
    gap:0.5em
}

.repeater label {
    width: calc(50% - 0.5em);
}




/* Full-Width Policy With Sidenav */
.policy-section #policy-wrapper {
	min-height: calc(100vh - var(--header-height));
}

#policy-wrapper {
	display: grid;
	grid-template-columns: minmax(20em, 25%) 1fr;
	margin: -2rem calc(var(--gutter) * -1) -12.5rem;
}




/* Table of Contents */
#table-of-contents {
	padding: 2em;
}

#table-of-contents #contents > ul > li.on > .section-header {
	position: sticky;
	top: var(--header-height, 0);
	z-index: 1;
}

#table-of-contents .toc-wrapper > ul > li > .section-header {
	position: sticky;
	top: var(--header-height, 0);
	z-index: 1;
}


/* tableOfContents table */
table.tableOfContents thead th {
	background: #fff;
	position: sticky;
	top: var(--header-height, 0);
	z-index: 1;
}






/* Policies */
#policy {
	padding: 2em 5vw 12.5rem;
}

#policy h1 {
	background: none;
	padding: 0;
	margin: 0 0 1rem;
	text-transform: none;
	width: 100%;
}





/* 1000px */
@media screen and (max-width: 62.5em) {
	#policy-wrapper {
		grid-template-columns: 16em 1fr;
	}
	#table-of-contents {
		font-size: 0.875em;
		padding: 1em;
	}
	#policy {
		padding: 1em 2em 7.5rem;
		gap: 0.5em;
	}	
	#policy h1 {
		font-size: 1.5em;
	}	
}
