/*#body{
  height: 100%;
  margin: 0;
}*/
/*FOR HANDHELD DEVICES*/



#body
{
	background-color:black;
	color:white;
	border-radius: 5px;
	width: auto;
	height: auto;
	font-size:16px;
	 box-sizing: border-box;
	/*min-height:750px;
	margin-top:0%;
	margin-right:0%;
	margin-bottom:0%;
	margin-left:0%;
	
	color:white;
	text-align: left;
	padding-top: 1.5%;
	padding-left: 3%;
	padding-right: 3%;
	padding-bottom: 4%;
	position:static;
	overflow:auto;  /*this is necessary to prevent the div from collapsing. It forces the div to recognise sub-divs*/
}

#container
{
	width: auto;
	height: auto;
	position: inherit;
	top: 0%;
	left:0%;
	/*right: 0%;*/
	background-color: transparent;
	color: silver;
	padding-top: 1.5%;
	padding-left: 3%;
	padding-right: 3%;
	padding-bottom: 4%;
	border-color:orange;
	margin-top:1%;
	margin-bottom: 2%;
	margin-left: 1%;
	margin-right: 1%;
	box-align: inherit;
	 box-sizing: border-box;
}
}
/*dropdowncode*/
.dropbtn {
  background-color: grey;
  font-size: .5em;
  border: none;
	border-radius: 5px;
	width:100%;

}

.dropdown {
  position: relative;
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #1c1c1c;
  width: 100%;
  /*box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);*/
  z-index: 1;
}

.dropdown-content a {
  color: white;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.dropdown-content a:hover {background-color: lightblue; color:black;}

.dropdown:hover .dropdown-content {display: block;}

.dropdown:hover .dropbtn {background-color: #2c2c2c;}

.row::after {
  content: "";
  clear: both;
  display: table;
}

[class*="col-"] {
  float: left;
  padding: 15px;
}
  /* For mobile phones: */
  [class*="col-"] {
    width: 100%;
  }

#playcontent
{
	position: inherit;
	/*top: 2%;
	left: 2%;
	width: 68%;*/
	height: auto;
	background-color: yellow;
	color: black;
	/*opacity: .75;
	filter: alpha(opacity=75);
	line-height: 1.4em;*/
	padding-top: 1.5%;
	padding-left: 1.5%;
	padding-right: 1.5%;
	padding-bottom: 4%;
	 box-sizing: border-box;
}
	/*border: medium solid silver;text-align:justify;background-color:transparent;*/
}
#heading{
background-color: transparent;
	color: white;
	position:inherit;
	max-width:100%;
	height: auto;
	 box-sizing: border-box;
}	

}

#footer
{
	background-color: transparent;
	/*color: white;*/
	clear:both;
	width:auto;
	max-width: 95%;
	position:static;
	margin-top: 3%;
	margin-left:.5%;
	 box-sizing: border-box;
}
}
/*#rightside
{
	width: 23%;
	height: auto;
	max-height:80%;
	padding-right: 2.5em;
	padding-left: 1em;
	padding-top: 1em;
	padding-bottom: 2em;
	text-align: left;
	line-height: 1.25em;
	position: absolute;
	top: 3.5%;
	left: 72.5%;
	color: silver;
	background-color:transparent;
	overflow: auto;
	 box-sizing: border-box;

}*/
a
{
	color: #cfcfcf;
	font-family: Lucida sans unicode, Lucida sans unicode,Lucida sans unicode, sans-serif;
}
a:visited
{
	color:#DAA94D;
}
img{
	width:auto;
	height:auto;
}
P
{
	font-size: 1em;
	font-family: Lucida sans unicode, Lucida sans unicode,Lucida sans unicode, sans-serif;
	padding: 5px;
	margin: 0;
}
.title{
	font-size:1.2em;
	line-height: .5vmax;	
}
.tagline{
font-size:.5em;
}
.mobcentre
{
text-align:center;	
}
.label{
	font-size:1.5vw;
}
.justify{
	text-align:justify;
}
H1
{
	font-size: 3.5em;
	font-weight: normal;
	font-family: "Lucida sans unicode";
	color: white;
	padding: 0;
	text-decoration: none;
	line-height: 1em;
}
H2
{
	font-size:3.3em;
	font-weight: normal;
	font-family: Lucida sans unicode, Lucida sans unicode,Lucida sans unicode, sans-serif;
	color: white;
	padding: 0;
	margin: 0;
	line-height: 1em;
	text-decoration: none;
}
H3
{
	font-size: 3.1em;
	font-weight: normal;
	font-family: Lucida sans unicode, Lucida sans unicode,Lucida sans unicode, sans-serif;
	color: white;
	padding: 0;
	margin: 0;
	line-height: 1em;
	text-decoration: none;
}
H4
{
	font-style: normal;
	font-weight: bolder;
	font-size: 3em;
	line-height: 1em;
	color: silver;
	font-family: Lucida sans unicode, Lucida sans unicode,Lucida sans unicode, sans-serif;
}
DT
{
	margin-left: 2em;
	margin-right: 1em;
	font-style: normal;
	font-weight: bolder;
	text-align: left;
	font-size: 1em;
	line-height: 1.1em;
	color: white;
	font-family: Lucida sans unicode, Lucida sans unicode,Lucida sans unicode, sans-serif;
}
DD
{
	margin-left: 1.5em;
	margin-right: 1.5em;
	font-style: normal;
	text-align: left;
	font-size: 0.85em;
	line-height: 1.5em;
	color: #000000;
	font-family: Lucida sans unicode, Lucida sans unicode,Lucida sans unicode, sans-serif;
}
TD
{
	font-style: normal;
	font-size: 1em;
	vertical-align: top;
	font-family: Lucida sans unicode, Lucida sans unicode,Lucida sans unicode, sans-serif;
	text-align: left;
}
INPUT
{
	cursor: pointer;
}
.scroll
{
	overflow: scroll;
/*scrollbar-3dlight-color: Black*/
	scrollbar-face-color: #5B9C71;
}
.shorter
{
	width: 20%;
	font-size: 1em;
}
.longer
{
	background-color: #556B2F;
	width: 75%;
	color: #FFFFFF;
	border: 1px solid #006400;
	border-style: outset;
	font-size: 0.9em;
	font-family: Lucida sans unicode, Lucida sans unicode,Lucida sans unicode, sans-serif;
	padding: 5px;
	margin: 0;
}
.redtext
{
	font-size: 1.1em;
	font-weight: normal;
	font-family: Lucida sans unicode, Lucida sans unicode,Lucida sans unicode, sans-serif;
	color: red;
	padding: 0;
	margin: 0;
	text-decoration: none;
	text-align: center;
	font-variant: small-caps;
}
.boldtext
{
	font-style: normal;
	font-weight: bolder;
	font-size: 1.25em;
	line-height: 1em;
	color: #000000;
	font-family: Lucida sans unicode, Lucida sans unicode,Lucida sans unicode, sans-serif;
}


/*THIS IS THE BEGINNING OF THE STYLING
.cssfly {
font-family: Tahoma, "Trebuchet MS", Verdana, sans-serif;
position:relative; 
font-size:1em; 


width: 100%;
	height: 200%;
	padding-right: 1em;
	padding-left: 1em;
	padding-top: 1em;
	padding-bottom: 2em;
	text-align: left;
	line-height: 1.25em;
	left: 1%;
	color: silver;
}
.cssfly ul li a, .menu ul li a:visited {
display:block;
text-decoration:none; 
color:black; 
width:100%;
height:20px;
text-align:left; 
border:1px solid #fff;
border-width:1px 1px 0 0; 
background: transparent;
color:black;
line-height:1.25em; 
font-size:1em;
}
.cssfly ul 
{
padding:0; 
margin:0;
list-style-type: none; 
}
.cssfly ul li 
{
/*float:left;
margin-left:20%; 
position:relative;
}
.cssfly ul li ul 
{
display: none;
}
/*THIS IS THE END OF THE STYLING*/
/*START FLYING HERE*/
/*.cssfly ul li:hover a 
{
color:blue; 
background:#f4f4f4;
}
.cssfly ul li:hover ul 
{
display:block; 
position:absolute; 
top:0;
right:99%; 
width:100%;
}
.cssfly ul li:hover ul li a.hide 
{
background:#e3e3e3;
color:black;
}
.cssfly ul li:hover ul li:hover a.hide 
{
width:100%;
}
.cssfly ul li:hover ul li ul {display: none;}
.cssfly ul li:hover ul li a {
display:block; background:silver; color:black; width:99%;
}
.cssfly ul li:hover ul li a:hover {background:#e3e3e3; color:blue;}
.cssfly ul li:hover ul li:hover ul {
display:block; position:absolute; right:99%; top:0; color:black;
}
.cssfly ul li:hover ul li:hover ul li a {
display:block; width:100%; background:silver; color:black;
}
.cssfly ul li:hover ul li:hover ul li a:hover {background:#e3e3e3;
color:blue;
}*/
/*delete this when you know it isn't helpful
#imagewrapper
{
	background-color: transparent;
	color: white;
	position:static;
	max-width:75%;
	height: auto;
	margin-top:2.5%;
	margin-left:.5%;
	overflow-style:marquee;
	
	/*	Scale the images on hover
	-webkit-transform: scale(1.25);
  -moz-transform: scale*/
	}
/*#image1
{
	float: left;
	background-color: transparent;
	color: white;
	width:29%;
	height: auto;
	margin-top:1.5%;
	
}
#image2
{
	background-color: transparent;
	color: white;
	float: left;
	width:25.25%;
	height: auto;
	margin-top:1.5%;
	margin-left:1%;
}
#image3
{
	background-color: transparent;
	color: white;
	float: left;
	width:29%;
	height: auto;
	margin-top:1.5%;
	margin-left:1%;
	}*/