﻿/* Elements */
* body {background-color: #2e89ca; height: 100%; padding: 0; margin: 0;}

h1 {font-family: Helvetica, Arial; font-size: 1.0em; color: #2e89ca; font-weight: normal;}
h2 {font-family: Helvetica, Arial; font-size: 1.0em; color: #2e89ca; font-weight: normal;}
h3 {font-family: Helvetica, Arial; font-size: 1.0em; color: #2e89ca; font-weight: normal;}
h4 {font-family: Helvetica, Arial; font-size: 1.0em; color: #2e89ca; font-weight: normal;}
h4 {font-family: Helvetica, Arial; font-size: 1.0em; color: #2e89ca; font-weight: normal;}
h5 {font-family: Helvetica, Arial; font-size: 2.0em; color: #ffffff; font-weight: normal;}
h5 a {color: White; text-decoration: underline;}

/* ID s */

/*PAGE Container DIV */
#container {width: 900px;  margin-top: 25px; margin-bottom: 0px; margin-left:auto; margin-right: auto; border: none; background-color: #ffffff; background-image: url(../Images/webexpresslogo2.gif); background-position: left top; background-repeat: no-repeat; background: #ffffff url(../Images/webexpresslogo2.gif) no-repeat left top;}

/* Header DIV */
#header {display: block; float: none; clear: both; margin-left:auto; margin-right: auto;}

/* Logo DIV */
#logo {display: block; position: relative; float: none; clear: both; margin-top: 0px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 860px; height: 60px; background: url(../Images/brightsideslogo.gif) no-repeat left center; }

/* Banner DIV */
#banner {display: block; position: relative; float: none; clear: both; margin-top: 0px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 860px; height: 235px; background: url(../Images/homepage_maingraphic_1.gif) no-repeat center center; }

#banner.rotate {display: block; position: relative; float: none; clear: both; margin-top: 0px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 860px; height: 235px; background-image:none;}

#bannerP {display: block; position: relative; float: none; clear: both; margin-top: 15px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 860px; height: 100px; }
    #bannerP .subheaderimg {margin-top: 10px;}

#banner.title {display: block; position: relative; float: none; clear: both; margin-top: 125px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 860px; height: 80px; }

/* Mainarea DIV */
#mainarea {display: block; position: relative; float: none; clear: both; margin-top: 15px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 860px;}

#mainareaG {display: block; position: relative; float: none; clear: both; margin-top: 30px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 860px; height: 340px;}
        #mainareaG .subcontain {display: block; position: relative; float: none; clear: both; margin-top: 0px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 860px; height: 295px;}     
        #mainareaG .subcontain .col1 {display: block; position: relative; float: left; clear: none; margin-top: 0px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 405px; height: 280px; text-align: left;}
            
            #mainareaG .subcontain .col1 .height200a {height: 225px;}
            
            #mainareaG .subcontain .col1 .clientweburl {font-family: Helvetica, Arial; font-size: 1em; color: #851819; text-align:right; margin-top: 20px; margin-bottom: 0px; margin-left:auto; margin-right: 8px;}
                #mainareaG .subcontain .col1 .clientweburl a {text-decoration: none; color: #851819; font-weight: bolder;}
        
        #mainareaG .subcontain .colspace {display: block; position: relative; float: left; clear: right; margin-top: 0px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 9px; height: 280px; text-align: left;}
        
        #mainareaG .subcontain .col2 {display: block; position: relative; float: left; clear: right; margin-top: 0px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 445px; height: 280px; text-align: left; background-image: url(../Images/graphic_stepone.gif); background-position: left bottom; background-repeat: no-repeat; background: #ffffff url(../Images/graphic_stepone.gif) no-repeat left bottom;}
                     
             #mainareaG .subcontain .col2 .height200a {height: 225px; width: 180px; margin-left: 10px;}
             
             #mainareaG .subcontain .col2 .clientweburl {font-family: Helvetica, Arial; font-size: 1em; color: #851819; text-align:right; margin-top: 20px; margin-bottom: 0px; margin-left:auto; margin-right: 8px;}
                #mainareaG .subcontain .col2 .clientweburl a {text-decoration: none; color: #851819; font-weight: bolder;}
                
             #mainareaG .subcontain .col2 table {display: block; position: relative; float: none; clear: right; margin-top: 55px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 405px;}
                #mainareaG .subcontain .col2 table td {font-family: Helvetica, Arial;}

#mainareaGtwo {display: block; position: relative; float: none; clear: both; margin-top: 10px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 860px; height: 545px;}
    #mainareaGtwo .subcontain {display: block; position: relative; float: none; clear: both; margin-top: 0px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 860px; height: 515px;}     
        #mainareaGtwo .subcontain .col1 {display: block; position: relative; float: left; clear: none; margin-top: 0px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 405px; height: 515px; text-align: left;}
            #mainareaGtwo .subcontain .col1 .height200a {height: 215px;}
        #mainareaGtwo .subcontain .colspace {display: block; position: relative; float: left; clear: right; margin-top: 0px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 9px; height: 515px; text-align: left;}
        #mainareaGtwo .subcontain .col2 {display: block; position: relative; float: left; clear: right; margin-top: 0px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 445px; height: 515px; text-align: left; background-image: url(../Images/graphic_steptwo.gif); background-position: left bottom; background-repeat: no-repeat; background: #ffffff url(../Images/graphic_steptwo.gif) no-repeat left bottom;}
            #mainareaGtwo .subcontain .col2 .themes {display: block; position: relative; float: none; clear: right; margin-top: 115px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 425px;}
            
#mainareaGthree {display: block; position: relative; float: none; clear: both; margin-top: 10px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 860px; height: 545px;}
    #mainareaGthree .subcontain {display: block; position: relative; float: none; clear: both; margin-top: 0px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 860px; height: 515px;}     
        #mainareaGthree .subcontain .col1 {display: block; position: relative; float: left; clear: none; margin-top: 0px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 405px; height: 515px; text-align: left;}
            #mainareaGthree .subcontain .col1 .height200a {height: 215px;}
        #mainareaGthree .subcontain .colspace {display: block; position: relative; float: left; clear: right; margin-top: 0px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 9px; height: 515px; text-align: left;}
        #mainareaGthree .subcontain .col2 {display: block; position: relative; float: left; clear: right; margin-top: 0px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 445px; height: 515px; text-align: left; background-image: url(../Images/graphic_stepthree.gif); background-position: left bottom; background-repeat: no-repeat; background: #ffffff url(../Images/graphic_stepthree.gif) no-repeat left bottom;}
            #mainareaGthree .subcontain .col2 .themes {display: block; position: relative; float: none; clear: right; margin-top: 185px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 425px; font-family: Helvetica, Arial; font-size: 0.8em; color: #ffffff; font-weight:bold; text-align:center;}


#mainareaB {display: block; position: relative; float: none; clear: both; margin-top: 15px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 860px; height: 450px;}
   #mainareaB .subcontain {display: block; position: relative; float: none; clear: both; margin-top: 30px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 860px; height: 420px;}

        
/* Nav DIV */
#nav {display: block; position: relative; float: none; clear: both; margin-top: 44px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 860px; height: 155px;}
    #nav .subcontain {display: block; position: relative; float: none; clear: both; margin-top: 0px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 562px; height: 135px;}
        #nav .subcontain .col1 {display: block; position: relative; float: left; clear: none; margin-top: 0px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 280px; text-align: left;}
        #nav .subcontain .col2 {display: block; position: relative; float: left; clear: right; margin-top: 0px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 280px; border-left: 1px solid #1a1a1a; text-align: right;}

#navsub {display: block; position: relative; float: none; clear: both; margin-top: 10px; margin-bottom: 4px; margin-left:auto; margin-right: auto; width: 325px; height: 41px;}
    #navsub img {margin-left: 5px; margin: 0 0 0 5px;}
/* Footer DIV */

/*#footer {display: block; position: relative; float: none; clear: both; margin-top: 40px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 860px; height: 120px; background-image: url(../Images/brightsideslogo_whiteout.gif); background-position: bottom left; background-repeat: no-repeat;}*/
#footer {display: block; position: relative; float: none; clear: both; margin-top: 40px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 860px; height: 120px;}
    #footer .subcontain {display: block; position: relative; float: none; clear: both; margin-top: 0px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 860px; height: 115px;}
        #footer .subcontain .col1 {display: block; position: relative; float: left; clear: none; margin-top: 0px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 430px; text-align: left;}
        #footer .subcontain .col1b {display: block; position: relative; float: left; clear: none; margin-top: 0px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 260px; text-align: left;}
        #footer .subcontain .col2 {display: block; position: relative; float: left; clear: none; margin-top: 0px; margin-bottom: 0px; margin-left:5px; margin-right: auto; width: 190px; text-align: right; padding-left: 4px;}
        #footer .subcontain .col3 {display: block; position: relative; float: left; clear: none; margin-top: 0px; margin-bottom: 0px; margin-left:5px; margin-right: auto; width: 190px; border-left: 1px solid #ffffff; text-align: right; padding-left: 4px;}
        #footer .subcontain .col4 {display: block; position: relative; float: left; clear: right; margin-top: 0px; margin-bottom: 0px; margin-left:5px; margin-right: auto; width: 190px; border-left: 1px solid #ffffff; text-align: right; padding-left: 4px;}


.subcontainfoot {display: block; position: relative; float: none; clear: both; margin-top: 0px; margin-bottom: 0px; margin-left:auto; margin-right: auto; width: 860px; height: 20px; text-align:right;}     

/* Classes */
.hometext 
{
    font-family: Helvetica, Arial;
    font-size: 0.8em;
    color: #464749;
}

.hometextsmall
{
    font-family: Helvetica, Arial;
    font-size: 0.6em;
    color: #464749;
}

.homehilitetext
{
    font-family: Helvetica, Arial;
    font-size: 1.0em;
    color: #2e89ca;
    font-weight:bold;
}

.titletext 
{
    font-family: Helvetica, Arial;
    font-size: 1.25em;
    color: #2e89ca;
}

.titlehilitetext 
{
    font-family: Helvetica, Arial;
    font-size: 1.0em;
    color: #96a3ab;
    font-weight:bold;
}

.contacttext 
{
    font-family: Helvetica, Arial;
    font-size: 0.8em;
    color: #696666;
}

.contacttextlarge 
{
    font-family: Helvetica, Arial;
    font-size: 1em;
    color: #696666;
}

.contacttextsmall 
{
    font-family: Helvetica, Arial;
    font-size: 0.7em;
    color: #696666;
}

.contacttextsmallbold 
{
    font-family: Helvetica, Arial;
    font-size: 0.7em;
    font-weight:bold;
    color: #696666;
}

.contactlink 
{
    font-family: Helvetica, Arial;
    font-size: 0.9em;
    color: #851819;
}

.contactlinksmall 
{
    font-family: Helvetica, Arial;
    font-size: 0.7em;
    color: #851819;
}

.contactgrp
{
    margin-top: 24px;
    font-family: Helvetica, Arial;
    font-size: 0.8em;
    color: #696666;
}

.contactgrplarge
{
    margin-top: 24px;
    font-family: Helvetica, Arial;
    font-size: 1em;
    color: #696666;
}

.portfoliotitle 
{
    font-family: Helvetica, Arial;
    font-size: 1em;
    color: #851819;
}

.portfoliolink
{
    font-family: Helvetica, Arial;
    font-size: 1em;
    color: #851819;
    text-decoration: none;
}

.portfoliotext 
{
    font-family: Helvetica, Arial;
    font-size: 0.9em;
    color: #696666;
}

.frontnavbutton1 
{
    margin: auto;
    margin-top: auto;
    margin-bottom: auto;
    margin-left: auto;
    margin-right: auto;
}

.frontnavbutton2 
{
    margin: 10px auto auto auto;
    margin-top: 10px;
    margin-bottom: auto;
    margin-left: auto;
    margin-right: auto;
}

.frontnavbutton3 
{
    margin: 10px auto 10px auto;
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: auto;
    margin-right: auto;
}

.footertext 
{
    font-family: Helvetica, Arial;
    font-size: 0.75em;
    color: #ffffff;
}

.footerlink
{
    font-family: Helvetica, Arial;
    color: #ffffff;
    text-decoration: none;
}

.themetextsmall
{
    font-family: Helvetica, Arial;
    font-size: 0.8em;
    color: #ffffff;
}

.themetextmedium
{
    font-family: Helvetica, Arial;
    font-size: 0.9em;
    color: #ffffff;
}

/* Form Table */
.tdlabel { width: 180px; color: #ffffff; font-size: 0.9em; font-weight:bold;}
.tderr { width: 15px; text-align:center; color: #ffff00; font-size: 0.9em; font-weight:bold;}
.tdinput { width: 210px; text-align:right;}
.formerr { color: #ffff00; font-size: 1em; font-weight:bold;}
.forminput {width: 210px; height: 15px; font-family: Helvetica, Arial; font-size: 0.8em; color: #2e89c9; font-weight:bold;}
.forminputbox {width: 210px; height: 45px; font-family: Helvetica, Arial; font-size: 0.6em; color: #2e89c9; font-weight:bold;}

/* Div clearing */
.divclear {clear:both; height:1px;}