@keyframes rotate {
  0% {
    transform: rotate(-10deg)
  }
  50% {
    transform: rotate(0deg)
  }
  100% {
    transform: rotate(10deg)
  }
}

body {
  height: 100%;
  font-size: 2em;
}

div.title {
  position: absolute;
  width: 100%;
  font-size: 1.5em;
  left: 0;
  text-align: center;
  pointer-events: none;
}

div.footer {
  position: absolute;
  left: 0;
  bottom: 0;
  text-align: center;
  width: 100%;
  height: 20%;
}

table.footer {
  width: 100%;
  height: 100%;
  table-layout: fixed;
}

div.left, div.right {
  position: absolute;
  width: 50%;
  height: 80%;
  float: none;
}

div.left {left: 0}
div.right {left: 50%}

div.header {
  position: relative;
  width: 100%;
  height: 20%;
}

div.divName {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

div.body {
  position: relative;
  width: 100%;
  height: 60%;
}

div.li {
  position: relative;
  text-align: center;
  height: 20%;
}

a.sway {
  position: absolute;
  translate: -50% 0;
  animation: 1s rotate linear infinite alternate;
}