body 
	{
		margin:0;
		padding:0;
		border:0; /* This removes the border around the viewport in old versions of IE */
		width:100%;
		background:#000;
		min-width:600px; /* Minimum width of layout - remove line if not required */
		/* The min-width property does not work in old versions of Internet Explorer */
		font-size:90%;
		font-family: tahoma, sans serif;
	}

body#theatre 	{	background:#29af00;	}
body#comedy 	{	background:#049eff;	}
body#contact	{	background:#fff000;	}
body#about		{	background:#b1009a;	}
body#archive	{	background:#ff6633;	}

#container
	{
		margin: 0 auto;
		width: 800px;
		background:#000;
	}

#containerwhite
	{
		margin: 0 auto;
		width: 800px;
		background:#fff;
	}

#header
	{
		background:#000;
		padding: 10px;
	}

#navigation
	{
		float: left;
		width: 800px;
		background:#000;
	}

#navigation ul
	{
		margin: 0;
		padding: 0;
	}

#navigation ul li
	{
		list-style-type: none;
		display: inline;
	}

#navigation li a
	{
		display: block;
		float: left;
		padding: 5px 10px;
		color:#f5f5f5;
		font-size:120%;
		text-decoration: none;
		border-right: 1px solid#000;
	}

#navigation li a#theatre:hover, a#theatre.selected { background:#29af00; color:#000}
#navigation li a#comedy:hover, a#comedy.selected { background:#049eff; color:#000}
#navigation li a#about:hover, a#about.selected { background:#b1009a; color:#000}
#navigation li a#contact:hover, a#contact.selected { background:#fff000; color:#000}
#navigation li a#archive:hover, a#archive.selected { background:#ff6633; color:#000}

#content
	{
		clear: left;
		padding-top: 10px;
		padding-left: 10px;
		padding-right: 10px;
		padding-bottom: 0;
	}

#footer
	{
		background:#1f1f1f;
		color:#fff;
		text-align: right;
		padding: 10px;
		height: 1%;
		font-size: 60%;
	} 


p 
	{
		color:#363636;
		font-family: tahoma, sans serif;
		font-size: 85%;
	}

h1, 
h2, 
h3 
	{
		font-family: tahoma, sans serif;
		color: #363636;
	}
	
p.white,
h1.white,
h2.white,
h3.white
	{
		font-family: tahoma, sans serif; 
		color: #fff;
	}
	
img 
	{
		border: none;
		border: 0;
	}
	
img.padded 
	{
		border: none;
		border: 0;
		padding-right: 5px;
		float: left;
	}


/* --> */
    
.floatright 
	{ 
		float: right; 
	}	

.floatleft 
	{ 
		float: left; 
	}	
	
a.link, a.link:visited
	{
		text-decoration: none;
		color: #ff6633;
		font-family: tahoma, sans serif;
	}
	
a.link:hover	
	{
		text-decoration: underline;
		color: #ff6633;
		font-family: tahoma, sans serif;
	}
		
a.contactlink, a.contactlink:visited, a.contactlink:hover	
	{
		text-decoration: underline;
		color: #363636;
		font-family: tahoma, sans serif;
	}

a.theatrelink, a.theatrelink:visited
	{
		text-decoration: none;
		color: #29af00;
		font-family: tahoma, sans serif;
	}

a.theatrelink:hover
	{
		text-decoration:underline;
		color: #29af00;
	}	
	
a.comedylink, a.comedylink:visited
	{
		text-decoration: none;
		color: #049eff;
		font-family: tahoma, sans serif;
	}

a.comedylink:hover
	{
		text-decoration:underline;
		color: #049eff;
	}	
	
a.aboutlink, a.aboutlink:visited
	{
		text-decoration: none;
		color: #b1009a;
		font-family: tahoma, sans serif;
	}

a.aboutlink:hover
	{
		text-decoration:underline;
		color: #b1009a;
	}	
	
a.archivelink, a.archivelink:visited
	{
		text-decoration: none;
		color: #ff6633;
		font-family: tahoma, sans serif;
	}

a.archivelink:hover
	{
		text-decoration:underline;
		color: #ff6633;
	}


#menu {position:relative; width:350px; height:350px; background:transparent url(/images/flymenulogo.gif); overflow:hidden; margin:0 auto;}
#menu ul {margin:0; padding:0;}
#menu li {list-style-type:none; width:175px; height:175px; display:inline;}
#menu a {display:block; float:left; width:175px; height:0; overflow:hidden; color:#000; text-decoration:none; padding-top:175px; background:transparent url(/images/flymenu.gif) no-repeat 500px 500px;}
#menu a {background-repeat:no-repeat;}
#menu a:active, #menu a:focus { 
 border: 0px; 
 outline:0; /* for browsers that understand */ 
 }
* html #menu a  {height:175px; he\ight:0;}


#menu a#theatre:hover {background-position: 0 0; z-index:50;}
#menu a#comedy:hover {background-position: -175px 0; z-index:50;}
#menu a#about:hover {background-position: 0 -175px; z-index:50;}
#menu a#contact:hover {background-position: -175px -175px; z-index:50;}


@media only screen and (max-device-width: 480px) { 
#menu {position:relative; width:350px; height:350px; background:transparent url(/images/flymenu.gif); overflow:hidden; margin:0 auto;}
#menu ul {margin:0; padding:0;}
#menu li {list-style-type:none; width:175px; height:175px; display:inline;}
#menu a {display:block; float:left; width:175px; height:0; overflow:hidden; color:#000; text-decoration:none; padding-top:175px; background:transparent url(/images/flymenu.gif) no-repeat 500px 500px;}
#menu a {background-repeat:no-repeat;}
#menu a:active, #menu a:focus { 
 border: 0px; 
 outline:0; /* for browsers that understand */ 
 }
* html #menu a  {height:175px; he\ight:0;}


#menu a#theatre:hover {background-position: 0 0; z-index:50;}
#menu a#comedy:hover {background-position: -175px 0; z-index:50;}
#menu a#about:hover {background-position: 0 -175px; z-index:50;}
#menu a#contact:hover {background-position: -175px -175px; z-index:50;}
}