/**
Theme Name: Test Theme
Theme URI: https://localhost:8080/themes/testtheme/
Author: Graham Daniel Robertson
Author URI: https://127.0.0.1/
Text Domain: testtheme
Tags:
	one-column, custom-colors, custom-menu, custom-logo, editor-style,
	featured-images, full-site-editing, block-patterns, rtl-language-support,
	sticky-post, threaded-comments, translation-ready, wide-blocks,
	block-styles, style-variations, accessibility-ready, blog, portfolio, news
*/

:root {
	/*
	 * COLOURS
	 * TO BE REVISED AND PLACED INTO SEPARATE PROJECT.
	*/
	--black:#111F18;

	--white: #EBFBEF;
	--off-white: #F7E9DE;

	--cool-grey: #94C5A7;
	--light-grey: #CCDDCC;
	--grey: #B6C6AD;
	--dark-grey:#333;

	--blue: #559999;
	--light-blue: lightseagreen;
	/* --dark-blue: #164F57; */

	--light-green: #CCD878;
	--green: #5FAB8F;
	--dark-green: #005701;

	 --red: #C93120; 
	 --bright-red: #FF2255; 
	/**/
	/* --light-pink: #EAB090; */
	/* --pink: #E27777; */
	/**/
	 --hilite: #CA054D; 
	/**/
	/* --light-purple: #AE567D; */
	/* --purple: #724B80; */
	/* --violet: #1B0D33; */
	/**/
	/* --yellow: #E6D53F; */
	/* --rich-yellow: #FBC00E; */
	/* --orange: #EC7B00; */
	/* --rich-orange: #ED6921; */
	/**/
	/* --light-brown: #99896A; */
	/* --brown: #290D00;	 */

	/*
	 * SEMANTIC COLOURS
	 * 
	 */
	--bg-color: var(--off-white);
	--text-color: var(--dark-grey);

	--link-color: var(--light-blue);
	
	--btn-color: var(--white);
	--btn-bg-color: var(--light-blue);

	--section-bg-color: var(--dark-green);

}

html {
	box-sizing: border-box;
	margin:0;
}

*,
*:before,
*:after {
	box-sizing: inherit;
	outline: none;
}

body {
	background-color: var(--bg-color);
	color: var(--text-color);

	font-family: Ubuntu, Trebuchet, Helvetica, Arial, sans-serif;
	font-size: 12pt;

	padding: 0;
	margin: 0;

	width:100%;
	min-height: 100vh;
}

div.wp-site-blocks {
	display:flex;
	flex-flow: column nowrap;
	justify-content: flex-start;
	align-items: stretch;
	min-height: 100vh;
}

div.wp-site-blocks > div.wp-block-template-part {
	flex-grow: 0;
	margin: 0 !important;
}

div.wp-site-blocks > div.wp-block-template-part > header {
	padding: 1em 1em 1em 4.5em;
}

div.wp-site-blocks > main {
	flex-grow: 3;
	margin: 0 !important;
	padding: 1em 1em 4em;
}

div.wp-site-blocks > div.wp-block-template-part > footer {
	padding:1em 1em;
}

div.wp-site-blocks > div.wp-block-template-part > header,
div.wp-site-blocks > div.wp-block-template-part > footer {
	color: var(--off-white);
	background-color: var(--section-bg-color);
}

div.wp-site-blocks > div.wp-block-template-part > header {
	display:flex;
	flex-flow: row nowrap;
	justify-content: center;
	align-items: center;
	gap:1em;
}

div.wp-site-blocks >
div.wp-block-template-part >
header >
h1 {
	font-size: clamp(1.8125em, 6vw, 3em);
	margin:0;
}

div.wp-site-blocks >
div.wp-block-template-part >
header >
img {
	height: 3em;
}

header label {
	position: absolute;
	left: 0.5em;
	top: 0.125em;
	font-size: 3em;
}

.wrapper {
	position: relative;
	margin: 0 auto;
	padding: 1px;
	max-width: 960px;
}

footer {
	font-size: 1.25em;
}

footer span.copy {
	font-size: 0.75em;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: Georgia, 'Times New Roman', Times, serif;
	margin: 1.25em 0;
	font-style: italic; 
}

h1 {
	font-size: 2.125em;
}

h2 {
	font-size: 1.6125em;
}

h3 {
	font-size: 1.5em;
}

h4 {
	font-size: 1.37125em;
}

h5 {
	font-size: 1.25em;
}

h6 {
	font-size: 1.125em;
}

hr {
	color: var(--grey);
	border: none;
	border-top: 2px dotted;
	margin: 3em;
}

p,
address {
	line-height: 1.75;
	margin: 1.75em 0;
}

address a,
menu a,
nav a {
	display: block;
}

blockquote {
	font-family: Georgia, 'Times New Roman', Times, serif;
	font-size: 1.75em;
	font-style: italic;
	line-height: 1.5;
	margin: 2em 0.75em;
}

a {
	color: var(--link-color);
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

a.btn,
button {
	font-size: 1.25em;
	border-radius: 0.25em;
	padding: 0.625em 0.75em;
}

a.btn,
button,
menu.paginator label {
	display: inline-block;
	
	color: var(--btn-color);
	background-color: var(--btn-bg-color);
	font-weight: bold;
	text-align: center;
}

menu.paginator label {
	border-radius: 50%;
	width: 2em;
	height: 2em;
	line-height: 2;
}

a.btn:hover,
button:hover,
menu.paginator label:hover {
	cursor: pointer;
	text-decoration: none;
	background-color: var(--dark-green);
}

img {
	display: block;
	max-width: 100%;
	max-height: 15em;
}

/* nav { */
/* } */

nav a {
	display: block;
	margin: 1em auto;
}

#menu-toggle {
	display: none;
}

#menu-toggle + nav {
	display: none;
	position: absolute;
	
	top: 0;
	left: 0;
	
	width: 100%;
	height: 100%;
	margin: 0px;
	
	z-index: 100;

	font-size: 2em;

	background-color: var(--bg-color);
}

#menu-toggle + nav label {
	position: absolute;
	top: 0.5em;
	right: 0;

	font-size: 1.25em;
}

#menu-toggle:checked + nav {
	display: block;
}

section {
	margin: 4em 0;
}

p:first-child,
section:first-child {
	margin-top: 0;
}

/*section:last-child*/
p:last-child {
	margin-bottom: 0;
}

.snippet h1 {
	font-size: 1.75em;
}

ul.slideshow,
ol.slideshow,
menu.paginator {
	list-style: none;
	padding:0;
	margin: 0;
}

menu.paginator {
	display: flex;
	flex-flow: row nowrap;
	justify-content: center;
	align-items: flex-start;
	gap: 1em;
}

section.hero {
	display: flex;
	flex-flow: column nowrap;
	justify-content: stretch;
	align-items: stretch;
	gap: 2em;
	height: 66vh;
}

section.hero .snippet {
	text-align: center;
}

section.hero .snippet h1 {
	font-size: 2em;
}

section.hero .slideshow {
	position: relative;
	flex-grow: 3;
	overflow: hidden;
}

section.hero .slideshow img {
	max-height: none;
	margin: 0 auto;
}

section.hero .paginator {
	flex-grow: 0;
}

section.hero .slideshow li {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

section.hero .slideshow article {
	display: none;
}

section.hero .slideshow li input[type="radio"] {
	display: none;
}

section.hero .slideshow li input[type="radio"]:checked + article {
	display: block;
}

.content {
	display:flex;
	flex-flow: row wrap;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 1.5em;
}

.content > *:first-child + p,
.content > time:first-child + header > * {
	margin: 0 0 0.6125em;
}

.content > time:first-child + p,
.content > time:first-child + header {
	flex: 1 1 calc(100px - 72px - 1.5em);
}

section.function-hall picture {
	flex-basis: 30%;
}
 
section.function-hall .description {
	flex-basis: 60%;
}

section.news ul,
section.meetings ul {
	display: flex;
	flex-flow: row wrap;
	/*justify-content: center;*/
	align-items: flex-start;
	gap:2em;

	list-style: none;
	padding:0;
	margin: 0;
}

section.news ul {
	justify-content: center;
}

section.news ul li {
	flex-basis: 33%;
}

section.news h1 {
	margin-top: 0 !important;
}

section.meetings {
	margin-left: 3em;
	margin-right: 3em;
}

section.meetings ul li {
	flex: 1 1 33%;
	min-width: 280px
}

section.meetings time {
	display: flex;
	flex-flow: column nowrap;
	justify-content: stretch;
	aspect-ratio: 1;
	flex: 1 1 72px;
	max-width: 72px;
}

section.meetings time span {
	display: block;
	text-align: center;
	padding: 0.25em 0.5em;
}

section.meetings time span.month {
	background-color: var(--red);
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	color: var(--white);
	font-size: 1.125em;
}

section.meetings time span.day {
	display: flex;
	justify-content: center;
	align-items: center;

	background-color: var(--white);
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
	font-size: 2em;
	font-weight: bold;
	flex-grow: 2;
}

section.meetings > p {
	flex: 3 1 60%;
	font-size: 1.125em;
	margin-top: 1em;
}

article.history {
	counter-reset: chapter;
}

article.history > section.chapter {
	counter-increment: chapter;
}

/* article.history > section.chapter > h1::before { */
/* 	content: counter(chapter) ". "; */
/* } */

article.history > ul {
	list-style: none;
}

article.history-chapter > nav {
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	align-items: flex-start;
}

article.history-chapter > nav > a {
	margin: 1em 0 0;
}

article.history-chapter > nav > a.prev {
	margin: 1em auto 0 0;
}

article.history-chapter > nav > a.next {
	margin: 1em 0 0 auto;
}

article.office > ul {
	display: flex;
	flex-flow: row wrap;
	gap: 10px;
	justify-content: flex-start;
	align-items: stretch;

	padding: 0;
	margin: 0;
	
	list-style: none;
}

article.office > ul > li {
	display: flex;
	flex: 1 1 320px;
	margin: 1em 0;
}

article.office > ul > li:last-child > hr {
	flex: 0 0 1px;
	display: none;
}

article.bearer {
	display: flex;
	flex-flow: row nowrap;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 1em;
}

article.bearer > header {
	order: 2;
}

article.bearer > header > h1 {
	font-size: 1.75em;
}

article.bearer > header > h1,
article.bearer > header > h2 {
	margin: 0;
}

article.bearer > header > h2 {
	font-size: 1.25em;
	opacity: 0.8;
}

article.bearer > section.photo {
	order: 1;
	width: clamp(140px, 20%, 280px);
	margin: 0;
	aspect-ratio: 1;
}

article.bearer > section.photo > img {
	width: 100%;
	height: 100%;
	object-fit: fill;
}

#map {
	aspect-ratio: 1.7;
}

/* .countdown { */
/* 	font-family: monospace; */
/* 	font-weight:bold; */
/* } */
/**/
/* .countdown span::after { */
/* 	font-weight: normal; */
/* 	padding-left: 5px; */
/* } */
/**/
/* .countdown span.days::after { */
/* 	content: "days"; */
/* } */
/**/
/* .countdown span.hours::after { */
/* 	content: "hours"; */
/* } */
/**/
/* .countdown span.minutes::after { */
/* 	content: "minutes"; */
/* } */
/**/
/* .countdown span.seconds::after { */
/* 	content: "seconds"; */
/**/
/* } */

@media screen and (max-width: 740px) {
	section.news ul,
	footer div.wrapper {
		display: block;
	}
}

@media screen and (max-width: 560px) {

}