@import 'variables', 'mixin';

.portfolioFilte{
	  a{
			padding: 15px;
			border: 1px solid rgba(0, 0, 0, 0.2) !important;
			color: #000;
			font-weight: 600;
			text-transform: uppercase;
			background-image: unset !important;
			transition: 0.35s cubic-bezier(0.22, 1, 0.36, 1) !important;
			white-space: nowrap;
			line-height: 65px;
			margin: 5px;
			
			&:hover{
					background: $primary-color;
					cursor: pointer;
					border-color: $primary-color;
			}
	  }
}

.page-wzornik-skor{
	  a{
	  		background-image: unset !important;
	  }
	  
	  .col-sm-12.col-md-4.col-lg-3{
	  		position: relative;
	  }
	  
	  .singleBox{
	  		position: absolute;
			margin-bottom: 30px;
			
			img{
				  height: 235px;
				  width: 100%;
				  object-fit: cover;
			}
			
			&:hover{
				  .text-hover{
				  		opacity: 1;
				  }
			}
			
			h3{
				  font-size: 18px;
				  text-transform: uppercase;
				  margin-bottom: 10px;
				  line-height: 22px;
			}
			
			.icon{
				  position: relative;
				  border: 1px solid rgba(#000, 20%);
				  width: 50px;
				  height: 50px;
				  display: flex;
				  justify-content: center;
				  border-radius: 100%;
			}
			
			.text-hover{
				  position: absolute;
				  margin: auto 20px;
				  background: #fff;
				  top: 10%;
				  left: 15px;
				  right: 15px;
				  height: 80%;
				  display: flex;
				  flex-direction: column;
				  justify-content: center;
				  align-items: center;
				  opacity: 0;
				  transition: $transition;
			}
	  }
	  
      .accordion {
            background: #fff;
            padding: 10px 30px;
            border: 1px solid #bdbcbc;

            &-body {
                  padding: 1rem 0;
				  
				  em{
				  		font-style: normal !important;
				  }
            }

            &-collapse {
                  transition: $transition;
                  border: none;
            }

            &-button {
                  border: none;
                  font-size: 16px;
                  color: #000000;
                  font-weight: 400;
                  padding: 1rem 0;
                  border-bottom: 1px solid #bdbcbc;
                  text-align: start;
                  text-transform: uppercase;

                  &:focus {
                        box-shadow: none !important;
                  }

                  &:after {
                        background-image: none;
                        transform: none;
                        content: "+";
                        font-size: 20px;
                        align-items: center;
                        display: flex;
                        justify-content: center;
                  }

                  &:not(.collapsed) {
                        color: black;
                        background-color: #fff;

                        &:after {
                              background-image: none;
                              transform: none;
                              content: "-";
                              font-size: 30px;
                              align-items: center;
                              display: flex;
                              justify-content: center;
                        }
                  }
            }

            &-item {
                  &:last-of-type {
                        .accordion-button {
                              border-bottom: unset !important;
                        }
                  }
            }

            .sub-title {
                  z-index: 3;
            }
      }
}

.galeria_nagrody-content {
      .post-content__h {
            margin-top: 0 !important;
      }
}

.pagination{
	a{
		background-size: 0% 1px !important;
		transition: $transition !important;
		
		&:hover{
			color: #fff !important;
		}
	}
}

.page-faq {
      .accordion {
            background: #fff;
            padding: 10px 30px;
            border: 1px solid #bdbcbc;

            &-body {
                  padding: 1rem 0;

                  em {
                        font-style: normal !important;
                  }
            }

            &-collapse {
                  transition: $transition;
                  border: none;
            }

            &-button {
                  border: none;
                  font-size: 16px;
                  color: #000000;
                  font-weight: 400;
                  padding: 1rem 0;
                  border-bottom: 1px solid #bdbcbc;
                  text-align: start;
                  text-transform: uppercase;

                  &:focus {
                        box-shadow: none !important;
                  }

                  &:after {
                        background-image: none;
                        transform: none;
                        content: "+";
                        font-size: 20px;
                        align-items: center;
                        display: flex;
                        justify-content: center;
                  }

                  &:not(.collapsed) {
                        color: black;
                        background-color: #fff;

                        &:after {
                              background-image: none;
                              transform: none;
                              content: "-";
                              font-size: 30px;
                              align-items: center;
                              display: flex;
                              justify-content: center;
                        }
                  }
            }

            &-item {
                  &:last-of-type {
                        .accordion-button {
                              border-bottom: unset !important;
                        }
                  }
            }

            .sub-title {
                  z-index: 3;
            }
      }
}

.page-nagrody-gwiazdy-prasa {
      .blog-post {
            &__content {
                  padding: 50px 100px;
                  position: relative;

                  &.justify-content-end {
                        .blog-post__date {
                              top: 0;
                              right: -90px;
                              bottom: 0;
                              left: auto;
                        }
                  }
            }

            &__date {
                  position: absolute;
                  transform: rotate(90deg);
                  top: 0;
                  right: auto;
                  bottom: 0;
                  left: -110px;
                  margin: 0;
                  line-height: 1;
                  background: unset;
                  color: rgba(#000, 60%);
                  padding: 7px 10px;
                  font-size: 16px;
                  border-radius: 0;
                  z-index: 9;
                  letter-spacing: 12px;
                  height: 50px;
                  margin-top: auto;
                  margin-bottom: auto;
            }

            &__h {
                  margin-top: 0;
            }

            &__h__link {
                  font-size: 25px;
            }
      }
}

.page-wspolpraca {
      form {
            @include media-min(1200px) {
                  padding: 0 100px;
            }
      }
}

.galeria_nagrody-content{
	#gallery-1{
	
	.gallery-item a, .gallery-item img, .gallery-item picture {
			width: 100%;
			display: block;
			height: 240px;
			object-fit: cover;
		}
	}
}

.single-post {
      .post-content__text {

            a:not(.button) {
                  background-size: 100% 1px;

                  &:hover {
                        background-size: 0% 1px;
                  }
            }

            h1,
            h2,
            h3,
            .title {
                  font-size: 25px !important;
                  line-height: 25px !important;
            }
      }
}

.page-kategorie-produktow,
.page-adrianna,
.page-aktowka,
.page-amaia,
.page-amelia,
.page-amelia-cant,
.page-amelia-pleciona,
.page-babi,
.page-bella,
.page-bjork,
.page-bonnie,
.page-carrie,
.page-czapki,
.page-etui-laptop-macbook,
.page-etui-na-karty,
.page-fabio-plecak,
.page-fabio-worki,
.page-fabioletki,
.page-fabulous,
.page-felicity,
.page-felina,
.page-firuze-3,
.page-formy-platnosci,
.page-freya,
.page-nate,
.page-freya-m,
.page-anastazja,
.page-fxx,
.page-hope,
.page-isi,
.page-izabell,
.page-kopertowki,
.page-madeleine,
.page-maeve,
.page-masiki,
.page-modena,
.page-nail,
.page-nate-2,
.page-nerki,
.page-noah,
.page-ova,
.page-piorniki,
.page-plecaczek-flawia,
.page-plecaki,
.page-plecaki-niume,
.page-rubby,
.page-torvi,
.page-villanelle,
.page-worki,
.page-yoko,
.page- {
      .product-box {
            .woocommerce-loop-category__title {
                  text-align: center;
                  font-size: 18px !important;
                  line-height: 25px !important;
                  color: #333333 !important;
                  font-weight: bold !important;
                  text-align: center;

                  .count {
                        display: none;
                  }
            }

            a {
                  width: 100%;
                  height: 300px;

                  img {
                        object-fit: cover;
                        width: 100%;
                        height: 100%;
                  }
            }
      }
}

/* Pages */
.post-content,
.page-content {
      padding: 60px 150px;

      @include media-max(1200px) {
            padding: 60px 15px;
      }

      .col-sm-7.col-md-8.col-xl-9 {
            @include media-min(1200px) {
                  padding-right: 40px;
            }
      }

      .quote {
            background: $primary-color;
            padding: 80px 150px;
            position: relative;
            font-size: 20px;
            line-height: 20px;
            font-family: 'gilroy-regular', sans-serif;

            q {
                  position: relative;

                  &:before {
                        content: "";
                        @include absolute(-25px, auto, 0, -70px);
                        width: 40px;
                        height: 40px;
                        background-size: cover !important;
                        background: url("/wp-content/uploads/2022/05/quote__icon.png");
                  }
            }

            @include media-max(1200px) {
                  padding: 20px;
            }

            &:after {
                  content: "";
                  @include absolute(20px, 20px, 20px, 20px);
                  padding: 10px;
                  border: 2px solid #fff;
            }

            &:before {
                  content: "";
                  @include absolute(0, 0, 0, 0);
                  width: 100%;
                  height: 100%;
                  background: url("/wp-content/uploads/2022/05/dotted__before.png");
                  background-size: contain repeat;
            }
      }

      p {
            color: #333333;
            font-family: 'gilroy-light', sans-serif;
      }

      .sub-title {
            font-size: 15px;
            letter-spacing: 5px;
            color: #000;
            text-transform: uppercase;
            position: relative;
            z-index: 1;
      }

      h1,
      h2,
      h3,
      .title {
            color: #000;
            font-size: 35px;
            line-height: 35px;
            margin-bottom: 20px;
            position: relative;
            z-index: 1;
            font-family: 'gilroy-regular', sans-serif;
            font-weight: 400;
      }

      &__img {
            margin-bottom: 20px;
      }

      .product-box {
            a {
                  background-image: unset !important;
            }
      }


      a:not(.button) {

            transition: background-size $transition-time ease 0s, color $transition-time ease $transition-time;
            color: currentColor;
            background-image: linear-gradient(currentColor, currentColor);
            background-repeat: no-repeat;
            background-position: 100% 100%;
            background-size: 100% 1px;

            &:hover {
                  color: currentColor;
                  background-size: 0% 1px;
                  background-position: 0 100%;
            }

      }

      &__text {
            &:first-child {
                  margin: 0 0 20px;
            }

            >h1,
            >h2,
            >h3,
            >.h {
                  &:first-child {
                        margin-top: 20px;
                  }
            }
      }
}