html,
body {
  height: 100vh;
  width: 100%;
  background-color: #000202;
  background-image: url(../uru-continents/uruimg.PNG);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-position: center;
  animation: planet 1s linear forwards;
  opacity: 0
}

@keyframes planet {
  from {
    opacity: 0
  }

  to {
    opacity: 1
  }
}

#uruimg img:hover {
  cursor: pointer;
  transform: scale(0.9);
  transition: all .4s ease
}

.random_countries:hover {
  cursor: pointer;
  transform: scale(1.25);
  transition: all .4s ease !important
}

.map-fade-in {
  -webkit-animation: map-fade-in 1.5s cubic-bezier(0.390, 0.575, 0.565, 1.000) .5s both;
  animation: map-fade-in 1.5s cubic-bezier(0.390, 0.575, 0.565, 1.000) .5s both
}

@-webkit-keyframes map-fade-in {
  0% {
    opacity: .7
  }

  100% {
    opacity: 1
  }
}

@keyframes map-fade-in {
  0% {
    opacity: .7
  }

  100% {
    opacity: 1
  }
}

@-webkit-keyframes map-fade-in-flower {
  0% {
    opacity: 0
  }

  100% {
    opacity: 1
  }
}

@keyframes map-fade-in-flower {
  0% {
    opacity: 0
  }

  100% {
    opacity: 1
  }
}

.bounce-in-top {
  -webkit-animation: bounce-in-top 1.1s both;
  animation: bounce-in-top 1.1s both
}

@-webkit-keyframes bounce-in-top {
  0% {
    -webkit-transform: translateY(-500px);
    transform: translateY(-500px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0
  }

  38% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    opacity: 1
  }

  55% {
    -webkit-transform: translateY(-65px);
    transform: translateY(-65px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in
  }

  72% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out
  }

  81% {
    -webkit-transform: translateY(-28px);
    transform: translateY(-28px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in
  }

  90% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out
  }

  95% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out
  }
}

@keyframes bounce-in-top {
  0% {
    -webkit-transform: translateY(-500px);
    transform: translateY(-500px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0
  }

  38% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    opacity: 1
  }

  55% {
    -webkit-transform: translateY(-65px);
    transform: translateY(-65px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in
  }

  72% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out
  }

  81% {
    -webkit-transform: translateY(-28px);
    transform: translateY(-28px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in
  }

  90% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out
  }

  95% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out
  }
}

@media(min-width:1200px) {
  .random_countries {
    width: 560px;
    height: 260px
  }
}

@media(min-width:992px) and (max-width:1199px) {
  .random_countries {
    width: 560px;
    height: 260px
  }
}

@media(min-width:768px) and (max-width:991px) {
  .random_countries {
    width: 560px;
    height: 260px
  }
}

@media(min-width:576px) and (max-width:767px) {
  .random_countries {
    width: 350px;
    height: 162px
  }
}

@media(max-width:575px) {
  .random_countries {
    width: 260px;
    height: 121px
  }

  #bike {
    transform: scale(0.8);
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    position: fixed
  }

  #clockCanvas {
    transform: scale(0.8) translate(-10%, 0)
  }
}

.yoga_clicked {
  background-color: grey !important;
  opacity: .8 !important
}

.random_countries-class {
  border: 2px solid #94b4a4;
  border-style: inset;
  border-radius: 12px;
  background-color: rgba(225, 225, 225, 0.5)
}

.leptir-earth {
  background-image: url(../uru-continents/leptir-earth.png);
  background-size: 100% 110%;
  background-repeat: no-repeat;
  background-position: center;
  position: relative;
  top: 5px
}

.bih_init {
  background-image: url(../uru-continents/random_countries/BiH_mapa_random.PNG);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  position: relative;
  top: 10px
}

#bihborder {
  position: absolute;
  top: 10px;
  left: 0;
  right: 0;
  display: block;
  z-index: 199;
  background-image: url(../uru-continents/checkover.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center
}

#bihborder:hover {
  transform: scale(0.95);
  transition: background .6s ease;
  cursor: pointer
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  border-bottom-color: #7e97a6;
  -webkit-text-fill-color: white;
  -webkit-box-shadow: 0 0 0 1000px transparent inset;
  transition: background-color 5000s ease-in-out 0s
}