/* -------------------------------------------------------- */
/*                        MOBILES                           */
/* -------------------------------------------------------- */

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

	body {
		margin: 0;
		padding: 0;
		height:100%;
		background:#FFFFFF;
		font-family: "Tahoma";
		font-size: 10pt;
		color: #505050;
	}

	/* --- HEADER --- */

	#header {
		margin: 0;
		padding : 0 0 0 0;
		background: rgba(255,255,255,1);
		background: -moz-linear-gradient(left, rgba(255,255,255,1) 29%, rgba(173,200,221,1) 77%, rgba(134,174,204,1) 100%);
		background: -webkit-gradient(left top, right top, color-stop(29%, rgba(255,255,255,1)), color-stop(77%, rgba(173,200,221,1)), color-stop(100%, rgba(134,174,204,1)));
		background: -webkit-linear-gradient(left, rgba(255,255,255,1) 29%, rgba(173,200,221,1) 77%, rgba(134,174,204,1) 100%);
		background: -o-linear-gradient(left, rgba(255,255,255,1) 29%, rgba(173,200,221,1) 77%, rgba(134,174,204,1) 100%);
		background: -ms-linear-gradient(left, rgba(255,255,255,1) 29%, rgba(173,200,221,1) 77%, rgba(134,174,204,1) 100%);
		background: linear-gradient(to right, rgba(255,255,255,1) 29%, rgba(173,200,221,1) 77%, rgba(134,174,204,1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#86aecc', GradientType=1 );	
		background-size: 100%;
		background-position: left;
		background-repeat : no-repeat;
		overflow: hidden;
	}

	#header_left {
		margin: 0;
		padding: 0 0 0 .5em;
		min-width: 360px;
	}

	#header_right {
		display: none;
	}

	#header .imglogo {
	margin: 0;
	width: 75%;
	max-width: 260px;
	}

	a {
		text-decoration: none;
		color: #008ac8;
	}

	/* --- VALIGN CENTER --- */

	.valigncenter {
		margin:0;
		padding:0;
		line-height: 2em;
	}

	.valigncenter img {
		vertical-align: middle;
		padding: 0 0 0 .8em;
		width: 1.4em;
	}

	.valigncenter label {
		margin:0;
		padding: 0 0 0 1em;
		vertical-align: middle;
	}

	/* --- FLATLIST --- */
		
	ul.flatlist {
		margin: 0;
		padding: .5em 0 .5em 0;
	}

	ul.flatlist  li{
		margin: 0 0 0 2em;
	}	

	/* --- BANNER --- */

	#banner {
		margin: 0 0 0 0; 
		padding: 0.1% 1% 0.1% 0;
		background-color: #4498da;
		overflow: hidden;
		text-align: right;
		font-family: 'Nunito';
		font-size: 1.1em;
		color: #FFFFFF
	}

	/* --- PAGE TITLE --- */

	#pagetitlecontent {
		width: 100%;
		margin: 0 0 0 0;
		padding: 0 0 0 0;
	}

	#pagetitle {
		width: 95%;
		margin: 0 0 0 5%;
		padding: .8em 0 0 0;
		font-family: 'Arial', cursive;
		font-size: 1.8em;	
		color: #015e97;
		text-align: left;
	}
	
	#pagetitle p {
		padding: 0;
		margin: .4em 0 0 0;;
	}

	/* --- CONTAINERS (MI-ECRAN) --- */

	.content {
		width: 100%;
		margin: 0;
		padding: 0;
		background:#FFFFFF;
		background-repeat: no-repeat;
		font-family: 'Open Sans', sans-serif;
		font-size: 1.1em;
		overflow: hidden;
		color:#787878;
		text-align: justify;
		text-justify: inter-word;
	}

	.container-left {
		width: 90%;
		max-width: 90%;
		margin: 0 10% 0 5%;
		padding: 0 1% 0 0;
	}

	.container-right {
		width: 100%;
		max-width: 100%;
		margin: 0 10% 0 5%;
		padding: 0 1% 0 0;
		text-align: right;
	}

	.container-wide {
		width: 100%;
		max-width: 100%;
		margin: 0 10% 0 5%;
		padding: 0 0 .5em 0;
		background-color: #FFFFFF;
		padding: 0 10% 0 0;
		word-wrap: break-word;
		text-justify: none;
	}
	
	.container-wide p {
		padding: 0 5% 0 3%;
	}
	
	/* --- GRAPHIC --- */
	.graphic {
		width: 25%;
		max-width: 25%;
		margin: 0 8% 0 0;
	}
	.graphic_methodo {
		width: 40%;
		max-width: 40%;
		margin: 0 8% 0 0;
	}

	.graphic_mbsbar {
	width: 280px;
	margin: .5em 0 .5em 0;
	}
	
	.graphic_70 {
		width: 25%;
		max-width: 25%;
		margin: 0 8% 0 0;
	}
	.contact_mbsimage {
		visibility: visible;
		width: 50%;
		padding: 0 10% 0 0;
	}

	/* --- FLATLIST --- */
	
	ul.flatlist {
		margin: 0 5% 0 0;
		padding: .5em 0 .5em 0;
	}

	ul.flatlist  li{
		margin: 0 0 0 2em;
	}	
		
	/* ---DISCLAIMERS (DANS CONTAINER-RIGHT) --- */

	.disclaimer {
		background-color: #F5F5F5;
		width: 100%;
		max-width: 100%;
		margin: .5em 10% 0 0;
		padding: 0 0 0 0;
		border-radius: 5px;
	}

	.disclaimer p {
		padding: 0 3em 0 1em;
	}
	
	.disclaimertitle {
		width: 100%;
		padding: 0 1% 0 1%;
		margin: 0 0 0 0;
		height: 1.5em;
		background-color: #4498da;
		font-family: 'Open Sans', sans-serif;
		font-size: 1em;
		color: #FFFFFF;
		border-radius: 5px;
	}

	.disclaimertitle p {
		margin: 0;
		padding: 0 0 0 7px;
	}
		

	/* --- MBS LOGO BAR --- */

	.dynamicslogobar {
		width: 80%;
		margin: .5em 0 .2em 0;
		max-width: 300px;
	}
		

	/* --- METHODOLOGIE --- */

	.methodocontainer {
		width: 100%;
		padding: 0 15% 0 1%;
		max-width: 100%;
		min-width: 50px;
	}
		
	.methodotitle {
		width: 100%;
		padding: 0 0 0 0;
		margin: 1em 0 0 0;
		height: 1.5em;
		background-color: #008ac8;
		font-size: 1em;
		color: #ffffff;
		border-radius: 5px;
	}

	.methodotitle img {
		padding: 0;
		max-width: 75px;
		vertical-align: middle;
	}
	
	.methodocontainer ul li {
		padding: 0 5% 0 0;
		word-wrap: break-word;
		text-justify: none;
	}	
	
	ul.methodolist  li{
		margin: 0 2% 0 8em;
	}	
		
		
	.container-wide {
		width: 100%;
		max-width: 100%;
		margin: 0 10% 0 5%;
		padding: 0 0 .5em 0;
		background-color: #FFFFFF;
	}
	
	/* --- BOTTOM --- */
	#pagebottom {
		width: 94%;
		max-width: 100%;
		margin: 4em 10% 0 5%;
		text-align: center;
		color:#787878;
	}

	/* --- MENU --- */

	.menu {
		width: 100%;
		padding: 0.1em 0 0 0;
		background: #eee;
		min-height: 2.1em;
		line-height: 1em;
		font-family: 'Nunito';

		font-size: 1em;
	}
		
	.menu ul {
		max-height: 0;
		overflow: hidden;
		margin: 0 3.5em 0.5em 1em;
	}

	.menu li {
		visibility: hidden;
		display: block;
		padding: 0.5em 0.6em;
		color: #6692b9;
		border-style:solid;
		border-width:1px 0 1px 0;
		border-color:#ceddea;
	}

	.menu li ul {
		margin-top: 0.5em;
		border-left: 1px solid #000;
	}

	.menu li ul:hover {
		color: #476690;
		border-style:solid;
		border-width:1px 5px 0 0;
		border-color:#476690;
	}

	.menu .navbar-handle {
		display: block;
	}

	#navbar-checkbox:checked + .menu ul {
		max-height: 450px;
	}

	#navbar-checkbox:checked + .menu li {
		visibility: visible;
	}

	#navbar-checkbox:checked + .menu .navbar-handle,
	#navbar-checkbox:checked + .menu .navbar-handle:after,
	#navbar-checkbox:checked + .menu .navbar-handle:before {
		border-color: #224256;
	}

}