* {
  margin: 0;
  padding: 0;
  }

/* must declare 0 margins on everything, also for main layout components use padding, not vertical margins (top and bottom) to add spacing, else those margins get added to total height and your footer gets pushed down a bit more, creating vertical scroll bars in the browser */


html {
  height: 100%;
  }

body {
  height: 100%;
  text-align: center;
  background-image: url("bg_cloud.jpg");
  background-repeat: repeat;
  }


#container {
  width: 980px;
  height: auto;
  min-height: 768px;
  margin-left: auto;
  margin-right: auto;
  font-family: arial, "lucida console", sans-serif;
  color:black;
  background-image: url("bg_brick.jpg");
  border-style: solid;
  border-width: 1px;
  border-color: #aaaaaa;
  position: relative;
  } 

body > #container {height: auto; min-height: 100%;}


#header {
  width: 980px;
  height: 220px;
  }

#body {
  padding: 20px;
  padding-bottom: 80px; /* Height of the footer +20 */
  height: 580px;
  }

#leftnormal {
  position: absolute;
  left: 20px;
  top: 230px;
  width: 440px;
  height: 150px;
  padding: 5px;
  border-style: inset;
  border-width: 5px;
  border-color: #555555;
  background-image: url("window.jpg");
  background-repeat: repeat;
  text-align: justify;
  overflow: auto;  
   }

#leftscroll {
  position: absolute;
  left: 20px;
  top: 420px;
  width: 440px;
  height: 375px;
  padding: 5px;
  border-style: inset;
  border-width: 5px;
  border-color: #555555;
  background-image: url("window.jpg");
  background-repeat: repeat;
  text-align: justify;
  overflow: scroll;  
   }

#right {
  position: absolute;
  left: 500px;
  top: 230px;
  width: 440px;
  height: 565px;
  padding: 5px;
  border-style: inset;
  border-width: 5px;
  border-color: #555555;
  background-image: url("window.jpg");
  background-repeat: repeat;
  text-align: left;
  overflow: auto;  
  }

#singleframe {
  width: 920px;
  height: 565px; 
  padding: 5px;
  border-style: inset;
  border-width: 5px;
  border-color: #555555;
  background-image: url("window.jpg");
  background-repeat: repeat;
  text-align: justify;
  overflow: auto;  
  }

#footer {
  clear: both;
  position: relative;
  margin-top: -60px; /* negative height of footer */
  height: 60px; /* Height of the footer */
  width: 980px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  font-size: .8em; 
  font-style: italic;
  font-weight: bold;
  background: url("bottom_brick.jpg") top left repeat-x;
  border-style: solid;
  border-width: 1px;
  border-color: #aaaaaa;
  }

.floatright {
  float: right;
  width: 440px;
  height: auto;
  }

.floatleft {
  float: right;
  width: auto;
  height: auto;
  }


p.smallfont {
  font-size: .8em; 
  }

img.floatpicleft {
  float: left;
  margin-top: 5px;
  margin-right: 5px;
  margin-left: 5px;
  margin-bottom: 5px;
  }

img.floatpicright {
  float: right;
  margin-top: 5px;
  margin-right: 5px;
  margin-left: 5px;
  margin-bottom: 5px;
  }

a:link { 
  color: #000; 
  background: none;
  text-decoration: none; 
  }
a:visited { 
  color: #000; 
  background: none;
  text-decoration: none; 
  }
a:active { 
  color: #000; 
  background: none;
  text-decoration: none; 
  }
a:hover { 
  color: #ff0000; 
  background: none;
  text-decoration: none; 
  }

a img {
  border: 0;
  }

.center{ 
text-align: center;
  }

table.laine {
	border-width: 1px 1px 1px 1px;
	border-spacing: 0px;
	border-style: solid solid solid solid;
	border-color: gray gray gray gray;
	border-collapse: separate;
	text-align: center;
}

table.laine td {
	border-width: 1px 1px 1px 1px;
	padding: 2px 2px 2px 2px;
	border-style: solid solid solid solid;
	border-color: gray gray gray gray;
	margin: auto;
	width: 300px;
}


ul#menu { 
  width: 980px; 
  height: 30px; 
  background: url("menu-bg.gif") top left repeat-x; 
  font-size: .8em; 
  font-family: "Times New Roman", Georgia, Serif; 
  font-weight: bold; list-style-type: none; 
  margin: 0; 
  padding: 0; 
  }

ul#menu li { 
  display: block; float: left; 
  width: 124px; 
  margin: 0 0 0 5px; 
  }

ul#menu li a { 
  height: 30px;  
  width: 124px; 
  color: #000; 
  text-decoration: none; display: block; float: left; 
  line-height: 200%; 
  padding: 0px 15px 0; 
  }

ul#menu li a:hover { 
  color: #ff0000; 
  }

ul#menu li a.current { 
  color: #fff; 
  background: url("current-bg.gif") top left repeat-x; 
  padding:  0px 15px 0; 
  }
