/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */
 @import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');


.beweb-verticale,
.beweb-orizzontale{
    border-radius: 12px;
    background: #FFF;
    box-shadow: 0px 4px 60px 0px rgba(0, 0, 0, 0.10);
    padding:20px;
}

 .beweb-container-title {margin-top: 25px;margin-bottom: 12px;}

 .beweb-container-title h1 {color: #1F1E2F;font-family: "Open Sans", sans-serif;font-size: 12px !important;font-style: normal;font-weight: 700;line-height: 140%;text-transform: uppercase;}
.beweb-verticale .beweb-item,
.beweb-orizzontale .beweb-item a{text-decoration: none;}
.beweb-verticale .beweb-item{margin-bottom: 30px;display: flex;align-items: center;justify-content: flex-start;gap: 0.5rem;}
 .beweb-verticale .beweb-item a{display: flex;align-items: center;justify-content: flex-start;flex-flow: row;gap:1.2rem;margin-bottom: 20px;text-decoration: none;}
 .beweb-verticale .beweb-image img{ width: 60px; height: 60px; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; }
 .beweb-orizzontale .beweb-denominazione,
 .beweb-verticale .beweb-denominazione{color: #1F1E2F; font-family: "Open Sans", sans-serif; font-size: 12px !important; font-style: normal; font-weight: 700; line-height: 16.8px;margin-bottom: 2px;margin-top: 2px;}
  .beweb-verticale .beweb-tipologia{color:  #1F1E2F;font-family: "Open Sans", sans-serif; font-size: 10px !important;font-style: normal; font-weight: 400; line-height: 14px !important;margin-bottom: 5px;}
 .beweb-verticale .beweb-indirizzo{display: flex;align-items: center;gap:0.5rem;margin-bottom: 0;color: #1F1E2F;font-family: "Open Sans", sans-serif;font-size: 10px !important;font-style: normal; font-weight: 400;  line-height: 14px;}

/* .beweb-orizzontale .beweb-placeholder{width: 100%;} */
.beweb-orizzontale .beweb-no-swiper{align-items: baseline;justify-content: flex-start;gap: 1.5rem;}
 .overflow-verticale{overflow-y: scroll;max-height: 312px;scrollbar-color: #D7D7D7 #F2F2F2;scrollbar-width: thin;}

.beweb-verticale .beweb-indirizzo svg,
.beweb-orizzontale .beweb-indirizzo svg{opacity: 0.7;}


 /* .beweb-orizzontale .beweb-image img{ width: 100%; height: auto; object-fit: cover; border-radius: 4px; max-height: 320px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; } */
.swiper {
    width: 100%;
    height: 100%;
}

.swiper-slide {
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 191px;
}

.swiper-slide .beweb-image{background-repeat: no-repeat;background-size: cover;background-position: top;border-radius: 4px;}


.swiper-slide.swiper-slide-active {
    width: 80% !important;
    max-width: 191px;
}

.swiper-slide.swiper-slide-next {
    width: 60% !important;
    max-width: 191px;
}

/* .swiper-slide:nth-child(3n) {
    width: 60% !important;
} */



 .swiper-button-next,
 .swiper-button-prev {
     color: #000;
     width: 40px;
     height: 40px;
     background: rgba(255, 255, 255, 0.8);
     border-radius: 50%;
     box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
 }
.beweb-orizzontale-item .swiper-button-next,
.beweb-orizzontale-item .swiper-button-prev {background-color:#fff;width: 39px;height: 39px;box-shadow: none;background-size: 35%;background-position: center;background-repeat: no-repeat;}
.beweb-orizzontale-item .swiper-button-next{background-image: url('../../image/chevron-right.png');right: -10px;}
.beweb-orizzontale-item .swiper-button-prev {
    background-image: url('../../image/chevron-left.png');
    left: -10px;
}


.beweb-info h4{color: #1F1E2F; font-size: 14px;font-style: normal;font-weight: 700;line-height: 19.6px;margin-top: 12px;margin-bottom: 4px;}
.beweb-info p.beweb-tipologia{color: #1F1E2F;font-size: 12px;font-style: normal;font-weight: 400;line-height: 16.8px;margin-bottom: 8px;margin-top: 0;}
.beweb-orizzontale .beweb-info p.beweb-indirizzo{display: flex;align-items: center;gap:0.5rem;margin-bottom: 0;margin-top: 0;flex-flow:row wrap;}
.beweb-orizzontale .beweb-info p.beweb-indirizzo svg{flex:0 0 7%;}
.beweb-orizzontale .beweb-info p.beweb-indirizzo span{flex:1 1 70%;color: #1F1E2F;font-size: 12px;font-style: normal;font-weight: 400; line-height: 16.8px;margin-bottom: 0;margin-top: 0;display: flex;align-items: center;gap:0.5rem;}
.beweb-orizzontale-item .swiper-button-next::after,
.beweb-orizzontale-item .swiper-button-prev::after {
    display: none;
}
 
 @media (max-width: 768px) {
    .beweb-orizzontale-item .swiper-button-next,
    .beweb-orizzontale-item .swiper-button-prev {
        top: 31%;
    }

    .beweb-orizzontale-item .swiper-button-prev {
        left: -13px;
    }
     .swiper-button-next,
     .swiper-button-prev {
         display: none;
     }
    .beweb-orizzontale .beweb-image img {
        max-height: 191px;
        max-width: 191px;
    }
        .beweb-orizzontale .beweb-item.swiper-slide-active,
        .beweb-orizzontale .beweb-item.swiper-slide-next{width: 191px !important;}
 }

 .beweb-orizzontale .beweb-container-title h1 {
     font-size: 20px !important;
 }

 .beweb-orizzontale .swiper {
     max-width: 100%;
 }

 .beweb-orizzontale .swiper-slide {
     margin: 0px auto;
     max-width: 300px;
 }

 /* MEDIAQUERIES */
 @media (min-width: 200px) and (max-width: 575.98px) {
     .beweb-orizzontale {
         float: none;
         margin-left: 0px;
         width: auto
     }
 }

 /* Medium devices (tablets, 768px and up)*/
 @media (min-width: 576px) and (max-width: 768px) {
     .beweb-orizzontale {
         float: none;
         margin-left: 0px;
         width: auto
     }
 }

 /* Medium devices (tablets, 768px and up)*/
 @media (min-width: 768px) and (max-width: 1024px) {
     .beweb-orizzontale {
         float: right;
         margin-left: 30px;
         width: 50%;
     }

 }

 /* Large devices (desktops, 992px and up)*/
 @media (min-width: 1025px) and (max-width: 1398.98px) {
     .beweb-orizzontale {
         float: right;
         margin-left: 30px;
     }

 }


 /* XX-Large devices (larger desktops, 1400px and up)*/
 @media (min-width: 1400px) {
     .beweb-orizzontale {
         float: right;
         margin-left: 30px;
     }
 }