@charset "UTF-8";
/* CSS Document */

button.iubenda-cs-preferences-link { opacity:0 !important; pointer-events:none !important; display:none !important; visibility:hidden !important;}

@font-face {
    font-family:'PPNeueRegular';
	src: url("../fonts/PPNeueMontreal-Regular.eot");
	src: url("../fonts/PPNeueMontreal-Regular.?#iefix") format("embedded-opentype"),
	url("../fonts/PPNeueMontreal-Regular.woff2") format("woff2"),
	url("../fonts/PPNeueMontreal-Regular.woff") format("woff"),
	url("../fonts/PPNeueMontreal-Regular.ttf") format("truetype"),
	url("../fonts/PPNeueMontreal-Regular.svg#PPNeueRegular") format("svg");
    font-weight:400;
	font-style:normal;
    font-display: swap;
}

@font-face {
    font-family:'PPNeueBold';
	src: url("../fonts/PPNeueMontreal-Bold.eot");
	src: url("../fonts/PPNeueMontreal-Bold.eot");
	src: url("../fonts/PPNeueMontreal-Bold.?#iefix") format("embedded-opentype"),
	url("../fonts/PPNeueMontreal-Bold.woff2") format("woff2"),
	url("../fonts/PPNeueMontreal-Bold.woff") format("woff"),
	url("../fonts/PPNeueMontreal-Bold.ttf") format("truetype"),
	url("../fonts/PPNeueMontreal-Bold.svg#PPNeueBold") format("svg");
    font-weight:600;
	font-style:normal;
    font-display: swap;
}

html,body { font-size:0; color:#fff; font-family:'PPNeueRegular',sans-serif; height:100%; -moz-osx-font-smoothing:grayscale; text-size-adjust:none; -webkit-text-size-adjust:none;}
body,div,img,ul,li,h1,h2,h3,p,img,input,button,select,textarea,video { padding:0; margin:0; border:0; outline:0;}
input,button,textarea { font-family:'PPNeueRegular',sans-serif !important; -webkit-appearance:none; -moz-appearance:none; appearance:none; resize:none;}
.input_off { pointer-events:none; opacity:.5;}
a { cursor:pointer; color:inherit; text-decoration:none;} ul { list-style-position:inside;}
.ytouch, .ypad,.ymenu { display:none !important;}
.vmiddle * { vertical-align:middle !important;} .vbottom * { vertical-align:bottom;}
.tra { transition:all .3s; -webkit-transition: all .3s;}
.relative { position:relative;}
::selection { background:#0c81e2;} ::-moz-selection { background:#0c81e2;}
.capitalize { text-transform:capitalize !important;} .uppercase { text-transform:uppercase !important;} .underline,  .h_underline:hover { text-decoration:underline;}
.pointer { cursor:pointer;}
.left { text-align:left;} .right { text-align:right;} .center { text-align:center;}
.floatleft { float:left;} .floatright { float:right;} .overflow { overflow:hidden;}
.mm { vertical-align:middle; margin-left:6px; margin-top:-2px; width:22px; height:19px;}
.noland { display:none;}

/* MAIN */
/* MAIN */

.contain { max-width:1600px; margin-left:auto; margin-right:auto; box-sizing:border-box; padding-left:6vw; padding-right:6vw;}
.contain-small { max-width:1200px;}
.contain-large { max-width:1600px;}
.contain-rightpad { padding-right:6vw;}

.fifty { display:inline-block; width:50%; vertical-align:top; box-sizing:border-box;} 
.padfifty { padding-left:50%;}
.onethird { display:inline-block; width:33%; vertical-align:top; box-sizing:border-box;}
.twothird { display:inline-block; width:67%; vertical-align:top; box-sizing:border-box;}
.onefourth { display:inline-block; width:25%; vertical-align:top; box-sizing:border-box;}
.threefourth { display:inline-block; width:75%; vertical-align:top; box-sizing:border-box;}

.onefifth { display:inline-block; width:20%; vertical-align:top; box-sizing:border-box;}
.twofifth { display:inline-block; width:40%; vertical-align:top; box-sizing:border-box;}
.threefifth { display:inline-block; width:60%; vertical-align:top; box-sizing:border-box;}

.onesixth { display:inline-block; width:16.666666%; vertical-align:top; box-sizing:border-box;}

.veil { position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.4);}
.veil-dark { position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.7);}
.sameheight { display:flex;}
.radius { border-radius:5px;}


.z0 { z-index:0;}
.z1 { z-index:1;}
.z2 { z-index:2;}
.z3 { z-index:3;}
.z4 { z-index:3;}
.z5 { z-index:5;}

.mar-top { margin-top:110px;}
.mar-btm { margin-bottom:110px;}
.pad-top { padding-top:110px;}  
.pad-btm { padding-bottom:110px;}

.mar-top-mini { margin-top:50px;}
.mar-btm-mini { margin-bottom:50px;}
.pad-top-mini { padding-top:50px;}  
.pad-btm-mini { padding-bottom:50px;}

.pad-left { box-sizing:border-box; padding-left:10vw;}
.pad-right { box-sizing:border-box; padding-right:10vw;}
.pad-left-mini { box-sizing:border-box; padding-left:30px;}
.pad-right-mini { box-sizing:border-box; padding-right:30px;}

.pad-right-mini { box-sizing:border-box; padding-right:45px;}

.cta { position:relative; display:inline-block; padding:15px 20px; box-sizing:border-box; border-radius:5px; font-size:14px; letter-spacing:.5px; font-weight:600; margin-right:10px; margin-bottom:10px;}
.right .cta { margin-right:0; margin-left:15px;}
.center .cta { margin-left:10px; margin-right:10px;}

.cta-blob { padding-left:0; padding-right:60px;}
.cta-blob::after { position:absolute; top:0; right:0; display:block; content:""; width:46px; height:46px; border-radius:100%; border:1px solid #fff; background:url("../img/arrow-right-mini_w.svg") center/25px no-repeat; transition:all .2s; -webkit-transition: all .2s; -o-transition: all .2s; -moz-transition: all .2s;}
.cta-blob:hover::after { background-color:rgba(255,255,255,.3);}

.arrow-right { padding-right:60px;}
.arrow-right::after { content:""; display:block; position:absolute; right:20px; top:10px; width:25px; height:25px; background:url("../img/arrow-right-mini_w.svg") 92% center/25px no-repeat; transition:right .3s; -webkit-transition:right .3s;}
.arrow-right:hover:not(.icon-sheet)::after { right:15px;}

.arrow-down { padding-right:50px;}
.arrow-down::after { content:""; display:block; position:absolute; right:20px; top:10px; width:25px; height:25px; background:url("../img/arrow-down_w.svg") 100% center/20px no-repeat; transition:right .3s; -webkit-transition:right .3s;}

.icon-sheet { padding-right:60px; background-image:url("../img/icon-sheet_w.svg"); background-position:93% center; background-size:20px; background-repeat:no-repeat;}

.cta.b-cyan:hover, .cta.gr-cyan:hover, .cta.gr-lightblue:hover, .nav-contatti:hover,#submit:hover, #submit2:hover { box-shadow:0 0 20px rgba(12,129,226,.5);}
.cta.gr-terra:hover { box-shadow:0 0 20px rgba(176,91,72,.5);}
.preventivo .cta:hover  { box-shadow:0 0 20px rgba(255,255,255,.5) !important;}

/* TEXT COLOURS */
/* TEXT COLOURS */

.title { font-size:clamp(45px, 6.5vw, 100px); line-height:clamp(43px, 5.9vw, 100px);}
.title-m { font-size:clamp(37px, 3.5vw, 47px);  line-height:clamp(37px, 3.5vw, 47px);}
.title-s { font-size:clamp(27px, 2.6vw, 38px); line-height:clamp(30px, 2.7vw, 38px);}
.text-big { font-size:clamp(22px, 1.7vw, 24px); line-height:clamp(26px, 2.3vw, 30px);}
.text { font-size:clamp(16px, 1.5vw, 18px); line-height:clamp(22px, 2.3vw, 24px);}
.text-sub { font-size:13px; letter-spacing:1px;}
.before-sub { margin-bottom:15px;}

a.text-sub { display:inline-block;}
a.text-sub:hover { text-decoration:underline;}

.serif { font-family:'Fraunces',serif; font-optical-sizing:auto;}
.bold { font-family:'PPNeueBold',serif;}
.preline { white-space:pre-line;}
.nowrap { white-space:nowrap; display:inline-flex; direction:ltr;}

.bg-dark { background-color:#010622; color:#fff;}
.bg-blue { background-color:#041431; color:#fff;}
.bg-lightblue { background-color:#1d4872; color:#fff;}
.bg-cyan { background-color:#0c81e2; color:#fff;}
.bg-terra { background-color:#b05b48; color:#fff;}
.bg-green { background-color:#60b091; color:#fff;}
.bg-grey { background-color:#333; color:#fff;}
.bg-white { background-color:#fff;}

.gr-lightblue { background: #1D4872;
background: -webkit-linear-gradient(90deg, rgba(29, 72, 114, 1) 0%, rgba(41, 104, 166, 1) 100%);
background: -moz-linear-gradient(90deg, rgba(29, 72, 114, 1) 0%, rgba(41, 104, 166, 1) 100%);
background: linear-gradient(90deg, rgba(29, 72, 114, 1) 0%, rgba(41, 104, 166, 1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#1D4872", endColorstr="#2968A6", GradientType=1);}
.gr-cyan { background: #0C81E2;
background: -webkit-linear-gradient(90deg, rgba(12, 129, 226, 1) 0%, rgba(28, 151, 252, 1) 100%);
background: -moz-linear-gradient(90deg, rgba(12, 129, 226, 1) 0%, rgba(28, 151, 252, 1) 100%);
background: linear-gradient(90deg, rgba(12, 129, 226, 1) 0%, rgba(28, 151, 252, 1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0C81E2", endColorstr="#1C97FC", GradientType=1);}
.gr-terra { background: #B05B48;
background: -webkit-linear-gradient(90deg, rgba(176, 91, 72, 1) 0%, rgba(230, 110, 83, 1) 100%);
background: -moz-linear-gradient(90deg, rgba(176, 91, 72, 1) 0%, rgba(230, 110, 83, 1) 100%);
background: linear-gradient(90deg, rgba(176, 91, 72, 1) 0%, rgba(230, 110, 83, 1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#B05B48", endColorstr="#E66E53", GradientType=1);}

.c-dark { color:#010622; vertical-align:baseline !important;}
.c-lightblue { color:#1d4872; vertical-align:baseline !important;}
.c-cyan { color:#0c81e2; vertical-align:baseline !important;}
.c-less { opacity:.6;}
.c-green { color:#60b091; vertical-align:baseline !important;}
a.c-less:hover { opacity:1;}

.b-blue { border:1px solid #041431;}
.b-terra { border:1px solid #b05b48;}
.b-cyan { border:1px solid #0c81e2;}
.b-white { border:1px solid #fff;}
.btop-cyan { border-top:1px solid #0c81e2;}

.gr-top { position:absolute; width:100%; height:330px; left:0; top:0; pointer-events:none;}
.gr-btm { position:absolute; width:100%; height:330px; left:0; bottom:0; pointer-events:none;}
.gr-btm-mini { position:absolute; width:100%; height:40px; left:0; bottom:0; pointer-events:none; 
	transition:opacity 1s ease, visibility 1s ease; opacity:1; visibility: visible;}
.gr-btm-mini.fade-out { opacity:0; visibility:hidden;}
.gr-dark { background: 010622;
background: -webkit-linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(255, 255, 255, 0) 100%);
background: -moz-linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(255, 255, 255, 0) 100%);
background: linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(255, 255, 255, 0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000", endColorstr="#FFFFFF", GradientType=0);}
.gr-fading { background: #041431;
background: -webkit-linear-gradient(180deg, rgba(4, 20, 49, 0) 0%, rgba(4, 20, 49, 1) 100%);
background: -moz-linear-gradient(180deg, rgba(4, 20, 49, 0) 0%, rgba(4, 20, 49, 1) 100%);
background: linear-gradient(180deg, rgba(4, 20, 49, 0) 0%, rgba(4, 20, 49, 1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#041431", endColorstr="#041431", GradientType=0);}
.gr-fading-top {
	background: #041431;
background: -webkit-linear-gradient(180deg, rgba(4, 20, 49, 1) 0%, rgba(255, 255, 255, 0) 100%);
background: -moz-linear-gradient(180deg, rgba(4, 20, 49, 1) 0%, rgba(255, 255, 255, 0) 100%);
background: linear-gradient(180deg, rgba(4, 20, 49, 1) 0%, rgba(255, 255, 255, 0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#041431", endColorstr="#FFFFFF", GradientType=0);}

/* NAV FOOTER */ 
/* NAV FOOTER */

.blackout { position:fixed; width:100%; height:100%; top:0; left:0; z-index:320; pointer-events:none;
transition:opacity .8s; -webkit-transition:opacity .8s; -o-transition:opacity .8s; -moz-transition:opacity .8s;}
.black_out { opacity:0;}

.header-logo { position:fixed; z-index:25; display:block; top:20px; left:6vw; width:250px; height:52px; background:url("../img/logo-matermoll_w.svg") center / 100% no-repeat;
 transition:top .8s cubic-bezier(0.83, 0, 0.17, 1),width .4s, height .4s; -webkit-transition:top .8s cubic-bezier(0.83, 0, 0.17, 1),width .4s, height .4s;}
.header-logo_on { width:192px; height:40px;}

nav { position:fixed; padding:20px 0; left:0; width:100%; z-index:20; text-align:center;
 	        transition:top 1.2s .4s cubic-bezier(0.83, 0, 0.17, 1), background .4s; 
	-webkit-transition:top 1.2s .4s cubic-bezier(0.83, 0, 0.17, 1), background .4s;}
nav.nav-home { top:-100px;}
nav.nav_in { top:0;}

.nav-link { display:inline-block; font-size:16px; border:1px solid transparent; padding:8px 14px; vertical-align:middle; border-radius:5px; margin:0 2px; vertical-align:top;}
.nav-link:hover:not(.nav-contatti) { background:rgba(1,6,34,.6);}
.nav-link_on { border-color:rgba(255,255,255,.5);}

.nav-link-sub { display:inline-block; border-radius:5px; overflow:hidden; height:37px; vertical-align:top;}
.nav-link-sub:hover { height:210px; margin-top:-3px; padding-top:3px; background:rgba(1,6,39,1);}
.sublink { margin-top:5px; display:block;}
.sublink:hover { background:rgba(255,255,255,.2) !important;}

nav.nav_on { background:rgba(1,6,39,.8); height:38px; backdrop-filter:blur(40px); -webkit-backdrop-filter:blur(40px);}

/*
.nav-contatti { position:absolute; padding-right:45px; right:12vw; border:none;}
.nav-contatti::after { content:""; display:block; position:absolute; right:10px; top:8px; width:20px; height:20px; background:url("../img/icon-chat_w.svg") center/22px no-repeat; transition:right .3s; -webkit-transition:right .3s;} */

.nav-lang { position:absolute; top:22px; right:6vw; padding-right:30px; background:url("../img/arrow-down_w.svg") calc(100% - 10px) center/14px no-repeat; font-size:12px; border:1px solid rgba(255,255,255,.3)}
.nav-lang:hover { background:url("../img/arrow-down_w.svg") calc(100% - 10px) center/14px no-repeat !important; }

.nav-performance.nav_on  { background:rgba(8,8,8,.8);}
.nav-performance .nav-link:hover:not(.nav-contatti) { background:rgba(8,8,8,1);}
.nav-performance .nav-link-sub:hover { background:rgba(8,8,8,1);}

footer { font-size:17px; background:url("../img/blur30.png") center bottom/70% no-repeat;}
footer a:not(.cta) {  line-height:26px;}
footer .bold { margin-bottom:20px;}
footer .cta { margin:20px 0 0 0;}
.footer-performance { background-color:rgba(24,24,24,1);}
.credits-performance { background-color:rgba(17,17,17,1);}
.credits-performance * {color:#ccc !important; }

.social { display:inline-block; width:30px; height:30px;}
.ig_w { background:url("../img/social-ig_w.svg") center / 30px 30px no-repeat;}
.fb_w { background:url("../img/social-fb_w.svg") center / 30px 30px no-repeat; margin-left:5px;}
.in_w { background:url("../img/social-in_w.svg") center / 35px 35px no-repeat; margin-left:5px;}

.footer-logo { width:280px; margin:60px auto;}
.credits { padding:25px 0; font-size:12px; line-height:22px;}
.credits p {filter:brightness(1.4);}

.prev-btn { cursor:pointer;}
.navveil { opacity:0; pointer-events:none; position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,4,32,.8); z-index:30; 
transition:opacity .5s; -webkit-transition:opacity .5s; cursor:pointer;}
.preventivo { right:-700px; top:0; position:fixed; box-sizing:border-box; padding:50px 60px; width:600px; height:100%; z-index:50; overflow-y:auto; scroll-behavior:smooth;
transition:all .8s cubic-bezier(0.83, 0, 0.17, 1) !important; -webkit-transition:all .8s cubic-bezier(0.76, 0, 0.24, 1) !important;}
.navveil_on { opacity:1; pointer-events:inherit;}
.preventivo_on { right:0 !important;}

.preventivo input:not(#submit2), .preventivo textarea, .preventivo select{ border-color:rgba(255,255,255,.7);}
.preventivo .checkmark, .preventivo .thick .checkmark:after {border-color:#fff !important; }
#submit2 { padding:16px 25px;}

.upload_area { background-color:rgba(0,0,0,.1); border-radius:10px; padding:15px 15px 10px 15px; box-sizing:border-box; margin-bottom:30px;}
#upload_cv { padding:0 !important; border:none !important;}

select option:first-child {
  opacity: 0.3;
}

/* HOME */
/* HOME */

.billboard { position:relative; width:100%; height:100vh; min-height:640px; overflow:hidden; box-sizing:border-box;}
.push-down { padding-top:24vh;}

.billboard-footer { position:absolute; left:0; bottom:60px; width:100%;}

.bg { position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; object-position:center; pointer-events:none;}
.bgmax { top:-6%; left:-6%; width:112%; height:112%;}
.sfumatura { object-position:top; opacity:.3; pointer-events:none; max-height:700px;}

.bg-off { opacity:0; transition:opacity 1.3s .2s; -webkit-transition:opacity 1.3s .2s;}
.bg_on { opacity:1;}

.artisan { background: url("../photos/matermoll-artisan.png") left center/100% no-repeat;}
.divider { height:1px;}

.swiper-collection .swiper-arch { position:relative; width:330px; height:500px; overflow:hidden; border-top-left-radius:180px; border-top-right-radius:180px; will-change:transform;}
.arch-content { position:absolute; left:0; bottom:0; width:100%; box-sizing:border-box; padding:60px 30px 30px 30px;}
/*.swiper-arch .bg { transition:transform .5s cubic-bezier(0.65, 0, 0.35, 1), filter .5s;}*/
.swiper-arch:hover .veil { opacity:.5;}

.button-prev { display:inline-block; width:50px; height:40px; background:url("../img/arrow-left_w.svg") center/50px no-repeat; cursor:pointer;}
.button-next { display:inline-block; width:50px; height:40px; background:url("../img/arrow-right_w.svg") center/50px no-repeat; cursor:pointer; margin-left:20px;}
.button-prev:hover, .button-next:hover { transform: scale(0.95);}

.luna { position:absolute; width:220px;}
.luna-swiper { top:-50px; right:20%;}

.swiper-left { position:absolute; left:-6vw; top:0; width:70px; height:100%; 
	background:#041431; background:-webkit-linear-gradient(90deg, rgba(4, 20, 49, 1) 0%, rgba(255, 255, 255, 0) 100%); background:-moz-linear-gradient(90deg, rgba(4, 20, 49, 1) 0%, rgba(255, 255, 255, 0) 100%); background:linear-gradient(90deg, rgba(4, 20, 49, 1) 0%, rgba(255, 255, 255, 0) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#041431", endColorstr="#FFFFFF", GradientType=1);}
.swiper-right { position:absolute; right:-6vw; top:0; width:70px; height:100%; 
	background:#ffffff; background:-webkit-linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(4, 20, 49, 1) 100%); background:-moz-linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(4, 20, 49, 1) 100%); background:linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(4, 20, 49, 1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#FFFFFF", endColorstr="#041431", GradientType=1);}
.swiper-pagination-bullet-active { background:#0c81e2 !important;}

.home-italy { padding:20vw 0 5vw 0;}
.parallax-square { position:absolute; filter:brightness(0.8); width:36vw; height:36vw; max-width:500px; max-height:500px;}
.ps-sx { left:7%; top:12vw;}
.ps-dx { right:7%; top:22vw;}

.ps-sx2 { left:7%; top:-5%; min-width:380px; min-height:380px;}
.ps-dx2 { right:7%; top:25%; min-width:380px; min-height:380px;}

/* CHI SIAMO */
/* CHI SIAMO */

.luna-chisiamo { top:12vw; right:10vw;}

.mosaic { position:absolute;}
.m1 { top:-9vw; right:7%; z-index:8; width:30vw; height:30vw; max-width:425px; max-height:425px;}
.m2 { top:7vw; right:-8%; z-index:10;  width:22vw; height:19vw; max-width:290px; max-height:290px;}
.m3 { top:13vw; right:73%; z-index:10; width:16vw; height:16vw; max-width:230px; max-height:230px;}
.m4 { top:17vw; right:27%; z-index:9;  width:22vw; height:19vw; max-width:290px; max-height:290px;}

.m8 { top:32vw; right:8%; z-index:10;  width:22vw; height:19vw; max-width:340px; max-height:290px;}

.tag { display:inline-block; margin:15px 0; font-size:13px; line-height:15px; letter-spacing:1px; border:1px solid #0c81e2; background:#010622; border-radius:50px; padding:4px 14px;}
.tag-onlybtm { margin:0 0 10px 0;}

.tag-green { border-color:#60b091;}

.t1 { position:absolute; right:5%; top:0; z-index:11;}
.t2 { position:absolute; right:23vw; top:420px; z-index:11;}
.t3 { position:absolute; left:33vw; top:120px; z-index:11; min-width:150px;}

.m5 { top:-14vw; left:8%; z-index:7; width:30vw; max-width:430px; max-height:580px}
.m6 { top:0; left:53%; z-index:8; width:22vw; height:22vw; max-width:320px; max-height:320px;}
.m7 { top:-10vw; left:13vw; z-index:6; width:45vw; pointer-events:none;}

.chisiamo-footer { padding:10% 0 25% 0;}


/* COLLEZIONI */
/* COLLEZIONI */

.img-top { position:absolute; right:0; top:0; width:100%; height:500px; opacity:.2;}

select.filter { display:inline-block; color:rgba(255,255,255,.6); position:relative; width:auto; background-position:calc(100% - 10px) center; background-size:13px; padding-left:0; border:1px solid #0c81e2; padding:8px 30px 8px 10px; margin:0 5px 0 0; cursor:pointer;}
.bg-cyan-glow { background-color:#0c81e2; box-shadow:0 0 15px #0c81e2; color:#fff; background-image:url("../img/x_w.svg");}

#listViewBtn, #gridViewBtn { width:30px; height:30px; margin-left:10px; cursor:pointer;}
#listViewBtn { background: url("../img/filter-list.svg") center/30px no-repeat;}
#gridViewBtn { background: url("../img/filter-grid.svg") center/30px no-repeat;}
.filter-az { display:inline-block; width:30px; height:30px; margin-left:10px; cursor:pointer; background: url("../img/filter-az.svg") center/30px no-repeat;}
.filter-az:hover { opacity:.5;}

.tag-mini { display:inline-block; margin:10px 5px 0 0; font-size:12px; letter-spacing:1px; border:1px solid #0c81e2;border-radius:50px; padding:2px 12px; color:#0c81e2;}

#productsContainer { display:grid;}
#productsContainer.grid-view { grid-template-columns:repeat(3, 1fr); gap:40px;}
#productsContainer.list-view { grid-template-columns:repeat(2, 1fr); gap:40px;}

.view-toggle button { opacity:0.5; transition:opacity 0.3s ease; -webkit-transition:opacity 0.3s ease;}
.view-toggle button.selected { opacity:1;}

.grid-item { opacity:1; visibility:visible; transition:opacity 0.4s ease, visibility 0.4s ease; margin-bottom:30px;}
.grid-item.hidden { opacity:0; visibility:hidden; pointer-events:none;}
.swiper-slide.grid-item { border-bottom:none; margin-bottom:0; padding-bottom:0;}

.grid-blur { position:absolute; left:0; top:-50px; width:100%; height:100%; opacity:0; pointer-events:none;}
.grid-item:hover .grid-blur { opacity:.8;}
.pregrid-img { height:80px; padding:10% 0; display:flex; align-items:center;}
.grid-img { width:100%;}

.grid-item-acc .pregrid-img { height:auto; padding:0; margin-bottom:30px;} /* accessori */

/* PRODOTTI */

.prod-img { width:130%; margin-left:-20%;}
.access-img { width:100%;}
.prod-blur {  position:absolute; left:-10%; top:-25%; width:100%; height:160%;}

.bubble { box-sizing:border-box; padding:40px; border-radius:5px;}
.pallina { display:inline-block; width:10px; height:10px; border-radius:100%;}
.pallona { display:inline-block; width:18px; height:18px; border-radius:100%; margin-right:7px;}
.half-white { background:linear-gradient(to right, white 50%, black 50%);}

.x-icon { position:relative; width:20px; height:20px; margin-right:7px;}
.x-icon::before, .x-icon::after { content:''; position:absolute; top:0; left:9px; width:2px; height:20px; background-color:#fff;}
.x-icon::before { transform:rotate(45deg);}
.x-icon::after { transform:rotate(-45deg);}

.prod-feat-img { height:100px; padding:24% 0; margin-bottom:30px;}
.prod-feat-logo { position:absolute; height:30px; right:20px; bottom:20px;}

.accordion-header { border-top:1px solid #0c81e2; border-bottom:1px solid #0c81e2; padding:20px 50px 20px 10px; box-sizing:border-box; margin-bottom:20px;}

.accordion-content li { padding:10px 0; border-bottom:1px solid #1d4872; list-style:none;}
.accordion-content li:last-child { border:none;}

.cert-txt { display:inline-block; width:calc(100% - 130px);}
.cert-img { display:inline-block; height:60px; margin-right:20px;}

.loghino { height:65px;}

/* ACCESSORI GALLERY */
.acc-main-img { display:block; width:100%; border-radius:5px;}
.acc-thumbs { margin-top:15px; margin-bottom:20px; white-space:nowrap; overflow-x:auto;}
.acc-thumb { display:inline-block; width:80px; height:80px; margin-right:10px; border-radius:5px; overflow:hidden; cursor:pointer; border:2px solid transparent; opacity:.5; vertical-align:top;}
.acc-thumb-active { border-color:#0c81e2; opacity:1;}
.acc-thumb:hover { opacity:1;}
.acc-thumb img { width:100%; height:100%; object-fit:cover;}
.bio-text { overflow:hidden;}
.bio-text .text { display:block;}
.expand { cursor:pointer; margin-top:10px;}

.swiper-slide.grid-item { padding-top:20px;}
.grid-blur-related { top:0; opacity:.5 !important;}


/* ITALIAN */
/* ITALIAN */

.hair { position:absolute; top:300px; left:0; width:100vw; opacity:.5; pointer-events:none;}
.luna-italian { top:100px; left:65%;}

.italian-pushup { padding-top:10vw;}

.circle-wrap { display:inline-block; width:45vw; height:45vw; max-width:550px; max-height:550px; border-radius:100%; overflow:hidden;}
.circle-wrap img { width:100%; height:100%; object-fit:cover;}
.italian-pushup { margin-top:-15vw; padding-top:20vw;}

.swiper-ridefi { width:100%; max-width:800px; margin:auto;}
.icon { display:block; width:100px; margin:0 auto 15px auto;}
.icon-mini { display:block; width:60px; margin:0 auto 10px auto;}

/* PERFORMANCE */
/* PERFORMANCE */

.submenu { position:sticky; top:78px; z-index:15; border-top:1px solid #0c81e2; border-bottom:1px solid #0c81e2; overflow:hidden; backdrop-filter:blur(40px); -webkit-backdrop-filter:blur(40px); background:rgba(4,20,59,.8); box-sizing:border-box; padding-left:10px; padding-right:10px;}
.submenu-pad { padding-top:10px; padding-bottom:10px;}
.submenu-link { display:inline-block; padding:16px 50px; margin:0 -30px; font-size:20px; cursor:pointer;}
.submenu-link_on, .submenu-link:hover { background:url("../img/blurfull.png") center/100% no-repeat;}

.submenu-grey { background:rgba(37,37,37,.8);}
.tecnologie { box-sizing:border-box; padding:70px;}
.img-inside { width:160%; margin-left:-30%;}

.materiale-logo { display:flex; align-items:center; justify-content:center; width:150px; height:110px; margin-bottom:12px;}
.materiale-logo img { max-width:100%; max-height:100%;}

.materiale-logo-auto { display:flex; align-items:center; justify-content:center; width:120px; margin-bottom:12px;}
.materiale-logo-auto img { width:100%; height:auto;}

/* CONTATTI */
/* CONTATTI */

.world { position:absolute; left:0; top:0; width:100%; opacity:.15;}

.output, .output2 { display:none;}
.load,.load2 { opacity:0; margin-left:15px; width:1px;} .load_on { opacity:1; width:auto;} 

::-webkit-input-placeholder { color:rgba(255,255,255,.6);}
::-ms-input-placeholder { color:rgba(255,255,255,.6);}
::placeholder { color:rgba(255,255,255,.6);}

input, textarea, select { position:relative; border:1px solid #0c81e2; background:none; color:#fff; padding:12px 16px; box-sizing: border-box; border-radius:5px; display:block; width:100%; margin-bottom:16px;}
select { position:relative; padding-left:11px; appearance:none; -webkit-appearance:none; -moz-appearance:none; background:url("../img/arrow-down_w.svg") calc(100% - 16px) center/18px no-repeat;}
#submit,#submit2 { position:relative; display:inline-block; width:auto; text-transform:uppercase; font-optical-sizing:auto; margin-top:20px;}
.name, .email { width:96%;}
textarea { padding-right:80px; background:url("../img/icon-pencil_w.svg") 96% 15px/22px no-repeat;}

.error { position:relative;  transition: all 0.3s; -webkit-transition: all 0.3s; -o-transition: all 0.3s; -moz-transition: all 0.3s; padding-bottom:35px;}
label.error { position:absolute; left:15px; border:none; top:50px; font-size:12px; color:#cf6959; z-index:100; letter-spacing:0 !important;}
.preventivo label.error { color:#ffb598;}
.dropdown label.error { top:42px;}
.thick label.error { left:0; bottom:inherit; top:32px;}

.thick { position:relative; display:block; padding-left:35px; padding-top:5px; cursor:pointer; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; margin-bottom:20px; text-align:left;}
.thick input { position:absolute; opacity:0; display:block; width:80%;}
.checkmark { position:absolute; top:0; left:0; height:25px; width:25px; border:1px solid #0c81e2;}
.checkmark:after { content:""; position:absolute; display:none;} 
.thick input:checked ~ .checkmark:after { display:block;}
.thick .checkmark:after { left:9px; top:5px; width:5px; height:10px; border:solid #0c81e2; border-width:0 3px 3px 0; -webkit-transform:rotate(45deg); -ms-transform:rotate(45deg); transform:rotate(45deg);}

#map { height:500px;}
.map-overlay { display:none;}

.materasso { width:120%; }
.contact-blur { width:100%; height:180%; left:0; top:-40%; position:absolute;}

@media only screen and (min-width:1500px) {
	.m8 { display:none;}
}

/* IF iPAD + 120 */
/* IF iPAD + 120 */
@media only screen and (max-width:1250px) {
    
    /*.rellax { transform: translate3d(0,0,0) !important;}*/
	.ypad { display:inherit !important;}
	.npad { display:none !important;}
	.header-logo { width:192px; height:40px;}
}

@media only screen and (max-width:1110px) { 
	.chisiamo { margin-left:100px;}  /* menu */

}

/* menu */
@media only screen and (max-width:990px) {
	
	.ymenu { display:inherit !important;}
	.ymenu.nav-header { text-align:center;}
	.nmenu { display:none !important;}
	
	.nav-header .divider:first-child { margin-bottom:20px;}
	.nav-header .divider:last-child { margin-top:12px;}
	
	#productsContainer.grid-view { grid-template-columns:repeat(2, 1fr); gap:40px;}
	.submenu { position:relative; top:0; padding-left:0; padding-right:0;}

	.ham { position:fixed; z-index:40; cursor:pointer; top:20px; right:17px; border-radius:3px; background:#041431; padding:10px 12px; border-radius:5px;}
	.ham .text { display:inline-block; vertical-align:top; font-size:15px; margin-left:8px;}
	
	.header-logo { position:absolute;}
	.header-logo_out { top:-200px;}
	
	nav { left:-102%; padding:12vh 0 20px 20px; box-sizing:border-box; height:100%; text-align:left; background:rgba(4,20,49,0) url("../img/blur.png") -10vw bottom/120vw 70vh no-repeat; backdrop-filter:blur(30px); -webkit-backdrop-filter:blur(30px);
	transition:all .8s cubic-bezier(0.83, 0, 0.17, 1) !important; -webkit-transition:all .8s cubic-bezier(0.76, 0, 0.24, 1) !important;}
	nav.nav-home { top:0;}
	nav.nav_on { height:100%;}
	nav.nav_open { background-color:rgba(4,20,49,.7); left:0;}
	
	.nav-link:not(.nav-lang), .nav-link-sub { display:block; padding:7px 0; font-size:32px; line-height:30px; font-family:'Fraunces',serif; font-optical-sizing:auto; margin:0;}
	.nav-link:hover:not(.nav-contatti), .nav-link-sub:hover { background:none;}
	.nav-link_on { background:none; border:none;}

	.nav-link-sub, .nav-link-sub:hover { height:auto !important; margin-top:0; padding:0 !important;}
	.sublink { display:none !important;}
	
	.nav-header { position:absolute; left:0; bottom:0; width:100%; padding:0 40px 20vh 40px; z-index:50; 
	background:url("../img/logo-matermoll_w.svg") center 75% / 270px no-repeat;}
	
	.nav-contatti { position:relative; right:inherit; background:none;}
	/* .nav-contatti::after { display:none;} */
	.nav-contatti:hover { box-shadow:none;}
	.nav-lang { right:inherit; top:57vh; right:20px; font-size:12px; z-index:52; background:none; padding-right:15px;}
	.nav-lang:hover { background:none !important}
	
	.mosaic-fix { margin-top:25vw;}
}


/* IF iPHONE */
/* IF iPHONE */
@media only screen and (max-width:768px) {

	.ytouch { display:inherit !important;}
	.ntouch,.ypad { display:none !important;}
    .tleft { text-align:left !important;} 
    .fifty, .onethird, .twothird,.onefourth, .twofifth, .threefifth { width:100%;}
	.tcenter { text-align:center;}
    .tfifty { width:50%;}
	
	.contain, .tcontain {padding-left:20px; padding-right:20px;}
	.contain-rightpad { padding-right:20px;}
	.sameheight { display:block;}
	.preline { white-space:normal;}
	.ypreline { white-space:pre-line;}
    .norellax { transform: translate3d(0,0,0) !important;}

    .mar-top { margin-top:70px;} 
	.mar-btm { margin-bottom:70px;}
    .pad-top { padding-top:70px;} 
	.pad-btm { padding-bottom:70px;}
    .mar-top-mini { margin-top:40px;} 
	.mar-btm-mini { margin-bottom:40px;}
    .pad-top-mini { padding-top:40px;} 
	.pad-btm-mini, .tpad-btm-mini { padding-bottom:40px;}
    .pad-left, .pad-right, .pad-left-mini, .pad-right-mini, .nopad { padding-left:0; padding-right:0;}
	.nomar-top { margin-top:0 !important; }
	.nomar-btm { margin-bottom:0 !important;}
	.nopad-top { padding-top:0 !important;}
	.nopad-btm { padding-bottom:0 !important;}
	.nopad-left { padding-left:0;}
	.tmar-top { margin-top:70px;}
	.tmar-top-mini { margin-top:30px;}
	.tpad-left { padding-left:20px;}
	
	.cta { padding-top:12px 16px; font-size:13px; margin-right:10px;}
	.cta-blob,.arrow-right { padding-right:60px; background-position:94% center;}
	.right.tleft .cta { margin-right:15px; margin-left:0;}
	.tleft .cta {  margin-left:0;}
	
	footer .onefifth { width:100%;}
	.footer-toggle { border-top:1px solid #104376; cursor:pointer; padding-top:20px;}
	.noborder { border:none !important;}

	.footer-arrow { position:absolute; right:10px; top:30px; width:18px; height:18px; background:url("../img/arrow-down_w.svg") center center/contain no-repeat; transform:translateY(-50%) rotate(0deg); -webkit-transform:translateY(-50%) rotate(0deg); transition:transform 0.3s ease; -webkit-transition:transform 0.3s ease;}
	.footer-toggle.active .footer-arrow { transform:translateY(-50%) rotate(180deg); -webkit-transform:translateY(-50%) rotate(180deg);}
	footer .cta { text-transform:uppercase;}
	
  	.footer-content { overflow:hidden; max-height:0; transition:max-height 0.4s ease, padding 0.4s ease;; -webkit-transition:max-height .6s ease-in-out, padding .6s ease-in-out; padding:0;}
	.footer-content .c-less { display:block; border-top:1px solid #104376; padding:10px 0;}
	.footer-content.open { padding:0 0 30px 0;}
	footer .prev-btn { width:100%; margin:20px 0 !important;}
	
	.preventivo { width:100%; right:-102%; padding:70px 40px 30px 40px;}
	.name, .email { width:100%;}
	
	/* home */
	.push-down { padding-top:170px;}
	.billboard-footer { bottom:80px;}
	.billboard-footer .cta { margin-top:10px;}
	.artisan { height:200px; padding:35% 0;}
	
	.luna { width:150px;}
	.luna-swiper { top:0; right:60%;}
	
	.home-italy { padding:40vw 0 17vw 0;}
	.parallax-square { width:64vw; height:64vw;}
	.ps-sx { left:-10%; top:20vw;}
	.ps-dx { right:-10%; top:53vw;}

	/* storia */
	.luna-chisiamo { top:20vh;}
	.mosaic:not(.m7) { position:relative;}
	.mosaic-fix { margin-top:0;}
	.m1,.m2,.m3,.m4,.m5,.m6,.m8 { top:auto; left:auto; right:auto; min-height:auto; min-width:auto;}
	.m1 { margin:-16vw 0 40px 30%; width:70%; height:50vw; object-fit:cover;}
	.m3 { margin:-20vw 50% 0 0; width:50%; height:37vw; object-fit:cover;}
	.m4 { margin:-19vw 0 0 45%; width:50%; height:37vw; object-fit:cover; z-index:11;}
	.m2 { margin:-7vw 0 40px 10%; width:60%; height:45vw; object-fit:cover;}
	.m8 { margin:-25vw 0 40px 40%; width:40%; height:30vw; object-fit:cover;}
	
	.m6 { width:60%; height:60vw; object-fit:cover; margin-bottom:40px;}
	.m5 {  width:40%; height:60vw; object-fit:cover; margin-bottom:40px;}
	.m7 { top:-200px; left:0; width:90vw;}
	.chisiamo-footer { padding-bottom:50%;}

	/* italian */
	.ps-sx2 { left:-23%; top:-11vw}
	.ps-dx2 { right:-23%; top:14vw;}
	.center-phrase { max-width:450px; margin:0 auto;}
	.luna-italian { top:-120px; left:48%;}

	.circle-wrap { width:66vw; height:66vw; margin-left:-25vw; max-width:auto; max-height:auto;}
	.italian-pushup { margin-top:-16vw; padding-top:30vw;}
	
	/* collection */
	select.filter { margin-bottom:6px;}
	#productsContainer.grid-view, #productsContainer.list-view { grid-template-columns:repeat(1, 1fr); gap:35px;}
	.grid-blur { opacity:1;}
	.tag-mini { margin:10px 5px 0 0;}
	
	.swiper-collection .swiper-arch { width:300px; height:450px;}
	.arch-content { padding:60px 30px 30px 30px;}
	
	/* product */
	.bubble .onefifth { width:50%; margin-bottom:30px;}
	.bubble .onefifth:nth-child(4), .bubble .onefifth:nth-child(3) { margin-bottom:0;}
	.swiper-slide.grid-item { width:80%;}
	.accordion-content:last-child { border-bottom:1px solid #1d4872;}
	
	/* performance */
	.submenu-wrapper { overflow-x:auto; white-space:nowrap; scrollbar-width:none; -ms-overflow-style:none;}
	.gr-submenu { position:absolute; top:0; right:-2px; width:200px; height:100%; pointer-events:none; background: #252525; background: -webkit-linear-gradient(90deg, rgba(37, 37, 37, 0) 2%, rgba(37, 37, 37, 1) 88%); background: -moz-linear-gradient(90deg, rgba(37, 37, 37, 0) 2%, rgba(37, 37, 37, 1) 88%); background: linear-gradient(90deg, rgba(37, 37, 37, 0) 2%, rgba(37, 37, 37, 1) 88%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#252525", endColorstr="#252525", GradientType=1);}
	
	.materiale-logo { width:120px; height:80px; margin-bottom:0;}
	.tecnologie { padding:30px;}
	.img-inside { margin-top:30px;}
	
	/* contact */
	.world { left:-40%;  width:180%;}

}



/* IF iPHONE */
@media only screen and (max-device-width:768px) and (orientation:landscape) {
	.noland { display:block; position:fixed; width:100%; height:100%; left:0; top:0; z-index:1999; text-align:center;}	
	.noland-img { width:140px; height:140px; margin:40px 0;}
	html, body { overflow:hidden !important;}
}

/* HAMBURGER */
.hamburger { padding-top:7px; display:inline-block; overflow:hidden;}
.hamburger__container { width:36px; height:24px; position:relative;}
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after { background-color:#fff;}
.hamburger { display:inline-block; cursor:pointer; transition-property:opacity, -webkit-filter; transition-property:opacity, filter; transition-property:opacity, filter, -webkit-filter; transition-duration:0.15s; transition-timing-function:linear; font:inherit; color:inherit; text-transform:none; background-color:transparent; border:0; margin:0; overflow:visible;}
.hamburger-box { width:25px; height:8px; margin-right:8px; display:inline-block; position:relative;}
.hamburger-inner { display:block; top:50%; margin-top:-2px;}

.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after { width:100%; height:1px; background-color:#fff; position:absolute; transition:all .5s; -webkit-transition:all .5s; -o-transition:all .5s; -moz-transition:all .5s;}

.hamburger-inner::before, .hamburger-inner::after { content:""; display:block;}
.hamburger-inner::before { top:-8px;}
.hamburger-inner::after { bottom:-8px; width:100%;}
.is-active .hamburger-inner,.is-active .hamburger-inner::after { background-color:#fff !important;}

.ham:hover .is-active .hamburger-inner::after,.ham:hover .is-active .hamburger-inner { background-color:#fff;}

/* CHANGE THE BELOW PACK TO CHANGE EFFECT */
.hamburger--squeeze .hamburger-inner{transition-duration:.1s;transition-timing-function:cubic-bezier(0.55,0.055,0.675,0.19)}.hamburger--squeeze .hamburger-inner::before{transition:top .1s  ease,opacity .1s ease}.hamburger--squeeze .hamburger-inner::after{transition:bottom .1s  ease,-webkit-transform .1s cubic-bezier(0.55,0.055,0.675,0.19);transition:bottom .1s  ease,transform .1s cubic-bezier(0.55,0.055,0.675,0.19);transition:bottom .1s  ease,transform .1s cubic-bezier(0.55,0.055,0.675,0.19),-webkit-transform .1s cubic-bezier(0.55,0.055,0.675,0.19)}.hamburger--squeeze.is-active .hamburger-inner{-webkit-transform:rotate(45deg);transform:rotate(45deg);transition-timing-function:cubic-bezier(0.215,0.61,0.355,1)}.hamburger--squeeze.is-active .hamburger-inner::before{top:0;opacity:0;transition:top .1s ease,opacity .1s ease}.hamburger--squeeze.is-active .hamburger-inner::after{bottom:0;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);transition:bottom .1s ease,-webkit-transform .1s cubic-bezier(0.215,0.61,0.355,1);transition:bottom .1s ease,transform .1s cubic-bezier(0.215,0.61,0.355,1);transition:bottom .1s ease,transform .1s cubic-bezier(0.215,0.61,0.355,1),-webkit-transform .1s cubic-bezier(0.215,0.61,0.355,1)}