@font-face {
    font-family: 'Lato';
    src: url('Lato-Regular.woff') format('woff');
    src: url('Lato-Black.woff') format('woff');
    src: url('Lato-BlackItalic.woff') format('woff');
    src: url('Lato-Bold.woff') format('woff');
    src: url('Lato-BoldItalic.woff') format('woff');
    src: url('Lato-Italic.woff') format('woff');
    src: url('Lato-Light.woff') format('woff');
    src: url('Lato-LightItalic.woff') format('woff');
    src: url('Lato-Thin.woff') format('woff');
    src: url('Lato-ThinItalic.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    
}
*{
    scroll-behaviour : smooth;
}
header {
    display :inline-block;
    width : 100%;
	padding: 0;
	text-align: center;
	color: #40CCEA;
	background-color: #FFF;
	position : sticky;
}
footer {
	padding: 2em;
	text-align: center;
	color: #fff;
	background-color : #40CCEA;
}
body{
    margin: 0;
    background-color : #FFF;
    
}
.toolbar{
    display:block;
    width : 100%;
    background-color : #40CCEA;
    padding: 10px;
    margin :0;
    font-family : Sans-serif ;
    font-weight : normal;
    
}
a {
    text-decoration : none;
    color : #333;
    font-weight : bold;
}
.toolbar > a {
    text-decoration : none;
    color : #FFF;
    padding : 5em;
    font-size : 20px;
    text-align : center;
}
nav > a{
    color : #FFF;
}

.container {
	max-width: 1100px; 
	margin-left: auto; 
	margin-right: auto;
	text-align : justify;
    margin : auto;
    max-width: 960px;

}

#CarnetDeVoyage{
    font-size :3rem;
    font-family : sans-serif;
    font-weight : normal;
    color : #40CCEA;
    text-align :  center;
    margin :auto;
    margin-top :0.5em;
    border-bottom : 0.5px dashed #40CCEA;
    line-height : 2em
}
article {
    margin-bottom : 30px;
    font-weight :800;
    justify-content : space-around;

}
article > p{
        font-family : 'Lato' ;
}
h2{
    font-size : 1.6rem;
    text-transform : uppercase;
    font-weight : normal;
    font-family : sans-serif;
    color :#333;
    line-height : 2em
}
h3{
    font-size : 1.4rem;
    font-weight : normal;
    font-family : sans-serif;
    color :#333;
    line-height : 1.5em
}


button{
    Padding : 0.5em 0.5em;
    color : #fff;
    background-color: #0096D0;
    border-color : #FFF;
    border-radius : 6px;
    cursor : pointer;

}
button:hover{
    color: #0096D0;
    background-color : #FFF;
}
.vienne{
    float : left;
    margin-right: 1em;
}
.marrakech{
    float: right;
    margin-left : 1em;
}
.clear{
    clear : both;
}
article > p {
    display: block;
    text-align : justify;
    color : #000;
    line-height : 1.6em;
}
img>article{
    min-width:49%;
}
hr{
    display : block;
    border: 0;
    border-top: 1px solid #333;
    margin : 0.5em;
}
.fond{
    background-image : url(fond.jpg);
    width : 100%;
    background-position: center;
    background-size: cover;
    padding: 40px;
    margin : 0;
   
}
#APropos{
    background-color : #FFF;
    width : 45%;
    font-family : 'Lato';
    padding : 1em;
}
main > article{
     width : 100%;
}
.rouge{
    color : #F00;
}
.ocre{
    color : #CD8C56;
}