/* new.css */


/* Encadré par un fond uni... */
html {
   padding: 0px;
   margin: 0px; 

   background-color: #2a2555;
}

img {
    border: none;
}

/* ... le contenu est un cadre de taille fixe... */
#page {
   position: absolute;

   width: 60em;
   margin-left: -30em;

   height: 40em;
   margin-top: -20em;

   top: 50%;
   left: 50%;

   background-color: white;
   background-image: url('gradient.png');
   background-repeat: repeat-x;
   background-position: top;

   font-family: "HelveticaNeue-Light","HelveticaNeue",Helvetica,Arial,sans-serif;
   font-weight: 400;
}

/* ... centré verticalement et horizontalement... */

#contenu {
   margin: 1em;
}

/* ... avec un panneau gauche 1/3 ... */
#gauche {
   position: absolute;
   float: left;
   top: 0px;
   left: 0px;
   width: 24em;
   height: 100%;
}

#gauche #moai {
   margin-left: auto;
   margin-right: auto;
   width: 20em;

   margin-top: 5em; 
}

#gauche h1 {
   font-family: "HelveticaNeue-Light","HelveticaNeue",Helvetica,Arial,sans-serif;
   font-weight: 400;
   font-size: 2em;
   color: #92532a;
   text-align: center;
}

/* ... comportant un footer ... */
#gauche #footer {
   width: 24em;
   margin-left:  auto;
   margin-right: auto;
   text-align: center;
}

#gauche #footer ul li {
   display: inline;
   padding-left:  1em;
   padding-right: 1em;

   font-size: 0.8em;
}

li.sep {
   border-left: 1px solid #d03a15;
}


a {
   text-decoration: none;
   color: #2a2555;
}

a:hover {
   color: #d03a15;
}

/* ---------------------------------------------------------------------- */
/* ... et avec un panneau droit ... */
#droite {
   position: absolute;
   float: left;
   top: 0px;
   left: 24em;

   width: 36em;
   height: 100%;
}

#droite #header {
   display: block;
   text-align: left;

   margin-top: 3.5em;
   padding-bottom: 2em;
   margin-bottom: 1.3em;

   border-bottom: solid 0.2em #d03a15;
}


/* abstract */
#droite #abstract {
   text-align: right;
   font-family: Arno Pro Display, Times New Roman, Times, serif;
   font-size: 1.1em;
   color: #2a2555;

   margin-top: 3em;
   margin-right: 4em;
   margin-left: 1em;
}

#droite #abstract #sujets {
   font-style: italic;
   color:  #d03a15;
}

#droite #abstract #actu {
   padding-top: 1.5em;
   font-size: smaller;
}

#droite #mentions table {
   vertical-align: top;
}

#droite #mentions {
   text-align: right;
   font-family: Arno Pro Display, Times New Roman, Times, serif;
   font-size: smaller;
   color: #2a2555;

   margin-top: 1em;
   margin-right: 4em;
   margin-left: 1em;   
}

#droite #mentions h3 {
   font-family: "HelveticaNeue-Light","HelveticaNeue",Helvetica,Arial,sans-serif;
}

/* solutions */
#droite #solutions {
   position: absolute;
   bottom: 0px;
   right: 0px;

   width: 36em;
   height: 9em;

   margin-top: 2em;
   border-top: 0.25em solid #669fbf;

   font-family: Arno Pro Display, Times New Roman, Times, serif;
   font-size: 0.85em;
   color: #4a4a4a;
   text-align: center;
}

#droite #solutions #ici {
   padding-left: 2em;
   padding-right: 2em;
}

#droite #solutions i {
   color: #d03a15;
}

#droite #solutions a {
   color: #d03a15;
}