@charset "utf-8";
/*
Theme Name: debleu 2024 v1.0
Version: Custom 1.0 / 24.02.2024
Author: debleu.de
Author URI: https://debleu.de/
*/
/*  ------------------------------------------- Typography --- 2*/
@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 400;
	font-display: fallback;
	src: local(''),
	url('../fonts/open-sans-v18-latin-regular.woff2') format('woff2'),
	url('../fonts/open-sans-v18-latin-regular.woff') format('woff');
}
/* open-sans-italic - latin */
/*@font-face {
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 400;
	font-display: fallback;
	src: local(''),
	url('../fonts/open-sans-v18-latin-italic.woff2') format('woff2'),
	url('../fonts/open-sans-v18-latin-italic.woff') format('woff');
}*/
/* open-sans-700 - latin */
@font-face {
	font-family: 'Open Sans Bold';
	font-style: normal;
	font-weight: 700;
	font-display: fallback;
	src: local(''),
	url('../fonts/open-sans-v18-latin-700.woff2') format('woff2'),
	url('../fonts/open-sans-v18-latin-700.woff') format('woff');
}
/* open-sans-700italic - latin */
/*@font-face {
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 700;
	font-display: fallback;
	src: local(''),
	url('../fonts/open-sans-v18-latin-700italic.woff2') format('woff2'),
	url('../fonts/open-sans-v18-latin-700italic.woff') format('woff');
}*/
/* saira-regular - latin */
@font-face {
	font-family: 'Saira';
	font-style: normal;
	font-weight: 400;
	font-display: fallback;
	src: local(''),
	url('../fonts/saira-v7-latin-regular.woff2') format('woff2'),
	url('../fonts/saira-v7-latin-regular.woff') format('woff');
}
:root {
	--typoregular:  'Open Sans', sans-serif;
	--typobold:     'Open Sans Bold', sans-serif;
	--typoheadline: 'Saira', sans-serif;
}
body, button, label, input, select, textarea, p {
	
	font-family: var(--typoregular);

	font-weight: 400;
	font-size: 1.6rem;
	line-height: 1.6;
	/*letter-spacing: 0.05rem;*/
	/*overflow-wrap: break-word;*/
}
b, strong, .bold {
	font-family: var(--typobold);
	font-weight: 500;
}

h1, h2, h3, h4, h5, h6 {

	font-family: var(--typoheadline);
	
	font-weight: 300;
	font-style: normal;
	line-height: 1.2;
	/*letter-spacing: 0.08rem;*/
}

/* --- https://clamp.font-size.app/ --- */
/* --- min: 320px, max: 1920px -------- */

h1 { font-size: clamp(2.6rem, 2.44rem + 0.8vw, 3.4rem); }
h2 { font-size: clamp(2rem, 1.88rem + 0.6vw, 2.6rem); }
h3 { font-size: clamp(1.8rem, 1.76rem + 0.2vw, 2rem); }
h4 { font-size: 1.8rem; }
h5 { font-size: 1.8rem; }
h6 { font-size: 1.8rem; }

/* .topline {
	display: block;
	font-size: clamp(1.8rem, 1.76rem + 0.2vw, 2rem);
	line-height: 1;
} */

.page-title h1 {
	font-size: clamp(2.8rem, 2.6694rem + 0.6531vw, 3.2rem);
	padding-bottom: 0;
}

/* ----------------------------------------------- Colors  --- */

:root {
	--clr-main:			#fff;
	--clr-typo:			#333;
	--clr-typo-hover:	#000;

	/* --clr-main:			#313131;
	--clr-typo:			#d3d3d3;
	--clr-typo-hover:	#fff; */

	/* --clr-bg-dark: hsl(209deg 100% 10%);
	--clr-bg-lite: hsl(214deg 100% 45%); */


	--clr-btn-one:      #E5A121;
}

html {
	background-color: hsl(204, 20%, 95%);
}

body {
	background-color: var(--clr-main);
	/* background-image: linear-gradient( 50deg, var(--clr-bg-dark) 0%, var(--clr-bg-lite) 100% ); */
}

#site-header {
	background-color: var(--clr-main);
	/* background-color: rgb(255 255 255 / 60%); */
}

body, button, input, select, textarea, p {
	color: var(--clr-typo);
}

h1, h2, h3, h4, h5, h6 {
	color: var(--clr-typo);
}

#topimage {
	background-color: var(--clr-main);
}

.footer {
	background-color: #2F2E2C;
}

#copyright {
	background-color: #000;
}

#copyright a {
	color: #767676;
}

#copyright a:hover {
	color: #B7B7B7;
}

a {
	color: var(--clr-typo);
}

a:hover, a:active {
	color: var(--clr-typo-hover);
	text-decoration-color: #f07400;
	outline: none;
}

/* ----------------------------------------------- Buttons --- */
.read-more {
	padding-bottom: 0;
	margin-bottom: 10px;
	display: inline-block;
	text-decoration: none;
}
a.button {
	background-color: var(--clr-btn-one);
	color: #fff;
	transition: background-color 100ms, color 300ms;
	text-decoration: none;
}
a.button:hover, a.button:active {
	background-color: var(--clr-2);
	color: #fff;
	outline: 0;
}
.btn-center {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100%;
}

a.btn-light,
a.btn-dark {
	display: inline-block;
	padding: 8px 20px;
	margin-top: 40px;
	font-family: var(--typobold);
	line-height: 1.3;
	text-transform: uppercase;
	letter-spacing: 0.15rem;
	color: #fff;
	transition: all .3s;
	border-radius: 2px;
	text-decoration: none;
}
a.btn-light {
	background-color: var(--clr-btn-one);
	border: 1px solid var(--clr-btn-one);
}
a.btn-light:hover, a.btn-light:active {
	background-color: #fff;
	color: #000;
	outline: 0;
}
a.btn-dark {
/*    background-color: var(--clr-5);
	border: 1px solid var(--clr-5);*/
	background-color: #000;
	border: 1px solid #000;
}
a.btn-dark:hover, a.btn-dark:active {
	background-color: #fff;
	color: #000;
	outline: 0;
}
/*a.btn-light::after,
a.btn-dark::after {
	content: "";
	display: inline-block;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='320.8' y='231.8' viewBox='0 0 320.8 231.8'%3E%3Cstyle type='text/css'%3E .icon-arrow%7Bfill:none;stroke:%23FFFFFF;stroke-width:24.4408;%7D%0A%3C/style%3E%3Cline class='icon-arrow' x1='0' y1='115.9' x2='294.4' y2='115.9'/%3E%3Cpath class='icon-arrow' d='M194.5,10.4L300,115.9L194.5,221.4'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	width: 20px;
	height: 18px;
	margin-left: 10px;
	vertical-align: middle;
}
a.btn-light:hover::after,
a.btn-dark:hover::after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='320.8' y='231.8' viewBox='0 0 320.8 231.8'%3E%3Cstyle type='text/css'%3E .icon-arrow%7Bfill:none;stroke:%23000000;stroke-width:24.4408;%7D%0A%3C/style%3E%3Cline class='icon-arrow' x1='0' y1='115.9' x2='294.4' y2='115.9'/%3E%3Cpath class='icon-arrow' d='M194.5,10.4L300,115.9L194.5,221.4'/%3E%3C/svg%3E");
}*/