body {
    font-family: Century;
    background: #582E92;
	color: #fff;
    padding:20px;
}
  
.page {
    width:auto;
    height:auto;    
}
  
.line {
    width:auto;
    height:auto;
    display:table;     
}

.icon_person {
     border: 5px;
	 border-style: solid;
     border-color: #582E92;
     float: right;
	 
}

.icon_person:hover {
     border-color: #582EFF;
	 background: #582EFF;
}

/* Kacheln */ 
.tile {
    height:150px;  
    width:150px; 
    float:left;
    margin:5px 5px 0 0;
    /*padding:px;*/
}

/* Kacheln */ 
.tileWidth {
    width:305px;
}

.overview  {
	/* nothing here */
}

.skills {
	/* nothing here */
}
  
.logo{ 
    text-align: center;
    background:#eeeeee; 
	opacity: 0.5;
	filter: alpha(opacity=50);
	/* W3C */
	transition: opacity 1s linear;
	/* Firefox: */ 
	-moz-transition: opacity 1s linear;
	/* Opera: */
	-o-transition: opacity 1s linear;
	/* Safari and Chrome: */	
 	-webkit-transition: opacity 1s linear;
}
 
.logo:hover { 
    text-align: center;
    opacity: 1; 
	filter: alpha(opacity=100); 
	/* W3C */
	transition: opacity 1s linear;
	/* Firefox: */ 
	-moz-transition: opacity 1s linear;
	/* Opera: */
	-o-transition: opacity 1s linear;
	/* Safari and Chrome: */
	-webkit-transition: opacity 1s linear;
}
	
.foto{
    background:#0080ff;	
	position: relative;
	overflow: hidden;
}

 .foto div {
	position: absolute;
	transition: left 1s ease-in-out;
	/* Firefox: */
	-moz-transition: left 1s ease-in-out;
	/* Opera: */
	-o-transition: left 1s ease-in-out;
	/* IE: */
	-ms-transition: left 1s ease-in-out;
	/* Safari and Chrome: */
	-webkit-transition: left 1s ease-in-out;
	left: 0px;
}

.foto div.first {
	z-index: 2;
}		

.foto div.second {
	z-index: 1;
}		
		
.foto:hover div.first {
	/* W3C */
	transition: left 1s ease-in-out;
	/* Firefox: */
	-moz-transition: left 1s ease-in-out;
	/* Opera: */
	-o-transition: left 1s ease-in-out;
	/* IE: */
	-ms-transition: left 1s ease-in-out;
	/* Safari and Chrome: */
	-webkit-transition: left 1s ease-in-out;
	left: -150px;
}
	
.certifications{
    background:#004080;	
	position: relative;
	overflow: hidden;
}

 .certifications div {
	position: absolute;
	transition: left 1s ease-in-out;
	/* Firefox: */
	-moz-transition: left 1s ease-in-out;
	/* Opera: */
	-o-transition: left 1s ease-in-out;
	/* IE: */
	-ms-transition: left 1s ease-in-out;
	/* Safari and Chrome: */
	-webkit-transition: left 1s ease-in-out;
	left: 0px;
}

.certifications div.first {
	z-index: 2;
}		

.certifications div.second {
	z-index: 1;
}		
		
.certifications:hover div.first {
	/* W3C */
	transition: left 1s ease-in-out;
	/* Firefox: */
	-moz-transition: left 1s ease-in-out;
	/* Opera: */
	-o-transition: left 1s ease-in-out;
	/* IE: */
	-ms-transition: left 1s ease-in-out;
	/* Safari and Chrome: */
	-webkit-transition: left 1s ease-in-out;
	left: -150px;
}
  
.contact{
    background-color: #008000;
	position: relative;
	overflow: hidden;
}

.contact div {
	position: absolute;
	transition: top 1s ease-in-out;
	/* Firefox: */
	-moz-transition: top 1s ease-in-out;
	/* Opera: */
	-o-transition: top 1s ease-in-out;
	/* IE: */
	-ms-transition: top 1s ease-in-out;
	/* Safari and Chrome: */
	-webkit-transition: top 1s ease-in-out;
	top: 0px;
}

.contact div.first {
	z-index: 2;
}

.contact div.second {
	z-index: 1;
}		
		
.contact:hover div.first{
    /* W3C */
	transition: top 1s ease-in-out;
	/* Firefox: */
	-moz-transition: top 1s ease-in-out;
	/* Opera: */
	-o-transition: top 1s ease-in-out;
	/* IE: */
	-ms-transition: top 1s ease-in-out;	
	/* Safari and Chrome: */
	-webkit-transition: top 1s ease-in-out;
	top: -150px;
}

.contact2{
    background-color: #008000;
	position: relative;
	overflow: hidden;
}

.contact2 div {
	position: absolute;
	transition: left 1s ease-in-out;
	/* Firefox: */
	-moz-transition: left 1s ease-in-out;
	/* Opera: */
	-o-transition: left 1s ease-in-out;
	/* IE: */
	-ms-transition: left 1s ease-in-out;
	/* Safari and Chrome: */
	-webkit-transition: left 1s ease-in-out;
	left: 0px;
}

.contact2 div.first {
	z-index: 2;
}

.contact2 div.second {
	z-index: 1;
}		
		
.contact2:hover div.first{
    /* W3C */
	transition: left 1s ease-in-out;
	/* Firefox: */
	-moz-transition: left 1s ease-in-out;
	/* Opera: */
	-o-transition: left 1s ease-in-out;
	/* IE: */
	-ms-transition: left 1s ease-in-out;	
	/* Safari and Chrome: */
	-webkit-transition: left 1s ease-in-out;
	left: 150px;
}

.study{
    background-color: #008000;
	position: relative;
	overflow: hidden;
}

 .study div {
	position: absolute;
	transition: left 1s ease-in-out;
	/* Firefox: */
	-moz-transition: left 1s ease-in-out;
	/* Opera: */
	-o-transition: left 1s ease-in-out;
	/* IE: */
	-ms-transition: left 1s ease-in-out;
	/* Safari and Chrome: */
	-webkit-transition: left 1s ease-in-out;
	left: 0px;
}

.study div.first {
	z-index: 2;
}

.study div.second {
	z-index: 1;
}		
		
.study:hover div.first{
    /* W3C */
	transition: left 1s ease-in-out;
	/* Firefox: */
	-moz-transition: left 1s ease-in-out;
	/* Opera: */
	-o-transition: left 1s ease-in-out;
	/* IE: */
	-ms-transition: left 1s ease-in-out;	
	/* Safari and Chrome: */
	-webkit-transition: left 1s ease-in-out;
	left: 305px;
}

.experience{
    background-color: #983E9C;
	position: relative;
	overflow: hidden;
}

 .experience div {
	position: absolute;
	transition: top 1s ease-in-out;
	/* Firefox: */
	-moz-transition: top 1s ease-in-out;
	/* Opera: */
	-o-transition: top 1s ease-in-out;
	/* IE: */
	-ms-transition: top 1s ease-in-out;
	/* Safari and Chrome: */
	-webkit-transition: top 1s ease-in-out;
	top: 0px;
}

.experience div.first {
	z-index: 2;
}

.experience div.second {
	z-index: 1;
}		
		
.experience:hover div.first{
    /* W3C */
	transition: top 1s ease-in-out;
	/* Firefox: */
	-moz-transition: top 1s ease-in-out;
	/* Opera: */
	-o-transition: top 1s ease-in-out;
	/* IE: */
	-ms-transition: top 1s ease-in-out;	
	/* Safari and Chrome: */
	-webkit-transition: top 1s ease-in-out;
	top: -150px;
}