html,
body {
  width: 1000px;
  height: 600px;
  font-size: 20px;
  background-color: white;
}

.navigation {
  top: 7rem;
  right: -6.6rem;
  gap: 0.25rem;
  transform: rotate(90deg);
}

.nav_item {
  font-size: 0.65rem;
  padding: 0.2rem 0.8rem;
  border-radius: 0rem 0rem 0.5rem 0.5rem;
}

.book {
  width: 500px;
  height: 600px;
  perspective: 6000px;
  top: 0rem;
  left: 50%;
}

.page {
  width: 500px;
  height: 600px;
}

.page .front,
.page .back {
  padding: 1.5rem 3rem;
}

.arrow {
  top: 60%;
  transform: translateY(-50%);
  font-size: 36px;
  padding: 0.5rem 0.25rem;
}

.prev {
  left: 0rem;
  border-radius: 0rem 0.5rem 0.5rem 0rem;
}

.next {
  right: 0rem;
  border-radius: 0.5rem 0rem 0rem 0.5rem;
}

.pagination {
  bottom: 0.5rem;
  right: 0.5rem;
  gap: 8px;
  flex-direction: column;
}

.dot {
  width: 0.5rem;
  height: 0.5rem;
}

/* PAGE 2 START */

.logo_container_loader {
  width: 11rem;
  height: 1.5rem;
}
.logo_container_page {
  width: 15rem;
  height: 3rem;
  position: absolute;
  transform: rotate(270deg);
  left: -6rem;
  bottom: 20.5rem;
}

/* PAGE 2 END */

/* PRODUCT CARD START */
.product_card {
  padding: 1rem 0.5rem;
}

.discount_container,
.product_info_container,
.product_price_container {
  gap: 0.25rem;
}

.discount_text,
.discount_percentage {
  font-size: 0.5rem;
  padding: 0.2rem 0.8rem;
  border-radius: 2rem;
}

.brand_name_container {
  height: 1.25rem;
}

.brand_name_text,
.brand_name_text_small {
  font-size: 16px !important;
}

.product_name_container {
  width: 100%;
  height: 1.25rem;
}

.product_name_text_small {
  font-size: 14.5px !important;
}

.product_name_text_big {
  font-size: 20px !important;
}

.current_price_container {
  width: 5rem;
  height: 2rem;
}

.current_price_text_small {
  font-size: 20px !important;
}

.original_price_container {
  width: 3rem;
  height: 2rem;
  margin-top: 0.5rem;
}

.original_price_text_small {
  font-size: 16px !important;
}

/* PRODUCT CARD END */

/* PRODUCT CARD 2x1 START */

.product_card_2x1 {
  height: 13.5rem;
  width: 19rem;
}

.product_card_2x1 .product_image_container {
  width: 100%;
  height: 8.5rem;
}

.product_card_2x1.discounted .product_image_container {
  width: 100%;
  height: 7.5rem;
}

.product_card_2x1 .brand_image_container {
  bottom: 12.5rem;
  right: -15rem;
  width: 3rem;
  height: 3rem;
}

/* PRODUCT CARD 2x1 END */

/* PRODUCT CARD 2x2 START */

.product_card_2x2 {
  height: 21.7rem;
  width: 14rem;
}

.product_card_2x2 .product_image_container {
  width: 100%;
  height: 19rem;
}

.product_card_2x2.discounted .product_image_container {
  width: 100%;
  height: 17rem;
}

.product_card_2x2 .brand_image_container {
  bottom: 2rem;
  left: 10.25rem;
  width: 2.5rem;
  height: 3rem;
}

/* PRODUCT CARD 2x2 END */

/* PRODUCT CARD 1x1 START */

.product_card_1x1 {
  height: 13.5rem;
  width: 9.5rem;
}
/*
.product_card_1x1 {
  height: 10.9rem;
  width: 6.9rem;
}
*/
.product_card_1x1 .discount_text,
.product_card_1x1 .discount_percentage {
  font-size: 0.35rem;
  padding: 0.15rem 0.5rem;
  border-radius: 2rem;
  width: 2.5rem;
  text-align: center;
}

.product_card_1x1 .product_info_container,
.product_card_1x1 .product_price_container {
  gap: 0.25rem;
  margin-bottom: 0.5rem;
}

.product_card_1x1 .brand_name_container_small {
  margin-top: 0.2rem;
  width: 5rem;
  height: 0.7rem;
}

.product_card_1x1 .product_name_container_small {
  width: 100%;
  height: 1rem;
}

.product_card_1x1 .current_price_container_small {
  width: 4rem;
  height: 1rem;
}

.product_card_1x1 .original_price_container_small {
  width: 3rem;
  height: 0.7rem;
  margin-top: -0.1rem;
}

.product_card_1x1 .product_image_container {
  width: 100%;
  height: 8rem;
}

.product_card_1x1.discounted .product_image_container {
  width: 100%;
  height: 7rem;
}

.product_card_1x1.discounted .brand_image_container {
  bottom: 12.75rem;
  left: 7rem;
  width: 1.6rem;
  height: 1.6rem;
}

.product_card_1x1 .discount_container {
  position: absolute;
  top: 0.5rem;
  left: 0.5rem;
  z-index: 10;
}

.product_card_1x1 .brand_image_container {
  bottom: 12.75rem;
  right: -6.6rem;
  width: 1.6rem;
  height: 1.6rem;
}

/* Promo Image Container Styling */
.promo_img_container_2x1 {
  height: 13.5rem;
  width: 19rem;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.promo_img_container_2x1 img.promo_image {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

/* Make sure parent container distributes content properly */
.pageSide {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* PRODUCT CARD 1x1 END */