@charset "UTF-8";

/*	01 - CLASS widget (par defaut)
        --------------------------------------------------------------------------------------------------------------------------- */
.widget {
    float: left;
    width: 286px;
    margin-bottom: 24px;
    font-size: 11px;
    color: #000;
    line-height: 14px;
    border: 1px solid #ccc;
}

/* 01 - head
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
.widget .head {
    position: relative;
    float: left;
    margin-bottom: 6px;
    width: 262px;
    padding: 6px 12px;
    background: #484848;
}
/* h2 */
.widget .head h2 {
    margin-bottom: 0;
    font: normal normal normal 12px/14px Arial, Helvetica, sans-serif;
    text-transform: uppercase;
    color: #fff;
}

/* arrow */
.widget > .head .arrow { 
    position: absolute; 
    display: block; 
    bottom: -12px; 
    left: 0;
    width: 100%;
    height: 12px;
    background: url(../images/template/widget-title-arrow-bottom.png) center top no-repeat; 
    z-index: 70; 
}


/* 02 - .body (contenu)
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
.widget > .body {
    float: left;
    width: 264px;
    padding: 11px 11px 0 11px;
}

/* 03 - On détermine les valeurs par défaut des éléments html dans un widget (a, p, li,...)
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
/* a */
.widget > .body a:link, .widget > .body a:visited { color: #173e71; }
.widget > .body a:hover, .widget > .body a:active, .widget > .body a:focus { color: #2865b4; }

/* On détermine la valeur de margin-bottom sur les éléments html les plus courant intégrés dans le contenu d'un Widget () 
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
.widget > .body p,
.widget > .body ul,
.widget > .body ol,
.widget > .body img,
.widget > .body table,
.widget > .body form,
.widget > .body fieldset,
.widget > .body hr,
.widget > .body .styleHr,
.widget > .body .btnMore
.widget > .body .marginBottom
.widget > .body table { 
    margin-bottom: 12px; 
}



/*	02 - CAS UNIQUE widget userSpace = espace pour se connecter
        --------------------------------------------------------------------------------------------------------------------------- */
#connexion { background: #f4f4f4; }

/* .body*/
#connexion .body { text-align: right; }

/* form */
#connexion form {
    float: left;
    width: 100%;
    padding-top: 0;
}

/* li : 1er élément uniquement */
#connexion form li:first-child { padding-left: 0; }
/* li */
#connexion form li {
    padding-left: 6px;
    margin: 0;
}

#connexion form fieldset { margin-bottom: 20px; }

/* input text && password*/
#connexion input[type="text"],
#connexion input[type="password"] {
    float: left;
    width: 100px;
    padding: 5px 6px 6px 6px;
    border: 1px solid #aaa;
    font-size: 12px;
    color: #01377e;
    background: #fff;
}
/* input text && password : hover */
#connexion input[type="text"]:hover,
#connexion input[type="password"]:hover {
    border: 1px solid #01377e;
}

/* input[type="checkbox"] */
#connexion input[type="checkbox"] { margin: 0 1px 0 0; }

/* a */
#connexion form a.btn {
    width: 24px;
    height: 28px;
    line-height: 24px;
    text-align: center;
}
/* a Hover */
#connexion form a.btn:link, #connexion form a.btn:visited { background: #f6ae36; color: #fff; }
#connexion form a.btn:hover, #connexion form a.btn:active, #connexion form a.btn:focus { background: #ffba00; color: #fff; }

/* Liens */
#connexion .body .links {
    line-height: 20px;
}