/* Break points */
/* Colors */
/* ====== */
/* Fonts */
@font-face {
  font-family: "Alphakind";
  src: url("../fonts/Alphakind.ttf") format("truetype"), url("../fonts/Alphakind.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
.games-page {
  height: -webkit-fill-available;
}

.games {
  padding: 120px 0;
  position: relative;
  overflow: hidden;
}
.games__container {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
@media (max-width: 1199.98px) {
  .games__container {
    padding: 0 30px;
  }
}
.games__title {
  color: #fff;
  font-size: 80px;
  text-align: center;
  text-shadow: 4px 4px 0 rgba(0, 0, 0, 0.65);
  margin-bottom: 100px;
}
@media (max-width: 767.98px) {
  .games__title {
    font-size: 32px;
  }
}
.games__construction {
  position: relative;
  border: 5px solid #ffda9a;
  border-radius: 20px;
  padding: 40px 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 2px 2px 0 0 rgba(0, 0, 0, 0.65);
  background: rgba(217, 217, 217, 0.46);
}
@media (max-width: 1199.98px) {
  .games__construction {
    box-sizing: border-box;
    width: 100%;
    margin-top: 100px;
  }
}
@media (max-width: 767.98px) {
  .games__construction {
    margin-top: 0;
  }
}
.games__construction-title {
  color: #fff;
  font-size: 80px;
  text-align: center;
  text-shadow: 4px 4px 0 rgba(0, 0, 0, 0.65);
}
@media (max-width: 767.98px) {
  .games__construction-title {
    font-size: 32px;
  }
}
.games__construction-pizzas {
  position: absolute;
  left: -215px;
}
@media (max-width: 1199.98px) {
  .games__construction-pizzas {
    left: -35px;
    top: -191px;
  }
  .games__construction-pizzas img {
    width: 294px;
  }
}
@media (max-width: 767.98px) {
  .games__construction-pizzas {
    left: -15px;
    top: -85px;
  }
  .games__construction-pizzas img {
    width: 126px;
  }
}
.games__construction-hero {
  position: absolute;
  right: -145px;
}
@media (max-width: 1199.98px) {
  .games__construction-hero {
    right: 0;
    top: -185px;
  }
  .games__construction-hero img {
    width: 204px;
  }
}
@media (max-width: 767.98px) {
  .games__construction-hero {
    right: 0;
    top: 110px;
  }
  .games__construction-hero img {
    width: 93px;
  }
}