/************************************ RÉFÉRENCE PALETTE ************************************

 < - KOPIN 3 - >

	Bleu pâle : #E9F0F0 
	Bleu intermédiaire : #5D6880
	Bleu foncé : #35425D
	Gris rougi : #D4CACC
	Déconnexion : #603541 
	
*********************************************************************************************/


/* ===================================================== Générales ====================================================== */

/* Polices de base pour assurer la cohérence du design dans les principaux fureteurs */
TABLE, TD, INPUT, TEXTAREA
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
}

body
{
	background-color: #fbfbfb;
}

BODY
{
	background-color: #fbfbfb;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #666666;
	margin: 0px;
	text-decoration: none;
	text-align: center;
}

P 
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #666666;
}

.wrapper
{
	background-image: url(images/bg_body.gif);
	background-repeat: repeat-y;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
	width: 801px;
}

INPUT, TEXTAREA, SELECT
{
	font-size: 11px;
	padding-left: 3px;
	padding-right: 3px;
}

a:link 
{
	/*color: #E7241A;*/
	color: #0000fe;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;	
	/*text-decoration: underline;*/
	text-decoration: none;
}

a:visited 
{
	/*color: #E7241A;*/
	color: #0000fe;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;	
	/*text-decoration: underline;*/
	text-decoration: none;
}

a:hover 
{
	/*color: #E7241A;*/
	color: #0000fe;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;	
	text-decoration: underline;
}

a:active 
{
	/*color: #E7241A;*/
	color: #0000fe;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;	
	text-decoration: underline;
}

H2
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	text-transform: none;
	text-decoration: none;
	color: #666666;
}

TD.pageTitle 
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	text-transform: none;
	text-decoration: none;
	color: #666666;
}

H5
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	text-transform: none;
	text-decoration: none;
	color: #E6241A;
}

H3 
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	text-transform: none;
	color: #E6241A;
	text-decoration: none;
}

H4 
{
	font-family: Verdana, Arial, Helvetica, Sans-Serif;
	font-size: 11px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	text-transform: none;
	color: #666666;
	text-decoration: none;
}

.regular 
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #666666;
	text-decoration: none;
}

.redText 
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	text-transform: none;
	color: #E6241A;
	text-decoration: none;	
}

/*
A, A:visited
{
	color: #35425D;
}

A:hover
{
	color: #5D6880;
}
*/

/* ===================================================== Titres ====================================================== */

.title
{
	font-size: 11px;
	font-weight: bold;
	color: #35425D;
	padding-left: 3px;
	padding-bottom: 2px;
	padding-top: 2px;
	color: #ffffff;
	background-color: #35425D;
}

.subTitle
{
	font-size: 12px;
	color: #35425D;
	padding-left: 2px;
	color: #ffffff;
	background-color: #5D6880;
}


/* ===================================================== Tableaux ====================================================== */
/* Dans le gestionnaire, utilisée pour le tableau contenant le logo de Kopin 3 */
TABLE.HeaderKopin
{
	background-color: #5D6880;
	padding: 1px;
	margin: 0px;
	background-image: url(images/logoKopin.gif);
	background-position: right bottom;
	background-repeat: no-repeat;
}

/* Dans le gestionnaire, utilisée pour le tableau contenant les informations : logo compagnie, nom utilisateur, statistiques particulières */
TABLE.HeaderInformation
{
	background-color: #E9F0F0;
	padding: 1px;
	margin: 0px;
}

/* Dans le gsetionnaire, utilisée pour le tableau englobant le logo Kopin 3 et les informations utilisateur */
TABLE.Header
{
	text-align: center;
}

/* Dans le gestionnaire, utilisée pour la bordure de la page Web entière */
TABLE.TemplateBorder
{
	/*border: solid 3px #35425D;*/
}


/* ===================================================== Cellules ====================================================== */

/* Dans le gestionnaire, utilisée pour les titres de sections des composantes sur le page présentation */
TD.ListTitle
{
	font-family: Arial;
	font-size: 12px;
	font-variant: small-caps;
	border-bottom: solid 2px #35425D;
	border-collapse: separate;
	padding-bottom: 2px;
	padding-top: 10px;
	padding-left: 5px;
}

/* Dans le gestionnaire, utilisée pour les titres du module lancé par les exceptions */
TD.ExceptionTitle
{
	font-family: Arial;
	font-size: 12px;
	font-variant: small-caps;
	border-bottom: solid 2px #35425D;
	border-collapse: separate;
	padding-bottom: 2px;
	padding-top: 10px;
	padding-left: 5px;
	color: #FF0801;
	font-weight: bold;
}

/* Dans le gestionnaire, utilisée pour les titres de sections des composantes sur les pages de la composante */
TD.SublistTitle
{
	font-variant: small-caps;
	font-size: 12px;
	background-color: #E9F0F0;
	padding-top: 1px;
	padding-bottom: 1px;
	padding-left: 5px;
	border-top: solid 1px #D4CACC;
	border-bottom: solid 1px #D4CACC;
}

/* Dans le gestionnaire, utilisée pour les items énumérés dans les sections de composantes */
TD.ListItem, TD.List, TD.LightBorderBottom
{
	text-align: left;
	padding-left: 20px;
	padding-top: 3px;
	padding-bottom: 3px;
}

/* Dans le gestionnaire, utilisée pour assurer l'espacement de la liste par rapport au reste du contenu */
TD.List
{
	padding-top: 7px;
	padding-bottom: 7px;
}

/* Dans le gestionnaire, utilisée pour les champs qui affichent du texte */
TD.ListText
{
	text-align: left;
}

/* Dans le gestionnaire, utilisée pour assure la séparation entre l'éditeur de texte et les options suivantes */
TD.LightBorderBottom
{
	border-bottom: inset 2px #D4CACC;
	padding-bottom: 10px;
}

/* Dans le gestionnaire, utilisée pour les descriptions dans les sections de composantes */
TD.ListDescription
{
	padding-left: 10px;
	vertical-align: baseline;
}

/* Dans le gestionnaire, utilisée pour les liens (modifier, supprimer) pour chaque item des sections de composantes */
/* Dans le gestionnaire, utilisée pour les champs qui affichent les dates */
TD.ListLink, TD.ListDate
{
	text-align: center;
	padding-top: 3px;
	padding-bottom: 3px;
}

/*	Dans le gestionnaire, utilisée pour les cellules qui constituent l'en-tête d'un tableau */
TD.Header, TD.HeaderCentered
{	
	background-color: #5D6880;
	color: #ffffff;
	font-weight: bold;
	padding-left: 3px;
	vertical-align: middle;
}

TD.HeaderCentered
{	
	background-color: #5D6880;
	color: #ffffff;
	font-weight: bold;
	padding-left: 3px;
	vertical-align: middle;
}


/* Dans le gestionanire, utilisée pour les cellules qui contiennent les boutons Enregistrer, Annuler, etc */
TD.Button
{
	padding-top: 10px;
	text-align: right;
	border-bottom: solid 1px #35425D;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 5px;
}

/* Dans le gestionnaire, balise générale pour la description d'une composante sur la page d'accueil */
TD.ComponentDescription, TD.ResumeDescription
{
	font-size: 12px;
	padding-left: 10px;
}

/* Dans le gestionnaire, description de la description d'une composante sur la page d'accueil */
TD.ComponentDescription
{
	height: 100px;
	vertical-align: top;
	padding-top: 5px;
	padding-right: 80px;
	background-image: url(images/logoGestionNouvelles.gif);
	background-position: right bottom;
	background-repeat: no-repeat;
}

/* Dans le gestionnaire, description du résumé d'une composante */
TD.ResumeDescription
{
	vertical-align: top;
	padding-top: 5px;
}

/* Dans le gestionnaire, pour une composante, petit onglet à gauche qui est bleu */
TD.BlueBackground
{
	background-image: url(images/onglet.gif);
	background-repeat: repeat-y;
	width: 8px;
}

/* Dans le gestionnaire, cellule contenant l'image "+" entre la description et résumé */
TD.PositioningImagePlus
{
	vertical-align: top;
	text-align: center;
	/*padding-top: 24px; --> Le padding ne fonctionne pas sur la cellule contenant l'image; a été ajouté directement dans le code*/
}

/* Dans le gestionnaire, cellule contenant l'image "•" à la gauche du résumé */
TD.PositionningImageDot
{
	vertical-align: top;
	text-align: center;
	/*padding-top: 25px; --> Le padding ne fonctionne pas sur la cellule contenant l'image; a été ajouté directement dans le code*/
}

 /* Dans le gestionnaire, cellule contenant "Bonjour M/Mme Utilisateur" */
TD.UserName
{
	font-size: 13px;
	font-variant: small-caps;
	color: #354260;
	padding-top: 6px;
	padding-left: 85px;
	padding-bottom: 5px;
}

/* Dans le gestionnaire, cellule contenant l'image du logo de la compagnie cliente */
TD.CompanyLogo
{
	vertical-align: middle;
	text-align: center;
}

/* Dans le gestionnaire, cellule contenant le lien de déconnexion */
TD.Deconnection
{
	font-family: Arial;
	font-size: 10px;
	font-style: italic;
	color: #603541;
	padding-top: 5px;
	padding-left: 5px;
	vertical-align: top;
}

/* Dans le gestionnaire, cellule contenant les informations, p.e. messages, événements, etc */
TD.HeaderText
{
	font-family: Arial;
	font-size: 10px;
	color: #495570;
	padding-bottom: 3px;
	padding-right: 3px;
	text-align: right;
	vertical-align: bottom;
}

/* ================================================ Personnalisées  ===============================================  */

/* Dans le gestionnaire, utilisée pour les textbox, pour ne pas généraliser le style sur toutes les balises input */
.Textbox
{
	border-top: solid 1px #35425D;
	border-left: solid 1px #35425D;
	border-bottom: solid 2px #E9F0F0;
	border-right: solid 2x #E9F0F0;
}

/* Dans le gestionnaire, utilisée pour les validateurs */
.Validator
{
	color: #900000;
}

/* Dans le gestionnaire, classe pour les bordures */
.DarkBlueBordersUp
{
	border-top: solid 1px #35425D;
	padding: 10px;
}

/* Dans le gestionnaire, classe pour les bordures */
.DarkBlueBordersDown
{
	border-bottom: solid 1px #35425D;
	padding: 10px;
}



/* ================================================ Côté public  ===============================================  */
/* Ces styles sont temporaires; ils devront être ajustés en fonction de la maquette qui est intégrée du côté public */

/* Permet d'afficher les composantes en haut des colonnes */
.ComponentColumn
{
	vertical-align: top;
}

TD.NewsTitle, TD.NewsDate, TD.NewsSummary, TD.Image, TD.Content
{
	/*padding-left: 10px;*/
}

TD.Content
{
	padding-left: 10px;
}

TD.NewsTitle
{
	border-bottom: dashed 1px #D4CACC;
	padding-top: 7px;
}

/* CSS of the newsResume component */
TD.NewsResumeTitle
{
	padding-top:4px;
	padding-bottom:2px;
	padding-left:13px;
	
	font-family: tahoma,Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	text-transform: none;
	text-decoration: none;
	color: #F9F8F8;
	background-color: #35425D;
}

TD.NewsResumeContent
{
	padding-top: 4px;
	padding-bottom: 2px;
	padding-left: 13px;
	
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	text-decoration: none;
	color: #666666;
}
/* End of the newsResume component */

TD.Image
{
	text-align: center;
	padding-left: 10px;
	vertical-align: middle;
}

.Thumbnail
{
	padding: 10px;
	border: 3px;
	border-color: #D4CACC;
}

TD.NewsButton
{
	text-align: right;
	padding-top: 10px;
	padding-bottom: 3px;
	padding-right: 3px;
	border-bottom: dashed 1px #D4CACC;
}

TD.Content
{
	padding-left: 10px;
}

TD.Presentation
 {
	padding: 5px;
 }
 
 .SearchHighlight
 {
	padding-left: 5px;
	padding-right: 5px;
	font-weight: bold;
	background-color: #E9F0F0;
 }
 
 A.IconLink, A.IconLink:visited
 {
	color: #35425D;
 }
 
 A.SelectedIconLink, A.SelectedIconLink:visited
 {
	color: #FFFFFF;
	background-color: #5D6880;
 }

 TD.MenuSectionItem
 {
	font-family: Verdana;
	font-weight: bold;
	font-size: 12pt;
	color: #E7241A;
 }
 
 TD.MenuSubItem
 {
	padding-left: 14px;
 }
 
 TD.LinkTitle
 {
	color: #0000FF;
	font-weight: bold;
 }
 
 TD.LinkDescription
 {
	text-align: justify;
	padding-left: 20px;
	padding-right: 25px;
 }
 
 TD.LinkLink
 {
	text-align: right;
 }
 
 TD.LinkLanguage
 {
	padding-left: 10px;
	font-size: 10px;
 }
 
 /* CSS of the search panels form elements */
INPUT.txtResearchGaiEcoute
{
	border-style: solid;
	border-width: 1px;
	border-color: #000000;
	
	vertical-align: middle;
}

INPUT.btnResearchGaiEcoute
{
	width: 80px;
	border-style: solid;
	border-width: 1px;
	border-color: #1A3200;
	background-color: #9BB482;
	
	vertical-align: middle;
	
	margin-left: 4px;
}

INPUT.txtResearchHomophobie
{
	border-style: solid;
	border-width: 1px;
	border-color: #000000;
	
	vertical-align: middle;
}

INPUT.btnResearchHomophobie
{
	width: 80px;
	border-style: solid;
	border-width: 1px;
	border-color: #580A06;
	background-color: #F5AAA5;
	
	vertical-align: middle;
	
	margin-left: 4px;
}

INPUT.txtResearchHomophobia
{
	border-style: solid;
	border-width: 1px;
	border-color: #000000;
	
	vertical-align: middle;
}

INPUT.btnResearchHomophobia
{
	width: 80px;
	border-style: solid;
	border-width: 1px;
	border-color: #580A06;
	background-color: #F5AAA5;
	
	vertical-align: middle;
	
	margin-left: 4px;
}

INPUT.txtResearchFondation 
{
	border-style: solid;
	border-width: 1px;
	border-color: #000000;
	vertical-align: middle;
}

INPUT.btnResearchFondation 
{
	width: 80px;
	border-style: solid;
	border-width: 1px;
	border-color: #000000;
	background-color: #FFA584;
	
	vertical-align: middle;
	
	margin-left: 4px;
}