@font-face {
	font-family: RoglianoBold;
	src: url('../fonts/RoglianoBold.woff2');
}

@font-face {
	font-family: RoglianoRegular;
	src: url('../fonts/RoglianoRegular.woff2');
}

html {
	-webkit-font-smoothing: antialiased;
	height: 100%;
	overflow-y: scroll;
}

html > *,
html > * > *,
html > * > * > *,
html > * > * > * > li a,
html > * > * > * > li div {
	height: 100%;
}

body {
	font-family: RoglianoBold;
	font-size: 18px;
	background: #f5f4f8;
	background-size: cover;
}

input:focus,
select:focus,
textarea:focus,
button:focus {
	outline: none;
}

ul {
	list-style-type: none;
	padding: 0;
	margin: 0;
}

a {
	text-decoration: none;
}

textarea {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border-radius: 0;
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
}

select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	padding: 7px 7px 5px 7px;
	-webkit-border-radius: 0px;
}

section {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	display: none;
}

	section:before {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 200%;
		background-color: rgba(210,210,210,0.9);
	}

	section > div.row > div {
		padding: 0;
		min-height: 20vh;
	}

::selection {
	background: #30adf9;
	transition: all 1s ease-in-out;
}

::-moz-selection {
	background: #30adf9;
	transition: all 1s ease-in-out;
}

a.no-link {
	cursor: default!important;
}

#nav-icon {
	width: 40px;
	height: 30px;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	-o-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
	z-index: 2;
	overflow: visible;
}

#nav-icon span {
	display: block;
	position: absolute;
	background: #30adf9;
	height: 6px;
	width: 100%;
	opacity: 1;
	left: 0;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .25s ease-in-out;
	-moz-transition: .25s ease-in-out;
	-o-transition: .25s ease-in-out;
	transition: .25s ease-in-out;
}

#nav-icon span:nth-child(1) {
	top: 0px;
}

#nav-icon span:nth-child(2) {
	top: 12px;
}

#nav-icon span:nth-child(3) {
	top: 24px;
}

#nav-icon span:nth-child(4) {
	left: 8px;
	-webkit-transform: rotate(-30deg);
	-moz-transform: rotate(-30deg);
	-o-transform: rotate(-30deg);
	transform: rotate(-30deg);
	background: #18627f!important;
	z-index: -1;
}

#nav-icon span:nth-child(5) {
	left: 24px;
	-webkit-transform: rotate(-30deg);
	-moz-transform: rotate(-30deg);
	-o-transform: rotate(-30deg);
	transform: rotate(-30deg);
	background: #18627f!important;
	z-index: -1;
}

#nav-icon.open span:nth-child(1) {
	top: 18px;
	-webkit-transform: rotate(135deg);
	-moz-transform: rotate(135deg);
	-o-transform: rotate(135deg);
	transform: rotate(135deg);
}

#nav-icon.open span:nth-child(2) {
	opacity: 0;
	left: -60px;
}

#nav-icon.open span:nth-child(3) {
	top: 18px;
	-webkit-transform: rotate(-135deg);
	-moz-transform: rotate(-135deg);
	-o-transform: rotate(-135deg);
	transform: rotate(-135deg);
}

#nav-icon.open span:nth-child(4) {
	opacity: 0;
	left: -20px;
	top: -60px;
}

#nav-icon.open span:nth-child(5) {
	opacity: 0;
	left: 59px;
	top: 60px;
}

.wrapper span,
.wrapper #nav-icon {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.wrapper h1 {
	position: absolute;
	top: 50%;
	transform: translate(0%, -50%);
}

.bold {
	font-family: RoglianoBold;
}

.blue {
	color: #18627f;
}

main > ul {
	list-style: none;
}

	main > ul > li {
		height: 20vh;
		padding: 0!important;
	}

		main > ul > li > a {
			display: block;
			position: relative;
			overflow: hidden;
		}

			main > ul > li > a > div q {
				color: #000;
			}

			main > ul > li > a > div.tile1 {
				transition: background-color 1s;
			}

			main > ul > li > a > div.tile2 {
				width: 100%;
				height: 100%;
				position: absolute;
				transition: background-color 1s;
			}

				main > ul > li > a > div:hover {
					background-color: rgba(255,255,255,.3)!important;
				}

				main > ul > li > a > div:before {
					position: absolute;
					top: 0; right: 0; bottom: 0; left: 0;
					background-color: inherit;
					content: "";
				}

				main > ul > li > a > div span {
					text-transform: lowercase;
					text-align: center;
				}

#position1 div.tile1 {
	background: url('../img/262626.png') center repeat;
	background-size: cover;
}

#position2 div.tile1 {
	background: url('../img/ffffff.png') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position2 div.tile2 {
	background: url('../img/f5f5f5.png') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position3 div.tile1 {
	background: url('../img/f2f1f5.png') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position3 div.tile2 {
	background: url('../img/e2e2e2.png') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position4 div.tile1 {
	background: url('../img/f0ecee.png') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position4 div.tile2 {
	background: url('../img/4.2.jpg') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position5 div.tile1 {
	background: url('../img/f5f5f5.png') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position5 div.tile2 {
	background: url('../img/f2f1f5.png') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position6 div.tile1 {
	background: url('../img/f2eff0.png') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position6 div.tile2 {
	background: url('../img/f0ecee.png') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position7 div.tile1 {
	background: url('../img/7.1.jpg') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position7 div.tile2 {
	background: url('../img/262626.png') center repeat;
	background-size: cover;
	color: #fff;
}

#position8 div.tile1 {
	background: url('../img/fafafa.png') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position8 div.tile2 {
	background: url('../img/e2e2e2.png') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position9 div.tile1 {
	background: url('../img/e2e2e2.png') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position9 div.tile2 {
	background: url('../img/9.2.jpg') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

	#position9 q {
		color: #3c3c3c;
	}

#position10 div.tile1 {
	background: url('../img/10.1.jpg') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position10 div.tile2 {
	background: url('../img/fafafa.png') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position11 div.tile1 {
	background: url('../img/f0ecee.png') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position11 div.tile2 {
	background: url('../img/ffffff.png') center repeat;
	background-size: cover;
	color: black;
}

#position12 div.tile1 {
	background: url('../img/f0ecee.png') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position12 div.tile2 {
	background: url('../img/f2f1f5.png') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position13 div.tile1 {
	background: url('../img/f5f5f5.png') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position13 div.tile2 {
	background: url('../img/e2e2e2.png') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position14 div.tile1 {
	background: url('../img/ffffff.png') center repeat;
	background-size: cover;
	color: #3c3c3c;
	-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	-o-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
}

	#position14 div.tile1:hover {
		color: black;
	}

#position14 div.tile2 {
	background: url('../img/262626.png') center repeat;
	background-size: cover;
	color: #fff;
}

#position15 div.tile1 {
	background: url('../img/f2f1f5.png') center repeat;
	background-size: cover;
	color: #b99f4c;
}

#position15 div.tile2 {
	background: url('../img/e2e2e2.png') center repeat;
	background-size: cover;
	color: #b99f4c;
}

#position16 div.tile1 {
	background: url('../img/16.1.jpg') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position16 div.tile2 {
	background: url('../img/16.2.jpg') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position17 div.tile1 {
	background: url('../img/17.1.jpg') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position17 div.tile2 {
	background: url('../img/17.2.jpg') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position18 div.tile1 {
	background: url('../img/e2e2e2.png') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position18 div.tile2 {
	background: url('../img/f0ecee.png') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position19 div.tile1 {
	background: url('../img/ffffff.png') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position19 div.tile2 {
	background: url('../img/19.2.jpg') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

#position20 div.tile1 {
	background: url('../img/262626.png') center repeat;
	background-size: cover;
	color: #fff;
}

#position20 div.tile2 {
	background: url('../img/fafafa.png') center repeat;
	background-size: cover;
	color: #3c3c3c;
}

section.menu > div.row > div.language,
section.menu > div.row > div.language a {
	font-family: RoglianoRegular;
	color: #454545;
	font-size: 25px;
}

	section.menu > div.row > div.language a.active {
		font-family: RoglianoBold;
		color: #3c3c3c;
	}

section.menu > div.row > div > ul {
	color: #3c3c3c;
	height: 100%;
	padding: 0 90px 0 70px;
}

	section.menu > div.row > div > ul > li.logo {
		width: 100%;
		height: 60px;
		max-width: 300px;
		background: url("../img/logo.png") no-repeat;
		background-size: contain;
		margin: 30px 0;
	}

	section.menu > div.row > div > ul > li > a {
		color: #3c3c3c;
		font-size: 50px;
		text-transform: lowercase;
		position: relative;
		line-height: 1.8;
		-webkit-transition: all .5s ease-in-out 0s;
		-moz-transition: all .5s ease-in-out 0s;
		-o-transition: all .5s ease-in-out 0s;
		transition: all .5s ease-in-out 0s;
	}

		section.menu > div.row > div > ul > li > a:before {
			content: " ";
			position: absolute;
			width: 100%;
			height: 4px;
			bottom: 0;
			left: 0;
			background-color: #3c3c3c;
			visibility: hidden;
			-webkit-transform: scaleX(0);
			transform: scaleX(0);
			-webkit-transition: all .5s ease-in-out 0s;
			transition: all .5s ease-in-out 0s;
		}

			section.menu > div.row > div > ul > li > a:hover:before {
				visibility: visible;
				-webkit-transform: scaleX(1);
				transform: scaleX(1);
			}

		section.menu > div.row > div > ul > li > a.active {
			color: #3c3c3c;
		}

	section.menu > div.row > div > ul > li > .menu-content {
		display: none;
		font-family: RoglianoRegular;
		padding: 60px 0;
		line-height: 1.4;
	}

		section.menu > div.row > div > ul > li > .menu-content.reference a {
			width: calc(30% - 1px);
			max-width: 200px;
			display: inline-block;
			margin: 0 9px 1px 0;
			-webkit-transform: perspective(1px) translateZ(0);
			transform: perspective(1px) translateZ(0);
			box-shadow: 0 0 1px transparent;
			-webkit-transition-duration: 0.3s;
			transition-duration: 0.3s;
			-webkit-transition-property: transform;
			transition-property: transform;
		}

			section.menu > div.row > div > ul > li > .menu-content.reference a:hover {
				-webkit-transform: scale(0.95);
				transform: scale(0.95);
			}

			section.menu > div.row > div > ul > li > .menu-content.reference a > img {
				width: 100%;
				height: 100%;
			}

		section.menu > div.row > div > ul > li > .menu-content ul {
			margin: 40px 0;
		}

			section.menu > div.row > div > ul > li > .menu-content .social {
				margin-top: 40px;
			}

				section.menu > div.row > div > ul > li > .menu-content .social a {
					display: inline-block;
					height: 30px;
					margin-right: 40px;
				}

					section.menu > div.row > div > ul > li > .menu-content .social .facebook {
						width: 14px;
						background: url('../img/facebook.png') no-repeat;
						background-size: contain;
					}

					section.menu > div.row > div > ul > li > .menu-content .social .instagram {
						width: 30px;
						background: url('../img/instagram.png') no-repeat;
						background-size: contain;
					}

					section.menu > div.row > div > ul > li > .menu-content .social .youtube {
						width: 41px;
						background: url('../img/youtube.png') no-repeat;
						background-size: contain;
					}

section.subpage:before {
	background: linear-gradient(180deg, #f5f4f8 40%, rgba(0,0,0,0) 40%);
}

section.subpage .row .header:first-of-type {
	background: #262626;
	color: #c4b5a1;
	text-transform: lowercase;
}

section.subpage .row .header:nth-of-type(2) {
	background: #fff;
	color: #3c3c3c;
	text-transform: lowercase;
}

	section.subpage .row .header h1 {
		font-size: 30px;
		margin: 0;
		padding-right: 30px;
		padding-left: 30px;
	}

	section.subpage .row .submenu ul {
		height: 100%;
	}

section.subpage .row .submenu li {
	padding: 20px;
	display: inline-block;
	background: #dcdbdf;
	margin-bottom: 4px;
}

section.subpage .row .submenu li.active {
	background: #262626;
}

	section.subpage .row .submenu li a {
		color: #8c8c8c;
		position: relative;
		-webkit-transition: all .5s ease-in-out 0s;
		-moz-transition: all .5s ease-in-out 0s;
		-o-transition: all .5s ease-in-out 0s;
		transition: all .5s ease-in-out 0s;
	}

		section.subpage .row .submenu li a:before {
			content: " ";
			position: absolute;
			width: 100%;
			height: 3px;
			bottom: -7px;
			left: 0;
			background-color: #8c8c8c;
			visibility: hidden;
			-webkit-transform: scaleX(0);
			transform: scaleX(0);
			-webkit-transition: all .5s ease-in-out 0s;
			transition: all .5s ease-in-out 0s;
		}

			section.subpage .row .submenu li:hover a:before {
				visibility: visible;
				-webkit-transform: scaleX(1);
				transform: scaleX(1);
			}

				section.subpage .row .submenu li.active a {
					color: #fff;
				}

	section.subpage .row .content,
	section.subpage .row .submenu {
		overflow: hidden;
		padding: 0;
		float: right;
	}

		section.subpage .row .content {
			height: 100%;
		}

	section.subpage .row .scroll-wrapper {
		height: calc(80vh - 100px);
		min-height: 1px;
		margin: 50px 0!important;
	}

	section.subpage .row .content .content-section {
		font-family: RoglianoRegular;
		color: #3c3c3c;
		padding: 0;
		margin: 0;
		display: block;
		height: 100%;
		background: #fff;
	}

	section.subpage .row .content .content-section .subcontent-section {
		padding: 0 110px 50px 90px;
		max-width: 880px;
	}

	section.subpage .row .content .content-section .subcontent-section:first-of-type {
		padding-top: 50px;
	}

		section.subpage .row .content .content-section .subcontent-section > * {
			display: inline-block;
		}

			section.subpage .row .content .content-section .subcontent-section > *:not(a) {
				width: 100%;
			}

			section.subpage .row .content .content-section .subcontent-section > p {
				line-height: 1.4;
			}

			section.subpage .row .content .content-section .subcontent-section > h5 {
				font-family: RoglianoBold;
				color: #30adf9;
				font-size: 20px;
			}

				section.subpage .row .content .content-section .subcontent-section > ul > li {
					line-height: 1.4;
					margin: 0;
					list-style-type: circle;
				}

					section.subpage .row .content .content-section .subcontent-section > ul.margin > li {
						margin: 18px 0;
					}

		section.subpage .row .content .content-section .subcontent-section span {
			margin-bottom: 20px;
		}

		section.subpage .row .content .content-section .subcontent-section .yellow {
			font-family: RoglianoBold;
			color: #d4a31b;
		}

		section.subpage .row .content .content-section .subcontent-section .button,
		section.subpage .row .content .content-section .subcontent-section .button-link {
			font-family: RoglianoBold;
			color: #d4a31b;
			text-transform: uppercase;
			background: #fff;
			border: 3px solid #d4a31b;
			text-align: center;
			padding: 15px 50px;
			-webkit-transition: all .5s ease-in-out 0s;
			-moz-transition: all .5s ease-in-out 0s;
			-o-transition: all .5s ease-in-out 0s;
			transition: all .5s ease-in-out 0s;
		}

			section.subpage .row .content .content-section .subcontent-section .button:hover {
				background: #fff;
			}

				section.subpage .row .content .content-section .subcontent-section .reference-wrapper a {
					width: 30%;
					max-width: 200px;
					display: inline-block;
					margin: 0 4px 1px 0;
					-webkit-transform: perspective(1px) translateZ(0);
					transform: perspective(1px) translateZ(0);
					box-shadow: 0 0 1px transparent;
					-webkit-transition-duration: 0.3s;
					transition-duration: 0.3s;
					-webkit-transition-property: transform;
					transition-property: transform;
					cursor: pointer;
					overflow: hidden;
				}

				section.subpage .row .content .content-section .subcontent-section .reference-wrapper .gallery {
					display: none;
				}

						section.subpage .row .content .content-section .subcontent-section .reference-wrapper:not(.media) a .hover {
							background: #f5f4f8;
							height: calc(100% - 4px);
							width: 100%;
							text-align: center;
							position: absolute;
							top: 0;
							opacity: 0;
							padding: 10px;
							transition: all 0.3s linear;
							display: flex;
							justify-content: center;
							flex-direction: column;
						}

							section.subpage .row .content .content-section .subcontent-section .reference-wrapper:not(.media) a .hover span {
								color: #3c3c3c;
								font-size: 15px;
								margin-bottom: 0;
							}

								section.subpage .row .content .content-section .subcontent-section .reference-wrapper:not(.media) a .hover h6 {
									color: #30adf9;
									text-decoration: underline;
									margin: 10px 0;
									font-size: 16px;
									font-family: RoglianoBold;
								}

					section.subpage .row .content .content-section .subcontent-section .reference-wrapper:not(.media) a:hover .hover {
						opacity: 1;
					}

					section.subpage .row .content .content-section .subcontent-section .reference-wrapper a img {
						width: 100%;
						height: 100%;
					}

.thumb-viewer {
	display: none;
	position: absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	overflow: hidden;
}

	.thumb-viewer:before {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 200%;
		background-color: rgba(0,0,0,0.7);
	}

.arrow-wrapper {
	height: 0;
}

.viewer-body {
	width: 75%;
	max-width: 800px;
	margin: auto;
	height: 80vh;
	top: 20vh;
	position: relative;
}

	.viewer-body img,
	.viewer-body video,
	.viewer-body .videoWrapper {
		max-width: 100%;
		max-height: 90%;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		background: black;
	}

		.viewer-body .videoWrapper {
			width: 100%;
			padding-bottom: 56.25%;
		}

			.viewer-body .videoWrapper iframe {
				position: absolute;
			}

.previmage, .nextimage {
	display: inline-block;
	width: 37px;
	height: 37px;
	border-top: 9px solid #676767;
	border-left: 9px solid #676767;
	transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	cursor: pointer;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 15px;
	margin: auto 15px;
	z-index: 4;
	-webkit-transition: all .5s ease-in-out 0s;
	-moz-transition: all .5s ease-in-out 0s;
	-o-transition: all .5s ease-in-out 0s;
	transition: all .5s ease-in-out 0s;
}

.nextimage {
	border: none;
	border-bottom: 9px solid #676767;
	border-right: 9px solid #676767;
	left: auto;
	right: 15px;
}

.previmage:hover, .nextimage:hover {
	border-color: #30adf9;
}

section > div.row > .menu-container {
	height: calc(100% - 180px);
	margin: 90px 0;
	min-height: 1px;
}

/* OFF SCROLL */
.overflow-child {
	width: calc(100% + 20px);
	overflow-y: scroll;
	overflow-x: hidden;
}

.overflow-parent {
	overflow: hidden;
}

.fixed {
	position: fixed;
}

/* ON SCROLL */
section.subpage .row .scroll-wrapper.auto-height,
section.menu > div.row > div > ul.auto-height {
	height: auto!important;
}