/* @override 
	https://sandbox.pincgestaltet.ch/wp-content/themes/bb-theme-child/style.css?* */



/*
Theme Name: Beaver Builder Child Theme
Theme URI: http://www.wpbeaverbuilder.com
Version: 1.0
Description: An example child theme that can be used as a starting point for custom development.
Author: The Beaver Builder Team
Author URI: http://www.fastlinemedia.com
template: bb-theme
*/

/* Add your custom styles here... */ 











/* @group Font Reset
------------------------------------------------------------- */

html {
	-webkit-font-smoothing: antialiased!important;
	-moz-osx-font-smoothing: grayscale!important;
	text-rendering: optimizeLegibility!important;
}

		@media all and (min-width: 1801px) and (max-width: 9999px) {
			html {
				font-size: 16px!important;
			}
		}
		
		@media all and (min-width: 1501px) and (max-width: 1800px) {
			html {
				font-size: 15px!important;
			}
		}	
		
		@media all and (min-width: 1201px) and (max-width: 1500px) {
			html {
				font-size: 14px!important;
			}
		}	
		
		@media all and (min-width: 901px) and (max-width: 1200px) {
			html {
				font-size: 13px!important;
			}
		}	
		
		@media all and (min-width: 601px) and (max-width: 900px) {
			html {
				font-size: 12px!important;
			}
		}
		
		@media all and (min-width: 351px) and (max-width: 600px) {
			html {
				font-size: 11px!important;
			}
		}
		
		@media all and (min-width: 0px) and (max-width: 350px) {
			html {
				font-size: 10px!important;
			}
		}		
		
		@media all and (min-width: 1801px) and (max-width: 9999px) and (max-height: 1100px) {
			html {
				font-size: 15px!important;
			}
		}
		
		@media all and (min-width: 1501px) and (max-width: 1800px) and (max-height: 1100px) {
			html {
				font-size: 14px!important;
			}
		}	
		
		@media all and (min-width: 1201px) and (max-width: 1500px) and (max-height: 1100px) {
			html {
				font-size: 13px!important;
			}
		}	
		
		@media all and (min-width: 901px) and (max-width: 1200px) and (max-height: 1100px) {
			html {
				font-size: 12px!important;
			}
		}

/* @end */



/* @group Custom Properties - General
------------------------------------------------------------- */

:root {
	--basic-font-size: 1.5rem;
	--h1-font-size: 1.5rem;
	--h2-font-size: 1.5rem;
	--h3-font-size: 1.5rem;
	--h4-font-size: 1.5rem;
	--lead-font-size: 1.5rem;
	--small-font-size: 1.0rem;
	
	--basic-line-height: 1.3;
	--h1-line-height: 1.3;
	--h2-line-height: 1.3;
	--h3-line-height: 1.3;
	--h4-line-height: 1.3;
	--lead-line-height: 1.3;
	--small-line-height: 1.3;

	--font-style: normal;
	--font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	--font-weight: 400;
	--font-weight-bold: 700;
	--letter-spacing: 0;
	--word-spacing: 0;	
	
	--color-red: rgba(255, 255, 255, .75);
	--color-blue: rgba(255, 255, 255, .75);
	
	--icon-size: 2.5rem;
}
	
@media all and (max-width: 1800px) {
}	

@media all and (max-width: 1500px) {
}	

@media all and (max-width: 1200px) {
}	

@media all and (max-width: 900px) {
}

@media all and (max-width: 600px) {
}

@media all and (max-width: 350px) {
}

/* @end */



/* @group Typography - General
------------------------------------------------------------- */

body {
	font-family: var(--font-family);
	font-weight: var(--font-weight);
	font-size: var(--basic-font-size);
	line-height: var(--basic-line-height);
}

.fl-page *:not(i) {
	font-style: var(--font-style);
	font-family: var(--font-family);
	font-weight: var(--font-weight);
	letter-spacing: var(--letter-spacing);
	word-spacing: var(--word-spacing);
}

.fl-page p,
.fl-page p * {
	font-size: var(--basic-font-size);
	line-height: var(--basic-line-height);
}

.fl-page h1,
.fl-page h1 * {
	font-size: var(--h1-font-size);
	line-height: var(--h1-line-height);	
}

.fl-page h2,
.fl-page h2 * {
	font-size: var(--h2-font-size);
	line-height: var(--h2-line-height);
}

.fl-page h3,
.fl-page h3 * {
	font-size: var(--h3-font-size);
	line-height: var(--h3-line-height);
}

.fl-page h4,
.fl-page h4 * {
	font-size: var(--h4-font-size);
	line-height: var(--h4-line-height);
}

/* @end */



/* @group Typography - Spacing
------------------------------------------------------------- */

p, h1, h2, h3, h4 {
	margin: 2rem 0 0 0;
}

/* @end */



/* @group Typography - Lists
------------------------------------------------------------- */

.fl-page .fl-rich-text ul {
	margin: 2rem 0 0 0;
	padding: 0;
	display: table;
}

.fl-page .fl-rich-text ul li {
	
	list-style: none;
    display: table-row;
}

.fl-page .fl-rich-text ul li::before {
	content: "–";
	padding: .5rem 1rem 0 0;
	display: table-cell;
}

/* @end */



/* @group Typography - Links
------------------------------------------------------------- */

.fl-page .fl-rich-text > * > a,
.fl-page .fl-rich-text > * > a:hover,
.fl-page .fl-html > * > a,
.fl-page .fl-html > * > a:hover {
	text-decoration: underline;
	text-decoration-thickness: 0.1rem;
	text-underline-offset: 0.1rem;
}

.fl-page .fl-rich-text > * > a:hover,
.fl-page .fl-html > * > a:hover {
	opacity: 0.6;
	text-decoration: none;
}

/* @end */



/* @group Layout - Posts Full Width Fix
------------------------------------------------------------- */

.single-post.fl-builder .fl-page-content .container { width: 100%; max-width: 100%; padding-right: 0; padding-left: 0; }
.single-post.fl-builder .fl-page-content .row {	margin-right: 0; margin-left: 0; }
.single-post.fl-builder .fl-page-content .fl-content { margin: 0; padding-right: 0; padding-left: 0; }

/* @end */



/* @group Layout - Row
------------------------------------------------------------- */

.fl-row {
	max-width: 100%;
}

.fl-row.fl-row-full-width .fl-row-content.fl-row-full-width {
	max-width: 100%;
}

.fl-row.fl-row-full-width .fl-row-content.fl-row-fixed-width {
	max-width: 1600px;
}

/* @end */



/* @group Layout - Row Content Wrap
------------------------------------------------------------- */

.fl-row-content-wrap {
	padding: 2rem 1rem;
}

/* @end */



/* @group Layout - Column Group
------------------------------------------------------------- */

.fl-row .fl-col-group {
	padding-bottom: 2rem;
}

.fl-row .fl-col-group:last-child {
	padding-bottom: 0;
}

/* @end */



/* @group Layout - Module
------------------------------------------------------------- */

.fl-module-content {
	margin: 1rem 1rem;
}

.fl-page .fl-module-content .fl-rich-text > *:first-child,
.fl-page .fl-module-content .fl-html > *:first-child {
	margin-top: 0;
}

/* @end */
















/* @group SVG Image Map
------------------------------------------------------------- */

#piktos {
	--basic-font-size: 50px;
}

#piktos #overlay {
	opacity: 0;
}

#piktos:hover #overlay {
	opacity: 1;
}

#piktos .text {
	font-size: var(--basic-font-size);
	line-height: var(--basic-line-height);
	font-family: var(--font-family);
	font-weight: var(--font-weight);
	font-size: var(--basic-font-size);
	line-height: var(--basic-line-height);
	
	text-anchor: middle; /* Horizontal zentrieren */
	dominant-baseline: middle; /* Vertikal zentrieren */
}

/* @end */

















/* @group Cookie Banner
------------------------------------------------------------- */

html .cc-window,
html .cc-window * {
	font-style: var(--font-style);
	font-family: var(--font-family);
	font-weight: var(--font-weight);
	letter-spacing: var(--letter-spacing);
	word-spacing: var(--word-spacing);
	font-size: var(--basic-font-size);
	line-height: var(--basic-line-height);
	
	font-size: calc( var(--basic-font-size) * .666 );
}

html .cc-window.cc-floating {
	color: #000000;
	background-color: #ffffff;
	max-width: 22.5rem;
	padding: 1rem;
	border-radius: 10px;
	-webkit-box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.1);
	-moz-box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.1);
	box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.1);
}

html .cc-window.cc-bottom {
	bottom: 1rem;
}

html .cc-window.cc-left {
	left: 1rem;
}

html .cc-window.cc-right {
	right: 1rem;
}

html .cc-window.cc-floating .cc-message {
	margin-bottom: 1rem;
}

html .cc-window.cc-floating .cc-message .cc-link {
	opacity: 1;
	padding: 0;
}

html .cc-window.cc-floating .cc-compliance {
	display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: stretch;
    align-content: center;
}

html .cc-window.cc-floating .cc-compliance .cc-btn {
	flex: 0 1 auto;
}

html .cc-window.cc-floating .cc-compliance .cc-btn + .cc-btn {
	margin: 0;
	margin-top: .5rem;
}

html .cc-window.cc-floating .cc-compliance .cc-btn,
html .cc-window.cc-floating .cc-compliance .cc-btn:active,
html .cc-window.cc-floating .cc-compliance .cc-btn:hover {
	color: #000000;
	text-decoration: none;
	border: 1px solid #e5e5e5;
	padding: .5rem;
	border-radius: 5px;
}

html .cc-window.cc-floating .cc-compliance .cc-btn.cc-allow,
html .cc-window.cc-floating .cc-compliance .cc-btn.cc-allow:active,
html .cc-window.cc-floating .cc-compliance .cc-btn.cc-allow:hover {
	background-color: #e5e5e5;
}

html .cc-window.cc-floating .cc-compliance .cc-btn.cc-deny,
html .cc-window.cc-floating .cc-compliance .cc-btn.cc-deny:active,
html .cc-window.cc-floating .cc-compliance .cc-btn.cc-deny:hover {
	background-color: #ffffff;
}

@media (max-width: 600px) {
	
	html .cc-window.cc-floating {
		max-width: none;
	}
	
	html .cc-window.cc-bottom {
		bottom: 1rem;
	}
	
	html .cc-window.cc-left {
		left: 1rem;
		right: 1rem;
	}
	
	html .cc-window.cc-right {
		left: 1rem;
		right: 1rem;
	}	
	
}

/* @end */