@import url('https://fonts.googleapis.com/css?family=Cuprum:400,400i,700,700i');
@import url('animsition.min.css');

/*loading*/
.animsition-loading {
	position:fixed;
	width:100%;height:100%;
	left:0px;right:0px;bottom:0px;top:0px;
	border:none;
	margin:0px;
	padding:0px;
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	border-radius: 0px;
}
.animsition-loading::before {
	width:300px;
	height:110px;
	content: "";
	position:absolute;
	top:30%;
	left:50%;
	margin-left:-150px;
	background:url(../img/logo.png) no-repeat center center;
	background-size:300px 110px;
}
.animsition-loading::after {
	content: "";
	width:40px;
	height:40px;
	position:fixed;
	top:calc((30% + 110px) + 40px);
	left:50%;
	margin-left:-20px;
	border-radius: 50%;
	z-index:100;
	background-color: transparent;
	border-top: 2px solid #333;
	border-right: 2px solid #333;
	border-bottom: 2px solid #333;
	border-left: 2px solid #ccc;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-animation-iteration-count:infinite;
	animation-iteration-count:infinite;
	-webkit-animation-timing-function: linear;
	animation-timing-function: linear;
	-webkit-animation-duration: .8s;
	animation-duration: .8s;
	-webkit-animation-name: animsition-loading;
	animation-name: animsition-loading;
}

/*base*/
body {margin:0px;padding:0px;background:#FFF;}
img, object, embed {width:100%;}
img {height:auto;}

/*default*/
::-moz-selection{background:#18232d;color:#FFF;text-shadow:none}
::selection{background:#18232d;color:#FFF;text-shadow:none}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}
audio,canvas,iframe,img,svg,video{vertical-align:middle}
fieldset{border:0;margin:0;padding:0}
textarea{resize:vertical}
.hidden{display:none!important}
.visuallyhidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}
.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus{clip:auto;height:auto;margin:0;overflow:visible;position:static;width:auto}
.invisible{visibility:hidden}

/*link*/
a, a:link, a:visited, a:active, a:hover {
	color:#666;
	text-decoration:none;
	outline:none;
	border:none;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition:	all 0.3s ease-in-out;
	-o-transition:		all 0.3s ease-in-out;
	-ms-transition:		all 0.3s ease-in-out;
	transition:			all 0.3s ease-in-out;
	font-size:inherit;
	text-transform:none;
}
a:hover {text-decoration:none;color:#000;}

/*fixed*/
.left {float:left !important;}
.right {float:right !important;}
.noPad {padding:0px !important;}
.noMarg {margin:0px !important;}
.noBrd {border:none !important;}

/*animation*/
.animation, .animation * {
	-webkit-transition:	all 0.3s ease-in-out;
	-moz-transition:	all 0.3s ease-in-out;
	-o-transition:		all 0.3s ease-in-out;
	-ms-transition:		all 0.3s ease-in-out;
	transition:			all 0.3s ease-in-out;
}

/*typographic*/
html {font-family:serif;font-size:14px;-webkit-font-smoothing:antialiased;}
body {font-family: 'Cuprum', sans-serif;font-weight:400;font-size:1em;color:#666;}
blockquote {font-size:1.2em;line-height:1.4em;margin: 0;font-style: italic;}
p {margin:1.5em 0;font-size:1.2em;line-height:1.5em;}
strong {font-weight:700;}
ul, ol {margin-top:1.5em;margin:0px 0px 0px 1.5em;}
ul li, ol li {line-height:1.5em;font-size:1em;}
ul ul, ol ul, ul ol, ol ol {margin-top:0;margin-bottom:0;}
h1, h2, h3, h4, h5, h6 {margin:0;padding:0;}
h1 {font-size:3em;}
h2 {font-size:2.50em;}
h3 {font-size:2em;}
h4 {font-size:1.750em;}
h5 {font-size:1.500em;}
h6 {font-size:1.250em;}
p.hyphenate {text-align:justify;}

/*layout*/
header, footer, section, article, side, nav, figure, figcaption, #mainContainer, #headWrapper, #mainWrapper, #footWrapper, figure, figcaption {width:auto;height:auto;margin:0px;padding:0px;clear:both;float:none;}

.container {padding-left:20px;padding-right:20px;}
.row {width:100%;max-width:1200px;margin: 0 auto;overflow: hidden;}

.row .span-1, .row .span-2, .row .span-3, .row .span-4, .row .span-5, .row .span-6, .row .span-7, .row .span-8, .row .span-9, .row .span-10, .row .span-11 {margin-right:3.8%;float:left;min-height:1px;}
.row .span-1  {width:4.85%;}
.row .span-2  {width:13.45%;}
.row .span-3  {width:22.05%;}
.row .span-4  {width:30.75%;}
.row .span-5  {width:39.45%;}
.row .span-6  {width:48%;}
.row .span-7  {width:56.75%;}
.row .span-8  {width:65.4%;}
.row .span-9  {width:74.05%;}
.row .span-10 {width:82.7%;}
.row .span-11 {width:91.35%;}
.row .span-12 {width:100%;}
.last {margin-right:0px;}

/*introbanner*/
#headWrapper {position:relative;width:100%;clear:both;float:none;}
#bannerWrapper {width:100%;height:60vh;position:relative;overflow:hidden;clear:both;float:none;}
#bannerWrapper .cycle-slideshow {width:100%;height:60vh;}
#bannerWrapper .cycle-slideshow .bannerWrapper {width:100%;height:60vh;}
#logo {
	width:480px;
	padding: 40px;
	overflow:hidden;
	background: #fff;
	position:absolute;
	bottom:150px;
	left:50%;
	-ms-transform: translateX(-50%);
    -webkit-transform:  translateX(-50%);
    transform:  translateX(-50%);
	z-index:999;
}
#logo img {width:100%;}
#subBannerWrapper {
	padding:80px 0px 30px 0px;
	text-align:center;
	background: url(../img/texture.jpg) no-repeat top center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	height:210px;
	overflow:hidden;
}
#subBannerWrapper h1 {margin:0px;padding:0px;color:#FFF;text-align:center;line-height:1.2em;font-weight: 400;}
#subBannerWrapper h1 span {color:#333;font-style: italic;}

/*intro*/
#wrapText01 .container {padding:0px;margin:0px;}
#wrapText01 .container .row {width:100%;max-width:inherit;position:relative;}
#wrapText01 .figure {width:50%;float:right;margin:0px;padding:0px;display:block;}
#wrapText01 .text {
	position:absolute;
	top:0px;left:0px;bottom:0px;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	float:left;
	width:50%;
}
#wrapText01 .text .wrapper {
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	padding:0px 100px

}
#wrapText01 .text .wrapper p {margin:0px;padding:0px;font-size:1.4em;}
#wrapText01 .text .wrapper p:nth-child(2) {margin:20px 0px;}

/*team*/
#wrapText02 {padding:100px 0px;background:#fff;position:relative;}
#wrapText02::after {position: absolute;top:0px;left:0px;right:0px;width: 100%;height:60%;background:#000;content: "";z-index:1;}
#wrapText02 .container {position:relative;z-index:2;}
#wrapText02 .container .row .span-4 {width:33.3333%;margin:0px;}
#wrapText02 h1 {font-size:2em;margin:20px 0px 0px 0px;padding:0px;line-height:1em;}
#wrapText02 h1 br {display:none;}
#wrapText02 p {margin:0px 0px 20px 0px;padding:0px;color:#FFF;}

/*testo*/
#wrapText03 {padding:0px 0px 100px 0px;background:#fff;}
#wrapText03 p {
	margin:0px;
	padding:0px;
	font-size:1.4em;
	
}
#wrapText03 .row {position:relative;}
#wrapText03 .row::after {
	width:2px;
	height:100%;
	position:absolute;
	top:0px;
	left:50%;
	bottom:0px;
	margin-left:-1px;
	background:#ededed;
	content: "";
}

/*contatti*/
#wrapText04 {
	background: url(../img/texture.jpg) no-repeat top center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
#wrapText04 .container {padding:0px;magin:0px;}
#wrapText04 .container .row {width:100%;max-width:inherit;position:relative;}
#wrapText04 .text {
	position:absolute;
	top:0px;right:0px;bottom:0px;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	float:left;
	width:50%;
}
#wrapText04 .text .wrapper {
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	padding:0px 100px

}
#wrapText04 .text .wrapper p {margin:0px;padding:0px;font-size:1.4em;color:#FFF;}
#wrapText04 .text .wrapper p strong {color:#000;}
#wrapText04 .text .wrapper p a {color:#FFF;border-bottom:1px solid rgba(0,0,0,0);}
#wrapText04 .text .wrapper p a:hover {border-bottom:1px solid #FFF;}

/*mappa*/
#mapWrapper {position:relative;overflow:hidden;height:auto;background:#2b2b2b;width: 50%;float:left;}
#mapWrapper a {position:absolute;top:0px;left:0px;right:0px;bottom:0px;z-index:9;text-indent:-99999px;}
#map {position:relative;cursor:pointer;heiht:auto;}
#map img,  #map object,  #map embed {max-width:none;}
a[href^="http://maps.google.com/maps"]{display:none !important}
a[href^="https://maps.google.com/maps"]{display:none !important}
.gmnoprint a, .gmnoprint span, .gm-style-cc {display:none;}
.gmnoprint div {background:none !important;}


/*footer*/
#footWrapper {background:#000;padding:20px 0px;}
#footWrapper p {margin:0px;padding:20px 0px 0px 0px;color:#999;font-size:1em;}
#footWrapper span {text-transform:uppercase;cursor:pointer;color:#999;}
#footWrapper p a {color:#999;}
#footWrapper p a:hover {color:#FFF;}
#footWrapper span:hover {color:#FFF;}


/*responsive*/
@media handheld, only screen and (max-width: 1500px) {
	#wrapText01 .text .wrapper {padding:0px 50px}
	#wrapText04 .text .wrapper {padding:0px 50px}
	#wrapText01 .text .wrapper p:nth-child(2) {margin:10px 0px;}
}

@media handheld, only screen and (max-width: 1400px) {
	
	#wrapText01 .text {
		position:relative;
	}
	#wrapText01 .text .wrapper {
		position: relative;
		top:inherit;
		-webkit-transform:inherit;
		-ms-transform:inherit;
		transform:inherit;
		padding:50px 25px 50px 50px
	}
	#wrapText01 .figure {
		width:50%;
		float:right;
		margin:0px;
		padding:0px;
		display:block;
		position:absolute;
		top:0px;right:0px;bottom:0px;
		-webkit-transform-style: preserve-3d;
		-moz-transform-style: preserve-3d;
		transform-style: preserve-3d;
	}
	#wrapText01 .figure img {
		position: relative;
		top: 50%;
		-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		transform: translateY(-50%);
		padding:50px 25px 50px 25px

	}
}

@media handheld, only screen and (max-width: 1200px) {
	#wrapText02 .container, #wrapText03 .container {padding-left:50px;padding-right:50px;}
}

@media handheld, only screen and (max-width: 1200px) {
	#wrapText02 h1 {font-size:1.6em;}
}

@media handheld, only screen and (max-width: 768px) {
	
	.hide {display:none;}
	#wrapText01 .text {width:100%;clear:both;float:none;}
	#wrapText01 .text .wrapper {padding:50px;}
	#wrapText01 .figure {width:100%;clear:both;float:none;position:relative;}
	#wrapText01 .figure img{
		position: relative;
		top:inherit;
		-webkit-transform:inherit;
		-ms-transform:inherit;
		transform:inherit;
		padding:0px 50px
	}
	#wrapText02 {padding:0px 0px 50px 0px;}
	#wrapText02::after {height:45%;}
	#wrapText01 {position:relative;}
	#wrapText01 .container {position:relative;z-index:2;}
	#wrapText01::after {position: absolute;bottom:0px;left:0px;right:0px;width: 100%;height:100px;background:#000;content: "";z-index:1;}
	#wrapText03 .row::after {display:none;}
	#wrapText03 .row .span-6 {clear:both;float:none;width:100%;}
	#wrapText03 .row .span-6.last p {margin-top:20px !important;}
	#wrapText02 h1 br {display:block;}
	
	html.mobile {font-size:12px;}
	html.mobile #logo {
		width:calc(100% - 40px);
		margin:0px;
		padding:20px;
		left:20px;
		right:20px;
		-webkit-transform:inherit;
		-ms-transform:inherit;
		transform:inherit;
		bottom: 120px;
	}
	html.mobile #subBannerWrapper h1 {font-size:2.6em;}
	html.mobile #subBannerWrapper {height:160px;padding-top:60px;}
	html.mobile #wrapText01 .text .wrapper {padding:20px;}
	html.mobile #wrapText01 .figure img {padding:20px 20px 0px 20px;}
	html.mobile #wrapText02 .container, #wrapText03 .container {padding-left:20px;padding-right:20px;}
	html.mobile #wrapText03 {padding-bottom:20px;}
	html.mobile #wrapText02 h1 {font-size:1.4em;}
	html.mobile #wrapText02 h1 small {display:block;}
	html.mobile #wrapText02::after {height:30%;}
	html.mobile #mapWrapper {clear:both;float:none;width:100%;}
	html.mobile #wrapText04 .text {clear:both;float:none;width:100%;}
	html.mobile #wrapText04 .text {
		position:relative;
	}
	html.mobile #wrapText04 .text .wrapper {
		position: relative;
		top:inherit;
		-webkit-transform:inherit;
		-ms-transform:inherit;
		transform:inherit;
		padding:20px
	}
	html.mobile #footWrapper p {clear:both !important;float:none !important;width:100%;display:block;margin:0px;padding:0px;text-align: center;}
}


/*oldie*/
#oldie {width:650px;margin:5% auto 10% auto;font-style:normal;}
#oldie img {width:300px;}
#oldie h6 {margin:40px 0 0 0;padding:0px;font-weight:700;text-transform:uppercase;color:#000;}
#oldie h6 span {color:#e41226;}
#oldie blockquote {color:#333;font-size:16px;clear:both;float:none;margin:40px 0 0 0;padding:0px;font-weight:600;line-height:24px;}
#oldie p {color:#333;font-size:14px;font-weight:400; line-height:22px;}
#oldie ul {margin:20px 0 0 0;padding:0px;clear:both;list-style:none;}
#oldie ul li {float:left;margin:0px 30px 0px 0px;}
#oldie a {text-decoration:underline;font-weight:500;}
#oldie a:hover {color:#e41226;}

/*credits*/
#credits {position:fixed;top:0px;left:0px;bottom:0px;right:0px;z-index:9999; background:rgba(0,0,0,0.8); display:none;}
#credits .wrapperCredits {width:340px;height:140px;padding:20px;overflow:hidden;position:absolute;top:50%;left:50%;margin-top:-70px;margin-left:-170px;background:#FFFFFF;}
#credits .wrapperCredits dl {margin:20px 0px 0px 0px;padding:0px;clear:both;width:100%;border-top:1px dotted #CCC;}
#credits .wrapperCredits dd, #credits .wrapperCredits dt {width:50%; text-align:center;float:left;padding:5px 0px;border-bottom:1px dotted #CCC;}
#credits .wrapperCredits span.creditClose {width:12px;height:12px;position:absolute;right:20px;top:25px;display:block;cursor:pointer}
#credits .wrapperCredits h5 {border:none;padding:0px;margin:0px;}
#credits .wrapperCredits a {color:#666;}