* {margin:0;padding:0;}

body {
    background-image: url(bg-campo2022.jpg);
    background-size: 100vw;
    background-color: #de8e6d;
    text-align: center;
    font-size: 2rem;
    background-position: bottom;
    background-repeat: no-repeat;
    font-family: 'DK New Beginnings', sans-serif;
	min-height:100%;
	flex-direction:column;
	display:flex;
}
@font-face {
	font-family: 'Square Beat';
	src: url(fonts/SquareBeat.otf);

}

@font-face {

	font-family: 'DK New Beginnings';
	src: url(fonts/DK_New_Beginnings.otf);
}

@font-face {
	font-family: 'Only Organic';
	src: url(fonts/OnlyOrganic.ttf);
	
}
h1 {
	font-family: 'Square Beat';
	color: #ffffff/*0066cc*/;
	text-shadow: 0px 5px 13px #d14000;
	/*text-transform:uppercase;*/
	font-size: 4rem;
}


h2 {
	font-family: 'DK New Beginnings', sans-serif;
	color: #000000/*e38222*/;
	text-shadow: 0px 5px 13px #ffffff; 
	/* text-transform:uppercase;*/
	font-size: 2.5rem;
	
}
p {
	/*color: #4a90b5;font-size: 0.7em;*/
	font-family: inherit;
	
}
img.titolo {
max-width: 714px;
width: 100%;
}

header {
width: 100%;
max-width: 800px;
margin: 0 0 0 auto;
flex:0.5;
}

#upper {
	background-image: url(bg-campo2022.jpg);
    background-size: 100vw;
    background-color: #de8e6d;
    text-align: center;
    font-size: 2rem;
    background-position: bottom;
    background-repeat: no-repeat;
    font-family: 'DK New Beginnings', sans-serif;
	flex:1;
	flex-direction:column;
	display:flex;
}

#container {
width: 100%;
max-width: 800px;
margin: 0 auto;
flex:1;
}

#egg {
    display: inline-block;
    width: 400px;
    height: 120px;
    background-color: white;
    border-radius: 63% 24% 45% 40% / 68% 70% 35% 36%;
	color:#00abeb;
	padding: 1em;
	border-bottom: 3px solid;
    border-right: 3px solid;
}

#cloud-mn {
    display: inline-block;
    width: 400px;
    height: auto;
    background-color: white;
    border-radius: 36% 24% 45% 40% / 68% 70% 35% 20%;
	color:#00abeb;
	padding: 1em;
    border-bottom: 3px solid;
    border-right: 3px solid;
	margin-bottom: 1em;
}
#cloud-mn h2, #cloud-mn p, #cloud-mn a, #egg p {
	color:#00abeb;
}

#egg a[href$="materiali"] {
	color: #de8e6b;
}

img.csoon {margin: 200px 50px;}

#main {
background-color: #ffffff;
text-align:left;
padding: 1em 2em;
/*width:65%;*/
opacity: 0.8;
filter: alpha(opacity=80); /* For IE8 and earlier */
}

#main p, #main ul > li {
opacity: 1;
filter: alpha(opacity=100); /* For IE8 and earlier */
}

#footer {
position:absolute;
bottom:0;
width:100%;
background-color: #f2aa20;
padding-top:20px;
}

footer {
background-color: #48667e;
    padding: 20px;
    color: #fff;
}

footer p {
	font-size:medium;
}

div.button {width:65%;margin:1em auto;z-index:-20;}
div.button a {width:100%;border:1px solid #d8501f; padding: 1em;background:linear-gradient(to bottom,#ffa51e,#e45420);color:#ffffff;border-radius:20px;}
div.button a:hover {background:linear-gradient(to bottom, #ffcf1e ,#f6612b);color:#ffffff;text-decoration:none;}

@media only screen and (max-width: 768px) {
h1, h2 {
	line-height:1;
}
h2 {
	font-size:1.8rem;
}
#egg {
    width: 75%;
}
#cloud-mn {
    width: 80%;
}
	
}