/* --------------------------------------------------------- */
/* APPLE MACBOOK PRO RETINA ETC. --------------------------- */
/* --------------------------------------------------------- */
 
/* Retina Displays/Screens (2880x1800) --------------------- */
@media
only screen and (min--moz-device-pixel-ratio: 2),
only screen and (-o-min-device-pixel-ratio: 2/1),
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-device-pixel-ratio: 2),
only screen and (min-resolution: 2dppx) {
}
 
 
 
 
/* --------------------------------------------------------- */
/* SMARTPHONES, TABLETS & TINY DESKTOPS -------------------- */
/* --------------------------------------------------------- */
 
/* Old Smartphones (portrait and landscape) ---------------- */
@media
only screen and (min-device-width: 240px) and (max-device-width: 320px) {
    /* YOUR STYLES */
}
 
 
/* Old Smartphones (e.g. portrait) ------------------------- */
@media
only screen and (max-width: 319px) {
}
 
 
/* Smartphones (portrait and landscape) -------------------- */
@media
only screen and (min-device-width: 320px) and (max-device-width: 640px) {
    /* YOUR STYLES */
}
 
 
/* Smartphones (portrait) & Old SP (landscape) ------------- */
@media
only screen and (min-width: 320px) and (max-width: 479px) {
    /* YOUR STYLES */
}
 
 
/* Smartphones (landscape) & Old Tablets (Portrait) -------- */
@media
only screen and (min-width: 480px) and (max-width: 639px) {
 
}
/* Smartphones & Tablets (landscape) & Splitted Desktops --- */
@media
only screen and (min-width: 800px) and (max-width: 1000px) { 
} 
/* --------------------------------------------------------- */
/* DEVICES BY RATIO ---------------------------------------- */
/* --------------------------------------------------------- */
 
/* LowRes (e.g. 240x320 / 320x480) ------------------------- */
@media
only screen and (min--moz-device-pixel-ratio: 0.75),
only screen and (-o-min-device-pixel-ratio: 3/4),
only screen and (-webkit-min-device-pixel-ratio: 0.75),
only screen and (min-device-pixel-ratio: 0.75),
only screen and (min-resolution: 0.75dppx) {
    /* YOUR STYLES */
}
 
 
/* HighRes ------------------------------------------------- */
@media
only screen and (min--moz-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min-device-pixel-ratio: 1.5),
only screen and (min-resolution: 1.5dppx) {
    /* YOUR STYLES */
     
    /* e.g. HighRes Logo (use _2x as extension for double-sized images) */
    /* .logo {background-image: url(logo_2x.png); background-size: 50%;} */
}
 
 
/* RetinaRes Smartphones (e.g. iPhone 4 / portrait) -------- */
@media
only screen and (min--moz-device-pixel-ratio: 1.5) and (orientation: portrait),
only screen and (-o-min-device-pixel-ratio: 3/2) and (orientation: portrait),
only screen and (-webkit-min-device-pixel-ratio: 1.5) and (orientation: portrait),
only screen and (min-device-pixel-ratio: 1.5) and (orientation: portrait),
only screen and (min-resolution: 1.5dppx) and (orientation: portrait) {
    /* YOUR STYLES */
}
 
 
/* RetinaRes Smartphones (e.g. iPhone 4 / landscape) ------- */
@media
only screen and (min--moz-device-pixel-ratio: 1.5) and (orientation: landscape),
only screen and (-o-min-device-pixel-ratio: 3/2) and (orientation: landscape),
only screen and (-webkit-min-device-pixel-ratio: 1.5) and (orientation: landscape),
only screen and (min-device-pixel-ratio: 1.5) and (orientation: landscape),
only screen and (min-resolution: 1.5dppx) and (orientation: landscape) {
    /* YOUR STYLES */
}
 
 
 
 
 
/* --------------------------------------------------------- */
/* IPADS --------------------------------------------------- */
/* --------------------------------------------------------- */
 
/* iPads (portrait and landscape) -------------------------- */
@media
only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
    /* YOUR STYLES */
}
 
 
/* iPads (portrait) ---------------------------------------- */
@media
only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
    /* YOUR STYLES */
}
 
 
/* iPads (landscape) --------------------------------------- */
@media
only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
    /* YOUR STYLES */
}
 
 
/* iPad Retina (iPad 3; portrait and landscape) ------------ */
@media
only screen and (min-device-width: 1536px) and (max-device-width: 2048px) and (min--moz-device-pixel-ratio: 2),
only screen and (min-device-width: 1536px) and (max-device-width: 2048px) and (-o-min-device-pixel-ratio: 2/1),
only screen and (min-device-width: 1536px) and (max-device-width: 2048px) and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-device-width: 1536px) and (max-device-width: 2048px) and (min-device-pixel-ratio: 2),
only screen and (min-device-width: 1536px) and (max-device-width: 2048px) and (min-resolution: 2dppx) {
    /* YOUR STYLES */
}
 
 
 
 
 
/* --------------------------------------------------------- */
/* COMPUTERS / OTHER DEVICES ------------------------------- */
/* --------------------------------------------------------- */
 
/* Displays/Screens (e.g. MacBook @ 1280x800) -------------- */
@media
only screen and (min-width: 1250px) and (max-width: 1409px) {
    /* YOUR STYLES */
}
 
 
/* Displays/Screens (e.g. 19" WS @ 1440x900) --------------- */
@media
only screen and (min-width: 1410px) and (max-width: 1649px) {
    /* YOUR STYLES */
}
 
 
/* Displays/Screens (e.g. 22" WS @ 1680x1050) -------------- */
@media
only screen and (min-width: 1650px) and (max-width: 1889px) {
    /* YOUR STYLES */
}
 
 
/* Displays/Screens (e.g. 24" WS @ 1920x1080) -------------- */
@media
only screen and (min-width: 1890px) and (max-width: 2529px) {
    /* YOUR STYLES */
}
 
 
/* Really Large Displays/Screens (e.g. 2560x1440) ---------- */
@media
only screen and (min-width: 2530px) {
    /* YOUR STYLES */
}
@media
only screen and  (max-width: 1024px) {
         
 /* passer tous les éléments de largeur fixe en largeur automatique */
 body, element1, element2 {
   width: auto;
   margin: 0;
   padding: 0;
 }
 /*cache le menu de gauche*/
 #menuGauche{
    //float:none;
    //position:relative;
    //display: none;
 }
 .barreBleue{
    position: absolute;
    width:100%;
    border-radius: 0px;
 }

 .cadreMenuVerticalBody{
    width:auto;
    border:none;
 }
 /*cache le menu de droite*/
 #colonneDroite{
    display:none;
 }
 /*cache les avis*/
 .hreview-aggregate{
    display:none;
 }
 /*masque le slogan*/
 #slogan{
    display:none;
 }
 /*centre le logo*/
 #logoIP{
    top: 5%;
    width:200px;
    left:50%;
    margin-left: -100px;
    position: relative;
 }
 /* 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 et empêcher les débordements de boîtes dûs aux border ou padding */
 img {
   height: auto; width: auto;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
 }

 /* gestion des mots longs */
 textarea, table, td, th, code, pre, samp {
   word-wrap: break-word; /* passage à la ligne forcé */
   -webkit-hyphens: auto; /* césure propre */
   -moz-hyphens: auto;
   hyphens: auto;
 }
 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;
 }
 /* masque le menu horizontal*/
 .menuHorizontalFixe {
    display:none;
 }
 #footer { 
/*Le même que dans style2.css*/
	margin: 10px 0px 2px 0px;
	padding: 2px 2px 2px 2px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #8c8c8c;
	text-align: center;
	/*En plus: Afficher le footer en bas de page*/
	position: static;
	background:white;
	/*margin-top:200%;*/
	

 }


.ImageProduits img{
  max-height: 50px;
} 

#footer a{
    color: #777777; /*gris plus clair*/
 }

#cadreContenu{

    margin-top:100px;
    /*position: absolute;*/
    float:left;
    /* centrage div*/
    width : 100%; /* la taille de la div en pixels */
 }#cadreContenueSite{
    width:auto;

 } #cadreMenuHorizontal{
    width: auto;
 }
 .itemsBanniere{
    width: auto;
 }
 .itemCaddie{
    margin-left: 70%;
 }
 #barreOrange{
    width:91%;
 }
 #cadreOrangeBig{
    width:auto;
 }
 #contenu{
    width:100%;
 }
}