<style type="text/css">

body {
	Margin: 0;
	Padding: 0;
	
	
}

*	{
	 -webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
			-box-sizing: border-box;
}

#container {
	position:relative;
	width:968px;
	margin:0 auto;
	/*background:#eee;	*/
}



.videoWrapper01 {
	
	position: relative;
	top:0px;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper01 iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.videoWrapper02 {
	
	position: relative;
	top:0px;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper02 iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
header {
	width:66.66%;
	padding: 0px 0px 0px 8px ;
	/*background: #ddd;*/
	float:left;
	font-family: Georgia, "Times New Roman", Times, serif;
}
footer {
	width: 100%;
	position: relative;
	top: 0px;
	padding: 40px 10px 200px 10px ;
	/*background: #ddd;*/
	float:left;
font-family: "Courier New", Courier, monospace;
	font-weight:bold;
		font-size:18px;
}
footer ul  {
	text-align:center;
	display:inline;
	
	
}
footer ul li {
	text-align:center;
	display:inline;
	padding-right: 180px;
    padding-left: 180px;
	
}

footer ul li a:active  {
  /* Applies to activated links */
  text-decoration:underline;
  font-weight:      bold;
  font-size:16px;
  color:            black;
  } 

nav 	{
	width:33.33%;
	float:left;
	text-align:right;
	/*background:#666;*/
	padding: 40px 8px 0px 0px ;
font-family: "Courier New", Courier, monospace;
	font-weight:bold;
		font-size:18px;
}
ul {
	
	list-style-type: none;
}





.main 	{
	float:left;
	height:390px;
	width:66.66%;
	padding:0px 0px 0px 0px;
}


.col-1-2	{
	float:left;
	width:50%;
	padding:0 10px;
}

aside	{
	float:left;
	height:390px;
	width:33.33%;
	background-image: url(images/aaside01.png); 
	background-repeat: no-repeat;
	padding:20px 10px 10px 10px;
	text-align:left;
	
}

aside p {
	margin: 0;
	/*height:340px;*/
	/*padding-top:30%;*/
}
aside h3 {
	
	/*height:340px;*/
	padding-top:15%;
}


		

	a:link    {
  /* Applies to all unvisited links */
  text-decoration:  none;
  font-weight:      bold;
  
  color:            #000000;
  } 
a:visited {
  /* Applies to all visited links */
  text-decoration:  none;
  font-weight:      bold;
  color:            #000000;
  
  } 
a:hover   {
  /* Applies to links under the pointer */
  
  font-weight:      bold;
  
  color:            grey;
  } 
a:active  {
  /* Applies to activated links */
  
  font-weight:      bold;
  font-size:14px;
  color:            grey;
  } 

/* Media queries for adaptive layout */
/* for 599 and below */
@media only screen and (max-width: 959px) {
	#container {
		/* Set our conttainer to its new size */
		width: 640px;
	}
	
	header {
		float:left;
		width:67%;
	}
	footer {
	position: relative;
	top:20px;
	padding: 0px 0px 200px 0px ;
	/*background: #ddd;*/
	float:left;
}
footer ul li {
	display:inline;
	padding-right: 100px;
    
    padding-left: 100px;
}
	.main	{
		height:270px;
		width: 67%;	/* 66.66666 */
	}
	

	.col-1-2	{
		/*force these to take up the full width */
		width: 100%;
	}
		nav {
		width: 33%;
	}
	aside	{
		height:270px;
		width: 33%; /* 33.33333% */
	}
	.videoWrapper {
		position: relative;
		top:620px;
		padding-bottom: 56.25%; /* 16:9 */
		padding-top: 25px;
		height: 0;
}

/* for 479px and below */
@media only screen and (max-width:639px) {
	#container {
		width: 320px;
	}

	
	header{
		padding: 0px 0px 0px 0px ;
		width:100%;
		/*height: 67px;*/
		
		
	}
	header img{
		width:100%;
		padding: 0px 0px 0px 0px ;
	}
	nav {
		width: 100%;
		text-align:center;
		padding: 0px 0px 0px 0px ;
	}
	nav ul li {
	display:inline;
	padding-right: 50px;
    
    padding-left: 25px;
}
	.main {
		width: 100%;
		
	}
	
	aside {
		display:none;
		width: 100%;
		height: 90px;
	}
	.videoWrapper {
		position: relative;
		top:340px;
		padding-bottom: 56.25%; /* 16:9 */
		padding-top: 25px;
		height: 0;
}
	 ul li{
		display: inline;
		height: 60px;
	}
	footer {
	position: relative;
	top: 0px;
	padding: 20px 0px 0px 0px ;
	/*background: #ddd;*/
	float:left;
	
}
footer ul li {
	display:inline;
	padding-right: 25px;
    
    padding-left: 25px;
}


</style>