﻿/***********************
 Body
 **********************/
body {
	margin: 0 auto;
   background: url(../images/bodyBackground.jpg) no-repeat;
	padding: 0px 0px 0px 0px;
	border: 0;
	width: auto;
	color: #333;
	font-size: 13px;
	font-family: Segoe, "Lucida Grande", Geneva, Arial, Verdana, sans-serif;

}

h1 {
font: 22px/24px "Segoe UI", Arial Black, Arial, Helvetica, sans-serif; 
color: #f0aa00; 
letter-spacing: -0.05em;
margin-top: 25px;
margin-bottom: 25px;
}
h1.small{
font: 18px/20px bold "Segoe UI", 'Trebuchet MS', Tahoma, Sans-serif; 
color: #4584DE; 
}
h2 {
font: 16px/19px "Segoe UI", Arial, Helvetica, sans-serif; 
color: #666666; 
text-transform: uppercase;
margin-top: -20px;
margin-bottom: 20px;
}


p { margin-bottom: 18px;}
p.follower { margin-top: 0px;}
p.leadin {font-weight: bold;  margin-bottom: 10px; }
li { padding: 5px 0px 0px 0px;}

/***********************
 Page
 **********************/
#page {
	padding: 0;
	background-color: #FFFFFF;
	width: 950px;
	margin: 0 auto;
	border-top: 0;
	border-right: 0;
	border-bottom: 0;
	border-left: 0;
	text-align: center;
}

/***********************
 MastHead
 **********************/
#masthead {
	width: 950px;
	margin: 0;
	padding: 0;
	overflow: auto;

	text-align: center;
}
#mastheadContent {
	width: 950px;
	margin: 0 auto;  /* need to set the width and margin to auto in this order for Firefox to center the contents to display window while letting the background bleeds to outside */
	height: 60px;
	padding: 0px 0px 0px 0px;
}
#masthead img { 
	float: left; 
	padding: 10px 0px 0px 0px;
}
#masthead p {
	font-size: 11px;
	color: #000080;
	margin: 10px 10px 0;
}
#masthead a {
	color: #000080;
	text-decoration: underline;
}

/***********************
 topleftNav
 **********************/

#topleftNav {
	overflow: hidden;
	float: right;
	text-align:  left;
	width: 350px;
	margin: 20px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	vertical-align:middle;
	color: White;
}
/* CSS classes for standard Links, only valid inside the #topleftNav DIV */
#topleftNav a, #topleftNav a:visited
{
   color: #4584DE;
   text-decoration: none;
	text-align:  left;
	padding: 0px 15px 0px 30px;
}

#topleftNav a:hover, topleftNav a:focus
{
  text-decoration: underline;
}

#freeTrial 
{
   background: url(../images/iconFreeTrial.png) no-repeat; 
	position: relative;
	float: right;
	width: 128;
	height: 24px;
	padding: 0px 0px 0px 0px;
}

#buyNow {
   background: url(../images/iconShoppingCart.png) no-repeat; 
	position: relative;
	float: right;
	width: 128;
	height: 24px;
	padding: 0px 0px 0px 0px;
}

#contactUs {
   background: url(../images/iconContactUs.png) no-repeat; 
	position: relative;
	float: right;
	width: 128;
	height: 24px;
	padding: 0px 0px 0px 0px;
}



/***********************
 Tabs
 **********************/
#tabs {
	overflow: hidden;
	text-align:  center;
	width: auto;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	border: 0;
	clear: both;
}
#tabs .Tab
{ 
  /* CSS class for non-selected Menu Item */
  background: url(../images/tabNormal.gif) no-repeat; 
  width: 128px;
  height: 32px;
  text-align: center;
   color: #545454;
  font-weight: normal;
}

#tabs .TabSelected
{ 
  /* CSS class for selected Menu Item */
  background: url(../images/tabSelected.gif) no-repeat; 
  font-weight: bold;
}

#tabs .TabHover
{ 
  /* CSS class for hovering  */
  background: url(../images/tabHover.gif) no-repeat; 
}

/* CSS classes for standard Links, only valid inside the #tabs DIV */
#tabs a, #tabs a:visited
{
  background: transparent ! important;
}

#tabs a:hover, #tabs a:active, #tabs a:focus
{
  background: transparent ! important;
  font-weight: bold;
}
#tabsContent {
	width: auto;
	margin: 0 auto; /* need to set the width and margin to auto in this order for Firefox to center the contents to display window while letting the background bleeds to outside */
	text-align: left;
	background: url(../images/tab1pixel.gif) repeat-x;
}

/***********************
 SubTab 
 **********************/
#subTab {
	width: 950px;
	margin: 0 ;
   height: 60px;
   margin: 0px 0px 0px 0px;
   text-align: left;
   background-color: white;
}
#subTabContent {
	width: auto;
	margin: 0; /* need to set the width and margin to auto in this order for Firefox to center the contents to display window while letting the background bleeds to outside */
	text-align: left;
	display: inline-block;
}
#subTab .SubTab
{ 
  /* CSS class for non-selected Menu Item */
   margin: 0px 0px 0px 0px;
	padding:  6px 5px 0px 5px;
   width: auto;
   height: 60px;
   text-align: center;
	vertical-align:  bottom;
}
	
#subTab a {
	color: #4584DE;
	text-decoration:none;
	height: 24px;
}

#subTab a:hover, #subTab a:active, #subTab a:focus
{
   text-decoration:none;
}

#subTab .SubTabSelected
{ 
	color: #424242;
   text-decoration:none;
   height: 40px;
   font-weight: bold;
}

#subTab .SubTabHover
{ 
   text-decoration: underline;
   height: 40px;
}

/***********************
 Snap Schedule navBar
 **********************/
#SSnavBar {
	width: 950px;
	margin: 0 ;
	text-align:left;
	color: #f0f0f0;
   height: 80px;
   margin: 0px 0px 0px 0px;
	clear: both;
}

#SSnavBar .navMenuStyle {
   background: url(../images/ssNavMenu.png); 
	width: 884px;
	margin: 0 ;
	color: #f0f0f0;
   height: 50px;
   margin-left: 33px;
	clear: both;
	text-align: center;
}

#SSnavBar .navMenuStyleBAM {
   background: url(../images/bamNavMenu.png); 
	width: 884px;
	margin: 0 ;
	color: #f0f0f0;
   height: 50px;
   margin-left: 33px;
	clear: both;
	text-align: center;
}

#SSnavBar .navMenuItem 
{ 
   font-weight: bold;
   background: transparent;
	text-decoration:none;
}

#SSnavBar .navMenuSelected 
{ 
	text-decoration: none;
	color: Black;
	height: 50px;
	background: url(../images/bamNavMenu1pixel.png) repeat-x ;
}

#SSnavBar .navMenuHover
{ 
	color: #4584DE;
	text-decoration:underline;
	vertical-align: middle;
   background: transparent ! important;
	color: Black;
}


/***********************
 Banner
 **********************/
#banner {
	padding: 0;
   background-color: Transparent;
   width: 950px;
	margin: 0 auto;
	text-align: center;
	height: auto;
}
#bannerContent {
   width: 950px;
	height: auto;
	margin: 0 auto; /* need to set the width and margin to auto in this order for Firefox to center the contents to display window */
	text-align: left;
}

/***********************
 Top Banner - Home page
 **********************/
#banner_home {
	padding: 0;
   background: url('../images/bannerhome1pixel.png') repeat-x; 
   width: auto;
	margin: 0 auto;
	text-align: center;
	height: 200px;
}

/***********************
 Top Banner- Products pages
 **********************/
#banner_products {
	padding: 0;
   background-color: white;
   width: 950px;
	margin: 0 auto;
	text-align: center;
}

/***********************
 Top Banner - Downloads pages
 **********************/
#banner_downloads {
	padding: 0;
   background: url('../images/bannerhome1pixel.png') repeat-x; 
   width: 950px;
	margin: 0 auto;
	text-align: center;
	height: 200px;
}

/***********************
 Content
Page width is 950px.
Left content is 675px.
Right content is 250px.
There is a gap of 25px in between.
 **********************/
#content {
	width: 950px;
	height: auto;
	margin: 0 auto;  /* need to set the width and margin to auto in this order for Firefox to center the contents to display window */
	padding: 0;
	background-color: #fff;
	text-align: center;
}
#contentFull {
	position: relative;
	float: left;
	width: 884px;
	padding: 0 0 0 33px;
	margin-left: 0px;
	background-color: #fff;
	text-align: left;
}
#contentLeft {
	position: relative;
	float: left;
	width: 615px;
	padding: 0 0 0 33px;
	margin-left: 0px;
	background-color: #fff;
	text-align: left;
}
#contentRight {
	width: 250px;
	margin: 0;
	float: right;
	padding: 0 30px 0 0;
	position: relative;
	text-align: left;
	margin-right: 0px;
}
#contentRight p {
	font-size: 11px;
	margin: 7px;
}

/***********************
 Box Menu
 **********************/
#boxMenu {
	padding: 0px 0 0px 0;
	text-align: right;
	color: #000080;
   position: relative; 
	margin: -20px 0px 0px 0px;
}

#boxMenuTopHeader{
   background: url(../images/boxMenuTopHeader.gif) no-repeat; 
	padding: 0px 0px 0px 0px;
	margin: 0 0 0 0;
   width: 250px;
   height: 36px;
}
#boxMenuBottomHeader{
   background: url(../images/boxMenuBottomHeader.gif) no-repeat; 
	padding: 0px 0px 0px 0px;
	margin: 0 0 0 0;
   width: 250px;
   height: 36px;
}

#boxMenu .boxMenuItem 
{ 
   background: url(../images/boxMenuNormal.gif) no-repeat; 
	width: 250px;
   height: 36px;
}
#boxMenu a {
	color: #4584DE;
	text-decoration:underline;
	padding: 0px 30px 0px 0px;
	vertical-align: middle;
   background: transparent ! important;
}
#boxMenu a:hover {
	text-decoration:underline;
   font-weight: bold;
}
#boxMenu .boxMenuSelected 
{ 
   background: url(../images/boxMenuSelected.gif) no-repeat; 
	text-decoration: none;
	width: 250px;
   height: 36px;
   font-weight: bold;
}

#boxMenu .boxMenuHover
{ 
	width: 250px;
   height: 36px;
}
	
/***********************
 bottombannerContent
 **********************/
#bottombanner{
	padding: 0;
   background-color: Transparent;
	width: 950px;
	margin: 0 auto;
	text-align: center;
	clear:both;
}
#bottombannerContent {
	width: 950px;
	height: 200px;
	margin: 0 auto;  /* need to set the width and margin to auto in this order for Firefox to center the contents to display window */
	padding: 30px 0 0 0;
	background-color: Transparent;
	text-align: center;
	clear:both;
}


/***********************
 ScreenShot
 **********************/
#screenshot {
	width: auto;
	margin: 0;
	float: right;
	padding: 5px;
	position: relative;
	overflow: auto;
}
/***********************
 Footer
 **********************/
#footer {
	width: auto;
	clear: both;
	overflow: auto;
	text-align: center;
	color: #808080;
	background-color: #ffffff;
	padding-top: 5px;
	padding-bottom: 5px;
}
#footerContent {
	text-align: left;
	width: 950px;
	margin: 0 auto;
}
#footer p {
	font-size: 11px;
	line-height: 14px;
	margin: 1px;
	padding: 1px;
}
#footer a {
	color: #808080;
	text-decoration: none;
}
#footer a:hover {
	color: #202020;
	text-decoration: underline;
}


/* Styles for Links */
a {
   color  : #4584DE;
	text-decoration: underline;
}
a:hover {
	color: #808080;
	text-decoration: underline;
}

.style_bold {
	font-weight: bold;
}
.style_italic {
	font-style: italic;
}
.contentRightMenuSelected {
	font-weight: bold;
	background-color: #C0C0C0;
}
.float_right {
	float:right;
}

img.right {
	float: right;
	margin: 0 0 5px 15px;
}

img.left {
	float: left;
	margin: 0 15px 5px 0;
}

th {
	border-top-color: #d5d8d8;
	border-top-style: solid;
	border-top-width: thin;
	border-bottom-color: #d5d8d8;
	border-bottom-style: solid;
	border-bottom-width: thin;
}

#homePageTable
{
	padding: 0;
   background-color: Transparent;
   width: auto;
	margin: 0 auto;
	text-align: center;
}

#buttonArea
{
	padding: 0;
   background-color: Transparent;
   width: auto;
	margin: 0 auto;
	text-align: center;
}

.block2col {
	width: auto;
	height: auto;
	margin: 0 auto;  /* need to set the width and margin to auto in this order for Firefox to center the contents to display window */
	padding: 0 0 0 0;
	clear:both;
}

.style1, .style2, .style3 
{
	padding: 5px 10px 5px 10px;
}


.layout2col .column { width: 47%; }
.column { float: left; }
.column.odd, .column.even { margin-left: 0 !important; }
.column.even { float: right !important; }
ul.square { list-style: square outside;  }


/************ FAQ question/answer style **********************/
.question {margin: 0.5em 0; cursor:pointer; display:block; color:#4584DE; text-decoration: underline;}
.answer {margin: 0.5em 0 0 20px; display:none;  padding: 10 0 5 20; }
.container{ margin-left: 40px; display:block; }
.toplink {margin-left: 20px; margin-top: 20px; margin-bottom: 20px;}

/**** Image hovering effects *******/
/**** Opacity effect ******/
.opacityit img{
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=40);
-moz-opacity: 0.4;
}

.opacityit:hover img{
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);
-moz-opacity: 1;
}
/**** Border effect ******/
.borderit img{
border: 1px solid #ccc;
}

.borderit:hover img{
border: 1px solid #e8e8e8;
}

.borderit:hover{
color: red; /* irrelevant definition to overcome IE bug */
}


table.graybordered 
{
	border-color: #d5d8d8;
	border-style: solid;
	border-width: 1px;
   background: url(../images/1pixelGrayGradient.png) repeat-x; 
	
}

/***********************
 quotePanel
 **********************/

.quotePanel blockquote {
background-image:url('../images/leftQuote.gif');
background-repeat:no-repeat;
color: Black;
float:left;
font-family:Georgia,"Times New Roman",Times;
font-style: italic;
font-size:14px;
line-height:1.4;
margin:20px 6px;
padding:15px 50px 20px;
}
.quotePanel blockquote span {
background-image:url(../images/rightQuote.gif);
background-position:right top;
background-repeat:no-repeat;
font-family: 'Trebuchet MS', Tahoma, Sans-serif;
font-style: normal;
display:block;
font-size:11px;
height:30px;
margin-top:-30px;
margin-right:-45px;
padding:40px 0 0;
}

/***********************
 contentTabStyle
 **********************/
#contentTabStyle 
{
margin: 0;
padding: 0;
display:inline-block;
}

#contentTabStyle h1 {
background-position:left top;
background:url('../images/h_884.png');
background-repeat:no-repeat;
color:#4466BB;
font-family:Segoe UI,Arial;
font-size:1.9em;
font-weight:normal;
margin-top:0px !important;
padding:10px 0 1px 20px;
text-transform: none;
}

#contentTabStyle h1.wide 
{
background:url('../images/h_884.png') no-repeat;
width: 885px;
}

#contentTabStyle h1.medium 
{
background:url('../images/h_615.png') no-repeat;
}

#contentTabStyle h2 {
color:#454545;
font-family: Segoe UI,Arial,Verdana;
font-size:1.60em;
font-weight:normal;
line-height:1.60em;
margin:0px 0 0 !important;
padding:6px 0 0 20px;
text-transform: none;
}

#contentTabStyle h3 {
color:#454545;
font-size: 1.25em;
font-family: Segoe UI,Arial,Verdana;
font-weight:normal;
line-height:1.35em;
margin: 0px 0 0 !important;
letter-spacing:-1px;
padding:6px 0 6px 20px;
text-transform: uppercase;
}

#contentTabStyle h2 span {
color:#888888;
}

#contentTabStyle p {
font-size:12px;
line-height:1.6;
margin:0px 0;
padding: 6px 20px;
}



#contentTabStyle li {
font-size:12px;
line-height:1.6;
margin-left: 0px;
margin-right: 20px;
}

#contentTabStyle img 
{
margin:20px 20px 20px 20px;
}

#contentTabStyle img.right {
border:0 none;
float:right;
margin:8px 40px 8px 10px;
}

#contentTabStyle img.showmeRight {
border:0 none;
float:right;
margin:0px 0px 0px 0px;
}

#contentTabStyle .sectioncontent {
width: 885px;
vertical-align: text-top;
clear:none;
}
#contentTabStyle .sectiontext {
width: 700px;
vertical-align: text-top;
float: left;
clear:none;
}

#contentTabStyle .gallerythumbnail {
padding: 0px 0px 0px 0px;
vertical-align: top;
}

#contentTabStyle .highslide-gallery img {
	border-style: solid;
	border-width: thin;
	border-color: White;
}

#contentTabStyle .highslide:hover img
{
 border-color: #c0c0c0;
}
/* Styles for image control bar */
.imgControlBar  {
   color  : White;
	text-decoration: none;
	 background-color: #606060;
}

#msOfficeMarketPlace 
{
float: right; 
border-style: none;
}

#msOfficeMarketPlace img 
{
border:0 none;
}

#bookmarkTOC ul { display: block;
    font-family: Arial,Verdana;
    font-size: 1em;
    line-height: 1em;
    list-style: disc outside url(../images/downArrow12em.png);
    margin-bottom: 0px;
    margin-left: 0;
    margin-top: 0px;
    padding-bottom: 0;}
#bookmarkTOC li {
    color: #3366CC;
    line-height: 16px;
    list-style-image: url(../images/downArrow12em.png);
    margin: 5px 0 0 20px;
    padding: 0 0 5px;
}
#bookmarkTOC li.innerEntry {
    color: #3366CC;
    line-height: 16px;
    list-style-image: url(../images/downArrow12em.png);
    margin: 0 0 0 20px;
    padding: 0 0 5px;}
