body {
	background: #000000;
	user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
}
h1,h2,h3,h4,h5,h6 {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
div.siteContainer {
	position: absolute;
	top: 0.2vh;
	bottom: 0.2vh;
	left: 0.2vh;
	right: 0.2vh;
	background-image: -webkit-gradient(linear, left top, right bottom, from(#444444), to(#2b2c28)) fixed;
	background-image: url("./bg1.jpg");
	/*background-image: url("./bg.jpg");*/
	background-size: cover;
      background-repeat: no-repeat;
      background-position: 50% 50%;
}

/* HEADER */
div.siteHeader {
	position: absolute;
	top: 2vh;
	left: 0vh;
	right: 0vh;
	height: 7vh;
	overflow: hidden;
	user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
	cursor:pointer;
}
div.siteTitle {
	margin: 0vh;
	text-align: center;
	font-size: 3.6vh;
	font-size: min(3.6vh,6vw);
	font-family: "Verdana";
	color: #fbfcf8;
	user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
}
div.siteSubTitle {
	margin: 0vh;
	text-align: center;
	font-size: 1.5vh;
	font-size: min(1.5vh,2.5vw);
	font-family: "Verdana";
	color: #fbfcf8;
	user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
}

/* MAIN */
div.siteMain {
	position: absolute;
	top: 8.5vh;
	bottom: 5.5vh;
	left: 0vh;
	right: 0vh;
	margin: auto;
	overflow: hidden;
}
div.humocchioHiddenInit {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	overflow: hidden;
	opacity: 0;
	pointer-events: none;
}
div.humocchioHidden {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	overflow: hidden;
	animation-name: fadeOut;
	animation-duration: 0.3s;
	opacity: 0;
	pointer-events: none;
}
div.humocchio {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	overflow: hidden;
	animation-name: fadeIn;
	animation-duration: 0.3s;
	opacity: 1;
}
@keyframes fadeOut {
  from {opacity: 1;}
  to {opacity: 0;}
}
@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity: 1;}
}
div.humocchioTitle {
	position: absolute;
	top: 1.5vh;
	left: 0;
	right: 0;
	height: 3vh;
	margin: 0.5vh;
	padding: 0.5vh;
	text-align: center;
	font-size: 2vh;
	line-height: 3vh;
	font-size: min(2vh,4vw);
	line-height: min(3vh,6vw);
	font-style: italic;
	/*font-weight: bold;*/
	font-family: "Verdana";
	user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
	color: #ebece8;
}
div.humocchioDrawing {
	position: absolute;
	top: 6vh;
	bottom: 5.5vh;
	left: 5vh;
	right: 5vh;
	max-height: 100%;
	animation-name: grow;
	animation-duration: 0.3s;
}
div.humocchioDrawingInfo {
	position: absolute;
	top: 6vh;
	bottom: 5.5vh;
	left: 5vh;
	right: 5vh;
	max-height: 50%;
	animation-name: shrink;
	animation-duration: 0.3s;
}
@keyframes shrink {
  from {max-height: 100%;}
  to {max-height: 50%;}
}
@keyframes grow {
  from {max-height: 50%;}
  to {max-height: 100%;}
}
img.humocchioImage {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	max-height: 96%;
	max-width: 96%;
	padding: 0.2vh;
	object-fit: contain;
	margin: auto;
	border: 0.25vh;
	border-style: solid;
	border-color: #cbccc8;
	box-shadow: 0 0 0.5vh 0.05vh #ebece8;
	cursor:pointer;
}
div.humocchioInfo {
	position: absolute;
	top: 43vh;
	bottom: 0vh;
	left: 6.5vh;
	right: 6.5vh;
	
}
div.humocchioInfoHidden {
	position: absolute;
	bottom: 0vh;
	left: 6.5vh;
	right: 6.5vh;
	height: 6vh;
	overflow: hidden;
}
div.humocchioInfoButton {
	position: absolute;
	right: 0vh;
	left: 0vh;
	bottom: 0vh;
	height: 3.5vh; 
	width: 24vh; 
	max-width: 90%;
	margin:auto;
	margin-bottom:1vh;
	background-image: -webkit-gradient(linear, right center, left center, from(#ffffff), to(#aaaaaa));
	border-radius: 1vh;
	border: 0.2vh;
	border-style: solid;
	border-color: black;
	box-shadow: 0 0 0.8vh 0.1vh #cbccc8aa;
	text-align: center;
	font-size: 2vh;
	font-style: italic;
	font-family: "Verdana";
	line-height: 3.5vh;
	user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
	cursor:pointer;
	overflow: hidden;
}
div.humocchioInfoButton:active {
	background-image: -webkit-gradient(linear, right center, left center, from(#eeeeee), to(#777777));
}

div.humocchioInfoButtonOpen {
	position: absolute;
	right: 0vh;
	left: 0vh;
	bottom: 0vh;
	height: 3.5vh; 
	width: 24vh; 
	max-width: 90%;
	margin:auto;
	margin-bottom:1vh;
	background-image: -webkit-gradient(linear, right center, left center, from(#aaaaaa), to(#ffffff));
	border-radius: 1vh;
	border: 0.2vh;
	border-style: solid;
	border-color: black;
	box-shadow: 0 0 0.8vh 0.1vh #cbccc8aa;
	text-align: center;
	font-size: 2vh;
	font-style: italic;
	font-family: "Verdana";
	line-height: 3.5vh;
	user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
	cursor:pointer;
	overflow: hidden;
}
div.humocchioInfoButtonOpen:active {
	background-image: -webkit-gradient(linear, right center, left center, from(#777777), to(#eeeeee));
}

div.humocchioInfoTextHidden {
	position: absolute;
	bottom: 2.5vh;
	height: 36vh;
	left: 1.5vh;
	right: 1.5vh;
	margin: auto;
	max-width: 65vh;
	overflow-y: auto;
	background: #e5e6e4f0;
	padding: 1.5vh;
	padding-right: 1vh;
	border: 0.20vh;
	border-style: solid;
	border-color: #2b2c28;
	box-shadow: 0 0 0.8vh 0.4vh #ebece8aa;
	opacity: 0;
	animation-name: fadeOut;
	animation-duration: 0.2s;
}
div.humocchioInfoText {
	position: absolute;
	bottom: 2.5vh;
	height: 36vh;
	left: 1.5vh;
	right: 1.5vh;
	margin: auto;
	max-width: 65vh;
	overflow-y: auto;
	background: #e5e6e4f0;
	padding: 1.5vh;
	padding-right: 1vh;
	border: 0.20vh;
	border-style: solid;
	border-color: #2b2c28;
	box-shadow: 0 0 0.8vh 0.4vh #ebece8aa;
	opacity: 1;
	animation-name: fadeIn;
	animation-duration: 0.2s;
}
img.humocchioPic {
	padding: 0vh;
	margin: 0vh;
	max-width: 13vh;
	max-height: 13vh;
	float: left;
	margin-right: 1.5vh;
	margin-bottom: 0.8vh;
	border: 1px;
	border-style: solid;
}
img.humocchioPicHidden {
	padding: 0vh;
	margin: 0vh;
	max-width: 0vh;
	max-height: 0vh;
	float: left;
	margin-right: 0vh;
	margin-bottom: 0vh;
	border: 0px;
	border-style: solid;
	border-color: black;
}
p.humocchioText {
	padding: 0vh;
	margin: 0vh;
	margin-bottom: 1.5vh;
	margin-right: 0.5vh;
	text-align: justify;
	font-size: 1.75vh;
	font-size: min(2vh,3vw);
	line-height: 2.2vh;
	line-height: min(2.5vh,3.4vw);
	font-family: "Helvetica";
}
div.humocchioPrev {
	position: absolute;
	top: 38.4vh;
	left: 2vh;
	height: 8vh; 
	width: 5vh;
	height: min(8vh,12vw); 
	width: min(5vh,7.5vw);
	background-image: url("./prev.png"), -webkit-gradient(linear, right center, left center, from(#ffffff), to(#aaaaaa));
	background-size: contain;
      background-repeat: no-repeat;
      background-position: 50% 50%;
	border-radius: 1vh;
	border: 0.2vh;
	border-style: solid;
	border-color: black;
	box-shadow: 0 0 0.8vh 0.1vh #cbccc8aa;
	user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
	cursor:pointer;
}
div.humocchioPrev:active {
	background-image: url("./prev.png"), -webkit-gradient(linear, right center, left center, from(#eeeeee), to(#777777));
}

div.humocchioNext {
	position: absolute;
	top: 38.4vh;
	right: 2vh;
	height: 8vh; 
	width: 5vh;
	height: min(8vh,12vw); 
	width: min(5vh,7.5vw);
	background-image: url("./next.png"), -webkit-gradient(linear, left center, right center, from(#ffffff), to(#aaaaaa));
	background-size: contain;
      background-repeat: no-repeat;
      background-position: 50% 50%;
	border-radius: 1vh;
	border: 0.2vh;
	border-style: solid;
	border-color: black;
	box-shadow: 0 0 0.8vh 0.1vh #cbccc8aa;
	user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
	cursor:pointer;
}

div.humocchioNext:active {
	background-image: url("./next.png"), -webkit-gradient(linear, left center, right center, from(#eeeeee), to(#777777));
}

div.humocchioMenu {
	position: absolute;
	bottom: 6vh;
	right: 2vh;
	height: 5vh; 
	width: 5vh;
	background-image: url("./menu.png"), -webkit-gradient(linear, left center, right center, from(#ffffff), to(#aaaaaa));
	background-size: contain;
      background-repeat: no-repeat;
      background-position: 50% 50%;
	border-radius: 1vh;
	border: 0.2vh;
	border-style: solid;
	border-color: black;
	box-shadow: 0 0 0.8vh 0.1vh #cbccc8aa;
	user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
	cursor:pointer;
}
div.humocchioMenu:active {
	background-image: url("./menu.png"), -webkit-gradient(linear, left center, right center, from(#eeeeee), to(#777777));
}
div.humocchioMenuOpen {
	position: absolute;
	bottom: 6vh;
	right: 2vh;
	height: 5vh; 
	width: 5vh;
	background-image: url("./menu.png"), -webkit-gradient(linear, left center, right center, from(#aaaaaa), to(#ffffff));
	background-size: contain;
      background-repeat: no-repeat;
      background-position: 50% 50%;
	border-radius: 1vh;
	border: 0.2vh;
	border-style: solid;
	border-color: black;
	box-shadow: 0 0 0.8vh 0.1vh #cbccc8aa;
	user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
	cursor:pointer;
}
div.humocchioMenuOpen:active {
	background-image: url("./menu.png"), -webkit-gradient(linear, left center, right center, from(#777777), to(#eeeeee));
}

div.humocchioContactContainer {
	position: absolute;
	bottom: 9vh;
	right: 1vh;
	left: 1vh;
	height: auto;
	width: auto;
	animation-name: fadeIn;
	animation-duration: 0.2s;
	opacity: 1;
	pointer-events: none;
}
div.humocchioContactContainerHidden {
	position: absolute;
	bottom: 10vh;
	right: 1vh;
	left: 1vh;
	height: 0;
	width: 0;
	overflow: hidden;
	animation-name: fadeOut;
	animation-duration: 0.2s;
	opacity: 0;
	pointer-events: none;
}
div.humocchioContact {
	position: relative;
	float: right;
	pointer-events: auto;
	background: #cbccc822;
	border: 0.2vh;
	border-style: solid;
	border-color: black;
	border-radius: 1vh;
	padding-top: 1vh;
	padding-bottom: 3vh;
	box-shadow: 0 0 0.8vh 0.4vh #cbccc844;
}

div.humocchioContactItem {
	position: relative;
	text-align: left;
	font-family: "Verdana";
	font-size: 1.8vh;
	line-height: 2.1vh;
	margin: 0.8vh;
	padding: 1vh 1.5vh 1.3vh 1vh;
	margin-right: 0.8vh;
	border-radius: 1vh;
	border: 0.2vh;
	border-style: solid;
	border-color: black;
	box-shadow: 0 0 0.3vh 0.2vh #777777;
	user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
	cursor:pointer;
	background-image: -webkit-gradient(linear, left center, right center, from(#ffffff), to(#aaaaaa));
}
div.humocchioContactItem:active {
	background-image: -webkit-gradient(linear, left center, right center, from(#eeeeee), to(#777777));
}

div.humocchioContactItemIconIG {
	position: relative;
	float: left;
	height: 4.6vh; 
	width: 4.6vh;
	margin-right: 1vh;
	background-image: url("./camera.png");
	background-size: contain;
      background-repeat: no-repeat;
      background-position: 50% 50%;
	user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
	cursor:pointer;
}

div.humocchioContactItemIconEmail {
	position: relative;
	float: left;
	height: 4.6vh; 
	width: 4.6vh;
	margin-right: 1vh;
	background-image: url("./email.png");
	background-size: contain;
      background-repeat: no-repeat;
      background-position: 50% 50%;
	user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
	cursor:pointer;
}
div.humocchioContactItemIconMe {
	position: relative;
	float: left;
	height: 4.6vh; 
	width: 4.6vh;
	margin-right: 1vh;
	background-image: url("./users.png");
	background-size: contain;
      background-repeat: no-repeat;
      background-position: 50% 50%;
	user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
	cursor:pointer;
}
div.humocchioContactItemIconProcess {
	position: relative;
	float: left;
	height: 4.6vh; 
	width: 4.6vh;
	margin-right: 1vh;
	background-image: url("./pencil.png");
	background-size: contain;
      background-repeat: no-repeat;
      background-position: 50% 50%;
	user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
	cursor:pointer;
}
div.humocchioContactItemIconUniverse {
	position: relative;
	float: left;
	height: 4.6vh; 
	width: 4.6vh;
	margin-right: 1vh;
	background-image: url("./universe.png");
	background-size: contain;
      background-repeat: no-repeat;
      background-position: 50% 50%;
	user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-o-user-select: none;
	cursor:pointer;
}

/* FOOTER */
div.siteFooter {
	position: absolute;
	bottom: 0vh;
	left: 0vh;
	right: 0vh;
	height: 4vh;
	overflow: hidden;
}
div.siteDisclaimer {
	position: absolute;
	bottom: 0.3vh;
	right: 2vh;
	text-align: right;
	font-family: "Verdana";
	font-size: 1vh;
	font-size: min(1vh,2vw);
	line-height: 1.2vh;
	line-height: min(1.2vh,2.4vw);
	color: #ebece8aa;
}