@charset "utf-8";
/* CSS Document */



/* This is where you change the body background image and its position. */
   			body{

                background: #ffffff url(../images/bg_frenchflag.jpg) no-repeat;
				
				background-position:top;

                font-family: Helvetica, Arial, sans-serif;

                font-size: 12px;

                margin: 0 0 3em;

                }

            a:link, a:visited {
				
				color: #2576A7;
				
				padding: 2px;
                
				}

            a:hover {

                background: #369;

                color: #fff;

                text-decoration: none;

                }

            a img {border: none;}

            img {border: none;}

            h1, h2, h3, h4 {line-height: 1em; margin: 1em 0;}

            h1, h2  {font-size: 2em; font-weight: normal;}

            h3  {font-size: 1.2em; font-weight: bold;}

            p, li {
	line-height: 1.6em;
	color:#300;
}
			
			

            p.placeholder {

                display: block;

                line-height: 1em;

                width: 220px; 

                font-size: 24px; 

                font-weight: bold; 

                text-align: center; 

                padding: 25px 0; 

                background: #7f7f7f; 

                color: #707070;

                margin: 0 0 10px 0;

                }
				
			p.intro {
				
				line-height: 1.6em;
				
				color:#333;
				
				font-size:16px;
				
				}
				
			p.text-header {
				
				background: #666;
				
				margin-top: 1em;
	
				color: #fff;
				
				}
				
			p.subtext {
				
				line-height: 1.6em;
				
				color:#333;
				
				font-size:10;
				
				}
				
/* This section is your content section. Be careful with this. Editing the width can readjust the entire look of your website. */
			#wrapper {

				margin: 35px auto;

				width: 700px;
				
				background: #fff;

				padding: 5px;
				
				border: 1px;

				}
			
/* Here is where you change the image at the very top of your page. You can place Flash files or banners instead of logos
just make sure that you keep the sizing the same. If you want to put a flash banner, delete the background image and place the 
object embed code in the main source. */

			#header_logo {
				
				width:700px;
				
				height:100px;
				
				background-image:url(../images/logo_header_01.jpg);
				
				}

/* This begins the navigation bar. This code determines the color schemes, fonts and sizes of all your navigation blocks. BE CAREFUL */

			#navlist {

				background: #003399;
				
				margin: 0px;

				padding: 0px;

				height: 16px;
				
				border-bottom: 4px solid #cc0000;

				}

			#navlist li {

				display: inline;

				float: left;

				margin: 0px;
				
				padding: 0px;

				list-style: none;
				
				}

			#navlist li a:link, #navlist li a:visited {
				
				color: #ccc;
	
				text-decoration: none;
				
				display: block;
	
				padding: 0px 0px 0px 3px;
				
				margin: 0px;
	
				height: 16px;
	
				overflow: hidden;
				
				width: 137px;
	
				text-align: center;
				
				font-family: Arial, Helvetica, sans-serif;
				
				font-size: 14px;
	
				line-height: 18px;
				
				font-weight: bold;
				
				}

			#navlist li a#current {

				color: #FFFFFF;

				font-style: italic;
				
				font-size:18px;
				
				}

			#navlist li a:hover, #navlist li a:active {

				color: #FFFFFF;

				text-decoration: none;

				background: #0066ff;
				
				text-align: left;
				
				text-transform: uppercase;

				font: bold normal 10px/16px "Lucida Sans Unicode", verdana, lucida, arial, helvetica, sans-serif;

				}

/* This begins the feature image section. */

			#feature{
	
				float:left;
	
				overflow:hidden;
	
				width: 500px;
	
				height: 250px;
				
				}
				

/* This section manipulates the style of the links to the right of your feature image. BE CAREFULL */

			ul#rightfeature {
	
				float: right;
	
				display: block;
	
				width: 200px;
	
				height: 250px;
				
				background: #dae7f8;
				
				margin: 0px;
	
				background: url(../images/right_featurebg.jpg) no-repeat;
	
				padding:45px 0px 0 0;
				
				top: 0px;
	
				right: 0px;
				
				overflow:hidden;

				}

			ul#rightfeature li {

    			display: block;

    			padding: 10px 5px 10px 35px;

    			margin: 0;

    			font-size: 12px;

    			color: #000000;

    			font-weight:bold;

    			line-height: 1em;

    			background:  url(../images/drapeau.gif) 17px 50% no-repeat;

				}


			ul#rightfeature li a {

    			color: #ffffff;

    			text-decoration: none;  

				}

			ul#rightfeature li a:hover {

    			text-decoration: none;

    			color: #ffffff;

				}



			#main {
				
				margin: 5px 0 3em 15px;
	
				width: 450px;
	
				float: left;
	
				display: inline;
                
				}

            div.wide#main {width: 680px;}
			
			
			.thumbnail{
				
				position: relative;
				
				z-index: 0;
				
				}


			.thumbnail:hover{

				background-color: transparent;

				z-index: 30;
				
				}


			.thumbnail span{ /*CSS for enlarged image*/
	position: absolute;
	background-color: #fff;
	padding: 5px;
	left: -500px;
	border: 1px solid gray;
	visibility: hidden;
	color: #666;
	text-decoration: none;
	
				
				}


			.thumbnail span img{ /*CSS for enlarged image*/
				
				border-width: 0;

				padding: 2px;
				
				}



			.thumbnail:hover span{ /*CSS for enlarged image on hover*/
	visibility: visible;
	top: -135px;
	left: 150px; /*position where enlarged image should offset horizontally */
	height: auto;
	width: 300px;
	text-align:left;
	float:left;

				}


            #sidebar {

                width: 150px;

                float: right;

                margin: 2em 28px 3em 0;
				
				text-align:center;

                }

            #sidebar ul.contextnav {

                padding: 4.3em 0 0;

                margin: 0;

                border-bottom: 1px solid #bfbfbf;

                width: 200px;

                }



            #sidebar ul.contextnav li {

                list-style: none;

                margin: 0;

                padding: 0.25em;

                border-top: 1px solid #bfbfbf;

                }

            #sidebar ul.contextnav li a:link, #sidebar ul.contextnav li a:visited {

                text-decoration: none;

                font-weight: bold;

                }
			
			#wide {
				width:700px;
				height:auto;
				float:left;
			}

           #footer {
					
				background: #ffffff;
				
				margin-top: 4em;
	
				color: #999;
				
				clear: both;
                
				}

            #footer p {

                text-align: center;

                padding: 5px;

                margin: 0;

                }