@charset "UTF-8";
/* CSS Document */


/* Construction elements ------------------------------------------------------ */

html {font-size:100%;
}

html, body{
	text-align: center;
	margin: 0px;
	padding: 0px;
	background-image:url(../images/page_bg.jpg);
	background-repeat:repeat-x;
	background-color:#978981;
	height: 100%;
}

/* BODY */
/* the following is only for the body tag. Whatever percent you put in there will end up being below. based on normal sizing being 16px */
/* font-size: 100%; equivalent to 16px */
/* font-size: 87.5%; equivalent to 14px */
/* font-size: 75%; equivalent to 12px */
/* font-size: 69%; equivalent to 11px */
/* font-size: 62.5%; equivalent to 10px */

body {
	font-family:Arial, Helvetica, sans-serif;
	/* This sets the default font size to be 14px .75 x 16 = 12 */
	font-size:75%;
	/* This sets the line height to a baseline grid of 16px */
	line-height:1.3em;
	color:#000;
}

/* Text Formatting  ------------------------------------------------------ */
/* .75em = 9px; */
/* .83em = 10px; */
/* .916em = 11px; */
/* 1em = 12px; */
/* 1.16em = 14px; */
/* 1.3em = 16px; */
/* 1.5em = 18px; */

/* TEXT ELEMENTS, H1-H6 AND SOME OTHER TEXT STUFF */
p {margin-top:0;}
h1 {
font-size:1.286em;
padding:3px 0 2px 6px;
margin:0 0 8px 0;
font-weight:bold;
line-height:normal;
color:#004192;
text-transform:uppercase;
background:url(../images/h1_bg.gif) repeat-x bottom left;
}
h2 {
margin:0;
padding:0 0 5px 0;
font-family:Arial Black, Arial, Helvetica, sans-serif;
font-size:.916em;
font-weight:normal;
color:#004192;
text-transform:uppercase;
}
h3 {
margin:0;
padding:0;
font-size:1.5em;
line-height:2em;
font-weight:normal;
}
h4 {
	margin:10px 0 0 0;
}
h5 {}
h6 {}
.small {
font-size:.83em;
line-height:1.2em;
color:#4d4d4d;
}

.noarrow {
background:none!important;
text-align:left!important;
padding-top:5px;
}

ul.linkList {
margin:0;
padding:0;
list-style-type:none;
}
ul.linkList li {
background:url(../images/arrow_small.png) no-repeat 2px 3px;
padding:0 0 0 15px;
}

a {text-decoration:none;outline:none;}
a:link {color:#3d9ac4;}
a:visited {color:#3d9ac4;}
a:hover {color:#0055A4;cursor:pointer;}
a:active {color:#3d9ac4;}

.larger {
	font-size:1.3em;
	line-height:1.3em;
}

#products .larger {
	font-size:1.1em!important;
}

.compareLink {
font-size:.75em;
font-weight:bold;
text-transform:uppercase;
}
.compareLink a {
background:url(../images/arrow_small.gif) no-repeat left center;
padding:0 0 0 8px;
float:right;
display:inline;
}

ul {list-style:none;}

hr {height:1px;border:none;line-height:1px;border-top:1px solid #CCCCCC;}

/* FORMS ------------------------------------------------------ */
form {padding:0; margin:0;}
#form {
color:#4a5b6b;
font-size:.916em;
}
input#formField {width:120px;}
input#formButton {
border:none;
background:url(../images/arrow_medium.gif) no-repeat center;
cursor:pointer;
}

/* Products Page ------------------------------------------------------ */
#productsBoxMain {
background:url(../images/productsBoxBg.jpg) no-repeat top left;
width:664px;
height:126px;
padding:0 36px;
}
#productsBoxMain a {
width:166px;
height:126px;
float:left;
display:inline;
}
#productsBox{
width:166px;
height:126px;
}
#printStart{
background:url(../images/prodbox_printers.jpg) no-repeat top left;
}
#inkStart {
	background:url(../images/prodbox_inks.jpg) no-repeat top left;
}
#deliveryStart{
	background:url(../images/prodbox_inkdeliv.jpg) no-repeat top left;
}
#taperStart {
	background:url(../images/prodbox_casetapers.jpg) no-repeat top left;
}

#productsBoxMain a:hover {
background-position: 0 -252px !important;
}

#productsBoxMain .printOn, #productsBoxMain a:hover.printOn, #productsBoxMain .inkOn, #productsBoxMain a:hover.inkOn, #productsBoxMain .deliveryOn, #productsBoxMain a:hover.deliveryOn, #productsBoxMain .taperOn, #productsBoxMain a:hover.taperOn {
background-position: 0 -126px !important;
position:static;
}

#prodDisplay{
margin:10px 0;
}

.indent {
margin:15px 0 0 10px;
}

/* MAIN CONTAINERS ------------------------------------------------------ */
#mainContainer {
margin:0px auto;
width:936px;
padding:0 12px 6px 12px;
background:url(../images/maincontainer_bg.gif) repeat-y top left;
}
#main {
margin:0px auto;
text-align:left;
padding:0;
}

#pgBottom {
width:958px;
border-top:4px solid #342f2c;
height:4px;
margin:0px auto;
margin-bottom:60px;
}

/* BRANDING BAR ------------------------------------------------------ */
#squidBrandingBar {
height:67px;
background:#fff url(../images/header_bg.jpg) repeat-x;
}
.squidLogo {
float:left;
width:356px;
height:67px;
background:url(../images/header_logo.jpg) no-repeat top left;
}
.brandingBarLinks {
float:right;
width:350px;
font-size:.783em;
color:#000;
padding:10px 0 0 0;
}
.brandingBarLinks a {text-transform:uppercase; font-weight:bold;}
#brandingBarSearch {float:left; padding:8px 10px 0 10px;}
#brandingBarSearch input#searchFormField {width:120px; font-size:1em; color:#4a5b6b;}
input#searchButton {border:none; background:url(../images/arrow_medium.gif) no-repeat center; cursor:pointer;}
#brandingBarAsia, #brandingBarMexico, #brandingBarLogin {
float:left;
padding:10px 10px 0 10px;
border-left:1px solid #8c857a;
}
#brandingBarMexico {background:url(../images/header_mexicoflag.gif) no-repeat top center;}
#brandingBarAsia {background:url(../images/header_chinaflag.gif) no-repeat top center;}

.brandingBarLinks.noFlags {
	width:auto;
}

/* NAVIGATION ------------------------------------------------------ */

#mainNav {width:936px;}

/* LEFT NAVIGATION */
ul#leftNav {
margin:0;
padding:3px 5px 15px 0;
list-style:none;
}
#leftNav li {
margin:0 0 2px 0;
padding:0;

background:url(../images/left_nav_bar_left.gif) no-repeat top left;
}
#leftNav a {
background:url(../images/arrow_small.png) no-repeat 10px center;
display:block;
height:20px;
line-height:16px;
}
ul#leftNav a:hover {
color:#4d4d4d;
cursor:pointer;
}
ul#leftNav span {
display:block;
background:url(../images/left_nav_bar_right.gif) no-repeat top right;
height:21px;
padding:3px 0 0 20px;
}
ul#leftNav li.current {
background:url(../images/left_nav_bar_left_on.gif) no-repeat top left;
}
ul#leftNav li.current a {
color: #fff;
}
ul#leftNav li.current span {
background:url(../images/left_nav_bar_right_on.gif) no-repeat top right;
}
ul#leftNav li.subnav {
background:none;
}
/* LEFT SUB NAVIGATION */
ul#leftSubNav {
margin:0 0 10px 0;
padding:4px 0 5px 10px;
background:none;
color:#000;
list-style:none;
border-bottom:1px solid #ccc;
min-height:1px;
}
ul#leftSubNav li {
margin:0;
padding:3px 0;
background:none;
}
ul#leftSubNav a {
background:none;
display:block;
padding-left:5px;
color:#3d9ac4;
height:auto;
}
ul#leftSubNav a:visited, ul#leftSubNav a:link, ul#leftSubNav li a, #leftCol ul#leftNav ul#leftSubNav a {
color:#3d9ac4;
}
ul#leftSubNav li a:hover, ul#leftSubNav a:hover, #leftCol ul#leftNav ul#leftSubNav li:hover a, #leftCol ul#leftNav ul#leftSubNav li a:hover {
color:#0055A4;
}

/* HOMEPAGE ELEMENTS ------------------------------------------------------ */
/* HOMEPAGE HERO ELEMENTS */
.homePageHero { 
overflow:auto;
background:#fff url(../images/homehero_bg.jpg) repeat-x bottom;
border-bottom:1px solid #3d9ac4;
font-size:1.1em;
margin:0px;
padding:0px;
color:#4d4d4d;
height: auto !important; height: 1%;
}
.homePageHero img {
float:left;
display:inline;
border:1px solid #fff;
margin:0 15px 5px 5px;
}
.homePageHero h1 {
font-size:1.3em;
font-weight:bold;
margin:10px 0 0 0;
padding:0;
color:#004192;
background:none;
text-transform:none;
line-height:inherit;
}
.homePageHero a {
background:url(../images/arrow_small.png) no-repeat 0 center;
padding:0 0 0 10px;
font-size:.875em;
margin:0;
}
.homePageHero p {
margin:5px 0 10px 0;
padding:0;
}

/* HOMEPAGE PRODUCT BAR */
#homeProductBar {
height:101px;
margin:5px 0 10px 0;
padding:0 0 5px 6px;
border-bottom:5px solid #3d9ac4;
clear:both;
}
#homeProductPrinters, #homeProductInks, #homeProductInkDelivery, #homeProductCaseTaper {
float:left;
width:229px;
height:101px;
margin-right:3px;
}
#homeProductPrinters {background:url(../images/homelink_inkdelivery.gif) no-repeat top left;}
#homeProductInks {background:url(../images/homelink_inks.gif) no-repeat top left;}
#homeProductInkDelivery {background:url(../images/homelink_printers.gif) no-repeat top left;}
#homeProductCaseTaper {background:url(../images/homelink_casetaper.gif) no-repeat top left;}
#homeProductBar a:hover #homeProductPrinters {background:url(../images/homelink_inkdelivery_on.gif) no-repeat top left; cursor:pointer;}
#homeProductBar a:hover #homeProductInks {background:url(../images/homelink_inks_on.gif) no-repeat top left; cursor:pointer;}
#homeProductBar a:hover #homeProductInkDelivery {background:url(../images/homelink_printers_on.gif) no-repeat top left; cursor:pointer;}
#homeProductBar a:hover #homeProductCaseTaper {background:url(../images/homelink_casetaper_on.gif) no-repeat top left; cursor:pointer;}
.homeProductLinks {
font-size:1.16em;
font-weight:bold;
text-transform:uppercase;
}
.homeProductLinks span {
display:block;
width:120px;
background:url(../images/arrow_large.gif) no-repeat 0 .03cm; 
margin:35px 0 0 90px; 
padding:0 0 0 12px;
}

/* HOMEPAGE MISC */
#homeMain{
	float:left;
	display:inline;
	width:570px;
}
#homeRightCol{
	float:right;
	display:inline;
	width:163px;
	margin:0 0 0 10px;
}
.homePg2Col{
	background:url(../images/vert_gray_line_hp.gif) repeat-y 4.65cm 0!important;
}

/* SITEWIDE COLUMN SETUP - NOT USED ON HOMEPAGE ------------------------------------------------------ */
/* MAIN CONTENT AREA ------------------------------------------------------ */

#lowerContainer {
width:936px;
margin:10px 0 10px 0;
background:url(../images/vert_gray_line.gif) repeat-y 4.65cm 0;
background-color:#ffffff;
overflow:hidden;
}

#mainContentArea {
margin:20px 0 10px 0;
background-color:#fff;
padding:0;
}

#mainContent {
float:left;
display:inline;
width:750px;
margin:5px 0px 0 8px;
padding:0;
color:#000;
font-size:1.1em;
overflow:hidden;
}

#leftCol {
float:left;
display:inline;
width:169px;
margin:0 6px 0 3px;
padding:0;
}

.rightColBox {
margin:10px 0 15px 0;
padding:0 0 15px 0;
border-bottom:1px solid #ccc !important;
}

.rightColBox h2, .rightColBox ul {
padding-left:5px;
}
.rightColBox p, .rightColBox form {
padding:0 0 0 10px;
margin:0;
}

#rightCol {
width:234px;
float:left;
display:inline;
margin:-8px 0 0 8px;
padding:4px 0 30px 0;
background:url(../images/right_col_bg.png) no-repeat .02cm bottom;
}
#rightColTop {
background:url(../images/right_col_top.png) no-repeat 3px 0;
margin:-16px 0 -17px 0;
height:17px;
position:relative;
}
#rightColContent {
margin:-24px 0 0 0;
padding:4px 8px 0 12px;
position:relative;
}

/* SIDE BOXES ------------------------------------------------------ */
#sideBoxBG {
width:163px;
background:url(../images/sidebox_bottom.gif) no-repeat bottom left;
margin-bottom:10px;
}
#sideBoxContent {
background:url(../images/sidebox_top.gif) no-repeat top left;
padding:8px 0 20px 10px;
}

#sideBoxContent div a{background:none;display:inline;}

#thumbsUp {
float:left;
width:74px;
height:71px;
margin:0 0 5px 0;
}
#selectorTitle {
float:left;
width:74px;
margin-left:-7px;
}
#sideBoxContent .selectorTxt {
margin:80px 0 0 0;
color:#666;
}
#sideBoxContent a {
display:block;
width:140px;
text-align:right;
background:url(../images/arrow_small.png) no-repeat 2.1cm center;
}
#sideBoxContent img {margin-left:-8px;}

/* PRODUCT PAGE ELEMENTS ------------------------------------------------------ */
#productsMain {
float:left;
display:inline;
width:508px;
margin:0;
padding:0;
color:#4d4d4d;
font-size:94%;
}
.productsMainContent ul {
list-style-type:disc;
}
.productsMainContent p {

}
.mainParagraph {
margin:10px 0 10px 0;
padding:0 0 10px 0;
font-size:110%!important;
border-bottom:1px solid #cccccc;
}

/* GRAY BOX ON PRODUCT DESCRIPTION PAGES */
#grayBoxBG {
background:url(../images/graybox_bottom.gif) no-repeat bottom left;
margin:0 0 0 9px;
width:224px;
}
#grayBoxContent {
background:url(../images/graybox_top.png) no-repeat top left;
margin-bottom:10px;;
}
#grayBoxContent h2 {
padding:5px 0 5px 7px;
}
#grayBoxContent .small {
font-size:.83em;
font-family:Arial Black, Arial, Helvetica, sans-serif;
text-transform:uppercase;
margin:10px 0 5px 7px;
clear:left;
}
#grayBoxContent .relatedImgs {
float:left;
display:inline;
margin:0 0 7px 7px;
}
#grayBoxContent .relatedImgs img {
border:3px solid #fff;
}

/* ADMIN STUFF ------------------------------------------------------ */

.admin, .adminfooter {
	background:#FFFFFF!important;
	border:1px solid #007EAF!important;
	padding:5px!important;;
}
.admin a {
	display:inline!important;
	background:none!important;
	border:none!important;
	margin:0!important;
	padding:0!important;
}
.adminfooter {
	text-align:center;
}
/* just a goofy way to clear floated elements without a nested tage */
.admin:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

/* for IE \*/
.admin {height: 1%;}


/* FOOTER ------------------------------------------------------ */
.roundbox{
background:url(../images/bluerounded.gif) no-repeat top left;
margin:0;
padding:0 10px 0 10px;
height:18px;
line-height:18px;
color:#fff;
}
#footer {
height:18px;
line-height:18px;
color:#fff;
background-color:#3d9ac4;
margin:10px 0 0 0;
clear:both;
}
.copyright {
float:left;
font-size:.786em;
padding:0 0 0 10px;
}
.footernav {
float:right;
font-size:.786em;
text-transform:uppercase;
text-align:right;
padding:0 10px 0 0;
color:#fff;
}
.footernav a:link, .footernav a:visited {
color:#fff;
text-decoration:none;
}
.footernav a:hover, .footernav a:active {
color:#fff;
text-decoration:underline;
}
.clearme:after {
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}
.clearme {}
/* hide from ie mac if anyone on the planet still uses it \*/
* html .clearme {height:1%};
.clearme {display:block};
/* end */
