@charset "utf-8";
/* CSS Document */

/*<<<<<<<<<<<<<<<<<<< STANDARD ELEMENTS >>>>>>>>>>>>>>>>>>>>>>>>*/
body
{
margin: 0;
padding: 0;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
background: url(images/bgBody.jpg) left top repeat-x;
background-color: #dceaf5;
}

a
{
text-decoration: none;
color: black;
}

h1
{
font-size: 22px;
font-weight: normal;
margin: 0;
padding: 0;
color: #003366;
}

h2
{
font-size: 16px;
color: #003366;
font-weight: normal;
clear: both;
}

h3
{
margin: 0;
padding: 0;
font-size: 12px;
font-weight: bold;
color: #036;
}

p
{
line-height: 15px;
}

/*<<<<<<<<<<<<<<<<<<< MAIN CONTAINER >>>>>>>>>>>>>>>>>>>>>>>>*/
#mainContainer
{
display: block;
width: 758px;
height: auto;
margin: 0 auto;
border-left: 2px solid #CCC;
border-right: 2px solid #CCC;
}

/*<<<<<<<<<<<<<<<<<<< HEADER CONTAINER >>>>>>>>>>>>>>>>>>>>>>>>*/

#headerContainer
{
width: 758px;
height: 80px;
background: url(images/imgLogo.jpg) no-repeat left top #F2F9FF;
padding-bottom: 10px;
border-bottom: 1px solid #CCC;
}

#headerContainer .logo
{
float: left;
}

/*<<<<<<<<<<<<<<<<<<< FLASH CONTAINER >>>>>>>>>>>>>>>>>>>>>>>>*/
#flashContainer
{
width: 758px;
height: auto;
}

/*<<<<<<<<<<<<<<<<<<< MAIN NAVIGATION >>>>>>>>>>>>>>>>>>>>>>>>*/

#mainNav
{
display: block;
width: 460px;
height: 37px;
float: right;
margin-right: 10px;
}

#mainNav .home
{
float: left;
display: block;
width: 75px;
height: 37px;
background: url(images/homeOff.gif) no-repeat left top;
cursor: pointer;
}

#mainNav .company
{
float: left;
display: block;
width: 75px;
height: 37px;
background: url(images/companyOff.gif) no-repeat left top;
cursor: pointer;
}

#mainNav .product
{
float: left;
display: block;
width: 75px;
height: 37px;
background: url(images/productOff.gif) no-repeat left top;
cursor: pointer;
}

#mainNav .support
{
float: left;
display: block;
width: 75px;
height: 37px;
background: url(images/supportOff.gif) no-repeat left top;
cursor: pointer;
}

#mainNav .faq
{
float: left;
display: block;
width: 75px;
height: 37px;
background: url(images/faqOff.gif) no-repeat left top;
cursor: pointer;
}

#mainNav .contact
{
float: left;
display: block;
width: 75px;
height: 37px;
background: url(images/contactOff.gif) no-repeat left top;
cursor: pointer;
}


#mainNav .home:hover
{background: url(images/homeOn.gif) no-repeat left top;}

#mainNav .company:hover
{background: url(images/companyOn.gif) no-repeat left top;}

#mainNav .product:hover
{background: url(images/productOn.gif) no-repeat left top;}

#mainNav .faq:hover
{background: url(images/faqOn.gif) no-repeat left top;}

#mainNav .contact:hover
{background: url(images/contactOn.gif) no-repeat left top;}

#mainNav .support:hover
{background: url(images/supportOn.gif) no-repeat left top;}

/*<<<<<<<<<<<<<<<<<<< SUB NAVIGATION >>>>>>>>>>>>>>>>>>>>>>>>*/

#subnav
{
display: block;
width: 100px;
height: 150px;
padding-left: 20px;
padding-right: 20px;
padding-top: 1px;
}

#subnav .item
{
margin-bottom: 10px;
}

#subnav .item2
{
margin-bottom: 10px;
margin-left: 10px;
}

#subnav #active a
{
font-weight: bold;
color: #036;
}

/*<<<<<<<<<<<<<<<<<<< FLASH CONTAINER >>>>>>>>>>>>>>>>>>>>>>>>*/

#flashContainer
{
width: 758px;
}

/*<<<<<<<<<<<<<<<<<<< CONTENT CONTAINER >>>>>>>>>>>>>>>>>>>>>>>>*/

#contentContainer
{
width: 100%;
height: auto;
padding-top: 20px;
background-color: white;
/*background: url(images/bgContent.jpg) no-repeat right bottom;*/
background-color: white;
min-height: 250px;
/*padding-bottom: 70px;*/
}

#contentContainerText
{
display: block;
overflow: visible;
width: 550px;
height: auto%;
min-height: 230px;
margin-left: 140px;
padding-left: 20px;
margin-top: -170px;
padding-bottom: 20px;
padding-top: 20px;
border-left: 1px solid #CCC;
}

#contentContainerText .breadcrumb
{
width: 600px;
height: 16px;
background-color: #efefef;
border-bottom: 1px solid #CCC;
color: #999;
margin-top: -20px;
margin-left: -19px;
padding-left: 15px;
margin-bottom: 20px;
line-height: 16px;
}

#contentContainerText .breadcrumb a
{
color: #666;
font-style: italic;
margin: 0 5px;
}

/*<<<<<<<<<<<<<<<<<<< LOGIN CONTAINER >>>>>>>>>>>>>>>>>>>>>>>>*/
#loginContainer
{
width: 180px;
height: 196px;
background: url(images/bgLogin.jpg) no-repeat left top;
margin-left: 15px;
margin-right: 25px;
float: left;
margin-top: 5px;
padding-bottom: 50px;
}

#loginContainer form
{
margin-top: 50px;
}

#loginContainer form input
{
width: 120px;
margin-left: 23px;
margin-bottom: 10px;
font-size: 11px;
padding: 3px;
color: #BBB;
border: 1px solid #999;
}

#loginContainer form input:hover
{
cursor: text;
}

#loginContainer form .submit
{
margin-left: 15px;
width: 146px;
height: 25px;
background: url(images/bgSubmitOff.jpg) no-repeat left top;
border: 0;
background-color: white;
cursor: pointer;
}

#loginContainer form .submit:hover
{
background: url(images/bgSubmitOn.jpg) no-repeat left top;
border: 0;
cursor: pointer;
}

#loginContainer form .submit input
{
border: 0;
background-color: transparent;
cursor: hand;
cursor: pointer;
}

#ErrorString
{
margin-left: 25px;
}

/*<<<<<<<<<<<<<<<<<<< DIFFERENT PARAGRAPHS >>>>>>>>>>>>>>>>>>>>>>>>*/
.homeP
{
width: auto;
height: auto;
margin-right: 20px;
}

#faq input
{
background: none;
border: 0;
text-align: left;
margin: 0;
padding: 0;
display: block;
width: 550px;
height: 30px;
cursor: pointer;
padding-left: 22px;
background: url(images/arrowUp.gif) no-repeat left center;
}

#faq p
{
border-left: 2px solid #036;
padding-left: 10px;
}

.feature
{
display: block;
width: 550px;
height: 22px;
padding-left: 24px;
background: url(images/bulletFeature.gif) no-repeat left top;
}

.bullet
{
width: 550px;
height: auto;
min-height: 20px;
padding-left: 24px;
background: url(images/bulletFeature.gif) no-repeat left top;
margin-bottom: 10px;
}

.supportInfo
{
border: 1px solid #999;
background-color: #efefef;
padding: 10px;
width: 250px;
height: auto;
float: right;
margin-top: -105px;
}

/*<<<<<<<<<<<<<<<<<<< DIFFERENT IMAGES >>>>>>>>>>>>>>>>>>>>>>>>*/

.imgHomePara
{
float: left;
margin-right: 20px;
margin-bottom: 25px;
display: block;
width: 114px;
height: 152px;
background: url(images/imgHome.jpg) no-repeat left top;
border: 1px solid #DDD;
margin-top: 20px;
}

.btnAccessibility
{
text-align: center;
width: 91px;
height: 41px;
display: block;
background: url(images/btnAccessibility.jpg) no-repeat left top;
cursor: pointer;
float: right;
}

.btnAccessibility:hover
{
margin-top: 3px;
}

.btnFlexability
{
text-align: center;
width: 92px;
height: 41px;
display: block;
background: url(images/btnFlexability.jpg) no-repeat left top;
cursor: pointer;
float: right;
}

.btnFlexability:hover
{
margin-top: 3px;
}

.btnIntegration
{
text-align: center;
width: 93px;
height: 41px;
display: block;
background: url(images/btnIntegration.jpg) no-repeat left top;
cursor: pointer;
float: right;
}

.btnIntegration:hover
{
margin-top: 3px;
}

.btnSecurity
{
text-align: center;
width: 91px;
height: 41px;
display: block;
background: url(images/btnSecurity.jpg) no-repeat left top;
cursor: pointer;
float: right;
}

.btnSecurity:hover
{
margin-top: 3px;
}

.btnQualities
{
display: block;
width: 367px;
height: 41px;
float: right;
}

.w3c
{
display: block;
position: relative;
left: 292px;
top: 40px;
}

.w3c img
{
border: 0;
}

.contactImage
{
float: right;
margin-top: 20px;
}


/*<<<<<<<<<<<<<<<<<<< FOOTER >>>>>>>>>>>>>>>>>>>>>>>>*/
#footer
{
clear: both;
width: 762px;
height: 71px;
margin: 0 auto;
background: url(images/bgFooter.jpg) left top no-repeat;
padding-bottom: 10px;
}

#footer .links
{
padding-top: 27px;
margin-left: 20px;
color: #DDD;
}

#footer .links a
{
margin-left: 10px;
margin-right: 10px;
color: #666;
font-size: 10px;
}

#footer .links a:hover
{
color: black;
}

#footer .copyright
{
float: right;
margin-top: 27px;
margin-right: 20px;
color: #666;
font-size: 10px;
}