@charset "utf-8";
/*
 Theme Name: 	Brennstoffe Wolk
 Description: 	Individuelles Wordpress Template für Brennstoffe Wolk!
 Author:       	Franziska Baierlein
 Version:      	1.0.0
*/
/*
FARBEN
Weiß			#FFFFFF
Rot				#9E1D20
Dunkelgrau		#333333
Schwarz			#000000
*/

@import url("css/normalize.min.css");
@import url("css/wordpress.css");

/* archivo-regular - latin */
@font-face {
  font-display: swap;
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 400;
  src: url('https://www.heizoel-wolk.de/wp-content/themes/wolk/fonts/Archivo-Regular.ttf') format('truetype'),
	  url('https://www.heizoel-wolk.de/wp-content/themes/wolk/fonts/Archivo-Regular.woff2') format('woff2'); 
}
/* archivo-semibold - latin */
@font-face {
  font-display: swap;
  font-family: 'Archivo';
  font-style: italic;
  font-weight: 500;
  src: url('https://www.heizoel-wolk.de/wp-content/themes/wolk/fonts/Archivo-SemiBold.ttf') format('truetype'),
	  url('https://www.heizoel-wolk.de/wp-content/themes/wolk/fonts/Archivo-SemiBold.woff2') format('woff2');
}
/* archivo-bold - latin */
@font-face {
  font-display: swap; 
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 600;
  src: url('https://www.heizoel-wolk.de/wp-content/themes/wolk/fonts/Archivo-Bold.ttf') format('truetype'),
	  url('https://www.heizoel-wolk.de/wp-content/themes/wolk/fonts/Archivo-Bold.woff2') format('woff2');
}

* {
    /*scroll-margin-top: 250px;*/
}
img{
	max-width: 100%;
	height: auto;
	margin-bottom: 1em;
}
figure{
	margin: 0;
}
html, body{
	background: #F2F2F2;
}
body{ 
	font-size: 1em; 
	font-size: 18px; 
	line-height: 1.5em;
	font-family: "Archivo", sans-serif;
	font-weight: 400;
	font-style: normal;
	color: #333333;
	/*background: #fff;*/
	margin: 0;
	accent-color: #9E1D20;
}
h1, h2, h3, h4, h5, h6{
	font-family: "Archivo", sans-serif;
	font-weight: 700; 
	font-style: normal; 
	font-size: 1.5em;
	line-height: 2.4rem;
	color: #333333;
	margin: 0;
	margin-bottom: 2rem;
	position: relative;
}
@media screen and (min-width: 800px){
	h1, h2, h3, h4, h5, h6{
		font-size: 2rem;
	}
}
@media screen and (min-width: 1024px){
	h1, h2, h3, h4, h5, h6{
		font-size: 2.25em;
	}
}
p{
	margin-top: 0;
	margin-bottom: 2rem;
}
a {
	color: #9E1D20;
	text-decoration: underline;
	-moz-transition: all 0.2s linear; 
	-webkit-transition: all 0.2s linear; 
	-ms-transition: all 0.2s linear;
	-o-transition: all 0.2s linear; 
	transition: all 0.2s linear;
	word-break: break-word;
}
hr, 
hr.wp-block-separator{
	height: 2px;
	margin-top: 0;
	margin-bottom: 1em;
	border-width: 0;
	background-color: #C7C7C7;
}
.txt-center,
.center{ 
	text-align: center;
}
.txt-right, 
.right{ 
	text-align: right; 
	float: right;
}
.uppercase{
	text-transform: uppercase;
}
.padding-tb{
	padding-top: 1em;
	padding-bottom: 1em;
}
.padding-t{
	padding-top: 1em;
}
.padding-b{
	padding-bottom: 1em;
}
.no-padding-tb, 
.wp-block-columns.no-padding-tb{
	padding-top: 0!important;
	padding-bottom: 0!important;
}
.padding-rl{
	padding-right: 1em; 
	padding-left: 1em;
}
.margin-b{
	margin-bottom: 1em;
}
::-moz-selection {
	background: #9E1D20; 
	color: #ffffff; 
}
::selection {
	background: #9E1D20; 
	color: #ffffff; 
}
main ul li {
	margin-bottom: 0.75em; 
	position: relative;
	line-height: 1em;
}
main ul li ul{ 
	margin-top: 0.75em;
}
main ul {
	list-style: none !important;
	padding-left: 1.5em;
}
main ul:not(.wpforms-field-required) li:before{
	content: "•";
	color: #9E1D20;
	position: absolute;
	left: -1.25em;
	font-weight: 700;
}
@media screen and (min-width: 1024px){
	.zweispaltig{
		-webkit-column-count: 2;
		-moz-column-count: 2;
		column-count: 2;
		-webkit-column-gap: 2.5em;
		-moz-column-gap: 2.5em;
		column-gap: 2.5em;
	}
}
/*Hochscrollen*/
.stoererseite, 
.stoererseite:before{
	-moz-transition: background 0.2s linear;
    -webkit-transition: background 0.2s linear;
    -ms-transition: background 0.2s linear;
    -o-transition: background 0.2s linear;
    transition: background 0.2s linear;
}
.stoererseite{ 
	display: none; 
	position: fixed;
	bottom: 40px;
	right: 1em; 
	z-index: 4;
	height: 64px; 
	width: 64px; 
	border-radius: 50%;
	-webkit-box-shadow: 0px 3px 6px rgb(0 0 0 / 16%);
    -moz-box-shadow: 0px 3px 6px rgb(0 0 0 / 16%);
    box-shadow: 0px 3px 6px rgb(0 0 0 / 16%);
	background: #fff; 
}
.stoererseite:before { 
	content: "";
	background: url("images/totop.png");
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	width: 44px;
	height: 44px;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto; 
}
.stoererseite:hover { 
	background: #213E79;
}
.stoererseite:hover:before { 
	-webkit-filter: brightness(0) invert(1);
	filter: brightness(0) invert(1);
}
@media screen and (min-width: 1450px){
	.stoererseite{
		height: 64px; 
		width: 64px; 
	}
}
@media screen and (max-width: 768px){
	.stoererseite{
		bottom: 24px;
		right: 24px;
		height: 44px; 
		width: 44px; 
	}
	.stoererseite:before { 
		width: 30px;
		height: 30px;
	}
}
iframe{
	max-width: 100%;
}
/*Logo*/
.column-logo{
	z-index: 999;
    position: relative;
	width: 50%;
}
a.custom-logo-link{
	/*position: absolute;
	top: 0;
	left: 8%;
	z-index:6;*/
}
img.custom-logo{
	max-width: 340px!important;
	height: auto;
	box-shadow: 0px 4px 10px rgba(0,0,0,0.50);
	margin-bottom:0;
}
/*Header*/
/*#main-nav{ background: #fff; }*/
nav#header-menu{
	text-align: right;
	top: 3.5em;
    position: absolute;
    z-index: 4;
    /*width: 100%;*/
	width: -webkit-fill-available;
}
nav#header-menu ul{
	list-style-type: none;
	margin:0;
	padding:0;
}
nav#header-menu a{
	text-decoration: none;
    background: #ffffff;
	font-weight: 600;
    padding: 1em;
    box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.15);
}
nav#header-menu a:before{
	content: "";
    background: url("https://www.heizoel-wolk.de/wp-content/uploads/phone.png");
	background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    width: 24px;
    height: 24px;
    display: inline-block;
    position: relative;
    top: 5px;
    margin-right: 0.5em;
}
header .erstezeile{
	text-align: right;
	font-size: 0.8em;
}
header .erstezeile p{
	margin-bottom: 0;
}
@media screen and (max-width:750px){
	header .erstezeile{
		display:none;
	}
	img.custom-logo{
		max-width: 100%!important;
	}
	nav#header-menu{
		top: 2em;
	}
}
@media screen and (max-width:600px){
	nav#header-menu a:before{
		display:none;
	}
}
header > .container{
	padding: 0;
}
header .wp-block-columns {
	margin: 0;
}
header .wp-block-column#header_tms{
	text-align: right;
}
header .wp-block-column#header_tms > *{
	display: inline-block;
	vertical-align: middle;
	margin-left:3em;
	margin-top: 0; 
	margin-bottom: 0;
}
header .wp-block-column#header_tms > *:first-child{
	margin-left: 0em;
}
#logo img{
	max-width: 352px;
}
@media screen and (max-width: 1000px){
	header .wp-block-column#header_tms > *{margin-left: 1em;}
}
@media screen and (max-width: 949px){
	/*#logo {padding-right: 1em;}
	#logo img {max-width: 150px;}
	header .wp-block-column#logo, header .wp-block-column#header_tms{flex-basis: 41% !important;flex-grow: 0;margin-left: 0;}
	header .wp-block-column#logo {flex-basis: 55% !important;}*/
	header .wp-block-columns{flex-wrap: nowrap!important;align-items: center!important;}
}
@media screen and (min-width: 950px) {
	header .wp-block-column#header_tms {
		-moz-transition: padding linear 0.5s;
		-webkit-transition: padding linear 0.5s;
		-o-transition: padding linear 0.5s; 
		transition: padding linear 0.5s;
	}
	header{
		padding: 0;
	}
}
@media screen and (max-width: 1219px){
	/*header{ padding-top: 0.75em; }*/
	.kontaktblock .wp-block-columns{
		display: inline-block;
	}
	.kontaktblock .wp-block-columns,
	.kontaktblock .wp-block-columns > div{
		display: inline-block;
	}
	.kontaktblock .wp-block-columns > div:nth-child(2){
		margin-right: 2em;
		margin-bottom: 1em;
	}
}
/*@media screen and (min-width: 1220px){
	#logo img{
		display:block;
	}
	#logo a{
		line-height: 0;
	}
}*/
/*Main*/
main > .container > *{ 
	position: relative;
}
main > .container > .is-hidden{ 
	opacity: 0;
	top: 2rem;
	position: relative;
}
main > .container > .bounce-in{
	opacity: 1; 
	top: 0; 
	-webkit-transition: top linear 1s, opacity linear 1s; 
	-moz-transition: top linear 1s, opacity linear 1s; 
	-o-transition: top linear 1s, opacity linear 1s; 
	-ms-transition: top linear 1s, opacity linear 1s; 
	transition: top linear 1s, opacity linear 1s;
}
.wp-block-columns.before-element{
	overflow: hidden;
}
.flamme{
	position: relative;
}
.flamme:before{
	content: "";
    background: url(https://www.heizoel-wolk.de/wp-content/uploads/flamme.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    width: 450px;
    height: 450px;
    position: absolute;
    top: -25%;
    left: -250px;
    z-index: 0;
}
.wp-block-column > * {
    z-index: 1;
    position: relative;
}
/*Footer*/
footer{
	padding: 0.5em 0;
}
footer nav{
	text-align: right;
	font-size: 0.8em;
}
footer ul{
	list-style-type: none;
    padding: 0;
	margin: 0;
}
footer ul li{
	display: inline-block;
}
footer ul li:not(:last-child){
	padding-right: 1em;
}
footer a{
	color: #9E1D20;
	text-decoration: none;
}
footer a:hover{
	text-decoration: underline;
}