@font-face {
	font-family: "flanders-sans";
	src: url("fonts/sans/FlandersArtSans-Regular.woff2") format("woff2"), url("fonts/sans/FlandersArtSans-Regular.woff") format("woff");
	font-style: normal;
	font-weight: 400;
	font-display: swap;
}

@font-face {
	font-family: "flanders-sans";
	src: url("fonts/sans/FlandersArtSans-Medium.woff2") format("woff2"), url("fonts/sans/FlandersArtSans-Medium.woff") format("woff");
	font-style: normal;
	font-weight: 700;
	font-display: swap;
}

@font-face {
	font-family: "flanders-sans";
	src: url("fonts/italic/FlandersArtSans-Regular.woff2") format("woff2"), url("fonts/italic/FlandersArtSans-Regular.woff") format("woff");
	font-style: italic;
	font-weight: 400;
	font-display: swap;
}

@font-face {
	font-family: "flanders-sans";
	src: url("fonts/italic/FlandersArtSans-Medium.woff2") format("woff2"), url("fonts/italic/FlandersArtSans-Medium.woff") format("woff");
	font-style: italic;
	font-weight: 700;
	font-display: swap;
}

body {
	background-color: #FFF;
	color: #000;
	font-family: 'flanders-sans', sans-serif;
	font-size: 16px;
	line-height: 1.45em;
}
@media (max-width: 991px) {
	body {
		font-size: 15px;
	}
}

/* --- HEADERS --- */

h1 {
	font-size: 2.074em;
	font-weight: 700;
	color: #222222;
	line-height: 1.2em;
	margin-top: 32px;
	margin-bottom: 16px;
}

h2 {
	font-size: 1.72em;
	font-weight: 700;
	color: hsl(195, 71%, 12%);
	line-height: 1.2em;
	margin-top: 24px;
	margin-bottom: 16px;
}

h3 {
	font-size: 1.44em;
	font-weight: 700;
	color: #222222;
	line-height: 1.2em;
	margin: 16px 0;
}

h4 {
	font-size: 1.2em;
	font-weight: 700;
	color: hsl(195, 71%, 12%);
	line-height: 1.2em;
	margin-top: 16px;
	margin-bottom: 8px;
}

@media (max-width: 576px) { /* sm */
	h1 {
		font-size: 1.8em;
	}
	h2, .search-header h1 {
		font-size: 1.6em;
	}
}

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

/* --- LOGIN MODAL --- */
#tab_logon_register button.active {
	font-weight: bold;
}

/* --- FOOTER --- */

.footer-bottom {
    background-color: hsl(195, 71%, 32%);
	color: #FFFFFF;
}
.footer-bottom a {
    color: #FFF;
}
.footer-bottom a:hover {
	color: #FCB885;
}

.footer-top {
	font-size: 0.9em;
	line-height: 1.3;
    background-color: hsla(195, 71%, 32%, 0.06);
}

.footer-top a {
	color: #007b91;
}

/* --- NAVIGATION --- */

#header-nav {
	position: relative;
	width: 100%;
}

#header-nav > .float-right {
	position: absolute;
	right: 0;
	top: -45px;
	z-index: 10;
}

#header-nav nav {
	line-height: 45px;
}

#header-nav .nav-link {
	color: #333332;
	padding-top: 0;
	padding-bottom: 0;
}

#header-nav a, #header-nav a:visited {
	color: #333332;
	text-decoration: none;
}

#header-nav a:hover, #header-nav a:active {
	color: #06c;
	text-decoration: none;
}

@media (max-width: 575px) {
	.flex-truncate-mobile {
		flex-grow: 1;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		width: 0;
	}
}

#navbarsContainer > a.btn.kc_button {
	box-shadow: none;
}

.dropdown-menu .dropdown-item {
    color: #008198;
}
.dropdown-menu .dropdown-item:hover {
    color: #B65F1E;
}
.dropdown-menu .dropdown-item:active {
	background-color: #EEE;
}

.dropdown-menu  .organisation-name {
	max-width: 130px;
	overflow: hidden;
}

.dropdown-menu  .organisation-name:hover {
	/* to distinguish clipped (lengthy) organisation names that start out similarly */
	overflow: visible;
}

#main_nav.navbar-default {
	background-color: hsl(195, 71%, 32%);
	padding-top: 0;
	padding-bottom: 0;
}

#navbar_icons>li>a {
	color: white;
}

#main_nav .navbar-brand {
	padding: 0px;
}

#main_nav .navbar-toggler {
	color: white;
}

#main_nav .nav-tabs .nav-link {
	background-color: #dee2e6;
	border-color: #dee2e6 #dee2e6 #fff;
}
#main_nav .nav-tabs .nav-link.active {
	background-color: #fff;
	font-weight: bold;
}

#menu_compact a:not(.dropdown-item){
	color: white;
}

#mobile_menu_wrap {
	/*display: flex;
    justify-content: space-around;*/
}

.menu-nav-notifications .notifications-icon {
	padding-top: 5px;
	height: 2.03rem;
	width: auto;
}
.menu-nav-notifications .faded {
	opacity: 0.7;
}
.menu-nav-notifications {
	position: relative;
}
.menu-nav-notifications .user_counter {
	position: absolute;
	left: 50%;
	bottom: 8px;
	line-height: 14px;
	border-radius: 100%;
	min-width: 16px;
	height: 16px;
	padding: 2px;
	text-align: center;
	font-size: 12px;
}

.notifications-popover {
	margin-top: 0.2rem;
	max-width: 100%;
}
.notifications-popover .popover-body {
	padding: 0px;
	width: 97vw;
	max-width: 420px;
}
.notifications-popover .notifications-header *, .notifications-footer {
	padding: .4rem 0rem;
}
.notifications-popover hr {
	margin: 0px;
	clear: both;
}

.notifications-list {
	overflow-y: auto;
	max-height: 50vh;
	scrollbar-width: thin;
	scrollbar-color: #cdcdcd white;
}
.notifications-list::-webkit-scrollbar {
	width: 7px;
}
.notifications-list::-webkit-scrollbar-thumb {
	background: #cdcdcd;
}

.notification.unread {
	background-color: hsla(26, 72%, 42%, 10%);
}
.notification:hover {
	background-color: #faf8f7;
}
.notification a:hover {
	text-decoration: none;
}

.notification-picture {
	width: 45px;
	height: 45px;
	margin-right: 1rem;
}
.notification-picture.rounded img {
	border-radius: 50% !important;
	object-fit: cover;
	width: 100%;
	height: 100%;
}
.notification-picture * {
	max-width:100%;
	max-height:100%;
	display: table;
	margin: 0 auto;
}

.notification-body {
	color: #000;
	word-wrap: break-word;
	overflow: hidden;
}

.notifications-footer {
	background-color: hsla(195, 71%, 32%, 0.1);
}

#menu_nav_user {
	line-height: 35px;
}
#menu_nav_user:hover, #menu_nav_user_mobile:hover {
	text-decoration: underline;
}
#menu_nav_user svg, #menu_nav_user_mobile svg {
	vertical-align: middle;
}
#menu_nav_user img, #menu_nav_user_mobile img {
	height: 32px;
	width: 32px;
	border-radius: 16px;
	border: 2px solid #FFF;
	object-fit: cover;
}

#kc_logo_top {
	display: block;
	padding: 20px 30px 20px 15px;
	position: relative;
	z-index: 1;
	background: linear-gradient(to top right, #FAF8F7 0%, #FAF8F7 50%, transparent 50%, transparent 100%);
	width: 251px;
	height: 70px;
	line-height: 30px;
}
#kc_logo_top > img {
	max-height: 30px;
	max-width: 100%;
}
#kc_logo_top::after {
	position: absolute;
	content: "";
	right: 0;
	top: 0;
	height: 100%;
	width: 100%;
	background-color: #FAF8F7;
	border-bottom: 1px solid #FAF8F7;
	z-index: -1;
	transform: skewX(15deg);
}

@media (max-width: 992px) { /* md (max) */
	#navbar_left > li.nav-item a.nav-link, #navbar_right > li.nav-item a.nav-link {
		padding-top: 0.7rem;
		padding-bottom: 0.7rem;
	}
}
@media (max-width: 576px) { /* sm (max) */
	#kc_logo_top {
		width: 170px;
	}

	.oauth-popup #kc_logo_top {
		width: 230px;
	}

	.nav-link {
		padding: .5rem 0rem;
	}
}
@media (max-width: 356px) {
	#kc_logo_top {
		width: 142px;
	}

	.oauth-popup #kc_logo_top {
		width: 190px;
	}

	.navbar-toggler {
		margin-right: 0px !important;
	}

	.menu-nav-notifications .notifications-icon {
		height: auto;
		width: 20px;
	}
}

.navbar .dropdown-menu::after {
	content: '';
	display: inline-block;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-bottom: 6px solid #fff;
	position: absolute;
	top: -6px;
	right: 25px;
}

.navbar .dropdown-menu > a > svg, .navbar .dropdown-menu > a > span.fa-layers {
	margin-right: 10px;
	font-size: 1.1em;
}
.navbar .dropdown-menu > a .fa-layers-counter {
	font-size: 1.8em;
	right: -3px;
	bottom: -4px;
}

#navbar_left > li.nav-item a.nav-link, #navbar_right > li.nav-item a.nav-link {
	padding-left: 1.2rem;
	padding-right: 1.2rem;
	color: #FFF;
}
#navbar_left > li.nav-item a.nav-link:hover, #navbar_right > li.nav-item a.nav-link:hover {
	text-decoration: underline;
}
#navbar_left > li.nav-item.active a.nav-link, #navbar_right > li.nav-item.active a.nav-link {
	font-weight: bold;
	background-color: rgba(0,0,0,0.2);
}
#navbar_left > li.nav-item, #navbar_right > li.nav-item {
	transition: text-shadow .3s;
}

#main_nav_extend_bg {
	background-color: hsl(195, 71%, 32%);
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}

#main_nav_extend_logo {
	background-color: #FAF8F7;
	border-bottom: 1px solid #FAF8F7;
	height: 70px;
}
#main_nav_extend_logo::after {
	position: absolute;
	content: "";
	right: -10px;
	top: 0;
	height: 70px;
	width: calc(100% + 20px);
	background-color: #FAF8F7;
	border-bottom: 1px solid #FAF8F7;
	transform: skewX(15deg);
}

.sub_nav a {
	color: hsl(195, 71%, 22%);
	text-shadow: 0 1px 1px #FFF;
}
.sub_nav a:hover {
	color: #B65F1E;
	text-decoration: underline;
}
.sub_nav a.nav-link {
	padding-top: .4rem;
	padding-bottom: .3rem;
	border-bottom: 3px solid transparent;
}

.sub_nav > li.nav-item.active a.nav-link {
	font-weight: bold;
	background-color: rgba(24,111,140,0.15);
	border-bottom: 3px solid hsl(195, 71%, 32%);
}

@media (max-width: 991.98px) {
	#submenu_admin ul {
		column-count: 4;
	}
	.sub_nav a.nav-link {
		padding-left: .5rem;
		padding-right: .5rem;
	}
}
@media (max-width: 767.98px) {
	#submenu_admin ul {
		column-count: 3;
	}
}
@media (max-width: 575.98px) {
	#submenu_admin ul {
		column-count: 2;
	}
}

/* "multi-level" inputs */
select option.option_l1 { font-weight: bold; }
select option.option_l2 { padding-left: 1em; }
select option.option_l2:disabled { color: #989898; }
select option.option_l3 { padding-left: 2em; }
select option.option_l4 { padding-left: 3em; }

/* custom media queries on Bootstrap breakpoints */
@media (min-width: 576px) { /* sm */
	#main_nav_extend_bg {
		width: calc( (100% - 540px) / 2 );
	}
}
@media (min-width: 768px) { /* md */
	#main_nav_extend_bg {
		width: calc( (100% - 720px) / 2 );
	}
}
@media (min-width: 992px) { /* lg */
	#main_nav_extend_bg {
		width: calc( (100% - 960px) / 2 );
	}
	#navbarsContainer {
		margin-left: -10px;
	}
	#navbar_left > li.nav-item:first-child a.nav-link {
		padding-left: 2.4rem;
	}
	#navbar_left > li.nav-item a.nav-link, #navbar_right > li.nav-item a.nav-link {
		padding-top: 15px;
		padding-bottom: 5px;
		height: 70px;
	}
	#navbar_left > li.nav-item.active a.nav-link {
		border-bottom: 5px solid rgba(255,255,255,0.5);
	}
	.kc_box.p-lg-4 .submitter {
		padding: 16px;
		margin: 0 -20px -20px -20px;
	}
	.kc_box.p-lg-4 .submitter .triangle {
		left: 31px;
	}
}
@media (min-width: 1200px) { /* xl */
	#main_nav_extend_bg {
		width: calc( (100% - 1140px) / 2 );
	}
}

table.fit-content,
table.fit-content thead th,
table.fit-content tfoot th,
table.fit-content tbody td, table.fit-content tfoot td {
	width: auto !important;
}

/* --- SEARCH HEADER --- */

.search-header {
	background-color: hsla(195, 71%, 32%, 0.1);
}
.search-header a:not(.btn) {
	color: #176D8A;
}
.search-header a:not(.btn):hover {
	color: #B65F1E;
}
.search-header a.text-shadow {
	text-shadow: 0 1px 1px #FFF;
}

.search-pills a {
	font-size: 0.85em;
	padding: 4px 8px;
	background-color: hsla(195, 71%, 32%, 0.1);
	border-radius: 4px;
	margin: 4px;
	display: inline-block;
	line-height: 1.2;
	color: initial;
}
.search-header .search-pills a {
	background-color: #FFF;
}
.search-pills a svg {
	margin-left: 2px;
	font-size: 0.8em;
}

.search-column {
	color: #34444A;
}
.search-column .filter-highlight {
	background-color: rgba(23, 109, 138, 0.1);
}
.search-column .moderator_bg > .filter-highlight {
	background-color: inherit;
}
.search-column h1 {
	font-size: 1.6em;
}
.search-column button.btn-collapsible {
	margin-top: 24px;
	text-align: left;
	display: block;
	width: 100%;
	padding: 0;
	text-decoration: none !important;
}
.search-column button.btn-collapsible:first-of-type {
	margin-top: 16px;
}
.search-column button.btn-collapsible[aria-expanded=true] {
	margin-bottom: 16px;
}
.search-column button.btn-collapsible > h1,
.search-column button.btn-collapsible > h2 {
	margin-top: 0;
	margin-bottom: 0;
}
.search-column button.btn-collapsible > h2 {
	padding-top: 16px;
}
.search-column button.btn-collapsible:first-of-type > h1,
.search-column button.btn-collapsible:first-of-type > h2 {
	padding-top: 13px;
}
.search-column button.btn-collapsible > h2 {
	border-top: 1px solid #E7EEF0;
}
.search-column h2 {
	font-size: 1.2em;
	font-weight: bold;
}
.search-column h3 {
	color: #34444A;
	font-size: 1em;
	font-weight: bold;
}
.search-column#navFilter .search-column-content .filter-highlight h2 {
	border-top: none;
	padding-top: 0;
}
.search-column [role=button] {
	cursor: pointer;
}
.search-column a[data-toggle=collapse]:not(.collapsed) {
	display: block;
}
.search-column [data-toggle=collapse][aria-expanded=false] .fa-chevron-up,
.search-column [data-toggle=collapse][aria-expanded=true] .fa-chevron-down {
	display: none;
}
.search-column li {
	margin-top: .5em;
	margin-bottom: .5em;
}
.search-column li ul.list-unstyled li {
	margin-left: .5em;
}
@media (pointer: fine) {
	.search-column {
		line-height: 1.2em;
		font-size: .95em;
	}
	.search-column li {
		margin-top: .4em;
		margin-bottom: .4em;
	}
}
.search-column .fa-ul {
	list-style-type: none;
	margin-left: 2em;
	padding-left: 0;
}
.search-column .fa-ul .fa-ul {
	margin-left: 1em;
}
.search-column .fa-li {
	left: -1.66666em;
	width: 1.33333em;
}
.search-column .squeeze {
	letter-spacing: -.02em;
}
.search-column .fa-ul li > a, .search-column .list-unstyled li > a {
	color: inherit;
}
.search-column .fa-ul a:hover, .search-column .list-unstyled a:hover {
	color: #B65F1E;
}
.search-column .fa-ul a .fa-square.invisible,
.search-column .fa-ul a .fa-circle.invisible {
	visibility: visible !important;
	color: transparent;
}
.search-column .fa-ul a:hover .fa-square.invisible, .search-column .fa-ul a:hover .fa-square.anchor,
.search-column .fa-ul a:hover .fa-circle.invisible, .search-column .fa-ul a:hover .fa-circle.anchor,
.search-column .fa-ul a:active .fa-square.invisible, .search-column .fa-ul a:active .fa-square.anchor,
.search-column .fa-ul a:active .fa-circle.invisible, .search-column .fa-ul a:active .fa-circle.anchor {
	color: #989898;
}
.search-column #filter-checked .fa-ul a:not(:hover):not(:active) .fa-square.anchor {
	color: inherit;
}

#bFavFilters {
	background-color: #FFFFFF;
	border-radius: 0.25rem;
	padding: 0.375rem 0.75rem;
	position: relative;
	color: hsl(195, 71%, 31%);
	box-shadow: inset 0 0 0 1px hsl(0, 0%, 75%);
	border: none;
	font-size: 0.9em;
	width: 100%;
	text-align: left;
	cursor: pointer;
}

#bFavFilters:hover {
	text-decoration: none;
	box-shadow: inset 0 0 0 1px hsl(195, 71%, 28%);
	background-color: #FFFFFF;
	color: hsl(195, 71%, 28%);
}
#bFavFilters::after {
	display: none;
}
#bFavFilters svg {
	position: absolute;
	top: 10px;
	right: 10px;
}

#sortModal .modal-content, #sortSurveyModal .modal-content {
	max-width: 339px;
}

#sortModal #sortList [role="listitem"]:hover {
	color: initial;
}

#sortModal #sortList [role="listitem"] {
	border: 1px solid #007B9F;
}

#sortModal #sortList [role="listitem"].current {
	border: 1px solid;
}

#sortModal #sortList [role="listitem"].moderator {
	border: 1px solid #008258;
}

/* --- FAVOURITE MODAL --- */
#favModal {
	overflow: inherit;
}

.edit_fav .fa-layers-counter,
.add_fav .fa-layers-counter {
	font-size: 1.6em;
	right: -4px;
	bottom: -2px;
	background-color: hsl(26, 86%, 40%);
}

#favModal .nav-link .favourited {
	color: hsl(26, 86%, 40%);
}

#favModal nav {
	overflow-x: hidden;
	overflow-y: hidden;
	height: 35px;
}

#favModal nav .nav-tabs {
	overflow-x: auto;
	overflow-y: hidden;
	white-space: nowrap;
	border-bottom: none;
}

#favModal nav .nav-tabs::-webkit-scrollbar {
	display: none;
}

#favModal .nav-tabs .nav-item {
	margin-bottom: 0;
	border-color: #e9ecef #e9ecef #dee2e6;
}

#favModal .nav-tabs .nav-link.active {
	font-weight: bold;
	border-width: 2px 2px 5px;
	border-color: #bfbfbf #bfbfbf white;
	margin-bottom: -5px;
}

#favModal .nav-tabs .nav-item .picture {
	background-color: #FFF;
	border-radius: 14px;
	vertical-align: bottom;
	width: 23px;
	height: 23px;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	line-height: 24px;
	font-size: 14px;
	border: none;
}

#favModal .left-paddle,
#favModal .right-paddle {
	top: 0;
	position: absolute;
	height: 35px;
	display: flex;
	align-items: center;
	background-color: #bfbfbf;
	border: none;
	color: white;
}

#favModal .left-paddle:hover,
#favModal .right-paddle:hover {
	background-color: gray;
}

#favModal .left-paddle {
	left: 0;
}

#favModal .right-paddle {
	right: 0;
}

#favModal .nav-tabs hr {
	border-top: 3px solid #bfbfbf;
}

#favLists {
	border-bottom: 2px solid #bfbfbf;
}

#favLists .pane_row {
	border-bottom: 1px solid #dee2e6;
}

#favLists .tab-pane {
	max-height: 200px;
	overflow-y: auto;
}

#favLists .tab-pane::-webkit-scrollbar-track {
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	border-radius: 10px;
	background-color: #F5F5F5;
}

#favLists .tab-pane::-webkit-scrollbar {
	width: 10px;
	background-color: #F5F5F5;
}

#favLists .tab-pane::-webkit-scrollbar-thumb {
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
	background-color: #c0c1c0;
}

#favLists .div_checkbox label:hover {
	background-color: rgb(230,239,241);
}

#favLists .tab-pane div:last-of-type {
	border-bottom: none;
}

#divPrivacy,
#divPrivacy .organisation,
#favourites_list_warning,
#favLists .tab-pane.add_view .div_checkbox,
#favLists .tab-pane.add_view .update_favourite .remove,
#add_new_folder.add_view,
#favLists .tab-pane .update_favourite .updating,
#favLists .tab-pane.edit_view .update_favourite .add {
	display: none;
}

#favLists .tab-pane.edit_view .div_checkbox,
#favLists .tab-pane.edit_view .update_favourite .remove,
#add_new_folder.edit_view,
#favLists .tab-pane.add_view .update_favourite .add {
	display: block;
}

/* --- PROFILE PICTURE --- */
.picture {
	display: inline-block;
	width: 40px;
	height: 40px;
	background-color:#DDD;
	color: rgba(0,0,0,0.3);
	border: 2px solid #FFF;
	font-size: 22px;
	line-height: 36px;
	border-radius: 50%;
	text-align: center;
}
.picture.large {
	width: 64px;
	height: 64px;
	line-height: 60px;
	font-size: 36px;
}
.picture img {
	height: 100%;
	width: 100%;
	object-fit: cover;
	vertical-align: top;
	border-radius: 50%;
}

/* --- KC BOX --- */

.kc_box {
	padding: 16px;
	background-color: #FFF;
	border: 1px solid #FFF;
	border-radius: 4px;
	box-shadow: 0 0 0 1px rgba(15,72,91,0.1);
	word-wrap: break-word;
}
.kc_box.anchor, .kc_box.anchor:hover {
	border-width: 2px;
	border-color: inherit;
	box-shadow: initial;
}
.kc_box.selected {
	background-color: hsla(195, 71%, 32%, 0.05);
	border-color: hsl(195, 71%, 28%);
}
.kc_box:not(.no_hover):hover {
	box-shadow: 0 0 0 2px rgba(15,72,91,0.15);
}
.kc_box h1 {
	font-size: 1.6em;
	font-weight: normal;
}
.kc_box h2 {
	font-size: 1.4em;
	font-weight: normal;
	margin-bottom: 8px;
}
.kc_box h2.list-h {
	border-bottom: 1px solid rgba(15,72,91,0.2);
	padding-bottom: 8px;
	margin-top: 0;
}
.kc_box h3 {
	font-size: 1.2em;
}
.kc_box p {
	margin: 8px 0;
}
.kc_box.px-0 a > img, .kc_box.px-0 iframe {
	border-radius: 4px 4px 0 0;
}
.kc_box.px-0 > *:not(a), .kc_box.px-0 > a > *:not(img) {
	padding: 0 16px;
}
.kc_box a.box_link {
	display: block;
	color: #000;
}
.kc_box a.box_link:hover {
	text-decoration: none;
}
.kc_box a.box_link:hover h2, .kc_box a.box_link:hover h3, .kc_box a.box_link:hover .anchor {
	color: #D26E25;
	text-decoration: underline;
}
.kc_box a.box_link h2, .kc_box a.box_link h3,
#themes-list .theme-title
{
	color: hsl(195, 71%, 22%);
	font-weight: bold;
	margin-bottom: 8px;
	word-wrap: break-word;
}
.kc_box a.box_link img + h2 {
	margin-top: 16px;
}

.kc_box .contribution_title {
	margin-top: 0;
	border-bottom: 1px solid rgba(15,72,91,0.1);
	padding-bottom: 8px;
	font-size: 1.25em;
}
.kc_box .contribution_title + div p:first-child {
	margin-top: 0;
}
.kc_box img {
	max-width: 100%;
	height: auto;
}
.kc_box .picture img {
	height: 100%;
}
.kc_box .logo_container {
	width: 180px;
	max-width: 40%;
	text-align: right;
}
.kc_box .logo_container img {
	max-height: 140px;
	border-radius: 4px;
}

.kc_box .box_label {
	background-color: #E7EEF1;
	top: -13px;
	left: 16px;
	max-width: calc(100% - 32px);
}

#search-results .kc_box .logo-caption {
	background-color: black;
	color: white;
	border-radius: 7px;
	bottom: 80px;
	right: 19px;
	z-index: 1;
	height: 19px;
	display: flex;
	opacity: 0;
	font-size: 0.8em;
}

#search-results .grid-item .kc_box .logo-caption {
	bottom: unset;
	right: 14px;
}

@media (max-width : 992px) {
	#search-results .kc_box .logo-caption {
		opacity: 0.7;
	}
}

.kc_box.box_network a > span {
	background-color: hsla(195, 71%, 32%, 0.1);
	border-radius: 4px 4px 0 0;
	text-align: center;
}

.kc_box.box_network a > span svg {
	width: 100px;
	vertical-align: top;
}
.kc_box.box_network .cls-1{ fill:none;stroke:hsl(195, 71%, 22%);stroke-miterlimit:10;stroke-width:3px; }
.kc_box.box_network .cls-2,.kc_box.box_network .cls-3{ fill:hsl(195, 71%, 22%); }
.kc_box.box_network .cls-2{ opacity:0.2; }

.kc_box .submitter {
	padding: 12px;
	background-color: hsla(195, 71%, 32%, 0.05);
	border-radius: 0 0 4px 4px;
	margin: 0 -12px -12px -12px;
	position: relative;
	box-shadow: inset 0 1px 4px rgba(0,0,0,0.05);
	line-height: 1.2em;
	clear: both;
}

.kc_box .badge.badge-pill.badge-new {
	bottom: -26px;
	background-color: #327962;
	color: white;
	left: 0;
}
.kc_box .grid-item-content .badge.badge-pill.badge-new {
	bottom: -22px;
}

.kc_box .submitter .triangle {
	position: absolute;
	width: 10px; 
	height: 10px;
	left: 27px;
	top: -5px;
	background-color: #FFF;
	transform: rotate(45deg);
	box-shadow: 1px 1px 1px #EDEDED;
}
.kc_box .submitter .picture, .kc_box .theme-info .picture {
	margin-right: 8px;
}
.kc_box .submitter .picture.large {
	margin-right: 12px;
}
.kc_box .grid-submitter {
	line-height: 24px;
	position: absolute;
	left: 16px;
	top: 16px;
	background-color: #FFF;
	border-radius: 14px;
	padding: 2px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.2);
	max-width: calc(100% - 72px);
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}
.kc_box .grid-submitter .picture {
	width: 24px;
	height: 24px;
	font-size: 14px;
	float: left;
	line-height: 24px;
	border: none;
}
.kc_box .grid-submitter .picture + span {
	margin: 0 8px;
}

.kc_box .theme-title {
	text-shadow: 0px 1px 2px rgba(0,0,0,0.8);
	background-image: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.4) 35%, rgba(0, 0, 0, 0.8) 100%);
	position: absolute;
	bottom: 0;
	left: 0;
}
.kc_box .theme-info {
	line-height: 1.2em;
}
.kc_box .theme-picture {
	min-height: 100px;
}
.kc_box .theme-picture img {
	object-fit: cover;
	border-radius: 4px 4px 0 0;
	max-height: 200px;
}
@media (min-width: 768px) { /* md */
	.kc_box .theme-picture img {
		border-radius: 4px 0 0 4px;
		height: 100%;
		max-height: none;
	}
	.kc_box .theme-title {
		border-radius: 0 0 0 4px;
	}
}

#themes-list .theme-picture {
	border-radius: 0.5rem;
}

#themes-list .theme-title {
	margin-top: 0;
	margin-bottom: 0 !important;
	font-size: 1.25em;
}

#themes-list .box_link:hover .theme-title {
	color: #B65F1E;
	text-decoration: underline;
}

#themes-list .theme-description {
	font-size: 0.8em;
}

#themes-list .theme-follow {
	font-size: 1em;
}

#themes-list .theme-follow {
	left: 274px;
	bottom: 15px;
}

#themes-list .theme-follow > * {
	color: hsl(26, 86%, 40%);
}

#themes-list > div {
	margin-bottom: 32px;
}

@media (min-width: 576px) {
	#themes-list .theme-follow {
		position: absolute;
	}

	#themes-list .theme-title {
		margin-bottom: 5px !important;
	}

	#themes-list .theme-picture {
		width: 250px;
		height: 131px;
		min-width: 250px;
		border-radius: 0.5rem;
	}

	#themes-list > div {
		margin-bottom: 16px !important;
	}
}

.subject_box {
	background-color: hsla(195, 71%, 32%, 0.05);
	border-radius: 4px;
	padding: 16px;
}

.theme_text h1 {
	font-size: 1.72em;
}
.theme_text h2 {
	margin: 32px 0 0 0;
}
.theme_text h3 {
	font-size: 1.1em;
	margin: 24px 0 0 0;
}

/* --- RESOURCE DETAIL --- */
.detail_box dl dt {
	margin-top: 8px;
	margin-bottom: 4px;
}

.detail_box > dl > dt {
	border-bottom: 1px solid hsla(195, 71%, 32%, 0.1);
	margin-top: 32px;
	margin-bottom: 8px;
	font-size: 1.2em;
	font-weight: normal;
	color: hsl(195, 71%, 12%);
}

.detail_box > dl > dt:first-child {
	margin-top: 0;
}

.detail_box dl dd.pills > span, .detail_box dl dd.pills > a {
	background-color: hsla(195, 71%, 32%, 0.1);
	border-radius: 4px;
	padding: 2px 8px;
	margin: 3px 6px 3px 0;
	font-size: 0.9em;
	display: inline-block;
	line-height: 1.2;
}
.detail_box dl dd.pills a {
	color: #176D8A;
}
.detail_box dl dd.pills a:hover {
	color: #B65F1E;
}

.detail_box table.info tr > td:first-child {
	font-weight: bold;
	width: 50%;
	min-width: 120px;
	vertical-align: top;
}

.detail_box table.info tr > td:first-child .fa-level-up {
	color: #979797;
}

.kc_box .image-preview:hover {
	cursor: zoom-in;
}

#imagePreviewModal .modal-dialog {
	max-width: fit-content !important;
}

.action_box {
	padding: 16px;
	border-radius: 4px;
	border: 2px solid hsla(195, 71%, 32%, 0.1);
}

.action_box h2 {
	font-size: 1.1em;
	margin: 0;
}

.action_box textarea {
	border: 1px solid hsl(195, 71%, 32%);
	border-radius: 4px;
	padding: 10px;
	height: 65px;
	line-height: 22px;
}

.action_box textarea:focus {
	box-shadow: 0 0 3px hsl(195, 71%, 32%);
}

.kc-embed iframe {
	max-width: 100%;
}

.give_score:hover a {
	color: #B65F1E;
}

#preview-modal.test-group .criteria.selected,
#divFeedback .scores > .criteria.selected {
	background-color: hsl(195, 71%, 22%);
	color: #FFF;
}

#preview-modal.test-group  #divScore .criteria hr,
#divFeedback .scores button hr {
	border-top: 3px solid white;
	width: 70px;
}

.subsite_icons a.subsite_icon{
	display: inline-block;
	margin-top:5px;
	margin-right: 5px;
	background-position: 0 0;
	background-repeat: no-repeat;
	height: 40px;
	width: 40px;
}
.subsite_icons a.subsite_icon:hover{
	background-position: 0 -40px;
}

ul.pills {
	list-style-type: none;
	margin: 0;
	padding: 0;
}
ul.pills li {
	display: inline-block;
	padding: 5px;
	background-color: #EEE;
	line-height: 1;
	border-radius: 4px;
	font-size: .8em;
	margin: 4px;
}
ul.pills.condensed li {
	font-size: .7em;
	letter-spacing: -.3px;
}

/* user mentions */
[contentEditable=true]:empty:not(:focus):before {
	content:attr(data-ph);
	color:rgb(171,179,200);
	pointer-events: none;
}

#mentionUserModal .modal-dialog {
	width: 300px;
}

#mentionUserModal #loadingMentions {
	display: none;
	bottom: 7px;
	right: 9px;
}

#mentionUserModal #searchMentionResults {
	margin: 0 -16px 0 -16px;
	max-height: 156px;
	overflow-y: auto;
}

/* object reactions */
#reactions .picture {
	width: 32px !important;
	height: 32px !important;
	line-height: 26px !important;
	font-size: 1em;
}

.txa_reaction[contentEditable=true] {
	height: auto !important;
	display: inline-block !important;
}
.txa_reaction.ab_test[contentEditable=true] {
	border-color: #007b91;
}
.txa_reaction.ab_test[contentEditable=true]:empty:not(:focus):before {
	color:rgba(0, 123, 145, 0.8);
}

#reactions a.user {
	color: initial;
}
#reactions a.user:hover, #reactions a.user:hover .picture {
	color: #D26E25;
}
#reactions .reaction {
	padding: 8px;
	border: 1px solid rgba(0,0,0,0.1);
	border-radius: 4px;
	word-wrap: break-word;
}

#reactions .reaction.speech-arrow:before {
	content: "";
	position: absolute;
	bottom: calc(100% - 3px);
	left: 11px;
	height: 8px;
	width: 8px;
	transform: rotate(225deg);
	border-bottom:inherit;
	border-right:inherit;
	background: white;
}

#reactions .reaction p {
	margin-bottom: 0.5rem;
}
#reactions .reaction p:last-child {
	margin-bottom: 0;
}

#recommanded img {
	height: 50px;
	width: 50px;
	object-fit: cover;
	border-radius: 4px;
}

.moderator, .moderator h2 {
	color: #008258;
}
.moderator a, a.moderator, .moderator button.abtn, button.abtn.moderator {
	text-decoration: underline;
	color: #008258;
}
.moderator_bg.abtn {
	background-color: #e3f9f1;
}
a.moderator.dropdown-item, section[id^="filter-"] .moderator a,
button.moderator.dropdown-item, section[id^="filter-"] .moderator button {
	text-decoration: none;
	color: #008258;
}
.moderator_bg {
	background-color: #e3f9f1;
	border-radius: 4px;
}

a#oefenbe_link {
	display: inline-block;
	width: 123px;
	height: 30px;
	background-image: url('../img/oefen_be.png');
	background-position: 0 0;
	vertical-align: middle;
	margin-right: 5px;
}
a#oefenbe_link:hover {
	background-position: 0 -30px;
}

/* Make the video relative, instead of absolute, so that
   the parent container will size based on the video. Also,
   note the max-height rule. Note the line-height 0 is to prevent
   a small artifact on the bottom of the video.
 */
.video-js.vjs-fluid,
.video-js.vjs-16-9,
.video-js.vjs-4-3,
video.video-js,
video.vjs-tech {
	max-height: calc(100vh - 64px);
	position: relative !important;
	width: 100%;
	height: auto !important;
	max-width: 100% !important;
	padding-top: 0 !important;
	line-height: 0;
}

/* Fix the control bar due to us resetting the line-height on the video-js */
.vjs-control-bar {
	line-height: 1;
}

/* --- SEARCH RESULTS --- */

#results .kc_box {
	margin-bottom: 3em;
}
#results.sortable > div {
	cursor: move;
}
.current {
	font-weight: bold;
	color: initial;
}

/* --- PROFILE --- */

#ProfileBar.container {
	border-radius: 0 0 8px 8px;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}

#ProfileBar .picture {
	position: relative;
	width: 100%;
	height: auto;
	max-width: 170px;
	border: 5px solid #FFF;
	box-shadow: 0 0 3px rgba(0,0,0,0.1);
	cursor: default;
}
#ProfileBar .picture:before {
	content: "";
	display: block;
	padding-top: 100%;
}
#ProfileBar .picture .content {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	line-height:100%;
	height:100%;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
}
#ProfileBar .picture .content svg {
	font-size: 84px;
	vertical-align: middle;
}
#ProfileBar .picture span.fa-layers {
	position: absolute;
	bottom: 0;
	right: 0;
}

#ProfileBar .org_picture {
	border: 6px solid #FFF;
	box-shadow: 0 0 3px rgba(0,0,0,0.1);
	background-color: #FFF;
	border-radius: 4px;
	cursor: default;
}
#ProfileBar .org_picture img {
	max-height: 150px;
	max-width: 100%;
}

#ProfileBar #aBackground {
	right: 10px;
	top: 10px;
	z-index: 1;
	background-color: rgba(0,0,0,0.4);
}
#ProfileBar #divBackgroundSuccess {
	display:none;
	top: 60px;
	right: 10px;
	background-color: rgba(212, 237, 218, 0.8);
}

#ProfilePullup h1 {
	font-size: 1.8em;
	text-shadow: 0 1px 1px #FFF;
}

@media (min-width: 992px) { /* lg */
	#ProfilePullup {
		padding-top: 10px;
		margin-top: -5rem;
		background-color: rgba(255,255,255,0.8);
		-webkit-backdrop-filter: blur(2px);
		backdrop-filter: blur(2px);
	}
}

#share_my_contributions {
	color: #204759;
	font-size: 20px;
}

/* --- ADD RESOURCE PAGE --- */
#addResource .add-block {
	display: flex;
	box-shadow: 0 1px 4px 0 rgba(0,0,0,0.2);
	margin-top: 24px;
	border-radius: 4px;
	flex-direction: row;
	min-height: 94px;
}
#addResource .add-block:hover {
	text-decoration: none;
	box-shadow: 0 2px 6px 0 rgba(0,0,0,0.4);
}
#addResource .add-block:hover .title {
	text-decoration: underline;
}
#addResource .add-block .title {
	font-weight: bold;
	margin-bottom: 4px;
	text-transform: uppercase;
}
#addResource .add-block .icon {
	padding: 16px;
	font-size: 1.8em;
	align-self: center;
}
#addResource .add-block .icon + div {
	background-color: #e8f0f3;
	flex: 1 1 auto;
}
#addResource .add-block .description {
	color: #000;
	line-height: 1.2;
	font-size: 0.9em;
}

/* --- REGISTRATION --- */
.nav.nav-pills li a.disabled {
	cursor: not-allowed;
}
.nav.nav-pills li a.active {
	background-color: #DEDEDE;
	cursor: default;
	color: initial;
}

#passwordShow {
	display: none;
	right: 8px;
	position: absolute;
	top: 8px;
	cursor: pointer;
}

/* --- SUBMENU --- */
#submenu a {
	display: block;
	padding: 8px;
	border-radius: 8px;
	background-color: hsla(195, 71%, 32%, 0.1);
	font-size: 1.2em;
	text-align: center;
	border: 1px solid hsla(195, 71%, 32%, 0.4);
	color: #176D8A;
}
#submenu a.active {
	color: #333;
	font-weight: bold;
	background-color: hsla(0, 0%, 80%, 0.15);
	border: 1px solid hsla(0, 0%, 59%, 0.4);
}
#submenu a:hover {
	color: #B65F1E;
}

/* COMMA LIST */
ul.comma-list {
	display: inline;
	list-style: none;
	margin: 0;
	padding: 0;
}
ul.comma-list li {
	display: inline;
}
.comma-list li:not(:last-child)::after {
	content: ",";
}

/* --- HELP CLASSES --- */

.font-size-xs {
	font-size: 0.75em;
}
.font-size-sm {
	font-size: 0.9em;
}
.font-size-lg {
	font-size: 1.1em;
}
.font-size-xl {
	font-size: 1.2em;
}
.font-size-init {
	font-size: initial;
}
.font-vn-tabnums {
	font-variant-numeric: tabular-nums;
}
.text-ss-primary, .text-orange {
	color: #B65F1E;
}
.text-blue {
	color: hsl(195, 71%, 22%);
}
.text-bluegrey {
	color: #6E7872 !important;
}
.text-grey {
	color: #989898 !important;
}
.text-underline {
	text-decoration: underline;
}
.text-linethrough {
	text-decoration: line-through;
}
.bg-grey {
	background-color: #EEEEF2;
}
.bg-red {
	background-color: #ffeeee;
}
.bg-main {
	background-color: hsla(26, 72%, 42%, 0.1);
}
.bg-blue {
	background-color: hsla(195, 71%, 32%, 0.1);
}
.bg-ss-primary {
	background-color: #B65F1E;
}
.bg-link {
	background-color: #008198;
}
.bg-yellow {
	background-color: #fff3cd;
}
.border-grey {
	border-color: #ced4da;
}
.clear-both {
	clear: both;
}
.hidden {
	display: none;
}
.lh-120 {
	line-height: 1.2;
}
.c-pointer {
	cursor: pointer;
}
.c-move {
	cursor: move;
}
.img-cover {
	object-fit: cover;
}
.overflow-ellipsis {
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}

/* --- CUSTOM BUTTONS --- */

.kc_button {
    background-color: hsl(26, 86%, 40%);
    color: #FFFFFF;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    margin: 0;
    box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.3);
	font-weight: bold;
	font-size: 1.1rem;
	line-height: 1.5rem;
	border: none;
	white-space: normal;
}
.kc_button.large {
	line-height: 2rem;
	border-radius: 6px;
}
.kc_button:hover {
	background-color: hsl(26, 72%, 32%);
	color: #FFF;
}
.kc_button.white {
	background-color: #FFF;
	color: hsl(195, 71%, 32%);
}
.kc_button.white:hover {
	color: #B65F1E;
}
.kc_button.smaller {
	line-height: 1.2rem;
	font-weight: normal;
	font-size: 1rem;
}

.kc_button2 {
	background-color: hsl(195, 71%, 22%);
	color: #FFF;
	box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.3);
	display: inline-block;
	line-height: 1.5rem;
	border: none;
	white-space: normal;
}
.kc_button2.large {
	line-height: 2rem;
	border-radius: 6px;
}
.kc_button2:hover {
	background-color: hsl(195, 71%, 12%);
	color: #FFF;
}
.kc_button2.grey {
	background-color: #DEDEDE;
	color: #008198;
}
.kc_button2.grey:hover {
	background-color: #CDCDCD;
}
.kc_button2.green {
	background-color: #008944;
}
.kc_button2.green:hover {
	background-color: #006633;
}
.kc_button2.smaller {
	line-height: 1.2rem;
}

.kc_button3 {
	background-color: #E6F1F3;
	border: none;
	color: #176D8A;
	line-height: 1.2rem;
}
.kc_button3:hover {
	color: #B65F1E;
}

.abtn {
	background: none;
	cursor: pointer;
	border: none;
	color: #007b91;
}
.abtn.grey {
	color: #6c757d;
}
.abtn.orange {
	color: #B65F1E;
}
.abtn:hover {
	color: #B65F1E;
	text-decoration: underline;
}
.abtn.inverted {
	background: #007b91;
	color: white;
}
.abtn.inverted:hover {
	background: #B65F1E;
}

.ws-nowrap {
	white-space: nowrap;
}

#btnScrollUp {
	position: fixed;
	bottom: 20px;
	right: 20px;
	color: #FFF;
	border: none;
	border-radius: 50%;
	padding: 8px 10px;
	background-color: rgba(0, 123, 145, 0.4);
}

@media (max-width: 768px) {
	#logonbtns {
		margin-left: 0.5em;
		margin-bottom: 1em;
	}
}

.modal-title {
	line-height: 1.2em;
	margin-top:	0px;
}

/* --- OVERRIDES --- */

::placeholder {
	color: #AAA !important;
	opacity: 1;
}

.ui-widget, .popover {
	font-family: inherit;
}

.ui-autocomplete .ui-menu-item {
	padding-top: 2px;
	padding-bottom: 2px;
}

.ui-autocomplete .ui-menu-item.ac-optgroup-label {
	opacity: 1;
	clear: both;
	float: right;
	font-size: 0.8em;
	background-color: #176d8a !important;
}

.ui-autocomplete .ui-menu-item.ac-optgroup-label > div {
	z-index: 1;
	padding: 3px 0.4em 3px .4em !important;
}

.ui-autocomplete .ui-menu-item.ac-optgroup-label:first-child {
	margin-top: 0.4em;
}

.ui-autocomplete .ui-menu-item.ac-optgroup-label:not(:first-child) {
	margin-top: 1em;
}

.ui-autocomplete .ui-menu-item.ac-optgroup-label:not(:first-child) + .ui-menu-item {
	border-top: 1px solid #999;
	margin-top: 0.5em;
}

.ui-autocomplete .ui-menu-item {
	font-weight: bold;
}
.ui-autocomplete .ui-menu-item.ui-menu-item-extra {
	font-weight: normal;
}
.ui-autocomplete .ui-menu-item .ui-state-active {
	font-weight: inherit;
}

.ui-autocomplete .ui-menu-item mark {
	background-color: initial;
	color: inherit;
	padding: initial;
	font-weight: normal;
}

.ui-autocomplete .ui-menu-item small {
	font-weight: normal;
}

div[hidden] + div > hr:only-child {
	display: none;
}

.dropdown-toggle::after {
	vertical-align: middle;
}

/* override Bootstrap tooltip max width */
.tooltip-inner {
	max-width: 300px;
}

.tooltip-inner p:last-child {
	margin-bottom: 0;
}

.tooltip-inner a {
	color: #00C3E6;
	text-decoration: underline;
}

.tooltip-inner .moderator {
	color: #00f8a8;
}

.alert-success .fa-layers .fa-inverse {
	color: #d4edda;
}

.alert-info .fa-layers .fa-inverse {
	color: #d1ecf1;
}

.alert-warning .fa-layers .fa-inverse {
	color: #fff3cd;
}

.alert-danger .fa-layers .fa-inverse {
	color: #f8d7da;
}

/* --- ANCHORS --- */
a, .anchor, .btn-link {
	color: #007b91;
}
/* keep at bottom so hover color also applies to other anchor colors */
a:hover, .anchor:hover, .btn-link:hover {
	color: #B65F1E;
}
.anchor.anchor-dark {
	color: #34444A;
}

.link-hover-bg img {
	background-color: #FFF;
}
.link-hover-bg a.link:hover, button.link:hover, a.bg-link:hover, button.bg-link:hover {
	background-color: #B65F1E;
}

/* Font Awesome checklist */
.div_checkbox label {
	cursor: pointer;
	color: #666;
}
.div_checkbox .unchecked {
	color: #999;
}
.div_checkbox input[type=checkbox], .div_checkbox input[type=radio] {
	opacity: 0;
	position: absolute;
	z-index: -1;
}
.div_checkbox input[type=checkbox]:focus + label, .div_checkbox input[type=radio]:focus + label {
	box-shadow: 0 0 0 .2rem rgba(0,123,255,.25);
}
.div_checkbox .checked {
	color: #B65F1E;
	display: none;
}
.div_checkbox input:checked + label {
	color: #000;
}
.div_checkbox input:checked + label .checked {
	display: inline;
}
.div_checkbox input:checked + label .unchecked {
	display: none;
}

/* checklist with default checkboxes */
.checkbox_list {
	line-height: 1.3;
}
.checkbox_list label {
	padding: 0 2px;
	margin-bottom: 2px;
}
.checkbox_list input:checked + label {
	background-color: #0099e6;
	color: #FFF;
}

/* div checkbox form control */
div.form-control.checkbox {
	padding: 0;
	border: none;
	height: auto;
}
div.form-control.checkbox input[type="checkbox"] {
	position: absolute;
	left: -10000px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}
div.form-control.checkbox input[type="checkbox"] + label {
	display: block;
	padding-left: 20px;
	background-image: url('../img/icons/checkbox_empty.png');
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-position: 4px center;
	margin-bottom: 0;
	line-height: 1.8em;
	cursor: pointer;
}
div.form-control.checkbox input[type="checkbox"]:focus + label {
	background-color: #ddd;
}
div.form-control.checkbox input[type="checkbox"]:checked + label {
	background-image: url('../img/icons/checkbox_orange.png');
}

/* WAI-ARIA */

[role="listbox"] {
	height: auto;
	padding: 0px;
	background: white;
	border: 1px solid #ccc;
	border-radius: 4px;
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
	transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

[role="listbox"][data-size] {
	max-height: 18em;
	overflow-y: auto;
	position: relative;
}

[role="listbox"]:focus {
	border-color: #005892;
	outline: 0;
}

[role="option"] {
	display: block;
	padding: 0 1em;
	position: relative;
	line-height: 1.8em;
	cursor: pointer;
}

[role="option"][aria-level="2"] {
	margin-left: 20px;
}
[role="option"][aria-level="3"] {
	margin-left: 40px;
}
[role="option"][aria-level="4"] {
	margin-left: 60px;
}

[role="listbox"]:focus [role="option"].focused {
	background-color: #ddd;
}

[role="option"] {
	padding-left: 20px;
	background-image: url('../img/icons/checkbox_empty.png');
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-position: 4px center;
}

[role="listbox"]:not([aria-multiselectable="true"]) [role="option"].focused,
[role="listbox"][aria-multiselectable="true"] [role="option"][aria-selected="true"] {
	background-image: url('../img/icons/checkbox_orange.png');
}

.listbox-filter .form-control {
	border-bottom-left-radius: 0;
}
.listbox-filter .input-group-addon {
	border-bottom-right-radius: 0;
}
.listbox-filter + [role="listbox"] {
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}
.listbox-filter + [role="listbox"][data-size] {
	height: 18em;
}

.selection-pills button {
	font-size: 0.85em;
	border-radius: 4px;
	background-color: hsla(195, 71%, 32%, 0.1);
	margin-right: 8px;
	margin-bottom: 8px;
	padding: 2px 8px;
	border: none;
}
.selection-pills button:hover {
	background-color: hsla(195, 71%, 32%, 0.2);
}
.selection-pills button svg {
	margin-left: 5px;
	font-size: 0.9em;
}

/*@media (max-width: 768px) {*/
#search.form-control {
	display: block;
	width: 100%;
	padding: .375rem 0.75rem;
	font-size: 1rem;
	line-height: 1.4;
	color: #495057;
	background-color: #FFF;
	background-clip: padding-box;
	border: 1px solid #176D8A;
	border-radius: 0.5rem;
	box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
	transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
/*}*/

@media (max-width: 992px) {
	.search-column {
		height: 100%;
		width: 0;
		position: fixed; 
		z-index: 99;
		left: 0;
		top: 0;
		padding: 0px;
		background-color: rgb(255,255,255);
		overflow-x: hidden; /* Disable horizontal scroll */
		transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
	}

	/* Position the content inside the overlay */
	.search-column-content {
		position: relative;
		top: 5%; 
		width: 100%; /* 100% width */
		padding-left: 5%;
		padding-right: 5%;
		margin-top: 30px;
	}

	/* The navigation links inside the overlay */
	.search-column a {
		transition: 0.3s; /* Transition effects on hover (color) */
	}

	/* Position the close button (top right corner) */
	.search-column .closebtn {
		position: absolute;
		top: 10px;
		right: 5%;
	}

	/* When the height of the screen is less than 450 pixels, change the font-size of the links and position the close button again, so they don't overlap */
	@media screen and (max-height: 450px) {
		.overlay a {font-size: 20px}
		.overlay .closebtn {
			font-size: 40px;
			top: 15px;
			right: 35px;
		}
	}
}

.youtube,
.vimeo {
	background-color: #000;
	position: relative;
	overflow: hidden;
}
.youtube img,
.vimeo img {
	width: 100%;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
}
.youtube .play-button,
.vimeo .play-button {
	cursor: pointer;
	width: 68px;
	height: 48px;
	background-color: #212121;
	box-shadow: 0 0 30px rgba( 0,0,0,0.6 );
	z-index: 1;
	opacity: 0.8;
	border-radius: 6px;
	transition: background-color .1s cubic-bezier(0.4,0.0,1,1), opacity .1s cubic-bezier(0.4,0.0,1,1);
}
.youtube:hover .play-button {
	background-color: #f00;
	opacity: 1;
}
.vimeo:hover .play-button {
	background-color: #00ADEF;
	opacity: 1;
}
.youtube .play-button::before,
.vimeo .play-button::before {
	content: "";
	border-style: solid;
	border-width: 10px 0 10px 18.0px;
	border-color: transparent transparent transparent #fff;
}
.youtube img,
.youtube iframe,
.youtube .play-button,
.youtube .play-button::before,
.vimeo img,
.vimeo iframe,
.vimeo .play-button,
.vimeo .play-button::before {
	position: absolute;
}
.youtube .play-button,
.youtube .play-button::before,
.vimeo .play-button,
.vimeo .play-button::before {
	top: 50%;
	left: 50%;
	transform: translate3d( -50%, -50%, 0 );
}
.youtube iframe,
.vimeo iframe {
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
}

#btnCookieNecessary, #btnCookieRecommended, #btnCookieAll {
	font-size: 0.9em !important;
}

#btnCookieNecessary, #btnCookieRecommended, #btnCookieAll {
	line-height: 1.3 !important;
}

#loginAndAcceptCookies {
	font-size: 1rem !important;
}

.cookie-overlay {
	background-color: rgba( 255,255,255,.95 );
	box-shadow: 0 0 30px rgba( 0,0,0,0.6 );
	padding: 1em;
	text-align: center;
	z-index: 1;
	border-radius: 6px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate3d( -50%, -50%, 0 );
	transition: 0.15s ease-in-out;
	width: 60%;
}
:hover > .cookie-overlay {
	background-color: rgba( 255,255,255,1 );
	transform: translate3d( -50%, -50%, 0 ) scale(1.02);
	transition: 0.15s ease-in-out;
}
:hover > .cookie-overlay .anchor {
	text-decoration: underline;
}
.cookie-overlay::before {
	content: ' ';
	background: url("../img/icons/cookie.svg") center no-repeat;
	display: block;
	height: 24px;
	margin-top: calc(-12px - 1em);
	margin-bottom: .5em;
}
@media (min-width: 768px) { /* md */
	.cookie-overlay::before {
		height: 36px;
		margin-top: calc(-18px - 1em);
	}
}
@media (min-width: 1200px) { /* xl */
	.cookie-overlay::before {
		height: 48px;
		margin-top: calc(-24px - 1em);
	}
}

#divShare > * {
	color: white;
}

#divShare #facebook {
	background-color: #4267B2;
}

#divShare #pinterest {
	background-color: #E60023;
	cursor: pointer;
}

#divShare #message {
	background-color: #176D8A;
}

#divShare #copy_link {
	background-color: #34444a;
}

#copy_link-success {
	display: none;
}

.horizontal-list {
	position: relative;
	overflow-x: hidden;
	overflow-y: hidden;
	height: 192px;
}

.horizontal-list .list {
	box-sizing: border-box;
	white-space: nowrap;
	overflow-x: auto;
	padding-left: 0;
}

.horizontal-list .item {
	width: 186px;
	height: 186px;
	display: inline-flex;
	white-space: normal;
}

@media (max-width: 575px) {
	.horizontal-list .expanded-list .item {
		width: 100%;
		height: 186px;
		display: inline-flex;
		white-space: normal;
	}
}

/* Horizontal list */
.horizontal-list .list-image {
	height: 60%;
}

.horizontal-list .list-image img {
	max-width: 100%;
	height: 100%;
	object-fit: cover;
}

.horizontal-list .paddle {
	top: 0;
	position: absolute;
	height: 100%;
	display: flex;
	align-items: center;
}

.horizontal-list .left-paddle {
	left: 0;
	background-image: linear-gradient(to left, rgba(255,255,255,0), white 90%);
}

.horizontal-list .right-paddle {
	right: 0;
	background-image: linear-gradient(to right, rgba(255,255,255,0), white 90%);
}

.horizontal-list .paddle button {
	background-color: white;
	color: #1d627d;
	border-color: #1d627d;
	border-radius: 6px;
	padding-top: 4px;
	display: flex;
	padding-bottom: 4px;
	cursor: pointer;
}

.horizontal-list .paddle-left button {
	margin-right: 1rem;
}

.horizontal-list .paddle-right button {
	margin-left: 1rem;
}

#recommended .recommended-object-type {
	height: 25px;
	width: 25px;
	color:white;
	top: 0;
	left: 0;
	background-color: rgba(0,0,0,0.6);
}

/* accessibility */
.skip-link, #screenreader-alerts {
	position: absolute !important;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	width: 1px;
	height: 1px;
}

.skip-link:active, .skip-link:hover, .skip-link:focus {
	top: 5px;
	left: 5px;
	z-index: 100000;
	display: block;
	clip: auto !important;
	padding: 15px 23px 14px;
	width: auto;
	height: auto;
	border-radius: 3px;
	background-color: #f1f1f1;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	color: #21759b;
	text-decoration: none;
	font-weight: bold;
	font-size: 0.875rem;
	line-height: normal;
}

*,*:focus,*:hover{
	outline:none !important;
}

input[type="radio"]:focus-visible, input[type="checkbox"]:focus-visible {
	outline: -webkit-focus-ring-color auto 1px !important;
}

a.focused:not(:hover):not(.skip-link), button.focused:not(:hover):not(.skip-link) {
	outline: 2px solid #047897 !important;
	outline-offset: 2px;
	box-shadow: 0px 0px 0px 2px rgba(255,255,255,1);
}

/* image api */
#search-popup .modal-dialog {
	border-radius: .6rem;
	background-color: #FFF;
	max-width: 1000px;
}

#search-popup #search-image-q {
	border: 1px solid #176D8A !important;
	padding: .375rem 0.75rem !important;
}

#search-popup #image-search-button {
	border-radius: 0 0.25rem 0.25rem 0;
}

#search-popup .modal-body {
	overflow-y: auto;
}

#search-popup #close {
	top: 14px;
	right: 20px;
	border-radius: 30px;
	padding: 10px 14px;
}

#search-popup #close:hover {
	background-color: #e1e1e1;
	cursor: pointer;
}

#search-popup #search-form {
	margin-bottom: 15px;
	align-items: center;
}

#search-popup #search-image-q {
	margin-right: -2px;
	padding: 4px 1px 5px 7px;
	width: 400px;
	border-radius: .25rem 0 0 .25rem;
}

#search-popup .kc_button2 {
	border-radius: 0 .25rem .25rem 0;
	margin-right: 15px
}

#search-popup #search-databases > input[name='provider'] {
	margin-left: 10px;
}

#search-popup #search-databases > span {
	max-width: 100px;
}

#search-popup #search-databases img {
	width: 100px;
}

#search-popup #search-image-results button:not(.more-results):hover {
	background-color: #B65F1E;
}

#search-popup #search-image-results img {
	background-color: #FFF;
}

#search-popup label[for="flickr_button"] {
	width: 200px;
}

#search-popup #flickr-logo {
	max-height: 18px;
	margin: 0 -14px;
}

/* autocomplete */
.kc_autocomplete {
	display: inline-table;
}

.kc_autocomplete .ui-menu-item-wrapper {
	padding: 2px !important;
}

.kc_autocomplete-row {
	margin: 0.5rem 0px 0.5rem 0px;
	white-space: nowrap;
}

.kc_autocomplete .ui-state-active {
	background-color: #f3f7f8;
	background-clip:content-box;
	border: none;
	color: initial;
	padding: 0.5rem 0px 0.5rem 0px;
	margin: 0px !important;
}

.kc_autocomplete-img {
	height: 32px;
	width: 32px;
	border-radius: 16px;
	object-fit: cover;
}

.fade-bottom:after {
	content  : "";
	position : absolute;
	z-index  : 1;
	bottom   : 0;
	left     : 0;
	pointer-events   : none;
	background-image : linear-gradient(to bottom, rgba(255,255,255, 0), rgba(255,255,255, 1) 90%);
	width    : 100%;
	height   : 4em;
}

.visually-hidden {
	position: absolute !important;
	overflow: hidden;
	clip: rect(0 0 0 0);
	height: 1px;
	width: 1px;
	margin: -1px;
	padding: 0;
	border: 0;
	left: 0;
}

.grid {
   display: grid;
   grid-gap: 30px;
   grid-template-columns: repeat(auto-fill, minmax(250px,1fr));
   grid-auto-rows: 0;
}

.fa-border {
	border-color: inherit;
}

.fa-fw.fa-border {
	width: 1.5em;
}

/* PRINT */

@media print {
	.kc_box {
		border-color: #dee2e6;
	}
	.kc_box a {
		text-decoration: none;
	}
	.print-page-break-before {
		page-break-before: always;
	}
}

/* ANIMATIONS */

.blink {
	animation: blink 1s linear infinite;
}
@keyframes blink {
	0% { opacity: 1; }
	50% { opacity: 1; }
	50.01% { opacity: 0; }
	100% { opacity: 0; }
}