@charset "UTF-8";
/* Define constants for the application and to configure the blueprint framework. */
/* ===== Compass Imports ===== */
/* DO NOT include Blueprint here. We are using Susy for the grid, and if Blueprint is here, it will mess things up */
/* @import "compass/css3/columns" */
/* @import "compass/css3/hyphenation"; */
/* Needed for the link-colors() function */
/* Needed for the horizontal-list() function */
/* When remembering whether or not there's a hyphen in white-space is too hard */
/* Use pie-clearfix when there is no width set ont the element to avoid edge cases */
/* Use to calculate color legibility: http://compass-style.org/reference/compass/utilities/color/contrast/ */
/* Other interesting functions:
	@import "compass/utilities/color/contrast";
		detailed here: http://compass-style.org/reference/compass/utilities/color/contrast/
		Used to pass two colors into a get out the most readable color.
		Good for situations where we dont want to create a new color,
		but be sure that colors from variables are always going to be readable
*/
/* ===== Grid ===== */
/*
 * Susy: Un-obtrusive grids for designers
 * By: Eric A. Meyer and OddBird
 * Site: susy.oddbird.net
 */
/* Settings    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
 * Susy & Compass use HTML hacks to support IE 6 and 7. You can turn that on or off.
 * We are using Susy 1.0. Update your GEM file by deleting the old an downloading the new.
 */
/* ===== Variables ===== */
/* Colors */
/* Typography */
/* True here means that all computed values will be in EMs */
/* Allows the adjust-font-size-to and lines-for-font-size mixins to round to the nearest half line height to avoid large spacing between lines. */
/* Useful to set this here, but don't echo it anywhere. Used in calculations */
/* Useful to set this here, but don't echo it anywhere. Used in calculations */
	/*
		Compass will convert the font sizes from px to em and fit it into the vertical rhythm automatically with the necessary margin
		A neat trick, for sure. More on using the vertical rhythm properties and mixins: http://compass-style.org/reference/compass/typography/vertical_rhythm/

		Quick Reference:
		+padding-leader(1) – Adds $base-line-height padding to the top of an element.
		+padding-trailer(1) – Adds $base-line-height padding to the bottom of an element.

		+margin-leader(1) – Adds $base-line-height margin to the top of an element.
		+margin-trailer(1) – Adds $base-line-height margin to the bottom of an element.

		+adjust-font-size-to(XXpx) – Changes the font-size to the value. Can also use a multiplier (see next example).
		+adjust-leading-to(2) – Changes the line-height to 2 * $base-line-height. Can also use a px value.

		Note: The line height is relative to the constant $base-line-height.
		The number you specify for the leader, trailer and leading will be multiplied by the constant, then converted to its relative value in ems.
		Don’t worry about nested elements etc, Compass will do the maths for you :)
	*/
/* Defaults */
/* Shorthand for a set of useful text/line-height resizing functions. easier to remember... */
/* Easy little function to do the math of pixel to EM conversion for us. Needs a base-font-size set in _base.scss */
/*
@mixin pe-border( $width: 1px, $style: solid, $color-top: none, $color-right: none, $color-bottom: none, $color-left: none ) {
        @if $color-top != none
                { border-top: $width $style $color-top; }
        @if $color-right != none
                { border-right: $width $style $color-right; }
        @if $color-bottom != none
                { border-bottom: $width $style $color-bottom; }
        @if $color-left != none
                { border-left: $width $style $color-left; }
}
*/
/* 
 * Cross browser method to apply word-breaking and hyphenation (where supported) 
 * Should be able to use the built-in Compass method, hyphenation(), but the library won't load right now
 */
/* Keep this in all mix-in files if you can. Useful stuff */
/* Letterpress Type Effect - needs to be tested */
/* Manage our preferred reset as a Mix-in instead of replying on Compass or Blueprint */
/* Add in the HTML5 Boilerplate rules for print (generic). Modify as needed. */
/* ! Slideshows - - - */
/*<div id="homepage-slideshow" class="flex-slideshow home-slideshow">
        <div class="flex-viewport" style="overflow: hidden; position: relative; "> // Dynamically added
                <ul class="slides">
                        <li class="slide-container slide-0 flex-active-slide">
                                <figure>
                                        <div class="frame-wrapper">
                                                <img src="/media/slides/websize_library_Zack_Altschuler.jpg" alt="Slide #3 Library">
                                        </div>
                                        <figcaption class="caption-wrapper">
                                                <p>Library. Student Photographer: Zack Athschuler</p>
                                        </figcaption>
                                </figure>
                        </li>
                </ul>
        </div> // Dynamically added wrapper
</div>*/
/* - - - Larger than 760px - - - */
/* - - - Larger than 980px - - - */
/*
 * jQuery FlexSlider v2.0
 * http://www.woothemes.com/flexslider/
 *
 * Copyright 2012 WooThemes
 * Free to use under the GPLv2 license.
 * http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Contributing author: Tyler Smith (@mbmufffin)
 */
/* Browser Resets
.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus    {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;} */
/* FlexSlider Necessary Styles
.flexslider {margin: 0; padding: 0;}
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping
.flexslider .slides img {width: 100%; display: block;}
.flex-pauseplay span {text-transform: capitalize;} */
/* Clearfix for the .slides element */
.slides:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

html[xmlns] .slides {
    display: block;
}

* html .slides {
    height: 1%;
}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you include js that eliminates this class on page load */
.no-js .slides > li:first-child {
    display: block;
}

/* FlexSlider Default Theme
.flexslider { margin: 0 0 60px; background: #fff; border: 4px solid #fff; position: relative; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; box-shadow: 0 1px 4px rgba(0,0,0,.2); -webkit-box-shadow: 0 1px 4px rgba(0,0,0,.2); -moz-box-shadow: 0 1px 4px rgba(0,0,0,.2); -o-box-shadow: 0 1px 4px rgba(0,0,0,.2); zoom: 1;}
.flex-viewport {max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease;}
    .loading .flex-viewport {max-height: 300px;}
.flexslider .slides {zoom: 1;}
.carousel li {margin-right: 5px} */
/* Direction Nav
.flex-direction-nav {*height: 0;}
.flex-direction-nav a {width: 30px; height: 30px; margin: -20px 0 0; display: block; background: url(../img/bg_direction_nav.png) no-repeat 0 0; position: absolute; top: 50%; z-index: 10; cursor: pointer; text-indent: -9999px; opacity: 0; -webkit-transition: all .3s ease;}
.flex-direction-nav .flex-next {background-position: 100% 0; right: -36px; }
.flex-direction-nav .flex-prev {left: -36px;}
.flexslider:hover .flex-next {opacity: 0.8; right: 5px;}
.flexslider:hover .flex-prev {opacity: 0.8; left: 5px;}
.flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover {opacity: 1;}
.flex-direction-nav .flex-disabled {opacity: .3!important; filter:alpha(opacity=30); cursor: default;} */
/* Control Nav
.flex-control-nav {width: 100%; text-align: center;}
.flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-paging li a {width: 11px; height: 11px; display: block; background: #666; background: rgba(0,0,0,0.5); cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; box-shadow: inset 0 0 3px rgba(0,0,0,0.3);}
.flex-control-paging li a:hover { background: #333; background: rgba(0,0,0,0.7); }
.flex-control-paging li a.flex-active { background: #000; background: rgba(0,0,0,0.9); cursor: default; }

.flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;}
.flex-control-thumbs li {width: 25%; float: left; margin: 0;}
.flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;}
.flex-control-thumbs img:hover {opacity: 1;}
.flex-control-thumbs .flex-active {opacity: 1; cursor: default;}

@media screen and (max-width: 860px) {
    .flex-direction-nav .flex-prev {opacity: 1; left: 0;}
    .flex-direction-nav .flex-next {opacity: 1; right: 0;}
} */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
}

blockquote, q {
    quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content: "";
    content: none;
}

ins {
    background-color: #ddd;
    text-decoration: none;
}

mark {
    background-color: #ff8;
    font-style: italic;
}

strike, del {
    text-decoration: line-through;
    color: #000;
}

abbr[title] {
    /* border-bottom: 1px dotted; */
    cursor: help;
}

dfn[title] {
    border-bottom: 1px dotted;
    cursor: help;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

input, select {
    display: inline-block;
    vertical-align: middle;
}

html {
    font-size: 100%;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

body {
    *font-size: small;
    text-rendering: optimizeSpeed;
}

select, input, textarea, button {
    font: 99% Arial, sans-serif;
}

/* Minimal base styles */
html {
    overflow-y: scroll;
    -webkit-font-smoothing: antialiased;
    margin: 0;
}

a:hover, a:active {
    outline: none;
}

ul, ol {
    margin-left: 1.5em;
}

ul {
    list-style: square;
}

ol {
    list-style: decimal;
}

ol ol {
    list-style: upper-alpha;
}

ol ol ol {
    list-style: lower-roman;
}

ol ol ol ol {
    list-style: lower-alpha;
}

nav ul, ul.menu, ul.tabs {
    margin-left: 0;
    list-style: none;
    list-style-image: none;
}

small {
    font-size: 85%;
}

b, strong, th {
    font-weight: 700;
}

i, em, cite {
    font-style: italic;
}

td {
    vertical-align: top;
}

sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
}

sup {
    top: -0.5em;
}

sub {
    bottom: -0.25em;
}

pre, code, kbd, samp {
    font-family: Courier, monospace, sans-serif;
}

pre {
    /* PE's codey-looking pre style, just for kicks */
    white-space: pre-wrap;
    white-space: -moz-pre-wrap !important;
    /* 1999+ Mozilla */
    white-space: -pre-wrap;
    /* Opera 4 thru 6 */
    white-space: -o-pre-wrap;
    /* Opera 7 and up */
    word-wrap: break-word;
    /* IE 5.5+ and up */
    padding: 1em;
    margin-bottom: 1em;
    background-color: rgba(230, 230, 230, 0.6);
    border-left: 5px solid #6CE26C;
}

code {
    font-size: 110%;
}

textarea {
    overflow: auto;
    vertical-align: top;
    resize: vertical;
}

.ie6 legend, .ie7 legend {
    border: 0;
    padding: 0;
    white-space: normal;
    *margin-left: -7px;
}

input[type="radio"] {
    vertical-align: text-bottom;
}

input[type="checkbox"] {
    vertical-align: bottom;
}

.ie7 input[type="checkbox"] {
    vertical-align: baseline;
}

.ie6 input {
    vertical-align: text-bottom;
}

input[type="button"], input[type="submit"], input[type="image"], input[type="email"], button {
    cursor: pointer;
}

button, input, select, textarea {
    margin: 0;
}

button, input[type="button"], input[type="reset"], input[type="submit"] {
    cursor: pointer;
    -webkit-appearance: button;
    *overflow: visible;
}

button[disabled], input[disabled] {
    cursor: default;
}

/*input:invalid, textarea:invalid, input.error, textarea.error {
	border-radius: 1px; 
	-webkit-box-shadow: 0px 0px 5px red; 
	-moz-box-shadow: 0px 0px 5px red; 
	-ms-box-shadow: 0px 0px 5px red; 
	-o-box-shadow: 0px 0px 5px red; 
	box-shadow: 0px 0px 5px red;
}*/
input[type="checkbox"], input[type="radio"] {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
    *width: 13px;
    *height: 13px;
}

input[type="search"] {
    -webkit-appearance: textfield;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
}

input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: none;
}

.no-boxshadow input:invalid, .no-boxshadow textarea:invalid {
    background-color: #f0dddd;
}

a img {
    display: block;
}

.ie7 img {
    -ms-interpolation-mode: bicubic;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: normal;
}

/* Main CSS styles for linear content. Design for Mobile first! */
/* ! ==== Global Typographic / Element Styles ==== */
html.no-touch {
    overflow-x: hidden;
}

body {
    /*
    * We don't echo the values of the base-font and base-line-height variables here,
    * because we prefer setting these values to a percentage of what the user has defined in their browser.
    * The pixel version of the percentage we use here should be what we supply to the variables, though,
    * so that the calculations Compass makes for ems will be correct.
    */
    background: url("../img/rough_diagonal.png") 0 0 repeat transparent;
    color: #333;
    font: normal 87.5%/1.67 "Averia Serif Libre", Times, serif;
}

header, footer, nav, menu, section, article, aside, div, input, textarea {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

a, a:active, a:visited {
    color: #666;
    cursor: pointer;
    text-decoration: none;
}

a:hover, a:visited:hover {
    color: #222;
    text-decoration: none;
}

/* Set the highlight colors. These selection declarations have to be separate */
::-moz-selection {
    background: #666;
    color: #fff;
    text-shadow: none;
}

::selection {
    background: #666;
    color: #fff;
    text-shadow: none;
}

a:link {
    -webkit-tap-highlight-color: #222;
}

img, embed, object, video {
    max-width: 100%;
}

img {
    display: block;
    margin: 0 auto;
    font-style: italic;
}

h1, h2, h3, h4, h5, h6 {
    clear: both;
    font-weight: 400;
    margin-top: 0.75em;
    margin-bottom: 0.75em;
}

div h1:first-child, div h2:first-child, div h3:first-child, div h4:first-child, div h5:first-child, div h6:first-child {
    margin-top: 0;
}

p, ul, ol, blockquote {
    color: #666;
    font-size: 1.28571em;
    line-height: 1.75em;
    font-weight: 400;
    margin-bottom: 0.75em;
}

blockquote {
    font-family: Georgia, serif;
    font-style: italic;
    padding: 0.375em 1.5em 0.375em;
    position: relative;
}
blockquote p {
    font-size: 1em;
}
blockquote:before, blockquote:after {
    color: #d6d6d6;
    font-style: normal;
    font-weight: 700;
    font-size: 2.57143em;
    line-height: 1.16667em;
    position: absolute;
}
blockquote:before {
    content: "“";
    top: 0;
    left: 0;
}
blockquote:after {
    content: "”";
    line-height: 0;
    vertical-align: bottom;
    bottom: -0.4em;
    right: 0;
}

ul, ol {
    margin-left: 1.5em;
}

table {
    margin-bottom: 1em;
}

form {
    padding: 1.5em 0;    /*was 1.5em 0*/
    *zoom: 1;
}
form:after {
    content: "";
    display: table;
    clear: both;
}

label {
    margin-bottom: 0.375em;
}

input, textarea {
    width: 100%;
    padding: 0.25em;
    margin-bottom: 1.125em;
    font-size: 1.14286em;
    line-height: 1.3125em;
}

input[type="checkbox"] {
    display: inline-block;
    margin-right: .5em;
    vertical-align: text-top;
    width: auto;
}

input {
    color: #333;
}
.no-touch input:focus {
    -moz-box-shadow: 0px 0px 5px rgba(255, 255, 255, 0.5);
    -webkit-box-shadow: 0px 0px 5px rgba(255, 255, 255, 0.5);
    box-shadow: 0px 0px 5px rgba(255, 255, 255, 0.5);
}
.no-touch input[required=required]:focus {
    -moz-box-shadow: 0px 0px 5px rgba(255, 255, 255, 0.5);
    -webkit-box-shadow: 0px 0px 5px rgba(255, 255, 255, 0.5);
    box-shadow: 0px 0px 5px rgba(255, 255, 255, 0.5);
}

textarea {
    margin: .25em 0 .5em;
}

::-webkit-input-placeholder {
    color: #777;
    font-style: italic;
}

input:-moz-placeholder {
    color: #777;
    font-style: italic;
}

input[type=text], input[type=password] {
    background: rgba(255, 255, 255, 0.75);
    padding: 0.25em 0.5em;
}

input, textarea, button, a.button {
    border: 1px solid rgba(0, 0, 0, 0.25);
}

p abbr {
    font-size: 1.25em;
    font-variant: small-caps;
    text-transform: lowercase;
}

.giga {
    font-size: 3.42857em;
    line-height: 1.09375em;
}

.mega {
    font-size: 3em;
    line-height: 1.25em;
}

.kilo {
    font-size: 2.57143em;
    line-height: 1.16667em;
}

/* img */
.align-left {
    float: left;
    margin: 0 .75em .5em 0;
}

/* img */
.align-right {
    float: right;
    margin: 0 0 .5em .75em;
}

.align-center {
    clear: both;
    display: block;
    margin: 0 auto;
}

.align-none {
    clear: both;
    float: none;
}

/* ===== Elements for Stackbin.com ===== */
/* ===== elements for testing / planning ===== */
#templates-nav {
    background: #fff;
    border-top: 1px solid #ccc;
    -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
    font-family: Arial, sans-serif;
    font-size: 0.64286em;
    line-height: 2.33333em;
    padding: 1em 0;
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    text-align: center;
}
#templates-nav ul {
    margin-bottom: 0;
}
#templates-nav ul li {
    border-right: 1px solid #999;
    display: inline-block;
    line-height: 1em;
    margin-right: -0.25em;
    padding: 0 10px;
}
#templates-nav ul li:last-child {
    border-right: 0 none;
    margin-right: 0;
}

/* ===== Global Elements ===== */
/* === Local Mixins === */
#user-links, #user-links ul li, #user-links ul div, #secondary-links a,
#mobile-secondary-links a,
#mobile-info-links a, #info-links ul a, #copyright,
#mobile-copyright, #signup, #footer-links a {
    border-top: 1px solid #444;
    border-bottom: 1px solid #000;
    clear: both;
    display: block;
    padding: .5em .75em;
    text-align: center;
}

/* carried over */
.category-intro img, #product-thumbs img, ul.options li, .product-list-group .exp,
.product-list-order .exp, .quote-status, .scroll,
.flex-direction-nav li a, .form-box {
    background: #E8E5DA;
    border: 1px solid #ccc;
}

ul.options, .actions {
    list-style: none;
    margin: .5em 0;
}
ul.options li, .actions li {
    display: inline-block;
    margin: 0 .25em .5em 0;
}

input[type=submit], button, a.button, input.button, #signup .button, a.price-button, a.button.approve, a.button.order, .button.submit, a.button.cancel, .skip {
    background: #666;
    border: 1px solid rgba(0, 0, 0, 0.75);
    -moz-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5), inset 0 15px 0px rgba(255, 255, 255, 0.15);
    -webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5), inset 0 15px 0px rgba(255, 255, 255, 0.15);
    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5), inset 0 15px 0px rgba(255, 255, 255, 0.15);
    color: #eee;
    display: block;
    font-family: "Archivo Narrow", Arial, sans-serif;
    font-size: 1.14286em;
    line-height: 1.3125em;
    font-weight: bold;
    height: 44px;
    line-height: 44px;
    margin-bottom: 0;
    padding: 0 .5em;
    text-align: center;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.75);
    white-space: nowrap;
}
input[type=submit]:hover, button:hover, a.button:hover, input.button:hover, #signup .button:hover, a.price-button:hover, .button.submit:hover, .skip:hover, input[type=submit]:focus, button:focus, a.button:focus, input.button:focus, #signup .button:focus, a.price-button:focus, .button.submit:focus, .skip:focus, input[type=submit]:active, button:active, a.button:active, input.button:active, #signup .button:active, a.price-button:active, .button.submit:active, .skip:active {
    background: #444;
    color: #fff;
}
.no-touch input[type=submit], .no-touch button, .no-touch a.button, .no-touch input.button, .no-touch #signup .button, #signup .no-touch .button, .no-touch a.price-button, .no-touch .button.submit, .no-touch .skip {
    height: auto;
    line-height: 1.35em;
    padding: .2em .5em .25em;
}

#signup .button, a.price-button, a.button.approve, a.button.order, .button.submit {
    background: #A62C27;
    color: #f9f9f9;
}
#signup .button:hover, a.price-button:hover, a.button.approve:hover, a.button.order:hover, .button.submit:hover, #signup .button:active, a.price-button:active, a.button.approve:active, a.button.order:active, .button.submit:active {
    background: #7d211d;
}

a.button.cancel {
    background: #aaa;
    border: 1px solid rgba(0, 0, 0, 0.5);
    -moz-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25), inset 0 15px 0px rgba(255, 255, 255, 0.15);
    -webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25), inset 0 15px 0px rgba(255, 255, 255, 0.15);
    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25), inset 0 15px 0px rgba(255, 255, 255, 0.15);
}

.button i {
        font-family: 'icomoon' !important;
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
                -webkit-font-smoothing: antialiased;
                        -moz-osx-font-smoothing: grayscale;
}

.skip {
    display: block;
    text-align: center;
}

.alert td, .add-product td, .order-total td, .add-product-form, .message.from-user {
    background: rgba(150, 150, 150, 0.2);
}

body {
    background: #484846;
}

.container {
    position: relative;
    margin: 0 5px;
    max-width: 990px;
    padding: 0 10px;
    *zoom: 1;
}
.container:after {
    content: "";
    display: table;
    clear: both;
}
.product-list #page .container {
    max-width: 650px;
}

#masthead {
    position: relative;
}

#user {
    background: #282826;
    -moz-box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.5);
    box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.5);
    padding: 5px 0 0;
    *zoom: 1;
}
#user:after {
    content: "";
    display: table;
    clear: both;
}
#user.blue {
    background: #183D5E;
    -moz-box-shadow: inset 0 0 50px rgba(0, 0, 0, 0.75);
    -webkit-box-shadow: inset 0 0 50px rgba(0, 0, 0, 0.75);
    box-shadow: inset 0 0 50px rgba(0, 0, 0, 0.75);
}

#logo {
    margin: .75em auto 0;
}

.skip {
    margin: 1em 0;
}

#user-links {
    display: none;
    margin-top: 10px;
    padding: .5em 1em 1em;
    text-align: center;
    *zoom: 1;
}
#user-links:after {
    content: "";
    display: table;
    clear: both;
}
#user-links form {
    padding: 0;
}
#user-links label, #user-links ul {
    padding: 10px;
}
#user-links label {
    color: #FAA420;
    display: block;
    font-weight: bold;
    margin-bottom: 0;
}
#user-links ul {
    background: #222;
    border: 1px solid rgba(200, 200, 200, 0.15);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -moz-box-shadow: inset 2px 2px 10px rgba(0, 0, 0, 0.8), 0 0 10px rgba(100, 100, 100, 0.1);
    -webkit-box-shadow: inset 2px 2px 10px rgba(0, 0, 0, 0.8), 0 0 10px rgba(100, 100, 100, 0.1);
    box-shadow: inset 2px 2px 10px rgba(0, 0, 0, 0.8), 0 0 10px rgba(100, 100, 100, 0.1);
    font-size: 1em;
    line-height: 1.5em;
    margin-bottom: 0;
    padding: 3px;
}
#user-links ul li {
    line-height: inherit;
    text-shadow: 0 0 3px #000;
}
#user-links label, #user-links input, #user-links a.button, #user-links a {
    line-height: 1.75em;
    padding: 0.25em;
    vertical-align: middle;
    width: 100%;
}
#user-links input, #user-links a.button, #user-links > a {
    margin: 0 .25em .25em 0;
}
#user-links label, #user-links input:not(.button) {
    display: block;
    margin: 0 auto .25em;
}
#user-links .count {
    color: #FAA420;
    font-size: 1.05em;
    margin-right: -0.5em;
    padding: 0.25em;
    vertical-align: middle;
}
#user-links a {
    color: #999;
}
#user-links a:hover {
    color: #ddd;
    text-decoration: underline;
}

#stackbin-social {
    text-align: center;
}
#stackbin-social ul {
    list-style: none;
    list-style-image: none;
    margin-bottom: 0;
}
#stackbin-social li {
    display: inline-block;
    padding: 5px 10px 0 0;
}
#stackbin-social li:last-child {
    padding: 5px 0 0 0;
}
#stackbin-social a {
    font-size: 1.21429em;
    line-height: 1.23529em;
}
#stackbin-social a:hover {
    color: #fff;
}

#secondary-links,
#mobile-secondary-links,
#mobile-info-links {
    clear: both;
    position: relative;
    text-align: center;
}
#secondary-links ul,
#mobile-secondary-links ul,
#mobile-info-links ul {
    font-size: 1.14286em;
    line-height: 1.3125em;
    margin-bottom: 0;
}
#secondary-links ul li#usa,
#mobile-secondary-links ul li#usa,
#mobile-info-links ul li#usa {
    background: #555;
    border-right: none;
    margin-right: 5px;
    padding: 3px;
    position: absolute;
    bottom: 0;
}
#secondary-links ul li#usa a,
#mobile-secondary-links ul li#usa a,
#mobile-info-links ul li#usa a {
    -moz-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.5);
    box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.5);
    display: block;
    font-size: 0.78571em;
    line-height: 1.90909em;
    height: 2em;
    letter-spacing: 0.1em;
    line-height: 2em;
    padding: 3px 8px;
    text-shadow: 0 0 3px rgba(0, 0, 0, 0.5);
    text-transform: uppercase;
}
#secondary-links a,
#mobile-secondary-links a,
#mobile-info-links a {
    color: #E8E5DA;
}
#secondary-links a:hover,
#mobile-secondary-links a:hover,
#mobile-info-links a:hover {
    text-decoration: underline;
}

#secondary-links {
    display: none;
}

#primary-links {
    background: #A62C27;
    border-top: 1px solid #111;
    border-bottom: 1px solid #444;
    clear: both;
}
#primary-links ul.level-one {
    font-family: "Archivo Narrow", Arial, sans-serif;
    font-size: 1.35714em;
    line-height: 1.65789em;
    letter-spacing: 0.03em;
    margin: 0 auto;
    text-align: center;
}
#primary-links ul.level-one > li {
    -moz-box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.75), inset 0px 20px 0px rgba(255, 255, 255, 0.1);
    -webkit-box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.75), inset 0px 20px 0px rgba(255, 255, 255, 0.1);
    box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.75), inset 0px 20px 0px rgba(255, 255, 255, 0.1);
    border-top: 1px solid #A62C27;
    border-bottom: 1px solid #444;
    font-weight: 700;
    height: 44px;
    line-height: 44px;
    position: relative;
}
#primary-links ul.level-one > li > a {
    color: #E8E5DA;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.85);
    text-transform: uppercase;
}
.no-touch #primary-links ul.level-one > li {
    height: inherit;
    line-height: inherit;
    padding: .25em 0;
}
.no-touch #primary-links ul.level-one > li > a {
    -moz-border-radius: 5px 5px 0 0;
    -webkit-border-radius: 5px;
    border-radius: 5px 5px 0 0;
    padding: 4px 6px;
}
a.wsd-link {
    background-color:#FAA420;
}
#primary-links ul.level-two {
    position: absolute;
    top: 100%;
    left: -999em;
}
#primary-links ul.level-three {
    display: none;
}

#info-bar {
    background: #B6B2A6;
    border-bottom: 1px solid #ccc;
    padding: 1em 0;
    position: relative;
    text-align: center;
    *zoom: 1;
}
#info-bar:after {
    content: "";
    display: table;
    clear: both;
}
#info-bar .button {
    font-family: "icomoon";
}

#mobile-search {
    text-align: center;
}
#mobile-search a.button, #mobile-search a {
    margin-top: 0;
    margin-right: 0.5em;
    margin-bottom: 0;
    padding: 0.25em;
    vertical-align: middle;
}
#mobile-search .button {
    display: none;
}

.site-search-field {
    margin-bottom: 0;
}

#mobile-search {
    margin: 1em 0;
}

#contact-phone a {
    font-family: "Archivo Narrow", Arial, sans-serif;
    background: url("../img/phone-symbol.png") 0px 11px no-repeat;
    background-size: 18px;
    color: #A62C27;
    display: inline-block;
    font-size: 2.28571em;
    line-height: 1.3125em;
    font-weight: normal;
    line-height: 1.3em;
    vertical-align: middle;
    padding-left: 25px;
}
#contact-phone a:hover {
    color: #222;
}

#usa {
    display: none;
    margin-left: 10px;
    padding: 3px;
    position: relative;
}
#usa span {
    color: #ddd;
    display: block;
    font-size: 0.92857em;
    line-height: 1.61538em;
    font-weight: 700;
    letter-spacing: 0.1em;
    line-height: 1em;
    padding: 3px 17px 3px 48px;
    text-transform: uppercase;
}
#usa span:before, #usa span:after {
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    content: "";
    display: inline-block;
    height: 4px;
    margin-top: -2px;
    position: absolute;
    top: 50%;
    width: 3px;
    z-index: 2000;
}
#usa span:after {
    right: 10px;
}
#usa span:before {
    left: 10px;
}

#usa.plate {
    background: #444;
    border: 1px solid #222;
    -moz-box-shadow: inset 0 12px 0px rgba(255, 255, 255, 0.1);
    -webkit-box-shadow: inset 0 12px 0px rgba(255, 255, 255, 0.1);
    box-shadow: inset 0 12px 0px rgba(255, 255, 255, 0.1);
}
#usa.plate span {
    background: url("../img/us_flag.gif") 18px 2px no-repeat;
    border: 1px solid #222;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.75);
}
#usa.plate span:before, #usa.plate span:after {
    background: #ddd;
    -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.75);
    -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.75);
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.75);
}

#usa.tag {
    background: #555;
}
#usa.tag span {
    background: url("../img/us_flag.gif") 4px 2px no-repeat;
    border: 1px dashed #888;
    color: #fff;
    -moz-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.25), inset 0px 0px 3px rgba(0, 0, 0, 0.25);
    -webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.25), inset 0px 0px 3px rgba(0, 0, 0, 0.25);
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.25), inset 0px 0px 3px rgba(0, 0, 0, 0.25);
    padding: 5px 16px 5px 36px;
    text-shadow: 0px 0px 3px rgba(0, 0, 0, 0.25);
}
#usa.tag span:after {
    background: #E8E5DA;
    -moz-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.25);
    -webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.25);
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.25);
}

#site-footer {
    -moz-box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.5);
    box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.5);
    padding: 0;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}
#site-footer p, #site-footer ul, #site-footer a {
    color: #E8E5DA;
}
#site-footer a:hover {
    color: #fff;
    text-decoration: underline;
}

#site-info {
    display: none;
}

#mobile-footer-links {
    font-size: 0.92857em;
    line-height: 1.61538em;
}

#info-links {
    color: #444;
    text-align: center;
}
#info-links ul {
    line-height: 1.4em;
}
#info-links ul li:first-child {
    padding: 0 10px 0 0;
}

#copyright,
#mobile-copyright {
    padding-top: 1em;
}
#copyright span,
#mobile-copyright span {
    white-space: nowrap;
}

#mobile-copyright {
    font-size: 0.78571em;
    line-height: 1.90909em;
}

#signup {
    background: #282826;
    -moz-box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.5);
    box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.5);
    display: none;
    text-align: center;
}
#signup p, #signup form, #signup input {
    margin-top: 0;
    margin-bottom: .25em;
    vertical-align: middle;
    width: auto;
}
#signup p {
    color: #fff;
    font-size: 1.07143em;
    line-height: 1.4em;
    margin-bottom: .75em;
}
#signup form {
    padding: 0 10px;
}

#footer-links {
    clear: both;
    *zoom: 1;
    padding: 20px 0 40px;
}
#footer-links:after {
    content: "";
    display: table;
    clear: both;
}
#footer-links ul {
    font-size: 1em;
    line-height: 1.4em;
}

#footer-links li a,
#mobile-footer-links li a {
    height: 44px;
    line-height: 44px;
    padding: 0;
}
#footer-links li.section,
#mobile-footer-links li.section {
    font-family: "Archivo Narrow", Arial, sans-serif;
    font-size: 1.35714em;
    line-height: 1.65789em;
    font-weight: 700;
}
#footer-links li.section a,
#mobile-footer-links li.section a {
    border-top: 0;
    color: #FAA420;
}

h1 {
    color: #183D5E;
    font-family: "Archivo Narrow", Arial, sans-serif;
    font-size: 1.57143em;
    line-height: 1.43182em;
    line-height: 1.2em;
    margin-bottom: .2em;
    display: block;
    position: relative;
}
h1:before, h1:after {
    content: attr(title);
    color: rgba(255, 255, 255, 0.1);
    position: absolute;
}
h1:before {
    top: 2px;
    left: 2px;
}
h1:after {
    top: 2px;
    left: 2px;
}

h2 {
    color: #A62C27;
    font-family: "Archivo Narrow", Arial, sans-serif;
    font-size: 1.8em;
    line-height: 1.575em;
    font-weight: 700;
    text-transform: uppercase;
}

h3 {
    font-family: "Archivo Narrow", Arial, sans-serif;
    font-size: 1.5em;
    line-height: 1.75em;
    line-height: 1.4em;
    margin-bottom: 0.1em;
}

h4 {
    font-size: 1.14286em;
    line-height: 1.3125em;
    font-weight: 700;
}

h5 {
    font-size: 1em;
    line-height: 1.5em;
    font-weight: 700;
}

h6 {
    font-size: 0.85714em;
    line-height: 1.75em;
    font-weight: 700;
    line-height: 1.4em;
}
h6 a, h6 a:hover {
    text-decoration: underline;
}

p, ul, ol {
    font-size: 1.14286em;
    line-height: 1.3125em;
    line-height: 1.4em;
}

ul {
    list-style: circle;
    margin-bottom: 1em;
}

/* ===== Page Elements ===== */
#page {
    background: #F8F5EA;
    padding: 1em 0;
}

#breadcrumbs {
    font-size: 1em;
    line-height: 1.5em;
    line-height: 1.3em;
    list-style: none;
    margin: 0 0 10px 0;
}
#breadcrumbs li {
    display: inline-block;
}
#breadcrumbs li a {
    color: #999;
}
#breadcrumbs li a:hover, #breadcrumbs li a:active {
    color: #666;
}
#breadcrumbs li a:after {
    content: ' » ';
    text-decoration: none;
}

#slideshow {
    background-color: #F8F5EA;
}
#slideshow figure {
    vertical-align: top;
    width: 100%;
}
#slideshow .caption-wrapper {
    padding: 1em;
    vertical-align: top;
    background-color: #E8E5DA;
}
#slideshow h2 {
    color: #A62C27;
    line-height: 1.1em;
    margin-bottom: .25em;
}
#slideshow p {
    display: block;
    font-style: italic;
}

.category-intro {
    *zoom: 1;
    border-bottom: 1px solid #ccc;
    margin-bottom: 2em;
}
.category-intro:after {
    content: "";
    display: table;
    clear: both;
}
.category-intro img {
    margin: 0 0 2em;
    max-height: 300px;
}

.category-description {
    margin: 2em 1em;
}

.category-products .feature {
    border-top: 1px solid #ccc;
}
.category-products img {
    margin: .5em 0 1em;
}

.category-list .product {
    border-top: 1px solid #ddd;
    clear: both;
    *zoom: 1;
    margin-bottom: .5em;
    padding: .5em 0;
}
.category-list .product:after {
    content: "";
    display: table;
    clear: both;
}
.category-list .product img {
    margin: 0;
}

#product-overview {
    margin-bottom: 2em;
    *zoom: 1;
}
#product-overview:after {
    content: "";
    display: table;
    clear: both;
}

#product-img-viewer,
#product-description,
#product-specs {
    clear: both;
}

#product-img {
    margin-bottom: 1.5em;
}
#product-img img {
    margin: 0;
}

#product-thumbs {
    margin: .5em auto 1em;
}
#product-thumbs li {
    display: inline-block;
    margin-right: .25em;
    width: 50px;
    overflow: hidden;
}
#product-thumbs li a {
    display: block;
}
#product-thumbs img {
    height: 50px;
    max-width: inherit;
}

#product-details {
    clear: both;
}

.addthis_toolbox {
    display: inline-block;
    vertical-align: top;
}

.specs, #product-specs {
    border-top: 1px solid #ccc;
    padding: .5em 0;
    margin-bottom: 1em;
}
.specs ul, #product-specs ul {
    list-style: none;
    margin: 0;
}
.specs li, #product-specs li {
    font-family: "Vast Shadow", Arial, sans-serif;
    border-top: 1px solid #eee;
    font-size: 0.78571em;
    line-height: 1.90909em;
}
.specs li span.spec, #product-specs li span.spec {
    float: right;
}
.specs li.your-price, #product-specs li.your-price {
    border-color: #ccc;
    background-color: #FAA420;
    padding: 0 .75em;
    color: #fff;
    font-size: 1.3em;
    font-family: "Archivo Narrow", Arial, sans-serif;
}
.specs li.your-price .spec, #product-specs li.your-price .spec {
    font-size: 1.5em;
}
.specs li.your-discount, #product-specs li.your-discount, .specs li.list-price, #product-specs li.list-price {
    background-color: #E8E5DA;
    padding: 0 .75em;
    font-size: 1em;
    font-family: "Archivo Narrow", Arial, sans-serif;
    color: #444;
}
.specs label:after, #product-specs label:after {
    content: ': ';
}
.specs p, #product-specs p {
    font-size: 1em;
    line-height: 1.5em;
}

.spec {
    font-weight: bold;
}

ul.options {
    margin: .5em 0;
}
ul.options li a {
    display: block;
    font-family: "Archivo Narrow", Arial, sans-serif;
    font-size: 1.21429em;
    line-height: 1.23529em;
    padding: .25em .5em;
    text-align: center;
}
ul.options li.color {
    margin: 0 .5em 1em 0;
    display: inline-block;
    font-family: "Vast Shadow", Arial, sans-serif;
    font-size: 0.78571em;
    line-height: 1.90909em;
    font-weight: bold;
    padding: .5em;
}
ul.options li.color span:first-child {
    min-width: 8em;
    min-height: 3.5em;
}
ul.options li.color span {
    display: block;
    text-align: center;
}
ul.options li.selected a {
    background: #666;
    color: #fff;
}
ul.options.top a {
    width: auto;
    min-height: 150px;
}
ul.options.top li {
    width: 9em;
    margin: 0 .5em 1em 0;
    display: inline-block;
    vertical-align: top;
}
ul.options.top li span {
    margin-top: .4em;
    display: block;
    padding: .5em;
}

a.price-button {
    text-transform: uppercase;
}

.products-group {
    clear: both;
    margin-bottom: 2em;
    padding-bottom: 1em;
    position: relative;
    *zoom: 1;
}
.products-group:after {
    content: "";
    display: table;
    clear: both;
}
#product-details .products-group {
    border-top: 1px solid #ccc;
    padding-top: .25em;
}
.product-list .products-group {
    margin: .5em 0;
}
.products-group > h3 {
    font-size: 1.42857em;
    line-height: 1.575em;
    float: left;
    margin-bottom: 0.2em;
}
.products-group form {
    display: inline-block;
}
.products-group ul {
    *zoom: 1;
}
.products-group ul:after {
    content: "";
    display: table;
    clear: both;
}

.product-list-actions {
    text-align: right;
}

.product-list-group,
.product-list-order {
    margin: 0 0 2em;
    *zoom: 1;
}
.product-list-group:after,
.product-list-order:after {
    content: "";
    display: table;
    clear: both;
}
.product-list-group table,
.product-list-order table {
    margin: .25em 0 1em;
}
.product-list-group td,
.product-list-order td {
    color: #666;
    line-height: 1.35em;
    padding: .25em .25em .25em .5em;
    vertical-align: middle;
}
.product-list-group td a.button,
.product-list-order td a.button {
    margin-bottom: 2px;
    text-align: center;
}
.product-list-group td a.button.apply-piq, .product-list-group td a.button.apply-quote,
.product-list-order td a.button.apply-piq,
.product-list-order td a.button.apply-quote {
    display: none;
}
.product-list-group td,
.product-list-order td {
    display: block;
}
.product-list-group td.quote-labels,
.product-list-order td.quote-labels {
    text-align: right;
    width: 15%;
}
.product-list-group td.quote-subtotals,
.product-list-order td.quote-subtotals {
    width: 15%;
}
.product-list-group .order-totals td:last-child,
.product-list-order .order-totals td:last-child {
    text-align: right;
}
.product-list-group .order-totals td,
.product-list-order .order-totals td {
    display: table-cell;
}
.product-list-group .exp,
.product-list-order .exp {
    background: #444;
    color: #fff;
    padding: .25em .5em;
}
.product-list-group .editable-label,
.product-list-order .editable-label {
    cursor: pointer;
}
.product-list-group .editable-input,
.product-list-order .editable-input {
    display: none;
    font-size: 100%;
    width: 50%;
}

.product-list-order .section-header {
    border-bottom: 0;
}

.product-list-group td {
    border-top: 1px solid #ccc;
}

.alert, .add-product, .order-total {
    border: 1px solid #ccc;
}
.alert td label, .add-product td label, .order-total td label {
    display: inline-block;
    margin: 0 .25em 0 0;
    vertical-align: middle;
}

.add-product-form {
    border: 1px solid #ccc;
    padding: .5em;
    vertical-align: middle;
    *zoom: 1;
}
.add-product-form:after {
    content: "";
    display: table;
    clear: both;
}
.add-product-form form {
    padding: 0;
}
.add-product-form fieldset {
    display: inline-block;
    margin: 0 1em 0 0;
}
.add-product-form label {
    display: inline-block;
    margin-right: .5em;
    vertical-align: text-top;
}
.add-product-form input {
    display: inline-block;
    margin-bottom: 0;
    vertical-align: bottom;
    width: auto;
}

td input {
    margin: 0;
}

.quote-status {
    display: inline-block;
    margin: .25em 0 0 .5em;
    padding: .1em .5em;
}

.quote-print-pdf {
    float: right;
}

.order-item {
    border-top: 1px solid #666;
}
.order-item td {
    padding: .75em .25em .25em .5em;
}

.order-totals {
    font-family: "Vast Shadow", Arial, sans-serif;
    font-size: 1.14286em;
    line-height: 1.3125em;
    font-weight: bold;
}

.order-total, .quote-total {
    font-size: 1.28571em;
    line-height: 1.75em;
    font-weight: bold;
    text-transform: uppercase;
}

a.button.approve, a.button.order, .button.submit {
    text-transform: uppercase;
}

a.button.accept {
    *zoom: 1;
}
a.button.accept:after {
    content: "";
    display: table;
    clear: both;
}

.amount {
    font-weight: bold;
}

.messages {
    clear: both;
    margin-top: 2em;
}

.message {
    border-top: 1px solid #666;
    margin-top: .25em;
    padding: 1em;
}
.message .user {
    float: left;
    font-size: 1.21429em;
    line-height: 1.23529em;
}
.message .date {
    float: right;
    font-style: italic;
}

.message-content {
    clear: both;
    font-size: 1em;
    line-height: 1.5em;
}
.message-content a {
    color: #444;
    text-decoration: underline;
}
.message-content strong {
    color: #444;
}

.section-header, .group-header, .group-footer {
    padding: 0 0 0 0;
    *zoom: 1;
}
.section-header:after, .group-header:after, .group-footer:after {
    content: "";
    display: table;
    clear: both;
}
.section-header h1, .section-header h2, .group-header h1, .group-header h2, .group-footer h1, .group-footer h2 {
    float: left;
}
.section-header h1 em, .section-header h2 em, .group-header h1 em, .group-header h2 em, .group-footer h1 em, .group-footer h2 em {
    color: #666;
    display: block;
    font-size: .75em;
    font-style: normal;
    text-transform: none;
}

.group-header h2 {
    color: #FAA420;
    background-color: #444;
    padding: 0 .5em;
}

.section-header {
    border-bottom: 1px solid #999;
}

.actions {
    border-top: 1px solid #ccc;
    clear: both;
    font-family: "Vast Shadow", Arial, sans-serif;
    font-size: 1em;
    line-height: 1.5em;
    padding-top: .5em;
    *zoom: 1;
}
.actions:after {
    content: "";
    display: table;
    clear: both;
}
.actions li {
    margin: 0;
}
.actions li.hide-text {
    margin-right: .2em;
    position: relative;
}
.actions li.hide-text a:before {
    margin-right: 0;
}
.actions li.hide-text label {
    position: absolute;
    left: 9000px;
}

.view-cat, .add-list, .reply {
    margin-top: 0;
}

.view-cat {
    display: none;
    line-height: 2.4em;
}

.add-list, .reply {
    clear: both;
}

.add-list:before {
    content: "+ ";
}

.products {
    clear: both;
    position: relative;
}

.items {
    margin: 0 -120px 0 0;
    border-top: 1px dotted #ddd;
    padding-bottom: 1em;
}

.item {
    border: 1px dotted #ddd;
    display: inline-block;
    float: left;
    margin: 6px;
    padding: 6px;
    position: relative;
    background-color: rgba(255, 255, 255, 0.6);
    height: 190px;
    width: 168px;
    text-align: center;
    /* *zoom: 1; */
}
.item:after {
    content: "";
    display: table;
    clear: both;
}
.item .slide-image-link {
    overflow: hidden;
    display: block;
    height: 132px;
}
.item .slide-image-caption {
    display: block;
    padding: 0 0 0 0;
    font-family: "Archivo Narrow", Arial, sans-serif;
    font-size: 1em;
    line-height: 1.1em;
}
.slides .item a.slide-image-caption {
    height: 50px;
}
.product-list .item a.thumbnail {
    width: 145px;
    height: 145px;
}
.small .item a.thumbnail {
    width: 65px;
    height: 65px;
}
.item:hover {
    cursor: pointer;
}
.item img {
    max-width: none;
    max-height: 140px
}
#product-details .item {
    height: 133px;
    margin: 0 13px 13px 0;
    width: 133px;
}
.product-list .item {
    height: 145px;
    margin: 0 14px 14px 0;
    width: 145px;
}
.product-list .item:nth-child(4), .product-list .item:nth-child(8), .product-list .item:nth-child(12) {
    margin: 0 0 14px 0;
}

#filtered-content .items {
    margin: 0;
}

#filtered-content .items .item .thumbnail {
    display: inline-block;
    overflow: hidden;
    width: 156px;
    height: 140px;
}
#filtered-content .products .items .item a.slide-image-caption {
    text-align: center;
    height: 50px;
}
#filtered-content .products .items .item .popup-info a.slide-image-caption {
    height: auto;
    text-align: left;
}
#filtered-content .products .items .item .popup-info a.button {
    text-align: left;
}
.item-img {
    overflow: hidden;
}
.item-img img {
    max-height: 150px;
    max-width: none;
}

.filters {
    *zoom: 1;
    margin-bottom: 2em;
}
.filters:after {
    content: "";
    display: table;
    clear: both;
}
.filters h2 {
    margin-bottom: 0.2em;
}
.filters ul {
    list-style: none;
    margin-left: 0;
}

.filter-category li {
    border-bottom: 1px dotted #ddd;
    color: #aaa;
    font-size: 0.78571em;
    line-height: 1.90909em;
    line-height: 44px;
    padding: 0 0 0 1.6em;
    text-indent: -1.6em;
}
.filter-category input[type='checkbox'] {
    display: inline-block;
    margin-right: 0.25em;
    margin-bottom: 0;
    height: 44px;
    width: 44px;
    vertical-align: top;
}
.no-touch .filter-category li {
    font-size: 0.71429em;
    line-height: 2.1em;
    line-height: 1.3em;
    padding: 0.4em 0 0.4em 1.6em;
}
.no-touch .filter-category input[type='checkbox'] {
    height: auto;
    width: auto;
}
.filter-category label {
    color: #444;
    font-size: 1.2em;
    margin-bottom: 0;
}

a.filter-category-title {
    background: #666;
    color: #fff;
    display: block;
    font-family: "Archivo Narrow", Arial, sans-serif;
    font-size: 1.07143em;
    line-height: 1.4em;
    font-weight: normal;
    letter-spacing: 0.01em;
    margin-bottom: 0;
    padding: 0.2em 0.5em;
    position: relative;
    text-transform: uppercase;
}
a.filter-category-title:hover, a.filter-category-title:active {
    color: #fff;
}
a.filter-category-title:after {
    border-right: 6px solid transparent;
    border-left: 6px solid transparent;
    border-top: 6px solid #999;
    content: "";
    display: block;
    height: 0;
    margin-top: -3px;
    position: absolute;
    top: 50%;
    right: 0.5em;
    width: 0;
    z-index: 800;
}

.filter-category > ul {
    height:250px;
    overflow-y:scroll;
    padding:0 0 0 6px;
    border:1px solid #ddd;
}

form.filter_form {
    padding-top:0;
    margin-top:-5px;
}

#filter_form input[type='submit'] {
    vertical-align: top;
    display: inline-block;
}

#filtered-content {
    margin-bottom: 1em;
}

.secondary-products {
    border-top: 1px solid #ccc;
    clear: both;
    *zoom: 1;
}
.secondary-products:after {
    content: "";
    display: table;
    clear: both;
}
.secondary-products .products-group {
    clear: none;
    margin-top: 1em;
}
.secondary-products .products-group .items {
    margin: 0;
}
.secondary-products .products-group .item {
    height: 68px;
    width: 65px;
}

/* === Slideshow and Product Thumb List Scroll Buttons === */
.scroll,
.flex-direction-nav li a {
    background: #E8E5DA;
    border: 2px solid #F8F5EA;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -moz-box-shadow: inset 0 0 15px rgba(0, 0, 0, 0.2), inset 0 0 2px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: inset 0 0 15px rgba(0, 0, 0, 0.2), inset 0 0 2px rgba(0, 0, 0, 0.3);
    box-shadow: inset 0 0 15px rgba(0, 0, 0, 0.2), inset 0 0 2px rgba(0, 0, 0, 0.3);
    color: #888;
    font-weight: bold;
    position: absolute;
    bottom: auto;
    text-align: center;
    z-index: 800;
}
.scroll.back, .scroll.flex-prev,
.flex-direction-nav li a.back,
.flex-direction-nav li a.flex-prev {
    left: 3px;
}
.scroll.ahead, .scroll.flex-next,
.flex-direction-nav li a.ahead,
.flex-direction-nav li a.flex-next {
    right: 3px;
}
.scroll:hover,
.flex-direction-nav li a:hover {
    color: #222;
    cursor: pointer;
}

.scroll {
    font-size: 1.71429em;
    line-height: 1.3125em;
    height: 30px;
    line-height: 30px;
    top: 30%;
    width: 30px;
}

.flex-direction-nav li a {
    font-size: 2em;
    line-height: 1.5em;
    height: 40px;
    line-height: 40px;
    top: 40%;
    width: 40px;
}

.popup-info {
    background: #fff;
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid #ccc;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
    display: none;
    margin-left: -70px;
    padding: 10px 15px;
    position: absolute;
    top: 80%;
    width: 300px;
    z-index: 1000;
    font-size: 18px;
    line-height: 1.75em;
    font-weight: 400;
}
.popup-info:before {
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-bottom: 11px solid #ccc;
    content: "";
    display: block;
    height: 0;
    position: absolute;
    top: -11px;
    left: 142px;
    width: 0;
    z-index: 2000;
}
.popup-info:after {
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #fff;
    content: "";
    display: block;
    height: 0;
    position: absolute;
    top: -10px;
    left: 144px;
    width: 0;
    z-index: 2000;
}
.popup-info .slide-image-caption {
    font-family: "Archivo Narrow", Arial, sans-serif;
    font-size: 1em;
    line-height: 1.4em;
    text-align: left;
}
.popup-info h3 {
    font-size: 0.92857em;
    line-height: 1.61538em;
    margin-bottom: .1em;
}
.popup-info h6 {
    border-top: 1px solid #ccc;
    margin-top: 0.5em;
    padding: 0.5em 0;
}
.popup-info h6 a {
    white-space: nowrap;
}
.popup-info p {
    font-size: 0.71429em;
    line-height: 2.1em;
    line-height: 1.35em;
    text-align: left;
}
.popup-info a.button {
    color: #F8F5EA;
    font-size: 0.65em;
    line-height: 1.75em;
    line-height: 1.3em;
    text-align: left;
    margin: 0 6px 0 0;
}
.popup-info a.button:hover {
    color: #fff;
}
.popup-info a.close {
    background: url("../img/close24.png") 0 0 no-repeat;
    background-size: 95%;
    height: 18px;
    width: 18px;
    position: absolute;
    bottom: 14px;
    right: 12px;
    text-indent: -9999px;
}
.popup-info label, .popup-info input[type='text'] {
    display: inline-block;
    font-family: "Vast Shadow", Arial, sans-serif;
    font-size: 0.85714em;
    line-height: 1.75em;
    line-height: 1.3em;
    margin-bottom: 0;
    vertical-align: middle;
    width: auto;
}
.popup-info .price {
    display: inline-block;
    font-family: "Archivo Narrow", Arial, sans-serif;
    font-size: 1.28571em;
    line-height: 1.75em;
    line-height: 1.3em;
}

.popup-portion {
    border-top: 1px solid #ccc;
    clear: both;
    padding: .5em 0;
}

.popup-portion form {
    padding: 0;
    display: inline;
}

.flatpage #page .container {
    max-width: 850px;
}
.flatpage #page ul {
    list-style: none;
    margin: 0;
}
.flatpage #page ul li {
    display: inline-block;
    margin-right: 1em;
}
.flatpage #page table {
    margin-bottom: 2em;
}
.flatpage #page td {
    padding: .2em;
}
.flatpage #page td img, .flatpage #page td a {
    display: inline;
    line-height: 1em;
    margin-right: .2em;
    vertical-align: middle;
}

.faq #page .container {
    max-width: 750px;
}
.faq #page ul {
    list-style: none;
    margin: 0;
}
.faq #page ul li {
    line-height: 1.4em;
}

.faq-question {
    color: #444;
    font-size: 1.1em;
    font-weight: bold;
    margin: 1em 0 .25em;
}

.faq-answer {
    margin: .25em 0 1.5em;
}

.login #page .container {
    max-width: 500px;
}

.sitemap_list {
    list-style: none;
    margin-left: 0;
}
.sitemap_list li {
    border-top: 1px solid #ddd;
    font-size: 0.85714em;
    line-height: 1.75em;
    letter-spacing: -0.01em;
    line-height: 1.3em;
    padding: .5em 0;
}

/* === little classes === */
.note {
    font-size: 0.92857em;
    line-height: 1.61538em;
    font-style: italic;
}

.more, .update, .remove {
    clear: both;
}

.add-to-products, .order {
    margin-bottom: .5em;
}

.add-to-products.button {
    background: #A62C27;
}

.edit-product.button {
    background: #d08a1f;
}

.readmore {
    font-weight: bold;
    margin-left: .2em;
}

.numbers {
    font-family: "Vast Shadow", Arial, sans-serif;
}
.numbers td {
    padding: .75em .25em .75em .5em;
    font-weight: bold;
}
.numbers label {
    font-weight: normal;
}

.unit {
    border-right: 1px solid #999;
    margin-right: 1em;
    padding-right: 1em;
}

.total {
    font-size: 1.2em;
    font-weight: bold;
    white-space: nowrap;
}

.error {
    color: #A62C27;
}

.form-box {
    margin: 1em 0;
    padding: .5em;
}

.bignum {
    display: inline-block;
    font-size: 1.2em;
}

div.product-list {
    width: 48%;
    min-height: 200px;
    display: inline-block;
    margin: 10px 12px 0 0;
    padding: 10px;
    border: 1px dotted #ccc;
    background-color: rgba(255,255,255,0.6);
}

div.image-holder {
    float: left;
    width: 35%;
    max-height: 180px;
    overflow: hidden;
    border: 1px solid #ddd;
    background-color: #fff;
    padding: 2px;
}

div.text-holder {
    float: left;
    width: 65%;
    padding: 0 0 0 10px;
}

.product-list div.text-holder > p {
        font-size: 96%;
}

article.instructable {
    padding: 20px 0;
    border-top: 1px solid #ccc;
}
article.instructable .category {
    right: 0px;
    position: absolute;
    padding-right: 10px;
}
article.instructable h3 {
    display: inline;
}

#recaptcha_image img {
    width: 240px;
}

/* body */
.loading .flex-slideshow {
    opacity: 0;
}
.flex-slideshow {
    position: relative;
    margin: 0 auto;
    /*ul*/
    /*li*/
    /*li*/
}
.flex-slideshow ul {
    margin: 0;
}
.flex-slideshow .slides > li {
    display: none;
    -webkit-backface-visibility: hidden;
    /* Hide the slides before the JS is loaded. Avoids image jumping */
}
.flex-slideshow .slide-container {
    position: relative;
}
.flex-slideshow .caption-wrapper h2 {
    margin-top: 0;
}
.flex-slideshow .caption-wrapper p {
    min-height: 1.75em;
}

/* // Dynamically added elements for paging/controls <ol class="flex-control-nav flex-control-paging">
    <li>
        <a class="flex-active">1</a>
    </li>
</ol>*/
.flex-control-nav li, .flex-direction-nav li {
    display: inline-block;
}
.flex-control-nav a, .flex-direction-nav a {
    cursor: pointer;
    display: block;
}

.flex-control-nav {
    position: absolute;
    z-index: 9999;
    right: 0;
    width: 100%;
    display: none;
    text-align: center;
    padding: 0 2.5em;
}
.flex-control-nav a {
    font-size: 1em;
    line-height: 1em;
    color: #888;
    background-color: #fff;
    border: 1px solid #c8c8c8;
    padding: .3em .5em;
    margin-left: .5em;
}
.flex-control-nav a:hover, .flex-control-nav a:focus {
    color: #444;
    background-color: #ccc;
    border-color: #bbb;
}
.text .flex-control-nav a {
    text-decoration: none;
}
.flex-control-nav .flex-active {
    color: #666;
    background-color: #FAA420;
}
.touch .flex-control-nav a {
    /* Larger touch target */
    padding: .5em .75em;
}

/*<ul class="flex-direction-nav">
        <li>
                <a class="flex-prev" href="#">&lt;</a>
        </li>
        <li>
                <a class="flex-next" href="#">&gt;</a>
        </li>
</ul>*/
.flex-direction-nav {
    margin: 0 0 -1em 0;
}
.flex-direction-nav .flex-prev:hover, .flex-direction-nav .flex-prev:focus, .flex-direction-nav .flex-next:hover, .flex-direction-nav .flex-next:focus {
    filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
    opacity: 1;
}
.text .flex-direction-nav .flex-prev, .text .flex-direction-nav .flex-next {
    text-decoration: none;
}
.touch .flex-direction-nav {
    display: none;
}
.home-slideshow .flex-direction-nav .flex-prev:hover, .home-slideshow .flex-direction-nav .flex-prev:focus, .home-slideshow .flex-direction-nav .flex-next:hover, .home-slideshow .flex-direction-nav .flex-next:focus {
    filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
    opacity: 1;
}

/* ! ==== Media Queries ==== */
/* For vertical iPhone, let's make the images on homepage full width */
/* For horizontal iPhone, let's make #nav2 and #site-footer 2 columns */
/* @media all and (min-width: 479px) and (max-width: 599px) { */
@media all and (min-width: 37.4375em) {
    #stackbin-social {
        float: right;
    }
    #stackbin-social ul {
        list-style: none;
        list-style-image: none;
        margin: 10px 0 auto;
    }
    #stackbin-social li {
        display: inline-block;
        padding: 5px 10px 0 0;
    }
    #stackbin-social li:last-child {
        padding: 5px 0 0 0;
    }
        #stackbin-social a {
                color:#FAA420;
        }
        #stackbin-social a:hover {
                color: #fff;
        }
}
/* Test objects – can be deleted later */
#test-window-size {
    color: #999;
    font-family: Verdana, sans-serif;
    font-size: 0.71429em;
    line-height: 2.1em;
    line-height: 1em;
    position: fixed;
    top: 2px;
    right: 2px;
    z-index: 10000;
}

@media print {
    * {
        background: transparent !important;
        color: #000 !important;
        /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a, a:visited {
        text-decoration: underline !important;
    }

    *[role="main"] a[href]:after {
        content: " (" attr(href) ")";
        font-size: 75%;
    }

    *[role="main"] abbr[title]:after {
        content: " (" attr(title) ")";
        font-size: 75%;
    }

    .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after {
        content: "";
    }

    pre, blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group;
        /* h5bp.com/t */
    }

    tr, img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }
    p, h2, h3 {
        orphans: 3;
        widows: 3;
    }

    h2, h3 {
        page-break-after: avoid;
    }
}
/* Additional print styles */
@media print {
    #stackbin-social,
    #user-links,
    #secondary-links,
    #mobile-search,
    #primary-links,
    #info-bar,
    .actions,
    #rightBox,
    #product_more,
    #site-footer,
    #site-info,
    #footer-links,
    #mobile-footer-links,
    #slideshow,
    .scroll.back,
    .scroll.ahead,
    .filters,
    #product-thumbs,
    #breadcrumbs {
        display: none;
    }

    a.button {
        display: none;
    }

    #logo img {
        width: 125px;
        height: auto;
    }

    #product-img-viewer,
    #product-details,
    #product-specs,
    #product-description {
        width: 48%;
    }

    #product-details {
        float: right;
        clear: none;
    }

    #product-img-viewer,
    #product-specs,
    #product-description {
        float: left;
        clear: left;
    }

    ul.options li a {
        text-decoration: none !important;
    }

    ul.options.top li {
        width: auto;
    }
    ul.options.top li a {
        min-height: 0;
        padding: 0;
    }
    ul.options.top li a img {
        display: none;
    }
    ul.options.top li a span {
        padding: 0 .25em .25em .25em;
    }

    ul.options li.color {
        margin: 0 .1em 0 0;
        padding: 0 .5em;
    }
    ul.options li.color:last-child {
        margin: 0;
    }
    ul.options li.color span:first-child {
        display: none;
    }

    #product-overview {
        margin: 0;
    }

    .specs, #product-specs, #product-specs {
        margin-bottom: 0;
    }
.spec a {
        color: #b90000;
        text-decoration: none;
}
.spec a:hover {
        color: #ff0000;
}

    #product-img img {
        max-height: 300px;
    }
}
/* Keep this at the bottom since it will create a huge set of data */
/* ===== This is a small set of icons imported from IcoMoon ===== */
@font-face {
    font-family: 'icomoon';
    src: url("../fonts/icomoon.eot");
    src: url("../fonts/icomoon.eot?#iefix") format("embedded-opentype"), url("../fonts/icomoon.woff") format("woff"), url("../fonts/icomoon.ttf") format("truetype"), url("../fonts/icomoon.svg#icomoon") format("svg");
    font-weight: normal;
    font-style: normal;
}
/* Use the following CSS code if you want to use data attributes for inserting your icons */
[data-icon]:before {
    font-family: 'icomoon';
    content: attr(data-icon);
    speak: none;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
}

/* Use the following CSS code if you want to have a class per icon */
/*
Instead of a list of all class selectors,
you can use the generic selector below, but it's slower:
[class*="icon-"]:before {
*/
[class^="icon-"], [class*=" icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-twitter:before {
    content: "\f099";
}

.icon-facebook:before {
    content: "\f09a";
}

.icon-pinterest:before {
    content: "\f0d2";
}

.icon-youtube-play:before {
    content: "\f16a";
}

.icon-instagram:before {
    content: "\f16d";
}

.icon-search:before {
    content: "\f002";
}

.icon-download:before {
    content: "\e3c5";
}

.icon-envelop:before {
    content: "\e37e";
}

.icon-mail:before {
    content: "\e37e";
}

.icon-bubbles:before {
    content: "\e000";
}

.icon-user:before {
    content: "\e006";
}

.icon-printer:before {
    content: "\e3ac";
}

.icon-add:before {
        content:"\e1d0"
}