@import "common.css";
@import "menu.css";

body {	overflow: -moz-scrollbars-vertical;}
body {
	/*font-family: Arial, Helvetica, sans-serif;*/
	font-family: /*"Lucida Sans",*/ "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
	font-size: 12px;
	color: #666666;
	margin: 0px;
	text-align: center;
	background-color: #f5f5f5;
	line-height: 18px;
	font-weight: normal;
}
body.home {
	background-image: url(/images/bgGlobal.gif);
	background-repeat: repeat-x;
}
td {
	font-size: 12px;
	line-height: 18px;
}
h1
{
	font-family: "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
	font-size: 30px;
	/*font-weight: normal;*/
	line-height: normal;
	margin-top: 0;
	letter-spacing: -0.05em;
}
/*
h1 {
	color: #4D608C;
	font-size: 26px;
	font-family: "Arial", sans-serif;
	font-weight: bold;
	line-height: normal;
	margin-top: 0; /* compensates for the large font that makes it look indented */
	/*
	margin-left: -2px;
}
*/
h2 {
	font-family: "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
	font-size: 20px;
	font-weight: bold;
	/*	margin-top: 0;*/
/*	margin-left: -1px;
*/	padding-top: 20px;
}
h3 {
	font-family: "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
	color: #666666;
	font-size: 12px;
	font-weight: bold;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 10px;
/*	margin-left: 15px; */
	text-transform: uppercase;
}
h4 {
	font-family: "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
	color: #666666;
	font-size: 13px;
	font-weight: bold;
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
}
h5 {
	font-size: 12px;
	margin-right: 0px;
	margin-left: 0px;
	margin-top: 0px;
	margin-bottom: 5px;
	color: #FF6633;
}
a {
	color: #6699CC;
}
p {
	font-weight: normal;
}

a:link {
	color: #6699CC;
	text-decoration: none;
}
a:visited {
	color: #6699CC;
	text-decoration:none;
}
a:hover {
	color: #FF6600;
}

a:link.promo {
	color: #FF6600;
	text-decoration: none;
}
a:hover.promo {
	color: #6699CC;
}
a:visited.promo {
	color: #FF6600;
	text-decoration: none;
}

/*########################################################################## layout */
#container
{
	text-align: left;
	margin-right: auto;
	margin-left: auto;
	width: 930px;
}
#header
{
	clear: both;
	height: 100px;
	width: 930px;
	background-image: url(/images/navBackground.png);
	background-repeat: no-repeat;
	background-position: left bottom;
	margin-right: auto;
	margin-left: auto;
	text-align: left;
}
#headerHome
{
	clear: both;
	height: 100px;
	width: 930px;
	background-image: url(/images/navBackgroundHome.png);
	background-repeat: no-repeat;
	background-position: left bottom;
	margin-right: auto;
	margin-left: auto;
	text-align: left;
}
#header #logo {
	float: right;
	margin: 30px 10px 0 0;
	float: right;
	height: 40px;
	width: 190px;
	position:relative;
	cursor:pointer;
}

/*#header .home {
	padding: 0px;
	height: 60px;
	width: 170px;
	margin-top: 40px;
	position: absolute;
	top: -17px;
}*/
/*########################################################################## navigation */
/*#nav {
	padding: 0px;
	height: 20px;
	position: absolute;
	margin: 0px;
	left: 20px;
	top: 90px;
}
#nav a {
	text-decoration: none;
	display: block;
	padding: 3px 0px;
	width: 189px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #eeeeee;
	color: #FFFFFF;
	text-align: center;
	margin: 0px;
	font-size: 11px;
	background-color: #5B72A6;
	text-transform: uppercase;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	letter-spacing: 1px;
}
#nav a:link {
	text-decoration: none;
}
#nav a:hover {
	color: #FFFFFF;
	text-decoration: none;
	background-color: #778AB7;
}
#nav ul {
	list-style-type: none;
	border: none;
	margin: 0px;
	padding: 0px;
	line-height: normal;
}
#nav li {
	float: left;
	margin: 0px;
	padding: 0px;
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #FFFFFF;
}
#nav li.first {
	background-image: none;
	padding-left: 0px;
}*/
/*########################################################################## breadcrumbs */
#breadcrumbs {
	font-size: 80%;
	border-bottom: 1px solid #778AB7;
}
#breadcrumbs ul {
	margin: 0;
	padding: 0px 0 0px 5px;
	list-style: none;
}
#breadcrumbs ul li {
	display: inline;
	margin: 0;
	padding: 0;
	color: #778AB7;
}
#breadcrumbs a {
/*font-weight: bold;*/
}
#breadcrumbs a:link {
	color: #5B72A6;
	text-decoration: none;
}
#breadcrumbs a:visited {
	color: #5B72A6;
	text-decoration: none;
}
#breadcrumbs a:hover {
	color: #FF3300;
}
#breadcrumbs a:active {
	color: #FF3300;
}
/*########################################################################## content */
#content {
	text-align: left;
	width: 910px;
	margin-right: auto;
	margin-left: auto;
	background-color: #FFFFFF;
}
#contentWrapper {
	text-align: left;
	width: 930px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 10px;
	background-image: url(/images/contentBg.gif);
	background-repeat: repeat-y;
}
#top {
	background-image: url(/images/top.gif);
	background-repeat: no-repeat;
	background-position: left top;
	width: 930px;
	margin: 0px;
	padding: 0px;
	float: left;
	height: 30px;
}
#bottom {
	background-image: url(/images/bottom.gif);
	background-repeat: no-repeat;
	height: 20px;
	width: 930px;
	margin-right: auto;
	margin-left: auto;
}

#contentHome{
	/*margin-bottom: 20px;*/
}
#homeflash {
	margin: 0px;
	padding: 0px;
	clear: both;
	height: 470px;
}

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {
	display: inline /*-block*/;
}
.clearfix {
	display: block;
}
* html .clearfix {
	height: 1px;
}
#teasers {
	clear: both;
	width: 930px;
	margin-right: auto;
	margin-left: auto;
	text-align: left;
}
#teasers #teaserTop {
	background-image: url(/images/teasersBgTop.png);
	background-repeat: no-repeat;
	background-position: left top;
	width: 930px;
	margin: 0px;
	padding: 0px;
	float: left;
	height: 30px;
}
#teasers #teaserContent {
	background-image: url(/images/teasersBgBottom.png);
	background-repeat: repeat;
	background-position: left bottom;
	width: 930px;
	margin: 0px;
	padding: 0 0 10px 0;
	float: left;
}
.oneteaser {
	float: left;
	width: 220px;
	margin-left: 10px;
	height: 130px;
	padding-bottom: 10px;
	display:inline;
}
.separator {
	border-left: 1px solid #eee;
}
.teaserimage {
	margin-left: 10px;
	float: left;
	display:inline;
}
.firstteaserimage {
	margin-left: 5px;
}

.teasertext {
	float: left;
	width: 110px;
	line-height: 15px;
	margin-left: 10px;
	display:inline;
}
.teasertext a {
	text-decoration: none;
}

#content #sub {
	float: left;
	width: 220px;
	margin-top: 20px;
	margin-bottom: 20px;
	margin-left: 10px;
	display:inline;
}
#content .separatorSubmenu {
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #EEEEEE;
}

#content #sub .productImage {
	background-image: url(/images/bgProductImage.gif);
	background-repeat: no-repeat;
	height: 240px;
	width: 180px;
	background-position: center top;
	margin-bottom: 30px;
}
/* The main (center/right) content area */
#content #main {
	float: left;
	width: 650px;
	margin-left: 10px;
	margin-top: 20px;
	padding-bottom: 20px;
	display:inline;
}
#main .placeholder .signup #signup .mandatory {
	color: #FF0000;
	margin-right: 3px;
}
#main .placeholder .signup {
	margin-left: 20px;
}
#main .placeholder {
}
#main .customerService {
	line-height: 24px;
}
#content #main .homeTitle {
/*	margin-top: 10px; */
}
#content #main .introText {
	font-size: 12px;
}
#content #main .price {
	letter-spacing: 1px;
}
#content #main .intolink {
	font-size: 11px;
	font-weight: normal;
	color: #5B72A6;
}
#content #main a.intolink:link {
	color: #FF6633;
}
#content #main a.intolink:hover {
	color: #FF3300;
}
#content #main a.intolink:visited {
	color: #FF6633;
}
#content #screenshots {
	clear: both;
}
#content #screenshots .filecomp {
	float: left;
	width: 240px;
	margin-top: 20px;
	border-top-width: 1px;
	border-top-style: dashed;
	border-top-color: #5B72A6;
	padding-top: 10px;
}
#content #screenshots .foldercomp {
	float: left;
	width: 240px;
	margin-top: 20px;
	margin-left: 20px;
	border-top-width: 1px;
	border-top-style: dashed;
	border-top-color: #5B72A6;
	padding-top: 10px;
}
#content #screenshots .xmlcomp {
	float: right;
	width: 240px;
	margin-top: 20px;
	border-top-width: 1px;
	border-top-style: dashed;
	border-top-color: #5B72A6;
	padding-top: 10px;
}
#content #sub .subnav {
	margin: 0px 0px 30px;
	width: 190px;
	float: left;
	padding: 0px;
}
#content #sub .subnav ul {
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}
#content #sub .subnav li {
	list-style-type: none;
	list-style-image: none;
	text-indent: 15px;
}
#content #sub .subnav subli {
	list-style-type: none;
	list-style-image: none;
	text-indent: 15px;
}
/*
#content #sub .subnav ul ul li a {
	background-color: white;
}
#content #sub .subnav ul ul li a.on {
	color: #FF6633;
	background: url(images/arrowLinkSubSubmenuOn.gif) no-repeat 40px 10px;
}
*/
#content #sub .subnav ul ul li a {
	padding-left: 23px;
	width: 90%;
	background: none white;
/*	background: url(images/arrowLinkSubSubmenu.gif) no-repeat 40px 10px;*/
}
#content #sub .subnav ul ul li a.on {
	color: #FF6633;
	background: url(images/arrowLinkSubSubmenuOn.gif) no-repeat 40px 10px;
}
#content #sub .subnav a {
	text-decoration: none;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #eee;
	font-weight: normal;
	font-size: 11px;
	line-height: normal;
	padding: 5px 5px 5px 0;
	margin: 0px;
	display: block;
	width: 180px;
	/*background-image: url(images/arrowLinkSubmenu.gif);*/
	background-repeat: no-repeat;
	background-position: 10px 10px;
	text-indent: 30px;
}
#content #sub .subnav a:link {
	text-decoration: none;
	color: #666;
	font-weight: normal;
	line-height: normal;
}
#content #sub .subnav a:visited {
	color: #666;
	text-decoration: none;
	font-weight: normal;
	line-height: normal;
}
#content #sub .subnav a:active {
	color: #666;
	text-decoration: none;
	font-weight: normal;
}
#content #sub .subnav a:hover {
	color: #666666;
	text-decoration: none;
	background-color: #FFFBF2;
	font-weight: normal;
}
#nav .on {
	background-color: #778AB7;
}
#content #sub .subnav ul a.on {
	color: #FF6600 !important;
	background-image: url(images/arrowLinkSubmenuOn.gif);
	background-repeat: no-repeat;
	background-position: 10px 10px;
}
/*########################################################################## footer */
div.footer {
	clear: both;
	font-size: 11px;
	padding-top: 10px;
	height: 50px;
	width: 890px;
	margin-left: auto;
	margin-right: auto;
}
div.footer .nav {
	height: 20px;
	padding: 0px;
	margin-bottom: 10px;
	background-image: none;
	float: left;
}
div.footer .nav ul {
	list-style: none;
	display: inline;
	float: left;
	padding: 0px;
	margin: 0px;
	width: 500px;
}
div.footer .nav li {
	float: left;
	list-style-image: none;
	list-style-type: none;
	background-image: url(/images/grNavSeparatorFooter.gif);
	background-repeat: no-repeat;
	background-position: left center;
	padding-left: 10px;
	padding-right: 10px;
	margin-left: 0px;
}
div.footer .nav li.first {
	background-image: none;
	padding-left: 0px;
}
div.footer .nav a {
	color: #666666;
	text-decoration: none;
}
div.footer .nav a:hover {
	color: #FF6600;
	text-decoration: none;
}
div.footer a:active {
	color: #FF3300;
	text-decoration: none;
}
div.footer .copyright {
	float: right;
	width: 300px;
	text-align:right;
}

/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.thumbnail {
	position: relative;
	z-index: 0;
}
.thumbnail:hover {
	background-color: transparent;
	z-index: 50;
}
.thumbnail span {
	/*CSS for enlarged image*/
	position: absolute;
	background-color: #FFFFCC;
	padding: 5px;
	left: -1000px;
	border: 1px dashed gray;
	visibility: hidden;
	color: black;
	text-decoration: none;
}
.thumbnail span img {
	/*CSS for enlarged image*/
	border-width: 0;
	padding: 2px;
}
.thumbnail:hover span {
	/*CSS for enlarged image on hover*/
	visibility: visible;
	top: 0;
	left: 60px; /*position where enlarged image should offset horizontally */
}
/*########################################################################## home */

#content2 {
	margin-bottom: 40px;
	clear: both;
}
/*
#content2 .main {
	margin-top: 20px;
}
#content2 .right {
	margin-top: 20px;
}
*/
.left {
	float: left;
	width: 190px;
	height: 200px;
}
.left .productImage {
	background-image: url(/images/bgProductImage.gif);
	background-repeat: no-repeat;
	width: 180px;
	height: 240px;
	background-position: center top;
	margin-top: 10px;
	margin-bottom: 20px;
}
.left .snippet {
	margin-top: 20px;
	margin-left: 20px;
	margin-right: 15px;
	margin-bottom: 0px;
	font-size: 11px;
}
.left .mac {
	background-image: url(/images/mac_universal.png);
	background-repeat: no-repeat;
	margin-top: 25px;
	width: 107px;
	height: 70px;
	margin-left: 32px;
}

.left .ad_two {
	margin-top: 20px;
	margin-left: 32px;
	margin-right: 20px;
	margin-bottom: 20px;
	font-size: 11px;
}

.left a {
	color: #FF6633;
}
.left a:link {
	color: #FF6633;
}
.left a:hover {
	color: #FF3300;
}
.left a:visited {
	color: #FF6633;
}
.left .productImageGrid {
	background-image: url(/images/bgProductImageGrid.gif);
	background-repeat: no-repeat;
	height: 180px;
	width: 180px;
	background-position: center 20px;
}
.main {
	float: left;
	width: 380px;
	margin-top: 40px;
	border-right-width: 1px;
	border-right-style: dashed;
	border-right-color: #C8D2EA;
	border-left-width: 1px;
	border-left-style: dashed;
	border-left-color: #C8D2EA;
}
.main h1 {
	color: #ff8855;
/*	color: #4D608C;
	font-size: 26px;
	font-family: "Arial", sans-serif;
	font-weight: bold;
	line-height: normal;
*/
	font-size: 30px;
	font-family: Georgia, "Times New Roman" , Times, serif;
	font-weight: normal;
	line-height: normal;
	
	margin-top: 0;
	margin-left: 18px;
	margin-right: 0px;
}
.main p {
	margin-left: 20px;
	margin-right: 20px;
}
.main .introLink {
	font-size: 11px;
	font-weight: normal;
	color: #ff7744;
}
.main a.introLink:link {
	color: #ff7744;
}
.main a.introLink:hover {
	color: #ff3300;
}
.main a.introLink:visited {
	color: #ff5522;
}
.right {
	float: left;
	width: 187px;
	margin-top: 40px;
}
.right ul {
	padding: 0px;
	margin-left: 30px;
	list-style-type: none;
	margin-top: 0px;
}
.right li {
	display: block;
	height: 20px;
	margin-top: 0px;
}
.right a {
	font-size: 11px;
	display: block;
	height: 20px;
}
.right a:hover {
	color: #FF6633;
}
#content2 .main .introContent2 {
	margin-top: 0px;
}
/* GRID */
.column { float: left; }
.grid2col, .grid2cola, .grid2colb, .grid2colc, .grid2cold, .grid2cole, .grid2colf, .grid3col, .grid3cola, .grid4col, .grid5col, .grid6col { width: 100%; }

.grid2col .column { width: 49%; }
.grid2col .grid2col .column { width: 47.8%; }
.grid3col .grid2col .column { width: 46%; }
.grid4col .grid2col .column { width: 45%; }

.grid2cola .column.first { width: 66%; }
.grid2cola .column.last { width: 32%; }

.grid2colb .column.first { width: 74.9%; }
.grid2colb .column.last { width: 23%; }

.grid2colc .column.first { width: 32%; }
.grid2colc .column.last { width: 66%; }

.grid2cold .column.first { width: 23%; }
.grid2cold .column.last { width: 74.9%; }

.grid2cole .column.first { width: 79%; }
.grid2cole .column.last { width: 19%; }

.grid2colf .column.first { width: 19%; }
.grid2colf .column.last { width: 79%; }

.grid3col .column { width: 32%; margin-left: 2%; }
.grid2col .grid3col .column { width: 31%; }

.grid3cola .column { width: 58%; margin-left: 2%; }
.grid3cola .column.first,
.grid3cola .column.last { width: 19%; }

.grid4col .column { width: 23%; margin-left: 3%; }

.grid5col .column { width: 18.4%; margin-left: 2%; }

.grid6col .column { width: 15%; margin-left: 2%; }

.column.first, .column.last { margin-left: 0 !important; }
.column.last { float: right !important; }

p.last, ul.last, ol.last, li.last { _width:auto !important; _float:none !important; }

#container:after, #content:after, .grid2col:after, .grid2cola:after, .grid2colb:after, .grid2colc:after, .grid2cold:after, .grid2cole:after, .grid2colf:after, .grid3col:after, .grid3cola:after, .grid4col:after, .grid5col:after, .grid6col:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
#container, #content, .grid2col, .grid2cola, .grid2colb, .grid2colc, .grid2cold, .grid2cole, .grid2colf, .grid3col, .grid3cola, .grid4col, .grid5col, .grid6col { _zoom:1; }
/*ticker*/
.wrapper {
	width: 930px;
	margin: 0 auto;
	text-align: left;
}
#ticker {
	background-image: url(/images/tickerBg.png);
	background-repeat: no-repeat;
	padding-left: 10px;
	height: 50px;
}
#ticker p {
	line-height: 18px;
	width: 100%;
	margin-top: 15px;
	font-weight: bold; 
	text-align: center; 
	float: left;
	border-right: 1px solid #808080;
}

#ticker #tickerLabel { 
	width: 12.5em; 
	margin-right: 1em; 
	color: #565656; 
	font-weight: bold; 
	text-align: center; 
	float: left; 
	display: inline;
}

#ticker #tickerElement { 
	margin-top: 15px;
	padding-left: 20px; 
	color: #a1a5a9; 
	float: left; 
	display: inline;
}
#ticker a { color: #6e6e6e; text-decoration: none; }
.leftImage {
	height: auto;
	width: auto;
	float: left;
	margin-right: 20px;
	margin-bottom: 10px;
	margin-top: 10px;
}
.rightImage {
	height: auto;
	width: auto;
	float: right;
	margin-left: 20px;
	margin-bottom: 10px;
	margin-top: 10px;
}

.buynow {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #EEE;
	padding-bottom: 40px;
	padding-top: 5px;
}

.buyprice {
	font-size: 16px;
	font-weight: normal;
	float: left;
	margin-top: 5px;
	margin-left: 260px;
	padding-right: 10px;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #999;
}
a.buyover {
	height: 30px;
	width: 106px;
	background-image: url(images/btn-buy-now.png);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	float: left;
}
a.buyover:hover {
  background-position:0 -30px;
  }
  
 a.visitweb {
	height: 30px;
	width: 150px;
	background-image: url(images/btn-visit-website.png);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	float: left;
}
a.visitweb:hover {
  background-position:0 -30px;
  }
a.buytry {
	height: 30px;
	width: 106px;
	margin-left: 10px;
	background-image: url(images/btn-try-now.png);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	float: left;
}
a.buytry:hover {
  background-position:0 -30px;
  }
.buyseparator {
	padding-right: 20px;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #666;
	margin-left: 100px;
}