body{
  color: #ffffff;
  background-attachment: fixed;
}
h1{
  text-align: center;
}
/*MENU CHAPITRES */
.menuChapitres{
  position: relative;
  margin: 0 auto;
  width: 1000px;
  /*height: 80%; */
}
.containChapitres{
  padding: 3%;
}
.navChapitres{
  /*height: 50%;*/
  margin-top: 1%;
}
.navChapitres ul{
  list-style: none;
}
.navChapitres li{
  display: inline-block;
  width: 25%;
  text-align: center;
   /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e5fff0+0,e5fff0+100&0.5+0,0.5+100 */
  background: -moz-linear-gradient(top, rgba(229, 232, 255, 0.2) 0%, rgba(229, 238, 255, 0.2) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, rgba(229, 232, 255, 0.2) 0%,rgba(229, 238, 255, 0.2) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, rgba(229, 232, 255, 0.2) 0%,rgba(229, 238, 255, 0.2) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80e5fff0', endColorstr='#80e5fff0',GradientType=0 ); /* IE6-9 */
  border-radius: 10px;
  padding: 20px 10px;
  margin: 20px 10px;
  -webkit-transition: opacity 0.5s;/* Safari */
  transition: opacity 0.5s;
}
.navChapitres li img{
  width: auto;
  height: 15%;
  opacity: 0.6;
}

.navChapitres li:hover{
  background: -moz-linear-gradient(top, rgba(229,255,240,0.5) 0%, rgba(190,255,220,0.5) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(229,255,240,0.5) 0%,rgba(190,255,220,0.5) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(199, 223, 255, 0.5) 0%,rgba(143, 146, 255, 0.5) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80e5fff0', endColorstr='#80e5fff0',GradientType=0 ); /* IE6-9 */
  border-radius: 10px;
  padding: 20px 10px;
}
.navChapitres li:hover img{
  opacity: 1;
}
.navChapitres li:hover a{
  color:#3BD6ED;
}

p{
  font-weight: lighter;
  text-align: justify;
  padding: 2% 0%;
  /*width: 80%;*/
  margin: 0 auto;
}

.desc{
  width: 65%;
  margin: 0 auto;
  padding: 1%;
  border-radius: 10px;
  color: coral;
  font-weight: lighter;
  text-align: left;

}
h2{
  padding: 2% 0%;
  /*text-shadow: 0 0 10px #ff006c, 0 0 20px #ff006c, 0 0 30px #ff006c, 0 0 40px #ff417d, 0 0 50px #ff417d, 0 0 80px #ff417d, 0 0 20px #ff417d, 0 0 10px #ff417d;*/
  text-decoration: none;
  font-weight: lighter;
  font-size: 1.5vw;  
}
h3{
  text-shadow: 0 0 15px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #034FA2, 0 0 40px #034FA2, 0 0 70px #228DFF, 0 0 100px #228DFF, 0 0 150px #0A3E76;
  padding: 2% 0%;
  font-size: 1.8rem;  
  /*color: #FF6018;*/
}

h4{
  /*text-align: left;*/
  font-weight: lighter;
}
.containerMain{
  width: 1000px;
  margin: 0 auto;
  padding-top: 2%;
}
.containerFiche{
  width: 1000px;
  margin: 0 auto;
  background: -moz-linear-gradient(top, rgba(229, 232, 255, 0.2) 0%, rgba(229, 238, 255, 0.2) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, rgba(229, 232, 255, 0.2) 0%,rgba(229, 238, 255, 0.2) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, rgba(229, 232, 255, 0.2) 0%,rgba(229, 238, 255, 0.2) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80e5fff0', endColorstr='#80e5fff0',GradientType=0 ); /* IE6-9 */
  border-radius: 10px;
}
#ficheLeft, #ficheRight{
  width: 40%;
  display: inline-block;
}
#ficheLeft{
  margin-top: -60%; 
}
#ficheLeft img{
  width: 100%;
}
#ficheRight{
  text-align: left;
  padding: 4%;
}

.h3Histoire{
  /*text-align: left; */
  font-size: 1.2vw;
  /*padding-left: 20%; */
  padding-top: 5%;
}




.mainAtelier{
	background:linear-gradient(to bottom, rgba(229, 232, 255, 0.2) 0%,rgba(229, 238, 255, 0.2) 100%);
	margin-top: 5%;
	padding: 5% 10%;
}
.mainAtelier p{
	display: inline-block;
	line-height: 1.6em;
}
.mainAtelier h3{
	padding-top: 6%;
}
.mainAtelier img{
	width:100%; 
}
.mainAtelier figure{
	display: inline-block;
	width: 28%;
	padding: 2%;
}
.container{
	width: 100%;
	display: block;
	margin: 0 auto;
}
.right{
	padding-left: 2%;
	float: right;
}
.left{
	padding-right: 2%;
	float: left;
}
.container img{
	width: 100%;
}
figcaption{
	text-align: center;
	font-weight: lighter;
	font-family: initial;
	line-height: 1em;
}


#imgMTA{
	margin: 0 auto;
}



/*DESKTOP PETIT*/
@media all and (max-width: 1250px){

}


/*TABLETTE*/
@media screen and (max-width: 750px){
.containerMain{
    width: 100%
}
}