/* foglio di stile per il sito cattedrale.reggiocalabria.it */

/* annullo gli stili predefiniti */
html, body, table, tr, td, div, h1, h2, h3, h4, h5, h6, p, ul, ol, form, fieldset, img {margin:0; padding:0; border:0;}

/* stili della struttura principale della pagina */
html, body {
	text-align:center;
	width:100%;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
}

body {
	background: url(../img/bkg-body.jpg) 0 0 repeat-x;
	background-color:#066afe;
}

div#container {
	width:990px;
	border:0px solid #000;
	text-align:left;
	margin:0 auto;
	background-color:#fff;
}

div#top {
	width:990px;
	height:20px;
	border:0px solid #000;
	background-color:#03c;
}

div#logo {
	width:990px;
	height:144px;
	border:0px solid #000;
	background: url(../img/bkg-logo.jpg) 0 0 repeat-x;
}

	div#logo img {
		vertical-align:middle;
	}

	div#logo a {
		margin: 0;
	}

	div#logo a.logo {
		margin: 0;
	}

div#menu {
	height:35px;
	padding:4px 0 0 0;
	text-align:center;
	background: url(../img/bkg-menu.jpg) 0 23px repeat-x;
}

	div#menu ul {
		list-style-type: none;
	}
	
	div#menu ul li {
		display:inline;
		text-transform:uppercase;
		color:#ccc;
	}

	div#menu ul li a {
		text-decoration:none;
		color:#669;
		font-weight:bold;
		margin: 0 5px;
	}
	
	div#menu ul li a:hover {
		text-decoration:none;
		color:#ccf;
	}

	div#primopiano {float:left; margin: 0 5px 0 5px; text-align:center; width:390px; height:380px; background: url(../img/bkg-titolo-sezione.jpg) 0 0 repeat-x; background-color:#d9dbea;}
		div#primopiano h2 {padding:2px 0 0 60px; text-align:left; font-family:arial; font-size:18px; font-weight:normal; letter-spacing: -1px; text-transform:uppercase; color:#fff; background: url(../img/logo-titolo-sezione.jpg) 0 0 no-repeat;}
		/*div#primopiano .tabs-nav li {display:inline; margin:0; padding:0; vertical-align:top;}	*/
		div#primopiano .tabs-nav li {display:inline; margin:0; padding:0; vertical-align:baseline;}

		div#primopiano .tabs-nav img {padding:4px 4px 13px 4px; background: url(../img/under_thumb_gray.gif) 4px 74px no-repeat; background-color:#d9dbea; border:0px solid #f00;}
		div#primopiano .tabs-nav img:hover {padding:4px 4px 13px 4px; background: url(../img/under_thumb_white.gif) 4px 74px no-repeat; border:0px solid #ff0;}
		div#primopiano li.tabs-selected img {padding:4px 4px 13px 4px; background: url(../img/under_thumb_yellow.gif) 4px 74px no-repeat; background-color:#b2d1ff; border:0px solid #ff0;}
		div#primopiano li.tabs-selected img:hover {padding:4px 4px 13px 4px; background: url(../img/under_thumb_yellow.gif) 4px 74px no-repeat; background-color:#b2d1ff; border:0px solid #ff0;}

		div#primopiano div span{border:0px solid #f00; position:absolute;bottom:0; left:0; width: 380px;padding: 3px 0; background: url(../img/opacity.png) repeat-x 0 -100px; cursor: pointer;text-align: center;}
		div#primopiano div img{border:0px solid #f00; display:block}
		/*div#primopiano div {margin:0; padding:5px 0 5px 0; background-color:#b2d1ff;}*/
		div#primopiano div {position:relative; float:left; margin:0; padding:5px; border: 0px solid #999; background-color:#b2d1ff;}
		div#primopiano div a{position: relative; float: left; display:block; color: #FFF; text-decoration: none}
		div#primopiano  div a:hover span{background-position: 0 -150px}

		
@media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */
    .tabs-hide {
        display: none;
    }
}

/* Hide useless elements in print layouts... */
@media print {
    .tabs-nav {
        display: none;
    }
}

	

	div#evidenza {float:left; margin:0 5px 0 0; width: 145px; height:380px; background: url(../img/bkg-titolo-sezione.jpg) 0 0 repeat-x; background-color:#b2d1ff;}
		div#evidenza h2 {padding:2px 0 0 5px; font-family:arial; font-size:18px; font-weight:normal; letter-spacing: -1px; text-transform:uppercase; color:#fff;}
		div#evidenza div {height:54px; padding:5px 0 0 0; border-bottom:1px solid #eee;}
		div#evidenza div.no-border {border:0px solid #eee;}
		div#evidenza h3 {text-align:center; font-family:verdana; font-size:13px; font-weight:bold; color:#669;}
		div#evidenza h3 a {color:#669; text-decoration:none;}
		div#evidenza p {margin:0; text-align:center; font-family:verdana; font-family:arial; font-size:12px; font-weight:normal; color:#669;}
		div#evidenza p a {color:#669; text-decoration:none;}
		

	div#video {float:left; margin: 0; width: 435px; height:380px; background: url(../img/bkg-titolo-sezione.jpg) 0 0 repeat-x; background-color:#b2d1ff;}
		div#video h2 {padding:2px 0 0 60px; font-family:arial; font-size:18px; font-weight:normal; letter-spacing: -1px; text-transform:uppercase; color:#fff; background: url(../img/logo-titolo-sezione.jpg) 0 0 no-repeat;}
		div#video p {text-align:center; margin:5px 0 0 0;}

	div#home-news {float:left; margin:5px; width: 470px; min-height:290px; background: url(../img/bkg-titolo-sezione.jpg) 0 0 repeat-x; background-color:#d9dbea;}
		div#home-news h2 {padding:2px 0 0 60px; font-family:arial; font-size:18px; font-weight:normal; letter-spacing: -1px; text-transform:uppercase; color:#fff; background: url(../img/logo-titolo-sezione.jpg) 0 0 no-repeat;}
		
		div#home-news div.news {float:left; margin:4px 0 6px 4px; border:0px solid #000; width:226px; height:75px; overflow:auto;}
		div#home-news div.news img {float:left; margin:2px 3px 2px 2px; padding:1px; border:1px solid #669;}
		div#home-news div.news span.data {color:#903; font-weight:bold;}
		div#home-news div.news span.data a {color:#903; font-weight:bold;}
		div#home-news div.news a {color:#000; text-decoration:none;}

	div#partner {float:left; margin:5px 5px 5px 0; width: 250px; min-height:290px; background: url(../img/bkg-titolo-sezione.jpg) 0 0 repeat-x; background-color:#b9bdd6;}
		div#partner h2 {padding:2px 0 0 60px; font-family:arial; font-size:18px; font-weight:normal; letter-spacing: -1px; text-transform:uppercase; color:#fff; background: url(../img/logo-titolo-sezione.jpg) 0 0 no-repeat;}
		div#partner p {text-align:center;}
		div#partner p img {margin:10px 0 5px 0;}

	div#osservatorio {float:right; margin:5px 5px 5px 0; width: 250px; min-height:290px; background: url(../img/bkg-titolo-sezione.jpg) 0 0 repeat-x; background-color:#d9dbea;}
		div#osservatorio h2 {padding:2px 0 0 60px; font-family:arial; font-size:18px; font-weight:normal; letter-spacing: -1px; text-transform:uppercase; color:#fff; background: url(../img/logo-titolo-sezione.jpg) 0 0 no-repeat;}
		
		div#osservatorio div.news {float:left; margin:4px 0 6px 4px; border:0px solid #000; width:230px; overflow:auto;}
		div#osservatorio div.news img {float:left; margin:2px 5px 2px 2px; padding:1px; border:1px solid #669;}
		div#osservatorio div.news span.data {color:#903; font-weight:bold;}
		div#osservatorio div.news span.data a {color:#903; font-weight:bold;}
		div#osservatorio div.news a {color:#000; text-decoration:none;}		

		
	div#link {float:left; margin:5px 0 5px 0; width: 220px; min-height:290px; background: url(../img/bkg-titolo-sezione.jpg) 0 0 repeat-x; background-color:#b9bdd6;}
		div#link h2 {padding:2px 0 0 60px; font-family:arial; font-size:18px; font-weight:normal; letter-spacing: -1px; text-transform:uppercase; color:#fff; background: url(../img/logo-titolo-sezione.jpg) 0 0 no-repeat;}
		div#link p {text-align:center; color:#fff; font-size:14px; font-weight:bold; line-height:200%;}
		
	div#voci {
		float:left;
		margin:9px 5px 5px 5px;
		width: 140px;
		min-height:290px;
		background-color:#cde0fe;
	}
		div#voci ul {
			list-style-type: none;
		}
		
		div#voci ul li {
			color:#ccc;
		}
		
		div#voci ul li a {
			padding:6px;
			text-align:center;
			display:block;
			text-decoration:none;
			color:#669;
			font-weight:bold;
			border-top:1px solid #fff;
			border-bottom:1px solid #ccc;
		}
		
		div#voci ul li a:hover {
			text-decoration:none;
			color:#99c;
		}
	
		div#voci p {
			text-align:center;
			margin: 10px auto;
		}
		
		div#voci p img {
			margin: 5px 0 5px 0;
		}
		
		div.sub {
			display:none;
		}
		
		div#voci div.sub ul li a {
			font-weight:normal;
			font-style:italic;
		}
		
	div#news {float:right; margin:5px; width: 250px; min-height:290px; background: url(../img/bkg-titolo-sezione.jpg) 0 0 repeat-x; background-color:#d9dbea;}
		div#news h2 {padding:2px 0 0 60px; font-family:arial; font-size:18px; font-weight:normal; letter-spacing: -1px; text-transform:uppercase; color:#fff; background: url(../img/logo-titolo-sezione.jpg) 0 0 no-repeat;}
		
		div#news div.news {float:left; margin:10px 0 10px 10px; border:0px solid #000; width:230px; overflow:auto;}
		div#news div.news img {float:left; margin:2px 5px 2px 2px; padding:1px; border:1px solid #669;}
		div#news div.news span.data {color:#903; font-weight:bold;}
		div#news div.news span.data a {color:#903; font-weight:bold;}
		div#news div.news a {color:#000; text-decoration:none;}		


	div#content {
		margin:0 270px 0 160px;
	}
	
		div#content h1 {
			margin:5px 0 0 0;
			font-size: 22px;
			color:#036;
			letter-spacing:-1px;
		}
	
		div#content h2 {
			margin:-2px 0 0 0;
			font-size: 16px;
			font-weight:normal;
			letter-spacing:1px;
			color:#036;
		}
		
		div#content p {
			margin:10px 0 10px 0;
			color: #036;
			text-align:justify;
		}
		
		div#content img.sinistra {
			float:left;
			margin: 0 10px 10px 0;
		}
	
		div#content img.destra {
			float:right;
			margin: 0 0 10px 10px;
		}
	
/* Elenco news */	
	div#content-elenco {
		margin:0 270px 0 160px;
	}
	
		div#content-elenco h1 {
			margin:5px 0 20px 0;
			font-size: 24px;
			color:#036;
		}
	
		div#content-elenco h2 a {
			margin:10px 0 0 0;
			font-size: 18px;
			font-weight:normal;
			letter-spacing:1px;
			color:#036;
			text-decoration:none;
		}
			
		div#content-elenco p.data-elenco {
			margin:0;
			color: #036;
			text-align:justify;
		}
		
		div#content-elenco p {
			margin:5px 0 10px 0;
			color: #036;
			text-align:justify;
		}
		
		div#content-elenco img.sinistra {
			float:left;
			margin: 0 10px 10px 0;
		}
	
/* fotogallery */	

#foto {border: 0px solid #f00; margin:9px 0 5px 5px; overflow:hidden; height:auto;}
	
	.immagine {
		width: 200px;
		height:180px;
		overflow:hidden;
		float:left;
		padding:2px;
		margin:0 2px 5px 0;
		border:0px solid #013f7f;
		color:#03c;
		text-align:center;
		font-family: verdana;
		text-decoration: none;
	}
	
	.immagine img {
		filter:alpha(opacity=75);
		-moz-opacity:.75;
		opacity:.75;
	}
	
	.immagine:hover img {
		filter:alpha(opacity=100);
		-moz-opacity:1;
		opacity:1;
	}
	
	.immagine img {padding: 1px; border:1px solid #03c;}
	
	#foto .immagine span.caption {border:0px solid #f00; display:block; height:45px; color:#03c; text-decoration:none; font-family: verdana;}
	#foto .immagine a {color:#03c; text-decoration:none;}
	#foto .immagine img {padding:2px; border:1px solid #03c;}
	

		#foto h1 {
			margin:0 10px 20px 10px;
			font-size: 22px;
			color:#036;
			letter-spacing:-1px;
		}

		#foto p {
			margin:0 0 10px 10px;
			color: #036;
			text-align:justify;		}
		
/* pagina errore */	
	div#content-errore {
		min-height:350px;
		margin:0 270px 0 160px;
	}
	
		div#content-errore h1 {
			margin:5px 0 20px 0;
			font-size: 24px;
			color:#036;
		}
	
		div#content-errore h2 a {
			margin:10px 0 0 0;
			font-size: 18px;
			font-weight:normal;
			letter-spacing:1px;
			color:#036;
			text-decoration:none;
		}
	
		div#content-errore p.data-elenco {
			margin:0;
			color: #036;
			text-align:justify;
		}
		
		div#content-errore p {
			margin:5px 0 10px 0;
			color: #036;
			text-align:justify;
		}
		
		div#content-errore img.sinistra {
			float:left;
			margin: 0 10px 10px 0;
		}
	
	div#footer {width:990px; height:30px; background-color:#03c; clear:both;}
		div#footer p {height:30px; line-height:30px; font-size:12px; margin:0 10px; color:#fff;}
		div#footer p a {color:#fff; text-decoration:underline;}
		div#footer img {vertical-align:middle; margin:0;}