/* SALE  modal*/
@media screen and (max-width: 1921px) {

  .modal-content {
    max-width: 420px;
    max-height: auto;
  }

  .p-grid1 {
    font-size: 22px;
  }

  .p-grid3 {
    font-size: 13px;
  }

  .p-grid4 {
    font-size: 11px;
  }

  .cena {
    font-size: x-large;
    padding: 4px 8px;
    margin-top: 8px;
  }

  .p-grid5 button,
  .p-grid5 a {
    font-size: large;
  }

  .p-grid6 {
    font-size: 12px;
  }
}

/* --- 1024 --- */
@media screen and (max-width: 1025px) {
  .p-grid1 {
    font-size: 16px;
  }

  .p-grid3 {
    font-size: 14px;
  }

  .p-grid4 {
    font-size: 11px;
  }

  .cena {
    font-size: 24px;
  }

  .p-grid5 {
    font-size: 20px;
  }

  .p-grid6 {
    font-size: 10px;
  }
}

/* --- 768 --- */
@media screen and (max-width: 769px) {
  .p-grid1 {
    font-size: 16px;
  }

  .p-grid3 {
    font-size: 14px;
  }

  .p-grid4 {
    font-size: 11px;
  }

  .cena {
    font-size: 22px
  }

  .p-grid6 {
    font-size: 11px;
  }

}

/* --- 600 --- */
@media screen and (max-width: 601px) {
  .p-grid1 {
    font-size: 24px;
  }

  .p-grid3 {
    font-size: 22px;
  }

  .p-grid4 {
    font-size: 22px;
  }

  .p-grid6 {
    font-size: 14px;
  }

  .cena {
    font-size: 12px
  }
}

/* --- 480 --- */
@media screen and (max-width: 481px) {
  .p-grid1 {
    font-size: 18px;
  }

  .p-grid3 {
    font-size: 14px;
  }

  .p-grid4 {
    font-size: 11px;
  }

  .cena {
    padding: 4px 8px;
    font-size: 19px;
  }

  .p-grid6 {
    font-size: 12px;
  }

}

/* BASE */
/* .modal {
    margin-top: 70px;
  } */

.page-grid {
  padding: 2px;
  display: grid;
  grid-template-columns: 70% 30%;
}

/* 1 */
.p-grid1 {
  grid-column: span 2 / span 2;
  background-color: #046;
  padding-left: 4px;
}

.p-grid1 .btn {
  background-color: #013;
}

/* img */
.p-grid2 {
  grid-row: span 3 / span 3;
  grid-row-start: 2;
  background-color: #013;
}

.p-grid2 img {
  padding: 8px;
  filter: drop-shadow(8px 8px 10px aqua);
}

/* small */
.img-small {
  bottom: 10px;
  left: 2px;
}

.img-small img {
  max-width: 40%;
  height: auto;
  background-color: #024;
  filter: drop-shadow(4px 4px 10px black);
  border: aqua solid 1px;
}

.img-small img:hover {
  transform: scale(1.4);
}

.p-grid3 {
  grid-row-start: 2;
  flex-wrap: wrap;
  align-content: center;
  text-align: center;
  background-color: #013;
  text-shadow: aqua 0px 0px 8px;
  color: #ccc;
}

/* В наявності */
.p-grid4 {
  grid-column-start: 2;
  grid-row-start: 3;
  align-content: center;
  text-align: center;
  background-color: #013;
  text-shadow: aqua 1px 1px 8px;
  color: yellow;
  font-style: italic;
}

.cena {
  width: 100%;
  margin-bottom: 8px;
  font-family: Georgia, serif;
  font-weight: 600;
  background-color: #eee;
  text-shadow: aqua 1px 1px 1px;
  color: #000;
  text-align: center;
}

.p-grid5 {
  grid-column-start: 2;
  grid-row-start: 4;
  display: flex;
  flex-wrap: wrap;
  align-content: flex-end;
  background-color: #013;
}

.p-grid5 button,
.p-grid5 a {
  width: 100%;
  margin-bottom: 8px;
  align-items: center;
  padding: 4px 8px;
  font-size: medium;
}

.button.btn51 {
  background-color: #003144;
}

.button.btn52 {
  background-color: #003f58;
}

.button.btn53 {
  background-color: #057;
}

.p-grid6 {
  grid-column: span 2 / span 2;
  grid-row-start: 5;
  background-color: #046;
  text-align: justify;
  text-shadow: black 1px 1px 1px;
  padding: 0 4px;
  overflow: hidden;
  align-content: center;
}

.baner {
  color: #fff !important;
  background-color: #035 !important
}