html{
	font-size: 16px;
}

h1{
	font-size: 2.5rem;
}

h2{
color: rgb(0,0,32);
}

h3{
color: rgb(0,0,32);
}
h4{
color: rgb(0,0,32);
}

h5{
color: rgb(0,0,32);
}

#page{
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	min-height: 750px;

}

header{
max-width: 264px;
width: 20%;
max-height: 100%; 
font-family: 'Alegreya Sans SC', sans-serif;
z-index: 7;
}

#titre_principal{
	color: rgb(0,0,32);
	height: 100px;
}

#titre_principal a{
	text-decoration: none;
	color: rgb(0,0,32);
}




nav.menu-nav{
	border-right: 1px solid black;
}

ul{
margin-top: 140px;
margin-left: 0;
padding-left: 0;
}

nav.menu-nav ul li.btn{
text-align: right;
list-style-type: none;
height: 100%;
font-family: 'Alegreya Sans SC', sans-serif;
font-weight: lighter;
font-size: 1.8rem;

}

nav.menu-nav ul li.btn a{
color: rgb(64,0,0);
text-decoration: none;
padding-right: 10px;

}

nav.menu-nav ul li.btn:hover a{
	color: rgb(0,0,32);
	font-weight: bold;
	transition: 0.1s all;

}

nav.menu-nav #en-cours a{
	color: rgb(0,0,32);
	font-weight: bold;
}

nav.menu-nav a.cor{
font-family: 'Alegreya Sans SC', sans-serif;

}

nav.menu-nav a.landau{
font-family: 'Alegreya Sans SC', sans-serif;
}

section{
	padding-left: 13%;
	margin-top: 25px;
	width: 65%;
	font-family: 'Cutive Mono', sans-serif;
	display: flex;
	flex-wrap: wrap;


}

article{
width: 100%;
padding-bottom: 50Px;
text-align: justify;
}

article div.titre{
	margin-left: 95px;


}

div.intro{
	margin-top: 400px;
	margin-left: 95px;
}


.img1, .img2, .img3, .img4, .img1p, .img2p, .img3p, .img4p{
	position:absolute;
	animation-duration: 50s;
	animation-iteration-count: infinite;
}

.img1,.img1p{
	animation-name: img1;
}

.img2, .img2p{
	animation-name: img2;
}

.img3, .img3p{
	animation-name: img3;
}

.img4, .img4p{
	animation-name: img4;
}

@keyframes img1{
	0%  {opacity: 1;}
	25% {opacity: 0,5;}
	50% {opacity: 0;}
	75% {opacity: 0;}
	100%{opacity: 0,5;}
}

@keyframes img2{
	0%  {opacity: 0;}
	25% {opacity: 1;}
	50% {opacity: 0,5;}
	75% {opacity: 0;}
	100%{opacity: 0;}
}

@keyframes img3{
	0%  {opacity: 0;}
	25% {opacity: 0;}
	50% {opacity: 1;}
	75% {opacity: 0,5;}
	100%{opacity: 0;}
}

@keyframes img4{
	0%  {opacity: 0;}
	25% {opacity: 0;}
	50% {opacity: 0;}
	75% {opacity: 1;}
	100%{opacity: 0;}
}

.distribution{
	padding-top: 20px;
}

.intention{
	padding-top: 20px;
}

.intention a{
	text-decoration: none;
}

footer{
	text-align: center;
	background-color: white;
	color: black;
	width: 100%;
}

/*responsive page cordechasse*/
@media screen and (min-width: 706px){
	#icon-menu{
		display : none;
	}
	.logo{
		display: none;
	}
    .img1p, .img2p, .img3p, .img4p{
    	display: none;
    }
}
@media screen and (max-width: 899px){

article.cor div.titre{
	margin-left: 0 !important;
}
article.cor div.intro{
	margin-left: 0 !important;

}

}


@media screen and (max-width: 705px) {

.img1, .img2, .img3, .img4{
	display: none;
}

section{
	max-width: 705px;
	width: 100%;
	margin-top: 120px;
	padding-left: 0 !important;
}

article{
	max-width: 705px;
	width: 90%;
	margin-right: 5%;
	margin-left: 5%;
}

article div.titre{
	margin-left: 0 !important;


}

div.intro{
	margin-top: 200px;
	margin-left: 0;

}
}