html 
{
	height: 100%;
}

body 
{
	margin: 0;
	padding: 0;
	height: 100%;
}

#header 
{
	position: absolute;
	height: 10%; 
	width: 100%;
	
	background: -webkit-linear-gradient(right, white, rgba(0,60,0,0.15)); /* For Safari */
	background: -o-linear-gradient(right,  white, rgba(0,60,0,0.15)); /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(right,  white, rgba(0,60,0,0.15)); /* For Firefox 3.6 to 15 */
	background: linear-gradient(to right,  white, rgba(0,60,0,0.15)); /* Standard syntax (must be last) */
}

#headertext
{
	text-align: left;
	vertical-align: middle;
	color: rgba(160,160,160,1);
    font-weight: bold;
}
	
#maincontainer
{
	position:fixed;
	top: 10%;
	bottom: 10%;
	height: 80%;
	width: 100%;
	display:block;
    text-align: center;
	
	background: -webkit-linear-gradient(right, white , rgba(0,60,0,0.15)); 
	background: -o-linear-gradient(right, white, rgba(0,60,0,0.15));
	background: -moz-linear-gradient(right, white, rgba(0,60,0,0.15));
	background: linear-gradient(to right, white , rgba(0,60,0,0.15));
}

#badgecontainer
{
	width: 350px;
	height: 400px;
	display: inline-block;
}

#gametitle
{
	color: hsla(80, 90%, 40%, 0.7);
	font-size: xx-large;
	font-weight: bold;
	text-shadow:2px 2px 2px #000000;
	text-align: center;
	padding: 10px;
}

#gamedesc
{
	color: rgba(0,60,0,1);
	font-size: large;
	text-align: center;
	border:10px solid;
	border-radius:25px;
	background:#ffffff;
	box-shadow: 5px 5px 5px #888888;
	margin: 20px;
}

#gamedesctext
{
	color: rgba(60,60,60,1);
	font-size: medium;
	text-align: left;
	padding-left: 150px;
	padding-right: 150px;
	padding-top: 20px;
	padding-bottom: 20px;
}

#gamebadges
{
	color: rgba(0,60,0,1);
	font-size: large;
	text-align: center;
	padding: 10px;
}

img.gamebadge 
{
    display: block;
    margin-left: auto;
    margin-right: auto;
}

ul
{
	list-style-type:none;
	margin: 0;
	padding: 0;
}

a
{
	text-decoration: none;
	color: white;
}

a:hover
{
	text-decoration: none;
	color: rgba(0,60,0,1);
}

a.email
{
	text-decoration: none;
	color: rgba(0,60,0,1);
}

a.email:hover
{
	text-decoration: none;
	color: rgba(0,160,0,1);
}

a.normal
{
	text-decoration: none;
	color: rgba(0,60,0,1);
}

a.normal:hover
{
	text-decoration: none;
	color: rgba(0,160,0,1);
}

#menu {
	position: fixed;
    right: 0;
    top: 20%;
    width: 8em;
    margin: -2.5em 0 0 0;
    z-index: 5;
    background: hsla(80, 90%, 40%, 0.7);
    color: white;
    font-weight: bold;
    font-size: large;
    text-align: left;
    border: solid hsla(80, 90%, 40%, 0.5);
    border-right: none;
    padding: 0.5em 0.5em 0.5em 2.5em;
    box-shadow: 0 1px 3px black;
    border-radius: 3em 0.5em 0.5em 3em;
}

.tilt {
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
          transition: all 0.5s ease;
}
 
.tilt:hover {
  -webkit-transform: rotate(-10deg);
     -moz-transform: rotate(-10deg);
       -o-transform: rotate(-10deg);
      -ms-transform: rotate(-10deg);
          transform: rotate(-10deg);
}


#footer
{
	position: fixed; 
	bottom: 0; 
	height: 10%; 
	width: 100%;
	
	background: -webkit-linear-gradient(right, rgba(0,60,0,0.15), white);
	background: -o-linear-gradient(right, rgba(0,60,0,0.15), white);
	background: -moz-linear-gradient(right, rgba(0,60,0,0.15), white);
	background: linear-gradient(to right, rgba(0,60,0,0.15), white);
}

#footertext
{
	text-align: center;
	vertical-align: middle;
	color: rgba(100,100,100,1);
    font-weight: bold;
}