@charset "utf-8";
/* CSS Document */


html,body{
    height:100%;
	width:100%;
    margin:0;
	padding:0;
	background-color:#000;
}

#logo{
	height: 222px;
	left: 50%;
	margin-left: -137px;
	margin-top: -111px;
	position: absolute;
	top: 50%;
	width: 274px;
	text-align:center;
	line-height: 16em;
	z-index:99;
}

#logo img {
	width:100%;
	height:100%;
}

#pizza {
	margin:0;
	padding:0;
	width:100%;
	height:50%;
	background-image: url('images/bg_pizz.jpg');
	background-size:cover;
	position: relative;
	top:0;
	border-bottom:2px solid #000;
	background-position:center center;
	opacity:0.7;
	-webkit-transition:0.1s;
}

#pizza:hover {
	opacity:1;
}

#gelato {
	margin:0;
	padding:0;
	width:100%;
	height:50%;
	background-image: url('images/bg_gel.jpg');
	background-position:center center;
	background-size:cover;
	position: relative;
	bottom:0;
	border-top:2px solid #000;
	opacity:0.7;
	-webkit-transition:0.1s;
}

#gelato:hover {
	opacity:1;
}



#enter-pizzeria {
	width: 500px;
	height: 155px;
	left: 50%;
	margin-left: -250px;
	margin-top: -80px;
	position: absolute;
	top: 42%;
	text-align:center;
	z-index:99;
}
#enter-pizzeria img {
	width:100%;
	height:100%;
}



#enter-gelateria {
	width: 500px;
	height: 155px;
	left: 50%;
	margin-left: -250px;
	margin-bottom: -80px;
	position: absolute;
	bottom: 42%;
	text-align:center;
	z-index:99;
}
#enter-gelateria img {
	width:100%;
	height:100%;
}
	
@media only screen and (max-width: 479px) {
	#enter-gelateria {
		width: 320px;
		height: 99px;
		left: 50%;
		margin-left: -160px;
		margin-bottom: -50px;
		position: absolute;
		text-align:center;
		z-index:99;
}	

	#pizza {
		opacity:0.9;
	}
	
	#gelato {
		opacity:0.9;
	}

	#enter-pizzeria {
		width: 320px;
		height: 99px;
		left: 50%;
		margin-left: -160px;
		margin-top: -50px;
		position: absolute;
		text-align:center;
		z-index:99;
}	
		
	}
	
@media only screen and (max-height: 529px) {
	#logo{
		width: 150px;
		height: 122px;
		margin-left: -75px;
		margin-top: -61px;
	}

}