﻿@charset "UTF-8";
/* CSS Document */

body  {
	font: 100% Lucida Grande, Verdana, Arial, sans-serif;
	background: #666666;
	margin: 0px;
	padding: 0px;
	text-align: center;
	color: #000000;
}
#container { 
	background-color: #ffffff; 
	background: #ffffff url("http://www.canvassystems.com/shared/images/centerBg.gif") repeat-x bottom; 
	width: 980px;
	margin: 0px auto;
	text-align: left; 
	border-left: 1px solid #000000; 
	border-right: 1px solid #000000;
} 

/* header */

#header { 
	background: #ffffff; 
	padding: 0px 1px 0px 1px;
} 
#logo { 
	float: left;
	padding-bottom: 8px;
}

/* inventorySearch */

#inventorySearch { 
	float: right;
	width: 700px;
}
#inventorySearch #inventoryTopBar {	
	width: 700px;
	height: 6px;
	font-size: 0px;
	background: #cacac8 url("../images/searchCorner.gif") no-repeat top left; 
}
#inventorySearch #inventorySearchCurves {
	float: right;
	width: 34px;
	height: 58px;
	background: url("../images/searchCurves.gif") no-repeat top left; 
}
#inventorySearch #inventorySearchForm {
	padding: 0px 0px 0px 20px;
	float: right;
	width: 280px;
	height: 58px;
	background: url("../images/searchBg.gif") repeat-x; 
}
#inventorySearch #inventorySearchForm p {
	font-size: 11px; 
	font-family: Lucida Grande, Verdana, Arial, sans-serif;
	font-weight: bold;
	padding: 0px 0px 3px 0px;
	margin: 0px;
}
#inventorySearch #inventorySearchForm #search {
	float: left;
	width: 190px;
	height: 12px;
	border: 1px solid #000;
	padding: 3px;
	margin: 0px 5px 0px 0px;
	font-size: 10px; 
	font-family: Lucida Grande, Verdana, Arial, sans-serif;
}
#inventorySearch #inventorySearchForm #submit {
	float: left;
	padding: 0px;
	margin: 0px;
	vertical-align: bottom;
}
#inventorySearch #inventorySearchForm #inventorySearchOptions {
	clear: both;
	padding: 0px;
	margin: 0px;
}
#inventorySearch #inventorySearchForm .radioBtn {
	float: left;
	padding: 0px;
	margin: 0px 3px 0px 3px;
}
#inventorySearch #inventorySearchForm label {
	float: left;
	font-size: 9px; 
	font-family: Lucida Grande, Verdana, Arial, sans-serif;
	padding: 4px 3px 0px 0px;
	margin: 0px;
}


/* quickLinks */

#quickLinks ul { 
	list-style: none;
	padding: 0px;
	margin: 0px 0px 0px 0px;
	float: right;
	clear: right;
	position: relative;
	top: 78px;
}
#quickLinks li { 
	float: left;
	padding: 0px 5px 0px 5px;
}
#quickLinks li.home { 
	background: url("../images/quicklinkHome.gif") no-repeat 0px -1px;
}
#quickLinks li.itlm { 
	background: url("../images/quicklinkITLM.gif") no-repeat 0px -1px;
}
#quickLinks li.careers { 
	background: url("../images/quicklinkCareers.gif") no-repeat 0px -1px;
}
#quickLinks li.contact { 
	background: url("../images/quicklinkContact.gif") no-repeat 0px -1px;
}
#quickLinks li a { 
	color: black;
	font-size: 11px; 
	font-family: Lucida Grande, Verdana, Arial, sans-serif;
	text-decoration: none; 
	padding: 0px 10px 0px 10px;
}
#quickLinks li a:hover { 
	text-decoration: underline;
}

/* primaryNav */

#primaryNav { 
	clear: both;
	height: 37px;
}
#primaryNav ul { 
	list-style: none;
	padding: 0px;
	margin: 0px;
}
#primaryNav li {
	float: left;
}
#primaryNav li a { 
	width: 121px; 
	height: 19px;
	display: block;
	padding-top: 18px;
	background: url("../images/primaryTab.gif") no-repeat; 
	color: white; 
	font-size: 11px; 
	font-family: Lucida Grande, Verdana, Arial, sans-serif;
	text-decoration: none; 
	text-align: center;
}
#primaryNav li a:hover {  
	background: url("../images/primaryTabHover.gif") no-repeat;
	font-weight: bold;
	text-decoration: underline;
}
#primaryNav li a.active, #primaryNav li a.active:hover { 
	background: url("../images/primaryTabOn.gif") no-repeat; 
	font-size: 13px;
	font-weight: bold;
}


/* secondaryNav */

#secondaryNav { 
	background: url("../images/secondaryNavElement.gif") no-repeat top right; 
	height: 38px;
	clear: both;
}
#secondaryNav ul { 
	list-style: none;
	padding: 0px 0px 0px 15px;
	margin: 0px;
}
#secondaryNav li { 
	float: left;
}
#secondaryNav li a { 
	display: block;
	color: white; 
	font-size: 11px; 
	font-family: Lucida Grande, Verdana, Arial, sans-serif;
	text-decoration: none; 
	text-align: center; 
	padding: 7px 15px 0px 15px;
}
#secondaryNav li a:hover {
	text-decoration: underline; 
}
#secondaryNav li a.active, #secondaryNav li a.active:hover {
	background: url("../images/secondaryNavTab.gif") no-repeat;
	background-position: bottom;
	color: black;
	font-weight: bold;
	width: 110px;
	height: 25px;
	padding: 8px 5px 0px 5px;
	margin: 0px 15px 0px 15px;
}


/* triNav */

#leftNav .triNav a {
	display: block;
	padding: 8px 0px 8px 25px;
	color: #000080;
	font-size: 11px; 
	font-family: Lucida Grande, Verdana, Arial, sans-serif;
	font-weight: bold;
	text-decoration: none;
}
#leftNav .triNav a:hover {
	color: #e66100;
	text-decoration: underline;
}
#leftNav .triNavOn a.on {
	padding: 8px 0px 8px 25px;
	text-decoration: none;
	color: #e66100;
	display: block;
	font-weight: bold;
}
#leftNav .triNavOn a.on:hover {
	text-decoration: underline;
}
.triNav {
	background: url("../images/tertiaryExpand.gif") no-repeat 5px 10px;
}
.triNavOn {
	background: url("../images/tertiaryCollapse.gif") no-repeat 5px 10px;
}

/* quadNav */

#leftNav .quadNav a {
	padding: 5px 0px 5px 40px;
	text-decoration: none;
	color: #000080;
	display: block;
}
#leftNav .quadNav a:hover {
	color: #e66100;
	text-decoration: underline;
}
#leftNav .quadNavOn a.on {
	padding: 4px 0px 4px 40px;
	text-decoration: none;
	font-weight: bold;
	color: #ffffff;
	display: block;
}
#leftNav .quadNavOn a.on:hover {
	text-decoration: underline;
}
.quadNav {
	background: url("../images/quaternaryInactive.gif") no-repeat 25px 4px;
}
.quadNavOn {
	margin: 0px 0px 0px 0px;
	background: url("../images/quaternaryActive.gif") no-repeat 25px 4px;
	background-color: #e66100;
	border-top: 1px solid #9e9e9e;
	border-bottom: 1px solid #9e9e9e;
}

/* relatedLinks */

#relatedLinks {
	background-color: #dee0cf;
	border-top: 1px solid #a4a4a4; 
	border-bottom: 1px solid #a4a4a4; 
	margin: 8px 0px 0px 0px;
	padding: 4px 0px 6px 0px;
	width: 160px; 
	font: 11px Lucida Grande, Verdana, Arial, sans-serif;
}
#relatedLinks h3 {
	padding: 5px 0px 0px 8px;
	margin: 0px;
	font: 12px Lucida Grande, Verdana, Arial, sans-serif;
	font-weight: bold;
}
#relatedLinks ul {
	list-style-type: none;
	padding: 3px 0px 0px 10px;
	margin: 0px;
}
#relatedLinks li {
	padding: 3px 3px 3px 14px;
	background: url("../images/relatedBullet.gif") no-repeat 0px 7px;
}
#relatedLinks a {
	color: #000000;
	text-decoration: none;
}
#relatedLinks a:hover {
	color: #e66100;
	text-decoration: underline;
}

/* containers */

#mainContainer { 
	float: left;
	padding: 0px;
	margin: 0px;
	background: url("../images/mainContainerBg.gif") repeat-x bottom;
}
#leftNav {
	float: left;
	width: 160px;
	padding: 0px;
	font-size: 11px; 
	font-family: Lucida Grande, Verdana, Arial, sans-serif;
}
#bodyContainerThrCol { 
	float: left;
	width: 646px;
	padding: 0px;
	margin: 0px;
}
#bodyContainerTwoCol { 
	float: left;
	width: 800px;
	margin: 0 0 0 3px;
	padding: 0px;
}
#rightRail {
	float: right;
	width: 173px;
	margin: 0px;
}


/* twoColBox */

#twoColBox, #twoColBox_body, #twoColBox_head, #twoColBox_head h2 {
	background: transparent url("../images/boxTwoCol.png") no-repeat bottom right;
}
#twoColBox { /* intended total box width - padding-right(next) */
	width: 785px !important; /* IE Win = width - padding */
	width: 785px; /* the gap on the right edge of the image (not content padding) */
	padding-right: 15px; /* use to position the box */
	margin: 0px auto;
} /* set the top-right image */
#twoColBox_head {
	background-position: top right; /* pull the right image over on top of border */
	margin-right: -15px; /* right-image-gap + right-inside padding */
	padding-right: 40px;
} /* set the top-left image */
#twoColBox_head h2 {
	background-position:top left;
	margin: 0; /* reset main site styles*/
	border: 0; /* ditto */ /* padding-left = image gap + interior padding ... no padding-right */
	padding: 5px 0px 0px 15px;
	height: auto !important;
	height: 1%;
	font-size: 0px; /* ie */
} /* IE Holly Hack */ /* set the lower-left corner image */
#twoColBox_body {
	background-position: bottom left;
	margin-right: 25px; /* interior-padding right */
	padding: 1px 0px 5px 15px;
	position: relative;
} /* mirror #twoColBox_head right/left */


/* thrColBox */

#thrColBox, #thrColBox_body, #thrColBox_head, #thrColBox_head h2 {
	background: transparent url("../images/boxThrCol.png") no-repeat bottom right;
}
#thrColBox { /* intended total box width - padding-right(next) */
	width: 630px !important; /* IE Win = width - padding */
	width: 630px; /* the gap on the right edge of the image (not content padding) */
	padding-right: 15px; /* use to position the box */
	margin: 0px auto;
} /* set the top-right image */
#thrColBox_head {
	background-position: top right; /* pull the right image over on top of border */
	margin-right: -15px; /* right-image-gap + right-inside padding */
	padding-right: 40px;
} /* set the top-left image */
#thrColBox_head h2 {
	background-position:top left;
	margin: 0px; /* reset main site styles*/
	border: 0px; /* ditto */ /* padding-left = image gap + interior padding ... no padding-right */
	padding: 5px 0px 0px 15px;
	height: auto !important;
	height: 1%;
	font-size: 0px; /* ie */
} /* IE Holly Hack */ /* set the lower-left corner image */
#thrColBox_body {
	background-position: bottom left;
	margin-right: 15px; /* interior-padding right */
	padding: 1px 0px 5px 15px;
	position: relative;
} /* mirror #thrColBox_head right/left */

/* rightRail elements - contactBox */

#contactBox {
	margin: 0px 0px 0px 4px;
}
#contactBoxHeader {
	background: url("../images/contactBoxHeader.gif") no-repeat right;
	height: 77px; 
	margin: 0px;
	width: 164px;
}
#contactBoxHeader span {
	display: none;
}
#contactBox a {
	margin-left: 45px; 
	padding-top: 7px;
	color: black;
	text-decoration: none;
	display: block;
	font-size: 11px; 
	font-family: Lucida Grande, Verdana, Arial, sans-serif;
}
#contactBox a:hover {
	color: #e66100;
	text-decoration: underline;
}
#contactBoxPhone {
	background: url("../images/contactBoxPhone.gif") no-repeat left;
	height: 26px;
	width: 164px;
}
#contactBoxChat {
	background: url("../images/contactBoxChat.jpg") no-repeat left;
	height: 27px; 
	width: 164px;
	display:none;
}
#contactBoxQuote {
	background: url("../images/contactBoxQuote.gif") no-repeat left;
	height: 31px; 
	width: 164px;
}

/* rightrailBox */

#rightRailBoxes {
	width: 164px;
	margin: 0px 0px 0px 4px;
}
.rightRailBox {
	z-index: 5;
	margin: 5px 0px 5px 0px;
	background-image:url("../images/rightrailBottom.gif");
	background-position: left bottom;
	background-repeat: no-repeat;
}
.rightRailBox h1 {
	z-index: 10;
	padding: 8px 10px 8px 10px;
	margin: 0px;
	background: url("../images/rightrailTop.gif") top no-repeat;
	font-size: 12px; 
	font-weight: bold;
	color: #ffffff;
	font-family: Lucida Grande, Verdana, Arial, sans-serif;
}
.rightRailBox .rightRailContent {
	padding: 10px;
	margin: 0px;
}
.rightRailBox .rightRailContent img {
	float: left;
	margin: 3px 8px 7px 0px;
	border: 0px;
}
.rightRailBox .rightRailContent p {
	font-size: 10px; 
	color: #000000;
	font-family: Lucida Grande, Verdana, Arial, sans-serif;
	margin: 0px 0px 10px 0px;
	padding: 0px;
	vertical-align: top;
}
.rightRailBox .rightRailContent a {
	color: #000000;
	text-decoration: none;
}
.rightRailBox .rightRailContent a:hover {
	color: #e66100;
	text-decoration: underline;
}
.rightRailBox .rightRailContent a.button {
	display: block;
	text-align: center;
	background: url("../images/buttonBg.jpg") repeat-x;
	border: 1px solid #000080;
	padding: 5px;
	font-size: 11px; 
	color: #000080;
	text-decoration: none;
	font-family: Lucida Grande, Verdana, Arial, sans-serif;
}
.rightRailBox .rightRailContent a.button:hover {
	color: #e66100;
	text-decoration: underline;
}
.rightRailBox blockquote {
	margin: 0px;
	background: transparent url("../images/quoteOpen_small.png") left top no-repeat;
	font: 0.8em Lucida Grande, Verdana, Arial, sans-serif;
	width: 145px;
}
.rightRailBox blockquote div {
	text-align: center;
	padding: 0px 20px 0px 20px;
	background: transparent url("../images/quoteClose_small.png") right bottom no-repeat;
}

/* quickNav */

#quickNav {
	float: left;
	width: 805px;
	padding: 0px;
	margin: 0px 0px 0px 0px;
}
#quickNav #quickNavHero {
	float: right;
	margin: 0px 0px 1px 0px;
	font-size: 0px;
}
#quickNav #quickNavContainer {
	float: right;
	padding: 0px;
	margin: 0px 0px 5px 0px;
}

/* quickNavElement - container*/

#quickNav .quickNavElement {
	float: left;
	width: 159px;
	height: 289px;
	margin: 0px 0px 0px 1px;
	display: block;
	background: url("../images/quicknavOff.gif") repeat-x;
	font-size: 0px;
}
#quickNav .quickNavElement:hover {
	background: url("../images/quicknavOn.gif") repeat-x;
	display: block;
}
.quickNavElementOn { /* ie sucks! */
	float: left;
	width: 159px;
	height: 289px;
	margin: 0px 0px 0px 1px;
	display: block;
	background: url("../images/quicknavOn.gif") repeat-x;
	font-size: 0px;
}

/* quickNavElementHome - container */

#quickNav .quickNavElementHome {
	float: left;
	width: 266px;
	height: 289px;
	margin: 0px 0px 0px 1px;
	display: block;
	background: url("../images/quicknavOff.gif") repeat-x;
	font-size: 0px;
}
#quickNav .quickNavElementHome:hover {
	background: url("../images/quicknavOn.gif") repeat-x;
	display: block;
}
.quickNavElementHomeOn { /* ie sucks! */
	float: left;
	width: 266px;
	height: 289px;
	margin: 0px 0px 0px 1px;
	display: block;
	background: url("../images/quicknavOn.gif") repeat-x;
	font-size: 0px;
}

/* quickNav - text styles */

#quickNav h3 {
/*	border: 1px solid #c00; */
	width: inherit;
	margin: 0px;
	padding: 0px;
	display: table;
	height: 40px;
	overflow: hidden;
	text-align: center;
	white-space: nowrap;
}
#quickNav h3 a {
/*	border: 1px solid #00c;	*/
	display: table-cell;
	vertical-align: middle;
	font-size: 14px; 
	font-family: Lucida Grande, Verdana, Arial, sans-serif;
	padding: 0px;
	margin: 0px;
	color: #ffffff;
	text-decoration: none;
}
#quickNav a:hover h3:hover {
	text-decoration: underline;
}
#quickNav ul {
/*	border: 1px solid #00c; */
	margin: 20px 0px 0px 0px;
	padding: 0px 20px 0px 20px;
	font-size: 13px; 
	font-family: Lucida Grande, Verdana, Arial, sans-serif;
	list-style-type: none;
}
#quickNav li {
	margin: 0px 0px 0px 0px;
	padding: 5px 0px 5px 15px;
	background: url("../images/quicknavArrowOff.gif") no-repeat 0px 10px;
}
#quickNav li:hover {
	background: url("../images/quicknavArrowOn.gif") no-repeat 0px 10px;
}
#quickNav li a {
	display: block;
	color: #000080;
	text-decoration: none;
}
#quickNav li a:hover {
	color: #e66100;
	text-decoration: underline;
}


/* footer */

#footer { 
	padding: 0px 10px 0px 20px;
	background: #000000;
} 
#footer p {
	margin: 0px;
	padding: 10px 0px;
	color: #ffffff;
	text-align: center;
	font-size: 11px; 
	font-family: Lucida Grande, Verdana, Arial, sans-serif;
	line-height: 14px;	
}
#footer a {
	text-decoration: underline;
	color: #ffffff;
}
#footer a:hover {
	color: #e66100;
}

/* others */

#flashCanvasValues {
	float: right;
	padding: 0px;
	margin: 5px 0px 5px 0px;
}
.fltrt { 
	float: right;
	margin-left: 8px;
}
.fltlft {
	float: left;
	margin-right: 8px;
}
.clearfloat {
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
    position: relative;
}
.nospace {
	margin:0;
	padding:0;
}