@media only screen and (max-width:1700px) {
	.contentMid {
	width:74%;
	margin:0 13%
	}
}

@media only screen and (max-width:1600px) {
	.galerie {
	width:31%;
	margin:12px 1%
	}

	.galerie a, .galerie a:hover { font-size:12px }

	.galerie p { padding:8px }
}

@media only screen and (max-width:1500px) {
	#nav > ul > li > a,
	#nav > ul > li > a:hover {
	font-size:14px;
	text-transform:initial
	}

	#nav > ul > li > a i,
	#nav > ul > li > a:hover i {
	font-size:16px
	}	
}

@media only screen and (max-width:1300px) {
	.pageTitle, .pageTitle2 { font-size:26px }

	.pageTitle i {
	width:38px;
	font-size:30px
	}

	.contentMid {
	width:88%;
	margin:0 6%
	}

	#main_wrap { width:85% }

	#wrap_gererRecrutement article div {
	width:24%;
	margin:0 1% 0 0
	}

	#wrap_gererRecrutement article {
	margin:0 0 25px 0;
	padding:20px 10px
	}
}

@media only screen and (max-width:1200px) {
	#nav > ul > li > a,
	#nav > ul > li > a:hover { font-size:13px }

	#nav > ul > li > a i,
	#nav > ul > li > a:hover i {
	font-size:12px;
	margin:0 8px 0 0
	}

	#nav > ul, #nav > ul > li {	margin:0 18px 0 0 }

	#nav > ul, #nav > ul > li:last-child { margin:0 }
}

@media only screen and (max-width:1100px) {
	#nav { padding:12px 16px }	
}

@media only screen and (max-width:1000px) {
	#preEdito { display:none }

	.pageTitle, .pageTitle2 { font-size:23px }

	.pageTitle i {
	width:35px;
	font-size:24px
	}

	.bx-wrapper .bx-prev { left:10px }
	.bx-wrapper .bx-next { right:10px }

	.lato28, a.lato28, a.lato28:hover { font-size:26px; font-family:'Lato', sans-serif; line-height:32px }
	.lato26, a.lato26, a.lato26:hover { font-size:24px; font-family:'Lato', sans-serif; line-height:30px }
	.lato24, a.lato24, a.lato24:hover { font-size:22px; font-family:'Lato', sans-serif; line-height:28px }
	.lato22, a.lato22, a.lato22:hover { font-size:20px; font-family:'Lato', sans-serif; line-height:24px }
	.lato20, a.lato20, a.lato20:hover { font-size:18px; font-family:'Lato', sans-serif; line-height:20px }
	.lato18, a.lato18, a.lato18:hover { font-size:16px; font-family:'Lato', sans-serif; line-height:18px }
	.lato16, a.lato16, a.lato16:hover { font-size:14px; font-family:'Lato', sans-serif; line-height:16px }
	.lato14, a.lato14, a.lato14:hover { font-size:13px; font-family:'Lato', sans-serif; line-height:14px }
	.lato12, a.lato12, a.lato12:hover { font-size:12px; font-family:'Lato', sans-serif; line-height:14px }

	a.voirPlus14,
	a.voirPlus14:hover { font-size:13px }

	a.voirPlus16,
	a.voirPlus16:hover { font-size:15px }

	.ssTitle {
	font-size:18px;
	margin:0 0 15px 0
	}

	.ssTitle a,
	.ssTitle a:hover { font-size:18px }

	.ssTitleW i, .ssTitle i {
	width:22px;
	font-size:18px
	}

	.ssTitleW {
	font-size:16px;
	margin:0 0 12px 0
	}

	.contentMid {
	width:100%;
	margin:0;
	padding:0 10px
	}

	#main_wrap { width:94% }

	#wrap_news article div p:nth-child(4) {
	margin-top:15px;
	text-align:left
	}

	#wrap_membre article p:nth-child(1) { width:20% }

	#wrap_membre article p:nth-child(2),
	#wrap_membre article p:nth-child(4) { display:none }

	#wrap_membre article p:nth-child(3) { width:25% }

	#wrap_membre article p:nth-child(5) { width:50% }

	#wrap_gererRecrutement article { padding:10px }

	#wrapHub .forumHub:nth-child(3n+2) {
	margin:initial
	}

	.forumHub, #wrapHub .forumHub:nth-child(3n+2) {
	width:48%;
	margin:0 1% 15px 1%;
	padding:8px 12px
	}

	#page, #pageH { padding-bottom:110px }

	.case3qH {
	width:100%;
	margin:0 0 15px 0
	}

	.case1qH { display:none }

	#pageH {
	padding:25px 20px 125px 20px
	}

	#avancee article img {
	width:20%;
	margin:0 0 0 80%
	}

	#avancee article > div { width:100% }

	#avancee article > div > h2 {
	width:39%;
	margin:0 1% 0 0;
	}

	#avancee article > div > p {
	width:18%;
	margin:0 1%
	}

	#avancee article div h2.lato24 { font-size:16px }

	.caseStickBoss { display:none }

	#avancee section {
	width:100%;
	margin:0 0 10px 0;
	padding:0
	}

	#avancee section img:nth-child(1) {
	width:10%;
	height:auto;
	margin:0 9% 0 41%
	}

	#avancee section img:nth-child(2) {
	width:10%;
	height:auto;
	margin:0 9% 0 0
	}

	#avancee section img:nth-child(3) {
	width:10%;
	height:auto;
	margin:0 9% 0 0
	}
}

@media only screen and (max-width:900px) {
	* { -webkit-appearance:none }

	#avatar > div:nth-child(1) { font-size:16px }

	#avatar > div:nth-child(1) img { width:20px }

	#myPic { width:70px	}

	#page, #pageH { padding-bottom:30px }

	#footer {
	position:relative
	}

	.footerBR:before {
	content:'\A';
	white-space:pre
	}

	.footerBR { font-size:0 }

	#footer p { line-height:26px }

	#connec a, #connec a:hover { display:none }

	#logoA {
	width:40%;
	margin:15px 0 0 15px
	}

	#header > div { padding-bottom:20px }

	#avatar { top:20px }

	#nav ul li:first-child { display:none }

	.case1dA,
	.case1dB,
	#modPerso .case1d {
	width:100%;
	margin:0 0 25px 0
	}

	#wrapRoster .case1dA,
	#wrapRoster .case1dB {
	width:100%;
	margin:0
	}

	#wrap_gererRecrutement article div {
	width:48%;
	margin:0 2% 20px 0
	}

	#wrap_gererCandidature article p:nth-child(4),
	#wrap_gererCandidature article p:nth-child(5),
	#wrap_gererCandidature article p:nth-child(6) { display:none }

	#wrap_gererCandidature article p:nth-child(1),
	#wrap_gererCandidature article p:nth-child(2) { width:18% }

	#wrap_gererCandidature article p:nth-child(3),
	#wrap_gererCandidature article p:nth-child(7) { width:30% }

	#wrap_recrutement ul { margin:0 }

	#wrapCandidature > article {
	background:none;
	margin:0 0 35px 0;
	padding:0
	}

	.picContent { width:90%	}

	.input1dB,
	.area1dB,
	.label1qB {
	width:100%;
	margin:0 0 10px 0
	}

	* { -webkit-text-size-adjust:none }
}

@media only screen and (max-width:825px) {
	#wrapCandidature > article {
	width:100%
	}
}

@media only screen and (max-width:750px) {
	.pageTitle, .pageTitle2 { font-size:20px }

	.pageTitle i {
	width:28px;
	font-size:20px
	}

	.galerie {
	width:48%;
	margin:10px 1%
	}

	.galerie a, .galerie a:hover { font-size:11px }

	#main_wrap {
	width:100%;
	border:none
	}

	#wrap_gererRecrutement article {
	background:none;
	padding:0
	}

	#wrap_gererCandidature article p:nth-child(1) {
	width:100%;
	margin:0 0 20px 0
	}

	#wrap_gererCandidature article p:nth-child(2),
	#wrap_gererCandidature article p:nth-child(3) { width:50%; margin:0 0 20px 0 }

	#wrap_gererCandidature article p:nth-child(7) { width:100% }

	#wrap_gererCandidature article p:nth-child(8) a,
	#wrap_gererCandidature article p:nth-child(8) a:hover {
	width:48%;
	margin:0 2% 20px 0
	}

	#wrap_gererCandidature article p:nth-child(9) { margin:0 0 10px 0 }

	.forumHub, #wrapHub .forumHub:nth-child(3n+2) {
	width:100%;
	margin:0 0 20px 0;
	padding:6px 10px
	}
}

@media only screen and (max-width:700px) {
	.lato28, a.lato28, a.lato28:hover { font-size:24px; font-family:'Lato', sans-serif; line-height:30px }
	.lato26, a.lato26, a.lato26:hover { font-size:22px; font-family:'Lato', sans-serif; line-height:28px }
	.lato24, a.lato24, a.lato24:hover { font-size:20px; font-family:'Lato', sans-serif; line-height:26px }
	.lato22, a.lato22, a.lato22:hover { font-size:19px; font-family:'Lato', sans-serif; line-height:24px }
	.lato20, a.lato20, a.lato20:hover { font-size:17px; font-family:'Lato', sans-serif; line-height:22px }
	.lato18, a.lato18, a.lato18:hover { font-size:14px; font-family:'Lato', sans-serif; line-height:20px }
	.lato16, a.lato16, a.lato16:hover { font-size:13px; font-family:'Lato', sans-serif; line-height:18px }
	.lato14, a.lato14, a.lato14:hover { font-size:12px; font-family:'Lato', sans-serif; line-height:16px }
	.lato12, a.lato12, a.lato12:hover { font-size:11px; font-family:'Lato', sans-serif; line-height:14px }

	a.voirPlus14,
	a.voirPlus14:hover { font-size:12px }

	a.voirPlus16,
	a.voirPlus16:hover { font-size:14px }

	.ssTitle {
	font-size:16px;
	margin:0 0 12px 0
	}

	.ssTitle a,
	.ssTitle a:hover { font-size:16px }

	.ssTitleW i, .ssTitle i {
	width:20px;
	font-size:16px
	}

	.ssTitleW {
	font-size:14px;
	margin:0 0 10px 0
	}

	#left {
	background-color:rgba(41, 55, 66);
	color:white;
	-webkit-overflow-scrolling:touch;
	display:none;
	overflow:auto;
	position:fixed;
	z-index:9999;
	width:85%;
	height:100%;
	top:0;
	bottom:0;
	left:-85%;
	padding:0;
	-webkit-transition: all 250ms cubic-bezier(0.250, 0.250, 0.750, 0.750); 
	   -moz-transition: all 250ms cubic-bezier(0.250, 0.250, 0.750, 0.750); 
		-ms-transition: all 250ms cubic-bezier(0.250, 0.250, 0.750, 0.750); 
		 -o-transition: all 250ms cubic-bezier(0.250, 0.250, 0.750, 0.750); 
			transition: all 250ms cubic-bezier(0.250, 0.250, 0.750, 0.750);

	-webkit-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750); 
	   -moz-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750); 
		-ms-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750); 
		 -o-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750); 
			transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750);
	}

	#left, .menu, #left *, #contact_mob { display:inline-block }

	#left > a:nth-child(1) {
	display:inline-block;
	position:relative;
	width:50%;
	margin:15px 25%
	}

	#left > a:nth-child(1) img {
	display:inline-block;
	width:100%;
	height:auto
	}

	.menu a i {
	display:inline-block;
	color:#e49866;
	width:15px;
	margin:0 10px 0 0
	}

	#wrapRoster section:nth-child(1),
	#wrapRoster section:nth-child(2),
	#wrapRoster section:nth-child(3) {
	width:100%;
	margin:0 0 25px 0
	}

	#wrapRoster article p:nth-child(1),
	#wrapRoster article p:nth-child(2) { text-align:left }
}

@media only screen and (max-width:570px) {
	#nav, #connec, #avatar { display:none }

	#logoA {
	width:44%;
	margin:15px 0 0 28%
	}

	#header,
	#header > div {
	background-image:none;
	background:none
	}

	#header { background-color:rgba(41, 55, 66, 0.9) }

	#home { display:block; width:40px; height:auto; z-index:9998; position:absolute; top:10px; left:10px; outline:none; font-size:26px; cursor:pointer }

	#monComptePic { display:block; width:40px; height:auto; z-index:9998; position:absolute; top:10px; right:10px; outline:none; font-size:26px; cursor:pointer }

	#connexion {
	position:relative;
	width:100%;
	top:0;
	right:0;
	margin:20px 0 0 0;
	padding:8px
	}

	#seConnecter {
	display:inline-block;
	width:100%;
	margin:0;
	padding:0
	}

	#seConnecter label {
	width:100%;
	text-align:left
	}

	#seConnecter label:nth-child(1) {
	margin:0 0 10px 0
	}

	#seConnecter label:nth-child(2) {
	margin:0
	}

	#seConnecter label span {
	display:inline-block;
	width:30%;
	text-align:left;
	margin:0 4% 0 2%
	}

	#seConnecter label input {
	display:inline-block;
	width:60%;
	margin:0
	}

	#seConnecter a,
	#seConnecter a:hover {
	width:10%;
	margin:10px 0 0 85%
	}

	#headerMob {
	display:inline-block;
	width:100%;
	margin:0;
	padding:0
	}

	#wrap_news article div:nth-child(1) {
	width:100%;
	margin:0 0 20px 0
	}

	#wrap_news article div:nth-child(2) {
	width:100%
	}

	#wrap_gererRecrutement article div {
	width:100%;
	margin:0 0 20px 0
	}

	#wrap_gererRecrutement article div:last-child { margin-bottom:0 }
}