/*
 * Hamer: the look of the former JA Obelisk "christmas" theme on Cassiopeia.
 * Full-width header (#1970bb), menu bar (#0083ff, yellow active item) and
 * slideshow; below them a 1176px box on the light blue snow background with
 * a 976px content column: a translucent band with the three download cards,
 * the white content area, a dark copyright band and a black tag cloud band.
 */
:root {
	--cassiopeia-color-primary: #1970bb;
	--cassiopeia-color-link: #0092d0;
	--cassiopeia-color-hover: #0071a0;
	--hamer-nav: #0083ff;
	--hamer-active: #fcfd0d;
	--hamer-navy: #0e2c4e;
	--hamer-dark: #2b2b2b;
	--hamer-blue: #0092d0;
	--hamer-blue-light: #04b4ff;
	--hamer-box: 73.5rem;
	--hamer-inner: 61rem;
	--cassiopeia-font-family-body: "Roboto", "Nyala", "Noto Sans Ethiopic", "Abyssinica SIL", sans-serif;
	--cassiopeia-font-family-headings: "Roboto", "Nyala", "Noto Sans Ethiopic", "Abyssinica SIL", sans-serif;
}

body.site {
	background: #8ed3f1 url("../images/snow.png");
	font-family: var(--cassiopeia-font-family-body);
	font-size: .9rem;
}
body.site a {
	text-decoration: none;
}
body.site a:hover,
body.site a:focus {
	text-decoration: underline;
}

/* Header: logo on dark blue, then a full-width bright blue menu bar. */
.container-header {
	background: var(--cassiopeia-color-primary);
	background-image: none;
	box-shadow: none;
}
.container-header .grid-child {
	width: 100%;
	max-width: var(--hamer-inner);
	margin-inline: auto;
}
.container-header .grid-child:first-child {
	justify-content: center;
	padding-top: .75rem;
	padding-bottom: .5rem;
}
.container-header .navbar-brand {
	margin: 0 auto;
	max-width: 100%;
}
.container-header .navbar-brand img {
	max-height: 75px;
	max-width: 100%;
	height: auto;
}
.container-header .container-nav {
	background: var(--hamer-nav);
	box-shadow: 0 0 0 100vmax var(--hamer-nav);
	clip-path: inset(0 -100vmax);
	padding-top: .25rem;
	padding-bottom: .25rem;
	align-items: center;
}
.container-header nav {
	margin-top: 0;
}
.container-header .mod-menu > li > a,
.container-header .mod-menu > li > span,
.container-header .metismenu > li > button {
	color: #fff;
	font-size: .8rem;
}
.container-header .metismenu > li > a:hover,
.container-header .metismenu > li.active > a,
.container-header .metismenu > li.active > button,
.container-header .metismenu > li > button:hover {
	color: var(--hamer-active);
	text-decoration: none;
}
.container-header .metismenu > li > a:hover:after,
.container-header .metismenu > li > button:hover:before,
.container-header .metismenu > li.active > a:after,
.container-header .metismenu > li.active > button:before {
	background: var(--hamer-active);
	height: 3px;
	opacity: 1;
}
.container-header .metismenu > li.level-1 > ul {
	min-width: 14rem;
}

/* Search: a small white field with the icon button inside it. */
.container-header .container-search .mod-finder__search {
	flex-wrap: nowrap;
}
.container-header .container-search .form-control {
	font-size: .75rem;
	height: 2rem;
	border: 0;
	border-radius: 0;
}
.container-header .container-search .btn {
	background: #fff;
	border: 0;
	border-radius: 0;
	color: var(--hamer-blue);
	font-size: 0;
	padding: 0 .6rem;
}
.container-header .container-search .btn .icon-search {
	color: var(--hamer-blue);
	font-size: .85rem;
}
@media (min-width: 992px) {
	.container-header .container-search .form-control {
		min-width: 17rem;
	}
}

/*
 * The box: on wide screens the main column is 976px; a 1176px white panel
 * sits behind everything from top-b down, and a translucent band behind top-a.
 */
.site-grid {
	isolation: isolate;
	padding-bottom: 2rem;
	margin-bottom: 0;
}
body.site {
	min-height: 0;
}
.site-grid::before,
.site-grid::after {
	content: "";
	grid-column: full-start / full-end;
	justify-self: center;
	width: min(100%, var(--hamer-box));
	z-index: -1;
}
.site-grid::before {
	grid-row: top-a-start / top-a-end;
	background: rgba(2, 167, 236, .32);
}
.site-grid::after {
	grid-row: top-b-start / -1;
	margin-bottom: -2rem;
	background: #fff;
}
@media (min-width: 992px) {
	.site-grid {
		grid-template-columns: [full-start] minmax(0, 1fr) [main-start] repeat(3, minmax(0, 19.666rem)) [main-end] minmax(0, 1fr) [full-end];
		grid-gap: 0 1rem;
		grid-template-areas: ". banner banner banner ."
		                     ". top-a top-a top-a ."
		                     ". top-b top-b top-b ."
		                     ". comp comp side-r ."
		                     ". bot-a bot-a bot-a ."
		                     ". bot-b bot-b bot-b .";
	}
	body.has-sidebar-left .site-grid {
		grid-template-areas: ". banner banner banner ."
		                     ". top-a top-a top-a ."
		                     ". top-b top-b top-b ."
		                     ". side-l comp side-r ."
		                     ". bot-a bot-a bot-a ."
		                     ". bot-b bot-b bot-b .";
	}
}
.site-grid > .container-component,
.site-grid > .container-sidebar-right,
.site-grid > .container-top-b:not(:empty) {
	margin-top: 2rem;
}
@media (max-width: 991.98px) {
	.site-grid > [class*=" container-"]:not(.full-width) {
		padding-inline: 1rem;
	}
}

/* Home slideshow (full width, under the menu). */
.hamer-slides {
	position: relative;
	overflow: hidden;
	aspect-ratio: 1400 / 336;
	background: var(--cassiopeia-color-primary);
}
.hamer-slides img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	transition: opacity 1s ease-in-out;
}
.hamer-slides img.is-active,
.hamer-slides img:first-child:not(:has(~ .is-active)) {
	opacity: 1;
}
@media (prefers-reduced-motion: reduce) {
	.hamer-slides img { transition: none; }
}

/* Page heading band (former "masshead" modules). */
.hamer-masshead {
	background: var(--cassiopeia-color-primary);
	color: #fff;
	padding: 1rem 1.5rem;
}
.hamer-masshead h2 {
	margin: 0;
	font-size: 1.6rem;
	color: #fff;
}
.hamer-masshead p {
	margin: .25rem 0 0;
	opacity: .85;
}

/* Navy module boxes: the three download cards and the sidebar notice. */
.container-banner,
.container-banner .banner {
	margin: 0;
}
.site-grid > .container-top-a {
	margin-top: 0;
}
.container-top-a {
	padding-top: 3rem;
	padding-bottom: 1.25rem;
	gap: 1.25rem;
}
.container-top-a > .card,
.container-sidebar-right > .card:first-child {
	background: var(--hamer-navy);
	color: #fff;
	border: 0;
	border-radius: 0;
	padding: 0 1.25rem 1.25rem;
	box-shadow: 0 2px 6px rgba(0, 0, 0, .25);
}
.container-top-a .card-header,
.container-sidebar-right > .card:first-child .card-header {
	background: linear-gradient(#444, #2a2a2a);
	color: #ccc;
	font-size: .7rem;
	font-weight: normal;
	margin: 0 -1.25rem 1.25rem;
	padding: .9rem 1.25rem;
	border: 0;
	border-bottom: 1px solid var(--cassiopeia-color-primary);
	border-radius: 0;
}
.container-sidebar-right > .card:first-child .card-header {
	background: transparent;
	color: #6d86a3;
	margin: 0 0 1.25rem;
	padding: .9rem 0;
	border-bottom-color: #c9d6e3;
}
.container-top-a .card-body,
.container-sidebar-right > .card:first-child .card-body {
	padding: 0;
}
.container-top-a .mod-articlesnews__item {
	display: flex;
	flex-direction: column;
	background: var(--hamer-dark);
	min-height: 22rem;
}
.container-top-a .newsflash-image {
	order: -1;
	margin: 0;
}
.container-top-a .newsflash-image img {
	display: block;
	width: 100%;
	height: 260px;
	object-fit: cover;
	object-position: top;
}
.container-top-a .newsflash-title {
	font-size: .75rem;
	font-weight: normal;
	line-height: 1.5;
	margin: 0;
	padding: 1.25rem;
}
.container-top-a a,
.container-sidebar-right > .card:first-child a {
	color: #fff;
}
.container-sidebar-right > .card:first-child img {
	display: block;
	width: 100%;
	height: auto;
}
.container-sidebar-right > .card:first-child .newsflash-image {
	margin: 0;
}

/* Announcement slider: one image at a time, sliding up. */
.hamer-vslider {
	position: relative;
	overflow: hidden;
	aspect-ratio: 300 / 350;
}
.hamer-vslider__track {
	height: 100%;
	transition: transform 1.5s ease-in-out;
}
.hamer-vslider__slide {
	display: block;
	height: 100%;
}
.hamer-vslider__slide img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top;
}

/* Sidebar accordion (latest and most read), like the old JA Accordion. */
.container-sidebar-right > .card {
	border: 0;
	border-radius: 0;
	margin-bottom: 1.25rem;
}
.container-sidebar-right > .card.hamer-accordion {
	background: #444;
	color: #fff;
	margin-bottom: 0;
}
.container-sidebar-right > .card.hamer-accordion + .card.hamer-accordion {
	margin-top: 0;
}
.container-sidebar-right > .card.hamer-accordion.hamer-accordion--last {
	margin-bottom: 1.25rem;
}
.container-sidebar-right > .card.hamer-accordion.is-open {
	background: var(--hamer-blue);
}
.container-sidebar-right > .card.hamer-accordion .card-header {
	background: #444;
	padding: 0;
	border: 0;
	border-bottom: 1px solid #5e5e5e;
	border-radius: 0;
}
.container-sidebar-right > .card.hamer-accordion.is-open .card-header {
	background: linear-gradient(var(--hamer-blue-light), var(--hamer-blue));
	border-bottom-color: rgba(255, 255, 255, .2);
}
.hamer-accordion__toggle {
	position: relative;
	display: block;
	width: 100%;
	padding: .75rem 3rem .75rem 1.25rem;
	background: none;
	border: 0;
	color: #fff;
	font: inherit;
	font-size: .78rem;
	text-align: left;
	cursor: pointer;
}
.hamer-accordion__toggle::after {
	content: "";
	position: absolute;
	right: 1.25rem;
	top: 50%;
	width: 1.25rem;
	height: 1.25rem;
	margin-top: -.625rem;
	border-radius: 2px;
	background: rgba(255, 255, 255, .25) no-repeat center / .6rem;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M0 0h10L5 6z' fill='%23fff'/%3E%3C/svg%3E");
}
.is-open .hamer-accordion__toggle::after {
	transform: rotate(180deg);
}
.hamer-accordion__toggle:focus-visible {
	outline: 2px solid var(--hamer-active);
	outline-offset: -2px;
}
.container-sidebar-right > .card.hamer-accordion .card-body {
	padding: .25rem 1.25rem .5rem;
}
.hamer-bulletin {
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: .75rem;
}
.hamer-bulletin li {
	display: flex;
	gap: .6rem;
	align-items: flex-start;
	padding: .65rem 0;
	border-bottom: 1px solid rgba(255, 255, 255, .2);
}
.hamer-bulletin li.no-image {
	display: block;
}
.hamer-bulletin li:last-child {
	border-bottom: 0;
}
.hamer-bulletin__image {
	flex: 0 0 40px;
}
.hamer-bulletin__image img {
	display: block;
	width: 40px;
	height: 40px;
	object-fit: cover;
}
.hamer-bulletin__number {
	display: block;
	font-size: 1rem;
	font-weight: bold;
	line-height: 1.2;
}
.hamer-bulletin a.hamer-bulletin__title {
	color: #fff;
	font-weight: bold;
}
.hamer-bulletin__date,
.hamer-bulletin__hits {
	color: #cdb89a;
}
.hamer-bulletin__hits {
	margin-left: .25rem;
}

/* Article lists. */
.blog-item + .blog-item {
	border-top: 1px dotted #ccc;
	padding-top: 1.25rem;
	margin-top: .5rem;
}
.blog-item .item-title,
.com-content-article .page-header h1,
.com-content-article .page-header h2 {
	font-size: 1.4rem;
	font-weight: normal;
	line-height: 1.5;
	margin-bottom: .25rem;
}
.blog-item .item-title a {
	color: var(--hamer-blue);
}
.article-info {
	font-size: .75rem;
	color: #999;
	margin-bottom: .75rem;
}
.article-info dd {
	display: inline-block;
	margin-right: 1rem;
}
.article-info a {
	color: var(--hamer-blue);
}
.blog-item .item-image {
	max-width: 220px;
	margin: 0 1.25rem 1rem 0;
	padding: 4px;
	border: 1px solid #ccc;
	background: #fff;
}
.blog-item .item-image img,
.com-content-article .item-image img {
	display: block;
	max-width: 100%;
	height: auto;
}
.blog-item .item-content::after {
	content: "";
	display: table;
	clear: both;
}
.blog-item .readmore {
	clear: both;
}
.blog-item .readmore .btn {
	background: none;
	border: 0;
	padding: 0;
	color: var(--hamer-blue);
	font-size: .8rem;
}
.blog-item .readmore .btn:hover {
	text-decoration: underline;
}
.blog-item .readmore [class^="icon-"] {
	display: none;
}

/* Home page: newest articles per publication (Articles modules in main-top). */
.container-component .mod-articles-items {
	list-style: none;
	margin: 0;
	padding: 0;
}
.container-component .mod-articles-items > li + li,
.container-component .mod-articles-items + .mod-articles-items > li:first-child {
	border-top: 1px dotted #ccc;
	padding-top: 1.25rem;
	margin-top: .5rem;
}
.container-component .mod-articles-title {
	font-size: 1.4rem;
	font-weight: normal;
	line-height: 1.5;
	margin-bottom: .25rem;
}
.container-component .mod-articles-title a {
	color: var(--hamer-blue);
}
.container-component .mod-articles-item dl {
	font-size: .75rem;
	color: #999;
	margin-bottom: .75rem;
}
.container-component .mod-articles-item dd {
	display: inline-block;
	margin-right: 1rem;
}
.container-component .mod-articles-item .item-image {
	float: left;
	max-width: 220px;
	margin: 0 1.25rem 1rem 0;
	padding: 4px;
	border: 1px solid #ccc;
	background: #fff;
}
.container-component .mod-articles-item .item-image img {
	display: block;
	max-width: 100%;
	height: auto;
}
.container-component .mod-articles-item-content::after {
	content: "";
	display: table;
	clear: both;
}
.container-component .mod-articles-item .readmore {
	clear: both;
}
.container-component .mod-articles-item .readmore .btn {
	background: none;
	border: 0;
	padding: 0;
	color: var(--hamer-blue);
	font-size: .8rem;
}
.container-component .mod-articles-item .readmore [class^="icon-"] {
	display: none;
}

/* Article page. */
.com-content-article .item-image {
	float: none;
	max-width: 600px;
	margin: 0 0 1rem;
}
.com-content-article .com-content-article__body {
	clear: both;
}
.k2-attachments {
	clear: both;
	border-top: 1px dotted #ccc;
	margin-top: 1rem;
	padding-top: .5rem;
	font-size: .8rem;
}
.k2-attachments ul {
	margin-bottom: 0;
}

/* Footer: boxed like the content; copyright band, then the tag cloud band. */
.container-footer {
	background: transparent;
	background-image: none;
	color: #888;
	font-size: .75rem;
	margin-bottom: 4rem;
}
.container-footer .grid-child {
	display: block;
	width: 100%;
	max-width: var(--hamer-box);
	margin-inline: auto;
	padding: 0;
}
.container-footer .footer {
	display: block;
	background: transparent;
	background-image: none;
	border: 0;
	box-shadow: none;
	color: inherit;
	margin: 0;
	padding: 1.5rem max(1rem, calc((100% - var(--hamer-inner)) / 2));
}
.container-footer .footer:has(.navhelpercp) {
	background: #2f2f2f;
}
.container-footer .footer:has(.tagspopular) {
	background: #131313;
	padding-top: 2rem;
	padding-bottom: 3rem;
}
.container-footer a:not(.btn) {
	color: #3aa0ff;
}
.navhelpercp {
	position: relative;
	padding-right: 3rem;
}
.navhelpercp p {
	margin-bottom: .5rem;
}
.navhelpercp .addthis_toolbox {
	position: absolute;
	top: 0;
	right: 0;
	display: flex;
	flex-direction: column;
	gap: .25rem;
}
.navhelpercp .addthis_toolbox img {
	width: 18px;
	height: 18px;
}
.container-footer .tagspopular {
	background: #000;
	padding: 1rem 1rem;
	line-height: 1.6;
}
.container-footer .tagspopular .tag {
	display: inline;
	margin-right: .5rem;
}
.container-footer .tagspopular a {
	color: #2a8fe0;
}
