/* layout */
#logo { margin: 20px 0pt 0pt -35px; }

#wrapper {
    background: white url('images/bg.jpg') no-repeat scroll 0 117px;
}

#content {
}

#content p {
  line-height: 1.7em;
  margin-bottom: 1em;
}

.col12 { margin: 0pt 15px 0pt 0pt; float: left; width: 585px; }

#footer p a { color: rgb(102, 102, 102); }

/* liens */
a:hover { color: #1b387a; }


/* titres */
h1 {
    color: black;
    font-weight: bold;
}

h2 {
    margin-bottom: 0.6em;
    font-size: 1.5em;
}


/* tables */
table {
    width: 100%;
}

.dc td, .dc th {
    padding: 0 1em 1em 0;
    text-align: right;
}

.dc td {
    text-align: left;
    vertical-align: none;
}

/* listes */
ul {
    margin-left: 0;
}

/* forms */
input, textarea {
    border: 1px solid #999;
    padding: 0.4em;
    font-size: 100%;
}

textarea {
    font-family: Lucida Grande,Lucida Sans Unicode,Bitstream Vera Sans,Geneva,Helvetica,Arial,sans-serif;
}

/* questions */
#question {
    width: 580px; /* 785 (largeur content) - 170 (taille camenbert) - 20 (marge) */
}

#question h2 {
    margin-top: 2em;
    font-size: 160%;
}

#question h2.question-longue {
    font-size: 130%;
}

#question #progression {
    position: absolute;
    right: 0;
    top: 64px;
    
    margin-left: 3em;
    margin-top: -3em;
}

.reponses {
    font-size: 115%;
}

ul.reponses {
    margin-left: 1em;
}

ul.reponses li {
    padding: 0.4em 0.5em;
}

ul.reponses li.subline {
    border-top: 1px solid rgb(234, 234, 234);
}

ul.reponses li>a:hover {
    text-decoration: none;
}

ul.reponses li:hover {
    background-color: #FEF3B8;
}

ul.reponses li:hover a {
    color: #1B387A;
}

/* divertissments */
.divertissement {
    font-weight: bold;
}

.divertissements {
    border-bottom: 1px solid rgb(214, 214, 214);
    margin-bottom: 1em;
}

/* captcha */
#guessit {
    margin-bottom: 2em;
}

#guessit img {
    margin: 2em 0;
}

/* flashes */
div.flash_note, div.flash_error {
    margin-top: 1em;
    padding-bottom: 1em;
}

div.flash_note h1, div.flash_error h1 {
    margin-top: 0em;
}

/* boite page accueil */
.rbox {
    margin-top: 4em;
}

/* commentaire */
#commentaire {
    margin: 1.5em 0;
    padding: 1em;
    background-color: #eee;
    font-size: 90%;
}
 
#commentaire h2 {
    margin: 0 0 0.3em 0;
    font-size: 14px
}
 
#commentaire textarea {
    width: 100%;
}
 
#appear_link {
    position: absolute;
    top: 240px;
    right: 0px;
    width: 170px;
    text-align: center;
}

#appear_link a {
    font-weight: normal;
    font-size: 96%;
    color: #999;
}

/* menu */
#nav {
	margin: -15px 0 0 525px;
	width: 22em;
}

#nav a { 
  margin-right: 1em;
  width: 9em;
}

#nav a { background-color: #A3C2DE; }
#nav a:hover { background-color: #4978AC; color: rgb(255, 255, 255); }


.image-deco {
    float: right;
    margin: 0 0 1em 8px;
}

sup {
	vertical-align: baseline;
	font-size: 0.8em;
	position: relative;
	top: -0.4em;
}

/* Rapport */
.rapport {
  margin-bottom: 3em;
}

.rapport div.col1 {
}

.rapport h3 {
  margin: 0;
  font-size: 1.2em;
}

.rapport img#spider {
  margin: 2em 0 2em 0;
  border: 2px solid #AAA;
}

.rapport .competence {
  margin-bottom: 1.5em;
}

.rapport .competence p {
  margin-bottom: 0 !important;
}

.rapport p.commentaire {
  font-weight: bold;
  color: #050;
}

.rapport p.pasdaccord {
  float: right;
  font-size: 90%;
  margin: 0.5em;
  text-align: right;
}

.rapport .competence .selfevaluation {
  margin: 1.5em 0 2em 0;
  padding: 1em;
  border: 4px solid #FAA;
}




/* deprecated 
.rapport .resultat-0 {
  background-color: #F00;
}

.rapport .resultat-1 {
  background-color: #F60;
}

.rapport .resultat-2 {
  background-color: #CF3;
}

.rapport .resultat-3 {
  background-color: #6F0;
}








/* Compteur */
#compteur {
  position: absolute;
  top: -125px;
  left: 460px;
  width: 200px;

  font-size: 1.3em;
  font-weight: bold;
}


#compteur .no, #compteur .inscrits {
  display: block;
  float: left;
  width: 92px;
  height: 66px;
  padding-top: 14px;
}

#compteur .no {
  background: transparent url('images/etoile.png') no-repeat scroll 8px 0px;

  padding-right: 2px;
  color: white;
  text-align: center;
}

#compteur .inscrits {
  color: grey;
}