body{
	margin: 0px;
	padding: 0px;
}
#mondo{
	padding: auto;
	-webkit-transform: scale(0.7);
	-moz-transform: scale(0.7);
}
#myCanvas{
position: fixed;
top: 0px;
}
#prato{
	-o-transform-origin: 0px 0px;  
	-o-transform: scale(0.7) translate(15%);
	position: fixed;
	background: 
		url('Fiori.png') no-repeat 40px top,
		url('erba01.png') no-repeat 250px 675px,
		url('erba02.png') no-repeat 915px 660px,
		url('Albero.png') no-repeat 50px 100px,
		url('laghetto.png') no-repeat 180px 735px,
		url('prato.png') no-repeat 50% bottom,
		url('cielo.png') no-repeat 50% 275px;
		width: 1099px;
		height: 1036px;
}
#fiore1{ 
	background: url('./Petalo_mini.png') no-repeat;
	width: 35px;
	height: 34px;
	position: relative;
	top: 830px;
	left: 475px;
	-o-transform: skew(-0.85rad, 0.55rad) scale(0.7);
	-moz-transform: skew(-0.85rad, 0.55rad) scale(0.7);
	-webkit-transform: skew(-0.85rad, 0.55rad) scale(0.7);
	transform: skew(-0.85rad, 0.55rad) scale(0.7);
	opacity: 0.4;
}
#fiore2{ 
	background: url('./Petalo_mini.png') no-repeat;
	width: 35px;
	height: 34px;
	position: relative;
	top: 875px;
	left: 600px;
	-o-transform: skew(-0.85rad, 0.55rad) scale(0.7) rotate(0.5rad);
	-moz-transform: skew(-0.85rad, 0.55rad) scale(0.7) rotate(0.5rad);
	-webkit-transform: skew(-0.85rad, 0.55rad) scale(0.7) rotate(0.5rad);
	transform: skew(-0.85rad, 0.55rad) scale(0.7) rotate(0.5rad);
}
#fiore3{ 
	background: url('./Petalo_mini.png') no-repeat;
	width: 35px;
	height: 34px;
	position: relative;
	top: 750px;
	left: 825px;
	-o-transform: skew(-0.85rad, 0.70rad) scale(0.7) rotate(0.2rad);
	-moz-transform: skew(-0.85rad, 0.70rad) scale(0.7) rotate(0.2rad);
	-webkit-transform: skew(-0.85rad, 0.70rad) scale(0.7) rotate(0.2rad);
	transform: skew(-0.85rad, 0.70rad) scale(0.7) rotate(0.2rad);
	opacity: 0.7;
}

#DL{
	background: 
		url('./Digitalights.net.png') no-repeat 5px 50%,
		url('./title_holder.png') no-repeat 100% 100%;
	width: 334px;
	height: 144px;
	position: relative;
	top: 230px;
	left: 670px;
}
#DL h1{display: none;}

#WDTP{
	background: url('./WhereDreamsTakesPalce.png') no-repeat 100% 100%;
	width: 468px;
	height: 32px;
	position: relative;
	top: 265px;
	left: 410px;
}
#WDTP h3{display: none;}

#Entra{
	display: block;
	font-family: 'Hiragino Kaku Gothic StdN', sans-serif;
	font-size: 3.5em;
	height: 1em;
	position: relative;
	right: -60%;
	top: 95px;
	width: 4em;
}

#Entra a{
	display: block;
	color: #FFFFFF;
	text-shadow: 
		0px 0px 3px #99CCFF, 
		0px 0px 5px #99CCFF,
		0px 0px 30px #99CCFF,
		0px 0px 30px #99CCFF;
	text-decoration: none;

}
#Entra a:hover{   
	text-shadow: 
		0px 0px 3px #FF99CC, 
		0px 0px 5px #FF99CC,
		0px 0px 30px #FF99CC, 
		5px 5px 30px #FF99CC;
}


#Dracomon{
	position: absolute;
	top: 0px;
	left: 0px;
}

#menu{
	border: 6px solid #99CCFF;
	background: #F5F5F5;
	
	box-shadow: 10px 10px 10px #FFD5E5;
	-webkit-box-shadow: 10px 10px 10px #FFD5E5; /* Safari */   
	-moz-box-shadow: 10px 10px 10px #FFD5E5; /* Safari */   

	opacity: 0.75;

	border-radius:10px;
	-webkit-border-radius:10px; /* Safari */
	-moz-border-radius:10px; /* Safari */

	position: fixed;
	top: 50px;
	right: -138px;
	z-index: 100000;

   /* Opera */ 
	-o-transition-property: padding-right;
	-o-transition-duration: 1.5s;
	-o-transition-delay: 0s;
	/* Generale */
	transition-property: padding-right;
	transition-duration: 1.5s;
	transition-delay: 0s;
	/* Altri */
	-webkit-transition-property: padding-right;
	-webkit-transition-duration: 1.5s;
	-webkit-transition-delay: 0s;

	-moz-transition-property: padding-right;
	-moz-transition-duration: 1.5s;
	-moz-transition-delay: 0s;
}
#menu:hover{
	padding-right: 138px;
}
#menu ul{
	list-style-type: none;
	padding: 0.3em;
	margin: 0px;
	opacity: 1;
	list-style-position: inside;
	color: #0081ff;
	font-weight: bold;
	font-family: Arial;
} 
#menu ul li:first-child {
	-o-transform: rotate(-90deg) translate(-139px, -2px);
	-o-transform-origin: 0% 0%;

	-moz-transform: rotate(-90deg) translate(-139px, -2px);
	-moz-transform-origin: 0% 0%;
	
	-webkit-transform-origin: 0% 0%;
	-webkit-transform: rotate(-90deg) translate(-139px, -2px);
	
	transform-origin: 0% 0%;
	transform: rotate(-90deg) translate(-139px, -2px);


	color: #FF3399;
	font-size: 1.5em;
	padding-left: 30px;
	min-height: 30px;
}
#menu:hover ul li:first-child {
	color: #FFFFFF;
	text-shadow: 0px 0px 10px #FF3399;
	
	-o-transform: rotate(0deg) translate(0px, 0px);
	-moz-transform: rotate(0deg) translate(0px, 0px);
	-webkit-transform: rotate(0deg) translate(0px, 0px);
	transform: rotate(0deg) translate(0px, 0px);
	background: none;
}
#menu ul li hr{
	color: #FF3399;
	width: 95%;
	border: 1px solid #FFD5E5;
}
#menu ul li a{
	color: #0081FF;
	min-height: 30px;
	padding-left: 33px;
	padding-top: 0.1em;
	text-decoration: none;
	display: block;
	height: 100%;
	width: 100%;
	vertical-align: 50%;
}
#menu ul li a:hover{
	display: block;
	background: url('./Petalo_mini_0.7.png') no-repeat left 50%;
	color: #FFFFFF;
	text-shadow: 0px 0px 5px #0081FF, 2px 2px 3px #FF99CC;
}
#menu ul li a.M_DL:hover{ background: url('./menu/DL.ico') no-repeat left 50%; }
#menu ul li a.M_WF:hover{}
#menu ul li a.M_ED:hover{ background: url('./menu/DL.ico') no-repeat left 50%; }
#menu ul li a.M_EW:hover{}
#menu ul li a.M_PC:hover{ background: url('./menu/PdC_1_32x32.png') no-repeat left 50%;}
#menu ul li a.M_CCP:hover{ background: url('./menu/CCP.ico') no-repeat left 50%; }
#menu ul li a.M_GM:hover{}
#menu ul li a.M_MM:hover{}
#menu ul li a.M_MT:hover{ background: url('./menu/ext/youtube_32.png') no-repeat left 50%; }
#menu ul li a.M_FL:hover{ background: url('./menu/ext/flickr_32.png') no-repeat left 50%; }
#menu ul li a.M_GP:hover{ background: url('./menu/ext/g-plus-icon-32x32.png') no-repeat left 50%; }
#menu ul li a.M_TW:hover{background: url('./menu/ext/twitter_32.png') no-repeat left 50%;}


#tooltip{
	background: #F7F7F7 url('./Petalo_mini_0.7.png') no-repeat 95% 90%;
	
	box-shadow: 0px 0px 50px #FF3399;
	-webkit-box-shadow: 0px 0px 50px #FF3399; /* Safari */   
	-moz-box-shadow: 0px 0px 50px #FF3399; /* Safari */   

	border-radius:5px;
	-webkit-border-radius:5px; /* Safari */
	-moz-border-radius:5px; /* Safari */
	position: fixed;
	right: 174px;
	z-index: 99999;
	padding: 0.4em;
	max-width: 100px;
	color: #0081FF;
	font-family: Arial;
	font-size: 0.9em;
	opacity: 0.95;
}
#tooltip span{opacity: 1;}

/* iPad [portrait + landscape] */ 
/*@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {*/
@media all and (min-device-width: 768px) and (max-device-width: 1024px) {
	#menu { 
		position: fixed;
		top: 50px;
		right: -7px;	
	} 
	#menu:hover{
		padding-right: 7px;
	/* Opera */ 
		-o-transition-property: padding-right;
		-o-transition-duration: 0s;
		-o-transition-delay: 0s;
	/* Generale */
		transition-property: padding-right;
		transition-duration: 0s;
		transition-delay: 0s;
	/* Altri */
		-webkit-transition-property: padding-right;
		-webkit-transition-duration: 0s;
		-webkit-transition-delay: 0s;
	/* Mozilla */
		-moz-transition-property: padding-right;
		-moz-transition-duration: 0s;
		-moz-transition-delay: 0s;		
	}
	#menu ul li a{ background: url('./Petalo_mini_0.7.png') no-repeat left 50%; }
	#menu ul li a.M_DL{ background: url('./menu/DL.ico') no-repeat left 50%; }
	#menu ul li a.M_WF{}
	#menu ul li a.M_ED{ background: url('./menu/DL.ico') no-repeat left 50%; }
	#menu ul li a.M_EW{}
	#menu ul li a.M_PC{ background: url('./menu/PdC_1_32x32.png') no-repeat left 50%;}
	#menu ul li a.M_CCP{ background: url('./menu/CCP.ico') no-repeat left 50%; }
	#menu ul li a.M_GM{}
	#menu ul li a.M_MM{}
	#menu ul li a.M_MT{ background: url('./menu/ext/youtube_32.png') no-repeat left 50%; }
	#menu ul li a.M_FL{ background: url('./menu/ext/flickr_32.png') no-repeat left 50%; }
	#menu ul li a.M_GP{ background: url('./menu/ext/g-plus-icon-32x32.png') no-repeat left 50%; }
	#menu ul li:first-child {
		color: #FFFFFF;
		text-shadow: 0px 0px 10px #FF3399;
		-o-transform: rotate(0deg) translate(0px, 0px);
		-moz-transform: rotate(0deg) translate(0px, 0px);
		-webkit-transform: rotate(0deg) translate(0px, 0px);
		transform: rotate(0deg) translate(0px, 0px);
		background: none;
	}
} 


/* iPhone [portrait + landscape] */
/* @media only screen and (max-device-width: 480px) {*/
@media all and (max-device-width: 480px) {
	#prato{
		-o-transform: scale(0.5) translate(0);
	} 
	#myCanvas { 
		display: none;
	}
	#DL{
		left: 60%;
		position: relative;
		top: -3em;
	}	
	#Dracomon { 
		float: left;
		left: 0px;
		position: static;
		top: 0px;
		margin-right: 1em;	
	}
	#Entra { 
		font-weight: bold;
		margin-bottom: 24px;
		position: static;
		z-index: 3;		
	}

	#Entra a:hover { 
		color: #FF99CC;
		text-shadow: none;
	}

	#Entra a { 
		color: #99CCFF;
		text-decoration: none;
		text-shadow: none;
	}	
	#menu:hover {
		padding-right: 0px;
	}

	#menu { 


		position: static;
		right: 0px;
		top: 0px;
		z-index: 0;	

	/* Opera */ 
		-o-transition-property: padding-right;
		-o-transition-duration: 0s;
		-o-transition-delay: 0s;
	/* Generale */
		transition-property: padding-right;
		transition-duration: 0s;
		transition-delay: 0s;
	/* Altri */
		-webkit-transition-property: padding-right;
		-webkit-transition-duration: 0s;
		-webkit-transition-delay: 0s;
	/* Mozilla */
		-moz-transition-property: padding-right;
		-moz-transition-duration: 0s;
		-moz-transition-delay: 0s;		
	}
	#menu ul li a{ background: url('./Petalo_mini_0.7.png') no-repeat left 50%; }
	#menu ul li a.M_DL{ background: url('./menu/DL.ico') no-repeat left 50%; }
	#menu ul li a.M_WF{}
	#menu ul li a.M_ED{ background: url('./menu/DL.ico') no-repeat left 50%; }
	#menu ul li a.M_EW{}
	#menu ul li a.M_PC{ background: url('./menu/PdC_1_32x32.png') no-repeat left 50%;}
	#menu ul li a.M_CCP{ background: url('./menu/CCP.ico') no-repeat left 50%; }
	#menu ul li a.M_GM{}
	#menu ul li a.M_MM{}
	#menu ul li a.M_MT{ background: url('./menu/ext/youtube_32.png') no-repeat left 50%; }
	#menu ul li a.M_FL{ background: url('./menu/ext/flickr_32.png') no-repeat left 50%; }
	#menu ul li a.M_GP{ background: url('./menu/ext/g-plus-icon-32x32.png') no-repeat left 50%; }
	#menu ul li:first-child {
		color: #FFFFFF;
		text-shadow: 0px 0px 10px #FF3399;
		-o-transform: rotate(0deg) translate(0px, 0px);
		-moz-transform: rotate(0deg) translate(0px, 0px);
		-webkit-transform: rotate(0deg) translate(0px, 0px);
		transform: rotate(0deg) translate(0px, 0px);
		background: none;
	}	
}