@charset "iso-8859-1";
/* CSS Document */

body { font-family:'Roboto', sans-serif; color:#a4a8ab; background-color:#fff; margin:0px; font-size:12px; display:flex; flex-direction:column; min-height: 100vh; }
a:link {text-decoration:none}
a:visited {text-decoration:none}
a:active {text-decoration:none}
a:hover {text-decoration:none;}
h1 { font-family: 'Metrophobic', sans-serif; font-weight:300; font-size:32px; margin:4px 0px; }
h2 { font-family: 'Metrophobic', sans-serif; font-weight:600; font-size:14px; margin:4px 0px; }
h3 { font-weight:normal; font-size:12px; margin:4px 0px; }
.textcolorblue { color:#0c4d87; }
.textcolorgrey { color:#a4a8ab; }
.textcolorred { color:rgba(254,85,85,1); }
.textsizeXS { font-size:11px; }
.textsizeS { font-size:12px; }
.textsizeM { font-size:14px; }
.textsizeL { font-size:16px; }
.textsizeXL { font-size:18px; }
.textsizeXXL { font-size:22px; font-weight:300; }

#MenuAd { position:fixed; left:0; top:0; min-width:480px; width:100%; padding:5px; text-align:center; background-color:#0c4d87; }
#DivLogo { display:block; text-align:center; margin-top:2px; float:none; }
#Menu { position:fixed; z-index:1000; right:0; bottom:0; min-width:480px; width:100%; padding:16px 0px 10px 0px; text-align:center; float:none; border-top:2px solid #0c4d87; background-color:#fff; box-shadow:0px -5px 5px 0px rgba(0,0,0,0.3); }
.BtnMenu { display:inline-block; text-align:center; padding-bottom:3px; border-bottom:1px solid #0c4d87; }
#MenuDon, #MenuSearch, #MenuMessagerie, #MenuAccount, #MenuConnection, #MenuPrincipe { margin-left:15px; margin-right:15px; }
@media only screen and (min-width: 768px) { 
	#DivLogo { display:inline-block; text-align:left; margin-top:2px; float:left; }
	#Menu { position:relative; min-width:400px; width:auto; padding:10px 0px 0px 0px; text-align:right; display:inline-block; float:right; border-top:0px; background-color:transparent; box-shadow:0px 0px 0px 0px rgba(0,0,0,0); } 
	.BtnMenu { padding-bottom:0px; border-bottom:0px; }
	#MenuDon, #MenuMessagerie, #MenuAccount, #MenuConnection, #MenuPrincipe { margin-left:15px; margin-right:0px; }
	#MenuSearch { margin-left:50px; margin-right:0px; }
}

#footer { min-width:480px; background-color:#0c4d87; color:#fff; text-align:center; padding:15px 0px; margin-bottom:80px; }
@media only screen and (min-width: 768px) {  #footer { min-height:60px; min-width:480px; background-color:#0c4d87; color:#fff; text-align:center; padding:15px 0px; margin-bottom:0px; } }

.ligne_separation_verte { height:0px; width:480px; border-bottom:2px solid #abd072; margin:30px auto 20px auto; }
.title_chap { font-size:32px; font-weight:300; margin:30px auto 5px auto; text-align:center; }
@media only screen and (min-width: 1024px) { .title_chap { text-align:left; } }

.container_recherche { min-width:480px; margin:20px auto; text-align:center; flex:1; }
.container { width:480px; margin:20px auto; text-align:center; flex:1; }
@media only screen and (min-width: 550px) { .container { width:768px; } }
@media only screen and (min-width: 1024px) { .container { width:1024px; } }
@media only screen and (min-width: 1300px) { .container { width:1280px; } }
@media only screen and (min-width: 1680px) { .container { width:1530px; } }
@media only screen and (min-width: 1920px) { .container { width:1830px; } }

.head_container { min-width:470px; margin:0px 5px; }
@media only screen and (min-width: 768px) { .head_container { margin:0px 15px; } }
@media only screen and (min-width: 1024px) { .head_container { width:90%; margin:0px auto; } }
@media only screen and (min-width: 1441px) { .head_container { width:80%; margin:0px auto; } }

.title_top_categorie { font-size:32px; font-weight:300; margin:30px auto 20px auto; display:block; vertical-align:middle; text-align:center; width:300px; }
@media only screen and (min-width: 1024px) { .title_top_categorie { margin:20px auto 21px auto; text-align:left; display:inline-block; width:162px;  } }

.icon_top_categorie { display:inline-block; width:90px; height:90px; vertical-align:middle; border:2px solid #666; -moz-border-radius:45px; -webkit-border-radius:45px; border-radius:45px; }

.icon_top_categorie_left { margin:0px 25px; display:inline-block; vertical-align:middle; }
@media only screen and (min-width: 768px) { .icon_top_categorie_left { margin:0px 25px 0px 0px; } }
@media only screen and (min-width: 1024px) { .icon_top_categorie_left { margin:0px 25px 0px 50px; } }
.icon_top_categorie_middle { margin:0px 25px; display:inline-block; vertical-align:middle; }
.icon_top_categorie_right { margin:0px 0px 0px 25px; display:inline-block; vertical-align:middle; }

#ListObjects { margin:0px auto; padding:0px; text-align:center; }
.DisplayObject { box-sizing:border-box; width:210px; height:290px; margin:10px; display:inline-block; text-align:center; list-style:none; border:1px solid #a4a9ae; cursor:pointer; }
.DisplayObject:hover { border:1px solid #0c4d87; box-shadow:0px 0px 2px 1px #0c4d87; }
.DisplayPhotoObject { box-sizing:border-box; height:210px; width:200px; margin:5px 5px 10px 5px; text-align:center; overflow:hidden; }

@media only screen and (min-width: 768px) { 
	.DisplayObject { width:230px; height:290px; margin:17px 10px; }
	.DisplayPhotoObject { box-sizing:border-box; width:210px; margin:12px 10px 15px 10px; }
}


.btn_account { display:block; margin:15px auto; width:400px; height:180px; border:1px solid #a4a9ae; -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; }
.btn_account_profil { display:block; margin:15px auto; width:400px; height:100px; border:1px solid #a4a9ae; -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; }
.box_account_content { margin:10px; text-align:left;}
.btn_account:hover {background-color:rgba(127,127,127,0.15); border:1px solid #abd072; }
.btn_account_profil:hover {background-color:rgba(127,127,127,0.15); border:1px solid #abd072; }
@media only screen and (min-width: 768px) { 
	.btn_account { display:inline-block; margin:10px 10px; width:300px; } 
	.btn_account_profil { display:block; margin:10px auto; width:622px; } 
}

.box_droite { max-width:700px; margin:0px auto; }
.box_main { margin:auto; background-color:transparent; max-width:700px; }
.box_profil { margin:60px auto 20px auto; background-color:#fefefe; border: 1px solid #a4a9ae; -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; max-width:700px; }
.box_profil_content { margin:15px; }
.box_objet { margin:auto; background-color:transparent; border:1px solid #a4a9ae; max-width:700px; }
.box_objet_content { margin:15px; text-align:left;}
.box_text_msg { background-color:rgba(127,127,127,0.15); border:1px solid #a4a9ae; color:#666; font-size:14px; padding:10px; height:100px; width:380px; margin-top:10px; }
@media only screen and (min-width: 1024px) { 
	.box_droite { display:inline-block; float:right; margin:0px; width:318px; }
	.box_main { display:inline-block; width:660px; }
	.box_profil { display:inline-block; float:right; margin:0px; width:330px; }
	.box_objet { margin:auto 15px auto auto; display:inline-block; width:660px; }
	.box_text_msg { width:274px; padding:5px; }
}
@media only screen and (min-width: 1280px) { 
	.box_droite { display:inline-block; float:right; width:382px; }
	.box_profil { display:inline-block; float:right; padding:15px; width:350px; }
	.box_main { display:inline-block; min-width:700px; }
	.box_objet { display:inline-block; min-width:700px; }
	.box_text_msg { width:308px; }
}

.box_700px { background-color:#fefefe; margin:auto; border: 1px solid #a4a9ae; -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; max-width:700px; }
.box450px { background-color:#fefefe; margin:auto; border: 1px solid #a4a9ae; -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; max-width:500px; }
.box_content { text-align:center; margin:15px 10px; }
@media only screen and (min-width: 768px) { .box_content { margin:15px 20px 20px 20px; } }

.box450px_nok { text-align:center; background-color:rgba(254,85,85,0.1); margin:0px auto 25px auto; border: 1px solid rgba(254,85,85,1); -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; max-width:500px; color:rgba(254,85,85,1); }
.box450px_ok { text-align:center; background-color:rgba(171,209,114,1); margin:0px auto 25px auto; border: 1px solid rgba(171,209,114,1); -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; max-width:500px; color:#fff; }

.titlebox_msg { font-size:32px; font-weight:300; margin:20px auto 15px auto; text-align:left; }
.box450px_oknok_content { text-align:left; margin:25px 20px 15px 20px; }
.close_msg_info_ok { color:#fff; float:right; font-size:28px; font-weight:bold; margin-right:12px; }
.close_msg_info_nok { color:rgba(254,85,85,1); float:right; font-size:28px; font-weight:bold; margin-right:12px; }
.close_msg_info_nok:hover, .close_msg_info_nok:focus, .close_msg_info_ok:hover, .close_msg_info_ok:focus { color:#999; text-decoration:none; cursor:pointer; }
/*.msg_info_animate { position:relative; animation-name:animatemsg; animation-duration:0.8s; } @keyframes animatemsg { from {max-width:500px; opacity:1;} to {max-width:0px; opacity:0;} }*/

.titlebox { font-size:32px; font-weight:300; margin:40px auto 30px auto; text-align:left; }
.subtitlebox { text-align:left; font-size:16px; margin:10px auto 30px auto; }
.titlemodal { font-size:18px; font-weight:400; color:#0c4d87; text-align:center; margin-top:40px; }
.small_button_filled_green { width:150px; padding:10px; border:1px solid #abd072; background-color:#abd072; -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; color:#fff; display:inline-block; font-size:16px; margin:20px 30px 20px 0px; }
.small_button_outlined_blue { width:150px; padding:10px; border:1px solid #0c4d87; background-color:#fff; -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; color:#0c4d87; display:inline-block; font-size:16px; margin:20px 0px 20px 30px; }
.large_button_filled_green { width:420px; padding:10px; border:1px solid #abd072; background-color:#abd072; -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; color:#fff; display:inline-block; font-size:16px; margin:20px auto; }
.large_button_outlined_red { width:420px; padding:10px; border:1px solid rgba(254,85,85,1); background-color:rgba(254,85,85,0.1); -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; color:rgba(254,85,85,1); display:inline-block; font-size:16px; margin:20px auto; }
.large_button_outlined_blue { width:420px; padding:10px; border:1px solid #0c4d87; background-color:#fff; -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; color:#0c4d87; display:inline-block; font-size:16px; margin:20px auto; }
.button_filled_green { padding:10px 20px; border:1px solid #abd072; background-color:#abd072; -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; color:#fff; display:inline-block; font-size:16px; margin:20px 30px 20px 0px; }
.button_outlined_blue { padding:10px 20px; border:1px solid #0c4d87; background-color:#fff; -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; color:#0c4d87; display:inline-block; font-size:16px; margin:20px 0px 20px 30px; }

