/* General settings, zeroing */
html {
	border: none;
	margin: 0;
	padding: 0;
	background: none;
	height: 100%;
}
body {
	color: #333;
	margin: 0;
	padding: 0;
	font-family: Georgia, serif;
	height: 100%;
}
input:focus, 
select:focus, 
textarea:focus, 
button:focus { 
	outline: none; 
}
a:-webkit-any-link { 
	text-decoration: none;
}
body a:link, body a:visited {
	color: #0099ff;
}
body a:hover {
	color: #0066ff;
}

h2 {
	font-family: ff-super-grotesk-web, "SuperGroteskA-Med", sans-serif;
	font-size: 16px;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 2px;
	color: #aaa;
}
h3 {
	font-family: ff-super-grotesk-web, "SuperGroteskA-Med", sans-serif;
	font-size: 22px;
	line-height: 32px;
	text-decoration: none;
	text-transform: none;
	letter-spacing: 0.3px;
	color: #0099ff;
	margin-top: 20px;
}
h4 {
	font-family: ff-super-grotesk-web, "SuperGroteskA-Med", sans-serif;
	font-size: 22px;
	line-height: 28px;
	text-decoration: none;
	text-transform: none;
	letter-spacing: 0.3px;
	color: #333;
	margin-top: 40px;
	margin-bottom: 0;
}

/* Full-width yellow bar and narrower header */
div#yellowBar {
	width: auto;
	height: 180px;
	background: #ffff00;
	margin: 0;
	padding: 16px 0 0 0;
}
div#yellowBarStore {
	width: auto;
	height: 144px;
	background: #ffff00;
	margin: 0;
	padding: 52px 0 0 0;
}
div#header {
	width: 940px;
	margin: auto;
	font-family: Arial, sans-serif;
}

/* Logo */
a#logo {
	display: block;
	position: relative;
	clear: both;
	margin: auto;
	width: 320px;
	height: 99px;
	background-image: url("/17pix/assets/logo.png");
	background-size: 100% 100%;
	background-repeat: no-repeat;
}

/* Topmost nav links, left and right */
ul#topLeft, 
ul#topRight {
	margin: 0;
	padding: 0;
	font-size: 12px;
	letter-spacing: 0.5px;
	color: #a1a566;
}
ul#topLeft a:link, 
ul#topRight a:link, 
ul#topLeft a:visited, 
ul#topRight a:visited {
	text-decoration: none;
	color: #a1a566;
}
ul#topLeft a:hover, 
ul#topRight a:hover {
	text-decoration: none;
	color: #000;
}
ul#topRight a.freeShipping:link, 
ul#topRight a.freeShipping:visited {
	color: #0099ff;
	font-size: 90%;
	text-transform: uppercase;
	font-weight: bold;
}
ul#topRight a.freeShipping:hover {
	color: #000;
	font-weight: bold;
}
ul#topLeft li, 
ul#topRight li {
	display: inline;
}
ul#topLeft li:before, 
ul#topRight li:before {
	content: "|";
	margin: 0 8px 0 4px;
}
ul#topLeft li:first-child:before, 
ul#topRight li:first-child:before {
	content: "";
	margin: 0;
}
ul#topLeft {
	position: relative;
	clear: right;
	float: left;
}
ul#topRight {
	position: relative;
	clear: right;
	float: right;
}

/* Search module */
form#search {
	position: relative;
	float: left;
	width: 210px;
	height: 26px;
	background: none;
	border: 1px solid #b1b37a;
	border-radius: 100px;
	overflow: hidden;
	margin-top: 7px;
}
form#search input[type=image] {
	display: block;
	float: left;
	clear: right;
	padding: 2px 0 5px 3px;
	margin: 0;
	border: none;
	width: 20px;
	height: 20px;
}
form#search input[type=text] {
	display: block;
	float: left;
	clear: right;
	padding: 0;
	margin: 4px 0 4px 15px;
	border: none;
	font: 16px Arial, sans-serif;
	color: #a1a566;
	letter-spacing: 0.5px;
	background: transparent;
	width: 160px;
	height: auto;
}
form#search #search_dropdown {
	background: rgba(161, 165, 102, 0.2);
	display: block;
	position: absolute;
	right: 0;
	top: 0;
	padding: 0 4px 0 8px;
	width: auto;
	height: 34px;
}
form#search select {
	font: 12px Arial, sans-serif;
	color: #808352;
	letter-spacing: 0.8px;
	padding: 6px 0 0 0;
	margin: 0 4px 0 0;
	background: transparent;
	border: 0;
	-webkit-appearance: none; 
	-moz-appearance: none;
	appearance: none;   
}

/* Social media buttons */
ul#socialButtons {
	margin: 8px 0 0 0;
	padding: 0;
	position: relative;
	clear: right;
	float: right;
}
ul#socialButtons li { display: inline; margin-left: 6px; }
ul#socialButtons li a:link img, ul#socialButtons li a:visited img {
	opacity: 0.35;
}
ul#socialButtons li a:hover img {
	opacity: 1;
}

/* Secondary nav links below yellowBar */
div.bodyNavHolder {
	background: #fff;
	width: 100%;
	padding: 20px 0 0 0;
	margin: 0;
	height: 40px;
	z-index: 9999;
}
ul.bodyNav {
	width: 940px;
	margin: 0 auto 0 auto;
	padding: 0;
	background: none;
	text-align: center;
}
ul.bodyNav a:link, 
ul.bodyNav a:visited, 
ul.bodyNav a:hover {
	font-family: ff-super-grotesk-web, "SuperGroteskA-Med", sans-serif;
	font-size: 18px;
	text-transform: lowercase;
	text-decoration: none;
	letter-spacing: 0.5px;
}
ul.bodyNav a:link, 
ul.bodyNav a:visited { 
	color: #777; 
}
ul.bodyNav a:hover { 
	color: #0099ff; 
}
ul.bodyNav li { 
	display: inline-block; 
	position: relative;
	margin: 0 30px 0 0; 
	background: none; 
}
ul.bodyNav li:last-child { 
	margin: 0; 
}
.dropdown {
    cursor: pointer;
    cursor: hand;
}
.dropdown {
    position: relative;
    display: inline-block;
}
.dropdown-content {
    display: none;
    position: absolute;
	left: -12px;
    background-color: #fff;
    width: auto;
	white-space: nowrap;
    /*box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);*/
}
div.dropdown-content a:link, 
div.dropdown-content a:visited, 
div.dropdown-content a:hover {
    display: block;
    padding: 4px 12px 4px 12px;
    text-decoration: none;
	text-align: left;
	font: bold 12px Arial, sans-serif;
	text-transform: none;
}
div.dropdown-content a:first-child {
	padding-top: 20px;
}
div.dropdown-content a:last-child {
	padding-bottom: 12px;
}
div.dropdown-content a:link, 
div.dropdown-content a:visited {
}
div.dropdown-content a:hover {
}
.dropdown-content a:hover {background-color: #fff}
.dropdown:hover .dropdown-content {
    display: block;
	z-index: 9998;
}
.dropdown:hover .dropdown {
    background-color: #3e8e41;
}



/* Page wrapper - for footerBar1 and footerBar2 */
.pageWrapper {
	width: 100%;
	min-height: 100%;
	margin-bottom: -466px;
	background: #fff;
}
.pageWrapper:after {
	content: "";
	display: block;
	height: 466px;
}


/* Page wrapper - for just footerBar1 */
.pageWrapperSimple {
	width: 100%;
	min-height: 100%;
	margin-bottom: -146px;
	background: #fff;
}
.pageWrapperSimple:after {
	content: "";
	display: block;
	height: 146px;
}



/* Body wrapper */
div#bodyWrapper {
	width: 940px;
	margin: auto;
	height: 100%;
}



/* Footer wrapper used inside both footers */
.footer {
	width: 940px;
	margin: auto;
	font-family: Arial, sans-serif;
}

/* First footer - light gray with heading */
div#footerBar1 {
	display: block;
	position: relative;
	clear: both;
	width: auto;
	height: 114px;
	background: #ccc;
	margin: 0;
	padding: 16px 0 16px 0;
	text-align: center;
}
div#footerBar1 h1 {
	font-family: ff-super-grotesk-web, "SuperGroteskA-Med", sans-serif;
	font-size: 18px;
	display: block;
	margin: 10px 0 16px 0;
	font-weight: normal;
}
div#footerBar1 p {
	font-family: Arial, sans-serif;
	font-size: 12px;
	color: #777;
}
div#footerBar1 p a:link, div#footerBar1 p a:visited {
	text-decoration: none;
	color: #0066ff;
}
div#footerBar1 p a:hover {
	text-decoration: none;
	color: #333;
}
ul#socialButtonsFooter {
	margin: 8px 0 0 0;
	padding: 0;
	position: relative;
}
ul#socialButtonsFooter li { display: inline; margin-left: 6px; }
ul#socialButtonsFooter li a:link img, ul#socialButtonsFooter li a:visited img {
	opacity: 0.35;
}
ul#socialButtonsFooter li a:hover img {
	opacity: 1;
}

/* Second footer - dark gray with columns */
div#footerBar2 {
	display: block;
	position: relative;
	clear: both;
	width: auto;
	height: 300px;
	background: #555;
	margin: 0;
	padding: 20px 0 0 0;
}
div#footerBar2 p {
	font-family: Arial, sans-serif;
	font-size: 12px;
	line-height: 18px;
	letter-spacing: 0.5px;
	color: #ccc;
}
div#footerBar2 p a:link, div#footerBar2 p a:visited {
	color: #ccc;
	text-decoration: none;
}
div#footerBar2 p a:hover {
	color: #ffff00;
	text-decoration: none;
}
.footerColumn {
	display: block;
	position: relative;
	float: left; clear: right;
	width: 220px;
	margin: 0 20px 0 0;
}
.footerColumn:last-child {
	margin-right: 0;
}




/* Product array 3xN */
.Table {
	display: block;
}
.Row {
	display: block;
}
a:link p.prodTitle {
	margin-top: 14px !important;
}
a:link p.prodTitle, 
a:visited p.prodTitle, 
a:hover p.prodTitle, 
a:link p.prodSubtitle,
a:visited p.prodSubtitle,
a:hover p.prodSubtitle {
	width: 240px;
	margin: 0 auto;
	font-family: Georgia, serif;
	letter-spacing: 0.2px;
}
a:link p.prodTitle, 
a:visited p.prodTitle, 
a:link p.prodSubtitle,
a:visited p.prodSubtitle {
	color: #333;
}
a:link p.prodTitle, 
a:visited p.prodTitle {
	font-weight: bold;
	font-size: 14px;
	line-height: 20px;
}
a:link p.prodSubtitle, 
a:visited p.prodSubtitle {
	font-weight: normal;
	font-size: 12px;
	line-height: 18px;
}
a:hover p.prodTitle, 
a:hover p.prodSubtitle {
	color: #0099ff;
}
.Cell {
	display: block; 
	position: relative;
	float: left; clear: right;
	border: none; 
	padding: 20px 0 20px 0; 
	text-align: center; 
	background: none;
	width: 300px;
	height: 400px;
	margin: 0 6px 0 6px;
}
.imageHolder {
	width: 300px;
	height: 250px;
	display: table-cell;
	vertical-align: bottom;
	margin: 0;
}
.iwMax300 {
	max-width: 250px;
	max-height: 250px;
	background: #0099ff;
}
p.tinylink {
	font-family: Arial, sans-serif;
	font-size: 9px;
	line-height: 150%;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}
p.tinylink a:link, p.tinylink a:visited {
	color: #999;
}
p.tinylink a:hover {
	color: #333;
}


.resultsText {
	display: block;
	position: relative;
	clear: both;
	margin: 0 auto 20px auto;
	border-top: 1px solid #aaa;
	border-bottom: 1px solid #aaa;
	padding: 20px 0 20px 0;
	text-align: center;
	font-family: Arial, sanserif;
	font-size: 12px;
	font-weight: normal;
	letter-spacing: 0.5px;
	color: #777;
}
.resultsText a:link, .resultsText a:visited {
	text-decoration: none;
	color: #0099ff;
}
.resultsText a:hover {
	text-decoration: none;
	color: #000;
}


.welcomeGraphic {
	display: block;
	position: relative;
	float: left; clear: right;
	width: 240px;
	height: 350px;
	margin: 0 0 0 0;
	background: none;
}
.welcomeGraphic p {
	font-family: ff-super-grotesk-web, "SuperGroteskA-Med", sans-serif; 
	font-size: 28px;
	line-height: 32px;
	letter-spacing: 0.5px;
	color: #0099ff;
	margin: 0 0 8px 0;
}
.welcomeGraphic p a:link, 
.welcomeGraphic p a:visited {
	text-decoration: none;
	color: #0099ff;
}
.welcomeGraphic p a:hover {
	text-decoration: none;
	color: #0066ff;
}
.welcomeGraphic p a.seemore:link, 
.welcomeGraphic p a.seemore:visited {
	font-family: Georgia, serif;
	font-size: 16px;
	text-decoration: none;
	color: #aaa;
}
.welcomeGraphic p a.seemore:hover {
	text-decoration: none;
	color: #0066ff;
}

/* Slider text style */
.liveText {
	z-index: 900;
	position: absolute;
	left: 30px;
	top: 0px;
	color: #fff;
	text-shadow: -1px 1px 4px #000;
	font-family: ff-super-grotesk-web, "SuperGroteskA-Med", sans-serif;
	font-size: 28px;
	line-height: 38px;
	text-align: left;
}  

/* Homepage New & Featured */
.NewFeatured {
	display: block; 
	background: #fff;
	font-family: ff-super-grotesk-web, "SuperGroteskA-Med", sans-serif; 
	font-size: 18px;
	color: #aaa;
	padding: 10px;
	text-align: center;
	letter-spacing: 0.5px;
	width: 580px;
	border-bottom: 1px solid #ddd; 
	border-top: 1px solid #ddd;
}
p.featuredBlurb {
	font-family: Arial, sans-serif;
	text-align: center;
	font-size: 11px;
	line-height: 16px;
	letter-spacing: 0.2px;
	color: #777;
}
a:link p.featuredBlurb, a:visited p.featuredBlurb {
	color: #777;
}
a:hover p.featuredBlurb {
	color: #777;
}


/* Homepage Twitter Sidebar (right) */

.sidebar_div {
	width: 300px;
	margin: 0 0 40px 0;
	border: 1px solid #ddd;
}
.TwitterHead {
	display: block; 
	background: #fff;
	font-family: ff-super-grotesk-web, "SuperGroteskA-Med", sans-serif; 
	font-size: 18px;
	color: #aaa;
	padding: 10px;
	text-align: center;
	letter-spacing: 0.5px;
}
.TwitterHead a:link, .TwitterHead a:visited {
	color: #0099ff;
	text-decoration: none;
}
.TwitterHead a:hover {
	color: #0066ff;
	text-decoration: none;
}


/* Catalog page */

a.catalogDownload:link, 
a.catalogDownload:visited,
a.catalogDownload:hover {
	font-family: Georgia, serif; 
	font-size: 16px;
}
a.catalogDownload:link, 
a.catalogDownload:visited {
	color: #0099ff;
}
a.catalogDownload:hover {
	color: #0066ff;
}


/* Product Details page styles */
.clickMore {
	font-family: Arial, sans-serif;
	font-size: 10px;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #aaa;
	width: 100%;
	text-align: center;
	margin-top: 16px;
}
.lineTitle {
	font-weight: bold;
	font-size: 140%;
	line-height: 120%;
	margin-bottom: 0;
}
.lineSubtitle {
	font-weight: normal;
	font-size: 120%;
	line-height: 150%;
	margin-bottom: 0;
	margin-top: 8px;
}
.lineTitle a, 
.lineSubtitle a, 
.lineAuthors a, 
.linePrice a {
	color: #0099ff;
}
a.AddToCart {
	display: inline-block;
	width: auto;
	border: 2px solid #0099ff;
	background: #c2e5fe;
	border-radius: 0;
	padding: 7px 10px 7px 10px;
	font-size: 14px; 
	font-weight: bold; 
	font-family: ff-super-grotesk-web, "SuperGroteskA-Med", sans-serif; 
	letter-spacing: 1.5px;
	text-transform: uppercase;
	text-decoration: none;
	color: #0099ff;
	margin: 10px 0 0 0;
}
a:hover.AddToCart {
	color: #fff;
	border-color: #0099ff;
	background: #0099ff;
}
.detailsRightCol {
	font-family: Arial, sans-serif;
	font-weight: normal;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-size: 11px;
	line-height: 18px;
	color: #999;
}
.description {
	font-size: 16px;
	line-height: 24px;
}
.descriptionExtras {
	font-family: Arial, sans-serif;
	font-size: 14px;
	line-height: 22px;
	letter-spacing: 0.1px;
	color: #999;
	margin: 10px 0 20px 0;
}

/*
h6 {
	font-family: ff-super-grotesk-web, "SuperGroteskA-Med", sans-serif; 
	font-size: 18px;
	text-transform: lowercase;
	letter-spacing: 1px;
    text-align: center;
	color: #777;
	border-top: 2px solid #ccc;
	padding-top: 14px;
}
*/
h6 {
	font-family: ff-super-grotesk-web, "SuperGroteskA-Med", sans-serif; 
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 2px;
    overflow: hidden;
    text-align: center;
	color: #0066ff;
}
h6:before,
h6:after {
    background-color: #0066ff;
    content: "";
    display: inline-block;
    height: 1px;
    position: relative;
    vertical-align: middle;
    width: 50%;
}
h6:before {
    right: 12px;
    margin-left: -50%;
}
h6:after {
    left: 10px;
    margin-right: -50%;
}

.noStock {
	display: block;
	float: left;
	clear: both;
	font-weight: normal; 
	text-decoration: none;
	color: #ff0000;
	margin: 10px 0 10px 0;
}
a.reserveCopyButton {
	display: block;
	float: left;
	clear: left;
	width: auto;
	border: 2px solid #0099ff;
	background: #c2e5fe;
	border-radius: 0;
	padding: 7px 10px 7px 10px;
	font-size: 14px; 
	font-weight: normal; 
	font-family: ff-super-grotesk-web, "SuperGroteskA-Med", sans-serif; 
	letter-spacing: 1.5px;
	text-transform: uppercase;
	text-decoration: none;
	color: #0099ff;
	margin: 0 0 0 0;
}
a:hover.reserveCopyButton {
	color: #fff;
	border-color: #0099ff;
	background: #0099ff;
}
.wellEmailYou {
	display: block;
	float: left;
	clear: both;
	margin-top: 10px;
	font-family: Arial, sans-serif;
	font-size: 12px;
	line-height: 14px;
	letter-spacing: 0.2px;
	color: #999;
}
p.titleLink {
	display: block;
	clear: both;
}
p.otherLines {
	display: block;
	float: left;
	clear: both;
	line-height: 140%;
}





/* Staff directory styles */
#directory {
	line-height: 24px;
}
#directory td {
	padding-bottom: 20px;
}
.dirName {
	font-size: 16px;
	font-family: Georgia, serif;
}
.dirInfo {
	font-size: 16px;
	font-family: Arial, sans-serif;
	font-weight: normal;
	color: #777;
	text-transform: lowercase;
	letter-spacing: 0.3px;
}
.dirTitle {
	font-size: 14px;
	font-style: italic;
	letter-spacing: 0.5;
	color: #777;
	text-transform: none !important;
}
img.subway {
	display: inline-block;
	width: 16px;
	height: 16px;
	margin: 0 1px -2px 1px;
}




/* Fancy beveled button */
.fancy {
	display: inline-block;
	width: auto;
	border: 2px solid #0099ff;
	border-radius: 0;
	background: #c2e5fe;
	padding: 7px 10px 7px 10px;
	font-size: 14px; 
	font-weight: normal; 
	font-family: ff-super-grotesk-web, "SuperGroteskA-Med", sans-serif; 
	letter-spacing: 1.5px;
	text-transform: uppercase;
	text-decoration: none;
	color: #0099ff;
	margin: 0 0 0 0;
	box-shadow: inset -3px -3px 5px #94b5ce;
}
input:hover.fancy {
	color: #0099ff;
	border-color: #0099ff;
	background: #a7d7fd;
    cursor: pointer;
    cursor: hand;
	box-shadow: inset 3px 3px 5px #8cb1d1;
}





/* Shopping Cart */
.keepShopping {
	display: inline-block;
	width: auto;
	border: 2px solid #0099ff;
	border-radius: 0;
	background: #c2e5fe;
	padding: 7px 10px 7px 10px;
	font-size: 14px; 
	font-weight: normal; 
	font-family: ff-super-grotesk-web, "SuperGroteskA-Med", sans-serif; 
	letter-spacing: 1.5px;
	text-transform: uppercase;
	text-decoration: none;
	color: #0099ff;
	margin: 0 0 0 0;
}
input:hover.keepShopping, a:hover.keepShopping {
	color: #fff;
	border-color: #0099ff;
	background: #0099ff;
    cursor: pointer;
    cursor: hand;
}
#shippingRatesBanner {
	width: 100%;
	height: auto;
	text-align: center;
	background: #0099ff;
	color: #fff;
	font-family: Arial, sans-serif;
	font-size: 16px;
	line-height: 30px;
	font-weight: normal;
	letter-spacing: 0.2px;
	padding: 10px 0 10px 0;
}
.cartBox {
	width: 100%;
	height: inherit;
	background: none;
	border: 2px solid #777;
	padding: 0;
}
.cartBoxHeader {
	display: block;
	width: 100%;
	background: #777;
	font-family: ff-super-grotesk-web, "SuperGroteskA-Med", sans-serif;
	font-size: 22px;
	line-height: 32px;
	text-decoration: none;
	text-transform: none;
	letter-spacing: 0.3px;
	color: #fff;
	margin: 0;
	padding: 20px 0 20px 0;
}
.nextButton {
	display: inline-block;
	width: auto;
	border: 2px solid #339933;
	border-radius: 0;
	background: #c2ffbe;
	padding: 7px 10px 7px 10px;
	font-size: 14px; 
	font-weight: normal; 
	font-family: ff-super-grotesk-web, "SuperGroteskA-Med", sans-serif; 
	letter-spacing: 1.5px;
	text-transform: uppercase;
	text-decoration: none;
	color: #339933;
	margin: 0 0 0 0;
}
input:hover.nextButton, a:hover.nextButton {
	color: #fff;
	border-color: #339933;
	background: #339933;
    cursor: pointer;
    cursor: hand;
}




/* ken's additional styles BEGIN */

div#singleColumn {
	width: 600px;
	margin-left: auto;
	margin-right: auto;
}

div#simplePage {
	width: 600px;
	margin: auto;
}

div#footerSimple {
	display: block;
	position: relative;
	clear: both;
	width: auto;
	height: 35px;
	background: #ccc;
	margin: 0;
	padding: 16px 0 16px 0;
	text-align: center;
}
div#footerSimple h1 {
	font-family: ff-super-grotesk-web, "SuperGroteskA-Med", sans-serif;
	font-size: 18px;
	display: block;
	margin: 10px 0 16px 0;
	font-weight: normal;
}
div#footerSimple p {
	font-family: Arial, sans-serif;
	font-size: 12px;
	color: #777;
}
div#footerSimple p a:link, div#footerSimple p a:visited {
	text-decoration: none;
	color: #0066ff;
}
div#footerSimple p a:hover {
	text-decoration: none;
	color: #333;
}


.small_link {
	font-family: 'Lucida Grande', 'Trebuchet MS', Trebuchet, Arial, Geneva, sans-serif;
	font-size: 9px;
	line-height: 150%;
	text-transform: uppercase;
}

.searchodd
{
	width: auto;
	background-color: #f8f8e4; /* was f4f4b8 FFFFFF  */
	height: auto;
	padding: 10px 50px 10px 10px;
}

.searcheven
{
	width: auto;
	background-color: #eeeeee; /* was CCCCCC  */
	height: auto;
	padding: 10px 50px 10px 10px;
}

.grayTable table {
	background-color: #CCC;
	padding: 10px 20px 10px 10px;
	margin: 0px 20px 20px 20px;
	border-spacing: 0px;
}

.grayTable td {
	background-color: #CCC;
	padding-left: 10px;
}

.blackLink a {
	font-size: 14px;
	color: #333;
	text-decoration: none;
}

.blackLink a:hover { 
	color: black; 
	text-decoration: underline;
}

.redLink	a {
	color: red;
	text-decoration: none;
}

.redLink	a:hover { 
	text-decoration: underline;
}


/* ken's additional styles END */