/* CSS Document 
le système est normalement calé en haut et à gauche de l'écran pour dissimuler
des éléments qui deviennent visibles quand on le déplace.
Il est indispensable de masquer ces éléments avec un fond identique
au background et un z-index élevé. (mask1 et mask2) */
body{	
    background: #09131d;
		margin:0;
		padding:0; 
		font-family: verdana, helvetica, arial, sans-serif;
    font-size: 16px;
    color: black;
}

a:link {text-decoration: none;}
a:active {text-decoration: none;}
a:hover {text-decoration: none;}
a:visited {text-decoration: none;}
a img {border: none;}

header {
    position: relative;
    width: 100%;
    /*margin: auto;   */
    overflow: hidden;
    background-color: black;
    background-image: url(img/headbar.jpg);
} 

@font-face { font-family: 'archi'; src: url(img/arch.ttf); } 

header, section, #wrap2, .cc_menu, aside, footer, #gallery, #mnubox, article, books { border: solid 0px red; }  

#logo1 { 
    margin: auto;
    width: 1000px;
    height: 235px;
    margin-top: 2px;
    background-image: url('img/logo0.png');
}

.list {  
    float: right; 
}

.list ul {
    font-family: arial, helvetica, sans-serif;
    text-align: right;
    text-decoration: none;
    list-style-type: none;
    /*color: #b00;   */
    line-height: 24px;
}

.list1 a { 
    text-decoration: none;
    letter-spacing: 0.5px;
    font-size: 13px;
    font-weight: bold; 
    color: #579dd3;    
}
.list a:hover {
    color: #91cfff;  /* couleur des liens en survol */
}

.vline {
    /*background-repeat: no-repeat; */
    background-image: url('img/line1.jpg');
}

.vline_2{
    /*background-repeat: no-repeat;   */
    background-image: url('img/ball1.jpg');
}

.border_blu { border: 1px solid #579dd3;}
.border_ver { border: 1px solid #66ba24;}
.border_or { border: 1px solid #bb8833;}
.border_vio { border: 1px solid #6666aa;}
.border_egg { border: 1px solid #7e6444;}

.txt_or, .txt_vio, .txt_blu, .txt_vert, .txt_egg { 
    font-family: arial, helvetica, sans-serif;
    letter-spacing: 0.5px;
    font-size: 16px;
    font-weight: bold;
 }
    
.txt_or { color: #bb8833;}
.txt_vio { color: #6666bb;}
.txt_blu { color: #579dd3;}
.txt_vert { color: #66ba24;}
.txt_egg { color: #e7b165;}
    
.txt_body{
    font-family: arial, helvetica, sans-serif;
    font-size: 13px; 
    color: #999; 
}

/*.list2 {  
    margin-top: -10px;
    margin-left: 20px; 
}

.list2 ul {
    /*letter-spacing: 0.5px;*/
    /*text-decoration: none;
    text-indent: -0.3em;
    font-size: 0.8em;
    font-weight: normal;
    color: #333;
    line-height: 16px;
    list-style-image: url(img/dotgrey.png);
}  */
   
.hr0 {
   height: 1px;
   color: #fff;
   border: 0;
   padding: 8px 0; }
   
.hr1 { 
    background-color: #c00;
    color: #c00;
    height:2px;
    width:100%;
    border: 0;
    margin: 2px 0px 0px 0px; }

.hr2 { 
    background-color: #fff;
    color: #fff;
    height:2px;
    width:100%;
    border: 0;    
    margin: 2px 0px 0px 0px; }
.hr3 { 
    background-color: #666;
    color: #666;
    height:1px;
    width:100%;
    border: 0;    
    margin: 2px 0px 0px 0px; }
.hr4 {
    background-color: #aaa;
    color: #aaa;
    height:10px;
    width:100%;
    border: 0;    
    margin: 2px 0px 0px 0px; }
.hr5 { 
    background-color: #888;
    color: #888;
    height:3px;
    width:100%;
    border: 0;    
    margin: 2px 0px 0px 0px; }

.hr6 {
   width: 840px;
   margin-left: auto;
   margin-top: 30px;
   height: 1px;
   color: #101010;  }

.hr7 {
   width: 400px;
   margin-left: auto;
   height: 1px;
   color: #aaa; }

.hr8_or, .hr8_vio, .hr8_blu, .hr8_ver, .hr8_pink{
  width: 840px;
  border: 0;
  margin-top: -10px;
  margin-bottom: 20px;
  height : 9px;}
  
.hr8_or  {background : url(img/rayure5_or.gif) 100% 0 repeat;}
.hr8_vio {background : url(img/rayure5_vio.gif) 100% 0 repeat;}
.hr8_blu {background : url(img/rayure5_blu.gif) 100% 0 repeat;}
.hr8_ver {background : url(img/rayure5_ver.gif) 100% 0 repeat;}
.hr8_pink{background : url(img/rayure5_pink.gif) 100% 0 repeat;}

section { 
    position: relative;
    width: 960px;
    margin: auto;
    overflow: visible; /* important */
}

article {
   position: relative;
   background-color: fff; 
   width: 860px;
   margin: auto;
   padding: 1px 50px 10px;
}

#intro {
    float: left;  /* cale le cadre à gauche et maintient le menu à droite */
    background-color: #04050a;
    width: 380px;
	  /*height:230px;  /* hauteur optionnelle */
	  padding: 0 20px;
	  margin-right: 20px;
    margin-top: 10px;  /* margin top, bottom et line-height permettent 
    d'ajuster la position et la hauteur du cadre intro */
	  margin-bottom: 0px;  /* ajuste la position verticale du footer */
	  line-height: 20px;
	  -webkit-border-radius: 5px;
	  -moz-border-radius: 5px;
	  border-radius: 5px;
	  font-size: 14px; 
    color: #d8c896;   
}

#wrap2 {
    position: relative;
    /*float: left;  */
    background-color: #111; 
    width: 860px;
	  height:100px;
	  padding: 20px 50px 0px 50px;
	  margin-bottom: 30px;
	  margin-top: 50px;
	  color: #000;
}

#titlebar {
    width: 960px;
    height: 56px;
    background: #333 url(img/rayure.gif) repeat left;
		margin-top: 3px;
		bottom: 0px; 
}

#firstbar {
    width: 960px;
    height: 20px;
    background: #333 url(img/rayure4.gif) repeat left;
		margin-top: 25px;
		bottom: 0px; 
}

#footerbar {
    width: 960px;
    height: 8px;
    background: #555 url(img/rayure2.gif) repeat left;
}

.titlebartxt {
    float: left; 
    margin-top: 8px;
    margin-left: 60px;
    font-family: 'archi', arial, helvetica, sans-serif;
    font-size: 28px;
    color: #eee;
    text-shadow: 1px 1px 1px #000;
}

.txtmain {
    font-size: 15px;  
    color: #eee;
    z-index: 55;
}

.titre1 {
    text-indent: 0px;
    font-size: 20px;  
    color: #cfbd8a;
}

.txt {
    font-size: 0.8em; 
    color: #333;
}

.txt1 {
    font-family: verdana, arial, helvetica, sans-serif;
    font-size: 14px; 
    color: #fff;
}

.cine {
	FONT-SIZE: 10pt; FONT-FAMILY: "Arial narrow", arial, helvetica, sans-serif; margin-top: 0; margin-bottom: 0
}

.tech_b {
	FONT-SIZE: 10pt; COLOR: #000000; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;  margin-top: 0; margin-bottom: 10
}

.tech_c {
	FONT-SIZE: 10pt; FONT-WEIGHT: bold; COLOR: #006699; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;  margin-top: 0; margin-bottom: 6
}

.tip1 {
	FONT-SIZE: 10pt; FONT-WEIGHT: bold; COLOR: #006699; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;  margin-top: 0; margin-bottom: 0
}

.tip2 {
	FONT-SIZE: 10pt; COLOR: #000000; FONT-FAMILY: Arial, Helvetica, sans-serif; margin-top: 0; margin-bottom: 0
}

.titre2 {
    font-family: verdana, arial, helvetica, sans-serif;
    font-size: 15px;
    font-weight: bold; 
    color: #000;
}

.sign {
    float: right;
    background-image: url(img/bg3.png);
    background-repeat: no-repeat;
    margin: 5px 15px 10px 0;
}

.follow {
    position: relative;
    font-size: 12px;
    font-style: italic;
    color: #07d;
    top: 10px;
    left: 230px;
    text-decoration: underline;
}

.clear {
	  clear:both;
}

#slides {
    height: 133px
}

#slides a {
		position:absolute; /* détache le slider du flux mais repousse le cadre intro */
		margin-left: 195px;
    margin-top: 45px;
}
	
#slides a img {
		border:solid 1px;
		border-color: transparent #222 #444 transparent;
		-webkit-border-radius: 5px;
	  -moz-border-radius: 5px;
	  border-radius: 5px;
		-moz-box-shadow:4px 4px 7px #000;
	  -webkit-box-shadow:4px 4px 7px #000;
	  box-shadow:4px 4px 7px #000;
}
	
#slides a.show {
		z-index:50
}

.imcont  {
    display: inline-block;
    position: relative;
    width: 20%;   
    margin: 20px 10px 0px 30px;
    padding: 0 0px 0px 0px; 
}

.imbox  {
    border: solid 1px #888; 
    /*border-radius: 5px;
    -moz-box-shadow:4px 4px 7px #000;
	  -webkit-box-shadow:4px 4px 7px #000;
	  box-shadow:4px 4px 7px #000; */
}

.imtxt1{
    text-align: center;
    font-family: arial, sans-serif;
    font-size: 12px;
    color: #ccc;
    margin-top: 3px;
}

.imtxt2{
    font-family: arial, sans-serif;
    font-size: 12px;
    font-style: italic;
    color: #888;
}
        
.cc_menu{
    width: 510px; /* 93px*5=510px */
    height:420px;  /* 420px */
	  position: relative;
	  margin-left: 460px;
    margin-top: -112px; /*-132px 0 0 465px;  /* position du menu de la page d'accueil */
    overflow: hidden; /* ajouté*/
    font-size:14px;  /*14px*/
    text-transform: normal;  /* uppercase*/
	  color:#fff;
}
.cc_item{   /* volets étroits gris */
   text-align:center;
	 width:93px;
	 height:400px;
	 float:left;  
	 border-bottom:1px solid #000;
	 background:#222 url(img/bg3.png) repeat top left;
	 position:relative;
	 -moz-box-shadow:3px -3px 10px #000;
	 -webkit-box-shadow:3px -3px 10px #000;
	 box-shadow:3px -3px 10px #000;
}
span.cc_title{  /* titres des colonnes*/
  color:#bbb;
	font-size:14px; /* 16px*/
	top:158px;
	left:5px;
	position:absolute;
	padding:3px 0px;
	background:#111;
	width:83px;
	display:block;
	z-index:11;
	-moz-box-shadow:1px 1px 4px #000;
	-webkit-box-shadow:1px 1px 4px #000;
	box-shadow:1px 1px 4px #000;
}
.cc_submenu ul{  /* fond translucide sur images*/
  list-style:none;
	width:93px;
	margin:0;
	padding:0;
	height: 0px; /*increase to 200px to slide up*/
	overflow:hidden;
	text-align:left;
	background:#000;
	position:absolute;
	left:0px;
	bottom:0px;
	opacity:0.7;
	z-index:13;
}
.cc_submenu ul li{  /* texte submenus */
	font-family: verdana, arial, helvetica, sans-serif;
	font-size: 12px;
  color:#fff;
  text-shadow: 1px 1px 1px black;
	cursor:pointer;
	padding:5px;
}
.cc_item img{
	position:absolute;
	width:93px;
	height:400px;
	top:-400px;
	left:0px;
}
.cc_content{   /* volet glissant texte*/
	width:400px;
	height:400px;
	border-bottom:1px solid #000;
	position:absolute;
	left:-500px;
	background:#222 url(img/bg3.png) repeat top left;
	overflow:hidden;
	-moz-box-shadow:4px 0 7px #000;
	-webkit-box-shadow:4px 0 7px #000;
	box-shadow:4px 0px 7px #000;
}
.cc_content div{   /* position conteneur du texte*/
	display:none;
	margin:20px;
}
.cc_content p{  /* couleur et padding conteneur du texte*/
	background:#000;
	padding:20px;
	opacity:0.7;
}
span.cc_back{   /* texte: retour*/
	position:absolute;
	bottom:10px;
	right:10px;
	cursor:pointer;
	color:#ddd;
}
/* fin du scroller */

footer {
    position: relative;
    width: 100%;
    /*margin: auto;   */
    overflow: hidden;
    height: 330px;  /*100*/
    background-color: black;
    background-image: url(img/footbar.jpg);
}

#blogo1 { 
    margin: auto;
    width: 1000px; /*630*/
    height: 93px;  /*100*/
    margin-top: 85px;
    background-image: url('img/logo0.jpg');
}

/*footer {
    width: 960px;
    margin: auto;
    padding: 0px;
} */   
    
footer a {
    text-decoration: none;
}

.navf {
		margin: auto;  /* calage du groupe de liens dans le cadre par rapport à text-align */
    padding: 0;
    margin-top: 15px;
		text-align: center; /* position du groupe de liens dans le cadre (à partir du calage) */
		font-size: 11px;   /*  */
}
    
.navf li {
		display: inline; /* liste horizontale */
		list-style: none; /* nécessaire pour IE7 */
    width:40px;  /* largeur des boutons virtuels */
    color: #f00;  /* couleur des séparations (texte hors liens) */
}
  
.navf a {
		font-family: arial, helvetica, sans-serif;
    font-size: 12px;
    text-decoration: none;  /* suppression du souligné */
    display: inline-block;  /* liste horizontale */
		margin: 0 10px;  /* marge haute + espace entre les textes */ 
		color: #777;  /* couleur des liens */
}

.navf li a:hover {
    color: #ff0000;  /* couleur des liens en survol */
}

.copyright {
    text-align: center;
    margin-top: 8px;
}

/* Main menu */
#mnubox {
   width: 950px;
   height: 40px;
   margin: auto;
}

ul, li {
 margin: 0; padding: 0px;
}

#blob {
 width: 100px;
 height: 18px;
 /*border-right: 10px solid #0059ec;
 border-left: 10px solid #0059ec;  */
 position: absolute;
 top: 10px;
 z-index : 1;
 /* background-color: #f00; */
 /* background: -ms-linear-gradient(top, #161616, #666);*/
 /* background: -moz-linear-gradient(top, #0e1d2c, #0e1d2c);  /* #0b2b61, #1153c0*/
 /* background: -webkit-gradient(linear, left top, left bottom, from(#161616), to(#666)); */
 background: url('img/xxx.jpg'); /*linear-gradient(top, #161616, #666); */
 -moz-border-radius: 9px 9px 9px 9px;
 -webkit-border-radius: 9px 9px 9px 9px;
 border-radius: 9px 9px 9px 9px;
 -moz-box-shadow: 6px 6px 6px 6px #06070b;  /*  #011331 */
 -webkit-box-shadow: 2px 3px 5px #06070b;
 box-shadow: 0px 0px 8px 4px #06070b;
}

#menu2 {
 position: relative;
 background: #292929;
 margin: -125px auto;  /* espace libre au dessus du menu horizontal */
}

#menu2 li {
 float: left;
 margin: 0 28px;    /* espace libre entre les légendes */
 list-style: none;
 border-right: 0px solid #4a4a4a;
 border-left: 0px solid black;
}

#menu2 li a {
 color: #bbb;
 position: relative;
 z-index: 2;
 float: left;
 font-size: 14px;   /*16*/
 font-family: 'strait', sans-serif; 
 text-decoration: none;
 padding: 0px 15px 0px 15px;  /* boutons: espace texte/bordure */
}

/* lectures conseillées */

.l_book {
    float: left;
    width: 120px;
    margin: 0 10px 0 10px;
    border: solid 1px #bb8833;
}

/*.l_bookb_or  { border: solid 1px #bb8833;}
.l_bookb_vio { border: solid 1px #6666bb;}
.l_bookb_blu { border: solid 1px #579dd3;}
.l_bookb_ver { border: solid 1px #66ba24;}
.l_bookb_pink{ border: solid 1px #e7b165;}*/
             
.l_bookb /*, .l_bookb_vio, .l_bookb_blu, .l_bookb_ver, .l_bookb_pink*/ {
    float: left;
    margin: 0 10px 0 10px;
}

.l_box {
    width: 620px;
    height: 110px;
    padding: 0;
    margin: -10px 0 0 120px;
    border: solid 0px #888;
}

.l_amaz {
    position: absolute;
    background-image: url(img/amazon.gif);
    margin: -25px 0 0 650px;
}

.l_amaz1 {
    border:none !important;
    margin:0px !important;
}

.l_txt1 {
   font-family: verdana, arial, helvetica, sans-serif;
   font-size: 16px;
   font-weight: bold;
   color: #bbb;
   line-height: 8px;
}

.l_txt1b {
   margin-left: 10px;
   font-family: verdana, arial, helvetica, sans-serif;
   font-size: 0.9em;
   font-weight: normal;
   color: #000;
   line-height: 18px;
}

.l_txt1c {
   margin-left: 0px;
   font-family: verdana, arial, helvetica, sans-serif;
   font-size: 0.9em;
   font-weight: normal;
   color: #0051b8;
   line-height: 18px;
}

.l_txt2 {
   font-family: verdana, arial, helvetica, sans-serif;
   font-size: 0.75em;
   text-indent: 0.2em;
   color: #ccc;
   line-height: 8px;
}

.l_txt3 {
   font-family: arial, helvetica, sans-serif;
   font-size: .8125em;
   color: #ccc;
}

.l_txt3b {
   position: absolute;
   font-family: arial, helvetica, sans-serif;
   font-size: .8125em;
   color: #ccc;
   left: 530px;
}
.l_txt4 {
   font-family: arial, helvetica, sans-serif;
   font-size: 0.7em;
   font-style: italic;
   color: #ccc;
   line-height: 8px;
}

.l_txt4c {
   text-align: center;
   font-family: arial, helvetica, sans-serif;
   font-size: 0.7em;
   font-style: italic;
   color: black;
   line-height: 8px;
}

.l_txt4r {
   
   float: right;
   font-family: arial, helvetica, sans-serif;
   font-size: 0.6em;
   font-style: italic;
   color: #666;
}

.l_txt5 {
   font-family: arial, helvetica, sans-serif;
   font-size: 1.25em;
   font-weight: bold;
   color: #f00;
   margin-left:0px;
}

.l_txt5b {
   font-family: arial, helvetica, sans-serif;
   font-size: 1.25em;
   font-weight: bold;
   color: #c00;
   margin-left:0px;
}

.l_txt5 {
   font-family: arial, helvetica, sans-serif;
   font-size: 1.25em;
   font-weight: bold;
   margin-left:10px;
}

p.or  { color: #bb8833;}
p.vio { color: #6666bb;}
p.blu { color: #579dd3;}
p.ver { color: #66ba24;}
p.pink{ color: #ff9966;}
p.m10 {margin-left : 10px;}
p.bold   { font-weight: bold; }
p.italic { font-style: italic; }

.l_txt6 {
   width: 820px;
   margin-left: 10px;
   font-family: verdana, arial, helvetica, sans-serif;
   font-size: 0.8125em;
   font-style: italic;
   color: #ccc;
}

.l_txt6b {
   font-family: verdana, arial, helvetica, sans-serif;
   font-size: 0.9em;
   font-style: italic;
   font-weight: bold;
   color: #48c;
}

.l_txt7 {
   font-family: arial, helvetica, sans-serif;
   font-size: 1.22em;
   font-style: italic;
   font-weight: bold;
   color: #c00;
}

.l_txt_blu06 {
   font-family: arial, helvetica, sans-serif;
   font-size: 0.6em;
   font-style: italic;
   font-weight: bold;
   color: #579dd3; }

.books {
   position: absolute;
   width: 250px;
   margin: -100px 0 0 700px;
   border: solid 1px #666;
}

/* images du dossier études */

.img_l {
   float: left;
   margin: 3px 20px 20px 0;
}

.img_r {
   float: right;
   margin: 0px 5px 15px 15px;
}

.img_c {
   display: block;
   margin: 0 auto;
   margin-top: 30px
}

.pic {
	/* padding: 0px; */
	font-size: 11px;
	font-style: italic;
	line-height: 1.25; 
	/* background: white; */
}
.pic img {
	display: block;
	/*margin-bottom: 10px;   */
}
.pic p {
	margin: 5px 0 0 3px; /* position du texte */
}

.bloc_r .pic {
	display: table;
	float: right;
	width: 200px; /* largeur du texte */
	margin: 0px 0 10px 20px;  /* position du bloc img+texte */
}

.bloc_l .pic {
	display: table;
	float: left;
	width: 200px; /* largeur du texte */
	margin: 0px 20px 0px 0px;  /* position du bloc img+texte */
}

#renvoi {
  display: inline-block;
  text-align: center;
  margin-left: 160px;
  /*overflow: hidden;  */
  padding: 25px;
  height: 15px;
}

.esp {
  margin: 0 -3px 0 -3px;
}
 /*-----------------------------------------------*/
 #vmenu1, #vmenu2, #vmenu3, #vmenu4, #vmenu5 {
	  font-family: arial, helvetica, sans-serif;
    text-align: right;
    text-indent: 20px;
    text-decoration: none;
    list-style-type: none;
		font-size:12px;
		position:relative;
		margin:0 auto;
		width:200px;
	}
	
#vmenu1 ul, #vmenu2 ul, #vmenu3 ul, #vmenu4 ul, #vmenu5 ul {
		list-style:none;
		padding:0;
		margin:0;	
		position:relative;
		z-index:5;
	}
	
#vmenu1 li, #vmenu2 li, #vmenu3 li, #vmenu4 li, #vmenu5 li {
		padding:4px;  
		cursor:pointer;
		border:none;
		}

#vmenu1 li, #vmenu2 li { background:#09131d url(img/lne-pink.jpg) no-repeat 0 0;}
#vmenu3 li { background:#09131d url(img/lne-or.jpg) no-repeat 0 0;}
#vmenu4 li, #vmenu5 li { background:#09131d url(img/lne-blu.jpg) no-repeat 0 0;}
	
#vmenu1 a:hover { color: #ffca72; } /* couleur des liens en survol */
#vmenu2 a:hover { color: #9494ff; }
#vmenu3 a:hover { color: #91cfff; }
#vmenu4 a:hover { color: #aefd6f; }
#vmenu5 a:hover { color: #fbdeb4; }
		
#vmenu1 li a, #vmenu2 li a, #vmenu3 li a, #vmenu4 li a, #vmenu5 li a{
    text-decoration: none;
    letter-spacing: 0.5px;
    font-size: 13px;
    font-weight: bold; 
    padding-right: 20px;    
}

#vmenu1 li a { color: #bb8833;}	
#vmenu2 li a { color: #6666bb;}
#vmenu3 li a { color: #579dd3;}
#vmenu4 li a { color: #66ba24;}
#vmenu5 li a { color: #e7b165;}
	
#vmenu1 .block, #vmenu2 .block, #vmenu3 .block, #vmenu4 .block, #vmenu5 .block {
		position:absolute;
		top:0;
		left:180px;	
		z-index:10;
		width:9px;
		padding:4px;
		cursor:pointer;
	}
#vmenu1 .block { background:transparent url(img/bal-or.png) no-repeat top right;}
#vmenu2 .block { background:transparent url(img/bal-vio.png) no-repeat top right;}
#vmenu3 .block { background:transparent url(img/bal-blu.png) no-repeat top right;}
#vmenu4 .block { background:transparent url(img/bal-vert.png) no-repeat top right;}
#vmenu5 .block { background:transparent url(img/bal-or.png) no-repeat top right;}
	
	/* fast png fix for ie6 */
* html .png{
		position:relative;
		behavior: expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')",
this.src = "transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='crop')",
this.runtimeStyle.backgroundImage = "none")),this.pngSet=true));
	}
