/* Media queries for Mobile */

@media (max-width: 1024px) {
	body{
		font-size:120%;
	}
	#page{
		min-height:100%;
	}
	#container{ /*wrapper_for_footer stick to the bottom*/
		min-width: 320px;
		max-width: 100%;
		}
	#header_right {
		display:none;
	}
	#header_middle {
		padding-top:40px;
		text-align: left;
		margin-left:30%;
		margin-right:25%;
	}
	#header_logo{
		margin-left:4%;
		margin-top:10px;
		height:80px;
		max-width:150px;
		margin-right: 4%;
	}
	#menu-top h1, #menu-top p{
		line-height:40px;
		font-size: 2.2em;
		max-width:99%;
		margin-left:0px;
	}
	#menu-top .wrapper{
		width:100%;
	}
	#menu-top h1{
		width:97.6%;
		padding-left:2.5%;
	}
	#menu-top p{
		line-height:32px;	
		width:95%;
		margin:20px auto;
	}
	#content{
		width:100%;
		}
	.header-wrapper{
		max-width:100%;
		}
	img {
		max-width:100%;
	}
	footer{
		background-size:cover;
	}
	p {
		line-height: 25px;
	}
	#content h1 {
		font-size: 2.0em;
	}
	#header{
		height:100px;
		background-size:cover;
	}
	#header img{
		height: 80px;
	}
	#header .btn-group img {
	    height: 18px;
	}
	#header h2{
		padding-top: 0px;
	    margin-right: 5%;
	    font-size:14pt;
	}
	.titre_header {
		font-size: 1.2em;
	}
	.summary p {
		font-size: 0.9em;
		line-height:30px;
}
   	.article_intro {
   		line-height:28px;
   	}

	#right-column{
		display:block;
		width:100%;
		float:none;
		text-align: center;
	}

	#news, #announces {
		display:none;
	}
	#scroll-right h1{
		display: none;
	}
	.logo {
		height:60px;
	}
	#datepicker, #content-datepicker{
		display:none;
	}
	#menu-top {
		display:none;
	}

   	#menu-left {
		width:100%;
		float:none;
		margin-top:0px;
	}
	#content{
		width:100%;
	}
	#menu-left .pageScroll {
	    list-style-type: none;
	    width:100%;
	}

	#menu-left li.scrollNav a  {
	    color: #eee;
	    display: block;
	    font-weight:bold;
	    font-size: 1.3em;
	    padding: 15px;
	    margin-right: 5%;
	    margin-bottom: 1%;
	    text-decoration: none;
	    text-align: left;
	    text-shadow: 1px 1px 0 #000;
	    background-color: #222;
	    border-radius:8px;
	}

	#menu-left li.scrollNav.active a{
		color:rgb(141,175,216);
		border:1px solid #222;
		text-decoration:none;
		background:none;
		background-color: #eee;
	    text-shadow: 1px 1px 0 #555;
	}



	/* unicode character for button */
	[data-icon]:before { content: attr(data-icon); }

	/* styling menu button */
	label[for^="toggle"] {
		position: absolute;
		top: -90px; 
		right: 1%;
		z-index: 1337;
		padding: .1em .2em;
		font-size: 4.5em;
		font-weight: bold;
		line-height: .7em;
		border: 2px #444 solid;
		text-shadow: 1px 1px 0 rgba(0, 0, 0, .6);
		color: #ccc;
		background-color:#fff;
	    border-radius:8px;
	}

	/* handling click/tap with CSS3 target */
	#toggle-menu:checked + ul {
		max-height: 30em !important; /* number of menu items * 6em */
	}

	/* styling navigation items */

	nav ul {
		max-height: 0;
		overflow: hidden;
		-webkit-transition: max-height .4s;
		-moz-transition: max-height .4s;
		-o-transition: max-height .4s;
		-ms-transition: max-height .4s;
		transition: max-height .4s;
	}
	#back-to-top{
		display:none;
	}
}

@media (max-width: 862px) {
	#header_middle {
		margin-left:25%;
	}
	#menu-left li.scrollNav a  {
		margin-right:6%;
	}
	footer{
		height:50px;
	}
	footer img{
		max-height:70%;
	}
}

@media (max-width: 620px) {
   article h2{
	   line-height:35px;
   }
   #header h2{
   		display:none;
   }
   .maintext{
		text-align:left;
	}
	article p {
		text-align:left;
	}
	.summary {
		text-align:left;
	}
	#menu-left li.scrollNav a  {
		margin-right:10%;
	}
	#members_list{
		float:none;
	}
}

@media only screen and (-webkit-min-device-pixel-ratio: 2) { 
	body{
		font-size:140%;
	}
}