@charset "UTF-8";
/* ***************************************************************************************** */
/* (c) designschmiede - www.wirschmiedendesign.de  
/* based on framework BOOTSTRAP V4 
/* ***************************************************************************************** */			

/* font-size 
------------------------------------------------------------------------------------- */
@media screen and (min-width: 1440px) {
html {font-size: 110%;}}

@media screen and (min-width: 1728px) {
html {font-size: 121%;}}

@media screen and (max-width: 991px) {
html {font-size: 84%;}}

@media screen and (max-width: 568px) {
html {font-size: 79%;}}

/* font-size for each class
------------------------------------------------------------------------------------- */
h6 {font-size: 1rem;margin: 0.5rem 0 0.5rem 0;line-height:1.4rem;}	
p {font-size: 0.80rem;margin: 0.4rem 0 0.4rem 0;line-height:1.15rem;}	

@media screen and (max-width: 991px) {
  h6 {font-size: 16px;line-height:22px;}	
  p {font-size: 13px;line-height:19px;}	
}

/* additional font-sizes
---------------------------------------------------------------------------- */
.fontsize {
  line-height: 120%;}

.f100rem {	
  font-size: 10rem;}

.f75rem {	
  font-size: 7.5rem;}

.f70rem {	
  font-size: 7rem;}

.f65rem {	
  font-size: 6.5rem;}

.f60rem {	
  font-size: 6rem;}

.f55rem {	
  font-size: 5.5rem;}

.f50rem {	
  font-size: 5rem;}

.f45rem {	
  font-size: 4.5rem;}

.f40rem {	
  font-size: 4rem;}

.f35rem {	
  font-size: 3.5rem;}

.f30rem {	
  font-size: 3rem;}

.f25rem {	
  font-size: 2.5rem;}

.f20rem {	
  font-size: 2rem;}

.f15rem {	
  font-size: 1.5rem;}


/* additional margins and paddings
---------------------------------------------------------------------------- */
.my-5 {
	margin-top: 5rem;
  margin-bottom: 5rem;}

.my-6 {
	margin-top: 6rem;
  margin-bottom: 6rem;}

.my-7 {
	margin-top: 7rem;
  margin-bottom: 7rem;}

.py-5 {
	padding-top: 5rem;
  padding-bottom: 5rem;}

.py-6 {
	padding-top: 6rem;
  padding-bottom: 6rem;}

.py-7 {
	padding-top: 7rem;
  padding-bottom: 7rem;}

/* helper classes - center content 
------------------------------------------------------------------------------------- */
.center_topbottom { 	
	top: 50%;
	-webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);  
	        transform: translateY(-50%);}

.center_leftright { 	
	left: 50%;
	-webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);  
	        transform: translateX(-50%);}

.center_middle { 	
  top: 50%; 
	left: 50%;
	-webkit-transform: translate(-50%,-50%);
      -ms-transform: translate(-50%,-50%);  
	        transform: translate(-50%,-50%);}

/* modals - prevent moving content to the right if open modal > Problem in bootstrap 
------------------------------------------------------------------------------------- */
body.modal-open {
	overflow: inherit; 
	padding-right: inherit!important;}

.modal-open, .modal {
	padding-right: 0!important;} 

/* ajax - show error-message 
------------------------------------------------------------------------------------- */
#ajaxError {
	display: none;
	position: fixed;
	width: 100%;
	top: 0;
	left: 0;
	z-index: 999 !important;	
	line-height: 30px;
	background-color: red;
	color: white;
  font-weight: 300;
  font-size: 1rem;}

.ajaxError #ajaxError {
	display: block;}

/* helper classes - forms-inputs (contactforms)
------------------------------------------------------------------------------------- */
.has-error input {
	border: 1px solid rgba(216,16,20,1.00);}

/* helper classes - viewportchecker / animation
------------------------------------------------------------------------------------- */
.invisible {
	opacity: 0;}

.visible {
	opacity: 1;}

/* helper classes  
---------------------------------------------------------------------------- */
.image {
	opacity: 0;
	-webkit-transition: opacity 0.2s;
        	transition: opacity 0.2s;}
	
.image.loaded,
.no-js .image  {
	opacity: 1;}

[class*="container-fluid"] {
  overflow: hidden; /* needed for animate-effects (left/right) */}

img {
  display: block;
	width: 100%;
	max-width: 100%;
	height: auto;}

.text-limitation {
	width: 100%;
	outline: none;
	text-decoration: none;
	white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;}

.bg-overlay {
	position: absolute;
	z-index: 100;	
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	visibility: visible;	
	opacity: 1;
	-webkit-transition: visibility 0s linear 0.6s, opacity 0.6s 0s linear;
	        transition: visibility 0s linear 0.6s, opacity 0.6s 0s linear;}

.bg-overlay.goaway {
	visibility: hidden;
	opacity: 0;
	-webkit-transition-timing-function: linear;
					transition-timing-function: linear;}

.dye-overlay_10,
.dye-overlay_20,
.dye-overlay_30,
.dye-overlay_40 {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;}

.dye-overlay_10 {
	background-color: rgba(0,0,0,0.1);}

.dye-overlay_20 {
	background-color: rgba(0,0,0,0.2);}

.dye-overlay_30 {
	background-color: rgba(0,0,0,0.3);}

.dye-overlay_40 {
	background-color: rgba(0,0,0,0.4);}

/* helper classes - Spaltensatz 2/3
------------------------------------------------------------------------------------- */
.spaltensatz-3 {
	-webkit-column-count: 3; 
	   -moz-column-count: 3; 
					column-count: 3;
	-webkit-column-gap: 40px; 
	   -moz-column-gap: 40px; 
					column-gap: 40px;
	-webkit-column-rule: 1px solid rgba(169,169,169,1);
	   -moz-column-rule: 1px solid rgba(169,169,169,1);
					column-rule: 1px solid rgba(169,169,169,1);}

.spaltensatz-2 {
	-webkit-column-count: 2; 
	   -moz-column-count: 2; 
					column-count: 2;
	-webkit-column-gap: 40px; 
	   -moz-column-gap: 40px; 
					column-gap: 40px;
	-webkit-column-rule: 1px solid rgba(169,169,169,1);
	   -moz-column-rule: 1px solid rgba(169,169,169,1);
					column-rule: 1px solid rgba(169,169,169,1);}

@media screen and (max-width: 996px) {
.spaltensatz-3,
.spaltensatz-2 {
	-webkit-column-count: auto;
		 -moz-column-count: auto;
					column-count: auto;
	-webkit-column-gap: normal;
	   -moz-column-gap: normal; 
					column-gap: normal;
	-webkit-column-rule: none;
	   -moz-column-rule: none;
					column-rule: none;}}

/* alert for no-js (disabled JavaScript)
------------------------------------------------------------------------------------- */
.js-alert {
	display: none;}

.no-js .js-alert-bodyoverlay {
	position: absolute;
	background-color: rgba(237,237,237,1.00);	
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 998 !important;}

.no-js .js-alert {
  position: fixed;
	display: block;
	width: 100%;
	bottom: 0;
	left: 0;
	font-size: 15px;
	font-weight: 300;	
	color: rgba(225,225,225,1);	
	z-index: 999 !important;	
	box-shadow: 0px -2px 4px 0px rgba(0,0,0,0.75);
  background-color: rgba(8,70,86,1);	
	-webkit-animation: js-alert 1.2s 0.3s ease-out;
	        animation: js-alert 1.2s 0.3s ease-out;
	-webkit-animation-fill-mode: both;
	        animation-fill-mode: both;}	

.no-js .js-alert div {
		max-width: 768px;
	  margin: 0 auto;}

.no-js .js-alert .logo {
		width: 20rem;
	  margin: 0 auto;}

.no-js .js-alert a {
	  font-weight: 300;
		color: rgba(225,225,225,1);}

@-webkit-keyframes js-alert {
    from  { transform: translate3D(0,100%,0);} 
    to    { transform: translate3D(0,0,0);}}

@keyframes js-alert {
    from  { transform: translate3D(0,100%,0);} 
    to    { transform: translate3D(0,0,0);}}

/* no outline, no text-decoration for all buttons on site
------------------------------------------------------------------------------------- */
body .btn.active.focus, 
body .btn.active:focus, 
body .btn.focus, 
body .btn:active.focus, 
body .btn:active:focus, 
body .btn:focus,
body .btn:link,
body .btn:visited,
body .btn:active {
	outline: none;
	text-decoration: none;}

/* a weblinks
-------------------------------------------------------------------------------------- */ 	
body a:link,
body a:visited,
body a:active,
body a:hover {
	outline: none;
	text-decoration: none;}

/*
a[href^="tel:"] {
  text-decoration: none;
}

a[href^="tel:"]:before {
  content: "\260e";
  margin-right: 5px;
}
*/

.phonelink-white:link,
.phonelink-white:visited,
.phonelink-white:active {
	outline: none;
	text-decoration: none;
  color: rgba(235,235,235,1.00);}

.phonelink-dark:link,
.phonelink-dark:visited,
.phonelink-dark:active {
	outline: none;
	text-decoration: none;
  color: rgba(16,44,14,1.00);}

.phonelink-white:hover,
.phonelink-dark:hover {
	text-decoration: none;}


.weblink-white:link,
.weblink-white:visited,
.weblink-white:active {
	outline: none;
	text-decoration: none;
  color: rgba(235,235,235,1.00);}

.weblink-dark:link,
.weblink-dark:visited,
.weblink-dark:active {
	opacity: 1;
	outline: none;
	text-decoration: none;
  color: rgba(16,44,14,1.00);}

.weblink-dark-u:link,
.weblink-dark-u:visited,
.weblink-dark-u:active {
	opacity: 1;
	outline: none;
	text-decoration: underline;
  color: rgba(16,44,14,1.00);}

.weblink-white:hover,
.weblink-dark:hover {
	opacity: 0.85;
	text-decoration: underline;}

.weblink-dark-u:hover {
	opacity: 0.85;
	text-decoration: underline;}

/* input fields
-------------------------------------------------------------------------------------- */ 
@media screen and (min-width: 560px) {
input[type=checkbox] { 
  transform: scale(1.5) !important;}}	

textarea,
input[type=text],
input[type=password],
input[type=email],
input[type=number] {
  font-size: 1rem;}