@charset "utf-8";
* { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box }

html 							{ scroll-behavior: smooth }
body							{ margin: 0; padding: 0; font-size: 13px; font-family: 'Police','Century Gothic', Verdana; background-color: #F2F2F2  }

#entete							{ background-color: #FFF }
#entete	#logo					{ width: 1000px; margin: auto; padding: 5px; font-size: 40px }
#entete	#logo a 				{ color: #333 } 
#entete	#logo img 				{ width: auto; height: 100px } 
#entete	#logo .logo-intra		{ float: right; color: #000; font-size: 30px; letter-spacing: 2px; margin-top: 25px } 
#entete	#rubriques-zone  		{ background-color: #000 }
#entete	#rubriques-zone #rubriques 			{ width: 950px; margin:auto; text-align: right; padding: 10px }
#entete	#rubriques-zone #rubriques  a 		{ display: inline-block; color: #FFF; text-transform: uppercase; font-size: 10px; text-align: center } 
#entete	#rubriques-zone #rubriques  a:hover { opacity:0.7; filter:alpha(opacity=70); -moz-opacity:7 } 
#entete	#rubriques-zone #rubriques  i 		{ display: block; font-size: 36px; color: #FFF; vertical-align: middle; margin: 0 20px 5px } 

@media (max-width: 1000px){ 
#entete	#logo					{ width: 100% }
#entete	#rubriques-zone #rubriques 	{ width: 100% }
}

@media (max-width: 600px){ 
#entete	#logo  					{ text-align: center } 
#entete	#logo img 				{ width: 70%; height: auto } 
#entete	#logo .logo-intra		{ font-size: 18px } 
#entete	#rubriques-zone #rubriques  a 		{ font-size: 9px } 
#entete	#rubriques-zone #rubriques  i 		{ font-size: 24px } 
}

#page 							{ width: 100%; border-top: 1px solid #000 }
#page:fullscreen, #page:-webkit-full-screen, #page:-moz-full-screen, #page:-ms-fullscreen { width: 100vw; height: 100vh }

.contenu 						{ width: 1200px; margin: auto }
.contenu-min					{ min-height: 500px }
.rub-titre 						{ font-family: 'barlow condensed'; font-size: 1.2em; text-transform: uppercase; letter-spacing: 1px; margin: 1% 5% }
.rub-accroche 					{ font-family: 'barlow condensed'; font-size: 1.2em; letter-spacing: 1px }

@media (max-width: 1200px){ 
.contenu 						{ width: 100% }
}

.login  						{ width: 100%; max-width: 500px; margin: 7% auto; background-color: #FFF }
.login img 						{ width: 90%; height: auto; margin: auto }
.login form 					{ margin: 2% 5% }
.login form label 				{ float: none; width: 100%; text-transform: none; color:#555; font-size: 13px; letter-spacing: 2px }
.login form input				{ width: 100%; margin: 5px 0 20px; text-align: center }	

.contenu						{ font-size: 13px; padding: 1% } /*ne pas mettre min-height*/
.contenu-blc					{ background-color: #FFF } 
.contenu .barreactions			{ font-size: 11px; text-transform: uppercase; letter-spacing: 2px; color: #9C9A97; min-height: 50px; }/* */
.barreactions a:hover, .contenu .barreactions a.choix	{ color: #DA5158 }
.barreactions img.iconeaction	{ height: 30px }
.barreactions .enligne			{ display: inline-block; vertical-align: bottom }

@media (max-width: 600px){ 
.contenu .barreactions			{ margin-top: 2% }
}

.contenu .subdiv 				{ border-bottom: 1px solid #A1ABB6; padding: 5px 0; font-size: 14px; text-transform:uppercase; margin: 2% 0 1% 0; color:#999 }
.contenu .subdiv-txt			{ margin-left: 2% }

.blocrub						{ background-color: #D7DADC; border-bottom: 1px solid #8B776D; padding: 14px; margin-bottom: 2%; font-size: 15px; text-transform:uppercase }
.blocrub a						{ color: #FFF; font-size: 0.8em; letter-spacing: 2px }
.blocrub img 					{ float:right; padding: 0 5px; margin-top: -8px; cursor: pointer; vertical-align:middle; height: 35px; width: auto}
.blocrub img:hover				{ opacity:0.8; filter:alpha(opacity=80); -moz-opacity:8 }

.blocssrub						{ background-color: #B9C0C8; border-bottom: 1px solid #8B776D; padding: 10px 10px 5px 10px; min-height: 23px; margin-bottom: 2%; font-size: 14px; text-transform: uppercase }
.blocssrub img 					{ float:right; padding: 0 5px; margin-top: -8px; vertical-align:middle; height: 35px!important; width: auto!important}
.blocssrub						{ background-color: #B9C0C8; border-bottom: 1px solid #8B776D; padding: 10px 10px 5px 10px; min-height: 23px; margin-bottom: 2%; font-size: 14px; text-transform: uppercase }
.blocssrub img 					{ float:right; padding: 0 5px; margin-top: -8px; cursor: pointer; vertical-align:middle; height: 32px; width: auto}
.blocssrub img:hover			{ opacity:0.8; filter:alpha(opacity=80); -moz-opacity:8 }

.blocssrub-ssfd					{ border-bottom: 1px solid #8B776D; padding: 10px 10px 5px 10px; margin-bottom: 2%; font-size: 14px; text-transform: uppercase; min-height: 25px }
.blocssrub-ssfd img 			{ float:right; padding: 0 5px; margin-top: -8px; cursor: pointer; vertical-align:middle; height: 32px; width: auto}
.blocssrub-ssfd img:hover		{ opacity:0.8; filter:alpha(opacity=80); -moz-opacity:8 }

.blocsubdiv 					{ padding: 1%; background-color: #627788; color: #FFF; text-transform:uppercase; letter-spacing: 4px; text-align:center}
.blocsubdiv img 				{ float:right; padding: 0 5px; margin-top: -8px; cursor: pointer; vertical-align:middle; height: 28px; width: auto}
.blocsubdiv img:hover			{ opacity:0.8; filter:alpha(opacity=80); -moz-opacity:8 }
.blocsubdiv a span.infobullesubdiv 			{ float:right; opacity:0; transform:scale(0) rotate(-12deg); transition:all .25s; margin-top:-30px;     margin-right:-100px;
	 color:#FFF; font-size:10px; letter-spacing: 2px;     background-color:#DA5158;     padding:5px;  }
.blocsubdiv a:hover span.infobullesubdiv 	{ opacity:1;  transform:scale(1) rotate(0); }

.blocrub img.icone, .blocssrub img.icone	{ float: none; vertical-align: middle; width: 40px!important; height: auto!important; padding: 0 }


.mail-messages-tdm				{ display: inline-block; width: 30%; vertical-align: top; margin-top: 2%; margin-right: 2% }
.mail-messages-tdm ul			{ list-style: none; margin: 0; padding: 0 }
.mail-messages-tdm li			{ background-color: #CCC; margin: 5px 0; padding: 15px; font-weight: 600; cursor: pointer}
.mail-messages-tdm li:hover		{ background-color: #666; color: #FFF }
.mail-messages-tdm li.choix		{ background-color: #999; color: #FFF;  }

.mail-messages-txt				{ display: inline-block; width: 56%; vertical-align: top; margin-top: 3%; background-color: #FFF; padding: 20px; min-height: 300px }
.mail-messages-txt .subdiv 		{ border-bottom: 1px solid #A1ABB6; padding: 5px 0; font-family: 'Century Gothic';	font-size: 13px; text-transform:uppercase; margin: 2% 0 1% 0; color:#999 }
.mail-messages-txt .subdiv-txt	{ margin-left: 2% }

@media (max-width: 600px){ 		
.mail-messages-tdm, .mail-messages-txt	{ display: block; width: 100% }
}

.param-blocs 					{ display: inline-block; width: 48%; vertical-align: top }
.param-bloc						{ margin: 3% 2%; padding: 1% 2%; border: 1px solid #CCC; min-height: 80px; line-height: 1.5em; text-align: left }
.param-bloc .param-bloc-titre	{ font-size: 1.2em; letter-spacing: 1px }
.param-bloc .param-bloc-titre i.modif	{ float: right }
.param-bloc-header				{ display: flex; flex: 0 1 auto; -webkit-box-direction: normal; flex-wrap: wrap; justify-content: space-between; border-bottom: 1px solid #CCC; padding: 10px 0; margin-bottom: 15px }
.param-bloc-header .param-bloc-actions 	{ min-width: 100px; text-align: right; letter-spacing: 0.25px }
.param-bloc-header .param-bloc-actions a	{ margin-left: 15px }
.param-bloc-header .param-bloc-actions .fas	{ font-size: 1em }
.param-bloc table 				{ border-collapse: collapse }
.param-bloc table  tr:hover			{ border-top: 1px solid #829FBC; border-bottom: 1px solid #829FBC }
.param-bloc table  tr:nth-child(even) { background-color: #E1E2E3 }
.param-bloc table  td 			{ padding: 5px }


.compte-form 					{ }
.compte-form form 				{ width: 100%; margin: 20px auto }
.compte-form form .ligne-col	{ display: inline-block; width: 49% }
.compte-form form label 		{ float: none; width: 100%; text-transform: none; color:#555; font-size: 13px; letter-spacing: 2px; margin-bottom: 2px }
.compte-form form input[type=text] { width: 100%; margin: 5px 0 }	

@media (max-width: 600px){ 		
.compte-form form .ligne-col	{ display: block; width: 100% }
}

.compte 						{ margin: 2% auto }
.compte .compte-bloc			{ margin: 3% 2%; padding: 1% 2%; border: 1px solid #CCC; min-height: 100px; line-height: 1.5em }
.compte .compte-bloc a			{ text-decoration: none }
.compte .compte-bloc-header		{ display: flex; flex: 0 1 auto; -webkit-box-direction: normal; flex-wrap: wrap; justify-content: space-between; border-bottom: 1px solid #CCC; padding: 10px 0; margin-bottom: 15px }
.compte-bloc-header	.compte-bloc-titre	{ font-size: 1.1em; letter-spacing: 1px }
.compte-bloc-header	.compte-bloc-actions{ min-width: 100px; text-align: right; letter-spacing: 0.25px }
.compte-bloc-header	.compte-bloc-actions a	{ margin-left: 15px }
.compte .compte-g 				{ display: inline-block; width: 35%; vertical-align: top }
.compte .compte-d 				{ display: inline-block; width: 64%; vertical-align: top }

@media (max-width: 800px){ 			
.compte-g, .compte-d			{ display: block!important; width: 90%!important; margin: 3% auto }
.param-blocs					{ display: block; width: 100%; margin: 2% 0 }
.param-bloc .param-bloc-titre	{ font-size: 1em }
}

.compte-info-suite 				{ padding: 0 10px; height: 100%; max-height: 0; overflow: hidden; -webkit-transition: max-height .5s ease-in-out; transition: max-height .5s ease-in-out }
.compte-info label				{ float: right; margin-top: -45px; padding-right: 1%; cursor: pointer }
.compte-info label i			{ font-size: 1.2em; letter-spacing: 1px; font-style: normal }
.compte-info label span 		{ font-size: 14px; letter-spacing: 0.25px; color: #AAA }
.compte-info label:hover span	{ color: #AE3B2C }
.compte-info input[type=checkbox]:checked + label + .compte-info-suite 	{ max-height: 400px }
.compte-info label > span 		{ float: right; -webkit-transition: -webkit-transform .65s ease; transition: transform .65s ease }


.pagetitre						{ width: 1200px; margin: auto; padding: 20px 0px 10px 10px; font-size: 1.2em; letter-spacing: 2px;  text-transform: uppercase; color:#23394E } 
.pagetitre img  				{ width: auto; height: 48px; margin: 0 10px; vertical-align:middle}
.pagetitre i					{ font-size: 36px; margin-right: 1%; vertical-align: middle; color: #AAA }
/*.pagetitre select				{ float:right } SUPPRIME */ 
.pagetitre select.centre		{ position: absolute; margin-left: 40% }
.pagetitre .actions-txt			{ float: right; margin: 2% 10% 0 0 }
.pagetitre .actions-txt	img		{ width: 30px!important; height: auto!important; vertical-align: middle }
.pagetitre .actions				{ float: right; margin-right: 10% }
.pagetitre .actions	img			{ width: 35px!important; height: auto!important }

@media (max-width: 1200px){ 
.pagetitre						{ width: 100% }
}

.entetetitre					{ display: table; width: 100%; padding: 20px 0px 0 10px; font-size: 17px; text-transform: uppercase } 
.entetetitre .col	 			{ display: table-cell; vertical-align: middle; width: 50%}
.entetetitre .col33	 			{ width: 33% }
.entetetitre .col22	 			{ width: 50% }
.entetetitre .col-nom 			{ font-size: 20px; text-transform: uppercase; letter-spacing: 1px;  color:#C11E2D}
.entetetitre .col-bloc 			{ display: inline-block; width:auto; text-align: left}
.entetetitre #skills 			{ background:url(/intranet/images/icone-search-input.png) no-repeat right #FFF; width: 22%; min-width: 250px }

.dashboard								{ display: table; width: 90%; margin: auto }
.dashboard h3							{ font-size: 16px; font-weight: 600; color: #444; letter-spacing: 1px  }
.dashboard-col							{ display: table-cell; width: 45%; vertical-align: top }
.dashboard-bloc100						{ display: block; width: 93%; margin: 20px 3%; padding: 1% 4%; background-color: #FFF }
.dashboard-bloc50						{ display: inline-block; vertical-align: top;  width: 45%; margin: 20px 0 0 3%; padding: 1% 2%; background-color: #FFF}
.dashboard .blocinfo					{ background-color: #F7F8F8; border: 1px solid #ccc; border-radius: 2px; font-size: 12px; margin: 2% 0; padding: 4px;  }

.dashboard .blocinfo:hover				{ background-color: #EEE }

.dashboard .performances-mois			{ display: inline-block; width: 28%; margin: 2%; text-align: center; vertical-align: bottom }
.performances-mois .cartouche			{ display: table-cell; width: 130px; height: 130px; background-color: #CCC; border-radius: 10px; margin: auto; vertical-align: bottom  }
.performances-mois .cartouchevaleur		{ border-radius: 10px }
.performances-mois h2					{ margin-top: 0}

.dashboard .performances-semaine		{ display: inline-block; width: 41%; margin: 1% 4%; vertical-align: top }
.dashboard .performance 				{ margin-bottom: 10px }
.dashboard .performance i				{ font-size: 12px; font-style: normal }
.performance .cartouche					{ width: 100%; height: 18px; background-color: #CCC; border-radius: 10px }
.performance .cartouchevaleur			{ height: 18px; border-radius: 10px }
.performance .valeurs					{ display:table; width: 100% }
.performance .valeurs .valeur			{ display:table-cell; width:33%; font-size: 11px }

.dashboard .rouge-fd					{ background-color:#D23726 }
.dashboard .orange-fd					{ background-color: #F6B41C }
.dashboard .vert-fd						{ background-color:#8DC131 }

@media (max-width: 1000px){ 
.dashboard								{ width: 100% }
.dashboard-bloc100						{ width: 100%; margin: 0 }
}

@media (max-width: 600px){ 
.dashboard								{ width: 100% }
.dashboard-bloc100						{ width: 100%; margin: 0 }
.dashboard-bloc50						{ display: block; width: 100%; margin: 0 }
}

.enattente								{ color: #EE7818; font-weight: bold }
.confirme								{ color: #00B04D; font-weight: bold }
.annule									{ color: #999; font-weight: bold }

.bk-enattente							{ background-color: #EE7818!important }
.bk-confirme							{ background-color: #00B04D!important }
.bk-annule								{ background-color: #999!important }

.border-enattente						{ border-left: 4px solid #EE7818!important  }
.border-confirme						{ border-left: 4px solid #00B04D!important  }
.border-annule							{ border-left: 4px solid #999!important  }

.border-top-enattente					{ border-top: 4px solid #EE7818!important  }
.border-top-confirme					{ border-top: 4px solid #00B04D!important  }
.border-top-annule						{ border-top: 4px solid #999!important  }

.cartouche-enattente					{ background-color: #EE7818; color: #FFF; padding: 3px 5px  }
.cartouche-confirme						{ background-color: #00B04D; color: #FFF; padding: 3px 5px }
.cartouche-annule						{ background-color: #999; color: #FFF; padding: 3px 5px }

.rouge									{ color: #D23726 }
.orange									{ color: #EE7818 }
.orange-clair							{ color: #F6B19E }
.green									{ color: #8DC131 }

table tr.chapitre 				{ background-color: #CCC!important; border-bottom: 3px solid #A1ABB6; padding: 5px 0; color: #333 }

.listing						{ width: 90%; margin: auto; font-size: 0.9em }
.listing-large					{ width: 100%; font-size: 0.8em }
.listing .criteres_mois			{ margin-top: 1% }
.listing select.criteres		{ background-color: #DDD; border: 1px solid #999; font-size: 10px!important; text-transform: uppercase; letter-spacing: 2px }
.listing table					{ width: 100%; border-collapse: collapse; border: 1px solid #829FBC; background-color: #FFF  }
.listing table tr:hover			{ border-top: 1px solid #829FBC; border-bottom: 1px solid #829FBC }
.listing table tr.chapitre 		{ font-size: 1.1em; text-transform: uppercase }
.listing table tr:nth-child(even) { background-color: #E1E2E3 }
.listing table th 				{ background-color: #465253; color: #CCC; padding: 5px; font-weight: normal; letter-spacing: 2px; text-transform: uppercase }
.listing table th.prix			{ text-align: right }
.listing table td					{ padding: 5px }
.listing table td.prix			{ text-align: right; padding-right: 5px }
.listing table td input[type="text"]	{ margin: 0!important }
.listing-large					{ width: 100%; font-size: 0.8em }
.listing-large th				{ font-size: 0.9em }
.listing-food input[type="text"], .listing-food input[type="number"], .listing-food select, .listing-food textarea { line-height: inherit!important; padding: 8px 5px!important; font-size: 1em!important; letter-spacing: 1px!important }
.listing-food td.division 		{ background-color: #EE7818!important; color: #FFF; font-weight: bold; font-size: 1.2em; letter-spacing: 4px }
.listing-food input[type="text"].nombre { width: 60px!important; text-align: center!important }
.listing-food input[type="text"].typologie { min-width: 350px!important }
.listing-food textarea.typologie { width: 80%; min-width: 350px!important }

@media (max-width: 1200px){ 
.listing						{ width: 100% }
.listing .criteres_mois			{ margin: 3%; font-size: 1.1em!important }
.listing select.criteres		{ font-size: 1.1em!important }
}

@media (max-width: 600px){ 
.listing select.criteres		{ height: 37px }
}

table.event 					{ width: 100% }
table.event th					{ font-size: 0.8em }/*width: 20%; */
/*table.event td					{ width: 20% }*/
table.event td.formu			{  }

.calendrier						{ width: 95%; margin: auto }
.calendrier	.mois-nav			{ font-size: 1.5em; margin: 1%; letter-spacing: 1px; font-weight: bold; text-align: center }
.calendrier	.mois-affich		{ display: inline-block; width: 30% }
.calendrier table				{ width: 100%; padding: 5px; border-collapse: collapse;}
.calendrier th .ordi			{ display: block; visibility:visible  }
.calendrier th .mobi			{ display: none; visibility: hidden  }
.calendrier th		 			{ text-align: center; background-color: #23394E; color: #A1ABB6; font-size: 12px; text-transform: uppercase; padding: 1%; letter-spacing: 1px }
.calendrier th.joursemaine		{ background-color: #7FA3C5; color: #23394E }
.calendrier td					{ width: 14%; border: 1px solid #A1ABB6; margin: 0; padding: 0; font-size: 11px; vertical-align: top }
.calendrier td .jour-infos		{ min-height: 7vh }
.calendrier td a.type1 			{  }
.calendrier td a.type2 			{ background-color: #F8F5BE }
.calendrier td.vide				{ border: 0 }
.calendrier td .jour			{ background-color: #DDD; color: #23394E; font-size: 12px; padding: 2px 5px; font-weight: bold}
.calendrier td .today			{ background-color: #22384D; color: #FFF }
.calendrier td .light			{ background-color: #F46970 }
.calendrier td a.light:hover	{ color: #FFF }
.calendrier td .duree			{ border-top: 3px dashed #F46970; border-bottom: 3px dashed #F46970!important }
.calendrier td a.duree:hover	{ border-top: 3px solid #F46970 }
.calendrier td .annul			{ background-color: #CC0000; color: #FFF; font-size: 0.8em;	text-transform: uppercase; letter-spacing: 3px; padding: 1px; text-align: center }
.calendrier td a				{ display: block; line-height: 1.3em; color: #22384D; margin: 0 2px 5px 5px; padding-bottom: 2px; border-bottom: 1px solid #CCC }
.calendrier td a.small			{ margin: 0 1px 4px 2px }
.calendrier td a:last-child		{ border-bottom: none }

.calendriers					{ width: 95%; margin: auto; padding: 3% 0 }
.calendriers .calendrier-mois	{ display: inline-block; width: 47%; margin: 1%; vertical-align: top }
.calendrier-mois th		 		{ font-size: 11px }
.calendrier-mois td				{ font-size: 10px }
.calendrier-mois td .jour		{ font-size: 11px }

@media (max-width: 850px){
.calendrier	.mois-affich		{ display: inline-block; width: 70% }
.calendrier th .ordi			{ display: none; visibility:hidden  }
.calendrier th .mobi			{ display: block; visibility:visible  }
.calendriers .calendrier-mois	{ display: block; width: 100% }
}
@media (max-width: 600px){
.calendrier td					{ font-size: 0.7em }
}

.gestioncartes 					{ text-align: center }
.gestioncartes .carte			{ display: inline-block; width: 30%; min-width: 300px; margin: 2%; padding: 0 2% 2%; box-shadow: 2px 4px 12px 5px rgba(0,0,0,.2) }
.gestioncartes h3				{ font-family: 'barlow condensed'; font-size: 40px; color: #555; text-transform: none; letter-spacing: 1px; font-weight: 400; line-height: 30px; margin: 2% 0; text-align: left }
.gestioncartes h3 p				{ margin: 0; font-size: 20px; line-height: 20px; color: #999 }
.gestioncartes form				{ width: 80%; max-width: 600px; margin: auto }


.slides .legende 				{ font-size: 11px; border-bottom: 1px dashed #999; padding-bottom: 3px; margin-bottom: 1%}
.slides .legende img			{ height: 15px; width: auto; vertical-align:middle; margin-left: 2% }
.slides #sortable ul			{ list-style-type: none!important; margin: 0; padding: 0; width: 80%; }
.slides #sortable li.W 			{ display: inline-block; width: 33%; padding: 1% 2%; min-height: 80px; cursor:pointer; border-bottom: 1px dashed #CCC }
.slides #sortable li.H 			{ display: inline-block; padding: 1% 2%; min-height: 80px; cursor:pointer; border-bottom: 1px dashed #CCC }
.slides #sortable li span		{ position: absolute; margin-left: -1.3em; background-color: #D5D8DB; border-right: 1px solid #999; width: 20px; height: 80px; cursor: move }
.slides #sortable li.W img.photo{ width: 100%; height: auto }
.slides #sortable li.H img.photo{ width: auto; height: 100%; max-height: 160px; margin: 0 }
.slides #sortable li img		{ height: 20px; width: auto; margin-right: 10px }
.slides div.nonaffich 			{ margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; height: 18px; min-height: 70px; cursor:pointer; border-bottom: 1px dashed #CCC; margin-bottom: 2px }
.slides div.nonaffich img		{ display: inline-block; float: left; width: 70px; height: 70px; margin: 0 15px }
.slides form					{ width: 85%; max-width: 700px; margin: auto }

.slides-infos 					{ width: 100% }
.slides-infos table				{ width: 100%; max-width: 800px; margin: 2% auto; font-size: 12px }
.slides-infos td				{ display: table-cell; padding: 5px }
.slides-infos td:first-child	{ width: 25% }
.slides-infos img				{ display: block; width: auto; height: 100px; margin: auto }
.slides-infos input[type="text"]	{ width: 100% }
.slides-infos input[type="submit"].fixed	{ position: fixed; right: 0; width: 150px; font-size: 12px; height: auto; padding: 6px }
.slides-infos input[type="button"].fixed	{ position: fixed; right: 0; width: 150px; font-size: 10px; height: auto; padding: 4px; margin-top: 6px; font-style: italic; background-color: #777 }
@media (max-width: 1200px){ 			
.slides-infos input[type="submit"].fixed, .slides-infos input[type="button"].fixed	{ position: fixed; right: 0; width: 100px; font-size: 12px }
}
@media (max-width: 600px){ 			
.slides-infos td				{ display: block; width: 100%!important }	
}

.page								{ width: 90%; max-width: 800px; margin: auto }
.page table							{ width: 100%; border-collapse: collapse; border: 1px solid #829FBC; background-color: #FFF  }
.page table tr:hover				{ border-top: 1px solid #829FBC; border-bottom: 1px solid #829FBC }
.page table tr:nth-child(even) 		{ background-color: #E1E2E3 }
.page table td						{ padding: 6px }
.page table td:first-child			{ padding-left: 10px }
.page table td a					{ color: #666 }
.page table td a:hover				{ color: #DA5158 }
.page table td img					{ max-width: 120px; max-height: 80px }
.page table td i					{ font-size: 15px; margin-right: 10px }

form.resa  						{ width: 500px; margin: auto }
form.resa input, form.resa select, form.resa textarea { width: 100% }

.categories						{ width: 60%; margin: auto }
.categories .cadre				{ padding: 1% 2%; border: 2px solid #DA5158}
.categories form				{ float: none }
.categories form li				{ display: inline-block; width: 25% }
.categories ul					{ list-style-type: none !important; margin: 0; padding: 0 }
.categories #sortable li 		{ display: block; padding: 1%; min-height: 45px; border-top: 1px dashed #CCC }
.categories #sortable li.h85	{ min-height: 85px }
.categories #sortable li:hover	{ background-color: #EEE; border-right: 5px solid #999}
.categories #sortable li:last-child { border-bottom: 1px dashed #CCC }
.categories #sortable li span	{ color: #938E7A }
.categories #sortable li .txt	{ padding: 2% 4%; min-height: 45px }
.categories #sortable li .minus	{ font-size: 11px; text-transform:uppercase; letter-spacing: 2px }
.categories #sortable li img	{ float: right; height: 30px; width: auto; padding: 5px }
.categories #sortable li i		{ float: right; font-size: 15px; padding: 5px }
.categories #sortable.big li .txt	{ padding: 1% 4% }
.categories #sortable img.icone	{ float: right }
.categories #sortable img.icone2{ float: none; vertical-align: middle }
.categories #sortable li img.gauche{ float: left; height: 80px; margin-top: -3% }
.categories #sortable li.sssrub	{ min-height: inherit; border-bottom: 0 }

@media (max-width: 800px){ 
.categories	 					{ width: 100% }
.categories #sortable li .txt	{ padding: 2% 6% }
}

.categories .titre				{ font-size: 13px; text-transform:uppercase; letter-spacing: 2px; color: #465253; margin: 10px 0 }
.categories ul					{ list-style-type: none !important; margin: 0; padding: 0 }
.categories #normal li 			{ display: block; padding: 1%; min-height: 45px; border-bottom: 1px dashed #CCC }
.categories #normal li.h30		{ min-height: 30px }
.categories #normal li.h85		{ min-height: 85px }
.categories #normal li:hover	{ background-color: #D5D8DB; border-right: 5px solid #999}
.categories #normal li:first-child 		{ border-top: 1px dashed #CCC}
.categories #normal li .txt		{ padding: 2% 4% }
.categories #normal li.h30 .txt	{ padding: 2px 2% }
.categories #normal li .minus	{ font-size: 11px; text-transform:uppercase; letter-spacing: 2px }
.categories #normal li img		{ float:right; width: auto; height: 30px; padding: 5px }
.categories #normal li img.photo{ height: 80px }
.categories #normal li img.gauche{ float:left; height: 80px; margin-top: -1% }
.categories #normal li i		{ float: right; font-size: 15px; padding: 5px }

.categories ul#tableau 			{ list-style-type: none!important; display: flex; flex-direction: row; flex-wrap: wrap; align-content: space-around; align-items: stretch; margin: 0; padding: 0; width: 100%; }
.categories #tableau li 		{ flex-grow: 1; width: 23%; margin: 1%; padding: 1%; border: 1px solid #CCC }
.categories #tableau li h3		{ font-size: 12px; margin: 0 }
.categories #tableau li img		{ height: 100px; width: auto; margin-right: 10px }
@media (max-width: 992px){ 
.categories #tableau li 		{ width: 48% }
}

/* TRAITEUR */

/*.compte-form 	 DEJA AU-DESSUS				{ }
.compte-form form 				{ width: 100%; margin: 20px auto }
.compte-form form .ligne-col	{ display: inline-block; width: 49% }
.compte-form form label 		{ float: none; width: 100%; text-transform: none; color:#555; font-size: 13px; letter-spacing: 2px; margin-bottom: 2px }
.compte-form form input[type=text] { width: 100%; margin: 5px 0 }	

@media (max-width: 600px){ 		
.compte-form form .ligne-col	{ display: block; width: 100% }
}

.compte 						{ margin: 2% auto }
.compte .compte-bloc			{ margin: 3% 2%; padding: 1% 2%; border: 1px solid #CCC; min-height: 100px; line-height: 1.5em }
.compte .compte-bloc a			{ text-decoration: none }
.compte .compte-bloc-header		{ display: flex; flex: 0 1 auto; -webkit-box-direction: normal; flex-wrap: wrap; justify-content: space-between; border-bottom: 1px solid #CCC; padding: 10px 0; margin-bottom: 15px }
.compte-bloc-header	.compte-bloc-titre	{ font-size: 1.1em; letter-spacing: 1px }
.compte-bloc-header	.compte-bloc-actions{ min-width: 100px; text-align: right; letter-spacing: 0.25px }
.compte-bloc-header	.compte-bloc-actions a	{ margin-left: 15px }
.compte .compte-g 				{ display: inline-block; width: 55%; vertical-align: top }
.compte .compte-d 				{ display: inline-block; width: 44%; vertical-align: top }

@media (max-width: 550px){ 			
.compte .compte-g, .compte .compte-d	{ display: block; width: 90%; margin: 3% auto }
.compte-bloc-header	.compte-bloc-titre	{ font-size: 1em }
}*/

.compte-bloc table 				{ border-collapse: collapse }
.compte-bloc table  tr:hover	{ border-top: 1px solid #829FBC; border-bottom: 1px solid #829FBC }
.compte-bloc table  tr:nth-child(even) { background-color: #E1E2E3 }
.compte-bloc table  td 			{ padding: 5px; line-height: 1.3em }

.compte-info-suite 				{ padding: 0 10px; height: 100%; max-height: 0; overflow: hidden; -webkit-transition: max-height .5s ease-in-out; transition: max-height .5s ease-in-out }
.compte-info label				{ float: right; margin-top: -45px; padding-right: 1%; cursor: pointer }
.compte-info label i			{ font-size: 1.2em; letter-spacing: 1px; font-style: normal }
.compte-info label span 		{ font-size: 14px; letter-spacing: 0.25px; color: #A07900 }
.compte-info label:hover span	{ color: #AE3B2C }
.compte-info input[type=checkbox]:checked + label + .compte-info-suite 	{ max-height: 400px }
.compte-info label > span 		{ float: right; -webkit-transition: -webkit-transform .65s ease; transition: transform .65s ease }

.compte-bloc-form label 		{ font-size: 1.2em; letter-spacing: 1px; border-bottom: 1px solid #CCC }
.compte-bloc-form label > span 	{ margin-top: 0 }
.compte-bloc-form form 			{ width: 100%; max-width: 400px; margin: auto }
.compte-bloc-form form input	{ float: none; width: 100%; margin: 3px 0 9px 0; text-align: center }
.compte-bloc-form form textarea	{ float: none; width: 100%; margin: 3px 0 9px 0 }

@media (max-width: 550px){ 			
.compte-bloc-form label 		{ font-size: 1em }
}

.compte-adresses .compte-bloc	{ max-width: 700px; margin: 3% auto }

@media (max-width: 550px){ 			
.compte-adresses .compte-bloc	{ width: 90%; max-width: none; margin-top: 5% }
}

.cart-adresses 					{ }
.cart-adresse-choix				{ display: inline-block; width: 48%; vertical-align: top }
.cart-adresse 					{ display: inline-block; width: 48%; vertical-align: top }
.cart-adresse .compte-bloc		{ min-height: 150px }
@media (max-width: 900px){ 	
.cart-adresse-choix				{ margin: 2% 0; line-height: 1.5em }
.cart-adresse-choix	select		{ display: block; padding: 5px 10px; margin: 3% 5%; width: 90% }
}
@media (max-width: 500px){ 	
.cart-adresse-choix 			{ display: block; width: 100% }
.cart-adresse 					{ display: block; width: 100% }
.cart-adresse .compte-bloc		{ min-height: inherit }
}


.contacts						{ margin-top: 0; min-height: 500px; background-color:  #FFF }
/*.contacts .cols2 				{ padding-top: 0 }*/
.contacts .col2 img				{ width: 42px;	height: auto; margin-left: 2% }

.contacts form 					{ padding: 1% 5% 1% 0; background-color: #F9F9F9; font-size: 10px; text-transform:uppercase; letter-spacing: 2px }
/*.contacts form input			{ width: 13% }*/
.contacts form select			{ margin-right: 2%; max-width: 15%; font-size: 12px }
.contacts form img				{ cursor: pointer; vertical-align:middle; padding: 0 1% }
.contacts .lettres 				{ width: 100%; background-color:#465253; text-align: right;	color: #CCC; padding: 10px; letter-spacing: 1px; font-size: 15px }
.contacts .lettres A 			{ color: #CCC; font-weight:normal }
.contacts .lettres A.choix		{ color: #CF1238 }
.contacts .lettres A:hover 		{ color: #FFF }
.contacts .lettres img		 	{ vertical-align: middle; margin-top: -2px; height: 25px; width: auto }
.contacts table					{ display: table; width: 100%; border-collapse: collapse; font-size: 0.9em  }
.contacts table th				{ font-size: 10px; text-transform:uppercase; letter-spacing: 2px; color:#9C9A97; cursor:pointer; font-weight:normal; text-align:left; padding: 10px 0 0 5px }
.contacts table th.choix		{ color: #CF1238}
.contacts table tr.ligne		{ vertical-align:top; cursor:pointer}
.contacts table tr.ligne:hover	{ background-color: #EEE}
.contacts table td				{ padding: 4px 3px 0 10px }
/*.contacts table img				{ width: 18px; height: auto}*/

@media (max-width: 600px){ 	
.contacts						{ min-height: inherit }
.contacts .lettres 				{ width: 100%; background-color:#465253; text-align: right;	color: #CCC; padding: 10px; letter-spacing: 1px; font-size: 14px }
}

.contact-fiche table			{ display: table; width: 80%; margin: auto; border-collapse: collapse; max-width: 700px }
.contact-fiche table.mails		{ width: 90%; max-width: none; line-height: 1.2em }
.contact-fiche table.mails tr:nth-child(even){ background-color: #E1E2E3 }
.contact-fiche table td			{ padding: 5px }
.contact-fiche table td.date 	{ max-width: 120px; color: #888; padding-left: 20px; vertical-align: top }
.contact-fiche form				{ width: 80%; max-width: 700px; margin: auto }

.albums ul#tableau 				{ list-style-type: none!important; display: flex; flex-direction: row; flex-wrap: wrap; align-content: space-around; align-items: stretch; margin: 0 0 2%; padding: 0; width: 100%; }
.albums #tableau li 			{ flex-grow: 1; width: 23%; margin: 1%; padding: 1%; border: 1px solid #CCC; overflow: hidden }
.albums #tableau li:hover		{ background-color: #F0F1F2 }
.albums #tableau li h2			{ font-size: 12px; margin: 0 }
.albums #tableau li .photo 		{ display: block; margin: 10px 0; overflow: hidden }
.albums #tableau li .photo img	{ height: 200px; width: auto }
.albums #tableau li .video		{ margin: 8% auto }
.albums #tableau li .video iframe	{ width: 100%; max-width: 400px; height: 225px }	
@media (max-width: 992px){ 
.albums #tableau li 			{ width: 48% }
}
@media (max-width: 600px){
.contenu .albums				{ font-size: 14px; min-height: inherit  }
.albums #tableau li 			{ width: 95%; margin: 3% 1%  }
}

@media (max-width: 600px){ 				
.albums							{ min-height: inherit }
.albums #tableau li h3			{ font-size: 14px; margin: 2% }
}

.panel-album-infos 					{ position: fixed; top: 30%; width: 300px; right: -300px; z-index: 1000; padding: 10px 30px; background-color: #000; text-align: justify; font-size: 0.9em; line-height: 1.8em }
.panel-album-infos .panel-album-close { display: block; text-align: right }
.panel-album-infos a 				{ color: #FFF }
.panel-album-infos a:hover			{ color: #CCC; padding-left: 5px; transition: transform .65s ease }
@media (max-width: 550px){
	.panel-album-infos 				{ width: 100%; right: -550px; font-size: 1.1em }
}

.description						{ width: 90%; max-width: 500px; margin: 0 auto 1% auto; border: 1px solid #000; padding: 2%; font-size: 1.1em }
.description .actions 				{ float: right; white-space: nowrap }
.description .actions .fas, .description .actions .far { font-size: 20px; margin: 0 10px }
.description .infoprojet			{ border-bottom: 2px solid #999; padding: 1% 0; font-size: 13px; line-height: 1.3em; margin-bottom: 20px }
.description .infoprojet a			{ color: #666 }
.description .nomalbum				{ margin-bottom: 1%; color:#23394E; letter-spacing: 2px }
.description .infoalbum				{ padding: 1% 0; line-height: 1.3em }

.album								{ width: 95%; margin: 2% auto; padding-bottom: 5%; background-color: #FFF; min-height: 600px }
.album .docs						{ }
.album .docs .doc					{ display: inline-block; margin: 1% }
.album .docs .doc a img.icone		{ width: 40px; height: auto }
.album .docs .doc video				{ width: 100%; max-width: 400px; max-height: 300px }
.album form							{ width: 80%; margin: 2% auto }
.album .legende 					{ font-size: 9px; padding-bottom: 3px; margin-bottom: 1%}
.album .legende img					{ height: 15px; width: auto; vertical-align: middle; margin-left: 2% }
.album .blocphoto					{ display: inline-block; margin: 2px 2px 15px; text-align: center }
.album .blocphoto a.photo			{ display: block }
.album .blocphoto a.photo img 		{ width: auto; height: 250px; margin: 0 0 3px }
.album .blocphoto img.couv			{ border: 4px dotted #666 }
.album .blocphoto img, .album i		{ width: auto; height: 15px; margin: 0 5px; cursor: pointer }

.album .blocphoto .photo-legende 	{ position: absolute; margin-top: -26px; height: 20px; width: 250px; background-color: rgba(130, 159, 188, 0.5); overflow: hidden; white-space: normal; font-size: 0.9em; color: #FFF; padding: 0 4px }
.album .blocphoto .photo-legende:hover {  margin-top: -66px; height: 60px; -webkit-transition: -webkit-transform .65s ease; transition: transform .65s ease  }


.album .chapitre 				{ text-align: center }
.album .chapitre 				{ display: block; width: 100%; background-color: #031331; color: #EEE; margin: 1% auto; padding: 1%; font-size: 13px; cursor: move }

.upload 						{ margin: 2% auto }
.upload .image_upload_div		{ width: 80%; margin: 5% auto; text-align: center }

.gallery 						{ text-align: center; margin: 0 50px; min-height: 450px; font-size: 12px } 
.gallery .gallery-bloc 			{ display: inline-block }
.gallery .gallery-bloc a		{  }
.gallery .gallery-bloc img		{ display: block; width: auto; height: 300px; padding: 5px }
.gallery .gallery-bloc figure	{ background: center no-repeat; cursor: pointer }

@media (max-width: 1200px){
}
@media (max-width: 930px){
.gallery 						{ margin: 0 } 
}

.tdl-projets 					{ padding: 1% }
.tdl-projets table				{ width: 250px; border: 1px solid; font-size: 0.9em; border-collapse: collapse; border-spacing: .5em; margin: auto }
.tdl-projets table td			{ vertical-align: top; border: 1px solid #CCC; padding: 5px }
.tdl-projets table td div.titre	{ width: 250px; background-color: #EEE; cursor: pointer; min-height: 60px }
.tdl-projets table input, .tdl-projets table select { width: 100% }

.tdl-projet 					{  }
.tdl-projet .tdl-bloc			{ margin: 2% auto; max-width: 900px; min-height: 150px }
.tdl-projet .tdl-bloc h3		{ font-size: 1em; letter-spacing: 1px }
.tdl-projet .tdl-bloc .tdl		{ display: table; width: 100%; clear: both }
.tdl-projet .tdl-bloc .tdl-col	{ display: table-cell; width: 48%; vertical-align: top }
.tdl-projet .tdl-bloc .tdl-col:first-child	{ width: 40%; color: #829FBC; line-height: 1.1em }
.tdl-projet .tdl-bloc .tdl-col:last-child	{ width: 13%; vertical-align: middle }
.tdl-projet .reponses			{ text-transform: uppercase; font-size: 0.8em; color: #333 }
.tdl-projet .reponses label		{ cursor: pointer }
.tdl-projet input[type="radio"] { display: none }
.tdl-projet input[type="radio"] + label 		{ display: inline-block; width: 90px; margin: 2px 6px 2px 0; padding: 2px; border: 1px solid #CCC; text-align: center }
.tdl-projet input[type="radio"]:checked + label.R0	{ border: 2px solid #EE7818; color: #EE7818 }
.tdl-projet input[type="radio"]:checked + label.R1	{ border: 2px solid #F6B19E; color: #F6B19E }
.tdl-projet input[type="radio"]:checked + label.R2	{ border: 2px solid #00B04D; color: #00B04D; font-weight: bold }
.tdl-projet input[type="text"] 	{ width: 90%; font-size: 0.9em; margin: 2px 0; padding: 2px 0 2px 10px; border: 1px solid #CCC }
.tdl-projet textarea 			{ width: 90%; font-size: 0.9em; margin: 2px 0; padding: 2px 0 2px 10px; border: 1px solid #CCC }
.tdl-projet input[type="date"] 	{ float: right; width: 120px; margin-right: 230px; text-align: center; cursor: pointer; font-size: 0.8em; padding: 4px; border: 1px solid #CCC }

@media (max-width: 960px){ 	
.tdl-projet 					{ display: block; width: 100% }
.tdl-projet .tdl-bloc			{ min-height: inherit }
.tdl-projet input[type="radio"]:first-child + label 		{ margin-right: 30px }
}
@media (max-width: 800px){ 	
.tdl-projet .tdl-bloc .tdl		{ display: block; clear: both }
.tdl-projet .tdl-bloc .tdl-col	{ display: block; width: 100% }
.tdl-projet .tdl-bloc .tdl-col:first-child, .tdl-projet .tdl-bloc .tdl-col:last-child	{ width: 100%; padding: 15px 0 5px }
.tdl-projet .tdl-bloc .tdl-col i.m-left15	{ margin-left: 3%!important }
.tdl-projet form				{ width: 100% }
.tdl-projet input[type="radio"]:first-child + label 		{ margin-right: 20px }
}


/*
.albums							{ width: 95%; margin: 2% auto; text-align: center; min-height: 600px; font-size: 14px }
.albums .cadrealbum				{ display: inline-block; width: 18%; margin: 1% 1% 3%; vertical-align: top; text-align: center; cursor: pointer  }
.cadrealbum .cadrealbum-date	{ text-align: center; font-size: 11px; letter-spacing: 2px; margin: 2px 8px }
.cadrealbum-photo .cadrephoto	{ position: relative; width: 100% }
.cadrealbum-photo .cadrephoto::after	{   content: '';  display: block;  padding-bottom: 100%; }
.cadrealbum-photo .cadrephoto img { position: absolute; top: 0; left: 0;    width: 100%;    height: 100%;    object-fit: cover }
.cadrealbum-photo .minus		{ font-size: 9px }

@media (max-width: 992px){
.albums .cadrealbum				{ width: 23% }
}
@media (max-width: 768px){
.albums .cadrealbum				{ width: 30% }
}
@media (max-width: 550px){
.albums .cadrealbum				{ width: 46% }
}
@media (max-width: 480px){
.albums .cadrealbum				{ display: block; width: 90% }
}
.description					{ width: 65%; margin: 0 auto 1% auto; background-color:#DDD; padding: 2% }
.description .actions 			{ float: right; white-space: nowrap }
.description .actions .fas, .description .actions .far { font-size: 20px; margin: 0 10px }
.description .nomalbum			{ margin-bottom: 1%; color:#23394E; letter-spacing: 2px }
.description .datealbum			{ text-align: left }
.description .infoalbum			{ border-top: 1px dashed #999; padding: 1% 0; font-size: 13px; line-height: 1.3em }
@media (max-width: 550px){
.description					{ width: 90% }
}

.album-visu						{ width: 95%; margin: 2% auto; background-color: #FFF; min-height: 600px }
.album-visu .docs				{ }
.album-visu .docs a				{ display: block; margin: 1%; }
.album-visu .docs a img			{ width: 40px; height: auto }
.album-visu form				{ width: 80%; margin: 2% auto }
.album-visu .legende 			{ font-size: 9px; border-bottom: 1px dashed #999; padding-bottom: 3px; margin-bottom: 1%}
.album-visu .legende img		{ height: 15px; width: auto; vertical-align: middle; margin-left: 2% }
.album-visu .blocphoto			{ display: inline-block; margin: 2px }
.album-visu .blocphoto img.photo{ width: auto; height: 200px }
.album-visu video				{ width: 100%; max-width: 400px; max-height: 300px }
.album-visu .chapitre span		{ text-align: center }
.album-visu .chapitre span		{ display: block; width: 100%; background-color: #EEE; margin: 1% auto; padding: 1%; font-size: 13px; cursor: move }

.panel-album-infos 					{ position: fixed; top: 30%; width: 300px; right: -300px; z-index: 1000; padding: 10px 30px; background-color: #829FBC; text-align: justify; font-size: 0.9em; line-height: 1.8em }
.panel-album-infos .panel-album-close { display: block; text-align: right }
.panel-album-infos a 				{ color: #FFF }
.panel-album-infos a:hover			{ color: #02071B; padding-left: 5px; transition: transform .65s ease }
@media (max-width: 550px){
	.panel-album-infos 					{ width: 100%; right: -550px; font-size: 1.1em }
}

.album								{ width: 95%; margin: 2% auto; padding-bottom: 5%; background-color: #FFF; min-height: 600px }
.album .docs						{ }
.album .docs .doc					{ display: inline-block; margin: 1% }
.album .docs .doc a img.icone		{ width: 40px; height: auto }
.album .docs .doc video				{ width: 100%; max-width: 400px; max-height: 300px }
.album form							{ width: 80%; margin: 2% auto }
.album .legende 					{ font-size: 9px; padding-bottom: 3px; margin-bottom: 1%}
.album .legende img					{ height: 15px; width: auto; vertical-align: middle; margin-left: 2% }
.album .blocphoto					{ display: inline-block; margin: 2px 2px 15px; text-align: center }
.album .blocphoto img.photo 		{ width: auto; height: 250px; margin: 0 }
.album .blocphoto img.couv			{ border: 4px solid #CC0000 }
.album .blocphoto img, .album i		{ width: auto; height: 15px; margin: 0 5px; cursor: pointer }

.album .blocphoto .photo-legende 	{ position: absolute; bottom: 42px; height: 20px; background-color: rgba(130, 159, 188, 0.5); overflow: hidden; white-space: normal; font-size: 0.9em; color: #FFF; padding: 0 4px }
.album .blocphoto .photo-legende:hover { bottom: 42px; height: 100px; -webkit-transition: -webkit-transform .65s ease; transition: transform .65s ease  }


.album .chapitre 				{ text-align: center }
.album .chapitre 				{ display: block; width: 100%; background-color: #031331; color: #EEE; margin: 1% auto; padding: 1%; font-size: 13px; cursor: move }

.gallery 						{ text-align: center; margin: 0 50px; min-height: 450px; font-size: 12px } 
.gallery .gallery-bloc 			{ display: inline-block }
.gallery .gallery-bloc a		{  }
.gallery .gallery-bloc img		{ display: block; width: auto; height: 300px; padding: 5px }
.gallery .gallery-bloc figure	{ background: center no-repeat; cursor: pointer }

@media (max-width: 1200px){
}
@media (max-width: 930px){
.gallery 						{ margin: 0 } 
}
*/






.traduction 					{ }
.traduction table 				{ width: 80%; margin: 2% auto }
.traduction table td.abbr		{ font-size: 11px; letter-spacing: 2px }

.types							{ display: inline-block; vertical-align: top; width: 60%; margin: auto }
.types ul						{ list-style-type: none !important; margin: 0; padding: 0 }
.types li 						{ display: block; padding: 1%; min-height: 45px; cursor:pointer; border-bottom: 1px dashed #CCC}
.types li:first-child 			{ border-top: 1px dashed #CCC}
.types li .txt					{ padding: 2% 4% }
.types li img					{ float:right; height: 20px; width: auto; padding: 5px }

.cke_editable 						{ font-family: Police }

/*.fancybox-content					{ width: 800px!important;	}*/

.connexions							{ width: 60%; margin: auto }
.connexions	table					{ width: 100% }

.export								{ width: 60%; margin: auto }

.mail-messages						{ width: 60%; margin: auto }

.mail								{ }
.mail .tdm-modeles					{ float: right; width: 18%; margin-left: 2%; border: 1px dashed #666; padding:10px }
.mail .tdm-modeles	a				{ display:block; padding: 4px; cursor: pointer }
.mail form							{ width: 60%; margin-left: 10% }
.mail .membre input					{ height: 25px}

.mailpopup							{ }
.mailpopup ul						{ list-style: none; padding: 0; font-size: 0.9em  }
.mailpopup li						{ display: inline-block; width: 25%; vertical-align: top }
.mailpopup input[type="checkbox"] 	{ margin: 1px 3px!important; height: 30px}

.fichiers 							{ }
.fichiers .tdm-rub					{ display: inline-block; width: 15%; vertical-align: top; margin-right: 1%; font-size: 13px }
.tdm-rub ul							{ list-style: none; margin: 0; padding: 0; text-align: center }
.tdm-rub li							{ background-color: #CCC; margin: 3px; padding: 7px; cursor: pointer; text-transform: uppercase; letter-spacing: 1px }
.tdm-rub li:hover					{ background-color: #666; color: #FFF }
.tdm-rub li.choix					{ background-color: #999; color: #FFF }
.tdm-rub select						{ display: none; visibility: hidden }

.fichiers .tdm-ssrub				{ display: inline-block; width: 30%; vertical-align: top;; margin-right: 1% }
.tdm-ssrub ul						{ list-style: none; margin: 0; padding: 0 }
.tdm-ssrub ul.scroll				{ max-height: 488px; overflow-y: scroll }
.tdm-ssrub li						{ background-color: #D9D9D9; margin: 3px; padding: 7px; cursor: pointer}
.tdm-ssrub li:hover					{ background-color: #888; color: #FFF }
.tdm-ssrub li.choix					{ background-color: #BBB; color: #FFF }
.tdm-ssrub li li					{ padding: 5px }
.tdm-ssrub li:hover li				{ background-color: #888 }
.tdm-ssrub li li:hover				{ border-right: 5px solid #23394E }
.tdm-ssrub li.choix li				{ background-color: #BBB }
.tdm-ssrub li li.choix				{ color: #23394E; font-weight: 600 }
.tdm-ssrub select 					{ display: none; visibility: hidden }

.fichiers .contenu-fichiers			{ display: inline-block; width: 49%; vertical-align: top; background-color: #FFF; padding: 10px; min-height: 450px }
.contenu-fichiers img				{ max-height: 100px; width: auto }
.contenu-fichiers input.search		{ width: 60%; min-width: 350px; font-size: 0.9em }
.contenu-fichiers .fichier-actions 	{ border-bottom: 2px solid #AAA; padding-bottom: 8px; margin-bottom: 8px; text-align: center }
.contenu-fichiers .fichier			{ border-bottom: 1px solid #AAA; padding: 3px 0 }
.contenu-fichiers .fichier h5		{ font-size: 14px; font-weight: bold; margin: 3px 0 }
.contenu-fichiers .fichier img.fichier-icone	{ float: right; max-width: 200px; max-height: 40px }
.contenu-fichiers .fichier .fichier-lien i		{ font-size: 14px; color: #999 }
.contenu-fichiers .fichier div		{ padding: 5px; margin-bottom: 1% }
.contenu-fichiers .fichier .moyen	{ font-size: 13px }
.contenu-fichiers .fichier:hover 	{ background-color: #F0F1F2 }
.contenu-fichiers .fichier:hover .edit	{ opacity: 1 }
.contenu-fichiers .fichier .edit	{ float: right; opacity: 0; padding-left: 10px }
.contenu-fichiers .fichier .edit img { width: 15px; height: auto; vertical-align: middle; margin-left: 10px; cursor: pointer }
.contenu-fichiers form input[type="text"], .contenu-fichiers form select { width: 100% }
.contenu-fichiers form textarea		{ width: 100%; resize: vertical }

@media (max-width: 1024px){ 
.fichiers .tdm-rub, .fichiers .tdm-ssrub, .fichiers .contenu-fichiers 		{ width: 100%; min-width: auto }
.fichiers .tdm-rub ul, .fichiers .tdm-ssrub ul				{ display: none; visibility: hidden }
.fichiers .tdm-rub select, .fichiers .tdm-ssrub select 		{ display: block; visibility: visible; width: 96%; margin: 2% }
}


@media (max-width: 1200px){ }
@media (max-width: 992px){ }
@media (max-width: 768px){ }
@media (max-width: 480px){ }


.liste							{ margin: 2% auto!important; line-height: 16px }
.liste table 					{ width: 100% }
.liste table tr.fond-noir		{ background-color: #000; color: #FFF }
.liste table th					{ padding: 1%; box-sizing: border-box }
.liste table td.retrait 		{ padding-left: 15px; color: #414141 }
.liste table select.complet		{ font-size: 11px!important; letter-spacing: 1px; padding: 3px !important; margin: 1% auto; display: block }
.liste .complet option 		    { font-size: 11px!important }
.liste td.actions 				{ text-align: center; white-space: nowrap }
.liste td.actions img.enveloppe	{ width: auto; height: 28px; margin: 0 25px }
.liste td.actions select		{ font-size: 10px!important; margin: 0 20px }
.liste td.actions option		{ font-size: 10px!important; color: #000; letter-spacing: 2px; text-transform: uppercase }

@media (max-width: 768px){
.liste td.actions 				{ white-space: inherit }
.liste table th select.archives	{ display: none; visibility: hidden }
.liste td div.print				{ display: none; visibility: hidden  }
}
@media (max-width: 480px){
}

.table-liste					{  }
.table-liste input.date 		{ width: 20%}
.table-liste .lettres 			{ width: 100%; background-color: #465253; text-align: right; color: #CCC; font-size: 12px; font-weight: bold; padding: 7px 0 }
.table-liste .lettres A 		{ color: #CCC }
.table-liste .lettres A.choix	{ color: #DA5158 }
.table-liste .lettres A:hover 	{ color: #FFF }
.table-liste .lettres img		 { vertical-align: middle; margin-top: -2px; height: 25px; width: auto }
.table-liste table				{ display: table; width: 100%; border-collapse: collapse; font-size: 12px }
.table-liste table tr:hover			{ border-top: 1px solid #829FBC; border-bottom: 1px solid #829FBC }
.table-liste table tr:nth-child(even) { background-color: #E1E2E3 }
.table-liste table td			{ padding: 4px 3px 0 10px }
.table-liste table td img		{ width: 20px; height: auto; margin: 0 5px }