﻿/* styles.css
	This document contains elements that are used on specific pages.
*/


/* Invader */
#invader { width: 0px; height: 275px; position: absolute; right: -5px; top: -15px;}
#invader_link { z-index: 1; display:none; width: 0px; height: 275px; top: 0px; left: 0px;}
#invader_close { z-index: 2;display:block; background:#fff; opacity: 0; filter: alpha(opacity=0);position:absolute; top:0px; right: 0px; width: 30px; height: 30px;}


/* 1.0 Homepage */
.pg_homepage #header {position: relative; width: 1050px; height: 220px; background: url(/App_Images/bg_header.gif) no-repeat;}
.pg_homepage #main {}
.pg_homepage #main .slideshow img {position: absolute; left: 83px; top: 193px; height: 240px ; width: 937px;  margin-left: 60px; margin-top:-20px;}

.pg_homepage #trio {border-top: 3px solid #0057a7; float: left; width: 1010px; padding: 50px 20px 20px;}
.pg_homepage #trio .promo { margin-right: 20px; float: left; width: 248px; height: 241px; position: relative; }
.pg_homepage #trio .promo .cover { display: none; z-index: 2; width: 248px; height: 241px; position: absolute; top: 0px; left: 0px; background: url(/App_Images/cover_promo.png) no-repeat; }
.pg_homepage #trio .promo a { background: #fff; opacity: 0; filter: alpha(opacity=0); z-index: 3; position: absolute; top: 0px; left: 0px; width: 248px; height: 241px; display: block; }
.pg_homepage #trio .promo .content { padding: 10px; text-align: center; z-index: 1; position: absolute; top: 0px; left: 0px; width: 228px; height: 201px; display: block; }
.pg_homepage #trio .promo .content span, .pg_homepage #trio .promo .content img { display: inline; }
.pg_homepage #trio .promo .content span {color: #2f6fb7; font-size: 20px; }
.pg_homepage #trio .promo .content img { width: 228px; height: 201px}

.pg_homepage #trio #signup {float: left; width: 200px; margin-top: -20px }
.pg_homepage #trio #signup img {margin-bottom:10px}
.pg_homepage #csm {float: left; border-top: 3px solid #0057a7; width: 910px; padding: 20px 0px 0px 140px}
.pg_homepage #csm img { float: left; margin-left: 40px; padding-right: 10px; margin-bottom: 30px; }
.pg_homepage #csm p { font-size: 20px; line-height: 22px;  padding: 25px;}



/* 2.0 Products */
.pg_products #header {width: 1050px; height: 150px; background: url(/App_Images/bg_header_small.gif) no-repeat;}
.pg_products #main {width: 1050px; padding: 20px; min-height: 300px; padding-bottom: 30px; margin-left: 40px; }
.pg_products #main h1 {margin-bottom: 10px;}
.pg_products #main p {float: left; width: 720px; margin-right: 50px; font-size: 16px;  line-height: 20px;}
.pg_products #main img.float { float: right; margin: 4px; margin-top: -30px;}
.pg_products #main #signup {float: left; width: 200px; height: 190px; }
.pg_products #main #signup img {margin-bottom:10px}
.pg_products #select {float: left; width: 1010px; border-top: 3px solid #0057a7; margin-left: 40px; padding: 10px 0px 20px; }
.pg_products #select h2 {margin-bottom: 10px;}
.pg_products #select ul { line-height: 30px;}
.pg_products #select a {color: #000;}
.pg_products #select a:hover {color: #32c7b6;}
.pg_products #select a.active {color: #32c7b6;}
.pg_products  ul.menu li {float: left; min-width: 120px; margin-right: 60px; background: url(/App_Images/ico_teal_bullet2.gif) no-repeat; background-position: 0px 13px; padding: 10px 0 0 25px; font-size: 22px; margin-bottom: 10px;}
.pg_products  ul.menu li ul.sub li {float: none; margin-right: 0px; background: none;  padding: 10px 0 0 30px; margin-left: -5px; margin-top: 5px; font-size: 20px; margin-bottom: 0px; }

.pg_products #info {width: 630px; float: left; padding: 0px; margin: 15px 40px 0px;}
.pg_products #info h1 { color: #0850a5; font-size: 24px; font-weight: bold; margin-bottom: 10px; } 
.pg_products #info h2 { margin-top: 10px; color: #000000; font-size: 16px; font-weight: bold; padding-bottom: 10px; } 
.pg_products #info h2.q { margin-top: 0px; background: url(/App_Images/title_q.gif) no-repeat; padding-left: 35px; padding-top:5px;}
.pg_products #info p { font-size: 16px; line-height: 20px; padding-bottom: 12px;}
.pg_products #info p.a {background: url(/App_Images/title_a.gif) no-repeat; background-position: 0 8px; padding-left: 35px; padding-top:5px;}

.pg_products #side {float:right; width: 340px}
.pg_products #side h2 {padding-bottom: 5px;}
.pg_products #side p { font-size: 16px; margin-right: 5px; margin-bottom: 5px}
.pg_products #sales {float: left; width: 340px; border-bottom: 2px solid #dfdfdf; padding-top: 15px;}
.pg_products #sales img {margin-left: 30px; margin-bottom: 15px;}
.pg_products #video {float: left; width: 310px; border-bottom: 2px solid #dfdfdf; padding: 15px 0 10px 30px;}
.pg_products #video a.video img  {margin: 3px 2px; border: 1px solid #d3d3d3; padding: 4px;}
.pg_products #image {float: left; width: 310px; padding: 15px 0 5px 30px;}
.pg_products #image a.image img {margin: 3px 2px; border: 1px solid #d3d3d3; padding: 4px; width: 120px; height: 90px}

    
/* 3.0 Services */
.pg_services #header {width: 1050px; height: 150px; background: url(/App_Images/bg_header_small.gif) no-repeat;}
.pg_services #main {width: 1050px; padding: 20px; min-height: 300px; padding-bottom: 30px; margin-left: 40px; }
.pg_services #main h1 {margin-bottom: 10px;}
.pg_services #main p {float: left; width: 700px; margin-right: 70px; font-size: 16px; line-height: 20px;}
.pg_services #main img.float { float: right; margin: 4px; margin-top: -30px;}
.pg_services #main #signup {float: left; width: 200px; height: 190px; }
.pg_services #main #signup img {margin-bottom:10px}
.pg_services #select {float: left; width: 1010px; border-top: 3px solid #0057a7; margin-left: 40px; padding: 10px 0px 20px; }
.pg_services #select h2 {margin-bottom: 10px;}
.pg_services #select ul {line-height: 30px;}
.pg_services #select a {color: #000; line-height: 35px;}
.pg_services #select a:hover {color: #1e26bd;}
.pg_services #select a.active {color: #1e26bd;}
.pg_services  ul.menu li {float: left; min-width: 120px; margin-right: 60px; background: url(/App_Images/ico_blue_bullet2.gif) no-repeat; background-position: 0px 15px; padding: 10px 0 0 25px; font-size: 22px; margin-bottom: 10px;}
 .pg_services table.menu { width: 1010px; margin: 0px}
 .pg_services table.menu td { line-height: 30px;white-space: nowrap; background: url(/App_Images/ico_blue_bullet2.gif) 0px 17px no-repeat; padding: 8px 30px 10px 25px; font-size: 22px;}



.pg_services #info {width: 630px; float: left; padding-top: 0px; margin: 15px 40px 0px;}
.pg_services #info h1 { color: #0850a5; font-size: 24px; font-weight: bold; margin-bottom: 10px; } 
.pg_services #info h2 { margin-top: 10px; color: #000000; font-size: 16px; font-weight: bold; padding-bottom: 10px; } 
.pg_services #info h2.q { margin-top: 0px; background: url(/App_Images/title_q.gif) no-repeat; padding-left: 35px; padding-top:5px;}
.pg_services #info p { font-size: 16px; line-height: 20px; padding-bottom: 12px;}
.pg_services #info p.a {background: url(/App_Images/title_a.gif) no-repeat; background-position: 0 8px; padding-left: 35px; padding-top:5px;}

.pg_services #side {float:right; width: 340px}
.pg_services #side h2 {padding-bottom: 5px;}
.pg_services #side p { font-size: 16px; margin-right: 5px; margin-bottom: 5px}
.pg_services #sales {float: left; width: 340px; border-bottom: 2px solid #dfdfdf; padding-top: 15px;}
.pg_services #sales img {margin-left: 30px; margin-bottom: 15px;}
.pg_services #video {float: left; width: 310px; border-bottom: 2px solid #dfdfdf; padding: 15px 0 10px 30px;}
.pg_services #video a.video img  {margin: 3px 2px; border: 1px solid #d3d3d3; padding: 4px;}
.pg_services #image {float: left; width: 310px; padding: 15px 0 5px 30px;}
.pg_services #image a.image img {margin: 3px 2px; border: 1px solid #d3d3d3; padding: 4px; width: 120px; height: 90px}


/* 4.0 News */
.pg_news #header {width: 1050px; height: 150px; background: url(/App_Images/bg_header_small.gif) no-repeat;}
.pg_news #main {width: 1050px; padding: 20px; min-height: 300px; margin-left: 40px; }
.pg_news #main h1 {margin-bottom: 10px;}
.pg_news #main p {float: left; width: 700px; margin-right: 70px; font-size: 16px; line-height: 20px;}
.pg_news #main img.float { float: right; margin: 4px; margin-top: -40px;}
.pg_news #main #signup {float: left; width: 200px; height: 190px; }
.pg_news #main #signup img {margin-bottom:10px}
.pg_news #news {clear:both; border-top: 3px solid #0057a7;  margin-bottom: 40px; margin-left: 40px; padding-top: 10px; }
.pg_news #news h2 {margin-bottom: 20px;}
.pg_news #news h3 {clear: both; margin-left: 10px; background: url(/App_Images/ico_yellow_bullet.gif) no-repeat; padding: 2px 0px 10px 35px; font-size: 16px; font-weight: bold;}
.pg_news #news p.date {font-size: 12px; margin-top: -10px; margin-bottom: 11px;}
.pg_news #news p {font-size: 16px; line-height: 20px; margin-left: 44px; margin-bottom: 15px; width: 730px;}
.pg_news #news a {color: #7F7F7F; font-size: 16px; text-decoration: underline;}
.pg_news #news a.pdf {background: url(/App_Images/ico_pdf_icon.gif) no-repeat; margin-left: 5px; padding-left: 25px;}
.pg_news #news img.article {float: right; border: 1px solid #b3b3b3; padding: 4px; margin-left: 15px; margin-bottom: 15px}

/* 5.0 Our Company */	
.pg_company #header {width: 1050px; height: 150px; background: url(/App_Images/bg_header_small.gif) no-repeat;}
.pg_company .about_left { float: left; width: 700px; margin-right: 70px; }

.pg_company #main {width: 1050px; padding: 20px;  margin-left: 40px;}
.pg_company #main h1 {margin-bottom: 10px;}
.pg_company #main p {font-size: 16px; line-height: 20px;}
.pg_company #main img.float { float: right; margin: 4px; margin-top: -30px;}

.pg_company #main #signup {float: left; width: 200px; height: 190px; margin-top: 5px }
.pg_company #main #signup img {margin-bottom:10px}

.pg_company #main #about {float: left; width: 320px; margin-top: 20px; margin-right: 50px; }
.pg_company #main #about h2 {margin-bottom: 5px;}
.pg_company #main #about a {color: #7F7F7F; text-decoration: underline;}
.pg_company #main #about p.link {text-align: right;}

.pg_company #main #contact {float: left; width: 320px; margin-top: 20px}
.pg_company #main #contact h2 {margin-bottom: 5px;}
.pg_company #main #contact a {color: #7F7F7F; text-decoration: underline;}
.pg_company #main #contact p.link {text-align: right;}
			

/* 5.1 About Us */
.pg_company_about #header {width: 1050px; height: 150px; background: url(/App_Images/bg_header_small.gif) no-repeat;}
.pg_company_about #main .about_left { float: left; width: 700px; margin-right: 70px; }
.pg_company_about #main .about_left h2 {margin-top: 15px; margin-bottom: 10px; font-size: 16px; color: #000; font-weight: bold;}
.pg_company_about #main .about_left ul { line-height: 30px; color: #7F7F7F;}
.pg_company_about #main .about_left ul li {background: url(/App_Images/ico_red_bullet.gif) no-repeat; font-size: 16px; padding-left: 33px; text-indent: 0px; padding-bottom: 10px;}
.pg_company_about #main {width: 1050px; padding: 20px; margin-left: 40px; }
.pg_company_about #main h1 {margin-bottom: 10px;}
.pg_company_about #main p { font-size: 16px; line-height: 20px;}
.pg_company_about #main img.float { float: right; margin: 4px; margin-top: -30px;}
.pg_company_about #main #signup {float: left; width: 200px; height: 190px; margin-top: 5px}
.pg_company_about #main #signup img {margin-bottom:10px}


/* 5.2 Contact Us */
.pg_company_contact #header {width: 1050px; height: 150px; background: url(/App_Images/bg_header_small.gif) no-repeat;}
.pg_company_contact #main {width: 1050px; padding: 20px; margin-left: 40px;}
.pg_company_contact #main h1 {margin-bottom: 10px;}
.pg_company_contact #main a {color: #7F7F7F; text-decoration: underline;}
.pg_company_contact #main ul {float: left; width: 700px; margin-right: 70px; font-size: 16px; color: #7F7F7F; line-height: 20px;}
.pg_company_contact #main #left {float: left; width: 360px;}
.pg_company_contact #main #right {float: left; width: 360px;}
.pg_company_contact  ul.normal li {background: url(/App_Images/ico_red_bullet.gif) no-repeat; width: 320px; font-size: 16px; padding-left: 25px; padding-bottom: 10px;  }
.pg_company_contact  ul.indent li {background: url(/App_Images/ico_red_bullet.gif) no-repeat; width: 320px; font-size: 16px; padding-left: 90px; padding-bottom: 10px; text-indent: -65px;}
.pg_company_contact #main #signup {float: left; margin-left: 50px; width: 200px; height: 190px; }
.pg_company_contact #main #signup img {margin-bottom:10px}


.pg_company_contact #form {float: left; width: 700px; font-size:16px; margin-top:-50px; margin-left: 60px;}
.pg_company_contact #form h2 {margin-bottom: 20px;}
.pg_company_contact #form hr {width: 270px; margin-left: 390px; margin-top: -8px; height: 3px; color: #dfdfdf; background-color: #dfdfdf; border: none;}
.pg_company_contact  #form .row {clear: both; float: left; width: 650px; margin-bottom: 9px; line-height: 22px; color: #7F7F7F;}
	.pg_company_contact #form .txt, .pg_company_contact #form .txtarea {font: normal 16px arial; float: left; color: #7F7F7F; width: 260px; height: 20px; margin-left: 8px; background: #eaeaea; border: 1px solid #b1b1b1; padding: 4px}
	.pg_company_contact  #form .txtarea { margin-left: 0px; height: 100px; width: 650px; color: #7F7F7F; background: #eaeaea; border: 1px solid #b1b1b1;}
	.pg_company_contact  #form .select { padding: 2px 0px 4px 4px; height: 24px}
	.pg_company_contact  #form .lbl {padding-top: 6px; float: left; width: 130px;}
	.pg_company_contact  img.button {float: right; margin-top: 9px; margin-right: -3px;}
    .pg_company_contact #form #error, .pg_company_contact #form .successmsg{ width: 425px; float: left; color: #000; margin-top: 10px; margin-bottom: 10px; display: none; text-align: center; padding: 5px; }
    .pg_company_contact #form #error span { font-size: 11px; display: block;  text-align: center; padding: 2px 0px}
    .pg_company_contact #form #error { border: 1px solid #B63803; background: #CFBDB5; }
    .pg_company_contact #form .successmsg { color: #fff; min-height: 18px; line-height: 18px; background: #B73803; border: 1px solid #B73803; }
    



/* Overlay Signup Forms */
.pg_signup a.cancel {position: absolute; top: 0px; right: 10px; margin-top: 9px; color: #7F7F7F; }
    .pg_signup a.cancel:hover {color: #CF8740; }
.pg_signup { width: 437px; padding: 20px; background: #fff; font: normal 16px arial; color: #000; }
.pg_signup h1 {margin-bottom: 15px; }
.pg_signup p {margin-top: 10px; margin-bottom: 10px;}
.pg_signup #form {position: relative; }
.pg_signup  #form .row {clear: both; float: left; width: 537px; margin-bottom: 9px; line-height: 22px; color: #000;}
	.pg_signup #form .txt, .pg_signup #form .txtarea {font: normal 16px arial; float: left; color: #000; width: 260px; height: 20px; margin-left: 8px; background: #eaeaea; border: 1px solid #b1b1b1; padding: 4px}
	.pg_signup  #form .txtarea { margin-left: 0px; height: 100px; width: 650px; color: #000; background: #eaeaea; border: 1px solid #b1b1b1;}
	.pg_signup  #form .select { padding: 2px 0px 4px 4px; height: 24px}
	.pg_signup  #form .lbl {padding-top: 6px; float: left; width: 130px;}
	.pg_signup  img.button {float: right; margin-top: 9px; }
    .pg_signup #form #error, .pg_signup #form .successmsg{ width: 380px; float: left; color: #000; margin-top: 10px; margin-bottom: 10px; display: none; text-align: center; padding: 5px; }
    .pg_signup #form #error span { font-size: 11px; display: block;  text-align: center; padding: 2px 0px}
    .pg_signup #form #error { border: 1px solid #B63803; background: #CFBDB5; }
    .pg_signup #form .successmsg { color: #fff; min-height: 18px; line-height: 18px; background: #0850A5; border: 1px solid #0850A5; }
	
	.pg_signup #form.demo .successmsg { background: #11A37B; border: 1px solid #11A37B; }
	.pg_signup #form.enews .successmsg { background: #75640A; border: 1px solid #75640A; }
