
	@font-face{
		font-family: paragraphs;
		src: url('../css/webfonts/proximanova-regular-webfont.ttf');
	}

	
	@font-face{
		font-family: headers;
		src: url('/content/fonts/bernier.ttf');
	}
	
	@font-face{
		font-family: awesome;
		src: url('/content/fonts/fontawesome-webfont.woff'),
			 url('/content/fonts/fontawesome-webfont.woff2');
	}

				
			
				
				
				body::before {    
						  content: "";
						  background: url("/content/background.jpg") repeat-y fixed center;		
						  background-size: cover;
						  position: absolute;
						  top: 0px;
						  right: 0px;
						  bottom: 0px;
						  left: 0px;
						  opacity: 0.15;
					}
					
				body{
				padding: 0px;
				font-family: headers;
				text-transform:	lowercase;
				opacity: 1;
				background-color: black;
				color: white;
				height: 100vh;
				margin: 0px;
				

				}
				

div#wrapper{
	height: 100%;
	 position: absolute;
	 width: 100%;
}

table#bingo{	

font-size: 80px;
width: 100%;	
 border-collapse: collapse;
  // margin: 0 auto;
  
}
div#tableGrid{
width: 70%;
float: left;	
background-color: ;
	
}
.gameControls{
font-size: 80px;
margin: 5px 5px;

}

.gameControlSmall{
font-size: 40px;
margin: 5px 5px;

}

.gameControls:hover, .gameControlSmall:hover{
cursor:pointer;	
color: rgba(255, 0, 0, 0.5);
	
}

div#headerStuff{
	
width: 98%;
height: 130px;
}


span#title{
font-size: 100px;
margin: 5px 5px;
	
}

.right{
	float: right;
	}

table#bingo td{	
	text-align: center;
	border: 1px solid white;
	height: 140px;
	
}

table#bingo td span{	
font-size: 40px;
margin-bottom: 16px;	
}

h1{
text-align:center;
font-size: 100px;
margin: 5px 5px;
}

#checkCard:hover{
cursor: pointer;
}

td:hover{	 
cursor:pointer;
background-color: rgba(255,255,255, 0.3);	
}

td.letter{	
background-color: rgba(255, 178, 0, 1.0);
color: white;	
}

td.selected{	
	
}

 @keyframes blink { 
  
            0%, 
            100% { 
                background-color: rgba(255, 178, 0, 1.0);
                /* First color - red */ 
            } 
  
            50% { 
                background-color: black; 
                /* Second color - black */ 
            } 
        }



td.selected:hover{	
background-color: rgba(255,0,0, 0.3);
color: white;	
}

td.notSelected{	
color: white;	
}

div.clear{
	
	
clear:both;
}

div#prizes{
float: right;
width: 30%;	
background-color: ;
margin: auto;
height: 715px;
	
}

div.prize{

float: left;
width: 49%;
height: 170px;
margin-left: 5px;
position: relative;
margin-bottom: 5px;	
text-align:center;
font-size: 140px;
line-height: 170px;	
}

div.prize_on{
background-color: white;);	
}

div.prize_off{
background-color: rgba(255, 178, 0, 0.7);	
}


div.prize_off:hover, div.prize_on:hover{
cursor:pointer;
}
input.winner_name{
	position: absolute;
    left: 0px;
    top: 0px;
	display: none;
	width: 75%;
	border: none;
	font-size:30px; 
	
}
input.winner_name:focus{
outline: none;
}

input.submit_winners{
	position: absolute;
    right: 0px;
    top: 0px;
	display: none;
	width: 25%;
	border: none;
	font-size:30px; 
	background-color: rgba(255, 178, 0, 1);
	font-family: headers;
	color: white;	
	text-transform: lowercase;
	
}
input.submit_winners:hover{
	cursor:pointer;
	background-color: rgba(255, 178, 0, .7);
	
}



.prize_num{	
  position: absolute;
  top: 0px;
  left: 0; 
  color: red;
  display: block;
  text-align:center;
  width: 100%;
  font-size: 40px;
  line-height: 130px;	
}

div.form_elements{
height: 40px;
border-bottom: solid 1px #adadad;
display: none;
	
}



img.prize{

width: 250px;
height: 125px;
margin: auto;
margin-top: 0px;
}

select#gameType{
font-size: 30px;
float: right;
margin-top: 5px;
color: black;
	
}

li{

font-size: 40px;
color: white;	
line-height: 90px;
text-align: center;

}

input.num_field{
font-size: 8px;
color: black;	
}

div.numSquare{
	
	
}

div.selected{
	
	background-color: rgba( 255, 178, 0, 1.0);
    color: white;	
	border-radius: 50%;
	box-shadow: 6px 6px 8px #333;
}


div.last{
	 color: white;	
	 border-radius: 50%;
	animation: blink 1s linear infinite;
	box-shadow: 6px 6px 8px #333;
}

img.lightbox{
	
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);	
	max-height: 600px;
}

h2{
color: black;
font-size: 40px;	
	
}

ui{

font-size: 40px;	
	
}