@viewport {
   width: device-width; /* largeur du viewport */
   zoom: 1; /* zoom initial à 1.0 */
}

/* Styles CSS spécifiques small phone en orientation verticale */

@media only screen 
and (min-device-width : 240px) 
and (max-device-width : 360px)
and (orientation : portrait) {

}

/* Styles CSS spécifiques small phone en orientation horizontale */

@media only screen 
and (min-device-width : 240px) 
and (max-device-width : 360px)
and (orientation : landscape) {

}

/* Styles CSS spécifiques iPhone en orientation verticale */

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px)
and (orientation : portrait) {

}

/* Styles CSS spécifiques iPhone en orientation horizontale */

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px)
and (orientation : landscape) {

}

/* Styles CSS spécifiques small tablet en orientation verticale */

@media only screen 
and (min-device-width : 360px) 
and (max-device-width : 480px)
and (orientation : portrait) {

}

/* Styles CSS spécifiques small tablet en orientation horizontale */

@media only screen 
and (min-device-width : 360px) 
and (max-device-width : 480px)
and (orientation : landscape) {

}

/* Styles CSS spécifiques iPad en orientation verticale */

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {

}

/* Styles CSS spécifiques iPad en orientation horizontale */

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {

}
 body {
   padding: 0;
   border: 0;
   margin: 0;
   text-align: center;
   font-size: 12px;
   font-family: verdana, arial, sans-serif;
   color: #545454;
   min-width: 800px;
 }
 h2 span {
   font-variant: small-caps;
 }
 p a {
   font-weight: normal;
   outline: none;
 }
 p a:link, p a:visited {
   color: #333;
   text-decoration: none;
 }
 p a:hover {
   color: #fff;
   text-decoration: none;
   background: #000;
 }
 p a:active {
   color: #000;
   text-decoration: none;
 }
 code {
   font-family: andale mono, lucida console, courier new, monospace;
   font-size: 1.2em;
   font-weight: lighter;
 }
 code0 {
   font-family: andale mono, lucida console, courier new, monospace;
   font-size: 0.9em;
   font-weight: lighter;
 }
 p {
   line-height: 1.6em;
   margin: 0 0 1em 0;
 }
 h1 {
   font-weight: lighter;
   font-family: georgia, times new roman, times, georgia, palatino, serif;
   text-align: center;
   margin-top: 0.6em;
   color: #000;
   font-size: 2em;
 }
 h2 {
   font-weight: lighter;
   font-family: verdana, arial, sans-serif;
   text-align: center;
   margin-top: 1em;
   color: #333;
   text-transform: uppercase;
   letter-spacing: 1px;
   font-size: 1.2em;
 }
 h2 span {
   font-variant: small-caps;
   text-transform: none;
 }
 h3 {
   font-weight: lighter;
   font-family: verdana, arial, sans-serif;
   text-align: center;
   margin-top: 1em;
   color: #333;
   text-transform: uppercase;
   letter-spacing: 1px;
   font-size: 1em;
 }
 table {
   width: 1000px;
   padding: 0;
   margin: 0 auto 1.5em auto;
   border-left: 1px solid #bfccdf;
   border-collapse: collapse;
 }
 .head {
   border-top: 1px solid #bfccdf;
   text-align: justify;
 }
 .tete {
   border-top: 1px solid #bfccdf;
   text-align: center;
 }
 .cs1 {
   width: 30em;
 }
 .cs2 {
   width: 20em;
 }
 .cs1 td, .cs2 td, #scientificNotation {
   text-align: right;
 }
 caption {
   padding: 0 0 5px 0;
   margin: 0 auto;
   width: auto;
   font: italic 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
   text-align: right;
 }
 th {
   font: bold 10px/22px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
   color: #476680;
   border-right: 1px solid #bfccdf;
   border-bottom: 1px solid #bfccdf;
   border-top: 1px solid #bfccdf;
   letter-spacing: 1px;
   text-transform: uppercase;
   text-align: left;
   padding: 8px 12px 4px 12px;
   background: #c9dbef url(../media/bg_header.jpg) no-repeat;
   vertical-align: middle;
 }
 td.total {
   border-top: 0;
   border-left: 0;
   border-right: 1px solid #bfccdf;
   background: none;
   text-align: right;
   font-weight: bold;
   text-transform: uppercase;
   letter-spacing: 1px;
 }
 th.sortable, th.sortable-text, th.sortable-date, th.sortable-keep, th.sortable-date-dmy, th.sortable-numeric, th.sortable-currency, th.sortable-sortByTwelveHourTimestamp, th.sortable-sortIPAddress, th.sortable-sortEnglishLonghandDateFormat, th.sortable-sortScientificNotation, th.sortable-sortImage, th.sortable-sortFileSize, th.sortable-sortAlphaNumeric, th.sortable-sortEnglishDateTime {
   cursor: pointer;
   background: #c9dbef url(../media/bg_header_sortable.jpg) no-repeat;
   padding: 8px 12px 4px 16px;
 }
 th.forwardSort {
   background: #c9dbef url(../media/bg_header_down.jpg) no-repeat 0 0;
 }
 th.reverseSort {
   background: #c9dbef url(../media/bg_header_up.jpg) no-repeat 0 0;
 }
 table thead th.forwardSort a, table thead th.reverseSort a {
   color: #000;
   text-decoration: none;
 }
 /*
These styles should be added when very long tables are expected
th.sort-active
        {
        background:#c9dbef url(../media/bg_header_sorting.jpg) no-repeat 0 0;
        cursor:wait;
        }
th.sort-active a
        {
        color:#a80000 !important;
        cursor:wait;
        }
*/
 th a {
   text-decoration: none;
   color: #476680;
   background: transparent;
 }
 td a {
   text-decoration: none;
   color: #239;
   background: transparent;
 }
 td img {
   margin: 0 auto;
   border: 3px solid #fff;
 }
 td a:hover {
   color: #000000;
   border-bottom: 1px dotted #a80000;
   background: transparent;
 }
 td {
   font: normal 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
   border-right: 1px solid #bfccdf;
   border-bottom: 1px solid #bfccdf;
   padding: 6px 12px 6px 12px;
   color: #476680;
 }
 td.lft {
   text-align: left;
 }
 tr.altÒ {
   background: #f5f7fc;
   color: #797268;
 }
 /* Poor old Internet Explorer 6 has a bug that means we can't use background images for the table rows
   as it trys to download the image each and every time that it is used (which means a 1000 row table
   will produce 1000 http requests for the image in question) */
 tr[class="alt"] td {
   background: #f5f7fc url(../media/td_alt.jpg) no-repeat;
 }
 td[class ~ ="alt"] {
   background: #ecf0f5 url(../media/col_alt.jpg) no-repeat !important;
 }
 /* Poor old Internet Explorer won't see the next two rules either as it doesn't get :first-child */
 tbody tr.alt td:first-child {
   background: #f5f7fc url(../media/bullet2.gif) no-repeat;
   font-weight: bold;
 }
 tbody tr td:first-child {
   background: #fff url(../media/bullet1.gif) no-repeat;
   font-weight: bold;
 }
 /* Image free rules for Internet Explorer < 7 */
 * html tr.alt td {
   background-color: #f5f7fc;
 }
 * html tr td.alt, * html tr.alt td.alt {
   background-color: #ecf0f5;
 }