body {
  margin: 10px;
  justify-content: center;
}

.wrapper {
    margin: 0px auto 0px auto;
    display: grid;
    grid-gap: 3px;
    grid-template-columns: 8% 8% 8% 8% 8% 8% 8% 8% 8% 8% 8% 8%;
    grid-auto-columns: 25%;
    background-color: #fff;
    color: #f00;
    max-width: 40em;
    max-height: 100vh;
  }

  .box {
    background-color: #822;
    color: #fff;
    border-radius: 3px;
    padding: 5px;
    margin: 0px;
    font-size: 150%;
  }

  .full {
    grid-column: 1 / 13;
  }
  .halfleft {
    grid-column: 1 / 7 ;
  }
  .halfright {
    grid-column: 7 / 13 ;
  }
  .thirdleft {
    grid-column: 1 / 5 ;
  }
  .thirdmiddle {
    grid-column: 5 / 9 ;
  }
  .thirdright {
    grid-column: 9 / 13;
  }
  .forth1 {
    grid-column: 1 / 4 ;
  }
  .forth2 {
    grid-column: 4 / 7 ;
  }
  .forth3 {
    grid-column: 7 / 10 ;
  }
  .forth4 {
    grid-column: 10 / 13 ;
  }

img {
    max-width: 100%;
}

.imgw {
    width: 2000px;
}

xmas-start {
  margin: 0px;
  padding: 0px;
  display: inline;
}