/* MAIN STYLESHEET FOR ACTIVE ANTISPAM SITE */
/* pop up windows have separate stylesheet */

/* THE BASIC SITE ATTRIBUTES FIRST */

body {
margin: 0;
padding: 0;
font-family: arial, helvetica, sans-serif;
font-size: 12px;
color: #333;
background-color: #fff;
background-image: url(../assets/bg_blue.gif); /* background image for site */
background-repeat: repeat;
}

/* MAIN DIVISONS AND SECTIONS OF SITE */

#center { /* outer div to center whole site - CURRENTLY NOT USED */
text-align: left; /*center*/
}

#main { /* containing div for the whole site and sub sections within center div */
width: 770px;
height: auto;
background-color: #fff;
border-bottom: 1px solid #999;
border-left: 1px solid #999;
border-right: 1px solid #999;
text-align: left;
/* these two margin left and right settings are needed to center the site, if used */
/*margin-left: auto;
margin-right: auto;*/
}

#topbar { /* topbar image as background via css */
width: 770px;
height: 125px;
color: #000;
font-weight: bold;
background-image: url(../assets/topbar.jpg);
background-repeat: no-repeat;
background-position: left top;
margin-bottom: 0;
padding-bottom: 0;
}

#navbar { /* main menu for site */
width: auto;
height: auto;
text-align: right;
padding-top: 85px; /* moves the main menu down to align nearer the bottom */
margin-right: 30px; /* adds some space on the right */
}

#strip, #striphome { /* for horizontal boxes underneath main menu */
width: 770px;
height: 32px;
margin-top: 0;
padding-top: 0;
background-color: #69c;
}

#striphome { /* shorter strip from above for homepage only */
width: 170px;
}

#left { /* lefthand section (mainly housing the left sub menu options) */
font-family: tahoma;
width: 170px;
height: auto;
float: left;
background-color: #b3c5d8;
}

#right { /* righthand section (mainly housing the main content itself) */
width: 530px;
height: auto;
float: left;
margin-left: 10px;
}

/* GENERAL CLASS STYLES */

/* SUBHEADER DIVS USED ON HOMEPAGE ONLY */
.subheaders { /* used for homepage subheaders only */
margin-top: 15px;
margin-left: 19px;
}

.subtext { /* used for homepage subtext below subheaders */
margin-left: 19px;
margin-top: 2px;/* proper value for compliant sites */
}
*html .subtext {
margin-top: 0px; /* value for msie only */
}

.homeSubtext { /* used to define the light grey blocks to house the subtext */
width: 167px;
height: 130px; /* may need to change this value depending on amount of text used */
background-color: #f0f0f0;
float: left;
margin-top: 0;
margin-left: 1px;
margin-right: 2px;
}

/* GENERAL FLOATS AND CLEAR */
.floatleft {
float: left;
}

.floatright {
float: right;
}

.clearboth {
clear: both;
}

/* GENERAL STYLE ATTRIBUTES */

strong {
font-weight: bold;
font-style: normal;
}

/* FORM STYLES */
form { /* currently used only for evaluation section */
clear: both;
}

input {
background-color: #ffffe1;
}

input.submitButton {
margin-bottom: 20px;
background-color: #f0f0f0;
}

.formText { /* aligning the evaluation form fields */
width: 250px;
float: left;
display: inline;
text-align: right;
margin: 6px 10px 10px 20px;
}

.formField { /* aligning the evaluation form fields */
width: 180px;
float: left;
display: inline;
text-align: left;
margin: 6px 10px 10px 0;
}

/* TABLE STYLES FOR ANTISPAM AND ANTIVIRUS PAGES */
table {
font-size: 100%;
border: 1px solid #ccc;
margin: 20px 0 20px 20px;
background-color: #f0f0f0;
}

tr.darkgrey {
background-color: #dadada;
}

th, td {
width: 70%;
border: 1px solid #dadada;
padding: 0 10px 10px 0; /* creates some space between words and borders */
}

th.tableTitle, td.tableTitle {
width: 30%;
vertical-align: top;
text-align: center;
font-weight: bold;
border: 1px solid #ccc;
padding: 0 10px 10px 0; /* creates some space between words and borders */
}

th, th.tableTitle {
text-align: center;
padding: 2px; /* different space settings for the table headers */
}

/* TABLE STYLES FOR PRICING PAGE */
table.pricing {
width: 70%;
background-color: #fff;
}

table.pricing td { /* for all columns on the pricing table */
padding: 0;
}

/* IMAGE STYLES */
img {
border: 0;
}

#right img.arrowTop { /* for back to top arrow */
display: inline;
margin: 0; /* margin set to 0 to keep arrow beside text */
}

#right img { /* for all images used for the main content */
margin-left: 20px;
margin-right: 20px;
margin-bottom: 20px;
}

#right img.homeSubheader { /* for homepage suheader images only */
margin-left: 1px;
margin-right: 0;
margin-bottom: 2px;
}

#right .clientlogos img { /* for client logos only */
margin-top: 10px;
margin-right: 10px;
}

#right img.screenshots { /* less space for user admin screenshots only */
margin-bottom: 5px;
}

/* HEADER STYLES */
h1, h1.home { /* used once on each page for each page header */
font-weight: bold;
font-size: 16px;
color: #000;
margin: 24px 0 0 20px;
background-color: #f0f0f0;
padding: 5px 0;
}

h1.home { /* different h1 value for homepage only */
margin-top: -12px; /* negative value to create less top space */
background-color: #e0e0e0; /* slightly darker grey than default h1 */
}

h2 {
font-weight: bold;
font-size: 14px;
color: #000;
margin: 10px 0 0 20px;
background-color: #f0f0f0;
padding: 5px 0;
}

h3 {
font-weight: bold;
font-size: 14px;
color: #000;
margin: 20px 0 0 20px;
background-color: #f0f0f0;
padding: 5px 0;
}

h4 {
font-weight: bold;
font-size: 12px;
font-style: normal;
color: #003;
margin: 10px 0 0 20px;
}

h5 { /* used on contact section */
font-weight: bold;
font-size: 12px;
font-style: normal;
color: #003;
margin: 20px 0 0 20px;
}

h6 { /* for footer only */
font-weight: normal;
font-size: 10px;
text-align: center;
color: #000;
background-color: #f0f0f0;
margin-left: 20px;
}

/* PARAGRAPH STYLES */
p {
font-weight: normal;
line-height: 1.7em;
margin: 10px 0 10px 20px;
}

p.backtotop { /* used for back to top link */
text-align: right;
margin: 0 0 0 20px;
}

p.userAdmin { /* used on user admin section below each screenshot */
margin: 0 0 25px 20px;
}

p.contact {
margin: 2px 0 20px 20px;
}

p.smallItalics {
font-size: 10px;
font-style: italic;
}

.homeSubtext p { /* on homepage only */
margin: 0 0px 5px 5px;
line-height: 1.5em;
}

p.smallRight { /* for find out more buttons in subtext on homepage only */
font-size: 11px;
/*text-align: right;*/
margin-right: 5px;
}

#navbar p { /* p tag used to house main menu links for the main navigation */
color: #b3c5d8; /* same color as background to hide separators | between menu links */
font-size: 14px;
padding: 10px 0 2px 0;
margin-top: 0;
}

/* LIST STYLES */
#left ol { /* lefthand sub menu */
margin-top: 20px; /* moves sub menu to create top space */
margin-left: 20px; /* moves sub menu to create lefthand space */
}

#left ol, #left li.menu { /* lefthand submenu continued */
line-height: 2.4em; /* creates space between list items */
list-style: none; /* no bullet points */
color: #fff;
clear: both; /* used to correct an error on net6.2 only */
}

ol {
line-height: 1.7em;
color: #000;
margin-bottom: 30px;
}

ul, li {
line-height: 1.7em;
color: #000;
margin-bottom: 0;
}

li.support { /* used on the support section */
margin-top: 12px;
}

/* GENERAL ANCHOR LINKS */
a {
color: #009; /* red colour */
font-weight: normal;
text-decoration: underline;
}

a:hover {
color: #f00; /* blue colour */
font-weight: normal;
text-decoration: none;
}

/* MAIN MENU STYLES */
#navbar a {
color: #fff;
font-weight: bold;
text-decoration: none;
padding: 9px 9px 10px 9px;
}

#navbar a:hover {
color: #000;
font-weight: bold;
text-decoration: none;
padding: 9px 9px 10px 9px;
/*background-color: #fff;*/
}

#navbar a.selected { /* for current selected page in main menu */
color: #000;
}

/* LEFTHAND MENU STYLES */
#left a {
color: #333;
font-weight: bold;
text-decoration: none;
}

#left a:hover {
color: #fff;
font-weight: bold;
text-decoration: none;
}

#left a.selected { /* for current selected page in side menu */
color: #fff;
}

