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

html{
	 font-size: 100%; 
} 

body{
	font-size =1em                  /*    16px / 16px  = 1em              */
	line-height:1.125em;            /*    18px  / 16px = 1.125em    */
	font-family: georgia, serif;
	text-align: center;
	color: #444;
	/* background: #e6e6e6; */
	background:#FFF;
	padding: 0;
	margin: 0;
}

a:link {
	text-decoration: none;
	font-size =1em                  /*    16px / 16px  = 1em              */
	line-height:1.125em;            /*    18px  / 16px = 1.125em    */
	font-family: georgia, serif;
	text-align: center;
	color: #444;
}
a:visited {
	text-decoration: none;
	font-size =1em                  /*    16px / 16px  = 1em              */
	line-height:1.125em;            /*    18px  / 16px = 1.125em    */
	font-family: georgia, serif;
	text-align: center;
	color: #444;
}
a:hover {
	text-decoration: none;
	font-size =1em                  /*    16px / 16px  = 1em              */
	line-height:1.125em;            /*    18px  / 16px = 1.125em    */
	font-family: georgia, serif;
	text-align: center;
	color: #444;
}
a:active {
	text-decoration: none;
	font-size =1em                  /*    16px / 16px  = 1em              */
	line-height:1.125em;            /*    18px  / 16px = 1.125em    */
	font-family: georgia, serif;
	text-align: center;
	color: #444;
}

/*  consideriamo 1em paria  16PX (testo)
quindi
1em = 16px. Quindi, 1px = 1 ÷ 16 = 0.0625em.
Quindi moltiplichiamo per N per ottenere gli em necessari alle dimensioni del nostro contenitore:
0.0625em × N = 46.25em
*/



#sx {
	width:80%;
	float:left;
}
#dx {
	width:20%;
	float:right;
	
}


h1 {
font-size: 1.125em; /* 18px */
font-weight:normal;
color: #3c3d3d;
margin:0;}

h1 a {
color: #3c3d3d;
font: bold 1.125em Calibri,Optima, Arial, sans-serif; /* 18px*/
letter-spacing: 0.15em;
text-trasform: uppercase;
text-decoration:none;
}

p {
font-size: 1em; /*16px */
color: #000;
font-weight:normal;
}

p a {
color: #3c3d3d;
font: bold 1.1875em Calibri,Optima, Arial, sans-serif; /* 19px*/
letter-spacing: 0.15em;
text-decoration:none;
}
p a:hover {
text-decoration:overline underline;
}



#titolo {
	width:100%;
	background-color:#FFF;
	color:#006;
}
.testotitolo {
		font-size:2.5em;		
}
.minitit {
	font-size: 18px;
}

#contenitore {
	margin-left:auto;
	margin-right:auto;
	max-width:60em;              /*    960px / 16px  = 60em     */
	border:#000 1px solid;
	height:100%;
	max-height:100%;
	/* [disabled]height:90%; */
}

#sx {
	width:20%;
	float:left;
	min-width:150px;
	display:block;
}
#centro {
	width:60%;
	float:left;
	min-width: 150px;
	text-align: center; /* !importante x allineamento libri **/
	display:block;
}
#dx {
	width:20%;
	float:left;
	display:block;
}

#contmennu {
	width:100%;
	border-top:#F30 2px double;
	float:left;
	margin-bottom:10px;
}
#titolirub {
	width:100%;
	font-family:Arial, Helvetica, sans-serif;
	font-size:1em;
	font-weight:bolder;
	background-color:#006;
	color:#FFFFFF;
	text-transform:uppercase;
}
#menu {
	width:85%;
	font-family:Arial, Helvetica, sans-serif;
	font-size:1em;
	color:#000066;
	font-weight:bold;
	float:left;
	text-align:left;
	padding-left:20px;
	margin-bottom:2px;
	background-image:url(../img/FRECCIAGIU.gif);
	background-repeat:no-repeat;
}
#menu a:link,a:visited,a:hover {
	color: #000066;
	text-decoration:none;
}
#menu a:hover {
	color: #F00;
	text-decoration:none;
}
#tu {
	width:100%;
	font-family:"Times New Roman", Times, serif;
	font-size:16px;
	font-weight:bolder;
	background-color:#F00;
	color:#FFFFFF;
	text-transform:uppercase;
}

#libri {
	width:144px;
	height:200px;
	border:#000 1px solid;
	text-align:center;
	padding:2px 2px 2px 2px;
	margin:5px auto;
	display:inline-block;
}
.libri {
	width:144px;
	height:200px;
}
#titolodx {
	width:100%;
	font-family:Arial, Helvetica, sans-serif;
	font-size:16px;
	font-weight:bolder;
	background-color:#006;
	color:#FFFFFF;
	text-transform:uppercase;
}

#sponsors {
	width:100%;
	float:left;
	border:#000 1px solid;
	margin-bottom:5px;
}

#sponsors {
	width:100%;
	float:left;
	border:#000 1px solid;
	margin-bottom:5px;
}

@-moz-keyframes blink {20%{opacity:1;} 50%{opacity:0;} 60%{opacity:1;}} /* Firefox */
@-webkit-keyframes blink {20%{opacity:1;} 50%{opacity:0;} 60%{opacity:1;}} /* Webkit */
@-ms-keyframes blink {20%{opacity:1;} 50%{opacity:0;} 60%{opacity:1;}} /* IE */
@keyframes blink {20%{opacity:1;} 50%{opacity:0;} 60%{opacity:1;}} /* Opera and prob css3 final iteration */
.npax {
border:0px solid #000;
-moz-transition:all 0.30s ease-in-out;
-webkit-transition:all 0.30s ease-in-out;
-o-transition:all 0.30s ease-in-out;
-ms-transition:all 0.30s ease-in-out;
transition:all 0.30s ease-in-out;
/* order: name, direction, duration, iteration-count, timing-function */  
-moz-animation:blink normal 2s infinite ease-in-out; /* Firefox */
-webkit-animation:blink normal 2s infinite ease-in-out; /* Webkit */
-ms-animation:blink normal 2s infinite ease-in-out; /* IE */
animation:blink normal 2s infinite ease-in-out; /* Opera and prob css3 final iteration */
}

@media only screen and (max-width:800px)  {
	
#dx {
	width:20%;
	float:left;
	display:none;
}
#centro {
	width:75%;
	float:left;
	min-width: 150px;
	text-align: center; /* !importante x allineamento libri **/
	display:block;
}

@media only screen and (min-width: 300px) and (max-width: 500px)    {
	
#dx {
	width:90%;
	float:left;
	display:block;
}

#sx {
	width:100%;
	float:left;
	min-width:150px;
	display:block;
}
#centro {
	width:90%;
	float:left;
	min-width: 150px;
	text-align: center; /* !importante x allineamento libri **/
	display:block;
}
#menu {
	width:99%;
	font-family:Arial, Helvetica, sans-serif;
	font-size:1em;
	color:#000066;
	font-weight:bold;
	float:left;
	text-align:center;
	padding-left:30px;
	margin-bottom:2px;
	background-image:none;
	background-repeat:no-repeat;
}
#titolirub {
	width:100%;
	font-family:Arial, Helvetica, sans-serif;
	font-size:1em;
	font-weight:bolder;
	background-color:#006;
	color:#FFFFFF;
	text-transform:uppercase;
}