body { /* set everything to zero for a good cross-browser starting point */
	margin: 0; /* zeroes the margins on the body */
	padding: 0; /* zeroes the padding on the body ~ Opera carries a default padding and requires this zeroing */
	border: 0; /* zeroes off any existing border */
	background-image: url(segemmacbo/images/bg.jpg);
	color: #383412;  /* set the default text color */
	text-align: center; /* set the default fonts */
	font-size: 100.01%; /* Sets default font size. This odd value compensates for several browser bugs. First, setting a default font size in percent (instead of em) eliminates an IE/Win problem with growing or shrinking fonts out of proportion if they are later set in ems in other elements. Additionally, some versions of Opera will draw a default font-size of 100% too small compared to other browsers. Safari, on the other hand, has a problem with a font-size of 101%. Current "best" suggestion is to use the 100.01% value for this property */
	min-width: 770px; /* Prevents the body becoming narrower than our wrapper div - keeps the content from disappearing off the left edge with Gecko browsers */
	font-family: Verdana, Arial, Helvetica, sans-serif;
}
.texteaccueil {padding:8px; font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 14px; }

#maitrise {
	width: auto;
	top: 2px;
	float:right;
	width: 300px;
	text-align: right;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #FFFFFF;
	padding: 10px;
}

#wrapper {
   width: 770px;/*sets the width for IE5.x's broken box model*/
	w\idth: 770px; /* sets the width of the wrapper for compliant browsers*/
	margin: 5px auto;/* centers the wrapper. First value - 5px is applied to the top and bottom margins, auto sets the excess space on the view port evenly to the left and right*/
	position: relative; /* prevents the image from tiling in our page, we do not want this image to repeat */
	background-color: #FFFFFF; /* sets the wrappers background color */
	border: 1px solid #000; /* sets a border to all 4 sides */
	text-align: left; /* Realigns the text to the left after the IE hack in the body rule */
}

#banner {
	background-image: url(images/e_fr.jpg);  /* sets the background image for the banner div*/
	background-repeat: no-repeat;/* set a height for the banner to allow all the bg image to be seen, no text resizing in this element to worry about */
	background-color: #CC6633;
	font-size: 14px;
	color: #000000;
	font-weight: bold;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	margin: 0px;
	text-align: right;
	padding: 0px;
	border-bottom: 2px solid #000;
	position: relative;
	height: 82px;
}

#content { /* Begin laying out and styling the content div */
	width: 560px; /* sets the width of our content*/
	margin-left: 200px; /* this left margin clears the leftcol div and allows our content div to become a second column */
	margin-bottom: 20px; /* sets a padding clearance on the bottom of the div*/
}

#accueil { /* Begin laying out and styling the content div */
	width: 740px; /* sets the width of our content*/
	margin-left: 20px; /* this left margin clears the leftcol div and allows our content div to become a second column */
	margin-bottom: 20px; /* sets a padding clearance on the bottom of the div*/
	text-align: justify;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-decoration: none;
}

#content p {
	font-size: 80%; /* set the font size for p, scaled from the body declaration */
	margin: 10px 6px 10px 6px; /* set the margins for the p element */
	padding: 0; /* zero off the padding */
}

.titleimages { /* used to set the "cold" title images */
	display: block; /* set to display block to ensure it has it's own line in the design */
	margin-top: 25px; /* set a margin to the top */
}

#leftcol { /* Begin laying out the leftcol div */
	float: left; /* Floats the div to the left to make a column */
	width: 169px; /* sets a width for the div - Imperative for IE mac */
	margin-bottom: 120px;
	margin-left: 0px; /*creates a margin on the left to move the div away from the wrapper's edge */
	margin-top: 0px;
}



#leftcol #navigation {
	line-height: 100%; /* helps out IE 5.01 PC */
	width: 169px; /*uses keywords to place the image at the bottom left of the div */
	padding-bottom: 100px; /* gives our background image room to display */
	margin-top: 0px;
	padding-top: 0px;
}

#leftcol #navigation ul {
	list-style-type: none; /* removes the bullets from our list navigation */
	margin: 0; /* zeroes off the margins */
	padding: 0; /* zeroes off the padding */
	font-size: 75%; /* scales the font to 75% of the body font declaration*/
}

#leftcol #navigation ul li { /*The 3 margin property/value pairs are a hack to make the links butt together in IE 5.01 */
	padding: 0; /* zeroes off the padding */
	margin: 0; /* zeroes off the margins */
	margin: /**/ 0 0 -3px 0; /* This takes 3px off the bottom margin in IE 5.01 - IE 5.5 cannot read this hack so stays with the 0 value from the last margin property */
	ma\rgin: 0; /* repeats the image vertically, no need to position it as top left is the default and that is where we want the image begin tiling from */
	
}

#leftcol #navigation a, 
#leftcol #navigation a:visited { /* use dual selectors if the properties and values are the same for each */
	border-bottom: 1px solid #323C55; /* sets the left border */
	border-right: 1px solid #323C55; /* sets the right border */
	color: #000000; /* changes the default text colour to white */
	display: block; /* required to make the links act like a button, having the full area "clickable" */
	padding: 4px 0 6px 4px; /* sets padding values to give the link text some "air" */
	text-decoration: none; /* removes the default underline */
	background-color: #CCCCCC; /* sets a background colour on the links which hides the roll over snowman image in the li selector */
	width: 163px; /* sets the width for IE5.x - content width plus border widths plus padding value = 6 extra pixels */
	w\idth: 163px; /* resets the width for IE6 and compliant browsers */
}

/* using the \ escape character as in w\idth - see final property declaration in the selector above */
/* IE 5.01 and IE5.5 cannot read this selector. The escape character must not come immediately before the letters a,b,c,d,e or f. If it does it will be seen as a hex character and the hack will fail */

#leftcol #navigation a:hover, 
#leftcol #navigation a:focus { /* use dual selectors if the properties and values are the same for each */
	background-color: #999999; /* prevents the dark blue background colour from the "a" selector showing and ensures the snowman image is seen on hover and focus */
	border-bottom: 1px solid #ccc; /* changes the bottom border to white to give the hover state an indented look */
	color: #FFFFFF; /* changes the hover and focus text to black */
}

#footer {  /* Begin laying out and styling the footer div */
background-color: #fff;  /*sets a background colour for the footer*/
width: 770px;  /*Sets the footers width*/
border-top: 1px solid #000;  /*sets the top border to define the beginning of the footer*/
font-size: 60%;  /* sets the footer text size */
text-align: right;  /* aligns the text to the right*/
margin-top: 20px;  /* Adds a margin to the top of the footer*/
clear: left;  /*clears any floats to the left - our leftcol div in this instance*/
}

#footer p {
background-color: #E4E4E4;  /*sets the background colour for the p element when it is in the footer div*/
padding: 4px 4px 4px 10px;  /* sets the padding values*/
margin: 0;  /*zeroes off the margins */
}

#footer ul{
	background-color: #333333;/*provides a background colour for the links list*/
	margin: 0;/*zeroes off the margins*/
	padding: 4px;/*add some air around the links*/
	border-bottom: 1px solid #000;
}

#footer li{
display: inline;/*set the list to display inline*/
}

#footer a {  /* Styles the links within the footer */
color: #fff;  /*sets the text to white*/
text-decoration: underline;  /*keeps the underline*/
}

#footer a:hover,
#footer a:focus {
text-decoration: none;  /*removes the underline*/
}
.jumpmenutext {

	display: block; /* set a margin to the top */
}
#swf_bandeau {
	background: #FFFFFF;
}
a:link, a:visited {  color: #666666; text-decoration: none}
a:hover  { color: #4B4B4B; text-decoration: underline}
a:active {  color: #4B4B4B; text-decoration: underline}
#sousbanner {
	background-color: #E4E4E4;  /*sets a background colour for the footer*/
	width: 764px;  /*Sets the footers width*/
	border-bottom: 1px solid #000;  /*sets the top border to define the beginning of the footer*/
	font-size: 80%;  /* sets the footer text size */
	text-align: right;  /* Adds a margin to the top of the footer*/
	clear: left;
	padding: 3px;
	font-weight: bolder;
}

.leftimage{
float: left;
margin: 0 10px 20px 0;
border: 1px solid #000000;
}

.rightimage{
float: right;
margin: 5px;
border: 1px solid #000000;
}