# ----------------------------------------------------------------------
# ----------------------------------------------------------------------
# Copyright (c) 2010 Media art sas. All Rights Reserved.
# Author: Media art sas - Communication and web agency
# Website: http://www.media-art.it
# ----------------------------------------------------------------------
# ----------------------------------------------------------------------

* { margin: 0; padding: 0; }

body {
	text-align:center;
	padding: 0;
	font-family:Helvetica,Verdana,Arial,sans-serif;		
	color:#363567;
	height: 100%;
	font-size:12px;
	background:url("../images/bgBody.gif") no-repeat top center;
}

#external-container{
	min-height: 100%;
	width:100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -90px; /* the bottom margin is the negative value of the footer's height */
	position:relative;
}

#infobutton{
	width:996px;
	margin:0 auto;
	width:300px;
	color:#000000;
}

#container{
	position:relative;
	width:100%;
	margin:0px auto;
	min-height:98%;
	height:auto !important!;
	
	
}

/*----------------------------------------------*/
/* ------------- classi generiche --------------*/
/*----------------------------------------------*/

.bold{
	font-weight:bold;
}

.titoletto{
	color:#363567;
	font-weight:bold;
}

/*----------------------------------------------*/
/* ------------ formattazione link--------------*/
/*----------------------------------------------*/

a{
	font-size:11px;
	text-decoration:none;
	color:#363567;
}

a:hover{
	text-decoration:underline;
}

/*----------------------------------------------*/
/* ------------ tag h* -------------------------*/
/*----------------------------------------------*/

h1{
	font-size:24px;
	color:#363567;
	padding:0px 0px 25px 0px;
}

h2{
	font-size:18px;
	color:#363567;
	padding:0px 0px 25px 0px;
}

/*----------------------------------------------*/
/* ------------ iconcine di back ---------------*/
/*----------------------------------------------*/

.arrow{
	background:url("../images/arrow.gif") no-repeat right;	
	padding:0px 8px 0px 0px;
}

.mail{
	background:url("../images/mail.gif") no-repeat right;	
	padding:0px 20px 0px 0px;
}

.partner{
	background:url("../images/partner.gif") no-repeat right;	
	padding:0px 20px 0px 0px;
}

.preventivo{
	background:url("../images/document.gif") no-repeat right;	
	padding:0px 20px 0px 0px;
}

.facebook{
	background:url("../images/facebook_icon.jpg") no-repeat right;	
	padding:0px 20px 0px 0px;
}

.linkedin{
	background:url("../images/linkedin_icon.jpg") no-repeat right;	
	padding:0px 20px 0px 0px;
}

.bookmark{
	background:url("../images/bookmark.gif") no-repeat right;	
	padding:0px 20px 0px 0px;
}

.twitter{
	background:url("../images/twitter_icon.png") no-repeat right;	
	padding:0px 20px 0px 0px;
}

.skype{
	background:url("../images/skype_icon.jpg") no-repeat right;	
	padding:0px 20px 0px 0px;
}


/*----------------------------------------------*/
/* ------------ header -------------------------*/
/*----------------------------------------------*/

#header {
	width:100%;
	height:80px;
	text-align:left;
	clear:both;
}
	
	#headerMain{
		width:996px;
		margin:10px auto;
		clear:both;
	}
	
		#logo{
			width:230px;
			float:left;
			line-height:80px;
		}
		
		#headerinfos{
			width:766px;
			text-align:right;
			color:#000000;
			float:left;
			padding:20px 0px 0px 0px;
		}
			
			#connect{
				float:left;
				width:383px;
			}
			
			#requests{
				float:left;
				width:183px;
			}			
			
			#utils{
				float:left;
				width:183px;
			}
			
			#headerinfos ul{
				list-style:none;
				margin:0;
				padding:0;
			}

	
	
/*----------------------------------------------*/
/* ------------ menu top and bottom-------------*/
/*----------------------------------------------*/	

#fixMenuTop{
	width:100%;		
	height:37px;
	line-height:37px;
	background-color:#353467;
	margin:0px 0px 4px 0px;
	border-top:4px solid #cfd0d2;
}

#fixMenuBottom{
	width:100%;		
	height:37px;
	line-height:37px;
	background-color:#353467;
	margin:4px 0px 4px 0px;
	border-bottom:4px solid #cfd0d2;
}

#navTop{
	width:996px;
	margin:0 auto;
	text-transform:uppercase;	
}
	
	#navTop a.disabled{
		color:#cccccc;
	}
	
	#navTop a.disabled:hover{
		color:#cccccc;				
	}
	
	#navTop div.navTop{
		float:left;
		width:110px;
	}

	#navTop a{
		text-decoration:none;
		color: #FFFFFF;
		font-size:12px;
		font-weight:bold;
	}

	#navTop a.selected{			
		background-color:#fde155;
		padding:5px 10px;
		color:#353467;
	}

	#navTop a.selected:hover{
		color:#353467;				
	}

	#navTop a:hover{
		color: #FFFFFF;						
	}


/*----------------------------------------------*/
/* ------------ breadcrumbs---------------------*/
/*----------------------------------------------*/

#breadcrumbs{	
	color:#353567;
	width:996px;
	text-align:left;
	padding:0px 0px 0px 20px;
	text-transform:uppercase;
	font-weight:bold;
}
	
	#breadcrumbs p{
		padding:0;
	}
	
	#breadcrumbs a{
		font-size:11px;
		text-decoration:none;
		color:#353567;
	}


/*----------------------------------------------*/
/* --------- container parte centrale-----------*/
/*----------------------------------------------*/

div#container-wrapper{
	position:relative;
	width:100%;
}

	div#wrapper{	 	
		width:996px;		
		margin:0px auto;	
		min-height:650px;  
		height:auto !important;  
		height:650px; 
	}
	
	
	div#wrapper-content{
		margin:40px 0px 20px 0px;
		width:996px;
		text-align:left;		
		position:relative;
	}

/*----------------------------------------------*/
/* ----------------progressbar----------------- */	
/*----------------------------------------------*/

#progressHome{
	margin:0px 0px 30px 0px;
}

#progressButton{
	width:996px;
	margin-top:10px;
}

	a.progressButton{
		float:left;
		width:248px;
		text-align:center;
		color:#000000;
		font-weight:bold;
		font-size:14px;
		padding:5px 0px 0px 0px;
	}

#timers{
	text-align:left;
	font-size:11px;
	font-weight:bold;
	margin:0px 0px 0px 0px;
}

.content25,.content50,.content75,.content100{
	display:none;
}

/*----------------------------------------------*/
/* ------------ contenuto -------------*/
/*----------------------------------------------*/

#pb{
	height:30px;
}

#map{
	margin:10px 40px;
}

/* tabs */

#tabs {
	margin: 0;	
	width: 720px;
}

	#tabs ul.tabs { 
		list-style-type: none; 
		padding: 0; 
		margin: 0; 
	} 
	
		#tabs ul.tabs li { 
			float: left; 
			padding: 0; 
			margin: 0;
			background:none; 
			margin-right: 2px; 
		} 

		
			#tabs ul.tabs li a { 
				display: block; 
				padding: 5px 10px; 
				color: #2d3136; 
				text-decoration: none; 
				background:none;
			} 
			
			#tabs ul.tabs li a.selected{ 
				color: #2d3136;  
				background-color:#fde155; 
				font-weight:bold;
			}
			
			#tabs ul.tabs li a:hover { 
				color: #2d3136; 
			}

#contentfull{
	padding:20px;	
	background:#29a2bf url("../images/bgWrapperContent.jpg") repeat-y;
	color:#ffffff;	
	text-align:left;
	z-index:1;
	width:996px;
	min-height:400px;  
	height:auto !important;  
	height:400px;
	float:left;
	margin:0px 0px 20px 0px;
	position:relative;
}


#content{
	padding:20px;	
	background:#29a2bf url("../images/bgWrapperContent.jpg") repeat-y;
	color:#ffffff;	
	text-align:left;
	z-index:1;
	width:680px;
	min-height:400px;  
	height:auto !important;  
	height:400px;
	float:left;
	margin:0px 0px 0px 0px;
	position:relative;
}


/* stile testo interno pagine */
	
	#content h2,#contentfull h2{
		font-size:11px;
		color:#363568;
		padding:0;
		margin:0;
		text-transform:capitalize;
	}
	
	#content h1,#contentfull h1{
		font-size:28px;
		color:#ffffff;
		font-weight:normal;
	}
	
	#content h3{
		font-size:11px;
		color:#2d3136;
	}
	
	#content #imageContent{
		padding:10px 40px;
	}
	
		#content #imageContent img{
			border:0;			
		}
	
	#content #text{
		width:530px;
		color:#ffffff;
		font-size:11px;
		font-weight:bold;
		padding:10px 40px;
		
	}
		
		#content #text h2{
			font-size:14px;
			color:#ffffff;
			font-weight:bold;
		}
		
		#content #text p{
			padding:10px 0px;
		}
	
	/* link di dettaglio fondo pagina*/
	#content #text #details{
		margin:20px 0px 20px 0px;
		text-align:right;
	}
		
	#content #text #details a{
		font-size:11px;
		color:#fde155;
		font-weight:bold;
	}
	
	/* elenco di link in un pagina */
	#content #text #links{
		margin:20px 0px 20px 0px;
		text-align:left;
	}

	#content #text #links a{
		font-size:11px;
		color:#ffffff;
		font-weight:bold;
	}


/* PERSONE */

#people{
	width:530px;
	padding:10px 40px;
	clear:both;
}

	#people #imgPeople{
		float:left;
		width:116px;	
		margin:0px 20px 0px 0px;
	}
	
	#people #textPeople{
		float:left;	
		width:394px;
	}
	
		#people #textPeople div{
			padding:0px 0px 5px 0px;
		}
	
		.namePeople{
					
		}
		
		.ruoloPeople{
			font-style:italic;
		}


/* GUIDE */
#guida{
	clear:both;
	margin:0px 0px 10px 0px;
	padding:5px 40px;
}

#viewguida{
	margin:10px 0px 0px 0px;
}

	#viewguida a{
		font-weight:bold;
		text-decoration:underline;
	}

/* NEWS */

.news_main{
	margin:0px 0px 20px 0px;
}

/*----------------------------------------------*/
/* ------------------ promo box ----------------*/
/*----------------------------------------------*/

#promoBox{
	background:url("../images/bgPromoBox.jpg") repeat-y;
	height:250px;
	width:330px;
	border:3px solid #ffffff;
	position:absolute;
	right:0;
	top:0;
	z-index:2;
}
	
	#promoBox #textPromo{
		padding:20px;
		width:280px;
		text-align:left;				
	}
	
		#textPromo .promo{
			width:280px;
			height:220px;
			position:relative;
		}
		
		#promoBox #textPromo h2{
			font-size:20px;
			color:#363568;
			font-weight:bold;
			padding:0px 0px 5px 0px;
			font-weight:normal;
		}
		
		#promoBox #textPromo h3{
			font-size:12px;
			color:#363568;	
			padding:10px 0px 10px 0px;
			width:230px;
		}
		
		#promoBox #textPromo p{
			padding:10px 0px;
			width:210px;
		}
		
		#promoBox #textPromo #details{
			margin:20px 0px 0px 0px;
		}
		
		#promoBox #textPromo #details a{
			font-size:11px;
			color:#363568;
			font-weight:bold;
		}
		
	#angolo{
		background:url("../images/angolo.gif") no-repeat;
		width:56px;
		height:55px;
		position:absolute;
		right:0;
		top:0;
	}
	
	#promoPhoto{
		position:absolute;
		right:0;
		bottom:0;
	}

/*----------------------------------------------*/
/* ------------ links home page-------------*/
/*----------------------------------------------*/

#contentLinks{
	width:720px;
	height:100px;
	margin:0px 0px 20px 0px;	
	float:left;
	text-align:left;
}
	
	#contentLinks .contentLink{
		width:200px;
		float:left;
		padding:0px 20px;
	}
	
		.contentLink h3{
			font-weight:bold;
			color:#29a8c4;
			font-size:11px;
			margin:0;
		}
		
		.contentLink h3.down{
			margin:10px 0px 0px 0px;
		}
		
		.contentLink ul{
			list-style:none;
			margin:0;
			padding:0;
		}
		
			.contentLink ul li{
			
			}
			
				.contentLink ul li a{
					font-size:11px;
					color:#2d3136;
				}

/*----------------------------------------------*/
/* ------------- PORTFOLIO PAGINA --------------*/
/*----------------------------------------------*/

#wrapMenuTendina{
	position:absolute;
	top:0;
	left:0;
}


#portfolio{
	padding:20px 40px;
	position:relative;
}

	#portfolio #wrapImgPortfolio{
		clear:both;
		width:520px;
		margin:0px 0px 20px 0px;
	}
	
	
		#wrapImgPortfolio #imgPortfolio{
			float:left;
			width:380px;
			height:189px;
			margin:0px 10px 0px 0px;
			background-color:#ffffff;
			padding:3px;
		}
		
		#wrapThumbsPortfolio{
			float:left;
			width:100px;
		}
		
		#wrapImgPortfolio #thumbsPortfolio{
			width:45px;
			height:44px;
			background-color:#ffffff;
			padding:2px;
			margin:0px 0px 1px 0px;
		}
		
			#thumbsPortfolio img{
				width:45px;
				height:44px;
				filter: alpha(opacity=30); /* internet explorer */
				-moz-opacity: 0.3;       /* mozilla, netscape */
				opacity: 0.3;           /* fx, safari, opera */
			}
			
			#thumbsPortfolio a:hover img {
				filter: alpha(opacity=100); /* internet explorer */
				-moz-opacity: 1;       /* mozilla, netscape */
				opacity: 1;           /* fx, safari, opera */
			}
	
	#portfolio #wrapTextPortfolio{
		clear:both;
		width:520px;
		margin:0px 0px 20px 0px;
	}
	
		#portfolio #wrapTextPortfolio div{
			padding:5px 0px;
		}
	

/*----------------------------------------------*/
/* ------- MENU DI SELEZIONE PORTFOLIO ---------*/
/*----------------------------------------------*/


.slidedoormenu{
	list-style-type: none;
	margin: 0;
	padding: 0;
	width: 180px; /* width of menu (don't forget to add border with below!) */
	border-left: 8px solid #ffa1a3; /* thick left border of menu */

}

	.slidedoormenu li{
		border-bottom: 1px solid #885b5c; /* Gray border beneath each menu item */
	}

		.slidedoormenu li a{
			background: white url(../images/vstrip.gif) repeat-y left top; /* Background image positioned to the left(v) top(h) corner initially */
			font: bold 13px "Lucida Grande", "Trebuchet MS", Verdana;
			display: block;
			color: black;
			width: auto;
			border-bottom: 1px solid white; /* White border beneath each menu item link, to add depth */
			padding: 7px 0; /* Vertical (top/bottom) padding for each menu link */
			text-indent: 8px;
			text-decoration: none;
		}

		.slidedoormenu li a:visited, .slidedoormenu li a:active{
			color: black;
		}

		.slidedoormenu li a:hover{
			background-position: -387px 0; /* Shift background image horizontally 387px, or the start of the 2nd background image */
			color: black;
		}

		.slidedoormenu li.lastitem, .slidedoormenu li.lastitem a{
			border-bottom-width: 0; /* For last menu item within menu, remove bottom border */
		}

		.slidedoormenu li.lastitem a{
			padding: 8px 0; /* increase vertical border of last menu link by 2px (default is padding: 7px 0) to account for removed border width */
		}


/*----------------------------------------------*/
/* -------- spalla destra sito e menu-----------*/
/*----------------------------------------------*/

div#rightbar{
	float:left;	
	padding:0;
	margin:240px 0px 0px 0px;
	width:250px;
	z-index:3;
}

	div#rightbar ul{
		list-style:none;
	}

	#rightbar .ui-widget { font-family:Helvetica,Verdana,Arial,sans-serif; font-size: 11px;min-height:380px; height:auto !important; height:380px; }
	#rightbar .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family:Helvetica,Verdana,Arial,sans-serif; font-size: 11px; }
	#rightbar .ui-widget-content { border: 0; background:none; color: #ffffff; }
	#rightbar .ui-widget-content a { color: #363568; }
	#rightbar .ui-widget-header { border: 1px solid #ffffff; background: none; color: #363568; font-weight: bold; }
	#rightbar .ui-widget-header a { color: #363568; }
	
	#rightbar .ui-state-default, .ui-widget-content .ui-state-default { border: 0; background-color: #363568; font-weight: bold; color: #363568; outline: none; }
	#rightbar .ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { color: #ffffff; text-decoration: none; outline: none; }
	#rightbar .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus { border: 0; background-color: #363568; font-weight: bold; color: #363568; outline: none; }
	#rightbar .ui-state-hover a, .ui-state-hover a:hover { color: #ffffff; text-decoration: none; outline: none; }
	#rightbar .ui-state-active, .ui-widget-content .ui-state-active { border: 0; background-color: #fde155; font-weight: bold; color: #363568; outline: none; }
	#rightbar .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #363568; outline: none; text-decoration: none; }

/* ------ newsletter box -------- */

#newsletterBox{
	float:left;	
	padding:0;
	margin:20px 0px 0px 10px;
	width:250px;
	z-index:3;
}

	.newsletterBoxTitle span{
		font-weight:bold;
	}


#skypeBox{
	float:left;	
	padding:0;
	margin:20px 0px 0px 10px;
	width:250px;
	z-index:3;
}

	.skypeBoxTitle span{
		font-weight:bold;
	}

/*----------------------------------------------*/
/*  ------------PORTFOLIO FISSO FOOTER ---------*/
/*----------------------------------------------*/
#portfolioBottom {
	border-top: solid 3px #353567;
	color:#353567;
	width: 100%;
	float: left;
	background: #dedfe1 url(../images/bgMenuFixed.jpg) repeat-y center top;
	padding: 23px 0;
	margin:0px 0px 0px 0px;
}

	.wrapportfolio {
		width: 996px;
		margin: 0 auto;
		text-align: left;
	}	
	
	#portfolioBottom h3 {
		margin-bottom: 1em;
		color:#353567;
		font-weight: normal;
		text-align:right;
		width:261px;
		font-weight:bold;
	}
	
	#portfolioBottom img {
		width: 261px;
		height: 180px;
		opacity: 0.8;
		-webkit-transition: linear .1s;
		border:0;
	}

	#portfolioBottom a:hover img {
		opacity: 1;
	}
	
	#title-work {
		width: 140px;
		float: left;
		margin: 0 20px 0 0;
		position: relative;
	}
	
		#title-work h3 {
			color:#353567;
			margin-bottom: 1em;
			font-size:22px;
			text-align:left;
			width:140px;
		}
		
	#recent-work {
		width: 378px;
		float: left;
		margin: 0 20px 0 0;
		position: relative;
	}
	
	#portfolioBottom dl {
		float: left;
		margin-right: 30px;
	}
	
		#portfolioBottom dl:last-child {
			margin-right: 0;
		}
	
	#portfolioBottom dt {
		margin-bottom: 5px;
	}
		
	#portfolioBottom dd a {
		color: #215a6d;
		font-size: 1.3em;
		font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
		padding: 0 25px 0 0;
		-webkit-transition: color linear .1s;
	}
	
	#portfolioBottom dd a:hover {
		background: url(../img/icon-arrow-offset-dark.png) no-repeat right center;
		color: #154c5f;
		text-decoration: none;
	}
	
	#our-projects {
		width: 378px;
		float: left;
	}
	

/*----------------------------------------------*/
/* ------------------ footer -------------------*/
/*----------------------------------------------*/

#push{
	height:90px;	
}

#footer-container a{
	text-decoration:underline;
	color:#ffffff;
}

#footer-container a:hover{
	text-decoration:none;
}

#footer-container {
	clear:both;
	height:370px;
	width:100%;
	padding:30px 0px 0px 0px;
	margin:0;
	background-color:#353567;
	font-family:"Trebuchet MS",Verdana,Arial,sans-serif;
	font-size:11px;
	color:#ffffff;
}
	
	/* frasi di testata sezioni footer */ 
	#footer-container #footerHeader{
		width:996px;
		margin:0 auto;
		padding:10px 0px;
		color:#fbdf54;
		text-align:left;
		font-weight:bold;
		text-transform:uppercase;
	}
		
		#footerNewsHeader,#workingOnHeader,#footerExtrasHeader,#quickmenuHeader{
			width:174px;
			float:left;
			padding:0px 10px 0px 0px;
		}
		
		
		
		#footer-container #footerHeader .formFooterContainerHeader{
			width:300px;			
		}
	
	/* parte contenuto footer */
	#footer-container #footerMain{
		width:996px;			
		margin:0 auto;
		padding:10px 0px 0px 0px;
		text-align:left;
	}	
		
		/* colonne footer */
		#footerNews,#workingOn,#footerExtras,#quickMenus{
			width:174px;
			float:left;
			padding:0px 10px 0px 0px;
		}
		
		/* formattazione navigazione veloce */
		#quickMenus .quickMenu{
			margin:0px 0px 10px 0px;
		}
		
			#quickMenus .quickMenu h3{
				font-size:11px;
				color:#ffffff;
				font-weight:bold;
			}
			
			#quickMenus .quickMenu ul{
				list-style:none;
				margin:0;
				padding:0;
			}
		
				#quickMenus .quickMenu ul li{
					list-style:none;
				}
				
					#quickMenus .quickMenu ul li a{
						color:#ffffff;
					}

		
		#footerMain #formFooterContainer{
			width:260px;
			float:left;
		}
		
		/* formattazione news */
		#footerNews .news{
			padding:0px 15px 0px 0px;
			margin:0px 0px 10px 0px;
		}
		
		#footerExtras .footerExtra{
			padding:0px 15px 0px 0px;
		}	
			
			.footerHeader{
				color:#fbdf54;
				text-transform:uppercase;
				font-weight:bold;
				margin:20px 0px 0px 0px;
			}


/*----------------------------------------------*/
/* --------------- copyright -------------------*/
/*----------------------------------------------*/

#copyMain{
	width:996px;
	margin:0 auto;
	background-color:#ffffff;	
}
	
	#mins{		
		width:300px;
		text-align:right;
		float:left;
	}
	
	#copy{
		height:50px;
		width:696px;
		float:left;
		margin:0 auto;
		text-align:left;
	}

		#copy p,#mins p{
			font-size:10px;
		}


#crediti{
	background:url("../images/bgCrediti.jpg") no-repeat;
	width:210px;
	height:100px;
	padding:40px;
}

#crediti a{
	color:#000000;
	text-decoration:underline;
}

.creditiTitle{
	font-weight:bold;
	
}

.creditiDescription{
	color:#000000;
}