* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/*general*/
html {/* font-size: 62.5%*/ font-size: 10px; outline: none; }
body { font-family: "Roboto Condensed", sans-serif; color: #000; font-weight: 400; background-color: #F6F8FA; }
.body { background-color: #fff; max-width: 300rem; margin: 0 auto; overflow: hidden; }
ul, li, h1, h2, h3, h4, h5, p { list-style: none; }
a { font-size: 1.6rem; text-decoration: none; color: #000; outline: none }
a:focus, input:focus, textarea:focus, select:focus, label:focus {outline: none!important }
p, ul, li { line-height: 1.8; font-size: 1.6rem; }
.container { max-width: 148rem; margin: 0 auto; padding: 0 2%!important; width: 100%; }
.container2 { max-width: 168rem; margin: 0 auto; padding: 0 2%!important; width: 100%; }
button { color: #000; font-size: 1.6rem; cursor: pointer; background-color: transparent; border: none; font-family: "Roboto Condensed", sans-serif;}
input, textarea, select { font-size: 1.8rem; ; font-weight: 600; font-family: "Roboto Condensed", sans-serif;}

.center { text-align: center; }
.clear { clear: both; }
.float { float:left; }
.floatr { float:right; }
.flex { display: flex; flex-wrap: wrap; }
.clearfix::after { content:""; display: table; clear: both; }
.upper { text-transform: uppercase; }
.pr { position:relative; }
.oh { overflow:hidden; }

/*colors*/
.fff {color: #fff}
.bgfff { background-color:#fff }
.gray { color:#888888 }
.bggray { background-color:#515151 }
.bgb { background-color:#000 }
.red { color:#FF1A40 }
.bgf7 { background-color:#F7F7F7 }

/*fontsize*/
.w600 { font-weight:600 }
.w500 { font-weight:500 }
.w400 { font-weight:400 }
.w300 { font-weight:300 }

.t65 { font-size:6.5rem; line-height:1.2 }
.t50 { font-size:5rem; line-height:1.2 }
.t40 { font-size:4rem; line-height:1.2 }
.t30 { font-size:3rem; line-height:1.3 }
.t35 { font-size:3.5rem; line-height:1.2 }
.t25 { font-size: 2.5rem }
.t20 { font-size: 2rem }
.t18 { font-size: 1.8rem!important }
.t16 { font-size: 1.6rem }
.t14 { font-size: 1.4rem }

.mt1 { margin-top:1rem }
.mt2 { margin-top:2rem }
.mt3 { margin-top:3rem }
.mt4 { margin-top:4rem }
.mt5 { margin-top:5rem }
.mt6 { margin-top:6rem }
.mt8 { margin-top:8rem }
.mt9 { margin-top:9rem }
.mt10 { margin-top:10rem }
.mb1 { margin-bottom:1rem }
.mb2 { margin-bottom:2rem }
.mb3 { margin-bottom:3rem }
.mb4 { margin-bottom:4rem }
.mb5 { margin-bottom:5rem }
.mb6 { margin-bottom:6rem }
.mb8 { margin-bottom:8rem }
.mb10 { margin-bottom:10rem }

.mw100 { max-width:100rem; margin:0 auto; }

.pad { padding:6rem 0 }

.opt { object-position:top center; }
.opb { object-position:bottom center; }
.ojf { object-fit:cover; object-position:center; height:100%; width:100% }
.multi { mix-blend-mode: multiply; }
.overlay { mix-blend-mode: overlay; }
.screen { mix-blend-mode: screen; }

.br { border-radius: 1rem }

.cta { transition: .3s; font-size: 1.6rem; position: relative; display:inline-block; }
.cta.bord { border:2px solid; border-radius: 1rem; padding:2rem 3rem; }
.cta.bord:hover { background-color:rgba(255, 255, 255, .2); box-shadow: 0 0 20px rgba(0, 0, 0, .2); }
.cta.line { font-weight:600; border-bottom:1px solid #FF1A40; padding: 1rem 3rem }

/*padding/margin*/
.wt100 { width:100% }
.ojf { width:100%; height:100%; object-fit:cover; }
.opt { object-position:center top!important; }
.opc { object-position:0!important }

/*TOP BUTTON*/
.div-back-to-top { cursor: pointer; transition: .3s; max-width: 400rem; width: 100%; left: 0; right: 0; bottom: 0; margin: 0 auto; position: fixed; z-index: 10000; }
.back-to-top { transition: .3s; position: absolute; z-index: 2; bottom: 2rem; right: 2rem; }
.back-to-top img { transition: .3s; width: 5.2rem; background-color:#FF1A40; padding:2rem 1.5rem; border-radius:.5rem }
.back-to-top:hover {cursor: pointer; }

header { z-index: 10; z-index:10; width: 100%; position: absolute; max-width: 300rem;}
header .logo { transition: .3s; width: 12rem; }
header .logo img { width:100% }
header .menu {justify-content:space-between; }
header .menu2 { align-items: center; transition: .3s; height: 100%;}
header .menu li a { color: #fff; font-weight: 400; transition: .3s; position: relative; font-size:1.6rem; text-transform:uppercase; height: 100%;display: flex;align-items: center;gap: 5px;}
header .menu2 li { margin: 0 1.8rem;height: 100%;display: flex;align-items: center;}
header .menu li a.active { font-weight: 600; }
header .menu li a.active:before { content:""; height: .8rem; width: .8rem; border-radius: 50%; background-color: #DC0D29; position:absolute; bottom: 4.5rem; right:0; left:0; margin:0 auto; }
header .menu li a:hover { color: #DC0D29 }
header .allmenu { align-items: center; display: flex; justify-content: flex-end; width: calc(100% - 22rem);}
header .menu2 li:last-child { margin-right:0 }
header .ass img { width:16.2rem }
.sticky { box-shadow: 0 0 20px rgba(0, 0, 0, .2); background-color: rgba(81, 81, 81, .7); position: fixed; transition: 1s; width: 100%; top: 0; max-width: 300rem; }
.sticky .logo { transition: .3s; width:8rem }
.trans { transition:.6s }
header.sticky .menu li a.active:before {bottom: 2.5rem;}

/* DROPDOWN */
.ico-down {width: 1.2rem;height: 1.2rem;object-fit: contain;transition: all 0.3s;}

/* DROPDOWN */
header > .container {position: relative;}
.dropdown {margin: 0;}
.dropdown-content {position: absolute;z-index: 99;left: 0; right: 0; width: 96%; top: 100%;overflow: hidden;transition: all 0.3s ease-in-out;opacity: 0;text-align: left;margin: 0 auto;visibility: hidden;pointer-events: none;padding: 2rem;background-color: #ddd; }
header .menu li .dropdown-content a {line-height: 1.2; color: #000;text-transform: none;}
header .menu li .dropdown-content a:hover {color: #ff1b40;}
.dropdown-content .flex { justify-content: center;}
.dropdown-content .flex .bl { width: 25%; padding: 0 2rem;}
.dropdown-content .flex .bl .tit_cat {font-size: 1.8rem; margin: 0 0 1rem;border-bottom: 1px solid #ff1b40;}
.dropdown-content .flex .bl ul.sub-nav {list-style: inside disc;}
.dropdown-content .flex .bl li { margin: 0;padding: 0.5rem 0;list-style: inside disc;}

.dropdown:hover .dropdown-content {height: auto;opacity: 1;visibility: visible;pointer-events: all;}

/* TOGGLE */
ul.accordion .inner { overflow: hidden; display: none; padding: 0 0 1rem;}
.toggle {  text-transform: uppercase;font-size: 2rem;padding-bottom: 1.5rem;display: flex;align-items: center;justify-content: space-between;}
.inner .toggle {padding: 1rem 0 1rem 5%;}
/* .inner .toggle:not(:last-of-type) {border-bottom: 1px solid rgba(255, 255, 255, .2);} */
.inner .inner li {margin: 0!important; border-bottom: none!important}
.inner .inner li a {padding: 5px 0 5px 10%!important; text-transform: none!important;}
/* .rotate { rotate: 180deg;} */



header .call { display:none; }
.menuresponsive, .sidenav { display: none; }

#splide3 { width: 100%; height: 100vh }
#splide3 .my-arrows {position: absolute; bottom: 10rem; margin: 0 auto; padding: 0 2%; width: 100%; z-index: 3; left: 0; right:0 }
#splide3 .my-arrows button:focus {outline: none;}
#splide3 .my-prev { background-image:url(../img/prev.svg); left:2% }
#splide3 .my-next { right: 2%; position: absolute; background-image:url(../img/next.svg); }
#splide3 .my-prev, #splide3 .my-next { width: 6.5rem; height: 6.5rem; border-radius: 0; background-color: transparent; transition: .3s; opacity: 1; cursor: pointer; background-repeat:no-repeat; background-position: center;}
#splide3 .my-prev:hover , #splide3 .my-next:hover { opacity:1 }
#splide3 .my-prev svg, #splide3 .my-next svg { fill:transparent; }
#splide3 .img, #splide3 .splide__track { width: 100%; height: 100vh; object-fit: cover; object-position: center;}
#splide3 .splide__pagination { display: block; text-align: center; width: 100%!important; bottom: 3rem; height: 6rem; z-index: 1}
#splide3 .splide__pagination__page { border-radius: 0; background: #fff; opacity: 0.5; width: 5rem; height: 3px; margin: 5px;cursor: pointer;display: block;}
#splide3 .splide__pagination__page:focus {outline: none;}
#splide3 .splide__pagination__page.is-active {background: #fff; opacity: 1; transform: inherit;}
.splide__slide { position:relative; }

.bggra { background-color:rgba(0, 0, 0, .3); position:absolute; z-index: 1; top:0; left:0; }
.mainhome .txt { position:absolute; bottom:15vh; text-align: center; width:100%; margin:0 auto; z-index:2; }

.txt-img .flex { justify-content:space-between; align-items:center; }
.txt-img .txt { width:68% }
.txt-img .img { width:30% }

.soluzioni .flex { justify-content:center; }
.soluzioni .flex img { width:18% }

.banner { height:74rem; width:100%; margin-bottom:3rem }
.banner .t65 { position:absolute; bottom:4rem; left:5rem; z-index:1 }
.bggra2 { position:absolute; top:0; left:0; z-index:1; background: rgba(0, 0, 0, 4.27); background: linear-gradient(10deg, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0) 100%); }
.banner .hover { display: flex; flex-direction: column; justify-content: flex-end; padding: 5rem; transition: .5s; z-index: 3; background-color: #F7F7F7; width:65rem; height:100%; position:absolute; top: 0; right:-65rem; }
.banner:hover .hover { right:0 }
.banner .hover a { margin-bottom:4rem }
.banner .hover p { line-height: 1.2; font-weight: 500; width:calc(100% - 3.5rem); }
.banner .hover a:hover p { color: #DC0D29; }
.banner .hover a img { vertical-align: middle; width: 2.5rem; margin-top: 2px; margin-right:1rem }
.banner .hover .flex { align-items:flex-start; }
.banner .hover p.t40 { display:none; }

#splide1 .splide__pagination { display: block; text-align: center; width: 100%!important; bottom: 0; height: 3rem; z-index: 1}
#splide1 .splide__pagination__page { border-radius: 0; background: #E5E4F0; opacity: 1; width: 1.8rem; height: 1.8rem; border-radius: 50%; margin: 6px; cursor: pointer;display: block;}
#splide1 .splide__pagination__page:focus {outline: none;}
#splide1 .splide__pagination__page.is-active {background: #64636F; opacity: 1; transform: inherit;}
#splide1 .splide__track { width:100% }
#splide1 .my-arrows {position: absolute; bottom: -3rem; margin: 0 auto; padding: 0; width: 100%; z-index: 3; left: 0; right:0 }
#splide1 .my-arrows button:focus {outline: none;}
#splide1 .my-prev { background-image:url(../img/prev2.svg); left:0 }
#splide1 .my-next { right: 0; position: absolute; background-image:url(../img/next2.svg); }
#splide1 .my-prev, #splide1 .my-next { width: 2.5rem; height: 6.5rem; border-radius: 0; background-color: transparent; transition: .3s; opacity: 1; cursor: pointer; background-repeat:no-repeat; background-position: center;}
#splide1 .my-prev:hover , #splide3 .my-next:hover { opacity:1 }
#splide1 .my-prev svg, #splide1 .my-next svg { fill:transparent; }

#partner .splide__pagination { display: block; text-align: center; width: 100%!important; bottom: -3rem; height: 1rem; z-index: 1}
#partner .splide__pagination__page { border-radius: 0; background: #eee; opacity: 1; width: 3rem; height: .3rem; margin: 0; border-radius: 0; cursor: pointer;display: block;}
#partner .splide__pagination__page:focus {outline: none;}
#partner .splide__pagination__page.is-active {background: #FF1A40; opacity: 1; transform: inherit;}
#partner .splide__track { width:100% }
#partner .my-arrows {position: absolute; bottom: 50%; margin: 0 auto; padding: 0; width: 100%; z-index: 3; left: 0; right:0 }
#partner .my-arrows button:focus {outline: none;}
#partner .my-prev { background-image:url(../img/prev2.svg); left:0 }
#partner .my-next { right: 0; position: absolute; background-image:url(../img/next2.svg); }
#partner .my-prev, #partner .my-next { width: 2.5rem; height: 6.5rem; border-radius: 0; background-color: transparent; transition: .3s; opacity: 1; cursor: pointer; background-repeat:no-repeat; background-position: center;}
#partner .my-prev:hover , #partner .my-next:hover { opacity:1 }
#partner .my-prev svg, #partner .my-next svg { fill:transparent; }
#partner .img { width:100%; max-height:8rem; object-fit:contain; }
#partner .bo {background: #F7F7F7; display:flex; align-items:center; justify-content:center; max-height:8rem }
#partner { padding-left: 5rem; padding-right: 5rem; }

.realizzazioni .box { text-align:left; }
.realizzazioni .box .img { height:25vw }
.realizzazioni .box .t25 { background-color:#F7F7F7; margin-top:1rem; padding:1rem 2rem }
.realizzazioni .box img { transition:.8s }
.realizzazioni .box:hover img { transform:scale(1.1); }

.realizzazioni .notizie { gap:3% }
.realizzazioni .notizie .box { width:31.33% }
.realizzazioni .notizie .box img { width:100% }
.realizzazioni .notizie .box .t25 { margin: 0 0 1rem; background-color:transparent; padding:0 }
.realizzazioni .notizie .box .cta { font-style: italic; float:right; text-align:right; padding-right:0 }
.realizzazioni .notizie .box .img { height:24vw }

.tronca2 { width: 100%; display: -webkit-box; -webkit-box-orient: vertical; line-clamp: 2; -webkit-line-clamp: 2; overflow: hidden; }

.prefooter .img { height:69rem }

.footer3 { background-color:#000 }
.footer3 p, .footer3 a { font-size:1.6rem; color:#fff }
.footer3 .red { color:#FF1A40!important }
.footer3 a:hover { color: #FF1A40 }
.footer3 .cl { display:flex; flex-direction:column; }
.footer3 .cl a { line-height:1.7 }
.footer3 { padding: 8rem 0; }
.footer3 .credits { padding:5rem 0 0; margin-top: 6rem; border-top: 1px solid #707070; }
.footer3 .credits span { margin:0 .5rem }
.credits a, .credits p { font-weight: 400; color:#888 }
.footer3 .logo { display:flex; align-items:flex-end; gap:2rem }
.footer3 .logo img { width:12rem }
.footer3 .clflex { justify-content:space-between; }

/*pages*/
.main-img { height: 41rem; width:100%; position:relative; }
.main-img .bg { position:absolute; top:0; left:0; z-index:1; background-color:rgba(0, 0, 0, .3); }

.page header { background-color:#000 }

.breadcrumbs { padding: 3rem 0 4rem; font-size:1.4rem; }
.breadcrumbs a { font-size:1.4rem; }
.breadcrumbs a:last-child { font-weight:600 }

.prod-slide { margin:8rem 0 }
/* --- Stili slider principale: lasciati come i tuoi --- */
#splide-thumbs { background-color: #F7F7F7; width: 100%; height: auto; }
#splide-thumbs .my-arrows { position: absolute; bottom: -13rem; margin: 0 auto; padding: 0 2%; width: 100%; z-index: 3; left: 0; right:0 }
#splide-thumbs .my-arrows button:focus { outline: none; }
#splide-thumbs .my-prev { background-image:url(../img/prev2.svg); left:0 }
#splide-thumbs .my-next { right: 0; position: absolute; background-image:url(../img/next2.svg); }
#splide-thumbs .my-prev, #splide-thumbs .my-next { width: 2rem; height: 6.5rem; border-radius: 0; background-color: transparent; transition: .3s; opacity: 1; cursor: pointer; background-repeat:no-repeat; background-position: center; }
#splide-thumbs .my-prev:hover, #splide-thumbs .my-next:hover { opacity: 1 }
#splide-thumbs .my-prev svg, #splide-thumbs .my-next svg { fill: transparent; }
#splide-thumbs .img { mix-blend-mode: multiply; width: 100%; height: 60rem; object-fit: contain; object-position: center; }
#splide-thumbs .splide__track { height:auto; mix-blend-mode: multiply; }
#splide-thumbs .desc-img { width: 90%; margin: 0 auto; z-index: 2; padding: 1rem; text-align: center; }
#splide-thumbs .splide__pagination { display: block; text-align: center; width: 100%!important; bottom: 3rem; height: 6rem; z-index: 1 }
#splide-thumbs .splide__pagination__page { border-radius: 0; background: #fff; opacity: 0.5; width: 5rem; height: 3px; margin: 5px; cursor: pointer; display: block; }
#splide-thumbs .splide__pagination__page:focus { outline: none; }
#splide-thumbs .splide__pagination__page.is-active { background: #fff; opacity: 1; transform: inherit; }
#splide-thumbs .splide__slide { position: relative; }

/* --- Carosello thumbnail --- */
#thumbs { width: 90%; max-width: 1200px; margin: 0 auto; }
#thumbs .splide__track { height: auto; } /* niente vh qui */
#thumbs .splide__list { align-items: center; }
#thumbs .splide__slide { opacity: 1; transition: opacity .2s, transform .2s; cursor: pointer; }
#thumbs .splide__slide.is-active { opacity: 1; transform: scale(0.98); }
#thumbs .splide__track--nav > .splide__list > .splide__slide.is-active { border:2px solid #888!important; }
#thumbs .thumb {
  width: 100%;
  height: 20rem;          /* regola l’altezza della thumb */
  object-fit: contain;
  object-position: center;
  border: 2px solid transparent;
  display: block;
}
#thumbs .splide__slide { position:relative; }
#thumbs .bg { background-color:#F7F7F7; mix-blend-mode: multiply; position:absolute; top:0; left:0 }
#thumbs .splide__slide.is-active .thumb {
  border-color: #fff;    /* bordo sulla thumb attiva */
}

.logo-produttore { position: absolute; top: 0; right: 0; z-index: 2; width: auto; padding: 1rem; background: #fff; }
.logo-produttore img { width:15rem }

/* Spazio tra slider principale e thumbs */
#splide-thumbs + #thumbs { margin-top: 2rem; }

.box-colore .splide-single { width: 50%!important; }
.splide-single { width: 40%; border:1px solid #eee; }
.splide-single .my-arrows {position: absolute; bottom: 50%; margin: 0 auto; padding: 0 2%; width: 100%; z-index: 3; left: 0; right:0 }
.splide-single .my-arrows button:focus {outline: none;}
.splide-single .my-prev { background-image:url(../img/prev2.svg); left:2% }
.splide-single .my-next { right: 2%; position: absolute; background-image:url(../img/next2.svg); }
.splide-single .my-prev, .splide-single .my-next { width: 3.5rem; height: 6.5rem; border-radius: 0; background-color: transparent; transition: .3s; opacity: 1; cursor: pointer; background-repeat:no-repeat; background-position: center;}
.splide-single .my-prev:hover , .splide-single .my-next:hover { opacity:1 }
.splide-single .my-prev svg, .splide-single .my-next svg { fill:transparent; }
.splide-single .img, .splide-single .splide__track { width: 100%; object-fit: cover; object-position: center;}
.splide-single .splide__pagination { display: none; text-align: center; width: 100%!important; bottom: 3rem; height: 6rem; z-index: 1}
.splide-single .splide__pagination__page { border-radius: 0; background: #fff; opacity: 0.5; width: 5rem; height: 3px; margin: 5px;cursor: pointer;display: block;}
.splide-single .splide__pagination__page:focus {outline: none;}
.splide-single .splide__pagination__page.is-active {background: #fff; opacity: 1; transform: inherit;}
.splide__slide { position:relative; }

.ctas { justify-content:center; align-items:center; margin:8rem 0 }
.cta.red { color:#DC0D2A; border:3px solid #DC0D2A; font-weight:600 }
.ctas .cta { margin:1% }

.info-prodotto { justify-content:space-between; }
.info-prodotto .info { width:65%; padding:4rem }
.info-prodotto .caratteristiche { width:33%; }
.caratteristiche .icon { align-items:center; margin-bottom:0 }
.info-prodotto .caratteristiche .icon { margin-bottom:1.5rem }
.caratteristiche .icon img { margin-right:1rem }
.caratteristiche .icon div { width:calc(100% - 9rem); }

.colorazioni { margin:8rem 0 }
.box-colore { justify-content:space-between; align-items: center; margin: 4rem auto; max-width:100rem; width:100% }
.box-colore .txt { width:47% }

.fancybox__backdrop { background:rgba(81, 81, 81, .9)!important }
.fancybox__content { box-shadow: 0 0 20px rgba(0, 0, 0, .15); }
.f-button.is-close-btn { background: #444!important }

.fancybox__caption {
  font-size: 16px;
  color: #fff;
  text-align: center;
  padding: 10px;
}

.gallery .flex { justify-content:space-between; }
.gallery .txt { width:29% }
.gallery .pics { width:70%; justify-content:flex-start; }
.gallery .pics a { transition: .3s; overflow: hidden; display: flex; width:16.2rem; margin:0 1.5rem 3rem; height:16.2rem; }
.gallery .pics a img { transition: .3s; height: 100%; width:100%; object-fit:cover; }
.gallery .pics a img:hover { transform:scale(1.1); }
.gallery .pics a:hover { box-shadow: 0 0 20px rgba(0, 0, 0, .4); }

.realizzazioni .pics { gap: 2%; width:100%; justify-content:flex-start; }
.realizzazioni .pics a { transition: .3s; overflow: hidden; display: flex; width:18%; margin-bottom: 2%; height:10vw; }
.realizzazioni .pics a img { transition: .3s; height: 100%; width:100%; object-fit:cover; }
.realizzazioni .pics a img:hover { transform:scale(1.1); }
.realizzazioni .pics a:hover { box-shadow: 0 0 20px rgba(0, 0, 0, .4); }
.realizzazioni .pics.loghi-partner img { margin-bottom: 2%; width:18%; padding: 2rem 1rem; border: 1px solid #eee; object-fit:contain; max-height:15rem }

.page .banner { height:auto; width:49%; background-color:#f7f7f7 }
.page .banner .hover { position:relative; right:0; width:100% }
.page .banner .hover p.t40 { display:block; }
.page .banner .hover a { margin-bottom:2rem }
.page .banner .hover { height: auto; padding:3rem 3rem 1.5rem }
.page .banner .bggra2 { display:none; }
.page .banner .t65 { display:none; }
.page .banner .ojf { height:40rem; margin-bottom:-2px }
.page .flex-banner { justify-content:space-between;  }

.ckeditor { font-size:1.6rem; line-height: 1.8}
.ckeditor b, .ckeditor strong { font-weight: bold; }
.ckeditor h1,.ckeditor h2,.ckeditor h3,.ckeditor h4, .ckeditor h5, .ckeditor h6 { line-height: 1.2; font-size:3.5rem; font-weight:400; margin: 3rem 0 1rem; color:#888888 }
.ckeditor a { color:#016cba; text-decoration:underline; font-weight:500 }
.ckeditor ul { margin:2rem 0 }
.ckeditor ul li::before { content:''; background-color: #016cba; border-radius: 3px; width: 1.3rem; height: 1.3rem; position:absolute; left:0; top:.7rem }
.ckeditor li { padding-left:2.5rem; position:relative; font-size:1.6rem; line-height:1.7; margin:1rem 0 }
.ckeditor ol li::marker { font-weight:600; color:#016cba }
.ckeditor ol li { list-style:decimal; padding-left:1rem }
.ckeditor ol { padding-left:2rem; margin: 2rem 0}
.ckeditor.t25 p, .ckeditor.t25 { font-size:2.5rem }

.sitemap a { color:#888; text-decoration:none; }
.sitemap a:hover { color:#016cba }
.sitemap ul li.sc::before { display:none; }
.sitemap ul li.sc { margin-top:-1rem; }
.sitemap ul li.sc a { font-size:1.4rem }

.banner-txt { padding:3rem }
.banner-txt li:last-child { margin-bottom:0 }
.banner-txt ul { margin-bottom:0 }
.banner-txt h3 { margin:0 }

.icon-flex { gap:3rem 5rem }

.bord-dot { border:5px dotted #eee; padding:4rem }

.flex-banner.prodotti .img { width:3rem }
.flex-banner.prodotti .hover { padding: 2rem; display:flex; flex-direction: row; align-items:center; justify-content:space-between; }
.flex-banner.prodotti .banner { border:2px solid transparent; }
.flex-banner.prodotti .banner:hover { border:2px solid #888; }

.ckeditor a.cta { text-decoration:none }

.caratteristiche .icon p { line-height:1.4 }

.img-txt { justify-content:space-between; }
.img-txt img, .img-txt .map { width:49% }
.img-txt .txt { display: flex; flex-direction: column; justify-content: center; padding: 3rem; width:49%; background-color:#f7f7f7 }
.img-txt.rev { flex-direction: row-reverse;}

.page .realizzazioni .flex { gap:2% }
.page .realizzazioni .box { width:32%; margin-bottom:2% }
.page .realizzazioni .box .img { height:20vw }

.page .soluzioni .flex { justify-content:flex-start; }

/*form2*/
.contact_form2 .content { justify-content:space-between; }
.form2 { width:100% }
.form2 input, .form2 textarea, .form2 select { font-weight: 500; font-size: 1.8rem; letter-spacing: .5px; margin-bottom: 2rem; border:1px solid rgba(255, 255, 255, .25); width:100%; background-color:rgba(0, 0, 0, .06); border-radius:5px; padding:1.5rem; }
.form2::placeholder { color:#999 }
::placeholder { color:#999; opacity:0.9 }
.form2 .cl50 { width:49% }
.form2 .cl100 { width:100% }
.form2 .inputs { justify-content:space-between; }
.voce p { font-size:1.8rem; font-weight: 500; letter-spacing :1px; margin-bottom:0.8rem }

.map iframe { width:100%; height:50vh }

.ep { min-height:50vh; display:inline-flex; flex-direction:column; justify-content:center; }
.ep .error { font-size:20rem; line-height:1.4 }

.t50.bgf7 { padding:.5rem 1rem}

.gallery4 { gap:1% }
.gallery4 img { width:24% }

/*-------------------------style check & radio box-------------------------*/
/*style check box*/
.containercheck { text-align: left; width: 100%;
  margin: 1rem 0 2rem; font-size: 1.4rem;
  display: block;
  position: relative;
  padding-left: 3rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.containercheck input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: -1px;
  left: 0;
  height: 2rem;
  width: 2rem;
  background-color: #fff;
  border-radius: 1px; border: 1px solid #E3E3E3;
}

/* On mouse-over, add a grey background color */
.containercheck:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.containercheck input:checked ~ .checkmark {
  background-color: #4BAA05;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.containercheck input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.containercheck .checkmark:after {
  left: 0.6rem;
  top: 0.3rem;
  width: 0.4rem;
  height: .8rem;
  border: solid white;
  border-width: 0 0.2rem 0.2rem 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

@media (max-width: 1300px) {
html { font-size:9.5px }
.realizzazioni .box .img { height:30vw }
}

@media (max-width: 1100px) {
html { font-size:9.5px }
header { background-color: #000; padding:0 }
.home header { background-color:transparent; }
header .allmenu { width:50% }
header .menu2 li { display:none; }
header .menu2 li.mail { display:inline-block; margin-right:1.5rem }
header .cta { margin-left:2rem;}
header .logo { display:flex; width:9rem }
header .call { transition: .5s; display: block; position:absolute; top:3rem; right:8rem }
.container, .container2 { padding-left:2rem!important; padding-right:2rem!important }
header .container { padding:0!important }
header .menu { padding:0 2rem }
.sticky { background-color: rgba(0, 0, 0, .7)!important;}
.sticky .logo { width:7rem }
.sticky .call { top:2rem; right:8rem; }
.menuresponsive { margin-top:4px }
.menuresponsive, .sidenav { display: block; }
#mySidenav { display: block; z-index: 1000; height: 100%; width: 0; position: fixed; z-index:1; top: 0; right: 0; overflow-x: hidden; transition: 0.2s; }
#mySidenav .bg a { font-size:2rem }
#mySidenav .bg li { margin:1.5rem 0 }
#mySidenav .closebtn img { width:3.5rem }
.sidenav .bgcolor { width:0; opacity:.4; height:100vh; overflow: hidden; position:absolute; right:0 }
#mySidenav .bg { background-color: #515151; overflow-y: scroll; width: 100%; margin: 0; height:100vh; padding:8rem 5% }
#mySidenav .bg a, #mySidenav .bg p { color:#fff }
#mySidenav .closebtn { position: absolute; top: 0; right: 0; padding: 2rem; text-align: right; margin:0; width:100% }
#mySidenav .bg li a { text-transform: uppercase; font-size:2rem; padding-bottom: 1.5rem; display:block; }
#mySidenav .bg li a.active { color:#FF1A40 }
#mySidenav .bg li:last-child { border:0; display:flex }
#mySidenav .bg li a.cta { margin-left:0; padding-bottom:.8rem }
#mySidenav .bg li { border-bottom:1px solid rgba(255, 255, 255, .2); }
#mySidenav .ass img { width:20rem; margin-top:1rem }
.realizzazioni .box .img { height:40vw }
}

@media (max-width: 1024px) {
.txt-img .txt { width:100%; }
.txt-img .img { max-width:50rem; width: 100%; margin:0 auto; }
.container { padding:0 4% }

.banner .hover { position:relative; right:0; width:100%; margin-top:-2px }
.banner { height:auto; }
.banner .bggra2 { display:none; }
.banner .t65 { display:none; }
.banner .hover a { margin-bottom:2rem }
.banner .hover p.t40 { display:block; }

.footer3 { text-align:center; }
.footer3 .logo { margin-bottom:0 }
.footer3 .cl { width:100%; margin-top:2rem }

#splide-thumbs .img { height:40vw }
#splide-thumbs { height:auto; }
#thumbs { width:80% }
#splide-thumbs .my-arrows { bottom:-7.1rem }
#thumbs .thumb { height:14vw }

.box-colore .splide-single { width: 100%!important; }

.gallery .txt { width:100% }

.gallery .txt .mw100 { max-width:100%; margin:0 }
.gallery .pics { margin-top: 2.5rem; width:100%; gap:2% }
.gallery .pics a, .realizzazioni .pics a { margin:0; width:23.5%; margin-bottom:1%; height: 22vw }
.realizzazioni .pics a { margin-bottom:2% }

.page .banner .ojf { height:30vw }

.img-txt img, .img-txt .map { width:100% }
.img-txt .txt { width:100%; padding:3.5rem 2rem 2rem }

.cta.line { padding:1rem 0 }

.page .realizzazioni .box { width:49%;}
.page .realizzazioni .box .img { height:30vw }
}

@media (max-width: 768px) {
.realizzazioni .box .img { height:60vw }
.realizzazioni .notizie .box { margin-bottom: 6rem; width:100%; max-width:50rem }
.realizzazioni .notizie .box .img { height:60vw }
#splide1 { max-width:50rem; margin:6rem auto 4rem; }

.page .realizzazioni .notizie .box { max-width:100% }

.prefooter .img { height:auto; }

.info-prodotto .info { width:100% }
.info-prodotto .caratteristiche { width:100%; margin-top:4rem }

.page .banner { width:100% }
.page .banner .ojf { height:50vw }

.caratteristiche .icon { width:100% }

.icon-flex { gap:2rem }
.bord-dot {padding: 2rem}
}

@media (max-width: 600px){
header .logo { width:16rem }
header .allmenu { width:calc(100% - 18rem); padding-right:.5rem }
header .menu2 li.mail { margin-right:1rem }

.realizzazioni .box .img { height:80vw!important }

.banner .hover { padding: 5rem 1rem }

.soluzioni .flex img { width:50% }

.footer3 { text-align:left; }

header .logo { width:9rem }
header .call { top:3rem }

.mainhome .txt { text-align: left; padding: 6rem 2rem 0; position:relative; bottom:inherit; }
#splide3, #splide3 .img, #splide3 .splide__track { height:60vh }
#splide3 .my-arrows { bottom:9rem }

.t50 {font-size: 3.5rem}
.t40 {font-size: 3rem}
.t30 {font-size: 2.2rem}

.soluzioni { text-align:left; }

.info-prodotto .info { padding:2rem }

#splide-thumbs .img { height:40rem }
#thumbs .thumb { height:13rem }
#splide-thumbs .my-arrows { bottom:-9rem }
#splide-thumbs .desc-img.ckeditor, #splide-thumbs .desc-img.ckeditor p { line-height:1.4; }

.prod-slide { margin:5rem 0 }
.ctas { margin:5rem 0; flex-direction:column; gap:1.5rem }

.main-img { height:32rem }
.gallery .pics, .realizzazioni .pics { gap:0; justify-content:space-between; }
.gallery .pics a, .realizzazioni .pics a { width:48%; margin-bottom:4%; height:40vw }

.page .banner .hover { padding:2rem 2rem .5rem }
.page .banner .hover a img { margin-top:-1px }
.page .banner .t25 { font-size:2rem }

.page .flex-banner .t40 { font-size:4rem; margin-bottom:1rem }

.banner-txt { padding:2rem }

.page .flex-banner .hover { padding:1.5rem 1.5rem 1rem }

.page .realizzazioni .box { width:100%; margin-bottom: 3rem}
.page .realizzazioni .box .img { height:65vw!important }

.form2 .cl50 { width:100% }

.contatti .txt { text-align:left; }

.ep .error { font-size:30vw;}

.main-img .img { object-position:center!important; }

#partner .my-arrows { bottom:45% }
#partner .img { width:80% }

.realizzazioni .pics.loghi-partner { justify-content:flex-start; }
.realizzazioni .pics.loghi-partner img { width:32%; max-height:10rem }

.gallery4 img { width:49%; margin-top:1% }

.logo-produttore img { width:8rem }

.box-colore { justify-content:center; flex-direction:column; }
.box-colore .txt, .splide-single { width:100% }

.footer3 .logo img { width:9rem }
}

/*gsap css*/
.fade-left { transform: translateX(-100%); opacity:0 }
.fade-right { transform: translateX(100%); }
.fade-in { transform: translateY(0); opacity: 0; }
.fade-in-down { transform: translateY(-100%); opacity: 0; }
.fade-in-up { transform: translateY(100%); opacity: 0; }
.bounce { transform: translateY(100px); }
.rotate { transform: rotate(-180deg); }
.swing { opacity: 0; transform: rotate(-10deg); }
.shake { opacity: 0; transform: translateX(0); }
.zoom-in { transform: scale(0); }
.zoom-out { transform: scale(2); }
.roll-in { transform: translateX(-100%) rotate(-360deg); }