/*
Theme Name: Bussmann Design Standard
Theme URI: https://www.bussmann-design.de/
Description: Dieses Design wurde für Ihre Webseite vom Webdesigner Marko Bussmann entwickelt.
Author: Marko Bußmann
Author URI: https://www.bussmann-design.de/
Version: 1.0
*/


sup {
    font-size: 0.5em;
    position: relative;
    top: 0em;
    margin-left: 2px; /* optional Abstand */
}
sub {
    vertical-align: sub;
    font-size: smaller;
}
/* RESET ENDE */

/* open-sans-300 - latin */
@font-face {
  font-display: optional; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: url('/fonts/open-sans-v44-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-regular - latin */
@font-face {
  font-display: optional; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/open-sans-v44-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* open-sans-700 - latin */
@font-face {
  font-display: optional; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: url('/fonts/open-sans-v44-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* BODY */
html {
	font-size: 16px;
	font-size: 100%;
	background-color: #005583;
}
body {
	font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
	font-weight: 400; 
	color: #FFC200;
	line-height: 1.5;
	word-wrap: break-word;	
}
* {-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
embed, object, video, iframe {max-width: 100%}

/* NAV */
nav ul {margin: 0px 0% 0px 0%;	padding: 0px 0% 0px 0%;}
nav li {list-style: none;}

/* TEXT */
h1, h2, h3, h4, p {
	width: 100%;
	height: auto;
	font-style: normal;
}
h1 {
	font-size: 1.25em;
	font-weight: 300;
	padding: 0em 0em 0em 0em;
}
h2 {
	font-size: 1.25em;
	font-weight: 300;
	padding: 1em 0em 0.25em 0em;
}
h3 {
	font-size: 1em;
	font-weight: 400;
	padding: 1em 0em 0em 0em;
}
h4 {
	font-size: 0.875em;
	font-weight: 400;
	padding: 1em 0em 0em 0em;
}
p {
	font-weight: 300;
}
/* Schmuckfarbe */
h1, h2, h3, h4, th,
main li:before, main li li:before, 
.haken li:before, .haken li li:before,
main a:hover, .farblink a,
.wpcf7 p .fa {
	color: #FFC200;
}
p {
	padding: 0.75em 0em 0.75em 0em;
}
b, strong {font-weight: 400;}
i, em {font-style: italic;}

.font100 {font-weight: 100!important;}
.font200 {font-weight: 200!important;}
.font300 {font-weight: 300!important;}
.font400 {font-weight: 400!important;}
.font500 {font-weight: 500!important;}
.font600 {font-weight: 600!important;}
.font700 {font-weight: 700!important;}
.font800 {font-weight: 800!important;}
.font900 {font-weight: 900!important;}

.kleiner1 {font-size: 87.5%;}
.kleiner2 {font-size: 75%;}
.kleiner3 {font-size: 68.75%;}
.kleiner4 {font-size: 62.5%;}
.groesser1 {font-size: 112.5%;}
.groesser2 {font-size: 125%;}
.groesser3 {font-size: 137.5%;}
.groesser4 {font-size: 150%;}
.groesser5 {font-size: 175%;}
.groesser6 {font-size: 200%;}

.center {text-align: center;}
.text-rechts {float: right; margin-left: 1em;}

.abstand1 {float: left;	width: 4em;}
.abstand2 {float: left;	width: 5.5em;
}
hr {
	clear: both;
	display: block;
	height: 0px;
	width: 100%;
	border-top: 1px solid #90863a;
	border-bottom: 1px solid rgba(255,255,255,0.00);
	border-left: 0px;
	border-right: 0px;
	background-color: rgba(255,255,255,0.00);
	margin: 4% 0% 4% 0%;
}
/* VIDEO */
.wp-video, .wp-video-shortcode {
	float: left;
	width: 100%!important;
	height: auto;
	margin: 0.25em 0em 1em 0em;
	padding: 0em 0em 0em 0em;
}

/* LINKS + BUTTON  */
a, input, textarea, select, option, input[type="submit"], body {-webkit-transition: all .3s ease-in; -moz-transition: all .3s ease-in; -o-transition: all 3s ease-in; -ms-transition: all .3s ease-in; transition: all .3s ease-in;}
a:hover, input:hover, input:focus, select:hover, select:focus, textarea:hover, textarea:focus, option:hover, option:focus, input[type="submit"]:focus, input[type="submit"]:hover {-webkit-transition: all .2s ease-in; -moz-transition: all .2s ease-in; -o-transition: all .2s ease-in; -ms-transition: all .2s ease-in; transition: all .2s ease-in;}

main a {
	color: #FFC200;
	display: inline-block;
	width: auto;
	height: auto;
}
main a:hover {
	color: #fff;
}
.button {
	display: inline-block;
	width: auto;
	height: auto;
	padding: 16px 22px 16px 22px;
	margin: 0em 0.5em 0.5em 0em;
	color: #FFC200;
	border: 1px solid #FFC200;
	background-color: #005583;
	border-radius: 0px;	
	line-height: 1.1;
	text-decoration: none;
}
.button:hover {
	color: #fff;
	border: 1px solid #fff;
}

/* FORMULARE */
input, textarea, select, option {
	padding: 10px;
	margin: 0em 0em 0.25em 0em;
	width: 100%;
	height: auto;
	font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
	font-size: 1em;
	font-weight: 400;
	color: #FFC200;
	background-color: #005583;
	border: 1px solid #FFC200;
}
input:hover, input:focus, select:hover, select:focus, textarea:hover, textarea:focus, option:hover, option:focus {
	color: #fff;
	border: 1px solid #fff;
}
.anrede select {
	width: 7em!important;
}
input[type="file"]  {
	padding-left: 0em;
	border: 1px solid rgba(255,255,255,0.00);
	background-color: rgba(255,255,255,0.00);
}
textarea {
	height: auto !important;
}
input[type="checkbox"] {
	display: inline;
	margin-left: 1em;
	width: auto!important;
	height: auto!important;
}
label {
	float: left;
	width: 100%!important;
	height: auto;
	margin: 0em 0em 0.25em 0em;
	padding: 0em 0em 0em 0em;
}
input[type="checkbox"], input[type="radio"] {
	float: left;
	display: block;
	margin: 0.30em 0em 0em 0em;
	padding: 0em 0em 0em 0em;
	width: auto!important;
	height: auto!important;
	text-align: left;
}

button[type="submit"] {
	display: inline-block;
	width: auto;
	height: auto;
	padding: 16px 22px 16px 22px;
	margin: 0em 0.5em 0.5em 0em;
	color: #FFC200;
	border: 1px solid #FFC200;
	background-color: #005583;
	border-radius: 0px;	
	line-height: 1.1;
	text-decoration: none;
}
}
button[type="submit"]:focus, button[type="submit"]:hover {
	color: #fff;
	border: 1px solid #fff;
}

/* BILDER */
img {border: 0;}
.bild-100 {
	width: 100% !important;
	height: auto;
	line-height: 0;
}
.bild-links {
	float: left;
	margin: 0em 2em 0.5em 0em;
	width: 50% !important;
	height: auto;
	line-height: 0;
}
.bild-rechts {
	float: right;
	margin: 0em 0em 0.5em 2em;
	width: 50% !important;
	height: auto;
	line-height: 0;
}
.bild-center {
	width: 50%;
	padding-left: 25%;
	padding-right: 25%;
	height: auto;
}
/* Bildunterschrift unter dem Bild */
figure {
    padding: 0%;
	margin: 1em 0em 1.5em 0em;
    text-align: left;
}
figure img {
    border: 0 none;
    height: auto;
    margin: 0px 0px 0px 0px;
    width: 100% !important;
    padding: 0;
    width: auto;
}
a figure img {
    border: 1px solid rgba(0,0,0,0);
    box-sizing: border-box;
}
a:hover figure img {
    border-color: #FFC200;
    transition: all .2s ease-in;
}
figcaption {
    font-size: 1em;
    margin: 0;
    font-weight: 300;
    padding: 0.5em 0em 0.5em 0em;
}
a:has(figure) {
    text-decoration: none;
}

/* TABELLE */
table {
	font-size: 100%;
	margin: 1em 0em 2em 0em;
}
th {
	font-weight: 400;
	text-align: left;
	padding: 0.5em 0em 0.25em 0em;
	border-bottom: 1px solid #90863a;
	font-size: 1em;
}
td {
	font-weight: 300;
	padding: 0.5em 0em 0.5em 0em;
	border-bottom: 1px solid #596858;
	font-size: 1em;
}
tr:nth-child(odd) {
	background-color: rgba(0,0,0,0.0);
}
/* Symbole Startseite */
.symbol-link {
    text-decoration: none;
    color: #e6b800;
    display: block;
}
.symbol-zeile {
    display: flex;
    align-items: center; 
    width: 100%;
    padding: 0px;
    box-sizing: border-box;
}
.symbol-bild1,
.symbol-bild2,
.symbol-bild3,
.symbol-bild4,
.symbol-bild5,
.symbol-bild6,
.symbol-bild7,
.symbol-bild8 {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 50px 50px;
    width: 50px;
    height: 50px;
    flex-shrink: 0;
    margin-right: 20px;
    transition: all .3s ease-in;
}
.symbol-bild1 {background-image: url(grafiken/icons/house-rent-yellow.webp);}
.symbol-bild2 {background-image: url(grafiken/icons/rv-yellow.webp);}
.symbol-bild3 {background-image: url(grafiken/icons/boat-yellow.webp);}
.symbol-bild4 {background-image: url(grafiken/icons/bike-yellow.webp);}
.symbol-bild5 {background-image: url(grafiken/icons/shop-yellow.webp);}
.symbol-bild6 {background-image: url(grafiken/icons/bio-yellow.webp);}
.symbol-bild7 {background-image: url(grafiken/icons/book-yellow.webp);}
.symbol-bild8 {background-image: url(grafiken/icons/hammer-brush-yellow.webp);}

.symbol-link:hover .symbol-bild1 {background-image: url(grafiken/icons/house-rent-white.webp);}
.symbol-link:hover .symbol-bild2 {background-image: url(grafiken/icons/rv-white.webp);}
.symbol-link:hover .symbol-bild3 {background-image: url(grafiken/icons/boat-white.webp);}
.symbol-link:hover .symbol-bild4 {background-image: url(grafiken/icons/bike-white.webp);}
.symbol-link:hover .symbol-bild5 {background-image: url(grafiken/icons/shop-white.webp);}
.symbol-link:hover .symbol-bild6 {background-image: url(grafiken/icons/bio-white.webp);}
.symbol-link:hover .symbol-bild7 {background-image: url(grafiken/icons/book-white.webp);}
.symbol-link:hover .symbol-bild8 {background-image: url(grafiken/icons/hammer-brush-white.webp);}

.symbol-text {
    height: 50px;
    font-size: 16px;
    margin-top: 15px;
}

/* HEADER ALLGEMEIN */
.logo {
	display: block;
	float: left;
	width: 35px;
	height: 35px;
	margin: 0px 15px 0px 0px;
	padding: 0em 0% 0em 0%;
}
.titel {
	float: left;
	width: 60%;
	height: auto;
	margin: 6px 0% -2px 0%;
	padding: 0px 0px 0px 0px;
	font-size: 1.125em;
	font-weight: 300;
}
nav {
	float: right;
	width: 25%;
	height: auto;
	margin: 6px 0% 0px 0%;
	padding: 0px 0% 0px 0%;
}
nav a {
	float: right;
	width: auto;
	height: auto;
	margin: 0px 0% 0px 0%;
	padding: 0px 0% 0px 0%;
	text-decoration: none;
	color: #FFC200;
	font-size: 1.125em;
	font-weight: 300;
}
nav a:hover {
	color: #fff;
}
.symbol-kontakt a {
	float: right;
	width: 18px;
	height: 18px;
	margin: 4px 0% 0px 0%;
	padding: 0px 0% 0px 0%;
	background-image:url(grafiken/envelope-yellow.webp);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 18px 18px;	
}
.symbol-kontakt a:hover {
	background-image:url(grafiken/envelope-yellow2.webp);
}
.nav-trenner {
	float: right;
	width: 1px;
	height: 16px;
	margin: 6px 10px 0px 10px;
	padding: 0px 0% 0px 0%;
	border-left: 1px solid #90863a;
}
.site-main {
	max-width: 1280px;
	margin: 0px auto 0;
	padding: 0px 40px 0px 40px;
}
/* FOOTER ALLGEMEIN */
footer a {
	text-decoration: none;
	color: #FFC200;
	font-size: 1em;
	font-weight: 200;
}
footer a:hover {
	color: #fff;
}
.footer-trenner {
	display: inline-block;
	width: 1px;
	height: 14px;
	margin: 0px 10px -2px 10px;
	padding: 0px 0% 0px 0%;
	border-left: 1px solid #90863a;
}
/* BURGER-NAVIGATION */
.main-menu {
	float: right;
	position: relative;
	width: auto;
	height: auto;
	margin: 0px 0px 0px 0px;
	padding: 0px;
}

.menu-toggle {
	display: block;
	float: right;
	width: 22px;
	height: 22px;
	margin: 5px 0px 0px 0px;
	padding: 0px;
	background: transparent;
	border: 0;
	cursor: pointer;
}

.menu-toggle span {
	display: block;
	width: 22px;
	height: 1.25px;
	margin: 0px 0px 5px 0px;
	padding: 0px;
	background-color: #FFC200;
	transition: all .2s ease-in;
}
.menu-toggle:hover span,
.menu-toggle:focus span {
	background-color: #fff;
}
.menu-links {
	display: none;
	position: absolute;
	top: 36px;
	right: 0px;
	width: 180px;
	margin: 0px;
	padding: 0px;
	background-color: #005583;
	border: 1px solid #596858;
	box-shadow: 0px 20px 50px rgba(0,62,95,0.85);
	z-index: 9999;
}
.menu-links li {
	float: none;
	display: block;
	width: 100%;
	margin: 0px;
	padding: 0px;
	list-style: none;
}
.menu-links a {
	float: none;
	display: block;
	width: 100%;
	margin: 0px;
	padding: 8px 14px;
	color: #FFC200;
	text-decoration: none;
	font-size: 1em;
	font-weight: 300;
}
.menu-links a:hover {
	color: #fff;
	background-color: rgba(255,255,255,0.08);
}
.main-menu.is-open .menu-links {
	display: block;
}

/* ENDE ALLGEMEIN */



@media only screen and (min-width: 1050px) { /* DESKTOP */
html {font-size: 93.75%;}
.desktop {}
.tablet {display: none;}
.smartphone {display: none;}
.tablet-smartphone {display: none;}
table {
	font-size: 100%;
}
body {
	margin: 0% 0% 0% 0%;
	padding: 0% 0% 0% 0%;
}
header {
	position: fixed;
	width: 100%;
	height: 50px;
	margin: 0px 0% 0px 0%;
	padding: 7px 40px 10px 40px;
	border-bottom: 1px solid #596858;
	background-color: #005583;
	box-shadow: 0px 0px 100px rgba(0,62,95,0.85);
}
.site-header {
	max-width: 1200px;
	margin: 0px auto 0;
	padding: 0% 0% 0% 0%;
}
main {
	float: left;
	width: 100%;
	height: auto;
	margin: 0px 0% 0px 0%;
	padding: 100px 0% 50px 0%;
}
.content {
	float:left;
	height:auto;
	width: 100%;
	margin: 0% 0% 0% 0%;
	padding: 0% 0% 0% 0%;
}

footer {
	position: fixed;
	width: 100%;
	bottom: 0px;
	left: 0px;
	height: 50px;
	margin: 0px 0% 0px 0%;
	padding: 10px 40px 0px 40px;
	border-top: 1px solid #596858;
	background-color: #005583;
	box-shadow: 0px 0px 100px rgba(0,62,95,0.85);
}
.site-footer {
	max-width: 1200px;
	margin: 0px auto 0;
	padding: 0% 0% 0% 0%;
	text-align: center;
}
}

@media only screen and (max-width: 1050px) and (min-width: 620px) { /* Tablet */
html {font-size: 100%;}
.desktop {display: none;}
.tablet {}
.smartphone {display: none;}
.tablet-smartphone {}
table {
	font-size: 90%;
}
body {
	margin: 0% 0% 0% 0%;
	padding: 0% 0% 0% 0%;
}
header {
	position: fixed;
	width: 100%;
	height: 50px;
	margin: 0px 0% 0px 0%;
	padding: 7px 40px 10px 40px;
	border-bottom: 1px solid #596858;
	background-color: #005583;
	box-shadow: 0px 0px 100px rgba(0,62,95,0.85);
}
.site-header {
	width: 100%;
	margin: 0px;
	padding: 0px;
}
.titel {
	display: none;
}
nav {
	width: 60%;
}
main {
	float: left;
	width: 100%;
	height: auto;
	margin: 0px 0% 0px 0%;
	padding: 100px 0% 50px 0%;
}
.content {
	float:left;
	height:auto;
	width: 100%;
	margin: 0% 0% 0% 0%;
	padding: 0% 0% 0% 0%;
}

footer {
	position: fixed;
	width: 100%;
	bottom: 0px;
	left: 0px;
	height: 45px;
	margin: 0px 0% 0px 0%;
	padding: 10px 40px 10px 40px;
	border-top: 1px solid #596858;
	background-color: #005583;
	box-shadow: 0px 0px 100px rgba(0,62,95,0.85);
}
.site-footer {
	max-width: 1200px;
	margin: 0px auto 0;
	padding: 0% 0% 0% 0%;
	text-align: center;
}
}

@media only screen and (max-width: 620px) { /* Smartphone */
html {font-size: 100%;}
.desktop {display: none;}
.tablet {display: none;}
.smartphone {}
.tablet-smartphone {}
table {
	font-size: 90%;
}
body {
	margin: 0% 0% 0% 0%;
	padding: 0% 0% 0% 0%;
}
header {
	position: fixed;
	width: 100%;
	height: 50px;
	margin: 0px 0% 0px 0%;
	padding: 7px 40px 10px 40px;
	border-bottom: 1px solid #596858;
	background-color: #005583;
	box-shadow: 0px 0px 100px rgba(0,62,95,0.85);
}
.site-header {
	width: 100%;
	margin: 0px;
	padding: 0px;
}
.titel {
	display: none;
}
nav {
	width: 70%;
}
main {
	float: left;
	width: 100%;
	height: auto;
	margin: 0px 0% 0px 0%;
	padding: 100px 0% 50px 0%;
}
.content {
	float:left;
	height:auto;
	width: 100%;
	margin: 0% 0% 0% 0%;
	padding: 0% 0% 0% 0%;
}

footer {
	position: fixed;
	width: 100%;
	bottom: 0px;
	left: 0px;
	height: 45px;
	margin: 0px 0% 0px 0%;
	padding: 10px 40px 10px 40px;
	border-top: 1px solid #596858;
	background-color: #005583;
	box-shadow: 0px 0px 100px rgba(0,62,95,0.85);
}
.site-footer {
	max-width: 1200px;
	margin: 0px auto 0;
	padding: 0% 0% 0% 0%;
	text-align: center;
}
}



/* GRID */
/* Inhalt vertikdal mittig */
.gruppe {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
}
.vertikal-mittig {
  align-self: center; 
}

.abschnitt {clear: both; padding: 0px; margin: 0% 0% 0% 0%;}
form .abschnitt {margin: 0% 0% 0% 0%;}
.gruppe:before, .gruppe:after {content:""; display:table;}
.gruppe:after {clear:both;}
.spalte {display: block; float:left; margin: 0% 0% 0% 4%;}
.spalte:first-child {margin-left: 0;}

@media only screen and (min-width: 1050px) { /* Dektop */
.span2von2 {width: 100%;}
.span1von2 {width: 48%;}

.span3von3 {width: 100%;}
.span2von3 {width: 65.33333333333333%;}
.span1von3 {width: 30.66666666666667%;}

.span4von4 {width: 100%;}
.span3von4 {width: 74%;}
.span2von4 {width: 46%;}
.span1von4 {width: 22%;}

.span5von5 {width: 100%;}
.span4von5 {width: 79.2%;}
.span3von5 {width: 58.4%;}
.span2von5 {width: 37.6%;}
.span1von5 {width: 16.8%;}

.span1von6 {width: 13.33333333333333%;}

.span1von8 {width: 9%;}

}

@media only screen and (max-width: 1050px) and (min-width: 620px) { /* Tablet */
.span2von2 {width: 100%;}
.span1von2 {width: 48%;}

.span3von3 {width: 100%;}
.span2von3 {width: 65.33333333333333%;}
.span1von3 {width: 30.66666666666667%;}

.span4von4 {width: 100%;}
.span3von4 {width: 48%;}
.span2von4 {width: 48%;}
.span1von4 {width: 48%;}
.span1von4:nth-child(3) {margin-left: 0%;}

.span5von5 {width: 100%;}
.span4von5 {width: 79.2%;}
.span3von5 {width: 58.4%;}
.span2von5 {width: 37.6%;}
.span1von5 {width: 16.8%;}

.span1von6 {width: 30.66666666666667%;}
.span1von6:nth-child(4) {margin-left: 0%;}

.span1von8 {width: 22%;}
.span1von8:nth-child(5) {margin-left: 0%;}

}


@media only screen and (max-width: 620px) { /* Smartphone */
.span2von2, .span1von2,
.span3von3, .span2von3, .span1von3,
.span4von4, .span3von4, .span2von4, .span1von4,
.span5von5, .span4von5, .span3von5, .span2von5, .span1von5 {width: 100%; margin-left: 0%; margin-right: 0%;}
.span1von6 {width: 48%;}
.span1von6:nth-child(3), .span1von6:nth-child(5) {margin-left: 0%;}
.span1von8 {width: 30.66666666666667%;} 
.span1von8:nth-child(4), .span1von8:nth-child(7) {margin-left: 0%;}

}
/* ENDE GRID */