/*CSS*/

#total {
	width: 800px;
	min-height: 800px;
	background-color: bisque;
}

#contenitore {
	width: 800px;
	height: 800px;
	background-image: url(img/gmail-mockup.png);
	background-size: cover;
	background-repeat: no-repeat;
	position: absolute;
	margin-left: 25%;
	margin-top: 30px;
	z-index: -1;
}

#contenitore-dem {
	width: 480px;
	height: 500px;
	background-color: transparent;
	z-index: 100;
	position: relative;
	margin-left: 220px;
	margin-top: 235px;
}

.dem {
	z-index: 120;
	overflow-y: scroll;
	width: 480px;
	height: 500px;
}


/* Dirty Reset */
ul, ul li {
	display: block;
	padding: 0;
	margin: 0;
	list-style-type: none;
}

a, a:link, a:active, a:visited, a:active {
	border: none;
	outline: none;
	color: white;
	text-decoration: none;
}

/* Indicators */
ul#billy_indicators,
ul#fade_indicators {
	width: 10%;
	height: 50px;
	margin-left: 50%;
	margin-right: 50%;
	margin-top: 20px;
	display: block;
	z-index: 105;
}

	ul#billy_indicators li,
	ul#fade_indicators li {
		display: block;
		width: 9px;
		height: 9px;
		float: left;
		margin: 0 5px 0 0;
	}
		
		ul#billy_indicators li a,
		ul#fade_indicators li a {
			display: block;
			width: 9px;
			height: 9px;
			background: #494c4e;
			opacity: 0.4;
			-moz-border-radius: 50px;
			-webkit-border-radius: 50px;
		}	
		
		ul#billy_indicators li.active a,
		ul#fade_indicators li.active a { opacity: 1.0; }
		ul#billy_indicators li a:hover,
		ul#fade_indicators li a:hover { opacity: 0.6; }
			ul#billy_indicators li.active a:hover,
			ul#fade_indicators li.active a:hover { opacity: 1.0; }
		
/* Carousel */
#billy_clip { 
	position: relative; /* For IE */
	z-index:100;
}

ul#billy_scroller,
ul#billy_fader {
	display: block;
	float: left;
	position: relative;
}
	
	ul#billy_scroller li,
	ul#billy_fader li {
		float: left;
		display: block;
	}