@CHARSET "ISO-8859-1";

/* STYLES DES DIV */

body {
	background-color: #EFEFF0;  /* gris */
	margin: 0px;
	padding: 0px;
	font-family: Arial, Helvetica, sans-serif; 
	color:#FFFFFF;  /* noir */
}


#container {
	background-attachment: scroll;
	padding: 0px;
	width: 800px;
	height: 700px;
	margin-left: auto; 
	margin-right: auto; 
	border: 0px solid; 
	border-color: red; 
}


#bandeau {
	margin: 10px 0px 0px 0px;
	padding: 0px;
	text-align: left;
	width: 800px;
	height: 90px;
	position: relative; 
	margin-left: auto; 
	margin-right: auto;
}

#fond {
	margin: 0px 0px 0px 0px;
	padding: 0px;
	width: 800px;
	height: 500px;
	background-color: #FFFFFF;  /* blanc */
	margin-left: auto; 
	margin-right: auto;
	position: relative; 
	border: 0px solid; 
	border-color: red; 
}


#fond-realisation {
	margin: 0px 0px 0px 0px;
	padding: 0px;
	width: 800px;
	height: 640px;
	background-color: #FFFFFF;  /* blanc */
	margin-left: auto; 
	margin-right: auto;
	position: relative; 
	border: 0px solid; 
	border-color: red; 
}

#plan-gauche {
	float: left;
	margin: 100px 0px 0px 50px;
	padding: 0px;
	width: 390px;
	height: 370px;
	position: relative; 
	border: 0px solid; 
	border-color: green; 
}

#formulaire-contact {
	float: left;
	margin: 25px 0px 0px 118px;
	padding: 0px;
	width: 220px;
	height: 410px;
	position: relative; 
	border: 0px solid; 
	border-color: red; 
}

#papillon1{
	margin: -430px 0px 0px 500px;
	padding: 0px;	
	height: 120px;
	width: 150px;
	position: relative; 
	border: 0px solid; 
	border-color: red; 
}

#papillon2{
	margin: -50px 0px 0px 100px;
	padding: 0px;
	height: 120px;
	width: 200px;
	position: relative; 
	border: 0px solid; 
	border-color: red; 
}

#papillon3{
	margin: -50px 0px 0px 420px;
	padding: 0px;	
	height: 120px;
	width: 150px;
	position: relative; 
	border: 0px solid; 
	border-color: red; 
}


#main-papillon {
	margin: -130px 0px 0px 0px;
	padding: 0px;
	height: 300px;
	width: 250px;	
	position: relative; 
	border: 0px solid; 
	border-color: red; 
}


#formulaire {
	padding: 0px;
	width: 150px;
	height: 375px;
	margin-left: 540px; 
	margin-top: -375px;
	position: relative; 
	border: 0px solid; 
	border-color: red; 
}

#titre-presentation
{
	margin: 0px 0px 0px 355px;
	padding: 0px;
	width: 425px;
	height: 80px;
	text-align: left;
	font-size: 10px;
	background-color: #FFFFFF;
}

#titre-realisation
{
	margin: 0px 0px 0px 440px; /*355px;*/
	padding: 0px;
	width: 200px;
	height: 100px;
	text-align: left;
	font-size: 10px;
	background-color: #FFFFFF;
}


#titre-clients
{
	margin: 0px 0px 0px 355px;
	padding: 0px;
	width: 310px;
	height: 80px;
	text-align: left;
	font-size: 10px;
	background-color: #FFFFFF;
}


#titre-contact {
	float: left;
	margin: 0px 0px 0px -85px;
	padding: 0px;
	width: 300px;
	height: 50px;
	position: relative; 
	border: 0px solid; 
	border-color: red; 
}


#presentation1
{
	margin: 0px 0px 0px 20px;
	padding: 0px;
	width: 340px;
	height: 145px;
	text-align: left;
}

#presentation2
{
	margin: 20px 0px 0px 510px;
	padding: 0px;
	width: 250px;
	height: 100px;
	text-align: left;
}

#presentation3
{
	margin: 0px 0px 0px 120px;
	padding: 0px;
	width: 340px;
	height: 60px;
	text-align: left;
}

#realisation1
{
	margin: -50px 0px 0px 10px;
	padding: 0px;
	width: 750px;
	height: 20px;
	text-align: left;
}

#realisation2
{
	margin: -525px 0px 0px -20px;
	padding: 0px;
	width: 780px;
	height: 20px;
	text-align: left;
}


#realisation3
{
	margin: 160px 0px 0px 750px;
	padding: 0px;
	width: 65px;
	height: 50px;
}


#real10
{
	margin: 20px 0px 0px 0px;
	padding: 0px;
	width: 750px;
	height: 20px;
	text-align: left;
}
#real20
{
	margin: 130px 0px 0px 0px;
	padding: 0px;
	width: 750px;
	height: 20px;
	text-align: left;
}
#real30
{
	margin: 20px 0px 0px 20px;
	padding: 0px;
	width: 750px;
	height: 20px;
	text-align: left;
}
#real40
{
	margin: 130px 0px 0px 0px;
	padding: 0px;
	width: 750px;
	height: 20px;
	text-align: left;
}
#real50
{
	margin: 20px 0px 0px 20px;
	padding: 0px;
	width: 750px;
	height: 20px;
	text-align: left;
}
#real60
{
	margin: 130px 0px 0px 0px;
	padding: 0px;
	width: 750px;
	height: 20px;
	text-align: left;
}


#footer {
	margin: 0px 0px 0px 0px;
	padding: 0px;
	width: 800px;
	height: 100px;
	text-align: center;
	font-size: 10px;
	margin-left: auto; 
	margin-right: auto;
	background-color: #E8691D;
}


#footer_gauche_top {
	margin: 40px 0px 0px 20px;
	padding: 0px;
	float: left;
	border: 10px;
	width: 350px;
}

#footer_droite_top {
	margin: 40px 0px 0px 200px;
	padding: 0px;
	float: left;
	border: 10px;
	width: 200px;
}

#contenu {
	background-image: url(../img/graphiste-info-free-blanc.png);
	background-repeat: no-repeat;
	background-position: left 13px;
	margin-top: 0px;
	margin-right: 25px;
	margin-bottom: 0px;
	margin-left: 100px;
	padding-top: 150px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	height: 327px;
}


/* FIN STYLES DES DIV */




/* STYLES DES TEXTES */

p, h1, h2, h3 {
	margin: 0 0 0 0;
	padding: 0;
}

h1 {
	font-family: Arial;
	font-size: 20px;
	font-weight: bold;
	text-align: left;
}



h2 {
	font-family: Arial;
	color: #E8691D;
	font-size: 18px;
	text-align: left;
}

h3{
	font-weight: bold;
	font-size: 12px;
	text-align: left;
	color: #AA0000;
	margin-top: 20px;
	margin-bottom: 10px;
	padding-top: 0px;
	padding-bottom: 0px;
}

ul{
	list-style-type:none;
	margin : 0px;
}
a {
	text-decoration: none;
}
img {
	border-style: none;
}
strong {
	color: #4d7918; /* vert foncé */
}

/* Liens */
a.lien1
{
color:#FFFFFF;
font-size: 12px;
white-space: nowrap;
}
a.lien1:hover
{
color:#FFFFFF;
text-decoration:underline;
font-size: 12px;
white-space: nowrap;
}

/*lien sites page Realisation */
a.lien2
{
color:#817F7F;
font-size: 12px;
white-space: nowrap;
}
a.lien2:hover
{
color:#555555;
text-decoration:underline;
font-size: 12px;
white-space: nowrap;
}

/*lien e-mail Sinfonea de la page CONTACT */
a.lien3
{
color:#F96005;
font-size: 12px;
white-space: nowrap;
}
a.lien3:hover
{
color:#F96005;
text-decoration:underline;
font-size: 12px;
white-space: nowrap;
}


/* bordure images page Realisation */
a.lien10 img {
	border: 5px solid #DDDDDD
}

a.lien10:hover img {
	border: 5px solid #999999
}


.texte_center {
	font-weight: bold;
	font-style : italic;
	font-size: 11px;
	text-align: center;
	color: #009900;
}
.texte_left {
	font-weight: bold;
	font-style : italic;
	font-size: 12px;
	text-align: left;
	color: #000000;
}

.texte_right {
	font-size: 12px;
	text-align: right;
	color: #AA0000;
}

.titre
{
	font-family: Arial;
	font-size: 20px;
	font-weight: bold;
	text-align: left;
}

.titre1   /* orange */
{
	font-family: Arial;
	color: #E8691D;
	font-size: 18px;
	text-align: left;
}
.titre2   /* noir */
{
	font-family: Arial;
	color: #000000;
	font-size: 11px;
	font-weight: bold;	
	text-align: left;
}
.titre3  /* bleu */
{
	font-family: Arial;
	color: #7CC2C1;
	font-size: 18px;
	text-align: left;
}
.titre4   /* noir */
{
	font-family: Arial;
	color: #000000;
	font-size: 13px;
	font-weight: bold;	
	text-align: left;
}
.titre5  /* gris fonce */
{
	font-family: Arial;
	color: #507188;
	font-size: 18px;
	text-align: left;
}
.titre6   /* blanc */
{
	font-family: Arial;
	color: #FFFFFF;
	font-size: 13px;
	font-weight: bold;
	text-align: center;
}
.titre7   /* noir */
{
	font-family: Arial;
	color: #000000;
	font-size: 11px;
	font-weight: regular;	
	text-align: left;
}

/* onglets */

#onglet-logo{
  	margin: 0px 0px 0px 40px;
	padding: 0px;
	width:250px;
	height:83px;
}	

#onglet-presentation img {display: none;}
#onglet-presentation{
  	margin: -26px 0px 0px 350px;
	padding: 0px;
	display: block;
	width:94px;
	height:29px;
	background-image:url(images/onglet-presentation-gris.gif);
}
#onglet-presentation:hover {
	background-image:url(images/onglet-presentation-orange.gif);
} 
#onglet-presentation-select{
  	margin: -26px 0px 0px 350px;
	padding: 0px;
	display: block;
	width:94px;
	height:29px;
	background-image:url(images/onglet-presentation-select.gif);
}


#onglet-realisation img {display: none;}
#onglet-realisation{
  	margin: -29px 0px 0px 460px;
	padding: 0px;
	display: block;
	width:94px;
	height:29px;
	background-image:url(images/onglet-realisation-gris.gif);
}
#onglet-realisation:hover {
	background-image:url(images/onglet-realisation-orange.gif);
} 
#onglet-realisation-select{
  	margin: -29px 0px 0px 460px;
	padding: 0px;
	display: block;
	width:94px;
	height:29px;
	background-image:url(images/onglet-realisation-select.gif);
}


#onglet-clients img {display: none;}
#onglet-clients{
  	margin: -29px 0px 0px 570px;
	padding: 0px;
	display: block;
	width:94px;
	height:29px;
	background-image:url(images/onglet-clients-gris.gif);
}
#onglet-clients:hover {
	background-image:url(images/onglet-clients-orange.gif);
} 
#onglet-clients-select{
  	margin: -29px 0px 0px 570px;
	padding: 0px;
	display: block;
	width:94px;
	height:29px;
	background-image:url(images/onglet-clients-select.gif);
}


#onglet-contact img {display: none;}
#onglet-contact{
  	margin: -29px 0px 0px 680px;
	padding: 0px;
	display: block;
	width:94px;
	height:29px;
	background-image:url(images/onglet-contact-gris.gif);
}
#onglet-contact:hover {
	background-image:url(images/onglet-contact-orange.gif);
}
#onglet-contact-select{
  	margin: -29px 0px 0px 680px;
	padding: 0px;
	display: block;
	width:94px;
	height:29px;
	background-image:url(images/onglet-contact-select.gif);
}


/* Bouton Envoyer de la page CONTACT */

#bouton {
	font-family: Arial, Helvetica, sans-serif;
	padding: 3px 5px;
	font-size: 13px;
	border-width: 0px;
	border-style: solid;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	background-color: #F9C8AA;
	color: #E8691D;
	border-color: #E8691D;
	font-weight: bold;
}

#bouton:hover {
	font-family: Arial, Helvetica, sans-serif;
	padding: 3px 5px;
	font-size: 13px;
	border-width: 0px;
	border-style: solid;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	background-color: #E8691D;
	color: #FFFFFF; 
	border-color: #F9C8AA;
	font-weight: bold;
}


/**
 * jQuery lightBox plugin
 * This jQuery plugin was inspired and based on Lightbox 2 by Lokesh Dhakar (http://www.huddletogether.com/projects/lightbox2/)
 * and adapted to me for use like a plugin from jQuery.
 * @name jquery-lightbox-0.5.css
 * @author Leandro Vieira Pinho - http://leandrovieira.com
 * @version 0.5
 * @date April 11, 2008
 * @category jQuery plugin
 * @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com)
 * @license CCAttribution-ShareAlike 2.5 Brazil - http://creativecommons.org/licenses/by-sa/2.5/br/deed.en_US
 * @example Visit http://leandrovieira.com/projects/jquery/lightbox/ for more informations about this jQuery plugin
 */
#jquery-overlay {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
}
#jquery-lightbox {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
}
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
}
#lightbox-container-image { padding: 10px; }
#lightbox-loading {
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
}
#lightbox-nav {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
}
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
	width: 49%;
	height: 100%;
	zoom: 1;
	display: block;
}
#lightbox-nav-btnPrev { 
	left: 0; 
	float: left;
}
#lightbox-nav-btnNext { 
	right: 0; 
	float: right;
}
#lightbox-container-image-data-box {
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%;
	padding: 0 10px 0;
}
#lightbox-container-image-data {
	padding: 0 10px; 
	color: #666; 
}
#lightbox-container-image-data #lightbox-image-details { 
	width: 70%; 
	float: left; 
	text-align: left; 
}	
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber {
	display: block; 
	clear: left; 
	padding-bottom: 1.0em;	
}			
#lightbox-secNav-btnClose {
	width: 66px; 
	float: right;
	padding-bottom: 0.7em;	
}