html
{
    height:100%;
    margin: 0;
    padding: 0;
}

body 
{
    min-height: 100vh;
    position: absolute;
    vertical-align: middle;
    color: white;
    background-color:black;
    background-repeat:no-repeat;
    background-attachment:fixed;
    background-position:center top;
    background-size: 100% auto;
    margin:0;
    padding:0;
    font-variant: normal;
    font-family: Helvetica;
    font-size: 1em;
}

.ancre
{
	height: 69vh;
	position: sticky;
	display: flex;
	flex-direction: column;
	top:12vh;
	width: 30vw;
	margin: 3vw 0 0 3vw;
	padding: 1vw;
	border-top-color: black;
	background-color:#474747;
	justify-content: space-around;
	z-index: 3;
	text-align: center;
}

.ancre a
{
    height: auto;
    min-height: 7vh;
    margin:2vh;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none; 
    color: white;
    font-weight: bold;
    font-variant: small-caps;
}
.zone1
{
    background-color:#150F66;

}

.zone2
{
    background-color:#890704;
}

.zone3
{
    background-color:#7AA321;
}

.zone4
{
    background-color:#D65F08;
}

.zone5
{
    background-color: #055A76;
}
.zone6
{
    background-color:#126409;
}

.contenu
{
    height: auto;
	display: flex;
    flex-direction: row;
	width: 100vw;
	border-top-color: black;
	background-color: black;
	z-index: 3;
	text-align: center;
}

.ancres
{
	margin:0;
	padding:0;	
	margin-top: -12vh;
	padding-top: 17vh;
	color:#121313;
	height: 0vh;
    font-size: 1em;
}

h2
{
    height: auto;
    min-height: 7vh;
    margin:0;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none; 
    color: white;
    font-variant: small-caps;
}

.titre1
{
    background-color:#150F66;
}

.titre2
{
    background-color:#890704;
}

.titre3
{
    background-color:#7AA321;
}

.titre4
{
    background-color:#D65F08;
}

.titre5
{
    background-color:#055A76;
}

.titre6
{
    background-color:#126409;
}

.photo
{
    max-width: 50vw;
    max-height: 60vh;
    width: auto;
    margin:auto;
    display: flex;
    flex-direction: row;
}

    .texte
{
    height: auto;
	position: relative;
	display: flex;
    flex-direction: column;
    margin: 3%;
	margin-bottom: 0;
    padding: 0 5vw 5vh 5vw;
	width: 56vw;
	background-color:#121313;
	z-index: 1;
	text-align: justify;
    font-variant: normal;
}

.titres
{
	height: 12vh;
	position: sticky;
	display: flex;
	top:0%;
	width: 100vw;
	border-top-color: black;
	background-color: black;
	z-index: 5;
	text-align: center;
}

.titres a 
{
    display: flex;
    flex-direction: column;
    width: 25vw;
    height: auto;
    background-color: black;
    margin: 0;
    margin-left: auto;
    padding: 2vmin 0 2vmin 0;
    text-decoration: none;
    color: white;
    font-size: 1em;
    align-items: center;
    justify-content: center;
}
    

.logo
{
    max-height: 100%;
    height: auto;
    width: auto;
    max-width: 22vw;
    padding: auto;
    margin: 0;
}

.images
{
    height: 80%;
    width:  auto;
    padding: auto;
    margin: 0;
}

.titres a:hover
{
    font-weight: bold;
}

@media (max-width: 600px)
{
    .titres a 
    {
        font-size: 0.5em;
    }
    h2
    {
        font-size: 0.8em;
    }
    h1
    {
        font-size: 1.5em;
    }
    .ancre
    {
        font-size: 0.5em;
    }
    .texte
    {
        font-size: 0.8em;
    }
}

.titre
{
    z-index: 1;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: rgba(0,0,0);
    margin:0;
    font-size: 1em;
    height: auto;
    width: 100vw;
}

h1
{
	position: absolute;
	margin: auto;
    font-variant: small-caps;
}


.fond
{
    width: 100vw;
    height: 35vh;
    object-fit: cover;
}



.footer
{
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    background-color: rgba(0,0,0,1);
    width:100%;
    min-height: 12vh;
    height: auto;
    font-size: 1em;
    font-variant: normal;
}
.footer a
{
    text-decoration: none;
    color: white;
}

.mentions
{
    font-variant: normal;
    font-style: italic;
    font-size: 0.8em;
    text-decoration: none;
    color: white;
}
