@charset "UTF-8";
/* CSS Document */
* {
  font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif"
}
body, html {
  height: 100%;
}
.hero-image {
  /* Set a specific height */
  height: 50%;
  /* Position and center the image to scale nicely on all screens */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}
.shop-hero-image {
  background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("../images/shop-hero.png");
}
.credits-hero-image {
  background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("../images/credits-hero.png");
}
/* Place text in the middle of the image */
.hero-text {
  width: 60%;
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
}
.center {
  text-align: center;
}
.credits-row {
  background-color: white;
  box-shadow: 0 0 3px lightgrey;
  filter: drop-shadow(5px 5px 3px #D9D9D9);
  padding: 24px 24px 16px 24px;
  margin: 0 0 20px;
	  border-radius: 10px;
}
.coin-icon {
  padding: 5px;
}
.row-coin-icon {
  padding: 0 0 3px;
  width: 24px;
}
.row-heading {
  width: 100%;
  padding: 0 0 10px;
}
.btn-access {
  width: 88%;
  margin-right: 10px;
}
.shop-item {
  width: 100%;
}
.shop-item-label {
  padding-top: 20px;
  padding-bottom: 10px;
}
.buttonlink {
	color: white;
}
.buttonlink:hover {
	color: white;
}
.top-margin {
	margin-top: 120px;
}
.register-panel {
		border-radius: 10px;
	background-color: white;
  box-shadow: 0 0 3px lightgrey;
  filter: drop-shadow(5px 5px 3px #D9D9D9);
  padding: 24px 24px 16px 24px;

}
.register {
	margin: 5px 10px 5px 0;
}
.nav-item {
	padding: 0 10px 0 10px;
}