/* Stylesheet der alten Projektseiten (2023).
   Von Hand aus less/style23.less übertragen, damit less.js nicht mehr
   im Browser laufen muss. Inhalt unverändert, nur LESS → CSS:
   Variablen eingesetzt, verschachtelte Regeln ausgeschrieben, //-Kommentare entfernt.
   @black #232222 · @white #ffffff · @lightgray #e5e5e5 · @highlight #fddf · @gray #cfcfcf */

@font-face {
	font-family: 'Outfit';
	src: url('fonts/Outfit-ExtraLight.woff2') format('woff2'),
		url('fonts/Outfit-ExtraLight.woff') format('woff');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Outfit';
	src: url('fonts/Outfit-Bold.woff2') format('woff2'),
		url('fonts/Outfit-Bold.woff') format('woff');
	font-weight: bold;
	font-style: normal;
	font-display: swap;
}

.spacer {
	display: block;
	height: 6em;
}

.d-block {display: block;}

@media (max-width: 575px) {
	.welcome_msg {font-size: 1rem !important; max-width: 100% !important;}
	.text-s-center {text-align: center;}

	.row {min-height: 135px;}
	body, #cookie_text, #cookie_button {padding: 1em;}
}

@media (min-width: 576px) {
	.row {min-height: 135px;}
	body, #cookie_text, #cookie_button {padding: 2em;}
}

@media (min-width: 768px) {
	.row {min-height: 140px;}
}

@media (min-width: 992px) {
	.row {min-height: 160px;}
}

@media (min-width: 1200px) {
	.row {min-height: 160px;}
}

@media (min-width: 1400px) {
	.row {min-height: 160px;}
}

section#head {margin-bottom: 0 !important;}

body {
	font-family: "Outfit";
	font-size: 16px;
	color: #292929;
	letter-spacing: 0;
	line-height: 22px;
	background-color: #ffffff;
	opacity: 1;
}

figcaption, small {
	font-size: 0.6rem !important;
	line-height: 1rem;
}

figcaption {max-width: 450px;}

small a {text-decoration: underline; font-size: 0.8rem; padding: 0 !important;}
em {font-style: normal; padding-right: 1rem; font-size: 0.8rem;}

h1.lead {font-size: 3rem !important;}
h1 {margin-top: 1em; margin-bottom: 1em; display: block;}

a {color: #232222 !important; padding-left: 0.5rem; padding-right: 0.5rem; text-decoration: none;}

a:hover:not(.project_preview) {color: #fddf; opacity: 0.5; text-decoration: none; cursor: pointer;}

.project_preview video {width: 100%;}

.tag {
	text-transform: uppercase;
	font-size: 0.8rem;
	letter-spacing: 1px;
	line-height: 1.5rem;
	border-bottom: 1px solid black;
}

h1, h2, h3, a {font-size: 1rem; font-weight: normal !important; color: #292929; margin-bottom: 1rem;}

p {max-width: 400px;}

.link {
	font-weight: bold !important;
	letter-spacing: 1px;
}

h3 {margin-bottom: 1em;}

.project_preview:hover h3.card-title {font-weight: bold !important;}

.shadow img {box-shadow: 1px 1px 11px lightgrey;}

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

li {list-style: none;}

.w-100 {width: 100%;}

.h-100 {
	height: 100vh;
	display: block;
}

.text-center {text-align: center;}

.project_preview {margin-bottom: 8rem;}

.cookie #cookieNotice {opacity: 1; pointer-events: all;}

#cookieNotice {
	opacity: 0;
	pointer-events: none;
	position: fixed;
	top: 0;
	margin: auto !important;
	transition: opacity 0.1s;
}

.projecte img {max-width: 100%;}

#site {opacity: 1; transition: opacity 0.5s ease-in;}

body.cookie {
	background-color: #e5e5e5;
	overflow: hidden;
}

body.cookie section {pointer-events: none;}

body.cookie #portfolio {display: none;}

body.cookie #site,
body.cookie #about,
body.cookie footer {opacity: 0.1; filter: blur(8px);}

.cookie_msg {padding-right: 2em;}

.cookie_msg a {display: block; margin-top: 1em; text-decoration: underline;}

#cookieNoticeCloser {display: block; padding: 1em 2em; border-color: #232222; background-color: transparent; border-style: solid;}

.welcome_msg {
	white-space: nowrap;
	font-size: 1.5em;
	line-height: 1.2em;
}

.b-top {border-top: 1px solid #232222;}
.b-bot {border-bottom: 1px solid #232222;}

.copyright {font-size: 0.5em;}

section:not(#footer) {margin-bottom: 8rem;}

#cookieNoticeCloser:hover {background-color: #232222; color: white; cursor: pointer;}

li {
	margin-top: 1em;
}

a.intext {padding: 0 !important; font-weight: bold !important;}

body.projecte {background-color: #f9f9f9;}

p.text {
	text-transform: uppercase;
	font-size: 0.8em;
	letter-spacing: 0.1em;
	margin-top: 8em;
	text-align: right;
}