@font-face {
    font-family: "Oxygen";
    src: url('Oxygen-Light.ttf');
    font-style: normal;
    font-weight: 300;
}
@font-face {
    font-family: "Oxygen";
    src: url('Oxygen-Regular.ttf');
    font-style: normal;
    font-weight: 400;
}
@font-face {
    font-family: "Oxygen";
    src: url('Oxygen-Bold.ttf');
    font-style: normal;
    font-weight: 700;
}
@font-face {
    font-family: "VarelaRound";
    src: url('VarelaRound-Regular.ttf');
    font-style: normal;
    font-weight: 400;
}

:root {
	--primary: #106579;
	--primary-medium: #738b97; 
	--primary-light: #9aa9af;
	--secondary: #f69300;
	--textcolor: #323335;
	--green: #299d00;
	--red: #df0000;
	--yellow: #ffe019;
	--grey: #888;
	--light-grey: #ddd;
	--bg-grey:#aaa;
	--bg-light-grey:#f7f7f6;
	--bg-header:#20657D;
}

@media screen and (max-width:768px) {
	:root {
		--szMassive: 46px;
		--szHuge: 36px;
		--szLarge: 20px;
		--szQuiteLarge: 24px;
		--szVeryLarge: 28px;
	}
	
}

* {
	box-sizing:border-box;
}

html { 
	margin:0;
	padding:0;
	scroll-behavior:smooth;
	/*
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	font-smoothing: antialiased;
	*/
}
body {
	font-family:Oxygen,sans-serif;
	font-weight:400;
	font-size:18px;
	line-height:1.5;
	margin:0;
	padding:0;
	color:var(--textcolor);
	text-rendering:optimizeLegibility;
}
/*
:focus, :focus-visible {
	outline:none;
	border:0;
}
*/

main,footer,section,header,p,figure,aside {
	margin:0;padding:0;
}
section {
	position:relative;
}
figure {
	display:inline-block;
}
table {
	border-collapse:collapse;
}
td {
	padding:5px;
	vertical-align:top;
}
a {
	color: inherit;
	text-decoration:none;
	border:none;
	outline:none;
}
a img {
	border:none;
	outline:none;
}
a.text-link {
	text-decoration:underline;
}
b,strong {
	font-weight:600;
}
p {
	line-height:1.6;
	
}
h1,h2,h3,h4,h5 {
	font-family:"VarelaRound",sans-serif;
	margin:0;padding:0;
	line-height:1.3;
	font-weight:400;
}
h1 { font-size:48px; hyphens:auto; }
h2 { font-size:36px; hyphens:auto; }
h3 { font-size:24px }

.container {
	max-width:1440px;
	margin:0 auto;
}
section > .container {
	padding:40px 60px;
}
ul {
	margin:0 0 0 30px;
	list-style-type:disc;
}
li {
}
.page-header {
	height:100px;
	background:var(--bg-header) url(akd-logo-white.svg) no-repeat right 40px center;
	background-size:auto 42px;
	position:relative;
}
.page-header .logo {
	position:absolute;
	top:5px;
	right:1rem;
	display:block;
	text-decoration:none;
	line-height:1;
}
.page-header .logo img {
	display:block;
	width:auto;
	height:44px;
}
.row {
	display:flex;
	flex-wrap:wrap;
	justify-content:flex-start;
	gap:20px;
}
.col { flex-basis:100%; }
.col-25 { flex-basis:25%; }
.col-50, .col-md-6 { flex-basis:calc(50% - 20px); }
.col-33 { flex-basis:33%; }
.col-66 { flex-basis:66%; }
.col-md-8 { flex-basis:calc(66.66% - 20px); }
.col-md-4 { flex-basis:calc(33.33% - 20px); }
.col-md-3 { flex-basis:calc(25% - 20px); }

.text-center {
	text-align:center;
}

.button {
	display:inline-block;
	border-radius:5px;
	padding:16px 30px;
	text-align:center;
	line-height:1;
	border:1px solid var(--textcolor);
	color:var(--textcolor);
}
.button.button-primary {
	background-color:var(--primary);
	color:white;
	border:1px solid var(--primary);
}
.button.print-button {
	padding:0px;
}
.print-button img {
	height:1.5rem;
	width:auto;
	display:inline-block;
}
.cx-button-section .button:hover {
	background-color:#fafafa;
}
.form-control {
	font-size:15px;
	padding:5px;
	background-color:white;
	border:1px solid var(--lightgrey);
	border-radius:4px;
}
.form-control.form-control-container {
}
.form-control-label {
	margin-bottom:0.5rem;
	padding-left:5px;
}
.form-drawer {
	position:relative;
	overflow:hidden;
	max-height:0;
	transition:all 0.5s ease-in-out;
}
.form-checkboxes.col1 {
	column-count:1;
}
.form-checkboxes.col2 {
	column-count:2;
}
.form-checkboxes.col4 {
	column-count:4;
}

.form-checkboxes .form-checkbox {
	display:block;
	user-select:none;
	white-space:nowrap;
	padding:2px 0;
}
.form-checkboxes .form-checkbox input[type="checkbox"] {
	appearance:none;
	-moz-appearance:none;
	-webkit-appearance:none;
}
.form-checkboxes .form-checkbox input[type="checkbox"]:checked + span {
	background-color:var(--secondary);
	color:white;
}

.form-checkboxes .form-checkbox span {
	display:inline-block;
	padding:2px 5px;
	border-radius:4px;
}
.form-multi .form-control-label {
	cursor:pointer;
	background:transparent url(chevron-down.svg) no-repeat right center;
	background-size:8px;
	margin-bottom:0;
	user-select:none;
}
.form-multi.active .form-drawer {
	padding-top:0.25rem;
	max-height:220px;
	overflow-y:auto;
}
.col-md-6 .form-multi.active .form-drawer {
	max-height:430px;
}

.form-controls {
	display:flex;
	flex-direction:row;
	align-content:flex-start;
	justify-content:space-between;
	gap:0.5rem;
}
.form-button {
	background-color:white;
	border-radius:5px;
	border:1px solid var(--bg-grey);
}
.form-button:active {
	transform:scale(0.97);
}


.cx-courses-header {
	color:var(--primary);
	margin:0 0 2rem 0;
}
.cx-courses-header h2 {
	margin:0;
	padding:0;
}

.cx-courses-filter {
	padding:0.5rem 1rem;
	background-color:var(--bg-header);
	
}
.cx-courses-filter .form-control {
	width:100%;
}
.cx-courses-filter .col-md-3 .form-control {
	width:100%;
}

.cx-courses-filter .col-md-3 {
	flex-basis:calc(50% - 20px);
}
.cx-courses-filter .col-md-6 {
	flex-basis:100%;
}
.xcx-courses-filter .col-md-4 {
	flex-basis:33.33%;
	flex-shrink:0;
}
.cx-courses-filter .row {
	margin:1rem 0;
	flex-wrap:nowrap;
}
.cx-counter {
	font-size:1.5rem;
	margin:2rem 0 1rem 0;
	padding:0;
}

.cx-courses {
	margin:2rem 0;
}
.cx-entry {
	display:flex;
	width:100%;
	padding:0.75rem 0.75rem 0.75rem 0.5rem;
/*	border-bottom:1px solid #ddd;*/
}
.cx-entry:hover {
	color:var(--primary);
}
.cx-entry:hover a {
	text-decoration:underline;
}
.cx-courses .cx-entry:nth-child(odd) {
	background-color:var(--bg-light-grey);
}

.cx-status {
	padding:2px 0.75rem 0 0;
}
.cx-dot {
	width:16px;
	height:16px;
	display:inline-block;
	border-radius:50%;
	border:1px solid #ddd;
	background-color:var(--green);
}
.cx-dot.cx-few { background-color:var(--yellow); }
.cx-dot.cx-full { background-color:var(--red); }
.cx-dot.cx-blocked { background-color:var(--grey); }

.cx-entry .cx-info {
	width:100%;
	flex-shrink:1;
}
.cx-dates {
	white-space:nowrap;
	flex-shrink:0;
	text-align:right;
	min-width:210px;
}
.cx-list-buttons {
	margin:2rem 0;
	text-align:right;
}
.cx-list-buttons .cx-button {
	font-size:14px;
	
}
.cx-key-entries .cx-dot {
	margin-right:0.5rem;
}
.cx-subtitle {
	display:block;
	color:var(--bg-grey);
	font-size:0.9em;
}

.cx-course-title h2 {
	margin-bottom:1rem;
}

.cx-course .row {
	flex-wrap:nowrap;
}
.cx-course .main-col {
}
.cx-course .aside-col {
}
.cx-aside {
	position:sticky;
	top:1rem;
}
@media all and (max-width:1260px) {
	.form-checkboxes.col4 {
		column-count:3;
	}
}
@media all and (max-width:810px) {
	.form-checkboxes.col4 {
		column-count:2;
	}
}
@media all and (max-width:480px) {
	.form-checkboxes.col2,
	.form-checkboxes.col4 {
		column-count:1;
	}
	.cx-button-section {
		flex-wrap:wrap;
	}
}

@media all and (max-width:980px) {
	.cx-courses-filter .row {
		flex-wrap:wrap;
	}
	section > .container {
		padding:1rem;
	}
	.cx-courses-filter .form-control {
		width:100%;
	}
	.cx-entry .cx-info {
		min-width:40%;
		padding-right:1rem;
		hyphens:auto;
	}
	.cx-entry .cx-dates {
		min-width:0;
		white-space:normal;
		max-width:30%;
	}
	.cx-course h1 {
		hyphens:auto;
	}
	.cx-course .row {
		flex-wrap:wrap;
	}
	.cx-course .main-col,
	.cx-course .aside-col,
	.cx-course .button-col,
	.cx-course .staff-col {
		flex-basis:100%;
	}
	.cx-course .button-col {
		text-align:center;
		padding-bottom:1rem;
	}
	.cx-aside {
		position:static;
	}
	.cx-info-line.cx-aside-order {
		display:none;
	}
}
.cx-printing-info {
	margin:0.5rem 0;
	font-size:14px;
}


.cx-info-line {
	padding:1rem 0;
	display:flex;
}

.cx-info-icon {
	display:inline-block;
	width:64px;
	text-align:center;
	color:var(--primary);
	flex-shrink:0;
}
.cx-info-icon img {
	display:inline-block;
	width:30px;
	height:30px;
	object-fit:contain;
}
.cx-info-line .cx-info {
	display:inline-block;
	vertical-align:middle;
}
.cx-info-line.cx-aside-order {
	flex-direction:column;
}
.cx-aside-order .cx-order-button {
	margin:0 auto;
	width:66%;
}

.cx-course h1 {
	color:var(--primary);
	line-height:1.15;
	hyphens:auto;
	margin-bottom:1rem;
}
.cx-course h2 {
	font-size:26px;
	color:var(--bg-grey);
}
.cx-course h5 {
	font-size:18px;
	font-weight:bold;
}

.cx-doz {
	overflow:hidden;
}
.cx-doz-photo {
	margin-top:0.5rem;
	display:block;
}
.cx-doz-photo img {
	display:block;
	width:150px;
	height:150px;
	
	object-fit:cover;
	object-position:center;
}

.cx-doz-name {
	font-weight:700;
	color:var(--textcolor);
}
.cx-staff-members {
	display:flex;
	gap:2rem;
}
.cx-staff-member {
}
.cx-staff-member span {
	display:block;
}
.cx-staff-photo {
	width:150px;
	height:150px;

	display:block;
	object-fit:cover;
	object-position:center;
	margin:0.5rem 0;
}
.cx-staff-info.staff-email {
	font-size:15px;
}

.cx-section-title {
	color:var(--primary);
	margin:0 0 1rem 0;
}
.cx-content {
	margin:1rem 0 2rem 0;
}
.cx-content ul {
	margin:1rem 0;
	list-style-position:outside;
}
.cx-content li {
	margin:0 0 0.5rem 0;
}
.cx-content li p {
	margin:0;
}
.cx-content p {
	margin-bottom:0.5rem;
}
.cx-content p:last-child {
	margin-bottom:0;
}
.cx-content.cx-content-coop {
	overflow:hidden;
}
.coop-entry {
	overflow:hidden;
	vertical-align:baseline;
	margin:1.5rem 0 2rem 0;
}

.cx-content .coop-image {
	display:block;
	max-width:33%;
	height:auto;
	margin:0 0.5rem 1rem 0;
}


.cx-order-section {
	margin:3rem 0 2rem 0;
}
.cx-order-button {
	width:66%;
}

.cx-nav-section {
	margin:1rem 0;
	padding:1rem 0;
}
.cx-button-section {
	display:flex;
	align-items:center;
	justify-content:flex-start;
	gap:1rem;
}
.cx-button-section .print-button {
	margin-left:auto;
	height:52px;
	width:52px;
	display:flex;
	justify-content:center;
	align-items:center;
}
@media all and (max-width:480px) {
	.cx-staff-members {
		flex-wrap:wrap;
	}
}
.dialog-box {
	background-color:white;
	box-shadow:0 0 16px rgba(0,0,0,0.5);
}
.dialog-title {
	padding:0.5rem 1.5rem;
	border-bottom:1px solid #ddd;
	background-color:var(--primary);
	color:white;
}
.dialog-content {
	padding:3rem 4rem 3rem 4rem;
}
.window-backdrop {
	display:flex;
	position:fixed;
	z-index:9000;
	top:0px;
	left:0px;
	width:100vw;
	height:100vh;
	justify-content:center;
	align-items:center;
	background-color:rgba(0,0,0,0.2);
}
.dialog-box input[type="text"],
.dialog-box input[type="password"] {
	font-size:inherit;
	padding:5px;
	border:1px solid #ddd;
}
.anchor-link:hover {
	text-decoration:underline;
}


