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

    
/* General */

a{
	font-family:inherit;
	font-size:inherit;
	text-decoration:none;
	color:inherit;}
	
p>a{
	text-decoration:underline; !important}
	
p{
	color: black;
	font-family: 'Roboto Condensed', sans-serif;
	font-size:13px;
	text-align:justify;
	line-height:1.5;}
	
html {
    position: relative;
    min-height: 100%;}
	
/* Menu */
	
#header{
	top:0;
	left:0;
	padding:15px;
	position:fixed;
	z-index:3000;
	background-color:white;}
	
li.menu-el{
	display:inline;}
	
#titre{
	color: black;
	font-family: 'Roboto Condensed', sans-serif;
	font-size:20px;
	font-weight:300;
	text-align:left;
	padding-right:20px;}
	
a.menupage{
	color: black;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight:300;
	font-size:15px;
	padding-left:10px;
	padding-right:10px;}
	
/* Minicarte */

#minicarte{
	bottom:30px;
	right:30px;
	position:fixed;
	z-index:4000;}
	
#minicarteimage{
	height:150px;
	width:201px;
	box-shadow: 5px 5px 5px grey;}
	
#mapDiv{
	bottom:30px;
	right:30px;
	z-index:4100;
	position:fixed;
	width:201px;
	height:150px;}
	
/* Pied de page */

#pied{
	height:100px;
	width:100%;
	left:35px;}
	
#pied>p{
	color:#666 !important;
	font-weight:200;}
	
/* Page Le projet et Remerciements */
 
#contenupage{
    width:75%;
    margin-left:50%;
    transform:translateX(-50%);
    margin-top:100px;
    margin-bottom:100px;}
     
p.projet{
    font-size:15px;}
     
#dates{
    line-height:1.8;}
     
div.paragraphe{
    padding-bottom:20px;
    width:100%;}
     
#citation{
    padding-left:30%;
    color:#666 !important;
    font-weight:200;}
     
.logo{
    width:200px;
    margin-left:15px;
    margin-right:15px;}
     
.merci>p{
    padding-bottom:20px;
    width:100%;
    font-size:15px !important;}
     
.dates{
    font-size:15px !important;}

	
	
/* Page Le projet */

#contenupage{
	width:75%;
	margin-left:50%;
	transform:translateX(-50%);
	margin-top:100px;
	margin-bottom:100px;}
	
p.projet{
	font-size:15px;}
	
#dates{
	line-height:1.8;}
	
div.paragraphe{
	padding-bottom:20px;
	width:100%;}
	
#citation{
	padding-left:30%;
	color:#666 !important;
	font-weight:200;}
	
/* DOCUMENTATION */

/*Repositionner pied de page selon ajoute de contenu */
#pied-doc{
	position:absolute;
	height:100px;
	width:100%;
	left:35px;
	top:4000px;}
	
#pied-doc>p{
	color:#666 !important;
	font-weight:200;}
	
/* general */

#documentation{
	z-index:10;
	overflow-y:scroll;
	overflow-x:scroll;
	white-space:nowrap;
	height:4100px;
	width:5500px;
	position:absolute;
	top:0;
	left:0;}

/*.audio{
	position:relative;
	display:block;
	width:300px;
	height:30px;}*/
	
.texte{
	white-space:normal !important;}
	
.texte>p{
		text-align:left !important;}
		
.texte>p>a{
		color:blue;}
		
.approbation{
	white-space:normal !important;
	width:100%;
	height:30px;
	padding-top:28px;
	padding-left:108px;
	top:0;
	position:absolute;
	z-index:1500;}
	
.approbation>p{
	font-size:10px;}
	
#documentation>div{
	position:absolute;}
	
#svg-container {
	position:absolute;
	top:0;
	left:0;
	height:4100px;
	width:5500px;
	z-index:-10;}
	
.num{
	color:#666 !important;
	line-height:1 !important;
	font-size:10px !important;}
	
table, td{
	vertical-align:bottom;}
	
	
/*explication*/
	
#explication{
	top:100px;
	left:35px;}
	
#explicationp{
	color:#666 !important;}
	
/*positionnement elements doc */

/*video*/

#escaliervideo{
	top:1100px;
	left:2050px;
	width:450px;
	height:254px;}
	
img.escaliervideo{
	width:450px;}
	
/* images et doc */

#installation{
	top:150px;
	left:600px;}
	
img.installation{
	height:200px;
	padding:15px;}
	
#installation2{
	top:1450px;
	left:3800px;}
	
#transport1{
	left:4300px;
	top:125px;}
	
#transport2{
	top:2450px;
	left:835px;}
	
#transport3{
	top:3575px;
	left:650px;}
	
#transport4{
	top:1785px;
	left:2900px;}
	
img.transport4{
	height:200px;}
	
img.transport{
	height:245px;}
	
#schemaecole{
	left:2950px;
	top:3500px;}
	
img.schemaecole{
	width:520px;}
	
#schemaplan{
	left:3500px;
	top:3500px;}
	
img.schemaplan{
	width:520px;}
	
#lutte{
	left:500px;
	top:870px;}
	
img.lutte{
	width:300px;}
	
#tensions{
	top:1500px;
	left:50px;}
	
img.tensions{
	width:300px;}
	
/* extraits audios */

#motivation{
	width:340px;
	height:720px;
	top:200px;
	left:200px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#alternatif{
	width:340px;
	height:625px;
	top:1100px;
	left:50px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}

#faconapprendre{
	width:340px;
	height:720px;
	top:450px;
	left:850px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#derangent{
	width:340px;
	height:230px;
	top:1350px;
	left:1150px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#elitisme{
	width:340px;
	height:465px;
	top:1800px;
	left:1000px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#deuxprofs{
	width:340px;
	height:300px;
	left:600px;
	top:1350px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#separer-eleves{
	width:340px;
	height:580px;
	left:350px;
	top:1900px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#solution-rythme{
	width:340px;
	height:230px;
	left:800px;
	top:2800px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#prive{
	width:340px;
	height:90px;
	top:1650px;
	left:975px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#intimidationprof{
	width:340px;
	height:90px;
	top:100px;
	left:1800px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#homophobie{
	width:340px;
	height:300px;
	top:150px;
	left:2650px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#ecolevie{
	width:340px;
	height:300px;
	top:300px;
	left:2050px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#prof{
	width:340px;
	height:650px;
	top:1550px;
	left:1750px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#examen{
	width:340px;
	height:510px;
	top:530px;
	left:1550px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#matieres{
	width:340px;
	height:90px;
	top:3150px;
	left:2950px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#diplome{
	width:340px;
	height:150px;
	top:730px;
	left:2150px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#inter{
	width:340px;
	height:230px;
	top:2100px;
	left:2300px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#altruisme{
	width:340px;
	height:440px;
	top:1750px;
	left:4300px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#langue{
	width:340px;
	height:510px;
	top:2500px;
	left:4550px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#options-activites{
	width:340px;
	height:580px;
	top:3150px;
	left:4150px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#intimidation{
	width:340px;
	height:160px;
	top:100px;
	left:3200px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}

#intimidation-mixte{
	width:340px;
	height:300px;
	top:175px;
	left:3900px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#notesautrescompetences{
	width:340px;
	height:510px;
	top:1450px;
	left:2350px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#intelligencenotes{
	width:340px;
	height:510px;
	top:1200px;
	left:2950px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#metier{
	width:340px;
	height:790px;
	top:2350px;
	left:1550px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#notes-caste{
	width:340px;
	height:650px;
	top:3300px;
	left:2400px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#ce-dans-quoi-bon{
	width:340px;
	height:230px;
	top:2900px;
	left:2400px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#changer-syst{
	width:340px;
	height:370px;
	top:3350px;
	left:1700px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#educationsup{
	width:340px;
	height:370px;
	top:2400px;
	left:2200px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#prealable{
	width:340px;
	height:510px;
	top:3225px;
	left:1050px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#sek-real{
	width:340px;
	height:1100px;
	top:2600px;
	left:200px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#valorisationsc{
	width:340px;
	height:370px;
	top:2050px;
	left:2800px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#social{
	width:340px;
	height:930px;
	top:450px;
	left:3400px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#classe-plus-petite{
	width:340px;
	height:650px;
	top:50px;
	left:4700px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#autochtone{
	width:340px;
	height:620px;
	top:1000px;
	left:4600px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#dissensus{
	width:340px;
	height:90px;
	top:1900px;
	left:4950px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#cellulaire{
	width:340px;
	height:300px;
	top:1100px;
	left:3950px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}

#internet{
	width:340px;
	height:440px;
	top:600px;
	left:2750px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#gang{
	width:340px;
	height:160px;
	top:725px;
	left:4200px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#parentnotes{
	width:340px;
	height:300px;
	top:2600px;
	left:3000px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#decrochage{
	width:340px;
	height:350px;
	top:2800px;
	left:3500px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#stress-reussite{
	width:340px;
	height:440px;
	top:1800px;
	left:3400px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}
	
#echec-volonte{
	width:340px;
	height:440px;
	top:2300px;
	left:3900px;
	border: 1px solid #CCC;
	padding-right:15px;
	padding-left:15px;}