body, html {
    height: 100%;
    margin: 0;
	/*background-color:rgb(252, 252, 252);*/
	background-color:rgb(255,255,255);
}

/*HEADERS*/
/*BIG TITLE*/
h1{
	font-family: Roboto Slab;
	font-size: 300%;
	color:rgb(255,255,255);
}

/*BASIC TITLE ON THE LEFT*/
h2{
	font-family: Roboto Slab;
	font-size: 200%;
	color:rgb(44, 124, 122);
	text-align: justify;
}

/*COLUMNS TITLE*/
h3{
	font-family: Roboto Slab;
	font-size: 120%;
	color:rgb(44, 124, 122);
	text-align: center;
}

/*BASIC TITLE ON THE RIGHT*/
h4{
	font-family: Roboto Slab;
	font-size: 200%;
	color:rgb(44, 124, 122);
	text-align:right;
}

/*SUBTITLES*/
h5{
	font-family: Roboto Slab;
	font-size: 100%;
	color:rgb(95, 140, 139);
	padding-left:40px;
	margin-top:-25px;
}

h6{
	font-family: Roboto Slab;
	font-size: 100%;
	color:rgb(95, 140, 139);
	padding-left:40px;
	margin-top:-40px;
}

/*BODY*/
p{
	font-family: Roboto, sans serif;
	padding-left:40px;
	padding-right:40px;
	vertical-align: middle;
}

.subtitles{
	font-family: Roboto, sans serif;
	text-align: justify;
	padding-left:40px;
	padding-right:40px;
	vertical-align: middle;
	margin-top:-25px;
}

.subtitless{
	font-family: Roboto, sans serif;
	text-align: justify;
	padding-left:40px;
	padding-right:40px;
	vertical-align: middle;
	margin-top:-35px;
}

/*LOGO PART*/
.logo-bg {
    background-image: url("graphe.png");
    height: 60%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
	margin:auto;
}

.logo-content {
	margin: auto;
    width: 50%;
    padding: 10px;
	width:1000px;
    position: relative;
    top: 50%;
    left: 50%;
    transform: translate(-75%, -75%);
}


/*Si logo img : juste écrire <img src="..."> <p>text</p> et utiliser le vertical align*/
.logo-img{
	color: white;
	text-align: center;
	width:500px;	
	word-wrap:break-word;
	/*background-position: center;
    background-repeat: no-repeat;
    background-size: cover;*/
}

.logo-text{
	background-color: rgba(255, 255, 255, 0.3);
	padding-top:20px;
	padding-bottom:20px;
	margin-left: 30px;
	vertical-align: middle;
	word-wrap:break-word;
	color: white;
	width:355px;
	font-size: 1.3em;
}

/*SUGGESTIONS YOUTUBE*/
.sug-yt{
	margin: auto;
    width: 50%;
    padding-top: 9px;
	width:850px;
}

.column-yt-left{ /*float: left;*/ width: 70%;}
.column-lpa-right{ /*float: right;*/ width: 70%; }

/*PARALLAX*/
.parallax { 
    /* The image used */
    background-image: url("parallax.png");

    /* Set a specific height */
    height: 40%; 

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.parallax2 { 
    /* The image used */
    background-image: url("parallax2.png");

    /* Set a specific height */
    height: 40%; 

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

/*COLONNES*/
.container{
	margin: auto;
    width: 50%;
    padding-top: 50px;
	padding-bottom: 40px;
	width:850px;
	font-family: Roboto, sans serif;
	text-align: justify;
}
.column-left{ float: left; width: 33%; word-break: normal;}
.column-right{ float: right; width: 33%; }
.column-center{ display: inline-block; width: 33%; }

/*LPA*/
.lpa{
	margin: auto;
    width: 50%;
    padding-top: 9px;
	width:850px;
}

/*L'EQUIPE*/
.equipe{
	margin: auto;
    width: 50%;
    padding-top: 9px;
	width:850px;
	vertical-align:middle;
}

.footing{
	font-family: Roboto, sans serif;
	padding-top:40px;
	padding-left:40px;
	padding-right:40px;
	color:rgb(132, 132, 132);
	vertical-align: middle !important;
	text-align: justify;
}

.column-footer-left{ float: left; width: 20%; }
.column-footer-center{ float: center; width: 60%; }
.column-footer-right{ float: right; width: 20%; }