﻿/*table des matières */
/* 
1- Conventions de nommage et d'écriture
2- Eléments HTML
3- Elements de page
4- Classes spécifiques
5- Imprimer


/* 1- Conventions de nommage et d'écriture

> Nommage des fichiers images (images autres que celles provenant par défaut de sharepoint): ID_label_format.extension
> Les ID commencent par une majuscule, les class par une minuscule - Décrivent une fonctionnalité plutôt qu'une apparence
> Nommer comme suit: parent_enfant (Exemple: #header #header_navbar #header_logo)
> Répéter dans le nom des class, le nom des ancêtres
> Pour une seule propriété à afficher, écrire le tout sur une seule ligne
> Indenter le code pour mettre en évidence les dépendances entre chaque éléments CSS d'une même classe !
> Utiliser espaces et commentaires pour séparer les portions de code logiquement différents
> Grouper les élements, tags par type et les ordonner dans une séquence logique
> ordonner alphabétiquement les propriétés 
> séparer le code en catégories pour une meilleure maintenance (typographie - structure - Liens(LVHA) - etc)

*/ 

/* 2- Eléments HTML ****************************************************************************************/


@import url("admin.css"); /* manage lists/librairie view */
@import url("controlesSharepoint.css"); /* manage sharepoint controls style */
@import url("webparts.css"); /* manage webparts style */

/***** Global Settings *****/

html {margin:0; padding:0; border:0}

body {
	background: #d6dddd url(/sites/Fondation/_catalogs/masterpage/_images/fondation/bg.gif) repeat-x top left; 
	border:0;
	font-family:Arial, Helvetica, sans-serif; 
	margin:0; 
	padding:0
	}

a { color: #000 }
	
	a:hover { color: #111; text-decoration:none }

	a img { border: 0 }



/* 2- FIN des Eléments HTML ********************************************************************************/

#page { margin:0 auto; width: 854px }

#header { position: relative; height: 482px }
	#header a{ color:#737576;font-size:11px; text-decoration: none }
	
#logo_container { position: relative; z-index:100}
#logo { margin: 9px 0 0 21px }

#TopLinkBar{ position: relative; z-index:400;width:250px}

#SiteActionMenuControl {
	position: absolute; 
	top: 20px; right: 405px; z-index:100; 
	height:24px
	}
#SiteActionMenuControlFondation{
				padding:0;margin-right:-25px
}

#SiteActionMenuControl div > div {padding:0 5px	}



#Language table{
	background:url('/sites/Fondation/_catalogs/masterpage/_images/fondation/header_arrow.gif') no-repeat 27px 5px;
	padding-left:15px;
	position: absolute; top: 14px; right: 350px; z-index:100; 
	height:24px
	}
		#Language a{padding-left:8px;}

#network { position: absolute; top: 20px; right: 100px; z-index:100; height:24px }

		#network .arrow { float:left; position:relative; padding-right:3px; top:-1px}
		
#quick_nav { 
	position: absolute; top: 72px; right: 0; z-index:100; 
	width: 478px; 
	height: 23px; 
	padding: 6px 15px 0 0; 
	background-image: url(/sites/Fondation/_catalogs/masterpage/_images/fondation/bg_quick_nav.png); 
	text-align: right 
	}
	
	#quick_nav a { color: #868074; text-decoration: none }

#quick_nav_bg { position: absolute; top: 29px; right: 0 }

#photos_bg { 
	position: absolute;
	top: 0px; 
	left: -37px; 
	width:934px; 
	height:447px;
	background-image:url(/sites/Fondation/_catalogs/masterpage/_images/fondation/bg_texture.jpg);
	background-repeat:no-repeat
	}
	
#photos_container {position: absolute; left:125px; top:65px; z-index:10}

#menu { 
	position: absolute; top: 300px; z-index:15; left:0; 
	width: 834px;
	height: 49px;
	padding-left: 20px;
	background-image: url(/sites/Fondation/_catalogs/masterpage/_images/fondation/bg_menu.png)
	}
	
	#menu a { color: #efefe7;
		padding:0 8px;
		text-transform: uppercase; 
		text-decoration: none; 
		font-size: 11px!important; 
		font-weight: bold; 
		line-height: 49px
		}
		
		#menu a:hover { color: #999a83 }

#access_membre {position: absolute; top: -36px; right: 18px}

#photo_kid_left { position:absolute; top:5px; left:576px; z-index: 12;}
#photo_kid_right { position:absolute; top:5px; left: 722px; z-index: 17;}

#main_title { 
	position: relative; z-index:15; left:276px; top: 222px; 
	width:559px;
	border: 1px solid #d7d5c6; 
	border-width: 0 1px 1px
	}

/* ------ S U B - M E N U ------ */


#MenuGauche{margin-left: 15px; padding:0 0px 15px 4px }
	#MenuGauche a { text-decoration: none; font-family: Verdana, Geneva, sans-serif }


#MenuContainer #SiteTitle {
	margin:0  15px;
	padding:15px 0 15px 15px; 
	border: none; 
	background-color: transparent;
	text-align:right
	}

		#MenuContainer #SiteTitle a{
			font-family: Verdana, Geneva, sans-serif;
			margin: 0; 
			padding: 0 0  0px; 
			color: #7c9497!important; font-size: 22px; 
			font-weight: normal; 
			line-height: 1em;
			text-align:right		
			}

#MenuContainer #MenuControl{text-align:right;margin-right:15px}

#sub-menu { margin-top: 0px; margin-left: 15px; padding: 15px; border: none; background-color: transparent; text-align:right }
		#sub-menu a { text-decoration: none; font-family: Verdana, Geneva, sans-serif; }
		#sub-menu h2 { margin: 0; padding: 0 0 10px; color: #7c9497; font-size: 22px; font-weight: normal; line-height: 1em; }
		#sub-menu h3 { margin: 0; padding: 9px 0; border-top: 1px dashed #b2b8b8; font-size: 11px; font-weight: bold; }
				#sub-menu h3 a { color: #37434e; }
				#sub-menu h3 a.current { color: #0981a0; }
				#sub-menu h3 a:hover { color: #0981a0; }
		#sub-menu ul { margin: 0; padding: 0 0 20px; list-style: none; }
				#sub-menu li { margin: 0; padding: 0; }
						#sub-menu li a { padding-left: 20px; font-size: 9px; color: #37434e; background-image: none }
								#sub-menu li a.current { color: #0981a0; }
								#sub-menu li a:hover { color: #0981a0; }

/* ------ C O N T A I N E R ------ */

#SearchContainer{
	margin:0; 
	padding: 10px 0 10px 20px;
	font-family:Verdana, Arial, Helvetica, sans-serif; 
	font-size:10px; 
	color: #6a6256;
	}

#SearchLabel{padding-bottom:10px}

#sidebar { 
	float: left;
	width: 257px; 
	padding: 0 18px 0 0;
	margin:0; 
	position:relative; top: -135px;	z-index:125
	}

		#sidebar #donate { 
			position:relative; right:-20px; 
			margin-bottom:10px;
			display:block; 
			width: 249px; 
			height:88px; 
			clear:both
			}
				
		#sidebar #access { 
			position:relative; 
			float:right; 
			margin-bottom:0px
			}
		
		#sidebar .calendar_container {padding-left:18px;width:237px}
		
			#sidebar .calendar_container .calendar_repeat { 
				background:url(/sites/Fondation/_catalogs/masterpage/_images/fondation/bg_calendrier_repeat.gif) repeat-y; 
				padding:18px
				}
				
				#sidebar .calendar_container .calendar_div_top { padding-top:0; padding-bottom:10px}
				
				#sidebar .calendar_container .calendar_div { padding:18px 0}
				
				#sidebar .calendar_container .calendar_div_bottom { padding:10px 0}
		
				#sidebar .calendar_container #events_title { padding-bottom:17px}
				
				#sidebar .calendar_container .event_date { 
					float: left; 
					margin-right:7px; 
					background:url(/sites/Fondation/_catalogs/masterpage/_images/fondation/calendrier_date_container.gif) no-repeat;
					width:33px; 
					height:42px
					}
					
				#sidebar .calendar_container .event_date_day { 
					font-family:Verdana, Geneva, sans-serif; 
					font-size:16px; 
					font-weight:bold; 
					color:#FFF; width:33px; 
					text-align:center; 
					padding-top:3px; 
					}
					
				#sidebar .calendar_container .event_date_month { 
					font-family:Verdana, Geneva, sans-serif; 
					font-size:10px; 
					font-weight:bold; color:#FFF;
					text-transform:uppercase;
					width:33px;
					text-align:center
					}
				
				#sidebar .calendar_container .event_description { 
					float:left; 
					width: 157px; 
					font-family:Verdana, Geneva, sans-serif; 
					font-size:12px; 
					color:#FFF
					}
					
				#sidebar .calendar_container .event_description .title, 
				#sidebar .calendar_container .event_description .title a { font-size:12px; color:#FFF; text-decoration:none }
				
				#sidebar .calendar_container .event_description .desc { font-size: 10px; color:#dad6ca; }
				
				#sidebar .calendar_container #all_events .arrow { float: left; margin-right:7px}
				
				#sidebar .calendar_container #all_events .link { float: left; margin-top: 7px}
				
					#sidebar .calendar_container #all_events .link a { 
						font-family:Verdana, Geneva, sans-serif; 
						font-size:10px; 
						font-weight:bold; 
						color:#FFF; 
						text-decoration:none; 
						}
						
						#sidebar .calendar_container #all_events .link a:hover { text-decoration:underline}
		
						#sidebar .calendar_container #noEvents { color:white;font-size:11px;padding-bottom:17px}
#main { 
	float: left; 
	position:relative;top: -55px; 
	width: 560px;
	padding-bottom: 25px;
	margin-bottom: 20px; 
	border: 1px solid #d7d5c6; 
	border-width: 0 1px 1px; 
	background-color: #fafaf7
	}
	
#steth { position: absolute; top: 55px; right: -65px }
* html #steth { position: absolute; right: 771px}

#big_title { position: relative;/*Hack IE7*/*top:-4px }

		#big_title h1 { margin: 0; 
			padding:0; 
			position: absolute; 
			top: 17px; 
			left: 30px; 
			font-size: 30px; 
			color: #999482; 
			font-family:Georgia, "Times New Roman", Times, serif; 
			font-weight: normal
			}

		#big_title h1, 
		#big_title h1 .ms-pagetitle, 
		#big_title h1 a {
			font-size: 30px; 
			color: #999482; 
			font-family:Georgia, "Times New Roman", Times, serif; 
			font-weight: normal
			}

		#big_title .ms-titlearealine {display:none}	
		
		#big_title img[title^="Icon"],
		#big_title img[title^="Icône"]{display:none}	

#HH_ContentDiv{	
	min-height:440px;
	height: expression(this.height < 440 ? 440: true);/* hack to add a min height property for IE*/
	margin: 15px; 
	padding: 20px; 
	border: 1px solid #e2e1d7; 
	font-family:Verdana, Arial, Helvetica, sans-serif; 
	font-size: 11px; 
	color: #434342;
	text-align:justify
	}		

		#HH_ContentDiv > div{
		display:block;
		overflow-x: auto;
		width:100%;
		overflow-y:hidden
		}
		
		
		#HH_ContentDiv .post ul{margin:0 0 0 15px}
		#HH_ContentDiv .post ul li ul{margin:10px 0 0 15px}
		#HH_ContentDiv .post li{padding-bottom:10px}
		

/* ------ P O S T ------ */

.post, .postWithImage {
	color: #434342;
	display:block;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px!important;
	padding:10px 0 0 0
	}
	

.NewsItemPicture {padding:10px 20px 20px 0;}

.NewsItemPicture img{
	max-width:125px!important;
	width: expression(this.width > 125 ? 125: true) /* Hack IE */
	}
	
.date { 
	color: #7db2bf;
	display:block;	
	font-size:10px!important;
	font-weight:bold;	
	margin:0; 
	padding:0 
	}
	
.title, .title a {
	color: #297d92; 
	font-size: 16px!important; 
	font-weight: bold;
	margin:0; 
	padding:0 0 0 0;
	text-decoration:none
	}

.titleWP, .titleWP a {
	color: #297d92; 
	display:block;
	font-size: 16px!important; 
	font-weight: bold;
	margin:0;
	padding:0 0 0 0!important;
	text-decoration:none
	}

	
.sub-title {
	color: #6fa7b4!important; 
	display:block;	
	font-size:12px; 
	font-style:italic; 
	font-weight:normal;
	padding:10px 0 0 0!important;
	
	}
	
.more {
	display:block;
	font-size:11px;
	margin:0;margin-top:10px;
	padding:0; 
	text-align:right
	}
	
	.more a, 
	a.more {
		background: #b3a076 url(/_catalogs/masterpage/_images/hopital/arrow_more.gif) no-repeat right 3px!important; 
		color: #fff!important;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		padding: 0px 20px 2px 5px!important;
		text-decoration:none 
		}

/* ------ F O O T E R ------ */

#footer {
	float: right; 
	position: relative; 
	top:-65px; 
	left:-17px; width: 560px; 
	padding-bottom: 30px; 
	color: #575653; 
	font-family:Verdana, Arial, Helvetica, sans-serif; 
	font-size:10px; 
	text-align:center
	}
	
#FooterContainer{padding:0 0 10px 0!important;text-align:center}
#FooterLabel{font-weight:bold}
#footer a {color: #575653; text-decoration: none;}
	#footer .HH-BottomNavContainer a{ font-size:9px!important;padding:0 4px 0 4px!important}

#footer a:hover {text-decoration: underline;}
#footer > div { margin:0; padding:10px; }
#footer .copyright { border-top: 1px solid #c5c2b2;/*padding-top:5px;*/ }



/* Others */

#MSOTlPn_MainTD{position:absolute;right:0px;top:30px;/*clear:both;z-index:20000*/}

/* Permet de placer correctement le lien pour modifier le titre d'une page donnée: */
#MSOWebPart_Header .ms-SPLink nobr a{background-color:white;color:blue;font-size:11px;position:absolute;right:115px;top:45px;font-family:Arial, Helvetica, sans-serif;z-index:10000}


#HH_ContentDiv .ms-listviewtable .ms-vb2,
#HH_ContentDiv .ms-listviewtable .ms-vb-title .ms-vb{
		display:block;
		white-space:normal!important;/*not W3C valide but work for IE to wrap URL in list : */word-wrap: break-word;
		width:120px!important;
		}

/* / Others */


/* 4- Classes spécifiques utilisées plusieurs fois ***********************************************************/ 
/***** Global Classes *****/
 
.clear         { clear:both; } 
.float-left    { float:left; } 
.float-right   { float:right; } 
.text-left     { text-align:left; } 
.text-right    { text-align:right; } 
.text-center   { text-align:center; } 
.text-justify  { text-align:justify; } 
.bold          { font-weight:bold; } 
.italic        { font-style:italic; } 
.underline     { border-bottom:1px solid; } 
.highlight     { background:#ffc; } 
.wrap          { width:960px;margin:0 auto; } 
.img-left      { float:left;margin:4px 10px 4px 0; } 
.img-right     { float:right;margin:4px 0 4px 10px; } 
.nopadding     { padding:0; }
.paddingLeft5  { padding-left:5px }
.paddingLeft9  { padding-left:9px }
.paddingTop10  { padding-top:20px;margin-top:10px }
.cpcs		   { border-collapse:collapse; } /* remplace le cellpadding et cellspacing nuls d'une table */
.noindent      { margin-left:0;padding-left:0; }
.nobullet      { list-style:none;list-style-image:none; }
.noDisplay 	   { display:none;visibility:hidden }
.width100 	   { width: 100%; }
.width75 	   { width: 75%; }
.width50 	   { width: 50%; }


/* 4- Fin des classes spécifiques utilisées plusieurs fois **************************************************/ 
/* End of global Classes *****/

