

body{
  background:url(imgcss/moi-2.gif);
  border-radius: 20px;
}



/*barre de naviguation*/

nav{
	max-width:1350px;
	margin-right:auto;
	margin-left:auto;
}

.navbarul{
	list-style-type: none;
	overflow: hidden;
	font-family: orkneyregular;
	padding: 0px 100px;
	max-height: 60px;
}

.navbarli{
   float: left;
}


.navbarli a{
   display: block;
   color: #fff;
   text-align: center;
   padding: 0px 20px;
   text-decoration:none;
}

.navbarli a:hover{
   color: rgb(255, 140, 0);
}

img{
	width:70px ;
}

#Profil{
	width:50px ;
  border-radius:15px;
}

.neonbox{
	color:#f8d6f7;
   width:100%;
   background-color: #00104300;
   box-shadow: 
	   inset 0px 0px 4px 1px #FFFFFF,
	   inset 0px 0px 10px 1px #FF00F5,
	   inset 0px 0px 10px 1px #FF00F5,
	 0px 0px 10px 1px #FF00F5,
  	 0px 0px 10px 1px #FF00F5;
	border-radius: 15px;
}

header{
	position:fixed;
	top: 0;
	left:0;
	width:100%;
	background-color:#00104300;
	opacity:0;
	transition : all 0.1s ease-in-out;
}

.anim-header{
	opacity:1;
}

















/*Pied de page*/

#neonbox2{
	color:#fff;
   width:100%;
   background-color: #001043;
   box-shadow: 
	   inset 0px 0px 4px 0.5px #FFFFFF,
	   inset 0px 0px 10px 0.5px #FF00F5,
	   inset 0px 0px 10px 0.5px #FF00F5,
	 0px 0px 10px 1px #FF00F5,
  	 0px 0px 10px 1px #FF00F5;
	border-radius: 5%;
}
.navbarul2{
	list-style-type: none;
	overflow: hidden;
	font-family: Orkney-Light;
	padding: 0px 150px;
}
footer{
	display: block;
	color: #fff;
	text-decoration:none;
	height:125px;
}

.navbarli2 a{
	display: block;
	color: #fff;
	text-decoration:none;
 }

 .navbarli2 a:hover{
	color: rgb(255, 140, 0);
 }
footer ul{
	display: inline-block;
}
#droite{
	text-align: left;
	float: left;
	display: block;	
} 
#centre{
	text-align: right;
	padding-right: 10%;
	float: right;
}
footer div a{
	padding: 0;
}
#mail{
	width: 20px;
	float: left;
	padding-right: 10px;
	padding-bottom: 10px;
	line-height: 1,5;
}
#place{
	width: 20px;
	float: left;
	padding-right: 10px;
}
.Réseaux{
	width: 35px;
	height: 35px;
  border-radius:10px;
}

#droits{
	font-size: 10px;
	margin-left: 415px;
	padding-left: 0px;
	align-items: baseline;
	float: left;
	grid-row: 2/-1;
}





.floating-btn {
  position: absolute;
  bottom: 5%;
  left: 50%; /* ces 3 propriétés permettent de positionner précisément le bouton   */
  width: 75px;
  height: 75px;
  border-radius: 50%;
  border: 2px solid #f1f1f1;
 
  cursor: pointer;
  box-shadow: 0 0 0 0 #fff;
  animation: pulse 1.3s infinite; 

}

@keyframes pulse {
  to {
    box-shadow: 0 0 0 1rem rgba(255, 255, 255, 0.01);
  }
}
 .floating-btn img {
    width: 30px;
    height: 30px;
   
  
  }

  

  
  #section1{
    border: #FFFFFF solid 1px;
    border-radius: 20px;
    margin-top: 50%; 
    background-image: linear-gradient(
      115deg,
      rgba(234, 173, 241, 0.466),
        rgba(255, 255, 255, 0.363)
  
    
     ),
      url(imgcss/QSJ.gif);
    width: 100%;
  }    

  h1 {
margin-left: 50%;
font-family: orkney;

  }

  h2{
    margin-left: 50%;
font-family: orkney;
  }
p{
  margin-left: 50%;
font-family: orkney;

}
  #moi{

    border-radius:100px;
    width: 20%;
    margin-left: 10%;
    margin-top:5%;
    float: left ;

  }


.floating-btn2{
  position: absolute;
  bottom:-70%;
  left: 50%; /* ces 3 propriétés permettent de positionner précisément le bouton   */
  width: 75px;
  height: 75px;
  border-radius: 50%;
  border: 2px solid #f1f1f1;
 
  cursor: pointer;
  box-shadow: 0 0 0 0 #fff;
  animation: pulse 1.3s infinite;
  scroll-behavior: auto;
}

@keyframes pulse {
  to {
    box-shadow: 0 0 0 1rem rgba(255, 255, 255, 0.01);
  }
}
 .floating-btn2 img {
    width: 30px;
    height: 30px;
   
  
  
  }

  #section2{
    border: #FFFFFF solid 1px;
    border-radius: 20px;
    margin-top: 27%; 
    background-image: linear-gradient(
      115deg,
      rgba(234, 173, 241, 0.466),
        rgba(255, 255, 255, 0.363)
  
    
     ),
      url(imgcss/lecture.gif);
    width: 100%;
    float: center;
  }    

  #MDJ{

width: 20%;
border-radius: 20px;
margin-left: 5%;
  }

  #MFM{

width: 18%;
border-radius: 20px;
margin-left: 17%;
  }

  #OR{
    width: 18%;
    border-radius: 20px;
    margin-left:18%;

  }

  #section2 > h2{
margin-left: 40%;


  }

  #section2 > p 
  {

    margin-left: 40%;
    font-size: 70%;
    
  }
  span{

    font-size: 40%;
  }





  
.floating-btn3{
  position: absolute;
  bottom: -183%;
  left: 50%; /* ces 3 propriétés permettent de positionner précisément le bouton   */
  width: 75px;
  height: 75px;
  border-radius: 50%;
  border: 2px solid #f1f1f1;
 
  cursor: pointer;
  box-shadow: 0 0 0 0 #fff;
  animation: pulse 1.3s infinite;
  scroll-behavior: auto;
}

@keyframes pulse {
  to {
    box-shadow: 0 0 0 1rem rgba(255, 255, 255, 0.01);
  }
}
 .floating-btn3 img {
    width: 30px;
    height: 30px;
   
  
  
  }

  #section3{
    border: #FFFFFF solid 1px;
    border-radius: 20px;
    margin-top: 19%; 
    background-image: linear-gradient(
      115deg,
      rgba(241, 240, 173, 0.692),
        rgba(255, 255, 255, 0.363)
  
    
     ),
      url(imgcss/Voyage.gif);
    width: 100%;
    float: center;
  }    

  #section3 > h2{
    margin-left: 40%;



  }

  #section3 > h3{
    margin-left: 5%;
    font-family: Fresh Lychee;
    font-size: 30px;


  }

  
  #section3 > p{
font-size: 100%;
margin-bottom:7%;
margin-left: 5%;



  }


  #Kenya{
    width: 18%;
    border-radius: 10px;
    margin-left:5%;
    margin-bottom:4%;
    float: left;

  }
  
  
#Tanzanie{

  width: 18%;
  border-radius: 10px;
  margin-right:5%;
  margin-bottom:-25%;
  float: right;
}

#tanzanie{

  margin-left: 60%;
    font-family: Fresh Lychee;
    font-size: 30px;
    float: left;
    bottom: 10px;
    
}

#tanzanie2{

  font-size: 100%;
  margin-bottom:7%;
  margin-left: 30%;
  float: left;
}







  

  
  
#chevron{
width:35px;
margin-left: 15%;

}

  

  

      








