@media all {
/* HTML5 RESET */

html, /*body,*/ body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}									
/*
article, aside, figure, footer, header, hgroup, nav, section {display: block;}  */

/* Responsive images and other embedded objects
   Note: keeping IMG here will cause problems if you're using foreground images as sprites.
   If this default setting for images is causing issues, you might want to replace it with a .responsive class instead. */
img,
object,
embed {max-width: 100%;}

/* force a vertical scrollbar to prevent a jumpy page */
html {overflow-y: scroll;}

/* we use a lot of ULs that aren't bulleted. 
	don't forget to restore the bullets within content. */
ul {list-style: none;}

blockquote, q {quotes: none;}

blockquote:before, 
blockquote:after, 
q:before, 
q:after {content: ''; content: none;}

a {margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent;}

del {text-decoration: line-through;}

abbr[title], dfn[title] {border-bottom: 1px dotted #000; cursor: help;}

/* tables still need cellspacing="0" in the markup */
table {border-collapse: collapse; border-spacing: 0;}
th {font-weight: bold; vertical-align: bottom;}
td {font-weight: normal; vertical-align: top;}

hr {display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0;}

input, select {vertical-align: middle;}

pre {
	white-space: pre; /* CSS2 */
	white-space: pre-wrap; /* CSS 2.1 */
	white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
	word-wrap: break-word; /* IE */
}

input[type="radio"] {vertical-align: text-bottom;}
input[type="checkbox"] {vertical-align: bottom; *vertical-align: baseline;}
.ie6 input {vertical-align: text-bottom;}
select, input, textarea {font: 99% sans-serif;}
table {font-size: inherit; font: 100%;}
 
/* Accessible focus treatment
	people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active {outline: none;}
small {font-size: 85%;}
strong, th {font-weight: bold;}
td, td img {vertical-align: top;} 

/* Make sure sup and sub don't screw with your line-heights
	gist.github.com/413930 */
sub, sup {font-size: 75%; line-height: 0; position: relative;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}

/* standardize any monospaced elements */
pre, code, kbd, samp {font-family: monospace, sans-serif;}

/* hand cursor on clickable elements */
.clickable,
label, 
input[type=button], 
input[type=submit], 
button {cursor: pointer;}

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea {margin: 0;}

/* make buttons play nice in IE */
button {width: auto; overflow: visible;}
 
/* scale images in IE7 more attractively */
.ie7 img {-ms-interpolation-mode: bicubic;}

/* prevent BG image flicker upon hover */
.ie6 html {filter: expression(document.execCommand("BackgroundImageCache", false, true));}

/* let's clear some floats */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }  
.clearfix:after { clear: both; }  
.clearfix { zoom: 1; }  
	
		
}

/*GENERIQUE!
-------------------------------------------------------------------------------*/
body {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-family: 'ubunturegular';
	background: url(orythie-plan4.png) no-repeat;
	background-color: #d4d5d6;
	background-attachment: fixed;
	background-position: right top;
}

/*Zone menu top----------------------------------------------------------------------------------*/
.logo {
	position: fixed;
	top: -15px;
	left: 2%;
	padding: 1em;
	width: 15%;
	z-index: 18;
	text-align: center;
}
.nav {
	position: relative; 
	display: inline-block;
	Left: 20%;
	right: 20%;
	margin-left: auto;
	margin-right: auto;
	color: #797979;
}
#intranav { 
	position: fixed;
	text-align: center;
	height: 40px;
	top: 0;
	padding: 0;
	width: 100%;
	background-color: #797979;
	z-index: 10;
	-moz-box-shadow: 0 0 20px rgba(69,69,69,0.7);
	-webkit-box-shadow: 0 0 20px rgba(69,69,69,0.7);
	box-shadow: 0 0 20px rgba(69,69,69,0.7);
}

.drapeau {
	position: fixed;
	z-index: 19;	
	top: 5px;
	right: 5px;	
}

/*Corps & zone centrale!
-------------------------------------------------------------------------------*/
/*Fil d'Ariane*/
.breadcrumb  {
	display: inline-block;
}
.breadcrumb-vide  {
	display: inline-block;
}
small {
	font-size: 0.9em;
	color:#aaa;
	}
.conteneur-fil {
	display: inline-block;
	position: relative;
	left: -50px;
	padding: 5px 15px 5px 10px;
	margin-top: 250px;
	margin-left: 25%;
	max-width: 50%;
	background: rgba(244, 244, 244, 0.4);
	z-index: 1;
	font-size: 0.8em;
	color: #aaa;
	-moz-box-shadow: 0 0 5px rgba(69,69,69,0.1);
	-webkit-box-shadow: 0 0 5px rgba(69,69,69,0.1);
	box-shadow: 0 0 5px rgba(69,69,69,0.1);
	-moz-border-radius-topright: 20px;
	border-top-right-radius: 20px;
}
.conteneur-fil a {
    font-family: 'ubunturegular';
}
.conteneur-fil a:link {
	color: #888;
	text-decoration: none;
}
.conteneur-fil a:visited {
	text-decoration: none;
	color: #888;
}
.conteneur-fil a:hover {
	text-decoration: none;
	color: #555;
}
.conteneur-fil a:active {
	text-decoration: none;
	color: #444;
}

/*"body"-------------------------------------------------------------------------------------------------------------*/
.logos-conteneur, 
.body-conteneur {
	width: 50%;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 50px;
	background: rgba(244, 244, 244, 0.8);
	z-index: 2;
	padding: 20px 50px 20px 50px;
	-moz-box-shadow: 0 0 10px rgba(69,69,69,0.2);
	-webkit-box-shadow: 0 0 10px rgba(69,69,69,0.2);
	box-shadow: 0 0 10px rgba(69,69,69,0.2);
	line-height: 1.2em;
	-moz-border-radius-bottomleft: 25px;	border-bottom-left-radius: 25px;
	-moz-border-radius-bottomright: 25px;	border-bottom-right-radius: 25px;
	-moz-border-radius-topright: 25px;	border-top-right-radius: 25px;
}
.intro {
	padding: 20px 20px 20px 20px;
	font-size: 0.95em;
	line-height: 1.3em;
	background-color: rgba(255,255,255,0.4);
	margin-bottom: 25px;
	-moz-border-radius-bottomleft: 10px;	border-bottom-left-radius: 10px;
	-moz-border-radius-bottomright: 10px;	border-bottom-right-radius: 10px;
	-moz-border-radius-topleft: 10px;	border-top-left-radius: 10px;
	-moz-border-radius-topright: 10px;	border-top-right-radius: 10px;
	-moz-box-shadow: inset 0 0 25px rgba(255,255,255,0.5), 0 2px 10px rgba(161,161,161,0.1);
	-webkit-box-shadow: inset 0 0 25px rgba(255,255,255,0.5), 0 2px 10px rgba(161,161,161,0.1);
	box-shadow: inner 0 0 25px rgba(255,255,255,0.5), 0 2px 10px rgba(161,161,161,0.1);
}

/*Titraille-------------------------------------------------------------------------------------------------------*/
.titre {
	padding: 20px 10px 10px 0;
	font-size: 1.3em;
	margin-bottom: 15px;
	color: #000;
	text-shadow: -1px 0 0 #fff, 1px 0 0 #fff, 0 -1px 0 #fff, 0 1px 0 #fff, 0 2px 5px rgba(0,0,0,0.3);
}
.titre#hydraulique {
	color: #0688f6;
}
.titre#acoustique {
	color: #F43700;
}
.titre#prototypes {
	color: #B11DA7;
}
.titre#sociologie {
	color: #00aa00;
}
.titre#enceintes {
	color: #faa21b;	
}
.titre#societe {
	color: #000000;
}
.sous-titre {
	font-size: 1.1em;
	margin-bottom: 10px;
	padding-top: 5px;
	color: #111;
	text-shadow: 0 -1px 0 #fff, 0 1px 3px rgba(0,0,0,0.3);
}

/*tableaux horizontaux (équipe / logos)----------------------------------------------------------------------------------------------------------*/
.logos-conteneur {
	margin-top: -25px;
}
.team-orythie, 
.logos-ligne {
	width: 100%;
	background-color: rgba(255,255,255,0.2);
	margin-bottom: 25px;
	-moz-border-radius-bottomleft: 10px;	border-bottom-left-radius: 10px;
	-moz-border-radius-bottomright: 10px;	border-bottom-right-radius: 10px;
	-moz-border-radius-topleft: 10px;	border-top-left-radius: 10px;
	-moz-border-radius-topright: 10px;	border-top-right-radius: 10px;
	-moz-box-shadow: inset 0 0 25px rgba(255,255,255,0.4), 0 2px 10px rgba(161,161,161,0.1);
	-webkit-box-shadow: inset 0 0 25px rgba(255,255,255,0.4), 0 2px 10px rgba(161,161,161,0.1);
	box-shadow: inner 0 0 25px rgba(255,255,255,0.4), 0 2px 10px rgba(161,161,161,0.1);
}
.orythien, 
.logo-bloc,  {
	margin: 2px;
	padding: 5px;
	background-color: rgba(255,255,255,0.6);
	-moz-box-shadow: inset 0 0 5px rgba(255,255,255,0.6), 0 1px 2px rgba(161,161,161,0.2);
	-webkit-box-shadow: inset 0 0 5px rgba(255,255,255,0.6), 0 1px 2px rgba(161,161,161,0.2);
	box-shadow: inner 0 0 5px rgba(255,255,255,0.6), 0 1px 2px rgba(161,161,161,0.2);
}

.orythien a:link {
	text-decoration: none;
}
.orythien p {
	margin-bottom: 10px;
	font-size: 0.9em;
	text-transform: uppercase;
	text-decoration: none;
	text-align: center;
	line-height: 1.3em;
}
.orythien img, .logo-bloc img {
	width: 97%;
	height: auto;
	border: thin #999;
	margin-bottom: 6px;
	margin-top: 7px;
}
.team-orythie td {
	position: center;
	width: 20%;
}

.orythien img,  
.logo-bloc img, 
.plan img, 
.orythien, 
.logo-bloc {
	-moz-border-radius-bottomleft: 5px;	border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;	border-bottom-right-radius: 5px;
	-moz-border-radius-topleft: 5px;	border-top-left-radius: 5px;
	-moz-border-radius-topright: 5px;	border-top-right-radius: 5px;
}

/*Attributs listes---------------------------------------------------------------------------------------------*/
.body-conteneur ul {
	padding-left: 1em;
	margin-bottom: 25px;
	margin-top: -10px;
}
.intro ul {
	padding-left: 1em;
	margin-bottom: 10px;
	margin-top: -10px;
}
.body-conteneur ul li,
.intro ul li {
	list-style-position: inside;
	font-size: 0.95em;
	line-height: 1.5em;
	color: #666;
}
.body-conteneur ul li#hydraulique,
.intro ul li#hydraulique {
	list-style-image: url(../css/puce-bleue.png);
}
.body-conteneur ul li#acoustique,
.intro ul li#acoustique {						/*pas necessaire car cascading, valery*/
	list-style-image: url(../css/puce-rouge.png);
}
.body-conteneur ul li#prototypes,
.intro ul li#prototypes {						/*pas necessaire car cascading, valery*/
	list-style-image: url(../css/puce-mauve.png);
}
.body-conteneur ul li#sociologie,
.intro ul li#sociologie {						/*pas necessaire car cascading, valery*/
	list-style-image: url(../css/puce-verte.png);
}
.body-conteneur ul li#enceintes,
.intro ul li#enceintes {						/*pas necessaire car cascading, valery*/
	list-style-image: url(../css/puce-jaune.png);
}
.body-conteneur ul li#societe,
.intro ul li#societe {						        /*pas necessaire car cascading, valery*/
	list-style-image: url(../css/puce-noire.png);
}

/*BLOCS ILLUSTRATIFS---------------------------------------------------------------------------------------------*/
/*divs*/
.blocleft, 
.blocright {
	display: inline-block;
	max-height: auto;
 	width: 100%;
	margin-bottom: 5px;
}
.blocleft, 
.blocright, 
.bloctable {
	-moz-box-shadow: inset 0 0 10px rgba(255,255,255,1), 0 0 25px rgba(161,161,161,0.1);
	-webkit-box-shadow: inset 0 0 10px rgba(255,255,255,1), 0 0 25px rgba(161,161,161,0.1);
	box-shadow: inner 0 0 10px rgba(255,255,255,1), 0 0 25px rgba(161,161,161,0.1);
}
.bloctable2 {
	-moz-box-shadow: inset 0 0 20px rgba(255,255,255,0.3), 0 0 25px rgba(161,161,161,0.1);
	-webkit-box-shadow: inset 0 0 20px rgba(255,255,255,0.3), 0 0 25px rgba(161,161,161,0.1);
	box-shadow: inner 0 0 20px rgba(255,255,255,0.3), 0 0 25px rgba(161,161,161,0.1);
}
.blockcentered {					
	margin-bottom: 25px;	
}
.blocleft, 
.blocright, 
.blockcentered {					
	background-color: rgba(255,255,255,0.4);
	-moz-border-radius-bottomleft: 10px;	border-bottom-left-radius: 10px;
	-moz-border-radius-bottomright: 10px;	border-bottom-right-radius: 10px;
	-moz-border-radius-topleft: 10px;	border-top-left-radius: 10px;
	-moz-border-radius-topright: 10px;	border-top-right-radius: 10px;
}
.body-full-illustration {
	width: 100%;
	margin-bottom: 25px;
	text-align: center;
	font-size: 0.9em;
	line-height: 1.2em;
}
.body-full-illustration img {
	width: 100%;
	height: auto;
	-moz-border-radius-bottomleft: 10px;	border-bottom-left-radius: 10px;
	-moz-border-radius-bottomright: 10px;	border-bottom-right-radius: 10px;
	-moz-border-radius-topleft: 10px;	border-top-left-radius: 10px;
	-moz-border-radius-topright: 10px;	border-top-right-radius: 10px;
}
.cale {
	margin-bottom: 20px;
}

/*Images ----------------------------------------------------------------------------------------------------*/
.blocleft img {
	margin: 15px 0 15px -15px;
}
.blocright img {
	margin: 15px;
}
.blocright img, 
.blocleft img {
	width: 100%;
	max-height: auto;
	-moz-border-radius-bottomleft: 5px;	border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;	border-bottom-right-radius: 5px;
	-moz-border-radius-topleft: 5px;	border-top-left-radius: 5px;
	-moz-border-radius-topright: 5px;	border-top-right-radius: 5px;
	/*z-index:20;									/*valery*/
	/*transition-property:width,height,z-index;					/*valery : j'ai pas réussi, sans doute parce que calculé*/
	/*transition-duration:0.5s;							/*valery*/
}
.blocleft0 img:hover, 				
.blocright0 img:hover {
	position: absolute;								/*hé hé hé, je t'ai bien eu !!! */
	margin-top:-100px;
	margin-left:-150px;
	width: 600px;
	height: 300px;
	z-index:100;
	border:3px solid rgba(0,0,0,0.7);
}
.blockcentered img {
	display: inline-block;
	-moz-border-radius-bottomleft: 10px;	border-bottom-left-radius: 10px;
	-moz-border-radius-bottomright: 10px;	border-bottom-right-radius: 10px;
	-moz-border-radius-topleft: 10px;	border-top-left-radius: 10px;
	-moz-border-radius-topright: 10px;	border-top-right-radius: 10px;
	width: 100%;
	height: auto;
}

/*Tableaux*/
.bloctable {
	display: inline-block;
	font-size: 0.8em;
	line-height: 1.2em;
	background-color: rgba(255,255,255,0.6);
	margin-bottom: 25px;
	-moz-border-radius-bottomleft: 10px;	border-bottom-left-radius: 10px;
	-moz-border-radius-bottomright: 10px;	border-bottom-right-radius: 10px;
	-moz-border-radius-topleft: 10px;	border-top-left-radius: 10px;
	-moz-border-radius-topright: 10px;	border-top-right-radius: 10px;
	width: 100%;
	padding-top: 15px;
	padding-bottom: 15px;
	color: #666;
}
.bloctable2 {
	display: inline-block;
	font-size: 0.8em;
	line-height: 1.3em;
	background-color: rgba(255,255,255,0.2);
	margin-bottom: 25px;
	-moz-border-radius-bottomleft: 10px;	border-bottom-left-radius: 10px;
	-moz-border-radius-bottomright: 10px;	border-bottom-right-radius: 10px;
	-moz-border-radius-topleft: 10px;	border-top-left-radius: 10px;
	-moz-border-radius-topright: 10px;	border-top-right-radius: 10px;
	width: 100%;
	padding-top: 15px;
	padding-bottom: 15px;
	color: #666;
	vertical-align: middle;
	text-align: center;
}
.bloctable-line {
	display: block;
	width: 100%;
	padding: 2px 0 2px 0;
	vertical-align:top;
}
.bloctable-cell-g {
	display: inline-block;
	width: 40%;
	padding-left: 25px;
	vertical-align:top;
}
.bloctable-cell-d {
	display: inline-block;
	width: 40%;
	padding-right: 25px;
}
.bloctable-cell-d input {
	//position:absolute;
	//position:relative;
	width: 130% ;
	//background-color: rgba(0,255,255,0.6);
}
.bloctable-cell-d input[type=radio] {
	//display: inline;
	width: 10% ;	
}
.bloctable-cell-d textarea {	
	width: 135%;
}
.bloctable-cell-d label {
	//position:relative;	
	//float:left;	
	//display: inline;
	display:block;
	//overflow:auto;
}


/*Paragraphes*/
.blocleft p {
	margin: 15px 0 10px 15px;
	padding-right: 30px;
}
.blocright p {
	margin: 15px;
	padding-left: 15px;
}

/*ATTRIBUTS TEXTES*/
a:link, a:visited {
	color: #666;
	text-decoration: none;
}
a:hover, a:active {
	text-decoration: none;
	color: #000;
}

/*Paragraphes génériques*/
p {
	margin-bottom: 25px;
	color: #666;
	font-size: 0.95em;
	text-decoration: none;
}
p a:link {
	color: #666;
	text-decoration: none;
}
p a:visited {
	text-decoration: none;
	color: #666;
}
p a:hover {
	text-decoration: none;
	color: #000;
	background-color: transparent;
}
p a:active {
	text-decoration: none;
	color: #000;
}

/*Text-select*/
body, select, input, textarea {color: #333;}
a, a:hover {color: #333;}
::-moz-selection{background: #000; color: #fff; text-shadow: none;}
::selection {background: #000; color: #fff; text-shadow: none;} 
a:link {-webkit-tap-highlight-color: #000;} 
ins {background-color: #fcd700; color: #000; text-decoration: none;}
mark {background-color: #fcd700; color: #000; font-style: italic; font-weight: bold;}

#cite {
	font-family: 'ubuntu_lightitalic';
	color: #666;
	font-size: 0.85em;
	text-decoration: none;
}
#commentaire0 {					/*valery, viré car suivant reprit de ea */
	padding: 0 10px 0 10px;
	color: #666;
	font-size: 0.75em;
	line-height: 1em;
	text-decoration: none;
	margin-bottom: 10px;
	margin-top: -10px;
	text-align: justify;
}
#commentaire {
	padding: 0 10px 0 10px;
	color: #999;
	font-size: 0.8em;
	line-height: 1.2em;
	text-decoration: none;
	margin-bottom: 25px;
	margin-top: -15px;
	text-align: justify;
}
#client {
	color: #999;
	margin-left: 5px;
}
input, 
textarea,
champfile {
	background-color: rgb(255, 255, 255);
	border: none;
	}
input.champfile {	
	width: 100%;

}
input.bouton {	
	width: 100px;
}
input.bouton,
input.champfile {	
	background-color: rgba(99,99,99,0.3);
	color: #fff;	
	cursor: pointer;
	/*width: 100px;*/	
	padding: 5px;
	-moz-border-radius-bottomleft: 5px;	border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;	border-bottom-right-radius: 5px;
	-moz-border-radius-topleft: 5px;	border-top-left-radius: 5px;
	-moz-border-radius-topright: 5px;	border-top-right-radius: 5px;
	text-decoration: none;
	}
input.bouton:hover,
input.bouton:active {
	background-color: rgba(25,25,25,0.4);		
	}
	

/*ZONE FOOTER!
-------------------------------------------------------------------------------*/
.footer {
	position: fixed;
	bottom: 0;
	padding: 0;
	width: 100%;
	background-color: #797979;
	z-index: 9;
	height: 30px;
	-moz-box-shadow: 0 0 20px rgba(69,69,69,0.7);
	-webkit-box-shadow: 0 0 20px rgba(69,69,69,0.7);
	box-shadow: 0 0 20px rgba(69,69,69,0.7);
	text-align: center;
	vertical-align: baseline;
}
#intrafooter {
	postion: relative; 
	display: inline-block;
	width: 50%;
	height: 100%;
	margin-left: auto;
	margin-right: auto;
	color: #c7c7c7;
	/*margin-top: 0.7em;*/
	/*padding: 0 50px 0 50px;*/
	font-size: 0.8em;
}
#footer-orythie {
	position: relative;
	display: inline-block;
	float: left;
}
#mini-logo-orythie {
	position: relative;
	display: inline-block;
	float: left;
}
#copyright {
	position: relative;
	display: inline-block;
	float: right;
	height: 100%;
	vertical-align: middle;
	right: -50px;
}
#copyright a, #footer-orythie a {
	position: relative;
	padding: 8px 10px 6px 10px;
	height: 100%;
	vertical-align: middle;
	display: block;
}
.footer a:link {
	color: #c7c7c7;
	text-decoration: none;
}
.footer a:visited {
	text-decoration: none;
	color: #c7c7c7;
}
.footer a:hover {
	text-decoration: none;
	color: #fff;
	background-color: #666;
}
.footer a:active {
	text-decoration: none;
	color: #c7c7c7;
}

/*MENU LATERAL GAUCHE!
-------------------------------------------------------------------------------*/

/*Boutons actifs*/
.menu-interne ul li#hydraulique-actif {
	background-color: #3d98e6;  
}
.menu-interne ul li#acoustique-actif {
	background-color: #e46039;
}
.menu-interne ul li#prototypes-actif {
	background-color: #b54dae;
}
.menu-interne ul li#sociologie-actif {
	background-color: #00aa00;
}
.menu-interne ul li#enceintes-actif {
	background-color: #e8ab4c;
}
.menu-interne ul li#societe-actif {
	background-color: #393939;
}
.menu-interne {
	position: fixed;
	top: 350px;
	left: 2.5%;
	padding: 0.5em;
	width: 15%;
	background: rgba(69,69,69,0.0);
	font-size: 0.95em;
	color: #999;
	line-height: 1.8em;
	text-align: right;
	z-index: 8;
}
.menu-interne ul {
	font-size: 0.95em;
	line-height: 2em;
	height: 2em;
	display: block;
	background-color: rgba(69,69,69,0.0);
	padding-right: 0.2em;
	padding-left: 0.2em;
	padding-top: 1px;
	padding-bottom: 1px;
	-moz-border-radius-bottomleft: 5px;	border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;	border-bottom-right-radius: 5px;
	-moz-border-radius-topright: 5px;	border-top-right-radius: 5px;
	-moz-box-shadow: 0 0 5px rgba(69,69,69,0.1);
	-webkit-box-shadow: 0 0 5px rgba(69,69,69,0.1);
	box-shadow: 0 0 5px rgba(69,69,69,0.1);
}
.menu-interne ul li {
	display: block;
	background-color: rgba(69,69,69,0.3);
	padding-left: 0.5em;
	padding-right: 0.5em;
	margin-top: 2px;
	margin-bottom: 3px;
	-moz-border-radius-bottomleft: 5px;	border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;	border-bottom-right-radius: 5px;
	-moz-border-radius-topright: 5px;	border-top-right-radius: 5px;
	width:auto;
}
.menu-interne ul li a {
		display: block;
		width:100%;
}
.menu-interne a {
    font-family: 'ubunturegular';
}
.menu-interne a:link {
	color: #fff;
	text-decoration: none;
}
.menu-interne a:visited {
	text-decoration: none;
	color: #fff;
}
.menu-interne a:hover {
	text-decoration: none;
	color: #fff;
}
.menu-interne ul li:hover {
	background-color: rgba(69,69,69,0.65);
	-moz-box-shadow: inset 0 0 5px rgba(0,0,0,0.1);
	-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.1);
	box-shadow: inner 0 0 5px rgba(0,0,0,0.1);	
}
.menu-interne ul li#enceintes:hover, 
.menu-interne ul li#hydraulique:hover, 
.menu-interne ul li#acoustique:hover, 
.menu-interne ul li#prototypes:hover,
.menu-interne ul li#sociologie:hover,
.menu-interne ul li#enceintes-actif, 
.menu-interne ul li#acoustique-actif,
.menu-interne ul li#prototypes-actif,
.menu-interne ul li#sociologie-actif,
.menu-interne ul li#societe-actif {
	-moz-box-shadow: inset 0 0 5px rgba(0,0,0,0.1);
	-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.1);
	box-shadow: inner 0 0 5px rgba(0,0,0,0.1);
}
.menu-interne ul li#hydraulique:hover,
.menu-interne ul li#hydraulique-actif:hover {
	background-color: #0688f6;
}
.menu-interne ul li#acoustique:hover,
.menu-interne ul li#acoustique-actif:hover {
	background-color: #F43700;
}
.menu-interne ul li#prototypes:hover, 
.menu-interne ul li#prototypes-actif:hover {
	background-color: #B11DA7;
}
.menu-interne ul li#sociologie:hover, 
.menu-interne ul li#sociologie-actif:hover {
	background-color: #17A117;
}
.menu-interne ul li#enceintes:hover,
.menu-interne ul li#enceintes-actif:hover {
	background-color: #FAA21B;
}
.menu-interne ul li#societe:hover,
.menu-interne ul li#societe-actif:hover {
	background-color: #000000;
}
.menu-interne a:active {
	text-decoration: none;
	color: #fff;
}

/*MENU LATERAL DROIT!
-------------------------------------------------------------------------------*/
.aside {
	position: fixed;
	padding: 0.5em;
	/*bottom: 130px;*/
	bottom: 50px;
	right: 2.5%;
	width: 15%;
	font-size: 0.8em;
	line-height: 1.5em;
	z-index: 7;

}
.aside ul {
	background-color: rgba(69,69,69,0.0);
	padding-right: 0.2em;
	padding-left: 0.2em;
	padding-top: 1px;
	padding-bottom: 1px;
	-moz-border-radius-bottomleft: 5px;
	border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	border-bottom-right-radius: 5px;
	-moz-border-radius-topright: 5px;
	border-top-right-radius: 5px;
	-moz-box-shadow: 0 0 5px rgba(69,69,69,0.1);
	-webkit-box-shadow: 0 0 5px rgba(69,69,69,0.1);
	box-shadow: 0 0 5px rgba(69,69,69,0.1);
}
.aside ul li {
	display: block;
	background-color: rgba(99,99,99,0.3);
	padding: 3px 5px 3px 5px;
	margin-top: 3px;
	margin-bottom: 3px;
	-moz-border-radius-bottomleft: 5px;
	border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	border-bottom-right-radius: 5px;
	-moz-border-radius-topright: 5px;
	border-top-right-radius: 5px;
}
.aside ul li a {
	display: block;
	width:100%;
}
.aside a:link {
	color: #fff;
	text-decoration: none;
}
.aside ul li#hydraulique:hover {		/*valery*/
	background-color: #0688f6;
}
.aside ul li#acoustique:hover {			/*valery*/
	background-color: #F43700;
}
.aside ul li#prototypes:hover {			/*valery*/
	background-color: #B11DA7;
}
.aside ul li#enceintes:hover {			/*valery*/
	background-color: #FAA21B;
}
.aside ul li#societe:hover {			/*valery*/
	background-color: #000000;
}
.aside ul li#externe:hover {			/*valery*/
	background-color: #888888;
}

/* Print styles!
-------------------------------------------------------------------------------*/
@media print {
.body-conteneur {
	width: 85%;
}
.conteneur-fil {	
	margin-top: 100px;
}
.nav {
	visibility: hidden;
	position: relative;
	display: inline-block;
	left: 20%;
	right: 20%;
	margin-left: auto;
	margin-right: auto;
	color: #797979;
}
.menu-interne {
	visibility: hidden;
	position: fixed;
	top: 350px;
	left: 2.5%;
	padding: 0.5em;
	width: 15%;
	background: rgba(69,69,69,0.0);
	font-size: 0.95em;
	color: #999;
	line-height: 1.8em;
	text-align: right;
	z-index: 8;
}
.aside {
	visibility: hidden;
	position: fixed;
	padding: 0.5em;
	/*bottom: 130px;*/
	bottom: 50px;
	right: 2.5%;
	width: 15%;
	font-size: 0.8em;
	line-height: 1.5em;
	z-index: 7;
}
}

/* Media queries!
-------------------------------------------------------------------------------*/

/* Consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/ */
@media screen and (min-height: 201px) and (max-height: 600px)  {
.menu-interne {
	top: 200px;
}
}
	
@font-face {
    font-family: 'ubuntu_lightregular';
    src: url('ubuntu-light-webfont.eot');
    src: url('ubuntu-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('ubuntu-light-webfont.woff') format('woff'),
         url('ubuntu-light-webfont.ttf') format('truetype'),
         url('ubuntu-light-webfont.svg#ubuntu_lightregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'ubuntu_lightitalic';
    src: url('ubuntu-lightitalic-webfont.eot');
    src: url('ubuntu-lightitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('ubuntu-lightitalic-webfont.woff') format('woff'),
         url('ubuntu-lightitalic-webfont.ttf') format('truetype'),
         url('ubuntu-lightitalic-webfont.svg#ubuntu_lightitalic') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'ubuntu_lightbold';
    src: url('ubuntu-medium-webfont.eot');
    src: url('ubuntu-medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('ubuntu-medium-webfont.woff') format('woff'),
         url('ubuntu-medium-webfont.ttf') format('truetype'),
         url('ubuntu-medium-webfont.svg#ubuntu_lightbold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'ubuntu_lightbold_italic';
    src: url('ubuntu-mediumitalic-webfont.eot');
    src: url('ubuntu-mediumitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('ubuntu-mediumitalic-webfont.woff') format('woff'),
         url('ubuntu-mediumitalic-webfont.ttf') format('truetype'),
         url('ubuntu-mediumitalic-webfont.svg#ubuntu_lightbold_italic') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'ubunturegular';
    src: url('ubuntu-regular-webfont.eot');
    src: url('ubuntu-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('ubuntu-regular-webfont.woff') format('woff'),
         url('ubuntu-regular-webfont.ttf') format('truetype'),
         url('ubuntu-regular-webfont.svg#ubunturegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'ubuntubold';
    src: url('ubuntu-bold-webfont.eot');
    src: url('ubuntu-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('ubuntu-bold-webfont.woff') format('woff'),
         url('ubuntu-bold-webfont.ttf') format('truetype'),
         url('ubuntu-bold-webfont.svg#ubuntubold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'ubuntubold_italic';
    src: url('ubuntu-bolditalic-webfont.eot');
    src: url('ubuntu-bolditalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('ubuntu-bolditalic-webfont.woff') format('woff'),
         url('ubuntu-bolditalic-webfont.ttf') format('truetype'),
         url('ubuntu-bolditalic-webfont.svg#ubuntubold_italic') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'ubuntuitalic';
    src: url('ubuntu-italic-webfont.eot');
    src: url('ubuntu-italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('ubuntu-italic-webfont.woff') format('woff'),
         url('ubuntu-italic-webfont.ttf') format('truetype'),
         url('ubuntu-italic-webfont.svg#ubuntuitalic') format('svg');
    font-weight: normal;
    font-style: normal;
}

@media all and (orientation: portrait) {
.footer {
	position: relative;
	margin-top: 50px;
}
.nav {
	left: 20%;
	right: 10%;
}
#intrafooter {
	width: 80%;
}
}

@media all and (orientation: landscape) {
.footer {
	//position: relative; 				/*valery : fait disparaitre le footer sur Argile */
	margin-top: 50px;
}
.nav {
	left: 20%;
	right: 10%;
}
#intrafooter {
	width: 80%;
}
}