/* ---------------------------------------- général ---------------------------------------- */
body {
	margin: 0 auto;
	background: black url('./images/bg.png') no-repeat fixed;
	background-position: center;
	margin: 148px auto 51px auto;
}

#global {
	margin: auto;
	width: 100%;
	min-width: 1008px;
}

/* ---------- page index ---------- */
body#index {
	margin: 0 auto;
	background: black;
}

#index #global{
	text-align: center;
	margin: auto;
	width: 773px;
}

#index a { text-decoration: none; font-size: 0.9em; color: white; }
/* -------------------------------- */

p, h1, h2, ul, li, a				{ font-family: tahoma, "trebuchet ms", georgia, verdana; }
p, ul							{ color: white; }

.clear							{ clear: both; }

.centrage, #cadre .centrage p	{ text-align: center; }

.gras							{ font-weight: bold; }
.orange							{ color: #ff5501; }
.vert							{ color: #81db21; }
.bleu							{ color: #02c1ff; }
.jaune							{ color: #ffc001; }
.rouge							{ color: #ea0f0f; }
.violet							{ color: #C082FF; }

/* ------------------------------------------------------------------------------------------ */
/* ---------------------------------------- banniere ---------------------------------------- */
#banner  {
	z-index: 2;
	position: fixed;
	height: 78px;
	width: 100%;
	top: 0;
	background: url('./images/ban_bg.png');
}

#txt_ban {
	float: left;
	height: 34px;
	width: 440px;
	background: url('./images/txt_ban.png') no-repeat;
	margin: 30px 0 0 20px;
}

#proj {
	float: right;
	margin-right: 20px;
	height: 181px;
	width: 171px;
	background: url('./images/proj.png');
}
/* -------------------------------------------------------------------------------------- */
/* ---------------------------------------- menu ---------------------------------------- */
#menu {
	position: fixed;
	float: left;
	width: 10%;
	min-width: 139px;
	margin: 2px 0 75px 12%;
	border: 2px solid #cb1175;
	background: url('./images/menu_bg.png');
	text-align: center;
}

#menu a { text-decoration: none; color: white; cursor: pointer; }

#liste_com li a:hover{ color: #29cb4c; }
#liste_photo li a:hover{ color: #ffc001; }
#liste_serigraphie li a:hover{ color: #02c1ff;}
#liste_deco li a:hover{ color: #C082FF; }

#menu ul 		{ margin: 10px ; padding:0; font-size: 12px; color: white; list-style: none; text-align: left; }
#menu ul li 	{ margin: 5px 0 5px 0; font-size: 11px;}

#accueil, #com, #photo, #contact, #deco	{ font-size: 12px; display: block; height:24px; border-top: 2px solid #cb1175; background: url('./images/fond_btn.png'); }

#serigraphie {  font-size: 12px; display: block; height:35px; border-top: 2px solid #cb1175; background: url('./images/fond_btn2.png');}

#accueil 	{ border-top: none; }

#accueil a:hover 	{ color: #ff5501; }
#com a:hover			{ color: #29cb4c; }
#serigraphie a:hover 	{ color: #02c1ff; }
#deco a:hover 	{ color: #C082FF; }
#photo a:hover		{ color: #ffc001; }
#contact a:hover 	{ color: #ea0f0f; }

/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------- cadres ---------------------------------------- */
#cadre {
	z-index: 1;
	float: right; 
	width: 50%; 
	margin-right: 12%;	
	margin-bottom: 20px;
}

#cadre_m			{ padding-bottom: 20px; min-height: 270px; background: url('./images/cadres/m.png'); }

#cadre p, #cadre ul	{ margin: 0; padding: 15px 20px 20px 20px; text-align: justify; font-size: 12px; line-height: 1.5em; }
#cadre ul 			{ margin-left: 25px; }
#cadre ul li			{ padding-bottom: 15px; }
#cadre h1	 		{ margin: 0; padding-left: 10px; font-size: 0.9em; font-weight: normal; }

/* -------------------------------------------------- orange (accueil) --------------------------------------------------*/
#cadre #cadre_or h2 	{ margin: 0; padding: 25px 0 0 30px; font-size: 0.9em; color: #ff5501; }
/* images */
#cadre_or 			{ position: relative; border: 2px solid #ff5501; }
#cadre_h_or 			{ background: url('./images/cadres/orange/h.png'); height: 16px; border-bottom: 4px solid #ff5501; }

#cadre_or a			{ color: #ff5501; }
#cadre_or:visited	{ text-decoration: none; border-bottom: 1px dotted #ff5501; }
/* ---------------------------------------------------------------------------------------------------------------------*/

/* -------------------------------------------------- vert (com) --------------------------------------------------*/
#cadre #cadre_vert h2 	{ margin: 0; padding: 25px 0 0 30px; font-size: 0.9em; color: #81db21; }
/* images */
#cadre_vert 				{ position: relative; border: 2px solid #81db21; }
#cadre_h_vert 			{ background: url('./images/cadres/vert/h.png'); height: 16px; border-bottom: 4px solid #81db21; }
#cadre_b_vert 			{ position: absolute; right: 60px; bottom: 0; background: url('./images/cadres/vert/b.png'); height: 16px; width: 312px; cursor: pointer; }
#cadre_b_vert:hover		{ background: url('./images/cadres/vert/b_on.png'); height: 16px; width: 312px; }

#cadre_vert a 			{ color: #81db21;}
#cadre_vert a:visited	{ text-decoration: none; border-bottom: 1px dotted #81db21; }
/* ----------------------------------------------------------------------------------------------------------------*/

/* -------------------------------------------------- bleu (serigraphie) --------------------------------------------------*/
#cadre #cadre_bleu h2 	{ margin: 0; padding: 25px 0 0 30px; font-size: 0.9em; color: #02c1ff; }
/* images */
#cadre_bleu 				{ position: relative; border: 2px solid #02c1ff; }
#cadre_h_bleu 			{ background: url('./images/cadres/bleu/h.png'); height: 16px; border-bottom: 4px solid #02c1ff; }
#cadre_b_bleu 			{ position: absolute; right: 94px; bottom: 0; background: url('./images/cadres/bleu/b.png'); height: 16px; width: 312px; cursor: pointer; }
#cadre_b_bleu:hover		{ background: url('./images/cadres/bleu/b_on.png'); height: 16px; width: 312px; }

#cadre_bleu a			{ color: #02c1ff; }
#cadre_bleu a:visited	{ text-decoration: none; border-bottom: 1px dotted #02c1ff; }
/* ----------------------------------------------------------------------------------------------------------------*/

/* -------------------------------------------------- Violet (Décoration) --------------------------------------------------*/
#cadre #cadre_violet h2 	{ margin: 0; padding: 25px 0 0 30px; font-size: 0.9em; color: #C082FF; }
/* images */
#cadre_violet				{ position: relative; border: 2px solid #C082FF; }
#cadre_h_violet			{ background: url('./images/cadres/violet/h.png'); height: 16px; border-bottom: 4px solid #C082FF; }
#cadre_b_violet			{ position: absolute; right: 94px; bottom: 0; background: url('./images/cadres/violet/v.png'); height: 16px; width: 312px; cursor: pointer; }
#cadre_b_violet:hover		{ background: url('./images/cadres/violet/v_on.png'); height: 16px; width: 312px; }

#cadre_violet a			{ color:#C082FF; }
#cadre_violet a:visited	{ text-decoration: none; border-bottom: 1px dotted purple; }
/* ----------------------------------------------------------------------------------------------------------------*/

/* -------------------------------------------------- jaune (photo) --------------------------------------------------*/
#cadre #cadre_jaune h2 	{ margin: 0; padding: 25px 0 0 30px; font-size: 0.9em; color: #ffc001; }
/* images */
#cadre_jaune 			{ position: relative; border: 2px solid #ffc001; }
#cadre_h_jaune 			{ background: url('./images/cadres/jaune/h.png'); height: 16px; border-bottom: 4px solid #ffc001; }
#cadre_b_jaune 			{ position: absolute; right: 60px; bottom: 0; background: url('./images/cadres/jaune/b.png'); height: 16px; width: 312px; cursor: pointer; }
#cadre_b_jaune:hover	{ background: url('./images/cadres/jaune/b_on.png'); height: 16px; width: 312px; }

#cadre_jaune a 			{ color: #ffc001; }
#cadre_jaune a:visited	{ text-decoration: none; border-bottom: 1px dotted #ffc001; }
/* ----------------------------------------------------------------------------------------------------------------*/

/* -------------------------------------------------- rouge (contact) --------------------------------------------------*/
#cadre #cadre_rouge h2 	{ margin: 0; padding: 25px 0 0 30px; font-size: 0.9em; color: #ea0f0f; }
/* images */
#cadre_rouge 			{ position: relative; border: 2px solid #ea0f0f; }
#cadre_h_rouge 			{ background: url('./images/cadres/rouge/h.png'); height: 16px; border-bottom: 4px solid #ea0f0f; }

#cadre_rouge a			{ color: #ea0f0f; }
#cadre_rouge a:visited	{ text-decoration: none; border-bottom: 1px dotted #ea0f0f; }
/* ---------------------------------------------------------------------------------------------------------------------*/

.cadre 		{ margin: 20px auto 10px auto; width: 400px; padding: 15px 10px 15px 10px; background: url('./images/form.png'); border: 1px solid #800; }
label 		{ display: block; }

/* ------------------------------------------------------------------------------------------------ */
/* ---------------------------------------- div pr galerie ---------------------------------------- */
#creas {
	float: right;
	height: 400px;
	width: 500px;
	margin-right: 0;
	background: #222;
}

#vert #creas		{ border: 2px solid #81db21; 	border-top: none; }
#bleu #creas 	{ border: 2px solid #02c1ff; 	border-top: none; }
#jaune #creas	{ border: 2px solid #ffc001; 	border-top: none; }
#violet #creas	{ border: 2px solid #C082FF; 	border-top: none; }
/* ---------------------------------------------------------------------------------------- */
/* ---------------------------------------- footer ---------------------------------------- */
#footer {
	position: fixed;
	height: 41px;
	width: 100%;
	bottom: 0;
	text-align: right;
}

#foot_g{
	display: block;
	float: left;
	height: 41px;
	width: 282px;
	background: url('./images/foot_g.png');
}

#foot_d {
	position: absolute;
	height: 41px;
	width: 100%;
	bottom: 0;
	left: 282px;
	background: url('./images/foot_bg_z.png');
}

#logo {
	position: fixed;
	height: 126px;
	width: 269px;
	bottom: 0;
	left: 20px;
	background: url('./images/logo.png') no-repeat;
	cursor: pointer;
}

#footer p { margin: 17px 302px 0 0; padding: 0; font-size: 0.8em ;}
/* --------------------------------------------------------------------------------------- */