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

.bg {
  /* The image used */
  background-image: url("img/revolting_web.jpg");

  /* Full height */
  height: 100%;

  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
#body
{
	background-color: black;
	color:#9B9FAB;
	border-radius: 10px;
	width: 100%;
	height: auto;
	 box-sizing: border-box;
	min-height:750px;
	margin-top:0%;
	margin-right:0%;
	margin-bottom:0%;
	margin-left:0%;
	font-size:1em;
	color:#9B9FAB;
	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*/
}
.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}

/*#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: #000000;
  color: white;
  padding: 16px;
  font-size: 1em;
  border: none;
}

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

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #1c1c1c;
  min-width: 160px;
  /*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;}

#playcontent
{
	position:fixed;
	top: 15%;
	left: 25%;
	width: 50%;
	height: auto;
	background-color: black;
	color: grey;
	/*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;
}	

/*#centre{
background-color: transparent;
	color: white;
	clear:both;
	width:auto;
	max-width: 100%;
	position:static;
	margin-top: 3%;
	margin-left:.5%;
	 box-sizing: border-box;

}
*/

#footer
{
	background-color: transparent;
	/*color: white;*/
	clear:both;
	width:auto;
	max-width: 100%;
	position:static;
	margin-top: 3%;
	margin-left:.5%;
	 box-sizing: border-box;
}

#rightside
{
	width: 50%;
	/*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;*/

}
* {
  box-sizing: border-box;
}

.header {
  border: 1px solid red;
  padding: 15px;
}

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

[class*="col-"] {
  float: left;
  padding: 15px;
  
}
.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}

@media only screen and (min-width: 600px) {
  /* For tablets: */
  .col-s-1 {width: 8.33%;}
  .col-s-2 {width: 16.66%;}
  .col-s-3 {width: 25%;}
  .col-s-4 {width: 33.33%;}
  .col-s-5 {width: 41.66%;}
  .col-s-6 {width: 50%;}
  .col-s-7 {width: 58.33%;}
  .col-s-8 {width: 66.66%;}
  .col-s-9 {width: 75%;}
  .col-s-10 {width: 83.33%;}
  .col-s-11 {width: 91.66%;}
  .col-s-12 {width: 100%;}
}


a
{
	color: #cfcfcf;
	font-family: Lucida Sans unicode;
}
a:visited
{
	color:#DAA94D;
}
/*img{
	width:auto;
	height:auto;
}*/
p
{
	font-size: 1.2em;
	font-family: calibri;
	padding: 5px;
	margin: 0;
}
.button {
  background-color:#052237;
  border: none;
  color: #052237;
  padding: .5em .5em;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 1.2em;
  margin: 1px 1px;
  cursor: pointer;
}
.title{
	font-size:2.6vw;
	line-height: .5vmax;	
}
.tagline{
font-size:1.1vw;
}
.centre
{
text-align:center;	
}
.label{
	font-size:1.5vw;
}
.justify{
	text-align:justify;
}
dfn{color: white;}
img {
 
  border-radius: 5px;

}
h1
{
	font-size: 1.3em;
	font-weight: normal;
	font-family: Lucida sans unicode;
	color: white;
	padding: 0;
	text-decoration: none;
	line-height: 1em;
}
h2
{
	font-size: 1.1em;
	font-weight: normal;
	font-family: Lucida sans unicode;
	color: white;
	padding: 0;
	margin: 0;
	line-height: 1.0em;
	text-decoration: none;
}
h3
{
	font-size: 1.0em;
	font-weight: normal;
	font-family: Lucida sans unicode;
	color: white;
	padding: 0;
	margin: 0;
	line-height: 1em;
	text-decoration: none;
}
ul
{
font-size: 1em;
	font-family: Lucida sans unicode;
	padding: 5px;
	margin: 0;	
}
#burgermenu {
  width: 35px;
  height: 5px;
  background-color: black;
  margin: 6px 0;
}
/*H4
{
	font-style: normal;
	font-weight: bolder;
	font-size: 1em;
	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;
}