.agi-box-container {
    display: flex;
    position: relative;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: space-between;
    max-width: 1110px;
    margin-left: auto;
    margin-right: auto;
}

.agi-col-25 {
    width: calc(25% - 10px);
    box-sizing: border-box;
    overflow: hidden;
    display: block;
    position: relative;
}

.agi-col-33 {
  width: calc(33.33% - 10px);
  box-sizing: border-box;
  overflow: hidden;
  display: block;
  position: relative;
}

.agi-box-a {
    display: block;
    position: relative;
}

.agi-box-a img {
    width: 100%;
    box-sizing: border-box;
    display: block;
    position: relative;
}

.agi-box-container .agi-box-bg {
    display: block;
    position: relative;
    box-sizing: border-box;
    width: 100%;
    padding: 10px;
    background-color: white;
    text-align: center;
}

.menu ul li, .agi-box-container, #carousel h2, #carousel h3,
.footer-container .h3, #carousel h4, .page-header h1,
.footer-container .h4, .card-block li

{
    font-family: "Tinos", serif !important;
}

.card-block li {
    margin-top: 8px;
}

#carousel {
    max-width: 100vw;
    overflow-x: hidden;
}


body {
    font-family: "Tinos", serif !important;
}



#search_widget {
    margin-left: 5px;
}

#strefa1 {
  font-size: 16px;
  display: block;
  position: relative;
  box-sizing: border-box;
  margin-bottom: 1rem;
  text-align: justify;
}


#strefa2 {
  font-size: 13px;
  display: block;
  position: relative;
  box-sizing: border-box;
  margin-left: 1rem;
  margin-bottom: 1rem;
  text-align: justify;
}


#strefa3 {
  font-size: 13px;
  display: block;
  position: relative;
  box-sizing: border-box;
  margin-left: 1rem;
  margin-bottom: 1rem;
  text-align: justify;
}


#strefa4 {
  font-size: 14px;
  display: block;
  position: relative;
  box-sizing: border-box;
  margin-bottom: 1rem;
  text-align: justify;

}


#strefa5 {
  font-size: 14px;
  display: block;
  position: relative;
  box-sizing: border-box;
  margin-bottom: 1rem;
  text-indent: 2rem;
  text-align: justify;

}


#strefa6 {
  font-size: 14px;
  display: block;
  position: relative;
  box-sizing: border-box;
  margin-bottom: 1rem;
  text-align: justify;

}


#strefa7 {
  font-size: 14px;
  display: block;
  position: relative;
  box-sizing: border-box;
  margin-bottom: 1rem;
  text-indent: 2rem;
  text-align: justify;

}


#strefa8 {
  font-size: 12px;
  display: block;
  position: relative;
  box-sizing: border-box;
  margin-left: 1rem;
  margin-bottom: 1rem;
  text-align: justify;
}


#strefa9 {
  font-size: 12px;
  display: block;
  position: relative;
  box-sizing: border-box;
  margin-bottom: 1rem;
  text-align: right;

}


#strefa10 {
  font-size: 14px;
  display: block;
  position: relative;
  box-sizing: border-box;
  margin-bottom: 1rem;
  text-indent: 2rem;
  text-align: justify;

}


#strefa11 {
  font-size: 12px;
  display: block;
  position: relative;
  box-sizing: border-box;
  text-align: right;
  width: 100%;
  margin-bottom: 1rem;

}





.agi-top-link {
  color: white !important;
}

.carousel {

}

#wrapper {
  padding-top: 0 !important;
}

.top-menu a:any-link {
  color: black !important;
  font-weight: 500 !important;
}
.top-menu a:any-link:hover {
  color: #8c3839 !important;
}


.page-content a:any-link {
  color: black !important;
}
.page-content a:any-link:hover {
  color: #8c3839 !important;
}

.black {
  color: #000000 !important;
}

.bordo {
  color: #8c3839 !important;
}

.btn-bordo {
  background-color: #8c3839 !important;
  color: white;
  box-shadow: 2px 2px 4px 0 rgba(0,0,0,.2);
  text-transform: uppercase;
  font-weight: 600;
  padding: .5rem 1.25rem;
}

.btn-bordo:hover {
  background-color: #491212 !important;
}

.btn-primary {
  background-color: #676767 !important;
  color: #ffffff;
}

.btn-primary:hover {
  background-color: #270202 !important;
}

#products .thumbnail-container,.featured-products .thumbnail-container,.product-accessories .thumbnail-container,.product-miniature .thumbnail-container {
  position: relative;
  margin-bottom: 1.563rem;
  height: 346px;
  width: 250px;
  background: #fff;
  box-shadow: 2px 2px 8px 0 rgba(0,0,0,.2)
}

#products .product-description,.featured-products .product-description,.product-accessories .product-description,.product-miniature .product-description {
  position: absolute;
  z-index: 3;
  background: #fff;
  width: 250px;
  bottom: 0;
  height: 100px
}

#products .thumbnail-container .product-thumbnail,.featured-products .thumbnail-container .product-thumbnail,.product-accessories .thumbnail-container .product-thumbnail,.product-miniature .thumbnail-container .product-thumbnail {
  position: relative;
  height: calc(100% - 100px) !important;
}


#products .highlighted-informations,.featured-products .highlighted-informations,.product-accessories .highlighted-informations,.product-miniature .highlighted-informations {
  position: absolute;
  bottom: 50px;
  padding-top: .625rem;
  z-index: 2;
  background: #fff;
  text-align: center;
  width: 250px;
  height: 3.125rem;
  box-shadow: 0 -5px 10px -5px rgba(0,0,0,.2);
  transition: bottom .3s
}

#products .thumbnail-container:focus .highlighted-informations.no-variants,#products .thumbnail-container:hover .highlighted-informations.no-variants,.featured-products .thumbnail-container:focus .highlighted-informations.no-variants,.featured-products .thumbnail-container:hover .highlighted-informations.no-variants,.product-accessories .thumbnail-container:focus .highlighted-informations.no-variants,.product-accessories .thumbnail-container:hover .highlighted-informations.no-variants,.product-miniature .thumbnail-container:focus .highlighted-informations.no-variants,.product-miniature .thumbnail-container:hover .highlighted-informations.no-variants {
  bottom: 100px !important;
}

.agi-about-us-item {
  position: relative;
  display: block;
  margin-bottom: 25px;
  border-bottom: 1px solid gray;
  padding-bottom: 25px;
}

.agi-about-us-photo {
  float: left;
  padding-right: 20px;
  padding-bottom: 20px;
}

.agi-about-us-photo img {
  width: 100px;
}

.agi-about-us-title {
  display: block;
  position: relative;
  font-weight: bold;
}

#index .carousel .carousel-item .caption {
  position: absolute;
  top: 40px;
  bottom: auto !important;
  right: 90px !important;
  left: auto !important;
  color: #fff;
  max-width: 600px !important;
}

#index .carousel .carousel-item .caption {
  text-align: right !important;
}

@media (max-width: 767px) {
  #index .carousel .carousel-item .caption {
    right: 15px !important;
  }
  .carousel .carousel-item h4 {
    font-size: 18px !important;
  }

}





#about-us-pretext {

  margin-bottom: 20px;
  text-align: center;
  font-size: 1.5em;


}

#about-us-aftertext {
  display: block;
  position: relative;
  text-align: justify;
  width: 100%;
}

.agi-about-us-descsmall {
  display: block;
  margin-top: 10px;
  margin-bottom: 10px;
}

.agi-about-us-descfull {
  text-align: justify;
  text-indent: 50px;
}

.agi-about-us-biz {
  margin-top: 10px;
}

.agi-about-us-contact {
  margin-top: 10px;
}

.agi-marka-short {
  line-height: 100%;
  font-style: italic;
}


#agi-seller-info {
  text-align: right;
  margin-bottom: 15px;
}

.btn-seller-info {
  margin-right: 5px;
  background-color: #cccccc !important;
  color: #000000;
  text-transform: none;
  padding: 6px !important;
  box-shadow: 2px 2px 4px 0 rgba(0,0,0,.2);
}

.btn-seller-info:hover {
  background-color: #270202 !important;
  color: white;
}

.seller-info-desc {
  margin-top: 5px;
  border: 3px solid #ffffff;
  background-color: #ededed;
  padding: 25px;
  max-width: 400px;
  margin-left: auto;
  margin-right: 0;
}


/*
.magnifier {
  width: 150px;
  height: 150px;
  border-radius: 50%;
  border: 2px solid #000;
  position: absolute;
  pointer-events: none;
  background-repeat: no-repeat;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  z-index: 1000;
}
*/

#agi-zoom-container {
  max-height: 100%;
  width: calc(100% - 150px) !important; /* Szerokość div */
  aspect-ratio: 3 / 3 !important; /* Proporcje 3:2 */
  overflow: hidden; /* Obcinanie nadmiaru */
  position: relative; /* Pozycjonowanie dla obrazu */;
  height: auto;
}

#agi-zoom-container img {
  height: calc(100% * 3 / 2);
  width: auto;
  max-width: 100%;
  position: absolute;
  top: calc((100% - (100% * 3 / 2)) / 2);
  left: 0;
  aspect-ratio: 1 / 1;
}

@media (max-aspect-ratio: 3/1.9) {
  /* Style dla ekranów, gdzie wysokość > szerokość */
  #agi-zoom-container {
    max-height: unset;
    height: calc(100vw - 150px);
  }
  #agi-zoom-container img {
    height: auto !important;
    width: 100% !important;
    top: -16.66%;
  }
}


.product-container { /* Zmień ".product-container" na faktyczną klasę/ID kontenera, w którym znajduje się div */
  position: relative; /* Ważne! Bez tego "product-feature-id-1" będzie pozycjonowany względem najbliższego przodka z pozycją inną niż static, często względem <body> */
  /* Dodaj inne style dla kontenera, np. szerokość, wysokość, padding itp. */


}



/* ETYKIETY START */
.product-feature-id-1 {
  position: absolute; /* Umożliwia swobodne pozycjonowanie względem rodzica z position: relative */
  top: 6px; /* Przykleja element do górnej krawędzi rodzica */
  right: -12px; /* Przykleja element do prawej krawędzi rodzica */
  padding: 2px 18px 2px 10px; /* Dodaje trochę odstępu wewnętrznego */
  background-color: #ffffff; /* Przykładowy kolor tła, aby był widoczny */
  border: 1px solid #ccc; /* Przykładowa ramka */
  border-radius: 0; /* Zaokrąglone rogi */
  font-size: 0.8em; /* Mniejsza czcionka */
  z-index: 11; /* Zapewnia, że element będzie na wierzchu innych, jeśli się nakładają */
  white-space: nowrap; /* Zapobiega zawijaniu tekstu */
}

.trojkat-lewy-gorny {
  width: 0;
  height: 0;
  border-top: 6px solid #6e6e6e; /* Pozioma górna krawędź, wysokość trójkąta */
  border-left: 6px solid #6f6f6f; /* Pionowa lewa krawędź, szerokość trójkąta */
  border-right: 6px solid transparent; /* Przezroczysta krawędź do utworzenia przekątnej */
  border-bottom: 6px solid transparent; /* Przezroczysta krawędź do utworzenia przekątnej */

  position: absolute; /* Umożliwia swobodne pozycjonowanie względem rodzica z position: relative */
  top: 32px; /* Przykleja element do górnej krawędzi rodzica */
  right: -12px; /* Przykleja element do prawej krawędzi rodzica */
  z-index: 10; /* Zapewnia, że element będzie na wierzchu innych, jeśli się nakładają */

}

.product-feature-id-2 {
  position: absolute; /* Umożliwia swobodne pozycjonowanie względem rodzica z position: relative */
  top: 46px; /* Przykleja element do górnej krawędzi rodzica */
  right: -12px; /* Przykleja element do prawej krawędzi rodzica */
  padding: 2px 18px 2px 10px; /* Dodaje trochę odstępu wewnętrznego */
  background-color: #572323; /* Przykładowy kolor tła, aby był widoczny */
  border: 1px solid #301010; /* Przykładowa ramka */
  color: white;
  font-weight: bold;
  border-radius: 0; /* Zaokrąglone rogi */
  font-size: 0.8em; /* Mniejsza czcionka */
  z-index: 11; /* Zapewnia, że element będzie na wierzchu innych, jeśli się nakładają */
  white-space: nowrap; /* Zapobiega zawijaniu tekstu */
}

.trojkat-lewy-gorny-2 {
  width: 0;
  height: 0;
  border-top: 6px solid #6e6e6e; /* Pozioma górna krawędź, wysokość trójkąta */
  border-left: 6px solid #6f6f6f; /* Pionowa lewa krawędź, szerokość trójkąta */
  border-right: 6px solid transparent; /* Przezroczysta krawędź do utworzenia przekątnej */
  border-bottom: 6px solid transparent; /* Przezroczysta krawędź do utworzenia przekątnej */

  position: absolute; /* Umożliwia swobodne pozycjonowanie względem rodzica z position: relative */
  top: 71px; /* Przykleja element do górnej krawędzi rodzica */
  right: -12px; /* Przykleja element do prawej krawędzi rodzica */
  z-index: 10; /* Zapewnia, że element będzie na wierzchu innych, jeśli się nakładają */

}

/* ETYKIETY END */



@media screen and (max-width: 601px) {

  .agi-blog-section {
    flex-wrap: wrap;
  }

  .agi-blog-section div {
    flex-basis: 100% !important;
    width: 100% !important;
  }

  .page-content {
    padding-right: 3px;
    padding-left: 3px;
  }

}

/* Układ 2-kolumnowy dla list CMS i kategorii */
.agi-two-col {
  display: flex;
  gap: 20px;
  align-items: flex-start;
  max-width: 1110px;
  margin-left: auto;
  margin-right: auto;
}

.agi-two-col .agi-col {
  flex: 1 1 50%;
  min-width: 0;
}

.agi-two-col .agi-col-left { padding-right: 10px; }
.agi-two-col .agi-col-right { padding-left: 10px; }

.agi-cms-list,
.agi-cat-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.agi-cat-item + .agi-cat-item { margin-top: 8px; }

.agi-cat-sublist {
  margin-top: 6px;
  margin-left: 1.2rem;
  list-style: disc;
}

.agi-empty {
  color: #666;
  font-size: 0.95rem;
}

@media (max-width: 768px) {
  .agi-two-col {
    flex-direction: column;
  }
  .agi-two-col .agi-col-left,
  .agi-two-col .agi-col-right {
    padding: 0;
  }
}


#footer .btn-primary {
  background-color: #8d3a3b !important;
}