/* Global Reset */
html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td { margin: 0; padding: 0; }
table{ border-collapse: collapse; border-spacing: 0;}
fieldset,img { border: 0; }
address, caption, cite, code, dfn, em, strong, th, var { font-style: normal; font-weight :normal; }
li { list-style: none; }
caption,th { text-align: left;}
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }
q:before, q:after { content: n''; }
abbr, acronym { border: 0; font-variant: normal; }
sup { vertical-align: text-top; }
sub { vertical-align: text-bottom; }
input, textarea, select { font-family: inherit; font-size: inherit; font-weight: inherit; }
input, textarea, select { *font-size: 100%; }
legend { color: #000; }

/* Layout */
body { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 12px; line-height: 1; color: #49595f; background: #dee2e2; }
.full { float: left; width: 100%; }
.split { float: left; width: 50%; }
.auto { width: 1152px; margin: 0 auto; }
#wrap { background: #fff; }
#content { padding: 18px 0; background: #fff url(images/bg.gif) 0 0 repeat-y; }
#orders #content { padding: 18px 0; background: #fff url(images/bg-orders.gif) 0 0 repeat-y; }
#orders.nolegend #content { background: #fff url(images/bg.gif) 0 0 repeat-y; }
#compose { width: 768px; float: left; }
#orders.nolegend #compose { width: 960px; }

/* Header */
#header { background: #66696E; text-align: center; padding: 9px 0; }

/* Spine */
#spine { width: 192px; float: left; padding: 36px 0 0 0; }
#spine ul { margin: 0; }
#spine li { padding: 9px 18px; background: none; line-height: 1; }
#spine li a { text-decoration: none; color: #96a4a9; display: block; }
#spine li a:hover { color: #00AEEF; }
#spine li.on { background: #fff; border: 1px solid #dee2e2; border-left: 3px solid #dee2e2; border-right: none; }
#spine li.on a { color: #ed028c; }
#spine li.on a:hover { color: #ed028c; }

/* Legend */
#legend { width: 190px; float: right; color: #5d6c72; font-size: 11px; border: 1px solid #dee2e2; padding: 17px 0 0 0; }
#legend li { background: none; padding: 0 0 9px 0; text-align: center; }

/* Ordering */
#stock { width: 924px; float: left; margin: 0 18px 18px 18px; }
ul#options { margin: 0 18px 18px 18px; float: left; display: inline; width: 924px; }
#options li { padding: 0; margin: 0; background: none; line-height: 1; float: left; display: inline; border: 0; }
#options li#filter { border: 1px solid #dee2e2; font-size: 11px; position: relative; padding: 3px; position: relative; width: 100px; font-weight: bold; color: #49595f; }
#options li#filter ul { top: 0; right: -1px; position: absolute; border: 1px solid #dee2e2; border-top: 0; border-bottom: 0; background: #fff; margin: 0; width: 60px; }
#options li#filter ul li { display: none; float: none; border-bottom: 1px solid #dee2e2; font-weight: normal; }
#options li#filter ul li.on { display: block; }
#options li#filter ul li.on a { background: #dee2e2; }
#options li#filter ul.active li { display: block; }
#options li#filter ul li a { text-decoration: none; color: #49595f; display: block; padding: 3px; }
#options li#neworder { float: right; }
#options li#neworder a { background: #ed028c; color: #fff; text-decoration: none; padding: 6px; -webkit-border-radius: 4px; -moz-border-radius: 4px; text-align: center; }
#backtolist { float: right; margin: 24px 18px 0 0;}
#backtolist a { background: #ed028c; color: #fff; text-decoration: none; padding: 6px; -webkit-border-radius: 4px; -moz-border-radius: 4px; text-align: center; }
#categories { width: 294px; float: left; margin: 0 18px 0 0; border: 1px solid #dee2e2; border-bottom: none; }
#products { width: 294px; float: left; margin: 0 18px 0 0; border: 1px solid #dee2e2; border-bottom: none; }
#products #list { max-height: 322px; overflow: auto; }
#selected { width: 294px; float: left; border: 1px solid #dee2e2; }
#orders #compose h3 { padding: 6px 12px; margin: 0; color: #49595F; background: #dee2e2; }
#categories ul { margin: 0; }
#products ul { margin: 0; }
#categories li  { background: none; padding: 0; border-bottom: 1px solid #dee2e2; }
#products li { background: none; padding: 3px 12px; border-bottom: 1px solid #dee2e2; }
#products p { margin: 9px 12px 0 12px; text-align: right; float: right; display: inline; }
#categories li ul, #products li .details { display: none; }
#categories li a { padding: 3px 12px; display: block; text-decoration: none; }
#products li a { text-decoration: none; }
#products li input.qty { width: 40px; float: right; }
#basket td input.qty { width: 40px; }
#products li input.checkbox { float: right; }
#categories li a:hover, #products li a:hover { color: #00AEEF; }
#categories li.on a { background: #00AEEF url(images/next-blue.gif) 100% 50% no-repeat; color: #fff; }
#products li.on { background: #00AEEF url(images/next-blue.gif) 100% 50% no-repeat; }
#products li.on a { color: #fff; }
#selected .details { float: left; width: 296px; }
#selected .details dl { margin: 0 12px 9px 12px; float: left; display: inline; width: 192px; }
#selected .details dl.overprintdata { width: 270px; line-height: 1; }
#selected .details dl.overprintdata dt { width: 80px; float: left; padding: 8px 0 0 0; }
#selected .details dl.overprintdata dd { margin: 12px 0 0 89px; width: 181px; }
#selected .details dl.overprintdata dd input { width: 176px; }
#selected .details .preview { margin: 27px 12px 9px 0; display: inline; float: right; width: 66px; }
#selected .details .preview img { float: right; width: 66px; }
#selected input.addtobasket { margin: 12px; float: right; display: inline; clear: right; }
#summary { border: 1px solid #dee2e2; width: 922px; float: left; margin: 0 18px 18px 18px; border-bottom: none; max-height: 255px; overflow: auto; }
#summary table { margin: 0; width: 100%; }
#summary th { padding: 3px 12px; }
#summary td { padding: 3px 12px; }
#summary table a.view { display: block; margin: 3px 0; width: 15px; height: 10px; background: url(images/view.gif) 0 0 no-repeat; }
#summary table a.view span { display: none; }
#basket { border: 1px solid #dee2e2; width: 922px; float: left; margin: 0 18px 18px 18px; border-bottom: none; }
#basket table { margin: 0; width: 100%; }
#basket th { padding: 3px 12px; }
#basket td { padding: 3px 12px; }
#basket table a { float: right; margin: 3px 0; }
#reference, #invoice, #dates, #delivery { border: 1px solid #dee2e2; width: 294px; float: left; margin: 0 0 18px 18px; display: inline; }
.summary #compose dl { margin: 0 12px 9px 12px; }
.summary #compose dd input, .summary #compose dd textarea { width: 100%; border: 1px solid #dee2e2; } 
.summary #compose dd input:focus, .summary #compose dd textarea:focus  { border-color: #00AEEF; }
#instructions { border: 1px solid #dee2e2; width: 608px; float: left; margin: 0 0 18px 18px; }
#orders #compose .submit { text-align: right; }
#orders #people { position: relative; width: 270px; float: left; margin: 9px 12px 0 12px; display: inline; }
#people ul { text-align: center; width: 270px; overflow: hidden; position: relative; margin: 0; }
#people ul li { border: 0; padding: 18px 0 0 0; width: 67px; background: url(images/people.gif) 0 0 no-repeat; float: left; }
#people ul li a { text-decoration: none; }
#people li.on { background: url(images/people-on.gif) 0 0 no-repeat }
#people ul li img { width: 32px; height: 32px; }
#people .jcarousel-prev { width: 19px; height: 100%; background: #ed028c url(images/prev.gif) 50% 50% no-repeat; position: absolute; top: 0; left: 0; z-index: 10; cursor: pointer; }
#people .jcarousel-next { width: 19px; height: 100%; background: #ed028c url(images/next.gif) 50% 50% no-repeat; position: absolute; top: 0; right: 0; z-index: 10; cursor: pointer; }
#people .jcarousel-prev-disabled, #orders #compose #people .jcarousel-prev-disabled:hover, #orders #compose #people .jcarousel-next-disabled, #orders #compose #people .jcarousel-next-disabled:hover { background-color: #49595F; background-image: none; cursor: default; }
.jcarousel-clip { overflow: hidden; position: relative; }
a.close { position: absolute; top: 0; right: 0; margin: -45px -45px 0 0; display: block; }
.error { color: #ed028c; }

/* Page */
ul#page { float: left; margin: 0 18px 18px 18px; border-bottom: 1px solid #dee2e2; width: 924px; }
#page li { padding: 0; float: left; background: none; line-height: 1; border: 0; }
#page li a { padding: 6px 9px; color: #96a4a9; float: left; display: block; text-decoration: none; }
#page li a:hover { color: #00AEEF; }
#page li.on a { border: 1px solid #dee2e2; border-bottom: none; background: none; color: #ed028c; }

/* Section */
#section { font-size: 11px; width: 384px; float: right; text-align: right; }
a#logout{ margin: 0 0 0 6px; background: #66696E; color: #fff; text-decoration: none; padding: 6px; -webkit-border-radius: 4px; -moz-border-radius: 4px; }

/* Typography */
ul, dl, table { margin: 0 18px 18px 18px; line-height: 16px; }
th { padding: 3px 6px; font-weight: bold; border-bottom: 3px solid #dee2e2; }
td { padding: 3px 6px; border-bottom: 1px solid #dee2e2; }
dt { margin: 9px 0 0 0; color: #49595F; font-weight: bold; }
dd { line-height: 16px; }
li { padding: 0 18px 9px 18px; background: url(images/bullet.gif) 4px 4px no-repeat; color: #96a4a9; }
h1 { font-size: 24px; line-height: 1; margin: 18px 18px 24px 18px; color: #96a4a9; font-weight: bold; }
#orders h1 { margin-bottom: 9px; }
h2 { font-size: 18px; line-height: 1; margin: 0 18px 18px 18px; color: #000; font-weight: bold; }
h3 { font-size: 12px; line-height: 1; margin: 0 18px 9px 18px; color: #49595F; font-weight: bold; }
p { margin: 0 18px 18px 18px; line-height: 18px; }
strong { font-weight: bold; }
em { font-style: italic; color: #666; }
.hidden { display: none; }
.clear { clear: both; }
.title { float: right; font-weight: bold; border-bottom: 3px solid #dee2e2; }

/* Images */
.inline { padding: 18px; border: 1px solid #dee2e2; width: 502px; float: left; font-weight: bold; color: #96a4a9; font-size: 13px; }
.inline img { float: left; margin: 0 18px 0 0; display: inline; }

/* Links */
a { text-decoration: underline; color: #ed028c; }
a:hover { text-decoration: none; }
a img { border: 0; }

/* Forms */
.submit { margin: 0 18px 18px 18px; clear: both; }
input, textarea { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 12px; line-height: 16px; color: #000; }
input.sml { width: 40px; }

/* Footer */
#footer { background: #dee2e2; font-size: 11px; color: #5d6c72; }
#footer dl { display: inline; float: right; padding: 9px 18px; width: 156px; margin: 0; }