/*
 * Styles of the sportschool template (child of Cassiopeia).
 * Colours, font and sizes follow the former Eximium template (YJSG, "blue" style).
 */

:root {
	--sportschool-accent: #40b1e2;
	--sportschool-accent-hover: #1c8ab9;
	--sportschool-text: #888;
	--sportschool-heading: #454545;
	--sportschool-menu-bg: #f7f7f7;
	--sportschool-menu-active-bg: #efefef;
	--sportschool-footer-bg: #212121;
	--sportschool-width: 1200px;

	--cassiopeia-color-primary: var(--sportschool-accent);
	--cassiopeia-color-link: var(--sportschool-accent);
	--cassiopeia-color-hover: var(--sportschool-accent-hover);
	--cassiopeia-font-family-body: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
	--cassiopeia-font-family-headings: var(--cassiopeia-font-family-body);
	--cassiopeia-font-weight-normal: 300;
	--cassiopeia-font-weight-headings: 300;
	--link-color: var(--sportschool-accent);
	--link-color-rgb: 64, 177, 226;
	--link-hover-color: var(--sportschool-accent-hover);
	--link-hover-color-rgb: 28, 138, 185;
}

body {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	background: #fff;
	color: var(--sportschool-text);
	font-family: var(--cassiopeia-font-family-body);
	font-size: 14px;
	font-weight: 300;
	line-height: 2.18;
}

a,
a:not([class]),
.mod-list li a:hover,
.mod-list li.active > a {
	color: var(--sportschool-accent);
	text-decoration: none;
}

b,
strong {
	font-weight: 500;
}

a:hover,
a:focus {
	color: var(--sportschool-accent-hover);
}

h1, h2, h3, h4, h5, h6 {
	color: var(--sportschool-heading);
	font-weight: 300;
	line-height: 1.3;
}

::selection {
	background: var(--sportschool-accent);
	color: #fff;
}

.sportschool-container {
	box-sizing: border-box;
	width: 100%;
	max-width: var(--sportschool-width);
	margin: 0 auto;
	padding: 0 15px;
}

/* Header: logo, title, link to the accessibility version */

.sportschool-header-grid {
	display: grid;
	grid-template-columns: 245px 1fr 200px;
	gap: 15px;
	align-items: center;
	padding-top: 0;
	padding-bottom: 7px;
}

.sportschool-logo img {
	display: block;
	max-width: 100%;
	height: auto;
}

.sportschool-title h2 {
	max-width: 540px;
	margin: 0 auto;
	font-size: 30px;
}

.sportschool-tools {
	align-self: start;
	padding-top: 15px;
	text-align: right;
}

.sportschool-tools img {
	max-width: 100%;
	height: auto;
}

/* Main menu bar */

.sportschool-nav {
	background: var(--sportschool-menu-bg);
}

.sportschool-nav .navbar {
	padding: 0;
}

.sportschool-nav .metismenu.mod-menu {
	flex-wrap: wrap;
}

.sportschool-nav .metismenu.mod-menu .metismenu-item {
	padding: 0;
	font-size: 14px;
	line-height: 50px;
}

.sportschool-nav .metismenu.mod-menu .metismenu-item > a,
.sportschool-nav .metismenu.mod-menu .metismenu-item > span {
	padding: 0 20px;
	color: #444;
}

.sportschool-nav .metismenu.mod-menu .metismenu-item > a:hover,
.sportschool-nav .metismenu.mod-menu .metismenu-item.active > a {
	text-decoration: none;
}

.sportschool-nav .metismenu.mod-menu .metismenu-item > a:hover {
	color: var(--sportschool-accent);
}

.sportschool-nav .metismenu.mod-menu > .metismenu-item.active,
.sportschool-nav .metismenu.mod-menu > .metismenu-item:hover {
	background: var(--sportschool-menu-active-bg);
}

.sportschool-nav .metismenu.mod-menu .metismenu-item.parent > a {
	padding-right: 6px;
}

.sportschool-nav .metismenu.mod-menu .mm-toggler {
	margin-right: 14px;
	color: #444;
}

.sportschool-nav .metismenu.mod-menu .mm-toggler:after {
	border-top-width: .35em;
	border-left-width: .35em;
	border-right-width: .35em;
}

/* Submenus */

.sportschool-nav .metismenu.mod-menu .mm-collapse {
	min-width: 220px;
	background: #fff;
	border: 1px solid #ccc;
	box-shadow: 0 0 8px #e2e2e2;
}

.sportschool-nav .metismenu.mod-menu .mm-collapse > li {
	border-bottom: 1px solid #ccc;
	line-height: 25px;
}

.sportschool-nav .metismenu.mod-menu .mm-collapse > li:last-child {
	border-bottom: 0;
}

.sportschool-nav .metismenu.mod-menu .mm-collapse > li > a {
	display: block;
	padding: 5px 20px;
	white-space: normal;
}

.sportschool-nav .metismenu.mod-menu .mm-collapse > li:hover {
	background: var(--sportschool-menu-active-bg);
}

.sportschool-nav .navbar-toggler {
	margin: 8px 0;
	color: #444;
	border-color: #ccc;
	cursor: pointer;
}

.sportschool-nav .navbar-toggler > * {
	pointer-events: none;
}

/* As in Eximium, submenus open on hover on wide screens (the toggle button still works). */
@media (min-width: 992px) {
	.sportschool-nav .metismenu.mod-menu {
		display: flex;
		flex-direction: row;
	}

	.sportschool-nav .metismenu.mod-menu .metismenu-item.parent:hover > .mm-collapse {
		display: block;
	}
}

@media (max-width: 991.98px) {
	.sportschool-nav .metismenu.mod-menu {
		flex-direction: column;
		padding-bottom: 10px;
	}

	.sportschool-nav .metismenu.mod-menu .metismenu-item {
		line-height: 40px;
	}

	.sportschool-nav .metismenu.mod-menu .mm-collapse {
		position: relative;
		flex-basis: 100%;
		border: 0;
		box-shadow: none;
		background: var(--sportschool-menu-active-bg);
	}
}

/* Content */

.sportschool-body {
	display: flex;
	flex: 1 0 auto;
	gap: 30px;
	padding-top: 15px;
	padding-bottom: 50px;
}

.sportschool-main {
	flex: 1;
	min-width: 0;
}

.sportschool-sidebar {
	flex: 0 0 22.5%;
}

.page-header h1,
.com-content-category-blog > h1,
.com-content-category > h1 {
	font-size: 2.6em;
}

.page-header h2,
.item-title {
	font-size: 170%;
}

.page-header h2 a {
	color: var(--sportschool-accent);
}

.page-header h2 a:hover {
	color: var(--sportschool-accent-hover);
}

.com-content-article__body img,
.com-content-category-blog__item img {
	max-width: 100%;
	height: auto;
}

.pagination {
	--pagination-active-bg: var(--sportschool-accent);
	--pagination-active-border-color: var(--sportschool-accent);
	justify-content: center;
}

.mod-breadcrumbs__wrapper {
	margin-top: 30px;
}

/* Footer */

.sportschool-footer {
	padding: 10px 0;
	background: var(--sportschool-footer-bg);
	color: #888;
	line-height: 25px;
	text-align: center;
}

.sportschool-footer-links {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 5px 20px;
	list-style: none;
}

.sportschool-footer-links li {
	padding: 5px 10px;
}

.sportschool-footer-links a,
.sportschool-footer-links a:hover {
	color: #fff;
}

@media (max-width: 767.98px) {
	.sportschool-header-grid {
		grid-template-columns: 1fr;
		justify-items: center;
		text-align: center;
	}

	.sportschool-title h2 {
		font-size: 22px;
	}

	.sportschool-tools {
		order: -1;
		padding-top: 10px;
	}

	.sportschool-body {
		flex-direction: column;
	}

	.sportschool-footer-links {
		grid-template-columns: 1fr;
	}
}

/* Font Awesome 4 icon names used in articles */

.fa.fa-youtube-play::before {
	content: "\f167";
	font-family: "Font Awesome 6 Brands";
	font-weight: 400;
}

/* Classes used in article content (moved from the Eximium custom.css) */

.tab-1 {
	padding-left: 2em !important;
}

.tab-2 {
	padding-left: 4em !important;
}

table.docs td {
	padding-left: 10px;
}

.simple-table {
	width: 100%;
}

table.simple-table caption,
.simple-table td {
	color: black;
}

.simple-table th,
.simple-table td {
	padding: 0 10px;
	border-collapse: collapse;
}

table.simple-table td:first-child {
	width: 40%;
	padding-left: 0;
}

table.simple-table tr {
	border-bottom: 1px dashed black;
}

table.simple-table tr:last-child {
	border-bottom: none;
}

.dotted {
	border-bottom: 1px dashed #1c8ab9;
	text-decoration: none;
}

.dashed-table {
	width: 100%;
}

.dashed-table td,
.dashed-table th {
	padding: 0 10px;
	border-left: 1px dashed black;
}

.dashed-table td,
.dashed-table caption {
	color: black;
}

.dashed-table caption,
.dashed-table th {
	text-align: center;
}

.dashed-table tr {
	border-bottom: 1px dashed black;
}

.dashed-table tr:last-child {
	border-bottom: none;
}

.dashed-table td:first-child,
.dashed-table th:first-child {
	border-left: none;
}

.person caption {
	font-weight: bold;
	color: black;
}

.person-contacts {
	vertical-align: top;
}

.my_table td {
	margin: 5px 0;
	padding: 5px 10px 5px 5px;
	vertical-align: middle;
	line-height: 1.35;
	color: black;
}

.my_table td:first-child {
	width: 40%;
	border-right: 1px dashed gray;
}

.my_table td:last-child {
	border-right: none;
}

.my_table tr {
	border-top: 1px dashed gray;
	border-bottom: 1px dashed gray;
}

.camp_column {
	display: inline-block;
	position: relative;
	width: 45%;
	height: inherit;
	vertical-align: top;
}

div.camp_row img {
	width: 100%;
	padding: 7.5px;
}

div.camp_column div {
	padding: 7.5px;
}

#docs {
	position: relative;
	top: 4em;
	padding: 0;
}

#docs a {
	font-size: 16px;
	text-decoration: underline;
}

.full-wide {
	width: 100%;
}

.two_columns td {
	width: 50%;
}