body {
  touch-action: manipulation;
  background-color: #b4bdc6 !important;
}

html {
  background-color: #b4bdc6 !important;
}

html.noScroll, body.noScroll {
  overflow-y: hidden !important;
}

#app {
  background-color: black;
  font-family: 'M PLUS Rounded 1c', sans-serif;
  color: white;
  font-size: 1em;
  font-weight: normal;
  padding-left: 10px;
  padding-right: 10px;
  margin: 0 auto;
  background-position: top center;
  background-size: 100%;
  background-repeat: repeat-y;
}

.v-dialog {
  padding-top: 6vw;
  position: relative;
  box-shadow: none !important;
}

.v-dialog:not(.v-dialog--fullscreen) {
  max-height: 100% !important;
}

.defaultBg {
  position: relative;
}

.defaultBg:before {
  content: '';
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;

  /* background: url('/images/sdk_back.jpg') center top no-repeat;
  background-size: 100% auto; */
}

/* @media screen and (min-width: 768px), print {
  .defaultBg:before {
    background-image: url('/images/sdk_back.jpg');
    background-size: cover;
  }
} */

.startBg:before {
  background-color: black !important;
  background-image: url('/images/start/bg.jpg') !important;
  background-attachment: fixed !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  animation: bgFadeInAnime 10s;
}

@keyframes bgFadeInAnime {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.introBaseBg {
  background-color: white !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.introBg {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.introBg:before {
  background-color: white !important;
  background-image: url('/images/intro/bg.jpg') !important;
  background-attachment: fixed !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  animation: bgFadeInAnime 2s;
}

.whiteBg {
  background-color: white !important;
}

.topBg {
  background-color: #b4bdc6 !important;
}

.mapBg {
  background-color: #242581 !important;
  background-image: url('/images/map/bg.jpg') !important;
  background-repeat: repeat !important;
  background-size: 39% !important;
}

.tegataBg {
  background-color: #227192 !important;
}

.rally1Bg {
  background-color: #a6e0f2 !important;
}

.rally2NextBg {
  background-color: #4c4948 !important;
  background-image: url('/images/rally2/bgnext.jpg') !important;
  background-attachment: fixed !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

.rally2Bg {
  background-color: #b3c37c !important;
}

.rally3Bg {
  background-color: #9c8a78 !important;
}

.rally4Bg {
  background-color: #251e1c !important;
}

.rally5Bg {
  background-color: #9cddf1 !important;
}



.presentBg {
  background-color: #480b48 !important;
  background-image: url('/images/present/bg.jpg') !important;
  background-repeat: repeat-y !important;
  background-position: top !important;
  background-attachment: fixed !important;

}