* {
  outline-color: invert;
  outline-style: none;
  outline-width: medium;
  margin:        0px;
  padding:       0px;
}             

body {
	font-family:      "Trebuchet","Lucida Grande","Lucida Sans Unicode","bitstream vera sans","trebuchet ms","verdana";	
  background:       #f4f4f4 url(../images/header.png) repeat-x top left;
	color:            #000;
  font-size:        2em;
	font-size-adjust: none;
	font-stretch:     normal;
	font-style:       normal;
	font-variant:     normal;
	font-weight:      normal;
  margin:           0;
}

div.borders {
  border: 1px #434343 solid;
  -moz-border-radius:      12px;
  -webkit-border-radius:   12px;
}

div.demo {
  margin:  10px 10px;
  padding: 10px 10px;
}

#overall {
  margin:        10px auto;
  width:         950px;
  overflow:      none;
}

#logo {
  float:         left;
  width:         100%;
  margin-bottom: 50px;
}

#main {
  clear:    both;
  margin:   20px 10px 20px 10px;
  overflow: hidden;
}

ul {
  list-style-image:    none;
  list-style-position: outside;
  list-style-type:     none;
}

.scrollable {
	position:   relative;
	overflow:   hidden;
	text-align: center;
	width:      86%;
	height:     166px;
	border:     1px solid #ccc;
  margin:     10px 64px;
	background: url(/images/h300.png) repeat-x;
}

.scrollable .items {
	width:    20000em;
	position: absolute;
	clear:    both;
}

/* single scrollable item */
.scrollable img {
	float:                 left;
	background-color:      #fff;
	padding:               2px;
	border:1px solid       #ccc;
	cursor:                pointer;
	-moz-border-radius:    4px;
	-webkit-border-radius: 4px;
}

/* active item */
.scrollable .active {
	border:    2px solid #ff8f00;
	z-index:   9999;
	position:  relative;
}


div.capture {
  float:   left;
  padding: 10px;
}

div.capture img {
  width:  150px;
  height: 114px;
}

img.blank {
  width:  500px;
  height: 375px;
}

div#screenshot {
  width:              560px;
  margin:             10px 50px;
  padding:            15px 0; 
  text-align:         center;  
  background-color:   #efefef; 
  border:2px solid    #fff; 
  outline:1px solid   #ddd; 
  -moz-ouline-radius: 4px;   
}

div#footer {
  clear: both;
  display: none;
}

img {
  border: none;
}

/* position and dimensions of the navigator */
.navi {
/*  margin-left:328px;*/
	width:   42px;
	height:  20px;
}

/* items inside navigator */
.navi a {
	width:       8px;
	height:      8px;
	float:       left;
	margin:      3px;
	background:  url(/images/navigator.png) 0 0 no-repeat;
	display:     block;
	font-size:   1px;
}

/* mouseover state */
.navi a:hover {
	background-position:0 -8px;      
}

/* active state (current page state) */
.navi a.active {
	background-position:0 -16px;     
}