/*-------------------------------------------------
    Généralités
-------------------------------------------------*/
*{ margin:0;  padding:0; }
img{ border:none; }
a{ text-decoration:none; }
label{
    display:block;
    color:#057aaf;
    font-size:20px;
}

/*-------------------------------------------------
    Blocs conteneurs
-------------------------------------------------*/
body{ font-family:Calibri, Tahoma, Arial, Helevtica, sans-serif; background-color:#fff; }
#global{  }
#header, #menu .navigation, #content{ width:900px; margin:auto; }

/*-------------------------------------------------
    Formulaire
-------------------------------------------------*/
form .submit{ margin-top:20px; text-align:center; }
form input, form select{ font-size:16px; width:500px; border:1px solid #6ca300; }
form .submit input{
    background-image:url(../img/bg_button.png);
    background-repeat:repeat-x;
    color:#fff;
    border:1px solid #ccc;
    cursor:pointer;
    font-size:16px;
    padding:0 5px 0 5px;
    width:auto;
}

/*-------------------------------------------------
    Erreurs et messages
-------------------------------------------------*/
.nodata{
    font-size:28px;
    color:#ee3322;
    text-align:center;
}
.error-message {
    padding:1px 10px 1px 10px;
    display:inline;
    clear: both;
    color: #900;
    font-weight: bold;
    background-color:#eee;
}
#flashMessage{ font-size:20px; text-align:center; }
#flashMessage.positive_flash{ color:#00ff00; }
#flashMessage.negative_flash{ color:#900; }

/*-------------------------------------------------
    Header
-------------------------------------------------*/
#header{
    font-variant:small-caps;
    color:#123456;
    height:200px;
}
#header .main_title{ font-size:70px; width:800px; }
#header .mosaique{
    font-size:16px;
    border:1px solid #ccc;
    width:600px;
    height:100px;
    position:relative;
    left:250px;
    top:-80px;
    overflow:hidden;
    background:url(../img/mosaique_header.png) no-repeat;
}
#header .edito .lettrine{ font-size:3em; float:left; }

/*-------------------------------------------------
    Menu
-------------------------------------------------*/
#menu{
    font-family:"Trebuchet MS", Verdana;
    background-image:url(../img/bg_menu.png);
    background-repeat:repeat-x;
    margin:10px auto 20px auto; /* top right bottom left */
    font-size:17px;
    color:#fff;
    font-variant:small-caps;
    font-weight:bold;
    height:45px;
    clear:both;
}
#menu .navigation{ padding:10px 0 10px 10px; list-style-type:none; }
#menu .navigation .elem_left{ float:left; padding-right:20px; }
#menu .navigation .elem_right{ float:right; }
#menu .navigation #link_home{ position:relative; top:-3px; }
#menu .navigation #rss{ position:relative; top:-20px; }
#menu .navigation li a{ color:#fff; }
#menu .navigation li a:hover{ border-bottom:6px solid #fff; }

/*-------------------------------------------------
    Content
-------------------------------------------------*/
#content{
    padding:0 0 20px 0;
    background:url(../img/mainbg.jpg) no-repeat;
}
#content #subcontent{
    width:100%;
    height:600px;
    overflow:auto;
}
#content h2#pageTitle{
    color:#6ca300;
    border-bottom:1px solid #6ca300;
    font-size:30px;
    margin:10px 0 20px 0;
}

/*-------------------------------------------------
    Filtre blogs
-------------------------------------------------*/
.filter{ text-align:center; margin:10px; padding:10px; }
.filter #filter_spinner{ float:right; }

/*-------------------------------------------------
    Listage des blogs
-------------------------------------------------*/
#blogs_index .row{ margin:0 auto 10px auto; }
#blogs_index .row .blog{
    border:1px solid #ccc;
    width:200px;
    float:left;
    margin:0 5px 0 5px;
    padding:3px;
}
#blogs_index .row .blog:hover{
    background-color:#eee;
    border-color:#e36203;
}
#blogs_index .row .blog .title{
    font-size:20px;
    color:#057aaf;
}
#blogs_index .row .blog .image{ text-align:center; }
#blogs_index .row .blog .image img{ padding:2px; border:1px solid #666; }
#blogs_index .row .blog .metadata{ color:#666; font-size:12px; text-align:center; }
#blogs_index .row .blog .metadata .location{  }
#blogs_index .row .blog .metadata .location .icon{ position:relative; top:5px; }
#blogs_index .row .blog .metadata .location .country{ color:#6ca300; font-size:18px; font-weight:bold; }
#blogs_index .row .blog .metadata .location .city{ font-style:oblique; font-size:13px; }
#blogs_index .row .blog .metadata .author .identity{ color:#e36203; font-weight:bold; }
#blogs_index .row .blog .metadata .time{ font-style:italic; }

/*-------------------------------------------------
    Listage des pays
-------------------------------------------------*/
#countries_index .row{ margin:0 auto 10px auto; width:760px; }
#countries_index .row .country{
    width:130px;
    float:left;
    margin:0 5px 0 5px;
    text-align:center;
    padding:5px;
    border:1px solid #ccc;
}
#countries_index .row .country:hover{
    background-color:#eee;
}
#countries_index .row .country .name a{ color:#e36203; font-size:18px; }
#countries_index .row .country .quantity a{ font-size:14px; color:#666; font-style:italic; }
#countries_index .row .country .quantity a:hover{ text-decoration:underline; }

/*-------------------------------------------------
    Footer
-------------------------------------------------*/
#footer{
    margin:20px 0 20px 0;
    padding:10px 0 0 0;
    text-align:center;
    color:#666;
    font-size:small;
    clear:both;
    border-top:1px solid #ccc;
}
#footer a{ color:#666; text-decoration:underline; }
#footer a:hover{ text-decoration:none; }