@font-face {
    font-family: 'SimpleWriting';
    src: url('../fonts/SimpleWriting.eot');
    src: url('../fonts/SimpleWriting.eot') format('embedded-opentype'),
         url('../fonts/SimpleWriting.woff2') format('woff2'),
         url('../fonts/SimpleWriting.woff') format('woff'),
         url('../fonts/SimpleWriting.ttf') format('truetype'),
         url('../fonts/SimpleWriting.svg#SimpleWriting') format('svg');
}

.examp {
	font-family:Arial;
	font-size:16px;
	color:blue;
	
}

.tie {

display:none;
font-size:40px;	
color:blue;	
}

.newgame {
display:none;
cursor:pointer;
font-size:25px;	
color:green;
background-color:#ccff66;
}

.newgame:hover {
background-color:yellow;
}

.foreground {
display:none;
z-index:100;
width:100%;
left:25%;
height:300px;
position:absolute;
background-color:red;
opacity:0;
left:0;
		
}

.main{
	position:relative;
	width:50%;
	left:25%;
}

body {
	background-color:#e3ffda;
	font-family:Arial;
	color:brown;
}

#indicator {
	display:none;
}

#demom2 {
	display:none;
}

.declare_state {
	font-size:25px;
	color:green;
	font-weight:800;
	
}


table {
font-size:85px;
border:none;
margin:0;
padding:0;
}


td {
position:relative;
margin:0;
padding:0;
color:blue;
font-family:SimpleWriting;
background-color:#fff3bc;
width:85px;
border:solid #6487c0 1.0px;
border-radius:10px;
border-bottom:solid #6487c0 3.0px;
border-left:solid #6487c0 2.0px;
height:80px;
cursor:pointer;

}

td:hover{
border:solid #2a56af 1.0px;
border-bottom:solid #2a56af 3.0px;
border-left:solid #2a56af 2.0px;
background-color:lightblue;
}

p {

	text-align:center;
	line-height:0;
}

td>p {
position:absolute;
left:17px;
top:-30px;
}

.notes {
   font-size:14px; 
}

@media screen and (max-width: 480px) {
    
    
img {
  width:250px;
  margin-left:0;   
  }  
    
 .examp {
	font-family:Arial;
	font-size:13px;
	color:blue;
}   
    
    
 .tie {
display:none;
font-size:30px;	
color:blue;	
}   
    
.newgame {
font-size:20px;	
}   
    
.main{
	width:100%;
	left:0;
} 

.notes {
   font-size:12px; 
}


    
}