.entry,
#answer {
   width: 2.8vw;
   /*50px;*/
   height: 2.8vw;
   /*50px;*/
   font-size: 1.9vw;
   /*30px;*/
   font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
   /* font-family: 'Courier New', Courier, monospace; */
   text-align: center;
   text-transform: capitalize;
   border-radius: .2vw;
   margin: 0.1vw;
   border: 0.01vw solid black;
   /* touch-action: none; */

}
.disable-dbl-tap-zoom {
    touch-action: manipulation;
  }
#banner {
   font-size: 2vw;
}

.pcts {
   background-color: white;
   padding-left: 3px;
   padding-right: 3px;
   border-radius: 2px;
}

#share-img {
   width: 3.5vw;
   margin: 1vw;
}

#top {
   /*30px;*/
   font-family: 'Oswald', sans-serif;
   font-size: 3vw;
   /*140px;*/
   text-align: center;
   /*40px;*/
   font-weight: 900;
}

#red {
   color: red;
   background-color: rgb(255, 251, 240);
}

#green {
   color: green;
   background-color: rgb(255, 251, 240);

}

#blue {
   color: blue;
   background-color: rgb(255, 251, 240);

}

li {
   color: rgb(255, 230, 0);
   padding: 1vw;
   font-size: 1.9vw;
}

h2 {
   margin-top: 3vw;
   margin-left: 6vw;
   background-color: darkolivegreen;
   color: blanchedalmond;
   margin-right: 6vw;
   text-align: left;
   font-size: 1.5vw;
   font-family: 'Quicksand', sans-serif;
}

.arrow {
   font-size: 1vw;
}

.nums {
   font-size: 2vw;
   margin-right: .5vw;
}

.color-buttons {
   width: 23vw;
}

button {
   margin-left: 0.2vw;
   font-family: 'Oswald', sans-serif;
   font-size: 1.3vw;
   width: 25vw;
   /*140px;*/
   height: 2.8vw;
   text-align: center;
   /*40px;*/
   border-radius: .6vw;
   border-width: 0px;
   font-weight: 900;
   /* touch-action: none; */
}

.enter {
   width: 10vw;
}


.b1:hover {
   /* width: 4%; */
   border: 5px solid white;
   transition: border .1s;
}

.smaller {
   width: 3.3vw;
   height: 3.3vw;
   border: 0.2vw solid black;
   /* touch-action: none; */

}

.b1 {
   width: 3vw;
   /* touch-action: none; */

}

#bottom-buttons {
   font-size: 5vw;
}

#share-img {
   width: 3.5vw;
}

#link {
   font-size: 3vw;
   margin-top: 2vw;
   font-family: 'Oswald', sans-serif;

}

img {
   width: 15.5vw;
}

#pulsing {
   box-shadow: 0 0 0 0 rgba(0, 0, 0, 1);
   transform: scale(2);
   animation: pulse 3s infinite;
}

#clear-btn {
   font-size: 1.9vw;
}

/* stats stuff:*/
#stats {
   width: 50vw;
   text-align: left;
   background-color: black;
   color: white;
   font-size: 1.4vw;
   font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}

.bar {
   height: 2vw;
}

.num {
   height: 2vw;
}

#circles-img {
   width: 25vw;
   margin-top: 10px;
}

@keyframes pulse {
   0% {
      transform: scale(1);
      box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.7);
   }

   70% {
      transform: scale(1.6);
      box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
   }

   100% {
      transform: scale(1);
      box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
   }
}

/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 120px) and (max-device-width : 480px) {
   #link {
      font-size: 3vh;
      margin-top: 4vh;
      font-family: 'Oswald', sans-serif;

   }

   #clear-btn {
      font-size: 2vh;
      width: 25vh;
      height: 5vh;
   }

   #stats {
      width: 70vw;
      text-align: left;
      background-color: black;
      color: white;
      font-size: 2vh;
      font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
   }

   .color-buttons {
      width: 11vh;
      height: 3.8vh;
      padding-top: 2px;
   }

   #share-img {
      width: 3.5vh;
      margin: 1vh;
   }

   .b1 {
      width: 6vh;
      /* touch-action: none; */

   }

   .bar {
      height: 4vw;
   }

   .bar-num {
      height: 4vw;

   }

   .num {
      height: 4vw;
   }

   /* #all-stats{
        width:47vw;
    } */
   .entry,
   #answer {
      width: 3.5vh;
      height: 3.5vh;
      font-size: 2.3vh;
      font-weight: 900;
      border-radius: .6vh;
      margin: 0.1vh;
      border: 0.1vh solid black;
   }

   .top-row {
      font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;

      width: 3.6vh;
      height: 3.6vh;
      font-size: 2.6vh;
      font-weight: 900;
      border-radius: .6vh;
      margin: 0.1vh;
      border: 0.1vh solid black;
      text-align: center;
   }

   h2 {
      margin-top: 3vh;
      margin-left: 6vh;
      margin-right: 6vh;
      font-size: 1.5vh;
   }

   .enter {
      width: 20vh;
      margin-top: 0.5vh;
      height: 5vh;
      font-size: 3.5vh;
   }

   .arrow {
      font-size: 1vh;
   }

   img {
      width: 32.5vh;
   }

   h1 {
      font-size: 8vh;
   }


   button {
      margin-left: 0.2vh;
      font-size: 1.6vh;
      width: 10vh;
      height: 3.6vh;
      border-radius: .6vh;
      border-width: 0px;
      color: black;
   }

   #circles-img {
      width: 15vh;
      margin-top: 10px;
   }

   .smaller {
      width: 4.5vh;
      height: 4.5vh;
      border: 0.2vh solid black;
      font-size: 2.7vh;
      margin: 0.3vh;
   }

   .smaller:hover {
      background-color: yellow;

   }


   .smaller:focus {
      background-color: yellow;
   }


   .smaller:active {
      background-color: yellow;
   }


   #title-words {
      font-size: 4vh;
   }

   .nums {
      font-size: 1.5vh;
      margin-right: .5vh;
   }
}

/* Smartphones (landscape) ----------- */
/* @media only screen and (min-width : 321px) {
   body {
      font-size: 2vh;
   }

   button {
      width: 28vh;
   }
} */

/* Smartphones (portrait) ----------- */
/* @media only screen and (max-width : 320px) {
   body {
      font-size: 2vh;
   }

   button {
      width: 28vh;
   }
} */

body {
   font-family: 'Quicksand', sans-serif;
   /* max-width: 800px; */
   font-size: 1vw;
   margin: 0px;
   background: white;
   padding: 0vw;
   text-align: center;
   /* touch-action: none; */

}



#title-words {
   font-size: 6vw;
}

h1 {
   font-family: 'Oswald', sans-serif;
   border-radius: 5px;
   font-size: 2vw;
}

.ar {
   font-family: 'Oswald', sans-serif;
   font-size: 2vw;
}

#answer {
   border: 0px;
}



/* 
@media(max-width: 767px) {
   a.entry {
      padding: 0.8em 0.3em !important;
      display: inline-block;
   }
} */