body, html { width: 100%; height: 100%;}
* { padding: 0; margin: 0; }

body { 
  background: #4C4C4C url(background.jpg);
  margin: 0; padding: 0;
  font: 12px Arial, Helvetica, Verdana, sans-serif;
	text-align: center;
	min-width: 700px;
}

a, a:hover { text-decoration: none; }
a { color: #607E89;}
a:hover { color: #fff; }

#container { background: none; }


/*	width: 100%; height: 100%; 
	  Mozilla ignores crazy MS image filters, so it will skip the following 
	    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='gradient.png');
*/
body>#container { background: transparent url(gradient.png) repeat-x; }

#stripe {
  background: transparent url(extender.gif) repeat-x;
	margin:0 auto;
  width: 712px;
  height: 100%;
	text-align: left;
}
#header {
  position: relative;
  height: 166px;
}
#logo { 
  position: absolute; top:104px; left: 50%; margin-left:-342px; z-index: 1000;
}
#slideshow { position: relative;}
#slideshow div { position: absolute; left: 50%; top: 0; margin-left:-356px;}

h1 { 
  color: #A4AAB7;
  font-size: 29px;
  font-weight: bold;
  float: left;
}
p { 
  text-align: left;
  font-size: 15px;
  line-height: 28px;
}
#about p { margin-left:114px; }
#enjoy p { margin-left:114px; }
.content { 
  position: relative;
  background: url(rounded-top.gif) no-repeat;
  width: 651px;
  padding: 13px 48px 0 13px;
}
.rounder, .dl {
  background: url(rounded-bottom.gif) no-repeat bottom center; 
  height: 12px;
  margin-bottom: 6px;
}
#download {
  background: url(download-top.gif) no-repeat;
  padding: 0 0 0 13px;
  width: 699px;
  height: 180px;
}
#download h1 { margin-top: 13px;}
#download h2 { font-size: 14px; padding-bottom: 6px; text-align: left;}
#download p {
  font-size: 12px;
  line-height: 18px;
  margin-left: 45px;
}
.dl { background: url(download-bottom.gif) no-repeat top center; }
.number {
  font-size: 70px;
  font-weight: bold;
  color: white;
  float: left;
  margin-top: -10px;
  padding: 0 6px 0 0;
}
#step1, #step2 {
  position: absolute;
  width: 249px;
  padding: 12px 7px 0 13px;
}
#step1 { left: 168px; }
#step2 { left: 442px; }

#step1 a {
  margin-top: 10px;
  background: transparent url(ruby-files.gif) no-repeat top center;
  overflow: hidden;
  text-indent: -99999px;
  display: block;
  height: 65px;
}

#step1 a:hover {
  background-position: bottom center;
}

#navlist { margin: 5px 0 0 -11px; }
#navlist li {
  display: inline;
  list-style-type: none;
}
#navlist a:link, #navlist a:visited {
  text-align: center;
  font-weight: normal;
  display: block;
  float: left;
  height: 27px;
  padding-top: 48px;
  font-size: 16px;
  background: transparent url(platforms.gif);
}
#navlist a:hover {
  font-weight: bold;
 /* background-position: center bottom; */
}
#navlist li a#mac  { width: 83px; background-position: left top;}
#navlist li a#win  { width: 95px; background-position: center top;}
#navlist li a#linux  { width: 82px; background-position: right top;}
#navlist li a:hover#mac  { background-position: left bottom;}
#navlist li a:hover#win  { background-position: center bottom;}
#navlist li a:hover#linux  { background-position: right bottom;}

    
h3 {
  text-align: left;
  font-size: 16px;
  margin-top: 17px;
  margin-left: 114px;
}

#enjoy.fill {
  background: #f0f3f3;
  padding-right: 40px;
}

#enjoy p {
  line-height: 22px;
  font-size: 14px;
  color: #787979;
  
}

#enjoy ul {
  margin-top: 5px;
  margin-left: 134px;
}
#enjoy li {
  margin: 0 0 8px 0;
  padding: 2px 7px;
  font-size: 14px;
  line-height: 18px;
  text-align: left;
  background: #fff;
  color: #555;
  
}
#enjoy li strong {
  color: black;
}

#enjoy a { text-decoration: underline; }
#enjoy a:hover { color: black; }

p.extra {
	position: relative;
	left: -5px;
	padding-left: 5px;
	/* background: #ff0; */
	background: url(extra-bg.gif);
}

p.extra strong {
	color: #555;
}