body {
  background-image: url('bg.jpg');
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  margin: 0;
  padding: 0;
  text-align: center;
}

input, form, textarea, h1, h2, h3, h4, h5, h6 {
  margin: 0;
  padding: 0;
}

p {
  margin-bottom: 10px;
  margin-top: 10px;
}

a, a:hover {
  margin: 0;
  padding: 0;
  text-decoration: none;
}

a:link, a:visited {
  color: #03C;
}

a img {
  border: 0;
  margin: 0;
  padding: 0;
}

#container {
  margin: 0 auto;
  width: 900px;
}

#r1c1 {
  background-image: url('Layout.png');
  background-position: 0 0;
  background-repeat: no-repeat;
  float: left;
  height: 100px;
  margin: 0;
  padding: 0;
  text-align: center;
  width: 125px;
}

#r1c2 {
  background-image: url('Layout.png');
  background-position: -125px 0;
  background-repeat: repeat;
  float: left;
  height: 100px;
  margin: 0;
  padding: 0;
  text-align: center;
  width: 175px;
}

#r1c3 {
  background-image: url('Layout.png');
  background-position: -300px 0;
  background-repeat: no-repeat;
  float: left;
  height: 100px;
  margin: 0;
  padding: 0;
  text-align: center;
  width: 600px;
}

#r2c1 {
  background-image: url('Layout.png');
  background-position: 0 -100px;
  background-repeat: no-repeat;
  float: left;
  height: 75px;
  margin: 0;
  padding: 0;
  text-align: left;
  width: 125px;
}

#r2c2 {
  background-image: url('Layout.png');
  background-position: -125px -100px;
  background-repeat: no-repeat;
  float: left;
  height: 75px;
  margin: 0;
  padding: 0;
  text-align: left;
  width: 175px;
}

#r2c3 {
  background-image: url('Layout.png');
  background-position: -300px -100px;
  background-repeat: no-repeat;
  float: left;
  height: 75px;
  margin: 0;
  padding: 0;
  text-align: left;
  width: 600px;
}

#r3c1 {
  background-image: url('Layout.png');
  background-position: 0 -175px;
  background-repeat: no-repeat;
  float: left;
  height: 325px;
  margin: 0;
  padding: 0;
  text-align: left;
  width: 125px;
}

#r3c2 {
  background-image: url('Layout.png');
  background-position: -125px -175px;
  background-repeat: repeat;
  float: left;
  height: 325px;
  margin: 0;
  padding: 0;
  text-align: center;
  width: 175px;
}

#r3c3 {
  background-image: url('Layout.png');
  background-position: -300px -175px;
  background-repeat: no-repeat;
  float: left;
  height: 325px;
  margin: 0;
  padding: 0;
  text-align: left;
  width: 600px;
}

#r4c1 {
  background-image: url('Layout.png');
  background-position: 0 -500px;
  background-repeat: no-repeat;
  float: left;
  height: 150px;
  margin: 0;
  padding: 0;
  text-align: left;
  width: 125px;
}

#r4c2 {
  background-image: url('Layout.png');
  background-position: -125px -500px;
  background-repeat: repeat;
  float: left;
  height: 150px;
  margin: 0;
  padding: 0;
  text-align: left;
  width: 175px;
}

#r4c3 {
  background-image: url('Layout.png');
  background-position: -300px -500px;
  background-repeat: no-repeat;
  float: left;
  height: 150px;
  margin: 0;
  padding: 0;
  text-align: left;
  width: 600px;
}

div.spacer {
  clear: both;
}

#PageTitle {
  color: #16316f;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 18px;
  font-weight: 700;
  height: 30px;
  margin: 30px 10px 0;
  overflow: hidden;
  padding: 0;
  position: relative;
  width: 580px;
}

#ScrollBoxOuter {
  color: #222;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
  font-weight: 400;
  height: 325px;
  margin: 0;
  padding: 0;
  width: 600px;
}

#ScrollBoxInner {
  color: #222;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
  font-weight: 400;
  height: 325px;
  margin: 0 6px;
  overflow: auto;
  padding: 0;
  position: relative;
  width: 588px;
}

/* flexcroll swaps in its own scrollbar on load. Hide the native one from the start so the
   content width is identical before and after, and pin the width so it can never shift. */
#ScrollBoxInner {
  max-width: 588px;
  min-width: 588px;
  scrollbar-width: none;
}

#ScrollBoxInner::-webkit-scrollbar {
  display: none;
}

h1 {
  color: #16316f;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: 700;
  margin: 5px 0;
}

h2 {
  color: #16316f;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  font-weight: 700;
  margin: 5px 0;
}

h3 {
  color: #16316f;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: 700;
  margin: 5px 0;
}

hr {
  border: none 0;
  border-top: 3px double #16316f;
  height: 3px;
  margin: 10px;
  width: 100%;
}

#r1, #r2, #r3, #r4 {
  display: block;
  padding: 0;
  width: auto;
}

#ScrollBoxInner td, #ScrollBoxInner tr {
  color: #222;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
  font-weight: 400;
}
