ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,blockquote,fieldset,input
{ margin: 0; padding: 0; }
a img,:link img,:visited img { border: none; }

a { text-decoration: none;  color: #808080; }
a:hover { text-decoration: underline; color: #666666; }

img
{
  behavior: url("/sf/sf_default/css/pngfix.htc");
}

td { vertical-align: top }

hr {
  height: 1px;
  border: none 0; 
  border-top: 1px dashed #D2BE7D;
  color: #D2BE7D;
  margin-left: 0;
  text-align: left;
  _margin: 0;
  _padding: 0;
}


:focus
{
  -moz-outline-style: none;
}
html { overflow:auto; }
html,body { height: 100%;margin:0;padding:0; }

html>body #wrap {height:100%;} /* 100 % en hauteur */

h2 {
	color: #710E56;
	font-size: 13pt;
	margin-bottom: 10px;
	background-image: url("/images/title.gif");
	background-repeat: no-repeat;
	background-position:  left center;
	padding-left: 58px;
	}


h3 {
	font-size: 11pt;
	color: #710E56;
	}

p { margin: 0 0 10px 0;}

ul {
	margin-left: 15px;
}


input, textarea, select {
	font-family: Trebuchet MS, arial, helvetica, sans-serif;
  font-size: 9pt;
	}
	
div.col1 {
	width: 330px;
	float: left;
	margin-right:30px
	}

div.col2 {
	width: 330px;
	float: left;
	}
	
/************************************ LAYOUT *************************************/

body
{
	font-weight: normal;
  background-image: url("/images/background.gif");
  background-position: top;
  background-repeat: repeat-x;
  background-color: #efe8d7;
  font-family: Trebuchet MS, arial, helvetica, sans-serif;
  font-size: 9pt;
  line-height: 14pt;
  padding: 0;
  margin: 0;
}

div#wrap {
	width: 964px;
	margin: 0 auto;
	padding: 0;
	
}

div#header {
  position: absolute;
	width: 964px;
	padding: 0;
  height: 92px;
  background-image: url("/images/background-header.gif");
  background-position: left top;
  background-repeat: no-repeat;
  z-index: 2;
}

html>body #content-wrap {height:100%;} /* 100 % en hauteur */

html>body #content {padding: 92px 0 0 0;} /* 6em = hauteur de #header et #footer + 1em, 1em = donne au contenu un peu d'espace par rapport aux bords */

h1#logo { padding: 17px 0 0 0; margin: 0 0 0 7px;}

div#content-wrap, #content {
	background-image: url("/images/background-content2.gif");
  background-position: top;
  background-repeat: repeat-y;
  margin: 0;
}

div#sidebar {
	display:inline;
	float:left;
	width: 200px;
  padding-top: 43px; 
  margin-left: 7px;
  background-image: url("/images/background-sidebar.gif");
  background-position: top left;
  background-repeat: no-repeat;
}

div#page {
  margin-top: 0;
  width: 750px;
  float:left;
}

div#page-content {
	padding: 15px 20px;
	}

#sidebar ul {
	margin: 10px 0 15px 15px;
	padding: 0 10px;
	}

#sidebar ul li {
	margin: 2px 0;
	list-style-image: url(/images/list.gif);
	}

#sidebar ul li.sel {
	list-style-image: url(/images/listsel.gif);
	}
	
#sidebar ul li a {
	color: #710E56;
	}

#sidebar ul li.sel a {
	color: #e21e79;
	}


/************************************ MENU *************************************/

div#menu {
	width: 750px;
  background-color: white;
  height: 58px;
  margin-left: 0;
  background-image: url("/images/background-menu.gif");
  background-position: top left;
  padding: 0;
}

#menu ul {
  list-style-type : none;
  position: relative;
  margin: 0;
}

#menu ul li {
	display : inline;
	position: absolute;
}

#menu ul li a {
	display : block;
	width: 150px;
	height: 40px;
	float: left;
	position: relative;
	overflow: hidden; 
	background-position: 0 0;
}

#menu ul li a.elem:hover {
	background-position: 0 40px;
	}

#menu ul li a.elem-sel {
	height: 50px;
	background-position: 0 0;
	top:7px;
	}

#menu ul li a.elem-sel:href {
	background-position: 0 0;
	}



#menu ul li a span { position: absolute; top: 50px;}

li#menu-accueil { left:0; top:15px; z-index: 6 }
li#menu-agenda { left:135px; top:15px; z-index: 5 }
li#menu-ressources { left: 270px; top:15px; z-index: 4 }
li#menu-animations { left: 405px; top:15px; z-index: 3 }

li#menu-accueil a { background-image: url("/images/menu/off/accueil.png"); }
li#menu-agenda a { background-image: url("/images/menu/off/agenda.png"); }
li#menu-ressources a { background-image: url("/images/menu/off/ressources.png"); }
li#menu-animations a { background-image: url("/images/menu/off/animations.png"); }

li#menu-accueil-sel { left:0; z-index: 6 }
li#menu-agenda-sel { left:135px; z-index: 5 }
li#menu-ressources-sel { left: 270px; z-index: 4 }
li#menu-animations-sel { left: 405px; z-index: 3 }

li#menu-accueil-sel a { background-image: url("/images/menu/on/accueil.png"); }
li#menu-agenda-sel a { background-image: url("/images/menu/on/agenda.png"); }
li#menu-ressources-sel a { background-image: url("/images/menu/on/ressources.png"); }
li#menu-animations-sel a { background-image: url("/images/menu/on/animations.png"); }


/*********************************** BLOC *********************************/

div.bloc1 
{
	width: 700px;
	margin-bottom: 20px;
}

.bloc1 .bloctop
{
	background-image: url("/images/bloc1top.jpg");
	background-repeat: no-repeat;
	height: 8px;
	overflow: hidden;
}

.bloc1 .bloccontent
{
	background-image: url("/images/bloc1sides.jpg");
	background-repeat: repeat-y;
	padding: 10px 15px 0 15px;
}
.bloc1 .blocbtm
{
	background-image: url("/images/bloc1btm.jpg");
	background-repeat: no-repeat;
	height: 27px;
}


div.bloc2 
{
	width: 330px;
	margin-bottom: 10px;
}

.bloc2 .bloctop
{
	background-image: url("/images/bloc2top.jpg");
	background-repeat: no-repeat;
	height: 8px;
	overflow: hidden;
}

.bloc2 .bloccontent
{
	background-image: url("/images/bloc2sides.jpg");
	background-repeat: repeat-y;
	padding: 5px 10px 0 10px;
}
.bloc2 .blocbtm
{
	background-image: url("/images/bloc2btm.jpg");
	background-repeat: no-repeat;
	height: 27px;
}


/*********************************** AGENDA *********************************/

.bloc1 table, .bloc2 table {
	width: 100%;
	}

.actu-img {
  text-align: right;
	}

.actu-txt {
  padding: 0 10px 0 0;
  margin: 0;
	}

.actu-img img { border: 1px solid silver }

/************************************ POSTER *********************************/

div#poster {
	margin-top: 20px;
	}

div.form-row {
	clear: both;
	}

div.form-field, div.form-field1, div.form-field2 {
	float: left;
	padding-right: 20px;
	padding-bottom: 10px;
	}

div.form-field1 {
	width: 152px;
	}

div.form-field2 {
	width: 324px;
	}

.form-field1 input {
	width: 146px;
	padding: 1px 1px 0 1px;
	}

.form-field2 input {
	width: 318px;
	padding: 1px 1px 0 1px;
	}

.form-message textarea {
	width: 664px;
	height: 120px;
	}

div#indicator {
  position:relative;
	padding:0;
	left:0;
	margin: 10px auto 0 0;
	width: 16px;
  height: 16px;
  background: url(/images/indicator.gif) no-repeat 0 0;
}


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

#comocean a {
	position: absolute;
	bottom: 0px;
	right: 0px;
	text-indent: -7890px;
	width: 80px;
	height: 80px;
	background: url(/images/design-by-com-ocean.gif) 0 0 no-repeat;
	overflow: hidden;
	position: fixed;
}