:root {
	--gutter-sm: 30px;
	--gutter-md: 4em;
}

p:empty {
	display: none;
}

/*
 *  Navigation
 *
 */

ul.menu {
	font-family: var(--ropecon-font-heading);
	font-weight: 500;
	font-size: 70%;
	text-transform: uppercase;
	letter-spacing: 1px;
	line-height: 1.4em;
}
	ul.menu a {
		line-height: 1.4rem;
	}

/*
 *  Links
 *
 */

a, a:link, a:visited {
	color: var(--ropecon-link);
}
	a:hover, a:active, a:focus {
		color: var(--ropecon-link-hover);
	}

/*
 *  Headings
 *    (and large text)
 *
 */

h1, h2, h3, h4, h5, h6,
.has-large-font-size {
	font-family: var(--ropecon-font-heading);
	font-weight: 700;
}

h1, h2, h3, h4, h5, h6 {
	margin: 1.2em 0 0.7em 0;
	text-align: left;

	line-height: 1.4em;
}

h1 { font-size: 200%; }
h2 { font-size: 140%; }
h3 { font-size: 130%; }
h4 { font-size: 120%; }
h5 { font-size: 110%; }
h6 { font-size: 105%; }

footer section h2 {
	font-size: 80%;
	font-weight: 500;
	text-transform: uppercase;
}

@media screen and (min-width:400px) {
	h1 { font-size: 250%; }
}

@media screen and (min-width:768px) {
	h1 { font-size: 400%; }
		.wp-block-media-text h1 { font-size: 275%; }
}

@media screen and (min-width:1200px) {
	.wp-block-media-text h1 { font-size: 400%; }
}

.wp-block-cover h1.is-style-shadow,
.wp-block-cover h2.is-style-shadow,
.wp-block-cover h3.is-style-shadow,
.wp-block-cover h4.is-style-shadow,
.wp-block-cover h5.is-style-shadow,
.wp-block-cover h6.is-style-shadow {
	text-shadow: 2px 2px 0 rgba(0,0,0,1);
}


/*
 *  Paragraphs
 *
 */

:not(#kompassi_block_schedule) p {
	line-height: 1.625em;
}

/*
 *  Images
 *
 */

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

/*
 *  Lists
 *
 */

#content > :not(#kompassi_block_schedule) :is(ol,ul:not(.map-select-list)) li:not([data-search-term]) {
	position: relative;
	margin-left: 1.7em;
	margin-bottom: 0.4em;
}
	#content > :not(#kompassi_block_schedule) ul:not(.map-select-list) > li:not([data-search-term])::before {
		content: " ";
		display: block;
		position: absolute;
		left: -1.7em;
		top: 0.15em;
		background-image: url(/wp-content/themes/ropecon/images/ropecon/ropecon_icon_black.svg);
		background-repeat: no-repeat;
		background-size: contain;
		width: 1em;
		height: 1em;
	}
	#content ol > li:not([data-search-term])::before {
		content: counter(list-item) ".";
		display: block;
		position: absolute;
		left: -1.7em;
		width: 1em;
	}

/*
 *  Tables
 *
 */

table {
	width: 100%;
	table-layout: fixed;
	border-collapse: collapse;
}
	table thead {
		display: none;
		width: 100%;
		margin-bottom: 1em;
	}
		table thead td, th {
			text-align: left;
			font-family: var(--ropecon-font-heading);
			font-weight: 600;
		}

	table tr {
		display: block;
		width: 100%;
		background-color: #fff;
		border: 1px solid rgba(0,0,0,0.2);
	}
		table tr:not(:last-child) {
			margin-bottom: 1em;
		}
			table th,
			table td {
				display: block;
				padding: 0.5em 0.9em;
			}
				table th:not(:first-child),
				table td:not(:first-child) {
					border-top: none;
					padding-top: 0;
				}
				table th:not(:last-child),
				table td:not(:last-child) {
					border-bottom: none;
					padding-bottom: 0.2em;
				}

				table.has-column-titles td::before {
					display: inline-block;
					font-size: 85%;
					font-family: var(--ropecon-font-heading);
					font-weight: 600;
					content: attr(data-column-title);
					margin-right: 1em;
				}

@media screen and (max-width:639px) {
	table th,
	table td {
		width: 100%;
	}
}

@media screen and (min-width:640px) {
	table thead {
		display: table-header-group;
	}
	table tr {
		display: table-row;
	}
		table th,
		table td {
			display: table-cell;
			border: 1px solid rgba(0,0,0,0.2);
		}
			table.has-column-titles td::before {
				display: none;
			}
}

/*
 *  Gutenberg blocks
 *
 */

#content > [class*="wp-block"] {
	clear: both;
}

/*  Buttons  */

.wp-block-buttons {
	margin-bottom: 1em;
}
	.wp-block-buttons.is-vertical > .wp-block-button:not(:last-child) {
		margin-bottom: 0.5em;
	}
	.wp-block-buttons .wp-block-button__link {
		line-height: 1.4em;
	}

	/*  Button  */
	@media screen and (max-width:800px) {
		.wp-block-button__link {
			padding: calc(.5em + 2px) calc(1em + 2px);
			font-size: 1em;
		}
	}

/*  Columns  */

.wp-block-columns {
	align-items: stretch;
	margin-bottom: 0;
}
	.wp-block-columns .wp-block-column {
		margin-left: 0;
/*		padding: 3em; */
	}

	.wp-block-columns .wp-block-column .wp-block-group {
		height: 100%;
	}

@media screen and (max-width:768px) {
	.wp-block-columns .wp-block-column {
		flex-basis: 100% !important;
	}
}

@media screen and (min-width:1024px) {
	#content > .wp-block-columns.alignfull .wp-block-column:first-child {
		padding-left: max( 3em, calc( ( ( 100vw - 1200px ) / 2 ) + 30px ) );
	}
	#content > .wp-block-columns.alignfull .wp-block-column:last-child {
		padding-right: max( 3em, calc( ( ( 100vw - 1200px ) / 2 ) + 30px ) );
	}
}

	/*  Block style: Content in boxes  */

	.wp-block-columns.is-style-content-in-boxes {
		margin-top: 2em !important;
		margin-bottom: 2em !important;
	}
		.wp-block-columns.is-style-content-in-boxes .wp-block-column {
			background-color: #fff;
			padding: 1em;
			margin-bottom: 2em;
		}
			.wp-block-columns.is-style-content-in-boxes .wp-block-column > :first-child { margin-top: 0; }
			.wp-block-columns.is-style-content-in-boxes .wp-block-column > :last-child { margin-bottom: 0; }

			.wp-block-columns.is-style-content-in-boxes .wp-block-column:hover {
				box-shadow: 0 0 2em 0 rgba(0,0,0,0.05);
			}

		.wp-block-columns.is-style-content-in-boxes .wp-block-column > figure:first-child {
			margin: -1em -1em 1em -1em;
		}
			.wp-block-columns.is-style-content-in-boxes .wp-block-column > figure:first-child + * {
				margin-top: -5px;
			}

@media screen and (min-width:769px) {
	.wp-block-columns.is-style-content-in-boxes .wp-block-column {
		margin-bottom: 0;
	}
		.wp-block-columns.is-style-content-in-boxes .wp-block-column:not(:first-child) {
			margin-left: 2em !important;
		}
}

/*  Cover  */

#content > .wp-block-cover:first-child > .wp-block-cover__inner-container { margin-top: var(--ropecon-menu-height); }
#content > .wp-block-cover:first-child > .wp-block-cover__inner-container > :first-child { margin-top: 2rem; }
#content > .wp-block-cover:first-child > .wp-block-cover__inner-container > :last-child { margin-bottom: 2rem; }

#content > .wp-block-cover > .wp-block-cover__inner-container > :first-child { margin-top: 1rem; }
#content > .wp-block-cover > .wp-block-cover__inner-container > :last-child { margin-bottom: 1rem; }

#content .wp-block-cover.is-style-full-height {
	min-height: 100vh;
}
	#content .wp-block-cover.is-style-full-height > .wp-block-cover__inner-container {
		margin: 3em 0;
	}

/*  Details  */

.wp-block-details {
	padding: 1em;
}
	.wp-block-details summary {
		font-family: var(--ropecon-font-heading);
		font-size: 90%;
		font-weight: 500;
		list-style-type: "\e660  ";
	}
	.wp-block-details summary::marker {
		font-family: 'icomoon';
		font-size: 100%;
	}
	.wp-block-details:open summary {
		margin-bottom: 1em;
		list-style-type: "\e641  ";
	}

.wp-block-details:has(+ .wp-block-details) {
	border-bottom: 1px solid rgba(0,0,0,0.1);
}

/*  Group  */

.wp-block-group {
	padding: 4em;
}
	.wp-block-group__inner-container > :first-child { margin-top: 0; }
	.wp-block-group__inner-container > :last-child { margin-bottom: 0; }

@media screen and (max-width:640px) {
	.wp-block-group.is-layout-grid,
	.wp-block-group.is-layout-grid > .wp-block-group {
		padding-inline: 0;
	}
}

/*  Latest Posts  */

.wp-block-latest-posts {
	padding: 4em 0;
}
	.wp-block-latest-posts li {
		background-color: var(--ropecon-background-highlight);
		padding: 2em;
		margin-bottom: 1em;
	}
		.wp-block-latest-posts li > a:first-child {
			/* == h2 */
			font-family: var(--ropecon-font-heading);
			font-size: 140%;
			font-weight: 700;
		}

		.wp-block-latest-posts li:hover {
			box-shadow: 0 0 2em 0 rgba(0,0,0,0.05);
		}
			.wp-block-latest-posts__post-full-content > :last-child {
				margin-bottom: 0;
			}

/*  Media & Text  */

#content .wp-block-media-text {
	padding: 0;
	overflow: hidden;
	grid-template-columns: 1fr;
	grid-template-rows: auto;
}
.wp-block-media-text {
	background-color: var(--ropecon-background);
}

	.wp-block-media-text .wp-block-media-text__media,
	.wp-block-media-text .wp-block-media-text__content {
		grid-column: auto;
	}
		.wp-block-media-text .wp-block-media-text__content {
			margin: 0;
			padding: var(--gutter-sm);
			grid-row: 1 !important;
		}
		.wp-block-media-text .wp-block-media-text__media {
			grid-column: 1 !important;
			grid-row: 2 !important;
			max-height: 50vh;
			overflow: hidden;
		}

			.wp-block-media-text .wp-block-media-text__content > :first-child { margin-top: 0; }
			.wp-block-media-text .wp-block-media-text__content > :last-child { margin-bottom: 0; }

#content > .wp-block-media-text:first-child .wp-block-media-text__content {
	margin-top: 4em;
}
#content > :not([class*='wp-block']):first-child {
	padding-top: 100px;
}

@media screen and (min-width: 768px) {
	.wp-block-media-text {
		grid-template-columns: repeat(2, 1fr) !important;
	}
		.wp-block-media-text .wp-block-media-text__media,
		.wp-block-media-text .wp-block-media-text__content {
			grid-column: auto !important;
			grid-row: 1 !important;
		}
		.wp-block-media-text .wp-block-media-text__media {
			position: relative;
			max-height: 100%;
			height: 100%;
			width: 100%;
			overflow: hidden;
		}
			.wp-block-media-text.has-media-on-the-right .wp-block-media-text__media {
				grid-column: 2 !important;
			}
			.wp-block-media-text .wp-block-media-text__media img {
				position: absolute;
				top: 0;
				left: 0;
				right: 0;
				bottom: 0;
				margin: 0;
				padding: 0;
				width: 100%;
				height: 100%;
				max-width: none;
				max-height: none;
				-o-object-fit: cover;
				object-fit: cover;
			}
		.wp-block-media-text .wp-block-media-text__content {
			padding: var(--gutter-md);
		}

	#content > .wp-block-media-text:first-child .wp-block-media-text__content {
		margin-top: initial;
	}
}

@media screen and (min-width:1280px) {
	.wp-block-media-text .wp-block-media-text__content {
		padding: 6em 0;
		width: 50%;
		margin-left: 25%;
	}
}

/*  Block style: Text overlaying image  */

@media screen and (min-width:768px) {
	.wp-block-media-text.is-style-text-overlaying-image {
		display: grid;
	}
		.wp-block-media-text.is-style-text-overlaying-image .wp-block-media-text__media,
		.wp-block-media-text.is-style-text-overlaying-image .wp-block-media-text__content {
			grid-row: 1 !important;
			position: relative;
			top: 0;
			left: 0;
		}
		.wp-block-media-text.is-style-text-overlaying-image .wp-block-media-text__media {
			grid-column: 1 !important;
			width: 200%;
		}
		.wp-block-media-text.is-style-text-overlaying-image .wp-block-media-text__content {
			color: #fff;
			position: relative;
			z-index: 2;
		}
}

@media screen and (min-width:1024px) {
	.wp-block-media-text.is-style-text-overlaying-image .wp-block-media-text__content {
		width: 100%;
		max-width: 570px;
		margin-right: 30px;
		margin-left: 0;
	}
}

@media screen and (min-width:1280px) {
	.wp-block-media-text.is-style-text-overlaying-image.has-media-on-the-right .wp-block-media-text__content {
		margin-left: 25%;
	}
}

/*  Paragraph  */

	/*  Block style: Currency  */
	p.is-style-currency span.currency {
		font-size: 50%;
		line-height: 250%;
		margin-right: 0.3em;

		vertical-align: top;
	}

/*  Social links  */
.wp-block-social-links .wp-block-social-link {
	margin-right: 0.5em;
}

/*  Table  */

.wp-block-table {
	margin-top: 2em !important;
	margin-bottom: 2em !important;
}

/*
 *  Common classes
 *
 */

.hidden { display: none; }
.small { font-size: 85%; }
.alignright { float: right; margin: 1em 0 1em 1em; }
.alignleft { float: left; margin: 1em 1em 1em 0; }
.aligncenter { clear: both; display: block; margin: 1em auto; }

/*
 *  Color palette
 *
 */

.has-black-background-color { background-color: #000; }
.has-black-color { color: #000; }

.has-dark-gray-background-color { background-color: #232323; }
.has-dark-gray-color { color: #232323; }

.has-light-gray-background-color { background-color: #f4f4f4; }
.has-light-gray-color { color: #f4f4f4; }

.has-white-background-color { background-color: #fff; }
.has-white-color { color: #fff !important; }

/*  Highlight colors  */

.has-ropecon-color-gray-background-color { background-color: var(--ropecon-color-gray); }
.has-ropecon-color-gray-color { color: var(--ropecon-color-gray); }
.has-ropecon-color-one-background-color { background-color: var(--ropecon-color-one); }
.has-ropecon-color-one-color { color: var(--ropecon-color-one); }
.has-ropecon-color-two-background-color { background-color: var(--ropecon-color-two); }
.has-ropecon-color-two-color { color: var(--ropecon-color-two); }
.has-ropecon-color-three-background-color { background-color: var(--ropecon-color-three); }
.has-ropecon-color-three-color { color: var(--ropecon-color-three); }
.has-ropecon-color-highlight-one-background-color { background-color: var(--ropecon-color-highlight-one); }
.has-ropecon-color-highlight-one-color { color: var(--ropecon-color-highlight-one); }
.has-ropecon-color-highlight-two-background-color { background-color: var(--ropecon-color-highlight-two); }
.has-ropecon-color-highlight-two-color { color: var(--ropecon-color-highlight-two); }

/*
 *  Animations
 *
 */

.ropecon-block-pattern.wp-block-cover[data-ll-status="loading"],
.ropecon-block-pattern .wp-block-cover[data-ll-status="loading"] {
	background-color: var(--ropecon-color-one);
	animation: 600ms linear 0s infinite alternate running loading-cover-image;
}

@keyframes loading-cover-image {
	0% { opacity: 0.85; }
	100% { opacity: 1; }
}

.fade-in-up.is-hidden {
	opacity: 0;
}
.fade-in-up.is-visible {
	animation: 800ms ease 0s 1 normal none fade-in-up;
}

@keyframes fade-in-up {
	0% { opacity: 0; transform: translate3d(0,75%,0); }
	100% { opacity: 1; transform: none; }
}

/*
 *  Icons
 *
 */

p[class^="icon-"], p[class*=" icon-"] {
	display: block;
	font-size: 48px;
	margin-bottom: 12px;
	text-align: center;
}
	p[class^="icon-"].has-text-align-left, p[class*=" icon-"].has-text-align-left {
		text-align: left;
	}
	p[class^="icon-"].has-text-align-right, p[class*=" icon-"].has-text-align-right {
		text-align: right;
	}

	p.icon-Ropecon:before {
		content: " ";
		display: block;
		height: 48px;
		background-image: url(/wp-content/themes/ropecon/images/ropecon/ropecon_icon_black.svg);
		background-size: 48px;
		background-repeat: no-repeat;
		background-position: 50% 0;
	}
		p.icon-Ropecon.has-text-align-left:before {
			background-position: 0 0;
		}
		p.icon-Ropecon.has-text-align-right:before {
			background-position: 100% 0;
		}

/*
 *  Image information
 *
 */

.wp-block-media-text,
.wp-block-media-text__media {
	position: relative;
}

.image-information {
	position: absolute;
	z-index: 2;
	width: 100%;
	bottom: 0;

	display: grid;
	grid-template-columns: 50px auto;
	grid-template-areas: "area-icon area-info";
	align-items: center;

	color: #fff;
}
	.image-information span.icon {
		display: block;
		grid-area: area-icon;

		width: 30px;
		padding: 3px;
		margin: 10px;

		font-size: 24px;

		border-radius: 50%;
		transition: 200ms all;
	}
		*:hover > .image-information span.icon {
			background-color: rgba(0,0,0,0.5);
		}
	.image-information span.info {
		display: none;
		grid-area: area-info;

		font-family: var(--ropecon-font-heading);
		font-size: 12px;
		font-weight: 500;
		text-shadow: 1px 1px 0 rgba(0,0,0,0.5);
	}
		.image-information.information-visible span.info {
			display: block;
		}

@media screen and (min-width:768px) {
	.wp-block-cover .image-information,
	.wp-block-media-text.has-media-on-the-right .image-information {
		grid-template-columns: auto 50px;
		grid-template-areas: "area-info area-icon";
	}
		.wp-block-cover .image-information span.info,
		.wp-block-media-text.has-media-on-the-right .image-information span.info {
			text-align: right;
		}
}

/*
 *  Kompassi Integration
 *
 */

#kompassi_schedule_notes:not(:empty)::before {
 	font-family: 'icomoon';
 	content: "\e9e6";
	color: rgba(105,105,54,1);
	margin-right: 0.5em;
	font-size: 1.2em;
	vertical-align: top;
}

:root {
	--kompassi-program-icon-default: url(/wp-content/themes/ropecon/images/ropecon/ropecon_icon_white.svg);
	--kompassi-button-bg-active: var(--ropecon-color-one);
}

.dimension { --dimension-bg-color: var(--kompassi-color-blue-mid); }
.dimension:is(.mode,.subject,.participation) { --dimension-bg-color: var(--kompassi-color-blue-dark); }
.dimension.accessibility { --dimension-bg-color: var(--kompassi-color-red); }

/*
 *  Floor Plans
 *
 */

:root {
	--floor-plan-selected-bg: var(--ropecon-color-one);
	--floor-plan-selected-fg: #fff;
	--floor-plan-hover-bg: var(--ropecon-color-two);
	--floor-plan-hover-fg: #fff;
}

/*
 *  Manually usable CSS classes
 *
 */

.wp-block-group.ropecon-notice {
	padding: 1em;
	font-family: var(--ropecon-font-heading);
}
	.wp-block-group.ropecon-notice p {
		margin-bottom: 0;
	}

.wp-block-group.has-small-padding {
	padding: 15px;
}
