.competence{
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}
.intro{
    width: 60%;
    border-radius: 15px;
    box-shadow: 10px 10px 10px 10px #e0dbdb;
    padding: 2%;
  }

  .info_competence{
    width: 80%;
    border-radius: 15px;
    box-shadow: 10px 10px 10px 10px #e0dbdb;
    padding: 2%;
    margin-top: 3%;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .html,
  .css,
  .php,
  .javascript,
  .python,
  .git,
  .bdd{
    width: 80%;
    margin-top: 3%;
    display: flex;
    flex-direction:row;
    justify-content:space-around;
    
    
  }
  .langage{
    width: 25%;
    margin-right: 3%;
    font-size: 20px;
  }

  .box
  {
    background:#fff;
    width:300px;
    height:400px;
    display:flex;
    justify-content:center;
    align-items:center;
    position:relative;
    flex-direction:column;
    box-shadow:0 30px 60px rgba(0,0,0,.4);
    transition: transform .2s;
  }
  /* .box:hover
  {
   transform:scale(1.2);
  } */
  .box .percent
  {
    width:150px;
    height:150px;
    position:relative;
  }
  .box .percent svg
  {
    width:150px;
    height:150px;
    position:relative;
  }
  .box .percent svg circle
  {
    width:150px;
    height:150px;
    fill:none;
    stroke-width:10;
    stroke:#000;
    transform:translate(5px,5px);
    stroke-dasharray:440;
    stroke-dashoffset:440;
    stroke-linecap:round;
  }
  .box .percent svg circle:nth-child(1)
  {
    stroke-dashoffset:0;
    stroke:#f3f3f3;
  }
  .box .percent svg circle:nth-child(2)
  {
    stroke-dashoffset:calc(440 - (440 * 87) / 100);
    stroke:#03a9f4;
  }
  .box .percent .num
  {
    top:0;
    left:0;
    width:100%;
    height:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    position:absolute;
    color:#111;
  }
  .box .percent .num h2
  {
    font-size:48px;
  }
  .box .percent .num h2 span
  {
    font-size:24px;
  }
  .box .text
  {
    padding: 10px 0 0;
    color:#999;
    font-weight:700;
    letter-spacing:1px;
  }