﻿* {margin:0; padding:0;}

body { background:#fff; font:0.9em Trebuchet MS; color:#000; }
#container { background:#fff url(images/bodybg.jpg) repeat-x; color:#000; text-align:left; border:3px solid Gray; }

/*General Settings*/
a {	font-weight:bold; text-decoration:underline; color:#8B0000; font-style:italic; }
a:hover { font-weight:bold; text-decoration:underline; color:#000;  font-style:italic; }
p { line-height:1.5em; margin:0 0 15px; text-align:justify; }
i { color:#8B0000; font-style:italic; font-weight:bold; }
.csscolor { color:#8B0000; }

/*Header Section*/
#header { font-size:0.8em; font-weight:bold; color:#000; height:120px; margin-bottom:5px;  }
#header img { float:left; }

/*Top Menus*/
#topNav { float:left; margin-bottom:10px; }
#topNav ul { margin:0; padding:0; list-style:none; }
#topNav ul li { float:left; margin:0; padding:0; }
#topNav ul li a { border-left:1px solid #B0B0B0; color:#000; font-size:0.9em; padding:0px 10px 0px 6px; text-transform:uppercase; text-decoration:none; font-style:normal; font-weight:bold; }
#topNav ul li a:hover { color:#8B0000; text-decoration:underline; font-weight:bold; }
#topNav ul li a img { vertical-align:text-top; border-style:none; padding-right:2px; }

#topNav ul li span { float:left; line-height:10px; padding:8px 0 8px 0; position:absolute; display:none; background:#fff; }
#topNav ul li:hover span { display:block; border:1px solid #000; }
#topNav ul li span a { border-left:none; color:#000; display:block; font-size:0.8em; text-transform:uppercase; text-decoration:none; font-style:normal; font-weight:bold; }
#topNav ul li span a:hover { color:#8B0000; text-decoration:underline; font-weight:bold; }
#topNav ul li span a img { vertical-align:text-bottom; border-style:none; padding-right:2px; }

#topMenu { float:none; margin-bottom:20px; height:22px; background:#000; line-height:22px; color:#fff; }
#topMenu ul { margin:0; padding:0; list-style:none; }
#topMenu ul li { float:left; margin:0; padding:0; }
#topMenu ul li a { border-left:1px solid #B0B0B0; color:#fff; font-size:0.8em; padding:0px 4px 0px 4px; text-transform:uppercase; text-decoration:none; font-style:normal; font-weight:bold; }
#topMenu ul li a:hover { color:Gray; text-decoration:underline; font-weight:bold; }
#topMenu ul li a img { vertical-align:text-top; border-style:none; padding-right:2px; }

#topMenu ul li span { float:left; line-height:10px; padding:8px 0 8px 0; position:absolute; display:none; background:Silver; }
#topMenu ul li:hover span { display:block; border:1px solid #000; }
#topMenu ul li span a { border-left:none; color:#000; display:block; font-size:0.8em; text-transform:uppercase; text-decoration:none; font-style:normal; font-weight:bold; }
#topMenu ul li span a:hover { color:#8B0000; text-decoration:underline; font-weight:bold; }
#topMenu ul li span a img { vertical-align:text-bottom; border-style:none; padding-right:2px; }

.divClear { clear:both; }
.divClearHeight { clear:both; height:15px; }
.divClearRight { clear:right; height:15px; }
.divClearLeft { clear:left; height:15px; }

#wrapper { margin:0 auto; padding:0; font-size:0.9em; }

/*Side Bar Options*/
#sideBar { margin:0 5px 5px 5px; padding:0; width:190px; background-color:#fff; float:left; }
#sideBar h1 { margin:0; padding:5px 5px 5px 5px; font-size:0.9em; font-weight:bold; color:#fff; background:#8B0000; letter-spacing:1px; text-transform:uppercase; }
#sideBar p { font-size:1.0em; line-height:1.0em; text-align:left; padding:5px; }
#sideBar .box  { margin:0 0 5px 0; border:1px solid #000; background:#fff; }
#sideBar .box p { font-size:0.9em; line-height:1.0em; text-align:left; padding:0 0 0 5px; }

#sideBar ul { list-style:none; text-align:left; margin:3px 0 6px 0; padding:0; text-decoration:none; }
#sideBar ul li { padding:5px 5px 5px 4px; margin:0; text-align:left; }
#sideBar ul li a { color:#000; padding:0; background:none; text-decoration:none; font-style:normal; font-size:0.9em; }
#sideBar ul li a:hover { color:#8B0000; text-decoration:none; font-style:normal; }
#sideBar img { vertical-align:text-bottom; border-style:none; padding-right:2px; }

/*Main Contents*/
#content { background-color:#fff; color:#000; padding:0; margin:0 5px 0 210px; }
#content h1 { color:#fff; font-size:1.2em; font-weight:bold; margin-bottom:22px; letter-spacing:1px; padding:2px 5px 3px 5px; text-transform:uppercase; background:#8B0000; border:1px solid #000; }
#content h2 { color:#8B0000; font-size:1.0em; font-weight:bold; margin-bottom:10px;letter-spacing:1px; padding:0 5px 0 5px; text-transform:uppercase; border-bottom:5px solid Gray; }
#content p { text-align:justify; padding:0 5px 0 5px; }
#content img { border:1px solid #bababa; padding:1px; vertical-align:middle; }
#content ul { list-style-type:square; }
#content ul li { margin:0 0 5px 40px; text-align:justify; }

.rightPhoto { margin:10px 0px 0px 10px; background:#fff; border:1px solid #bababa; padding:0px; float:right; }
.leftPhoto { margin:10px 10px 0px 0px; background:#fff; border:1px solid #bababa; padding:0px; float:left; }

#footer { clear:both; color:#8B0000; font-size:0.8em; font-weight:bold; line-height:1.5em; margin:0 auto; padding:15px 0 0 0; text-align:center; width:100%; }

.nav { text-align:left; background:#000; border:1px solid #000; color:#fff; display:block; margin-bottom:15px; padding:5px 5px 5px 5px; position:relative; text-transform:uppercase; width:178px; text-decoration:none; font-style:normal; }
.nav:hover { text-align:left; background:Gray; border:1px solid #000; color:#fff; text-decoration:none; font-style:normal; }

.modalBackground { background-color:Silver; filter:alpha(opacity=50); opacity:0.8; }
.modalPopup { background-color:#EBE4DA; border-width:3px; border-style:solid; border-color:Gray; width:250px; }
.modalPopup h1 { font-size:1.2em; font-weight:bold; padding:5px; }
.modalPopup p { padding:5px; }

.divMain { float:left; padding:5px; width:100%; }
.divLeft { float:left; padding:5px; }
.divRight { float:right; padding:5px; }
.divCenter { float:left; padding:5px; width:48%; }
.divImg { float:left; width:33%; padding:20px 0px 20px 0px; }
.divExh { float:left; width:23%; padding:5px; }
.divDisLeft { float:left; width:400px; padding:5px; }
.divDisRight { float:left; width:165px; padding:5px; }
.divProd { float:left; width:33%; height:350px; }

.points { padding:5px 5px 5px 20px; }
.quotes { padding:5px 10px 10px 20px; }

ol { padding-left:28px;  }
ol li { list-style-type:decimal; font-size:1.2em; font-weight:bold; padding-bottom:10px; }
ol li ol { padding:10px 0 0 25px; }
ol li ol li { padding-bottom:10px; list-style-type:lower-roman; font-size:0.9em; text-align:justify; font-weight:normal; }
ol li ol li ol { padding:10px 0 0 30px; }
ol li ol li ol li { padding-bottom:5px; list-style-type:lower-alpha; font-size:0.8em; text-align:justify; font-weight:normal; color:#8B0000; }

.usage { float:left; width:24%; font-style:italic; color:#8B0000; padding:20px 3px 20px 3px; }
.usage1 { float:left; width:33%; font-style:italic; color:#8B0000; padding:20px 0px 20px 0px; }

ul li { padding-bottom:8px; }

/*Red Rounded Box*/
.hd .c, .dialog .ft .c {height:8px;}
.ft .c {height:14px;}
.hd {background:transparent url('images/rounded/tl.gif') no-repeat 0px 0px;}
.hd .c {background:transparent url('images/rounded/tr.gif') no-repeat right 0px;}
.bd {background:transparent url('images/rounded/ml.gif') repeat-y 0px 0px;}
.bd .c {background:transparent url('images/rounded/mr.gif') repeat-y right 0px;}
.bd .c .s {margin:0px 8px 0px 4px; background:#8B0000 url('images/rounded/ms.jpg') repeat-x 0px 0px; padding:1em; text-align:justify; color:#fff; font-style:italic;}
.ft {background:transparent url('images/rounded/bl.gif') no-repeat 0px 0px;}
.ft .c {background:transparent url('images/rounded/br.gif') no-repeat right 0px;}

/*Stats Bar Graph*/
#WebGraph, #ProdGraph, #SoftGraph {	height:160px; position:relative; }
#WebGraph ul li, #ProdGraph ul li, #SoftGraph ul li { position:absolute; width:30px; bottom:5px; text-align:center; color:White; }
#WebGraph li.Exc, #ProdGraph li.Exc, #SoftGraph li.Exc { left:-15px; background-color:#8B0000; }
#WebGraph li.Good, #ProdGraph li.Good, #SoftGraph li.Good { left:73px; background-color:#006600; }
#WebGraph li.Avg, #ProdGraph li.Avg, #SoftGraph li.Avg { left:137px; background-color:#0000FF; }
#WebGraph li.Fair, #ProdGraph li.Fair, #SoftGraph li.Fair { left:193px; background-color:#B0966F; }
#WebGraph li.Poor, #ProdGraph li.Poor, #SoftGraph li.Poor {	left:250px; background-color:#9D9D9D; }

/*Technical Data*/
.tech a { text-decoration:underline; color:#000; font-style:italic; }
.tech a:hover { text-decoration:underline; color:#8B0000; font-style:italic; }

.techHead { float:left; width:33%; padding-top:5px; padding-bottom:20px; font-size:125%; font-style:italic; color:#8B0000; font-weight:bold; }
.techRow { float:left; width:33%; line-height:3.0em; padding-bottom:5px; }

/*Black Box*/
.bbox { background:Black; border:5px Double Silver; color:#fff; font-size:1.0em; font-style:italic; font-weight:bold; width:420px; text-align:justify; padding:25px; margin:25px; }
.bbox a { color:#f0f0f0; }

/*Products Contents*/
#PContents { padding:0px 10px 10px; margin:0 10px 0 300px; }
#PContents h1 { color:#8B0000; font-size:1.6em; font-weight:bold; letter-spacing:-1px; margin:5px 0 5px; padding:0; }
#PContents img { border:1px solid Black; padding:1px; vertical-align:middle; }

/*CRM Settings*/
#CRMLeft { margin:0; padding:0; width:200px; float:left; }
#CRMContent { padding:10px 10px 10px; margin:0 5px 0 215px; }

.lm { text-align:left; vertical-align:middle; padding:2px; }
.lt { text-align:left; vertical-align:top; padding:2px; }
.cm { text-align:center; vertical-align:middle; padding:2px;	}
.ct { text-align:center; vertical-align:top; padding:2px; }
.rm { text-align:right; vertical-align:middle; padding:2px; }
.rt { text-align:right; vertical-align:top; padding:2px; }

.tableStyle { border-color:Black; border-style:solid; border-width:thin; background-color:#ffffcc; }
.infoTable { border-color:Black; border-style:solid; border-width:thin; width:100%;	}
.infoRow { text-align:left; vertical-align:middle; font-weight:bold; height:20px; background-color:#000; color:#fff; padding:4px; }
.infoHeader { text-align:center; vertical-align:middle; font-weight:bold; height:30px; background-color:#EBE4DA; }
.trSettings { text-align:left; vertical-align:middle; background-color:#8B0000; height:30px; color:White; font-weight:bold; }

.divDesc { float:left; width:66%; }

.prodImg { border:1px solid Black; padding:1px; width:168px; height:142px; background-color:#fff; }

.medium { font-size:medium; }
.small { font-size:small; }
.smaller { font-size:12px; }

#leftAdjust { float:left; margin:0 10px 10px 10px; padding:0; width:280px; }
#leftAdjust h1 { color:#8B0000; font-size:1.5em; font-weight:bold; letter-spacing:-1px; margin:0 0px 10px; }
#leftAdjust p { font-size:0.9em; line-height:1.2em; margin:0 0 15px 0; text-align:justify; }

/*Bar Graph*/
#q-graph {position: relative; width: 700px; height: 370px; margin: 0; padding: 0; font: 10px Trebuchet MS;}
#q-graph tr, #q-graph th, #q-graph td { position: absolute; bottom: 0; width: 55px; z-index: 2; margin: 0; padding: 0; text-align: center;}
#q-graph thead tr {left: 100%; top: 50%; bottom: auto; margin: -2.5em 0 0 5em;}
#q-graph thead th {width: 1.0em; padding: 0.5em 1em;}
#q-graph thead th.prev {top: 0; left: 0; background: tan repeat-x; border: 1px solid;}
#q-graph thead th.sel {top: 7.00em; left: 0; background: green repeat-x; border: 1px solid;}

#q-graph tbody tr {height: 200px; padding-top: 2px; color: black;}
/*For Plotting Months*/
#q-graph #q1 {left: 0;}
#q-graph #q2 {left: 58px;}
#q-graph #q3 {left: 116px;}
#q-graph #q4 {left: 174px;}
#q-graph #q5 {left: 232px;}
#q-graph #q6 {left: 290px;}
#q-graph #q7 {left: 348px;}
#q-graph #q8 {left: 406px;}
#q-graph #q9 {left: 464px;}
#q-graph #q10 {left: 522px;}
#q-graph #q11 {left: 580px;}
#q-graph #q12 {left: 638px;}

#q-graph tbody th {top: 0.75em; vertical-align: top;}
#q-graph .bar {width: 25px; border: 1px solid; border-bottom: none; color: #000;}
#q-graph .bar p {margin: 5px 0 0; padding: 0;}

#q-graph .prev {left: 5px; background: tan repeat-x; color:Black;}
#q-graph .sel {left: 32px; background: green repeat-x; color:White;}

#ticks {position: relative; top: -359px; left: 0px; width: 700px; height: 370px; z-index: 1; margin-bottom: -350px; font: 10px Trebuchet MS;}
#ticks .tick {position: relative; border-bottom: 1px solid silver; width: 700px;}
#ticks .tick p {position: absolute; left: 100%; top: -0.67em; margin: 0 0 0 0.5em;}

/*For Plotting Days*/
#q-graph .day {left: 5px; background: tan repeat-x; color:Black;}
#q-graph .bar1 {width: 20px; border: 1px solid; border-bottom: none; color: #000;}
#q-graph .bar1 p {margin: 5px 0 0; padding: 0;}
/*-----------------------------------------------------------------------------------------------------------------*/