body {
  padding-top: 0px;
  overflow:hidden;
}
.clear {
  clear: both;
}

#bildcontainer {
  position: absolute;
  margin-left: auto;
  margin-top: 30px;
  width: 488px;
  height: 520px;
  z-index: 1;
}

#f1_container {
  position: absolute;
  margin-left:120px;
  margin-top: 20px;
  width: 488px;
  height: 520px;
  z-index: 100;
}

#f2_container {
  /* position: relative; */
  position: absolute;
  margin-left:244px;
  margin-top: -520px;
  width: 488px;
  height: 520px;
  z-index: -1;
}

#f1_container {
  -webkit-perspective: 1000px;
  -moz-perspective: 1000px;
  -o-perspective: 1000px;
  perspective: 1000px;
  z-index: 100;
}

#f2_container {
  -webkit-perspective: 1000px;
  -moz-perspective: 1000px;
  -o-perspective: 1000px;
  perspective: 1000px;
}

#f1_card {
  width: 100%;
  height: 100%;
  -webkit-transform-style: preserve-3d;
  -webkit-transition: all 1.0s linear;
  -moz-transform-style: preserve-3d;
  -moz-transition: all 1.0s linear;
  -o-transform-style: preserve-3d;
  -o-transition: all 1.0s linear;
  transform-style: preserve-3d;
  transition: all 1.0s linear;
}

#f2_card {
  width: 100%;
  height: 100%;
  -webkit-transform-style: preserve-3d;
  -webkit-transition: all 1.0s linear;
  -moz-transform-style: preserve-3d;
  -moz-transition: all 1.0s linear;
  -o-transform-style: preserve-3d;
  -o-transition: all 1.0s linear;
  transform-style: preserve-3d;
  transition: all 1.0s linear;
}

#f1_container:hover #f1_card, #f1_container.hover_effect #f1_card {
  -webkit-transform: rotateY(-180deg);
  -moz-transform: rotateY(-180deg);
  -o-transform: rotateY(-180deg);
  transform: rotateY(-180deg);
}

#f2_container:hover #f2_card, #f2_container.hover_effect #f2_card {
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
  transform: rotateY(180deg);
}

.face1 {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  backface-visibility: hidden;
}

.face2 {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  backface-visibility: hidden;
}

.face1.back {
  display: block;
  -webkit-transform: rotateY(180deg);
  -webkit-box-sizing: border-box;
  -moz-transform: rotateY(180deg);
  -moz-box-sizing: border-box;
  -o-transform: rotateY(180deg);
  -o-box-sizing: border-box;
  transform: rotateY(180deg);
  box-sizing: border-box;
  padding: 0px;
  color: white;
  text-align: center;
  1background-color: #aaa;
}

.face2.back {
  display: block;
  -webkit-transform: rotateY(180deg);
  -webkit-box-sizing: border-box;
  -moz-transform: rotateY(180deg);
  -moz-box-sizing: border-box;
  -o-transform: rotateY(180deg);
  -o-box-sizing: border-box;
  transform: rotateY(180deg);
  box-sizing: border-box;
  padding: 0px;
  color: white;
  text-align: center;
  1background-color: #aaa;
}

#mitte{
  	position: absolute;
	top:0px;
	left:1px;
	width:730px;
	height:520px;
	z-index:-1;
}

.center {
  text-align: center;
}

.alignRight {
  text-align: right;
}

.hover {
  cursor: pointer;
}

.hover, img {
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}

.container{
	margin-right:auto;
	margin-left:auto;
	overflow:hidden;	
}
	
.container:before,.container:after{
	display:table;
	content:"";
	line-height:0;
}

.container:after{
	clear:both;
}

.container-fluid{
	padding-right:20px;
	padding-left:20px;
}

.container-fluid:before,.container-fluid:after{
	display:table;
	content:"";
	line-height:0;
}

.container-fluid:after{
	clear:both;
}

.transition {
  -webkit-transition: all 1s ease-in-out;
  -moz-transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
}

.1shadow {
  -webkit-box-shadow: 5px 5px 5px #aaa;
  -moz-box-shadow: 5px 5px 5px #aaa;
  box-shadow: 5px 5px 5px #aaa;
  margin-bottom: 10px;
}

.selected {
  font-weight: bold;
}

.browser_support {
  text-align: center;
}

.browser_support p {
  font-weight: bold;
  font-size: 1.3em;
}

.gbanner {
  width: 728px;
  margin: 0 auto;
}

.affixed {
  width: 140px;
}

.affix {
  top: 60px;
}

section section {
  margin-top: 5px;
}

footer {
  margin-top: 20px;
  padding-top: 10px;
}
.front_page td {
  text-align: left;
}
.front_page td:last-of-type {
  text-align: center;
}
.front_page .icon-remove {
  color: red;
}
.front_page .icon-ok {
  color: green;
}
.front_page .fb_edge_widget_with_comment {
  position: relative;
  top: -7px !important;
}
#footerLinks h2 {
  margin: 0;
  padding: 0;
  font-size: 16px;
  line-height: 1.4;
}
#footerLinks ul {
  list-style-type: none;
  margin-left: 0;
}
#footerBottom {
  text-align: center;
}
.pager {
  padding-top: 20px;
  border-top: 1px #ccc solid;
}
.pager li {
  margin: 10px;
}
.com {
  color: #93a1a1;
}
.lit {
  color: #195f91;
}
.pun,
.opn,
.clo {
  color: #93a1a1;
}
.fun {
  color: #dc322f;
}
.str,
.atv {
  color: #D14;
}
.kwd,
.linenums .tag {
  color: #1e347b;
}
.typ,
.atn,
.dec,
.var {
  color: teal;
}
.pln {
  color: #48484c;
}
.prettyprint {
  padding: 8px;
  background-color: #f7f7f9;
  border: 1px solid #e1e1e8;
}
.prettyprint.linenums {
  -webkit-box-shadow: inset 40px 0 0 #fbfbfc, inset 41px 0 0 #ececf0;
  -moz-box-shadow: inset 40px 0 0 #fbfbfc, inset 41px 0 0 #ececf0;
  box-shadow: inset 40px 0 0 #fbfbfc, inset 41px 0 0 #ececf0;
}
/* Specify class=linenums on a pre to get line numbering */
ol.linenums {
  margin: 0 0 0 33px;
  /* IE indents via margin-left */

}
ol.linenums li {
  padding-left: 12px;
  color: #bebec5;
  line-height: 18px;
  text-shadow: 0 1px 0 #fff;
}

#teil1 {
    position: fixed;
    width: 80px; 
    height: 47px;
    top:80%; 
    right: 100px;
	background-image:url('../img/arrows-hand-clear-pointer-right.png');
	z-index:100;
}
	
#teil1:hover {
	-webkit-box-shadow: 0px 0px 15px 10px rgba(255, 255, 255, .75);
	box-shadow: 0px 0px 15px 10px rgba(255, 255, 255, .75);
}
	
#teil1 {
	-webkit-box-shadow: 0px 0px 15px 5px rgba(0, 185, 233, .75);
	box-shadow: 0px 0px 15px 5px rgba(0, 185, 233, .75);
	-webkit-transition: all 0.7s ease;
	transition: all 0.7s ease;
	border-radius:60%;
}

#flip2 {
    position: fixed;
    width: 80px; 
    height: 47px;
    top:60%; 
    right: 100px;
	/* position:absolute;
	top:510px;
	right:140px; */
	width:92px;
	height:92px;
	background-image:url('../img/ma21-about-icon.png');
    padding: 0px;
    z-index:10;
}

#panel2 {
	position:fixed;
	top:80px;
	right:70px;
	width:280px;
	height:290px;
	margin-top:0px;
    background-image:url('../img/notizzettel01.png');
    z-index:100;
    display: none;
}

#info2 {
    position: fixed;
    width: 480px; 
    height: 45px;
    bottom:7%; 
    left: 250px;
	background-image:url('../img/erstellt01.png');
    padding: 0px;
    z-index:10;
}


footer {
  position: fixed;
  left:0;
  bottom:0;
  width: 100%;
  height: 24px;
  background: rgba(0,0,0,0.8);
  z-index: 1000;
  
  -o-box-shadow: 0px 5px 10px rgba(0,0,0,0.8);
  -moz-box-shadow: 0px 5px 10px rgba(0,0,0,0.8);
  -webkit-box-shadow: 0px 5px 10px rgba(0,0,0,0.8);
  box-shadow: 0px 5px 10px rgba(0,0,0,0.8);
}

footer p {
  margin: 0px 0 0 20px;
  font-family:"Lucida Sans", "Lucida Sans Regular", "Lucida Grande", "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
  font-size:16px;
  line-height:18px;
}

footer img {
	position:absolute;
  	left: 20px;
  	bottom:10px;
}

footer a{
	color:white;
	text-decoration:none;
}