/*@import "compass/css3";*/

body{
   text-align:center;
   //padding:10% 5%;
   background: whitesmoke;
   color: black;
   font-family: 'Inconsolata', monospace;
}

* {
    -webkit-tap-highlight-color: transparent;
}

/*.button {
  border: 0;
  background: transparent;
  box-sizing: border-box;
  width: 0;
  height: 74px;

  border-color: transparent transparent transparent #202020;
  transition: 100ms all ease;
  cursor: pointer;

  // play state
  border-style: solid;
  border-width: 37px 0 37px 60px;

  &.paused {
    border-style: double;
    border-width: 0px 0 0px 60px;
  }

  &:hover {
    border-color: transparent transparent transparent #404040;
  }
}*/

.title{
   width: 100%;
   font-size:xxx-large;
   font-family: 'Inconsolata', monospace;
   margin: 50px 0px 10px;
   //font-family: fantasy;
   font-weight: lighter;
}

.light{
   cursor:pointer;
   position: absolute;
   margin: -125px 0px 0px 100px;
   font-size: 60px;
   //transform: rotate(-25deg);
}

.dark-mode {
  background-color: #1b1b1b;
  color: white;
}

.btn{
    width: 250px;
   cursor:pointer;
   display:inline-block;
   font-variant-emoji: emoji;
   //padding:30px;
   height: 250px;
   background: #6F90C1;
   border-radius: 150px;
   color: #fff;
   font-size: 150;
   //text-transform:uppercase;
   line-height:250px;
   margin: 20px;
   @include transition(box-shadow .25s ease);
   /*&:after{
      content:'';
      display:inline-block;
      color: #94a657;
      background:#fff;
      font-family: 'FontAwesome';
      padding:3px;
      border-radius: 50%;
      height:20px;
      width:20px;
      margin-left:8px;
      padding-left: 4.5px;
      padding-right:1.5px;
   }
   &.playing{
       &:after{
         padding:3px;
         content:'';
      }
   }*/
}