/*
Theme Name: metroquadro
Version: 1.0
Text Domain: metroquadro
*/
:root {
	/*colori*/	
	--black:#666;
	--white:#fff;
	--gray:#f6f6f6;
	--act-color:#000;	

	--site-bg:#fff;
	/* --site-bg: #f6f5ec; */
	/*font*/
	--uno-rem: 16px;		
	--ff-text: 'Nunito Sans 10pt', sans-serif;
	--ff-title: 'Nunito Sans 10pt', sans-serif;	

	/*layout*/
	--vh: 100vh; /*variabile da tenere anche dopo eventuale replace*/
	--header-h: 5rem;
	--header-pt: 0;
	--header-pb: 0;
	--header-bg: transparent;
	/* --header-sticky-sha: 8px 8px 30px rgba(0, 0, 0, 0.12); */
	--header-sticky-sha: 8px 8px 30px rgba(0,0,0,.12);
	--header-sticky-h: 5rem;
	--header-sticky-pt: 0rem;
	--header-sticky-pb: 0rem;
	--header-sticky-bg: transparent;
	--footer-bg: var(--gray);
	
	--first-section-pt: calc( var(--header-h) - .722rem );

	/*main menu*/
	--ff-menu: var(--ff-title);
	--fs-menu: 1rem;
	--lh-menu: 1rem;
	/* --fw-menu: 400; */
	--color-menu: #707070;	
	--align-menu: start;
	--act-color-menu: #000;

	/*logo*/
	--logo-w: 2.8rem;
	--align-logo: center;
	
}
/*helper*/
input, button[type=submit]{height: 2.2rem; padding: 0 .5rem; border: 1px solid #999;;}
.accordion-button:not(.collapsed){color:var(--act-color);}
.collapsing{opacity:0;}
.collapse{opacity:0; }
.collapse.show{opacity:1; transition: 1s opacity;}
.text-justify{text-align: justify;}
.vh-75{height: 75vh;}
.vh-60{height: 60vh;}
.vh-80{height: 80vh;}
.cky-notice-des a.cky-policy, .cky-notice-des button.cky-policy{color:var(--black) !important;}

tbody, td, tfoot, th, thead, tr{border-width: 1px; padding:.5rem;}
.as-1-1{aspect-ratio:1/1;}
.as-3-2{aspect-ratio: 3/2;}
.as-16-9{aspect-ratio: 16/9;}
.as-21-9{aspect-ratio: 21/9;}
.as-9-16{aspect-ratio: 9/16;}
#loading{width: 100vw; height:100vh; background-color: #fff; position:fixed; z-index: 110;}
.img-bg{background-position: center; background-size: cover; background-repeat: no-repeat;}
.h-view{min-height: calc(100vh - var(--header-h) );}
.w-20{width: 100%;}
@media (min-width: 992px){
	.w-20{width: 20%;}	
}


/*layout*/

html,body{font-family: var(--ff-text); color: var(--black); font-size: var(--uno-rem); background-color: var(--site-bg);}
.sections{padding-top: calc(var(--header-h));}
.sections.home{padding-top:0;}
/* .sections > section{min-height: calc(100vh - var(--header-h));} */

.mobile-img, .mobile .desk-img, .mobile .artista .desk-img{display:none;}
.mobile .mobile-img{display:block;}
.artista .desk-img, .mobile .artista .mobile-img{display:flex;}




/*contact form*/
input, textarea{width: 100%;}
input[type="submit"],
.wpcf7 label{width: 11.111rem; text-transform: uppercase; font-size: 1.111rem; font-weight: 300;}
input[type="submit"]{background-color: var(--blue); color: var(--white); height: 3.333rem;}
.wpcf7-spinner{display:none;}

/*color*/
.black{color: var(--black) !important;}
.white{color: var(--white) !important;}

/*background*/
.black-bg{background: var(--black) !important;}
.white-bg{background: var(--white) !important;}
.gray-bg{background: var(--gray) !important;}

/*typo*/
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{color:var(--black);}
a{text-decoration: none; color:var(--black);}
h2{font-size:1.5rem; font-weight: 600;}
.title{font-size:2rem; font-weight: 600; text-transform: uppercase; text-decoration: none;}
.mobile .title{font-size: 1.3rem;}
.home .title, .artista .title{color:#fff; font-size: 3rem; text-shadow: 1px 1px 6px #000;}
.artista .title{font-size: 5rem;}


.fw-200{font-weight: 200 !important;}
.fw-300{font-weight: 300 !important;}
.fw-400{font-weight: 400 !important;}
.fw-500{font-weight: 500 !important;}
.fw-600{font-weight: 600 !important;}
.fw-700{font-weight: 700 !important;}
.fw-bold{font-weight: bold !important;}
.fw-normal{font-weight: normal !important;}

.fs-14{font-size:14px;}
.fs-16{font-size:1rem;}
.fs-18{font-size:18px;}
.lh-18{line-height: 18px;}

/*header*/
header{z-index:100; position:fixed; height: var(--header-h);  width: 100%; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease; padding-top: var(--header-pt); padding-bottom: var(--header-pb);background-color: var(--site-bg);}
.home header{background-color: transparent; height: 7rem;}
header.header-sticky{z-index: 100; position:fixed; height: var(--header-sticky-h);  padding-top: var(--header-sticky-pt); padding-bottom: var(--header-sticky-pb); box-shadow: var(--header-sticky-sha);background-color: var(--site-bg);}
.logo-wrap{width: var(--logo-w); display:flex; align-items: var(--align-logo); height:100%;}
.logo-wrap img{width: 100%; max-width: 100%; height: auto;}
.logo-home{display:none;}

.home .logo-wrap{ width: 4rem;}
.home .logo-home{display:block; box-shadow: 3px 3px 6px 0 #00000063}
.home .logo{display:none;}

.menu{list-style: none;  margin:0; padding: 0;}
.menu a{font-weight: 300;font-size:var(--fs-menu); text-transform: uppercase;}
.menu a:hover{font-weight: bold;}
.menu .current-menu-item a{color: var(--act-color); font-weight:bold;}

/*slide-nav*/
#slide-nav{width: 100%; position:fixed; right:-100%;  z-index:11; transition: right .4s ease-out; height: 100vh; background-color: var(--site-bg); padding-top: 10rem}
#slide-nav.translate{display:block;right:0;}
.slide-nav-head{display: flex; justify-content: space-between;}
.slide-nav-head p {margin-bottom:69px;}
#slide-nav .menu li{padding-bottom:.3rem;}
#slide-nav .menu > li#menu-item-search{display:none;}

/*header-desk*/
.desk-nav-wrap{display:flex; align-items: var(--align-menu);}
.header-sticky .desk-nav-wrap{align-items:center;}
.mobile #desk-nav{display:none;}
#desk-nav .menu a{font-size: var(--fs-menu); line-height: 1; color: var(--color-menu); font-weight: 600;}

#desk-nav .menu a:hover,
#desk-nav .menu > li.current-menu-item > a,
.single-artists #desk-nav .menu li.menu-item-artisti > a{color:var(--act-color-menu);}

.home #desk-nav .menu a{font-size: 1.3rem; color:#fff; text-shadow: 1px 1px 6px #000;}
.home .header-sticky #desk-nav .menu a{color: var(--black); text-shadow: none;}
#desk-nav .menu{height:100%; display: flex; justify-content: end; align-items: center;} 
#desk-nav .menu > li{margin: 0 1.5rem; position:relative;}
#desk-nav .menu > li:after{content:''; background:url('img/graph/freccia-up.svg'); background-size: contain; background-repeat: no-repeat; background-position: center;position: absolute; width: 1.889rem; height: 1rem; bottom: -1.85rem; left: calc( 50% - .944rem );}
#desk-nav .menu > li:first-child{border-left: 0; margin-left: 0;}
#desk-nav .menu > li:last-child{margin-right: 0;}
#desk-nav .menu > li > ul.sub-menu {height:0; position:absolute; top: calc(100% + 1px); right:0; overflow:hidden; background: var(--theme-color); width: max-content; width: -webkit-max-content; width: -moz-max-content; }
#desk-nav .menu > li ul.sub-menu li{padding:2px 0;}
#desk-nav .menu > li > ul.sub-menu > li > a{color: var(--act-color-menu); text-transform: uppercase; font-size:1vw;}
#desk-nav .menu > li > ul.sub-menu > li > a:hover{text-decoration:underline;}
#desk-nav .menu > li:hover > ul.sub-menu {height:auto; padding:14px 40px 19px; list-style: none;}
#desk-nav .menu > li.home-link-menu{display:none;}

/*footer*/
footer p a:hover{color:#000;}
footer p, footer a{margin-bottom: 0;}
footer .info{display: flex; justify-content: flex-start;}
.partner-footer{ background-color: #343434; padding: 1rem 0;}
.partner-footer img{height: 1.5rem; width: auto;}
.partner-footer a{margin: 1rem 1.5rem; }
.copy-footer{ font-size: .8rem; font-weight:600;}


@media (max-width: 991px){	

	.hamb-slide.hamburger{display:flex;}	
	.copy-dx{text-align: left;}
	.copy-dx a{margin-left:0;}	
	.container{padding-left:25px; padding-right:22px;}
	#map{height: 25rem;}
}

/*hamburger*/
#slide-nav{display:block !important;}
.hamb-wrap{display:none; line-height: unset;}
.mobile .hamb-wrap{display:block;}
/* .hamb-slide.hamburger{display:none; align-items: center;} */.hamb-slide.hamburger{display:block; align-items: center;}
.mobile .hamb-slide.hamburger{display: block;}
#slide-nav .hamb-slide.hamburger{display:block; text-align: right; margin-top: -2px;}
.hamb-mobi.hamburger{display:none;}
.hamburger {align-items:center; cursor: pointer;transition-property: opacity, 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:hover {opacity: 0.7; }
.hamburger.is-active:hover {opacity: 0.7; }
.hamburger.is-active .hamburger-inner, .hamburger.is-active .hamburger-inner::before, .hamburger.is-active .hamburger-inner::after {background-color: #a0a0a0; }
.hamb-slide.hamburger.is-active .hamburger-inner, .hamb-slide.hamburger.is-active .hamburger-inner::before, .hamb-slide.hamburger.is-active .hamburger-inner::after{background-color: var(--black);}
.hamburger-box {width: 40px;height: 24px;display: inline-block;position: relative; }
.hamb-slide .hamburger-box{width: 23px; height:14px;}
.hamburger-inner {display: block;top: 50%;margin-top: -2px; }
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {width: 40px;height: 4px;background-color: #a0a0a0;border-radius: 4px;position: absolute;transition-property: transform;transition-duration: 0.15s;transition-timing-function: ease; }
.hamb-slide .hamburger-inner, .hamb-slide .hamburger-inner::before, .hamb-slide .hamburger-inner::after{width: 23px; height: 3px; background-color: var(--black);}
.hamburger-inner::before, .hamburger-inner::after {content: "";display: block; }
.hamburger-inner::before {top: -10px; }
.hamb-slide .hamburger-inner::before{top:-7px;}
.hamburger-inner::after {bottom: -10px; }
.hamb-slide .hamburger-inner::after{bottom: -7px;}

/* Squeeze  */
.hamburger--squeeze .hamburger-inner {transition-duration: 0.075s;transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--squeeze .hamburger-inner::before {transition: top 0.075s 0.12s ease, opacity 0.075s ease; }
.hamburger--squeeze .hamburger-inner::after {transition: bottom 0.075s 0.12s ease, transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--squeeze.is-active .hamburger-inner {transform: rotate(45deg);transition-delay: 0.12s;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 0.075s ease, opacity 0.075s 0.12s ease; }
.hamburger--squeeze.is-active .hamburger-inner::after {bottom: 0;transform: rotate(-90deg);
transition: bottom 0.075s ease, transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1); }

/*scroll to top*/
#scroll-top {width: 50px; height: 50px; position: fixed; bottom: 55px; right: 20px; z-index: 100; opacity:0; transition: opacity .5s; background-color: grey; display: flex; justify-content: center; align-items: center; font-size: 20px; color: #fff;cursor: pointer;}
#scroll-top.show{ z-index: 100; opacity: 1; }

/*carousel*/
.carousel-indicators [data-bs-target]{width: 1.44rem;height: 1.444rem;margin-right: .5rem;margin-left: .5rem;border-radius:50%; margin-bottom:3rem;}
.carousel-caption{background-color: rgba(255, 255, 255, .7); padding:1rem 3rem;}


/*home*/
#home-carousel .carousel-item, #home-carousel .carousel-item > a{min-height:100vh;}
.artisti-thumb{width: 100%; aspect-ratio:1/1;}
.title-wrap{position:absolute; width: 100%; bottom:4rem;}

/*artisti*/
.artisti-caption{font-size:2rem;}

/*single artista*/


.img-box-gallery{background-color: var(--gray); padding:1rem;}
.gallery .img-bg{background-size: contain;}
.accordion-button{font-size:1.5rem; padding: 1rem 0; font-weight: 600; color:var(--black);}
.accordion-button:focus{border:none; box-shadow: none;}
.accordion-button:not(.collapsed){background-color: transparent; box-shadow: none;}
.accordion-body{column-count:3; column-gap: 2rem; font-size:.85rem;}
.accordion-button:after{background-size: 1.7rem; width: 1.7rem; height: 1.7rem;}


/*mostre*/
#accordionMostre .accordion-button{font-size: 1rem; padding-bottom: .8rem;}
#accordionMostre .accordion-button[aria-expanded="true"]{pointer-events: none;}
#accordionMostre .accordion-button:after{display:none;}
#accordionMostre .accordion-item{border:none;}


/*blocco correlati*/
.correlati{padding: 5rem 0 2rem 0; margin-bottom: 3rem; background-color: var(--gray);}

/*about*/
.about-newsletter input{max-width: 15rem;}
.about-content{font-size: 1.3rem;}
.about .fa-brands{font-size:2rem; line-height: 2;}

@media (min-width: 1400px){
	.mw-1660{max-width: 1660px !important;}
}