﻿body {
	margin: 0;
	padding: 0;
	font-size: 94%;
	color: #000000;
	/*background-color: #706f63;*/
	background-image:url('../images/hbg.jpg');
	/*background-image:url('../images/beige_paper.png');*/
	/*background-image -- head*/
	background-repeat: repeat;
	background-position: left top;
	overflow-x: hidden;
}
        
.header {
    background-image:url('../images/logo-akhm02.png');
    background-repeat:no-repeat;
}

.content .innerWrap {
	margin:0px auto;
	padding: 0;
	width: 975px;
}

.centered {
  position: fixed;
  top: 50%;
  left: 50%;
  /* bring your own prefixes */
  transform: translate(-50%, -50%);
}

.td-background {
	background: rgba(255, 255, 217, 0.9);
	padding:10px;
}

/* Anfang Slideshow horizontal ---------------------------- */

.illustration { 
	float:left; 
	/* padding:10px;   */
	left:0px;
	margin:0px 0px 0px 00px; 
	width:350px;
	border:1px dotted #aaa;
	font-weight:bold;
}

.illustration-left { 
	float:left; 
	padding:10px; 
	margin:10px 20px 10px 0px; 
	width:350px;
	border:1px solid #aaa;
	font-weight:bold;
}

.horizontal-banner { 

	width:970px;
	height:150px;
	background:url('../images/berlin-horizontal.png') repeat-x;
	-moz-animation: movx 120s linear infinite; /* Firefox */
	-webkit-animation: movx 120s linear infinite; /* Safari and Chrome */
	-o-animation: movx 120s linear infinite; /* Opera */
	-ms-animation: movx 120s linear infinite; /* IE 10 */
	animation: movx 120s linear infinite;
	/* margin:0 auto; */
    -moz-animation-delay: 12s; /* Firefox */
    -webkit-animation-delay: 12s; /* Chrome, Safari, Opera */
    animation-delay: 12s;	
}

.horizontal-banner2 { 

	width:980px;
	height:80px;
	background:url('../images/berlin-horizontal3.png') repeat-x;
	-moz-animation: movx 120s linear infinite; /* Firefox */
	-webkit-animation: movx 120s linear infinite; /* Safari and Chrome */
	-o-animation: movx 120s linear infinite; /* Opera */
	-ms-animation: movx 120s linear infinite; /* IE 10 */
	animation: movx 120s linear infinite;
	/* margin:0 auto; */
    -moz-animation-delay: 12s; /* Firefox */
    -webkit-animation-delay: 12s; /* Chrome, Safari, Opera */
    animation-delay: 12s;	
}


@-moz-keyframes movy /* Firefox */
{
0% { background-position: 0px 0px; }
100% {background-position: 0px 600px;}
}
 
@-webkit-keyframes movy /* Safari and Chrome */
{
0% { background-position: 0px 0px; }
100% {background-position: 0px 600px;}
}
 
@-o-keyframes movy /* Opera */
{
0% { background-position: 0px 0px; }
100% {background-position: 0px 600px;}
} 
 
@-ms-keyframes movy /* IE 10 */
{
0% { background-position: 0px 0px; }
100% {background-position: 0px 600px;}
} 
 
@keyframes movy
{
 
0% { background-position: 0px 0px; }
100% {background-position: 0px 600px;}
}
 
@-moz-keyframes movx /* Firefox */
{
0% { background-position: 0px 0px; }
100% {background-position: 800px 0px;}
}
 
@-webkit-keyframes movx /* Safari and Chrome */
{
0% { background-position: 0px 0px; }
100% {background-position: 800px 0px;}
}
 
@-o-keyframes movx /* Opera */
{
0% { background-position: 0px 0px; }
100% {background-position: 800px 0px;}
} 
 
@-ms-keyframes movx /* IE 10 */
{
0% { background-position: 0px 0px; }
100% {background-position: 800px 0px;}
} 
 
@keyframes movx
{
0% { background-position: 0px 0px; }
100% {background-position: 800px 0px;}
}
 

/* Anfang Menu ---------------------------- */
    
.animatedtabs{
margin-top:122px;
margin-left:-8px;
border-bottom: 1px solid gray;
overflow: hidden;
width: 100%;
font-size: 14px; /*font of menu text*/
}


.animatedtabs ul{
list-style-type: none;
margin: 0;
margin-left: 10px; /*offset of first tab relative to page left edge*/
padding: 0;
}

.animatedtabs li{
float: left;
margin: 6px 8px 6px 8px;
padding: 0px 0px 0px 26px;
}

.animatedtabs a{
float: left;
position: relative;
top: 5px; /* 1) Number of pixels to protrude up for selected tab. Should equal (3) MINUS (2) below */
background: url(../images/tab-blue-left.gif) no-repeat left top;
margin: 0;
margin-right: 3px; /*Spacing between each tab*/
padding: 0 0 0 9px;
text-decoration: none;

}

.animatedtabs a span{
float: left;
position: relative;
display: block;
background: url(../images/tab-blue-right.gif) no-repeat right top;
padding: 5px 14px 3px 5px; /* 2) Padding within each tab. The 3rd value, or 3px, should equal (1) MINUS (3) */
font-weight: bold;
color: black;
}

/* Commented Backslash Hack hides rule from IE5-Mac \*/
.animatedtabs a span {float:none;}
/* End IE5-Mac hack */


.animatedtabs .selected a{
background-position: 0 -125px;
top: 0;
}

.animatedtabs .selected a span{
background-position: 100% -125px;
color: black;
padding-bottom: 8px; /* 3) Bottom padding of selected tab. Should equal (1) PLUS (2) above */
top: 0;
}

.animatedtabs a:hover{
background-position: 0% -125px;
top: 0;
}

.animatedtabs a:hover span{
background-position: 100% -125px;
padding-bottom: 0px; /* 3) Bottom padding of selected tab. Should equal (1) PLUS (2) above */
top: 0;
}

/* Ende Menu ---------------------------- */

.link {
	/* margin:0 0 3px 0; */	 
	padding: 0;
	list-style-type:none;
}

.link ul {
	margin: 0;
	padding: 0;
	list-style-type: none !important;
	/* list-style-type:disc; */
}

.link ul li {
	margin: 0;
	padding: 0;
	clear: both;
}

.link ul li span{
	float: left;
}

.link ul li span.order{
	display: block;
	padding-top: 15px;
	float: none;
}

.link ul li span + a{
	padding-left: 5px;
	float: left;
}

.link ul li span.order + a{
	padding-left: 24px;
	float: none;
}

.link ul li a {
	float:right;
	margin: 0;
	padding: 0;
	font-size: 0.93em;
	line-height: 1.53;
	color:blue;
	/* color: #000000; */
	text-decoration: none;
	position: relative;
}

.link ul li a:hover {
	text-decoration: underline;
	color: #0059bc;
}

.link ul li a:after {
	content: '>';
	padding-left: 4px;
	font-family: "Lucida Sans", "Lucida Sans Regular", "Lucida Grande", "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
	color: #0059bc;
	display: inline-block;
}

.link ul li.download a:before {
	/*content image -- head*/
	padding-right: 6px;
	position: relative;
	bottom: -4px;
}

.link ul li.download a:hover:before {
	/*content image -- head*/
}

.link ul li.mail a:before {
	/*content image -- head*/
	padding-right: 6px;
	position: relative;
	bottom: -3px;
}

.link ul li.mail a:hover:before {
	/*content image -- head*/
}

.link ul li.gm a:before {
	/*content image -- head*/
	padding-right: 6px;
	position: relative;
	display: block;
	float: left;
}

.link ul li.gm a:hover:before {
}

/* 
.link ul li.phone a:before {
	padding-right: 6px;
	display: block;
	float: left;
}

.link ul li.phone a:hover:before {
}

.link ul li.email a:before {
	padding-right: 6px;
	position: relative;
	bottom: -3px;
}

.link ul li.email a:hover:before {
}

.link ul li.calltoaction{
		background-color: #0059bc;
		color:white;
	padding: 6px 20px 7px 19px;
	text-align: center;
	width:auto;
	float:right;
	margin-top:10px;
}
.link ul li.calltoaction a:after{
	color:white;
}

.link ul li.calltoaction:hover{
	background-color: #5DA200;
}
.link ul li.calltoaction a {

	text-decoration:none;
	color:white;
	width:auto;display:inline;
}
.link ul li.calltoaction a:before {
    display: none;
} 

.linkTextImage .link ul li.calltoaction a{
background-image:none;
} 
.linkTextImage .link ul li.calltoaction a:after {
   
    display: inline-block !important;
}
.linkTextImage .link ul li.calltoaction a{
   
   padding-right:0;;
}*/

/*## teaser besonderheiten ##*/
.teaser .link ul li a:before{
	display: none;
}

/*#### specialfÃ¤lle ####*/
.marker .link ul li a:after{
	display: none;
}

.archiv .items .item .wrap a:after {
	content: '>';
	padding-left: 4px;
	font-family: "Lucida Sans", "Lucida Sans Regular", "Lucida Grande", "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
	color: #0059bc;
	display: inline-block;
}

.linkTextImage .link ul li {
	clear: none;
}

.linkTextImage .link ul li a:after {
	display: none;
}

.imageZoom {
 	transition: transform 1.0s;
    transition-delay: 0.5s; 	
 	z-index:10;
 
    border:inset 2px #000000;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;

    /* -moz-box-shadow: 4px 4px 4px  #474747;
    -webkit-box-shadow: 4px 4px 4px  #474747;
    box-shadow: 4px 4px 4px  #474747; */
}

.imageZoom:hover {
    -moz-box-shadow: 10px 10px 24px #000000;
    -webkit-box-shadow: 10px 10px 24px #000000;
    box-shadow: 10px 10px 24px #000000;
 	transform: scale(2.8, 2.8);
} 	
 
.matahari {
    /* width: 100px;
    height: 100px;
    background: red; */
    -webkit-transition:  transform 1.0s;  /* For Safari 3.1 to 6.0 */
    transition:  transform 1.0s;

    border:inset 2px #000000;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
}

.matahari:hover {
    -moz-box-shadow: 10px 10px 24px #000000;
    -webkit-box-shadow: 10px 10px 24px #000000;
    box-shadow: 10px 10px 24px #000000;
    margin-top:100px;
 	transform: scale(2.8, 2.8);
 	z-index:100;
}	

.imgBox { 
	width: 239px; 
	height: auto; 
	background: url(http://www.corelangs.com/css/box/img/water.jpg) no-repeat; 
} 

.imgBox:hover {
	-moz-box-shadow: 0 0 10px #ccc; 
	-webkit-box-shadow: 0 0 10px #ccc; 
	box-shadow: 0 0 10px #ccc;
}



.demo-1 {
    position:relative;
    width:210px; 
   	height:157px;
    overflow:hidden;
    float:left;
    margin-right:20px;
    background-color:rgba(26,76,110,0.5)
}
.demo-1 p,.demo-1 h2 {
    color:#fff;
    padding:10px;
    left:-20px;
    top:20px;
    position:relative
}
.demo-1 p {
    font-family:'Lato';
    font-size:12px;
    line-height:18px;
    margin:0
}
.demo-1 h2 {
    font-family:'Lato';
    font-size:20px;
    line-height:24px;
    margin:0;
}

.demo-1 li{
	list-style:none;
}

.effect1 img {
    position:absolute;
    margin:-15px 0;
    right:0;
    top:0;
    cursor:pointer;
    -webkit-transition:top .4s ease-in-out,right .4s ease-in-out;
    -moz-transition:top .4s ease-in-out,right .4s ease-in-out;
    -o-transition:top .4s ease-in-out,right .4s ease-in-out;
    transition:top .4s ease-in-out,right .4s ease-in-out
}
.effect1 img.top:hover {
    top:-200px;
    right:-180px;
    padding-bottom:200px;
    padding-left:300px
}

.demo-2 {
    position:relative;
    width:200px;
    height:111px;
    overflow:hidden;
    float:left;
    margin-right:0px;
    background-color:rgba(26,76,110,0.5)
}

.demo-2 p,.demo-2 h2 {
    color:#fff;
    padding:0px;
    left:-20px;
    top:20px;
    position:relative
}

.demo-2 p {
    font-family:'Lato';
    font-size:12px;
    line-height:18px;
    margin:0
}

.demo-2 h2 {
    font-size:16px;
    line-height:20px;
    margin:0;
    font-family:'Lato'
}

.demo-2 li{
	list-style:none;
}

.effect2 img {
    position:absolute;
    left:0;
    bottom:0;
    cursor:pointer;
    margin:0px 0;
    -webkit-transition:bottom .13s ease-in-out;
    -moz-transition:bottom .13s ease-in-out;
    -o-transition:bottom .13s ease-in-out;
    transition:bottom .13s ease-in-out
}

.effect2 img.top:hover {
    bottom:-96px;
    padding-top:100px
}

h2.zero,p.zero {
    margin:0;
    padding:0
}

.demo-3 {
    position:relative;
    width:194px;
    height:132px;
    overflow:hidden;
    float:left;
    margin-right:20px
}

.demo-3 figure {
    margin:0;
    padding:0;
    position:relative;
    cursor:pointer;
    margin-left:-50px
}
.demo-3 figure img {
    display:block;
    position:relative;
    z-index:10;
    margin:-15px 0
}
.demo-3 figure figcaption {
    display:block;
    position:absolute;
    z-index:5;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box
}
.demo-3 figure h2 {
    font-family:'Lato';
    color:#fff;
    font-size:20px;
    text-align:left
}
.demo-3 figure p {
    display:block;
    font-family:'Lato';
    font-size:12px;
    line-height:18px;
    margin:0;
    color:#fff;
    text-align:left
}
.demo-3 figure figcaption {
    top:0;
    left:0;
    width:100%;
    height:100%;
    padding:29px 44px;
    background-color:rgba(26,76,110,0.5);
    text-align:center;
    backface-visibility:hidden;
    -webkit-transform:rotateY(-180deg);
    -moz-transform:rotateY(-180deg);
    transform:rotateY(-180deg);
    -webkit-transition:all .5s;
    -moz-transition:all .5s;
    transition:all .5s
}
.demo-3 figure img {
    backface-visibility:hidden;
    -webkit-transition:all .5s;
    -moz-transition:all .5s;
    transition:all .5s
}
.demo-3 figure:hover img,figure.hover img {
    -webkit-transform:rotateY(180deg);
    -moz-transform:rotateY(180deg);
    transform:rotateY(180deg)
}
.demo-3 figure:hover figcaption,figure.hover figcaption {
    -webkit-transform:rotateY(0);
    -moz-transform:rotateY(0);
    transform:rotateY(0)
}

#f1_container {
  position: relative;
  margin: 6px auto;
  width: 239px;
  height: 138px;
  z-index: 1;
}
#f1_container {
  perspective: 1000;
}

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

#f1_container:hover #f1_card {
  transform: rotateX(180deg);
  box-shadow: -5px 5px 5px #aaa;
}

#f2_container {
  position: relative;
  margin: 6px auto;
  width: 239px;
  height: 138px;
  z-index: 1;
}

#f2_container {
  perspective: 1000;
}

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

#f2_container:hover #f2_card {
  transform: rotateY(180deg);
  box-shadow: -5px 5px 5px #aaa;
}

.face {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
}

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