/*

#ff9c00

font-family: 'Playfair Display', serif;

*/



/* corp body */

h1,h2{



  font-family: 'Playfair Display', serif;



}



body

{

   background-color:#ff9c00; #fff85b;

   text-align:center;

   font-family: 'Muli', sans-serif;

   margin: 0;

   height:100%;

   width:100%;

}



h1

{

   color: yellow;

}



ul {

list-style:none;

margin-left:0;

padding-left:0;

}



h2

{

   color: blue;

}



/* en tete */

header

{

  background-color: #050706 ;

  color:white;

  

}



.menu{

  display: flex;

  align-items: flex-end;

  display: flex;

  align-items: flex-end;

  text-align :center;  

 

}



/* Navigation */



nav ul

{

    list-style-type: none;

    display: flex;

    justify-content: center;

}



nav li

{

    margin-right: 15px;

}



nav a

{

    font-size: 1.3em;

    color:white;

    padding-bottom: 3px;

}



nav

{

  

  display:block;

  margin-left:auto;

  margin-right:auto;

}



nav a:hover

{

    color: #760001;

    border-bottom: 3px solid #760001;

}



/* millieu body */

#coolman

{

    background: #FFFFFF;

    padding-top: 12rem;

    padding-bottom: 15rem;

    display: flex;

  align-items: flex-end;

  text-align :center;  

}





#accroche

{

  display: flex;

  align-items: flex-end;

  text-align :center;  

}



.tout 

{

  padding:100px 25px;

  display: flex;

  justify-content:center;

  background-image: url(images/moi2.jpg);

  background-size: cover;

  background-repeat: no-repeat;

}

.tout section

{

  background-color: rgba(255,255,255,0.6);

  padding: 30px;

}



.skill-bars li .progress

{

    background: #a03030;

    position: relative;

    height: 100%;

}



#competence

{



}



#profil

{

   

}



/* image */

.social img

{

  width: 25%;

  display:block;

  margin-left:auto;

  margin-right:auto;

}



#accroche img

{

  width: 25%;

  display:block;

  margin-left:auto;

  margin-right:auto;

}





#presentation img

{

  width: 15%;

  display:block;

  margin-left:auto;

  margin-right:auto;

}



.surprise img

{

  width: 5%;

  display:block;

  margin-left:auto;

  margin-right:auto;

}





/* pied de page */





#footer

{

  color: blue;



}



.footer2

{

 display: flex;

 justify-content: center;

 align-items: center;

}

.footer2 a{

  width: 200px;



}









.social

{

  display: flex;

  align-items: flex-end; 

}



.top-link {

    

    font-size:25px;

    margin: 20px;

    color: #d82c2e;

    height: 30px;

    display: block;

    top: inherit;

    position: fixed;

    right: 1px;

    bottom: 2px;

    display: none;

    padding: 15px 15px;

} 



#upp{





}



/*

.skill-bars li .progress span

{

    position: absolute;

    right: 0;

    top: -3.6rem;

    display: block;

    color: white;

    font-size: 1.1rem;

    line-height: 1;

    background: #313131;

    padding: .6rem .6rem;

    border-radius: 3px;

}  */







@media screen and (min-width: 700px) /** TELEPHONE **/



 {



 #menu

 {

  align-items: column;

 }









#up

{

  width:5%;

}





}/* fin de media querie*/