/* === 9. Mobile (Portrait For 320px width) === */
@media only screen and (min-width: 0px) and (max-width: 767px) {
	div#cadre-principal {
		min-width: inherit;
	}
	
	body.fullscreen {
		min-width:980px;	
	}
	
	div#cadre-secondaire {
		width: auto;
	}
	
	div#corps {
		width:auto;
		min-height:inherit;
	}

	div#bas {
		width:auto;
	}
	
	div#bas .contenu {
		width:auto;
		padding:10px;
	}
	
	div#cadre-interne {
		width:auto;
	}
	
	#menu-haut {
		display:none;	
	}
	
	#menu-haut .container {
		width:auto;	
	}
	
	#menu-haut-drop-down {
		position:absolute;
		top:0;
		right:0;
		z-index:400;
		display:block;
		background:transparent;
	}
	
	#menu-haut-drop-down .container {
		width:auto;
	}
	
	#menu-haut-drop-down .container .dropdown-menu > li > a {
		padding-left:5px;	
	}
	
	div#info-organisation {
		float:none;
	}
	
	div#info-organisation img {
		max-width:200px;
	}
	
	div#menu {
		display:none;	
	}
	
	body.bodyIntranet div#menu {
		display:block;	
	}
	
	div#menu ul
	{
		float:none;
	}
	
	div#menu ul li
	{
		float:none;
		text-align:left;
		margin:0;
	}
	
	div#menu ul li a
	{
		padding-left:0;
	}
	
	div.colonne-gauche {
		width:auto;
		float:none;	
	}
	
	div.fiche div.colonne-gauche {
		width:auto;
	}
	
	div.colonne-droite {
		width:auto;
		float:none;	
	}
	
	div.fiche div.colonne-droite {
		width:auto;
	}
	
	div.colonne-principale {
		width:auto;
		float:none;	
	}
	
	div.colonne-secondaire {
		width:auto;
		float:none;	
	}
	
	div.colonne-auto {
		float:none;
		margin:0;	
	}
	
	ul.colonne-triple li {
		width:auto;
		float:none;
		margin-right:0;
		margin-left:0;
	}
	
	div.colonne-triple {
		width:auto;
		float:none;
		margin-right:0;
		margin-left:0;
	}
	
	div.events div.event {
		width:auto;
		float:none;
		margin-right:0;
		margin-left:0;
	}
	
	img {
		max-width:100%;	
	}
	
	.btn {
		width:100%;
		margin:0 0 10px 0;
		box-sizing:border-box;
	}
	
	.btn-auto-width {
		width:auto;	
	}
	
	/*
	// Force table to not be like tables anymore
	table, thead, tbody, th, td, tr { 
		display: block;
	}
	
	// Hide table headers (but not display: none;, for accessibility)
	thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	*/
	
	table.formulaire, table.formulaire thead, table.formulaire tbody, table.formulaire th, table.formulaire td, table.formulaire tr {
		display: block;	
	}
	
	table.responsive, table.responsive caption, table.responsive thead, table.responsive tbody, table.responsive th, table.responsive td, table.responsive tr {
		display: block;	
		width:100%;
		box-sizing:border-box;
	}
	
	table.responsive thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	table.responsive tr {
		border-bottom:3px solid #CCC;
    }
    
    table.responsive tr.separateur-bas-aucun {
		border-bottom:0;
	}
	
	table.responsive td {
		border:0;
		width:auto !important;
		padding:5px 8px !important;
	}
	
	table#table-panier.responsive td.colImg {
		float:left;
	}
	
	table#table-panier.responsive .btn-link {
		text-align:right !important;
	}
	
	table#table-evenements.responsive td.col1 {
		float:left;
		margin-right:10px;
	}
	
	table.table-evenements.responsive td.col1 {
		float:left;
		margin-right:10px;
	}
	
	table.table-evenements.responsive td.col2 {
		padding:10px;
	}
	
	table.table-evenements.responsive td.col3 {
		padding:10px;
	}
	
	table#table-evenements td.col2 {
		padding-left:5px !important;
	}
	
	
	div.image-evenement.petite {
    width: 30px;
    height: 30px;
	}
	
	table.formulaire td.label {
		width:auto;
		text-align:left;
		padding:2px 0;
	}
	
	table.formulaire td {
		width:auto;
		white-space:nowrap;
		padding:2px 0;
	}
	
	form [type="text"],
	form [type="number"],
	form [type="email"],
	form [type="tel"],
	form [type="password"],
	select,
	textarea {
		width:100%;
		margin:0 0 10px 0;
		box-sizing:border-box;
	}

	#erreurContenu {
		padding:20px;
	}
	
	#erreur i {
		font-size:20px;
		line-height:20px;
	}
	
	#erreur h2 {
		font-size:120%;
	}
	
	#erreur ul {
		margin:0;
		padding:0 0 0 5px;
	}
	
	table#table-evenements .btn {
		margin-bottom:10px !important;	
	}
	
	#corps h1 {
		font-size:2em;
		border-left:none;
		padding-left:0;
	}
	
	h2 {
		font-size:1.6em;
	}
	
	h3 {
		font-size:1.4em;
	}
	
	h4 {
		font-size:1.2em;
	}
	
	h5 {
		font-size:1.2em;
	}
	
	h6 {
		font-size:1.2em;
	}
	
	div#milieu {
		margin-top:0;
	}
	
	img.accompagnement-gauche {
		max-width:60px;
		margin:0 5px 5px 0;
	}
	
	div.image-evenement {
		width:60px;
		height:60px;
	}
	
	div.partage {
		float:none;
		width:auto;	
	}
	
	.visible-sm {
		display:block !important;	
	}
	
	.hidden-sm {
		display:none !important;	
	}
	
	div.bulle-indicateur {
		display:none;	
	}
	
	div#menu-responsive {
		display:block;
		clear:both;
	}
	
	div#top {
		
	}
	
	a#voir-dates {
		float:none;	
	}
	
	div.tabsblock ul.liste li a {
		display:block;
		padding:10px 0;	
	}
	
	.interactive-calendar {
		width:100%;
	}
	
	ul.colonnes-multiples[data-columns="2"] {
		-webkit-columns: 1;
		-moz-columns: 1;
		columns: 1;
	}
	
	ul.colonnes-multiples[data-columns="4"] {
		-webkit-columns: 1;
		-moz-columns: 1;
		columns: 1;
	}

}

@media only screen and (min-width: 768px) and (max-width: 979px) {
	div#cadre-principal {
		min-width: inherit;
	}
	
	body.fullscreen {
		min-width:980px;	
	}
	
	div#cadre-secondaire {
		width: auto;
	}
	
	div#corps {
		width:auto;
		min-height:inherit;
	}

	div#bas {
		width:auto;
	}
	
	div#bas .contenu {
		width:auto;
		padding:10px;
	}
	
	div#cadre-interne {
		width:auto;
	}
	
	#menu-haut .container {
		width:auto;	
	}

	div#info-organisation {
		float:none;
	}
	
	div#info-organisation img {
		max-width:200px;
	}
	
	img {
		max-width:100%;	
	}
	
	div.colonne-gauche {
		width:auto;
		float:none;	
	}
	
	div.fiche div.colonne-gauche {
		width:auto;
	}
	
	div.colonne-droite {
		width:auto;
		float:none;	
	}
	
	div.fiche div.colonne-droite {
		width:auto;
	}
	
	div.colonne-principale {
		width:auto;
		float:none;	
	}
	
	div.colonne-secondaire {
		width:auto;
		float:none;	
	}
	
	ul.colonne-triple li {
		float:none;
	}
	
	ul.colonne-triple li {
		width:auto;
		float:none;
		margin-right:0;
		margin-left:0;
	}
	
	div.colonne-triple {
		width:auto;
		float:none;
		margin-right:0;
		margin-left:0;
	}
}

@media only screen and (max-width: 979px) {
	body.bodyAccueil div.colonne-principale {
		float:none;
		margin:0;
	}
	
	body.bodyAccueil div.colonne-secondaire {
		float:none;
		margin:0 0 10px 0;
	}
	
	.modern-ticker {
		display:none;	
	}
	
		
	div#bas ul {
		float:none;
		margin-bottom:20px;
	}
}

/* écran plus petit que large */
@media only screen and (max-width: 64em) {
	.progression-tracker {
	  -webkit-box-orient: vertical;
	  -webkit-box-direction: normal;
		  -ms-flex-direction: column;
			  flex-direction: column;
		padding-left:1em;
	}
	
	.progression-tracker .progression-tracker-step {
	  display: -webkit-box;
	  display: -ms-flexbox;
	  display: flex;
	  -webkit-box-flex: 1;
		  -ms-flex: 1 1 auto;
			  flex: 1 1 auto;
	}
	
	.progression-tracker.progression-tracker--right .progression-tracker-step {
	  -webkit-box-orient: horizontal;
	  -webkit-box-direction: reverse;
		  -ms-flex-direction: row-reverse;
			  flex-direction: row-reverse;
	}
	
	.progression-tracker .progression-tracker-marker::after {
	  right: auto;
	  top: 12px;
	  left: 10px;
	  width: 4px;
	  height: 100%;
	}
	
	.progression-tracker .progression-tracker-text {
	  padding: 0 12px 24px 12px;
	}
}