:root {
    --margin: 10px;
  }
  html, body {
    margin: 0;
    padding: 0;
  }

  body {
    background-image: url(images/91-917746_wooden-table-top-view-hd\ \(1\).jpg);
    min-height: 100vh;
    width: 100%;
  }

  .wrapper {
    margin: var(--margin);
  }

  ul {
    list-style-type: none;
  }
  
  #contents {
    /* display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr)); */
    display: flex;
    flex-wrap: wrap;
    grid-gap: var(--margin);
    align-items: start;
    justify-items: start;
    padding: 0;
    position: relative;
  }

  img {
    width: 100%;
    height: auto;
  }

  .block {
    padding: var(--margin);
    width: var(--width);

  transform: rotate(50deg);
  }

  .block:hover{
    -webkit-transition:.25s ease-out;
    transition:.25s ease-out;
    transform: rotate(0deg);
  }

  .title {
    text-align: center;
    position: relative;
    top: 10px;
    color: white;
  }

  .subtitle{
    text-align: center;
    position: relative;
    bottom: 20px;
    color: white;
  }

  .subtitle:hover{
    color: black;
    background-color: white;
    -webkit-transition:.25s ease-out;
    transition:.25s ease-out;
  }

  a {
    text-decoration: none;
    color:inherit
  }