@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url("../assets/fonts/OpenSans/OpenSans-Regular.eot");
  src: url("../assets/fonts/OpenSans/OpenSans-Regular.eot?#iefix") format('embedded-opentype'), url("../assets/fonts/OpenSans/OpenSans-Regular.woff2") format('woff2'), url("../assets/fonts/OpenSans/OpenSans-Regular.woff") format('woff'), url("../assets/fonts/OpenSans/OpenSans-Regular.ttf") format('truetype');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: url("../assets/fonts/OpenSans/OpenSans-SemiBold.eot");
  src: url("../assets/fonts/OpenSans/OpenSans-SemiBold.eot?#iefix") format('embedded-opentype'), url("../assets/fonts/OpenSans/OpenSans-SemiBold.woff2") format('woff2'), url("../assets/fonts/OpenSans/OpenSans-SemiBold.woff") format('woff'), url("../assets/fonts/OpenSans/OpenSans-SemiBold.ttf") format('truetype');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: url("../assets/fonts/OpenSans/OpenSans-Bold.eot");
  src: url("../assets/fonts/OpenSans/OpenSans-Bold.eot?#iefix") format('embedded-opentype'), url("../assets/fonts/OpenSans/OpenSans-Bold.woff2") format('woff2'), url("../assets/fonts/OpenSans/OpenSans-Bold.woff") format('woff'), url("../assets/fonts/OpenSans/OpenSans-Bold.ttf") format('truetype');
}

body{
  background-color: #3498db;
  margin: 0;
  font-family: 'Open Sans', sans-serif;
  margin: 0 auto 0 auto;
  margin: 20px 0px 20px 0px; 
}

#game{ text-align: center; }
#game canvas{ margin: 0 auto; }

p{
  font-size:12px;
  text-decoration: none;
  color:#ffffff;
}

h1{
  color:#525252;
}

.login-form{
  background-color: white;
  padding: 20px;
  border-radius: 10px;
}

.login-form__input{
  background:#ecf0f1;
  border: #ccc 1px solid;
  margin-bottom:1rem;
}

.login-form__btn{
  background:#2ecc71;
  color:white;
  border: #27ae60 1px solid;
}

.login-form__btn:hover{
  background:#2CC06B; 
}