/********************************************
   GENERAL
********************************************/
html {font-size: 100%; }

body {
	font-family:"Trebuchet MS" Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	margin:0;
	padding:0;
	background:#000000;
	}

* {margin:0px;padding:0px;}
a:visited { text-decoration: underline}
a:link { text-decoration: underline}
a:hover { text-decoration: none}
h1 {font-size: 1.2em;margin: 1em 0 .3em 0;}
h2 {font-size: 1.2em; margin: 1em 0 .3em 0;}
p {font-size: .8em; margin: 0 1.3em 0 0;}

/********************************************
   CLASSES
********************************************/
.clear { clear:both;}
.bold  { font-weight:bold;}
.align-justify {text-align:justify;}
.align-center {text-align:center;}
.align-right {text-align:right;}
.float-left {float:left;}
.float-right {float:right;}

/********************************************
   BLOCKS
********************************************/
#wrapper{ width: 1024px; position:relative; margin-left:-512px;margin-top:0px; left: 50%; top:0px; background:#cc3366;}
#header { position:absolute; top:0px; left:0px; height: 100px; width:100%; background: url(design/header.jpg) no-repeat top left;}
#footer { position:absolute; bottom:0px; left:0px; height: 30px; width:100%;}
#navigation {position:absolute; top:100px; width:300px; padding: 0 0 0 0; }
#content { position:absolute; top:100px; left:304px;  width:720px; margin:0 20px 1px 0;}

.black { background:#000000  url(design/balck-bottom.jpg) no-repeat bottom; margin: 0 1.3em  0 0 ; color:#FFFFFF; padding: 0 0 1em 0;}
.black p {margin: 0 .8em 0 .8em;}
.black h2 {font-size: 1.2em; text-align:center;margin: 0;}
.black h3 {font-size: 1em; text-align:center; margin:1em 0 .6em 0;}
.black .nom {width:20%; float:left;}
.black .nom h3{font-size: 1.2em; text-align:center; margin:0;}
.black .nom a{ text-decoration:underline; color: #CCCCCC;}
.black .nom p{ text-align:justify;font-size: .6em;}
.black h1 {margin: 0 0 .3em 1em;}
.black-top { background:#000000 url(design/black-top.jpg) no-repeat top; height:27px; margin: 1em 1.3em 0 0 ;}
.black-bottom { background:#000000 url(design/black-bottom.jpg) no-repeat bottom;height:27px; margin: 0 1.3em 0 0 ;}
.black ul {list-style:none;}
.black ul li  {margin:1em 1em .5em 1em;}
.black ul li a {color:#CCCCCC;}
.black ul span {color:#FFFFFF; font-size:.8em;}
#black-gallery {		
	background: #000;
	min-height:89px;
	margin: 0 1.3em 0 0 ;
	padding: 0 4px 0 4px;
}

#black-gallery a h3{		
	color:#CCCCCC;
	text-decoration:underline;
}

#black-gallery a:hover h3{	
	color:#FFFFFF;
}
#black-gallery p {margin: 0 2em 0 1.2em; text-align:justify; padding-bottom: 1em;}

#black-gallery a img {		
	background: #000000 url(images/arrow.gif) 96% 50% no-repeat;
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
	text-decoration: none;
}

#black-gallery a:hover img {	
	background: #000000 url(images/arrow.gif) 96% 50% no-repeat;
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	opacity: 1;	
}

#black-gallery .current{		
	background: #000000 url(images/arrow.gif) 96% 50% no-repeat;
	filter: alpha(opacity=20);
	-moz-opacity: 0.2;
	opacity: 0.2;
}
/********************************************
   MENU
********************************************/
.menu { width:100%; background: url(design/menu.jpg) repeat-y top; color:#010510; margin: 1em 0 0 0;}
.menu h2 {font-size: .9em; font-weight:bold; color:#CCCCCC; text-align:center;}

.menu ul  { margin:.2em 0 .5em 1em; list-style:none; }
.menu li a{ color:#010510; text-decoration:underline;}
.menu li a:hover, .menu li .current { font-weight:bold; }
.menu span {font-size: .7em; margin: 0 .5em 0 .5em; text-align:justify;text-decoration:none;}
.menu p {color:#010510; font-size: .7em; margin: 0 .5em 0 .5em; text-align:justify;text-decoration:none; }
.menu  .preditavi {clear : both; text-align:right; font-size:.6em; margin: 0 .8em 0 0;}
.menu .preditavi a{color:#000000;}


/********************************************
   NUMERO/SMS
********************************************/
.numero{
	font-family:"Arial Black";
	font-size: 3.5em;
	color:#FF80C0;
	font-style:italic;
	text-align:center;
	margin: 0 0 0 0;
	text-align:center;
}



.numero .prefixe {
	font-family:"Arial Black";
	font-style:italic;
	font-size: .7em;
	color:#FFFFFF;
}

.ch-be{
	font-family:"Arial";
	font-weight:bold;
	font-size: 1.6em;
	text-align: center;
	margin: .5em 0 0 0; 
	color:#FFFFFF;
}

.ch-be .comment{
	font-size: .5em;
	margin-right:20px;
}
#stop {text-align:center; margin-top: 1em;}

#sms {
	color:#FFBE02;
	font-style:italic;
	font-family:"Arial Black";
	font-size:25px;
	text-align:center;
	margin: 15px 0 0 0;
}

#sms .small {
	font-family:"Arial";
	font-size:12px;
	font-style:normal;
	color:#DDD;
}

#sms .blanc {
	font-size:18px;
	color:#DDD;
}

.commentaire {text-align:center; font-size:.6em; margin: 0 0 0 0; color:#FFFFFF; font-weight:normal;}

/********************************************
   FORM
********************************************/
form {
	margin: 0 0 0 10px ; 
	padding: 0 5px;
	border: 1px solid #f2f2f2;
	background-color: #FFFFFF; 
	font-size: 0.9em;
	text-align:left;
	width: 670px;
	color:#000000;
}

fieldset {
	background-color: #FFFFFF;
	margin: 0 0 1em 0;
}

legend {
	margin: 0 0 0 2em;
}

label {
	font-weight:bold;
	margin: 1em 0 0 5em;
}
input {
	border:1px solid #CCCCCC;
	font: normal 1em Verdana, sans-serif;
	color:#777;
}

#nom{ margin:1em 0 0 4.3em;}
#email{ margin:1em 0 0 0.4em;}
#autres{ margin:1em 0 1em 7.5em;}
#sujet{ margin:1em 0 0 1.7em;}
#corps{ margin: 0 0 0 5em;}
#code{ margin:0 0 2em 1.7em;}

textarea {
	font: normal 1em Verdana, sans-serif;
	border:1px solid #CCCCCC;
	width:35em; 
	background:url(design/) repeat-y #FFFFFF;
	height:8em;
	color:#777;
}
input.button { 
	font: bold 12px Arial, Sans-serif; 
	height: 24px;
	margin-left: 7em;
	padding: 2px 3px; 
	color: #FFF;
	background: #010510 url(images/button-bg.jpg) repeat-x 0 0;
	border: none;
}

.alert {
	font-weight:bold;
	color:#FF0000;
	margin: 0 10px 0 10px;
}

.crypto {
	text-align:center;
}

/********************************************
   Gallerie
********************************************/
#scrollbox {
	position: absolute;
	top: 495px;
	left:290px;
	width:400px; 
	height:170px; 
	overflow:auto;  
}

.thumbs-left {
	float:left;
	text-align:left;
	background: #FAFAFA;
   	border: 1px solid #E5E5E5;
	padding: 4px;
	margin: 5px;
	
}

#thumbs {
	width:1200px; 
	height:80px;
	text-align:left;
}
.thumbs-contour{
	float:left;	
	background: #FAFAFA;
   	border: 1px solid #E5E5E5;
	padding: 4px;
	margin: 5px;
}
.contour-clair{
	background: #FAFAFA;
   	border: 1px solid #E5E5E5;
	padding: 4px;
	margin: 5px;
}

#intro {
	position: absolute;
	top: 240px;
	left:20px;
	width:660px; 
	height:50px; 
	text-align:justify;
}

#look {
	position: absolute;
	top: 605px;
	left:15px;
	width:256px; 
	height:61px;
	background: url(design/look.gif) no-repeat; 

}

#icra {text-align: center; margin-top: 30px;}

/*Promo*/
.promo {text-align: center;border:1px #000 solid; margin: 10px auto; padding: 4px; -moz-border-radius:10px; -webkit-border-radius:10px;background:#fffbf4; color:#000; width: 270px;}
.promo-num {font-size: 20px; letter-spacing: -1px; margin: 5px 0 5px 0; font-family:"Arial Black";}
.promo-num img { vertical-align: middle; margin:0 5px 5px 0;  }
.bold{font-weight:bold;}