body {
	font-family:Arimo;
	font-size:14px;
}

@media screen and (min-width: 1200px) { body {
	display:flex;
	flex-direction:column;
	align-items:center;
	
	background-image:
		linear-gradient(to right, #0B1E46 50%, transparent 50%),
		url(../../images/bg2.svg);
	background-repeat:no-repeat, repeat-x;
	background-position:top left, 0 65px;
} }
@media screen and (max-width: 799px) { body { background-color:#0B1E46; } }

/*-------------------------------------------------------------------------------------------------------------*/

#wrapper {
	position:relative;
	
	display:flex;
	flex-direction:column;
	align-items:stretch;
	align-content:stretch;
	
	color:#FFF;
}

@media screen and (min-width: 1200px) {
	#wrapper {
		width:90%;
		min-width:1200px;
		max-width:1500px;
		
		background-image:radial-gradient(circle at 90% 50%, #4894D1 0%, #4690CC 1%, #3672A8 10%, #29588A 19%, #1E4271 29%, #15325E 40%, #0F2750 53%, #0C2048 71%, #0B1E46 100%);
		background-repeat:no-repeat;
		background-size:calc(100% - 220px) 100%;
	}
	#wrapper:after {
		content: "";
		
		position:absolute;
		right:20px; bottom:0; top:125px;
		
		display: block;
		width: 400px;
		
		background-position: right bottom;
		background-repeat: no-repeat;
		
		pointer-events: none;
	}
}
@media screen and (max-width: 1199px) { #wrapper { width:100%; } }
@media screen and (min-width: 800px) and (max-width: 1199px) { #wrapper { background-image:radial-gradient(circle at 90% 50%, #4894D1 0%, #4690CC 1%, #3672A8 10%, #29588A 19%, #1E4271 29%, #15325E 40%, #0F2750 53%, #0C2048 71%, #0B1E46 100%); } }
@media screen and (min-width: 800px) { #wrapper {
	height:800px;
	padding:20px;
} }

/*-------------------------------------------------------------------------------------------------------------*/

#wrapper > header {
	display:flex;
	justify-content:space-between;
	width:100%;
}
@media screen and (min-width: 800px) { #wrapper > header { height:225px; } }
@media screen and (max-width: 799px) { #wrapper > header {
	height:180px;
	padding:20px 20px 0;
	border-bottom:solid 1px #FFF;
} }

#wrapper > header > a,
#wrapper > header > a > img {
	display:block;
	height:100%;
}

#wrapper > header > div {
	flex-grow:1;
	display:flex;
	flex-direction:column;
}
@media screen and (min-width: 1200px) {
	.phone { width:calc((100% - 200px) / 4); }
	.flags { width:200px; }
}
@media screen and (min-width: 800px) and (max-width: 1199px) {
	.phone, .flags { width:20%; }
}
@media screen and (min-width: 800px) {
	#wrapper > header > div.mobile { display:none !important; }
	#wrapper > header > div:not(.mobile) { margin-left:70px; }
	#wrapper > header > div > div {
		display:flex;
		justify-content:space-between;
		align-items:stretch;
		height:25px;
	}
	.social { flex-grow:1; }
}
@media screen and (max-width: 799px) {
	#wrapper > header > div:not(.mobile) { display:none !important; }
	#wrapper > header > div.mobile {
		justify-content:space-between;
		align-items:flex-end;
		padding-bottom:20px;
	}
	.phone {
		padding:0 35px 0 0;
		background-position:center right;
	}
	.contact {
		text-transform:uppercase;
		text-decoration:none;
		font-weight:700;
		color:#CCC;
	}
	
	#menu-trigger {
		height:28px;
		width:40px;
		
		margin-top:12px;
		
		background-image:url(../../images/icons/menu.svg);
		background-position:top left;
		background-size:cover;
		
		cursor:pointer;
	}
	#menu-trigger.active { background-position:top right; }
}

/*-----------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width: 800px) {
	#mobile_menu { display:none; }
	
	#main_menu {
		display:flex;
		justify-content:space-between;
		align-items:stretch;
		
		height:60px;
		
		padding:0;
		margin:20px 0 0;
		
		list-style:none;
		
		z-index:100;
	}
	
	#main_menu li {
		cursor:pointer;
		position:relative;
	}
	#main_menu > li {
		position:relative;
		
		flex:1 1;
		
		border-top:solid 1px #FFF;
		border-bottom:solid 1px #FFF;
	}
	
	#main_menu > li > a {
		display:block;
		width:100%; height:100%;
		
		padding:9px 0;
		
		font-family:"EB Garamond";
		font-size:18px;
		line-height:20px;
	}
	
	#main_menu li ul {
		position:absolute;
		display:block;
		
		visibility:hidden;
		opacity:0;
		
		padding:0;
		margin:0;
		
		color:#000;
		
		list-style:none;
		transition:all .2s ease-out;
	}
	#main_menu li:hover > ul {
		visibility:visible;
		opacity:1;
	}
	
	#main_menu > li > ul { left:0; right:0; top:100%; }
	#main_menu > li > ul > li > ul { left:100%; width:100%; top:0; }
	
	#main_menu > li li > a {
		display:block;
		padding:10px;
		
		color:inherit;
		text-align:left;
		text-decoration:none;
	}
}
@media screen and (min-width: 1200px) {
	#main_menu > li:last-child {
		width:200px;
		max-width:200px;
		
		border-top:solid 1px transparent;
		border-bottom:solid 1px transparent;
		
		color:#000;
		text-align:right;
	}
	#main_menu > li:not(:last-child) li > a {
		border-top:solid 1px #FFF;
		border-left:solid 1px #FFF;
		border-bottom:solid 1px #BBB;
		border-right:solid 1px #BBB;
		
		background-image:linear-gradient(to bottom, #EEE 20%, #DDD 100%);
	}
	#main_menu > li:not(:last-child) li > a:hover {
		border-top:solid 1px #143375;
		border-left:solid 1px #143375;
		border-bottom:solid 1px #0b1b3f;
		border-right:solid 1px #0b1b3f;
		
		background-image:linear-gradient(to bottom, #0e2454 0%, #112d69 100%);
		color:#FFF;
	}
	#main_menu > li:last-child li > a {
		border-top:solid 1px #143375;
		border-left:solid 1px #143375;
		border-bottom:solid 1px #0b1b3f;
		border-right:solid 1px #0b1b3f;
		
		background-image:linear-gradient(to bottom, #0e2454 0%, #112d69 100%);
		color:#FFF;
	}
	#main_menu > li:last-child li > a:hover {
		border-top:solid 1px #FFF;
		border-left:solid 1px #FFF;
		border-bottom:solid 1px #BBB;
		border-right:solid 1px #BBB;
		
		background-image:linear-gradient(to bottom, #EEE 20%, #D0D0D0 100%);
		color:#000;
	}
}
@media screen and (max-width: 1199px) {
	#main_menu > li li > a {
		display:block;
		padding:10px;
		
		color:inherit;
		text-align:left;
		text-decoration:none;
	}
	#main_menu > li li > a {
		border-top:solid 1px #FFF;
		border-left:solid 1px #FFF;
		border-bottom:solid 1px #BBB;
		border-right:solid 1px #BBB;
		
		background-image:linear-gradient(to bottom, #EEE 20%, #DDD 100%);
	}
	#main_menu > li li > a:hover {
		border-top:solid 1px #143375;
		border-left:solid 1px #143375;
		border-bottom:solid 1px #0b1b3f;
		border-right:solid 1px #0b1b3f;
		
		background-image:linear-gradient(to bottom, #0e2454 0%, #112d69 100%);
		color:#FFF;
	}
}

@media screen and (max-width: 799px) {
	#mobile_menu,
	#mobile_menu ul {
		display:none;
		padding:0;
		margin:0;
		
		list-style:none;
		overflow:hidden;
	}
	#mobile_menu ul ul { padding-left:20px; }
	#mobile_menu li:not(:last-child) { margin-bottom:1px; }
	#mobile_menu a {
		text-decoration:none;
		cursor:pointer;
	}
	#mobile_menu ul a {
		display:block;
		padding:7px 15px;
		
		background-color:#CCC;
		
		color:#0C1E46;
	}
	#mobile_menu ul a:not(:only-child) { margin-bottom:1px; }
	
	#mobile_menu { padding:0 20px; }
	#mobile_menu:before,
	#mobile_menu:after {
		content:"";
		display:block;
		height:10px;
	}
	
	#mobile_menu > li > a {
		display:inline-block;
		margin:15px 0;
		
		font-family:"EB Garamond";
		font-size:20px;
		color:#CCC;
	}
}

/*-------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width: 1200px) { #contents > main { padding-right:180px; } }
@media screen and (min-width: 800px) {
	#contents {
		display:flex;
		height:600px;
		margin-top:-65px;
		overflow:hidden;
	}
	#contents > main {
		flex:1 1 100%;
		
		display:flex;
		align-items:stretch;
		
		padding-left:140px;
	}
}
@media screen and (max-width: 799px) { #contents { border-top:solid 2px #FFF; } }

/*-------------------------------------------------------------------------------------------------------------*/

.content { line-height:20px; }
.content:only-child {
	min-height:100%;
	width:100%;
}

.content > header {
	display:flex;
	justify-content:space-between;
	align-items:center;
	
	margin-bottom:20px;
}
.content > header > * { margin:0 !important; }
.content > header > *:not(:first-child) { padding-left:20px; }
.content > header > h1 { flex:1; }

.content > footer {
	margin-top:20px;
	clear:both;
	text-align:right;
}
.content > footer:empty { display:none; }
.content > footer > a {
	color:#FFF !important;
	font-weight:400 !important;
	text-decoration:underline !important;
}

.content h1,
.content h2 {
	margin:0 0 20px;
	
	font-family: "EB Garamond";
	font-weight:400;
	text-transform:uppercase;
	line-height:normal;
}
.content h1 { font-size: 22px; }
.content h2 { font-size: 16px; }

.content hr {
	display:block; height:1px;
	
	margin:20px 0;
	
	background-color:#FFF;
	border:none;
}
.content p:first-of-type { margin-top:0; }
.content p:last-of-type { margin-bottom:0; }

.content a {
	text-decoration:none;
	font-weight:400;
	color:#4290CC;
}
.content a:hover { text-decoration:underline; }

@media screen and (min-width: 800px) { .scrollable:after { content:""; display:block; height:20px; } }
@media screen and (max-width: 799px) { .content { padding:20px; } }

/*-------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width: 1200px) {
	#sidebar {
		display:flex;
		flex-direction:column;
		align-items:flex-end;
		
		width:200px;
		margin-left:20px;
		
		color:#000;
		font-size:12px;
		text-align:right;
	}
	#sidebar > div {
		display: block;
		width: 130px;
	}
	#sidebar > div:nth-child(1) > a { margin-top:5px; }
	#sidebar > div:nth-child(2) { margin-top:10px; visibility:hidden; }
	#sidebar > div:nth-child(2) > a { margin-top:5px; }
	#sidebar > div:nth-child(3) { margin-top:50px; }
	#sidebar > div:nth-child(3) > a { margin-top:10px; }
	#sidebar > div:nth-child(4) { margin-top:30px; }
	#sidebar > div:nth-child(5) { margin-top:30px; }
	
	#sidebar > div > a { display:block; }
}
@media screen and (max-width: 1199px) { #sidebar { display:none; } }

/*-------------------------------------------------------------------------------------------------------------*/

@media screen and (min-width: 1200px) { #footer > div {
	width:90%;
	min-width:1200px;
	max-width:1500px;
	
	padding:20px 340px 20px 20px;
} }
@media screen and (min-width: 800px) and (max-width: 1199px) { #footer > div {
	width:100%;
	padding:20px;
} }
@media screen and (min-width: 800px) {
	#footer {
		align-self:stretch;
		
		border-top:solid 1px #000;
		background-color:#FFF;
		
		font-size:12px;
		color: #444;
	}
	#footer > div { margin:0 auto; }
	#footer > div.mobile { display:none !important; }
	
	#footer > div > ul {
		margin:0;
		padding:0;
		
		list-style:none;
	}
	#footer > div > ul:after {
		content:"";
		display:block;
		clear:left;
	}
	#footer > div > ul > li {
		display:block;
		float:left;
	}
	#footer > div > ul > li:not(:last-child):after {
		content:"/";
		display:inline-block;
		width:15px;
		
		text-align:center;
	}
	#footer > div > ul > li > a {
		text-decoration:none;
		color:inherit;
	}
	#footer > div > ul > li > a:hover { color:#0B1E46; }
	
	#footer > div > p {
		/* margin:10px 0;
		padding:10px 0; */
		
		/* border-top:solid 1px #0B1E46; */
		border-bottom:solid 1px #0B1E46;
	}
	#footer > div > p > a {
		text-decoration:none;
		color:#4290cc;
	}
	#footer > div > p > a:hover { text-decoration:underline; }
	
	.honcode > p > a:not(.phone) {
		text-decoration:none;
		color:#4290cc;
	}
	.honcode > p > a:not(.phone):hover { text-decoration:underline; }
}
@media screen and (max-width: 799px) {
	#footer { color:#CCC; }
	#footer > div:not(.mobile) { display:none !important; }
	
	#footer a:not(.phone) {
		text-decoration:none;
		color:#4290cc;
	}
	#footer a:not(.phone):hover { text-decoration:underline; }
	
	#footer > div > p {
		padding:20px;
		margin:0;
		
		background-color:#FFF;
		color:#15325E;
	}
	#footer > div > div { padding:20px; }
	
	.social { justify-content:center; }
	
	#footer > div > div > div:not(.honcode) {
		display:flex;
		flex-direction:column;
		align-items:center;
		
		padding:10px 0;
		margin:20px 0;
		
		border-top:solid 1px #CCC;
		border-bottom:solid 1px #CCC;
	}
	#footer > div > div > div:not(.honcode) > p {
		text-align:center;
		margin:0 0 10px;
	}
	
	#footer > div > div.honcode { padding:0 20px; }
}

.lien-blanc {
	color: white
}

.lien-bleu {
	padding-bottom: 15px;
	display: block;
	font-weight:bold;
	text-decoration: underline;
	font-style: italic;
	color:#4290CC;
}