@font-face {
    font-family: myFirstFont;
    src: url(../UpperEastSide.ttf) format('truetype');
}



body,td,th {
	color: #000;
}
body {
	background-color: #eadfb4;
	margin-left: 0px;
	margin-top: 0px;
	font-family:"Times New Roman", Times, serif;
}

h1 {
	font-family: myFirstFont, sans-serif;
	font-style: normal;
	font-weight: bold;
	text-align: center;
	color: #463f25;
}

h2 {
	font-family: myFirstFont, sans-serif;
	font-style: normal;
	font-weight: bold;
	text-align: center;
	color: #463f25;
}

h3 {
	font-family:myFirstFont, sans-serif;
	font-style: normal;
	font-weight: bold;
	text-align: center;
	color: #463f25;
}

h4 {
	font-family: "Times New Roman", Times, serif;
	font-style: normal;
	font-weight: bold;
	color: #463f25;
}




@media only screen and (min-width: 1050px) {
    /* desktop */
	
	#wrapper{
		position:relative;
		margin-left:auto;
		margin-right:auto;
		width:1000px;
		height:2000px;
	}
	nav{
		float:left;
		height: 588px;
		width: 270px;
		margin-right:80px;
		margin-top:63px;
		background-image:url(../images/interface/pkb.jpg)
	}
	#menuItems {
		position:absolute;
		left:80px;
		top:350px;
		width:125px;
		height:234px;
		z-index:1;
	}
	#banner{
		margin-left:100px;
		width:479px;
		height:424px;
		background-image:url(../images/interface/head.jpg)
	}
	h1 {
		font-size: 48px;
	}

	h2 {
		font-size: 36px;
	}
	
	h3 {
		font-size: 36px;
		font-weight: bold;
	}

	h4 {
		font-size: 24px;
		font-style:italic;
		font-weight:bold;
	}
	
	section{
		height:100px;
		width: 650px;
		float:left;
		color: #000;
		margin-top:75px;
	}

	#main{
		margin-top:42px;
	}
	.leftImage{
		float:left;
		padding-right:8px;
		padding-top:8px;
	}

	.rightImage{
		float:right;
		padding-top:8px;
	}

}

@media only screen and (min-width: 700px) and (max-width: 1050px) {
    /* tablets */
	
	#wrapper{
		position:relative;
		margin-left:auto;
		margin-right:auto;
		width:700px;
		height:2000px;
	}
	nav{
		float:left;
		margin-left: 0px;
		height: auto;
		width: 700px;
		height: 200px;
		background-image:url(../images/interface/pkbMedium.jpg)
	}
	#menuItems {
		position:absolute;
		left:100px;
		top:200px;
		width:700px;
		height:40px;
		z-index:1;
		
	}
	
	#menuItems  img{
		margin-right:30px;
		
	}
	#banner{
		margin-left:-100px;
		height:0px;
	}
	h1 {
		font-size: 36px;
	}

	h2 {
		font-size: 36px;
	}
	h3 {
		font-size: 36px;
	}

	h4 {
		font-size: 18px;
		margin-left: 50px;
	}

	section{
		position:relative;
		width:700px;
		float:left;
		top:20px;
	}
	
	article{
		position:relative;
		float:left;	
		width: 680px;
		top:20px;
	}

	#main{
		margin-top:10px;
		padding-left:10px;
	}
	#main img{
		display: block;
		margin-left:auto;
		margin-right:auto;
	}
	
	.leftImage, .rightImage{
		display: block;
		margin-left:auto;
		margin-right:auto;
	}
	
	table{
		margin-left: 50px;
		
	}
}

@media only screen and (max-width: 700px) {
    /* phones */
	
	#wrapper{
		position:relative;
		margin-left:auto;
		margin-right:auto;
		width:320px;
		height:2000px;
	}
	nav{
		float:left;
		margin-left: 15px;
		height: auto;
		width: 300px;
		height: 102px;
		background-image:url(../images/interface/pkbSmall.jpg)
	}
	#menuItems {
		position:absolute;
		left:110px;
		top:120px;
		width:125px;
		height:234px;
		z-index:1;
		
	}
	#banner{
		margin-left:-100px;
	}
	h1 {
		font-size: 24px;
	}

	h2 {
		font-size: 24px;
	}
	h3 {
		font-size: 24px;
	}

	section{
		width: 300px;
		float:left;
		color: #000;
		margin-top:230px;
	}

	#main{
		margin-top:10px;
		padding-left:10px;
	}
	#main img{
		width: 80%;
		height:auto;
		display: block;
		margin-left:auto;
		margin-right:auto;
	}
	
	.leftImage, .rightImage{
		display: block;
		margin-left:auto;
		margin-right:auto;
	}

	
}

@media only screen and (max-width: 767px) and (orientation: portrait) {
    /* portrait phones */
}


.quote{
	left-margin:20px;
	padding-left:40px;
}





.quote1 {	left-margin:20px;
	padding-left:40px;
}
.quote2 {	left-margin:20px;
	padding-left:40px;
}
.quote11 {left-margin:20px;
	padding-left:40px;
}
.quote3 {	left-margin:20px;
	padding-left:40px;
}
.quote12 {left-margin:20px;
	padding-left:40px;
}
.quote111 {left-margin:20px;
	padding-left:40px;
}
.quote21 {left-margin:20px;
	padding-left:40px;
}



 


#pageContainer {
  margin:0 auto;
  width:960px;
}

.slide{
	font-family: Arial, Helvetica, sans-serif;
	font-size:0.8em;
	color:#000;
}
.slide h2, .slide p {
  margin:15px;
  
}
.slide h2 {
  font: 1.2em Arial, Helvetica, sans-serif;
  color:#000;
  font-weight:bold;
   text-:underline;
  
}
.slide img {
  float:right;
  margin:0 15px;
  padding:2px;
  border:2px solid #aaa;
  background-color:#eadfb4;;
}

.instruct{
	float:right;
	clear:both;
	margin-top:20px;

}

#footer {
  height:100px;
}
#footer p {
  margin:30px auto 0 auto;
  display:block;
  width:560px;
  height:40px;
}

.shadow {
   -moz-box-shadow:    10px 10px 4px 2px #222;
  -webkit-box-shadow: 10px 10px 4px 2px #222;
  box-shadow:         10px 10px 4px 2px #222;
}

.nextEpisode{
	font-family: myFirstFont, sans-serif;
	font-style: normal;
	font-weight: bold;
	font-size:2em;
	text-align: center;
	color: #463f25;
}
-->