@font-face {
    font-family: 'Almarai';
    src: url('fonts/Almarai-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}


body {
    margin: 0;
    height: 100vh;
    background-color: #00a651;
    color : #fff;
    font-family: 'Almarai', Arial, Helvetica, sans-serif;
    font-size : 16px;
  }


  .alinea {
    display : inline-block;
    text-indent: 40px; /* taille de l'alinéa */
  }

  .bigger {
    font-size:22px;
  }

.site-main {
  display: flex;
}

.logo,
.logo svg {
  width : 15vw;
  height : auto;
}

.infos {
  width : 20vw;
  margin-left : 10vw;
  height : calc(100vh - 30px);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.projets {
  width : 30vw;
  margin-left : 10vw;
}



.logo,
.infos,
.projets {
  padding : 15px;
}

@media (max-width: 1000px) {
  body {
    font-size : 14px;
  }
  .alinea {
    text-indent: 20px; /* taille de l'alinéa */
  }
  .bigger {
    font-size : 18px;
  }
  .logo,
  .logo svg {
    width : 20vw;
  }

  .infos, .projets {
    margin-left : 5vw;
  }

}

@media (max-width: 600px) {
  .site-main {
    flex-direction : column;
  }
  .logo,
  .logo svg {

    width : 60vw;
    max-width : calc(100vw - 30px);

  }

  .infos,
  .projets {
    width : calc(100vw - 30px);
    margin-left : 0;
  }

  .infos {
    height : auto;
  }

  .contact {
    margin-top : 15px;
    border-top : 0.5px white solid;
    padding-top : 15px;
  }



  .projets-wrap {
    border-top : 0.5px white solid;
    padding-top : 15px;
  }

}