/* CSS Coocoon - 2009 */
/* Gestion de la présentation */



/* #############################################################*/
/* #############################################################*/
/* De base */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    font-family: inherit;
    vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
    outline: 0;
}
body {
    line-height: 1;
    background: white;
}
ol, ul {
    list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
    border-collapse: separate;
    border-spacing: 0;
}
caption, th, td {
    text-align: left;
    font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: "";
}
blockquote, q {
    quotes: "" "";
}

/** fin reset */

body {
    font: 11px verdana;
    color: #978c7c;
}

#main {
    width: 1033px;
    min-height: 620px;
    height: auto !important;
    height: 620px;
    position: absolute;
    left: 50%;
    margin-left: -516px;
}

.formBase {
    margin: 20px;
}

.formBase fieldset {
    border: 1px solid gray;
    padding: 20px;
}

.formBase legend {
    margin: 10px;
    font-weight: bold;
}

/* Fin de base */
/* #############################################################*/
/* #############################################################*/
/*
#beta {
    position: absolute;
    top: 0pt;
    left: 0pt;
    width: 222px;
    height: 220px;
    z-index: 999;
    background-image: url(/images/prebeta.png);
}
*/
/* #############################################################*/
/* #############################################################*/
/* Entête */
#top {
    background: url(/images/fond-entete.jpg) no-repeat;
    padding: 24px 30px 0 30px;
}

    #logo {
        width: 234px;
        height: 86px;
        background: url(/images/logo_beta.gif);
        position: absolute;
        top: 55px;
        left: 25px;
        z-index: 89; /* fix to make jquery-lightbox happy */ /* doit être sous le flash */
    }

        #logo a {
            display: block;
            width: 234px;
            height: 86px;
        }

            #logo a  span {
                display: none;
            }

    #lang {
        margin: 0;
        padding: 0;
        list-style: none;
        display: inline;
    }

        #lang li {
            display: inline;
        }

    #infosEntete  {
    }

    #formLogin {
        display: inline;

    }

#minicompte {
    display: inline;
}
    #menuResetPassword {
        display: inline;
    }
    #menuCreateAccount {
        display: inline;
    }

#profilSwitcher {
    background: url(/images/ic/oeuf-acheteur.gif) no-repeat;
    right:40px;
    position:absolute;
    top:40px;
    width:330px;
    height: 55px;
    z-index: 1;
    padding-top: 15px;
}
    #profilSwitcher p, #profilSwitcher form {
        margin: 0 0 0 75px;
    }

    #profilSwitcher select {
        width: 180px;
    }
#recherche {
    display: none;
}

/* Fin entête */
/* #############################################################*/
/* #############################################################*/



/* #############################################################*/
/* #############################################################*/
/* Contenu HOME */
#data {
    padding: 110px 30px 30px 30px;
    background-image: url(/images/fond-centre.jpg);
    height: auto !important; /* fix pour IE6, mettre celui là en 1er */
    min-height: 570px;
    height: 570px;
    position: relative;
    width: 973px; /** fix pour IE6/7 ... IE 8/FF/... mettent la bonne taille sinon */
}
    #data a {
        /*text-decoration: underline;*/
    }
    #data p {
        /*text-align: justify;*/
        text-align:left;
    }

    #menuHaut {
        z-index: 89;
        position: absolute;
        top: 27px;
        right: 35px;
        margin: 0;
        padding: 0;
        background: url(/images/bt/menu2.gif) no-repeat;
        /*width: 742px; fix pour cacher finder*/
        width: 637px;
        height: 45px;
        text-indent: -100em;
        overflow: hidden;
    }

        #menuHaut li {
            position: absolute;
            list-style: none;
            top :0;
        }

        #menuHaut li, #menuHaut a {
           height: 45px;
           width: 106px;
           display: block;
        }

        #menuHaut a:hover {
           background: white url(/images/bt/menu2.gif) no-repeat;
        }
        #coocooner { left: 0; }
        #acheteur { left: 106px;}
        #vendeur { left: 212px;}
        #locataire { left: 318px;}
        #bailleur { left: 424px;}
        #pro { left: 530px;}
        /*#finder { left: 636px;}*/

        #coocooner a:hover { background-position: 0 5px ; }
        #acheteur a:hover { background-position: -106px 5px ; }
        #vendeur a:hover { background-position: -212px 5px; }
        #locataire a:hover { background-position: -318px 5px; }
        #bailleur a:hover { background-position: -424px 5px ; }
        #pro  a:hover { background-position: -530px 5px; }
        /*#finder a:hover { background-position: -636px 5px; }*/

    /* Menu utilisateur logué */
    #menuUtilisateur {
        z-index: 90;
        position: absolute;
        top: 75px;
        right: 70px;
        margin: 0;
        padding: 0;
    }

        #menuUtilisateur li {
            display: inline;
            list-style: none;
        }

        #menuUtilisateur li a {
            text-transform: uppercase;
            text-decoration: none;
            color: gray;
        }



/* Fin contenu HOME */
/* #############################################################*/
/* #############################################################*/



/* #############################################################*/
/* #############################################################*/
/* Contenu inter */


/* Tablo de bord */
#titreTdb {
    font-size: 14px;
    color: #ED771E;
    margin: 0.4em 15px;
    border-bottom: 1px solid #ED771E;
}


.cb {
    width: 290px;
    height: 140px;
    margin: 10px;
}

    .cbb {
        margin:1em 0;
        width: 290px;
        height: 140px;
        padding:0 10px;
        border:1px solid #666;
        background:#fff;
    }

    .cb span {display: block;}

    .cbb h1 {
        margin:0 -10px;
        padding:0.3em 10px;
        background:#efece6;
        font:bold 1.2em/1 Arial, Helvetica, sans-serif;
    }
    /* Normal styling */
    .cb {
        margin:0.5em 0 2em 0; /* fix tristan: pour laisser de la place aux vidéos */
    }
        /* Top corners and border */
    .bt {
        height:17px;
        margin:0 0 0 18px;
        background:url(/images/box.png) no-repeat 100% 0;
    }
    .bt span {
        position:relative;
        left:-18px;
        width:18px;
        height:17px;
        background:url(/images/box.png) no-repeat 0 0;
        font-size:0;
        line-height:0;
    }

        /* Bottom corners and border */
    .bb {
        height:18px;
        margin:0 0 0 18px;
        background:url(/images/box.png) no-repeat 100% 100%;
    }
    .bb span {
        position:relative;
        left:-18px;
        width:18px;
        height:18px;
        background:url(/images/box.png) no-repeat 0 100%;
        font-size:0;
        line-height:0;
    }

        /* Left border */
    .i1 {
        padding:0 0 0 12px;
        background:url(/images/borders.png) repeat-y 0 0;

    }
        /* Right border */
    .i2 {
        padding:0 12px 0 0;
        background:url(/images/borders.png) repeat-y 100% 0;
    }
        /* Wrapper for the content. Use it to set the background colour and insert some padding between the borders and the content. */
    .i3 {
        display:block;
        margin:0;
        padding:1px 10px;
        background:#fff;
        height: 100px;
        min-height: 100px;
        height: auto !important;
    }
        /* Make the content wrapper auto clearing so it will contain floats (see http://positioniseverything.net/easyclearing.html). */
    .i3:after {
        content:".";
        display:block;
        height:0;
        clear:both;
        visibility:hidden;
    }
    .i3 {display:inline-block;}
    .i3 {display:block;}
    /* Default CSS ends here */


    #col1, #col2, #col3 {
        float: left;
        width: 320px;
    }

    #tableauDeBord h4 {
        color: #ed771e;
        font-size: 14px;
        font-weight: bold;
        position: relative;
        top: -5px;
    }

    #tableauDeBord h4 {
        color: #ed771e;
        font-size: 14px;
        font-weight: bold;
    }

    #tableauDeBord p {
        clear: both;
        color: #b18c75;
    }

    .lienSurLibelle {
        color: #B18C75;
        text-decoration: none;
    }

    #tableauDeBord p.pPibelle  {
        color: #91315A;
        font-size: 12px;
        margin: 10px 0 0 0;
        font-weight: bold;
    }

    #tableauDeBord .pAlignement {
        margin-bottom: 20px;
        font-weight: bold;
    }


    #tableauDeBord .pLien {
        text-align: right;
        margin: 20px 0 ;
    }

    #tableauDeBord .lien {
        text-decoration: none;
        color: #993300;
    }

        #tableauDeBord .lien img {
            position: relative;
            top: 5px;
        }

    .menuTdb li {
        border-bottom: 2px dotted #998e77;
        background: url('/images/ic/lien.gif') right 7px no-repeat;
        line-height: 20px;
    }

    .menuTdb li a {
        font-size: 12px;
        font-weight: bold;
        color: #998e77;
    }

    /* Différents encarts, type : rechercher, messagerie, etc... */
    .encartRechercher {
        background: url('/images/fond-encart-recherche.jpg');
        width: 296px;
        height: 55px;
    }

    #rechercheBien {
        position: absolute;
        /*top: 0px;*/
        bottom: 2px;
        right: 0px;
    }

    #rechercheBien p {
        padding-left: 20px;
    }

    #queryRecherche, #RechercheRapideForm_commune_id {
        width: 120px;
        position: relative;
        top: -8px;
    }

    #queryRechercheType {
        width: 80px;
        position: relative;
        top: -8px;
    }

    #querySubmit {
        position: relative;
        top: 2px;
        left: 5px;
    }


/**
 * Medias
 */
#mediasAssoc {
}
    #mediasAssocies { /* h4 */
    }
    #mediasToDel {
    }
        .mediaToDel {
        }
        .mediaToDel img {
        }
        .mediaToDel span {
        }
            .mediaToDel a {
            }


/* Fin contenu inter */
/* #############################################################*/
/* #############################################################*/



/* #############################################################*/
/* #############################################################*/
/* Footer */
#footer {
    height: 173px;
    clear: both;
    background: url('/images/fond-pied.jpg');
}
    #ref {
        margin-left: 40px;
    }
    #ref ul {
        float:left;
        width:135px;
        color: #666
    }

    #informationsLegales {
        margin: 0;
        position: absolute;
        bottom: 0;
        right: 20px;
    }

    #footer dl {
        position: absolute;
        margin-left: -475px;
        left: 50%;
        width: 950px;
        color: #685C42;
    }

    #footer dt {
        display: block;
        position: absolute;
        font-weight: bold;
    }

    #footer dd {
        /*border-left:1px solid #685C42;*/
        padding-left:5px;
        display: block;
        position: absolute;
        top: 20px;
        /*left: 0;*/
        margin-left:10px;
    }

    #footer dd ul {
        margin: 0;
        padding: 0;
        list-style: circle;
    }

    #footer dd ul li {
        margin: 0;
        padding: 0;
        list-style: circle;
    }

    #footer dd ul li a {
        color: #685C42;
        text-decoration: none;
    }

    #dt2, #dd2 {left: 150px;}

    #dt3, #dd3 {left: 320px;}

    #dt4, #dd4 {left: 500px;}

    #dt5, #dd5 {left: 680px;}

    #dt6, #dd6 {left: 830px;}

    #dt7, #dd7 {left: 855px;}



/* Fin footer */
/* #############################################################*/
/* #############################################################*/



/* #############################################################*/
/* #############################################################*/
/* GENERIQUE FORMULAIRE */

/* Présentation de formulaire sur 1, 2 ou 3 colonnes */
#conteneurForm1Col {
    width: 300px;
    margin:0 auto;
}

#conteneurForm2Col {
    width: 670px;
    margin:0 auto;
}

#conteneurForm3Col {
    width: 980px;
    margin:0 auto;
}

.titreFormOrange {
    font-size: 14px;
    font-weight: bold;
    color: white;
    padding: 0px 0 5px 0;
    margin-bottom: 30px;
    border-bottom: 3px solid white;
}

/* Formulaire classique */
.formP {
    Margin: 20px 0;
}

/* Formulaire orange */
.conteneurFormLong {
    background: url('/images/fond-orange-form.jpg');
    color:white;
    height:765px;
    float: left;
    padding:20px 25px 0 20px;
    width:278px;
}
    .conteneurFormLong label {
        float: none !important;
    }

.conteneurFormLong p {
        margin: 20px 0;
    }

.conteneurFormCourt {
    background: url('/images/fond-orange-form-340.jpg') no-repeat;
    color:white;
    height:340px;
    float: left;
    padding:20px 25px 0 20px;
    width:278px;
    overflow: hidden;
}

.conteneurFormCourt p {
        margin: 20px 0;
    }

.input270 {
    width: 270px;
}

/* Fin generique */
/* #############################################################*/
/* #############################################################*/


/* #############################################################*/
/* #############################################################*/
/* MESSAGE FLASH ET BULLE TEXTE */

#flashAlerteInfo, #flashAlerteErreur {
    position: absolute;
    top: 60px;
    left: 75px;
    width: 280px;
    z-index: 90; /* #logo:z-index + 1 */
}

/* Top */
#flashAlerteInfoTop, #flashAlerteErreurTop {
    width: 280px;
    height: 51px;
    background: url('/images/notice-top.png');
}
#flashAlerteErreurTop {background: url('/images/error-top.png');}


    #flashAlerteInfoBtFermer {
        position:absolute;
        right:35px;
        top:15px;
        width: 20px;
        height: 22px;
        background: url('/images/bt/bt-fermer-blanc.png');
        cursor: pointer;
    }

/* Center */
#flashAlerteInfoCenter, #flashAlerteErreurCenter {
    width: 280px;
    background: url('/images/notice-centre.png');
}
#flashAlerteErreurCenter { background: url('/images/error-centre.png');}

    #flashAlerteInfoCenter p, #flashAlerteErreurCenter p {
        position: relative;
        top: -20px;
        padding:0px 60px 0 50px;
        color: white;
        font-weight: bold;
    }

/* bottom */
#flashAlerteInfoBottom, #flashAlerteErreurBottom {
    width: 280px;
    height: 32px;
    background: url('/images/notice-bottom.png');
}
#flashAlerteErreurBottom {background: url('/images/error-bottom.png');}

/* POUR BULLE */
#bulle {
    width: 500px;
    position: relative;
    top: -5px;
}

/* Top */
#bulleTop {
    width: 500px;
    height: 16px;
    background: url('/images/bulle-top.gif');
}

    #bulleBtFermer {
        position:absolute;
        right:35px;
        top:15px;
        width: 20px;
        height: 22px;
        background: url('/images/bt/bt-fermer-blanc.gif');
        cursor: pointer;
    }

/* Center */
#bulleCenter {
    width: 500px;
    background: url('/images/bulle-centre.gif');
}

    #bulleCenter p {
        padding: 10px 20px
    }

    .bulleTitreh2 {
        font-size: 13px;
        color: #F57F28;
        padding: 0 20px;
        margin-bottom: 0;
    }

/* bottom */
#bulleBottom {
    width: 500px;
    height: 16px;
    background: url('/images/bulle-bottom.gif');
}


/* Fin message flash */
/* #############################################################*/
/* #############################################################*/



/* #############################################################*/
/* #############################################################*/
/* DIVERS */

.separateur {
    height:2px;
    background: #E0DBD4;
    width: 88%;
    clear: both;
    margin: 5px 0 10px 35px;
}

.separateurFull {
    height:2px;
    background: #E0DBD4;
    width: 100%;
    clear: both;
    margin: 5px 0 10px 0;
}

.separateurForm {
    border-bottom: 1px solid #E0DBD4;
    width: 100%;
    height: 10px;
    clear: both;
    margin: 20px 0;
    clear: both;
}

.pBt {
    clear: both;
    line-height: 40px;
    height: 40px;
}

/* Personnalisation des cursor */
.help {
    cursor: help;
}

/* Pour les espacements */
.paddingLeft {
    padding-left: 35px;
}

.marginTopBottom10 {
    margin: 10px 0;
}
/* FIN */

/* Pour les positionnement vertical d'ajustement */
.top7 {
    position: relative;
    top: 7px;
}

.top10 {
    position: relative;
    top: 10px;
}

/* cadre div, espece de fiedset en div */
.divCadre {
    border: 1px solid gray;
    padding: 20px;
    margin: 20px;
}

.fondGris {
    padding: 5px 10px;
    background: #BEB4A4;
    color: white;
    font-size:18px;
    /*font-weight:bold;*/
}

    .fondGris p {
        margin: 0 !important;
    }

/* Alignement a gauche et droite daomme dans un table */
.pAligneGaucheDroite {
    clear: both;
    line-height: 20px;
    height: 10px;
}

.aligneGauche {
    float: left;
}

.aligneDroite {
    float: right;
    font-weight: bold;
}

.liAligneDroite {
    float: right !important;
    padding-right: 5px !important;
}

.orange {
    color: #ed771e;
}

/* Personnalisatio des liens */
.lien {
    text-decoration: underline;
}

.lienOrange {
    color: #ed771e;
    text-decoration: none;
}

a, .lienGris {
    color: #beb4a4;
    text-decoration: none;
}

.lienBlanc {
    color: white;
    text-decoration: none;
}

.rounderMain {
    position: relative;
    top: 0;
    left: 0;
}

/* Pour les boutons gris */
.conteneurBtGris {
    position: block;
}

button {
    border: none;
    background: none;
    cursor: pointer;
    padding: 0;
    min-width: 71px; /*130px; *//* fix IE(7) */
    width: auto !important;
}

.btGrisGauche, .btOrangeGauche {
    background: url(/images/bt/bt-gris-gauche.jpg) no-repeat;
    width: 13px;
    height: 33px;
    display: block;
    float: left;
}
.btOrangeGauche {background: url(/images/bt/bt-orange-gauche.jpg) no-repeat !important;}

.btGris, .btOrange {
    background: url(/images/bt/bt-gris-milieu.jpg) repeat-x;
    height: 33px;
    line-height: 33px;
    display: block;
    float: left;
    color: #DD5A1A;
    /*font-weight: bold;*/
    text-decoration: none !important;
}
.btOrange {background: url(/images/bt/bt-orange-milieu.jpg) repeat-x !important; color: white;}

.btGrisDroite, .btOrangeDroite {
    background: url(/images/bt/bt-gris-droite.jpg) no-repeat;
    width: 13px;
    height: 33px;
    display: block;
    float: left;
}
.btOrangeDroite {background: url(/images/bt/bt-orange-droite.jpg) no-repeat;}

/* Pour le formatage du texte */
.bold {
    font-weight: bold;
}

/* Pour clear both lors d'element float */
.clear {
    clear: both;
    display: block;
}
/*
    span.borders {
    }
*/
    img.roundBorder {
    }
    span.rounder {
        position: absolute;
        top: 0;
        left: 0;
    }

/*ul {
    margin: 0;
    padding: 3px;
    color: red;
    list-style: none;
}*/

/* Personnalisation des erreurs */
.erreurChamp {
    color: red;
}

a.creerUnCompte {
}

/**
 * fix pour quand on a un input suivi d'un label, on mets pas le label flottant
 * Cas quand on a un checkbox suivi du label (Form de sélection du profil par ex)
 */

/*
input + label {
    float: none;
}

table {
    border-top: 1px solid black;
    border-left: 1px solid black;
    padding: 0;
    margin: 0;
    border-spacing: 0;
}
tr {
}
td, th {
    border-right: 1px solid black;
    border-bottom: 1px solid black;
    padding: 1px 5px;
}
*/
h3 {
    font-size: 2em;
    color: #ED771E;
    margin-bottom: 0.4em;
    /*text-decoration: underline;*/
}
h3 a {
    color: #ED771E;
}

strong {
    font-weight: bolder;
}
a {
    text-decoration: none;
    color: inherit;
}

a:hover {
    text-decoration: underline;
    color: inherit;
}
/* Fin divers */
/* #############################################################*/
/* #############################################################*/

/**
 * Forms
 */
/*form p {
    min-height: 28px;
    height: 28px;
    height: auto !important;
}*/
/** http://www.pompage.net/pompe/csspratique/ */
form p.formFormatterDivP {
    padding-top: 10px;
    margin: 0px 0px !important;
    min-height: 28px !important;
    height: auto;
}
form p.formFormatterDivP label {
    float: left;
    width: 200px;
    text-align: right;
    padding-top: 2px;
    padding-right: 3px;
}
.radio_list {
    /*width: 200px;*/
}
form p .radio_list label {
    float: none;
}
form .radio_list input {
}

form p.formFormatterDivP .formFormatterDivF {

}
/* FIXME Fabien pour aligner les forms
label {
    height: 28px;
    float: left;
    width: 200px;
}
#contentData form p {
    margin: 14px 0 !important;
}
* END FIXME */

div.formFormatter {
}
    p.formFormatterDivP {
        /*min-height: 28px;
        height: 28px;
        height: auto !important;*/
        position: relative;
    }
        p.formFormatterDivP label {
            height: 28px;
            /*float: left;*/
            width: 200px;
        }
    ul.radio_list {
        /*left: 225px;
        position: absolute;*/
        display: inline;
        float: none;
    }
        ul.radio_list li.inlined {
            display: inline;
        }

    /** errors */
    .formFormatterDivError, .formFormatterDovErrorInRow {
        color: red;
        font-weight: bold;
    }
.error_list {
    color: red;
}

.defaultAvatar {
}
.imgfb {
    float: left;
    width: 30px;
    height: 30px;
    margin: 0 5px 5px 0;
}
.stockDetails {
    height: 18px; /* FIXME */
}


/**
 * fix for the "..." of the datepicker
 */
button.ui-datepicker-trigger {
    color: white;
    background-image: url(/css/images/ui-icons_ef8c08_256x240.png);
    background-position: 128px 96px;
    height: 20px;
    width: 20px;
}
