/*------------------------------------------------------------------------
Couleurs:
	entete des menus de navigation (ex: section membre):  #00487D; (vert)  test: bleu(00487D)
	menu niveau 1: #B3AFA0;
	menu niveau 2: #EFEDE8;			(beige pâle)
	menu bande a gauche: #89867A;  	(le plus foncé)
	menu hover : #003D73;			(etait 004400)
	liens : #003D73;

	rouge entete viree 2009 : #B22129;
--------------------------------------------------------------------------*/

/* top elements */
* { padding: 0; margin: 0; }

body {
	margin: 0 auto;
	padding: 0;
	color: #555;
	background: #fff url('../images/decorations/gradient_bg.jpg') repeat-x;
	font-style:normal;
	font-variant:normal;
	font-weight:normal;
	line-height:1.2em;
	font-size:83%;
	font-family:Trebuchet MS, Tahoma, sans-serif;		
}

/*==============================================================*/
/* Layout														*/
/*==============================================================*/

/*------------------------------------------------------------------------------*/ 
/* Ces elements définissent la dimension et l'emplacement de chaque zone dans	*/
/* les pages, soit:																*/						
/*------------------------------------------------------------------------------*/ 
#container {
	width: 840px;
	background-color: transparent;
	margin: 5px auto;		/* marge du haut: 5px, horizontal: centered */
}

#entete {
	height: 130px;
	text-align: left;	
	margin: 0; padding: 0;
	border: 0px;
	position: relative;
	background-color: #B22129;
}

#navig_container {
	float: left;
	text-align: left;	/* mettre 'center' ici si vous voulez centrer le texte dans le menu */
	/*width: 20%;    	   largeur de la section menu par rapport à la largeur de la page */
	width: 168px;
	padding: 0;
	margin: 0;
	margin-top: 5px;					/* marge du haut */
	background-color: #F8F7F3;
	background-color: transparent;		/* pour l'instant */
	/*height: 900px;					temp */
}

#contenu_page {				/* Section regroupant le contenu principal de la page (au centre) */
	float: left;			/* ceci signifie que la section contenu sera placée juste à côté de la section menu */
	text-align: left;	
	padding: 0;
	margin: 0;
	margin-top: 5px;		/* marge du haut */
	/*margin-left: 1%;		   marge de gauche, entre le menu et le contenu */
	margin-left: 8px;		/* marge de gauche, entre le menu et le contenu */
	/* width: 79%;    		   100% - (20% menu + 1% marge) */
	width: 664px;    		/* 840px - (168px menu + 8px marge) */
	background: #fff;
	background-color: transparent;
	/*border: 1px dotted #424242;*/
	line-height:1.2em;
	font-size:95%;
}

#contenu_page_wide {		/* Container pour les pages pleine largeur (ex: accueil) */
	text-align: center;	
	padding: 0;
	margin: 0;
	margin-top: 5px;		/* marge du haut */
	width: 100%;    		/* 100% */
	background: #fff;
	background-color: transparent;
	/*border: 1px dotted #424242;*/
	line-height:1.2em;
	font-size:95%;
}

#contenu_box {				/* Section interieure a 'contenu_page', definit seulement la couleur de fond */
							/* ceci permet aux coins arrondis de faire voir la couleur du background de la page web */
	background-color: #fff;
	border: 1px dotted #aaa;
	border-top: 0px;
	margin-top: 0px;
	padding: 5px;
	padding-bottom: 10px;
}

#sidebar_container			/* Barre a droite pour les messages que l'on met en évidence */
{
	float: right;
	width: 17%;
	padding: 0;
	margin: 0;
	margin-top: 5px;		/* marge du haut */
	margin-left: 10px;		/* marge de gauche, entre le contenu et le sidebar */
}

#sidebar_container div.sidebox
{
	background: #F5F5F5;
	padding: 0;
	margin-bottom: 10px;
	border: 1px dotted #424242;
}

#footer
{
	clear: both;
	margin-top: 5px;
	padding-top: 3px;
	font-size:80%;
	width: 100%;
	color: #fff;
	text-align: center;
	background-color: #B22129;
}

#container_demie_gauche
{
	width: 48%;
	float: left;
	padding-right: 12px;
	text-align: right;
	border-right: 1px solid #333;
}

#container_demie_droite
{
	width: 47.5%;
	float: right;
	padding-left: 4px;
	padding-right: 8px;
	text-align: left;
	/*border-left: 2px solid #000;*/
}


/*------- Header (Logo) ---------------------------------------*/

#entete img.logo {				/* le logo de la viree */
	position: absolute;	
	margin: 0; padding: 0;
	border: 0px;		
	background-color: #B22129;
	
	/* change the values of left and top to adjust the position of the logo */
	top: 0px; left: 10px;
}

#entete img.titre {				/* le titre de la viree */
	position: absolute;	
	margin: 0; padding: 0;
	border: 0px;		
	
	/* change the values of left and top to adjust the position of the logo */
	top: 10px; left: 200px;
}

#entete img.petiteviree {				/* le titre de la viree */
	position: absolute;	
	margin: 0; padding: 0;
	border: 0px;		
	
	/* change the values of left and top to adjust the position of the logo */
	top: 3px; left: 610px;
}

#entete h1#ccrsmb_nom {
	position: absolute;	
	font: bold 30px 'Trebuchet MS', Sans-serif;
	letter-spacing: -1.8px; 
	color: #FFF;
	margin: 0; padding: 0;		
	
	/* change the values of left and top to adjust the position of the logo */
	top: 10px; left: 180px;
}

#entete h1#ccrsmb_nom a {
	text-decoration: none;
	color: #FFF;
}

#entete h1#ccrsmb_30ans {
	position: absolute;	
	font: bold 15px arial, sans-serif;
	letter-spacing: -1.8px; 
	color: #fff;
	margin: 0; padding: 0;		
	
	/* change the values of left and top to adjust the position of the logo */
	top: 107px; left: 50px;
}

#entete #slogan {
	position: absolute;	
	font: bold 12px 'Trebuchet Ms', Sans-serif;
	text-transform: none;
	color: #FFF;	
	margin: 0; padding: 0;
	
	/* change the values of left and top to adjust the position of the slogan */
	top: 47px; left: 100px;
}

/*------- Menu de navigation (a gauche) -----------------------------*/

ul#navig_menu {
	list-style: none;
	margin: 0;
	padding: 0;
	background-color: transparent;
}

ul#navig_menu li a:link, ul#navig_menu li a:visited {
	text-decoration: none;
	display: block;
	/*width: 88%;*/
	padding-top: 4px;
	padding-bottom: 4px;
	padding-left: 6px;
	background-color: #B3AFA0;
	font: 0.9em arial, sans-serif;
	color: #000;
	
	border-top: 1px solid #fff;
	border-bottom: 1px solid #747065;
	border-right: 1px solid #747065;
	border-left: 7px solid #89867A;

}

ul#navig_menu li a:hover {
	background-color: #B22129;
	color: #fff;
}


div.navig_menu_header
{
	color: #fff;
	background-color: #B22129;
	font: bold 1.3em arial, sans-serif;
	padding-top: 10px;
	padding-left: 4px;
}

div.navig_menu_footer
{
	color: #fff;
	background-color: #B22129;
	font: bold 0.9em arial, sans-serif;
	padding-top: 2px;
}

#navig_container img.logo
{
	margin-top: 5px;
	margin-bottom: 5px;
	padding-bottom: 10px;
	border: 0px;
	border-bottom: 1px dotted #777;
}



/*------- Menu de navigation niveau 2 (sous-menu) -----------------------------*/


ul#navig_menu ul.subnav {
	list-style: none;
	margin: 0;
	padding: 0;
	margin-left: 0px;
	text-align: left;
	background-color: #EFEDE8;
}

ul#navig_menu ul.subnav li a:link, ul#navig_menu  ul.subnav li a:visited {
	text-decoration: none;
	display: block;
	padding-top: 1px;
	padding-bottom: 1px;
	padding-left: 13px;
	font: 0.85em verdena, sans-serif;
	color: #000;
	background-color: transparent;
}

ul#navig_menu  ul.subnav li a:hover {
	background-color: #B22129;
	color: #fff;
}

ul#navig_menu  ul.subnav  li {
	border-top: 0 none;
	border-bottom: 0px solid #747065;
	border-right: 0px solid #747065;
	border-top: 0px solid #fff;
	border-left: 0px solid #8E8E90;
	padding-left: 0.0em;		/* marge a gauche du sous-menu par rapport au menu principal */
}









div.topic_image_header {
	margin: 0px;
	padding: 0px;
	background-color: #fff;
	/*text-align: center;*/
	/*height: 155px;*/
	/*border-bottom: 1px solid #000;*/
}

div.topic_image_header img {
	margin: 0px;
	padding: 0px;
	border: 0px;
	border: 1px solid #000;
}

img.flush {				/* cas spécial en entete - image petite virée */
	margin: 0px;
	padding: 0px;
	border: 0px;
	width: 100%;
	border-top: 1px solid #000;

}





div.contenu_boite
{
	text-align: left;
	width: 96%;
	margin-left: 10px;
	margin-bottom: 10px;
	padding: 5px;
	background-color: #EFEDE8;
	border: 1px dotted #000;
}


div.text_left
{
	float: left;
	display: block;
	margin-top: -10px;
}

div.text_left p
{
	width: 97%;
}

img.photo_left
{
	float: left;
	margin-left: 5px;
	margin-top: 5px;
	padding: 0px;
	border: 1px solid #000;
}

div.text_right
{
	text-align: right;
	float: right;
	display: block;
	margin-top: -10px;
}

div.text_right p
{
	width: 97%;
}

img.photo_right
{
	float: right;
	margin-right: 5px;
	margin-top: 5px;
	padding: 0px;
	border: 1px solid #000;
}


div.member_photo {
	float: left;
	text-align: center;
	padding: 3px;
	padding-bottom: 5px;
	margin: 4px;
	border: 1px solid #000;	
}

div.member_photo img {
	padding: 0; margin: 2px;
	margin-bottom: 5px;
	border: 1px solid #000;	
}

div.photo_group {
	margin-left: 10px;
}

div.photo_group img {
	padding: 0; margin: 0px;
	border: 1px solid #000;	
}


/*==============================================================*/
/* LOOK 														*/
/*==============================================================*/

/* links */
a { background: inherit; color: #003D73; /*#396C09#72A545*/; text-decoration: none; font-weight: bold; }
a:hover { background: inherit; text-decoration: underline; }
a:visited { text-decoration: none; }  /* to avoid dotted borders on visited links in firefox */
a img { border:none; }

a[href ^="#"] {
	text-decoration: none;
	border-bottom: 1px dotted;
	padding-bottom: 0px;
}
a[href ^="#"]:hover {
	text-decoration: none;
	border-bottom: 1px solid;
	padding-bottom: 0px;
}

a[href *="http:/"], a[href *="https:/"] { 
	padding: 5px 20px 5px 0;
	background: transparent url("../images/icones/icon_external.gif") no-repeat center right;
}

/*--------------------- ajout d'icone selon l'extension -------------------------------------------------*/

a[href$='.doc'], a[href$='.rtf'] {
	padding: 5px 20px 5px 0;
	background: transparent url(../images/icones/icon_doc.gif) no-repeat center right;
}

a[href$='.txt'] {
	padding: 5px 20px 5px 0;
	background: transparent url(../images/icones/icon_txt.gif) no-repeat center right;
}

a[href$='.xls'] {
	padding: 5px 20px 5px 0;
	background: transparent url(../images/icones/icon_xls.gif) no-repeat center right;
}
a[href$='.pdf'] { 
	padding: 5px 20px 5px 0;
	background: transparent url(../images/icones/icon_pdf.gif) no-repeat center right;
}


/* making sure images don't get ../images/icons */

.imageLink {
	padding-right: 0px !important;
	background: none !important;
}

/* making sure links in tables don't get ../images/icons */

.tableLink {
	padding-right: 0px !important;
	background: none !important;
}



span.sup {
	/*border: 1px solid #B22129;*/
	vertical-align: baseline;
	font-size: 0.85em;
	position: relative;
	top: -0.4em;
}

span.superscript {
	vertical-align: baseline;
	font-size: 0.85em;
	position: relative;
	top: -0.4em;
}

span.subscript {
	vertical-align: baseline;
	font-size: 0.85em;
	position: relative;
	bottom: -0.2em;
}

span.lgchar {
	font-size: 110%;
}

span.smchar {
	font-size: 90%;
	line-height:1em;
	color: #777;
}

span.num {
	color: #396C09;
	font-weight: bold;
}

.surlignee {
	background-color: #FFEF43;  /* yellow */
}

.encadree {
	padding: 6px;
	border: 1px solid #555;
}

/* headers */
h1, h2, h3, h4 { font: bold 1em 'Trebuchet MS', Tahoma, Sans-serif; letter-spacing: -1px; }
h1 { font-size: 2.0em; /*text-transform: uppercase;*/ }
h2 { font-size: 1.8em; color: #00487D; }
h3 { font-size: 1.5em; }
h4 { font-size: 1.2em; font-style: italic; }

p, h1, h2, h3, h4 {
	margin: 10px 15px;
	margin-left: 10px;
	margin-right: 10px;
}

h1.top_header {
	margin: 0px;
	padding: 5px;
	padding-left: 10px;
	background-color: #B22129;
	color: #fff;		
	/*border: 1px solid #000;*/
}

h3.news {
	margin-bottom: -8px;		/* marge réduite entre le titre et le texte qui suit, pour être + compact */
}

p {
	font-size:100%;
	color: #555;
}

ul, ol {
	margin: 10px 30px;
	padding: 10px 30px;
	padding-right: 2px; 
	margin-right: 20px;
	background-color: transparent;
}

ul p {
	margin: 5px 15px;
}


strong {
	color: #222;
}

img {
	padding: 5px;
	margin: 0px;
	border: 1px solid #333;
}

img.carte {
	padding: 0px;
	border: 1px solid #333;
}

img.plain {
	padding: 0px;
	margin-bottom: 5px;
	border: 0px;
}

div.image_legende_left {
	float: left;
	margin-left: 10px;
	padding: 0px;
	text-align: center;	
}

div.image_legende_left img {
	border: 1px solid #000;
	margin-bottom: 5px;
}

p.faq_question {
	font-weight: bold;
}

p.faq_reponse {
	margin-top: -5px;
	margin-left: 20px;
	margin-bottom: 20px;
}

/*------- Very basic CSS-only rounded corners -------------------------------------------*/
.b1f, .b2f, .b3f, .b4f{
	font-size:1px; 
	overflow:hidden; 
	display:block; 
	background:#B22129;
}
.b1f {height:1px; margin:0 5px;}
.b2f {height:1px; margin:0 3px;}
.b3f {height:1px; margin:0 2px;}
.b4f {height:2px; margin:0 1px;}

.b1rc, .b2rc, .b3rc, .b4rc{
	font-size:1px; 
	overflow:hidden; 
	display:block; 
	background:#B22129;
}
.b1rc {height:1px; margin-right: 5px;}
.b2rc {height:1px; margin-right: 3px;}
.b3rc {height:1px; margin-right: 2px;}
.b4rc {height:2px; margin-right: 1px;}

/*------- Tables -------------------------------------------*/

table.hidden {
	border: 0px;
}

table.hidden td {
	padding-right: 5px;
	/*border: 1px solid #000;*/
}

table.hidden td.name {
	text-align: right;
	font-weight: bold;
}

table.foulee_honneur {
	margin: 5px;
	margin-left: 20%;
}


table.foulee_honneur th {
	padding-right: 5px;
	margin-right: 10px;
}

table.foulee_honneur td {
	padding: 0px;
	padding-left: 8px;
}




table.std {
	border-collapse: collapse; 
	margin: 0 5px;
	font-size: 90%;
	color: #222;
	border: 2px solid #333;
	/*width: 95%;*/
}

table.std td {
	margin: 2px 2px;
	padding: 1px 4px;
	background-color: #EFEDE8;  /*#F8F8F8;*/
	border: 1px solid #999;
}

table.std tr.row-b td {  /* alternate row color */
	background-color: #DFDDD8; /*#E7E7E7;*/
}

table.std tr.row-b th {  /* alternate row color */
	font-size: 100%;
	background-color: #B3AFA0; /*#E7E7E7;*/
	color: #222;
}

table.std#font-family td.empty {
	background-color: #FFF;
}

table.std tr.row-b td.empty {
	background-color: #FFF;
}

table.std tr.spacer td.empty {
	background-color: #333;
}

table.std td.headcol {
	background-color: #B3AFA0; /*#E7E7E7;*/
}

table.std td.headcol2 { /* alternate row header color */
	background-color: #B3AFA0;  /*#D6D6D6;*/
	color: #222;
}

table.std tr.headcol2 th { /* alternate row header color */
	font-size: 100%;
	background-color: #B3AFA0;  /*#D6D6D6;*/
	color: #222;
}

table.std th {
	font-size: 120%;
	margin: 2px 2px;
	padding: 4px;
	font-weight: bolder;
	color: #fff;
	background-color: #89867A;  /*#00487D;*/
	border: 1px solid #333;
}


table.std th.row-b {
	font-size: 100%;
	color: #333;
	background-color: #B3AFA0;  /*#9ECE7F;*/
}

table.std th.empty {
	background-color: #FFF;
}

/*------------------*/

table.compact {
	border-collapse: collapse; 
	margin: 0 5px;
	font-size: 80%;
	/*width: 95%;*/
}

table.compact td {
	margin: 1px 1px;
	padding: 1px 3px;
	background-color: #F8F8F8;
}

table.compact td.row2 {  /* alternate row color */
	background-color: #E7E7E7;
}

table.compact td.empty {
	background-color: #FFF;
}

table.compact td.headcol {
	background-color: #E7E7E7;
	font-size: 90%;
}

table.compact td.headcol2 { /* alternate row header color */
	background-color: #D6D6D6;
	color: #222;
	font-size: 90%;
}

table.compact th {
	margin: 2px 2px;
	padding: 3px;
	font-size: 90%;
	font-weight: bold;
	color: #fff;
	background-color: #00487D;
}

/*------------------*/

table.ultracompact {
	border-collapse: collapse; 
	margin: 10px 0px;
	font-size: 80%;
	/*width: 95%;*/
}

table.ultracompact td {
	margin: 0px 2px;
	padding: 0px 5px;
	background-color: #F8F8F8;
	border: 1px solid #f00;
}


table.ultracompact td.row2 {  /* alternate row color */
	background-color: #E7E7E7;
}

table.ultracompact td.empty {
	background-color: #FFF;
}

table.ultracompact td.headcol {
	background-color: #E7E7E7;
	font-size: 85%;
}

table.ultracompact td.headcol2 { /* alternate row header color */
	background-color: #D6D6D6;
	color: #222;
	font-size: 85%;
}

table.ultracompact th {
	margin: 5px 0px;
	padding: 5px 20px;
	font-size: 85%;
	font-weight: bold;
	color: #fff;
	background-color: #00487D;
}

/*------- Shadows under images -------------------------------------------*/

/*core drop shadow rules*/
.wrap1, .wrap2, .wrap3 {
	/*display:inline-table;*/
	display: block;
} 
.wrap1 {
	float:left;
	/*border: 1px solid red;*/
	background:url("../images/shadows/v2/shadow.gif") right bottom no-repeat;}
.wrap2 {background:url("../images/shadows/v2/corner_bl.gif") left bottom no-repeat;}
.wrap3 {
	padding:0 8px 8px 0;
	background:url("../images/shadows/v2/corner_tr.gif") right top no-repeat;}
.wrap3 img {
	display:block;
	padding: 0px;			/* augmenter cette valeur pour avoir un contour blanc autour de la photo */
	/*padding-bottom: 16px;	/* padding en bas pour un effet de photo syle 'polaroid' */
	
	border: none;  /* so we get no surrounding hover or visited box */
	border: 2px solid #4E4A40;
	background-color: #fff;
	text-align: center;
	text-decoration: none;

}
div.photo_text_right .wrap1 {	/* pour les blocs de textes avec image à droite */
	float:right;
}
	
#v1w .wrap1 {background:url("../images/shadows/v1w/shadow.gif") right bottom no-repeat;}
#v1w .wrap2 {background:url("../images/shadows/v1w/corner_bl.gif") -4px 100% no-repeat;}
#v1w .wrap3 {
	padding:0 5px 5px 0;
	background:url("../images/shadows/v1w/corner_tr.gif") 100% -3px no-repeat;}



/*------------------*/

.newline_separator {
	margin: 5px 10px;
	clear: both;
}

.separator {
	width: 95%;	
	margin: 0 10px;
	border-bottom: 1px dotted #000000;
}



span.smaller { font-size: 80%; }

/* alignment classes */
.float-left  { float: left; }
.float-right { float: right; }
.align-left  { text-align: left; }
.align-right {	text-align: right; }

/* additional classes */
.clear { clear: both; }
.gray  { color: #BFBFBF; }
.green { color: #00487D; }
.red { color: #EE0000; }