@charset "utf-8";
/* CSS Document */



* {
	margin:0;
	padding:0;
}

body {
	background-image:url(../img/bodybg.jpg);
	background-repeat:no-repeat;
	overflow-x:hidden;
	overflow-y:scroll;
	width:7600px;
	height:100%;
	
}

#home {
	margin:0 420px 0 200px;	
	width:1080px;
	height:800px;
	float:left;
}

	#welcome {
		background-image:url(../img/home-takealook.png);
		background-repeat:no-repeat;
		width:822px;
		height:827px;
		margin:20px 0 0 300px;
	}
	
	#welcome h1 {
		font-family: 'Judson', italic;
		font-style:italic;
		font-weight:100;
		letter-spacing:1px;
		color:#222222;
		padding:160px 0 0 290px;
	}
	
	#welcome h2 {
		font-family: 'PT Sans Narrow', italic;
		font-size:62px;
		font-weight:100;
		letter-spacing:1px;
		color:#22222;
		margin:-15px 0 0 0;
		padding:0 0 0 290px;
	}	
	
	#welcome p {
		font-family: 'Judson', italic;
		font-style:italic;
		font-weight:100;
		font-size:34px;
		line-height:34px;
		text-align:center;
		letter-spacing:1px;
		color:#22222;
		margin:40px 0 0 -60px;
	}	
	
	#welcome span {
		text-decoration:underline;
	}		

	#startbtn {
		background-image:url(../img/home-click2start.png);
		background-repeat:no-repeat;
		width:754px;
		height:755px;	
		float:left;
		margin:-600px 0 0 600px;
	}

#about {
	margin:0 420px;
	width:1080px;
	height:800px;
	float:left;
}

#slides {
	background-image:url(../img/about-bg.png);
	background-repeat:no-repeat;
	width:1252px;
	height:1003px;
	border:none;
	padding:1px 0 0 0;
}

#work {
	margin:0 420px;	
	width:1080px;
	height:800px;
	float:left;
}

#work-navi {
	background-image:url(../img/work-navibg.png);
	background-repeat:no-repeat;
	width:623px;
	height:614px;
	margin:140px 0 0 -80px;
	float:left;
}

#work-navi h1 {
		font-family: 'Judson', serif;
		font-style:italic;
		font-weight:100;
		font-size:30px;
		line-height:29px;
		letter-spacing:1px;
		text-align:center;
		color:#222222;
		margin:110px 0 0 118px;
}

#work-navi h2 {
		font-family: 'PT Sans Narrow', serif;
		font-size:42px;
		font-weight:900;
		letter-spacing:1px;
		text-align:center;
		color:#222222;
		margin:-30px 0 0 0;
		padding:25px 0 0 0px;
	}

#work-navi ul {
		margin:40px 0 0 120px;	
		list-style:none;
}

#work-navi a {
	color:#222222;
	text-decoration:none;
}
#work-navi h2:hover {
	color:#222222;
	text-decoration:underline;
}

#containerworks {
		float:left;
		width:900px;
		height:500px;
		margin:-600px 0 0 420px;
		border:none;
}

#webworks {
	width:800px;
	height:1000px;
	overflow:auto;
	border:none;
	background-color:transparent;
}

#webdesign {
	width:820px;
	height:800px;
}

#contact {
	margin:0 0 0 200px;
	width:1280px;
	height:800px;
	float:left;
}

#contactform {
	overflow:hidden;
	scrolling:no;
	width:800px;
	height:900px;
	float:left;
	margin:-40px 0 0 0;
	border:none;
}

#formcontainer {
    background-image: url("../img/contact-formbg.png");
    background-repeat: no-repeat;
    float: left;
    height: 715px;
    margin: 140px 0 0;
    width: 846px;
}

#formcontainerthanks {
    background-image: url("../img/contactthanks-formbg.png");
    background-repeat: no-repeat;
    float: left;
    height: 715px;
    margin: 140px 0 0;
    width: 846px;
}

#imprintcontainer {
	background-image:url(../img/contact-imprintbg.png);
	background-repeat:no-repeat;
	width:846px;
	height:715px;
	margin:140px 0 0 0;
	float:left;
}

#social {margin:200px 0 0 0; float:left;}
#social ul {list-style:none; margin:50px 0 0 0;}
#social li {display:inline;	margin:25px;}
#social img {border:none;}

#thankswrapper {
	border:1px red solid;
	width:10px;
	height:40px;
	margin:-500px 0 0 0;
}

#thanksframe {
	margin:180px 0 0 420px;
	border:1px red solid;
	width:400px;
	height:200px;
}

/*######################## TOP MENÜ ############################ */

#navigationtop {
	border:none;
    position: fixed;
    top: 0px;
    left: 50%;
    margin-left:-450px;
}

ul#awesome-menu {
	width: 517px; margin:20px 0 0 120px;
	list-style: none;
}

ul#awesome-menu li { display: inline; }
	
ul#awesome-menu li a {
	display: block; float: left; height: 99px; width:122px;
	background-image:url(../img/navitop.png); text-indent: -9999px;
	background-repeat:no-repeat;
}

	ul#awesome-menu li a.ninja {
		width: 109px; background-position: 0 0;	
	}
	
	ul#awesome-menu li a.zombie {
		width: 122px; background-position: -109px 0;	
	}
	
	ul#awesome-menu li a.robot {
		width: 122x; background-position: -227px 0;	
	}
	
	ul#awesome-menu li a.assassin {
		width: 110px; background-position: -352px 0;	
	}
	
	
	ul#awesome-menu li a.ninja:hover, ul#awesome-menu li a.ninja:focus {
		background-position: 0 -99px;	
	}
	
	ul#awesome-menu li a.zombie:hover, ul#awesome-menu li a.zombie:focus {
		background-position: -109px -99px;	width: 122x;
	}
	
	ul#awesome-menu li a.robot:hover, ul#awesome-menu li a.robot:focus {
		background-position: -227px -99px; width: 122x;	
	}
	
	ul#awesome-menu li a.assassin:hover, ul#awesome-menu li a.assassin:focus {
		background-position: -352px -99px;	
	}
	

a { outline: none; }



/*############################### CONTACT FORM ########################################*/

#contact-area {
	width: 400px;
	margin:390px 0 0 275px;
	border:none;
}

#contact-area p {
	width:450px;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-style:italic;
	font-size: 24px;
	text-align:center;	
	margin:0 0 0 0;
}

#contact-area a {
	font-family:Georgia, "Times New Roman", Times, serif;
	font-style:italic;
	font-size: 16px;
	color:#222222;		
	text-decoration:none;
}

#contact-area a:hover {
	font-family:Georgia, "Times New Roman", Times, serif;
	font-style:italic;
	font-size: 16px;
	color:#222222;
	text-decoration:underline;		
}

#contact-area input, #contact-area textarea {
	padding: 8px;
	width: 250px;
	background-color:transparent;
	font-family: 'Judson', italic;
	font-size: 16px;
	color:#fff;
	margin: 0px 0px 10px 0px;
	border:none;
	height:15px;
}

#contact-area textarea {
	margin:16px 0 0 0;
	height: 70px;
	width:180px;
	resize:none;
	maxlength:50;
	overflow:hidden;
	background-color:transparent;
}

#contact-area textarea:focus, #contact-area input:focus {
	border: none;
}

#contact-area input.submit-button {
	width: 74px;
	height:97px;
	margin:20px 210px 0 0;
	text-indent:-9999px;
	float: right;
	background-image:url(../img/send01.png);
	background-repeat:no-repeat;
}

#contact-area input.submit-button:hover {
	width: 74px;
	height:97px;
	float: right;
	background-image:url(../img/send02.png);
	background-repeat:no-repeat;
}

#contact-area input.clear-button {
	width: 74px;
	height:97px;
	margin:-97px 110px 0 0;
	text-indent:-9999px;
	float: right;
	background-image:url(../img/send03.png);
	background-repeat:no-repeat;
}

#contact-area input.clear-button:hover {
	width: 74px;
	height:97px;
	float: right;
	background-image:url(../img/send04.png);
	background-repeat:no-repeat;
}

label {
	float: left;
	border:none;
	margin-right: 15px;
	width: 100px;
	padding-top: 5px;
	font-size: 1.4em;
	text-indent:-9999px;
}
