@charset "utf-8";

@font-face {
    font-family: 'NovecentowideNormalRegular';
    src: url('../font/Novecentowide-Normal-webfont.eot');
    src: url('../font/Novecentowide-Normal-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/Novecentowide-Normal-webfont.woff') format('woff'),
         url('../font/Novecentowide-Normal-webfont.ttf') format('truetype'),
         url('../font/Novecentowide-Normal-webfont.svg#NovecentowideNormalRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'NovecentowideBookBold';
    src: url('../font/Novecentowide-Bold-webfont.eot');
    src: url('../font/Novecentowide-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/Novecentowide-Bold-webfont.woff') format('woff'),
         url('../font/Novecentowide-Bold-webfont.ttf') format('truetype'),
         url('../font/Novecentowide-Bold-webfont.svg#NovecentowideBookBold') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'NovecentowideLightRegular';
    src: url('../font/Novecentowide-Light-webfont.eot');
    src: url('../font/Novecentowide-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/Novecentowide-Light-webfont.woff') format('woff'),
         url('../font/Novecentowide-Light-webfont.ttf') format('truetype'),
         url('../font/Novecentowide-Light-webfont.svg#NovecentowideLightRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}
img { border: 0; }
#loading{
	position:absolute;
	margin-left: 48%;
	margin-top:20%;
}
#gallery {
	width:100%;
	min-width:1050px;
	position: relative;
	overflow: hidden;
}		
#gallery div.scrollableArea img {
		vertical-align: middle;
		position: relative;
		float: left;
		margin: 0;
		padding: 0;
		height:100%;
	/* If you don't want the images in the scroller to be selectable, try the following
			   block of code. It's just a nice feature that prevent the images from
			   accidentally becoming selected/inverted when the user interacts with the scroller. */
		-webkit-user-select: none;
		-khtml-user-select: none;
		-moz-user-select: none;
		-o-user-select: none;
		user-select: none;
	}	

#vign {
	width:100%;
	min-width:1050px;
	height:80px;
	position :relative;
	background-color: #2C7DCE;
}
		
#vign div.scrollableArea img {
		vertical-align: middle;
		position: relative;
		float: left;
		margin: 0;
		padding: 0;
	/* If you don't want the images in the scroller to be selectable, try the following
			   block of code. It's just a nice feature that prevent the images from
			   accidentally becoming selected/inverted when the user interacts with the scroller. */
		-webkit-user-select: none;
		-khtml-user-select: none;
		-moz-user-select: none;
		-o-user-select: none;
		user-select: none;
		opacity:0.7;
		filter:alpha(opacity=70); /* For IE8 and earlier */
}
		
#vign div.scrollableArea img:hover {
	opacity:1;
	filter:alpha(opacity=100); /* For IE8 and earlier */
	cursor: pointer;
}
#content {
	 padding-bottom: 140px; 	  
}
#menu {
	float:left;
	height:110px;
	margin-top:-110px;
	margin-left:1.2%;
}
#fashion, #com, #publi, #perso {
	float:left;
	margin-right:20px;
	margin-top:5px;
}
#nbr_fashion div, #nbr_com div, #nbr_publi div, #nbr_perso div {
	float:left;
	
}
#nbr_fashion, #nbr_com, #nbr_publi, #nbr_perso{	
	opacity:0;	
	transform-origin:0 0;
	-ms-transform-origin:0 0; /* IE 9 */
	-webkit-transform-origin:0 0; /* Chrome, Safari, Opera */
	-moz-transform:scale(0.00);
	-o-transform:scale(0.00);
	-webkit-transform:scale(0.00);
	transform:scale(0.00);
	transition:all 500ms ease;
	position:absolute;
}

.nbr {
	background: #f9f9f9;
	padding:6px 7px 0px 7px;
	border-radius: 4px;
	position: relative;
	}

/* arrows - :before and :after */
.nbr:after {
			position: absolute;
			display: inline-block;
			border-left: 6px solid transparent;
			border-bottom: 6px solid #f9f9f9;
			border-right: 6px solid transparent;
			left: 10px;
			top: -6px;
			content: '';
}
#nom {
	margin-bottom:8px;	
}
#logo_contact {
	float:right;
	height:110px;
	margin-top:-110px;
	margin-right:2%;		
}
#bas{
	width:100%;
	min-width:1050px;
}
#logo{
	float:left;
	margin-right:8px;	
}
#contact {
	text-align:left;
	float:right;
	margin-top:-3px;
}

#phone {
	
	margin-top:-3px;
}
#visit {
	margin-top:-1px;
}

#mail {
	
	margin-top:-8px;
	position:absolute
}
#f_logo{
	margin-left:0px;
	margin-top:11px;
	position:absolute;
}
.nbr div {
	cursor: pointer;
	padding-right: 6px;
}
.boxgrid{
	float:left;
	overflow: hidden;
	position: relative;
}
.boxgrid img{ 
	position: absolute; 
	top: 0; 
	left: 0; 
	border: 0; 	
	height:100%;
}
.boxgrid p{
	color:#FFF;
	font-family: NovecentowideLightRegular;
	line-height: 150%;
	padding-top: 10%;
	padding-right: 10%;
	padding-bottom: 10%;
	padding-left: 10%;	
}
				
.boxcaption{ 
	float: left; 
	position: absolute; 
	top:100%;
	background: #000; 
	height: 50%; 
	width: 100%; 
	opacity: 0.75; 
	/* For IE 5-7 */
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=75);
	/* For IE 8 */
	-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
}
strong{
	font-family: 'NovecentowideBookBold';
	}