html{
    font-family: 'Tenor Sans',sans-serif;
  }
  hr{
      background: grey;
  }
  #container{
      position: relative;
      display: flex;
  }
  #sidebar{
      flex: 15%;
      display: block;
      position: relative;
      margin: 5% 2% 0 10%;
      width: 100%;
      height: 100%;
  }
  #info-pages{
      flex: 55%;
      display: block;
      margin-top: 5%;
      margin-right: 10%;
      width: 100%;
      height: 100%;
  }
  #image{
      position: relative;
      overflow: hidden;
  }
  #image,#profile-photo{
      position: relative;
      width: 220px;
      height: 205px;
      border-radius: 20px;
  }
  #name{
      font-size: 25px;
      line-height: 20px;
  }
  #description{
      color: #555;
      font-size: 14px;
  }
  .page > ul > li{
      padding: 0 0 0 15px;
      position: relative;
      display: inline-block;
      width: 100%;
  }
  .page{
      box-shadow: 0px 0px 20px -9px rgba(0,0,0,0.75);
      overflow-x: hidden;
      margin-bottom: 30px;
      padding: 15px 30px 30px 30px;
      background-color: #fff;
  }
  .page > p{
      font-size: 19px;
      line-height: 2;
  }
  .page > ul{
      list-style-type: none;
  }
  .tag{
      font-size: 17px;
      font-weight: bold;
  }
  .tag span{
      font-size: 14px;
      color: #0e141e;
  }
  .tag span span{
      color: #738f93;
  }
  @media screen and (max-width:1090px){
      #sidebar{
          margin-left: 5%;
      }
  }
  @media screen and (max-width:850px){
      #container{
          display: block;
      }
      #sidebar{
          width: 90%;
      }
      .page{
          margin: 0 5%;
          margin-bottom: 30px;
      }
  }
  #skill {
    display:inline;
    font-family: "Courier New", Courier, monospace;
    font-size: 14px !important;
    background: #d1d1d1;
    padding: 2px;
    border-radius: 4px;
    line-height: 35px;
  }
  #skill:hover {
    background-color: #b8b8b8;
  }
  #skill-stronger {
    display:inline;
    font-family: "Courier New", Courier, monospace;
    font-size: 18px !important;
    background: #b8b8b8;
    padding: 3px;
    border-radius: 5px;
    line-height: 35px;
  }
  #skill-stronger:hover {
    background-color: #a3a3a3;
  }
  .cryptedmail:after {
    content: attr(data-name) attr(data-surname) "@" attr(data-domain) "." attr(data-tld);
  }
  .cryptedmail{
      font-size: 15px !important;
      font-weight: bold;
      color: #708090;
      text-decoration: none;
      font-family: 'Cutive Mono', Courier, monospace;
  }
  #sidepanel-section-title{
    line-height: 30px;
  }
  #social-thumbnail{
      position: relative;
      width: 40px;
      border-radius: 20px;
  }
  #cert-thumbnail{
      position: relative;
      width: 100px;
      margin-bottom: 10px;
      border-radius: 20px;
  }
  .link{
    text-decoration: none;
    color: #708090;
    font-weight: bold;
    font-family: 'Cutive Mono', Courier, monospace;
  }
  ul > li{
    font-size: 14px;
    list-style-type: disc;
    line-height: 20px;
    font-family: 'Open Sans', sans-serif;
  }
  .counter{
    font-size: 14px;
    color: #545454;
    font-weight: bold;
    position: absolute;
    left: 50%;
    padding-bottom: 3em
  }
  #project{
    position: relative; 
    left: -80px
  }