body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;
  margin: 0
}

code {
  font-family: source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace
}

@font-face {
  font-family: Tim Kid;
  font-weight: 400;
  src: local("Tim Kid"),url(../media/TimKid.8d31aefa05ec90584804.ttf) format("truetype")
}

body {
  background-color: #0f2f00!important;
  background-image: url(../media/top\ banner.47579195fe7f36146ae3.png);
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  font-family: Tim Kid
}

.hatlog img {
  width: 230px
}

.masasa:hover img {
  scale: 1.2
}

.masasa img,.masasa:hover img {
  transition: all .3s ease-in-out
}

.masasa img {
  margin: auto;
  width: 200px
}

.text-center {
  text-align: center!important
}

.masasa {
  background-color: initial!important;
  border: none;
  outline: none;
  width: max-content
}

@media (min-width: 768px) {
  .md\:justify-center {
      justify-content:center
  }
}

.home-btn:hover img {
  scale: 1.2;
  transition: all .3s ease-in-out
}

.home-btn img {
  transition: all .3s ease-in-out;
  width: 200px
}

.home-btn {
  left: 20px;
  position: absolute;
  top: 20px;
  z-index: 9
}

.lp-btn {
  background-color: #226d44!important;
  border-color: #fff!important;
  outline: none!important;
  text-shadow: 4px 0 #000,-4px 0 #000,0 4px #000,0 -4px #000,3px 3px #000,-3px -3px #000,3px -3px #000,-3px 3px #000
}

.back-btn {
  color: #ffad02;
  left: 20px;
  position: absolute;
  top: 20px
}

button {
  outline: none!important
}

.font-leper {
  color: #ffad02;
  padding-bottom: 30px;
  text-align: center;
  text-shadow: 4px 0 #000,-4px 0 #000,0 4px #000,0 -4px #000,3px 3px #000,-3px -3px #000,3px -3px #000,-3px 3px #000;
  text-transform: uppercase
}

.flipbtn {
  background-color: #ffad02!important;
  border: 3px solid #000!important;
  color: #000!important;
  font-family: Tim Kid;
  font-size: 20px;
  height: 43px;
  outline: none!important;
  padding-inline:16px!important;width: max-content!important
}

.h-hf {
  min-height: 100vh
}

.h-full {
  height: 100%
}

.mt-10 {
  margin-top: 2.5rem
}

.text-3xl {
  font-size: 1.875rem;
  line-height: 2.25rem
}

.font-pretty {
  font-family: Tim Kid
}

.gap-2 {
  gap: .5rem
}

.items-end {
  align-items: flex-end
}

.flex {
  display: flex
}

.w-\[200px\] {
  width: 200px
}

.h-\[70px\] {
  height: 70px
}

.mt-1 {
  margin-top: .25rem
}

.mb-10 {
  margin-bottom: 2.5rem
}

.z-20 {
  z-index: 20
}

.relative {
  position: relative
}

.min-h-\[450px\] {
  min-height: 450px
}

.items-center {
  align-items: center
}

.flex-col {
  flex-direction: column
}

.pt-2 {
  padding-top: .5rem
}

.px-8 {
  padding-left: 2rem;
  padding-right: 2rem
}

.transition-all {
  transition-duration: .15s;
  transition-property: all;
  transition-timing-function: cubic-bezier(.4,0,.2,1)
}

.shadow,.shadow-lg {
  box-shadow: 0 #0000,0 0 #0000,0 #0000,0 0 #0000,var(--tw-shadow);
  box-shadow: var(0 0 #0000,0 0 #0000),var(6 0 #0000,0 0 #0000),var(--tw-shadow)
}

.shadow {
  --tw-shadow: 0 1px 3px 0 #0000001a,0 1px 2px -1px #0000001a;
  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)
}

.opacity-100 {
  opacity: 1
}

.text-white {
  --tw-text-opacity: 1;
  color: #fff
}

.tracking-wide {
  letter-spacing: .025em
}

.text-2xl {
  font-size: 1.5rem;
  line-height: 2rem
}

.pt-3 {
  padding-top: .75rem
}

.py-1 {
  padding-bottom: .25rem;
  padding-top: .25rem
}

.px-6 {
  padding-left: 1.5rem;
  padding-right: 1.5rem
}

.bg-red,.bg-skin {
  --tw-bg-opacity: 1
}

.bg-red {
  background-color: rgb(237 43 32/var(--tw-bg-opacity))
}

.border-black {
  --tw-border-opacity: 1;
  border-color: rgb(0 0 0/var(--tw-border-opacity))
}

.border-4 {
  border-width: 4px
}

.rotate-0,.rotate-2 {
  transform: translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.rotate-0 {
  --tw-rotate: 0deg
}

.w-full {
  height: auto;
  width: 100%
}

.mx-auto {
  margin-left: auto;
  margin-right: auto;
  min-height: auto
}

[role=button],button {
  cursor: pointer
}

[type=button],[type=reset],[type=submit],button {
  -webkit-appearance: button;
  background-color: initial;
  background-image: none
}

@media (max-width: 768px) {
  .masasa img {
      width:150px
  }

  .home-btn img {
      width: 100px
  }

  .onmma {
      align-items: center;
      justify-content: center;
      margin: 0;
      max-height: 100vh;
      overflow: hidden
  }
}

@media (max-width: 500px) {
  .hatlog img {
      width:160px
  }
}

@media (min-width: 768px) {
  .md\:text-3xl {
      font-size:1.875rem;
      line-height: 2.25rem
  }

  .md\:pt-4 {
      padding-top: 1rem
  }

  .md\:py-2 {
      padding-bottom: .5rem;
      padding-top: .5rem
  }

  .md\:px-8 {
      padding-left: 2rem;
      padding-right: 2rem
  }

  .md\:pt-5 {
      padding-top: 1.25rem
  }

  .md\:pt-3 {
      padding-top: .75rem
  }

  .md\:mt-0 {
      margin-top: 0
  }

  .md\:text-5xl {
      font-size: 3rem;
      line-height: 1
  }

  .md\:gap-4 {
      gap: 1rem
  }

  .md\:w-\[300px\] {
      width: 300px
  }

  .md\:h-\[80px\] {
      height: 80px
  }

  .md\:mt-2 {
      margin-top: .5rem
  }
}

/*# sourceMappingURL=main.7f411585.css.map*/