.website {
  text-align: center;
}
@media screen and (max-width: 800px) {
  .website {
    margin-top: 5rem;
  }
}

section#menu .elem {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media screen and (max-width: 800px) {
  section#menu .elem {
    flex-direction: column;
  }
}
section#menu .elem > div {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 10%;
  position: relative;
  width: 100%;
  height: 33vh;
  background: center/cover;
  z-index: 10;
}
@media screen and (max-width: 800px) {
  section#menu .elem > div {
    height: 10rem;
  }
}
section#menu .elem > div > a {
  font-weight: 900;
  transition: 0.25s;
  padding: 0.75rem;
  background-color: rgba(255, 255, 255, 0.8);
  border: 1px solid black;
  border-radius: 2rem;
  color: green;
  text-decoration: none;
  text-transform: uppercase;
}
section#menu .elem > div > a:hover {
  color: white;
  background-color: rgba(0, 128, 0, 0.8);
}
section#menu .elem .presentation {
  background-image: url(../media/menu/fond-presentation-before.png);
}
section#menu .elem .presentation:hover {
  background-image: url(../media/menu/fond-presentation-after.png);
}
section#menu .elem .portfolio {
  background-image: url(../media/menu/fond-portfolio-before.png);
}
section#menu .elem .portfolio:hover {
  background-image: url(../media/menu/fond-portfolio-after.png);
}
section#menu .elem .experience-professionnelles {
  background-image: url(../media/menu/fond-experience-professionnelles-before.png);
}
section#menu .elem .experience-professionnelles:hover {
  background-image: url(../media/menu/fond-experience-professionnelles-after.png);
}
section#menu .elem .formation {
  background-image: url(../media/menu/fond-formation-before.png);
}
section#menu .elem .formation:hover {
  background-image: url(../media/menu/fond-formation-after.png);
}
section#menu .elem .documents {
  background-image: url(../media/menu/fond-documents-before.png);
}
section#menu .elem .documents:hover {
  background-image: url(../media/menu/fond-documents-after.png);
}

section#presentation .facette {
  text-align: left;
  display: flex;
  justify-content: space-around;
  align-items: flex-start;
}
section#presentation .facette > div {
  width: 45%;
}
@media screen and (max-width: 1200px) {
  section#presentation .facette {
    flex-direction: column;
  }
  section#presentation .facette > div {
    width: 100%;
  }
}

section#portfolio .ligne {
  display: flex;
}
section#portfolio .ligne > div {
  position: relative;
  margin: 0.75rem;
  background-color: crimson;
  width: 50%;
  height: 10rem;
  box-shadow: 0px 0px 7px 2px #000000;
  border-radius: 2rem;
  font-weight: 900;
}
section#portfolio .ligne > div span {
  padding: 0.15rem 0.75rem;
  background-color: white;
  border-radius: 1rem;
}
section#portfolio .ligne > div a {
  position: absolute;
  display: block;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 0.75rem;
  background-color: white;
  border: 1px solid black;
  border-radius: 2rem;
  color: green;
  text-decoration: none;
  text-transform: uppercase;
}
@media screen and (max-width: 1070px) {
  section#portfolio .ligne > div a {
    margin-top: 1rem;
  }
}
@media screen and (max-width: 344px) {
  section#portfolio .ligne > div a {
    margin-top: 2rem;
  }
}
section#portfolio .ligne > div a:hover {
  color: white;
  background-color: rgba(0, 128, 0, 0.8);
}
@media screen and (max-width: 800px) {
  section#portfolio .ligne {
    flex-direction: column;
  }
  section#portfolio .ligne > div {
    width: 100%;
  }
}
section#portfolio .ligne .c-est-pas-dla-carotte {
  background: url(../portfolio/cestpasdlacarotte.png) center/cover;
}
section#portfolio .ligne .real-estate-prototype {
  background: url(../portfolio/Realestate-prototype.png) center/cover;
}
section#portfolio .ligne .mexico {
  background: url(../portfolio/mexico.png) center/cover;
}
section#portfolio .ligne .real-estate {
  background: url(../portfolio/Realestate.png) center/cover;
}

section#section-formation h3.entete {
  display: block;
  top: 1rem;
  height: 5rem;
  width: 100% !important;
  background: center/cover;
  box-shadow: 11px 8px 5px 0px #000000;
  font-weight: 900;
  color: white;
  text-shadow: 1px 1px 3px #000000, 2px 2px 2px #333333;
  line-height: 5rem;
}
@media screen and (max-width: 800px) {
  section#section-formation h3.entete {
    line-height: 2.6rem;
  }
}
section#section-formation .isfsc {
  background-image: url(../media/isfsc-modif.png) !important;
}
section#section-formation .cfitech {
  background: url(../media/wordpress-modif.png) !important;
}
section#section-formation .bruxelles-formation-web {
  background: url(../media/web-designer-modif.png) !important;
}
section#section-formation .bruxelles-formation-formation {
  background-image: url(../media/formation.png) !important;
}
section#section-formation .iaps {
  background-image: url(../media/flandre-modif.png) !important;
}
section#section-formation .formation-pc {
  display: flex;
  justify-content: flex-start;
}
section#section-formation .formation-pc .listing {
  width: 50%;
  font-size: 20px;
}
section#section-formation .formation-pc .apercu {
  text-align: left;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  width: 50%;
  padding: 1rem;
  border: 1px solid rgb(46, 46, 46);
  border-radius: 1rem;
  background: url("../media/Fond-formation-modif.png") center/cover;
  font-weight: 900;
}
section#section-formation .formation-pc .apercu b {
  font-size: 18px;
}
section#section-formation .formation-pc > div {
  margin: 0 1rem;
}
@media screen and (max-width: 1000px) {
  section#section-formation .formation-pc {
    display: none;
  }
}
section#section-formation .formation-mobile {
  display: none;
  text-align: left;
}
@media screen and (max-width: 1000px) {
  section#section-formation .formation-mobile {
    display: block;
  }
  section#section-formation .formation-mobile h3 {
    top: 50%;
    text-align: center;
  }
}
section#section-formation .formation-mobile span {
  text-align: left;
}

section#xp-professionnelle > div {
  text-align: justify;
}

section#section-documents {
  display: flex;
  margin-bottom: 5rem;
}
@media screen and (max-width: 1280px) {
  section#section-documents {
    flex-direction: column;
    justify-content: flex-start;
  }
}
section#section-documents .doc-affichage {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  cursor: pointer;
  margin-left: 2rem;
  margin-right: 10rem;
}
@media screen and (max-width: 1280px) {
  section#section-documents .doc-affichage {
    margin-left: 0;
    margin-right: 0;
  }
}
section#section-documents .doc-affichage > span {
  border-radius: 1rem 1rem 0 0;
  width: 30rem;
  padding: 4rem 0;
  background-color: rgb(190, 190, 190);
  border: 1px solid #333333;
}
section#section-documents .doc-affichage > span:first-child {
  border-radius: 1rem 1rem 0 0;
}
section#section-documents .doc-affichage > span:last-child {
  border-radius: 0 0 1rem 1rem;
}
@media screen and (max-width: 1280px) {
  section#section-documents .doc-affichage > span {
    width: 90%;
  }
}
section#section-documents .doc-js {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
}
section#section-documents .doc-js img {
  width: 75%;
}
@media screen and (max-width: 1280px) {
  section#section-documents .doc-js {
    margin-left: 2rem;
    margin-right: 0;
  }
}
section#section-documents .doc-js a {
  transition: 0.25s;
  color: black;
  text-decoration: none;
  text-transform: uppercase;
}
section#section-documents .doc-js a:hover {
  background-color: #88c388;
  color: black;
}

section#section-spotify {
  margin: 0 4rem 0 17rem;
  height: 30rem;
}
@media screen and (max-width: 800px) {
  section#section-spotify {
    margin: 0 4rem;
  }
}

footer {
  background-color: green;
  position: fixed;
  width: 100vw;
  bottom: 0;
  left: 0;
  text-align: center;
  z-index: 10;
}
footer span {
  margin: 0.25rem;
}/*# sourceMappingURL=website.css.map */