            /* GOOGLE FONTS */
        
        @import url(https://fonts.googleapis.com/css?family=Quicksand|Exo:500,700|Pacifico);
        .font-quicksand {
            font-family: 'Quicksand', sans-serif;
            font-weight: 400;
        }
        
        .font-exo {
            font-family: 'Exo', sans-serif;
            font-weight: 500;
            color: white;
            text-decoration: none;
        }
        
        .font-exo-bold {
            font-family: 'Exo', sans-serif;
            font-weight: 700;
        }
        
        .font-pacifico {
            font-family: 'Pacifico', cursive;
            font-weight: 400;
        }
        
        body {
            background: #fff;
            margin: 0;
        }


        #header{
                background-color: #141414;


        }

ul#main_menu {
    max-width: 960px;
    margin: auto;
    width: 100%;
}

.nav li a {
    display: inline-block;
    padding: 0;
    margin: 0;
    color: #000;
    text-transform: uppercase;
    font-size: 11px;
    padding: 18px 21px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 700!important;
      text-decoration: none;
    
}
        .nav li {
    display: block;
    float: left;
    margin: 0 0 0 0;
}

        .nav ul,  div .nav {
    list-style: none;
    display: block;
    padding: 0;
  
    margin: 0;
       text-transform: uppercase;
}


        #logowrapper {
            margin: auto;
            padding: 20px;
            max-width: 960px;
        }
        #logo img{
            max-width: 250px;
        }
        #container {
            position: absolute;
            width: 100%;
            height: 80%;
        }
         #container2 {
            position: absolute;
            width: 100%;
            font-family: 'Exo', sans-serif;

            top: 100%;
        }
        
        #retour {
            
            text-align: center;
            font-size: 12px;
            text-decoration: none;
            color: #000;
            font-family: 'Exo', sans-serif;
            margin: 27px 0;

        }
        
        #retour a {
            font-size: 12px;
            text-decoration: none;
            color: white;
        }
        
   

        .footer{ width: 100%;
            margin: auto;
            font-weight:700;
            font-family: 'Open Sans', sans-serif;
            background-color: #141414;



        }

         .footer .nav li a {
          color: #fff;
        }
        .footer p{
            color: #fff;
        }
        .footerlink{ float:left;
            width: 33.3%;
            text-align:center;
          background-color: #282828;
          padding: 15px 0;
          min-width: 250px;


        }
        .footerlink a{ 
            color: #D0D0D0; 
            text-decoration:none;
            line-height: 23px;
            font-size: 13px;
        }
        .footerlink a:hover{ 
            color: #fff;

        }


        .footerlink2{ float:left;
            width: 33.3%;
            text-align:center;
          background-color: #282828;
          padding: 15px 0;
          min-width: 250px;

        }
        .footerlink2 a{ 
            color: #D0D0D0; 
            text-decoration:none;
            line-height: 23px;
            font-size: 13px;
            
        }
        .footerlink a:hover{ 
            color: #fff;

        }
        .brdl {
    border-left: 1px solid #d0d0d0;
}
#copyright {
    width: 100%;
    margin: auto;
    padding: 0;
    clear: both;
    font-size: 12px;
    letter-spacing: 0;
    background: #141414;
    color: #fff;
    border-top: 1px solid #444;
    font-weight:700;
    font-family: 'Open Sans', sans-serif;
}

.copyright_wrapper {
    width: 960px;
    margin: auto;

}
.copyright_wrapper .left_wrapper {
    float: left;
    width: 540px;
    margin: 25px 0 15px 0;
}

.copyright_wrapper .right_wrapper {
    float: right;
    width: 380px;
    text-align: right;
    margin: 10px 0 15px 0;
}
#copyright .social_wrapper {
    position: static;
    float: right!important;
    margin-top: 10px;
}
.social_wrapper li {
    float: right;
    margin-left: 5px;
    display:inline-block;
    text-align: -webkit-match-parent;
}
#copyright a {
    color: #999;
    text-decoration: none;
}
#copyright a:hover {
    color: #5fc02b;
}






        /* bottom links */
        
        .bottom_links a {
            display: block;
            height: 100px;
            margin-top: 10px;
            padding: 18px 0 0 22px;
            background-color: #282828;
            -webkit-transition: all ease 0.3s;
            -moz-transition: all ease 0.3s;
            -ms-transition: all ease 0.3s;
            transition: all ease 0.3s;
        }
        
        .bottom_links a:hover {
            background-color: #323232;
        }
        
        .bottom_links a img {
            display: block;
            float: left;
            width: 50px;
        }
        
        .bottom_links a .text {
            float: left;
            width: 200px;
            padding: 2px 0 0 18px;
        }
        
        .bottom_links a .text .big {
            font-size: 18px;
            line-height: 20px;
            color: #ffffff;
        }
        
        .bottom_links a .text .small {
            font-size: 12px;
            color: #ffffff;
        }
        
        .bottom_links a .text .button {
            float: left;
            margin-top: 4px;
            padding: 2px 4px 1px 4px;
            border-radius: 4px;
            font-size: 12px;
            color: #141414;
        }
        
        .bottom_links .groupe .button {
            background-color: #5FC02B;
        }
        
        .bottom_links .mag .button {
            background-color: #BBD93A;
        }
        
        .bottom_links .newsletter .button {
            background-color: #35B6B2;
        }
        /* newsletter */
        
        #modal-news input {
            border: solid 1px #DDDDDD;
        }
        
        #modal-news .news_success {
            display: none;
            clear: both;
            margin: 10px 0 10px 0;
            padding: 6px 12px 6px 12px;
            background-color: #35B6B2;
            font-size: 14px;
            color: #000000;
        }
        
        #modal-news .news_error {
            display: none;
            clear: both;
            margin: 10px 0 10px 0;
            padding: 6px 12px 6px 12px;
            background-color: #E5007E;
            font-size: 14px;
            color: #000000;
        }
        /* RESPONSE MEDIUM */
        
        @media (min-width: 640px) {
            #carousel {
                display: block;
            }
            a.color-block {
                float: left;
                width: 295px;
                margin-top: 10px;
            }
            a.catalogue {
                margin-right: 10px;
            }
            a.flyer {
                margin-right: 10px;
            }
            a.blog {
                width: 150px;
            }
            .mono-blocks {
                clear: none;
                float: left;
                width: 295px;
            }
            .mono-block {
                padding-top: 6px;
            }
            .mono-blocks .search input {
                width: 240px;
            }
            .mono-blocks .rdv {
                height: 65px;
            }
            div.clic_collect {
                display: none;
            }
            div.clic_collect_m {
                display: block;
            }
            .bottom_links {
                height: 160px;
                margin-top: 250px;
                margin-left: 508px;
            }
            .bottom_links a {
                display: block;
                float: left;
                width: 193px;
                height: 150px;
                margin-top: 10px;
                margin-right: 10px;
                padding: 12px 0 0 16px;
            }
            .bottom_links a.newsletter {
                width: 194px;
                margin-right: 0;
            }
            .bottom_links a img {
                float: none;
            }
            .bottom_links a .text {
                float: none;
                padding: 10px 0 0 0;
            }
        }
        /* RESPONSE LARGE */
        
        @media (min-width: 940px) {
            #carousel {
                float: right;
            }
            .color-blocks {
                float: left;
            }
            a.color-block {
                float: none;
                width: 250px;
                margin-top: 0;
            }
            a.mini-color-block {
                margin-top: 10px;
            }
            a.blog {
                width: 135px;
            }
            .mono-blocks {
                width: 310px;
                margin-top: 10px;
            }
            .mono-blocks .search input {
                width: 254px;
            }
            div.clic_collect_m .left,
            div.clic_collect_m .right {
                width: 300px;
            }
            div.clic_collect_m .diapo {
                width: 215px;
                height: 140px;
                border-left: solid 1px #888888;
            }
            div.clic_collect_m .diapo:first-child {
                border-left: none;
            }
            div.clic_collect_m .txt {
                display: none;
            }
            div.clic_collect_m .txt_l {
                display: block;
            }
            .bottom_links {
                height: 110px;
            }
            .bottom_links a {
                width: 280px;
                height: 100px;
                padding: 18px 0 0 22px;
            }
            .bottom_links a.newsletter {
                width: 280px;
            }
            .bottom_links a img {
                float: left;
            }
            .bottom_links a .text {
                float: left;
                padding: 2px 0 0 18px;
            }
            /*footer {
                width: 1076px;
                height: 86px;
                clear: both;
                margin-top: 20px;
                padding: 20px 0 20px 0;
                background-color: #282828;
            }
            footer.disp-m {
                display: none;
            }
            footer.disp-l {
                display: none;
            }
            footer table {
                width: 100%;
                border-collapse: collapse;
            }
            footer td {
                vertical-align: top;
                text-align: center;
                font-size: 13px;
                line-height: 23px;
                color: #D0D0D0;
            }
            footer.disp-m td {
                width: 50%;
            }
            footer.disp-l td {
                width: 33%;
            }
            footer td.border {
                border-right: solid 1px #888888;
            }
            footer a {
                text-decoration: none;
                color: #D0D0D0;
            }
            footer a:hover {
                color: #ffffff;
            }
            .menu_footer {
                width: 960px;
                margin: auto;

            }*/
            .menu {
                background-color: #282828;
                width: 280px;
                height: 100px;
                float: left;
                margin-left: 10px;
                margin-top: 80px;
            }
            .autres {
                width: 960px;
                background-color: #282828;
                margin-left: 10px;
                margin-top: 280px;
            }

           div.clic_collect_m .left, div.clic_collect_m .right {
           float: left;
        /*width: 170px;*/
        height: 50px;
         border-bottom: solid 2px #888888;
      }
      div.clic_collect_m .logo {
    float: left;
    width: 260px;
    height: 110px;
    overflow: hidden;
    text-align: center;
}
div.clic_collect_m .txt_l {
        padding-top: 12px;
    text-align: center;
    font-size: 11px;
    color: #ffffff;
}
div.clic_collect_m .diapo {
    width: 214px;
    height: 140px;
    border-left: solid 1px #888888;
}

div.clic_collect_m .diapo {
    float: left;
    
    height: 170px;
}
.clear {
    clear: both;
}

div.clic_collect_m .img {
    text-align: center;
}

div.clic_collect_m {
    padding-bottom: 30px;
    clear: both;
    height: 280px;
    margin-top: 20px;
    margin-bottom: 30px;
    border-bottom: solid 2px #888888;
}

#sociali .logo img{
        display: block;
    margin: auto;
}

div#sociallogo {
    margin: auto;
    width: 140px;
}}

          /* div.clic_collect{
    position: relative;
    margin-top: 30px;
    margin-bottom: 40px;
    text-align: center;
}

div.clic_collect .logo{
    height: 92px;
    overflow: hidden;
    text-align: center;
}

div.clic_collect .line{
    width: 1px;
    height: 28px;
    margin: 10px auto 10px auto;
    border: dashed 1px #888888;
}

div.clic_collect .txt{
    padding-top: 10px;
    font-size: 12px;
    color: #ffffff;
}
*/


/* click & collect medium */

/*div.clic_collect_m{
    display: none;
    clear: both;
    height: 280px;
    margin-top: 20px;
    margin-bottom: 30px;
    border-bottom: solid 2px #888888;
}

div.clic_collect_m .left,
div.clic_collect_m .right{
    float: left;
    width: 170px;
    height: 50px;
    border-bottom: solid 2px #888888;
}

div.clic_collect_m .logo{
    float: left;
    width: 260px;
    height: 110px;
    overflow: hidden;
    text-align: center;
}

div.clic_collect_m .diapo{
    float: left;
    width: 150px;
    height: 170px;
}

div.clic_collect_m .img{
    text-align: center;
}

div.clic_collect_m .txt{
    padding-top: 10px;
    text-align: center;
    font-size: 10px;
    color: #ffffff;
}

div.clic_collect_m .txt_l{
    display: none;
    padding-top: 12px;
    text-align: center;
    font-size: 11px;
    color: #ffffff;
}*/
@media only screen and (min-width: 800px) {
    .deskhide {
        display: none!important;
    }}



@media only screen and (max-width: 800px) {
    #logowrapper {
text-align: center!important;
    }
.mobhide{
    display: none!important;
}

.nav li{
float: none!important;}


.copyright_wrapper .left_wrapper {
    float: none!important;
    text-align: center;
    width: 100%;
    margin: 25px 0 15px 0;
}
.copyright_wrapper{

    width: 100%;
}

.copyright_wrapper .right_wrapper {
   width: 100%;
    text-align: center!important;
}
.social_wrapper li {
    float: none!important;
    
}


#copyright .social_wrapper {
    float: none!important;
   
}
ul.social_wrapper {
    padding-left: 0!important
}

#container{
    height: 65%!important;
}
}