* { font-family: Arial; }

body {
  background-image: url('/bilder/131ka.jpg');
  background-repeat: no-repeat;
  background-attachment: fixed; 
  background-size: cover;
}

h1 { 
  display: block;
  font-size: 2.8em;
  margin-top: 0.67em;
  margin-bottom: 0.67em;
  margin-left: 0;
  margin-right: 0;
  font-family: sans-serif;
  font-weight: bold;
  text-align: center;
  #text-shadow: 0 -1px 0 rgba(0, 158, 224, 0.8);
  #text-shadow: 0.1em 0.1em 0.2em black;
  #text-shadow: 0 0 0.2em #8F7;
  text-shadow: 0 0 0.2em black, 0 0 0.2em black;
  color: #f98012;
}

h2 { 
  display: block;
  font-size: 2em;
  margin-top: 0.67em;
  margin-bottom: 0.67em;
  margin-left: 0;
  margin-right: 0;
  font-family: sans-serif;
  font-weight: bold;
  text-align: center;
}

h3 { 
  display: block;
  font-size: 1.8em;
  margin-top: 0.67em;
  margin-bottom: 0.67em;
  margin-left: 0;
  margin-right: 0;
  font-family: sans-serif;
  font-weight: bold;
  text-align: center;
}

h4 { 
  #display: block;
  #font-size: 1.8em;
  #margin-top: 0.67em;
  #margin-bottom: 0.67em;
  #margin-left: 0;
  #margin-right: 0;
  #font-family: sans-serif;
  #font-weight: bold;
  text-align: center;
}

h21 { 
  display: block;
  font-size: 2em;
  margin-top: 0.67em;
  margin-bottom: 0.67em;
  margin-left: 0;
  margin-right: 0;
  font-family: sans-serif;
  font-weight: bold;
  text-align: left;
}


.button {
  font: bold 11px Arial;
  text-decoration: none;
  background-color: #EEEEEE;
  color: #333333;
  padding: 2px 6px 2px 6px;
  border-top: 1px solid #CCCCCC;
  border-right: 1px solid #333333;
  border-bottom: 1px solid #333333;
  border-left: 1px solid #CCCCCC;
}

.link-button {
    font-family: sans-serif;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border: solid 1px #20538D;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: inset 0 1px 0 rgba(177, 200, 0, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: inset 0 1px 0 rgba(177, 200, 0, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    box-shadow: inset 0 1px 0 rgba(177, 200, 0, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2);
    background: #0b72b5;
    color: #FFF;
    padding: 8px 12px;
    text-decoration: none;
}

.link-button a {
    margin-top:4px;
    display:inline-block;
    text-decoration:none;
    color:#333;
}

.link-button:hover {
    background-color:#f98012;
}

.link-button:active {
    background-color:#333;
}

.link-button:hover a, .link-button:active a {
    color:#fff;
}


.bsp {
	border: 2px dotted #009ee0;
	padding: 1em;
	margin-bottom: 1em;
	background-color: #b1c800;
	
	display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}



.bildbereich {
	overflow:hidden;
	width: 650px;
	height: 340px;

	width: 100%;
	height: auto;
}

#bsp_bild_vergroessern .bildbereich:hover .bild {
	-webkit-transform:scale(1.2);
	transform:scale(1.2);
}


#bsp_bild_vergroessern .bild,
#bsp_bild_vergroessern_details .bild
 {
	width: 100%;
	height: auto;

	-webkit-transition: all 0.9s ease;
	transition: all 0.9s ease;
}


#bsp_bild_vergroessern_details .bildbereich_text {
    #float: left;
	position:relative;
	overflow:hidden;
	width: 650px;
	height: 340px;
	margin-right: 5%;
	margin-left: 0%;

}

#bsp_bild_vergroessern_details .textbox:hover {
	opacity:0.8;
}


/* Bild mit eingeblendeten Text */

#bsp_bild_vergroessern .bild,
#bsp_bild_vergroessern_details .bild
 {
	width: 128px;
	height: auto;

	-webkit-transition: all 0.9s ease;
	transition: all 0.9s ease;
}


#bsp_bild_vergroessern_details .bildbereich_text {
	position:relative;
	overflow:hidden;
/*	width: 650px;
	height: 340px;*/

	width: 128px;
	height: auto;

}

#bsp_bild_vergroessern_details .textbox:hover {
	opacity:0.8;
}





#bsp_bild_vergroessern_details .text {
	padding-top: 20%;
}

#bsp_bild_vergroessern_details .textbox {
/*	width:650px;
	height:340px;*/

	width: 100%;
	height: 100%;

	position:absolute;
	top:0;
	left:0;
	opacity:0;
	#background-color: rgba(255,255,255,0.8);
	background-color: rgba(177,200,0,0.8);

	cursor: pointer;
	color: black;
	font-size: 1vw;
	line-height: 2vw;
	font-family: sans-serif;
	text-align: center;


	#-webkit-box-shadow: 0px 0px 15px 2px rgba(255,255,255,.8);
	#box-shadow: 0px 0px 15px 2px rgba(255,255,255,.8);
	-webkit-box-shadow: 0px 0px 15px 2px rgba(177,200,0,.8);
	box-shadow: 0px 0px 15px 2px rgba(177,200,0,.8);
	-webkit-transition: all 0.7s ease;
	transition: all 0.7s ease;
}

#bsp_bild_vergroessern_details .bildbereich_text:hover .bild {
	width: 100%;
	height: auto;

	-webkit-transform:scale(1.1);
	transform:scale(1.1);
}