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;

}

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: 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;
}

section{
	display: flex;
	flex-wrap: wrap;
	width: 65%;
	padding-left: 13%;
}

article{
max-width: 950px;
width: 100%;
text-align: justify;
font-family: 'Cutive Mono', sans-serif;
line-height: 15pt;
padding-left: 15px;
padding-right: 15px;
}

p.description{
	padding-top: 40px;
}

article.Lasilencieuse img{
	max-width:950px;
	width: 100%;
}

article.bio h2{
	font-size: 1rem;
	color: rgb(0,0,32);
	margin-bottom: 5px;
	padding-bottom: 0;
	line-height: 0;
}

article.bio{
		margin-bottom: 15px;
		margin-top: 80px;
}


article a.chloe{
	text-decoration: none;
	color: rgb(0,0,32);
	font-weight: lighter;
}

article a.chloe:hover{
	color: rgb(0,0,32);
	font-weight: bold;
}

article.collaborations{
	padding-top: 30px;
	padding-bottom: 50px;
}


footer{
	text-align: center;
	background-color: white;
	color: black;
	width: 100%;
    height: 5px;
    margin bottom: 0;}

    /*responsive page compagnie*/

@media screen and (min-width: 706px){
	#icon-menu{
		display : none;
	}
	.logo{
		display: none;
	}

}



@media screen and (max-width: 705px) {

.Lasilencieuse img{
display: none;
}

section{
	max-width: 705px;
	width: 100%;
	margin-top: 120px;
	padding-left: 0 !important;
	margin-right: 0;
	margin-left: 0;
	padding-left: 0;
	padding-right: 0;
}

article{
	max-width: 705px;
	width: 100%;
	margin-right: 5px;
	margin-left: 5px;
}
}

