@charset "utf-8";
/* CSS Document */
body {font-family: 'Roboto', sans-serif; !important }
.padding {padding-left:1%; padding-right:1%;}
.marg { margin-left:1%; margin-right:1%;}
.margi {padding-left:10%; padding-right:10%;}
.padding_top {padding-top:2%;}
.padding_right {padding-right:1.75%;}
.padding_mitte {padding-left: 1%;}

.grey { background-color:#999;}
.grey_light { background-color:#CCC;}
.font_sm { font-size:small;}
.padding_left {padding-left: 1%;}
.x_reihe {margin-top: 5%;}
.text_white {color: white;}	

/*social icons bar */
.icon-bar {
  position: fixed;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
z-index: 1;
}

.icon-bar a {
  display: block;
  text-align: center;
  padding: 16px;
  transition: all 0.3s ease;
  color: white;
  font-size: 20px;
}

.icon-bar a:hover {
  background-color: #000;
}

.facebook {
  background: #3B5998;
  color: white;
}

.twitter {
  background: #55ACEE;
  color: white;
}

.google {
  background: #dd4b39;
  color: white;
}

.instagram {
  background: #F80D11;
  color: white;
}

.youtube {
  background: #bb0000;
  color: white;
}

.content {
  margin-left: 75px;
  font-size: 30px;
}
.bg_cust {background-color: dimgray;}
.marg_top {margin-top:2%; margin-bottom: 2%; }
	
#myBtn {
  display: none; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  bottom: 20px; /* Place the button at the bottom of the page */
  right: 30px; /* Place the button 30px from the right */
  z-index: 99; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  background-color: red; /* Set a background color */
  color: white; /* Text color */
  cursor: pointer; /* Add a mouse pointer on hover */
  padding: 15px; /* Some padding */
  border-radius: 10px; /* Rounded corners */
  font-size: 18px; /* Increase font size */
}

#myBtn:hover {
  background-color: #555; /* Add a dark-grey background on hover */
}
/* Always set the map height explicitly to define the size of the div
 * element that contains the map. */
#map {
  height: 100%;
}
iframe {border: none; scroll-behavior:inherit;}	
hr {color:#0066CC;}

.img_blue {
  position: absolute;
  left: 0px;
  top: 21%;
  z-index: -1;
width: 100%;
}
.r_seite {text-align: right; }

/*Dreieck style*/	
.drei { 
width: 0px;
height: 0px;
-webkit-transform:rotate(360deg);
border-style: solid;
border-width: 0 0 200px 200px;
border-color: transparent transparent #ed112e transparent;
position: fixed;
right: 0;
bottom: 0%;
/*-webkit-transform: translateY(-0%);*/
-ms-transform: translateY(-0%);
transform: translateY(-0%);
z-index: 1;
}  
.drei p {
  text-align: center;
  bottom:-130px;
  right: 10px;
  position: fixed;
  width: 90px;
  height: 5px;
  margin: 0px;
  color:#fff;
  z-index: 2;
}
.drei a {  
  text-decoration: none;
  color:#fff;
  }
.text_kopf {font-size: 0.5em;}
 
login { float:right; margin-right:15%; margin-top:5.5em;}
/*input, textarea, select, button { -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; border-color:#ccc; margin-top:0.4em; margin-right:0.4em;*/

.iframe_main {width:100%; margin-top:0.5em; margin-left:auto; margin-right:auto; overflow:hidden; height:180px;}
.pad_aut {	padding-left: 3%;
			text-align: center;
			vertical-align: middle;}
.r_seite {text-align: right; }
.text-allg {font-size: 0.8em;}	
/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
	.text {font-size: 11px}
	.text_kopf {font-size: 0.5em;}
}