/* 020.Normalize.scss ++++++++++++++++++++++++++++++++++++++++++++++++ */
* {
  text-decoration: none;
  font-size: inherit;
  outline: none;
  padding: 0;
  margin: 0; }

code, kbd, samp, pre, tt, var, textarea,
input, select, isindex, listing, xmp, plaintext {
  font-size: 1em;
  font: inherit; }

dfn, i, cite, var, address, em {
  font-style: normal; }

th, b, strong, h1, h2, h3, h4, h5, h6 {
  font-weight: normal; }

a, img, a img, iframe, form, fieldset,
abbr, acronym, object, applet, table {
  border: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

th, td {
  vertical-align: top; }

caption, center {
  vertical-align: top;
  text-align: left; }

body {
  background: white;
  line-height: 1;
  color: black; }

q {
  quotes: "" ""; }

ul, ol, dir, menu {
  list-style: none; }

sub, sup {
  vertical-align: baseline; }

a {
  color: inherit; }

hr {
  display: none; }

font {
  color: inherit !important;
  font: inherit !important;
  color: inherit !important;
  /* editor's note: necessary? */ }

marquee {
  overflow: inherit !important; }

blink {
  text-decoration: none; }

nobr {
  white-space: normal; }

input, select, textarea {
  color: inherit; }

#report-abuse {
  display: none !important; }

*::before, *::after {
  font-size: 1em; }

textarea,
input[type="text"],
input[type="button"],
input[type="submit"] {
  -webkit-appearance: none;
  border-radius: 0;
  white-space: normal; }

/* 020.Normalize.scss ------------------------------------------------ */
/* 100.BaseStyles.scss ++++++++++++++++++++++++++++++++++++++++++++++++ */
/* 001.SCSSImport.scss ++++++++++++++++++++++++++++++++++++++++++++++++ */
body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer > #minus svg, body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer > #plus svg {
  -webkit-transition: all 0.2s ease-in;
  -moz-transition: all 0.2s ease-in;
  -o-transition: all 0.2s ease-in;
  transition: all 0.2s ease-in; }

/* 001.SCSSImport.scss ------------------------------------------------ */
*, *::before, *::after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

html {
  font-size: 16px; }
  html[data-in-wp-editor="no"] {
    background-color: #ffffff;
    color: #111111; }

::selection {
  color: transparent;
  background-color: blue; }

body {
  font-family: Arial, Verdana, sans-serif;
  font-weight: normal;
  font-style: normal;
  font-size: 16px;
  line-height: 1.6; }
  body[data-in-wp-editor="no"] {
    background-color: #ffffff;
    color: #111111; }
  body > #bodyOuter {
    max-width: 640px;
    margin: 0 auto;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
    user-select: none; }
    body > #bodyOuter > #bodyInner > h1 {
      text-align: center;
      margin: 5px 0 10px;
      font-size: 28px;
      font-weight: bold; }
    body > #bodyOuter > #bodyInner .dropdown-container {
      margin: 10px 0 0 0; }
      body > #bodyOuter > #bodyInner .dropdown-container option, body > #bodyOuter > #bodyInner .dropdown-container select {
        font-size: 16px;
        border: 3px solid transparent;
        border: 0;
        border-radius: 0;
        background-color: #cccccc;
        font-family: "Courier New",Courier,monospace;
        font-weight: bold;
        color: #333; }
    body > #bodyOuter > #bodyInner > #sectionSelectionOuter {
      overflow: hidden; }
      body > #bodyOuter > #bodyInner > #sectionSelectionOuter > h1 {
        font-family: Michroma, sans-serif;
        color: #3b6081;
        font-size: 24px;
        text-align: center;
        padding: 10px 0 10px 0; }
      body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection {
        -webkit-transition: all 1s ease;
        -moz-transition: all 1s ease;
        -o-transition: all 1s ease;
        transition: all 1s ease;
        color: #dddddd;
        margin: 0 auto;
        text-align: center;
        width: 250px;
        border: 2px solid #222;
        background-color: #333; }

@-webkit-keyframes oddNumberTapAnimation {
  0% {
    background-color: #333; }
  50% {
    background-color: #555; }
  100% {
    background-color: #333; } }

@-moz-keyframes oddNumberTapAnimation {
  0% {
    background-color: #333; }
  50% {
    background-color: #555; }
  100% {
    background-color: #333; } }

@-o-keyframes oddNumberTapAnimation {
  0% {
    background-color: #333; }
  50% {
    background-color: #555; }
  100% {
    background-color: #333; } }

@keyframes oddNumberTapAnimation {
  0% {
    background-color: #333; }
  50% {
    background-color: #555; }
  100% {
    background-color: #333; } }

@-webkit-keyframes evenNumberTapAnimation {
  0% {
    background-color: #333; }
  50% {
    background-color: #555; }
  100% {
    background-color: #333; } }

@-moz-keyframes evenNumberTapAnimation {
  0% {
    background-color: #333; }
  50% {
    background-color: #555; }
  100% {
    background-color: #333; } }

@-o-keyframes evenNumberTapAnimation {
  0% {
    background-color: #333; }
  50% {
    background-color: #555; }
  100% {
    background-color: #333; } }

@keyframes evenNumberTapAnimation {
  0% {
    background-color: #333; }
  50% {
    background-color: #555; }
  100% {
    background-color: #333; } }
        body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection.odd-number-tap {
          -webkit-animation: oddNumberTapAnimation 0.2s;
          -moz-animation: oddNumberTapAnimation 0.2s;
          -o-animation: oddNumberTapAnimation 0.2s;
          animation: oddNumberTapAnimation 0.2s; }
        body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection.even-number-tap {
          -webkit-animation: evenNumberTapAnimation 0.2s;
          -moz-animation: evenNumberTapAnimation 0.2s;
          -o-animation: evenNumberTapAnimation 0.2s;
          animation: evenNumberTapAnimation 0.2s; }
        body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bulb {
          width: 20px;
          height: 20px;
          border-radius: 50%;
          border: 2px solid #000;
          background-color: #888;
          margin: 10px auto; }
          body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bulb.bar {
            background-color: red; }
          body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bulb.beat {
            background-color: orange; }
        body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer {
          display: flex;
          align-items: center;
          justify-content: center;
          position: relative;
          height: 52px; }
          body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer > #bpmDigitsContainer {
            position: absolute;
            top: 0;
            height: 50px;
            border: 5px solid #000;
            border-radius: 5px;
            background-color: #000;
            min-width: 97px;
            display: none; }
            body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer > #bpmDigitsContainer > img {
              display: inline-block;
              height: 100%;
              width: 29px; }
          body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer > #minus, body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer > #plus {
            display: none;
            color: #aaa; }
            body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer > #minus svg, body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer > #plus svg {
              width: 26px;
              height: 26px;
              width: 32px;
              height: 32px;
              cursor: pointer; }
            body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer > #minus:hover, body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer > #plus:hover {
              color: #ccc; }
          body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer > input#bpm {
            font-family: "Courier New",Courier,monospace;
            font-size: 30px;
            border: 3px solid transparent;
            border: 0;
            border-radius: 0;
            background-color: transparent;
            width: 200px;
            padding: 1px 2px;
            padding: 0;
            text-align: center;
            font-weight: bold;
            position: relative;
            caret-color: #ffffff; }
            body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer > input#bpm::placeholder {
              font-family: Arial, Verdana, sans-serif;
              font-size: 16px;
              line-height: 30px;
              color: #999999;
              text-align: center; }
            body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer > input#bpm.keep-tapping::placeholder {
              font-size: 18px;
              color: sandybrown;
              font-weight: normal; }
          body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer.bpm-set > #bpmDigitsContainer {
            display: block; }
          body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer.bpm-set > #minus, body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer.bpm-set > #plus {
            display: inline-block; }
          body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer.bpm-set > input#bpm {
            width: 90px;
            font-size: 47px;
            line-height: 1;
            width: 102px;
            color: transparent; }
        body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #tapContainer {
          padding: 10px 0 10px; }
          body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #tapContainer > #tap {
            display: inline-block;
            background-color: #333;
            line-height: 60px;
            width: 60px;
            cursor: pointer;
            border-radius: 50%;
            text-align: center;
            -moz-user-select: none;
            -khtml-user-select: none;
            -webkit-user-select: none;
            -o-user-select: none;
            user-select: none;
            box-shadow: inset -4px -4px 8px black, inset 8px 8px 16px rgba(255, 255, 255, 0.5); }
            body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #tapContainer > #tap:hover {
              color: #ffffff; }
            body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #tapContainer > #tap:active {
              box-shadow: inset -4px -4px 8px rgba(255, 255, 255, 0.5), inset 8px 8px 16px black; }
        body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #grooveContainer {
          -webkit-transition: all 1s ease;
          -moz-transition: all 1s ease;
          -o-transition: all 1s ease;
          transition: all 1s ease;
          font-family: "Courier New",Courier,monospace;
          font-weight: bold;
          border-radius: 10px;
          padding-bottom: 20px; }
        body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #muteContainer {
          padding: 0 0 20px 0; }
          body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #muteContainer > #muteunmute {
            display: inline-block;
            background-color: #333;
            cursor: pointer;
            border-radius: 10px;
            padding: 10px;
            text-align: center;
            -moz-user-select: none;
            -khtml-user-select: none;
            -webkit-user-select: none;
            -o-user-select: none;
            user-select: none;
            box-shadow: inset -4px -4px 8px black, inset 8px 8px 16px rgba(255, 255, 255, 0.5); }
            body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #muteContainer > #muteunmute:hover {
              color: #ffffff; }
            body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #muteContainer > #muteunmute:active {
              box-shadow: inset -4px -4px 8px rgba(255, 255, 255, 0.5), inset 8px 8px 16px black; }
  body #debugContainer {
    -moz-user-select: all;
    -khtml-user-select: all;
    -webkit-user-select: all;
    -o-user-select: all;
    user-select: all;
    color: red;
    white-space: pre; }

i, em {
  font-family: Arial, Verdana, sans-serif;
  font-weight: normal;
  font-style: italic; }
  i b, i strong, em b, em strong {
    font-family: Arial, Verdana, sans-serif;
    font-weight: 700;
    font-style: italic; }

b, strong {
  font-family: Arial, Verdana, sans-serif;
  font-weight: 700;
  font-style: normal; }
  b i, b em, strong i, strong em {
    font-family: Arial, Verdana, sans-serif;
    font-weight: 700;
    font-style: italic; }

#devicePixelRatio {
  width: 1px !important; }
  @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
    #devicePixelRatio {
      /* Retina-specific stuff here */
      width: 2px !important; } }

section.simple {
  max-width: 640px;
  margin: 0 auto;
  text-align: center;
  padding: 10px 16px; }
  section.simple h1 {
    font-size: 200%;
    font-weight: bold;
    margin-bottom: 15px; }
  section.simple p {
    margin: 10px 0; }
  section.simple a {
    text-decoration: underline; }

/* 100.BaseStyles.scss ------------------------------------------------ */
/* 105.Svg.scss ++++++++++++++++++++++++++++++++++++++++++++++++ */
/* 001.SCSSImport.scss ++++++++++++++++++++++++++++++++++++++++++++++++ */
body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer > #minus svg, body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer > #plus svg {
  -webkit-transition: all 0.2s ease-in;
  -moz-transition: all 0.2s ease-in;
  -o-transition: all 0.2s ease-in;
  transition: all 0.2s ease-in; }

/* 001.SCSSImport.scss ------------------------------------------------ */
svg.psof-standard {
  display: inline-block;
  font-size: inherit;
  height: 1em;
  width: 1em;
  overflow: visible;
  vertical-align: -.125em;
  fill: currentColor; }
  svg.psof-standard.fixed-width {
    text-align: center;
    width: 1.25em; }

/* 105.Svg.scss ------------------------------------------------ */
/* 140.FooterRow.scss ++++++++++++++++++++++++++++++++++++++++++++++++ */
/* 001.SCSSImport.scss ++++++++++++++++++++++++++++++++++++++++++++++++ */
body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer > #minus svg, body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer > #plus svg {
  -webkit-transition: all 0.2s ease-in;
  -moz-transition: all 0.2s ease-in;
  -o-transition: all 0.2s ease-in;
  transition: all 0.2s ease-in; }

/* 001.SCSSImport.scss ------------------------------------------------ */
.footer-credits {
  text-align: center;
  font-size: 11px;
  line-height: 18px;
  color: #c9c9c9;
  padding: 12px 0; }
  .footer-credits > .site-title {
    display: inline-block; }

#gotoTop {
  display: none;
  position: fixed;
  width: 40px;
  height: 70px;
  background-color: #000;
  font-size: 28px;
  line-height: 45px;
  text-align: center;
  color: #FFF;
  top: auto;
  left: auto;
  right: 20px;
  bottom: -30px;
  cursor: pointer;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  border-radius: 30px;
  -moz-transition: background-color .2s linear;
  -webkit-transition: background-color .2s linear;
  -ms-transition: background-color .2s linear;
  -o-transition: background-color .2s linear;
  transition: background-color .2s linear;
  opacity: 0.8;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-bottom: none; }
  #gotoTop:hover {
    background-color: black; }

/* 140.FooterRow.scss ------------------------------------------------ */
/* 999.WordPressAdminFix.scss ++++++++++++++++++++++++++++++++++++++++++++++++ */
/* 001.SCSSImport.scss ++++++++++++++++++++++++++++++++++++++++++++++++ */
body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer > #minus svg, body > #bodyOuter > #bodyInner > #sectionSelectionOuter > #sectionSelection > #bpmInputContainer > #plus svg {
  -webkit-transition: all 0.2s ease-in;
  -moz-transition: all 0.2s ease-in;
  -o-transition: all 0.2s ease-in;
  transition: all 0.2s ease-in; }

/* 001.SCSSImport.scss ------------------------------------------------ */
@media screen and (max-width: 600px) {
  #wpadminbar {
    position: fixed; } }

/* 999.WordPressAdminFix.scss ------------------------------------------------ */