/*
Theme Name: Miwa
Author: Harmony Agency
Description: Html Converted to WordPress
Author URI: https://harmony.agency
Version: 1.2.2
Text Domain: miwa
*/

/*body {*/
/*  scrollbar-width: thin;*/
/*  scrollbar-color: #ff8300 #f0f0f0;*/
/*}*/

/*body::-webkit-scrollbar {*/
/*  width: 10px;*/
/*}*/

/*body::-webkit-scrollbar-track {*/
/*  background: #f0f0f0;*/
/*}*/

/*body::-webkit-scrollbar-thumb {*/
/*  background-color: #ff8300;*/
/*  border-radius: 5px;*/
/*  border: 2px solid #f0f0f0;*/
/*}*/

.home main .loading-lottie {
  top: 80%;
  transform: translate(-50%, -50%);
}

@media screen and (max-width: 768px) {
    header ul li.current-menu-item {
        width: 100%;
        text-align: right;
        display: flex;
        justify-content: space-between;
    }
}
header ul li.current-menu-item {
    background: #ff8300;
    border-radius: 40px;
    padding: 6px 14px;
    color: #fff;
    min-width: 70px;
    text-align: center;
}
.productContainer .mainImage img {
    width: 100%;
}
.productContainer .attributes .productLitres {
    flex-direction: row-reverse;
}
.productContainer .mainImage {
    width: 40%;
}
.productContainer .mainImage img {
    width: auto;
}
.contactForm input {
    text-align: center;
}
.contactForm {
    max-width: 1160px;
}
.contactForm input.wpcf7-submit {
    margin: 0;
}
.wpcf7-submit {
    background: #ff8300 !important;
    border: 0;
    border-radius: 36px;
    padding: 10px 16px;
    color: #fff !important;
    font-size: 18px;
    font-weight: 500;
    margin-top: 50px;
    cursor: pointer;
    width: 100%;
   text-align: center important;
    margin: 0 important;
}
header.white .mainLinks ul a:not(header.expanded .mainLinks ul a) {
    color: #fff;
}
header.white .mainLinks img {
    filter: brightness(0) saturate(100%) invert(200%) sepia(0%) saturate(2626%) hue-rotate(126deg) brightness(97%) contrast(98%);
}
header.expanded  .mainLinks img{
	filter:none;
}
header .content #blog .blog img {
    border-radius: 15px;
    max-height: 200px;
     min-height: 200px;
    object-fit: cover;
}

header .content #contact .mainImageMenu, header .content #about .mainImageMenu {
    width: 100%;
    max-height: 340px;
        object-fit: contain;
}
.section_box .slide_content .slide_img {
    min-height: 300px;
    object-fit: cover;
}
.user-info-inner input {
    margin-bottom: 1rem;
}
#news_swiper_container {
    position: relative;
}
.contactForm form p {
    margin: 0;
}
.form-item.reveal {
    width: 100%;
    text-align: right;
}
.wpcf7 input[type="tel"] {
    direction: rtl;
}
.contactForm input.wpcf7-submit {
    text-align: center;
}
.productsSwiper .back {
    margin-top: 32px;
}

.badgeItem {
    background: #F7F7F7;
}

.badgeItem:hover {
    transition: background-color 0.2s ease-in-out;
     background-color: var(--badge-color);
}

.productContainer.swiper-slide .tooltip {
         background-color: var(--badge-color);
}
.productContainer .buttonsContainer #btnProductAttributes{
    color: var(--badge-color);;
}
.productsSwiper .back {
    max-width: 200px;
}
.blogsSwiper .swiper-slide img {
    width: 100%;
}
/*.tab-content { display: none; }*/
/*.tab-content.active { display: flex; }*/
/*.cats button.active { background: #000; color: #fff; }*/
.blog-item {
    display: flex;
    gap: 15px;
    margin-bottom: 20px;
    flex-direction: column;
    margin-left: 2rem;
        position: relative;
}
.blog-item p {
    font-size: 16px;
    font-weight: 300;
    color: #585858;
    max-width: 370px;
}
.blog-item img {
    width: 367px;
    height: 400px;
    object-fit: cover;
    border-radius: 15px;
}
.blog-item .link {
    position: absolute;
    top: 16px;
    left: 16px;
}

.blog-item .link img{
    width: 45px;
    height: 45px;
        transition: transform 0.5s ease-in-out;

}

.blog-item:hover .link img {
    transform: rotate(-45deg);
}
.blogsSwiper .swiper-slide .wp-post-image {
    height: 300px;
    border-radius: 15px;
    object-fit: cover;
}
#productsContainer .product a {
    text-align: center;
}
#productsContainer .product .productImage, #productsContainer2 .product .productImage {
    max-height: 490px;
}
.badgeItem img {
    width: 25px;
}
.user-info-wrapper {
    min-height: 360px;
}
.user-info-inner input {
    margin: 5px 0;
    width: 100%;
    padding: 10px 0;
}
.singleAttribute label {
    font-size: 16px;
}
h1{
    font-size:32px;
}
input:focus {
  border: 1px solid #ff8300;
  outline: none;
  box-shadow: 0 0 3px #ff8300;
}
#newsContainer .tab-content {
    display: none;
        min-height: 450px;
}
#newsContainer .tab-content.active {
    display: block;
}
.introduction.news .post_box .post_img {
    border-radius: 15px;
}
.introduction.news .post_box .content .subtitle {
    font-size: 14px;
}
.introduction.news .post_box .content .title {
    font-size: 14px;
}
@media screen and (min-width: 1780px) {
    .blogsSwiper .swiper-slide {
        max-width: auto;
    }
}
#productsContainer .product:hover .productImage{
    transform: rotate(5deg);
    transition: transform 0.7s ease;
}
/*.blogsSwiper .swiper-slide {*/
/*    max-width: 30%;*/
/*}*/
.screen-reader-response {
    display: none;
}
.productsSwiper .swiper-button-prev, .productsSwiper .swiper-button-next {
    font-size: 14px;
}

.productsSwiper .swiper-button-prev img {
  animation: arrowLeftMove 1s ease-in-out infinite;
}

.productsSwiper .swiper-button-next img {
  animation: arrowRightMove 1s ease-in-out infinite;
}

.navigation button  img {
  animation: arrowDownMove 1s ease-in-out infinite;
}

.navigation button.visible {
    font-size: 14px;
}
.aboutContainer .cards {
    min-width: 360px;
}
.productContainer .mainImage {
    z-index: -1;
}


.slide_type .badge{
    background-color: rgba(255, 131, 0, 0.1);
    color: #ff8300;
    border-radius: 24px;
    width: fit-content;
    padding: 2px 20px;
}
.slide_type {
    display: flex;
    justify-content: space-between;
}
.slide_type .property {
    display: flex;
    flex-direction: row-reverse;
    justify-content: center;
    align-items: center;
}
.slide_type .property_title {
    margin-left: 5px;
}
header .content #blog .blog {
    max-width: 200px;
}
header a {
    gap: 12px;
}
.aboutContainer .card-wrapper {
    padding-right: calc((100% - 1530px) / 2);
}
.blog-image {
    position: relative;
}
.blog-image .arrow_box {
    position: absolute;
    left: 21px;
    top: 21px;
    cursor: pointer;
    width: 44px;
    height: 44px;
    background: rgba(255, 255, 255, 0.58);
    text-align: center;
    border-radius: 1000px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.arrow_box img{
        transition: transform 0.5s ease-in-out;
}
.slide_content:hover .arrow_box img {
    transform: rotate(-45deg);
}
#blogContainerWrapper .content:hover .arrow_box img {
    transform: rotate(-45deg);
}
.contactForm button {
    height: 40px;
}
.contactForm input.wpcf7-submit {
    height: 40px;
}

@media screen and (max-width: 768px) {
    .contactForm textarea {
        height: 40px;
    }
    .contactForm input.wpcf7-submit {
    margin-top: 0;
   }
}

@media screen and (min-width: 768px) and (max-width: 1024px) {

    .productContainer .content {
        padding-right: 2rem;
    }
    .productContainer .attributes {
      padding-left: 2rem;
    }
    .productsSwiper .back {
    margin-top: 0;
     }
     .productContainer .attributes img {
    max-width: 150px;
   }
   header {
    min-width: 60%;
   }
   #mapMain, #mapMain2 {
    height: 440px;
    width: 400px;
}
.mapWrapper .buttonsContainer {
    top: 50px;
}
.mapWrapper .mapContainer .content {
    padding-right: 2rem;
}
.phonesContainer .mainImageAbout {
    max-height: unset;
    min-height: unset;
    margin-bottom: 70px;
    margin-top: 0;
    width: 100%;
    height: auto;
}
.phone {
    padding: 0 16px;
}
.phone h2 {
    font-size: 16px;
}
.number {
    gap: 8px;
        font-size: 12px;
}
.phones {
    padding-right: 1rem;
}
.contactForm textarea {
    max-height: 60px;
}
.contactForm img {
    max-height: unset;
    min-height: unset;
    width: 100%;
    margin: 0;
}
}

@media screen and (max-width: 768px) {
    header ul li {
     justify-content: space-between;
    }
    header ul li.current-menu-item {
            padding: 0 10px;
        max-width: 260px;
    }
    header a {
        padding: 6px;
    }
   .inner #InnerProducts .product {

        flex-direction: row-reverse;
    }
    .productContainer .mainImage img {
        max-height: unset;
        min-height: unset;
        height: auto;
    }
    .productContainer .mainImage img {
        left: 0;
        max-width: 280px;
    }
}
.aboutContainer .badgePics {
    text-align: end;
}

header .content #products .product {
    width: 50%;
}
.member a img {
    height: 12px;
}
.aboutContainer .cards.stage1, .aboutContainer .cards.stage2, .aboutContainer .cards.stage3, .aboutContainer .cards.stage4 {
    top: 50%;
    transform: translateY(-50%) translateX(-50%);
}
@keyframes arrowLeftMove {
  0%, 100% {
    transform: translateX(0);
  }
  50% {
    transform: translateX(-5px);
  }
}

@keyframes arrowRightMove {
  0%, 100% {
    transform: translateX(0);
  }
  50% {
    transform: translateX(5px);
  }
}

@keyframes arrowDownMove {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(5px);
  }
}
@media screen and (max-width: 768px) {
    .productContainer .buttonsContainer {
      display: block;
    }
    .productContainer .buttonsContainer button:nth-of-type(1) {
        margin: 0;
    }
}
