/* Affichage sur petits ecrans
Cf.: http://www.alsacreations.com/astuce/lire/1177
------------------------------------------ */
@media screen and (max-width: 1024px) {
	h1.logo {font-size:7vw;}
}
@media screen and (max-width: 992px) {

	/* passer tous les elements de largeur fixe en largeur automatique */
	#entete {height:270px;}
	.header #logo {margin-top:160px;}
	#nav-mobile {display:inline-block;}
	.page {width: auto !important;margin-top:270px;margin-left:auto!important;margin-right:auto!important;}
	.card.horizontal .card-image {width: 20%;height: 100%;background-size: cover;margin-right:1em;}

}
@media screen and (max-width: 600px) {

	#entete {height:200px;background-position-x:0;}
	.header #logo {margin-top:110px;}
	.page {width: 100% !important;margin-top:181px;margin-left:0!important;margin-right:0!important;}
	#barrenav {width:100%;padding:1%;text-align: left;}
	h1.logo {padding-left:0;}
	.marge {display:none;}
	.menu {display:none;}
	[class^="mdi-"], [class*=" mdi-"] {padding:0.2em 0.1em;}
	a.suite {display:none;}
	a.button-collapse {margin:0 0.3em 0 0 ;}
	.footer {padding: 0.5em 0 0; border-top: 1px solid;}
	a.ghostbutton {font-size: 85%;padding-top: 0.5em;}
	a.ghostbutton:hover, 
	a.ghostbutton:active {background-color: rgba(255, 255, 255, 0.3);}
	.contenu-article h1 {font-size: 1.5em;padding:1em 0 0 10px;}
	.texte, .chapo {padding-left:1em;}
	.btn, .btn-large, .btn-flat {height:auto;}
	.card.horizontal .card-image {width: 20%;height: 100%;background-size: cover;margin-right:1em;}
	.page .main .row .col {padding: 0;}
	.container.article {width: 100%; margin:0; padding: 1rem;border-radius:0;-webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none;}

}

/* end */