html{
	background:url(img/bg-html.jpg) top center no-repeat;
}

#main{
	width:980px;
	margin:0px auto;
	overflow: hidden;
}

#page{
	width:980px;
	margin:0px auto;
	overflow: hidden;
	background: transparent;
}

.menu-separator{
	height:38px;
}

/*Typography*/
body{font-family: din_alternateregular; font-size: 11pt;}
.highlight{ color: #861b2a; }
.right{text-align:right}

/* Grid */

.row{
	display:block;
	overflow:hidden;
	height:auto;
	clear:both;
	background: transparent;
}

.span1{background: transparent; overflow: hidden; width:140px; float:left;}
.span2{background: transparent; overflow: hidden; width:280px; float:left;}
.span3{background: transparent; overflow: hidden; width:420px; float:left;}
.span4{background: transparent; overflow: hidden; width:560px; float:left;}
.span5{background: transparent; overflow: hidden; width:700px; float:left;}
.span6{background: transparent; overflow: hidden; width:840px; float:left;}
.span7{background: transparent; overflow: hidden; width:980px; float:left;}

.mid-size{overflow: hidden; width:50%; float:left;}


/* Backgrounds */
.row.with-columns{
	background: #e4e4e4;
}
.response-content{
	overflow:hidden;
	background: #fff;
	min-height: 726px;
}

.column-overlay{
	/*position:absolute;*/  position:relative;
	background: transparent url(img/bg-page-museo.png) top left no-repeat;
	width:290px;
	min-height:726px;
	z-index: 30;
}
	
.shadow {
	-moz-box-shadow: 0px 0px 8px #000000;
	-webkit-box-shadow: 0px 0px 8px #000000;
	box-shadow: 0px 0px 8px #000000;
	/* For IE 8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=90, Color='#000000')";
	/* For IE 5.5 - 7 */
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=90, Color='#000000');
}



/* Header */
#header {
	clear:left;
	width: 980px;
	height: 120px;
	position: relative;
	/*background:url(img/header.jpg) top left;*/
}

/* Header Slideshow Temp */
#header-home {
	position: relative;
	clear:left;
	width: 980px;
	height: 346px;
}

#logo{
	position: absolute;
	top: 15px;
	left: 26px;
	width: 230px;
	height:88px;
	
	z-index:20;
}

#logo h1{
	display:none;
}

#header #logo{
	background: url('img/museo_diocesano_milano_logo_red.png') no-repeat;
}

#header-home #logo{
	background: url('img/museo_diocesano_milano_logo.png') no-repeat;
}

div#slideshow {
	position: absolute;
	top: 0;	
	width: 980px; 
	height: 346px;
	overflow: hidden;
}
div#slideshow .slides{
	position: relative;

}
#header-home #slideshow .info{
	position: absolute;
	bottom: 70px;
	right: 50px;
	width: 300px;
	height: 170px;
	z-index: 10;
	
	padding:10px;
	
	background: #861b2a;
	opacity:0.8;
	filter:alpha(opacity=80); /* For IE8 and earlier */

}

#header-home #slideshow .info .title,
#header-home #slideshow .info .subtitle,
#header-home #slideshow .info .excerpt{
	position: relative;
	display:block;
	color:#fff;
}

#header-home #slideshow .info .title{
	font-size:18pt;
	line-height: 14pt;
	text-transform:uppercase;
	top:20px;
	left:16px;
}

#header-home #slideshow .info .subtitle{
	/*margin:20px 0;*/
	font-size:14pt;
	line-height: 12pt;
	top:45px;
	left:16px;
}

#header-home #slideshow .info .excerpt{
	font-size:11pt;
	top:80px;
	left:16px;
}

/* /.Header Slideshow Temp */

#social {
	position: absolute;
	top: 0;
	right:0;
	z-index: 10;
}

#social a {
	display:block;
	float:left;
	width:35px;
	height:35px;
	background:url(img/social.png) top left;}
	
#social a:hover { 
	background-position:-35px 0; 
}
#social a:active { 
	background-position:-70px 0; 
}

.extra-header{
	background: url(img/bg-extra-title.png) no-repeat;
	height:152px;
}

.row-header h3.title,
.extra-header h3.title{
	margin:0 0 0 15px;
	padding-top: 40px;
	font-family: 'din_alternateregular';
	text-transform: uppercase;
	color: #fff;
	font-size:10pt;
}

.extra-info{
	margin:10px;
}



/* texts layout */
.single-content{
	margin:10px 8px 24px 8px;
}

/* texts layout */
.single-content p{
	margin:10px 0;
}


.extra-content{
	margin:8px;
}

#home-editoriale .signature{
	margin-top: 20px;
	font-style: italic;
}

a{
	color:#861b2a;
	text-decoration: none;
}

.single-content .title{
	font-size:18pt;
	font-weight:normal;
	display:block;
	color:#861b2a;
	margin:18px 0 24px 0;
}

h3{
	font-size:12pt;
	font-weight:normal;
	display:block;
	color:#861b2a;
	margin:4px 0;
}

.header{
	width:100%;
	margin:10px 0 20px 10px;
	overflow: hidden;
}

.header-overlay{
	position:absolute;
	background: transparent url(img/bg-page-museo.png) top left no-repeat;
	padding:10px 0 20px 15px;
	width:290px;
	height:140px;
	z-index: 30;
}

.header h3,
.header-overlay h3{
	margin-top: 25px;
	color:#323232;
	text-transform: uppercase;
	font-size:14px;
}


.header-overlay .title{
	display:block;
	margin-top: 55px;
	color:#861b2a;
	font-size: 14pt;
}



/* visual sub-menu item */

.home-exhibition-item{
	position:relative;
	height:280px;
	color:#fff;
}
.home-exhibition-item .info{
	position:absolute;
	top:130px;
	left:140px;
	width:140px;
	height:151px;
	background: url(img/bg-home-exhibition-item.png) no-repeat;
	z-index:10;
}

.home-exhibition-item  .info .title{
	position:absolute;
	display: block;
	margin:0 12px;
	top: 42px;
	text-transform:uppercase;
}

.home-exhibition-item .info .date{
	position:absolute;
	display: block;
	left:12px;
	bottom: 20px;	
}

#home-editorial .header{
	background:url(img/bg-editorial.png) top left no-repeat;
}

#single-news .header{
	background:url(img/bg-news.png) top left no-repeat;
}

#home-editorial .single-content .title{
	color:#000000;
	margin-top: 0;
	margin-bottom: 10px;
	padding-bottom:40px;
	background:url(img/cite-editorial-0.png) bottom left no-repeat;	
}

.signature {
	float:right;
	margin:0px 0;
	padding-bottom:20px;
	background:url(img/cite-editorial-1.png) bottom right no-repeat;
}

.signature p{
	font-style: italic;
}


.news-item{ display:block; height:140px; }
.news-item .info{
	height:140px;
	background: url(img/bg-news-item.png) -10px 0 no-repeat;
	color:#323232;
	position:relative;
}
.news-item .span1{height:140px}
.news-item:hover .info,
.news-item.current .info{
	color:#fff;
	background: url(img/bg-news-hover.jpg) no-repeat;
}

.news-item  .info .title{
	font-size:11pt;
	position:absolute;
	display: block;
	margin:0 12px;
	top: 60px;
	text-transform:uppercase;
}

.news-item .info .date{
	position:absolute;
	display: block;
	left:12px;
	top: 32px;	
}

/* Collezioni */
.header-overlay.collections{
	background: transparent url(img/bg-page-collections.png) no-repeat;
}

#banners-collections .header-overlay{
	margin-top:10px;
	background: transparent url(img/bg-banner-collections.png) no-repeat;
}
#banners-collections .header-overlay h3{
	color:#fff;
}

.link.link-collections{
	float:left;
}

.uparrowdiv, .downarrowdiv, .leftarrowdiv, .rightarrowdiv{
	width:140px;
	min-height:140px; /*min height of DIV should be set to at least 2x the width of the arrow*/
	background: #323232;
	color:white;
	position:relative;
	word-wrap:break-word;

}
.downarrowdiv:after{ /*arrow added to downarrowdiv DIV*/
	content:'';
	display:block;
	position:absolute;
	top:100%; /*should be set to 100% */
	left:60px;
	width:0;
	height:0;
	border-color: #323232 transparent transparent transparent; /*border color should be same as div div background color*/
	border-style: solid;
	border-width: 10px;
}

.rightarrowdiv:after{ /*arrow added to rightarrowdiv DIV*/
	content:'';
	display:block;
	position:absolute;
	top:60px;
	left:100%; /*should be set to 100% */
	width:0;
	height:0;
	border-color: transparent transparent transparent black; /*border color should be same as div div background color*/
	border-style: solid;
	border-width: 10px;
}

.link-collections .downarrowdiv{
	background: #ededed url(img/bg-item-collections.png) no-repeat;
}
.link-collections .downarrowdiv:after{
	border-color: #ededed transparent transparent transparent;
}
.link-collections .title{
	font-size: 9pt;
	text-transform:uppercase;
	position:absolute;
	top:40px;
	left:12px;
	color:#323232;
}

.info.rightarrowdiv{
	position: absolute;
	z-index:20;
	background: #323232 url(img/bg-menu-title-collections.png) no-repeat;
}
.info.rightarrowdiv:after{
	border-color: transparent transparent transparent #323232;
}

.info.rightarrowdiv .title{
	left:16px;
}

.info .title{
	font-size: 10pt;
	text-transform:uppercase;
	position:absolute;
	top:40px;
	/*left:16px;*/
}


/* Attività*/
.calendar-item{height:140px;}
.calendar-item .info{
	height:140px;
	background: url(img/bg-calendar-item.png) no-repeat;
	color:#323232;
	position:relative;
}
.calendar-item .span1{height:140px}
.calendar-item:hover .info,
.calendar-item.current .info{
	color:#fff;
	background: url(img/bg-calendar-item.png) 0 -141px no-repeat;
}

.calendar-item .info .title{
	position:absolute;
	display: block;
	margin:0 24px;
	top: 40px;
	text-transform:uppercase;
}

.calendar-item .info .date{
	position:absolute;
	display: block;
	left:24px;
	bottom: 30px;	
}

#extra-mostre p{
	font-size:10pt;
	margin:5px 8px;
}

.page-mostre-exhibition-item{
	position:relative;
}
.page-mostre-exhibition-item .header{
	width: 278px;
	height: 154px;
	position:absolute;
	background: url(img/bg-page-mostre-exhibition-item.png) no-repeat 0 -156px;
	z-index:10;
	color:#fff;
	overflow: hidden;
}
.page-mostre-exhibition-item .image{
	overflow: hidden;
}
.page-mostre-exhibition-item .image img{
	overflow: hidden;
	margin-top:140px;
}

.page-mostre-exhibition-item .header{
	margin:0;
}

.page-mostre-exhibition-item .header .title{
	position:absolute;
	display: block;
	left:24px;
	top: 20px;
	font-size:21px;
}
.page-mostre-exhibition-item .header .date{
	position:absolute;
	display: block;
	left:24px;
	bottom: 30px;
}

/* .publications-item */

.publications-item{
	position:relative;
}
.publications-item .header{
	width: 140px;
	height: 125px;
	position:absolute;
	background: url(img/bg-140-publications-item-alt.png) no-repeat top center;
	z-index:10;
	color:#fff;
	margin:0;
	overflow: hidden;
}

.publications-item .header.alternate{
	background: url(img/bg-140-publications-item.png) no-repeat top center;
}


.publications-item .header .title{
	position:absolute;
	display: block;
	left:8px;
	top: 8px;
	width:124px;
	font-size:10pt;
	text-transform: uppercase;
	color:#861b2a;
}
.publications-item .header .authors{
	position:absolute;
	display: block;
	left:8px;
	bottom: 16px;
	width:124px;
	font-size:8pt;
	text-transform: uppercase;
	color:#323232;
}

.publications-item .image{
	overflow: hidden;
}
.publications-item .image img{
	overflow: hidden;
	margin-top:115px;
}
.publications-item .info {
	text-align: center;
	font-size:10pt;
	margin: 15px 5px 20px 5px;
	padding:10px 0;
	border: solid #861b2a;
	border-width:1px 0;
	
}

.publications-item .info a{
	color:#861b2a;
}

/* menu-publications */

#nav-publications-pre{
	float:left;
	font-size:8pt;
	margin-left:5px;
}
#menu-publications{float:left;}

#nav-publications li a{
	padding-top:0;
	padding-bottom:5px;
	font-size:8pt;
	background: transparent url("img/bg-item-small.png") no-repeat;
	background-position: right top;
}



/* /.publications-item */

#single-publication .content{
	margin:8px;
	background: #fff;
}

#single-publication .title{
	text-transform: uppercase;
	color:#861b2a;
	margin:10px 0 0 0;
}

#single-publication .authors{
	text-transform: uppercase;
	color: #323232;
	display:block;
	margin-bottom:20px;
	font-size: 10pt;
}

#single-publication .editor{
	text-transform: uppercase;
	font-size: 10pt;
}

#single-publication .description{
	margin-top:20px;
	display:block;
	font-size: 10pt;
}

#single-publication .status{
	display:block;
	text-transform: uppercase;
}

#single-publication .link a{
	display: block;
	color:#861b2a;
}


/* Visitare il museo */
.row-header{
	background: #ededed url(img/bg-visitare-il-museo-orari.png) no-repeat;
	overflow: hidden;
}

.row-header a{
	color:#fff;
}

.header.visitare-il-museo{
	margin-top: 38px;
	margin-bottom: 5px;
}

.header h1{
	font-weight: normal;
	text-transform: uppercase;
	font-size: 10pt;
}

h3.page-title{
	color: #861b2a;
	font-size:18pt;
	margin: 0 0 40px 10px;
}

/* Sostenitori */
.row.sostenitori{
	background: #fff url(img/bg-menu-main.png) top left repeat-x;
	padding:40px 0 20px;
	min-height: 140px;
	overflow: hidden;
}
.row.sostenitori.last-year{
	background: #fff;
	padding:5px 0 0;
}

.row.sostenitori .header-overlay{
	background: url(img/bg-header-sostenitori.png) top left no-repeat;
	width:160px;
	height:140px;
	padding:0;
}

.row.sostenitori.last-year .header-overlay{
	background: url(img/bg-header-sostenitori-span2.png) top left no-repeat;
	width:290px;
}

.row.sostenitori .header-overlay h2{
	position:absolute;
	text-transform: uppercase;
	font-size:10pt;
	color:#861b2a;
	font-weight:normal;
	top:26px;
	left:18px;
}

.row.sostenitori.last-year .header-overlay h2{
	top:38px;
}

.row.sostenitori .header-overlay span{
	display:block;
	position:absolute;
	margin:8px 0 0;
	left:18px;
	font-size:10pt;
}
.row.sostenitori .header-overlay span.location{
	color:#323232;
	top:64px;
}
.row.sostenitori .header-overlay span.dates{
	color:#000;
	bottom: 18px;
}



.row.sostenitori .span2 ul{
	margin:10px;
	font-size:9.5pt;
}

.row.sostenitori.last-year .span5 .span1{
	text-align: center;
	min-height:145px;
	font-size:9pt;
}
.row.sostenitori.last-year .span5 .span1 img{
	width:106px;
	height:106px;
}
.row.sostenitori.last-year .span5 .span1 span.name{
	display:block;
	height:30px;
	margin:0 4px;
	border-bottom: 1px solid #861b2a;
}

#orari-biglietti .info{
	overflow: hidden;
	background: #ededed url(img/bg-span-separator.png) repeat-y;
	height:234px;
}

#orari-biglietti h4{
	text-transform: uppercase;
	color: #861b2a;
	font-weight: normal;
	margin:10px 0 10px 0;
	font-size: 10pt;
	
}
#info-museo .box{
	margin: 0 0 0 28px;
}

.row-header .box p,
#orari-biglietti .box p{
	margin-bottom:20px;
}

#orari-biglietti .box{
	margin: 28px 0 0 28px;
}

#extra-orari{
	font-size:9pt;
}

#extra-orari h4{
	font-size:10pt;
	margin:2px 0 2px 0;
}
.box #extra-orari p{
	margin:2px 0 10px 0;
}


#come-raggiungerci{
	margin-bottom: 38px;
}

#come-raggiungerci p{
	font-size: 10pt;
	margin:5px;
	margin-top: 10px;
	padding-bottom: 10px;
	border-bottom: 1px solid #861b2a;
}

#come-raggiungerci .highlight{
	text-transform: uppercase;
}

/* FETCH FEED */

#home-social a{
	display: block;
	width:140px;
	height:138px;
	overflow: hidden;
	color:#fff;
	/*background: #323232 url(img/bg-social-tw.jpg) no-repeat;*/
	border-bottom: 2px solid #111;
}

#home-social a.social-tweet{
	background: #323232 url(img/bg-social-tw.jpg) no-repeat;
}
#home-social a.social-facebook{
	background: #323232 url(img/bg-social-fb.jpg) no-repeat;
}

#home-social a span.date{
	font-size:9pt;
	margin:35px 12px 20px;
	display:block;
}
#home-social a span.title{
	font-size:10pt;
	margin:20px 12px;
	display:block;
}

/* Footer */
#footer{
	clear:left;
	overflow: hidden;
	/*height:138px;*/
	color:#fff;
	background: #323232;
	font-size: 10pt;
	border-top:2px solid #861b2a;
/*	position:fixed;
	bottom:0;
	width:980px;
	z-index:100;*/
}

#footer .row{
	margin: 0 auto;
	width:980px;
	background: #323232 url(img/footer.jpg) no-repeat;
}

#footer #info{
	margin:28px 0 0 144px;
}

#footer #info p{
	margin-bottom:10px;
}

#footer #info a{
	color:#fff;
}


#footer #menu-area{
	margin:3px 0 0 0;
	background: url(img/divider-footer.png) repeat-y;
	overflow: hidden;
	height:220px;
}

#footer #newsletter-area{
	margin:3px 0 0 0;
	background: url(img/divider-footer.png) repeat-y;
	overflow: hidden;
	height:220px;
}

#footer #menu-area .mid-size{
	width:180px;
	margin:25px 0 0 30px;
}

#footer #menu-area .footer-menu{
	margin:18px 0 25px 0;
}

#footer #credits{
	background:#861b2a;
	color:#fff;
	overflow:hidden;
}

#footer #credits a{
	color:#fff;
}

#footer #credits span.text{
	display:block;
	margin:10px 20px;
}

#footer #newsletter-area .box{
	margin: 25px 8px 0 12px;
	
}

#footer #newsletter-area p{
	margin-top: 8px;
	font-size: 10pt;
	border: 1px #861b2a;
	border-style: solid none solid;
}

#footer #newsletter-area a#newsletter{
	display: block;
	background: #861b2a;
	color:#fff;
	text-align:center;
	margin:8px 0;
	padding:8px 0;
}

#footer .highlight{
	color:#6e6e6e;
}

#footer #newsletter-area a#eni-link{
	color:#fff;
}

#footer #thanks-to-eni{
	width:124px; 
	height:52px;
	margin-top: 35px;
	/*background:transparent url('img/thanks-to-eni.png') no-repeat; */
	background:transparent url('img/eni_footer.jpg') no-repeat; 
}


/**
	Column Gallery
	*/
.gallery-thumbnail.aspectcorrect{
	overflow: hidden;
	position: relative;
	width: 140px;
	height: 140px;
	float:left;		
}
.gallery-thumbnail.aspectcorrect > img
{
		position: absolute;
}
.gallery-thumbnail.aspectcorrect .plus
{
	position: absolute;
	z-index: 10;
	width:35px;
	height:35px;
	bottom:0;
	right:0;
	background: #861b2a;
	text-align: center;
}
.gallery-thumbnail.aspectcorrect .plus .text
{
	font-size:23pt;
	color:#fff;
}

/**
	Pagine a tre colonne
*/
	
.col-left{
	background: transparent;
	position:relative;
	height:auto;
	/*height:726px;*/
}

	div.col-left div.header span.title{
		font-size:18pt;
		color:#861b2a;
		display:block;
		margin-top: 20px;
	}

	.col-left .pagination{
		width:100%;
		overflow: hidden;
		position: absolute;
		/*position:relative;*/
		overflow: hidden;
		bottom: 0;
		border-top: 2px solid #861b2a;
	}
	
	.pagination{
		width:100%;
		overflow: hidden;
		border-top: 2px solid #861b2a;
	}

	.pagination a, 
	.pagination span.current{
		display:block;
		float:left;
		padding:5px 10px;
	}

	.pagination a{
		color:#861b2a;
	}

	.pagination a:hover, 
	.pagination span.current{
		color:#fff;
		background:#861b2a;
	}
	
	/*
		Paginatore orizzontale
	*/
	
	.top-pagination{
		display:block;
		overflow: hidden;
		width:980px;
	}
	
	.top-pagination .pagination{
		float:right;
	}
	
	.top-pagination .pagination  a,
	.top-pagination .pagination span.current{
		display:block;
		float:left;
		padding:3px 8px 2px 5px;
		background:url(img/bg-item.png) right center no-repeat;
	}
	
	.top-pagination .pagination  a:hover,
	.top-pagination .pagination span.current{
		color:#861b2a;
	}
	
	
/* User Menu */
#user-menu{
	position:absolute;
	right:0;
	top:34px;
	font-size: 10pt;
}
#user-menu span#username{
	color:#861b2a;
}

/* Search Box */
#search-box{
	background: url(img/ricerca-box.png) no-repeat;
	height:140px;
	position: relative;
}

#quick-search-form{
	position: absolute;
	top:70px;
	left:15px;
	padding:0;
}

#search-text{
	width:100px;
}

#search-button{
	background: url(img/ricerca-button.png) no-repeat;
	width:22px;
	height:22px;
	text-indent: -999px;
}