body{

    background-color: rgb(247, 236, 236);
}

.perso{
  background-image:url("../../../img/fond.png")  !important;
}

#PhotoMoi{
    width:140px;
    height:180px;
    border-radius: 45%;
}

#text-presentation, #presentEscape, #presentAPC, #presentVAE, #presentCluedo{
    font-size: 22px;
}

h1{
    padding: 20px;
    text-align: center;
    font-size: 60px;
}

h2{
    margin-bottom:20px;
}


main, main div {
    padding: 20px;
}

@keyframes defile {
  from {background-position: 0px 0px;}
  to {background-position: 80px 80px;}
}

#presentPerso{
    padding-bottom: 40px;
    background:url("../../../img/fond.png");
    animation: defile 5s infinite;
}

#presentPerso main div div p, #presentPerso h1{
    color: rgb(238, 225, 225);
}





#presentProjetPro{
  padding-bottom: 30px;
  position: relative;
  width: 100%;
  overflow: auto;
}

#presentProjetPro, .content{
  position: relative;
  width: 100%;
  height: 100%;
}

#presentProjetPro{
  background-size: cover;
  background-attachment: fixed;
}

#presentProjetPro::before{
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  background-image:url("../../../img/coucher_soleil.jpg") ;
  filter: brightness(50%);
  background-size: cover;
  background-attachment: fixed;
}

.content{
  color: #e9dfdf;
}

#introComp, #introProj{
    font-size:22px;
    text-align: center;
    margin-bottom: 50px;
}

#petitTrait{
    border-top:1px solid black;
    margin:20px;
}

#GrandTrait{
    border-top:1px solid black;

}

#WebComp, #DBComp, #ProgComp, #OSComp{
    text-align: center;
    margin-bottom: 30px;
}



.overlay {
font-size: 20px;
text-align: center;
display: none;
}

#carte:hover .overlay {
display: block;
}

em{
    font-style:normal;
    font-weight: bold;
}


#linkedin, #github{
  max-width: 30px;
  max-height: 30px;
}