@charset "UTF-8";
/* CSS Document */

/* CSS Document 
	L. Ebert for syware droiddb, winter 2011
	version 1.1, dec 23;
	modified feb 23 2012, just leading on home page 
 */

/* =colors
---------------------------------------------------------------------------


blue(menu)	#006699
pale grn bk	#e6f3d9
br yellow	#face0b
pl yellow	#fce476
gray		#626366

blue inactive 006699
bright green rolled over 6ea341
dr green clicked on 007f00


*/

/*-------------------------------------------------------------

	RESET STYLES
		
	from http://meyerweb.com/eric/tools/css/reset/ 
	v1.0 | 20080212 

--------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;	}
body { line-height: 1;	}
/*ol, ul { list-style: none;	}*/
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none; }

/* remember to define focus styles! */
:focus { outline: 0; }

/* remember to highlight inserts somehow! */
ins { text-decoration: none; }
del { text-decoration: line-through; }

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;	}
	

	
/*-------------------------------------------------------------

	DEFAULT TYPOGRAPHY

--------------------------------------------------------------*/

body { 
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 19px;
	color: #000000;			
	}	

h1, h2, h3, h4, h5, h6 {
	font-family: Arial, Helvetica, sans-serif;
	}
	
h1	{ 
	font-size: 17px;
	line-height: 20px;
	margin: 19px 0 4px 0;
    /*color: #231F20;*/
	font-weight:normal;
	color: #006f3b;
	}
	
h2	{ 
	font-size: 14px;
	line-height: 16px;
	margin: 20px 0 8px 0;
    color:#000000;
    font-weight: bold;
	}
	
h3	{ 
	font-size: 12px;
	line-height: 19px;
	margin: 18px 0 8px 0;
	}
	
p	{  margin: 6px 0; }
	
a:link {
   color: #006699;
   text-decoration:none;
 }
 
 a:visited {
   color: #6d9e9e;
   text-decoration:none;
 }
 
a:hover, a:active {
   color:#6ea341;
   text-decoration:none;
 }
 
ul { list-style: none; }

li { 
	margin: 2px 0 0 12px; /* was 20 */
	padding: 0 0 0 14px; /* was 16 */
	background: url(../_images/chrome/bullet-gray.gif) 0 6px no-repeat;
	}
 
ol li { 
	background: none;
	margin: 2px 0 0 30px; /* was 20 */
	padding: 0 0 0 8px; /* was 16 */
	} 

/* to get small trademarks */
sup {
    position:relative;
    top:-.5em;
    font-size: .6em;
}

/* ---------- special styles  ------------*/


.first { margin-top:0;}

.indent { 
	margin-left: 16px;
	margin-right: 40px;}
 
.imp {
	font-size: 15px;
	line-height: 18px;
	color: #006699;	
	
}
.clear	{
	width:100%;
	height:0;
	clear:both;
	}
	
.right { text-align:right; }

.black { color: #000000; }

.caption {
	color: #437a85;
	font-size:11px;
	line-height:16px;
}

.blue { color:#006699; }
.brightgreen { color:#6ea341; }
.darkgreen { color:#007f00; }
	
/* for installation instructions */
h3 span.steplink {
	color: #666666 !important;
	font-size: 10px !important;
}

a:link span.steplink {
	font-size: 10px !important;
	
}

.codesample {
    font-family:'lucida console', monaco, monospaced;
    }
	

/*-------------------------------------------------------------

	CONTAINERS
	
--------------------------------------------------------------*/

/* ---------- ALL PAGES ------------*/

body {
	padding: 0;
  	margin: 20px 0;
	width: 100%;
	display: table;
	background-color: #ffffff;
	}

#wrapper {
	position: relative;
	width: 964px;
	height: 100%;
	margin: 0 auto;
	background-color:#ffffff;
	}

#header	{	
	position: relative;
	width: 964px;
	height: 154px;
	z-index: 1000; /* overcome ie7 stacking issue*/
	background-image: url(../_images/chrome/background-header.png);
	background-repeat:no-repeat;
	
	}

#footer {
	clear:both;
	}
	
/* ---------- stuff in header ------------*/

#header img#logo {
	margin: 34px 0 0 37px;
	padding: 0;
    
}

#header p#tagline {
	float: right;
    margin: 80px 44px 0 0;
	color:#006699;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 18px;
	line-height: 18px;
}


#header div#search_box {
	position:absolute;
    top:10px;
    right:40px;
    
}

#header #search_form label {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	margin:0;
	padding:0;
	color:#8b8b8b;
	width: 60px;
}


#header #search_field {
	width: 158px;
	height: 17px;
	border: 1px solid #e0e0e0;
	margin:0 0 0 3px;
	padding:0;
	background-image:url(../_images/chrome/background-search-glass.gif);
	background-repeat:no-repeat;
	padding-left: 18px;
}

#header #menubar  {
	position: absolute;	
	width:950px; 
	bottom: 4px;
	right:7px; 
	background-color: #006699;
}


/*-------------------------------------------------------------

	MENU BAR IN HEADER
	
--------------------------------------------------------------*/

#header ul.nav  {
	list-style: none;
	float: left;	/* makes bar stretch to accommodate lis*/
	/*width: 923px;*/
	margin: 0;
	padding: 0 0 0 14px; 
}

#header ul.nav li {
   float: left;
   margin:0 1px 0 0;
   font-family: Arial, Helvetica, sans-serif;
   font-weight: normal;
   font-size: 14px;
   line-height: 26px;
   padding: 0;
} 

#header ul.nav a {
   	display: block;
  	padding: 0 18px; 
   	color: #ffffff;
   	text-decoration: none; 
}

#header ul.nav a:link, #header ul.nav a:visited {
   background-color: #006699;
   color:#ffffff;
   
 }
 
#header ul.nav a:hover, #header ul.nav a:active {
   background-color: #face0b;
   color:#006699;
   
 }
 
/* ---------- set color of top level menu items for a) current page (based on section)
              and b) when user hovers over the submenu                                 ------------ */
/* note: current class is assigned to top level item by jquery when user mouses over sub menu -- */

#header ul.nav li a.current,
body.about #header ul.nav li.item_about a,
body.products #header ul.nav li.item_products a,
body.videos #header ul.nav li.item_videos a,
body.trial #header ul.nav li.item_trial a,
body.buy #header ul.nav li.item_buy a,
body.support #header ul.nav li.item_support a,
body.contact #header ul.nav li.item_contact a,
body.freetrial #header ul.nav li.item_trial a,
body.store #header ul.nav li.item_store a
{
	background-color: #face0b;
	color:#006699;
}


/* ---------- for drop-down menus ------------*/

#header ul.nav li ul {	
	list-style: none;
	position: absolute;
	display:none;
	width: 153px;
	color: #626366;
	background-color: #fce476;
	margin:0;
	padding: 0;
	z-index: 10; /* to display over animation*/
	
}

#header ul.nav li ul li {
   font-family: Arial, Helvetica, sans-serif;
   font-weight: normal;
   font-size: 13px;
   line-height: 20px;     /*so doesn't inherit 40px height*/
   padding: 0;
} 

/* for non-IE, then IE */
#header ul.nav li:hover ul, #header ul.nav li.sfhover ul {
	display:block;
	}

#header ul.nav li ul li a {
	margin: 0;
	display:block;
	width:140px;
	padding: 6px 0 6px 13px;
}

#header ul.nav li ul li a:link, #header ul.nav li ul li a:visited {
	margin-top: 1px;
	color: #626366 !important;
	background-color: #fce476 !important;
	_height: 1%;  /* added for ie6*/
}

#header ul.nav li ul li a:hover, #header ul.nav li ul li a:active {
	color: #006699 !important;
	background-color: #face06 !important;
}


	

/*-------------------------------------------------------------

	HOME PAGE 
	
--------------------------------------------------------------*/

.home #content {
	margin-top:10px;
	margin-bottom: 0;
	
	width:964px;
	height:644px;
	background-image: url(../_images/chrome/background-content-home.png);
	background-repeat:no-repeat;
	position:relative;
}

.home #main {
	margin-left: 0;
	width: 270px;
	position:absolute;
	top: 228px;
	left: 44px;
    z-index: 3;
}

.home #main li { 
	margin: 2px 0 0 12px; /* was 20 */
	padding: 0 0 0 14px; /* was 16 */
	background: url(../_images/chrome/bullet-blue.gif) 0 4px no-repeat;
	}
	
.home #main p, .home #main li {
	font-size: 12px;
	/*line-height: 15px; */
	line-height: 1.45;
}

.home #main li {
	margin-bottom: 4px;
	margin-top: 4px;
}

.home #newsletter_droid {
	position:absolute;
	top: 530px;
	left: 506px;
}

.home #main #editions {
	margin-top:9px;
	font-size: 13px;
	line-height: 17px;
	color: #006699;	
}

.home #main img {
	float: left;
	padding-right: 6px;
}

/* slideshow */
.home #photo_show div {
    position:absolute;
	top: 29px;
	left: 31px;
    z-index: 0;
}
.home #photo_show div.previous {
    z-index: 1;
}

.home #photo_show div.current {
    z-index: 2;
}

/*-------------------------------------------------------------

	SECONDARY PAGE CONTAINERS 
	
--------------------------------------------------------------*/

h1#pagetitle {
	padding:0 37px;
	margin: 10px 0;
	font-weight: normal;
	font-size: 24px;
	line-height: 44px;
	color:#ffffff;
	width:890px;
	height:44px;
	background-color: #82c341;
	background-image: url(../_images/chrome/background-pagetitle.gif);
	background-repeat:no-repeat;
}

#content {   /*main body, holds main column and sidebars, side by side */
	float: left; 			 /*weird kludge required to make ie7 accept opposing floats; */
	width:100%; 			/* outer box has width*/ 	
	clear:both;
	padding-bottom:30px;
	margin:0;
	}

/* ---- format for three columns ----- */

/* main - container that holds the main content - middle column on pages with three cols. 
Note plain #main is the three column version, default for secondary pages.
One and two column versions below */	

#main {
	width: 476px;
	margin: 0;
	float:left;
}

/* way to get fuzzy green borders */
#main .top_row {
	width:476px;
	height:8px;
	background-image: url(../_images/chrome/background-main-secondary-top.gif);
	background-repeat:no-repeat;
}

/* DO NOT CHANGE top or bottom PADDING OF ANY MIDDLE_ROWs 
      of the columns or the column balancing will be off 
      if change one, must change them all 
	  height of columns is set by js function */
#main .middle_row {
	width:404px;
	padding: 17px 36px 17px 36px;
	background-image: url(../_images/chrome/background-main-secondary-middle.gif);
	background-repeat: repeat-y;
}

#main .bottom_row {
	width:476px;
	height:8px;
	background-image: url(../_images/chrome/background-main-secondary-bottom.gif);
	background-repeat:no-repeat;
}

/* ---- format for two columns ----- */

/* version of main for pages with just two-columns - large left column and sidebar2 
   - in geekzone section */
   
.twocolumn #main {
	width: 751px;
	margin: 0;
	float:left;
}

/* way to get fuzzy green borders */
.twocolumn #main .top_row {
	width:976px;
	height:8px;
	background-image: url(../_images/chrome/background-main-twocolumn-top.gif);
	background-repeat:no-repeat;
}

/* DO NOT CHANGE top or bottom PADDING OF ANY MIDDLE_ROWs 
      of the columns or the column balancing will be off 
      if change one, must change them all 
	  height of columns is set by js function */
.twocolumn #main .middle_row {
	width:683px;
	padding: 17px 36px 17px 32px; /*was 36 left and right */
	background-image: url(../_images/chrome/background-main-twocolumn-middle.gif);
	background-repeat: repeat-y;
}

.twocolumn #main .bottom_row {
	width:751px;
	height:8px;
	background-image: url(../_images/chrome/background-main-twocolumn-bottom.gif);
	background-repeat:no-repeat;
}

/* ---- format for one columns ----- */

/* version of main for pages with just one column for store page primarily  
   - aka Buy Now */
   
.onecolumn #main {
	width: 957px;
	margin: 0;
	float:left;
}

/* way to get fuzzy green borders */
.onecolumn #main .top_row {
	width:964px;
	height:8px;
	background-image: url(../_images/chrome/background-main-onecolumn-top.gif);
	background-repeat:no-repeat;
}

/* DO NOT CHANGE top or bottom PADDING OF ANY MIDDLE_ROWs 
      of the columns or the column balancing will be off 
      if change one, must change them all 
	  height of columns is set by js function */
.onecolumn #main .middle_row {
	width:964px;
	padding: 17px 36px 17px 36px;
	background-image: url(../_images/chrome/background-main-onecolumn-middle.gif);
	background-repeat: repeat-y;
}

.onecolumn #main .bottom_row {
	width:964px;
	height:8px;
	background-image: url(../_images/chrome/background-main-onecolumn-bottom.gif);
	background-repeat:no-repeat;
}


	
/*-------------------------------------------------------------

	SIDEBARS
	
--------------------------------------------------------------*/

#sidebar1 {
    width:275px;
    float:left;
    display:inline;  /*ie7 kluge */
	background-color: #e6f3d9;
	margin: 0;
	padding: 0;
    }

#sidebar1 .top_row {
	width:275px;
	height:8px;
	background-image: url(../_images/chrome/background-sidebar1-top.gif);
	background-repeat:no-repeat;
}

#sidebar1 .middle_row {
	position:relative;
	padding: 17px 21px 17px 36px;
	background-image: url(../_images/chrome/background-sidebar1-middle.jpg);
	background-repeat: repeat-y;
	background-color: #e6f3d9;
	margin: 0;
}

#sidebar1 .bottom_row {
	width:275px;
	height:8px;
	background-image: url(../_images/chrome/background-sidebar1-bottom.gif);
	background-repeat:no-repeat;
}

#sidebar1 .caption {
	padding: 0 15px 0 6px; 
    
}

/* slideshow */

#sidebar1 #photo_show_container {
	position:relative;
	width: 218px;
	height:316px;
	margin:0;
	padding:0;
	background: transparent url(../_images/chrome/background-sidebar1-app-animation.gif);
}

#sidebar1 #photo_show div {
    position:absolute;
	top: 5px;
	left: 5px;
    z-index: 0;
}
#sidebar1 #photo_show div.previous {
    z-index: 1;
}

#sidebar1 #photo_show div.current {
    z-index: 2;
}

/* ------ sidebar 2 -------------- */

#sidebar2 {
    width:213px;
    float:left;
    display:inline; /* ie7 kluge */
	margin: 0;
	padding: 0;
    }

#sidebar2 .top_row {
	width:213px;
	height:8px;
	background-image: url(../_images/chrome/background-sidebar2-top.gif);
	background-repeat:no-repeat;
}

#sidebar2 .middle_row {
	padding: 7px 20px 27px 17px;
	margin: 0;
	background: #ffffff url(../_images/chrome/background-sidebar2-middle.gif);
}

#sidebar2 .bottom_row {
	width:213px;
	height:8px;
	background-image: url(../_images/chrome/background-sidebar2-bottom.gif);
	background-repeat:no-repeat;
}

#sidebar2 .quote_container {
    margin: 17px 0 15px 0;
	padding: 10px 0 26px 0;
    border-top: 2px solid #e0e0e1;
	border-bottom: 2px solid #e0e0e1;
	
	background-image: url(../_images/chrome/background-quote-marks.gif);
	background-repeat: no-repeat;
	background-position: 0 14px ;
	
}

#sidebar2 .quote {
	margin:  2px 3px 8px 26px; 
    _margin: 2px 0 8px 26px;
	padding: 0;
	color:  #626366;
	font-size: 13px;
	line-height: 16px;
	font-style: italic;
}

#sidebar2 .attribution {
	text-align: right;
	padding: 0;
	margin:0;
	color:  #626366;
	font-size: 11px;
	line-height: 14px;
	font-style: italic;
}

/* contains droidbd icon and two editions available */
#editions_link_container {
	width:176px;
	padding: 0 0 16px 0;
	margin: 0 0 20px 0;
	border-bottom: 2px solid #e0e0e1;
}

#editions_link_container #ddb_icon_container{
	width:70px;
	height:80px;
	float:left;
	margin: 0 0 0 17px;
	_margin:0 0 0 8px;
	padding:0;
}



/* says Check it out! */
#editions_link_container #ddb_icon_container p {
	font-size:9px;
	color:#626366;
	margin:0;
	padding:0;
	
}

#editions_link_container #ddb_icon_container p a:link, 
#editions_link_container #ddb_icon_container p a:visited {
   color: #626366;
   
 }
 
#editions_link_container #ddb_icon_container p a:hover, 
#editions_link_container #ddb_icon_container p a:active {
   color:#6ea341;
   
 }

/* says two editions available */
#editions_link_container .caption {
	width:70px;
	height:80px;
	float:right;
	color:#026f81;
	font-size:13px;
	line-height:14px;
	text-align:center;
	margin: 0 10px 0 0 ;
	_margin:0 5px 0 0 ;
}

#editions_link_container .caption .decorative_number {
	font-size:32px;
	line-height:34px;
	font-style:italic;
	font-weight: 200;
}


#editions_link_container .caption a:link, 
#editions_link_container .caption a:visited {
   color: #026f81;
   
 }
 
#editions_link_container .caption a:hover, 
#editions_link_container .caption a:active {
   color:#6ea341;
   
 }

/*-------------------------------------------------------------

	FOOTER NAVIGATION
	
--------------------------------------------------------------*/
#footer   {
	font-size:11px;
	text-align: center;
	margin: 20px 0;
	color:#6d6e70;
}


#footer a:link, #footer a:visited {
   color:#6d6e70;  
   text-decoration:none; 
 }
 
#footer a:hover, #footer a:active {
   color:#6d6e70;  
 }
 
 
/*-------------------------------------------------------------

	FORMS
	
--------------------------------------------------------------*/

form { 
	padding: 24px 0 30px 0; 	}

form fieldset {
	margin: 0 0 8px 0;
		}
	
form fieldset label 	{
	display: block;
	float: left;
	width: 100%;
	color: #626463;
	font-size: 12px;
	line-height: 18px;	
	margin: 0;
	}
	
	
form fieldset input {
	float:left;
	width: 100%;
	height: 16px;
}




form fieldset textarea {
	width:100%;
	height: 96px;
	float:left;
}
	

	
form #button_container	{
	margin: 0 auto;
	padding: 0;
	width: 100%;	
	background-color: #ffffff;	}
    
/*-------------------------------------------------------------

	TABLES in GEEKZONE - macro examples
	
--------------------------------------------------------------*/

div.macro_sample {
    margin: 8px 0 16px 26px;
    
}

.macro_sample table {
    color: #006f3b;
    background-color:#e6f3d9;
    width: 280px;
    }
    
.macro_sample table tr {    
    background-color:#e6f3d9;    
    }
    
.macro_sample table td {    
    border: 1px solid #6ea341;
    padding-left: 6px;    
    }
    
/*-------------------------------------------------------------

	TABLE in Store index page
	
--------------------------------------------------------------*/

table#store {
    margin: 24px 0 30px 0;
    /*width: 860px;*/
    line-height: 14px;
}
    
table#store tr.headrow td {
    background: #e6f3d9;
    color: #006f3b;
    border:none;
    border-bottom: 1px solid #e6f3d9 !important;
    }
    
table#store tr.headrow td:first-child {
    padding-left:3px;    
    }
    
table#store td {
    padding-bottom: 9px;
    padding-top: 6px;
    padding-right:16px;
    vertical-align:top;
    border-top: 1px solid #8dd38d;
    border-bottom: 1px solid #8dd38d;
    }
    
table#store col#store1{    
    width:230px;    
    }
    
table#store col#store2{    
    width:400px;    
    }
    
table#store col#store3{    
    width:60px; 
    }
    
    
table#store col#store4  {    
    width:100px;
    }
    
table#store td.price {
    text-align:right;
    padding-right:30px;
    }
    
table#store td.action {
    text-align:center;
    vertical-align:top;
    }
    
body.store div#payoptions {
    width: 860px;
    }

/*-------------------------------------------------------------

	VIDEOS page
	
--------------------------------------------------------------*/

body.videos iframe {
    margin-bottom: 26px;
    margin-top: 11px;
    }
    
div.video_description {
	width:100%;
	margin-top:24px;
	margin-bottom: 32px;
	clear:both;
	}
	
div.video_description img {
	float: left;
	margin-top:3px;
	border:1px solid #006699;
	}
	
div.video_description h3,
div.video_description p {
	width:266px;
	margin:0 0 8px  144px;
    _margin: 0 0 8px 134px;
	}

div.video_description h3 {
	margin-bottom: 6px;
	}	

    
/* blue(menu)	#006699
pale grn bk	#e6f3d9
br yellow	#face0b
pl yellow	#fce476
gray		#626366

blue inactive 006699
bright green rolled over 6ea341
dr green clicked on 007f00   */