@charset "utf-8";
/* CSS Document */
@import url('reset.css');

body {
	background:#010101 url(../images/bkg.jpg) no-repeat fixed center top;
	margin:0;
	padding:0;
	font-family: Trebuchet MS,Helvetica,sans-serif; 
	color: #c2c2c2;
	font-size:12px;
}

h1{
	color:#FFF;
	font-size:180%;
	font-weight:bold;
	text-transform:uppercase;
	margin-bottom:10px;
}

h2{
	color:#cacaca;
	font-size:130%;
	font-weight:bold;
	text-transform:uppercase;
	margin-bottom:10px;
}
	
a{
	color:#C2C2C2;
	text-decoration:none;
	cursor:pointer;
}
	
a:hover{
	color:#FFF;
}

.separator{
	background:url(../images/separator.png) no-repeat;
	width:600px;
	height:11px;
	margin:5px 0;
}

#logo{
	height:131px;
	width:285px;
	top:0;
	left:7%;
	background: url(../images/logo.png) no-repeat;
	z-index:100;
	position:fixed;
}

#top-nav{
	background: url(../images/menuSlice.jpg) repeat-x;
	width:100%;
	height:51px;
	position:fixed;
	top:0;
	left:0;
	text-align:right;
	z-index:90;
}

#navigation {
	float:right;
	margin-right:30px;
}



#navigation li{
	float:left;
	display:block;
}

#navigation li a{
	background-image:url(../images/menuSprite.jpg);
	display: block;
	outline: none;
	position: relative;
	height: 51px;
	text-decoration: none;
	width: auto;
}



	
	#navigation .home {
		background-position:0px 0px;
		width:81px;
		height:51px;
	
	}
	
	#navigation .portfolio {
		background-position:-81px 0px;
		width:81px;
		height:51px;
	}
	
	#navigation .contact {
		background-position:-162px 0px;
		width:81px;
		height:51px;
	}
	
	
	
	#navigation a .hover {
		background: transparent  url(../images/menuSprite.jpg) no-repeat;
		display:block ;
		opacity: 0;
		position: relative;
		top: 0;
		left: 0;
		height: 100%;
		width: 100%;
	}
	
	#navigation .home .active ,#navigation .home .hover , #navigation .highlight .home .hover{
		background-position: -0px -51px;
	}

	#navigation .portfolio .active,#navigation .portfolio .hover, #navigation .highlight  .portfolio .hover  {
		background-position: -81px -51px;
	}

	#navigation .contact .active,#navigation .contact .hover, #navigation .highlight  .contact .hover  {
		background-position: -162px -51px;
	}
	
#languages {
	float:right;
	margin-right:5%;
	margin-top:16px;
}



#languages li{
	float:left;
	display:block;
}

#languages li a{
	background-image:url(../images/flagSprite.png);
	display: block;
	outline: none;
	position: relative;
	height: 25px;
	text-decoration: none;
	width: auto;
	margin-right:3px;

}



	
	#languages  .flagFr {
		background-position:0px -25px;
		width:32px;
		height:25px;
	
	}
	
	#languages .flagUs {
		background-position:-32px -25px;
		width:32px;
		height:25px;
	}
	
	
	
	#languages  a .hover {
		background: transparent  url(../images/flagSprite.png) no-repeat;
		display:block ;
		opacity: 0;
		position: relative;
		top: 0;
		left: 0;
		height: 100%;
		width: 100%;
	}
	
	#languages .highlight  .flagFr .hover, #languages .flagFr .hover {
		background-position: 0px 0px;
	}

	#languages .highlight  .flagUs .hover, #languages .flagUs .hover {
		background-position: -32px 0px;
	}


#content{
	margin-top:100px;
	width:880px;
	margin-left:auto;
	margin-right:auto;
}	

#footer{
	background: url(../images/sliceBottom.png) repeat-x;
	width:100%;
	height:30px;
	position:fixed;
	bottom:0;
	left:0;
	text-align:right;
	z-index:1000;
}

#footer-nav {
	float:left;
	margin-left:150px;
	font-size:10px;
	margin-top:7px;
	color:#464646;
	font-family:Trebuchet MS, Helvetica, sans-serif;
}

	#footer-nav  li{
		float:left;
		display:block;
		margin-right:15px;
	}
	
		#footer-nav  li a{
			color:#464646;
			text-decoration:none;
			text-transform:uppercase;
		}
		
		#footer-nav  li a:hover{
			color:#acacac;
		}

#settings {
	float:right;
	margin-left:5px;
	font-size:7px;
	margin-top:4px;
	margin-right:5px;
	color:#464646;
	font-family:Trebuchet MS, Helvetica, sans-serif;
	cursor:default;
}

#socialNetwork {
	float:right;
	margin-right:30px;
}



#socialNetwork li{
	float:left;
	display:block;
}

#socialNetwork li a{
	background-image:url(../images/socialSprite.png);
	display: block;
	outline: none;
	position: relative;
	height: 30px;
	text-decoration: none;
	width: auto;

}
	
	#socialNetwork .netTwitter {
		background-position:0px 0px;
		width:31px;
		height:30px;
	
	}
	
	#socialNetwork .netMyspace {
		background-position:-31px 0px;
		width:31px;
		height:30px;
	
	}
	
	#socialNetwork .netFacebook {
		background-position:-62px 0px;
		width:31px;
		height:30px;
	
	}
	
	#socialNetwork .netLaBrute {
		background-position:-93px 0px;
		width:31px;
		height:30px;
	
	}
	
	#socialNetwork  a .hover {
		background: transparent  url(../images/socialSprite.png) no-repeat;
		display:block ;
		opacity: 0;
		position: relative;
		top: 0;
		left: 0;
		height: 100%;
		width: 100%;
	}
	
	#socialNetwork .highlight  .netTwitter .hover, #socialNetwork .netTwitter .hover{
		background-position:0px -30px;
	}
	
	#socialNetwork .highlight  .netMyspace .hover, #socialNetwork .netMyspace .hover{
		background-position:-31px -30px;
	
	}
	
	#socialNetwork .highlight  .netFacebook .hover, #socialNetwork .netFacebook .hover{
		background-position:-62px -30px;
	
	}
	
	#socialNetwork .highlight  .netLaBrute .hover, #socialNetwork .netLaBrute .hover{
		background-position:-93px -30px;
	
	}

/* LAST WORK */
#lastWorkPanel{
	background:url(../images/bgPortfolioDiv.png);
	width:540px;
	float:left;
}

#lastWork,#lastWorkFr {
    width: 534px; /* important to be same as image width */
    height: 200px; /* important to be same as image height */
    position: relative; /* important */
	overflow: hidden; /* important */
}

#lastWorkContent,#lastWorkFrContent {
    width: 534px; /* important to be same as image width or wider */
    position: absolute;
	top: 0;
	margin-left: 0;
}
.lastWorkImage,.lastWorkFrImage  {
    float: left;
    position: relative;
	display: none;
}
.lastWorkImage span,.lastWorkFrImage span {
    position: absolute;
	font: 10px/15px Trebuchet MS, Helvetica, sans-serif;
    padding: 10px 13px;
    width: 533px;
    background-color: #000;
    filter: alpha(opacity=70);
    -moz-opacity: 0.7;
	-khtml-opacity: 0.7;
    opacity: 0.7;
    color: #ccc;
    display: none;
}

.clear {
	clear: both;
}
.lastWorkImage span strong,.lastWorkFrImage span strong  {
    font-size: 14px;
}
.left {
	top: 0;
    left: 0;
	width: 200px !important;
	height: 200px;
}
.right {
	right: 0;
	bottom: 0;
	width: 200px !important;
	height: 200px;
}

/* PORTFOLIO */
#portfolio_nav{
	width:340px;
	position:fixed;
	z-index:101;
}

	#portfolio_nav ul li{
		margin-bottom:10px;
	}
	
	#portfolio_nav ul li a{
		font-size:180%;
		text-transform:uppercase;
		color:#C2C2C2;
		text-decoration:none;
		font-weight:bold;
	}
	
	#portfolio_nav ul li a:hover{
		color:#FFF;
	}

#portfolio_content{
	width:460px;
	color:#cccccc;
	margin:0 0 50px 340px;
}

	#portfolio_content ul {
		width:460px;
	}
	
	#portfolio_content ul li{
		display:inline;
	}
	
	h1{
		color:#FFF;
		font-size:180%;
		font-weight:bold;
		text-transform:uppercase;
		margin-bottom:10px;
	}
	
	h2{
		color:#cacaca;
		font-size:130%;
		font-weight:bold;
		text-transform:uppercase;
		margin-bottom:10px;
	}
	
	.portfolio_img{
		border:1px solid #464646;
		margin-right:8px;
		cursor:pointer;
		margin: 5px ; 
	}
	
	#covers div,#web div,#corporate div{
		min-height:130px;
		padding-bottom:30px;
		background:url(../images/bgPortfolioDiv.png);
	}
	
	#covers .portfolio_img,#web .portfolio_img,#corporate .portfolio_img{
		float:left;
	}
	
	#thumbs div{
		background:url(../images/bgPortfolioDiv.png);
		padding-bottom:30px;
	}
	
	.portCategory{
		display:none;
	}
/* NFO */
#nfoPanel{
	width:215px;
	float:left;
}

/* CONTACT */
#contactPanel{
	background:url(../images/bgPortfolioDiv.png);
	width:540px;
	float:left;
}
	
	#contactPanel label{
		width:200px;
		float:left;
	}
	
	#contactPanel p{
		margin:5px;
	}
	
	#contactPanel textarea{
		height:150px;
	}
	
	#contactPanel input,#contactPanel textarea{
		border:1px solid #C2C2C2;
		background-color:transparent;
		width:300px;
		color:#C2C2C2;
	}
	
	#contactPanel #send{
		width:100px;
		margin-top:20px;
	}


#about,#services,#prices{
	background:url(../images/bgPortfolioDiv.png);
	margin:0 0 15px 15px;
	padding:10px 15px 20px;
}	

/* SITEMAP */
#sitemap{
	margin-top:150px;
}

	#sitemap ul li{
		margin-bottom:10px;
	}
	
	#sitemap ul li a{
		font-size:180%;
		text-transform:uppercase;
		color:#C2C2C2;
		text-decoration:none;
		font-weight:bold;
	}
	
	#sitemap ul li a:hover{
		color:#FFF;
	}
	
#lastWorkPanel,#nfoPanel,#contactPanel{
	padding:10px 15px 20px;
	margin:0 0 15px 20px;
}

/* DEVISE */
#devisePanel{
	margin:auto;
	width:600px;
}

#devise{
	width:361px;
	height:50px;
	background:url(../images/devise.png);
	margin-bottom:10px;
	margin-left:140px;
}

/* TOOLTIPS */
#myspaceTip,#facebookTip,#twitterTip,#laBruteTip { 
    display:none; 
    background:transparent url(../images/footer_tooltip.png); 
    font-size:10px; 
    height:35px; 
    width:176px; 
    color:#464646;  
	z-index:9999999;
	padding:5px 0 0 5px;
}

#enlargeTip { 
    display:none; 
    background:transparent url(../images/tooltipEnlarge.png); 
    font-size:10px; 
    height:14px;
	padding:5px 0 0 5px;
	width:116px;
    color:#FFF;  
	z-index:9999999;
}

.navItem,.fr,.us{
	display:none;
}

#alertCtcMsg{
	color:red;
	font-weight:bold;
	margin:5px;
}