/* @override 
	reset.css
	--
	http://0.0.0.0:4000/css/reset.css
*/

/**
 * meyer's RESET 
 * ===========================================================================
 * http://meyerweb.com/eric/tools/css/reset/index.html 
 *
 * v1.0 | 20080212
 */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus { outline: 0; }

/* remember to highlight inserts somehow! */
ins { text-decoration: none; }
del { text-decoration: line-through; }

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/**
 * SD additionnal resets
 */
a img { border: none; }
address { font-style: normal;}
/* @override 
	layout.css
	--
	http://0.0.0.0:4000/css/layout.css
*/

/**
 * LAYOUT
 * ===========================================================================
 *
 * == STRUCTURE: =============================================================
 *  * Page width:            950 px
 *  * Number of columns:     24
 *  * Column width:          30 px
 *  * Margin gutter width:   10 px
 *  * Line height:           17 px
 * ===========================================================================
 * 
 * By default, the grid is 950px wide, with 24 columns 
 * spanning 30px, and a 10px margin between columns.
 *
 */

html {
	background:#49433E url('img/bg_html.png') repeat-x top left;
	
	}
	body {
		width: 950px; /* page width */
		margin:0 auto;
		background:transparent url('img/bg_body.png') repeat-y top left;
		
		}
		a {
			text-decoration: none;
			font-style: normal;
			}
		a:hover, a:active {
			text-decoration: underline;
			}
		#access-nav {
			position: absolute;
			margin-left: -9999px;
			}
		#header {
			background:transparent url(img/bg_header-bg_content.png?20090204) no-repeat  0 0;
			width: 950px;
			height: 210px;
			position: relative;
			}
			#logo {
				position: relative;
				width: 173px;
				height: 210px;
				left: -2px;
				/*background:transparent url(img/logo.png) no-repeat  top left;*/
                                overflow: hidden;
				}
			body #banner {
				position:absolute;
				top: 105px;
				left: 171px;
				height: 105px;
				width: 627px;
				overflow:hidden;
				}	
		#nav {
			background:transparent url(img/bg_nav-bg_aside.png) no-repeat 0 0;
			float: left;
			width: 206px;
			}
			#nav h3 {
				position: absolute;
				margin-left: -9999px;
				}
			#nav ul {
				background:transparent url(img/bg_nav_ul.png) repeat bottom left;
				overflow: hidden;
				}
		#content {
			background:transparent url(img/bg_header-bg_content.png?20090204) no-repeat -952px 0px;
			min-height: 591px;
			position: relative;
			margin-left: 206px;
			padding-top: 37px;
			margin-bottom: 4em;
			}
			#main {
				width: 400px;
				margin-left: 45px;
				}
			/*body.accueil #main {
				margin-left: 28px;
				}*/
			body.accueil #main {
				margin-left: 28px;
				float: left;
				margin-right: 36px;
                                padding-bottom: 2em;
				}
			#aside {
				position: absolute;
				right: 46px;
				top: 20px;
				width: 196px;
				}
			body.accueil #aside {
				position: static;
				width: 225px;
				overflow: hidden;
				}
		#footer {
                        clear: both;
			background-color: #49433E;
			height: 100px;
			color: #808080;
			line-height:3em;
			}
			#footer a {
				color: #ABB7BA;
				}
		.hidden {
			display: none;
			}
			
/* @override typography.css -- http://0.0.0.0:4000/css/typography.css */
/**
 * TYPOGRAPHY
 * ===========================================================================
 * 
 * This stylesheets contains main typographic styles.
 * More specific ones are described in screen.css
 * 
 * Base font size is set to 12 px (0.75 * 16px = 12px)
 * 
 * == FONT SIZE conversion table: ============================================
 *  *  9 px  <->  75%
 *  * 10 px  <->  83,34%
 *  * 11 px  <->  91.67%   
 *  * 12 px  <->  100%     # Base font
 *  * 13 px  <->  108.34%  
 *  * 14 px  <->  116.67%  
 *  * 18 px  <->  150%
 *  * 20 px  <->  166.67%  
 *  * 21 px  <->  175%     
 *  * 22 px  <->  183.34%  
 *  * 28 px  <->  233.34%  
 * ===========================================================================
 *
 * == COLORS: ================================================================
 *
 *
 * ===========================================================================
 *
 */

/* 
 * Default font settings. 
 */
body  { 
  font: 75%/1.5 Verdana, Helvetica, Arial, sans-serif;
	}
	#nav-tools li a {
		font-family: Verdana, Helvetica, Arial, sans-serif;
		font-size: 100%;
		font-weight: bold;
		line-height: 16px;
		}
	#header h1 {
		font-size: 150%;
		font-family: 'Arial Black', arial, sans-serif;
	}
	#nav li a, #aside ul.pages li a, #nav-sub-pages li a {
		font-family: 'Arial Black', arial, sans-serif;
		font-size: 100%;
		}
	#aside ul.pages li a, #nav-sub-pages li a {
		color: #666666;
		}
	#content {
	
		}	
		#main p, #main li, #main dt, #main dd, #main form * {
			font-size: 108.34%;
			color: #333;
			}
		#main p, 
		#main ul, 
		#main ol, 
		#main dl, 
		#main form, 
		#main h2, 
		#main h3, 
		#main h4,
		#main h5 {
			margin-bottom: 1em;
			}
		#main h2 {
			font-size: 150%;
			line-height: 1.3;
			margin-bottom: 1.3em;
			}
		#main h3 {
			font-size: 116.67%;
			}
		#main h4 {
			font-size: 108.34%;
			}
	#footer {
		
		font-size: 75%;
		text-align: center;
	}
/*
 * Arial Black is used for nav
 */

/* font-family: Arial Black, Arial, sans-serif; */




/**
 * css/screen
 * ===========================================================================
 * Last Modif.: 2008-12-16
 * ---------------------------------------------------------------------------
 * (c) Copyright 2008 Sofa Design. 
 * All rights reserved.
 * ---------------------------------------------------------------------------
 *
 *
 * == COLORS: ================================================================
 *  
 *  ***
 *  HTML BG > #49433E
 *  
 *  ***
 *  BG Panneau Menus / Attachements > #B5BBBC
 *  
 *  ***
 *  Boîtes Rubriques (#nav)
 *   - Accueil            > #989FA0 (gris)
 *   - Formations         > #CDDB12 (vert)
 *   - Financement        > #7B177E (violet)
 *   - Le Crepa Bretagne  > #F2B836 (orange)
 *   - Documentation      > #CA0F4A (cerise)
 *  
 *  Boîtes tools (#nav-tools)
 *   - Actualités/Contact > #A2A9AA
 *  
 *  ***  
 *  BG Bandeaux (#header .title)     |   FC (#header .title p)
 *  --------------------------------------------------------------------------
 *   - Vert               > #CDDB12   |   Titre Page (txt) > idem
 *   - Violet             > #7B177E   |   Titre Page (txt) > idem
 *   - Orange             > #F4BD31   |   Titre Page (txt) > #F2B836
 *   - Cerise             > #CA0F4A   |   Titre Page (txt) > idem
 *
 * =========================================================================== 
 * 
 * 
 * 
 */



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



/* @group =SNIPPETS */
/*
 * recurrent styles that could be used anywhere across pages 
 * (like buttons, special links...)
 *
 */

.bt {}

/* @end */



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



/* @group =HTML */
html {
	
	}
	body {
		
		}
		#header {
			
			}
			#nav-tools {
				position: absolute;
				top: 61px;
				right: 200px;
				overflow:hidden;
				}
				#nav-tools li {
					float: left;
					text-align: right;
					
					margin-left: 16px;
					width: 95px;
					height: 16px;
					
					}
					#nav-tools li a {
						color: white;
						text-decoration: none;
						color: white;
						background-color: #A2A9AA;
						display:block;
						padding-right: 5px;
						}
						#nav-tools li a:hover {
							color: #A2A9AA;
							background-color: transparent;
						}
			#header h1 {
				font-size:183.34%;
				}
			/* Les bubulles des bannières sont contenus dans une seule et unique image.
			On la deplace donc selon le motif à afficher.
			À l'exception de IE6, on a surchargé les images de bannières par page (cf lt_ie_7.css) */
			body #banner { /* default */
				background: #F4C94A url(img/bg_banner-trans.png) no-repeat top left;
				color: #F4C94A;
				}
				#banner h1 {
					position: relative;
					top: 20px;
					margin: 0px 0px 0px 80px;
					min-width: 184px;
					max-width: 220px;
					background:transparent url('img/bg_banner_h1-trans.png') no-repeat 0px 2px;
					text-transform: uppercase;
					padding: 0px 9px 0px 9px;
					line-height: 35px;
					}
			body.accueil #banner {
				color: #fff;
				font-size: 108.34%;
				font-weight: bold;
				}
				body.accueil #banner p {
					width: 320px;
					margin: 0 0 0 65px;
					padding: 1.2em 0;
					}
			body.formations #banner {
				background-position: 0px -105px;
				background-color: #CDDB12;
				color: #CDDB12;
				}
			body.financement #banner {
				background-position: 0px -210px;
				background-color: #7B177E;
				color: #7B177E;
				}
			body.le-crepa-bretagne #banner {
				background-position: 0px -315px;
				background-color: #F4BD31;
				color: #F4BD31;
				}
			body.documentation #banner {
				background-position: 0px -420px;
				background-color: #CA0F4A;
				color: #CA0F4A;
				}

		#nav {
			
			}
			#nav ul {}
				#nav li {
					/*height: 20px;*/
					margin-bottom: 15px;
					}
					#nav li a {
						margin-left: 25px;
						padding: 1px 9px 1px 5px;
						color: #4D4D4D;
						background-color: white;
						text-transform: uppercase;
						}
					#nav li a:hover {
						background-color: #989FA0;
						color: white;
						text-decoration: none;
						}
			#nav ul.home {
				margin-top: 40px;
				background-position: top left;
				}
				#nav ul.home li {
					margin: 42px 0px 49px 0px;
					}
			#nav ul.rub {
				min-height: 220px;
				}
			body.accueil #nav .accueil,
			body.formations #nav .formations,
			body.financement #nav .financement,
			body.le-crepa-bretagne #nav .le-crepa-bretagne,
			body.documentation #nav .documentation { /* selected */
				background:transparent url(img/bg_nav_selected.png) no-repeat center left;
				}
				body.accueil #nav .accueil a, #nav .accueil a:hover {
					background-color: #989fa0;
					color: white;
					}
				body.formations #nav .formations a, #nav .formations a:hover {
					background-color: #CDDB12;
					color: white;
					}
				body.financement #nav .financement a, #nav .financement a:hover {
					background-color: #7B177E;
					color: white;
					}
				body.le-crepa-bretagne #nav .le-crepa-bretagne a, #nav .le-crepa-bretagne a:hover {
					background-color: #F4BD31;
					color: white;
					}
				body.documentation #nav .documentation a, #nav .documentation a:hover {
					background-color: #CA0F4A;
					color: white;
					}
		/*
		 * CONTENT______________________________________________________________
		 */
		#content {
			
			}
			#main {

				}
				#main a, #main p.back {
					color:#4B90A0;
					}
				#main p {
					/*margin-width: 400px;*/
					overflow: hidden; /* avoid image overflow... */
					}
				#main ul li {
					list-style-type: none;
					background: transparent url(img/crepa_puce.png) no-repeat 2px 5px ;
					padding-left: 24px;
					}
				#main ol li {
					margin-left: 24px;
					list-style: outside decimal;
					}
				#main p img {
					border: solid white 10px;
				}
				#main h2 {
					position: relative;
					left: -45px;
					padding-left: 45px;
					background: transparent url(img/bg_h2.png) no-repeat 0 0;
					color: #666;
					}
				#main h3 {
					color: #75979E;
					}
				#main h4 {
					color: #666;
					}
				#main p.back {
					position: absolute;
					top: 4px;
					font-size: 100%;
					}
				#main blockquote {
					padding-top: 18px;
					padding-left: 18px;
					background: transparent url(img/bg_blockquote.png) no-repeat 0 0;
					text-indent: 24px;
					}
			/*
			 * ACCUEIL__________________________________________________________
			 */			 
			#main #annonce {
				background-color: #d2e1e6;
				padding: 15px 22px 11px 22px;
				width: 356px;
				margin-top: 20px;
				}
				#main #annonce h2 {
					position: static;
					padding: 0;
					background: none;
					margin-bottom: 0;
					font-size:116.67%;
					}
				#main #annonce p {
					margin-bottom: 0;
					color: #4B90A0;
					}
					
			/*
			 * INDEXES HOME ET ACTUALITÉS_____________________________________
			 */
			#main div.index {
				background: #e4f4f2 url(img/bg_trame.png) repeat 0 0;
				padding: 5px 0 5px 0;
				}
				#main div.index .section {
					width: 366px;
					margin: 0 auto;
					}
					#main div.index .section h2 {
						position: static;
						padding-left: 0;
						font-size:116.67%;
						color: #fff;
						background:none;
						margin: 10px 0;
						}
						#main div.index .section h2 a {
							background: #AAC3CC url(img/bt_index_h2.png) no-repeat right 1px;
							color: #fff;
							padding: 2px 30px 2px 8px;
							}
						#main div.index .section h2 a:hover {
							background: #4B90A0 url(img/bt_index_h2.png) no-repeat right -89px;
							text-decoration: none;
							}
							
				#main div.index dl {
					background-color: #fff;
					padding: 16px 16px 32px 16px;
					}
					#main div.index dd {
						
						}
					#main div.index dt.date {
						color: #75979E;
						font: 100%/1.5 'Arial Black', arial, sans-serif;
						}
						#main div.index dl a {
							display: block;
							font-size: 100%;
							color: #4D4D4D;
							line-height: 1.3;
							}
						#main div.index dl a:hover {
							color: #4B90A0;
							text-decoration: none;
							}
					#main div.index dd.sep {
						border-bottom: dashed 1px #A4BEC5;
						margin: 10px 0;
						}
			
			/*
			 * ACTUALITÉS___________________________________________________
			 */
			#main #actualites {
				padding: 30px 0;
				}
				#main #actualites .section {
					background: transparent url(img/bg_actualites-trans.png) no-repeat 0 0;
					padding-top: 20px;
					}

			/*
			 * NAV-SUB-PAGES_____________________________________________________
			 */
			#nav-sub-pages {
				width: 350px;
				background: transparent url(img/bg_nav-sub-pages.png) no-repeat 0 0;
				padding-top: 80px;
				}
				#nav-sub-pages ul {
					background: transparent url(img/bg_nav-sub-pages.png) no-repeat -350px bottom;
					padding-bottom: 70px;
					margin: 0;
					}
					#nav-sub-pages ul li {
						background: none;
						margin-top: 12px;
						}
						#nav-sub-pages ul li a {
							margin-right: 40px;
							background-color: white;
							padding: 0px 9px 0px 5px;
							}
						#nav-sub-pages ul li a:hover {
							color: white;
							background-color: transparent;
							text-decoration: none;
							}
				
			/*
			 * FORMATIONS-BY-MONTH_______________________________________________
			 */
			#main #formations-by-month {
				/*margin-top: 40px;*/
				margin-bottom: 80px;
				overflow: hidden; /* clearing */
				}
				#main #formations-by-month div.month {
					border: solid 1px #D6E1E5;
					margin-bottom: 10px;
					position: relative;
					background-color: white;
					}
					#main #formations-by-month div.month h2 {
						position: static;
						background: #d6e1e5 none;
						line-height:32px;
						height: 32px;
						margin: 0;
						text-transform: uppercase;
						padding-left: 0;
						font-family: 'Arial Black', arial, sans-serif;
						font-size: 116.67%;
						}
						#main #formations-by-month div.month h2 a {
							display: block;
							padding: 0 10px;
							padding-top: 0;
							height: 32px;
							color: #86A9B2;
							}
						#main #formations-by-month div.month h2 a span {
							display: block;
							position: absolute;
							top: 0;
							right: 10px;
							width: 20px;
							font-size: 161.54%;
							line-height:32px;
							text-align: center;
							}
						#main #formations-by-month div.month h2 a:hover {
							color: white;
							background-color: #4B90A0;
							text-decoration: none;
							}
					#main #formations-by-month div.month dl {
						margin-left: 10px;
						margin-bottom: 0;
						padding-top: 10px;
						}
						#main #formations-by-month div.month dl dt{
							float: left;
							display: block;
							width: 60px;
							font-family: 'Arial Black', arial, sans-serif;
							color: #75979E;
							margin: 10px 0px;
							margin-top: 0px;
							background:transparent url(img/bg_trame.png) repeat top left;
							}
							#main #formations-by-month div.month dl dt.day {
								height: 40px;
								font-size: 233.34%;
								line-height: 40px;
								text-align: center;
							}
							#main #formations-by-month div.month dl dt.str {
								font-size: 100%;
								padding: 5px 10px;
								width: 40px;
								line-height: 1.2em;
							}
						#main #formations-by-month div.month dl dd {
							margin: 0px 0px;
							margin-left: 80px;
							width: 292px;
							display: block;
							
							}
							#main #formations-by-month div.month dl dd a {
								display: block;
								font-size: 100%;
								color: #4D4D4D;
								}
							#main #formations-by-month div.month dl dd a:hover {
								color: #4B90A0;
								text-decoration: none;
								}
						#main #formations-by-month div.month dl dd.sep {
							clear: left;
							margin: 10px 0px;
							border-bottom: dashed 1px #A4BEC5;
							width: 372px;
						}
					#main #formations-by-month div.month p.close {
						/*text-align: right;*/
						width: 382px;
						overflow: hidden;
						margin-bottom: 5px;
						}
						#main #formations-by-month div.month p.close a {
							display: block;
							float: right;
							text-align: center;
							width: 24px;
							height: 18px;
							margin:0px;
							padding: 0px;
							font-size: 83.34%;
						}
						#main #formations-by-month div.month p.close a:hover {
							text-decoration: none;
							background-color: #4B90A0;
							color: white;
							}
			
			/*
			 * FORMATIONS___________________________________________________
			 */
			#main #infos {
				padding: 18px 14px 8px 14px;
				background-color: #d6e1e5;
				margin: 2em 0 1.5em 0;
				}
				#main #infos ul {
					margin: 0;
					}
					#main #infos li {
						position: relative;
						list-style: none;
						background: none;
						padding-left: 0;
						margin-bottom: -0.8em;
						font-size: 100%;
						font-weight: bold;
						color: #75979e;
						}
						#main #infos em {
							position: relative;
							top: -1.5em;
							left: 116px;
							display: block;
							width: 235px;
							padding: 0 7px 0 12px;
							background-color: #f2f2e9;
							font-size: 108.34%;
							font-weight: normal;
							font-style: normal;
							color: #666666;
							}
			#main #tarifs {
				background: #e4f4f2 url(img/bg_trame2.png) repeat 0 0;
				padding: 18px 14px 6px 14px;
				margin-bottom: 1.5em;
				}
				#main #tarifs h3 {
					display: inline;
					padding: 2px 6px;
					background-color: #e4f4f2;
					font-size: 100%;
					}
				#main #tarifs ul {
					margin: 14px 0 0 -22px;
					}
					#main #tarifs li {
						width: 147px;
						height: 52px;
						float: left;
						list-style: none;
						background: none;
						background-color: #f2f2e9;
						padding: 14px;
						text-align: center;
						margin-left: 22px;
						margin-bottom: 1em;
						font-size: 100%;
						color: #666;
						}
						#main #tarifs li strong {
							color: #75979e;
							}
				#main #tarifs p {
					clear: left;
					padding: 5px;
					background-color: #e4f4f2;
					font-style: italic;
					color: #7b9ca3;
					}

			/*
			 * CONTACT___________________________________________________
			 */
			#main #contact-us h1 {
				display: none;
				}
				#contact-us #coordonnees {
					margin-bottom: 4em;
					}
				
								
		#aside {
			
			}
			#aside h3 {
				position: absolute;
				margin-left: -9999px;
				}
			
			#aside #news {
				background: transparent url(img/bg_aside_news.png) repeat-y 0 0;
				padding: 16px 18px 20px 21px;
				margin-bottom: 1.5em;
				}
				#aside #news h3 {
					position: static;
					font: 116.67%/1.2 'Arial Black', arial, sans-serif;
					color: #fff;
					text-transform: uppercase;
					margin: 0 0 1em 0;
					}
				#aside #news .date {
					font: 91.67%/1.2 'Arial Black', arial, sans-serif;
					color: #E4F4F2;
					}
				#aside #news .title {
					margin-bottom: 1em;
					}
					#aside #news .title a {
						display: block;
						color: #333;
						}
						#aside #news .title  span {
							color: #eee;
							font-weight: bold;
							font-size: 116.67%;
							}
					#aside #news .title a:hover {
						color: #4B90A0;
						text-decoration: none;
						}
			#aside .widget {
				border: 17px solid #fff;
				margin-left: 3px;
				padding: 33px 10px;
				background-color: #989FA0;
				text-align:center;
				margin-bottom: 1.5em;
				overflow: hidden;
				}
			#aside #xtra-img.widget {
				padding: 0;
				/* image must be 188px width */
				background-color: #fff;
				border-bottom: 15px solid #fff;
				}
				#aside .widget p, #aside .widget a {
					color: #d2e1e6;
					text-decoration:none;
					}
				#aside .widget p {
					font: 166.67%/1.2 'Arial Black', arial, sans-serif;
					}
				#aside .widget a:hover {
					color: #fff;
					}
			#aside ul.pages {
				background:#B5BBBC url(img/bg_nav-bg_aside.png) no-repeat -206px 0px;
				padding: 56px 0;
				overflow: hidden;
				}
				#aside ul li a:hover {
					text-decoration: none;
				}
				#aside ul.pages li {
					padding-left: 20px;
					margin-bottom: 1em;
					}
				#aside ul.pages li.selected {
					background:transparent url(img/bg_aside_pages_selected.png) no-repeat center left;
					}
					#aside ul.pages li a {
						display: block;
						margin-right: 30px;
						background-color: white;
						padding: 2px 9px 2px 5px;
						line-height: 1.4;
						}
					#aside ul.pages li.selected a, #aside ul.pages li a:hover {
						color: white;
						background-color: transparent;
						}
			#aside ul.attachments {
				margin-bottom: 15px;
				}
				#aside ul.attachments li {
					width: 198px;
					margin-bottom: 10px;
					}
					#aside ul.attachments a {
						display:block;
						background: transparent url(img/bg_attachments.png) repeat;
						color: white;
						font-family: Verdana, Arial, sans-serif;
						font-weight: bold;
						font-size: 91.67%;
						padding: 10px 15px 10px 20px;
						}
					#aside ul.attachments a:hover {
						background-position: -400px 0 ;
						}


/* @end */



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



/* @group =... */

/* @end */