@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,700,400italic,700italic);
@import url(http://fonts.googleapis.com/css?family=Ubuntu);
@import url(http://fonts.googleapis.com/css?family=Ubuntu+Mono);

body {

	width: 100%;

	margin: 0px;

	background-color: #000036;

/*	color: #ddd; */
  font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
  font-size: 16px;
  color: #fff;
  text-rendering: optimizeLegibility;
  
    background-image:  url('../image/background/foosball.jpg');
    background-size:   cover;                      /* <------ */
    background-repeat: no-repeat;
    background-position: center top; 
	background-attachment: fixed;
	
}

a {

	color: #056ef7;

	text-decoration: none;

}

b {
	color: #d4992c;
}

i {
	color: #d4992c;
}

h1 {
	font-size: 200%;
	color: #fc0;
	text-shadow: 0px 2px 2px rgba(0,0,0,0.5);
}

h2 {
	font-size: 150%;
	color: #ea0;
	text-shadow: 0px 2px 2px rgba(0,0,0,0.5);
}

h1, h2, h3 {
	margin: 0px;
	padding: 0px;
}

img {
	border: 0px;
}

div.icon {
	position: absolute;
	width: 256px;
	height: 256px;
	background-image: url('../image/stinger/stinger-256x256.png');
	left: 332px;
	top: -128px;
}

.icon a {
	width: 256px;
	height: 256px;
}

table, tr, th, td {
	padding: 0px;
	margin: 0px;
	border: 0px;
}

td {
	padding: 30px;
}




/* content */

div.main {
	position: relative;
	border-radius: 10px;
	width: 800px;
 	margin: 60px;
	margin-top: 200px;
	margin-left: auto;
	margin-right: auto;
 	padding: 60px;
	background-color: rgba(0,0,32,0.9);
	color: #ffffff;
	/*
	background-color: rgba(255,255,255,0.8);
	color: #000036;
	*/
	box-shadow: 0px 0px 20px rgba(0,0,0,1);

	border: 2px solid;
	border-color: rgba(255,255,255,.6);
	border-radius: 20px 20px 20px 20px;
	
}

div.menu-left {
	position: absolute;
	left: 60px;
	top: 60px;
	text-align: left;
	font-size: 80%;
	opacity: 0.5;
	color: rgba(255,192,0,0.3);
}

div.menu-right {
	position: absolute;
	right: 60px;
	top: 60px;
	text-align: right;
	font-size: 80%;
	opacity: 0.5;
	color: rgba(255,192,0,0.3);
}

div.content {
	margin: 0px;
	margin-top: 100px;
	padding: 0px;
}

div.footer {
	position: relative;
	text-align: center;
	font-size: 80%;
	opacity: 0.2;
}



.button-sumoboom { 
	background: url(http://stingergames.com/image/main/sumoboom-back.png) no-repeat 0 0; 
    background-size:   contain;                      /* <------ */
	width: 200px; 
	height: 200px; 
	border-radius: 36px;
}  
.button-sumoboom a { 
	background: url(http://stingergames.com/image/main/sumoboom-fore.png) no-repeat 0 0; 
    background-size:   contain;                      /* <------ */
	width: 200px; 
	height: 200px; 
	display: block; 
	border-radius: 32px;
	-webkit-transition: opacity .25s ease-in-out; 
	-moz-transition: opacity .25s ease-in-out; 
	-o-transition: opacity .25s ease-in-out; 
	transition: opacity .25s ease-in-out;
	opacity: 0;
}  
.button-sumoboom a:hover, 
.button-sumoboom a:focus { 
	opacity: 1; 
}	


.button-retrohockey { 
	background: url(http://stingergames.com/image/main/retrohockey-back.png) no-repeat 0 0; 
    background-size:   contain;                      /* <------ */
	width: 200px; 
	height: 200px; 
	border-radius: 36px;
}  
.button-retrohockey a { 
	background: url(http://stingergames.com/image/main/retrohockey-fore.png) no-repeat 0 0; 
    background-size:   contain;                      /* <------ */
	width: 200px; 
	height: 200px; 
	display: block; 
	border-radius: 32px;
	-webkit-transition: opacity .25s ease-in-out; 
	-moz-transition: opacity .25s ease-in-out; 
	-o-transition: opacity .25s ease-in-out; 
	transition: opacity .25s ease-in-out;
	opacity: 0;
}  
.button-retrohockey a:hover, 
.button-retrohockey a:focus { 
	opacity: 1; 
}	


.button-warcontrol { 
	background: url(http://stingergames.com/image/main/warcontrol-back.png) no-repeat 0 0; 
    background-size:   contain;                      /* <------ */
	width: 200px; 
	height: 200px; 
	border-radius: 36px;
}  
.button-warcontrol a { 
	background: url(http://stingergames.com/image/main/warcontrol-fore.png) no-repeat 0 0; 
    background-size:   contain;                      /* <------ */
	width: 200px; 
	height: 200px; 
	display: block; 
	border-radius: 32px;
	-webkit-transition: opacity .25s ease-in-out; 
	-moz-transition: opacity .25s ease-in-out; 
	-o-transition: opacity .25s ease-in-out; 
	transition: opacity .25s ease-in-out;
	opacity: 0;
}  
.button-warcontrol a:hover, 
.button-warcontrol a:focus { 
	opacity: 1; 
}	



.button-tablehockey { 
	background: url(http://stingergames.com/image/main/tablehockey-back.png) no-repeat 0 0; 
    background-size:   contain;                      /* <------ */
	width: 200px; 
	height: 200px; 
	border-radius: 36px;
}  
.button-tablehockey a { 
	background: url(http://stingergames.com/image/main/tablehockey-fore.png) no-repeat 0 0; 
    background-size:   contain;                      /* <------ */
	width: 200px; 
	height: 200px; 
	display: block; 
	border-radius: 32px;
	-webkit-transition: opacity .25s ease-in-out; 
	-moz-transition: opacity .25s ease-in-out; 
	-o-transition: opacity .25s ease-in-out; 
	transition: opacity .25s ease-in-out;
	opacity: 0;
}  
.button-tablehockey a:hover, 
.button-tablehockey a:focus { 
	opacity: 1; 
}	



.button-teamcanada { 
	background: url(http://stingergames.com/image/main/teamcanada-back.png) no-repeat 0 0; 
    background-size:   contain;                      /* <------ */
	width: 200px; 
	height: 200px; 
	border-radius: 36px;
}  
.button-teamcanada a { 
	background: url(http://stingergames.com/image/main/teamcanada-fore.png) no-repeat 0 0; 
    background-size:   contain;                      /* <------ */
	width: 200px; 
	height: 200px; 
	display: block; 
	border-radius: 32px;
	-webkit-transition: opacity .25s ease-in-out; 
	-moz-transition: opacity .25s ease-in-out; 
	-o-transition: opacity .25s ease-in-out; 
	transition: opacity .25s ease-in-out;
	opacity: 0;
}  
.button-teamcanada a:hover, 
.button-teamcanada a:focus { 
	opacity: 1; 
}	



.button-foosball { 
	background: url(http://stingergames.com/image/main/foosball-back.png) no-repeat 0 0; 
    background-size:   contain;                      /* <------ */
	width: 200px; 
	height: 200px; 
	border-radius: 36px;
}  
.button-foosball a { 
	background: url(http://stingergames.com/image/main/foosball-fore.png) no-repeat 0 0; 
    background-size:   contain;                      /* <------ */
	width: 200px; 
	height: 200px; 
	display: block; 
	border-radius: 32px;
	-webkit-transition: opacity .25s ease-in-out; 
	-moz-transition: opacity .25s ease-in-out; 
	-o-transition: opacity .25s ease-in-out; 
	transition: opacity .25s ease-in-out;
	opacity: 0;
}  
.button-foosball a:hover, 
.button-foosball a:focus { 
	opacity: 1; 
}	



.button-reboundrivals { 
	background: url(http://stingergames.com/image/main/reboundrivals-back.png) no-repeat 0 0; 
    background-size:   contain;                      /* <------ */
	width: 200px; 
	height: 200px; 
	border-radius: 36px;
}  
.button-reboundrivals a { 
	background: url(http://stingergames.com/image/main/reboundrivals-fore.png) no-repeat 0 0; 
    background-size:   contain;                      /* <------ */
	width: 200px; 
	height: 200px; 
	display: block; 
	border-radius: 32px;
	-webkit-transition: opacity .25s ease-in-out; 
	-moz-transition: opacity .25s ease-in-out; 
	-o-transition: opacity .25s ease-in-out; 
	transition: opacity .25s ease-in-out;
	opacity: 0;
}  
.button-reboundrivals a:hover, 
.button-reboundrivals a:focus { 
	opacity: 1; 
}	

