/*******************************/
/*Écrans smartphone&netbook, moins de 768px */
@media only screen and (max-width: 768px) {

/* Copie de http://www.alsacreations.com/astuce/lire/1177-une-feuille-de-styles-de-base-pour-le-web-mobile.html 
But : avoir un truc presque responsive avec tous les cms, mais ça va sans doute faire des crasses, en vrai.
*/
* {
        box-sizing: border-box;
	}
    
    /* passer body (et tous les éléments de largeur fixe) en largeur automatique */

body {
        width: auto;
        margin: 0;
        padding: 0;
    }
    
/* 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;
    }


/*******************************/
/*Fermeture de la balise "smartphone&netbook" */
}


/*******************************/
/*Écrans smartphone en landscape, corrige un bug lié à la police */
@media (max-device-width:768px) and (orientation: landscape) {
  html {
   -webkit-text-size-adjust: 100%;
   -ms-text-size-adjust: 100%;
  }
}