body {
  font-family: 'Anton', sans-serif;
  position: relative;
  min-height: 100%;
  background: #2f3136;
  color: #fff;
}

/* .bg-danger {
  --mdb-bg-opacity: 1;
 
  background-color: #fce51e !important;
}

.text-danger {
  --mdb-text-opacity: 1;
 
  color: #fce51e !important
}

.btn-danger {
  --mdb-btn-bg: #fce51e;
  --mdb-btn-color: #fff;
  --mdb-btn-box-shadow: 0 4px 9px -4px #fce51e;
  --mdb-btn-hover-bg: #d1485f;
  --mdb-btn-hover-color: #fff;
  --mdb-btn-focus-bg: #d1485f;
  --mdb-btn-focus-color: #fff;
  --mdb-btn-active-bg: #c6445a;
  --mdb-btn-active-color: #fff;
  --mdb-btn-box-shadow-state: 0 8px 9px -4px rgba(220,76,100,0.3),0 4px 18px 0 rgba(220,76,100,0.2)
} */

/* .row {
  align-items: center;
} */
.navbar-dark .nav-item .nav-link {
  color: #fff;
}
.center-pt{
  margin: auto;
  /* height: 620px;
  width: 98%; */
  left: 0px;
  /* background-color: hsl(0deg 0% 0% / 40%); */
  position: relative;
  margin-top:0px;
  margin-bottom: 45px;
  padding: 10px;
  border-radius: 5px;
  max-width: 400px;

}
.cardHove:hover{
  border-width: 1px;
  border-style: solid;
  border-color: #ffdc82;
  box-shadow: 0 0 20px #fce51e;
}
.platform{
  margin: 10px;
  border-width: 2px;
  border-style: solid;
  border-color:#fff;
  cursor: pointer;
  background: #1e1f21;
  border-radius: 10px;
}
.platform:hover{
  border-width: 2px;
  border-style: solid;
  border-color: #fce51e;
}

.hvr-float {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-float:hover, .hvr-float:focus, .hvr-float:active {
  -webkit-transform: translateY(-8px);
  transform: translateY(-8px);
}

.badge-green {
  background: var(--color-success-background);
  color: var(--color-success);
}

.badge-red {
  background: var(--color-error-background);
  color: var(--color-error);
}

.badge-orange {
  background: var(--color-warning-background);
  color: var(--color-warning);
}

.badge-sale {
  background-color: var(--color-sale);
  color: var(--color-base-white);
  border-color: var(--color-sale);
}

.badge-stock {
   text-transform: uppercase;
  line-height: 1;

  display: inline-flex;
  align-items: center;
  border-radius: 2rem;
  padding: 0.3rem 1rem;
  height: 2rem;
  flex: none;
  max-width: 100%;
}

/* .card .badge-stock {
  margin-right: 0.5rem;
  height: auto;
  min-height: 2rem;
} */

.badge-stock-dot {
  width: 6px;
  height: 6px;
  display: block;
  flex: none;
  background: currentColor;
  border-radius: 50%;
  margin-right: 0.5rem;
}

.badge-stock-in {
  color:rgb(51 114 57);
  background: #ddf0df;
}

.badge-stock-out {
  color: var(--color-error);
  background: var(--color-error-background);
}

.badge-stock-warning {
  color: var(--color-warning);
  background: var(--color-warning-background);
}

.badge-preorder {
  background: var(--color-preorder-background);
  color: var(--color-preorder);
}

.card-footer-intro {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 1.5rem;
  grid-gap: 1rem;
}

.counter {
  display: flex;
  gap: 5px;
}
.counter li {
  display: flex;
  flex-direction: column;
  text-align: center;
}
.time {
  display: flex;
  justify-content: center;
  font-size: 15.4375px;
}
.time-label {
  font-size: 8.3125px;
  opacity: 0.75;
  font-weight: normal;
}
.h1, .prose h1:not(.h0,.h1,.h2,.h3,.h4,.h5,.h6) {
  font-size: var(--text-h1);
  line-height: 1.1;
}

video {
  /* max-width: 200PX; */
  /* max-height: 100vh; */
  border-radius: 8px;
  box-shadow: 0 0 20px rgba(0,0,0,.5);
  width: 20rem;
}
.item-video {
  cursor: pointer;
}
img, svg {
  vertical-align: middle;
  cursor: pointer;
  border-radius: 8px;
  box-shadow: 0 0 20px rgba(0,0,0,.5);
}

