/* test */
html, body {
    height: 100%;
    text-align: center;
    margin: 0px;
    padding: 0px;
}

html {
    overflow-x: auto;
    overflow-y: scroll;
    font-size: 100%;
    font-family: Arial, sans-serif;
}

body {
    line-height: 1.4em;
    top: 0px;
    background-color: #D0D0D0;
    font-family: Lucida Grande,Lucida Sans Unicode,Arial,Verdana,sans-serif;
    font-size: 12px;
    text-align: center;
    color: #666666;
}

blockquote {
    margin: 0 0 0 2em;
    text-align: left;
}

input[type=text], input[type=password], textarea {
    background: #FFFFFF url(../img/bg-field.gif) no-repeat scroll 0 0;
    padding: 2px;
    border: 1px solid #888;
}

input[type=text]:focus, input[type=password]:focus, textarea:focus {
    border: 1px solid #F80;
    background: #FFFFFF url(../img/bg-field.gif) no-repeat scroll -1px -1px;
}

#wrapper {
    position: relative;
    background: #FFFFFF url(../img/background.jpg) repeat-x scroll top center;
}

#wrapper_accueil {
    position: relative;
    background: #FFFFFF url(../img/background-accueil.jpg) repeat-x scroll top center;
}

#wrapper_references {
    position: relative;
    background: #FFFFFF url(../img/background-ref.jpg) repeat-x scroll top center;
}

.spacer {
    clear: both;
}

.spacing {
    clear: both;
    height: 2em;
}

.displaynone {
    display: none;
}

.general {
    top: 0px;
    left: 0;
    right: 0;
}

.general, #footer, #header, .content_haut_accueil, .content_haut_int, .content_haut_ref, .content_ref, .content_haut_admin, .content_accueil, .content, .content_admin, .content_404, .content_int, #menu {
    width: 952px;
}

.general, #footer {
    position: relative;
    margin: 0 auto;
}

#footer {
    left: 0;
}

#w3cvalid {
    position: absolute;
    left: 0;
    margin-left: 500px;
    right: 0;
    margin: 0 auto;
}

#footer_wrapper {
    height: 130px;
    position: relative;
    background-image: url(../img/footer-1.jpg);
    background-repeat: repeat;
    width: 100%;
    font-size: 80%;
    padding: 10px 0px 0px 0px;
    float: left;
}

.postit {
    position: absolute;
    z-index: 7;
    margin: 0 0 0 772px;
    left: 0;
}

#header {
    position: absolute;
    background-image: url(../img/header3.jpg);
    left: 0px;
    top: 0px;
    height: 185px;
}

.logo {
    position: absolute;
    width: 256px;
    height: 73px;
    top: 23px;
    left: 355px;
}

.logo img {
    border: none;
}

.content_haut_accueil {
    background: url(../img/header_2_accueil.png) center bottom;
    background-repeat: no-repeat;
    text-align: center;
    left: 0px;
    height: 363px;
    overflow: hidden;
    padding: 185px 0 0 0;
}

.image_accueil {
    margin-left: auto;
    margin-right: auto;
    left: 90px;
    top: 290px;
    position: absolute;
    font-size: 0;
    line-height: 0;
}

.image_accueil a {
    display: block;
    float: left;
    margin: 0;
    padding: 0;
    font-size: 0;
    line-height: 0;
}

.creation-site {
    margin-left: auto;
    margin-right: auto;
    width: 800px;
    left: 80px;
    top: 220px;
    position: absolute;
}

.content_haut_int {
    background: transparent url(../img/bloc_orange_03.jpg) no-repeat scroll 0 184px;
    background-repeat: no-repeat;
    text-align: justify;
    left: 0px;
    height: 197px;
    overflow: hidden;
    padding: 185px 0 0 0;
}

.content_haut_ref {
    text-align: justify;
    left: 0px;
    height: 317px;
    position: relative; /* pour overflow hidden sous IE */
    overflow: hidden;
    padding: 185px 0 0 0;
    margin: 0 0 3px 0;
}

.content_ref {
    background-repeat: no-repeat;
    text-align: justify;
    left: 0px;
    top: 505px;
    margin: 0 0 0 0;
}

.content_haut_admin {
    background: url(../img/bloc_orange_03.jpg) center bottom;
    position: relative;
    background-repeat: no-repeat;
    text-align: justify;
    left: 0px;
    height: 234px;
    overflow: hidden;
    padding: 148px 0 0 0;
}

.content_accueil {
    background-repeat: no-repeat;
    text-align: left;
    left: 0px;
    top: 550px;
    margin: 0 0 0 0;
}

.content {
    background-repeat: no-repeat;
    text-align: left;
    left: 0px;
    top: 450px;
    height: 348px;
    margin: 0 0 0 0;
}

.content_admin {
    background-repeat: no-repeat;
    text-align: left;
    left: 0px;
    top: 380px;
    margin: 0 0 0 0;
}

.content_404 {
    background: #ffffff url(../img/header_2_404.jpg) center top;
    background-repeat: no-repeat;
    text-align: left;
    left: 0px;
    top: 185px;
    height: auto;
    margin: 0 0 0 0;
    padding: 6px 0 0 0;
}

.bloc_bas {
    width: 420px;
    top: 200px;
    margin: 0 0 20px 0;
    overflow: hidden;
}

.conteneur_pictos {
    width: 900px;
    height: 150px;
    margin: 0;
}

.bloc_pictos {
    text-align: left;
    width: 840px;
    height: 104px;
    top: 150px;
    padding: 30px;
    overflow: hidden;
    float: left;
}

.bloc_perso {
    vertical-align: bottom;
    width: 700px;
    height: 192px;
    top: 180px;
    margin: 30px;
    overflow: hidden;
    float: left;
}

.pictos {
    position: relative;
    color: #FFFFFF;
    display: block;
    padding-left: 30px;
    padding-right: 30px;
    float: left;
    height: auto;
    width: 100px;
    margin-left: 10px;
    float: left;
    text-align: center;
}
.content_haut_admin .pictos {
    padding: 0px;
    height: auto;
    margin: 0px;
}

.pictos a {
    text-decoration: none;
    display: block;
    margin: 0px;
    color: #FFFFFF;
    font-weight: bold;
    width: 100px
}

.bloc_actu {
    position: relative;
    width: 420px;
    margin: 0 0 20px 0;
    overflow: hidden;
}

.picto {
    float: left;
    width: 95px;
    text-align: right;
}


.picto_droit {
    float: left;
    width: 120px;
    text-align: right;
}

.titre_bas {
    margin-left: 0;
    margin-bottom: 5px;
    margin-right: 0;
    margin-top: 0;
    font-style: normal;
    font-weight: normal;
    color: #ff6600;
    font-size: 15px;
}

.bloc_texte {
    text-align: left;
    float: left;
    width: 320px;
    margin: 5px 0 0 5px;
}

.portrait {
    float: left;
    width: 150px;
    text-align: right;
}
.bloc_texte_equipe {
    text-align: left;
    float: left;
    width: 250px;
    margin: 5px 0 0 5px;
}

.texte_actu {
    float: left;
    margin: 5px 0 0 5px;
    width: 95%;
}

.rss_lien {
    height: 60px;
    float: right;
    margin-left: 50px;
    margin-top: 24px;
}

.rss_lien img {
    float: left;
}

.rss_lien a {
    text-decoration: underline;
    color: #FF6600;
}

.rss_lien span {
    padding: 3px;
    float: left;
}

.orange {
    position: relative;
    color: #ff6600;
    font-family: "Lucida Grande", verdana, arial;
    font-size: 16px;
    font-style: italic ;
    margin: 0 0 0 10px;
    height: 49px;
    width: 420px;
    float: left;
}

.orange h1 {
    background: url(../img/phrase.jpg) no-repeat;
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    text-indent: -9999px;
}

.content_int {
    background-repeat: no-repeat;
    text-align: justify;
    left: 0px;
    margin: 0 0 0 0;
}

.content a img {
    border: 0px;
}

#menu {
    position: absolute;
    text-align: center;
    height: 38px;
    margin: 0 0 0 0;
    float: left;
    top: 147px;
    left: 0;
    font-size: 13px;
    color: #375CB4;
    font-weight: normal;
    padding: 0 0 0 0;
}

#test {
    margin: 0 0 0 70px;
}

#menu ul {
    padding: 0;
    margin: 0 0 0 0;
    list-style-type: none;
    float: left;
    display: inline;
}

#menu li {
    float: left; /* pour IE*/
    display: inline; /* pour IE6 */
    color: #000000;
    height: 38px;
    text-shadow: 0 -1px 0 #DD6600;
}

#menu li a {
    outline: none;
    padding: 9px 7px 0px 7px;
}

#menu li a:hover {
    background: url(../img/menu_hover.gif) repeat-x 0 0 !important;
    color: #000;
    text-shadow: 0 1px 0 #FFFFFF;
}

#menu li a:active {
    background: url(../img/menu_clic.gif) repeat-x 0 0 !important;
    color: #000;
    text-shadow: 0 1px 0 #FFFFFF;
    padding: 10px 7px 0px 7px;
}

#menu li a:focus {
    background: url(../img/menu.gif) repeat-x 0 0;
    color: #000;
    text-shadow: 0 1px 0 #FFFFFF;
}

#menu li#active {
    background: url(../img/menu.gif) repeat-x 0 0;
    color: #000;
    text-shadow: 0 1px 0 #FFFFFF;
}

ul li a {
    text-decoration: none;
    color: #fff;
    height: 34px;
    display: block;
    padding: 7px;
    float: left;
    width: 89px;
}

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

ul li#active a {
    text-decoration: none;
    color: #000;
}


.pl_menu {
    margin: 0;
    display: inline;
}

.pl_menu_decale {
    margin: 0 0 0 128px;
}

.contenu {
    position: relative;
    width: 927px;
    float: left;
    margin: 30px 10px 30px 10px;
}

.contenu_gauche {
    width: 420px;
    float: left;
    margin-right: 52px;
}

.contenu_droit {
    width: 420px;
    float: left;
}

.col_gauche {
    width: 420px;
    float: left;
    margin-right: 56px;
    padding: 0 0 0 20px;
}

.col_droit {
    width: 420px;
    float: left;
}

.col_right {
    width: 420px;
    float: right;
    margin-right: 31px;
}

.no_border {
    border: none;
}

.date {
    vertical-align: top;
    width: 45px;
    color: white;
    font-weight: bold;
}

h2 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    color: #707173;
}

h3 {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-weight: bold;
    color: #E36929;
    background: url(../img/soulignement.gif) left bottom;
    background-repeat: no-repeat;
}

/* ADMIN */
.form-authentification p, .content_admin p {
    height: 30px;
}

.form-authentification input, .content_admin input, .content_admin textarea {
    float: left;
}

.form-authentification label, .content_admin label {
    float: left;
    clear: both;
    width: 150px;
}

.content_admin ul li {
    clear:both;
}
.content_admin ul li a {
    float:left;
    width:auto;
    height:auto;
}
.content_admin ul li.sortable_item {
    display:block;
    cursor:move;
}
.content_admin ul li.sortable_item .title_ref {
    display:block;
    width:300px;
    background-color:#ffd782;
}
.content_admin ul li.start .title_ref {
    background-color:#FFAB18;
    color:#fff;
}
.content_admin ul li.sortable_item .title_ref:hover {
    background-color:#ffab18;
    color:#fff;
}
.content_admin a {
    color: #666666;
}

.content_admin table {
    border: 1px solid #666666;
    margin: 10px;
}

.content_admin table td , .content_admin table th {
    border: 1px solid #666666;
    padding: 5px;
}

.content_admin table tr.head td {
    font-weight: bold;
    text-align: center;
}

.content_admin table tr td.td_centre {
    text-align: center;
}

.content_gauche_relay {
    position: absolute;
    background-repeat: no-repeat;
    text-align: left;
    left: 0px;
    top: 185px;
    height: auto;
    width: 230px;
    margin: 0 0 0 0;
    padding: 50px 0 0 0;
}

.content_relay {
    position: absolute;
    background: #ffffff url(../img/header_2_404.jpg) no-repeat -230px top;
    background-color: #fff;
    text-align: justify;
    left: 230px;
    top: 185px;
    width: 700px;
    margin: 0 0 0 0;
    padding: 50px 0 0 0;
}

.titre-page {
    margin-top: 20px;
    height: 90px;
    width: 600px;
    left: 0;
}

a {
    text-decoration: underline;
    color: #FF6600;
}

/* image en reference dans le header orange */
.ref-header {
    margin: 10px 0 0 585px;
    position: absolute;
    z-index: 5;
    left: 0;
    background: transparent url(../img/header-references/blankref.png) no-repeat scroll 0 0;
    width: 400px;
    height: 229px;
}

.ref-appear {
    margin: 18px 0 0 67px;
}

.imagerss {
    vertical-align: middle;
    position: relative;
    top: 1px;
}

.detail_reference {
    width: 100%;
    padding: 2em 0 0 0;
    min-height:250px;
    height: auto !important;
    height: 250px;
    background: transparent url(../img/bg_screencast.png) no-repeat scroll 496px 2em;
}

/* Formulaire de contact */
#commentForm {
    width: 450px;
    float: left;
}
ul.form {
    list-style: none;
    padding: 0;
    margin: 0 auto;
    width: 420px;
    border: 0;
}
ul.form li {
    border-bottom: 1px dashed #AAA;
    padding: 6px 0;
    height: 35px;
}
.form_head {
    height: 20px;
    width: 400px;
    color: #aaa;
    text-align: center;
    border-bottom: 0 !important;
}
ul.form li label {
    display: block;
    float: left;
    width: 160px;
}
.required {
    display: block;
    width: 160px;
    float: left;
}

.required_field {
    position: absolute;
    font-size: 10px;
    left: 0;
    margin: 2em 0 0 120px;
}

ul.form li input.input, ul.form li select, ul.form li textarea {
    width: 250px;
}
#comment {
    width: 250px;
    margin: 0 0 0 160px;
}
ul.form li textarea {
    height: 90px;
    width: 340px;
}
ul.form li.comment .required, ul.form li.comment label {
    width: 120px;
}
ul.form li.why {
    height: 80px !important;
}
ul.form li.why2 {
    height: 130px !important;
}
ul.form li.comments {
    height: 130px !important;
    border: none;
}
ul.form li.submit {
    border: none;
    text-align: right;
    padding-right: 3px;
}
.valid {
    border: 1px solid #0A0 !important;
}
.invalid {
    border: 2px solid #B00 !important;
}
.error {
    color: red;
    font-weight: bold;
}

.formDroite {
    float: left;
    text-align: center;
    width: 300px;
    padding: 50px 0 0 82px;
}
.formDroite div {
    text-align: left;
    height: 50px;
    color: #FF6600;
}
.formDroite div p {
    display: none;
}

.formDroiteRecru {
    float: left;
    width: 300px;
    padding: 50px 0 0 50px;
}

/* Page plan et directions */
.planGauche {
    float: left;
    padding: 0 2em 0 0;
}
.planDroite {
    float: left;
    width: 400px;
}

.whois_results {
    margin: 0 0 0 100px;
    text-align: left;
}

.whois_results dt, 
.whois_results dd {
    position: absolute;
    white-space: nowrap;
}
.whois_results dd {
    margin-left: 80px;
    font-weight: bold;
}
.whois_results dl {
    clear: both;
    width: 800px;
    height: 2.8em;
}

.whois_detail {
    background: #FFF;
    color: #000;
    font-family: Courier New;
    border: 1px solid #888;
    display: none;
    padding: 0 1em;
    width: 700px;
}

.outils {
    padding: 0 0 0 20px;
}

.genpasswd {
    position: absolute;
    top: 0;
    left: 0;
    margin: 2em 0 0 496px;
    width: 420px;
}

/* css qui est utilisée seulement pour les personnes ayant javascript d'activé */
.hasJS .content_int .contenu, .hasJS .content_accueil .contenu, .hasJS .content_ref .contenu, .hasJS .titre-page, .hasJS .ref-appear, .hasJS .detail_reference {
    display: none;
}

/* barre proposant la mise à niveau du navigateur pour ceux qui utilisent encore IE6 */
#popupie6 {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 30px;
    z-index: 9999;
    font-size: 14px;
    font-weight: bold;
    color: #000;
    background: #FAEBA8;
    padding: 10px 0;
    border-style: ridge;
    border-width: 0 0 2px 0;
}

#popupie6 span {
    font-weight: normal;
}

/* je fais sauter cette classe en onload, donc le curseur wait disparait quand le chargement est termine */
.hasJSwait body div {
    cursor: wait !important;
}

.sharethis {
    width: auto;
    float: right;
}

/* pour ne pas afficher le div clearspring */
#atff {
    position: absolute;
}