body {
    color: #555;
    -webkit-font-smoothing: subpixel-antialiased;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
}
svg,
img,
table,
td,
blockquote,
code,
pre,
textarea,
input,
iframe,
object,
embed,
video {
    max-width: 100%;
}
/* conserver le ratio des images et empecher les debordements de boites dus aux border ou padding */
svg,
img,
img.spip_logos {
    height: auto;
    width: auto;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    outline: none;
}
.hidden {
    display: none;
}
img#cboxPhoto {
    height: inherit;
}
/* gestion des mots longs */
textarea,
table,
td,
th,
code,
pre,
samp {
    word-wrap: break-word;
    /* passage a la ligne force */
    -webkit-hyphens: auto;
    /* cesure propre */
    -moz-hyphens: auto;
    hyphens: auto;
}
code,
pre,
samp {
    white-space: pre-wrap;
    /* passage a la ligne specifique pour les elements a chasse fixe */
}
img,
table {
    margin: 0;
    padding: 0;
    border: none;
}
tr,
td {
    vertical-align: middle;
}
a {
    word-break: break-word;
    text-decoration: none;
    color : #3259a7;
}
a:hover {
    text-decoration: underline;
    color : #3259a7;
}
h1,
h2,
h3,
h4,
h5,
form,
ul,
ol,
li,
fieldset {
    margin: 0;
    padding: 0;
}
h1 {
    padding: 0 0 1em 0;
    text-align: center;
}
.content h1.titre {
    display: block;
    text-align: left;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 0;
    color: #555;
}
.rtl .content h1.titre {
    text-align: right;
}
.page_rubrique h1.titre {
    padding: 0;
}
h2.titre_bloc {
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 1px;
    border: none;
    margin: 0 0 .5em 0;
    padding: 0 0 .5em 0;
    color: #555;
}
.titre_ligne {
    height: 3px;
    width: 50px;
    display: block;
    margin: 1em 0 2em 0;
    background-color: #555;
}
.headerContent .titre_ligne,
.page_sommaire .titre_ligne {
    margin: 1em auto;
}

span.titre_bloc {
    width: 90%;
    float: left;
    margin: 0 0 0 0;
    padding: 5px 5%;
}
a.lien_bouton {
    color: #FFF;
    padding: .6em 1.5em;
}
a.lien_bouton.grand {
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 1.2em;
}
div.bouton a {
    margin: 1em 0;
    text-transform: uppercase;
    display: inline-table;
    overflow: hidden;
    transition: .3s all ease;
}
.bouton i {
    padding: 1em 1em;
    color: white;
    background-color: rgba(0, 0, 0, 0.2);
    border-left: 1px solid rgba(255, 255, 255, 0.6);
    display: table-cell;
}
.bouton span {
    padding: 1em 1.2em;
    color: white;
    font-size: .9em;
    font-weight: 700;
    letter-spacing: 1px;
    display: table-cell;
}
div.bouton:hover span {
    background-color: rgba(0, 0, 0, 0.2);
    transition: .3s all ease;
    text-decoration: none;
}
div.bouton:hover a {
    text-decoration: none;
}
/*------- PERMET DE DESACTIVER LES BR et regle aussi le pb avec les tableaux*/
.texte br {
    display: none;
}
.texte p br {
    display: inline;
}
.notes {
    padding: .1em 1em;
}
.titre_logo {
    float: left;
    width: 50px;
    height: 50px;
    margin-top: 3px;
}

.invisible {
    visibility: hidden;
    height: 1px;
    overflow: hidden;
}
.spacer {
    clear: both;
    height: 1px;
}
.tableau {
    display: table;
    width: 100%;
}
.tableauenligne {
    display: inline-table;
    width: 100%;
}
.ligne-tableau {
    display: table-row;
    width: 100%;
}
.cellule-tableau {
    display: table-cell;
    vertical-align: top;
}
.formulaire_abonnement {
    padding: 25px 0 0 0;
}
.logos_social {
    padding: 0;
}
.logos_social li {
    margin: 0 5px;
    float: left;
}
.logos_social li a {
    display: block;
    color: #FFF;
    padding: 8px 3px;
    border-radius: 50%;
    min-width: 30px;
    text-align: center;
    margin: 0;
}
.logos_social li a i {
    display: block;
}
.logos_social li a:hover {
    text-decoration: none;
}
a.lien_bouton {
    width: auto;
    clear: both;
    text-align: center;
}
a.lien_bouton:hover {
    cursor: pointer;
}
a.lien_bouton {
    display: inline-block;
    padding: .6em 1.5em .8em 1.5em;
}
a.lien_bouton.grand {
    width: 95%;
    display: block;
    padding: .8em 2.5%;
    margin: 1em 0;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* ---------------------- SPECIAL LISTE EVENEMENT -------------------- */
.liste_item {}
.liste_item .item_logo {
    display: table-cell;
    vertical-align: top;
}
.liste_item .item_info {
    display: table-cell;
    vertical-align: top;
    text-transform: uppercase;
    padding: 0 2.5%;
}
.liste_item .item_info .item_info_date {
    margin: 0;
    color: black;
}
.liste_item .item_info .item_info_titre {
    display: table-cell;
    vertical-align: middle;
    padding: .5em 0 0 0;
}
.liste_item .item_info .item_info_soustitre h4 {
    margin: 0 0 0 0;
}
.liste_item .item_info .item_info_chapo {
    margin: 15px 0 0 0;
    text-align: justify;
    text-transform: none;
}
.liste_item .item_info .item_info_texte {
    margin: 15px 0 0 0;
    text-align: justify;
    text-transform: none;
}
.liste_item .item_info .item_info_supp {
    display: table-cell;
    vertical-align: top;
}
.liste_item .item_info .item_info_lieu,
.liste_item .item_info .item_info_evenement {
    margin: 4px 0 0 0;
    text-align: justify;
    text-transform: none;
}
.item_info .item_info_button {
    clear: both;
    text-align: left;
}
.item_info .item_info_button a {
    margin: 1.5em 0 0 0;
    padding: .6em 2em .8em 2em;
    display: inline-block;
}
/* --------------------------------------*/
/* --------------BANDEAU ----------------*/
/* --------------------------------------*/
.bandeau {
    width: 100%;
    display: block;
}
.bandeau_titre {
    text-align: center;
    padding: 20px 0;
}
.bandeau_titre h1 {
    display: block;
    padding: .5em;
    line-height: 1.5em;
}
.bandeau,
.bandeau .bandeau_titre {
    position: relative
}
.bandeau_liens {
    position: relative;
    min-height: 48px;
    border-top: 1px solid #D7D7D7;
    border-bottom: 1px solid #D7D7D7;
    background-color: #EAEAEA;
}
.filariane {
    position: relative;
    line-height: 30px;
    position: relative;
    padding: 10px 0;
    display: inline-block
}
.bandeau_liens .bouton {
    float: right
}
.bandeau_liens .bouton a {
    float: right;
    margin: 8px 0 0 5px
}
/* ------------------------------------------------------------------------*/
/* -------------------------PAGE D ACCUEIL---------------------------------*/
/* ------------------------------------------------------------------------*/
.page_sommaire h1.titre {
    text-align: center;
}
#shortcuts {
    /*text-align: left;*/
}
#shortcuts a.lien_bouton {
    line-height: 120%;
    text-align: left;
    padding: .5em 45px .6em 1em;
    margin: 0 0 15px 0;
    display: block;
}
.rtl #shortcuts a.lien_bouton {
    text-align: right;
    padding: .5em 1em .6em 45px;
}
#shortcuts a.lien_bouton.contact {
    margin: 30px 0;
}
/* ------------------------------------------------*/
/* ------------ BLOC AGENDA+ ACTUS  ---------------*/
/* ------------------------------------------------*/
.table .item a {
    display: block;
    z-index: 30;
}
.table .item:hover a,
.table .item a:hover,
.table .item_info:hover a,
.table .item_info a:hover {
    text-decoration: none;
}
.table .item_info_supp span {
    display: none;
}
.table .item_info_supp .item_info_date_courte,
.table .item_info_supp .item_info_date_complete {
    padding: .2em 0;
}
.table .item_info_supp .item_info_chapo,
.table .item_info_supp .item_info_texte {
    margin: .2em 0 0 0;
}
.table .item_info_supp .item_info_lieu,
.table .item_info_supp .item_info_evenement {
    margin: .1em 0 0 0;
}
.table.TWLA .item_content,
.table.TWOE .item_content {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
.table.TWLA .item_info_supp .item_info_spectacle {
    width: 100%;
    padding: .2em 0;
}
/* ------------ Vignette TWLA Thumbnail With Legend Aside ---------------*/
.table.TWLA .item {
    display: table;
}
.table.TWLA .aspect_ratio {
    padding-bottom: 50%;
}
.table.TWLA .item_info,
.table.TWLA .item_info_supp .item_info_date_complete {
    display: none;
}
.table.TWLA .item .item_logo,
.table.TWLA .item .item_info_supp {
    position: relative;
    width: 50%;
    padding: 0;
    display: table-cell;
    vertical-align: top;
}
.table.TWLA .item .item_info_supp {
    padding: 2.5%;
}
.table.TWLA .item .item_logo img {
    width: 100%;
}
/* ------------ Vignette TWOE Thumbnail With Over Effect ---------------*/
/* .table.TWOE  .item_info_supp .item_info_titre , */
.table.TWOE .item_info_supp .item_info_date_complete {
    display: none;
}
.table.TWOE .aspect_ratio {
    padding-bottom: 130%;
}
.table.TWOE .item_content {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
.table.TWOE .item .item_info {
    padding: 2% 5%;
    width: 90%;
    position: absolute;
    /*top:77%;*/
    min-height: 23%;
    bottom: 0;
    height: auto;
    z-index: 20;
}
.table.TWOE .item .item_info .item_info_date {
    padding: 0 .3em 0 0;
    display: inline;
}
.table.TWOE .item .item_info h3.item_info_titre {
    display: inline;
}
.table.TWOE .item .item_logo {
    position: relative;
}
.table.TWOE .item .item_info_supp {
    height: 0;
    overflow: hidden;
    width: 95%;
    padding: 0 2.5%;
    position: absolute;
    top: 0;
    -webkit-transition-property: height;
    -moz-transition-property: height;
    -o-transition-property: height;
    -ms-transition-property: height;
    transition-property: height;
    z-index: 10;
}
.table.TWOE .item_info_adresse,
.table.TWOE .item_info_descriptif {
    display: none;
}
.table.TWOE .item:hover {
    cursor: pointer;
}
.table.TWOE .item:hover .item_logo img {
    -webkit-transform-origin: 50%;
    -moz-transform-origin: 50%;
    -o-transform-origin: 50%;
    -ms-transform-origin: 50%;
    transform-origin: 50%;
    -webkit-transform: scale(1.15);
    -moz-transform: scale(1.15);
    -o-transform: scale(1.15);
    -ms-transform: scale(1.15);
    transform: scale(1.15);
}
.table.TWOE .item:hover .item_info_supp {
    height: 100%;
    z-index: 10;
}
.lien_agenda_complet {
    display: block;
    padding: 0 0 1em 0;
    /* float:right; */
    clear: both;
    width: 100%;
}
.table.TWOE .item .item_info_supp a {
    position: absolute;
    top: 0;
    bottom: 0;
    padding: 2.5%;
    width: 95%;
    height: 95%;
}
/* -----------------------------------------------*/
/* --------------  ARTICLE NORMAL ----------------*/
/* -----------------------------------------------*/
.img_logo {
    margin: 20px 0;
    text-align: center;
    width: 100%;
}
#pied_article {
    /*border-top: 1px solid #CCC;*/
    margin: 1em 0 0 0;
    /*padding: 1em 0;*/
    clear: both;
    width: 100%;
}
#pied_article .social-list {
    display: table;
}
#pied_article .social-list > span {
    display: inline-block;
    float: left;
}
#pied_article .social-list > span a {
    display: block;
    padding: 0.6em 1em .6em 1em;
    margin: .5em 1em .5em 0;
    font-size: 1.1em;
    border-radius: 5px;
    border: none;
    min-width: 90px;
    text-align: left;
}
#pied_article .social-list.mini > span a {
    min-width: auto;
}
#pied_article .social-list.mini .count {
    display: none;
}
#pied_article .social-list .facebook a {
    background-color: #3b5998;
}
#pied_article .social-list .twitter a {
    background-color: #00aced;
}
#pied_article .social-list .linkedin a {
    background-color: #0077B5;
}
#pied_article .social-list .tumblr a {
    background-color: #32506d;
}
#pied_article .social-list .pinterest a {
    background-color: #cb2027;
}
#pied_article .social-list .email a {
    background-color: #cb2027;
}
#pied_article .social-list > span:hover a {
    background-color: #D82E50;
    border-color: #D82E50;
    color: white;
}
#pied_article .social-list > span i {
    font-size: 1.2em;
}
#pied_article .social-list .count {
    float: right;
}
#pied_article .imprimer {
    display: inline;
    float: right;
    text-align: right;
    vertical-align: top;
}
#documents_portfolio {
    margin-top: 20px;
}
#documents_portfolio h2 {
    /*    padding: 0;
    float: left;*/
}
#documents_portfolio a.lien_visualisation {
    display: block;
    float: right;
    padding: 5px 10px;
}
/* Portfolio */
.documents_joints {
    clear: both;
    margin: 30px auto;
    display: table;
}
.documents_portfolio .spip_logos {
    margin: 6px 3px 0 3px;
    padding: 4px;
    border: 1px solid #DDD;
}
.documents_portfolio a:hover .spip_logos {
    border-color: #F57900;
}
.documents_portfolio a.on .spip_logos {
    border-color: #8B6F92;
}
#album_evenement,
#document_joint {
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
    text-align: center;
    position: relative;
    opacity: 1;
    -webkit-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
    text-align: center;
}
#album_evenement:hover,
#document_joint:hover {
    box-shadow: 0 1px 10px rgba(0, 0, 0, 0.4);
    -webkit-transition: all 0.1s ease-out;
    transition: all 0.1s ease-out;
}
#album_evenement .info_non_adherent,
#document_joint .info_non_adherent {
    position: absolute;
    top: 0;
    left: 0;
    padding: 20px 10px;
    bottom: 0;
    right: 0;
    font-weight: 600;
    background-color: rgba(255, 255, 255, 0.8);
    opacity: 0;
}
#album_evenement:hover .info_non_adherent,
#document_joint:hover .info_non_adherent {
    opacity: 1;
    -webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
#album_evenement img {
    padding: 0;
    border: none;
    margin: 0 0;
}
#album_evenement h3,
#document_joint h3 {
    font-size: .9em;
    padding: 10px 3px;
    margin: 0;
    text-align: center;
}
#album_evenement .titre,
#document_joint .descriptif {
    font-size: .9em;
    font-weight: 600;
    padding: 5px;
    border: 1px solid #F3F3F3;
    background-color: #F9F9F9;
    color: #3E3E3E;
}
#album_evenement .lieu,
#document_joint .type {
    font-size: .9em;
    padding: 5px;
    border: 1px solid #F3F3F3;
    background-color: #F9F9F9;
    color: #3E3E3E;
    padding: 5px;
    /* height: 32px; */
}
/* -----------------------------------------------*/
/* ---------- ARTICLES AVEC EVENEMENTS -----------*/
/* ---------------------------------------------- */
.evenements_avenir_liste {}
.evenements_avenir_liste .evenements_avenir {
    padding: 15px 30px 30px 30px;
}
.evenements_avenir_liste .evenements_avenir {
    background-color: #E8E8E8;
}
.evenements_avenir_liste .evenements_avenir:nth-child(2n+1) {
    background-color: #F5F5F5;
}
.evenements_avenir_liste .evenements_avenir h3.titre {
    font-size: 1.6em;
}
.evenements_avenir_liste .evenements_avenir .programmation {
    margin: 0 0 1.5em 0;
    padding: 0;
    /*clear: both;*/
}
.evenements_avenir_liste .evenements_avenir .programmation span {
    display: table-cell;
    padding: .5em .5em .5em 0;
}
.evenements_avenir_liste .evenements_avenir .programmation .date {
    font-weight: 600;
}
.evenements_avenir_liste .evenements_avenir .logo_evenement_avenir {
    float: right;
    width: 40%;
    margin: 0 0 5% 5%;
}
.evenements_avenir_liste .evenements_avenir .action_evenement {
    clear: both;
    text-align: right;
    margin-top: 20px;
}
.conversations p {
    max-width: 42em;
}
/* -----------------------------------------------*/
/* ------------ PAGE EVENEMENT -------------*/
/* ---------------------------------------------- */
.page_evenement .google_map h4 {
    margin-top: 1em;
    margin-bottom: .5em;
}
.page_evenement .google_map iframe {
    width: 100%;
    margin: 30px 0;
}
/* -----------------------------------------------*/
/* --------- ARTICLES ARCHIVE EVENEMENTS ---------*/
/* ---------------------------------------------- */
.archive .item_logo {
    width: 100px;
}
.archive .item {
    padding: 5px 0
}
.archive .item_info {
    padding: 0 5%
}
/* ------------------------------------------------------------------------*/
/* -------------------------PAGE RUBRIQUE----------------------------------*/
/* ------------------------------------------------------------------------*/
#page_rubrique {
    margin: 0 0 15px 0;
}
.liste.articles .liste-items > li {
    margin: 0 0 30px 0;
}
/* ------------------------------------------------------------------------*/
/* ------------------------- PARTIE  --------------------------------------*/
/* ------------------------------------------------------------------------*/
.js-masonry {
    margin: 2em 0;
    position: relative;
    width: 100%;
}
.js-masonry .item {
    width: 50%;
    margin: 0
}
.js-masonry .item img {
    padding: .25% 1%;
}
.js-masonry a {}
.pc,
.tab {
    display: none;
}
.mobile {
    display: block;
}
/* ------------- Taille de police  -------------*/
.bandeau_titre h1 {
    font-size: 2.2em;
}
h2.titre_bloc {
    font-size: 1.5em;
}
.table_item .item .titre_item {
    font-size: 1.3em;
}
#main_slideshow_hp {
    margin-bottom: 0 !important
}
#main_slideshow_hp .camera_caption > div a {
    font-size: 1em;
}
#main_slideshow_hp.camera_wrap .camera_pag {
    display: none;
}
html {
    height: 100%;
    overflow-y: scroll;
    overflow-x: auto;
}
body {
    margin: 0;
    padding: 0;
    background-color: white;
    /*font-size: 95%;*/
    height: 100%;
}
#page {
    width: 100%;
    background: white;
    min-height: 100%;
    position: relative;
    min-width: 360px;
}
.header_content,
.bandeau_liens_content,
.row,
.footer,
.ligne_footer_content {
    margin-left: auto;
    margin-right: auto;
    padding-left: 1.5%;
    padding-right: 1.5%;
    width: 97%;
    max-width: 1200px;
}
#container {
    clear: both;
    position: relative;
}
.row {
    padding-top: 30px;
    padding-bottom: 30px;
}
#bloc_cours .bloc_content {
    max-width: 320px;
}
#bloc_droite {
    display: none;
}
/* ------------------------------------------------*/
/* ------------- PAGE ARTICLE ---------------------*/
/* ------------------------------------------------*/
.texte iframe {
    width: 100%
}
#bloc_actualites .table.TOC .item .item_info_supp .item_info_chapo_complet,
#bloc_actualites .table.TOC .item .item_info_supp .item_info_texte {
    display: none;
}
.programme .item_logo {
    width: 30%;
}
.programme .item_info_chapo,
.programme .item_info_texte {
    display: none;
}
.programme .item_info_supp {
    display: none;
}
.content_footer {
    padding: 5px;
    clear: both
}
div.cs_sommaire {
    position: relative;
}
/*Correction bug affichage */
img.ui-datepicker-trigger{
    width: 16px;
}
/******************************************************************
* Larger Mobile Devices
* This is for devices like the Galaxy Note or something that's 
* larger than an iPhone but smaller than a tablet. 
******************************************************************/
@media only screen and (min-width: 481px) {
    /* ------------- Taille de police  -------------*/
    .bandeau_titre h1 {
        font-size: 2.4em;
    }
    h2.titre_bloc {
        font-size: 1.7em;
    }
    .table_item .item .titre_item {
        font-size: 1.5em;
    }
    #nav_meme_rubrique {
        padding: 20px 0 0 0
    }
    .nav_meme_rub {
        width: 100%;
        max-width: 100%;
        display: table;
    }
    .nav_meme_rub li {
        display: table-cell;
        padding: 0;
        text-align: center;
        vertical-align: middle;
    }
    .nav_meme_rub li a {
        padding: 1em .5em;
    }

    /* ------------------------------------------*/
    #container {
        padding-bottom: 305px;
    }
    .img_logo {
        max-width: 350px;
        width: 40%;
        float: right;
        padding: 0 0 0 15px;
    }
    .content .programmation .info_supp,
    .content .programmation .lieu,
    .content .programmation .adress {
        display: table-cell;
    }
    .detail_evenement {
        clear: none;
        max-width: 350px;
        width: 40%;
        float: right;
        padding: 0 0 0 15px;
    }
    .detail_evenement .img_logo {
        margin: 0;
        text-align: right;
    }
    .programme .item_info_chapo {
        display: block;
    }
    .programme .item_info_texte {
        display: none;
    }
    .page_login .content .authentification,
    .page_login .content .creation_compte {
        width: 47.5%;
        padding: 0 2.5%;
        display: table-cell;
    }
    .onebyone {
        padding-bottom: 40%;
    }
    .table_item .item {
        width: 48%;
        margin: 2px 1%;
    }
    .forum_connect {
        display: inline;
        float: right;
        text-align: right;
    }
    .pagination .prev,
    .pagination .pages,
    .pagination .next {
        /*display: table-cell;*/
        white-space: nowrap;
        display: none;
    }
    .pagination .pages {
        display: table-cell;
    }
    .pagination .prev strong,
    .pagination .next strong {
        background-color: #ccc;
        color: #fff;
    }
    .pagination .prev a,
    .pagination .next a {
        background-color: #EAEAEA;
        color: #fff;
    }
    .pagination .pages a {
        background-color: #e6e6e6;
    }
    .pagination .pages strong {
        background-color: #EAEAEA;
        color: #fff;
    }
}
    /******************************************************************
* Tablet & Smaller Laptops
* This will include tablets and some netbooks.
******************************************************************/
    @media only screen and (min-width: 768px) {
        .pc,
        .mobile,
        .page_sommaire #navigation {
            display: none;
        }
        .tab {
            display: block;
        }
        .content {
            background-color: white;
            -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
            -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
            box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);

            filter: "progid: DXImageTransform.Microsoft.dropshadow(OffX=0, OffY=1, Color=#26000000, Positive=true)";
        }
        #container {
            background-color: #EDEAE8;
            padding-bottom: 215px
        }
        .content section,
        .content article,
        .right_col,
        .content_footer {
            padding-left: 5%;
            padding-right: 5%
        }
        .right_col {
            margin: auto
        }
        .right_col > div {
            margin: 20px auto;
            max-width: 450px;
        }
        .content_footer {
            padding-bottom: 25px;
        }
        .nav_meme_rub {
            list-style: none;
            text-align: left;
        }
        /* ------------------------------------------*/
        /* -------------STRUCTURE -------------------*/
        /* ------------------------------------------*/
        #page {
            width: 100%;
            margin: 0 auto;
        }
        #header {
            width: 100%;
        }
        #navigation.nav_left {
            float: left;
            width: 31.5%;
            text-align: left;
        }
        .rtl #navigation.nav_left {
            float: right;
            text-align: right;
        }
        .header_content,
        .bandeau_liens_content,
        .bloc_content,
        .footer,
        .ligne-footer {
            width: 95%;
            padding-left: 2.5%;
            padding-right: 2.5%;
        }
        #container {
            padding-bottom: 225px;
        }
        .content {
            float: right;
            width: 68.5%;
            clear: none;
        }
        .content section,
        .content article {
            padding-top: 20px;
        }
        .content #documents_portfolio {
            padding: 0;
        }
        .camera_fakehover {
            height: 100%;
        }
        .pagination .prev,
        .pagination .pages,
        .pagination .next {
            display: table-cell;
            white-space: nowrap;
        }
    }
    /******************************************************************
* DESKTOP 
* This is the average viewing window. So Desktops, Laptops, and 
* in general anyone not viewing on a mobile device. Here's where
* you can add resource intensive styles.
******************************************************************/
    @media only screen and (min-width: 1025px) {
        /* ------------- Taille de police  -------------*/
        .bandeau_titre h1 {
            font-size: 3em;
        }
        h2.titre_bloc {
            font-size: 2em;
        }
        .table_item .item .titre_item {
            font-size: 1.5em;
        }
        /* ------------------------------------------*/
        .content section,
        .content article {
            float: left;
            padding: 15px .5% 15px 2.5%;
            width: 69%;
            width: calc(97% - 250px);
        }
        .rtl .content article {
            float: right;
            padding: 15px 2.5% 15px .5%;
        }
        .content .right_col {
            float: right;
            background-color: transparent;
            width: 24%;
            padding-right: 2.5%;
            padding-left: 1.5%;
            width: calc(220px);
            padding-right: calc(15px);
            padding-left: calc(15px);
        }
        .rtl .content .right_col {
            float: left;
            background-color: transparent;
            width: 24%;
            padding-right: 1.5%;
            padding-left: 2.5%;
        }
        .content_footer {
            padding-left: 2.5%;
            padding-right: 2.5%;
        }
        .tab,
        .mobile,
        #bloc_droite {
            display: none;
        }
        .pc {
            display: block;
        }
        .rubrique_agenda.two_third {
            width: 100%;
        }
        /*COMPO AVEC CALENDRIER ou FORMULAIRE INSCRIPTION*/
        .page_article.article_activites .content article,
        .page_article.article_evenements .content article,
        .page_evenement.evenement_activites .content article,
        .page_evenement.evenement_evenements .content article {
            width: 54.5%;
            width: calc(97% - 310px);
        }
        .page_article.article_activites .content .right_col,
        .page_article.article_evenements .content .right_col,
        .page_evenement.evenement_activites .content .right_col,
        .page_evenement.evenement_evenements .content .right_col {
            width: 37%;
            min-width: 280px;
            width: calc(280px);
        }
        .rubrique_activites .content section,
        .rubrique_evenements .content section {
            float: none;
            padding: 30px 2.5%;
            width: 95%;
        }
        /* ---------------------------------------------*/
        /* -------------STRUCTURE ----------------------*/
        /* ---------------------------------------------*/
        #container {
            padding-top: 140px;
            padding-bottom: 200px;
        }
        .content {
            width: 76.5%;
        }
        #pied_article {
            width: 100%;
        }
        #navigation.nav_left {
            float: left;
            width: 23.5%;
            text-align: left;
        }
        .content .programmation .date {
            display: table-cell;
        }
    }
    /******************************************************************
* LARGE VIEWING SIZE 
* This is for the larger monitors and possibly full screen viewers.
******************************************************************/
    @media only screen and (min-width: 1240px) {
        .bloc_content {
            padding: 50px 0;
        }
        /* ------------------------------------------------------------------------*/
        /* ------ COMPOSITION  SANS COLONNE DE DROITE------------------*/
        /* ------------------------------------------------------------------------*/
        .rubrique_activites .content section,
        .rubrique_evenements .content section {
            padding: 50px 5%;
            width: 90%;
        }
    }
    @media only screen and (min-width:1500px) {}
    /******************************************************************
* RETINA (2x RESOLUTION DEVICES)
* This applies to the retina iPhone (4s) and iPad (2,3) along with 
* other displays with a 2x resolution. You can also create a media
* query for retina AND a certain size if you want. Go Nuts.
******************************************************************/
    @media only screen and (-webkit-min-device-pixel-ratio: 1.5),
    only screen and (min--moz-device-pixel-ratio: 1.5),
    only screen and (min-device-pixel-ratio: 1.5) {}