/*------ BASIC FORMATTING ----------------------------------------------------*/
html{
  margin: 0 auto;
  border: 0 auto;
}


/*------ BLOCKING/LAYOUT -----------------------------------------------------*/
body{
  background-image: url("photos/twinkle.gif");
  background-size: 2000px;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-color: #F7F3DE;

  width: 80%;
  min-width: 800px;
  margin: 0 auto;
}

header{
  border: 10px;
}

main{
}

canvas#game{
/*border: 1px solid #f4f3ee;
margin-left:0 auto;
margin-right:0 auto;
width: 800px;
height: 600px;*/
}
aside{
  padding: 3%;
}
/*------ TYPOGRAPHY ----------------------------------------------------------*/
body{
  font-family: 'Quicksand', sans-serif;
  color: #f4f3ee;
}
p{
  font-family: 'Quicksand', sans-serif;
  color: #f4f3ee;
  line-height: 100%;
  margin: 30px;
  text-align: center;
}

h1{
  font-family: 'Press Start 2P', cursive;
  color: #f4f3ee;
  background-position:center;
  text-align: center;
}

a{
  font-color: #f4f3ee;
}

/*------ OTHER DESGINGING ----------------------------------------------------*/
img{
  width: 200px;
}
img:hover{
  width: 210px;
}


.a2{
  color: #f4f3ee;
  cursor: pointer;
}


.Choice1{
  font-family: 'Press Start 2P', cursive;
  animation-name: example;
  margin:50px;
  padding:50px;
  text-align: center;
  font-size: 24px;
}

.Choice2{
  font-family: 'Press Start 2P', cursive;
  animation-name: example;
  margin:50px;
  padding:50px;
  list-style-type:none;
  text-align: center;
  font-size: 24px;
  pointer-events: auto;
}

.Choice1:hover, .Choice2:hover{
  font-weight: bold;
  font-size: 30px;