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

/** ALL PAGES **/

	html {background-color:black;
		height:900px;
		overflow:hidden;
		}
	
	@font-face {
		font-family:Knockout;
		src: url("../fonts/Knockout-HTF49-Liteweight.otf")
		}
		
	@font-face {
		font-family:Garamonditalic;
		src: url("../fonts/GaramondPremrPro-SmbdIt.otf")
		}
		
	@font-face {
		font-family:Garamond;
		src: url("../fonts/GaramondPremrPro-SmbdDisp.otf")
		}
		
	header {
		color:white;
		padding:0px;
		height:100px;
		width:100%;
		}
		
	header h1 {
		font-family:Knockout;
		font-size:100px;
		line-height:0px;
		position:absolute;
		left:50px;
		z-index:11;
		}
		
	header h2 {
		font-family:garamonditalic;
		font-size:20px;
		position:absolute;
		left:55px;
		top:100px;
		font-kerning:normal;
		z-index:11;
		}
		
	a {
		text-decoration:none;
		color:white;
		}
	
	a:visted {
		text-decoration:none;
		color:white;
		}
	
	a:active {
		text-decoration:none;
		color:white;
		}
	
	a:hover {
		text-decoration:none;
		color:yellow;
		}
		
	section {
		margin:auto;
		width:800px;
		height:600px;
		overflow:hidden;
		}
		
	article h4 {
		color:white;
		font-family:Garamond;
		font-size:40px;
		}

	footer {
		font-family: 'Catamaran', sans-serif;		
		font-size:14px;
		color:#CCCCCC;
		text-align:center;
		margin:auto;
		width:100%;
		position:fixed;
		bottom:0px;
		margin-top:100px;
		}
		
/** INDEX **/

	#indextitle {
		
		padding:150px;
		text-align:center;
		margin:100px auto;
		width:400px;
		height:300px;
		}
		
	#indextitle h1 {
		font-family:Knockout;
		font-size:200px;
		color:white;
		margin:auto;
		line-height:150px;
		font-kerning:normal;
		}
		
	#indextitle h2 {
		color:white;
		font-family:Garamonditalic;
		font-size:30px;
		text-align:left;
		position:relative;
		left:15px;
		line-height:0px;
		font-kerning:normal;
		}

/** 1.0LEAVEHOME **/

	#houses {
		padding-left:0px;
		position:relative;
		top:-100px;
		}
		
	#housesgif {
		position:relative;
		
		z-index:1;
		}
		
	#housesback2 {
		position:relative;
		top:-620px;
		left:-20px;
		z-index:2;
		}
	
	#bwhouse1 {
		position:relative;
		top:-900px;
		left:225px;
		z-index:3;
		}
	
	#bwhouse2 {
		position:relative;
		top:-900px;
		left:200px;
		z-index:2;
		}
		
	#bwhouse3 {
		position:relative;
		top:-900px;
		left:150px;
		z-index:2;
		}
		
	.home1 {
		text-align:center;
		position:relative;
		top:-150px;
		}

/** 2.1SHORE **/

	#shore {
		position:relative;
		padding-top:100px;
	  	padding-left:50px;
		}
		
	#waves {
		postion:relative;
		margin:center;
		width: 600px;
		height:450px;
		z-index:1;
		}
			
	#lifejacketback {
		position:relative;
		top:-275px;
		left:-450px;
		z-index:4;
		}
	
	#lifejacketbottom {
		position:relative;
		top:-190px;
		left:50px;
		z-index:2;
		}
		
	#lifejacketmiddle {
		position:relative;
		top:-175px;
		left:0px;
		z-index:3;
		}	 
	#lifejackettop {
		position:relative;
		top:-250px;
		left:-150px;
		z-index:5;
		}
			
	#shoretext {
		position:relative;
		top:-450px;
		right:100px;
		text-align:right;
		}
		
/** 2.2LEGS **/

	#legswalking {
		padding-top:50px;
		}
		
	#legstext {
		position:relative;
		top:-116px;
		text-align:center;
		}

/** 2.3TANK **/

	#tank  {
		background-image:url(../level2/images/tank.gif);
		width:800px;
		height:600px;
		margin:auto;
		position:relative;
		}
		
	#tankblood {
		position:relative;
		top:150px;
		left:300px;
		margin:20px;
		}
		
	#tanktext{
		position:relative;
		top:100px;
		}
		
/** 3.0HOMEBUT **/

	#buttext {
		background-color:black;
		width:400px;
		height:70px;
		position:relative;
		top:110px;
		left:-160px;
		margin:auto;
		z-index:11;
		}
		
	#sniper {
		z-index:10;
		position:relative;
		top:-1030px;
		left:18px;
		}


/** 4.0END **/

	#endtext {
		position:relative;
		top:100px;
		z-index:2;
		}
		
	#boat {
		position:relative;
		top:-400px;
		left:50px;
		z-index:1;
		width:900px;
		}