body{
	margin: 0px;
	font-family: 'Open Sans', 'Open Sans Condensed', sans-serif;
}

a{
	text-decoration: none;
	color:inherit;
}

a img {border:none;}


@keyframes movimento{0% {width: 0px;}20% {width: 0px;}45% {width: 153px;}100% {width: 153px;}}
@-webkit-keyframes movimento{0% {width: 0px;}20% {width: 0px;}45% {width: 153px;}100% {width: 153px;}}
@-moz-keyframes movimento{0% {width: 0px;}20% {width: 0px;}45% {width: 153px;}100% {width: 153px;}}

@keyframes movimento02{0% {width: 0px;}20% {width: 0px;}45% {width: 0px;}65% {width: 169px;}100% {width: 169px;}}
@-webkit-keyframes movimento02{0% {width: 0px;}20% {width: 0px;}45% {width: 0px;}65% {width: 169px;}100% {width: 169px;}}
@-moz-keyframes movimento02{0% {width: 0px;}20% {width: 0px;}45% {width: 0px;}65% {width: 169px;}100% {width: 169px;}}

@keyframes movimento03{0% {width: 0px; opacity: 0;}20% {width: 0px; opacity: 0;}45% {width: 0px;opacity: 0;}70% {width: 0px;opacity: 0;}80% {width: 264px;}}
@-webkit-keyframes movimento03{0% {width: 0px; opacity: 0;}20% {width: 0px; opacity: 0;}45% {width: 0px;opacity: 0;}70% {width: 0px;opacity: 0;}80% {width: 264px;}}
@-moz-keyframes movimento03{0% {width: 0px; opacity: 0;}20% {width: 0px; opacity: 0;}45% {width: 0px;opacity: 0;}70% {width: 0px;opacity: 0;}80% {width: 264px;}}

@keyframes mov_grigio{0% {width: 0px;}100% {width: 100%;}}
@-webkit-keyframes mov_grigio{0% {width: 0px;}100% {width: 100%;}}
@-moz-keyframes mov_grigio{0% {width: 0px;}100% {width: 100%;}}

@keyframes scroller{0% {margin-right: -2012px;}3% {margin-right: -2012px;}20% {margin-right: -512px;}90% {margin-right: -512px;}98% {margin-right: 988px;}100% {margin-right: 988px;}}
@-webkit-keyframes scroller{0% {margin-right: -2012px;}3% {margin-right: -2012px;}20% {margin-right: -512px;}90% {margin-right: -512px;}98% {margin-right: 988px;}100% {margin-right: 988px;}}
@-moz-keyframes scroller{0% {margin-right: -2012px;}3% {margin-right: -2012px;}20% {margin-right: -512px;}90% {margin-right: -512px;}98% {margin-right: 988px;}100% {margin-right: 988px;}}

@keyframes opacity{0% {opacity: 0;}3% {opacity: 0;}10% {opacity: 1;;}90% {opacity: 1;}98% {opacity: 0;}100% {opacity: 0;}}
@-webkit-keyframes opacity{0% {opacity: 0;}3% {opacity: 0;}10% {opacity: 1;;}90% {opacity: 1;}98% {opacity: 0;}100% {opacity: 0;}}
@-moz-keyframes opacity{0% {opacity: 0;}3% {opacity: 0;}10% {opacity: 1;;}90% {opacity: 1;}98% {opacity: 0;}100% {opacity: 0;}}

@keyframes lastopacity{0% {opacity: 0;}1% {opacity: 0;}2% {opacity: 1;;}90% {opacity: 1;}100% {opacity: 1;}}
@-webkit-keyframes lastopacity{0% {opacity: 0;}1% {opacity: 0;}2% {opacity: 1;;}90% {opacity: 1;}100% {opacity: 1;}}
@-moz-keyframes lastopacity{0% {opacity: 0;}1% {opacity: 0;}2% {opacity: 1;;}90% {opacity: 1;}100% {opacity: 1;}}

@keyframes lastscroller{0% {margin-right: -2012px;}1% {margin-right: -2012px;}2% {margin-right: -512px;}90% {margin-right: -512px;}100% {margin-right: -512px;}}
@-webkit-keyframes lastscroller{0% {margin-right: -2012px;}1% {margin-right: -2012px;}2% {margin-right: -512px;}90% {margin-right: -512px;}100% {margin-right: -512px;}}
@-moz-keyframes lastscroller{0% {margin-right: -2012px;}1% {margin-right: -2012px;}2% {margin-right: -512px;}90% {margin-right: -512px;}100% {margin-right: -512px;}}

#contenitore{
	width: 100%;
	height: 576px;
	margin: auto;
	position: absolute;
	top: 50%;
	margin-top: -288px;
}

#contenitoreindex{
	width: 1024px;
	height: 576px;
	position: absolute;
	top: 50%;
	margin-top: -288px;
	left: 50%;
	margin-left: -512px; 
}

.boxoggetti {
	width: 100%;
	height: 576px;
	margin: auto;
	position: relative;
	top: -84px;
}


.fondo {
	height: 50%;
	width: 100%;
	position: absolute;
	top:0px;
	background-color: #0b0000;
}


.contenitoretazza{
	width: 100%;
	height: 440px;
	margin: auto;
	position: relative;
	z-index: 1;
}

.web{
	width: 169px;
	height: 64px;
	top: 170px;
	left: 448px;
	position: relative;
	right: 25px;
	z-index: 3;
	background-image: url('../img/sito_web.png');
	animation: movimento02;-webkit-animation: movimento02;-moz-animation: movimento02;
	animation-duration: 10s;-webkit-animation-duration: 10s;-moz-animation-duration: 10s;
	animation-iteration-count: 1;-webkit-animation-iteration-count: 1;-moz-animation-iteration-count: 1;
}

.sbaffo{
	width: 153px;
	height: 20px;
	top: 186px;
	position: relative;
	right: -410px;
	z-index: 3;
	background-image: url('../img/sbaffo.png'); background-position: left;
	animation: movimento;-webkit-animation: movimento;-moz-animation: movimento;
	animation-duration: 10s;-webkit-animation-duration: 10s;-moz-animation-duration: 10s;
	animation-iteration-count: 1;-webkit-animation-iteration-count: 1;-moz-animation-iteration-count: 1;
}

.clicca{
	width: 264px;
	height: 36px;
	margin: auto;
	top: 255px;
	left: 270px;
	position: relative;
	z-index: 4;
	font-family: Open Sans;
	letter-spacing: 1px;
	font-weight: 300;
	font-style: italic;
	font-size: 24px;
	color: white;
	text-align: center;
	animation: movimento03;-webkit-animation: movimento03;-moz-animation: movimento03;
	animation-duration: 10s;-webkit-animation-duration: 10s;-moz-animation-duration: 10s;
	animation-iteration-count: 1;-webkit-animation-iteration-count: 1;-moz-animation-iteration-count: 1;
	white-space: nowrap;
}

.clicca:hover{
	color: #ea640e;
}

.testata{
	width: 587px;
	height: 58px;
	margin: auto;
	top:131px;
	position: relative;
	z-index: 2;
	font-family: Open Sans;
	letter-spacing: 3px;
	font-weight: 400;
	font-style: italic;
	font-size: 44px;
	color: white;
	text-align: center;
}

.tazzafoto{
	width: 433px;
	height: 361px;
	margin: auto;
	bottom: 12px;
	position: relative;
	background-image: url('../img/foto_tazza.jpg');
}

.gmgrigio{
	width: 248px;
	height: 38px;
	margin: auto;
	right: 27px;
	position: relative;
	background-image: url('../img/gmgrigio.png');
}

.menu{
	width: 342px;
	height: 15px;
	margin: auto;
	position: relative;
	z-index: 100;
	top: 377px;
	left: 290px;
}

.cellamenu{
	width: 56px;
	height: 11px;
	float: left;
	border-left: 1px solid #d8ceb3;
	font-family: Open Sans;
	font-size: 10px;
	color: #d8cebe;
	text-align: center;
}

.cellamenu:hover{
	color: #ea640e;
}

.stilesiti{
	width: 100%;
	top: 77px;
	left: 16px;
	font-size: 29px;
	letter-spacing: 2px;
	font-family: open sans condensed;
	font-weight: 300;
	text-align: center;
	position: relative;
	color: white;
}

.fasciasiti{
	width: 262px;
	height: 25px;
	position: relative;
	margin: auto;
	background-image: url('../img/sfum_marron.jpg');
	background-repeat: no-repeat;
	z-index: -1;
	top: -71px;
}

.nomigusto{
	width: 298px;
	height: 241px;
	margin: auto;
	background-image: url('../img/nomicaffe.png');
	background-repeat: no-repeat;
	position: relative;
	z-index: 2;
	opacity: 0.8;
	top: 57px;
	left: 15px;
}

.chicchi{
	width: 292px;
	height: 49px;
	margin: auto;
	background-image: url('../img/chicchi_piacere.png');
	background-repeat: no-repeat;
	position: relative;
	z-index: 2;
	top: 219px;
	left: 17px;
}

.orologio{
	width: 142px;
	height: 141px;
	margin: auto;
	background-image: url('../img/orologio.png');
	background-repeat: no-repeat;
	position: relative;
	z-index: 2;
	top:120px;
	left:17px;
}

.telefono{
	width: 224px;
	height: 96px;
	margin: auto;
	background-image: url('../img/tel-lattina.png');
	background-repeat: no-repeat;
	position: relative;
	top: 175px;
	left: 20px;
}

.comunicare{
	width: 215px;
	height: 141px;
	margin: auto;
	background-image: url('../img/comunicazione.png');
	background-repeat: no-repeat;
	position: relative;
	z-index: 2;
	top: 122px;
	left: 08px;
}

.tazza{
	width: 349px;
	height: 303px;
	margin: auto;
	background-image: url('../img/tazza_giornale.png');
	background-repeat: no-repeat;
	position: relative;
	top: 132px;
}

.fascianera{
	width: 100%;
	height: 406px;
	background-color: #0b0000;
}

.fasciabianca{
	width: 648px;
	height: 230px;
	margin: auto;
	position: relative;
	top: 18px;
}

.fascia_grigia{
	width: 100%;
	height: 5px;
	margin: auto;
	position: absolute;
	background-color: #e3e4e4;
	bottom: -35px;
	animation: mov_grigio;-webkit-animation: mov_grigio;-moz-animation: mov_grigio;
	animation-duration: 10s;-webkit-animation-duration: 10s;-moz-animation-duration: 10s;
	animation-iteration-count: 1;-webkit-animation-iteration-count: 1;-moz-animation-iteration-count: 1;
}

.fascia_grigiastatic{
	width: 100%;
	height: 5px;
	margin: auto;
	position: absolute;
	background-color: #e3e4e4;
	bottom: -35px;
}

.fascia_bianca{
	width: 100%;
	height: 5px;
	margin: auto;
	margin-left:0px;
	background-color: white;
	animation: mov_grigio;-webkit-animation: mov_grigio;-moz-animation: mov_grigio;
	animation-duration: 10s;-webkit-animation-duration: 10s;-moz-animation-duration: 10s;
	animation-iteration-count: 1;-webkit-animation-iteration-count: 1;-moz-animation-iteration-count: 1;
	animation-fill-mode: forwards;-webkit-animation-fill-mode: forwards;-moz-animation-fill-mode: forwards;
}

.new{
	width: 150px;
	height: 47px;
	background-image: url('../img/new.png');
	position: relative;
	left: -23px;
	top: 2px;
	z-index: 2;
	display: inline-block;
}

.logo{
	width: 247px;
	height: 37px;
	background-image: url('../img/logogm.jpg');
	float: left;
	display: inline-block;
	position: relative;
	top: 60px;
	left: 45px;
}

.contatti{
	font-size: 18px;
	font-weight: 400;
	font-style: italic;
	text-align: center;
	color: #0068b1;
	position: relative;
	top: 520px;

}

.contatti:hover {
	opacity:0.5;
}

.testobasso{
	width: 658px;
	height: 52px;
	float: left;
	position: relative;
	left: 44px;
}

.stiletesto{
	font-size: 17px;
	font-weight: 300;
	font-style: italic;
	text-align: center;
	color: white;
	position: relative;
	top: 303px;
	left: 150px;

}

.sfumatura{
	width: 100%;
	height: 5px;
	background-image: url('../img/fascia_sfum.jpg');
	position: relative;
	margin: auto;
	bottom: -401px;
	background-repeat: no-repeat;
	background-position-x: center;
}

.opacontainer {
	width: 100%;
	height: 768px;
	position: absolute;
	top: 50%;
	margin-top: -378px;
	overflow: hidden;

}

.opa{
	width: 1024px;
	height: 768px;
	position: absolute;
	top: 50%;
	margin-top: -378px;
	right: 50%;
	margin-right: -512px;
	z-index:98;
	animation: opacity;-webkit-animation: opacity;-moz-animation: opacity;
	animation-duration: 10s;-webkit-animation-duration: 10s;-moz-animation-duration: 10s;
	animation-iteration-count: 1;-webkit-animation-iteration-count: 1;-moz-animation-iteration-count: 1;
	animation-timing-function: ease-in-out;-webkit-animation-timing-function: ease-in-out;-moz-animation-timing-function: ease-in-out;
	animation-fill-mode: forwards;-webkit-animation-fill-mode: forwards;-moz-animation-fill-mode: forwards;
}

.lastopa{
	width: 1024px;
	height: 768px;
	position: absolute;
	top: 50%;
	margin-top: -378px;
	right: 50%;
	margin-right: -512px;
	z-index: 99;
	animation: lastopacity;-webkit-animation: lastopacity;-moz-animation: lastopacity;
	animation-duration: 60s;-webkit-animation-duration: 60s;-moz-animation-duration: 60s;
	animation-iteration-count: infinite;-webkit-animation-iteration-count: infinite;-moz-animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;-webkit-animation-timing-function: ease-in-out;-moz-animation-timing-function: ease-in-out;
	animation-fill-mode: forwards;-webkit-animation-fill-mode: forwards;-moz-animation-fill-mode: forwards;
}

.diapocontainer {
	width: 100%;
	height: 768px;
	position: absolute;
	top: 50%;
	margin-top: -378px;
	overflow: hidden;	
}

.diapo{
	width: 1024px;
	height: 768px;
	position: absolute;
	top: 50%;
	margin-top: -378px;
	right: 50%;
	margin-right: -512px;
	z-index:97;
	animation: scroller;-webkit-animation: scroller;-moz-animation: scroller;
	animation-duration: 10s;-webkit-animation-duration: 10s;-moz-animation-duration: 10s;
	animation-iteration-count: 1;-webkit-animation-iteration-count: 1;-moz-animation-iteration-count: 1;
	animation-timing-function: ease-in-out;-webkit-animation-timing-function: ease-in-out;-moz-animation-timing-function: ease-in-out;
	animation-fill-mode: forwards;-webkit-animation-fill-mode: forwards;-moz-animation-fill-mode: forwards;
}
.lastdiapo{
	width: 1024px;
	height: 768px;
	position: absolute;
	top: 50%;
	margin-top: -378px;
	right: 50%;
	margin-right: -512px;
	z-index:99;
	animation: lastscroller;-webkit-animation: lastscroller;-moz-animation: lastscroller;
	animation-duration: 60s;-webkit-animation-duration: 60s;-moz-animation-duration: 60s;
	animation-iteration-count: infinite;-webkit-animation-iteration-count: infinite;-moz-animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;-webkit-animation-timing-function: ease-in-out;-moz-animation-timing-function: ease-in-out;
	animation-fill-mode: forwards;-webkit-animation-fill-mode: forwards;-moz-animation-fill-mode: forwards;
}