/* Styles generaux ------------------------------------ */
* { margin:0; padding:0; }

body
{
	font-family: Arial, Verdana, Sans-serif;
	font-size:13px;
	color:#9E9E8E;
	text-align:left;
	background:#ffffff url(../images/common/footer.gif) repeat-x left 574px;
}

ul { list-style:none; }
a { color:#9E9E8E; }
a img { border:none; }

.retour
{
	display:block;
	position:absolute;
	bottom:0;
	right:110px;
}

h2 { color:#BECD1F; }

.error
{
	color:#fff;
	padding:3px 5px;
	background:#cf585f;
}

/* Conteneur principal -------------------------------- */
#tilt
{
	position:relative;
	width:990px;
	height:574px;
	margin:0 auto;
	background:url(../images/common/bubbles.gif) no-repeat 225px bottom;
}
	#tilt h1 { position:absolute;left:53px;top:57px; }
	#tilt h1 a { text-decoration:none; }

/* Footer --------------------------------------------- */
#footer
{
	position:absolute;
	top:580px;
	width:990px;
	height:15px;
	text-align:center;
	font-size:11px;
}

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

/* Page d'accueil ------------------------------------- */
#page-home #tilt { background:none; }

#nav
{
	position:absolute;
	top:100px;
	left:252px;
	height:95px;
}
	#nav li { position:absolute; top:0; display:block; width:180px; height:95px; font-size:11px; }
		#nav li#studio { left:0; }
		#nav li#services { left:220px; }
		#nav li#portfolio { left:440px; top:-3px; width:200px; height:42px; }
		#nav li#contact { left:440px; top:auto; bottom:0; width:200px; height:42px; }
	#nav h2 { margin:0 0 3px; color:#aac800; text-transform:uppercase; font-weight:normal; font-size:13px; }
		#nav h2 a { color:#aac800; text-decoration:none; outline:none; }
	#nav p a { text-decoration:none; outline:none; }
	#nav a.link { color:#becd00; text-decoration:none; padding:0 0 0 10px; background:url(../images/common/arrow.gif) no-repeat left center; }
		#nav li#studio a.link, #nav li#services a.link, #nav li#contact a.link { position:absolute; bottom:0;  }
	#nav a.link:hover { color:#c3e407; text-decoration:underline; }

#ideas
{
	position:absolute;
	left:10px;
	top:221px;
}

	#ideas img { display:block; position:relative; top:-11px; }
	
/* Menu sur les pages interieures --------------------- */
#menu
{
	position:absolute;
	left:510px;
	top:25px;
}

	#menu li { float:left; display:block; margin:0 0 0; }
	#menu li#portfolio { margin-top:-3px; }
	#menu a { display:block; padding:17px; text-transform:uppercase;text-decoration:none; font-size:10px; }

/* Notre studio --------------------------------------- */
#qui, #philosophie
{
	position:absolute;
	top:128px;
	width:330px;
	font-size:11px;
}

#qui { left:220px; }
#philosophie { left:580px; }

	#qui h2, #philosophie h2 { margin:0 0 15px 0; }
	#qui p, #philosophie p { margin:0 0 10px 0; }
	#qui strong, #philosophie strong { color:#b0cc11; }
	#philosophie li { display:block; padding:0 0 0 8px; margin:0 0 10px 0; background:url(../images/common/puce.gif) no-repeat left 5px; }

/* Nos services --------------------------------------- */
.service
{
	position:absolute;
	top:125px;
	width:326px;
	height:220px;
	font-size:11px;
	text-align:justify;
}

#integration { left:220px; }
#developpement { left:580px; }
#graphisme { left:220px; top:370px; width:682px; height:auto; }
	#graphisme h2 { margin:0 0 5px; }

	.service h2 { margin:0 0 15px 0; }
	.service p { margin:0 0 10px 0; }
	.service strong { color:#bbd333; }
	.service li { display:block; padding:0 15px 0 8px; margin:0 0 10px 0; background:url(../images/common/puce.gif) no-repeat left 5px; }
	.wish { position:absolute; bottom:0; width:326px; overflow:hidden; height:70px; background:url(../images/services/frame.gif) no-repeat left bottom; }
	.wish p { padding:15px; }
	.wish em { font-style:normal; font-weight:bold; }
	
/* Notre portfolio ------------------------------------ */
#main
{
	position:absolute;
	top:128px;
	left:250px;
	width:710px;
	height:446px;
	font-size:11px;
}

	#main h2 { margin:0 0 35px 0; }
	
#page-portfolio #tilt { background:none; }
#page-portfolio #main h2 { margin:0 0 15px; }
#page-portfolio .retour { right:45px; }

#page-portfolio .screenshot
{
	display:block;
	width:601px;
	height:346px;
	padding:5px 0;
	margin:0 0 5px;
	background:url(../images/portfolio/bg-screenshot.gif) no-repeat left top;
}

#page-portfolio #main #screenshots { overflow:hidden; width:601px; height:400px; position:relative; }
#page-portfolio #main .site { position:absolute; top:0; visibility:hidden; }
#page-portfolio #main .site p { font-size:10px; white-space:nowrap; }
	#page-portfolio #main .site .name{ font-size:12px; }
	#page-portfolio #main .site .link { color:#bbbcb3; }
#page-portfolio #main #next, #page-portfolio #main #previous { position:absolute; top:180px; cursor:pointer; display:block; width:35px; height:31px; background:url(../images/portfolio/buttons.gif) no-repeat left top; }
	#page-portfolio #main #next span, #page-portfolio #main #previous span { display:none; }
#page-portfolio #main #next { background-position:right top; left:601px; }
#page-portfolio #main #next:hover { background-position:right bottom;}
#page-portfolio #main #previous { background-position:left top; left:-35px; }	
#page-portfolio #main #previous:hover { background-position:left bottom;}	

#page-portfolio .nav { position:absolute; right:100px; top:2px; }
	#page-portfolio .nav li { display:block; float:left; }	
		#page-portfolio .nav li a { display:block; float:left; padding:5px 10px; text-decoration:none; }	
	
/* Contactez-nous ------------------------------------- */
#page-contact #main form
{
	width:500px;
}
	
	#page-contact #main form label
	{
		display:block;
		float:left;
		width:125px;
		text-align:right;
		padding:4px 5px 0 0;
	}
	
	#page-contact #main form p
	{
		clear:both;
		margin:0 0 5px 0;
	}
	
	#page-contact #main form select
	{
		color:#9E9E8E;
		width:342px;
		padding:0 0 0 5px;
		border:1px solid #c5c6bd;
	}
	
		#page-contact #main form select option:hover { background:red; }
	
	#page-contact #main form input
	{
		color:#9E9E8E;
		width:330px;
		padding:2px 5px;
		border:1px solid #c5c6bd;
		font-family: Arial, Sans-serif;
	}
	
	#page-contact #main form textarea
	{
		color:#9E9E8E;
		width:330px;
		height:75px;
		padding:2px 5px;
		font-family: Arial, Verdana, sans-serif;
		font-size:11px;
		font-weight:normal;
		border:1px solid #c5c6bd;
	}
	
	#page-contact #main form .envoyer
	{
		position:absolute;
		bottom:0;
		right:145px;
		margin:0;
	}
	
		#page-contact #main form .envoyer button { cursor:pointer; border:none; background:transparent; }
	
	#page-contact #main form .error
	{
		width:332px;
		margin:0 0 0 130px;
	}