*{margin:2px;padding:0;list-style:none} .ariane{font-weight: bold}.image-contenu{background-color:#FFECF5;overflow:hidden}.image-contenu-cadre{background:none repeat scroll 0 0 #FFECF5;border-color:#df6810 #e87212 #c2460b;border-style:solid;border-width:1px;float:left;height:125px;margin:6px;width:125px;box-shadow:0 1px 0 #fff inset,0 1px 2px rgba(0,0,0,0.3)}.image-contenu-cadre2{background:none repeat scroll 0 0 #FFECF5;border-color:#df6810 #e87212 #c2460b;border-style:solid;border-width:1px;float:left;height:175px;margin:6px;width:125px;box-shadow:0 1px 0 #fff inset,0 1px 2px rgba(0,0,0,0.3)}.image-contenu-cadre3{background:none repeat scroll 0 0#FFCCFF;border-color:#df6810 #e87212 #c2460b;border-style:solid;border-width:1px;height:252px;margin:1px;width:302px;box-shadow:0 0}.image-contenu-cadre img{max-width:100px;max-height:100px}.image-contenu-cadre2 img{max-width:100px;max-height:100px}.image-contenu-pos{padding:15px 10px 0}.image-contenu-pos2{padding:5px 10px 0}.pagination{display:block;width:740px;margin:auto}.pagination p{text-align:center}.pagination a{display:inline-block;text-decoration:none;color:#CC000}.pagination a:hover{text-decoration:none;color:#FFFFFF}a.select{background-color:#FFECF5;border-color:#CC0000;border-style:solid;border-width:1px;box-shadow:0 1px 0 #FFF inset,0 1px 2px rgba(0,0,0,0.3);padding:2px;color:#11F}

body { text-align: center; background: #FFF url(img/background.png); }
.page { position: relative; width: 900px; margin: 0 auto; padding: 50px 1.5em; text-align: left;  }
.header { padding-bottom: 0.5em; border-bottom: 1px solid; }
.footer { clear: both; padding: 0.5em 0 0; border-top: 1px solid; }
.wrapper { clear: both; float: left; width: 37%; overflow: hidden; min-height: 280px; }
.wrapper2 { float: right; width: 37%; overflow: hidden; min-height: 280px; }
.content { min-height: 280px; }
.aside { float: right; width: 60%; overflow: hidden; align: right; }
.aside2 { clear: both; float: left; width: 60%; overflow: hidden; min-height: 280px; }
.lienacc {
	text-decoration: none;
	color: #900;

}
a:link {
	color: #900;
	text-decoration: none;
}
a:hover {
	color: #900;
	text-decoration: none;
}
a:active {
	color: #900;
	text-decoration: none;
}
/* Hyperliens
---------------------------------------------- */
a { color: #900; text-decoration: none; }
a:focus,
a:hover,
a:active { background-color: #900; color: #FFF; text-decoration: none; }
/* --------------------------------------------------------------

   typo.css
   Base typographique
   Cf.: http://contrib.spip.net/3820

-------------------------------------------------------------- */

html { font-size: 100.01%; } /* pour IE < 6 */
/* Cf.: http://www.pompage.net/pompe/definir-des-tailles-de-polices-en-CSS/ et http://forum.alsacreations.com/topic-4-54377-1.html */
body { background: #FFFFFF; font: 1em/1.5em Georgia, Cambria, Times New Roman, Times, serif; color: #222222; }

/* Titraille / Intertitres */
h1,.h1,
h2,.h2,
h3,.h3,
h4,.h4,
h5,.h5,
h6,.h6 { display: block; margin: 0; padding: 0; font-size: 100%; font-weight: normal; }
hr { height: 1px; margin: 1.5em 0; border: 0; background: #222222; color: #222222; }

h1,.h1 { font-size: 2em; line-height: 1.5; margin-bottom: .75em; }
h2,.h2 { font-size: 1.5em; line-height: 1; margin-bottom: 1em; }
h3,.h3 { font-size: 1.25em; line-height: 1.2; margin-bottom: 1.2em; }
h4,.h4 { font-size: 1.1em; line-height: 1.364; margin-bottom: 1.364em; }
h5,.h5 { font-size: 1em; font-weight: bold; margin-bottom: 1.5em; }
h6,.h6 { font-size: 1em; font-weight: bold; }

/* Enrichissements typographiques */
strong, b { font-weight: bold; }
em, i { font-style: italic; }
small, .small { font-size: 90%; }
big, .big { font-size: 130%; }
abbr[title], acronym[title] { border-bottom: .1em dotted; cursor: help; }
@media print { abbr[title]:after { content: " (" attr(title) ")"; } }
dfn { font-weight: bold; font-style: italic; }
del, .del { background-color: #FFDDDD; border-color: #CC0000; color: #CC0000; text-decoration: line-through; }
ins, .ins { background-color: #DDFFDD; border-color: #00AA00; color: #00AA00; text-decoration: none; }
sup, sub { font-size: .8em; font-variant: normal; line-height: 0; }
sup { vertical-align: super; }
.ie sup { vertical-align: text-top; }
sub { vertical-align: sub; }
.ie sub { vertical-align: text-bottom; }
.caps { font-variant: small-caps; }

/* Listes */
ul, ol, li, dl, dt, dd {}
ul ul, ol ol, ul ol, ol ul { margin-top: 0; margin-bottom: 0; }

dl dt { font-weight: bold; }
dl dd {}

/* Tableaux */
table {}
caption { background: #EEE; }
th { font-weight: bold; }
thead th { background: #DDD; }
th,td,caption { padding: 0.75em; }
tbody tr:nth-child(even) th,
tbody tr:nth-child(even) td,
tbody tr.even th,
tbody tr.even td { background: #EEE; }
tfoot { font-style: italic; }

/* Citations, code et poesie */
q { font-style: italic; }
blockquote { padding: 0 50px; }
cite { font-style: italic; }

address { font-style: italic; }

pre,code,kbd,samp,var,tt { font-family: 'Courier New', Courier, monospace; font-size: 1em; }
pre { margin: 1.5em 0;
  /* Cf.: http://perishablepress.com/press/2010/06/01/wrapping-content/ */
  white-space: pre;           /* CSS 2.0 */
  white-space: pre-wrap;      /* CSS 2.1 */
  white-space: pre-line;      /* CSS 3.0 */
  white-space: -pre-wrap;     /* Opera 4-6 */
  white-space: -o-pre-wrap;   /* Opera 7 */
  white-space: -moz-pre-wrap; /* Mozilla */
  white-space: -hp-pre-wrap;  /* HP Printers */
  word-wrap: break-word;      /* IE 5+ */
}
kbd { background-color: #222222; color: #FFFFFF; }
samp { font-weight: bold; }
var { font-style: italic; }

/* Paragraphes */
p, .p, dl, dd, blockquote, address, pre, table, fieldset { margin-bottom: 1.5em; }

/* Liens */
a {}
a:hover {}
a[hreflang]:after { content: "\0000a0(" attr(hreflang) ")"; }
@media print {
  a, a:visited { color: #222222; text-decoration: underline; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */
}

.on { font-weight: bold; }


/**
* Print styles from HTML5 Boilerplate
* Inlined to avoid required HTTP connection: www.phpied.com/delay-loading-your-print-css/
*/


@media (max-width: 640px) {
    * {
        -webkit-box-sizing: border-box;
           -moz-box-sizing: border-box;
                box-sizing: border-box;
    }
    
/* passer tous les elements de largeur fixe en largeur automatique */
body,
.page,
.header,
.main,
.footer,
.wrapper,
.content,
.aside { width: auto !important; margin: auto !important; }

.page { margin: 0; padding: 5%; }
    /* fixer une largeur maximale de 100% aux éléments potentiellement problématiques */

    img,
    table,
    td,
    blockquote,
    code,
    pre,
    textarea,
    input,
    iframe,
    object,
    embed,
    video {
        max-width: 100%;
    }
    
    /* conserver le ratio des images */

    img {
        height: auto;
    }
    
    /* gestion des mots longs */

    textarea,
    table,
    td,
    th,
    code,
    pre,
    samp {
        -webkit-hyphens: auto; /* césure propre */
        -moz-hyphens: auto;
        hyphens: auto;
        word-wrap: break-word; /* passage à la ligne forcé */
    }
    
    code,
    pre,
    samp {
        white-space: pre-wrap; /* passage à la ligne spécifique pour les éléments à châsse fixe */
    }
    
    /* Passer à une seule colonne (à appliquer aux éléments multi-colonnes) */

    element1,
    element2 {
        float: none;
        width: auto;
    }
    
    /* masquer les éléments superflus */

    .hide_mobile {
        display: none !important;
    }
    
    /* Un message personnalisé */

    body:before {
        content: "";
        display: block;
        text-align: center;
        font-style: italic;
        color: #777;
    }
}

@media (max-device-width:768px) and (orientation: landscape) {
  html {
   -webkit-text-size-adjust: 100%;
   -ms-text-size-adjust: 100%;
  }
}