body {
  background-color: #000000;
  padding: 0px;
  margin: 0px;
  text-align: center;
  font-family: arial;
  font-size: 11px;
}

#container {
  position: relative;
  background-color: #fafafa;
  width: 960px;
  margin: 5px auto 0px auto;
  text-align: left;
}

/* ----- header ----- */

#header {
  height: 102px;
}

#bandeau {
  background: url(images/fond_nok.jpg);
  height: 60px;
  color: #ffffff;
  border-bottom: 1px solid #000000;
  margin: 0px 0px 0px 0px;
}

#bandeau a.logo {
  line-height: 60px;
  font-family: arial;
  font-size: 27px;
  font-weight: bold;
  color: #ffffff;
  text-decoration: none;
  margin: 0px 0px 0px 20px;
}

#bandeau a.contact {
  position: absolute;
  top: 12px;
  right: 7px;
  width: 65px;
  font-family: arial;
  font-size: 11px;
  color: #ffffff;
  text-decoration: none;
  font-weight: normal;
}

#bandeau a.drapeau {
  position: absolute;
  top: 33px;
  right: 7px;
  width: 65px;
  font-family: arial;
  font-size: 11px;
  color: #ffffff;
  text-decoration: none;
  font-weight: normal;
}

#bandeau a.contact img {
  border-style: solid;
  border-width: 1px;
  border-color: #444444;
}

#bandeau a.drapeau img {
  border-style: solid;
  border-width: 1px;
  border-color: #444444;
}

#bandeau a.contact:hover, #bandeau a.drapeau:hover {
  text-decoration: underline;
}

#topnav {
  margin: 0px 0px 0px 0px;
}

#topnav a {
  display: block;
  float: left;
  width: 160px;
  height: 20px;
  line-height: 20px;
  margin: 0px 0px 0px 0px;
  color: #ffffff;
  font-size: 13px;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
}

#topnav a:hover {
  color: #333333;
}

#header .nok {
  background-color: #E99F3C;
}

#header .akan {
  background-color: #C68B49;
}

#header .sao {
  background-color: #9F5820;
}

#header .koma {
  background-color: #9C855C;
}

#header .djenne {
  background-color: #BAAB8A;
}

#header .bura {
  background-color: #BC935B;
}

#subnav {
  clear: both;
}

#subnav a {
  height: 20px;
  line-height: 20px;
  margin: 0px 0px 0px 0px;
  color: #ffffff;
  font-family: verdana,arial;
  font-size: 10px;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
  padding: 0px 10px 0px 20px;
}

#subnav a:hover {
  color: #333333;
}

/* ----- corps général ----- */

#corps {
  position: relative;
  min-height: 300px;
  _height: 300px;
  background-color: #fafafa;
  padding: 0px 0px 0px 0px;
}

#corps h1 {
  font-family: verdana,arial;
  font-size: 15px;
  font-weight: bold;
  color: #333333;
  margin: 20px 20px 5px 30px;
}

#corps h2 {
  font-family: verdana,arial;
  font-size: 11px;
  font-weight: bold;
  color: #333333;
  margin: 12px 20px 12px 30px;
}

#corps p {
  margin: 12px 20px 12px 30px;
  font-family: verdana,arial;
  font-size: 11px;
  color: #333333;
  line-height: 1.4em;
  /*clear: left;*/
}

#corps ul {
  margin: 0px;
  padding: 0px;
}

#corps li {
  margin: 12px 20px 12px 45px;
  font-family: verdana,arial;
  font-size: 11px;
  color: #333333;
  line-height: 1.4em;
  clear: left;
  list-style: disc;
}

#corps a {
  font-family: verdana,arial;
  font-size: 11px;
  color: #333333;
  text-decoration: underline;
}

#corps a:hover {
  text-decoration: none;
}

#corps strong {
  color: #ff0000;
}

#corps #col {
  float: left;
  margin: 0px 0px 15px 0px;
  width: 470px;
}

#corps #col img {
  margin: 5px 10px 5px 10px;
}

#corps #col img.left {
  float: left;
  margin: 3px 18px 5px 0px;
  /*border: 1px solid #555555;*/
}

#corps #col img.right {
  float: right;
  margin: 3px 0px 5px 15px;
  /*border: 1px solid #555555;*/
}

#corps #col img.center {
  text-align: center;
  margin: 3px 30px 5px 30px;
  /*border: 1px solid #555555;*/
}


/* ----- Vidéo ----- */

#video {
  margin: 20px 0px 0px 0px;
  text-align: center;
}


/* ----- Galerie ----- */

#corps #galerie {
  margin: 0px 0px 0px 0px;
  text-align: center;
}

#corps #galerie a {
  position: relative;
  display: block;
  float: left;
  width: 144px;
  height: 190px;
  margin: 10px 20px 10px 20px;
  text-align: center;
  text-decoration: none;
  color: #333333;
  font-size: 10px;
}

#corps #galerie a img {
  width: 100px;
  height: 133px;
  margin: 0px 0px 5px 0px;
  border: 1px solid #555555;
}

#corps #galerie a:hover img {
  border: 1px solid #ffffff;
}

#corps #galerie a .vendu {
  position: absolute;
  top: 30px;
  left: 0px;
  width: 144px;
  height: 73px;
  border: 0px;
}

#corps #galerie a:hover .vendu {
  border: 0px;
}

/* ----- Cadre ----- */

#cadre {
  float: right;
  width: 170px;
  margin: 0px 30px 20px 20px;
  _margin: 0px 20px 20px 20px;
  padding: 0px 0px 3px 0px;
  border: 1px solid #555555;
}

#cadre h1 {
  background-color: #333333;
  color: #ffffff;
  font-size: 11px;
  margin: 0px 0px 10px 0px;
  padding: 3px 10px 3px 10px;
}

#cadre p {
  margin: 10px 10px 10px 10px;
}


/* ----- Fiche ----- */

#corps #vignettes {
  position: absolute;
  top: 25px;
  left: 450px;
  width: 100px;
}

#corps #vignettes a img {
  display: block;
  width: 83px;
  height: 110px;
  margin: 0px 0px 18px 0px;
  border: 1px solid #555555;
}

#corps #vignettes a:hover img {
  border: 1px solid #ffffff;
}

#corps #spacer {
  width: 1px;
  height: 550px;
}

#corps #zoom {
  position: absolute;
  top: 25px;
  left: 555px;
}

#corps #zoom img {
  border: 1px solid #555555;
}

#corps #texte {
  position: absolute;
  top: 5px;
  left: 0px;
  width: 440px;
   height: 550px;
  _height: 550px;
}

#corps #precsuiv {
  position: absolute;
  top: 510px;
  left: 0px;
  width: 450px;
}

#corps #precsuiv a.gauche {
  position: absolute;
  left: 30px;
}

#corps #precsuiv a.droite {
  position: absolute;
  right: 30px;
}


/* ----- Galerie amis ----- */

#corps #galerie-amis {
  margin: 0px 0px 0px 30px;
  text-align: center;
}

#corps #galerie-amis div {
  display: block;
  float: left;
  width: 435px;
  height: 252px;
  margin: 10px 20px 10px 0px;
  border: 1px solid #555555;
  text-decoration: none;
  color: #333333;
  font-size: 10px;
}

#corps #galerie-amis div img {
  margin: 10px 10px 0px 10px;
  border: 1px solid #555555;
  float: left;
}

#corps #galerie-amis div p {
  margin: 9px 10px 1px 0px;
  text-align: left;
  clear: none;
}


/* ----- Reportage ----- */

#reportage {
  display: table;
  text-align: center;
  margin: 0px 10px 10px 10px;
  padding: 0px 0px 1px 0px;
}

#reportage a {
  display: table-cell;
  float: left;
  width: 170px;
  height: 170px;
  margin: 7px;
  text-align: center;
  vertical-align: middle;
  border-style: solid;
  border-width: 1px;
  border-color: #555555;
}

#reportage a:hover {
  background-color: #ffffff;
  border-color: #e99f3c;
}

#reportage a img.h {
  position: relative;
  margin: 30px 12px 30px 11px;
  width: 147px;
  height: 110px;
}

#reportage a img.v {
  position: relative;
  margin: 12px 30px 11px 30px;
  width: 110px;
  height: 147px;
}

.modalDialog_transparentDivs {
	filter:alpha(opacity=80);	/* Transparency */
	opacity:0.8;	/* Transparency */
	background-color:#ffffff;
	z-index:1;
	position:absolute; /* Always needed	*/
}

.modalDialog_contentDiv {
	border:1px solid #000000;
	padding:0px;
	z-index:100;/* Always needed	*/
	position:absolute;	/* Always needed	*/
	background-color:#ffffff;	/* White background color for the message */
}

.modalDialog_contentDiv img {
  border: none;
}

.modalDialog_contentDiv_shadow {
	z-index:90;/* Always needed	- to make it appear below the message */
	position:absolute;	/* Always needed	*/
	background-color:#555555;
	filter:alpha(opacity=30);	/* Transparency */
	opacity:0.3;	/* Transparency */
}


/* ----- Formulaires ----- */

#corps form {
  margin: 10px 0px 20px 30px;
}

#corps form fieldset {
  padding: 0px 10px 10px 10px;
  _padding: 0px 10px 10px 10px;
  width: 400px;
}

#corps form legend {
  font-family: verdana,arial;
  font-size: 11px;
  color: #333333;
  _margin: 0px 0px 10px 0px;
}

#corps form p {
  margin: 12px 0px 12px 0px;
}

#corps form th {
  font-family: verdana,arial;
  font-size: 11px;
  color: #333333;
  font-weight: normal;
  line-height: 1.4em;
  text-align: left;
  vertical-align: top;
  padding: 5px 5px 3px 5px;
}

#corps form td {
  font-family: verdana,arial;
  font-size: 11px;
  color: #333333;
  line-height: 1.4em;
  vertical-align: top;
  padding: 3px 5px 3px 5px;
}

#corps input, #corps textarea {
  font-family: verdana,arial;
  font-size: 11px;
  color: #333333;
}

#corps .erreur {
  color: #ff0000;
  font-weight: bold;
  text-align: center;
}

#corps .noerreur {
  color: #00bb1b;
  font-weight: bold;
  text-align: center;
}


/* ----- Footer ----- */

#footer {
  background: url(images/fond_nok.jpg);
  clear: left;
  height: 25px;
  line-height: 25px;
  margin: 0px 0px 0px 0px;
  font-family: verdana,arial;
  font-size: 10px;
  color: #ffffff;
  padding: 0px 0px 0px 10px;
  border-top: 1px solid #000000;
  border-bottom: 5px solid #000000;
}

#footer a {
  font-family: verdana,arial;
  font-size: 10px;
  color: #ffffff;
  text-decoration: none;
}

#footer a:hover {
  text-decoration: underline;
}