/* @override http://127.0.0.1/SitiPicov/euro2012/ios/css/stili.css */

/* @group Browser CSS RESET */

/* BROWSERS CSS RESET */
html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input { margin: 0; padding: 0; }
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th { font-size: 1em; font-weight: normal; font-style: normal; }
ul,ol { list-style: none; }
fieldset,img { border: none; }
caption,th { text-align: left; }
table { border-collapse: collapse; border-spacing: 0; }

/* @end */

strong { font-weight: bold; }
em { font-style: italic; }

body {
	background-color: #77a6b7;
	text-align: center; /* Centre in IE pre6 che ignora il margin auto del main */
	padding-top: 8px; /* non lo metto qui altrimenti influisce anche sulle altre pagine tipo iframe che caricano lo stesso css */
}


#main-sizer {
	/*
	width1: 90%;  Se utilizzo la % non devo impostare la width su main-sizer-inside */
	width: 920px; /* Se utilizzo la fissa devo impostare lo stesso valore in main-sizer-inside */
	margin:0 auto; /* la centratura la imposto su quello pi? esterno */
	text-align: left; /* Ripristina la centratura di default dopo il patch per IEpre6 sul body */	
	border: 2px #000 solid;
}
#main-sizer-inside {
	width: 920px; /* PATCH IEpre6: imposto qui le dimensioni=#main-sizer.width cosi i suoi pad e border vanno SEMPRE esterni anche su IEpre6 */
}


#main {
	
}


#header {
	line-height: 0;
	font-size: 0;
}

#body {
	float: left;
	clear: both;
	width: 100%;
	background: url(../immagini/body_bg.jpg);
}

#body-left {
	float: left;	
	width: 607px;
}

#body-right {
	float: right;
	width: 313px;
}

#body-left .inside {
	margin: 16px;
	margin-top: 14px;
}


#body-right .inside {
	margin: 6px;
}

#footer {
	width: 100%;
	clear: both;
	line-height: 0;
	font-size: 0;
}

#credits {
	width: 100%;
	background: #6c97a7;
}
#credits p {
	padding-top: 8px;
}


.roundblock-top {
	height: 8px;
	line-height: 0;
	font-size: 0;
	background: url(../immagini/roundblock_bg.png);
	background-position: -575px 0px;
	background-repeat: repeat-y ;
}
.roundblock-middle {
	background: url(../immagini/roundblock_bg.png);
	background-repeat: repeat-y;
}
.roundblock-bottom {
	height: 8px;
	line-height: 0;
	font-size: 0;	
	background: url(../immagini/roundblock_bg.png);
	background-position: -575px 8px;
	background-repeat: repeat-y;
}
.roundblock-middle-inside {
	padding: 12px;
	
}


.roundblock-alt-top {
	height: 8px;
	line-height: 0;
	font-size: 0;
	background: url(../immagini/roundblock_alt_bg.png);
	background-position: -575px 0px;
	background-repeat: repeat-y ;
}
.roundblock-alt-middle {
	background: url(../immagini/roundblock_alt_bg.png);
	background-repeat: repeat-y;
}
.roundblock-alt-bottom {
	height: 8px;
	line-height: 0;
	font-size: 0;	
	background: url(../immagini/roundblock_alt_bg.png);
	background-position: -575px 8px;
	background-repeat: repeat-y;
}
.roundblock-alt-middle-inside {
	padding: 12px;
	
}


#download {
	text-align: center;
	padding-top: 8px;
	padding-bottom: 8px;
}


#iphoneipadbutton {
	width: 77%;
	padding-left: 66px;
	border-top: 1px #ccc solid;	
	padding-top: 10px;
}
#iphone-button {
	float: left;
	border: 2px #c00 solid;
	margin-right: 16px;
	font-size: 0;
	line-height: 0;
	padding: 2px;
}
#ipad-button {
	float: left;
	border: 2px #bbb dashed;
	margin-left: 16px;
	font-size: 0;
	line-height: 0;
	padding: 2px;
}


#iphone {
	line-height: 0;
	font-size: 0;
}
#iphone img {	
	float: left;
}


#ipad {	
	line-height: 0;
	font-size: 0;
}
#ipad img {	
	float: left;
}
#ipad {	
	width: 436px;
}
#ipad .itemsbrowser {
	width: 384px; /* oppure imposto i pixel */
}



/* @group Section base style */

.section {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color:  #000;
}

/* @group Headers */

.section h1 {
	font-family: "Trebuchet MS", Geneva, Arial, Helvetica, SunSans-Regular, sans-serif;
	font-size: 20px;
	color: #000;
	font-weight: bold;
	margin-bottom: 10px;
}

.section h2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #cc0000;
	font-weight: bold;
	text-decoration: none;
	padding-top: 0px; /* cosi spezza il passo dei paragrafi */
	border-bottom: 1px #ccc solid;
	margin-bottom: 6px;
}

/* @end */

/* @group Paragraph */
.section p, .section p.text-normal {
	line-height: 15px;
	font-size: 12px;
	/* margin-top1: 4px; /* questo fa si che si crei uno spazio fra due div sovrapposti che contengono p -> non va bene */
	/* border-top1: 4px transparent solid; /* il transparent non è supportato su IE pre 7 e diventa nero */
	/* rimane solo il padding ma il top altera il punto elenco che devo eventualmente adeguare se non lo metto a 0 */
	padding-top: 0px;
	padding-bottom: 8px;

}
.section p.text-extrasmall {
	font-size: 10px;
	line-height: 12px;
}
.section p.text-small {
	font-size: 11px;
	line-height: 14px;
}
.section p.text-large {
	font-size: 13px;
	line-height: 16px;
}
.section p.text-extralarge {
	font-size: 14px;
	line-height: 18px;
}

/* @end */

/* @group List */
.section ul {
	font-size: 12px;;
}
.section li {
	color: #000;
	padding-left: 18px;
	margin-top: 0px;
	margin-bottom: 2px;
	background: url('../immagini/punto_elenco.gif') no-repeat;
}
/* @end */

/* @group Link */
.section a {
	color: #b82507;
	text-decoration: none;
}
.section a:hover {
	text-decoration: underline;
}
/* @end */

/* @group Tables */

.section table {
	border: 1px #ccc solid;
}
.section table th {
	background: url('../immagini/bg_gray_fade.gif');
	text-align: center;
	font-weight: bold;
	height: 20px;
	font-size: 11px;
}
.section table td {
	padding: 4px;
	border: 1px #ccc solid;
}

/* @end */


/* @group Images */
.section img.default,
.section img.img-sx-up, 
.section img.img-sx,
.section img.img-sx-down,
.section img.img-dx-up,
.section img.img-dx,
.section img.img-dx-down {
	border:  0;
	padding: 0px;
	margin: 8px;
}

.section img.img-sx-up {
	margin-left: 0px;
	margin-top: 0px;
	float: left;
}
.section img.img-sx {
	margin-left: 0px;
	float: left;
}
.section img.img-sx-down {
	margin-left: 0px;
	margin-bottom: 0px;
	float: left;
}
.section img.img-dx-up {
	margin-right: 0px;
	margin-top: 0px;
	float: right;
}
.section img.img-dx {
	margin-right: 0px;
	float: right;
}
.section img.img-dx-down {
	margin-right: 0px;
	margin-bottom: 0px;
	float: right;
}

/* @end */

/* @end */

/* @group Global Alignment */

.align-center {text-align: center}
.align-left {text-align: left}
.align-right {text-align: right}
.align-justify {text-align: justify}

/* @end */

/* @group Global Indentation */

.indent-firstline {text-indent: 16px }
.indent-all { padding-left: 20px }
.indent-bullet { background-image: url('../immagini/punto_elenco.gif'); background-repeat: no-repeat; }

/* @end */


