/*
 Theme Name:   BrainGames Theme
 Description:  GeneratePress child theme
 Author:       Belov Digital Agency
 Author URI:   https://belovdigital.agency
 Template:     generatepress
 Version:      1.0.0
 Text Domain: braingames
*/

/* Header */
.top-bar p {
  margin: 0;
}

.header-widget .widget > p {
  margin: 0;
}

#mobile-menu-control-wrapper {
  display: none;
}

.single-braingame .site-content {
  padding: 0 40px 40px 40px;
}

@media (max-width: 768px) {
  .single-braingame .site-content {
    padding: 0 20px 20px 20px;
  }
}

/* Single Braingame */

.single-braingame {
  width: 100%;
}

.single-braingame__game {
  width: 100%;
}

.single-braingame__featured-image {
  height: 400px;
  overflow: hidden;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  width: 100vw;
}

.single-braingame__featured-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.single-braingame__content {
  padding-top: 40px;
}

.single-braingame__content-text {
  margin-bottom: 40px;
}

.single-braingame__title {
  font-size: 30px;
  text-align: center;
}

/* Archive BrainGames */

.braingames__title {
  margin-bottom: 60px;
}

.braingames__items {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
}

.braingames__item {
  width: calc((100% / 3) - (40px * 2 / 3));
}

.braingames__item a {
  text-decoration: none;
}

@media (max-width: 768px) {
  .braingames__item {
    width: calc((100% / 2) - (40px / 2));
  }
}

@media (max-width: 480px) {
  .braingames__item {
    width: 100%;
  }
}

.braingames__item-image {
  height: 200px;
  background-color: darkgray;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  color: #fff;
  text-transform: uppercase;
  text-decoration: none;
  margin-bottom: 20px;
}

.braingames__item-image:hover img {
  transform: scale(1.1);
}

.braingames__item-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease-in-out;
}

.braingames__item-title {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 10px;
  color: #000;
}

.braingames__item-title:hover {
  color: #33C3F0;
}

.braingames__item-excerpt {
  font-size: 14px;
  color: #666;
}

/* Pagination */
.pagination .nav-links {
  display: flex;
  justify-content: center;
}

.pagination .page-numbers.current {
  color: #939393;
}

.pagination .page-numbers {
  color: #33C3F0;
  text-decoration: none;
  margin: 0 5px;
}

.pagination .page-numbers:hover {
  color: #000;
}