html{
  
  padding: 0;
  margin:auto;
	width: 90%;
}

#sottomenu {
  display: none;
}

body { 
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  color:#66696C;
  padding: 0;
  background-repeat:repeat-y;
  background-image: url(images/sf-incresp.png) ;
background-size:100% 100%;
background-position:center;

}
a:link, a:hover {
  color: #66696C; 
  text-decoration: underline;
}
a:active, a:visited {
  color: #6EBC14; 
  text-decoration: underline;
}

h1 {
  text-transform:uppercase;
  font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif", cursive;
  font-size:24px;
  color:darkgoldenrod;
}
h2 {
  text-transform:uppercase;
  font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif", cursive;
  font-size:18px;
  color:darkgoldenrod;
}
h3 {
  text-transform:uppercase;
  font-family: 'Voces', cursive;
  font-size:14px;
  color:#1e1e1e;
}
blockquote {
font-family: 'Voces', cursive;
font-size: 18px;
font-style: italic;
width: 500px;
margin: 0.25em 0;
padding: 0.25em 40px;
line-height: 1.45;
position: relative;
color: #383838;
text-indent:20px;
}
blockquote:before {
display: block;
content: "\201C";
font-size: 80px;
position: absolute;
left: -20px;
top: -20px;
color: #7a7a7a;
}
blockquote cite {
color: #66696C;
font-size: 14px;
display: block;
margin-top: 5px;
}
 
blockquote cite:before {
content: "\2014 \2009";
}

.header {
	display: flex;
    float: left;
    height: 20%;
    width: 100%;
    margin: 0px auto;
    clear: both;
    position: relative;
	border-bottom: double #13E31E;
	background-color: ivory;
 align-items: center;
}

.header div {
  flex: 1;
}

.wrap {
  float:left;
  position:relative;
  height: 100%;
  width: 100%;

}


.iframe-container {
    /* 16:9 aspect ratio */
  
    position: relative;
    width: 60%;

}
.main iframe {
	top: 0;
    width: 100%;
	height: 100%;
    position: relative;
    margin-left: 10px;
padding-bottom: 100%;
}

.main {
  margin-top: 3%;
  padding-bottom: 100%;
  width:100%;
	overflow: hidden;
	display: inline-block;

  
}
.mainb {
  text-align: center;
  width: 100%;
  height: 5%;
  margin: 0px auto;
  padding-bottom:5px;

}
.mainb h3{
	text-align: center;
	color: green;
	font-size: 18px;
	font-weight: bold;
	text-shadow: 5px 5px 10px #00ff00;

	
}
.page_inside {
  display: block;
  position: relative;
  height: 100%;
  width:100%;
  padding: 0;
  margin: 0;
 
}

.page {
  display: flex;
  position: relative;
  height: 900px;
  width:100%;
  padding: 0;
	
}	



/* sidebar */
.sidebar { 
  display: block;
  height:0;
  font-family: Arial, Helvetica, sans-serif; 
  font-size: 12px;
  	
}
.sidebar h2 {
  text-transform:uppercase;
  font-family: 'Voces', cursive;
  font-size:14px;
  color:#66696C;
}
.sidebar a:link, a:hover, a:visited {
  color: #6EBC14; 
  text-decoration: underline;
}
.foglietto {
  margin-bottom:35px;
  box-shadow: 10px 10px 5px #888888;
  overflow: hidden;
  border: none;
}
.item {
  margin-bottom:35px;
  box-shadow: 10px 10px 5px #888888;
}
.item ul li{
	font-weight:bold;
	font-size: 14px;
	
}
.item a{
	
	color:#2b4d04;
}

/* Navigation */
.menu-container {
  display: flex;
  justify-content: center;

}
.menu {
  list-style-type: none;
  margin: 0;
  padding: 0;
  background-color: #f1f1f1;
  display: flex;
}

.menu li {
  margin-right: 10px;
}

.menu li a {
  display: block;
  padding: 10px 20px;
  text-decoration: none;
  color: #333;
}
.menux li {
	color: coral;
	visibility: hidden;
}

.menu li a:hover {
  background-color: #ddd;

}

/*END NAVIGATION*/


.topbar {
  float:right;
  height: auto;
  width:100%;
  padding-top:5px;
}
.blacktab {
	float: left;
	position: relative;
	top: 10px;
	width: 353px;
	background: url(../../css/images/blacktab.png) top left no-repeat;
	left: 9px;
	
}
.logo {
    position: relative;
    float: left;
    display: block;
    left: 20px;
	height: 100%;
}

	
.phone {
  display: block;
  height:15%;
  width:25%;
  color:#6EBC14;
  float: right;
  
}
	
.banner {
  float:center;
  margin:auto;
  width:100%;
  height:90%;
}

.banner img {
  padding: 5px 5px;
  border-style:solid;
  border-width:1px;
  border-color:#cccccc;
  box-shadow: 10px 10px 5px #888888;
  width:100%;
  border-radius: 15%;
	animation-name: example;
  animation-duration: 7s;

}

@keyframes example {
  0% {
    opacity:0;
  }
  5% {
    opacity:0.3;
  }
	15% {
    opacity:1;
  }
  50% {
    opacity:1;
  }
	85% {
    opacity:1;
  }
  95% {
    opacity:0.3;
  }
  100% {
    opacity:0.1;
  }
}

.footer {
  float:right;
  background: #1E1E1E;
  height: 150px;
  width: 100%;
  border-bottom-style:solid;
  border-bottom-width:3px;
  border-bottom-color:#8BCF5E;
  margin-bottom:50px; /* gap under footer */
}
.footerbox {
  width:100%;
  height:115px;
  background:#343434;
}
/* Creative Commons License Attrib Css */
.creativecommons {
  width:30%;
  height:35px;
  float:right;
  margin-right:15px;
  color:#fff;
  font-size:12px;
}
.creativecommons img {
  position:relative;
  top:5px;
  margin-left:0px;
}
.creativecommons p {
  margin:0px;
  padding:4px 0 0 0;
}
.html5 {
  float:left;
  position:relative;
  top: 32px;
  left:34px;
  background: url(../../css/images/html5.png) no-repeat top;
  height:50px;
  width:44px;
  opacity:0.1;
}
.box1, .box2, .box3 {
	float:right;
	width:30%;
	height:90px;
}
.box2, .box3 {	
	margin-right:30px;
}
.box1 {	
	margin-right:15px;
}
.footerbox ul {
	margin-top:15px;
	  list-style-type: square;
	color:#757575;
	font-weight:bold;
	font-size:11px;
	line-height:150%;
}
.footerbox a:link, .footerbox a:hover {
  color: #757575; 
  text-decoration: underline;
}
.footerbox a:hover, .footerbox a:visited {
  color: #b4b4b4; 
  text-decoration: underline;
}
.preview{
	border: 0;
	overflow: hidden;
}

.box-shadow-preview{ 
   
	position: relative; 
    background-color: #FFFFFF; 
    border-width: 2px; 
    border-style: solid; 
    border-color: #DDDDDD; 
    border-radius: 13px; 
} 
.box-shadow-preview:before{ 
    content: ""; 
     z-index: -1; 
    position: absolute; 
    width: 70%; 
    top: 100px; 
    bottom: 40px; 
    left: 20px; 
     
    -webkit-transform: rotate(-8deg);
	transform: rotate(-8deg);
    box-shadow: 0px 35px 15px #777777; 
} 
.box-shadow-preview:after{ 
    content: ""; 
      z-index: -1;
    position: absolute; 
    width: 0%; 
    top: 160px; 
    right: 0px; 
    bottom: 25px; 
     
    -webkit-transform: rotate(4deg);
	transform: rotate(4deg);
    box-shadow: 0px 35px 20px #777777; 
}

#msg {
    width: 100%;
}
.dom {
    border-style: solid;
    border-color: brown;
    border-width: 1px;
    width: 70%;
     
   
  }
.risp {
   border-style: solid;
    border-color: gold;
    border-width: 1px;
    margin-left: 10%;
    
}

.testa{
    box-sizing: border-box;
    width: 15%;
    height: 100%;
    float: left;
    margin: 0;
    
    
}