@charset "utf-8";
/* CSS Document */
@font-face {
    font-family: 'seaside';
    /* L'Url est le pointage du dossier depuis la feuille de style et non pas depuis la page */
    src: url('font/seaside.eot');
    src: url('font/seaside.eot?#iefix') format('embedded-opentype'), url('font/seaside.woff') format('woff'), url('font/seaside.ttf') format('truetype'), url('font/seaside.svg#seasideresortnfregular') format('svg'); font-weight: normal; font-style: normal; 
}

@font-face {
    font-family: 'entypo';
    /* L'Url est le pointage du dossier depuis la feuille de style et non pas depuis la page */
    src: url('font/entypo.eot');
    src: url('font/entypo.eot?#iefix') format('embedded-opentype'),
		url('font/entypo.woff') format('woff'),
		url('font/entypo.ttf') format('truetype'),
		url('font/entypo.svg') format('svg');
		font-weight: normal;
		font-style: normal;
}

@font-face {
    font-family: 'pacifico';
    /* L'Url est le pointage du dossier depuis la feuille de style et non pas depuis la page */
    src: url('font/pacifico.ttf') format('truetype');
		font-weight: normal;
		font-style: normal;
}

@font-face {
    font-family: 'architectsdaughter';
    /* L'Url est le pointage du dossier depuis la feuille de style et non pas depuis la page */
    src: url('font/architectsdaughter.ttf') format('truetype');
		font-weight: normal;
		font-style: normal;
}


* { box-sizing: border-box; }
html { font-size:1vw; -ms-text-size-adjust:100%; -webkit-text-size-adjust:100%; height:100%; }
body { min-height:100%; margin:0; padding:0 0 150px 0; background:#CBDAEB; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:100%; color:#FFFFFF; position:relative; }
footer { position:absolute; bottom:0; right:0; left:0; }

img { width:100%; height:auto; }
a:link, a:hover, a:visited { color:#FFFFFF; text-decoration:none; }

.top { width:100%; position:relative; margin:0 auto; }
	.topImg { width:100%; }
	.topBande_top { width:40%; top:10%; right:5%; background:rgb(0, 0, 0); background:rgba(0 , 0 , 0, 0.5); color:#FFFFFF; padding:20px 40px; position:absolute; font-size:1.5em; border-radius:8px; }
		.topBande_top h1 { margin:0 0 10px 0; padding:0;  }
		.topBande_top p { margin:0; padding:0; font-size:1em; font-style:italic; font-family:'architectsdaughter'; }
	.topBande_lang { position:absolute; bottom:50px; right:5%; }
	.topBande_navbar { width:100%; bottom:0; left:0; background:rgb(0, 0, 0); background:rgba(4, 69, 137, 1); color:#FFFFFF; position:absolute; }
		.navbar { width:100%; display:flex; font-size:1.25em; }
			.btn { width:20%; padding:20px 0px; text-align:center; }
			.btn:hover { background-color:#04BEFB; color:#333333; }
				.btn:hover a { color:#333333; }
				.btn a:link, .btn a:visited { color:#FFFFFF; }
				.btn a:hover, .btn a:active { color:#333333; }
			.btn-actived { width:20%; padding:20px 0px; text-align:center; background-color:#CBDAEB; color:#333333;  }
				.btn-actived a { color:#333333; }
			.btn_lang { display:none; }
			
.page { width:100%; padding:50px 2vw; color:#333333; }
	.pageContainer { width:100%; display:flex; flex-wrap:wrap; }
		.pageContainer_left { width:25%; padding:0px 2vw 0 0; }
			.img_passport_box { width:100%; position:relative; background:rgba(4, 69, 137); padding:20px; border-radius:8px; }
				.img_passport_sign { width:80%; position:absolute; bottom:40px; left:0; margin:0 10%; padding:10px 20px; background-color:#FFF; border-radius:8px; background:rgb(255, 255, 255); background:rgba(255 , 255, 255, 0.75); text-align:center; color:#000; font-family:'pacifico'; }
		.pageContainer_center { width:50%; padding:0px 2vw; text-align:justify; }
			.pageContainer_center a:link, .pageContainer_center a:visited { font-weight:bold; color:rgba(4, 69, 137); }
			.pageContainer_center a:hover, .pageContainer_center a:active { font-weight:bold; color:#FF0000; }
		.pageContainer_right { width:25%; padding:0 0 0 2vw; }
			.atoutBox { width:100%; display:flex; flex-direction: column; }
				.atoutLine { margin:5px 0px 1px 0px; padding:20px; background:rgba(4, 69, 137); border-radius:8px; display:flex; }
					.atoutLine_text { width:80%; }
					.atoutLine_part { width:20%; }
		.pageContainer_centerRight { width:75%; padding:0px 20px; text-align:justify; }
			.pageContainer_centerRight a:link, .pageContainer_centerRight a:visited { font-weight:bold; color:rgba(4, 69, 137); }
			.pageContainer_centerRight a:hover, .pageContainer_centerRight a:active { font-weight:bold; color:#FF0000; }
			.reference { width:48%; margin:10px 1%; padding:40px; background:rgba(4, 69, 137); color:#FFFFFF; text-align:justify; border-radius:8px; }
				.reference p { margin; padding:0; }
				.reference div { text-align:right; }
	.pageCitation { width:50%; display:flex; flex-wrap:wrap; margin:2rem auto; font-family:'architectsdaughter'; font-size:1.5em; }
		/* .pageCitation p { font-size:1.5em; } */
		.pageCitation p font { font-weight:bold; font-size:2.5rem; }

.pageWork { max-width:60%; margin:25px auto; display:flex; }
	.pageWork_img { width:35%; }
	.pageWork_text { width:65%; }

.pageTitle { width:100%; text-align:center; }
	.pageTitle h1 { font-size:2.5em; }
.pageDescriptif { width:100%; margin:0 auto; display:flex; flex-wrap:wrap; }
	.pageDescriptif_column { width:48%; padding:2vh 4vw; font-size:1.1vw; text-align:justify; }
		.pageDescriptif_column h3 { padding-top:0; margin-top:0; }
		.pageDescriptif_column p { text-align:justify; line-height:150%; }

.citationContainer { width:100%; max-width:800px; margin:0 auto; }
	.citation { width:100%; margin:0 auto; padding:20px; font-family:'architectsdaughter'; font-size:1.5em; line-height:200%; }
	.citationL { width:50%; margin:0 50px 0 auto; padding:20px; font-family:'architectsdaughter'; font-size:1.5em; line-height:200%; }
	.citationR { width:50%; margin:0 auto 0 50px; padding:20px; font-family:'architectsdaughter'; font-size:1.5em; line-height:200%; }
		.citationBox { width:100%; text-align:center; }
			.citationTitle { width:100%; line-height:normal; font-size:0.9em; text-align:center; }
			.citationSign { width:100%; line-height:normal; font-size:0.9em; text-align:right; }
		.citation p { margin:0 0 10px 0; padding:0; text-align:justify; font-weight:bold; }
			.citation p font { font-weight:bold; font-size:1.6em }

.wordCloud { display:flex; flex-wrap:wrap; }
	.wordCloud>* { flex: 1 1 auto; }
	.word { padding:10px 20px; background-color:#FFF; margin:5px; text-align:center; border-radius:8px; }
.pictCloud { display:flex; flex-wrap:wrap; margin-top:40px; }
	.pictCloud>* { flex: 1 1 auto; }
	.pict { margin:5px; text-align:center; border-radius:8px; }
	.pict img { width:75px; height:auto; }

.mySites { width:100%; display:flex; flex-wrap:wrap; color:#333333; }
	.mySitesLineA, .mySitesLineB { width:100%; display:flex; flex-wrap:wrap; }
		.mySitesPict { width:50%; }
		.mySitesText { width:50%; position:relative; }
			.mySitesDesc { width:100%; padding:0 10vw; position: absolute; top: 50%; -ms-transform: translateY(-50%); transform: translateY(-50%); text-align:center; }
			.mySitesDesc h2, .mySitesDesc p { color:#333333; font-family:'architectsdaughter'; text-shadow: 1px 1px 1px #000000; }
			.mySitesDesc h2 { font-size:2vw; }
			.mySitesDesc p { font-size:1.5vw; }
		.mySitesButton { width:100%; text-align:center; font-size:1.5vw; }
			.mySitesButton a:link, .mySitesButton a:visited { background:rgba(4, 69, 137, 1); padding:0.5vw; color:#FFFFFF; border-radius:8px; }
			.mySitesButton a:hover, .mySitesButton a:active { background:rgba(4, 69, 137, 1); padding:0.5vw; color:#CBDAEB; border-radius:8px; }


.piedPage { width:100%; background:rgba(4, 69, 137); padding:2vw 6vw; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; }
	.piedPage_left { width:40%; }
	.piedPage_center { width:20%; display:flex; flex-wrap:wrap; justify-content:space-between; }
		.piedPage_center div { padding:0 2vw; text-align:center; }
			.piedPage_center div img { max-width:64px; max-height:auto; }
	.piedPage_right { width:40%; padding-right:20px; text-align:right; }
		.piedPage_right a:link, .piedPage_right a:visited { color:#FFFFFF; }
		.piedPage_right a:hover { color:#FF0000; }
		.piedPage_right span { font-size:0.8em; }

@media screen and (max-width:1024px) {
	.top { position:relative; }
		.topBande_top { width:50%; top:25px; right:25px; padding:10px 20px; position:absolute; font-size:1.2em; }
		.topBande_navbar { top:0; left:0; position:static; }
			.navbar { font-size:1em; }
			/* .btn_lang { display:none; } */
	.page { width:100%; padding:0 10px;  }
		.pageWork { max-width:100%; }
			.pageWork_img { width:25%; }
			.pageWork_text { width:75%; }
			
	.pageDescriptif { width:100%;  }
}

@media screen and (max-width:800px) {
		.topBande_top { width:50%; top:10px; right:10px; padding:10px; position:absolute; font-size:1.1em; }
		.topBande_lang { bottom:50px; right:2%; }
		.navbar { font-size:0.9em; }
		.container { display:block; }

}

@media screen and (max-width:700px) {
	.topBande_top { width:100%; position:static; text-align:center; font-size:1em; padding:20px; border-radius:0; }
		.topBande_top p { font-size:1.2em; }
	.topBande_lang { position:static; }
		.container { display:none; }
	.topBande_navbar { position:static; }
		.navbar { flex-direction:column; font-size:1.25em; }
			.btn { width:100%; }
			.btn-actived { width:100%; }
	.btn_lang { display:block; max-width:36px; margin:0 auto; padding:10px 0; }
	.pageDescriptif { width:100%; flex-direction:column;  }
		.pageDescriptif_column { width:100%; padding:20px 10px; font-size:4.4vw; }
		.citation { width:100%; }
		.citationL { width:100%; margin:0 auto; padding:20px 0; }
		.citationR { width:100%; margin:0 auto; padding:20px 0; }
	.pageCitation { width:100%; display:flex; flex-direction:column; }
	
	.pageTitle h1 { font-size:1em; }

	.pageContainer_left, .pageContainer_right { width:100%; padding:2vw 0; }
	.pageContainer_center { width:100%; padding:2vw 0; text-align:justify; }
	
	.mySitesLineA, .mySitesLineB { margin-bottom:2rem; background-color:#F0F8FF; }
	.mySitesLineB { flex-direction:column-reverse; }
	.mySitesPict, .mySitesText { width:100%; }
		.mySitesDesc { position:relative; width:95%; margin:0 auto; padding:2vw 0 4vw 0; text-align:center; }
			.mySitesDesc h2 { font-size:6vw; margin:0; padding:0; }
			.mySitesDesc p { font-size:4.5vw; }
		.mySitesButton { font-size:6vw; }
			.mySitesButton a:link, .mySitesButton a:visited { padding:2vw; }
			.mySitesButton a:hover, .mySitesButton a:active { padding:2vw; }

	.piedPage { padding-right:10px; padding-left:10px; }
		.piedPage_right { padding-right:0px; padding-left:10px; }
}

@media screen and (max-width:600px) {
html { font-size:4.8vw; }
body { padding-bottom:280px; }
	
	.top { position:static; }
		.topImg { display:none; }
	.page { padding:0 4vw; }
	.pageWork { max-width:100%; display:initial; }
		.pageWork_img { width:50%; margin:0 auto; }
		.pageWork_text { width:100%; text-align:center; }

.piedPage { position:static; flex-direction:column; }
	.piedPage_left { width:100%; text-align:center; margin:0 0 10px 0; }
	.piedPage_center { width:50%; margin:10px auto; }
	.piedPage_right { width:100%; text-align:center; margin-top:10px; }
}