/*
	Copyright (c) DigitalPeers.  All rights reserved.
 
    Module Name:

        main_style.css

    Abstract:

        Main styles for the site.

    Environment:

        Apache Server

    Revision History:

        Amit Aides Jan 12 2006 - Created.

*/


/*
 Generic Selectors 
*/

body {
	margin:0pt; 
	padding:0pt;
	background-color:#0F60AD;
	font-family: Verdana, Arial, sans-serif;
	font-size: small; /*12px;*/
	font-weight: normal;
}


h1{
	font-family:  'Trebuchet MS', Verdana, Arial, sans-serif;
	font-size: x-large; /*22px;*/
	color: blue;
	margin: 0.8em 0;
	padding: 0;
	text-align: center;
	text-indent: 0;
}

h2{
	font-size: medium; /*14pt;*/
	color: black;
	margin: 1em 0 0.5em 0;
	padding: 0;
	text-align: left;
	text-indent: 0;
}

h3{
	font-size: 115%; /*13pt;*/
	color: #555;
	margin: 1em 0 0.5em 0;
	padding: 0;
	text-align: left;
	text-indent: 0;
}

h4{
	font-size: small; /*10pt;*/
	font-weight: bold;
	color: #555;
	margin: 1em 0 0.5em 0;
	padding: 0;
	text-align: left;
	text-indent: 0;
}

hr{
	margin: 6pt;
}

img{
	border: 0pt;
}

em{
	color: black;
	font-weight: bold;
	font-style: normal;
}

ul{
	line-height: 1.5em;
}

li{
	margin: 1em 0;
	padding: 0;
}

p{
	line-height: 1.5em;
	text-indent: 0;
	margin: 0.5em 0;
}



/*
********************************************************************************************************
*/

/*
 Classes 
*/

hr.one {border: none 0; 
	border-top: 1px dashed #000;
	border-bottom: 1px dashed #ccc;
	height: 2px;
	margin: 0 auto 0 0;
	text-align: left;
}	

.float_right_clear{
	clear: right;
	float: right;
	margin: 2pt;
	padding: 0pt;
	text-align: center;
}

.center_clear{
	clear: both;
	text-align: center;
}

/* A quate from "http://www.alistapart.com/articles/practicalcss/"
 When you float an element with CSS, it no longer takes up any “space” and the background and
 border show up above the images instead of surrounding them. We need to put some content other
 than the floated DIVs into the container DIV.
 31/3/05 - I added this spacer (and the corresponding div spacer in the html code, because I could
 not get the FireFox to display correctly the menu. When ever I tried to put a top margin all the
 menu background image would move down. IE6 didn't have this problem.
  */
  
div.spacer {
	clear: both; /* The clear: both means that this spacer doesn't allow floating on both its sides.*/
	margin: 0;
	padding: 0;
}

div.spacer_10pt {
	clear: both; /* The clear: both means that this spacer doesn't allow floating on both its sides.*/
	padding: 10pt 0pt 0pt 0pt;
	margin: 0pt;
}

div.spacer_25pt {
	clear: both; /* The clear: both means that this spacer doesn't allow floating on both its sides.*/
	padding: 25pt 0pt 0pt 0pt;
	margin: 0pt;
}

div.spacer_50pt {
	clear: both; /* The clear: both means that this spacer doesn't allow floating on both its sides.*/
	padding: 50pt 0pt 0pt 0pt;
	margin: 0pt;
}

.bordered_attention{
	font-weight: bold;
	border: thin silver solid;
	padding: 0.5em 2em;
	margin: auto;
	width: auto;
	background-color: #F5F5F5;
}

.blue_attention{
    border-top: 1px dashed #000;
	padding: 0.5em 1.5em;
	margin: 0em;
	background-color: #CFF;
}

.blue_attention_r_column{
    border-top: none;
	padding: 0.8em;
	margin: 0em;
	background-color: #CFF;
}

.light_blue_attention{
    border-top: 1px dashed #000;
	padding: 0.5em 1.5em;
	margin: auto;
	width: auto;
	background-color: #F5F5F5;
}

.sidebar_attention  {
	list-style: none;
	background-color: #CFF;
	margin: 0 -0.3em;
	padding: 1.5em 0.2em;
}

.sidebar_attention h3 {
	text-align: center;
	margin: 0.3em 0;
}

h3.nytimes{
	font-family: 'Calisto MT', Century, serif;
	font-size: 120%;
	color: #555;
}

/*
********************************************************************************************************
*/

/*
 IDs
*/

/* MainDocument creates the centered white space.
 margin:opx auto - centers the space in the middle of the window */
#mainDocument {
	width:767px;
	background-image: url(../images/background.jpg);
	background-color:#ffffff;	
	margin:10px auto;
	text-align: justify;	
}

#topImage {
	background-image: url(../images/header.jpg);
	height: 109px;
}

#contentTop {
	background-image: url(../images/content_top.jpg);
	height: 101px;
}

#topPart {
	width:auto;
	background-color:#FFFFFF;
}

#centerDoc {
	font-size: small; /*10pt;*/
	color: #666666;
	background-color:#FFFFFF;	
	width: 59%;
	float:left;
	margin: -55px 0px 0px 23px;
}
#mainDocument>#centerDoc {margin:-55px 0px 15px 45px;} /*Mozilla Fix*/
/* amit - I have put a bottom margin on the mozilla fix for the centerDoc, This is done so the copyright
notice will be lifted a bit. Note: the copyright top is JS calculated as centerDoc.height - rightColumn.height */

#centerDoc p{
	margin: 0.5em 0;
	text-indent: 0;
}

#rightColumn {
	width:25%;
	background-color:#ffffff;
	float: right;
	margin: -30px 22px 0px 0px;
	text-align: left;
}
#mainDocument>#rightColumn {margin: -30px 45px 0px 0px;} /*Mozilla Fix*/

#rightColumn img{
}

#copyright {
	bottom: 0pt;
	margin: auto;
	margin-bottom: 0pt;
	text-align: center;
	position: relative;
	font-size: x-small; /*8pt;*/
}

#copyright a {
	text-decoration: none;
}

#footer {	
	background-image: url(../images/footer.jpg);
	background-repeat: no-repeat;
	height: 40px;
}

#footer_menu {
	width: 70%;
}

#footer ul
{
	list-style: none;
	margin: 0 50px;
	text-align: center;
	border-top: 1px solid #aaa;
}
#mainDocument>#footer ul{text-indent: -35px;} /*Mozilla Fix*/

#footer li
{
	display: inline;
	padding: 0 5px;
	margin: 0;
	color: #999;
}

#footer li a
{
	color: #999;
	padding: 0;
	margin: 0;
}



/*
********************************************************************************************************
*/

/*
 TOP HORIZONTAL MENU CSS CODE
*/

/*
    First level navigation bar
*/

.nav-menu ul
{
	list-style: none;
	height: 27px;
	width: auto;
	background-image: url(../images/navigation_bg.jpg);
	padding: 0;
	margin: 0;
	padding-left: 26px;
}

.nav-menu li
{
	position: relative;
	z-index: 100;
	float: left;
	margin: 0;
	padding: 0;
	line-height: 2em;
}

.nav-menu li a
{
	float: left;
	display: block;
	border: 0;
	color: #fff;
	text-decoration: none;
	text-align: center;
}

/* Commented backslash hack hides rule from IE5-Mac \*/
.nav-menu li a
{
	float: none
}
/* End IE5-Mac hack */

/*
    Second level navigation bar
*/

.nav-menu li ul {
    display: none;

    float: none;
    position: absolute;
	z-index: 100;

    font-size: 90%;

    width: 12em;
    height: auto;

    background-color: rgb(127, 156, 180);

    background-image: url(../images/dropdown_st.png);
    background-color: transparent;    
    padding-left: 0;

    top: 27px;
    left: 0;
}

.nav-menu li:hover ul, li.over ul {
    display: block;
}

.nav-menu li li {
    float: none;

    background-image: none;
    background-color: transparent;

    width: auto;
    height: auto;
}

.nav-menu li li a {
    float: none;

    background-color: transparent;
	color: white;
    width: 10.5em;
    height: auto;
    
    padding: 0.25em 0.75em;
}

.nav-menu li li a:hover {
    background-image: url(../images/dropdown_st_he.png);
    background-color: transparent;    

    height: auto;
}

/*
	Menu Graphics
*/

.nav-menu li a.nav_home{
	width: 67px;
	height: 27px;
	background-image: url(../images/nav_home.jpg);
}

.nav-menu li a.nav_home:hover{
	background-image: url(../images/nav_home_over.jpg);
}

.nav-menu li a.nav_buy{
	width: 94px;
	height: 27px;
	background-image: url(../images/nav_buy.jpg);
}

.nav-menu li a.nav_buy:hover{
	background-image: url(../images/nav_buy_over.jpg);
}

.nav-menu li a.nav_downloads{
	width: 120px;
	height: 27px;
	background-image: url(../images/nav_downloads.jpg);
}

.nav-menu li a.nav_downloads:hover{
	background-image: url(../images/nav_downloads_over.jpg);
}

.nav-menu li a.nav_support{
	width: 108px;
	height: 27px;
	background-image: url(../images/nav_support.jpg);
}

.nav-menu li a.nav_support:hover{
	background-image: url(../images/nav_support_over.jpg);
}

.nav-menu li a.nav_contact{
	width: 120px;
	height: 27px;
	background-image: url(../images/nav_contact.jpg);
}

.nav-menu li a.nav_contact:hover{
	background-image: url(../images/nav_contact_over.jpg);
}

.nav-menu li a.nav_forum{
	width: 92px;
	height: 27px;
	background-image: url(../images/nav_forum.jpg);
}

.nav-menu li a.nav_forum:hover{
	background-image: url(../images/nav_forum_over.jpg);
}

.downloadme {
	display:block;

	width: 100%;
	height: auto;

	padding:0;
	margin: 0;
	
	/*border: thin silver solid;*/
	/*background-image: url(../images/downloadme.jpg);*/
	background-repeat: no-repeat;
	background-position: center;
}

.downloadme img {
    padding: 0;
    margin:0;
}

.downloadme:hover {
	background-image: url(../images/downloadme.jpg);
}

#preloadImg span{
	display: none;
}

#homeImgPreload {
	background-image: url(../images/nav_home_over.jpg);
}

#buyImgPreload {
	background-image: url(../images/nav_buy_over.jpg);
}

#downloadImgPreload {
	background-image: url(../images/nav_downloads_over.jpg);
}

#supportImgPreload {
	background-image: url(../images/nav_support_over.jpg);
}

#contactImgPreload {
	background-image: url(../images/nav_contact_over.jpg);
}

#forumImgPreload {
	background-image: url(../images/nav_forum_over.jpg);
}



/**/
/********************************************************************************************************/
/**/

/*
 PAGE SPECIFIC DEFINITIONS
*/
	
/*
Index page 
*/

.feature_list{
	list-style-image: url(../images/bullet.png);
	list-style-type: square;
	vertical-align: top;
}

.feature_list li{
	margin: 1.5em 0;
}

.feature_list a.title{
	font-size: medium; /*12pt;*/
	vertical-align:top;
	text-indent: 0;
}

.feature_list img{
	margin-top: -5px;
}

/* amit - I used long specification for the following or else I could not set
  the margin and text indent */
#centerDoc .feature_list p{
	margin: 0.5em 0;
	text-indent: 0;
}

#download_help_list{
	font-size: x-small; /*8pt;*/
	margin: 0 0 0 1.5em;
	padding: 0;
}

#download_help_list em{
	font: inherit;
	font-weight: bold;
}

/*
Features page
*/

.row_of_img_with_comment div.image_with_comment{
	float: left;
	margin: 1em 2em;
	
}

.image_with_comment img{
	display: block;
	text-align: center;
}

.image_with_comment p{
	font-size: x-small; /*8pt;*/
	font-weight: bold;
	text-align: center;
	margin: 0.5em 0;
}

/*
Help page 
*/

.help_lists{
	list-style-type: square; 
}

.help_lists li{
	margin: 1em 0;
}

.faq_lists li{
	margin: 1em 0;
}

/*
Contact_us page 
*/

.RequiredField {
	color: #FF0000;
}

/*
UnInstall page
*/

.uninstallFormTable {
	margin: 2em 0;
}

col#UIcol1 {
	width: 170px;
	text-align: left;
}

col#UIcol2 {
	width: 150px;
}

col#UIcol3 {
	width: 180px;
}

/*
CamTrack Survey page
*/

div.field_title {
	font-size: small; /*12pt;*/
	color: #222;
	margin: 1em;
}

div.field_input {
	margin: 1em 0 2em 7em;
}

/*
Beta page 
*/

img.left_floating_img {
	float:left;
	margin: 0 1em;
}

img.right_floating_img {
	float:right;
	margin: 0 1em;
}

div.img_text {
	margin: 1em;
}

img.download_effects {
	margin: 1em 3em;
}

div.company_text {
	margin: 1em 3em;
}

div.highlighted {
	background-color: #CFF;
	margin: 0em;
	padding: 1em;
}

.warning {
	float:right;
	width: 150pt;
	font-size: x-small; /*8pt;*/
	background-color: #CFF;
	padding: 1pt;
	margin: 1em;
	border: thin silver solid;
}

.download_warning {
	font-size: x-small; /*8pt;*/
	background-color: #CFF;
	padding: 1pt;
	margin: 1em;
	border: thin silver solid;
}