/*----   Styles pour une zone d'affichage jusqu'à 799px    ----*/
@media handheld,
only screen and (max-device-width:767px),
only screen and (max-width:767px),
only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (min-device-pixel-ratio: 1.5){
    body {
      
    }
    #global {
        width: 320px;
    }
    #global .home_contenu{
        width: 100%
    }
    #logo h1 a {
        
    }
    #menu_top {
        display: none;
    }
    #recherche form {
        display: none;
    }
    #recherche span.picto_recherche {
        display:block;
    }
    .menu_top_droite{
        float: left;
        margin-left: 100px;
    }
    .menu_top_droite span.picto_user {
        display:block;
        float:left;
    }
    #logo {
        background: none;
        float: left;
        margin: 0;
        width: 320px;
    overflow: hidden;
        text-align:center;
    }
    #logo h1 {
    margin: 0 0 0 -15px;
    padding: 0;
    width: 335px;   
    }    
    #logo img {
    width: 350px;
    }
    #logo_plaine ,#bouton_bandeau,#image_bandeau {
        display:none;
    }
    
     #menu_principal {
        background: url("../images/interface/bg_menu_gris_noir.jpg") repeat-x scroll 0 1px transparent;
    }
    #menu_principal_gauche,
    .global_home #menu_principal_gauche {
        background:none;
        position: inherit;
        width: 100%;
        height: 48px;
        border-bottom:1px solid #000000;
    }
    ul#nav_principal {
        display:none;
    }
    
    .menu_principal_droite{
        display:none;
    }
    ul#nav_gauche li{
        width: 300px;
    }
    ul#nav_gauche li.active a{
        width: 280px;
    }
    p.bouton_menu {
        display:block;
        font-family: 'HelveticaNeueLTStdCnBold';
        text-transform:uppercase;
        font-size:1.5em;
        height: 48px;
        line-height: 2.5;
        padding: 0 0 0 15px;   
    }
    p.bouton_menu a {
        color:#000000;
        background: url(../images/interface/menu_mobile.jpg) right 1px transparent no-repeat;
        display: block;
        height: 49px;
    }
    p.bouton_menu a.open {
        background: url(../images/interface/menu_mobile_on.jpg) right 1px transparent no-repeat;
        height: 48px;
    }
    p.bouton_menu a:hover {
        text-decoration:none;
    }
    p.bouton_menu img {
        float: right;
    }
    #logo_plaine ,#bouton_bandeau,#image_bandeau {
        display:none;
    }
    .fond_gris{
        width: 85%;
    }
    #global li.lactu_liste_item a img{
        width: 250px;   
        height: 200px;
    }
    #inter_contenu,.global_home ul#nav_principal,ul#nav_principal{
        width: 350px;
    }
      h3.lactu_liste_titre{
        width: 250px;
    }
    #global .lactu_liste_item_contenu{
        width: 300px;
        margin-top: 30px;
    }
    .lactu_liste{
        width: 250px;
    }
    .home_lactu{
        width: 250px;
    }
    .lactu_liste_contenu{
        width: 250px;
    }
    ul#nav_principal li:hover .ssmenu {
        display:none;
    }
    ul#nav_principal li {
        font-size:0.95em;
        width: 159px;
    }
    ul#nav_principal li.menu1 {
        width: 159px;
    }
    ul#nav_principal li.menu2 {
        width: 159px;
    }    
    ul#nav_principal li.menu3 {
        width: 159px;
    }
    ul#nav_principal li.menu4 {
        width: 159px;
    }
    ul#nav_principal li.menu5 {
        width: 159px;
    }
    ul#nav_principal li.menu6 {
       width: 160px;
       border-right:inherit;
    }
    ul#nav_principal li.menu7 {
       width: 319px;
       position:inherit;
       right: 0;
    }
    .global_home ul#nav_principal li.menu7 {
    right: inherit;
    }
    .home_contenu_gauche {
       float: none;
       margin: 0 auto;
       width: 300px;
   }   
    .home_contenu_droite {
    float: none;
    margin: 0 auto;
    width: 292px;
    }
       h2.grand_taille {
        position: absolute;
        top: 143px;
        z-index: 40;
    }
    span.picto_rss {
        left: 130px;
        position: absolute;
        top: 144px;
        z-index: 40;
    }
    .alaune_nav {
        position: absolute;
        right: 10px;
        top: 150px;
        width: 230px;
        z-index: 40;
    }
    .alaune {
        float: left;
        height: 390px;
        overflow: hidden;
        position: relative;
        top: 201px;
        width: 100%;
    }
    .alaune_fil_info {
        height: 114px;
        padding: 15px 12px;
        position: absolute;
        right: 0;
        top: -1px;
        width: 296px;
        z-index: 30;
    }
    ul#nav_plan_site {
    display:none;
    }
    .bas_menu_contenu {
    margin: 0 auto;
    width: 320px;
    }
    #bas_menu {
    height:auto;
    }
    ul#nav_bas {
    float: none;
    margin: 0;
    padding: 0;
    text-align: center;
    }
    ul#nav_bas li {
    display: inline;
    float: none;
    font-size: 1em;
    padding: 0 4px;
    width: auto;
    }
    #barre_outils{
        display: none;
    }
    #bas_menu .reseaux_sociaux {
    float: none;
    margin: 0 auto;
    width: 131px;
    }
    .bas_plan_site_contenu {
    width: 100%;
    }
    #bas_plan_site {
    padding: 0 0 20px;
    }
        div.lactu_commandes{
        left: 180px;
        top: 270px
    }
        .caroufredsel_wrapper{
        height: 350px !important;
    }
    .lactu_plus{
        clear: both;
        float: left;
        margin-left: 100px;
    }
        #colonne_centre_contenu{
        width: 250px;
    } 
     .news-single-img img{
        width: 250px;
        height: 200px;
    }
    .news_single_image,.news_single_image p.news-single-imgcaption{
        width: 250px !important;
    }
    .bloc_partager{
        padding-bottom: 30px;
    }
    #colonne_centre{
        width: 350px;
        margin-left: 10px;
    }
    #colonne_centre_contenu{
        width: 260px;
    }
    fieldset.tx-powermail-pi1_fieldset, div.tx-powermail-pi1_confirmation, div.tx-powermail-pi1_thx{
        padding: 0;
    }
    .contenu fieldset.tx-powermail-pi1_fieldset textarea.powermail_textarea{
        width: 265px;
    }
    #fil_ariane{
        overflow: hidden;
        padding-bottom: 5px;
    }
    #fil_ariane_contenu{
        width: 340px
    }
    fieldset.tx-powermail-pi1_fieldset label, fieldset.tx-powermail-pi1_fieldset fieldset legend{
        width: 65%;
    }
        .fond_gris dl{
        width: 130px !important;
    }
    p.top_link{
        left: 200px;
    }
}

/*----   Styles pour une zone d'affichage entre 800px et 1023px    ----*/
/*----   Le min-device etait a 783, remplacé par 768 (= site principal)    ----*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1006px) and (orientation:portrait) and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-device-width: 768px) and (max-device-width: 1006px) and (orientation:portrait),
(min-width: 768px) and (max-width: 1006px) {
    #global{
        width:100%;
        overflow:hidden;
    }
    #haut_menu_contenu,
    .global_home #haut_menu_contenu {
        width: 100%;
    }
    ul#nav_top li{
        padding: 8px 4px 7px;
    }
    #haut_bandeau_contenu ,
    .global_home #haut_bandeau_contenu {
        width: 100%;
    }
    #image_bandeau {
    display:none;
    }
    ul#nav_top {
    margin: 0    
    }
    .global_home ul#nav_principal,
    ul#nav_principal{
        width: 100%;
    }
    ul#nav_principal li{
        line-height: 1;
    }
    ul#nav_principal li ul.sousmenu li .sousmenu_image {
    display: none;
    }
    ul#nav_principal li {
    font-size: 0.95em;
    }
    ul#nav_principal li.menu1 {
    width: 97px;
    }
    ul#nav_principal li.menu1 .bgitem {
    padding: 0;
    }    
    ul#nav_principal li.menu2 {
    width: 90px;
    }
    ul#nav_principal li.menu3 {
    width: 134px;
    }
    ul#nav_principal li.menu4 {
    width: 92px;
    }
    ul#nav_principal li.menu5 {
    width: 117px;
    }
    ul#nav_principal li.menu6 {
    width: 83px;
    border-right:1px solid #000000;
    }
    ul#nav_principal li.menu7 {
    width: 111px;
    }
    ul#nav_principal li .ssmenu{
        max-width: 1000px;
        min-width: 750px;
        width:auto;
    }
    ul#nav_principal li.menu1 .ssmenu {
    left: -1px;
    }
    ul#nav_principal li.menu2 .ssmenu {
    left: -109px;
    }
    #colonne_centre{
        width:auto;
    }
    #colonne_principal{
        float:none;
        position: static;
    }
    #inter_contenu{    
        float: left;
        position: relative;
        width: auto;
    }
    #colonne_centre_contenu{
    width: 440px;
    }
    .news-single-img img,.news_single_image,.news_single_image p.news-single-imgcaption{
    width: 440px !important;
    }
    #barre_outils{
    float: left;
    margin-left:250px;
    }
    ul#nav_principal li.menu3 .ssmenu { 
    left: -210px;
    }
    ul#nav_principal li.menu4 .ssmenu {
    left: -355px;
    }
    ul#nav_principal li.menu5 .ssmenu {
    left: -458px;
    }
    ul#nav_principal li.menu6 .ssmenu {
    left: -590px;
    }
    ul#nav_principal li.menu7 .ssmenu {
    width: 213px;
    }
    ul#nav_principal li.menu7 ul.sousmenu li {
    padding: 0;
    width: 92%;
    }
    .home_contenu_gauche {
    margin: 0 0 0 5%;
    width: 51%;
    }
    .home_contenu_droite {
    margin: 0 0 0 5%;
    width: 65%;
    }   
    .bloc_droite{
        margin: 10px 0 10px 250px;
    }
    .bas_plan_site_contenu,
    .bas_menu_contenu {
    width: 100%;
    }
    ul#nav_bas li {
    font-size: 1em;
    padding: 0 9px 0 0;
    }
    #bas_menu .reseaux_sociaux {
    width: 106px;
    }
    .bas_menu_contenu .reseaux_sociaux DIV.csc-textpic DIV.csc-textpic-imagewrap .csc-textpic-image {
    margin: 0;
    }
    #bas_menu .reseaux_sociaux a {
    margin: 0;
    }
    ul#nav_plan_site {
    width: 100%;
    }
    ul#nav_plan_site>li {
    height:auto;
    width: 100%;
    margin:0 0 10px 0;
    }
    ul#nav_plan_site li a {
    margin: 0 1%;
    width: 15%;
    word-wrap: break-word;
    }
    ul#nav_plan_site li ul { 
    float: left;
    left: 0;
    width: 80%;
    position:relative;
    }
    ul#nav_plan_site li ul li {
    padding:0 0 0 10px;
    }
    .coordonnees {
    margin: 0;
    }  
    .fond_gris dl{
        width: 250px !important;
    } 
    .coordonnees > div {
        float: left;
        margin: 0 30px 0 10px;
    }
    .bloc_centre dl.csc-textpic-image img,.csc-textpic-single-image img{
        height: auto;
        max-width: 420px;
    }
    .bloc_centre DIV.csc-textpic-center DIV.csc-textpic-imagewrap {
        max-width: 420px;
    }
}

/*----   Styles pour une zone d'affichage entre 1024px et 1279px    ----*/
@media only screen and (min-device-width: 1007px) and (max-device-width: 1262px) and (orientation:portrait),
only screen and (min-device-width: 1007px) and (max-device-width: 1262px) and (orientation:portrait),
(min-width: 1007px) and (max-width: 1262px) {

    .home {

    }
    .global_home #haut_menu_contenu,
    .global_home #haut_bandeau_contenu,
    .global_home ul#nav_principal{
        width:100%;
    }
    #logo {
    overflow: hidden;
    width: 350px;
    }    
    #image_bandeau {
    overflow: hidden;
    width: 48%;
    }
    ul#nav_principal li.menu1 {
    width: 115px;
    } 
    ul#nav_principal li.menu2 {
    width: 155pxpx;
    }
    ul#nav_principal li.menu3 {
    width: 150px;
    }
    ul#nav_principal li.menu4 {
    width: 181px;
    }
    ul#nav_principal li.menu5 {
    width: 200px;
    }
    ul#nav_principal li.menu6 {
    width: 137px;
    border-right:1px solid #000000;
    }
    ul#nav_principal li.menu7 {
    width: 100px;
    }
    ul#nav_principal li.menu7 {
    right: 19px;
    }
    .home_contenu_gauche {
       margin: 0 0 0 4%;
       width: 51%;
   }
    #haut_menu_contenu,
    #haut_bandeau_contenu,
    ul#nav_principal,
    #fil_ariane_contenu {
        width:1007px;
        width: 100%;
    }
    #inter_contenu {
        width: 970px;
    }
    #colonne_principal {
        width: 700px;
    }
    #colonne_centre {
        margin: 0 0 20px;
    }
    .page_agenda #colonne_centre,
    .page_agenda #colonne_centre_contenu {
        width: 720px;
    }
    #colonne_droite {
        margin: 0;
        width: 720px;
    }
    .bloc_droite {
        margin: 0 20px 20px 0;
    }
}

/*----   Styles pour une zone d'affichage entre 1600px et 1919px    ----*/
@media screen and (min-width: 1583px) and (max-width: 1902px) {

    .home_contenu_gauche {
    width: 75%;
    }    
}
/*----   Styles pour une zone d'affichage supérieur à 1920px   ----*/
@media screen and (min-width: 1920px) {

    .home_contenu {
    width: 1250px;
    }
    .home_contenu_gauche {
    width: 75%;
    }

}



