/*
    https://colorhunt.co/palette/162790
*/

/* Main Elements of the HTML page */
*{
  overflow: hidden;
  box-sizing: border-box;
}
body, html{
  background-color: #000;
  height: 100%;
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
  color: #eee;
  text-align: center;
}


.bee-flat body{
    margin:auto ;
    overflow: hidden;
}

.bee-flat #canvas{
    background-color: #00918e;
}
canvas{
  touch-action: none;
  display: none;
  cursor: none;
  z-index: 1;
}

/* Shop */
#shop_screen{
  position: relative;
  width: 100%;
  height:100%;
  background-color: black;
  display: none;
  z-index: 10;
  margin: auto;
  overflow: auto;
}

.shop-wrapper{
  background-color: #222;
  margin:20px;
}
#points{
  font-size: 16px;
}

#upgrade_speed, #upgrade_glider{
  background-color: #00918e;
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  font-weight: 800;
  margin:150px 20px 20px 20px;
}

#close_shop{
  background-color: #f00;
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  font-weight: 800;
  margin:150px 20px 20px 20px;
}

#short_funds, #max_reached{
  font-size: 16px;
  color: red;
}

/* Start Menu */
.start-wrapper{
  margin: 0;
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  text-align: center;
  width: 100%;
}
.game-title{
  font-size: 3rem;
}
.blink{
  animation: blinker 1s linear infinite;
  padding: 5rem;
  font-size: 3rem;
}
@keyframes blinker {
  50% {
    opacity: 0%;
  }
}