/* CSS Document */
html, body { background-color: #F7F7F7;
 margin:0px 0px 0px 0px; 
 padding:10px 10px 10px 10px; 
 font-family: 'Trebuchet MS', Helvetica, Arial, sans-serif;
 font-size: 12px; color: #000000;
}
div.frame 	  { float:none; display:block; width:1100px; height:600px; 
				background-color: #FFFFFF; border:1px solid #667C8A;
				margin:0px 0px 0px 0px;  padding:0px 0px 0px 0px; }   
div.words 	  { float:left;  display:block; width:199px; height:600px;
				 background-color: #F5F5F5;  border-right:1px solid #667C8A;
				margin:0px 0px 0px 0px;  padding:0px 0px 0px 0px; }    
				
div.mainimage { float:right; display:block; width:900px; height:600px; 
				background-color: #A2A5AC; 
				margin:0px 0px 0px 0px;  padding:0px 0px 0px 0px; }    
img.mainimage {margin:0px 0px 0px 0px;  padding:0px 0px 0px 0px; }
  
a.h1link, a.h1link:visited { text-decoration:none; color: #667C8A; }
a.h1link:hover {text-decoration:none;  color:#000000; }
a.linkItem, a.linkItem:visited { text-decoration:none; color: #999999; font-size:12px; }
a.linkItem:hover {text-decoration:none;  color:#000000; }
a.linkItemF, a.linkItemF:visited { text-decoration:none; color: #667C8A; font-size:12px; font-weight:bold; }
a.linkItemF:hover {text-decoration:none;  color:#000000; font-weight:bold;}

h1   { font-size: 20px; text-align:center; color: #667C8A; 
		margin:0px 0px 0px 0px; padding:20px 0px 20px 0px; border-bottom: 1px solid #CCCCCC;
		}
  
h3   {  font-size:14px; color: #8A9CA8;
		margin:0px 0px 0px 0px; padding:0px 0px 10px 0px; 
		}

ul {
	list-style: none;
	margin-left: 0;
	padding-left: 1em;
	text-indent: -1em;
	}


input.inputForm {
	width: 160px; height:15px;
	margin:0px 0px 0px 0px; padding:2px 2px 2px 2px; 
	background-color: #F5F5F5;
	border: 1px solid #CCCCCC;
	font-size:10px; color:#8A9CA8;
}
textarea.inputTextarea {
	width: 160px; height:70px;
	margin:0px 0px 0px 0px; padding:2px 2px 2px 2px; 
	background-color: #F5F5F5;
	border: 1px solid #CCCCCC;
	font-size:10px; color:#8A9CA8;
}




.menuitem{ /*header of 1st demo*/
cursor: hand;
cursor: pointer;
padding: 2px 5px;
border-bottom: 1px solid #CCCCCC;
background: #F3F3F3;
}
.openmenu{ /*class added to contents of 1st demo when they are open*/
background-color: #E1E1E1;
border-bottom: 1px solid #CCCCCC;
}
.theitem {
	margin:0px 0px 0px 0px; padding:10px 10px 10px 10px; 
	font-size:11px;
	text-align:left;
	border-bottom: 1px solid #CCCCCC;
}
.panel 	  { font-size:24px; text-align:center; color:#FFFFFF;
				background-color: #CCCCCC;  }   











.stepcarousel{
position: relative; /*leave this value alone*/
overflow: scroll; /*leave this value alone*/
width: 900px;
height: 600px; /*Height should enough to fit largest content's height*/
}
.stepcarousel .belt{
position: absolute; /*leave this value alone*/
left: 0;
top: 0;
}
.stepcarousel .panel{
float: left; /*leave this value alone*/
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
margin: 0px; /*margin around each panel*/
width:900px; /* width: 250px; Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}