﻿body {
    margin: 0;
    /*dark blue*/
    color: #003366;
    font-family: Trebuchet MS, Arial;
    font-size: 0.9em;
    background-image: url(/images/body.png);
    background-repeat: repeat-x;
    background-position: top;
}

.centrage {
    margin-left: auto;
    margin-right: auto;
    width: 910px;
}

.mainContent {
    background-color: white;
    padding: 10px;
    min-height: 600px;
}

h1 {
    /*dark blue*/
    color: #003366;
}

h2 {
    /*dark brown*/
    color: #664400;
    text-align: center;
}

h3 {
    /*brown*/
    color: #996600;
}

h4 {
    /*dark brown*/
    color: #664400;
}

a {
    /*blue*/
    color: #3366CC;
    text-decoration: none;
}

    a:hover {
        /*orange*/
        color: #FF9900;
    }

/********** Header **********/
.header {
    height: 100px;
    background-color: white;
}

.logo {
    /*float: left;*/
    width: 237px;
}

.topright {
    float: right;
    padding: 5px;
    text-align: right;
}

#facebook, #twitter, #youtube, #rss {
    width: 24px;
    height: 24px;
}

#facebook {
    background: url(/images/topRight.png) no-repeat 0 0;
}

#twitter {
    background: url(/images/topRight.png) no-repeat -25px 0;
}

#youtube {
    background: url(/images/topRight.png) no-repeat -50px 0;
}

#rss {
    background: url(/images/topRight.png) no-repeat -75px 0;
}

#weibo {
    width: 26px;
    height: 24px;
    background: url(/images/topRight.png) no-repeat -100px 0;
}

.icons, .lang {
    display: inline-block;
    vertical-align: bottom;
    padding: 5px;
    margin-top: 3px;
    font-size: 1.1em;
    font-weight: bold;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

    .icons a {
        text-decoration: none;
    }

#ButtonSearch {
    background-color: #444;
    border: 2px solid #444;
    color: white;
}

/********** TopMenu **********/
.topMenu {
    background-color: #444 !important;
    height: 47px;
}

/********** Correction JQueryUI  **********/
.ButtonUI a:hover {
    color: white !important;
}

/********** Footer  **********/
.footer {
    text-align: center;
    background-color: #444;
    color: white;
    padding-top: 25px;
    padding-bottom: 25px;
}

    .footer a {
        color: #99CCFF;
    }

        .footer a:hover {
            color: #CAE5FF;
        }

/********** TopMenu  **********/
/* menu and sub-menus */
#menu, #menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 0.9em;
}

    #menu li {
        float: left;
        color: #fff;
    }

        #menu li a {
            display: block;
            color: #fff;
        }

/* first level menu */
#menu {
    overflow: hidden; /* Création du contexte de formatage */
}

    #menu > li {
        width: 130px;
    }

        #menu > li > a {
            /* the left part of the image */
            background: url(/images/menuBackground.png) left top no-repeat;
            line-height: 44px;
            height: 47px;
            text-align: center;
            text-transform: uppercase;
        }

            #menu > li > a:hover, #menu > li > a:focus, #menu > li > a:active {
                /* the right part of the image */
                background: url(/images/menuBackground.png) right top no-repeat;
            }

            /* The selected menu will be highlighted */
            #menu > li > a.ActiveMenu {
                background: url(/images/menuBackground.png) right top no-repeat;
            }

    /* sub-menus */

    #menu ul {
        display: none;
        z-index: 999;
        position: relative;
    }

        #menu ul li {
            width: 150px;
            padding: 2px;
            background-color: #153b86;
            padding-left: 5px;
            padding-right: 5px;
        }

            #menu ul li a {
                padding: 5px;
            }

                #menu ul li a:hover {
                    background-color: #444;
                }

/********** Content **********/

#ReportsMenu, #NewsMenu {
    width: 180px;
}

    #ReportsMenu a:hover, #NewsMenu a:hover {
        /*orange*/
        color: #FF9900 !important;
    }

.col {
    width: 260px;
    display: inline-block;
}

.col2 {
    width: 400px;
    display: inline-block;
}

.Box, .Box2 {
    padding: 5px;
    margin: 5px;
}

.Box {
    float: left;
    margin-right: 20px;
}

.Box2 {
    float: right;
    clear: right;
}

/* image display in Reports/News */

/* An inline Box*/
.Box3 {
    float: left;
    margin-right: 10px;
}

/* A block Box */
.Box4 {
    display: inline-block;
    margin-right: 10px;
    text-align: center;
    vertical-align: top;
}

/* pseudo table */
.Box5 {
    display: table-cell;
    vertical-align: top;
    padding: 5px;
}

/* An inline Box*/
.BoxImage {
    float: right;
    clear: right;
    width: 350px;
}

.BoxImageGroup {
    float: right;
    clear: right;
    margin-right: -5px;
}

.BoxImage, .BoxImageInline {
    margin: 5px;
}

.BoxImageInline {
    float: left;
}

    /* legend of the images */
    .BoxImageInline h6, .BoxImage h6, .Box h6, .Box2 h6, .Box3 h6, .Box4 h6 {
        margin-top: 0;
        text-align: justify;
    }

    .BoxImageInline h5, .BoxImage h5, .Box h5, .Box2 h5, .Box3 h5, .Box4 h5 {
        margin-top: 0;
        text-align: center;
    }

.BlueBox {
    /*dark blue*/
    border: 1px solid #003366;
    /*very light blue*/
    background-color: #c9dbed;
    padding: 5px;
}

.margeBold {
    font-weight: bold;
    margin-left: 20px;
}

.Alt1, .Alt2 {
    padding: 5px;
}

.Alt2 {
    background-color: #f1f1f1;
}

.NoResults {
    text-align: center;
    margin-top: 25px;
    font-weight: bold;
    display: block;
}

.Date {
    /*brown*/
    color: #996600;
    font-weight: bold;
}

.PdfBottom {
    text-align: right;
}

.RightRef {
    text-align: right;
}

q, blockquote {
    font-style: italic;
}

abbr {
    border-bottom: .05em dotted;
    cursor: help;
}

a.fancybox img {
    /*blue*/
    border: 2px solid #3366CC;
}

a:hover.fancybox img {
    /*orange*/
    border: 2px solid #FF9900;
}

/*add an external icon to the external links*/
.mainContent a[href^="http://"]:after {
    content: url('/images/external.png');
    padding-left: 4px;
}

/*add a pdf icon to the pdf links*/
.mainContent a[href$=".pdf"]:after {
    content: url('/images/pdf.png') !important;
    padding-left: 4px;
}

/*add a word icon to the word links*/
.mainContent a[href$=".doc"]:after {
    content: url('/images/word.png') !important;
    padding-left: 4px;
}

.mainContent a[href$=".docx"]:after {
    content: url('/images/word.png') !important;
    padding-left: 4px;
}

/*add an yoube icon to the youtube links*/
.mainContent a[href^="http://youtu"]:after {
    content: url('/images/youtube.png');
    padding-left: 4px;
}

.mainContent a[href^="http://www.youtu"]:after {
    content: url('/images/youtube.png');
    padding-left: 4px;
}

/* Table Of Content*/
.TOC {
    padding: 0;
}

    .TOC li {
        list-style: none;
    }

/* Tables */
.ColorTable td {
    /*very light blue*/
    background-color: #c9dbed;
}

.VerticalTh th {
    text-align: left;
}

.mainContent table {
    border-collapse: collapse;
}

.mainContent caption {
    font-weight: bold;
    font-size: 1.2em;
    /*dark blue*/
    color: #003366;
}

.mainContent th {
    font-weight: bold;
    padding: 5px;
    /*very light blue*/
    background-color: #c9dbed;
    /*dark blue*/
    border: 1px #003366 solid !important;
}

.mainContent td {
    /*dark blue*/
    border: 1px #003366 solid !important;
    padding: 5px;
}

/*List Reports && List News*/

.ListReports, .ListNews {
    min-width: 50%;
}

/* investigation */
.investigation {
    padding: 10px;
}

    .investigation h1 {
        text-align: center;
    }

/* Newscast */

.video {
    text-align: center;
}
