body {background-color:rgb(228, 228, 228);
	}
h1 {color:darkblue;
	font-size:3em;
	text-align:center;
	}
h2 {color:darkblue;
	font-size:1.5em;
	text-align:center;
	}
h3 {color:darkblue;
	font-size:1em;
	text-align:right;
	}
#logo {
float: left;
}
#btitle {
	font-size:1.5em;
	font-weight:bold;
	text-align:left;
	color:black;
	}
#btext {
	font-size:1em;
	font-weight:normal;
	text-align:left;
	color:black;
	}
#menu {
	float: float;
	position: fixed;
	display: block;
	font-size: 1.5em;
	width: 15%;
    display: block;
    text-align: center;
    border: 1px solid rgb(228, 228, 228);
	color: darkblue;
	}
#main {
	float:right;
	width: 84%;
    display: block;
    text-align: center;
    border: 1px solid rgb(228, 228, 228);
	}
#menti {
	font-size: 1.5em;
	text-align: center;
	text-decoration: ;
	text-decoration: ;
	font-weight:bold;
	color: darkblue
	}
#titelpic {
	position: fixed;
	width: 30%;
	align-content: left;
	display: block;
	}
#kopftext {
	position: static;
}
#alles {
	right: 30%;
	display: block;
	padding-top: 25em;
	border: 1px solid rgb(0, 0, 0);
	}
	a:link {
	color: darkblue;
	}
	a:hover {
	color: white;
	background-color:darkblue;
	}
	a:visited {
	color: darkblue;
	}
	a:hover {
	color: white;
	background-color: darkblue;
	}

	<!--.......................................-->

	body{
		margin: 0px;
		padding: 0px;
		background: #e74c3c;
		font-family: 'Lato', sans-serif;
	  }


	#effekt{
		float: none; 
		clear: both;
		width: 50%; 
		margin: 10% auto;
		background: #eee;
	  }
	  
	  nav ul {
		list-style: none;
		margin: 0px;
		padding: 0px;
	  }
	  
	  nav li{
		float: none; 
		width: 100%;
	  }
	  
	  nav li a{
		display: block; 
		width: 100%; 
		padding: 20px; 
		border-left: 5px solid; 
		position: relative; 
		z-index: 2;
		text-decoration: none;
		color: #444;
		box-sizing: border-box;  
		-moz-box-sizing: border-box;  
		-webkit-box-sizing: border-box; 
	  }
		
	  nav li a:hover{ border-bottom: 0px; color: #fff;}
	  nav li:first-child a{ border-left: 10px solid #3498db; }
	  nav li:nth-child(2) a{ border-left: 10px solid #ffd071; }
	  nav li:nth-child(3) a{ border-left: 10px solid #f0776c; }
	  nav li:last-child a{ border-left: 10px solid #1abc9c; }
	  
	  nav li a:after { 
		content: "";
		height: 100%; 
		left: 0; 
		top: 0; 
		width: 0px;  
		position: absolute; 
		transition: all 0.3s ease 0s; 
		-webkit-transition: all 0.3s ease 0s; 
		z-index: -1;
	  }
	  
	  nav li a:hover:after{ width: 100%; }
	  nav li:first-child a:after{ background: #3498db; }
	  nav li:nth-child(2) a:after{ background: #ffd071; }
	  nav li:nth-child(3) a:after{ background: #f0776c; }
	  nav li:last-child a:after{ background: #1abc9c; }
	  
	  
	  
	  @font-face {
		font-family: 'Lato';
		font-style: normal;
		font-weight: 100;
		src: local('Lato Hairline'), local('Lato-Hairline'), url(http://themes.googleusercontent.com/static/fonts/lato/v6/boeCNmOCCh-EWFLSfVffDg.woff) format('woff');
	  }
	  @font-face {
		font-family: 'Lato';
		font-style: normal;
		font-weight: 300;
		src: local('Lato Light'), local('Lato-Light'), url(http://themes.googleusercontent.com/static/fonts/lato/v6/KT3KS9Aol4WfR6Vas8kNcg.woff) format('woff');
	  }
	  @font-face {
		font-family: 'Lato';
		font-style: normal;
		font-weight: 400;
		src: local('Lato Regular'), local('Lato-Regular'), url(http://themes.googleusercontent.com/static/fonts/lato/v6/9k-RPmcnxYEPm8CNFsH2gg.woff) format('woff');
	  }
	  @font-face {
		font-family: 'Lato';
		font-style: normal;
		font-weight: 700;
		src: local('Lato Bold'), local('Lato-Bold'), url(http://themes.googleusercontent.com/static/fonts/lato/v6/wkfQbvfT_02e2IWO3yYueQ.woff) format('woff');
	  }
	  <!-- --------------------------------------------------- -->
      button {
      display: inline-block;
      background-color: #7b38d8;
      border-radius: 10px;
      border: 4px double #cccccc;
      color: #eeeeee;
      text-align: center;
      font-size: 50px;
      padding: 40px;
      width: 500px;
      transition: all 0.5s;
      cursor: pointer;
      margin: 15px;
      }
      button span {
      cursor: pointer;
      display: inline-block;
      position: relative;
      transition: 0.5s;
      }
      button span:after {
      /*content: '\00bb';*/
      position: absolute;
      opacity: 0;
      top: 0;
      right: -20px;
      transition: 0.5s;
      }
      button:hover {
      background-color: #07c2f9;
      }
      button:hover span {
      padding-right: 25px;
      }
      button:hover span:after {
      opacity: 1;
      right: 0;
      }
	