.content {
  margin-top: 40px;
  margin-bottom: 60px;
}

span.preview {
  display: inline-block;
  height: 60px;
  width: 60px;
}

code,
pre {
  font-family: "Source Code Pro", "Monaco", "Courier New", monospace;
}

pre {
  overflow: scroll;
}

nav {
  position: fixed;
  width: 120px;
}

nav>ul {
  margin-bottom: 0;
}

nav>ul>li {
  display: block;
  margin: 10px 0;
}

footer {
  font-size: 10px;
  padding-top: 4px;
  text-align: center;
}

.error-msg {
  text-align: center;
}

.result>.preview {
  float: left;
}

.result>.title {
  float: left;
}

.iconsize {
  width: 8em;
}

[type=search] {
  font-size: 150%;
}

a,
a:visited {
  text-decoration: underline;
}

a:focus {
  outline: 0;
}

/* Tables
================================================================*/

table {
  border-collapse: collapse;
}

th,
td {
  padding: 5px 8px;
  text-align: left;
}

th {
  font-weight: bold;
}

/* System icons preview */

.system-preview tbody tr td {
  text-align: center;
}

.system-preview tbody tr td:first-child {
  text-align: left;
}

/* Mobile
================================================================*/

/* Mobile/Browser */
@media only screen and (max-width: 767px) {
  nav {
    display: none;
  }
}

/* Mobile Landscape/Browser */
@media only screen and (min-width: 480px) and (max-width: 767px) {
}

/* Anything smaller than standard 960 */
@media only screen and (max-width: 959px) {
}

/* iPad Portrait Only */
@media only screen and (min-width: 768px) and (max-width: 959px) and (max-device-width: 1000px) {
}

/* Mobile Only */
@media only screen and (max-width: 767px) and (max-device-width: 1000px) {
}

/* Mobile Landscape Only */
@media only screen and (min-width: 480px) and (max-width: 767px) and (max-device-width: 1000px) {
}

/* Anything smaller than standard 960 on a device */
@media only screen and (max-width: 959px) and (max-device-width: 1000px) {
  .resize {
    display: none;
  }
}