/* AHF web design
   Products
      css definitions for displaying product content	  	  

   HACKS or workarounds
   html>body is not recognized by IE so we can use this for non IE browsers and special stuff for IE browsers
    
    Using the UL element we can organize a list of products that the user can see on the introduction page
*/


.intro img
{
   margin-top: -20px;
}

.highlights{
	float: left;
	display: inline-block;	
	zoom: 1;
	width: 100%;
}

.highlights .title
{	
	margin-bottom: 10px;
	display: block;
	float: left;
	width: 100%;
}

.highlights span{
	font-size: 11px;
	background: transparent url(/styles/images/sidepanel.png) -2px -273px no-repeat;
	cursor: pointer;
	color: #0099ff;
	float: right;
	display: block;	
	font-weight: bold;		
	width: 32px;
	height: 23px;
	margin-top: -2px;
	*margin-top: -22px;
	margin-bottom:5px;
}

.highlights span:hover{
	/*text-decoration: underline;	*/
	background-position: -2px -299px;
}

.highlights span.paused {
	background-position: -2px -222px;
}


.highlights span.paused:hover {
   background-position: -2px -247px;
}

.spotlight
{ 
	height: 290px;
	display: block;
	float: left;
}

#spotlight .shadebox
{
	width: 230px;	
}

#spotlight .meat{
   border: 3px solid black; 
	/*float: left; */
	position: relative;
	height: 312px; 
	width: 760px;
}

.spotlight_bottom {
   background-color: #3c86cf;
	background: url(/images/bluebar80.png) top left repeat;	
	color: #ffffff;
	padding: 5px;
	width: 750px;
	position: absolute;
	top: 243px;
	height: 60px;
	overflow: hidden;
}

.spotlight_bottom a{
   color: #FFFF00;
}

.spotlightlink
{   
   color: white;
   font-weight: bold;
   font-size: 11px;
   text-align: center;
   float: left;
   clear: both;
   width: 100%;
}

.spotlightlink a, .spotlightlink a:visited, .product a:visited
{
   text-decoration: none;
   cursor: pointer;
   border-style: none;
   font-weight: bold;
}

.spotlight a:hover
{
   text-decoration: underline;
   border-style: none;
   color: white;
}

.product a:hover 
{
   color: #2B95BD;  
   border-style: none;
   text-decoration: underline;
}

.adverttext
{
    background: #ffffff;
	background-repeat-y: no-repeat; 
	border: 1px solid #aaaaaa;	
	color: #323232;
	padding: 10px;
	line-height: 130%;
	font-size: 14px;
	display: none;	
	position: absolute;		
	width: 730px;
	-moz-box-shadow:#999 2px 2px 10px;
    -webkit-box-shadow:#999 2px 2px 10px;
    -moz-border-radius:8px;
    -webkit-border-radius:8px;
	 border-radius: 8px 8px 8px 8px
}

#feature h1
{
	margin-bottom: 5px;
	font-size: 18px;
	clear: both;
	font-weight: bold;
}

#feature .attn {
   font-size: 18px;
	font-weight: bold;
	font-style: italic;
}

#feature .col1 {
   margin-right: 5px;
	width: 430px;
	float: left;
}

#feature .col2
{
	width: 310px;
	float: left;
}

#feature ul
{
	margin-left: 5px;
	padding: 0px;
}

#feature ul.checklist {
   float: none;
}

#feature h2 ~ ul {
    margin-left: 45px;
}

#feature li {	
	margin-bottom: 5px;
}

.hidden
{
    display: none;
}


.productintro
{
   display: block;
   clear:both;
   background-color:#333333;
   color: #F9F9F9;
   padding-top: 5px;
   padding-bottom: 1px;
   padding-left: 5px;
   padding-right: 5px;
   margin-right: 5px;
   margin-left: 5px;
   margin-top: -8px;
   margin-bottom: 10px;
   float: left;
   width: 755px;
   min-height: 130px;
   -moz-border-radius:8px;
   -webkit-border-radius:8px;
   -moz-border-radius-topright:0px;   
   -webkit-border-radius-topright:0px;   
	border-radius:8px 8px 8px 8px;
}

#reachintro {
   -moz-border-radius-bottomleft:0px;   
   -webkit-border-radius-bottomleft:0px;
   -moz-border-radius-bottomright:0px;   
   -webkit-border-radius-bottomright:0px;   	
	border-radius: 0px 8px 0px 8px;
   margin-bottom: 0px;
}

.productintro .introkeywords
{
   display: block;
   color: #FF9900;
   font-weight: bold;
   width: 120px;
   float: left;
   padding-top: 20px;
   margin-right: 5px;
   height: 100%;
}

.productintro .introimage{    
    display: block;
	margin-top: 0px;
	margin-bottom: 0px;
    margin-left: 0px;
	float: left;
    background-image: none;
}

.productintro .introimage img {
    height: 170px;
	 margin-left: -45px;
	 margin-top: -30px;
	 margin-right: 5px;
}

.advertdetails
{
    clear: none;
	height: 100%;
	float: left;
	width: 450px;
}


.productimage
{
   float: left;
   height: auto;
   padding-bottom: 1px;
}

.notebody#augcommnote
{
   margin-top: 15px;
   line-height: 105%;
   font-size: 0.9em;
}

#soundslikeintro
{  
   height: 200px;
}

.producttitle
{   
   font-weight: bold;
}


.introblock {
   float: left;	
	width: 100%;
	margin-bottom: 20px;
}

.introblock table {
   width: 100%;
}

.introblock table td div.bg, .introblock table td div.bg div
{   
   background-image: url(/styles/images/reachintro.png);
	background-repeat: no-repeat;	
	margin: 0 auto;
}		

.introblock table td div.moretxt {
   display: none;
	float: left;
	width: 100%;	
}

/* cell appearance */
.introblock table td {
   width: 180px;
	border: 2px solid #c0c0c0;
	border-radius: 8px 8px 8px 8px;
}

.introblock table td:hover {
   border: 2px solid #303030;
}

/* cell colors */
.introblock table td.ul{
	background-color:#98e2e9;
}

.introblock table td.ml {
	background-color: #9FCFFF;
}
.introblock table td.ur{
   background-color: #FFE6CC;
}
.introblock table td.mr{
   background-color: #E9D2FF;
}
.introblock table td.bl {
   background-color: #D0F3CB;
}

.introblock table td.br {
   background-color: #e7a8a3;
}

/* cell images */
.introblock table td.ul div{
   background-position: -133px -16px;
	width: 117px;
	height: 110px;
}

.introblock table td.ul div.bg div {
   background-position: -4px -16px;
}

.introblock table td.uc {
   width: 220px;
	background-color: #FEFCBC;
}

.introblock table td.uc div{
   background-position: -227px -274px;
	width: 216px;
	height: 102px;
}

.introblock table td.uc div.bg div{
   background-position: -8px -273px;
}

.introblock table td.ur div{
   background-position: -128px -396px;
	width: 115px;
	height: 91px;	
}
.introblock table td.ur div.bg div{
   background-position: -11px -398px;
}

.introblock table td.ml div{
   background-position: -127px -146px;
 	width: 124px;
	height: 125px;
}

.introblock table td.ml div.bg div{
   background-position: -9px -145px;
}

.introblock table td.ctr { width:405px; border: none; height: 150px; }
.introblock table td.ctr div.bg{
   background-position: -263px -3px;
	width: 299px;
	height: 144px;
}

.introblock table td.mr div{
   background-position: -390px -157px;
	width: 131px;
	height: 115px;
}

.introblock table td.mr div.bg div{
   background-position: -260px -157px;
}

.introblock table td.br div {
   background-position: -390px -380px;
   width: 142px;
	height: 116px;
}

.introblock table td.br div.bg div{
   background-position: -248px -382px;	
}

.introblock table td.bl div{
   background-position: -155px -497px;	
   width: 153px;
	height: 126px;
}

.introblock table td.bl div.bg div {
  background-position: -8px -499px;  
}

.introblock table td.ctr div.txt {  
	font-size: 13px;
	font-family:Arial, Helvetica, sans-serif;	
	padding: 0px;
	margin: 0 auto;
	line-height: normal;
	width: 370px;
}

.introblock table td.bc div {
   background: transparent url(/styles/images/smartspeechbw.png) top left no-repeat;
   width: 401px;
	height: 202px;
}

.introblock table td.bc div.bg div {   
   background: transparent url(/styles/images/smartspeech.png) top left no-repeat;	
	width: 401px;
	height: 202px;
}


.introblock .learnmore {
   display: none;
	position: absolute;
	color: #0041a3;
	background-color: #FFFFFF;/*#353535;*/	
	/*-moz-border-radius: 3px 0px 0px 3px;		
	-webkit-border-radius: 3px 0px 0px 3px;	*/
	border-radius: 8px 8px 8px 8px;	
	-webkit-border-radius: 8px;
	border: 3px solid #0099FF;	
	padding-bottom : 5px;		
}

.introblock .learnmore a, .introblock .learnmore a:visited {
   color: #00AAff;
}

.introblock .learnmore ul {
   padding: 3px;
}

.introblock .learnmore li {
   width: 100%;	
   border-bottom: 1px dotted #0099ff;
	margin-top: 2px;
	margin-bottom: 2px;
}

.introblock .learnmore li:last-child {
   border-bottom: none;
}

.introblock .learnmore li:hover {
   background-color: #e3ffff;
}

.introblock td.bl .learnmore {
  
   text-align: left;
	position: absolute;
   left: 174px;
	top: -20px;
	width: 230px;	
	height: auto;
}


.introblock td.br .learnmore {
   text-align: right;
   left: -163px;
	top: 0px;
	width: 190px;
	height: auto;
}

.introblock .learnmore span.title {
   font-size: 13px;	
	color: #EEEEEE;
	font-weight: bold;
	border-bottom: #808080;
	background-color: #707070;	
	float: left;
	width: 100%;
	text-indent: 5px;
}

/*.introblock td.br:hover .learnmore, .introblock td.bl:hover .learnmore {   
   display: block;
}*/

#featureblock {
   background-image: none;
	margin:0 auto;
	width: 400px;
}


/*
#featuredetails ul
{
    list-style-type: disc;
	line-height: 115%;
}

#featuredetails li
{
    margin-left: 45px;	
}*/

#featuredetails {
	float: left;
	margin-top: 10px;
}

#defaulttext
{
   text-align: center;
   margin-left: 20px;
   margin-right: 0px;
}

#defaulttext span
{
   display: block;
   color: #FF9900;
   font-weight: bold;
   text-align: center;
   margin-bottom: 50px;
}


.listblock h1
{
	border: none;
	font-size: 15px;
	font-weight: bold;
	color: #0099ff;	
	margin-bottom: 5px;
}	

.listblock
{
   /*background-image: url(/images/reachfeaturelistbg.gif);
   background-position: top left;
   background-repeat: no-repeat;*/
   /*width: 590px;*/   
	margin-right: 15px;
   /*
   margin-top: 0px;
   margin-right: 5px;
   margin-bottom: 0px;
   margin: 0 auto;*/
   padding: 0;   
   text-align: left;  
   margin-left: 10px; 
   /*position: relative;*/   
   display: block;
   /*width: 45%;*/
   float: left;
}

.introblock ul
{
   list-style-type: none;
   /*display: inline-table;*/
   margin: 0px;
	padding: 0px;
   /*text-indent: -1000em; */
}

.introblock li
{
   /*display: inline;*/
   list-style: none;  
   margin-right: 0px;    
	float: left; 
}

.introblock .learmore a 
{ /*   width: 56px;
   height: 50px;   */
	float: left;
   margin-right: 0px;
	width: 100%;
   border: none; /* 1px solid black; /*none;   */
   /*background: url(/styles/images/reachfeaturelist.png ) no-repeat;          */
}

#smartkeyvideo{
	float: left;
	margin-left: 50px;	
	margin-right: 20px;
}

.videos {
    float: left;
	 clear: both;
}

.videos ul {
    list-style-type: none;
}
.videos li {
   float :left;
	margin-right: 10px;
}
.videos li div img {
   cursor: pointer;
	float: left;
	clear: both;
}
.videos li div a {
   float: left;
	clear: both;
}


#featurelist * a:focus
{
   border: none;
}

#f_powerfulkeyboards 
{ 
   background-position: -5px 0px;
}

a#f_powerfulkeyboards.featureactive,a#f_powerfulkeyboards:focus
{
   background-position: -5px -53px;
} 

a#f_hotauthoring 
{
   background-position: -69px 0px;
}

a#f_hotauthoring.featureactive, a#f_hotauthoring:focus
{
   background-position: -69px -53px;
}

a#f_scanning
{  
   background-position: -132px 0px;
}

a#f_scanning.featureactive,a#f_scanning:focus 
{
  background-position: -132px -53px;
}

a#f_wordpred
{
   background-position: -196px 0px;
}

a#f_wordpred.featureactive,a#f_wordpred:focus
{
   background-position: -196px -53px;
}

a#f_assist
{
   background-position: -259px 0px;
}

a#f_assist.featureactive, a#f_assist:focus
{
   background-position: -259px -53px;
}

a#f_dwell
{
   background-position: -381px 0px;
}

a#f_dwell.featureactive, a#f_dwell:focus
{
   background-position: -381px -53px;
}


a#f_windowsmgmt
{
   background-position: -321px 0px;
}

a#f_windowsmgmt.featureactive, a#f_windowsmgmt:focus 
{
   background-position: -321px -53px;
}
	
a#f_make
{
   background-position: -321px 0px;
}	 

a#f_make.featureactive, a#f_make:focus
{
   background-position: -321px -53px;
}	 
	
a#f_learning
{
   background-position: -441px 0px;
}

a#f_learning.featureactive, a#f_learning:focus
{
   background-position: -441px -53px;
}

a#f_smartkeys
{
   background-position: -500px 0px;
}

a#f_smartkeys.featureactive, a#f_smartkeys:focus
{
   background-position: -500px -53px;
}

a#f_smartlists
{
   background-position: -560px 0px;
}

a#f_smartlists.featureactive, a#f_smartlists:focus
{
   background-position: -560px -53px;
}
