@font-face {
	font-family: 'AlexandriaFLF';
	src: local('AlexandriaFLF'), local('AlexandriaFLF'), url('AlexandriaFLF.ttf') format('truetype');
} 

 @font-face {
	font-family: 'AlexandriaFLF-Bold';
	src: local('AlexandriaFLF-Bold'), local('AlexandriaFLF-Bold'), url('AlexandriaFLF-Bold.ttf') format('truetype');
} 

* {
  margin: 0px;
  padding: 0px;
  border: none;
}



a{
color:#646464;
}


body{
background-color:#fff;
background-image:url(../images/bg.jpg);
background-repeat: repeat-x; 
background-position: center top;          
}

#wrapper{
margin:auto;
width:950px;
}

/* ------------------------------------------------
------------ Header ------------------------------- */

#header{
margin-top:20px;
float:left;
width:950px;
height:139px;
}

.logo{
width:309px;
height:63px;
float:left;
text-indent: -9999px;
background-image:url(../images/logo.png);
background-repeat:no-repeat;
position: relative;
top:48px;
}

/* --- Navi --- 
------------------------------*/

.navi{
float:left;
margin:70px 0 0 40px;
list-style:none;
}

.navi li{
float:left;
}

.navi li a{
margin-left:45px;
font-family:AlexandriaFLF, Myriad Pro, Helvetica, Arial, san-serif;
font-size:27px;
color:#000;
text-decoration:none;
}

.navi li a:hover{
color:#fff;
}

.icons{
float:right;
}


/* ----------------- main Bereich bei den infoseiten ---
---------------------------------------- */
#main{
float:left;
width:700px;
}

.info_img{
outline-offset:12px;
outline:2px solid #000;
}



/* ----------------- Welcome Bereich ---
---------------------------------------- */
#welcome{
float:left;
width:950px;
height:374px;
}

.wel-txt{
float:left;
margin-top:60px;
}

.bold{
font-size:61px;
font-family:AlexandriaFLF-Bold, Myriad Pro, Helvetica, Arial, san-serif;
color:#4a4a4a;
}

.small{
font-size:61px;
font-family:AlexandriaFLF, Myriad Pro, Helvetica, Arial, san-serif;
color:#4a4a4a;
}

.me{
background-image:url(../images/me.png);
float:right;
width:247px; 
height:349px;
text-indent:-9999px;
}


/* --------------------------- Skills ---
----------------------------------------- */
#sidebar{
float:left;
width:200px;
}



/* --------------------------- Skills ---
----------------------------------------- */
#skills{
float:left;
width:950px;
height:300px;
}

.box-l{
float:left;
width:470px;
height:300px;
}

.box-r{
float:right;
width:470px;
height:300px;
}

.skill-icon{
margin-top:80px;
}

.skill-txt{
width:420px;
font-family:Helvetica;
font-weight:normal;
color:#4a4a4a;
font-size:17px;
margin-top:30px;
}

.skill-list{
margin:20px 0 0 0;
font-family:Helvetica;
font-weight:normal;
color:#4a4a4a;
font-size:17px;
list-style-type:none;
}

.skill-list li{
height:27px;
background: url(../images/bullet.png);
background-repeat:no-repeat;
background-position:left center;
padding-left:40px;
margin-top:10px;
}


/* --------------------------- Footer ---
----------------------------------------- */

#footer{
float:left;
width:950px;
height:40px;
margin-top:120px;
}

.footer-txt{
font-family:AlexandriaFLF, Myriad Pro, Helvetica, Arial, san-serif;
font-size:24px;
color:#000;
}

.footer-link{
color:#000;
text-decoration:none;
}


/* -------------------------- Gallery ---
----------------------------------------- */

.galerie{
margin:20px 0 80px 0;
}

/* ------ Hover Effekt --------- */

ul.hover_block li{
			list-style:none;
			float:left;
			background: #fff;
			padding: 10px;
			width:370px; 
      position: relative;
      margin:0 20px 20px 0; 
      border:1px solid #000;
}

		ul.hover_block li a {
			display: block;
			position: relative;
			overflow: hidden;
			height: 120px;
			width:370px;
			padding: 16px;
			color: #000;
			font: 1.6em/1.3 AlexandriaFLF, Arial, sans-serif;
		}

		ul.hover_block li a { text-decoration: none; }

		ul.hover_block li img {
			position: absolute;
			top: 0;
			left: 0;
			border: 0;
		}

ul.hover_block2 li{
			list-style:none;
			float:left;
			background: #fff;
			padding: 10px;
			width:370px; 
      position: relative;
      margin:0 20px 20px 0; 
      border:1px solid #000;
}

		ul.hover_block2 li a {
			display: block;
			position: relative;
			overflow: hidden;
			height: 120px;
			width:370px;
			padding: 16px;
			color: #000;
			font: 1.6em/1.3 AlexandriaFLF, Arial, sans-serif;
		}

		ul.hover_block2 li a { text-decoration: none; }

		ul.hover_block2 li img {
			position: absolute;
			top: 0;
			left: 0;
			border: 0;
		}		



/* ------------------------- Kontakt ---
---------------------------------------- */

#contact-wrapper {
	width:430px;
	border:1px solid #e2e2e2;
	background:#f1f1f1;
	padding:20px;
}
#contact-wrapper div {
	clear:both;
	margin:1em 0;
}
#contact-wrapper label {
	display:block;
	float:none;
	font-size:16px;
	width:auto;
}
form#contactform input {
	border-color:#B7B7B7 #E8E8E8 #E8E8E8 #B7B7B7;
	border-style:solid;
	border-width:1px;
	padding:5px;
	font-size:16px;
	color:#333;
}
form#contactform textarea {
	font-family:Arial, Tahoma, Helvetica, sans-serif;
	font-size:100%;
	padding:0.6em 0.5em 0.7em;
	border-color:#B7B7B7 #E8E8E8 #E8E8E8 #B7B7B7;
	border-style:solid;
	border-width:1px;
}




/* ------------------------ Impressum --- 
----------------------------------------- */

.impressum{
width:650px;
float:left;
margin:80px 0 80px 0;
}

h1{
font-family:Helvetica;
}

h2{
font-family:Helvetica;
margin:20px 0 20px 0;
}

h3{
font-family:Helvetica;
margin:30px 0 10px 0;
}

p{
font-family:Helvetica;
}

strong{
font-family:AlexandriaFLF, Helvetica;
}

.clicky{
float:left;
}

input #submit{
color:#fff;
background-color:#2ab12d;
}