/* 
Titre:	Styles globaux pour l'écran
Auteur:	michel.williams@umontreal.ca
      
Les styles spécifiques à chaque modèle se trouvent dans 
le dossier "modeles".
*/


body { 
	background-color: #000; 
	font-size: 62.5%; 
	}
#coquille { 
	font: 1.2em/1.4 Helvetica, Arial, sans-serif; 
	margin: 0 auto; 
	padding: 0; 
	position: relative; 
	width: 960px; 
	}
#coquille_contenu { 
	background-color: #fff;
	padding: 1.8em 64px; 
	}
#site_info { 
	background-color: #fff; 
	float: left;
	font-size: 0.9em;
	padding: 0.6em 64px;
	width: 832px;
	}
	

		
/* --------------------------------------------------------
   =Menu de gestion 
   -------------------------------------------------------- */
ul#nav_gestion { 
	background: transparent;
	height: 30px; 
	margin: 0; 
	padding: 0; 
	width: 580px; 
	}
ul#nav_gestion li { 
	display: inline; 
	margin: 0; 
	padding: 0; 
	}
ul#nav_gestion li a { 
	display: block; 
	float: left;
	margin: 0; 
	padding: 0.5em; 
	}
ul#nav_gestion li a:link, ul#nav_gestion li a:visited {
	color: #B3B3B3;
	text-decoration: none;
	}
ul#nav_gestion li a:hover, ul#nav_gestion li a:focus {
	color: #fff;
	text-decoration: underline;
	}
ul#nav_gestion li a:active {
	color: #B3B3B3;
	text-decoration: none;
	}
	/* Mettre en évidence le bouton de la section active */
body#gestion li#gestion_gestion a,
body#configuration li#gestion_configuration a,
body#collegues li#gestion_collegues a,
body#groupes li#gestion_groupes a,
body#outils li#gestion_outils a {
	color: #fff;
	font-weight: bold;
	text-decoration: underline;
	}	
	/* Connexion et quitter */
ul#nav_gestion li.connexion a.btn,
ul#nav_gestion li.quitter a.btn {
	color: #fff;
	margin: 0.3em 0;
	padding: 0.2em 0.5em;
	}
ul#nav_gestion li.connexion a.btn:hover,
ul#nav_gestion li.quitter a.btn:hover {
	background-color: #737373;
	background-image: none;
	border-color: #737373;
	text-decoration: none;
	}
	/* Lien Twitter */
ul#nav_gestion li#gestion_twitter a { 
	background: url(../images/icone_twitter.png) no-repeat 50% 50%;
	width: 25px;
	text-indent: -9999px;
	}


/* --------------------------------------------------------
   =Menu du portfolio 
   -------------------------------------------------------- */
div#nav_portfolio {
    background: #000 url(../images/bg_nav_portfolio.png) repeat-x left bottom;
	margin: 0;
	padding: 0;
	width: 960px;
	}
div#nav_portfolio ul {
    background: transparent;
    border-top: 1px solid #000;
    display: block;
    float: left;
    margin: 0;
    padding: 0;
    text-align: justify;
	width: 960px;
	}
div#nav_portfolio ul li { 
	display: inline;
	float: left;
	line-height: 1.8em;
	margin: 0; 
	padding: 0;
	}
div#nav_portfolio ul li a { 
	background: url(../images/bg_nav_portfolio_a.png) no-repeat right 50%;
	color: #fff;
	display: block;
	float: left;
	margin: 0; 
	padding: 5px 10px;
	white-space: nowrap;
	width: 140px;
	}
div#nav_portfolio ul li a:link, div#nav_portfolio ul li a:visited {
	color: #fff;
	text-decoration: none;
	}
div#nav_portfolio ul li a:hover, div#nav_portfolio ul li a:focus {
    background: #fff; /* url(../images/bg_nav_portfolio_hover.png) repeat-x left top */
	color: #000;
	text-decoration: none;
	}
div#nav_portfolio ul li a:active {
	color: #fff;
	text-decoration: none;
	}


/* --------------------------------------------------------
   =Entête 
   -------------------------------------------------------- */
#entete { 
	background: #fff url(../images/header_gestion.jpg) no-repeat left bottom; 
	margin: 0; 
	padding: 0; 
	width: 960px; 
	}
h1 { 
	font-size: 1.8em; 
	margin: 0; 
	padding: 2em 0; 
	text-align: center; 
	}

	
/* --------------------------------------------------------
   =Recherche 
   -------------------------------------------------------- */
	/* Formulaire de recherche par mot-clés dans le(s) portfolio(s) */
#FormRecherche { 
	color: #fff;
	height: 30px; 
	margin: 0; 
	padding: 0; 
	position: absolute; 
	right: 0;
	text-align: right; 
	top: 0; 
	width: 380px; 
	}	
#FormRecherche div#recherche {
	padding: 0.4em 0 0 0; 
	}
#FormRecherche div#recherche input[type=text], 
#FormRecherche div#recherche select {
	border: 1px solid #ddd;
	padding: 0;
	width: 100px; 
	}
#FormRecherche div#recherche label {
	display: inline; 
	}
#FormRecherche div#recherche input[type=submit] {
	margin-left: 2px; 
	}
	/* Résultats de la recherche dans le(s) portfolio(s) */
ol#recherche_resultats {
	border-top: 1px solid #ccc;
	list-style: none;
	margin-bottom: 1.8em;
	}
ol#recherche_resultats li {
	border-bottom: 1px solid #ccc;
	margin: 0;
	padding: 0.6em 0;
	}
ol#recherche_resultats li a {
	display: block;
	font-weight: bold;
	margin-bottom: 0.4em;
	}
ol#recherche_resultats p {
	margin-bottom: 0.4em;
	}
ol#recherche_resultats li p a {
	display: inline; 
	}
	/* Gestion - recherche de collègues */
body#collegues form#ColleguesRechercheForm {
	border: none;
	}
body#collegues div.resultats, div.pagination {
	margin: 1.8em 0;
	text-align: center;
	}
body#collegues div.pagination div.disabled {
	display: inline;
	}

	
/* --------------------------------------------------------
   =Contenu principal 
   -------------------------------------------------------- */
#plan, .section { 
	margin-bottom: 3.6em; 
	} 
.sous_section {
	margin-top: 3.6em;
	}

/* Rétroaction */
#flashMessage, 
#avertissement, 
.acces, 
#authMessage,
.attention { 
	background: #eee url(../images/icone_important.png) no-repeat 10px 10px; 
	border: 1px solid #ddd;  
	margin: 0 0 3.6em 0; 
	padding: 0.9em 10px 0.9em 47px; 
	width: 775px;
	clear: both;
	}
body#accueil #flashMessage, 
body#accueil #avertissement, 
body#accueil .acces, 
body#accueil #authMessage,
body#accueil .attention { width: 708px; }

#flashMessage p, 
#avertissement p, 
.acces p { 
	margin-bottom: 0; 
	}
#flashMessage.erreur, 
#authMessage { 
	background: #F0B4B4 url(../images/icone_erreur_2.png) no-repeat 10px 50%; 
	border-color: #c00; 
	color: #c00; 
	}
#flashMessage.succes { 
	background: #C3E7CE url(../images/icone_succes.png) no-repeat 10px 50%; 
	border-color: #093; 
	color: #093; 
	}

/* Titres*/
h1, h2, h3, h4, h5, h6 { 
	font-weight: bold; 
	}
h2 { 
	font-size: 1.8em; 
	line-height: 1.2;
	margin: 1.8em 0 0.6em 0; 
	}
h3 { 
	font-size: 1.4em; 
	margin-top: 0.4em; 
	}
p { 
	margin-bottom: 1.8em; 
	}
p.type {
	color: green;
	margin-top: 1.8em;
	}
hr { 
	display: none; 
	}
strong {
	font-weight: bold;
	}
em {
	font-style: italic; 
	}
sub {
	font-size: 0.8em;
	vertical-align: sub;
	}
sup {
	font-size: 0.8em;
	vertical-align: super;
	}
code, 
kbd {
	font-family: Monaco, Courier, "Courier New", monospace;
	}
var {
	font-family: Georgia, "Times New Roman", serif;
	}
	
/* Images */
h2 img+span, h2 span+img, h3 img+span, h3 span+img {
	margin-left: 5px; 
	}

/* Listes*/
ul, ol { 
	margin-bottom: 1.8em; 
	}
div.description ul {
	list-style: disc;
	}
div.description ol {
	list-style: decimal;
	}
div.description li {
	margin-left: 3.6em; 
	}
	
/* Liens */
a:link {
	color: #00e; 
	text-decoration: underline;
	} 
a:visited {
	color: #000;
	}
a:hover, a:focus {
	color: #00e;
	text-decoration: none;
	}
a:active {
	color: #00e;
	}
h2 a {
	font-size: 0.8em;
	font-weight: normal;
	}
	

div.contenu {
	width: 832px;
	}
div.contenu img {
	float: left;
	}
div.description {
	float: right;
	width: 832px;
	}
a[class]+div.description {
	width: 692px;
	}
a.icone+div.description {
	width: 764px;
	}
div.gestion+div.description {
	margin-top: 1.8em; 
	}

/* Section : Biographie */
#biographie div.contenu {
	margin-bottom: 1.8em;
	}
#biographie img#portrait+div.description {
	width: 612px;
	}
div.consulter  {
	font-size: 0.9em;
	margin-bottom: 1.8em;
	} 

/* Commentaires (interventions) */
span.interventions {
	display: block;
	}
div.interventions {
		}
div.interventions div.gestion {
	margin-bottom: 0; 
	width: 812px;
	}
div.interventions h5 {
	font-size: 1.4em;
	}
div.interventions ul {
	margin: 0;
	padding: 0;
	width: 832px;
	}
div.interventions li {
	background: url(../images/bg_intervention.png) no-repeat 0 20px;
	margin: 0 0 1.8em 0;
	padding: 0 0 0 20px;
	width: 812px;
	}
div.interventions div.contenu {
 	background: #e4e4e4;
	margin-bottom: 0.6em;
	padding: 20px;
	width: 772px;
	}
#biographie div.interventions div.contenu {
	margin-bottom: 0.6em;
	}
div.interventions div.description {
	width: 772px;
	}
div.interventions a[class]+div.description {
	width: 632px;
	}
div.interventions div.type, 
div.interventions blockquote  {
	margin-bottom: 1.8em;
	} 
div.interventions div.visiteur, 
div.interventions div.consulter  {
	font-size: 0.9em;
	margin-bottom: 1.8em;
	} 
div.interventions div.visiteur {
	color: #646464;
	margin-bottom: 0;
	text-align: right; 
	}
div.interventions div.type {
	color: green;
	}
	
/* Plan du portfolio */
#plan ul {
	margin: 0;
	padding:0;
	}
#plan li {
	margin: 0 0 0.2em 0;
	padding: 0;
	}
#plan ul ul li {
	background: url(../images/puce_plan_soussection.png) no-repeat 0 3px;
	margin-left: 3em;
	padding: 0 0 0 15px;
	}
	
/* Sections et sous-sections */
.section a.afficher, .sousSection a.afficher,
.section a.masquer, .sousSection a.masquer {
	font-size: 0.8em;
	font-weight: normal;
	}
	
/* Documents */
.document {
	margin-bottom: 1.8em; 
	}

p.protection_niveau {
	background: url(../images/icone_protection.png) no-repeat 0 0;
	color: red;
	padding: 3px 0 3px 26px;
	}

/* --------------------------------------------------------
   =Site info 
   -------------------------------------------------------- */
#copyright, ul#rss, div#edu {
	float: left;
	}
#copyright p {
	margin-bottom: 0.6em; 
	}
#copyright, ul#rss {
	float: left;
	padding-right: 20px;
	width: 352px;
	}
ul#rss li {
	background: url(../images/rss_16.png) no-repeat 0 0;
	margin: 0 0 0.2em 0;
	padding: 1px 0 1px 20px;
	}
ul#rss li a {
	color: #000;
	text-decoration: none;
	}
ul#rss li.info {
	background: url(../images/rss_info_16.png) no-repeat 0 0; 
	}
div#edu {
	float: left;
	padding: 0;
	}
div#edu a {
	background: url(../images/icone_eduportfolio.png) no-repeat 0 0;
	display: block;
	height: 48px;
	text-indent: -9999px;
	width: 88px;
	}
	
	
	
/* --------------------------------------------------------
   =Gestion 
   -------------------------------------------------------- */
div.gestion,
div.modifier {
	display: block;
	padding: 5px 0;
	width: 832px;
	}
div.gestion+div.gestion, 
div.modifier+div.modifier {
	margin-top: 5px; 
	}
h3+div.gestion, 
h4+div.gestion {
	margin: 0.6em 0 1.8em 0;
	}
img.captcha {
	border: none;
	display: block;
	}
/* Rubrique d'info */
div.info_notes {
	background-color: #eee;
	border: 1px solid #ddd;
	height: auto;
	margin-bottom: 1.8em;
	padding: 10px;
	width: 812px;
	}
div.info_notes h4 {
	background: url(../images/icone_info_2.png) no-repeat 0 0;
	border-bottom: 1px solid #ddd;
	font-weight: bold;
	margin-bottom: 0.6em;
	padding: 5px 0 5px 26px;
	}



/* Liens */
#plan, h2 span {
	position: relative;
	}
#plan span a, div.section h2 span a {
	text-decoration: none;
	}
div.section h2 span span {
	font-size: 0.66em;
	font-weight: normal;
	}
a.btn {
	border: 1px solid #646464;
	color: #fff;
	padding: 5px;
	text-decoration: none;
	}
a.btn:link, a.btn:visited {
	background: #646464 url(../images/bg_bouton.png) no-repeat 0 50%;
	}
a.btn:hover {
	background-color: #313131;
	background-image: none;
	border-color: #313131;
	}
a.btn:active {
	background: #646464 url(../images/bg_bouton.png) no-repeat 0 50%;
	}
span.interventions {
	text-align: right; 
	}
span.interventions a {
	background: url(../images/icone_commentaire.png) no-repeat right top;
	padding: 3px 26px 3px 0;
	}

/* Tables */
table {
	background-color: #E6E6E6;
	border-right: 1px solid #A6A6A6;
	border-top: 1px solid #A6A6A6;
	margin: 1.8em 0;
	width: 100%; 
	}
tr:hover {
	background-color: #fbfbfb;
	}
table th, 
table td {
	border-bottom: 1px solid #A6A6A6;
	border-left: 1px solid #A6A6A6;
	overflow: hidden;
	padding: 5px;
	text-align: left;
	vertical-align: text-top;
	}
th {
	background-color: #BFBFBF;
	font-weight: bold;
	}
td.submit {	
	text-align: center;
	}
table.cols4 th, 
table.cols4 td {
	width: 25%;
	}
	/* Confirmation de l'ajout/refus à un groupe */
table.groupes_confirmer {
	background: transparent;
	border: none;
	}
table.groupes_confirmer th,
table.groupes_confirmer td {
	background: transparent;
	border: none;
	padding: 10px 5px;
	}
table.groupes_confirmer tr:hover {
	background-color: transparent;
	}

	/* Liste des documents */
body#outils table th, 
body#outils table td {
	width: 17%;
	}
body#outils table th { 
	background-color: #BFBFBF;
	}
body#outils table th a {
	color: #000;
	text-decoration: none;
	}
body#outils table th.description, 
body#outils table td.description {
	width: 32%;
	}


/* Formulaires */
form {
	margin-bottom: 1.8em;
	padding: 0;
	width: 832px;
	}
form fieldset {
	border: 1px solid #000;
	border-bottom: none;
	padding: 10px;
	position: relative;
	width: 540px;
	}
form fieldset.submit {
	border: 1px solid #000; 
	border-top: none;
	margin-top: -1.8em; 
	text-align: center; 
	}
form fieldset.nosubmit {
	border-bottom: 1px solid #000;
	}
form fieldset.noborder,
form fieldset.submit.noborder {
	border: none;
	}
form h5 {
	margin: 1.8em 0 0.6em 0;
	}
form legend {
	font-size: 1.4em;
	font-weight: bold;
	margin: 0;
	padding: 1px;
	}
form fieldset > div {
	margin-bottom: 1.8em;
	}
form fieldset.submit > div {
	padding-bottom: 0;
	}
form textarea {
	overflow: auto;
	}
form label {
	display: block;
	margin-bottom: 5px;
	padding: 0;
	}
form label.info {
	background: url(../images/icone_info_sm.png) no-repeat 0 100%;
	padding-right: 20px;
	}
form label:after {
	content: ' :';
	}
form div.inline label { 
	display: inline; 
	}
form .requis {
	color: red;
	font-weight: bold;
	}
form .requis label:before {
	content: '* ';
	}
form input[type=checkbox]+label, 
form input[type=radio]+label { 
	display: inline;
	margin-left: 2px; 
	}
form input[type=checkbox]+label:after,
form input[type=radio]+label:after { 
	content: ''; 
	}
form textarea, 
form input[type=text], 
form input[type=file],
form input[type=password] {
	border: 1px solid #ccc;
	margin: 0;
	padding: 4px;
	width: 530px;
	}
form select:focus, 
form textarea:focus, 
form input[type=text]:focus,
form input[type=file]:focus,
form input[type=password]:focus {
	border-color: #838383;
	}
form input[type=checkbox],
form input[type=radio] {
	background-color: transparent;
	border-width: 0;
	display: inline;
	height: auto;
	margin: 0;
	padding: 0;
	vertical-align: middle;
	width: auto;
	}
form input[type=submit] {
	background: #646464 url(../images/bg_bouton.png) no-repeat 0 50%;
	border: 1px solid #646464;
	color: #fff;
	padding: 2px;
	}
form select {
	border: 1px solid #ccc;
	margin: 0;
	padding: 0;
	width: 538px;
	}
form div p {
	margin: 1.8em 0; 
	padding: 0;
	}
	/* Formulaire de recherche générale */
form#FormRecherche label:after {
	content: '';
	}
	/* Configuration */
form#PortfolioConfigForm select {
	width: 200px;
	}
body#configuration div.gestion {
	text-align: left;
	}
form.groupes label {	
	float: left;
	}
form.groupes label:after {
	content: '';
	}
form.groupes span {	
	float: right;
	}
	/* Formulaire d'accès au contenu protégé */
form#FormInviteCode {
	margin: 0;
	padding: 0;
	width: 830px;
	}
form div.acces input[type=password] {
	width: 100px;
	}
	/* Rubrique d'info pour formulaires */
form div.info_notes {
	position: absolute;
	right: -270px;
	top: 0;
	width: 228px;
	}
form div.info_notes p {
	font-size: 0.9em;
	line-height: 1.2;
	}
	/* Code d'accès propre à une section */
form div.protection_type, 
form div.protection_type > div,
form div.protection_type div.code_acces_section {
	margin: 0.6em 0 0 1em;
	 }
form div.protection_type div.code_acces_section input {
	margin-bottom: 0.6em;
	width: 460px;
	}
form div.mdp_section {
	background: url(../images/icone_protection.png) no-repeat 0 50%;
	padding: 3px 0 3px 26px;
	}
form div.mdp_section input[type=password] {
	width: 100px; 
	}
	/* Gestion des groupes */
form fieldset.membres, 
form fieldset.membres+fieldset, 
form#formAjouterUsagers fieldset,
form#formAjouterGestionnaires fieldset {
	border: none;
	width: 792px;
	}
form#formAjouterUsagers fieldset#ajouterUsagers, 
form#formAjouterUsagersLot fieldset#ajouterUsagersLot,
form#formAjouterGestionnaires fieldset#ajouterGestionnaires {
	border: 1px solid #000;
	width: 540px;
	}
table td textarea, 
table td input[type=text], 
table td input[type=file],
table td input[type=password] {
	width: auto;
	}
div#panneauAjouterUsagersLot div.info_notes {
	top: 1.8em;
	}

/* Fin formulaires */
	
/* Section : Collègues */
body#collegues h2 {
	margin-top: 1.8em; 
	}
body#collegues div#coquille_contenu ol {
	list-style: decimal;
	}
body#collegues div#coquille_contenu ol li {
	margin-left: 3.6em;
	}
ul#collegues-menu {
	margin-bottom: 3.6em;
	}
ul#collegues-menu li {
	display: inline;
	}
div.resultats, 
div.pagination {
	width: 832px;
	}
div.collegues_liste {
	border-top: 1px solid #ccc;
	width: 832px;
	}
div.collegues_liste div.row {
	border-bottom: 1px solid #ccc;
	display: block;
	float: left;
	margin: 0;
	padding: 1.8em 0;
	width: 832px;
	}
div.collegues_liste div.item {
	float: left;
	margin-right: 60px;
	width: 356px;
	}
div.collegues_liste div.image {
	float: left;
	width: 60px; 
	}	
div.collegues_liste div.image img {
	width: 60px; 
	}	
div.collegues_liste div.info, 
div.collegues_liste div.actions {
	margin: 0 0 0 80px;
	width: 276px; 
	}
div.collegues_liste div.info { 
	font-size: 0.8333em;
	font-weight: bold;
	}
div.collegues_liste div.actions {
	color: red; 
	}
div.collegues_liste div.info a { 
	color: #000;
	text-decoration: none;
	}
div.collegues_liste div.item a.ajouter {
	background: url(../images/icone_ajouter.png) no-repeat 0 50%;
	padding: 4px 0 4px 20px;
	}
div.collegues_liste div.item a.supprimer {
	background: url(../images/icone_supprimer.png) no-repeat 0 50%;
	padding: 4px 0 4px 20px;
	}


/* --------------------------------------------------------
   =Login 
   -------------------------------------------------------- */
body {
	background: #000 url(/images/bg_body.gif) repeat 0 0;
	}
body#login #entete {
	background: #fff;
	margin: 0;
	padding: 0;
	}
body#login #entete h1, 
body#login #entete a {
	height: 125px;
	margin: 0;
	padding: 0;
	width: 960px;
	}
body#login #entete a {
	background: url(/images/header.jpg) no-repeat left top;
	display: block;
	}
body#login #entete span {
	display: none;
	}
body#login form#formLangSel {
	float: none;
	}
body#login form#formLangSel label {
	display: inline;
	margin-right: 5px;
	}
body#login form#formLangSel select {
	width: 100px;
	}
body#login div#site_info {
	background-color: #fff;
	text-align: center;
	}
body#login div#site_info a {
	color: #000;
	text-decoration: none;
	}
	

	

/* --------------------------------------------------------
   =Self clearing floats
   -------------------------------------------------------- */
.clearfix:after { 
	clear: both; 
	content: "."; 
	display: block; 
	height: 0; 
	visibility: hidden; 
	}