@import url("../node_modules/bootstrap/scss/_variables.scss");
:root {
  --blue: #46F4DB;
  --green: #57D272;
  --gradient: linear-gradient(var(--blue) 27%, var(--green) 100%);
  --red: #D13130;
  --gray-light: #EDEDF2;
  --gray-middle: #95959D;
  --gray-dark: #717178;
  --black: #07060B;
  --gray-deep: #37373E;
}

.header-logo {
  width: 100px;
}

.link {
  font-family: "Muller-Bold";
  font-size: 20px;
  text-decoration: none;
  color: var(--black);
  border-radius: 0;
}
.link:hover {
  color: var(--blue);
}
.link:active {
  --bs-btn-active-color: var(--green);
  --bs-btn-active-border-color: var(--green);
}

.btn {
  --bs-btn-font-size: 0;
}

.button-text {
  font-size: 16px;
  font-family: "Muller-Bold";
}

.header-button {
  background-color: var(--black);
  color: white;
  text-decoration: none;
  border: none;
}
.header-button:hover {
  background-color: var(--blue);
  color: var(--black);
}
.header-button:active {
  color: var(--black);
  background-color: var(--green);
}

.about {
  display: flex;
  align-items: center;
  height: 681px;
  background-color: var(--black);
  background-image: url("../images/stickers_hero.png");
  background-position: right;
  background-repeat: no-repeat;
}

.h-about {
  font-family: "RussoOne", sans-serif;
  color: white;
}

.btn-about {
  background: var(--gradient);
  border: none;
}
.btn-about:hover {
  background: var(--blue);
}
.btn-about:active {
  background: var(--green);
}

.btn-about-author {
  background-color: var(--black);
  color: white;
  border: 5px solid var(--blue);
}
.btn-about-author:hover {
  color: var(--black);
  background: var(--blue);
}
.btn-about-author:active {
  border: 5px solid var(--green);
  background: var(--green);
}

.btn-text-about {
  font-size: 20px;
  font-family: "Muller-Bold";
  border: none;
}

.about-img::after {
  overflow-x: hidden;
  background-image: url("../images/stickers_hero.png");
  width: 100%;
  height: 100%;
  content: " ";
  position: absolute;
  background-repeat: no-repeat;
}

.auction-text {
  font-size: 60px;
  font-family: "Muller-Bold", sans-serif;
}

.live-auction {
  border: 1px solid var(--red);
  color: var(--red);
}
.live-auction .bi-dot {
  color: var(--red);
}
.live-auction .live-auction-text {
  font-size: 16px;
  font-family: "RussoOne", sans-serif;
  color: var(--red);
}

.auction-img {
  width: 460px;
  height: 460px;
}

.card-auction {
  width: 228px;
  background-color: var(--gray-light);
}
.card-auction .card-imagine {
  width: 48px;
  height: 48px;
}
.card-auction .card-text {
  font-family: "Muller-Bold", sans-serif;
  font-size: 20px;
}

.auction-name-nft {
  font-family: sans-serif;
  font-weight: 400;
}

.card-auction-money {
  width: 300px;
  border: 1px solid var(--gray-light);
  background-color: var(--gray-light);
}
.card-auction-money .auction-money-h {
  font-size: 20px;
  font-family: "Muller-Bold", sans-serif;
}
.card-auction-money .money-crypto {
  font-size: 48px;
  font-family: "Muller-Bold", sans-serif;
}
.card-auction-money .money-dollar {
  font-size: 20px;
  font-weight: bold;
  color: var(--gray-middle);
}
.card-auction-money .money-dollar .money {
  font-size: 20px;
  font-family: "Muller-Bold", sans-serif;
}

.auction-time {
  background-color: var(--black);
}
.auction-time .time-h {
  color: white;
  font-size: 20px;
  font-family: "Muller-Bold", sans-serif;
}
.auction-time .time {
  color: white;
  font-size: 48px;
  font-family: "Muller-Bold", sans-serif;
}
.auction-time .clock {
  color: white;
  font-size: 20px;
  font-family: "Muller-Bold", sans-serif;
}

.btn-auction {
  width: 300px;
  background: var(--gradient);
  border: none;
}
.btn-auction .btn-auction-text {
  font-size: 20px;
  font-family: "Muller-Bold", sans-serif;
}
.btn-auction:hover {
  background: var(--blue);
}
.btn-auction:active {
  background: var(--green);
}

.h-other-auction {
  font-size: 20px;
  font-family: "RussoOne", sans-serif;
}

.card-other-auction-name .card-other-auction-ava {
  width: 24px;
  height: 24px;
}
.card-other-auction-name .card-other-auction-author {
  font-size: 16px;
}

.card-other-auction-container {
  width: 300px;
  height: 300px;
}
.card-other-auction-container .card-other-auction-top {
  background-color: var(--gray-light);
}
.card-other-auction-container .card-other-auction {
  background-color: var(--black);
}
.card-other-auction-container .card-other-auction .card-other-auction-name-nft {
  color: white;
  font-size: 20px;
  font-family: sans-serif;
  font-weight: bold;
}
.card-other-auction-container .card-other-auction .card-other-auction-money {
  color: var(--blue);
  font-size: 20px;
  font-family: "Muller-Bold", sans-serif;
}
.card-other-auction-container .card-other-auction .card-other-auction-time {
  color: var(--gray-middle);
  font-size: 16px;
  font-family: "Muller-Bold", sans-serif;
}
.card-other-auction-container .img-card-auction {
  width: 160px;
  height: 160px;
}

.btn-other-auction {
  background-color: white;
  color: white;
  border: 5px solid var(--blue);
  width: 200px;
}
.btn-other-auction:hover {
  color: var(--black);
  background: var(--blue);
}
.btn-other-auction:active {
  border: 5px solid var(--green);
  background: var(--green);
}
.btn-other-auction .btn-text-other-auction {
  color: var(--black);
  font-size: 20px;
  font-family: "Muller-Bold", sans-serif;
}

.h1-become-author {
  font-size: 60px;
  font-family: "RussoOne", sans-serif;
}

.p1-become-author {
  font-size: 20px;
  font-family: "RussoOne", sans-serif;
}

.p2-become-author {
  font-size: 20px;
  font-family: sans-serif;
  font-weight: 400;
}

.label-for-file {
  display: inline-block;
  width: 100%;
  height: 100%;
}

.bi-plus-circle:hover {
  fill: var(--blue);
}
.bi-plus-circle:active {
  fill: var(--green);
}

.text-type-file {
  color: var(--gray-middle);
  font-size: 20px;
  font-family: sans-serif;
}

.form-become-author {
  background-color: var(--gray-light);
}

.telega-input {
  background-color: var(--gray-light);
  width: 100%;
  font-size: 20px;
  font-family: sans-serif;
}
.telega-input::placeholder {
  color: var(--gray-dark);
  font-size: 20px;
}

.btn-become-author {
  width: 50%;
  background-color: var(--blue);
}
.btn-become-author .text-become-author {
  font-size: 20px;
  font-family: "Muller-Bold", sans-serif;
}
.btn-become-author:hover {
  background: var(--gradient);
}
.btn-become-author:active {
  background: var(--green);
}

.h-best-seller {
  font-size: 60px;
  font-family: "RussoOne", sans-serif;
  color: white;
}

.card-best-seller {
  background-color: var(--gray-light);
}

.card-ava {
  width: 24px;
  height: 24px;
}

.card-h {
  font-size: 16px;
  font-family: "Muller-Bold", sans-serif;
}

.card-name {
  font-size: 48px;
  font-family: "Muller-Bold", sans-serif;
}

.card-money {
  font-size: 20px;
  font-family: sans-serif;
  font-weight: bold;
}
.card-money span {
  color: var(--gray-middle);
}

.info-best-seller {
  background-color: var(--gray-deep);
}

.h-info-best-seller {
  font-family: "Muller-Bold", sans-serif;
  font-size: 24px;
  color: white;
}

.stage h2 {
  font-size: 18px;
  font-family: sans-serif;
  color: white;
}

footer {
  background-color: var(--blue);
}

.footer-link {
  font-family: "Muller-Bold";
  font-size: 20px;
  text-decoration: none;
  color: var(--black);
  border-radius: 0;
}
.footer-link:hover {
  color: var(--gray-deep);
}
.footer-link:active {
  --bs-btn-active-color: var(--black);
  --bs-btn-active-border-color: var(--black);
}

.reserved h1 {
  font-size: 12px;
  font-family: sans-serif;
  color: var(--gray-light);
}

@media (max-width: 1920px) {
  .about {
    height: 600px;
    background-image: url("../images/stickers_hero.png");
    background-position: right;
    background-repeat: no-repeat;
  }
}
@media (max-width: 1440px) {
  .about {
    height: 600px;
    background-image: url("../images/stickers_hero.png");
    background-position: 150%;
    background-repeat: no-repeat;
  }
}
@media (max-width: 1024px) {
  .about {
    height: 600px;
    background-image: url("../images/stickers_hero.png");
    background-position: 900%;
    background-repeat: no-repeat;
  }
  .live-auction-text {
    font-size: 12px;
  }
  .auction-text {
    font-size: 30px;
  }
  .auction-img {
    width: 300px;
    height: 300px;
  }
  .card-name {
    font-size: 20px;
    font-family: "Muller-Bold", sans-serif;
  }
}
@media (max-width: 768px) {
  .about {
    height: 500px;
    background-image: url("../images/stickers_hero.png");
    background-position: -250%;
    background-repeat: no-repeat;
  }
  .left-card {
    width: 100px;
    height: 100px;
  }
  .img-info-best-seller {
    width: 300px;
  }
}
@media (max-width: 320px) {
  .btn-link {
    font-size: 16px;
  }
  .about {
    height: 500px;
    background-image: url("../images/stickers_hero.png");
    background-position: 900%;
    background-repeat: no-repeat;
  }
}
@font-face {
  font-family: "Muller-Bold";
  src: url("../fonts/Muller-Trial-Bold.ttf");
  font-weight: bold;
}
@font-face {
  font-family: "RussoOne";
  src: url("../fonts/RussoOne-Regular.ttf");
  font-weight: 400;
}

/*# sourceMappingURL=style.css.map */