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

html, body{
	padding:0;
	margin:0;
	width:100%;
	height:100%;
}

/* ----------------- general ----------------- */

body{
	background-color: #fffbd4;
	font-family:Arial, sans-serif;
	font-size:12px;
	line-height:15px;
	color:#676767
}

#bg_profil{
	background: url(images/bg_01.gif) top center no-repeat;
}
#bg_services, #bg_sondage{
	background: url(images/bg_02.gif) top center no-repeat;
}
#bg_clients{
	background: url(images/bg_03.gif) top center no-repeat;
}
#bg_coordonnees{
	background: url(images/bg_04.gif) top center no-repeat;
}

a{
	outline:0;
	text-decoration:underline;
	color:inherit;
	color:#676767
}

img, p{
	border:none;
	margin:0;
	padding:0
}

ul, li{
	list-style:none;
	list-style-position:outside;
	display:block;
	float:left;
    padding: 0;
    margin: 0;
}

h1, h2, h3, h4, h5, h6{
	padding:0;
	margin:0;
	font-weight:normal;
	color:#000
}

/* ----------------- structure ----------------- */

#wrapper{
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin:0;
	width:100%;
}

/* ----------------- header ----------------- */

#header, #content{
	margin: 0 auto;
	position: relative;
	width: 630px;
}

	#lang{
		float:right;
		height:15px;
	}
	
	#logo{
		clear:both;
		width:235px;
		height:125px;
		margin-left:-30px;
	}
	
	#menu{
		width:100%;
		height:30px;
		margin-top:25px;
	}
		
		#menu img.separator{
			margin: 0 20px;
			float:left;
		}
		
		#menu ul{
			width:100%;
		}
		
		#menu ul li{
			height:30px;
			line-height:30px;
			padding-left: 0px;
			display:list-item;
		}
		
		#menu ul li#nav-1.fr a{
			background:url(images/menu_profil_fr.jpg);
			width:100px;
		}
		#menu ul li#nav-1.en a{
			background:url(images/menu_profil_en.jpg);
			width:100px;
		}
		
		#menu ul li#nav-2.fr a{
			background:url(images/menu_services_fr.jpg);
			width:100px;
		}
		#menu ul li#nav-2.en a{
			background:url(images/menu_services_en.jpg);
			width:100px;
		}
		
		#menu ul li#nav-3.fr a{
			background:url(images/menu_clients_fr.jpg);
			width:139px
		}
		#menu ul li#nav-3.en a{
			background:url(images/menu_clients_en.jpg);
			width:137px
		}
		
		#menu ul li#nav-4.fr a{
			background:url(images/menu_coordonees_fr.jpg);
			width:159px
		}
		#menu ul li#nav-4.en a{
			background:url(images/menu_coordonees_en.jpg);
			width:110px
		}
		
		#menu ul li a{
			background-position: 0 0 !important;
			text-indent:-9999px;
			display:block;
			height:30px
		}
		#menu ul li a:hover, #menu ul li a.active{
			background-position: 0 -30px !important;
		}
		
		#menu ul li#nav-2,  #menu ul li#nav-3, #menu ul li#nav-4{
			margin-left:5px;
			padding-left:5px;
		}
		#menu ul li#nav-1,  #menu ul li#nav-2,  #menu ul li#nav-3{
			margin-right:5px;
			padding-right:20px
		}
			
		#menu ul li#nav-2, #menu ul li#nav-4{
			list-style-image: url(images/menu_dot_yellow.jpg);
		}
		
		#menu ul li#nav-3{
			list-style-image: url(images/menu_dot_pink.jpg);
		}
		
/* ----------------- content ----------------- */
	
#content{
	background-color:#F5F5F5;
	margin-top:10px;
	padding:0 60px 40px;
	width:510px;
}

	#content img.titre{
		display:block;
		margin-left:-127px;
		padding-top:30px;
		height: 75px;
	}
	
	#content img.txt{
		display:block;
		padding:20px 0 10px;
	}
	
	#content p, #content ul{
		padding-top:10px
	}
	
	#content ul{
		 list-style-position: outside;
		 margin:3px 3px 10px 8px;
		 padding: 0 2px 0 5px;
		 text-indent: 10px;
		 float:none;
	}
	
	#content ul li{
		display: list-item;
		list-style-image: url(images/dot_pink.jpg);
		float:none;
		padding-bottom:10px
	}
	
	#content ul li.yellow{
		list-style-image: url(images/dot_yellow.jpg);
	}
	
	#content span.info{
		color:#DD808D;
		font-weight:bold;
		display:block
	}
	
/* ----------------- accueil ----------------- */

#logo-h{
	background:url(images/binocle_logo_home.jpg);
	width:360px;
	height:200px;
	margin:100px auto 0;
}

#services-h{
	background:url(images/binocle_activites.gif);
	width:580px;
	height:80px;
	margin:30px auto
}

#lang-h{
	width:224px;
	margin: 0 auto
}

	#lang-h img{
		display:block;
		float:left;
	}
	
	#lang-h img#slash{
		margin-top:-5px;
		padding:0 20px
	}
	
.invisible{
	display:none
}

/* ----------------- sondage ----------------- */
form.sondage{
	margin: 20px;
}

label {
	float:left;
}

td.label {
	width:380px;
}

textarea{
	float: right;
    height: 90px;
    width: 360px;
}

.input {
	clear:both;
}

table {
	margin-bottom:20px;
}