html{
	scrool-behavior: smooth;
}
body{
	font-family: 'Advent Pro', sans-serif;
	padding:0;
	margin:0;
}
	ul{
	margin:0;
	padding:0;
	}
	li{
		list-style-type: none;
	}
	h2{
		text-transform: uppercase;
		text-align: center;
		padding-top: 30px;
		font-size:2em;
	}
	a{
	    text-decoration: none;
        color: white;
	}
	/*    ********* NAVBAR *******   */
	nav{
		overflow: hidden;
		background-color: #0000FF;
		position: fixed;
		width:100%;
		opacity:0.9;
		height:50px;
	}
	header li{
		float: right;
		font-size:1em;
		font-weight: bold;
	}
	header li a{
		text-decoration: none;
		display: block;
		text-align: center;
		padding: 14px 16px;
	}
	#logo{
		font-family: Dancing Script, sans serif;
		font-weight: bold;
		float: left;	
	}
	/* ****image principale******** */
	#imagePrincipale{
		padding-top: 60px;
		background:url(media/port-de-cotonou.JPG) no-repeat fixed 50% 50%;
		background-size: cover;
		height: 799px;
	}
	h1{
		font-family:'Dancing Script', cursive; 'sans serif';
		text-align: center;
		color:blue;
		font-size: 2em;
		margin-top: 30px;
		text-shadow: 1px 3px 2px black; 
	}
	#premierTrait{
		height: 1px;
		width: 25%;
		margin: -3px auto;
		background-color: #FFFAE1;
		box-shadow: 1px 3px 2px black;
	}
	#slogan{
		text-align: center;
		color: orangered;
		font-size: 2em;
		text-shadow: 1px 1px 1px wheat;
	}
	/* *****Presentation******  */
	#presentation{
		background-color: whitesmoke;
		padding: 10px 0 100px 0;
		height: 700px;
	}
	#notreMission{
		background-image: url(media/bateau.jpg);
		margin: 65px 60px 0 100px;
		height: 500px;
		width: 70%;
		max-width: 700px;
		float: right;
		/*box-shadow: 6px 6px 28px -1px rgba(0,0,0,0.75);*/
		border-radius: 40px;
	}
	#notreMission p{
		height: 150px;
		width: 350px;
		color: #FFFAE1;
		background-color: blue;
		float: left;
		margin: 150px 0 0 -210px;
		font-family: Dancing Script, sans serif;
		font-size: 1.3em;
		text-align: center;
		padding: 50px 15px 0 15px;
		border-radius: 10px;
		box-shadow: 4px 4px 0 1px rgb(238, 109, 97);
	}
	#nosServices{
		background-color: white;
		padding: 10px 0 10px 0;
	}
	#nosServices h2{
		padding-top: 60px;
	}
	#elementNosServices {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		padding-left: 20px;
		padding-right: 20px;
		padding-bottom: 40px;
    }
	.imageNosServices{
		border: 0 solid;
		border-radius: 8px;
		background-color: whitesmoke;
		width: 270px;
		max-width: 270px;
		padding: 0 0;
		margin: 15px 10px 20px;
	}

	.imageNosServices img {
		width: 100%;
		margin-bottom: 20px;
		border: 8px;
		border-radius: 10px 10px 0 0;
	}
	 .nomService{
		text-align: left;
		padding: 0 2%;
		margin-left:5px;
		margin-bottom: 20px;
		color: black;
		font-size: 1.6em;
	}
	button{
		border: none;
		padding: 5px 10px;
		font-size: 1.1em;
		background-color: blue;
		color: white;
		margin-left: 10px;
		margin-bottom: 20px;
		font-family: Dubai;
		border-radius: 8px;
	}
	button:hover{
		border: 1px solid #0000FF;
		background-color: white;
		color: blue;
		font-weight: bold;
		cursor: pointer;
		transition: 0.4s ease-in-out;
	}
	/* *******Section Slogan*******  */
	#sectionSlogan{
		margin-bottom: 100px;
	}
	.conteneur {
		display: inline-block;
		position: relative;
		border: 0 solid ;
		width: 1270px;
		max-width: 1270px;
		margin: 0 0;
	}
	.conteneur img{
		width: 100%;
	}
	.conteneur .texte {
		background: rgba(8, 28, 245, 0.5);
		z-index: 1;
		position: absolute;
		text-align: right;
		font-family: Georgia;
		margin: 0 auto;
		left: 59%;
		right: 0;
		top: 65%;
		color: white;
		width: 40%;
		padding-right: 8px;
		border-radius: 10px;
	}
	.conteneur .texte .titreSurImage{
		text-align: right;
	}
	.conteneur .texte .mot{
		font-weight: bold;
		margin-right: 8px;
	}
	#contactZone h2{
		padding-top: 60px;
	}
	.elementContactZone{
		text-align: center;
	}
	.elementContactZone p{
		color: #5d5c5c;
		font-weight: bold;
		margin-bottom: 62px;
	}
	#sectionContact{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		padding-left: 20px;
		padding-right: 20px;
		padding-bottom: 50px;
		margin-top: 50px;
	}
	.elementSectionContact{
		background-color: whitesmoke;
		border: 1px solid whitesmoke;
		border-radius: 10px;
		box-shadow: 6px 6px 3px rgba(238,109,97,0.6);
		width: 270px;
		min-width: 270px;
		padding: 0 0;
		margin: 15px 10px 10px;
	}
	.localisation, .telephone, .mail{
		color: black;
		text-align: center;
		padding-top: 30px;
		font-size:1.5em;
		font-family: Dubai;
		color: blue;
	}
	.definitionContact, .definitionTelephone, .definitionMail{
		color: #5d5c5c;
		text-align: center;
		font-family: Dubai;
		font-weight: bold;
	}
	/** ************** FOOTER*********  **/
	footer{
		background-color: #0000FF;
		color:#FFFAE1;
		padding: 20px 0 10px 0;text-align: center;
	}
	form{
		margin:0 auto;
		max-width: 900px;
	}
	#deuxiemeTrait{
		height:1px;
		widht:75%;
		backgroung-color:#FFFAE1;
		margin: 60px auto;
	}