html {
	overflow-x:hidden;
	font-size:18px;
}
body.admin-bar header, body.admin-bar #mobile-menu { top:32px !important; }

html, body {
	font-family:'Karla';
	font-weight:400;
	color:var(--text);
	line-height:1.7;
	max-width:2560px;
	margin:0 auto;
	background-color:white;
	min-height:100%;
}


cite {
	display:inline-block;
	color:var(--gray);
	font-size:40px;
	text-align:center;
	font-family:'EBGaramond', Arial;
	font-style:normal;
	padding:10px;
	line-height:1;
	margin:30px 0;
}

h1, h2 {
	font-family:'EBGaramond', Arial;
	font-size:clamp(2.5rem, 4.375rem, 6vw);
	color:var(--accent);
	font-weight:400;
	line-height:1.2;
	margin-bottom:2rem;
}

h2 {
	font-size:clamp(2rem, 3.125rem, 4vw);
	font-weight:normal;
	line-height:1.2;
}
h3 {
	font-weight:700;
	font-size:1.375rem;
	margin-bottom:1rem;
	line-height:1.3;
}
h4 {
	font-weight:700;
	text-transform:uppercase;
	margin-bottom:1rem;
}
h5 {
	font-weight:700;
	margin-bottom:1rem;
}
h6 {
	margin-bottom:1rem;
	text-transform:uppercase;
}

hr {
	display:inline-block;
	border:none;
	height:0.125rem;
	width:10rem;
	background-color:var(--accent);
	margin-block:1rem;
}

a {
	text-decoration:none;
	transition:all 0.3s ease;
}
a:hover { color:var(--accent); }

b, strong { font-weight:700; }
i, em {
	font-style:italic;
}

.bg-accent { background-color:var(--accent) !important;	}
.bg-gray { background-color:var(--gray) !important;	}
.bg-menu { background-color:var(--gray) !important;	}
.accent { color:var(--accent) !important; }
.gray { color:var(--gray) !important; }
.menu { color:var(--menu) !important; }

body {
	color:var(--text);
}
a,input,textarea,select,option {
	color:var(--text);
}

img {
	width:100%;
	height:auto;
}

.wrapper { 
	margin:0 auto;
	width: min(92vw, var(--wrapper));
  	padding: 0 4vw;
  	box-sizing: content-box;
}

.elementor-template-full-width #content{
    padding: 0;
}

header {
	width:100%;
	z-index:9;
	transition:all 0.3s ease;
	background-color: var(--accent);
}
header #logo {
	display:flex;
	justify-content:center;
	align-items:center;
	transition:all 0.3s ease;
}
header.sticky {
	position:fixed;
	top:0;
	left:0;
	box-shadow:0 0 15px 0 rgba(0,0,0,0.2);
}
header.sticky #logo { height:60px; }

.header-bg {
	position:relative;
	padding-block:clamp(3rem, 6rem, 6vw) clamp(2rem, 4rem, 4vw);
	top:0;

	h1 {
		position:relative;
		z-index:0;
		margin:0;
		display:inline-block;
		width:100%;

		.overtitle {
			font-size:clamp(2.8rem, 8.125rem, 8vw);
			font-weight:400;
			color:#e8e8e8;
			position:absolute;
			bottom:2.5rem;
			left:clamp(0.5rem, 2.2rem, 2vw);
			z-index:-1;
			line-height:0.7;
		}
	}
}

.mb-0 { margin-bottom:0 !important; }
.mb-1 { margin-bottom:1rem !important; }
.mb-2 { margin-bottom:2rem !important; }
.mb-3 { margin-bottom:3rem !important; }
.mb-4 { margin-bottom:4rem !important; }

.align-left { text-align:left !important; }

.elementor-widget-button a,
.elementor-widget-button a:visited,
.button {
	display:inline-flex;
	justify-content:center;
	align-items:center;
	height:3rem;
	color:var(--accent);
	border:0.0625rem solid var(--accent);
	background-color:white;
	padding-inline:3rem;
	transition:all 0.3s ease-out;
	cursor:pointer;
	text-transform:uppercase;
	font-weight:700;
	border-radius:1.5rem;

	&.button-outline {
		color:var(--accent);
		border:0.125rem solid var(--accent);

		&:hover {
			color:white;
			background-color:var(--accent);
		}
	}
}
.elementor-widget-button:hover a,
.elementor-widget-button a:hover {
	color:white !important;
	background-color: var(--accent);
}


/* menu */
header > div {
	display:flex;
	justify-content:space-between;
	align-items:center;
	padding-block:1rem !important;

	#logo img {
		height:2rem;
	}

	.menu {
		display:flex;
		font-size:1.2rem;
		gap:2rem;

		.menu-item {
			position:relative;

			a {
				text-transform:uppercase;
				color:white;
				display: inline-flex;
				align-items: center;
				font-size:16px;

				&::after {
					content: "";
					position: absolute;
					z-index: 6;
					left: 0;
					width: 0;
					bottom: 12px;
					transform: translateY(10px);
					background:white;
					height:1px;
					transition-property: width;
					transition-duration: 0.3s;
					transition-timing-function: ease-out;
				}

				&:hover::after {
					width:100%;
				}
			}

			&.current_page_item a {
				pointer-events:none;

				&::after {
					width:100%;
				}
			}
		}
	}
}


.header-bg {
	width:100%;
	background-position:center center;
	background-repeat:no-repeat;
	background-size:cover;
}

.menu .menu-item:hover > .sub-menu,
.menu .menu-item .sub-menu:hover {
	display:inline-block;
	height:80px;
}

.page-title {
	height: 100%;
	display: flex;
	align-items: center;
}

/* mobile menu */
#mobile-menu, #nav-btn { display:none; }

.nav-btn {
	width: 48px;
	height: 48px;
	transform: rotate(0deg);
	cursor: pointer;
	border-radius: 50%;
	cursor:pointer;

	span {
		display: block;
		position: absolute;
		height: 2px;
		width: 50%;
		border-radius: 1px;
		opacity: 1;
		left: 12px;
		transform: rotate(0deg);
		background:white;

		&:nth-child(1) {
			top:14px;
			left:9px;
		}
		&:nth-child(2) {
			top:23px;
			left:9px;
		}
		&:nth-child(3) {
			top:32px;
			left:9px;
		}
	}

	&.open span {
		background:var(--text);

		&:nth-child(1) {
			top: 23px;
			left: 12px;
			-webkit-transform: rotate(45deg);
			-moz-transform: rotate(45deg);
			-o-transform: rotate(45deg);
			transform: rotate(45deg);
		}
		&:nth-child(2) {
			opacity: 0;
			background:var(--text);
		}
		&:nth-child(3) {
			top: 23px;
			left: 12px;
			-webkit-transform: rotate(-45deg);
			-moz-transform: rotate(-45deg);
			-o-transform: rotate(-45deg);
			transform: rotate(-45deg);
		}
	}
}

#mobile-menu {
	padding:4vw;
	position: fixed;
	left:0;
	top:0;
	width:100vw;
	height:100vh;
	/*transition:all .3s ease;*/
	color:white;
	background:var(--accent);
	z-index:999999;
	display:none;
	overflow: hidden;
	z-index:99; 

	.nav-btn {
		position: absolute;
		top:1rem;
		right:2vw;

		span {
			background-color: white;
		}
	}

	#logo {
		width:80%;
		display: inline-block;

		img { width:100% !important; }
	}

	.menu {
		margin-top:5vh;

		li {
			padding:0.5rem 0;

			a {
				color: white;
				text-transform: uppercase;
				font-size: 1.2rem;
				font-weight: 700;
			}

			&.current_page_item a {
				text-decoration: underline;
			}
		}
	}

	hr {
		height: 1px;
		width: 100%;
		background-color: white;
		margin-block: 2rem;
	}

	.socials {
		display:flex;
		gap:1rem;

		a {
			font-size:1.5rem;
			i {
				color: white;
			}
		}
	}
}

/* main */
.elementor-column-gap-default>.elementor-column>.elementor-element-populated {
    padding:0;
}

#content {
	padding-block:clamp(2rem, 4rem, 4vw);
}

#SR7_1_1 {
 box-shadow:0 0 2rem 0 rgba(0,0,0,0.4);
}

.grecaptcha-badge { display:none !important; }

.border-left {
	position:relative;

	&::before {
		content:'';
		background-color: var(--accent);
		width:3px;
		height:150px;
		top:0;
		left:-3px;
	}
}
/* opera */
.opera-container {
	display:grid;
	grid-template-columns:2fr 1fr;
	grid-column-gap:min(5rem, 4vw);
	grid-row-gap:2rem;
	padding-top: 0 !important;

	.opera-image {
		img {
			box-shadow: 0 0 2rem 0 rgba(0,0,0,0.40);
		}
	}
	.opera-info {
		h2 {
			font-family:'Karla';
			color:var(--text);
			font-weight:700;
			font-size:1.375rem;
			margin-bottom: 0;
		}
		span {
			color:var(--gray);
			font-family:'EBGaramond';
			font-weight:400;
			font-size:1.375rem;
		}
		hr {
			width:100%;
		}
		h3 {
			font-size:1rem;
			color: var(--accent);
			text-transform:uppercase;
			margin-bottom:0;
		}
		p {
			margin-bottom:1rem;
			font-weight:700;
		}

		.opera-images {
			display:grid;
			grid-template-columns:1fr 1fr 1fr;
			gap:1rem;
			margin-block:2rem;
		}

		.button {
			margin-top:2rem;
		}
	}
}

.noscroll {
	overflow: hidden;
}

#gallery-modal {
	display: none;
	z-index: 999999;
	position: relative;
	background: rgba(0, 0, 0, 0.95);
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;

	#closeModal {
		position: absolute;
		line-height: 1;
		top: 2rem;
		right: 2rem;
		color: white;
		font-size: 2.5rem;
		z-index: 10000;
		cursor: pointer;
		transition: all 0.3s ease;

		&:hover {
			color: var(--accent);
		}
	}

	#inner-modal {
		display: flex;
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: calc(100% - 6rem);
		justify-content: center;
		align-items: center;
		z-index: 9998;
		justify-content: center;
		align-content: center;
		align-items: center;
		padding-inline: 4rem;

		&.only {
			height:100%;
		}

		#inner-modalContent {
			position: relative;
			height: 90%;
			display: flex;
			justify-content: center;
			align-items: center;

			img {
			    width: auto;
			    height: auto;
			    display: block;
			    max-width: 100%;
			    max-height: 100%;
			}
		}
	}

	#inner-list {
		display: flex;
		justify-content: center;
		gap: 1rem;
		position: fixed;
		bottom: 0;
		height: 6rem;
		left: 0;
		width: calc(100% - 2rem);
		transform: translateX(1rem);
		margin: 0 auto;
		z-index: 9999;
		visibility: hidden;
		overflow-x: auto;
		scroll-behavior: smooth;
		white-space: nowrap;

		img {
		    height: 5rem;
		    width: auto;
		    cursor: pointer;
		    border: 0.1875rem solid transparent;
		    transition: all 0.3s ease;

		    &.thumb-active {
		      border: 0.1875rem solid white;
		      pointer-events: none;
		    }

		    &:hover {
		      border: 0.1875rem solid var(--accent);
		    }
		}

		&.visible {
			visibility: visible;
		}
	}
}

.navArrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	color: white;
	font-size: 50px;
	cursor: pointer;
	padding: 1rem;
	user-select: none;
	width: 4rem;
	transition: all 0.3s ease;

	&:hover {
		color:var(--accent);
	}
}
#navLeft {
	left: 0;
}
#navRight {
	right: 0;
}

#modal-container {
	display:none;
	z-index: 999999;
	position:relative;
	background: rgba(0, 0, 0, 0.95);
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
.modal-content-box {
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	width:min(700px, 92vw);
	max-height:calc(100% - 6rem);
	z-index: 9998;
	padding:2.5rem;
	background-color: white;
	position:relative;
	overflow-y:auto;

	h3 {
		color: var(--text);
		line-height:1.3;
	}

	input[type="submit"] {
		border-color: var(--main);
		text-transform:uppercase;
		font-weight:bold;
		cursor:pointer;
		transition:all 0.3s ease;

		&:hover {
			background-color:var(--main);
			color:white;
		}
	}
}
.modal-overlay {
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
}
#close-modal {
	position: absolute;
	line-height:1rem;
	top:1rem;
	right:1rem;
	color:var(--text);
	font-size:2.2rem;
	z-index: 10000;
	cursor:pointer;
	transition:all 0.3s ease;

	&:hover {
		color:var(--main);
	}
}
/**/

/* elenco opere */
.age-template-opere-template #content {
 padding-bottom:4rem;
}
.gallery-filters {
	margin-bottom:4rem;
	display:flex;
	justify-content:center;
	gap:2rem;
	flex-wrap:wrap;

	.active {
		background-color: var(--accent);
		color:white !important;
		pointer-events: none;
	}
}
.gallery-container {
	margin:0 auto;
	position:relative;
	width:100%;
	transition: all 0.3s ease;

	.gallery-item {
		position: absolute;
		cursor:pointer;
		transition:all 0.3s ease;

		.img {
			box-shadow: 0 0 2rem 0 rgba(0,0,0,0.40);
			overflow:hidden;

			img {
				display:block;
			}
		}
		.img::before {
			content: '';
			position: absolute;
			top:0;
			left:0;
			width: 100%;
			height: 100%;
			background: linear-gradient(
				0deg, 
				transparent, 
				transparent 30%, 
				rgba(255,255,255,0.3)
			);
			transition: all 0.5s ease;
			opacity: 0;
		}

		.title {
			font-weight: 700;
			font-size:1.375rem;
			line-height:1.2;
			margin-top:1rem;
			transition:all 0.3s ease;
		}
		.author {
			font-size:1.375rem;
			color: var(--gray);
			font-family: 'EBGaramond';
			transition:all 0.3s ease;
		}

		&:hover {
			.img::before {
			  opacity: 1;
			}

			.title {
				color:var(--accent);
			}
			.author {
				color: var(--text);
			}
		}
	}
}

/* CONTATTI */
.page-id-18 #content,
.page-id-131 #content {
	padding-bottom: 0;

	iframe {
		display:block;
	}
}

/* FORM */
input:focus, textarea:focus {
	outline:0 none !important;
}
.contact-form {
	display:grid;
	grid-template-columns:1fr 1fr;
	grid-column-gap:2rem;
	grid-row-gap:1rem;

	.wide {
		grid-column-start: 1;
		grid-column-end: 3;
	}
	
	input:not([type="checkbox"], [type="radio"]) {
		display:inline-block;
		border:0.125rem solid var(--gray);
		color: var(--text);
		height:3rem;
		border-radius:0.25rem;
		line-height:1.6rem;
		width:100%;
		padding-inline:1rem;
		transition:all 0.3s ease;
		font-family:'Karla';
		font-size:1rem;
		font-weight:700;
		
		&:focus {
			border:0.125rem solid var(--accent);
		}
	}
	input.wpcf7-not-valid,
	textarea.wpcf7-not-valid {
		border-color:red;
	}

 	textarea {
		width:100%;
		height:6rem;
		border-radius:0.25rem;
		border:0.125rem solid var(--gray);
		color: var(--text);
		padding:1rem;
		font-family:'Karla';
		font-size:1rem;
		font-weight:700;
		transition:all 0.3s ease;

		&:focus {
			border:0.125rem solid var(--accent);
		}
	}

	.form-req { color:red; }

	.wpcf7-list-item:not(.last) {
		margin-left:0;
	}
	.wpcf7-form-control-wrap {
		position: relative;
		display: inline-block;
		width: 100%;

		.wpcf7-not-valid-tip {
			position:absolute;
			bottom:-1.4rem;
			display: none;
		}
	}
	
	label { cursor:pointer; }

	.acpt a {
		color:var(--accent);
		text-decoration:underline;
	}

	input.wpcf7-submit {
		display:inline-flex;
		justify-content:center;
		align-items:center;
		height:3rem;
		color:var(--accent);
		border:0.0625rem solid var(--accent);
		background-color:white;
		padding-inline:3rem;
		transition:all 0.3s ease-out;
		cursor:pointer;
		text-transform:uppercase;
		font-weight:700;
		border-radius:1.5rem;
		color:var(--accent);
		border:0.125rem solid var(--accent);

		&:hover {
			color:white;
			background-color:var(--accent);
		}
		&:disabled {
			color:var(--accent);
			background-color:white;
			opacity:0.3;
			cursor:not-allowed;
		}
	}
}


/**/

footer {
	z-index:3; width:100%;
	background-color:var(--accent);

	.upper-footer-content {
		display:grid;
		grid-template-columns:1fr 0.5fr 1fr;
		gap:1rem;
		padding-block:clamp(2rem, 4rem, 4vw);
		font-size:16px;

		h3, p, a {
			color:white;
		}
		a {
			position:relative;

			&::after {
				content: "";
				position: absolute;
				z-index: 6;
				left: 0;
				width: 0;
				bottom: 12px;
				transform: translateY(10px);
				background: white;
				height: 1px;
				transition-property: width;
				transition-duration: 0.3s;
				transition-timing-function: ease-out;
			}

			&:hover::after {
				width:100%;
			}
		}
		h3 {
			margin-bottom:2rem;
		}
		.mb-1 {
			margin-bottom:0.7rem !important;
		}

		img {
			width:min(16.5rem, 100%);
			margin-bottom:1.6rem;
		}

		.menu li {
			margin-bottom:0.2rem;

			a {
				text-transform: uppercase;
				
			}
		}
	}

	#copyright {
		text-align:center;
		padding:1rem 0;
		font-size:0.9rem;
		color:white;
		border-top:0.125rem solid white;
		display:flex;
		justify-content:space-between;
		align-items:center;

		div {
			flex-shrink:0;
		}

		a {
			color:white;
			text-decoration: underline;

			i {
				font-size:1.5rem;
				margin-right:0.5rem;
				transition: all 0.3s ease;

				&:hover {
					transform: scale(1.2);
				}
			}
		}
	}
}


@media (max-width:1024px) {
	header.sticky { min-height: 60px; }
	.menu-main-it-container,
	.menu-main-en-container { display:none; }
	.mob-menu-container .menu-main-container { display:block; }
	#mobile-menu .menu-main-it-container,
	#mobile-menu .menu-main-en-container { display:block; }

	#mobile-menu .menu-item-wpml-ls-17-en,
	#mobile-menu .menu-item-wpml-ls-17-it {
		max-width:1.2rem;
	}

	#nav-btn { display:inline-block; }
	header.sticky .nav-btn {
		top: 50%;
		transform: translateY(-50%);
	}
	header.sticky #nav-btn span { background:var(--text); }

	.header-bg h1 .overtitle {
		bottom:1.6rem;
	}

	.gallery-filters {
		margin-bottom:3rem;
		gap:1rem;
	}

	.opera-container {
		display: grid;
		grid-template-columns:1fr;
		grid-row-gap: 2rem;
	}
}

@media (max-width:768px) {
	.border-left::before {
		display: none;
	}

	footer { 
		.upper-footer-content {
			grid-template-columns:1fr;
			gap:1.5rem;

			h3 {
				margin-bottom: 0.5rem;
			}
		}

		#copyright {
			justify-content:center;
			gap: 1rem;

			& > div:last-child {
				padding-inline:2rem;
			}
		}
	}
}

@media (max-width:680px) {
	footer #copyright {
		flex-direction:column;
		flex-wrap:nowrap;
	}
}

@media (max-width:560px) {
	.contact-form {
		grid-template-columns:1fr;

		.wide {
			grid-column-start: 1;
			grid-column-end: 2;
		}
	}
}
@media (max-width:440px) {
	header #nav-btn {
		flex-shrink:0;
	}
	header > div {
		gap:1.5rem;
	}
	header > div #logo img {
  	  height:auto;
  	  width:100%;
	}
}

/* cookieyes banner */
.cky-consent-bar button,
.cky-modal .cky-prefrence-btn-wrapper button {
    border-radius:0;
    padding:5px 15px;
    font-size:14px;
    border-color:var(--text) !important;
    background-color:white !important;
    color:var(--text) !important;
    transition:all 0.3s ease;
}

.cky-consent-bar button.cky-btn-accept,
.cky-modal .cky-prefrence-btn-wrapper button.cky-btn-accept {
    background-color:var(--text) !important;
    color:white !important;
}

.cky-consent-bar button:hover,
.cky-modal .cky-prefrence-btn-wrapper button:hover {
    background-color:var(--accent) !important;
    color:white !important;
    border-color:var(--accent) !important;
}

button.cky-show-desc-btn:not(:hover):not(:active) {
    color:var(--text) !important;
}
.cky-revisit-bottom-right,
.cky-revisit-bottom-left {
    background-color:var(--accent) !important;
}
.cky-switch input[type="checkbox"]:checked {
    background:var(--accent) !important;
}
.cky-accordion-header .cky-accordion-btn {
    border-radius:0 !important;
}

.cky-modal div[data-cky-tag="detail-powered-by"] {
    display: none !important;
}
/* size */
.cky-btn-revisit-wrapper {
    width:32px !important;
    height:32px !important;
    .cky-btn-revisit img {
        height:26px !important;
        width:26px !important;
    }
}
/**/