body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, pre, form, input,
  a, p, th, td {
  margin: 0; padding 0;
}

body {
  padding: 16px;
  background: #eee;
}

h1, h2, h3 {
   font-weight: bold;
	clear: both;
	padding: 8px;
	margin: 8px 0;
}
h1, h2 {
	border: 1pt solid #888;
	background: #ccc;
	margin-top: 32px;
}

h1 { font-size: 140%; }
h2 { font-size: 120%; }
h3 { font-size: 100%; }

p { margin: 1ex 0; }

div.screenshots {
}

table { 
  padding: 8px;
  margin: 4px;
}
td {
	background: #ccc;
	padding: 2pt 8pt;
	border: 1pt solid #888;
}


img.dsi {
  border: 1pt solid #888;
  background: #ccc;
}

ul.imgs {
  margin: 0;
  list-style-type: none;
  padding: 0em 0; /* this is just for beauty */
  list-style-type: none;
  clear: both; /* to divide the rows */
}

ul.imgs li {
  float: left;
  width: 140px;
  height: 260px; /* or whatever suits in your case */
  margin: 4px;
  padding: 4px;
  border: 1pt solid #888;
  background: #ccc;
}

ul.imgs li a { /* centers the thumb plus caption */
  display: block;
  text-align: center;
}

ul.imgs li a img { /* seperates caption from thumb optically */
  display: block;
  padding: 4px;
  margin: 0 auto;
  height: 200px;
}