@import "../components/Headers/defaultHeader.css";
@import "../components/Headers/header-img.css";
@import "../components/Headers/header_01.css";

@import "../Moduli/Gallery/slider-gallery.css";
@import "../Moduli/SliderScorrimento/slider-big-center.css";
@import "../components/faq.css";
@import "../Moduli/SliderScorrimento/news-stripe_2.css";
@import "../Moduli/SliderScorrimento/carousel-big.css";

#single-intro p {
    line-height: 2;
}

/* Index
----------------------------------------------*/
    .index-list {
        gap: 0.781vw;
    }
    .index-list a {
        display: block;
        color: var(--color-main);
        border-radius: 1.563vw;
        background-color: var(--color-pure-white);
        letter-spacing: 0.01em;
        border: 1px solid transparent;
        -webkit-transition: all 0.1s;
        transition: all 0.1s;
        line-height: 1;
        padding: 0.521vw 1.042vw;
        box-shadow: 0 3px 8px 0 rgba(0,0,0,.08);
    }
    a.index-btn:hover {
        color: var(--color_1)!important;
        background-color: white!important;
        border-color: var(--color_1)!important;
        box-shadow: unset!important
    }

/* Services Grid
----------------------------------------------------------------------------------*/
    .services-grid {
        border: 1px solid var(--color-main---);
    }

    /* Gallery
    ----------------------------------------------*/
        .services-grid .swiper-pagination {
            bottom: 0.52vw; /*10*/
        }
        .services-grid .gallery-carousel .swiper-pagination-bullet {
            background-color: #fff;
            opacity: 1;
            height: 0.47vw; /*9*/
            width: 0.47vw; /*9*/
            margin: 0px 0.52vw !important; /*10*/
        }
        .services-grid .gallery-carousel .swiper-pagination-bullet.swiper-pagination-bullet-active {
            background-color: var(--color-main);
        }
        .services-grid .col-img img {
            height: 28.13vw; /*540*/
            min-height: 21.88vw; /*420*/
        }

    /* Content
    ----------------------------------------------*/
        .services-grid .col-content-title {
            max-width: 80%;
        } 

        /* Partner Logos
        ----------------------------------------------*/
            .single-partner-logo img {
                max-height: 1.56vw; /*30*/
                max-width: 5.73vw; /*110*/
            }
            .partner-logos {
                gap: 0.52vw 1.56vw; /*10 30*/
            }


/* 1920x1080
------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 1920px) {
    /* Index
    ----------------------------------------------*/
        .index-list {
            gap: 15px;
        }
        .index-list a {
            padding: 10px 20px 9px;
            border-radius: 100px;
        }

    /* Services Grid
    ----------------------------------------------------------------------------------*/
        /* Gallery
        ----------------------------------------------*/
            .services-grid .swiper-pagination {
                bottom: 10px; /*10*/
            }
            .services-grid .gallery-carousel .swiper-pagination-bullet {
                height: 9px; /*9*/
                width: 9px; /*9*/
                margin: 0px 10px !important; /*10*/
            }
            .services-grid .col-img img {
                min-height: 420px; /*420*/
            }

            /* Partner Logos
            ----------------------------------------------*/
                .single-partner-logo img {
                    max-height: 30px; /*30*/
                    max-width: 110px; /*110*/
                }
                .partner-logos {
                    gap: 10px 30px; /*10 30*/
                }
}

/* Standard Laptops - Ok until 1440px
------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 1600px) {
    .services-grid .img-size_00 img {
        min-height: 360px;
    }
}

/* Small Laptops - Ok until 1151px
------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 1280px) {
    .index-list {
        gap: 10px 15px;
    }
    
    .services-grid .gallery-carousel .swiper-pagination-bullet {
        height: 7px;
        width: 7px;
        margin: 0px 7px !important;
    }

    .services-grid .col-content-title {
        max-width: 100%;
    }

    .services-grid .col-img img {
        min-height: 380px;
    }
    .single-partner-logo img {
        max-height: 22px;
        max-width: 101px;
    }
}


/* Mobile Start ok until 768px
------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 992px) {
    #single-intro .stripe-container-inner,
    #products .stripe-container-inner {
        padding-left: 0;
        padding-right: 0;
    }
	.index-list {
        flex-flow: wrap;
        gap: 1em;
        padding-bottom: 0;
    }
    .products-tax {
        grid-template-columns: 1fr 1fr 1fr;
        padding-top: 20px;
    }
    .services-grid .col-img img {
        min-height: 415px;
    }
}

/* Mobile Landscape
------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 767px) {
    #single-intro p {
        line-height: 1.5;
    }
    .services-grid .col {
        width: 100%;
    }
    .services-grid .col-img img {
        min-height: 330px;
    }
    #products .stripe-container-inner.apply-pad-2 {
        padding-left: 0;
        padding-right: 0;
    }
    .services-grid .col-2 .col-content-inner {
        padding: 1.5em;
    }

    .services-grid .products-tax {
        grid-template-columns: 1fr;
    }
    .services-grid .partner-logos {
        gap: 15px 25px;
    }
    .services-grid .btn {
        margin-top: 30px;
    }
    .single-partner-logo img {
        max-height: 19px;
        max-width: 90px;
    }  
}

/* Mobile port
------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 600px) {
    .index-list {
        gap: .5em;
        justify-content: flex-start;
    }
    .index-list a {
        font-size: 10px;
        border-radius: 100px;
    }
}