body div{box-sizing: border-box;} /*pino*/
img{width:100%;}

#barratitolo{width:100%; height:10px; text-align:center; font: normal 10px 'Montserrat', sans-serif; }
h1{font:bold 34px 'Source Serif Pro', sans-serif; line-height:40px;}

.menubottone {
	width: auto;
	outline: none;
	transition: all .2s cubic-bezier(0, 1.26, .8, 1.28);
	text-decoration: none;
	padding:5px;
	border-radius: 10px 10px 10px 10px;
	border:solid 1px #ffffff;
	background-color: #E8E8E8;
	font-size:16px;
}

.menubottone:hover {
	background-color: #96D9FF;
	cursor: pointer;
	border-color: #003557;
	transform: scale(1.1, 1.1);
}

.menubottone:active {
	background-color: #FFF;
}

#flyoutMenu {
	width: 100vw;
	height: 100vh;
	background-color: #FFE600;
	position: fixed;
	top: 0;
	left: 0;
	transform: translate3d(-100vw, 0, 0);
	transition: transform .3s cubic-bezier(0, .52, 0, 1);
	overflow: scroll;
	z-index: 1000;
}

#flyoutMenu.show {
	transform: translate3d(0vw, 0, 0);
}

#flyoutMenu h2 a {
	color: #333;
	margin-left: 15px;
	text-decoration: none;
}

#flyoutMenu h2 a:hover {
	text-decoration: underline;
}

/*///////////*/


#flyoutMenu2 {
	width: 100vw;
	height: 100vh;
	background-color: #0BF49D;
	position: fixed;
	top: 0;
	left: 0;
	transform: translate3d(+100vw, 0, 0);
	transition: transform .3s cubic-bezier(0, .52, 0, 1);
	overflow: scroll;
	z-index: 1000;
}

#flyoutMenu2.show {
	transform: translate3d(0vw, 0, 0);
}

#flyoutMenu2 h2 a {
	color: #333;
	margin-left: 15px;
	text-decoration: none;
}

#flyoutMenu2 h2 a:hover {
	text-decoration: underline;
}

/*//////////////////////////*/
#flyoutMenu3 {
	width: 100vw;
	height: 100vh;
	background-color: #33FFFF;
	position: fixed;
	top: 0;
	left: 0;
	transform: translate3d(+100vw, 0, 0);
	transition: transform .3s cubic-bezier(0, .52, 0, 1);
	overflow: scroll;
	z-index: 1000;
}

#flyoutMenu3.show {
	transform: translate3d(0vw, 0, 0);
}

#flyoutMenu3 h2 a {
	color: #333;
	margin-left: 15px;
	text-decoration: none;
}

#flyoutMenu3 h2 a:hover {
	text-decoration: underline;
}



/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 576px) {
	#piede1{padding-top:15px; width:100%;}
	#piede2{padding-top:15px; width:100%;}
	#piede3{padding-top:15px; width:100%;}
	body{font:normal 16px 'Montserrat', sans-serif; line-height:22px;}
	}
/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 576px) {
	#piede1{padding-top:15px; width:100%;}
	#piede2{padding-top:15px; width:100%;}
	#piede3{padding-top:15px; width:100%;}
	body{font:normal 18px 'Montserrat', sans-serif; line-height:24px;}
	}
/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
	#piede1{padding-top:15px; width:30%; float:left;}
	#piede2{padding-top:15px; width:30%; float:left;}
	#piede3{padding-top:15px; width:40%; float:left;}
	body:{font:normal 20px 'Montserrat', sans-serif; line-height:26px;}
	}
/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
	#piede1{padding-top:15px; width:30%; float:left;}
	#piede2{padding-top:15px; width:30%; float:left;}
	#piede3{padding-top:15px; width:40%; float:left;}
	body: font:normal 22px 'Montserrat', sans-serif; line-height:28px;}
	}
/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
	#piede1{padding-top:15px; width:30%; float:left;}
	#piede2{padding-top:15px; width:30%; float:left;}
	#piede3{padding-top:15px; width:40%; float:left;}
	body{font:normal 22px 'Montserrat', sans-serif; line-height:28px;}
	}