/* --------------------------------------------------- */
/* --------------------- www.allandurand.fr stylesheet */
body{
	margin:0;
	padding:0;
	min-width:900px;
	font-family: Arial, Helvetica, sans-serif;
	background-color:#FFFFFF;
}
/* --------------- enlever les pointillées */
a { 
	padding:0;
	margin:0;
	outline:none;
}
/* --------------- pendant chargement alt */
img{
	padding:0;
	margin:0;
	color:#555;
	font-size:11px;
	border: none 0px;
}
.vignette{
	display:block;
	width:400px;
	height:240px;
}
.vignette_info{
	display:block;
	width:400px;
	height:100px;
}
/* --------------- ancres de la page laboratoire */
.repere{
	margin-top:-150px;
	position:absolute;
}
.box_javascript{
	width:500px;
		height:500px;
		background-color:#FF00FF;

}
/* --------------------------------------------------- */
/* -------------------------------------------- HEADER */
.haut{
	display:none;
	position:fixed;
	top:0;
	left:0;
	margin:0;
	padding:0;
	width:100%;
	height:auto;
	z-index:1;
	min-width:1100px;/* pour bloquer le bouton retour au niveau du titre */
}
* html .haut {/* HACK <= IE 6 */
	position:absolute;
}
.header{
	padding:20px 20px 20px 20px;
	background-color:#FFFFFF;
}
.bloc_header{
	padding:0;
	margin-top:-10px;
}
.ombre{
	height:10px;
	background-image:url('../webdesigner-saint-etienne/_image/ombre.png');
	background-repeat:repeat-x;
	background-position:left bottom;
}
* html .ombre {/* HACK <= IE 6 */
	position:absolute;
	height:0px;
	background-image:url('');
}
/* --------------- mon icone AL */
.icone{
	margin-top:-4px;
	margin-left:-5px;
	padding:0;
	width:65px;
	height:auto;
	float:left;
}
/* --------------- gros titre */ 
h1{
	padding:0;
	margin-left:75px;
	margin-top:10px;
	font-size:12px;
	font-weight:900;
	color:#555555;
}
*+html h1 {/* HACK IE 7 */
	padding-top:7px;
}
* html h1 {/* HACK <= IE 6 */
	padding:8px 0px 0px 0px;
}
/* --------------- descriptif sous le titre */
.descriptif{
	margin-top:-5px;
	margin-left:75px;
	height:auto;
	line-height:14px;
    color:#777777;
    font-size:11px;
}
*+html .descriptif {/* ----------------- HACK IE 7 */
	margin-top:-14px;
}
* html .descriptif {/* ----------------- HACK <= IE 6 */
	margin-top:-15px;
}
/* --------------------------------------------------- */
/* ---------------------------------------------- MENU */
.menu{
	display:block;
	margin-top:-10px;
	margin-left:80px;
	width:auto;
	height:30px;
	font-size:12px;
}
.bouton{
	overflow:hidden;
	display:block;
	float:left;
	width:200px;
	height:40px;
	margin-left:-10px;
	color:#777777;
	text-decoration:none;
	background-image:url('../webdesigner-saint-etienne/_image/bt_derriere.png');
	background-repeat:no-repeat;
}
* html .bouton {/* ----------------- HACK <= IE 6 */
	width:180px;
	height:30px;
	margin-left:5px;
	background-image:url('../webdesigner-saint-etienne/_image/bt_derriere_ie.jpg');
}
.bouton:hover{
	color:#333333;
}
.bouton_texte{
	display:block;
	margin-top:9px;
	text-align:center;
}
#selectionne{
	color:#333333;
	text-decoration:none;
	background-image:url('../webdesigner-saint-etienne/_image/bt_devant.png');
	background-repeat:no-repeat;
}
* html #selectionne {/* ----------------- HACK <= IE 6 */
	background-image:url('../webdesigner-saint-etienne/_image/bt_devant_ie.jpg');
}
/* ----------------------------------------------------------- */
/* --------------------------------------------- BOUTON RETOUR */
.bouton_retour{
	position:absolute;
	width:210px;
	height:40px;
	right:50px;
	top:-1px;
	background-image:url('../webdesigner-saint-etienne/_image/bt_retour.jpg');
	background-repeat:no-repeat;
}
a#lien_retour{
	font-size:12px;
	color:#333333;
	text-decoration:none;
}
#texte_retour{
	display:block;
	text-align:left;
	margin-left:40px;
	margin-top:9px;
}
/* ----------------------------------------------------------- */
/* ------------------------------------------ DIV RƒALISATIONS */
.realisations{
	display:none;
	padding:0;
	margin-top:150px;
	margin-left:70px;
	min-width:900px;
}
*+html .realisations {/* HACK IE 7 */
	position:relative;
	top:110px;
}
/* ----------------------------------------- */
/* --------------------------------- LES BOX */
/* --------------- box noir */
.box {
	overflow:hidden;
	padding:0;
	float:left;
	margin-top:20px;
	margin-left:10px;
	width:400px;
	height:240px;
	border:solid 1px #ccc;
}
/* --------------- box blanche */
.box_info {
	overflow:hidden;
	padding:0px;
	position:relative;
	float:left;
	margin-top:20px;
	margin-left:10px;
	width:400px;
	height:auto;
	background-color:#FFFFFF;
	border:solid 1px #ccc;
}
/* --------------- angle sur box noir */
.angle_vignette{
	position:absolute;
	margin-left:350px;
	width:50px;
	height:50px;
	/*background-image:url('../webdesigner-saint-etienne/_image/angle_vignette.png');*/
	background-image:url('../webdesigner-saint-etienne/_image/angle_vignette_fond_blanc.png');
	background-repeat:no-repeat;
}
* html .angle_vignette {/* HACK <= IE 6 */
	margin-left:360px;
	width:40px;
	height:40px;
	background-image:url('../webdesigner-saint-etienne/_image/angle_vignette_ie.jpg');
}/* --------------- angle sur box blanche */
.angle_vignette_blanc{
	position:absolute;
	margin-left:350px;
	width:50px;
	height:50px;
	background-image:url('../webdesigner-saint-etienne/_image/angle_vignette_blanc.png');
	background-repeat:no-repeat;
}
* html .angle_vignette_blanc {/* HACK <= IE 6 */
	margin-left:360px;
	width:40px;
	height:40px;
	background-image:url('../webdesigner-saint-etienne/_image/angle_vignette_blanc_ie.jpg');
}
/* --------------- ombre sur la vignette */
.ombre_vignette{
	margin:0;
	padding:0;
	width:400px;
	height:10px;
	background-image:url('../webdesigner-saint-etienne/_image/ombre_bas.png');
	background-repeat:repeat-x;
}
* html .ombre_vignette {/* HACK <= IE 6 */
	height:0px;
	background-image:url('');
}
/* --------------- ombre sur la vignette de box blanche */
.ombre_vignette_info{
	position:absolute;
	margin-top:90px;
	width:400px;
	height:10px;
	background-image:url('../webdesigner-saint-etienne/_image/ombre_bas.png');
	background-repeat:repeat-x;
}
* html .ombre_vignette_info {/* HACK <= IE 6 */
	height:0px;
	background-image:url('');
}
/* --------------- texte d'une box noir */
.texte_box{
	position:relative;
	margin-top:-45px;
	width:400px;
	line-height:15px;
	font-size:11px;
	color:#555555;
}
.texte{
	position:relative;
	margin:0;
	padding:10px 10px 10px 10px;
	background-color:#FFFFFF;
}
.texte_info{
	position:relative;
	margin:0;
	padding:10px 10px 10px 10px;
	background-color:#FFFFFF;
}
.texte_plus{
	color:#999999;
}
.date{
	position:relative;
	float:right;
	margin-top:-25px;
	padding:0;
	text-align:right;
	color:#999999;
}
/* --------------- texte d'une box blanche */
.texte_box_info{
	position:relative;
	margin-top:-10px;
	width:400px;
	line-height:15px;
	font-size:11px;
	color:#555555;		
}
/* --------------- texte d'une box blanche */
.texte_box_plan{
	position:relative;
	
	width:400px;

	line-height:19px;
	font-size:11px;
	color:#555555;
}
/* --------------- titre des box */
h2{
	padding:0 0 10px 0;
	margin:0;
	font-size:15px;
	font-weight:900;
	color:#999999;
}
/* --------------- sous-titre des box blanches */
h3{
	margin-top:26px;
	padding:0;
	font-size:13px;
	font-weight:900;
	color:#444444;
}
/* ---------------------------------------------------------- */
/* -------------------------------------------- FLASH CONTENT */
.conteneur{
	display:none;
	position:absolute;
	margin:0;
	padding:0;
	width:100%;
	height:100%;
	top:101px;
	bottom:0px;
	min-width:900px;
	background-color:#111111;
}
.conteneurFlash{
	display:none;
	position:absolute;
	margin:0;
	padding:0;
	width:100%;
	height:100%;
	top:101px;
	bottom:28px;
	height:auto;
	min-width:900px;
}
.need_flash {
	padding:0;
	margin-top:0;
	margin-left:70px;
}
/* --------------------------------------------------- */
/* -------------------------------------- FOOTER / BAS */
.bas{
	display:none;
	position:fixed;
	bottom:0;
	left:0;
	margin:0px;
	padding:0px;
	width:100%;
	height:auto;
	z-index:2;
}
* html .bas {/* HACK <= IE 6 */
	position:static;
}
.footer{
	padding:2px 0px 5px 0px;
	height:20px;
	background-color:#FFFFFF;
	color:#555555;
}
.ombre_bas{
	height:10px;
	background-image:url('../webdesigner-saint-etienne/_image/ombre_bas.png');
	background-repeat:repeat-x;
	background-position:left top;
}
* html .ombre_bas {/* HACK <= IE 6 */
	display:none;
}
.informations{
	float:left;
	position:relative;
	padding:5px 0px 0px 0px;
	margin-left:20px;
    color:#555555;
    font-size:10px;
    background-color:#FFFFFF;
}
.p_icone{
	float:left;
	position:relative;
	margin:0;
	padding:3px 5px 3px 5px;
	background-color:#FFFFFF;
}
/* ---------------------------------------------- */
/* -------------------------------- VIDEO YOUTUBE */
#video{
	padding:20px 10px 0px 20px;
}
#galerie{
	margin:0;
	padding:10px 20px 20px 20px;
}
/* ------------------------------------------ */
/* -------------------------------- LES LIENS */
a.lien_site{
	margin:0;
	padding:2px 10px 2px 10px;
	background-color:#999999;
	text-decoration:none;
	color:#FFFFFF;
}
a.lien_site:hover{
	background-color:#444444;
}
a.lien_descriptif{
	color:#777777;
}
a.lien_descriptif:hover {
	text-decoration:none;
}
/* --------------- liens des box noir */
a.petit_lien{
	color:#555555;
}
a.petit_lien:hover {
	text-decoration:none;
}
/* --------------- liens sur fond blanc */
a.petit_lien_info{
	color:#555555;
    font-size:11px;
}
a.petit_lien_info:hover {
	text-decoration:none;
}
/* --------------- liens du bas */
a.petit_lien_bas{
	color:#555555;
    font-size:10px;
}
a.petit_lien_bas:hover {
	text-decoration:none;
}
/* --------------- liens du plan du site */
a.lien_direct{
	margin-bottom:10px;
	color:#555555;
    font-size:12px;
    text-decoration:none;
}
a.lien_direct:hover {
	text-decoration:underline;
}
/* --------------- liens du plan du site */
a.lien_sous_direct{
	margin-left:10px;
	color:#888888;
    font-size:12px;
    text-decoration:none;
}
a.lien_sous_direct:hover {
	text-decoration:underline;
}
/* --------------- pour empecher la derniere vignette de toucher le bas de l écran */
.bloc_bas{
	clear:both;
	height:100px;
	width:1px;
}