@charset "UTF-8";

/* CSS Document */



/*

-- Sujet : CSS layout

-- Historique : Création le 11 mars 2009

-- Author : Cynthia Roy

-- Absolu communication marketing

*/



/* Couleurs */

/*

	Bleu turquoise : #7ED1EB

	Bleu turquoise pâle : #CBEDF7

	Vert : #78A621

	Bleu marin : #073367

*/





/******************** Container ********************/

BODY {

	background: #7ED1EB url(../images/bg.jpg) repeat-x 0 0;

}



#bg-wave { float: left; width: 100%; background: url(../images/bg-wave.jpg) no-repeat 50% 0; padding: 24px 0 15px 0; }



#container {

	position: relative; width: 945px;

	color: #606060; font-size: 0.75em;

}

/***************************************************/



/********************* Header **********************/

#header {

	position: absolute; z-index: 10; top: 0; left: 0; right: 0; height: 228px;

	background-color: #FFFFFF;

}



#header .logo {

	position: absolute; z-index: 50; top: -24px; left: 164px; width: 250px; height: 142px;

	text-align: center;

	background: url(../images/header-logo-bg.png) no-repeat 50% 0;

}

#header .logo IMG { padding-top: 24px; }



#header .photo-paysage {

	position: relative; float: left;

	margin: 8px 0 7px 8px;

}



#header .photo-slogan {

	position: relative; z-index: 20; float: right; height: 245px;

	margin: -24px 8px 8px 0;

	background: url(../images/header-bandecouleurs.jpg) no-repeat 0 100%;

}



#header .utilz { 

	position: absolute; z-index: 30; top: -20px; right: 0;

	color: #FFFFFF;

}

#header .utilz UL {

	list-style-type: none; 

	margin: 0; padding: 0;

}

#header .utilz LI {

	margin: 0; padding: 0;	

}

#header .utilz LI A { color: #FFFFFF; text-decoration: none; }

#header .utilz LI A:hover { text-decoration: underline; }

/***************************************************/



/****************** Row middle *********************/

#rowmiddle {

	position: relative; z-index: 5;

	float: left; display: block; width: 660px;

	margin: 227px 0 0 285px; padding: 0 0 75px 0;

	background: #CBEDF7 url(../images/rowmiddle-bg.jpg) repeat-x 0 0;

}

/***************************************************/



/******************** Content **********************/

#content {

	position: relative; z-index: 0; float: left; left: 100%; width: 644px;

	margin-left: -652px; margin-bottom: -7px;

	text-align: justify;

	background: #FFFFFF url(../images/header-shadow-content.jpg) repeat-x 0 0;

}



#content .content { 

	position: relative; z-index: 0; float: left; left: 100%; margin-left: -664px; width: 470px; height: 95%;

	padding: 25px 15px 25px 45px;

	background: url(../images/content-shadow-left.png) repeat-y 0 0;

}



#content .shadow-bottom {

	position: absolute; top: 100%; left: 0; width: 100%; height: 20px;

	background: url(../images/content-shadow-bottom.jpg) repeat-x 0 0;

}

#content .shadow-bottom .shadow-left, #content .shadow-bottom .shadow-right { position: absolute; top: 0; width: 50px; height: 20px; background-repeat: no-repeat; background-position: 0 0; }

#content .shadow-bottom .shadow-left { top: -10px; left: -20px; width: 55px; height: 30px; background-image: url(../images/content-shadow-botleft.jpg); }

#content .shadow-bottom .shadow-right { right: 0; background-image: url(../images/content-shadow-botright.jpg); }



#columnright { 

	position: relative; float: left; left: 100%; margin-left: -139px; width: 131px;

	background: url(../images/columnright-separateur.gif) no-repeat 0 0;

	padding-top: 25px;

}



#columnright #partenaires { text-align: center; padding: 0 7px	}

#columnright #partenaires H4 { color: #073367; font-size: 120%; text-align: center; text-transform: uppercase; margin: 0 0 35px 0; }

#columnright #partenaires IMG { margin: 0 0 25px 0; }

#columnright #partenaires .morelink { margin: 0 0 10px 0; }

#columnright #partenaires .morelink A { 

	display: block; 

	color: #FFFFFF; font-size: 90%; font-weight: bold; text-align: center; text-decoration: none;

	background-color: #004880; border: 1px solid #00355D;

	padding: 1px 5px;

}

#columnright #partenaires .morelink A:hover { background-color: #003056; }



H1,H2,H3,H4 { text-align: left; }



H1.main { margin-top: 0; }

H1 { color: #78A621; font-size: 250%; font-weight: normal; text-transform: uppercase; }



H2 { color: #1C4274; text-transform: uppercase; margin: 15px 0 10px 0; padding-top: 10px; }



H3 { color: #000000; font-size: 120%; margin-bottom: 5px; }



H4 { font-size: 110%; margin-top: 0; margin-bottom: 5px; }



LI { margin-bottom: 8px; }



A { color: #0163AC; }

A:hover { color: #3696DE; }



THEAD TH { color: #000000; font-size: 120%; text-align: center; background-color: #CBEDF7; padding: 5px; }

TD { text-align: center; vertical-align: middle; }

TD { text-align: center; vertical-align: middle; }
TABLE.miseenpage, TABLE.miseenpage TH, TABLE.miseenpage TD { border: none; }
TABLE.miseenpage { margin-bottom: 0; }
TABLE.miseenpage TH, TABLE.miseenpage TD { padding: 0 10px 5px 0; text-align: left; vertical-align: top; }

UL.news LI { clear: both; }
UL.news LI IMG { margin-bottom:15px !important; }

DIV.box1 {

	position: relative;	

	color: #7E7E7E; font-size: 90%; line-height: 130%; text-align: left;

	background: url(../images/box1-left.jpg) no-repeat 0 0;

	padding: 0 0 0 15px;

}

DIV.box1 .box-shadow { background: url(../images/box1-right.jpg) no-repeat 100% 0; padding: 0 15px 0 0; }

DIV.box1 .box-content { 

	position: relative; 

	background: url(../images/box1-top.jpg) repeat-x 0 0;

	padding: 30px 15px 15px 15px;

}

DIV.box1 .box-content .ico { 

	position: absolute; top: -8px; left: 55px; width: 174px;

	text-align: center;

	padding-top: 28px; background: url(../images/box1-wavetop.jpg) no-repeat 50% 0;

}

DIV.box1 .box-content .ico IMG { border: none; }



DIV.box1 H2 { 

	color: #1C4274; text-transform: uppercase;

	margin: 0 0 20px 0;

}



DIV.box1 IMG { border: 1px solid #1C4274; }



DIV.box2 {

	position: relative;	

	color: #7E7E7E; font-size: 90%; line-height: 130%; text-align: left;

	background: url(../images/box2-left.jpg) no-repeat 0 100%;

	padding: 0 0 0 15px;

}

DIV.box2 .box-shadow { background: url(../images/box2-right.jpg) no-repeat 100% 100%; padding: 0 15px 0 0; }

DIV.box2 .box-content { 

	position: relative; 

	background: url(../images/box2-bottom.jpg) repeat-x 0 100%;

	padding: 30px 15px;

}



DIV.box2 H2 { 

	color: #78A622; text-transform: uppercase;

	margin: 0 0 20px 0;

}

DIV.box2 IMG { border: 1px solid #78A622; }

DIV.box1 .morelink, DIV.box2 .morelink { clear: both; margin: 15px 0 10px 0; text-align: right; height: 18px; }

DIV.box1 .morelink A, DIV.box2 .morelink A { 

	float: right;

	color: #FFFFFF; font-weight: bold; text-align: center; text-decoration: none;

	background-color: #004880; border: 1px solid #00355D;

	padding: 2px 10px;

}

DIV.box1 .morelink A:hover, DIV.box2 .morelink A:hover  { background-color: #003056; }

DIV.box2 .morelink A { background-color: #78A622; border-color: #549037; }

DIV.box2 .morelink A:hover { background-color: #516F17; border-color: #386125; }



#container.home #content #news {

	position: relative; float: left; left: 100%; margin-left: -100%; width: 241px;	

}

#container.home #content #news UL, #container.home #content #infos UL { list-style-type: none; margin: 0 0 25px 0; padding: 0; }

#container.home #content #news LI, #container.home #content #infos LI { margin: 0 0 10px 0; padding: 0; }

#container.home #content #news H3.date { color: #606060; font-size: 110%; margin: 0 0 2px 0; }



#container.home #content #infos {

	position: relative; float: left; left: 100%; margin-left: -237px; width: 245px;	

}

#container.home #content #infos .box-content { min-height: 340px; }



#container.home #content #infos H3.date { display: none; }



.xmap UL UL { margin-top: 5px; margin-bottom: 10px; }

.xmap LI { margin-bottom: 5px; }

/***************************************************/



/****************** Left column ********************/

#columnleft {

	position: relative; z-index: 5; float: left; left: 100%; width: 285px; margin-left: -945px;

	margin-bottom: 115px;

	background: #7ED1EB url(../images/bg.jpg) repeat-x 0 -253px;

}

#columnleft .shadow { 

	position: absolute; top: 0; left: 0; width: 100%; height: 23px; z-index: 0;

	background: url(../images/header-shadow-columnleft.jpg) repeat-x 2px 0;

}



#columnleft .menu * { font-family: "Lucida Grande","Lucida Sans Unicode", "Eras Medium ITC", "DejaVu Sans", Helvetica, Verdana, sans-serif; }

#columnleft .menu { position: relative; z-index: 10; font-size: 120%; width: 293px; padding-top: 15px; }

#columnleft .menu UL {

	list-style-type: none;

	margin: 0 0 10px 0; padding: 0;

}

#columnleft .menu LI { 

	position: relative; z-index: 0;

	margin: 0 0 4px 0; padding: 0;

}

#columnleft .menu LI A { 

	display: block; width: 100%;

	color: #FFFFFF; text-decoration: none;

	background-repeat: repeat-y; background-position: 0 0; background-image: url(../images/columnleft-menu-li-10.jpg);

}

#columnleft .menu LI A SPAN { display: block; padding: 4px 10px 4px 50px; }

/*#columnleft .menu LI A:hover, #columnleft .menu LI.actif A, #columnleft .menu LI:hover A, #columnleft .menu LI.hover A { background-position: -292px 0; }*/

#columnleft .menu LI A:hover, #columnleft .menu LI:hover A, #columnleft .menu LI.hover A { background-position: -293px 0; color:#FFF;}

#columnleft .menu LI.actif A{ background-position: -586px 0; color:#014987; }



#columnleft .menu LI.li-1 { z-index: 100; }

#columnleft .menu LI.li-1 A { background-image: url(../images/columnleft-menu-li-01.jpg); }

#columnleft .menu LI.li-2 { z-index: 90; }

#columnleft .menu LI.li-2 A { background-image: url(../images/columnleft-menu-li-02.jpg); }

#columnleft .menu LI.li-3 { z-index: 80; }

#columnleft .menu LI.li-3 A { background-image: url(../images/columnleft-menu-li-03.jpg); }

#columnleft .menu LI.li-4 { z-index: 70; }

#columnleft .menu LI.li-4 A { background-image: url(../images/columnleft-menu-li-04.jpg); }

#columnleft .menu LI.li-5 { z-index: 60; }

#columnleft .menu LI.li-5 A { background-image: url(../images/columnleft-menu-li-05.jpg); }

#columnleft .menu LI.li-6 { z-index: 50; }

#columnleft .menu LI.li-6 A { background-image: url(../images/columnleft-menu-li-06.jpg); }

#columnleft .menu LI.li-7 { z-index: 40; }

#columnleft .menu LI.li-7 A { background-image: url(../images/columnleft-menu-li-07.jpg); }

#columnleft .menu LI.li-8 { z-index: 30; }

#columnleft .menu LI.li-8 A { background-image: url(../images/columnleft-menu-li-08.jpg); }

#columnleft .menu LI.li-9 { z-index: 20; }

#columnleft .menu LI.li-9 A { background-image: url(../images/columnleft-menu-li-09.jpg); }

#columnleft .menu LI.li-10 { z-index: 10; }

#columnleft .menu LI.li-10 A { background-image: url(../images/columnleft-menu-li-10.jpg); }



#columnleft .menu UL UL {

	display: none;

	position: absolute; z-index: 200; top: 0; left: 100%; width: 230px;

	font-size: 90%;

	margin: 0 0 0 -8px;

}

#columnleft .menu LI:hover UL, #columnleft .menu LI.hover UL { display: block; }



#columnleft .menu LI LI { margin: 0; border-top: 1px solid #2E91CD; width: 99%; }



#columnleft .menu LI LI A, #columnleft .menu LI.actif LI A { color:#fff;  background-position: -460px 0 !important; background-image: url(../images/columnleft-menu-lili-05.jpg); }



#columnleft .menu LI LI A SPAN { padding: 4px 10px 4px 20px;  font-weight:normal; }



#columnleft .menu LI LI A:hover {color:#fff; background-position: -230px 0 !important;  }

#columnleft .menu LI LI.actif A { color:#014987; background-position: 0 0 !important;  }



#columnleft .menu LI LI.li-1 A { background-image: url(../images/columnleft-menu-lili-01.jpg); }

#columnleft .menu LI LI.li-2 A { background-image: url(../images/columnleft-menu-lili-02.jpg); }

#columnleft .menu LI LI.li-3 A { background-image: url(../images/columnleft-menu-lili-03.jpg); }

#columnleft .menu LI LI.li-4 A { background-image: url(../images/columnleft-menu-lili-04.jpg); }

#columnleft .menu LI LI.li-5 A { background-image: url(../images/columnleft-menu-lili-05.jpg); }



#columnleft .photo-flag {

	position: relative; z-index: 0;

	width: 293px; height: 235px; text-align: center;

	background: #FFFFFF url(../images/content-shadow-left-photoflag.jpg) repeat-y 100% 0;

}

#columnleft .photo-flag IMG {

	margin-top: -47px;

}

#columnleft .photo-flag-top {

	position: absolute; z-index: 20; right: 53px; width: 64px; height: 44px; margin-top: -45px;

	background: url(../images/columnleft-photoflag-top.gif) no-repeat 0 0;

}

/***************************************************/



/********************* Footer **********************/

#footer {

	position: relative; z-index: 15; clear: both; float: right; width: 660px;

	color: #3696DE; font-size: 85%;

	margin: -55px 0 0 0;

}



#footer .links { color: #0163AC; text-align: center; line-height: 130%; }

#footer .links UL { list-style-type: none; margin: 0; padding: 0; }

#footer .links LI { display: inline; margin: 0 5px 0 0; padding: 0 0 0 8px; background: url(../images/footer-links-separateur.gif) no-repeat 0 50%; }

#footer .links LI:first-child, #footer .links LI.first { background: none; padding-left: 2px; }

#footer .links A { color: #0163AC; text-decoration: none; }

#footer .links A:hover { text-decoration: underline; }



#footer .copyright { text-align: center; margin: 0 0 10px 0; }

#footer .copyright A { color: #3696DE; text-decoration: none; }

#footer .copyright A:hover { color: #3696DE; text-decoration: underline; }



#contact {

	position: relative; z-index: 2;

	float: left; left: 0; bottom: 0; width: 233px; height: 135px; margin-top: -185px;

	padding: 25px 30px;

	background-color: #CBEDF7;

	color: #4AA1E1; font-size: 95%; line-height: 130%;

}

#contact H4 { color: #0163AC; margin-top: 0; }

#contact H5 { color: #0163AC; }

#contact A { color: #4AA1E1; text-decoration: none; }

#contact A:hover { text-decoration: underline; }

/***************************************************/