/* Folksy - Main styles
----------------------------------------------------------------*/

/* Imports
----------------------------------------------------------------*/

@import url("//fonts.googleapis.com/css?family=Lora:400,700");

/* Clearfix
----------------------------------------------------------------*/

.clearfix:after,
section.unavailable:after,
.progress ol:after,
.share-prompt .share:after,
.share-prompt:after,
ul.share:after,
.selling-intro .options:after,
.container:after,
ul.gallery:after {display: block; clear: both; visibility: hidden; height: 0; content: ".";}

/* Global Reset - Plus useful type styles
----------------------------------------------------------------*/

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; outline:0; font-size:100%; vertical-align:baseline; background:transparent;}
article, aside, main, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block; position: relative;}

nav ul { list-style:none; }
blockquote, q { quotes:none; }
blockquote:before, blockquote:after, q:before, q:after { content:''; content:none;}

a {margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent;}
a img {border:0}
figure {position:relative}

ins {background-color:#ff9; color:#000; text-decoration:none;}
mark {background-color:#ff9; color:#000; font-style:italic; font-weight:bold;}
del {text-decoration: line-through;}

abbr[title], dfn[title] {/* border-bottom:1px dotted; */ cursor:help;}
abbr {border: none;}
abbr[title="and"] {font-style: italic; border: none; font-family: Baskerville, "Baskerville old face", Garamond, "Times New Roman", serif;}

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

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 {vertical-align:middle;}
select, input, textarea, button {font-family: "Helvetica Neue", Helvetica, sans-serif; }
pre, code, kbd, samp {font-family: consolas, 'andale mono', 'courier new', monospace; font-size: 0.813em;}

html { overflow-y: scroll; } /* always force a scrollbar in non-IE */
a:hover, a:active { outline: none; } /* Accessible focus treatment: people.opera.com/patrickl/experiments/keyboard/test */

a, a:active, a:visited {color: ;}
a:hover {color: ;}

ul, ol { margin-left: 1em; }
ol { list-style-type: decimal; }

nav ul, nav li { margin: 0; } /* Remove margins for navigation lists */

small {font-size: 85%; }
strong, th {font-weight: bold; }

td, td img {vertical-align: top; }

sub, sup {font-size: 0.625em; text-transform: uppercase; letter-spacing: 1px;}

pre {
   white-space: pre-line; /* CSS 3  */
   white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
   white-space: -pre-wrap;      /* Opera 4-6 */
   white-space: -o-pre-wrap;    /* Opera 7 */
   word-wrap: break-word;       /* Internet Explorer 5.5+ */
  }

textarea {overflow: auto;}
.ie6 legend, .ie7 legend {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="checkbox"].checkbox-solo { vertical-align: middle; margin-right: 0.5em;}


label, input[type=button], input[type=submit], button {cursor: pointer;}

/* webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea {margin: 0;}

button { width: auto; overflow: visible; }

/* colors for form validity */
input:valid, textarea:valid   {  }
input:invalid, textarea:invalid {/*background: #f8f7e7; */ color: #ff1e00;}


/* These selection declarations have to be separate.*/
::-moz-selection{ background: #d5d5d5; color:#000; text-shadow: none; }
::selection { background:#d5d5d5; color:#000; text-shadow: none; }

/*  webkit-tap-highlight-color */
a:link { -webkit-tap-highlight-color: #beeaf0; }


/* bicubic resizing for non-native sized IMG:
   code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/ */
.ie7 img { -ms-interpolation-mode: bicubic; }

hr {display: none;}

.divide  {padding-top: 1em; border-top: 1px solid #d5d5d5; margin-top: 1em;}
.no-divide, .home section h2.no-divide {padding: 0; border: none;}

/* Hiding things
----------------------------------------------------------------*/

/* for image replacement */
.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }

/* Hide for both screenreaders and browsers
   css-discuss.incutio.com/wiki/Screenreader_Visibility */
.hidden { display: none; visibility: hidden; }

/* Hide only visually, but have it available for screenreaders
   www.webaim.org/techniques/css/invisiblecontent/  &  j.mp/visuallyhidden  */
.visuallyhidden { position: absolute !important;
  clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
  clip: rect(1px, 1px, 1px, 1px); }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }

/* Body
----------------------------------------------------------------*/

body {
  background: #fff;
  font: 75%/1.5 "Helvetica Neue", Helvetica, Sans-Serif;
  color: #404040;
  -webkit-font-smoothing: antialiased;
  text-rendering:optimizeLegibility;
  text-rendering: geometricPrecision; /* need to re-read about this setting */
  }

main[role=main] {
  background: #f6f6f4;
  padding-top: 4.2em;
  }
  
body.anon main[role=main] {padding-top: 0;}

/* colours */

/* #ffc20f  yellow */
/* #b2c248  green */
/* #f15941  red */
/* #ef8fb4  pink */
/* #887cba  purple */
/* #5bc4bf  cyan */

/* Useful lists
----------------------------------------------------------------*/

ul {margin: 0; list-style-type: none;}

.x-list {overflow: hidden;}
.x-list li {float: left; margin-left: 1em}
.x-list li:first-child {margin: 0;}

.primary-secondary .secondary a {display: inline-block; margin-top: 4px}

dl {margin-bottom: 1.5em}
dt {font-weight: bold;}
dd {}

dl.standard {margin: 1em 0;}
dl.standard dd {margin-bottom: 1em;}
dl.standard dd:last-child {margin-bottom: 0;}

.tab-navigation {border-bottom: 1px solid #ddd; margin-bottom: 1.5em; }
.tab-navigation > li {margin-bottom: -1px; float: left;}
.tab-navigation li {}

.tab-navigation > li > a {
  border: 1px solid transparent;
  -webkit-border-radius: 4px 4px 0 0;
  -moz-border-radius: 4px 4px 0 0;
  border-radius: 4px 4px 0 0;

  padding: 8px 12px;
  margin-right: 2px;

  display: block;
  }
.tab-navigation > li > a:hover {border-color: #eee #eee #ddd; background: #eee;}

.tab-navigation li a.selected {
  color: #333;
  background-color: #f6f6f4;
  border: 1px solid #ddd;
  border-bottom-color: #f6f6f4;
  cursor: default;
  font-weight: bold;
  background: -moz-linear-gradient(center top , #fff, #f6f6f4) repeat scroll 0 0 transparent;
  background: -webkit-gradient(linear, center top, center bottom, from(#fff), to(#f6f6f4));
  }


.tab-navigation:before, .tab-navigation:after {content: ""; display: table;}
.tab-navigation:after {clear: both;}

/* some specific styles for the manage items view */
.tab-navigation li.active a,
.tab-navigation li.hidden-items a,
.tab-navigation li.outofstock a
 {
  color: #333;
  background-color: #f6f6f4;
  border: 1px solid #ddd;
  font-weight: normal;
  background: -moz-linear-gradient(center top , #fff, #f6f6f4) repeat scroll 0 0 transparent;
  background: -webkit-gradient(linear, center top, center bottom, from(#fff), to(#f6f6f4));

  }

.tab-navigation li.active a.selected,
.tab-navigation li.hidden-items a.selected,
.tab-navigation li.outofstock a.selected {
  font-weight: bold;
  border-bottom-color: #f6f6f4;
  }

.tab-navigation li.expired a.selected,
.tab-navigation li.draft a.selected {
  background: none;
  border: none;
  color: #333;
  font-weight: bold;
  }

/* Shop announcements */
section#shop-announcement {
  background-color: #EEE;
  border-radius: 4px;
  border: 1px solid #DDD;
  margin: 0;
  padding: 5px;
  margin-bottom: 2em;
}
section#shop-announcement h2, section#shop-announcement p {
  margin-top: 4px;
  margin-left: 5px;
  margin-bottom: 4px;
  margin-right: 0;
  padding: 0;
}
section#shop-announcement h2 {
  font-weight: bold;
}
/* /Shop announcements */


/* Links
-------------------------------------------------------------- */

a {
  color: /*#047da3*/ #4083A9;
  text-decoration: none;
  -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;
  }

a:hover {color: #205F82; text-decoration: none;}

/* Load more items button/link and other main call to action buttons and links */
a.more-items, .basket-summary a, a.power, .card-action p.current {
  background: #b1c042;
    /*border-radius: 0.25em;*/
    color: #fff;
    letter-spacing: 1px;
    padding: 0.75em 0.5em;
    text-transform: uppercase;
    font-weight: bold;
    line-height: 1;
    font-size: ;
    text-shadow: 0px 1px 0px rgba(0,0,0,0.2);
    display: block;
    width: 30.578512%;
    text-align: center;
    margin: 0 auto;
  }

a.power {width: auto; display: inline-block;}
a.power.middle, .card-action p.current, input[type="submit"].power.middle {display: block;  width: 30.578512%;}
input[type="submit"].power.middle {margin: 0 auto;}

a.more-items:hover, .basket-summary a:hover, input[type="submit"]:hover, a.power:hover, button.submit:hover {background: #9dab35;}
a.button {display: inline-block}

/* remove transitions to these links */
ul.slide-controls li a, .share li a.pin-it-button {-webkit-transition: none; -moz-transition: none; -o-transition: none; transition: none;}

/* stronger style for gift guide intro links */
.alt-links {margin-bottom: 2em;}
.alt-links a {
  display: inline-block;
  margin-right: 2em;
  /*
  background: #4083A9;
  padding: 0.25em 0.5em;
  color: #fff;
  border-radius: 4px;*/
  }

.alt-links a:hover {}
.alt-links a:nth-child(2) {margin-left: 2em; position: relative;}
.alt-links a:nth-child(2):before {
  content: "";
  background: url(../images/colour-wheel.png) no-repeat 0 0;
  height: 16px;
  width: 16px;
  display: block;
  position: absolute;
  left: -22px;
  }


/* Layout
----------------------------------------------------------------*/

.container {
  margin: 0 auto;
  width: 90%;
    position: relative;
    max-width: 81.5em; /* page width in ems based on a base font size of 12px */
  }

/* 30px margin = 3.0674847% */

.one {width: 22.699387%;} /* 222px wide */
.two {}
.three {}
.four {}


section[role="main"] {margin-bottom: 3em;}

/* two column layouts */
.two-column section[role="main"] {width: 74.233129%; margin-bottom: 3em; float: left;} /* 726px / 978px */

/* full-width layout */
.full-width section[role="main"] {width: 100%;}
body.full-width-alt section[role="main"] {float: none!important; overflow: hidden; width: auto;}


section[role="navigation"], .shop aside {
  float: left;
  width: 22.699387%;
  margin-right: 3.0674847%
  }

.checkout aside {float: right; width: 22.699387%; margin-left: 3.0674847%; }

body.two-column section[role="main"] {float: left;}
body.two-column.item section[role="main"] {width: 65.644172%;} /* 642 / 978 the item page main column is narrower */

.item aside {
  float: right;
  width: 31.288344%; /* 306 / 978 */
  margin-left: 3.0674847%;
  }

.standard aside {float: right; margin-left: 3.0674847%; width: 22.699387%;}





/* Headers and base type
----------------------------------------------------------------*/

h1, h2, h3, h4 {color: #404040; font-weight: 300; line-height: 1.3;}

h1 { font-size: 2em; /* 24px */}
h2 { font-size: 1.5em; /* 18px */}
h3 { font-size: 1.167em; /* 14px */ }
h4 {letter-spacing: 0px;}

p {font-weight: 400; margin: 0 0 1.5em 0;}


/* Tables */

table {border-collapse: collapse; width: 100%; margin: 1em 0;}
thead {}
tr {}
th {text-align: left;}
td, th {padding: 0.5em; border-bottom: 1px solid #d5d5d5;}
table th span {font-weight: normal; color: #555555;}

/* add row link */
tfoot tr.add-row td {border-bottom: none; padding: 0.75em 0.5em;}
tfoot tr.add-row td a {background: url(../images/icons.png) no-repeat 0 -335px; padding: 0.25em 0 0.25em 2em;}

td {text-transform: capitalize;}
td.normalise {text-transform: none;}
.search td, td p {text-transform: none;}
tr:nth-child(even) {}
tr:hover {}

td.total {font-weight: bold; text-align: right;}
td.figure, th.figure {text-align: right;}
td.figure p, th.figure p, th.figure span {font-weight: normal; margin: 0;}
table td p {margin: 0;}

/* Basic styles for the basic text table */
table.standard td, table.standard th {padding: 0.5em 0;}
table.standard th {color: #000;}

.account table td form, .account table th form, .account table th input[type="submit"] {margin: 0;}

table.block {margin-bottom: 2em;}

td.new_categorisation img {display: inline-block; margin: 0.417em 0.5em 0 0.5em;}
td.new_categorisation span {color: #8a8a8a;}

/* Unread messages */
tr.unread td {font-weight: bold; background: #fefef5;}

form.update-quantity {padding: 1em; border: 1px solid transparent; overflow: hidden;}

form.update-quantity.active {background: #fcf8e3; border: 1px solid #fbeed5;}
form.update-quantity input[type="number"] {}
div.update-form a, div.update-form input[type="submit"] {display: inline-block; margin-right: 0.5em;}
div.update-form a {margin-top: 2px;}
td p.cost {text-transform: none; margin: 0.5em 0}
p.cost strong {color: #000;}
p.cost span {/* display: block; */ color: #8a8a8a; font-size: 0.875em;}

.table-image {margin: 0 0.5em 1em 0;}

/* sortable headers */
table.data-table thead th a {
  padding: 0.5em;
  height: 100%;
  display: block;
  }

table thead th a.up, table thead th a.desc  {
  background: url(../images/icons.png) no-repeat 4px -1602px;
  padding-left: 1.5em;
  color: #444;
  }
table thead th a.desc {background: url(../images/icons.png) no-repeat 4px -1530px;}

table.data-table thead th {padding: 0;}

.shipping-information p.region {color: #8a8a8a; font-size: 11px;}
.posting-cost span {display: inline-block; color: #8a8a8a; margin-left: 0.5em;}

/* Discount code styles for the basket */

div.discount {
  font-size: 1.1em;
  color: #6658a1;
  }

th.discount-message {font-weight: 400;}
  
th.discount-message span {
  display: inline-block;
  border-radius: 0.3em;
  border: 1px solid #887cba;
  padding: 0.2em 0.4em;
  background: #fff;
  color: #6658a1;
  }
    
span.discount-code {
  display: block;
  margin-bottom: 1em;
  font-weight: 400;
  }

span.discount-code span {
  display: inline-block;
  border: 1px solid #887cba;
  border-radius: 0.3em;
  padding: 0.1em 0.4em;
  background: #fff;
  color: #6658a1;
  }

a.submit.discount {background: #887cba;}
a.submit.discount:hover,
a.submit.discount:focus {background: #6658a1;}

/* Site update - temporary notice
----------------------------------------------------------------*/
#site-update {padding: 1em; background: #edfafe; margin: 0; text-align: center; position: relative;}
#site-update strong {padding: 1em 0 1em 2.5em; background: #edfafe url(../images/icons.png) no-repeat 0 -961px;}

#site-update:before,
#site-update:after,
.menu:before,
.menu:after,
.error section[role="main"] figure:before,
.error section[role="main"] figure:after {
  background: none repeat scroll 0 0 transparent;
    bottom: 4px;
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0 4px 4px rgba(0, 0, 0, 0.2);
    content: " ";
    height: 51%;
    position: absolute;
    text-align: left;
    width: 90%;
  }

#site-update:before, .menu:before, .error section[role="main"] figure:before {
   -moz-transform: skew(-2deg) rotate(-0.5deg);
   -webkit-transform: skew(-2deg) rotate(-0.5deg);
    left: 4px;
    z-index: -2;
  }

#site-update:after, .menu:after, .error section[role="main"] figure:after {
   -moz-transform: skew(2deg) rotate(0.5deg);
   -webkit-transform: skew(2deg) rotate(0.5deg);
    right: 4px;
    z-index: -1;
  }


/* Upper header
----------------------------------------------------------------*/

section.global {background: #0f0f0f; padding: 1.75em 2em; color: #dcdcdc; height: 1.5em;}
section.global ul {list-style-type: none; overflow: hidden; float: left;}
section.global ul li {float: left; margin-right: 1.5em;}
section.global li a {color: #9f9f9f;}
section.global li a:hover {color: #f6f6f4;}
section.global p {margin-bottom: 0;}

section.global ul.user-info {position: absolute; right: 18em;}
section.global ul.user-info li span.messages {display: inline-block; margin-left: 0.25em;}
/*section.global ul.user-info li span.messages a {color: #d5d5d5;}*/

/*basket summary */
section.global .basket-info {
  /*position: absolute;
  right: 2em;*/
  display: block;
    position: relative;
  }


section.global div.summary a {
  color: #ffe4ab;
  background: #0f0f0f /*url(../images/icons.png) no-repeat 100% -110px*/;
    padding: 1.75em 1em 1.5em;
    position: absolute;
    right: 0;
    top: -1.75em;
    display: block;
    text-align: center;
  width: 13.333em;
  }

section.global div.summary a:hover, .basket-info:hover div.summary a {background: #4a4949; color: #d5d5d5}
section.global div.summary a:hover strong, .basket-info:hover div.summary a strong {background: #0f0f0f;}
section.global div.summary strong {background: #3c3c3c; padding: 0.25em; height: 1.5em; width: 1.5em; border-radius: 1em; display: inline-block; margin-right: 0.5em; text-align: center; margin-top: -0.417em; font-weight: normal;}

.basket-summary {
  background: #4a4949;
  color: #000;

  display: none;
  position: absolute;
  z-index: 200;

  padding: 0 1em 1em;
  margin-top: 3.25em;
  right: 0;
  width: 13.333em;
  }


.basket-summary table {width: 100%; margin: 0; background: #4a4949;}
.basket-summary table th, .basket-summary table td {background: #4a4949; border: none; color: #d5d5d5;}
.basket-summary table th {}
.basket-summary table td {border-bottom: 1px solid #616060;}
.basket-summary table tbody {}
.basket-summary table tfoot {}

.basket-summary table abbr {border: none;}

.basket-summary table thead tr th:last-child, td.figure {text-align: right;}

/* checkout link */
.basket-summary a {
  display: block;
  width: auto;
  margin: 1em 0 0 0;
  padding: 0.5em;
  }

/* summary::-webkit-details-marker {display: none} */

.basket-summary .arrow-up {
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-bottom: 15px solid #fff;

  position: absolute;
  top: -1em;
  left: 2em;
  }


 .basket-summary p {color: #9f9f9f; margin: 0.5em;}

/* Main navigation
----------------------------------------------------------------*/

nav[role="navigation"]:after {clear: both; content: " "; display: block; height: 0; visibility: hidden;}

/* less margin for navigation bar when on an internal page to associate breadcrumb navigation */
.two-column nav[role="navigation"] {margin-bottom: 1.5em;}


/*main sections navigation */
.sections {
  font-family: "Helvetica Neue", Arial, sans-serif;
  position: relative;
  overflow: visible;
  margin-bottom: 1.5em;
  }

/* default style */
.sections ul a, .sections a.toggle {
  background: #fff url(../images/arrow-right.png) 98% 54% no-repeat;
  border: 1px solid #d5d5d5;
  color: #464646;
  display: block;
  font-size: 1em;
  line-height: 1;
  margin: -1px 0 0 0;
  overflow: hidden;
  padding: 1.25em 0 1em;
  position: relative;
  text-align: left;
  text-indent: 10px;
  /* text-overflow: ellipsis; */
  text-transform: uppercase;
  white-space: nowrap;
  }

.sections h1 {font-size: 1em; margin-left: -1px; letter-spacing: normal; width: 99.5%; padding: 0;}
.sections h1 a {font-size: 1em; width: 100%;}

@-moz-document url-prefix() {.sections ul a {padding-bottom: 1.2em}} /* this really annoyed me */

.sections a:hover, .sections li a:hover, .sections h1:hover, nav[role="navigation"] a.active {text-decoration: none; color: #000; background: #fff url(../images/arrow-right-dark.png) 98% 54% no-repeat;}



/* Navigation Media Queries */

/* 480 and up */
@media screen and (min-width: 480px) {

  .sections ul li {float: left; width: 50%; margin: -2px 0 0 -1px}
  .sections ul li a {margin: 1px 0 0 0;}

  nav[role="navigation"] ul a#index {display: block;}

  }


/* 600 and up w/ 10px margin */
@media screen and (min-width: 620px){ .sections {clear: both; float: none;}}

@media screen and (max-width: 930px) {

  /*.sections ul li {font-size: 0.857em; margin-top: -2px;}*/
  nav[role="navigation"] ul a#index {display: none;}

  }

/* 810 and up */
@media screen and (min-width: 964px) {

  /* full width navigation bar */
  .sections {
    background: #ffffff;
/*    box-shadow: 1px 0px 1px rgba(0,0,0,0.1);
    -webkit-box-shadow: 1px 0px 1px rgba(0,0,0,0.1);
    -moz-box-shadow: 1px 0px 1px rgba(0,0,0,0.1);*/

    border: 1px solid #f0f0ed;
    text-align: center;
    width: auto;
    height: 4.167em;
    }

  .sections ul {display: block;}
  .sections > span {position: absolute; left: -99999em;} /* hide - it's available for screen readers. */

  .sections ul li {
    display: inline-block;
    line-height: 1;
    font-size: 1.167em;
    text-align: center;
    width: auto;
    margin-top: 2px;
    }

  .ie7 .sections ul li, .ie6 .sections ul li {display: inline;} /* display inline */

  .sections.display-table ul {display: table; width: 100%;}
  .sections.display-table ul li {display: table-cell;}

  .sections li a {
    padding-right: 14px;
    padding-left: 14px;
    text-align: center;
    text-indent: 0;
    border-width: 0;
    display: inline-block;
    }

  /* home icon */
  nav[role="navigation"] ul a#index {
    background: url("../images/icons.png") no-repeat 0 0;
      height: 1em;
      margin: 0.75em 0em 0 1.5em;
      padding: 0.75em 0;
      text-indent: -999em;
      width: 24px;
    }

  nav[role="navigation"] ul a#index:hover {background: url(../images/icons.png) no-repeat -22px 0;}

}


/* 960 and up */

@media screen and (min-width: 960px) {.ie7 .sections ul li, .ie6 .sections ul li {width: 12%;} nav[role="navigation"] ul a#index {display: none;}}


/* 1024 and up */
@media screen and (min-width: 1025px) {nav[role="navigation"] ul a#index {display: block;}}

/* 1200 and up */
@media screen and (min-width: 1200px) {

  .sections ul li {
    float: left;
    clear: none;
    }

  .sections.display-table ul li {
    width: auto;
    padding-left: 0;
    padding-right: 0;
    }

  .sections li a {display: block;}
  .ie7 .sections ul li, .ie6 .sections ul li {width: 12%;}

  }


/* Expanded menu
----------------------------------------------------------------*/

div.menu {
  position: absolute;
  display: none;
  left: 0;
  right: 0;
  top: 100%;
  z-index: 100;
  margin-top: 1px;
  background: #fff;
  box-shadow: 1px 0px 1px rgba(0,0,0,0.1);
  -webkit-box-shadow: 1px 0px 1px rgba(0,0,0,0.1);
  -moz-box-shadow: 1px 0px 1px rgba(0,0,0,0.1);
  }
  
body.basket div.menu {display: none!important;}

@media screen and (min-width:1025px){
  div.menu-expanded {display: block;}
}

/* 810 and up - anything less and we don't show the drop down category navigation */
@media screen and (min-width:810px){

  .menu div.content {
    width: auto;
    padding: 1em 2em 2em;
    overflow: hidden;
    float: none;
    display: block;
    border-top: none;
    margin: 0;
    background: #fff;
    }

  div.menu .promoted, div.menu nav {float: left;}

  /* columns of categories with sample sub categories */
  div.menu nav, div.menu .promoted {
    margin: 0;
    width: 14.075%; /* 131px / 930 */
    margin-left: 2.58064516%;
    }

  div.menu div.content nav:nth-child(1) {margin-left: none;}

  /* promoted column - contain an image? */
   div.menu .promoted {
    border-right: 1px solid #ddd;
    padding-right: 2.473118%;
    margin-left: 0;
    text-align: left;
    }

   div.menu .promoted h4 {/*background: url(../images/colour-wheel-open.png) no-repeat 0 0; padding-left: 2em;*/
   color: #d35d3b;
   }

  div.menu nav ul {margin: 0.5em 0;}
  div.menu nav ul li {margin-bottom: 0.25em;}
  div.menu nav ul li a {color: #858585;}
  div.menu nav ul li a:hover {color: #404040;}
  div.menu nav ul + a {color: #000;}

  div.menu nav h4, div.menu nav h4 a {font-weight: bold; color: #000;}
  div.menu nav ul + a:hover, div.menu nav h4 a:hover {color: #4083A9;}


  }

@media screen and (min-width: 1200px){
  .sections li.nth-1 a.menu-expanded {border-left: none;}

  }



/* Main content
----------------------------------------------------------------*/

/* Section headers */
section header {margin-bottom: 2.5em; overflow: hidden;}
section header h2,
section header p {text-align: center;}
section header p {margin-bottom: 0;}

section header h2 span, section header h1, .shop section header h1 span, .basket section header h1 span, .tandem h1 span {color: #8a8a8a;}
section header h1 span, .item section header h1, .account section header h1, .shop section header h1, .basket section header h1, .error section h1 {color: #000;}

.home section.featured h2 {
  border-top: 1px solid #d5d5d5;
  padding-top: 3.0674847%;
  }

/* Section headers on two column layouts */
.two-column section header, .checkout .shop-basket header, .basket section header, .selling section header, .account section header {margin-bottom: 1.5em;}
.two-column section header h2, .checkout .shop-basket header h2, .checkout header h2, .account section header h2 {text-align: left;}

/* Section header links */
.home section header a {float: left; margin-top: -1.667em}
.home section.featured header a {}
.home section.supplies header a {padding: 0; background: none; color: #ffe4ab;}
.home section header h2 + a  {float: right; padding:0; background: none;}

/* Section header for Pinterest themes */
.home section header a.shop-name, .home section header .pinterest-promo a  {float: none; margin: 0;}
.home section header.featured-collection h2 {width: 40%; margin: 0 auto;}
.home section header.featured-collection h2 span.credit {color: #404040; white-space: nowrap;}
.home section header .pinterest-promo {}

.home section[role="main"] header:first-child {overflow: visible;}
.home section header .pinterest-promo a {}
.home section header .pinterest-promo a {float: left;  margin-top: -1.667em;}
.home section header .pinterest-promo a.pinterest-theme {
  color: #8A8A8A;
    float: right;
    font-size: 0.75em;
    text-align: center;
    margin-top: -3.5em;
  }
.home section header .pinterest-promo a.pinterest-theme img {display: block;}


/* header for the category list and gallery controls */
.two-column header.controls, .filter-controls {padding: 1em; background: #f1f1f0; margin-bottom: 0em;}
.two-column header.controls + hr + ul.gallery, .two-column header.controls + ul.gallery {margin-top: 2em;}

/* Featured section - homepage */
section.featured header {overflow: visible;}

.home .featured header .decorate {
  display: block;
  position: absolute;
  top: -16px;
  left: 50%;
  margin-left: -27px;
  padding: 0 20px;
  width: 14px;
  height: 34px;
  background: #F6F6F4 url(../images/feature-f-circle.png) no-repeat 50% 50%;
  }

/* Supplies section - homepage */
.home section.supplies {background: #404041; padding-top: 3.0674847%;} /* this should be in ems? */
.home section.supplies header h2 {color: #bca474;}
.home section.supplies header a {}

/* Featured section header */
.two-column .favourites header h2, section.summary header h2, header.tandem h1, header.tandem h2 {float: left;}
.two-column .favourites header a, section.summary header a, section.summary header p, header.tandem a, header.tandem p {float: left; margin: 0.583em 0 0 1em; display: inline-block;}

section.summary section.feedback header a {float: none; margin: 0.583em 0 0 0.5em;}

section.summary header p {float: right;}

header.tandem a.right {position: absolute; right: 0;}
header.tandem h1+a {margin-top: 1.083em;}
header.tandem h1+a.button {margin-top: 0.5em;}

/* A header with two elements often a heading and paragraph or link to appear on the same line */
header.tandem h1 + p {margin-top: 1em; color: #8a8a8a}

header.tandem.activity {margin: 0 0 1em 0;}
header.tandem.activity h3 {font-size: 1em; font-weight: bold;}
header.tandem.activity a {float: right;}
header.tandem .actions {float: left; border: none; padding: 0; margin: 0.83em 0 0 2em;}
header.tandem.alt .actions {float: right;}
section.featured.activity header:first-child {margin-bottom: 1em;}

/* Next, Previous arrow links in the headers to galleries */
section[role="main"] header nav {float: right; overflow: hidden; margin-top: 0.333em}

section[role="main"] header nav li, ul.slide-controls li {float: left;}
section[role="main"] header nav a, ul.slide-controls li a {margin: 0; display: block; text-indent: -999em; height: 16px; width: 16px; background: url(../images/icons.png) no-repeat 0 -144px;}
section[role="main"] header nav li:first-child a, ul.slide-controls li:first-child a {background: url(../images/icons.png) no-repeat 0 -120px;}

section[role="main"] header nav a.disabled, ul.slide-controls li a.disabled {background: url(../images/icons.png) no-repeat 0 -1400px;}
section[role="main"] header nav li:first-child a.disabled, ul.slide-controls li:first-child a.disabled {background: url(../images/icons.png) no-repeat 0 -1376px;}

/* Separating the sections in the account pages */
section.summary {margin-bottom: 2em;}

/* Selling page */

.selling section[role="main"]  h1, .selling section[role="main"]  h2 {
  text-align: center;
  font-size: 4.8em;
  font-weight: 300;
  letter-spacing: -1px;
  }

.selling section[role="main"] h2 {font-size: 2em; font-weight: bold;}
.selling header:first-child p {text-align: center; color: #8a8a8a; font-size: 1.5em; margin: 0.5em 0; color: #a5a5a5;}

.selling-intro .options {margin: 5em 0 4em 0; clear: both; padding: 0 15px;}

.card {
  background: #fff;
  border-radius: 8px 0 0 8px;
  float: left;
  padding: 2em 2em 1.5em;
  position: relative;
  text-align: center;
  width: 40%;
  border: 1px solid #d5d5d5;

  background-image: linear-gradient(top, #e9e9e9 16%, #FFFFFF 0%);
  background-image: -o-linear-gradient(top, #e9e9e9 16%, #FFFFFF 0%);
  background-image: -moz-linear-gradient(top, #e9e9e9 16%, #FFFFFF 0%);
  background-image: -webkit-linear-gradient(top, #e9e9e9 16%, #FFFFFF 0%);
  background-image: -ms-linear-gradient(top, #e9e9e9 16%, #FFFFFF 0%);
  }

.card-center, .upgrade-message {
  border-radius: 8px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2), 0 0 1px rgba(0, 0, 0, 0.5);
  margin-top: -1em;
  position: relative;
  width: 48%;
  z-index: 2;
  border: none;
  background: #eff5f7;
  background-image: linear-gradient(top, #EAEADF 15%, #FCFCF2 0%);
  background-image: -o-linear-gradient(top, #EAEADF 15%, #FCFCF2 0%);
  background-image: -moz-linear-gradient(top, #EAEADF 15%, #FCFCF2 0%);
  background-image: -webkit-linear-gradient(top, #EAEADF 15%, #FCFCF2 0%);
  background-image: -ms-linear-gradient(top, #EAEADF 15%, #FCFCF2 0%);
  }

.card-last {/*border-radius: 0 8px 8px 0;*/}
.card-center {min-height: 27em;}

.selling section[role="main"] .card h2 {font-size: 1.5em; position: absolute; top: 12px;}
.card h3 {
  font-size: 6em;
  font-weight: bold;
  -moz-box-orient: vertical;
  display: inline-block;
  line-height: 1em;
  margin: 55px 0 0 0;
  position: relative;
  vertical-align: middle;
  z-index: 1;
  }

.card h3 sup {
  font-size: 0.333em;
  font-weight: normal;
  left: -22px;
  position: absolute;
  top: -0.5em;
  }

.card-center h3 {font-size: 8em;}

/* .card.payg h2, .card:last-child h2 {color: #f15941;}  red */
/*  .card.card-center h2 {color: #887cba;} purple */



.card-center h3 {font-size: 8em;}

.card span.badge {
  background: url(../images/folksy-badge-f.png) no-repeat center center;
  display: block;
  height: 70px;
  width: 60px;
  text-indent: -999em;
  position: absolute;
  top: 1em;
  left: 44%;
  z-index: 2;
  }

.card.card-center span.badge {background: url(../images/folksy-badge-green-f.png) no-repeat center center;}

.card p, .plan-info ul li span, .card strike {color: #8a8a8a;}

.card h4 {
  text-transform: uppercase;
  font-weight: bold;
  letter-spacing: 1px;
  border-top: 1px solid #d5d5d5;
  position: relative;
  text-align: center;
  }

.card h4 span {background: #fff; padding: 0.5em 1em; position: relative; top: -0.75em; text-align: center;}
.card-center h4 span {background: #FCFCF2}

.plan-info {
  text-align: left;
  margin: 2em -2em 0 -2em;
  }

.plan-info ul {text-align: left; float: left; width: 37%; margin: 0 2em;}
.plan-info .plan-advice {float: right; width: 39%; margin-right: 2em;}

.card-action {clear: both;}

.card-action a.power, .card-action p.current {border-radius: 4px;}
.card.payg .card-action a.power {background: #f15941;}
.card.payg .card-action a.power:hover {background: #C64032;}

.card-action p.current {background: #ccc; width: 50%;}
.card-action p.current.coming-soon {background: #b2c248;}

.selling .newsletter {margin: 0 0 40px;}

.selling .benefits {
  padding: 3.0674847%;
  background: #fff;
  text-align: left;
  overflow: hidden;
  border: 1px solid #e5e5e5;
  margin-bottom: 2em;
  }

.selling section[role="main"] section h2  {text-align: left;}



.upgrade-message.card {
  float: none;
  width: auto;
  text-align: left;
  margin: 2em 0;
  background: #FCFCF2;
  padding: 1em 1em 1em 5em;
  }

.upgrade-message { }
.upgrade-message p {color: inherit; margin-bottom: 0;}
.upgrade-message span.badge {top: -1em; left: -2em; background: url(../images/folksy-badge-green-f.png) no-repeat center center;}
.upgrade-message p a.power {display: inline-block; margin: 0; border-radius: 4px; }
.upgrade-message p a.power + a {font-size: 0.92em;}

/* plus-subscriptions bit of /selling page */

#plus-subscriptions h4, #plus-subscriptions h5{
  font-size: 100%;
  margin: 0;
  border: 0;
}
#plus-subscriptions h4 {
  font-size: 140%;
  font-weight: bold;
  display: inline-block;
  border-top: 1px solid #ccc;
  width: 100%;
  padding-top: 6px;
}
#plus-subscriptions h5 span {
  font-weight: normal;
  color: #999;
}
#plus-subscriptions li {
  margin-top: 16px;
}
#plus-subscriptions a {
  width: 12em;
  padding: 8px;
}


/* Moo and Fred aldous promotion */
.partner > header {
  padding: 1.33em 0 0 1.33em;
}
.selling .partner, .selling .benefits, .selling .faq {clear: both;}
.selling .partner div a {margin-bottom: 1rem; display: block; overflow: hidden; }
.selling .partner {overflow: hidden; background: #eff5f7; border: 1px solid #d9e9ef; margin: 1em 0 2em 0;}
.selling .partner header h2 {border: none; padding: 0; text-align: left; margin-top: 0;}

.selling .partner div {position: relative; padding: 1.33em;}

.selling .partner h4 {font-weight: bold; font-size: 1rem; margin-bottom: 0.2rem}
.selling .partner div img {
  padding: 0.5em;
  border: 2px solid #eee;
  background: #fff;
  margin-bottom: 0.4rem;
  }
.selling .partner div:hover img {
    border: 2px solid #e7e6e2;
}
.selling .partner div p {max-width: 20rem;}

.selling .partner div p:last-child {margin-bottom: 0;}


@media screen and (min-width: 768px) {
  .partner div {width: 50%; float: left; box-sizing: border-box; min-height: 23rem;}
  .selling .partner div:nth-of-type(even) a {padding-left: 1.33em;}
  .selling .partner div p {max-width: 24rem;}
}


.selling .upgrade-message.card {padding: 1.25em 1em 1.25em 5em; margin-bottom: 1em;}
.selling .upgrade-message.card p {overflow: hidden;}
.selling .upgrade-message.card span.badge {}
.selling h1.feature-heading {
  font-size: 4em;
  text-align: center;
  color: #000;
  letter-spacing: -1px;
  font-weight: 300;
  }

.selling h2.feature-heading {text-align: center; font-weight: ; font-size: 2em;}


/* Selling page */

  .card {
  background: #fff;
  border-radius: 8px 0 0 8px;
  float: left;
  padding: 2em 2em 1.5em;
  position: relative;
  text-align: center;
  width: 380px;
  border: 1px solid #d5d5d5;

  background-image: linear-gradient(top, #e9e9e9 16%, #FFFFFF 0%);
  background-image: -o-linear-gradient(top, #e9e9e9 16%, #FFFFFF 0%);
  background-image: -moz-linear-gradient(top, #e9e9e9 16%, #FFFFFF 0%);
  background-image: -webkit-linear-gradient(top, #e9e9e9 16%, #FFFFFF 0%);
  background-image: -ms-linear-gradient(top, #e9e9e9 16%, #FFFFFF 0%);

  }

.card-center, .upgrade-message.card {
  border-radius: 8px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2), 0 0 1px rgba(0, 0, 0, 0.5);
  margin-top: -1em;
  position: relative;
  width: 470px;
  z-index: 2;
  border: none;
  background: #FCFCF2;
  background-image: linear-gradient(top, #EAEADF 15%, #FCFCF2 0%);
  background-image: -o-linear-gradient(top, #EAEADF 15%, #FCFCF2 0%);
  background-image: -moz-linear-gradient(top, #EAEADF 15%, #FCFCF2 0%);
  background-image: -webkit-linear-gradient(top, #EAEADF 15%, #FCFCF2 0%);
  background-image: -ms-linear-gradient(top, #EAEADF 15%, #FCFCF2 0%);
  }

.card-last {/*border-radius: 0 8px 8px 0;*/}

.card h3 {
  font-size: 6em;
  font-weight: bold;
  -moz-box-orient: vertical;
  display: inline-block;
  line-height: 1em;
  margin: 55px 0 0 0;
  position: relative;
  vertical-align: middle;
  z-index: 1;
  }

.card h3 sup {
  font-size: 0.333em;
  font-weight: normal;
  left: -22px;
  position: absolute;
  top: -0.5em;
  }

.card-center h3 {font-size: 8em;}

/* .card.payg h2, .card:last-child h2 {color: #f15941;}  red */
/*  .card.card-center h2 {color: #887cba;} purple */



.card-center h3 {font-size: 8em;}

.card span.badge {
  background: url(../images/folksy-badge-f.png) no-repeat center center;
  display: block;
  height: 70px;
  width: 60px;
  text-indent: -999em;
  position: absolute;
  top: 1em;
  left: 44%;
  z-index: 2;
  }

.card.card-center span.badge {background: url(../images/folksy-badge-green-f.png) no-repeat center center;}

.card p, .plan-info ul li span {color: #8a8a8a;}

.card h4 {
  text-transform: uppercase;
  font-weight: bold;
  letter-spacing: 1px;
  border-top: 1px solid #d5d5d5;
  position: relative;
  text-align: center;
  }



.upgrade-message.card {
  float: none;
  width: auto;
  text-align: left;
  margin: 2em 0;
  background: #FCFCF2;
  padding: 1em 1em 1em 5em;
  }

.upgrade-message { }
.upgrade-message p {color: inherit; margin-bottom: 0;}
.upgrade-message p.right-align { text-align: right; }
.upgrade-message span.badge {top: -1em; left: -2em; background: url(../images/folksy-badge-green-f.png) no-repeat center center;}
.upgrade-message p a.learn-more { margin-right: 1em; }
.upgrade-message p a.power {display: inline-block; margin: 0; border-radius: 4px; }
.upgrade-message p a.power + a {font-size: 0.92em;}

.half {width: 48.4679%; float: left;}
.half:nth-child(2) {margin-right: 3.0674847%}

.benefits .half {}

.selling .faq {margin-bottom: 2em; overflow: hidden;}


/* Alternative notice - used for the Shop Layout upgrade notice */

div.notice-alt {
  position: relative;
  margin-bottom: 3em;
  border-radius: 1em;
  border: 5px solid #887cba;
  border-top-width: 15px;
  padding: 3em 2em 1.5em;
  background: #faf9fe;
  text-align: center;
  }

div.notice-alt.badge:after {
  position: absolute;
  top: 0;
  left: 50%;
  margin: -42px 0 0 -33px;
  width: 66px;
  height: 66px;
  background: url(../images/folksy-badge-purple-f.png) no-repeat 50%;
  content: "";  
  }

a.button-alt {
  display: inline-block;
  border-radius: 0.4em;
  padding: 0.5em 1em;
  background: #f37200;
  text-align: center;
  font-size: 1.2em;
  font-weight: bold;
  color: #fff;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-shadow: 0 1px 0 rgba(0,0,0,0.2);
  }

a.button-alt:hover,
a.button-alt:focus {background: #dd6800;}

/* Formatting */

section.formatting ul,
section.formatting dl {margin: 0 0 1.5em 2em;}
section.formatting dl ul {margin-bottom: 0.5em;}
section.formatting ul {list-style-type: disc;}

section.formatting h3.emphasize {
  margin: 1em 0;
  border-radius: 0.3em;
  padding: 0.5em 1em;
  background: #fff;
  font-size: 1.167em;
  }



/* Moo business cards */

.feature-image {
  background: #fff;
  border: 1px solid #e5e5e5;
  padding: 1%;
  margin: 0 0 2em 0;
  }

.feature-image img, .image-select li label img {line-height: 1; display: block;}

.moo-promote p {text-align: center; margin: 2em 0;}

.image-select {overflow: hidden;}
.image-select li {line-height: 0; float: left; margin: 0 2% 2% 0; width: 10.75%;}
.image-select li:nth-child(8n) {margin-right: 0;}

.image-select label {display: block; margin: 0; padding: 0.5em; background: #fff; border: 1px solid #e5e5e5;
  -webkit-transition: all .1s;
  -moz-transition: all .1s;
  -ms-transition: all .1s;
  -o-transition: all .1s;
  transition: all .1s
  }

.image-select label:hover {
  -webkit-box-shadow:0 0 8px rgba(0,0,0,0.2);
  -moz-box-shadow:0 0 8px rgba(0,0,0,0.2);
  box-shadow:0 0 8px rgba(0,0,0,0.2);

  background: #faf9e6;
  }

.image-select label.checked { border-color: #e14c35; background: #f15941}
.image-select label.checked img {outline: #fff;}
.image-select input[type="checkbox"] {display: none;}

.filter-controls {overflow: hidden; margin-bottom: 2em;}
.filter-controls p {text-align: left; float: left; margin: 0;}

.filter-controls ul {float: right;}
.filter-controls label {margin: 0;}


/* Christmas feature
----------------------------------------------------------------*/
section.christmas-feature {background: #fff url(../images/christmas-border.png) repeat-x 0 0; margin-bottom: 2em;}

section.christmas-feature h1 {
  height: 129px;
  width: 270px;
  text-indent: -999em;
  background: url(../images/christmas-heading.png) no-repeat 0 0;
  display: block;
  float: left;
  margin: 50px 4% 45px 20px;
  }

section.christmas-feature h2 {
  margin-bottom: 0.5em;
  color: #1a1a1a;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 1em;
  font-weight: bold;
  }
section.christmas-feature ul li a {font-size: 13px; color: #af0006;}
section.christmas-feature ul li a:hover {color: #1a1a1a;}

section.christmas-feature ul li:nth-child(even) a {}

section.christmas-feature div {float: left; width: 18%; padding: 0 2% 0 0; margin: 52px 0 48px 0;}

section.christmas-feature div.bottom-border {
  display: block;
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 26px;
  background: #fff url(../images/christmas-border-bottom.png) repeat-x 0 0;
  text-indent: -999em;
  padding: 0;
  margin: 0;
  }


/* Main gallery grid view
----------------------------------------------------------------*/

ul.gallery {/*overflow: hidden;*/ padding-bottom: 1em;}

ul.gallery li {
  float: left;
  width: 22.699387%; /* 222px */
  margin: 0 3.0674847% 3.0674847% 0;

  background: #fff;
  position: relative;

  height: 24em; /* test height to solve a layout overflow problem */
  }

.home .supplies ul.gallery li {background: #f0f0f0;}

ul.gallery li:nth-child(4n),
ul.gallery.popular li:nth-child(3n),
.two-column ul.gallery.favourite li:nth-child(3n),
.two-column ul.gallery li:nth-child(3n),
.two-column .unavailable ul.gallery li:nth-child(4n)
{margin-right: 0;}

.two-column ul.gallery li:nth-child(4n) {margin-right: 4.132234%;}

ul.gallery li a, ul.gallery li div {display: block; padding: 1.33em; /* width: 85.585586%; */}
ul.gallery li a img, .recently-listed ul li a img {opacity: 1}
ul.gallery li a:hover img, .recently-listed ul li a:hover img {opacity: 0.9;}

ul.gallery li a h3, ul.gallery.selling li div h3 {color: #404041; font-size: 1.167em;} /* item title */
ul.gallery li a h4, ul.gallery.selling li div h4 a {color: #8a8a8a; font-size: 1.167em;} /* shop name */
ul.gallery li a:hover h4 {color: #4083A9;} ul.gallery li a:hover h3 {color: #000;}

ul.gallery li p {margin: 0; color: #9a9a9a; position: relative;} /* stock level */
ul.gallery li p strong {margin: 0; color: #4c3855; font-weight: normal; position: absolute; right: 0;} /* price */

/* Lowercase and First letter rules */
ul.gallery li a h3, ul.gallery li a h4, ul.gallery li div h3, ul.gallery li div h4 {text-transform: lowercase;}
ul.gallery li a h3:first-letter, ul.gallery li a h4:first-letter, ul.gallery li div h3:first-letter, ul.gallery:not(.selling) li div h4:first-letter {text-transform: uppercase;}

ul.gallery.selling li div h3 {text-transform: capitalize;}
ul.gallery.selling li div h4 {text-transform: capitalize;}

ul.gallery.selling li div p:before {
  content: '\201C';
  font-size: 1.6rem;
  line-height: 0;
  top: 0.4rem;
  position: relative;
  left: -0.2rem;
  color: #8a8a8a;
}

ul.gallery.selling li div p:after {
  content: '\201D';
  font-size: 1.6rem;
  line-height: 0;
  top: 0.4rem;
  position: relative;
  right: -0.2rem;
  color: #8a8a8a;
}


/* Three column gallery grid view */
.two-column ul.gallery li {width: 30.578512%; margin: 0 4.132234% 4.132234% 0;} /* 222px / 726px = 30.578512% */
.two-column ul.gallery.popular li a {padding: 0; width: auto;}
ul.gallery.popular li p a {display: inline; padding: 0; width: auto;}
ul.gallery.popular h3 a {color: #000;}

.two-column ul.gallery li:nth-child(12n) {margin-right: 0;}

.two-column ul.gallery.popular li {height: 25em;} /*fixing the height of the popular category sections to 283px */
ul.gallery.selling li {height: 40em;}
ul.gallery.selling li div a {padding: 0;}
ul.gallery.selling li div h4 a {padding: 0; margin-bottom: 0.5em;}
ul.gallery.selling li div p {color: #404040;}

/* Sold item suggested view */
.two-column .unavailable ul.gallery li {
  width: 22.699387%; /* 222px */
  margin: 0 3.0674847% 3.0674847% 0;
  }

.two-column .unavailable ul.gallery li a {width: ;}

.gallery li form {margin: 0;}
.gallery li form div {padding-top: 0;}
.gallery li form input[type="submit"] {}

.featured .gallery li a:after {}

/* Page refresh loading state */

ul.items.loading li:after {
  content: " ";
  height: auto;
  width: 100%;
  background: rgba(255,255,255,0.9);
  position: absolute;
  margin: auto;
  top: 0; left: 0; right: 0; bottom: 0;
  z-index: 50;
  }

ul.items.loading li img.spinner {position: absolute; margin: 99px auto auto auto; top: 0; left: 0; bottom: 0; right: 0; z-index: 100; background: transparent;}
ul.items.item-list.loading li img.spinner {margin: auto}

/* Remove button on admin views */

ul.gallery li a.secondary {
  position: absolute;
  top: 2em;
  left: 2em;
  background: url(../images/icons.png) no-repeat 0 -1288px;
  }

/* Marking the featured sellers on the site */
.featured-seller {background: url(../images/orange-star-12.png) no-repeat 0 35%; padding: 0 0 0 1.5em;}
.gallery .featured-seller {padding: 0 0 0 1.25em;}
ul.item-list li p.featured-seller {margin-top: 0.25em;}

header p.short-note {float: right; padding-right: 2em; width: 57%; text-align: right; margin-top: -1.667em; color: #8a8a8a}
header p.short-note span {
  display: inline-block;
  height: 20px;
  width: 24px;
  border-radius: 24px;
  background: #fff;
  text-align: center;
  margin: -0.25em 0 0 0.5em;
  position: absolute;
  padding: 4px 0 0 0;
  }
header p.short-note span img {}


/* Preparing for the Pro badge - uses this html <a class="badge-link" href="/selling"><span class="badge badge-plus">Plus</span></a> */

a.badge-link {
  display: inline-block;
  margin-left: 0.25em;
  }

span.badge {
  padding: 1px 3px;
  font-size: 10px;
  font-weight: bold;
  line-height: 1;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: #fff;
  background: #aaaaaa; /* grey */
  background: #ef8fb4; /* pink */
  background: #b2c248; /* green */
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  text-shadow: none;
  }

.biog h4 .badge {font-size: 9px; line-height: 16px;}

/* Green Gradient for the Plus badge */
span.badge.badge-plus {
  background: #b2c248; /* Old browsers */
  background: -moz-linear-gradient(top, #b2c248 0%, #87a03d 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b2c248), color-stop(100%,#87a03d)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #b2c248 0%,#87a03d 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #b2c248 0%,#87a03d 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #b2c248 0%,#87a03d 100%); /* IE10+ */
  background: linear-gradient(top, #b2c248 0%,#87a03d 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b2c248', endColorstr='#87a03d',GradientType=0 ); /* IE6-9 */

  }

a.badge-link:hover span.badge-plus {background: #555;}





/* Main gallery list view
----------------------------------------------------------------*/

/* controls for list view */
.sort-list {float: left; width: 75%; margin-top: 0.25em;}
.sort-list p {float: left; font-weight: bold; margin: 0 1em 0 0;}
.sort-list li {}

ul.item-list {overflow: hidden; margin-bottom: 1.5em;}

ul.item-list li {display: block; border-top: 1px solid #d5d5d5; padding: 1em 0; overflow: hidden; line-height: 1; position: relative;}
ul.item-list li a.preview {display: block; float: left; width: 11.570248%; margin-right: 4.1322314%; line-height: 0;}
.search ul.item-list li a.preview {width: 8.5889571%}
ul.item-list li:last-child {border-bottom: 1px solid #d5d5d5;}
ul.item-list li a img {opacity: 1;} ul.item-list li a:hover img {opacity: 0.9;}

ul.item-list .item-detail {float: left; width: 38.15427%; margin-right: 4.1322314%}
ul.item-list .item-detail p a {color: #8a8a8a;}

ul.item-list .item-meta {float: left; width: 30.578512%; margin-right: 4.1322314%;}
ul.item-list .item-meta .quantity {float: left; width: 50%;}
ul.item-list .item-meta .list-time {}
ul.item-list .item-detail p a {color: #8a8a8a;}
ul.item-list .item-detail p a:hover {color: #040404;}

ul.item-list strong {float: right; text-align: right;}


/* Other Lists
----------------------------------------------------------------*/

/* Breadcrumb list */
.breadcrumb {color: #8a8a8a; border-bottom: 1px solid #d5d5d5; margin-bottom: 1.5em; overflow: hidden; clear: both;}
.breadcrumb span,
nav.section-title > p span {
  background: url(../images/icons.png) no-repeat 0 -168px; text-indent: -999em; height: 8px; width: 8px; margin: 0 0.333em;
  display:inline-block;
  position: relative;
  top: -1px;
  vertical-align: middle;
  }

@-moz-document url-prefix(), .ie .breadcrumb span {.breadcrumb span {position: relative; top: 5px; vertical-align: middle;}} /* this really annoyed me */
.ie .breadcrumb span {vertical-align: middle;}

.breadcrumb a {display: inline-block;}
.breadcrumb a:first-child {margin-left: 0.5em;}

aside .breadcrumb {border: none; margin: 0;}
aside .breadcrumb a:first-child {background: url(../images/pin.png) no-repeat 0 0; padding-left: 2em; margin-left: 0;}

/* Slide controls list - previous / next arrows */
ul.slide-controls {float: right; overflow: hidden;}

/* Recently viewed */
ul.recently-viewed li {
  float: left;
  position: relative;
  width: 37.837838%;
  margin-right: 9.009009%;
  }

ul.recently-viewed li a {display: block; margin-bottom: 0.5em;}
ul.recently-viewed li a.delete {height: 11px; width: 11px; text-indent: -999em; background: url(../images/icons.png) no-repeat 0 -184px;}
.recently-viewed li img {opacity: 1}
.recently-viewed li a:hover img {opacity: 0.9;}

/* Recently listed and other suggested items prompt when an item is sold or unavailable */
.recently-listed {margin-bottom: 3em;}
ul.gallery-strip, ol.best-selling ul {overflow: hidden; background: #fff; padding: 1em;}
ul.gallery-strip li, ol.best-selling ul li {float: left; width: 11.965812%; margin-left: 2.707%; line-height: 1;}

ul.gallery-strip li:first-child,
.item ul.gallery-strip li:first-child,
.home ul.gallery-strip li:first-child,
ol.best-selling ul li:first-child,
.home ul.gallery-strip.avatar li:first-child
{margin: 0;}

ul.gallery-strip li a, ol.best-selling ul li a {display: block;}

/* Variant for the homepage gallery strip re-used as the recently listed items */
.home ul.gallery-strip li {width: 8.812%; margin-left: 1.258%; /* margin-bottom: 1em; */}
.home ul.gallery-strip li:nth-child(11) {margin-left: 0;}
.home ul.gallery-strip.avatar li {margin-left: 1.2%;}

/* Variant for the sold out gallery strip */
.item ul.gallery-strip, ol.best-selling ul  {width: 49.78916%;}
.item ul.gallery-strip li, ol.best-selling ul li {width: 17.73%; margin-left: 2.666667%;}
.theme-items .gallery-strip li {position: relative;}


/* Facets - possibly move this to Form's section */
.facet-header {position: relative; overflow: hidden;}
.facet-header h3 {float: left;}
.facet-header a {float: right; /*background: url(../images/icons.png) no-repeat 0 -1056px;*/ display: block; margin-top: 0.167em; padding-left: 1.5em;}

.facet li {}
.facet label {display: inline; font-weight: normal;}


/* Strip/bar style lists such as tags */

nav.tag, ul.tag {
  clear: both;
  overflow: hidden;
  background: #fff;
  padding: 1em 1em 0 1em;
  margin-bottom: 2em;
  }

nav.tag h4 {float: left; font-weight: bold; margin: 0.25em 0; background: url(../images/icons.png) no-repeat 0 -288px; padding-left: 2em;}
nav.tag ul {float: left;}
nav.tag ul li {
  float: left;
  margin: 0 0 1em 1em;
    display: block;
    background: #f2f2f0;
    border-radius: 4px;
    color: #000;
    }

.admin nav.tag ul li {position: relative; padding-right: 2em;}
nav.tag.themes h4 {background: url(../images/icons.png) no-repeat 0 -1464px;}

nav.tag ul li a {
  height: 100%;
  width: 100%;
  padding: 0.25em 0.5em;
  display: inline-block;
}


.radio-list, dl.meta {overflow: hidden; margin: 1em 0;}

.benefits dd {margin-bottom: 1em; font-style: normal; color: #8a8a8a;}
.benefits dt, .selling .faq h3 {font-size: 1.17em; color: #000; font-weight: bold;}
.benefits dd:last-child {margin: 0;}
.benefits dt {background: url(../images/green-tick-plain.png) no-repeat 0 50%; padding-left: 1.5em;}

dl.meta {color: #8a8a8a;}
dl.meta dt, dl.meta dd {float: left;}
dl.meta dt {clear: left; margin-right: 0.333em;}
dl.meta dd {}

/* Taken from Frankie's JS */
article.biog nav div.other-items {height: 59px; width: /*264px*/ 100%; overflow: hidden;}
article.biog nav div.other-items ul {height: 59px; width: 1000000px; margin-left: 0px;}
article.biog nav div.other-items ul li {width: 59px; margin: 0 10px 0 0;}
article.biog nav div.other-items ul img {height: 59px;}



/* Logos from publications on the Selling page */

ul.brands {margin: 0 auto; text-align: center;}
ul.brands li {display: inline-block; border: 1px solid #d5d5d5; position: relative; height: 52px; width: 120px; background: #fff; margin: 0 0.5em 1em; vertical-align: top;}
ul.brands li img {position: absolute; margin: auto; top: 0; bottom: 0; right: 0; left: 0; display: block;}

section.brands {margin-bottom: 2em;}

/* Best selling ordered list */

ol.chart {list-style-type: none; margin: 0 0 2em 0;}

ol.best-selling li {overflow: hidden; padding: 1em 0; border-top: 1px solid #dadada;}
ol.best-selling strong.position {
  width: 40px;
  height: 40px;
    -webkit-border-radius: 20px; -moz-border-radius: 20px;
  border-radius: 2em;
  padding: ;
  color: #fff;
  background: #333;

  font-size: 1.5em;
  display: block;
  float: left;
  text-align: center;
  margin-right: 0.5em;
  }

ol.best-selling li:nth-child(-n+5) strong.position {background: #b2c248;} /* Top five are green */
ol.best-selling li:nth-child(1) strong.position {background: #f15941;} /* 1st place is Red */

ol.best-selling strong.position span {display: inline-block; margin-top: 10px;}

ol.best-selling div.shop-data {float: left; width: 40%;}
ol.best-selling div.shop-data img {
  height: 40px;
  width: 40px;
  border-radius: 100px;  -webkit-border-radius: 100px; -moz-border-radius: 100px;
  float: left;
  display: inline-block;
  margin-right: 1em;
  }

ol.best-selling ul {float: right;}
ol.best-selling ul li {border: none; padding: 0;}

.home section.featured .bestsellers {margin: 2em 0 0 0;}
.home section.featured .bestsellers header {}
.home section.featured .bestsellers h2 {border: none; padding: 0;}
.home ul.gallery-strip.avatar li {width: 6.532%; /*margin-left: 3.0674%;*/}
.home .activity ul.gallery-strip {margin-bottom: 2em;}

.avatar li img, img.avatar {border-radius: 100px;  -webkit-border-radius: 100px; -moz-border-radius: 100px;}

.followers li {text-align: center;}
.followers li p {color: #8a8a8a;}
.followers li img.avatar {max-height: 70px; max-width: 70px;} /* fixes the width issue on the favourite shops display */

.gallery-strip.avatar {background: none; padding: 0;}
section.chevron {background: #e2e0d4; min-height: 5em; margin: 0 0 4em 0;}

section.chevron:after {
  border-bottom: 3.5em solid transparent;
    border-left: 3.5em solid #f6f6f4;
    border-top: 3.5em solid transparent;
    top: 2%;
  }

section.chevron:before {
  border-bottom: 3.5em solid transparent;
    border-right: 3.5em solid #f6f6f4;
    border-top: 3.5em solid transparent;
    top: 2%;
  }


/* Category pages - Side navigation and filters
----------------------------------------------------------------*/

section[role="navigation"], aside {margin-bottom: 3em;}

section[role="navigation"] h4, section[role="navigation"] h3, .shop aside h4, .shop aside h3 {border-top: 1px solid #D5D5D5; font-weight: bold; margin-bottom: 1em; padding-top: 1.5em;}
section[role="navigation"] h3, .shop aside h3 {margin-bottom: 0.5em; font-weight: bold; padding-top: 1em;}
section[role="navigation"] h3 + h4, section[role="navigation"] h3:first-child, section[role="navigation"] h4:first-child, .shop aside h3 + h4, .shop aside h3:first-child, .shop aside h4:first-child, .shop aside article + h3  {border: none; padding-top: 0; position: relative; z-index: 1;}
section[role="navigation"] h4.toggle, .shop aside h4.toggle {
  padding-left: 1.25em;
  background: url(../images/icons.png) no-repeat 0 -1081px;
  color: #000;
  cursor: pointer;
  }

section[role="navigation"] h4.toggle.active, .shop aside h4.toggle:active {background-position: 0 -1145px}

section[role="navigation"] ul, .shop aside ul {margin-bottom: 1.5em; }
section[role="navigation"] ul li, .shop aside ul li {margin-bottom: 0.167em;}
section[role="navigation"] ul li span, .shop aside ul li span, .shop article.biog div p span {color: #8a8a8a;}
section[role="navigation"] ul li.show-all, section[role="navigation"] ul li.show-less {margin-top: 1em;}

.show-all a, .show-less a {color: #404040;}

aside h4 {font-weight: bold; margin-bottom: 1em;}
aside h3 + p, aside h4 + p {color: #8a8a8a;}

/* Recently viewed items - Main
----------------------------------------------------------------*/

div.container.recently-viewed-main {
  width: auto;
  max-width: none;
  background: #e9e9e8;
  }

div.container.recently-viewed-main div.wrap {
  margin: 0 auto;
  width: 90%;
  max-width: 81.5em;
  padding: 1.2em 0 0.8em 0;
  }

@media screen and (min-width: 31em) { 
  div.container.recently-viewed-main div.wrap {
    padding: 2.5em 0 0;
  }
}

div.container.recently-viewed-main h2 {
  margin-bottom: 1.3em;
  font-size: 1.6em;
  }
  
div.container.recently-viewed-main ul.gallery li {
  margin: 0 3.0674847% 3.0674847% 0;
  width: 22.699387%;
  height: auto;
  }
@media screen and (max-width: 30.999em) { 
  div.container.recently-viewed-main ul.gallery li a {
    overflow: hidden;
    padding: 0;
    border-radius: 2px;
  }
}
    
div.container.recently-viewed-main ul.gallery li:last-child {margin-right: 0;}
div.container.recently-viewed-main ul.gallery img {display: block;}

/* System messages - including some generic Ruby class names
----------------------------------------------------------------*/

.message, .errorExplanation, .share-prompt {
  position:relative;
  padding: 1em 1em 1em 3em;
  background: #fcf8e3 url(../images/icons.png) no-repeat 1em -820px;
  border: 1px solid #fbeed5;
  margin: 1em auto 2em auto;
  clear: both;
  color: #a07936;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.large-message {
  position:relative;
  padding: 1em 1em 1em 3em;
  background: #fcf8e3;
  border: 1px solid #fbeed5;
  margin: 1em auto 2em auto;
  clear: both;
  color: #a07936;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.message.warning, table td p.error {color: #a11903; background: #fcf8e3 url(../images/icons.png) no-repeat 1em -899px;} /* red colour */
.message.holiday {background: #fcf8e3 url(../images/icons.png) no-repeat 1em -779px;} /* clock timer graphic */
.message.restricted {background: #fcf8e3 url(../images/icons.png) no-repeat 1em -860px;}
.message p, .share-prompt p {margin: 0;}
.message.noicon {background-image: none; padding-left: 1em;}
.message.noicon p{margin-bottom: 1em;}

.message.error-notice, .errorExplanation, .message.preview, .message.plain, .share-prompt {
  color: #a11903;
  background-image: none;
  padding-left: 1.5em;
  }

/* blue standard notice box */
 .message.notice {
    background-image: none;
    padding-left: 1.5em;
    background-color: #D9EDF7;
  border-color: #BCE8F1;
  color: #3A87AD;
 }

.message.notice.plain {color: #444;}

.message h4, .message p a {color: inherit; font-weight: bold;} .message p a:hover {color: #205F82;}
.message h4, .message strong, .message strong span, .message.plain strong span {color: #404040;}

.message.error-notice h2, .errorExplanation h2 {background: #fcf8e3 url(../images/icons.png) no-repeat 0 -1295px; padding: 0.167em 0 0.167em 1.25em;}
.message.error-notice ul, .errorExplanation ul {margin: 1em 0 0 0;}
.message.error-notice ul li, .errorExplanation ul li {margin: 0 0 0.5em 0;}

.message.preview p, .message.plain {color: #a07936; text-align: left;}
.message.plain span {color: #8a8a8a;}

.message h4, .message.plain h4 span {color: #444;}
.message.basket-notice span {color: #a11903;} /* red colour */
.message.basket-notice p {margin-bottom: 1em;}
.message.basket-notice h4 {font-weight: bold; margin-bottom: 1em; background: url(../images/icons.png) no-repeat 0 -832px; padding-left: 1.5em;}

.share-prompt {border: 1px solid #e6e6dc; color: #404040}
.message .remove, .share-prompt .remove {position: absolute; right: 1em; top: 1em; background: transparent url(../images/icons.png) no-repeat 1em -1421px; padding-left: 2.5em;}
.share-prompt .remove {top: 1.25em; right: 1.5em;}

.message .remove.icon {text-indent: -999em; height: 16px; width: 16px; right: 1em; padding: 0; background: transparent url(../images/icons.png) no-repeat 0 -1421px;}

.order-message, table td div.item-description .order-message {
  padding: 0.5em;
  background: #fcf8e3;
  border: 1px solid #fbeed5;
  margin: 1em 0;
  color: #a11903;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  }

/* this is the 'new' tag for the message boxes */
.message-tag, fieldset.inline span.message-tag, .message.plain span.message-tag {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  color: #fff;
  text-transform: uppercase;
  display: inline-block;
  font-size: 9px;
  line-height: 9px;
  margin-right: 5px;
  font-weight: bold;
  background: #3A87AD;
  padding: 4px 5px;
  vertical-align: top;
  text-shadow: none;
  }

.message-tag.new-tag {background: #f15941;}

/* Item page - image and slider gallery
----------------------------------------------------------------*/

figure {}
figure img {display: block;}
figcaption {font-style: italic;}

figure ul {
  background: #fff;
  overflow: hidden;
  padding: 1em;
  margin: 1em 0 2em 0;
  }
figure ul li {
  width: 9.7087379%; /* 60 / 618 (642 - 24 padding) */
  float: left;
  margin-left: 1.61823%;
  }

figure ul li:first-child {margin-left: 0;}
figure ul li a {display: block; line-height: 1;}
figure ul li:hover {cursor: pointer;}

figure.main-image div {position: relative; background: #f2f2f0; text-align: center;}
figure.main-image div img {
  /*position: absolute; margin: auto; top: 0; left: 0; bottom: 0; right: 0;*/
  display: inline-block;
  vertical-align: middle;
  }

/* Aside - contextual information on the item page
----------------------------------------------------------------*/

aside {}

/* CoptsForm */
.customisation-modal {
  display: none;
  position: fixed;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgb(0,0,0);
  background-color: rgb(0,0,0,0.4);
}
.customisation-modal__content {
  background-color: #fefefe;
  margin: 15% auto;
  padding: 20px;
  border: 1px solid #888;
  width: 80%;
}
@media screen and (min-width: 800px) {
  .customisation-modal__content {
    width: 600px;
  }
}
.customisation-modal__content__close {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}
.customisation-modal__content__close:hover,
.customisation-modal__content__close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}
.customisation-modal__content__header {
  display: flex;
  justify-content: center;
}
.customisation-modal__content__header h2 {
  font-weight: bold;
}
.CoptsForm * {
  margin: 0;
  padding: 0;
}
.CoptsForm {
  margin-top: 2em;
}
.CoptsForm__field {
  display: flex;
  flex-direction: column;
  margin-top: 1em
}
.CoptsForm__field .info {
  color: #888;
  font-size: 90%;
}
.CoptsForm__field__input {
  margin-top: 2px;
  width: 100%;
}
.CoptsForm__controls {
  display: flex;
  justify-content: flex-end;
  margin-top: 2em;
}
.CoptsForm__submit {
  width: auto;
  overflow: visible;
  padding: 0.714em 1em 0.714em 2.5em;
  background: #f37200 url(../images/icons.png) no-repeat scroll 10% -552px;
  color: #fff;
  font-size: 1.167em;
  margin: 0 1em 0 0;
  border: none;
  font-weight: normal;
  color: #fff;
  letter-spacing: 1px;
  text-transform: uppercase;
  line-height: 1;
  text-shadow: 0px 1px 0px rgba(0,0,0,0.2);
  display: block;
  text-align: center;
}
.CoptsForm__submit[disabled], .CoptsForm__submit[disabled]:hover {
  background: #888 url(../images/icons.png) no-repeat scroll 10% -552px;
  cursor: not-allowed;
}
/* /CoptsForm */
.buy-item button.customise-item {
  padding: 0.714em 1em 0.714em 3em;
}

@media screen and (min-width: 480px) {
  .buy-item a.customise-item, .buy-item a.customise-item:hover {
    margin: 8px 8px 8px 0;
  }
}

/* price */
.item section.mobile-options {display: none;}
.item section.mobile-options > div,
.item aside > div {
  margin-bottom: 10px;
  overflow: hidden;
}
.item section.mobile-options span.item-currency-price,
.item aside span.item-currency-price {
  font-size: 1.4rem; 
  font-weight: 300;
  display: inline-block; 
  letter-spacing: 0; 
  color: #000; 
  float: left;
}
.item section.mobile-options span[data-role="quantity"],
.item aside span[data-role="quantity"] {
  float: left; 
  color: #858585; 
  margin: 1.167em 0 0 1.5em;
}

.buy-item {clear: both; overflow: hidden; margin: 1.5em 0; padding: 1px 0;
}

/* the most important button on the site */
.buy-item button {
  width: auto;
    overflow: visible;
    float: left;
    padding: 0.714em 1em 0.714em 2.5em;
    background: #f37200 url("../images/icons.png") no-repeat scroll 10% -552px;
    color: #fff;
    font-size: 1.167em;
    margin: 0 1em 0 0;
    border: none;
    font-weight: normal;

    /*border-radius: 0.25em;*/
    color: #fff;
    letter-spacing: 1px;
    text-transform: uppercase;
    line-height: 1;
    text-shadow: 0px 1px 0px rgba(0,0,0,0.2);
    display: block;
    text-align: center;
    }

.buy-item button:hover,
.buy-item button:focus {background-color: #404040;}

/* sold out button */
.buy-item button[disabled="disabled"] {background: #a20303; cursor: default; padding: 0.714em 1em; text-align: center;}
.buy-item button[disabled="disabled"].unavailable, input[type="submit"][disabled="disabled"], input[type="submit"][disabled="disabled"]:hover {background: #e8e8e7; color: #404040; text-shadow: 0px 1px 0px rgba(255,255,255,0.5); border: none;}

/* Shop and designer details on the item page */
article.biog {background: #fff; margin-bottom: 2em;}

article.biog header, article.biog nav, .shop .biog div {padding: 1.5em;}

article.biog header, .shop .biog div {padding-left: 8.167em; margin: 0;}
article.biog header h4 a, section[role="navigation"] h4 a {font-weight: bold;}

article.biog dl {margin-bottom: 0.5em;}
article.biog dt {font-weight: bold; float: left; margin-right: 0.5em;}
article.biog dd {color: #858585; font-style: normal;}


article.biog header h4 + a, .shop .biog div a:first-child {
  width: 19.6%;
  display: block;
  position: absolute;
  line-height: 1;
  margin-left: -6.5em;
  top: 1.5em;
  }

.shop article.biog div dd a:first-child {display: inline; width: auto; margin: 0; line-height: 1.5; position: relative;}

.shop article.biog div p, aside article.biog h4 {margin: 0;}
.shop article.biog div p a:first-child {margin: 0 0.5em 0 0; position: relative; width: auto; top: 0; display: inline-block;}

article.biog nav, .shop .biog div {background: #f0efeb;}
article.biog nav ul {overflow: hidden; clear: both;}
article.biog nav h5 {font-weight: normal; color: #000; float: left; margin-bottom: 0.833em;}
article.biog nav h5 a {margin-left: 0.25em;}

article.biog nav li {
  width: 22.222222%; /* 60 / 270 (306 - 36px padding) */
  float: left;
  line-height: 1;
  margin-left: 3.7037037%;
  }

/* slider  controls for the other items */
.item ul.slide-controls {clear: none; margin-top: 0.167em;}
.item ul.slide-controls li {width: 16px; margin-left: 1em;}

.item aside article nav li:first-child {margin-left: 0;}

.actions ul {clear: both;}

.shop aside .actions {border-top: 1px solid #d5d5d5; padding: 1.5em 0 0 0; /*margin-bottom: 2em;*/}
.actions li, .shop aside .actions li {margin-bottom: 0.5em;}

.actions li a {background: url(../images/icons.png) no-repeat 0 -477px; padding: 0.25em 0 0.25em 2em;}
.actions li a.favourite {}
.actions li a.favourite-shop {background: url(../images/icons.png) no-repeat 0 -382px;}
.actions li a.contact {background: url(../images/icons.png) no-repeat 0 -752px;}
.actions li a.rss {background: url(../images/icons.png) no-repeat 0 -711px;}
.actions li a.report {background: url(../images/icons.png) no-repeat 0 -455px;}
.actions li a.add-item {background: url(../images/icons.png) no-repeat 0 -334px;}
.actions li a.edit {background: url(../images/icons.png) no-repeat 0 -264px;}
.actions li a.add-or-edit-customisations {
  background: url(../images/icons.png) no-repeat 0 -941px;
}

.meta ul { padding: 1em 0; margin: 0 0 1em 0; }
.share { border: 1px solid #d5d5d5; border-width: 1px 0 1px 0; padding: 1em 0; margin: 0 0 1em 0; }
.meta li {color: #858585; margin-bottom: 0.25em;}

.share, .shop .share {margin: 1em 0 0 0;}
.item .share {padding-bottom: 0.750em;}

.share-prompt p {float: left; margin: 0.25em 1em 0 0;}
.share-prompt .share {float: left; border: none; padding: 0; margin: 0;}
.share-prompt .share li {float: left; margin: 0 1em 0 0;}

.share li, .shop .share li {margin-bottom: 0.5em; }
.item .share li {margin: 0 0.750em 0 0; float: left; width: 80px;}
.item .share-prompt .share li {width: auto;}
.share li.twitter {width: 55px;}
.share li.pinterest {width: 41px;}
.share li.svpply {width: 70px;}
.share li.stumbleupon {width: 18px;}
.share li:last-child {margin: 0;}
.share li.pinterest a.pin-it-button, .share li.pinterest a#PinItButton {background: url(../images/pinit.png) no-repeat 0 0!important; width: 41px!important; height: 20px!important; float: left; text-indent: -999em; }
.share li.pinterest a.pin-it-button:hover {background-position: 0 -21px!important;}
.share li.pinterest a.pin-it-button:active {background-position: 0 -42px!important;}
.share div {}

.shop-share ul {}
.shop-share ul li {}
.shop-share ul li .twitter-follow-button {display: block; margin-top: 9px;}


/* Item template components - various additions
----------------------------------------------------------------*/

.item section[role="main"] section {overflow: hidden;}
.item .item-details h3, .item section[role="main"] section h3 {margin-bottom: 0.5em;}
.item .description {margin-right: 4.672892%;}
.item .description, .item .inspiration  {width: 47.663551%; float: left;} /* if inspiration content is used */
.item .inspiration p {color: #858585;}

/* if only using description */
.item .description-only {width: 73.831776%;}


/* Sold */
section.unavailable {margin-bottom: 2em; border: 1px solid #e6e6dc; padding: 1em;  background: #ffffe5; clear: both;}

.ie7 section.unavailable, .ie8 section.unavailable {display: inline-block;}

section.unavailable header p {}
section.unavailable header h1 {color: #a20303; font-size: 1.5em;}

section.unavailable header {float: left; width: 32.142857%; margin: 0 6.4417178% 0 0;}
section.unavailable.sold-out {min-height: 100px;}
section.unavailable.sold-out header {margin: 0 6.4417178%;}

section.unavailable.empty header {width: 100%; margin-top: 1em;}

.unavailable span.sold {
  display: block;
  height: 102px;
  width: 50px;
  background: url(../images/sold-banner.png) no-repeat 0 0;
  text-indent: -999em;
  position: absolute;
  top: 1.25em;
  left: -11px;
  }

section.unavailable.empty span {top: 0;}

.unavailable header ul {margin: 1em 0 0 0;}


/* Item admin - Add to theme and recommended items */

.item aside .admin {background: #f4f1e7; padding: 1em; margin-bottom: 2em; border: 1px solid #efede2; position: relative;}
.item aside .admin h3 {position: absolute; text-indent: -999em; height: 34px; width: 34px; background: url(../images/feature-f-circle.png) no-repeat 0 0; display: block; right: 1em; top: 1em;}
.item aside .admin label.checkbox {font-weight: bold; color: #000; display: inline-block; margin-bottom: 1em;}
.item aside .admin h4 {}
.item aside .admin ul {overflow: hidden; margin-bottom: 0.5em;}
.item aside .admin ul li {margin-bottom: 0.5em;}
.item aside .admin ul li:last-child {}
.item aside .admin p {margin-bottom: 0.5em; color: #404040;}
.item aside .admin select, .item aside .admin input[type="submit"] {display: inline-block; margin-right: 0.5em;}



/* Shop template - difference and components, various.
----------------------------------------------------------------*/

/*
.shop header.banner {
  background: #fff;
  height: 3em;
  padding: 2.5em 1.5em 1.5em;
  }
*/

.shop .biog header {padding: 1.5em;}
.shop .biog header p, .shop .biog header h4 {margin-bottom: 0;}
.shop .biog header div {position: relative;}
.shop .biog div a:first-child {display:block; width: 27.03%; top: auto;}
span.positive, span.negative {
  display: inline-block;
  height: 16px;
  width: 16px;
  background: url(../images/icons.png) no-repeat 0 -1032px;
  text-indent: -999em;
  margin-left: 0.25em;
  top: 0;
  }

.shop section[role="main"] .shop-info + h2 {margin-bottom: 1em;}

/* rebuilding the shop description, tagline and favourite link */
.shop .shop-info {
  border: 1px solid #efefef;
  background: #fff;
  overflow: hidden;
  margin-bottom: 2em;
  }

.shop section[role="main"] header:first-child {margin-bottom: 0; line-height: 0;}
.shop section[role="main"] header:first-child img {line-height: 0;}
.shop section[role="main"] header:first-child h1 {margin-bottom: 0.5em;}

.shop .shop-info header {padding: 1em 2em 1em 1em; float: left; border-right: 1px solid #efefef; margin: 0 1em 0 0; width: 45%; min-height: 3em;}
.shop .shop-info h2, .shop .shop-info h3 {font-size: 1em; font-weight: bold; letter-spacing: 0;} /* shop name */
.shop .shop-info h2 span {font-weight: normal; color: #111;}
.shop .shop-info h3 {font-weight: normal; color: #8a8a8a;} /* tagline */

.shop .shop-info ul {float: left; padding: 1em;}

.shop .shop-info ul li a.favourite-shop {margin-top: 0.5em;}

.shop .shop-info .shop-description {margin: 0; border-top: 1px solid #efefef; padding: 1em; clear: both;}



/* Basket and Checkout process
----------------------------------------------------------------*/


section.total {margin: 2em 0 1em 0; text-align: right;}

section.total form {overflow: hidden; margin-bottom: 2em;}

section.total div.actions {border: 0;}
section.total div.actions input[type="submit"] {float: right; margin: 0 0 0 10px;}
section.total div.actions input[type="submit"].secondary {margin-top: 0;}
section.total div.actions p {float: none; margin: 6px 10px 0 0; color: #8a8a8a;}

section.total .advice {clear: both; margin: 2em 0; overflow: hidden;} .ie7 section.total .advice {display: none;}
section.total .advice div {float: left; width: 29.54%; background: #d9edf7; margin-left: 2%; padding: 1em;}
section.total .advice div.secure {margin-left: 0;}
section.total .advice p, section.total .advice p a {float: none; margin: 0;}
section.total .advice p {min-height: 3em;}
section.total .advice h3 {font-weight: bold; margin-bottom: 0.25em;}

section.total .advice .secure h3 {background: url(../images/icons.png) no-repeat 0 -870px; padding-left: 1.5em}

.advice a.paypal-logo {float: left;}
.advice a.paypal-logo img {width: 85px;}

section.total div.paypal {
  clear: both;
  margin: 2em 0;
  background: url(../images/paypal-verified.png) no-repeat 0 0;
  padding: 1em 0 2.5em 10em;
  }

section.total div.paypal p {float: none; margin: 0 0 1.5em 0;}

table.basket, table.block {border: 1px solid #d5d5d5; background: #fff; border-collapse: separate;}

table.basket th, table.block th {background: #F4F3F2; padding: 0.583em;}
/*table.basket td*/, table.block td {vertical-align: middle;}
table.basket th.alt {font-weight: normal;}

table.basket th, table.basket td {padding: 1em;}
table td div.item-image {float: left; margin: 0 1em 1em 0;}
table td div.item-description {float: left;}

table td div.item-description ul.order-meta {margin: 1em 0;}
table td div.item-description ul li {color: #8a8a8a; margin-right: 2em;}
table td div.item-description ul li span {display: block;}

.favourite-count {
  color: #8a8a8a;
  padding-left: 1em;
  background: url(../images/heart-grey-mini.png) no-repeat 0 45%;
  display: block;
  }

.order-summary {background: #fcf8e3; border: 1px solid #d5d5d5; margin: 0; border-bottom: none; padding: 0.75em 0.5em; overflow: hidden;}
.order-summary span {display: inline-block; margin: 0 2em 0 0; }
.order-summary ul, .order-summary div {float: left; margin-right: 1em;}
.order-summary ul li {float: left; margin-left: 1em;}
.order-summary ul li:last-child a {margin-top: 0; display: inline-block;}
.order-summary + table.block {margin-top: 0;}
.order-summary strong.total  {color: #000;}
.order-summary strong span {font-weight: normal; color: #8a8a8a; display: inline-block; margin-left: 0.25em;}
.order-summary .order-buyer {display: inline-block; margin-left: 0.5em;}

.order-summary p.discount {
  float: right;
  margin: 0;
  color: #6658a1;
  }


/*Order page */
  ul.order-meta li span.shipped {
    color: #3a7e34;
  }
  ul.order-meta li span.shipped::after {
    position: relative;
    content: "";
    width: 16px;
    height: 16px;
    display: block;
    background: url(../images/tick.png);
    float: left;
    margin-right: 0.2rem;
  }
  
/* Order */
.Order {
  display: flex;
  flex-direction: column;
  margin-bottom: 2em;
}
.Order__header {
  display: flex;
  background: #fcf8e3;
  border: 1px solid #d5d5d5;
  margin: 0;
  border-bottom: none;
  padding: 0.75em 0.5em;
  overflow: hidden;
}
.Order__header__visit-order {
  display: inline-block;
  margin-left: 1em;
}
.Order__show-wrapper .Order__header__visit-order {
  display: none;
}
.Order__body {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid #d5d5d5;
  border-bottom: 0;
  margin: 0;
  padding: 0 0.5em;
  overflow: hidden;
}
.OrderItem {
  display: flex;
  flex-direction: column;
  border-bottom: 1px solid #efefef;
  margin: 8px 8px 0 8px;
  padding-bottom: 8px;
}
.OrderItem__header {
  display: flex;
}
.OrderItem__header__image {
  margin-right: 1em;
}
.OrderItem__header__grouped {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.OrderItem__header__grouped__header {
  display: flex;
  justify-content: space-between;
}
.OrderItem__header__grouped__fields {
  display: flex;
}
.OrderItem__field {
  display: flex;
  margin-right: 1em;
}
.OrderItem__field:last-of-type {
  margin-right: none;
}
.OrderItem__field__name, .Order__field__name {
  font-weight: bold;
  margin-right: 4px;
}
.OrderItem__body {
  display: flex;
  flex-direction: column;
}
.OrderItem__body__row {
  display: flex;
  flex-direction: column;
}
.OrderItem__body__row__customisation {
  display: flex;
}
.OrderItem__body__row__customisation li {
  display: flex;
  margin-left: 1em;
}
.OrderItem__body__row__customisation li span {
  margin-right: 6px;
}
.OrderItem__body__row__customisation li span:last-of-type {
  margin-right: none;
}
.OrderItem__body__row__customisation__name {
  font-weight: bold;
  color: #777;
}
.Order__footer {
  display: flex;
  background: #fff;
  border: 1px solid #d5d5d5;
  border-top: 0;
  margin: 0;
  padding: 0.75em 1em 2em;
  overflow: hidden;
  justify-content: space-between;
}
.Order__footer form {
  margin: 0 !important;
  padding: 0 !important;
}
.Order__footer__shipping {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.Order__footer__shipping .shipping-status.pending {
  display: inline-block;
  font-weight: bold;
  color: #777;
  height: 16px;
}
.Order__footer__shipping .shipping-status.shipped {
  display: inline-block;
  background: url('/images/tick.png') no-repeat;
  padding-left: 20px;
  font-weight: bold;
  color: #777;
  height: 16px;
}
.Order__footer__charges {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  text-align: right;
}
.Order__footer__charges .payment-status.paid {
  display: inline-block;
  background: url('/images/tick.png') no-repeat;
  padding-left: 20px;
  font-weight: bold;
  color: #777;
  height: 16px;
}
.Order__footer__charges .payment-status.failed {
  display: inline-block;
  background: url('/images/error.png') no-repeat;
  padding-left: 20px;
  font-weight: bold;
  color: #777;
  height: 16px;
}
@media print {
  .Order__show-parent {
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
    width: 100%;
  }
  .Order .seller-action {
    display: none;
  }
}
/* /Order */

/* BuyerBoughtOrder */
.BuyerBoughtOrder td, .BuyerBoughtOrder th {
  border: 0;
  border-top: 1px solid #d5d5d5;
}
.BuyerBoughtOrder tr.extra-fields td, .BuyerBoughtOrder tr.extra-fields th {
  border: 0;
  text-transform: none;
}
.BuyerBoughtOrder tr.extra-fields td {
  padding: 0;
  padding: 0 1em 1em 0;
}
.BuyerBoughtOrder tr.extra-fields td .field {
  display: flex;
  justify-content: flex-end;
}
.BuyerBoughtOrder tr.extra-fields td .field .field-name {
  font-weight: bold;
  color: #888;
  margin-right: 8px;
}
/* /BuyerBoughtOrder */

table.basket input[type="submit"], table.block input[type="submit"] {display: inline-block;}
table.basket input[type="text"], table.block input[type="text"] {margin-right: 1em;}

table .figure form {margin: 0.5em 0 0 0;}

table address {font-style: normal; color: #8a8a8a}

/*note to shop */
textarea.note-to-seller {width: 95%; height: 40px; margin: 0;}
tr.note-to-seller td {text-transform: none;}

/*Inline error message in Basket */
table td p.error {background: transparent url(../images/icons.png) no-repeat 0 -905px; padding: 0.5em 0 0.5em 2em;}

/* padding on some table cells */
table.pad td {padding: 0.5em;}
table th.stock {padding-left: 2em;}
table.pad td.no-pad {padding: 0 1em;}

/* Checkout progress */

.progress {position: relative;  margin: 0 0 2em 0;}
.progress h4 {}
.progress ol { margin: 0; border-top: 1px solid #d5d5d5; padding: 1em 0; border-bottom: 1px solid #d5d5d5;}
.progress ol li {
  float: left;
  margin: 0 1.5em 0 0;
  width: 14.110429%;
  list-style-position: inside;
  position: relative;
  text-align: center;
  color: #8a8a8a;
  }

.progress li.active {color: #404040;}
.progress ol li a {}

.progress span {
  background: none repeat scroll 0 0 #404040;
    top: 0;
    display: block;
    height: 1px;
    left: 0;
    position: absolute;
    text-indent: -9999px;
    width: 7%;
  }

.progress.step-2 span {width: 24%}
.progress.step-3 span {width: 40%}
.progress.step-4 span {width: 55%}

/* small indicator dot */
.progress li:after {
  content: " ";
  height: 8px;
  width: 8px;
  background: #d5d5d5;
  border-radius: 4px;
  display: block;
  position: absolute;
  left: 50%;
  top: -16px;
  }

/* this seems over complicated - is it a product of an exhausted mind?  */
.progress li.active:after,
.progress.step-2 li:nth-child(1):after,
.progress.step-3 li:nth-child(3):after,
.progress.step-3 li:nth-child(1):after,
.progress.step-3 li:nth-child(2):after,
.progress.step-4 li:nth-child(1):after,
.progress.step-4 li:nth-child(2):after,
.progress.step-4 li:nth-child(3):after
 {content: none;}

.progress.shop li.active:after {content: " "; background: #404040;}


/* cart icon */
.progress li.active a:after, .progress.step-2 li:nth-child(2):after, .progress.step-3 li:nth-child(3):after, .progress.step-4 li:nth-child(4):after  {
  content: " ";
  background: url(../images/icons.png) no-repeat 0 -528px;
  width: 16px;
  height: 17px;
  position: absolute;
  right: 42%;
  top: -25px;
  text-indent: -999em;
  }

.checkout section.order-summary header {margin: 1em 0 0 0; padding-top: 1em; border-top: 1px solid #d5d5d5;}
.checkout section.order-summary header h3 {font-weight: bold;}

.checkout .shop-basket:nth-child(1n+2) {margin-top: 2em;}
.checkout .shop-basket header {margin: 0;}
.checkout .shop-basket th.order-total form, .checkout th.order-total span, .account .shop-basket th.order-total form, .account th.order-total span {display: inline-block;}
.checkout .shop-basket th.order-total input[type="submit"] {margin: 0;}
.checkout th.order-total span, .account th.order-total span {top: 0.167em; position: relative; margin-right: 1em; color: #000;}

th.order-total span.order-status {color: #404040; margin: 0;}

.upsell h3 {
  color: #f15941;
  margin: 2em 0 0.5em 0;
  font-weight: bold;
  }

.upsell .errorExplanation {
  padding: 1em;
    background: #fcf8e3;
    background-image: none;
  }

.upsell .errorExplanation h2 {font-size: 1em; font-weight: bold; padding: 0.75em 0 0 2em; margin-bottom: 1em; color: #A11903;}

/* Form
----------------------------------------------------------------*/

label, div.label {
  display: block;
  font-weight: bold;
  margin-bottom: 0.5em;
  }

label em, label span, span.required {font-weight: normal; color: #8a8a8a; display: inline-block; margin-left: 0.5em;}
label.checkbox, label.radio, .radio-list label {font-weight: normal; color: #111;}

div.label label { display: inline;}
label.checkbox + p, input + p, textarea + p, form ul + p, p.status_message + p  {color: #8a8a8a;} /* often paragraphs following checkboxes are advisory notes */

input, textarea, select {
  padding: 0.5em;
  font-size: 100%;
  max-width: 100%;
  }

 select {padding: 0.25em;}

 input[type="file"] {padding: 0;}

.account input, .account select, .account textarea,
.checkout input, .checkout select, .checkout textarea
 {margin-bottom: 1em;}

.account select {margin-right: 1em;}
.account textarea, .checkout textarea {width: 70%; height: 6em;}

.checkout input[size="30"] {width: 40%;}
.checkout form#address_details {margin-bottom: 2em;}

.checkout aside.upsell input[size="30"] {width: auto;}

input[type="search"] {}

select {}

input[type="checkbox"], input[type="radio"] {
  border: medium none;
    height: auto;
    line-height: normal;
    margin: 0.25em 0.25em 0.25em 0;
    padding: 0;
    width: auto;
  }

input[type="radio"] {vertical-align: top}


input[type="submit"], button.submit, a.submit {
    background: #b1c042;
    /*border-radius: 0.25em;*/
    color: #fff;
    letter-spacing: 1px;
    padding: 0.5em 0.75em;
    text-transform: uppercase;
    font-weight: bold;
    line-height: 1;
    text-shadow: 0px 1px 0px rgba(0,0,0,0.2);
    /*display: block;*/
    text-align: center;
    border: 0;
    border-radius: 2px;
  }

a.submit { display: inline-block; }
a.submit:hover { background: #9dab35; }

input[type="submit"].alt {
  background: #f37200; 
  font-size: 1.25em;
  } 

@media only screen and (max-width: 480px) {

  form[data-role="cart-confirmation"] header.tandem div.actions {
    width: 100%;
  }

  form[data-role="cart-confirmation"] input[data-role="confirm"] {
    width: 100%;
    height: 3em;
    margin: 0;
    margin-bottom: 1em;
  }

  form[data-role="pp-form"] {
    width: 100%;
  }

  form[data-role="pp-form"] input[data-role="pp-pay"] {
    width: 100%;
    height: 3em;
  }

}


input[type="submit"].alt:hover,
input[type="submit"].alt:focus {background: #dd6800;} 

input[type="submit"].final {font-size: 1.25em;} 
input[type="submit"].space {margin-top: 1em;}

input[type="submit"]:hover {}

input[disabled="disabled"],
textarea[disabled="disabled"],
input[readonly="readonly"],
textarea[readonly="readonly"] {
  background-color: #ddd!important;
  cursor: not-allowed!important;
  /*border: 2px solid #d5d5d5!important;*/
  }
  
section.total div.actions p.paypal-logo {margin: 0; clear: both;}
  
section.total div.actions p.paypal-logo a {
  float: none;
  margin: 0;
  }


/* Adding Rails generic error field class - the input is wrapped in a span by default */
.fieldWithErrors input {color: #a11903; background: #ffffe5 }


/* label ~ input[type="checkbox"] {color: red;} */

input[type="submit"]:hover {}

textarea, .input-list {
  box-shadow: rgba(0,0,0, 0.3) 0px 1px 1px inset;
    -moz-box-shadow: rgba(0,0,0, 0.3) 0px 1px 1px inset;;
    -webkit-box-shadow: rgba(0,0,0, 0.3) 0px 1px 1px inset;
  border: 1px solid #c3c3c3;
  border-bottom: 1px solid #ddd;
  border-top: 1px solid #7c7c7c;
  }

/*
.account fieldset {
  background: #fff;
  padding: 1em;
  margin-bottom: 1em;

  box-shadow: 1px 0px 1px rgba(0,0,0,0.1);
  -webkit-box-shadow: 1px 0px 1px rgba(0,0,0,0.1);
  -moz-box-shadow: 1px 0px 1px rgba(0,0,0,0.1);

  border: 1px solid #f2f2f0;
  }
*/

fieldset h3 {border-top: 1px solid #d5d5d5; padding: 1em 0 0 0; margin: 1em 0 0.75em;}

table td input, .account table td input, .radio-list label, .account form.sort-select {margin: 0; }
table td label.checkbox input {margin: 0.25em 0.25em 0.25em 0;}
table td label.checkbox {}

/* Container for form actions - usually a primary and secondary submit */

form .actions, .message.preview form {overflow: hidden; margin: 1em 0; border-bottom: 1px solid #d5d5d5; padding-bottom: 1em;}
form .actions input[type="submit"], form .actions a, .message.preview form input[type="submit"], .message.preview form a, form .actions span, .actions button.submit {float: left; margin: 0 1em 0 0;}
form header.tandem.alt .actions input[type="submit"] {float: right; margin: 0 0 0 1em;}
form .actions a, .message.preview form a, form .actions span, .overlay-content .actions a {display: inline-block; margin-top: 0.417em;}
form .actions a.button {margin-top: 0;}
form .actions.no-divide {border: none; padding: 0; margin-bottom: 0;}

/* hover popup link */
form .actions a.why {color: #8a8a8a; margin-left: 0.5em;}

form .actions a.continue-shopping {float: right;}

.message.preview form {border: none; padding: 0;}


input[type="submit"].secondary, .buy-item a, td ul.action li a, a.button, .item aside .admin label.checkbox, ul.gallery li a.secondary, button.secondary  {
  -webkit-appearance: none;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  background: #e5e5e5;
  background: -moz-linear-gradient(top center, white 0%, #e5e5e5 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, white), color-stop(1, #e5e5e5));
  border: 1px solid;
  color: #444;
  font-size: 1em;
  font-weight: normal;
  padding: 0.25em 0.5em;
  text-shadow: white 0 1px 1px;
  width: auto;
  border-color: #eee #ccc #aaa;

  text-transform: none; letter-spacing: 0;

  line-height: 1.5;
  }

input[type="submit"].secondary:hover, ul.action li a:hover, a.button:hover, .item aside .admin label.checkbox:hover, ul.gallery li a.secondary:hover, button.secondary:hover {
  background: #ebebeb;
  background: -moz-linear-gradient(center top , #fbfbfb, #ebebeb) repeat scroll 0 0 transparent;
  background: -webkit-gradient(linear, center top, center bottom, from(#fbfbfb), to(#ebebeb));
  color: #000;
  }

input[type="submit"].secondary.super {
  color: #000;
  font-weight: bold;
  background: #a8d1df;
  background: -moz-linear-gradient(center top , #e6f3f8, #a8d1df) repeat scroll 0 0 transparent;
  background: -webkit-gradient(linear, center top, center bottom, from(#e6f3f8), to(#a8d1df));
  border-color: #d3dee3 #b3c6ce #95a8b0;
  }

input[type="submit"].secondary.super:hover {
  background: #9ec7d5;
  background: -moz-linear-gradient(center top , #dcebf0, #9ec7d5) repeat scroll 0 0 transparent;
  background: -webkit-gradient(linear, center top, center bottom, from(#dcebf0), to(#9ec7d5));
  border-color: #cbd7dd #b3c6ce #95a8b0;
  }

/* favourite item */
.buy-item a, .buy-item a:hover, .item aside .admin label.checkbox {
  background: #e5e5e5;
  background-image: url(../images/icons.png);
  background-position: 6px -474px;
  background-repeat: no-repeat;

  background: url(../images/icons.png) no-repeat 6px -473px, -moz-linear-gradient(top center, white 0%, #e5e5e5 100%);
  background: url(../images/icons.png) no-repeat 6px -473px, -webkit-gradient(linear, left top, left bottom, color-stop(0, white), color-stop(1, #e5e5e5));
  background: url(../images/icons.png) no-repeat 6px -473px, -ms-linear-gradient(top, #ffffff, #e5e5e5);
  background: url(../images/icons.png) no-repeat 6px -473px, linear-gradient(top, #ffffff, #e5e5e5);

    padding: 5px 6px 5px 26px;
    display: inline-block;
    margin-top: 0.333em;
    }

@media screen and (max-width: 30.999em) {
  .buy-item a, .buy-item a:hover, .item aside .admin label.checkbox {
    min-width: 4rem;
  }
}


.buy-item a:hover  {
  background: url(../images/icons.png) no-repeat 6px -473px, -moz-linear-gradient(0% 100% 90deg, #ebebeb, #fbfbfb);
  background: url(../images/icons.png) no-repeat 6px -473px, -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fbfbfb), to(#ebebeb));
  background: url(../images/icons.png) no-repeat 6px -473px, -ms-linear-gradient(top, #fbfbfb, #ebebeb);
  background: url(../images/icons.png) no-repeat 6px -473px, linear-gradient(top, #fbfbfb, #ebebeb);
  color: #000;
  }

.item aside .admin label.checkbox {background: url(../images/colour-wheel-open.png) no-repeat 6px 5px, -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fbfbfb), to(#f4f4f4)); background: url(../images/colour-wheel-open.png) no-repeat 6px 5px, -moz-linear-gradient(0% 100% 90deg, #f4f4f4, #fbfbfb); padding-right: 1em; margin-bottom: 1em;}
.item aside .admin label.checkbox:hover {background: url(../images/colour-wheel-open.png) no-repeat 6px 5px, -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fbfbfb), to(#ebebeb)); background: url(../images/colour-wheel-open.png) no-repeat 6px 5px, -moz-linear-gradient(0% 100% 90deg, #ebebeb, #fbfbfb);}

ul.action li a {display: block;}
td ul.action li a {display: inline-block;}
td ul.action li {margin-bottom: 0.5em; position: relative;}
td ul.action li img.spinner {position: absolute; top: 5px; right: -4px; z-index: 100;}

/* Adding a generic form class for inline label, elements and submits */

form.inline {margin: 1em 0;}
form.inline input[type="submit"], form.inline select, form.inline label, select.inline, fieldset.inline input, fieldset.inline label, fieldset.inline span {display: inline-block; margin: 0 0.5em 0 0; vertical-align: middle;}
td form.inline {float: left;}

/* list item form */

p.polite-notice {
  background: #D9EDF7;
  text-align: left;
  float: left;
  padding: 1rem;
  left: 0;
  margin: 1rem 0 0 0 !important;
  box-sizing: border-box;
  color: #3A87AD;
  clear: both;
  width: 100%;
}
@media screen and (min-width: 480px) {
  p.polite-notice {
    padding: 1rem 2rem 1rem 2rem;
  }
  p.polite-notice span {
    position: relative;
  }
  p.polite-notice span:before {
    content: '!';
    position: absolute;
    width: 1rem;
    height: 1rem;
    font-weight: 600;
    text-align: center;
    line-height: 1rem;
    display: inline-block;
    border-radius: 100%;
    color: white;
    background: #3A87AD;
    margin-left: -1.4rem;
  }
}

@media screen and (min-width: 768px) {
  p.polite-notice {
    width: 75%;
  }
}

p.polite-notice span {
  display: block;
  font-weight: 600;
}

.account form {margin-bottom: 2em;}
.account form fieldset:last-child {margin-bottom: 2em; border-bottom: 1px solid #d5d5d5; padding-bottom: 2em;}
#list-item input[type="text"], .login input[type="text"], .login input[type="password"], .account input[size="30"] {width: 70%;}

#list-item input#item_price {width: 10%;}

#list-item table td input[type="text"] {width: 30%;}

.second-category-select {margin: 0.5em 0 1em;}
.second-category-select label {margin-bottom: 1em;}

#list-item #tags {
  margin-top: 1em;
  margin-bottom: 1.5em;
}
#list-item #tags p { margin-bottom: 5px; }

/* collections */
div#collections div.ui {
  display: block;
  width: 72%;
  min-height: 2em;
  background: #e8e8e4;
  margin-bottom: 2em;
  padding-top: 0.5em;
  padding-left: 0.5em;
}
div#collections div.ui ul li {
  display: inline-block;
  margin-right: 0.5em;
  margin-bottom: 0.5em;
  padding-left: 5px;
  padding-right: 5px;
  background: #ccc;
  border: 1px solid #ccc;
}
div#collections div.ui ul li:hover {
  background: #bbb;
  cursor: pointer;
}
div#collections div.ui ul li.selected {
  background: #9dab35;
  color: white;
  border: 1px solid #f90;
}
/* /collections */


/* Tag - invisible text box within a list array */

/* style the container to mimic a text box */
.input-list {background: #fff;padding: 0.5em;overflow: hidden; margin-bottom: 1em; width: 70%;}
.input-list li, .item aside .admin ul li, ul.tag li {
  float: left;
  position: relative;
  margin-right: 0.5em;
  background: #E9E9E9;
  display: block;
  line-height: 20px;
  padding: 0.25em 2em 0.25em 0.5em;
  position: relative;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  }

.input-list li.user-created {background: #e0ecee; }

/* cross icon for the remove link */
.input-list li a, .item aside .admin ul li a, nav.tag ul li a[title="remove"] {
  background: url(../images/icons.png) no-repeat 0 -1288px;
  text-indent: -999em;
  display: inline-block;
  height: 8px;
  width: 8px;
  position: absolute;
  right: 8px;
  top: 9px;
  }

.ie7 .input-list li a, .ie8 .input-list li a {zoom: 1; float: left; z-index: 100;}

.input-list li input {border: 0; background: none; margin: 0; padding-left: 0;}
.input-list li.add-item {background: none; padding: 0; display: block;}


/* photo uploader fieldset

.photos ul li {
  border: 1px solid #d5d5d5;
  background: #fff;
  float: left;
  position: relative;
  height: 84px;
  width: 84px;
  display: block;
  margin: 0 1em 1em 0;
  }

.photos ul li a {display: block; background: #fff; position: relative; height: 84px; width: 100%;}
.photos ul li a:hover {background: #faf9f1;}
.photos ul li a span {background: url(../images/icons.png) no-repeat 0 -336px;
  height: 16px; width: 16px;
  display: block;
  text-indent: -999em;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  }
 */

 /* uploaded */

.additional-image, .image-upload p {overflow: hidden; clear: both;}


.image-upload figure {position: relative; width: 84px; float: left; margin: 0 1em 1em 0;}
.image-upload figure:last-child {margin-right: 0;}
.image-upload figure a.remove, .theme-items ul li a[title="remove"] {
  display: block;
  height: 16px;
  width: 16px;
  text-indent: -999em;
  background: url(../images/icons.png) no-repeat 0 -1328px;
  position: absolute;
  top: -6px;
  right: -8px;
  border: 2px solid #fff;
  border-radius: 16px;
  }

.uploaded {position: relative; margin: 1em 0;}
.uploaded img {vertical-align: top;}
.uploaded a,  div.uploaded span {display: inline-block; margin-left: 0.5em;}
.uploaded li {margin-bottom: 0.5em;}

.image-upload figure + p {margin-top: 0.5em; color: #8a8a8a;}
img.current-banner {margin-bottom: 1em;}


/* Image Uploader
----------------------------------------------------------------*/
 #image-ui {
  width: 100%;
  padding: 0;
  margin: 0;
  }

#image-ui #image-list {
  list-style: none;
  padding: 0;
  margin: 0;
  }

#image-ui #image-list li {
  padding: 0.25em;
  margin: 0 1em 0 0;
  display: inline-block;
  float: left;
  width: 84px;
  height: 84px;
  list-style-type: none;
  background: #fff;
  border: 1px solid #d5d5d5;
  position: relative;
  }


#image-ui #image-list li.loaded:first-child:after {
  content: "Main image";
  background: rgba(0,0,0,0.6);
  display: block;
  color: #fff;
  text-align: center;
  position: absolute;
  width: 84px;
  bottom: 2px;
  }

#image-ui #image-list li input {margin: 0;}
#image-ui #image-list li.placeholder {background: #fff;}

#image-ui #image-list li.select {
  cursor: pointer;
  background: #fff url( "/images/image-ui/add-photo.png" ) no-repeat center center;
  border: 1px solid #d5d5d5;
  padding: 0.25em;
  }

#image-ui #image-list li.uploading {background: #fff url( "/images/folksy-loading.gif" ) no-repeat center center;}
#image-ui #image-list li.failed {background: #fff url( "/images/image-ui/failed-image.png" );}

#image-ui #image-list li.loaded {cursor: move;}
#image-ui #image-list li.loaded img {padding: 0; margin: 0;}


#image-ui #image-list li.dragover {
  background-image: none;
  background-color: #fff;
  border: 1px solid #a5a5a5;
  }

#image-ui #image-list li.dragover img {
  opacity: 0.3;
  filter: alpha( opacity=30 );
  }

#image-ui #image-list li a.remove {
  display: block;
  position: absolute;
  height: 16px;
  width: 16px;
  background: url( "/images/icons.png" ) no-repeat 0 -1328px;
  text-indent: -999em;
  border: 2px solid white;
  border-radius: 16px;
  top: -8px;
  right: -8px;
  cursor: pointer;
  }
/* IE9 Image Uploader
----------------------------------------------------------------*/

#ie-image-form input { display: inline-block; margin-right: 1em; }

/* specific style for the item quantity section of the item listing form */
fieldset .item-quantity {margin-bottom: 1em;}
fieldset .item-quantity input, .item-quantity span.charge { }
fieldset .item-quantity label, fieldset .item-price label {width: 52px;}
fieldset.inline p.cost, fieldset.inline p.free  {margin: 0 1em 0 0; display: inline-block; vertical-align: middle; color: inherit;}
fieldset.inline p.cost span {margin: 0;}
fieldset .item-price label span {font-weight: bold; display: inline-block; margin-left: 0.5em; vertical-align: top; color: #444;}


.returns-policy {}
.returns-policy h4 {font-weight: bold; margin-bottom: 1em;}

.returns-policy label {}


 /* Auto complete list
----------------------------------------------------------------*/
.ui-autocomplete {
  background: #fbfbfb;
  background: -moz-linear-gradient(center top , #fbfbfb, #f9f9f9) repeat scroll 0 0 transparent;
  background: -webkit-gradient(linear, center top, center bottom, from(#fbfbfb), to(#f9f9f9));

  border: 1px solid #f0f0f0;
    border-bottom: 1px solid #e0e0e0;
    border-left: 1px solid #eaeaea;
    border-right: 1px solid #e2e2e2;

  box-shadow: 1px 0px 1px rgba(0,0,0,0.1);
  -webkit-box-shadow: 1px 0px 1px rgba(0,0,0,0.1);
  -moz-box-shadow: 1px 0px 1px rgba(0,0,0,0.1);

    width: 168px;
    top: 8px;
    left: 0;
  }
.ui-menu-item {}
.ui-menu-item a {padding: 0.25em 0.5em; display: block; width: auto;}
.ui-menu-item a:hover, a.ui-state-hover {color: #000; background: #efefef; cursor: pointer; }


 /* Inline Validation
----------------------------------------------------------------*/
fieldset ol, form ol, fieldset ol li, form ol li {list-style-type: none; margin: 0;}
.inline-error {border: 2px solid #ff1e00; }
input.inline-error, textarea.inline-error {background-color: #fefef0;}

.ok {}
p.error_message.status_message {
  color: #ff1e00;
  padding-left: 1.5em;
  background: url(../images/red-cross.png) no-repeat 0 2px;
  text-indent: 0;
  width: auto;
  height: auto;
  float: none;
  display: block;
  margin: 0 0 1em 0;
  }
p.status_message {
  /*background: url(../images/green-tick.png) no-repeat 0 0;
  height: 12px;
  width: 12px;
  text-indent: -999em;
  float: right;*/
  display: none;
  }

td p.error_message.status_message {margin: 0.5em 0;}


/* Shop views - dashboard
----------------------------------------------------------------*/

.account section header.dashboard-title {margin: 3em 0 1em; padding: 0;}
.dashboard-title h1, .dashboard-title h2 {font-size: 1em; letter-spacing: 0;}
.account section header.dashboard-title  h1 {float: left; font-weight: bold;}
.account section header.dashboard-title  h1 span {font-weight: normal;}
.dashboard-title p, .dashboard-title a {display: inline-block; margin-bottom: 0 }

.dashboard-title a {margin-left: 1em;}
.dashboard-title a:hover {}
.dashboard-title .shop-info {float: right;}


section.dashboard {
  background: #fff;
  padding: 3em;
  border: 1px solid #efefef;
  margin-bottom: 5em;
  }

.dashboard h2 {font-size: 1.5em; font-weight: bold; letter-spacing: 0;}

.dashboard .summary {margin-bottom: 3em;}
.dashboard .summary h1 {
  font-size: 4em;
  font-weight: 300;
  letter-spacing: -1px;
  line-height: 1.2;
  }

.summary .up {color: #b2c248;}
.summary .down {color: #ff545a;}

.shop-data-week {padding: 1em; background: #ffffd5; margin-bottom: 3em; overflow: hidden;}
.shop-data-week h2, .shop-data-week dl {float: left; margin: 0;}
.shop-data-week dt, .shop-data-week dd {display: inline-block;}
.shop-data-week dt {margin-right: 0.25em; font-weight: normal; color: #000;}
.shop-data-week dd {margin-right: 2em; font-weight: 700;}

.shop-data-week h2 {font-size: 1em; margin: 0 2em 0 0;}

.data-intro {overflow: hidden; margin-bottom: 3em;}

.shop-compare {float: left; width: 600px;}

.main-count {
  color: #fff;
  height: 90px;
  width: 150px;
  border-radius: 100px;
  text-align: center;
  float: right;
  padding: 30px 0;
  margin-top: 6em;
  background-color: #b2c248;
  }

.main-count h2 {color: #fff; margin: 0; font-weight: normal; font-size: 1em;}
.main-count strong {
  font-weight: bold;
  font-size: 5em;
  display: block;
  margin: -4px 0 0 0;
  line-height: 1;
  }

.item-views ol li .indicator {
  display: inline-block;
  float: left;
  width: 0;
  height: 0;
}
.item-views ol li .indicator.up {
  margin-top: 24px;
  border-left: 16px solid transparent;
  border-right: 16px solid transparent;
  border-bottom: 24px solid #b2c248;
}
.item-views ol li .indicator.down {
  margin-top: 24px;
  border-left: 16px solid transparent;
  border-right: 16px solid transparent;
  border-top: 24px solid #ff545a;
}
.item-views ol li .indicator.same {
  margin-top: 24px;
  margin-left: 6px;
  border-top: 16px solid transparent;
  border-bottom: 16px solid transparent;
  border-left: 24px solid #d5d5d5;
}

.dashboard div.improve {
  margin-top: 4em;
  font-size: 80%;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
}
.dashboard div.improve ol {
  font-weight: normal;
}

.item-views {clear: both; overflow: hidden;}
.item-views ol {margin: 0 0 2em 0; list-style-type: none;}
.item-views ol li {
  border-bottom: 1px solid #d5d5d5;
  padding: 2em 0;
  position: relative;
  overflow: hidden;
  }

.item-views ol li:first-child {padding-top: 0;}

.item-views ol li .data {
  margin-left: 2em;
  vertical-align: top;
  white-space: nowrap;
  float: left;
  }

.item-views ol li .data.graph {margin-left: 3em;}

.item-views ol li .data.total-views {float: right;}

.item-views ol li h3 {font-size: 1em; margin-bottom: 1em;}
.item-views ol li .data h4 {margin-bottom: 0.75em; color: #8a8a8a;}

.item-views ol li .data .number {
  font-weight: bold; font-size: 3em; letter-spacing: -1px;
  }

.dashboard .notes {}

/* graphing */
.popular-sparkline {}
.sparkline {stroke: #ccc; stroke-width: 1px; fill: none;}
polyline { fill: none; stroke-width: 1; }
polyline.support { stroke-width: 1; stroke: #bbb; }
polyline.this-year { stroke: #11c; }
polyline.last-year { stroke: #bbf; }
polyline.item-views { stroke: #d5d5d5; }
.popular-sparkline text.label {font-size: 12px; fill: #8a8a8a;}
.popular-sparkline text.label.max { font-weight: bold; fill: #555; }
.popular-sparkline text.this-year { fill: #11c; }
.popular-sparkline text.last-year { fill: #bbf; }

/* Folksy Admin
----------------------------------------------------------------*/

.theme-graphic {overflow: hidden;}
.theme-graphic div {float: left; width: 47.933884%;}
.theme-graphic div:first-child {margin-right: 4.1322314%;}
.theme-graphic figure img {margin-bottom: 0.5em;}

/* edit-in-place */

.edit-in-place {background: #fefbc7; display: inline-block; margin-right: 0.5em;}
.edit-in-place:hover {}

form.edit.in-place {width: ; margin: 0 0.5em 0 0;}
form.edit.in-place, form.edit.in-place input {display: inline-block}
form.edit.in-place input[type="text"] {width: auto; padding: 0.25em; margin: 0;}
a.cancel {display: inline-block;}

/* Link form fields */

fieldset.link {display: block;}
fieldset.link input, fieldset.link label {display: inline;}
fieldset.link label {min-width: 6em; display: inline-block;}
fieldset.link input[type=text] {width: 15em;}
fieldset.link input.link {margin-right: 1em;}


.new-customer {padding-right: 4%; width: 46%; float: left;}
.sign-in {padding-left: 4%; border-left: 1px solid #d5d5d5; width: 45.8%; float: left;}

/* decorative 'or' */

.new-customer span.or, div.button-choice span.or {
  position: absolute;
  height: 12px;
  width: 20px;
  padding: 10px;
  padding-top: 18px;
  border-radius: 20px;
  text-align: center;
  background: #f15b40;
  font-weight: bold;
  color: #fff;
  right: -20px;
  top: 50%;
  z-index: 2;
  font-size: 1.5em;
  line-height: 0;
  }

.new-customer span.or.new-seller {top: 30%;}


div.button-choice {
  position: relative;
  width: 50%;
  margin: 0 auto;
  }

div.button-choice input {float: left;}
div.button-choice input:last-child {float: right;}
div.button-choice span.or {left: 43%; bottom: 10px;}

/* Pagination - A shot in the dark.
----------------------------------------------------------------*/

nav.paging .pagination {
  margin-left: 0;
  list-style: none;
  text-align: center;
  font-size: 1.1em;
  }

nav.paging .pagination li {
  display: inline-block;
  margin: 0;
  }

nav.paging .pagination span,
nav.paging .pagination a {
  display: block;
  margin: 0 0.1em;
  border-radius: 3px;
  padding: 0.3em 0.7em;
  background: #fff;
  }

nav.paging .pagination span.current {
  background: #f0efeb;
  font-weight: bold;
  }

nav.paging .pagination a#page-previous:before {
  display: inline-block;
  margin-right: 0.2em;
  font-weight: bold;
  content: "\00AB";
  }

nav.paging .pagination a#page-next:after {
  display: inline-block;
  margin-left: 0.2em;
  font-weight: bold;
  content: "\00BB";
  }

nav.paging .pagination a:hover,
nav.paging .pagination a:focus {
  background: #047da3;
  color: #fff;
  }

nav.paging {overflow: hidden; margin: 0 0 1em 0;}
nav.paging .pagination {float: right;}
nav.paging p {float: left; margin: 0;}

.shop .pagination {text-align: center; padding: 0.333em; cursor: default;}
.shop .pagination ul {overflow: hidden;}
.shop .pagination li {float: left; margin-right: 0.5em;}

.shop .pagination a, .pagination span, .pagination em {}
.shop .pagination .disablepage {color: #aaaaaa; }
.shop .pagination .currentpage {font-weight: bold; color: #000; }
.shop .pagination a {}

.shop .pagination a:hover, .pagination a:focus { }
.shop .pagination .page_info {color: #8a8a8a; padding-top: 1em; }
.shop .pagination .nextpage {margin-right: 0.5em;}

.shop .pagination + p {}


/* Misc.
----------------------------------------------------------------*/

blockquote {margin: 1em 0;}
blockquote p {color: #8a8a8a;}

.status h4 {margin: 0.5em 0}
strong.featured {background: url(../images/icons.png) no-repeat 0 -313px; padding-left: 1.75em; font-weight: normal;}

.print-post {}
.print-post h4 {color: #404040}
.account .print-post form {margin: 0;}
.print-post p {color: #8a8a8a}
.print-post ul {margin: 0.5em 0 0.5em 0;}
.print-post ul li span {display: inline-block; color: #8a8a8a; margin-top: 0.5em;}


/* Scroll to top - see folksy-ui.js for implementation */

#toTop {
  display: none;
  text-decoration: none;
  position: fixed;
  bottom: -4px;
  right: 1em;
  overflow:hidden;
  width: 140px;
  height: 48px;
  border:none;
  text-indent: -999px;
  background: url(../images/scroll-top.png) no-repeat 0 -51px;
  z-index: 5;
  }

#toTopHover {
  background:url(../images/scroll-top.png) no-repeat 0 -4px;
  width: 140px;
  height: 48px;
  display: block;
  overflow: hidden;
  float: left;
  opacity: 0;
  -moz-opacity: 0;
  filter:alpha(opacity=0);
  }

#toTop:active, #toTop:focus {outline:none;}



/* IMPORTED FROM OLD THEME
These need to be simpler or removed where possible
----------------------------------------------------------------*/


/* shop sections list */
ul#shop_sections {margin: 1em 0;}
ul#shop_sections li {background: #fff; border: 1px solid #d5d5d5; padding: 0.5em; margin-bottom: 0.5em; position: relative;}
ul#shop_sections li:first-child {}
ul#shop_sections li:hover {cursor: move;}
ul#shop_sections li:hover span.shop_section_in_place_editor {cursor: text;}
ul#shop_sections li span.item-count, .section-list li span  {color: #8a8a8a;}
ul#shop_sections a {position: absolute; right: 0.5em;}
ul#shop_sections li.dragdrop-placeholder {height: 2em; background: #ebf4f9;}

p.drag-note {color: #8a8a8a; background: url(../images/drag-handle.png) no-repeat 0 50%; padding-left: 1.5em;}

form#new_shop_section {margin-bottom: 1em;}
form#new_shop_section input {margin-right: 0.5em;}
form#new_shop_section a {vertical-align: middle;}

#refresh {overflow: hidden;}
.bulk-action {float: left;}
.bulk-action input[type="submit"] {display: inline-block;}

#pagination_control {width: 50%; float: right; overflow: hidden;}
#pagination_control .show-items {float: right;}
#pagination_control .show-items label {
  font-weight: normal;
  display: inline-block;
  vertical-align: middle;
  margin-right: 1em;
  }

.section-list {overflow: hidden;}
.section-list li {margin: 0 0.5em 0.5em 0;}
.section-list li:after {content: ","}
.section-list li:last-child:after, .section-list li:first-child:after {content: ""}

#shop_section_items tr td img {margin-right: 0.5em;}
#shop_section_items tr td select {vertical-align: middle;}

.bulk-action {margin-bottom: 0.5em;}

span.in_progress {
      background: url('../images/loading.gif') no-repeat 0 50%;
      height: 16px;
      width: 16px;
      margin: 0 0 0 0.5em;
      padding: 0;
      vertical-align: middle;
      display: inline-block;
      text-indent: -999em;
      }
span.in_progress.hidden {visibility: hidden;}

/* Shipping addresses */

.shipping-address {overflow: hidden;}
.adr, .panel, .buyer-info, .seller-info {width: 29.96761%; float: left; margin-right: 4.132234%; background: #fff; padding: 0.25%; background: #eee; margin-bottom: 2em;}
.adr span {display: block;}

.shipping-address li:nth-child(3n) {margin-right: 0;}

div.basket-address-error {
  display: none;
}

.adr form#address_details {margin: 0;}
.adr form#address_details input {margin-top: 1em;}
.adr form .actions {border-bottom: none; background: transparent; padding: 0;}

.adr div, .panel div, .buyer-info div, .seller-info div {border: 1px solid #ddd; background: #fff; padding: 5%; height: 14em;}
.adr form div {border: none; height: auto;}



.buyer-info, .seller-info {float: left; width: 48.5%; margin: 0 0 2em;}
.buyer-info div, .seller-info div {height: auto; min-height: 17em;}
.seller-info {margin-left: 2%;}

.cancel-order form {margin: 0;}
.cancel-order p {color: #444; margin: 0.5em 0;}

.mark-paid form {margin: 0;}
.mark-paid p {color: #444; margin: 0.5em 0;}

/* bulk action - manage items */

tr.bulk {background: #fcf8e3;}
tr.bulk td {}
span.bulk-toggle, .bulk form a {display: inline-block; float: left; margin-right: 1em;}
.bulk form a {margin-top: 4px;}
.bulk form input.secondary {display: inline-block; margin-right: 1em;}


/* Shop stats - Dashboard view */

section.stats {margin: 1em 0; overflow: hidden;}
section.stats .panel {}
section.stats .panel div {height: auto; min-height: 120px;}
section.stats .panel:nth-child(3n) {margin-right: 0;}
.ie8 div.panel.orders + div {margin-right: 0;}

section.stats .panel div h4 {font-weight: bold; margin-bottom: 1em;}
section.stats .panel div h4 span {color: #8a8a8a; font-weight: normal;}
section.stats .panel div strong.data-total {display: block; font-size: 2em; line-height: 1; color: #000; margin-bottom: 0.5em;}
.stats .panel.bill strong.data-total {color: #f15941;}
.stats .panel.orders strong.data-total {color: #b2c248;}

.data-detail {margin: 0;}
.data-detail li {color: #8a8a8a;}
.data-detail li strong {color: #404040; display: inline-block; margin-right: 0.25em;}
.data-detail .paid  { color: #b2c248; }
.data-detail .outstanding { color: #f15941; }

section.stats .panel div a {display: block; margin: 0;}




/* 404 and other error pages - Static
----------------------------------------------------------------*/

.error section[role="main"] {margin: 4em 0; overflow: hidden;}

.error header[role="banner"] {margin: 0; height: 6em; border-bottom: 1px solid #d5d5d5; margin-bottom: 2em;}
.error header[role="banner"] h1 {}
.error header[role="banner"] h1 a {margin: 0;}
.error header[role="banner"] h2 {float: left; margin-top: 1em;}

.error main[role=main] section {float: left; width: 48.466258%; margin-right: 3.0674847%; padding-bottom: 1em;}
.error main[role=main] section + section {margin: 0;}

.error form[role="search"] {position: relative; right: auto; top: auto; margin-bottom: 1.5em;}
.error form[role="search"] div {top: 0;}

.error section h1 {}
.error section h2 {border: none; padding: 0; margin: 0 0 1em 0;}


.error main[role=main] figure {
  display: block;
  background: #fff;
  position: relative;
  border-bottom: none;
  }

.error main[role=main] figure div {padding: 1em; border: 1px solid #d5d5d5;}
.error main[role=main] figure img {margin-bottom: 1em;}

ul.prose, .overlay-content ul {list-style-type: disc; list-style-position: inside;}



/* Overlay message windows.
----------------------------------------------------------------*/

.overlay {
  background: #555;
  background: rgba(0,0,0,0.3);
  padding: 1em;
  width: 580px;
  display: block;
  border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  text-align: left;

  z-index: 10000;
  top: 80px;
  }

.overlay-content {
  background: #fff;
  padding: 2em;
  position: relative;
  overflow: hidden;
  }

.overlay-content header {margin-bottom: 1.5em;}
.overlay-content h1 {font-size: 1.5em; font-weight: bold;}

.overlay-content header.message {
  background: #fcf8e3;
  border: 1px solid #fbeed5;
  padding: 1em;
  }

.overlay-content header.message.warning {}
.overlay-content header.message.warning h1 {color: #a11903;}

.overlay-content p {margin-bottom: 1em; color: #000;}

.overlay-content a.close {
  cursor: pointer;
  position: absolute;
  right: 2em;
  top: 1em;
  display: block;
  width: 16px;
  height: 16px;

  background: url(../images/icons.png) no-repeat 0 -1328px;
  text-indent: -999em;
  }

.overlay-content a.close:hover {opacity: 0.7;}

.overlay-content ul {margin-bottom: 1.5em;}
.overlay-content ul li {}

.overlay-content form {margin: 0 0 1em 0;}



/* Button Group - Derived from Twitter Bootstrap
----------------------------------------------------------------*/

.btn-group {
  position: relative;
   display: inline-block;
  *display: inline;
  /* IE7 inline-block hack */

  *zoom: 1;
  margin-bottom: 1em;
  }


.btn-group:after {clear: both;}
.btn-group:before, .btn-group:after {content: ""; display: table;}


button.secondary:hover,
button.secondary:active,
button.secondary.active,
button.secondary.disabled,
button.secondary[disabled] {
  background-color: #e6e6e6;
  *background-color: #d9d9d9;
}

button.secondary:active,
button.secondary.active {background-color: #cccccc \9;}

button.secondary:first-child {*margin-left: 0;}

.button.secondary:hover {
  color: #333333;
  text-decoration: none;
  background-color: #e6e6e6;
  *background-color: #d9d9d9;
  /* Buttons in IE7 don't get borders, so darken on hover */

  background-position: 0 -15px;
  -webkit-transition: background-position 0.1s linear;
     -moz-transition: background-position 0.1s linear;
      -ms-transition: background-position 0.1s linear;
       -o-transition: background-position 0.1s linear;
          transition: background-position 0.1s linear;
}

button.secondary:focus {
  outline: thin dotted #333;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}

button.secondary.active,
button.secondary:active {
  background-color: #e6e6e6;
  background-color: #d9d9d9 \9;
  background-image: none;
  outline: 0;
  -webkit-box-shadow: inset 0 2px 3px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.05);
     -moz-box-shadow: inset 0 2px 3px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.05);
          box-shadow: inset 0 2px 3px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.05);
}

button.secondary.active {font-weight: bold; color: #000;}

button.secondary.disabled,
button.secondary[disabled] {
  cursor: default;
  background-color: #e6e6e6;
  background-image: none;
  opacity: 0.65;
  filter: alpha(opacity=65);
  -webkit-box-shadow: none;
     -moz-box-shadow: none;
          box-shadow: none;
}


.btn-group > .secondary:hover,
.btn-group > .secondary:focus,
.btn-group > .secondary:active,
.btn-group > .secondary.active {
  z-index: 2;
}

.btn-group > .secondary {
  position: relative;
  float: left;
  margin-left: -1px;
  -webkit-border-radius: 0;
     -moz-border-radius: 0;
          border-radius: 0;
 padding-left: 1em; padding-right: 1em;
 border-top-color: #c5c5c5
}

.btn-group > .secondary:first-child {
  margin-left: 0;
  -webkit-border-bottom-left-radius: 4px;
          border-bottom-left-radius: 4px;
  -webkit-border-top-left-radius: 4px;
          border-top-left-radius: 4px;
  -moz-border-radius-bottomleft: 4px;
  -moz-border-radius-topleft: 4px;
}

.btn-group > .secondary:last-child {
  -webkit-border-top-right-radius: 4px;
          border-top-right-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
          border-bottom-right-radius: 4px;
  -moz-border-radius-topright: 4px;
  -moz-border-radius-bottomright: 4px;
}








/* Register/Sign up
------------------------------------------------------------------ */

div.user-account h1 {
  margin-bottom: 1em;
  border-bottom: 2px solid #ececea;
  padding: 0 0 0.5em;
  font-size: 2.2em;
  font-weight: 300;
  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", Sans-Serif;
  letter-spacing: normal;
  color: #404040;
  }

div.user-account .hide {
  position: absolute;
  left: -1000em;
  }
  
div.user-account .divide,
div.user-account section.checkout-guest {
  margin-top: 1em;
  border: solid #eaeaea;
  border-width: 1px 0 0;
  padding: 1.25em 0 0;
  }

div.user-account .divide.alt {border-width: 0;}
div.user-account div.column {margin-bottom: 0;}
div.user-account section {margin-bottom: 1.5em;}
div.user-account section.checkout-guest {margin-top: 0;}

div.user-account section.checkout-guest div.form {max-width: 400px;}
div.user-account section.checkout-guest div.form input[type="submit"] {margin-bottom: 0; max-width: 400px;}

div.user-account input[type="text"],
div.user-account input[type="password"] {width: 100%; box-sizing: border-box;}

div.user-account label span {
  display: block;
  margin: 0;
  }

/* Social buttons */


.button-social {
  display: inline-block;
  border-radius: 3px;
  border: 0;
  padding: 9px 15px 9px 45px;
  background: no-repeat 9px 50%;
  font-weight: bold;
  font-size: 1.1em;
  line-height: 1.2;
  color: #fff;
  text-shadow: 0 -1px 0 rgba(0,0,0,0.2);
  cursor: pointer;
  transition: none;
}

.button-social.big {
  font-size: 1.3em;
}

.button-social.facebook {
  background-color: #4e69a2;
  background-image: url(/images/social/buttons/facebook.png);
}
.button-social.facebook:hover {
  color: white;
  background-color: #445c8d;
}
.button-social.facebook:active {
  color: white;
  background-color: #3d5380;
}

.button-social.google_oauth2 {
  background-color: #dd4b39;
  background-image: url(/images/social/buttons/google.png);
}
.button-social.google_oauth2:hover {
  color: white;
  background-color: #d33724;
}
.button-social.google_oauth2:active {
  color: white;
  background-color: #c23321;
}



/* Register benefits box */

section.register-benefits {margin-left: 10%;}
section.register-benefits header {margin: 0;}
    
section.register-benefits header h2 {
  margin: 0;
  border-radius: 5px 5px 0 0;
  padding: 0.5em;
  text-align: center;
  background: #f0efeb;
  font-size: 1.9em;
  color: #555;
  }
  
section.register-benefits div.text {
  border-radius: 0 0 5px 5px;
  padding: 2em 2em 2em 0.5em;
  background: #fff;
  }
    
section.register-benefits div.text ol {
  list-style: none;
  font-size: 1.2em;
  }
      
section.register-benefits div.text ol li {
  position: relative;
  margin: 0 0 0.5em;
  padding: 0 0 0 3em;
  min-height: 2.5em;
  line-height: 1.9;
  }
  
section.register-benefits div.text ol li:before {
  position: absolute;
  top: -4px;
  left: 0;
  border-radius: 50%;
  width: 1.7em;
  height: 1.7em;
  line-height: 1.7;
  background: #ef8fb4;
  text-align: center;
  font-size: 1.3em;
  color: #fff;
  }
     
section.register-benefits div.text ol li:nth-child(1):before {content: "1";}
section.register-benefits div.text ol li:nth-child(2):before {content: "2";}
section.register-benefits div.text ol li:nth-child(3):before {content: "3";}
section.register-benefits div.text ol li:nth-child(4):before {content: "4";}
section.register-benefits div.text ol li:nth-child(5):before {content: "5";}
section.register-benefits div.text ol li:nth-child(6):before {content: "6";}
section.register-benefits div.text ol li:nth-child(7):before {content: "7";}
section.register-benefits div.text ol li:nth-child(8):before {content: "8";}

section.register-benefits div.text p {
  margin: 0;
  text-align: center;
  }

/* Global styles
------------------------------------------------------------------ */

.button {-webkit-appearance: none;}

/* Columns
------------------------------------------------------------------ */

.columns {overflow: hidden; margin: 0 0 0 -2%; list-style: none;}
.columns > .column {float: left; margin: 0 0 2% 2%;}
.columns.two > .column {width: 48%;}

/* List grids
------------------------------------------------------------------ */

.grid {overflow: hidden; margin: 0 0 0 -2%; list-style: none;}
.grid > li {float: left; margin: 0 0 2% 2%;}
.grid.alt > li {float: none; display: inline-block; vertical-align: top;}
.grid.three > li {width: 31.3%;}
.grid.four > li {width: 23%;}
.grid.five > li {width: 18%;}
.grid.six > li {width: 14.6%;}

.grid a,
.grid a span.image,
.grid a img {display: block; margin: 0;}
.grid a:hover img,
.grid a:focus img {opacity: 0.9;}
.grid a img {border-radius: 3px 3px 0 0; width: 100%;}

/* Banner 
------------------------------------------------------------------ */
  
#banner {
  border-bottom: 1px solid #e8e8e4;
  background: #f0efeb;
  margin: 0;
  }

#banner > div > a {
  margin-bottom: 12px;
}

#banner h1,
#banner nav,
#banner nav > ul > li,
#banner form {
  display: inline-block;
  vertical-align: middle;
  }
   
/* Logo */

#banner {padding: 0; font-size: 1em; line-height: 1.2;}
#banner a {display: block;}

@media screen and (max-width: 64.499em) {
  #banner .container > a {
    width: 7rem;
  }
}

#banner img {
  display: block;
  width: 104px;
  }

body.anon #banner {margin-bottom: 0; border-bottom: 0; background: #f6f6f4;}
body.anon #banner img {width: 125px;}
    
/* Navigation */

#banner nav {position: relative;}
#banner nav h2 {display: none;}
#banner nav > ul {font-size: 1.1em; line-height: 1.5;} 

#banner nav > ul > li {
  position: relative;
  margin-left: -4px;
  white-space: nowrap; /* Android fix */
  } 
  
#banner nav ul li.alt2 {display: none;}

#banner nav ul a {
  display: block;
  padding: 1.7em 1em;
  }

#banner nav ul a:hover,
#banner nav ul a:focus,
#banner nav ul li:hover > a,
#banner nav ul a.on,
#banner .container div.basket > a:hover,
#banner .container div.basket > a:focus {
  background: #e3e2df;
}
#banner .container div.basket a:hover strong,
#banner .container div.basket a:focus strong {
  background: #f37200;
  color: white;
}

#banner .container div.basket {
   float: right; 
  display: inline-block;
}

#banner .container div.basket > a {
  display: block;
}



#banner .container div.basket a strong {
  border-radius: 50%;
  width: 2em;
  height: 2em;
  line-height: 2em;
  background: #4083A9;
  text-align: center;
  font-weight: bold;
  display: inline-block;
  color: white;
  margin-left: 0.2rem;
}

@media screen and (max-width: 64.499em) {
  #banner .container div.basket {
    position: absolute;
    top: 1.8rem;
    right: 0;
    background: #e7e6e2;
    border-radius: 0.3em;
  }
  #banner .container div.basket > a {
    display: inline-block;
    color: #047da3;
    padding: 0.6rem;
  }
   #banner .container div.basket > a strong {
   }
  body:not(.home) #banner .container div.basket {
    top: 1rem;
  }
  body.known #banner .container div.basket {
    top: 1rem;
  }
}
@media screen and (min-width: 64.499em) {

  #banner > div > a {
    display: inline-block;
    float: left;
    margin: 11px 20px 0 0;
  }

  body:not(.home) #banner .container div.basket > a {
    line-height: 2;
    padding: 1.6em 1em;
  }
  body:not(.home) #banner .container div.basket {
    margin-left: 1rem;
  }
  body.home #banner .container div.basket > a {
    line-height: 1.8;
    padding: 2em 1em;
  }
  body.home #banner form {
    float: none;
  }
}

  
#banner nav ul li.profile-links a.title {font-weight: bold;}
 
#banner nav ul a.title:after {
  display: inline-block;
  margin-left: 5px;
  border: 4px solid transparent;
  border-bottom-width: 0;
  border-top-color: #c0bfbc;
  padding: 0;
  width: 0;
  height: 0;
  vertical-align: middle;
  content: "";
  }

#banner nav ul a.title:hover:after,
#banner nav ul a.title:focus:after,
#banner nav ul a.title.on:after {border-top-color: #047da3;}

/* Sub nav */

#banner nav ul.sub-nav {
  position: absolute;
  left: 0;
  top: 100%;
  z-index: 200;
  background: #047da3;
  text-align: left;
  opacity: 0;
  visibility: hidden;
  }

#banner nav li:hover ul.sub-nav,
#banner nav li ul.sub-nav.open {
  visibility: visible;
  opacity: 1;
  }

#banner nav ul.sub-nav li {float: none;}

#banner nav ul.sub-nav a {
  display: block;
  padding: 0.6em 1.25em;
  color: #eee;
  }

#banner nav ul.sub-nav li.divider {border-bottom: 1px dashed rgba(255,255,255,0.2);}

#banner nav ul.sub-nav a:hover,
#banner nav ul.sub-nav a:focus {background: #205f82; color: #fff;}
     
/* Site Search */

#banner form {
  float: right;
  margin: 1em 0 0;
  }

#banner fieldset {
  margin: 0;
  border: 1px solid #d5d5d5;
  border-radius: 0.2em;
  padding: 1px;
  background: #fff;
  }
   
#search-select {
  float: left;
  margin: 0 4px 0 0;
  }

#search-select ul {
  position: relative;
  background: #f0efeb;
  text-align: center;
  color: #919191;
  cursor: pointer;
  }
    
#search-select ul:hover {
  background: #047da3;
  color: #fff;
  }
 
#search-select ul li {position: relative;}
#search-select ul li.current {z-index: 1;}   
#search-select ul li.switch {z-index: 2;}
     
#search-select ul li.current span,
#search-select ul li.switch a {
  display: block;
  padding: 0 0.3em;
  min-width: 5em;
  height: 3em;
  line-height: 3em;
  font-size: 1em;
  }
      
#search-select ul li.current i {
  position: absolute;
  left: -1000em;
  }
  
#search-select ul li.current b:after {
  padding-left: 0.4em;
  content: "\2192";
  }
   
#search-select ul li.switch {
  position: absolute;
  top: 0; right: 0; bottom: 0; left: 0;
  }
  
#search-select ul li.switch a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: -1000em;
  border-radius: 0 2px 2px 0;
  padding-right: 1em;
  background: #047da3;
  font-size: 1em;
  color: #fff;
  opacity: 0;
  white-space: nowrap;  
	-webkit-transition: opacity 0.3s, background 0.3s, left 0s 0.3s;
	transition: opacity 0.3s, background 0.3s, left 0s 0.3s;
  }
   
#search-select ul:hover li.switch a {
  display: none;
  opacity: 1;
  left: 100%;
	-webkit-transition: opacity 0.3s, background 0.3s;
	transition: opacity 0.3s, background 0.3s;
  }
   
#site-search {
  float: left;
  white-space: nowrap;
  }
     
#site-search * {
  display: inline-block;
  vertical-align: middle;
  }
   
#site-search input.standard {
  margin: 1px 0 0;
  border: 0;
  padding: 0;
  width: 170px;
  font-size: 1.1em;
  outline: none;
  }

#site-search input.standard::-webkit-search-decoration,
#site-search input.standard::-webkit-search-cancel-button,
#site-search input.standard::-webkit-search-results-button,
#site-search input.standard::-webkit-search-results-decoration {display: none;}  

#site-search input.search-button {
  margin: 0;
  border-radius: 0.1em 0.2em 0.2em 0.1em;
  padding: 0 1em;
  height: 3em;
  background: #047da3;
  line-height: 3em;
  font-size: 1em;
  -webkit-appearance: none;
  }
   
#site-search input.search-button:hover,
#site-search input.search-button:focus {background: #0f0f0f;}

#banner nav ul.sub-nav,
#banner nav ul a strong,
#site-search input.search-button,
#search-select ul {
  -webkit-transition: all 0.3s;
	transition: all 0.3s;
  }
  
div.top-nav {position:relative;}
div.top-nav nav {margin-bottom: 2em;}

/* Logged out user on the homepage */
    
body.anon #banner {margin-bottom: 0; border-bottom: 0; background: #f6f6f4;}
body.anon #banner h1 {padding-top: 12px;}
body.anon #banner h1 img {width: 125px;}
body.anon #banner nav {float: right;}
body.anon #banner nav > ul > li.alt {display: none;}
body.anon #banner nav ul a {padding: 2em 1em;}
body.anon #banner form {margin-top: 0.3em;}
body.anon #site-search input.standard {width: 300px;}
  
@media screen and (max-width: 64.499em) {
  #banner form {
    float: right;
  }
}
/* ------------------------------------------------------------------ */
/* =Homepage strips */
/* ------------------------------------------------------------------ */

section.strip {
  display: block;
  margin: 2.5em 0 4em;
  padding: 30px 0;
  width: auto;
  background: #000;
  text-align: center;
  color: #fff;
  }
 
section.strip.one,
.home section.strip.one header span.decorate {background-color: #f15b40;}
section.strip.two,
.home section.strip.two header span.decorate {background-color: #ed8fb3;}
section.strip.three,
.home section.strip.three header span.decorate {background-color: #887dba;}
section.strip.four,
.home section.strip.four header span.decorate {background-color: #5bc4bf;}
section.strip.five,
.home section.strip.five header span.decorate {background-color: #b2c248;}
/*section.strip.six,
.home section.strip.six header span.decorate {background-color: #ffc20e;}*/
section.strip.six,
.home section.strip.six header span.decorate {background-color: #e2d0d7;}

.home section.strip header h2 {border-top: 1px solid rgba(255,255,255,0.2); color: #fff;}
     
.home section.strip header span.decorate {
  background-image: url(../images/feature-f-circle-white.png);
  background-repeat: no-repeat;
  }

.home section.strip header a {
  margin-top: -25px;
  border-radius: 3px;
  padding: 0.3em 0.6em;
  color: #fff;
  }

/* Editorials */

section.editorials {padding: 40px; clear:both;}
  
section.editorials ul {
  overflow: hidden;
  margin: 0;
  list-style: none;
  }
  
section.editorials ul li {
  float: right;
  width: 48.5%;
  max-width: 474px;
  }
  
section.editorials ul li.one {float: left;}  
section.editorials ul li.two {margin-bottom: 2.6%;}
  
section.editorials ul a {
  display: block;
  border: 12px solid #fff;
  }
    
section.editorials ul a img {
  display: block;
  width: 100%;
  }
  

/* Favourite Finds
----------------------------------------------------------------*/
 
section.favourite-finds {margin-top: 4em;}

section.favourite-finds header {
  margin-bottom: 2em;
  text-align: center;
  }

section.favourite-finds a.refresh {
  position: absolute;
  right: 0;
  bottom: 0;
  float: none;
  border-radius: 0.3em;
  padding: 0 20px 0 10px;
  background: #f15b40 url(/images/arrow-right-2.png) no-repeat 96% 50%;
  line-height: 2em;
  color: #fff;
  }

section.favourite-finds a.refresh:hover,
section.favourite-finds a.refresh:focus {background-color: #404040;}

section.favourite-finds div.wrapper {background: #fff;}

section.favourite-finds ul.items {
  overflow: hidden;
  display: block;
  margin: 0 auto;
  padding: 16px 16px 0;
  width: auto;
  background: #fff;
  list-style: none;
  line-height: 1.2;
  }

section.favourite-finds ul.items li.big {
  float: left;
  width: 39.1%;
  font-size: 1.2em;
  }

section.favourite-finds ul.items li.small {
  float: right;
  width: 18.6%;
  margin: 0 0 1.691% 1.691%;
  }

section.favourite-finds ul.items li {position: relative;}

/*section.favourite-finds ul.items.alt li {float: right;}*/
/*section.favourite-finds ul.items.alt li.small {margin: 0 10px 10px 0;}*/
      
section.favourite-finds ul.items a {
  overflow: hidden;
  display: block;
  position: relative;
  }
  
section.favourite-finds ul.items a.favourite-item {top: -12px; right: -12px;}
section.favourite-widget ol a.favourite-item {top: -12px; right: -12px;}

section.favourite-finds a img {
  display: block;
  width: 100%;
  opacity: 1;
  } 
          
section.favourite-finds a:hover img,
section.favourite-finds a:focus img {opacity: 0.9;} 
      
section.favourite-finds ul.items span {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 10px;
  background: #111;
  background: #fff;
  background: rgba(255,255,255,0.8);
  text-align: center;
  }
  
section.favourite-finds ul.items li.small span {
  bottom: -100px;
  -webkit-transition: bottom 0.3s;
	transition: bottom 0.3s;
  }
    
section.favourite-finds ul.items li.small:hover a span,
section.favourite-finds ul.items li.small a:focus span {bottom: 0;}

 /* Promotional theme and banner showcase
----------------------------------------------------------------*/

section.gift-guides h2 {text-align: center;}
  
.home section.gift-guides h2 {
  display: block;
  margin: 0 0 0.5em;
  border: 0;
  padding: 0;
  font-size: 2em;
  color: #fff;
  }

div.theme-carousel {
  position: relative;
  border: 16px solid #fff;
  background: #fff;
  text-align: center;
  }
 
section[role=main] div.theme-carousel {margin-bottom: 2.5em;}

div.theme-carousel div.viewport {
  overflow: hidden;
  position: relative;
/*  -webkit-transition: height 0.5s;
  -moz-transition: height 0.5s;
  -o-transition: height 0.5s;
  transition: height 0.5s;*/
  }

div.theme-carousel ul.slides {
/*  position: absolute;
  top: 0;
  bottom: 0;*/
  position: relative;
  left: 0;
  z-index: 1;
  margin: 0;
  width: 1000em;
  list-style: none;
  }
  
div.theme-carousel ul.slides li {
  position: relative;
  overflow: hidden;
  float: left;
  margin-right: 16px;
  width: 305px; /* Temp style until Javascript runs */
  }
  
div.theme-carousel ul.slides a {
  display: block;
  position: relative;
  }

div.theme-carousel ul.slides a img {display: block; width: 100%; opacity: 1;}
div.theme-carousel ul.slides a:hover img,
div.theme-carousel ul.slides a:focus img {opacity: 0.9;}

div.theme-carousel ul.slides a h3 {
  position: absolute;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 10000;
  padding: 0.5em;
  background: #5bc4bf;
  line-height: 1.1;
  font-size: 1.4em;
  color: #fff;
  text-transform: uppercase;
  opacity: 0.8;
  -webkit-transition: opacity 0.5s;
  -moz-transition: opacity 0.5s;
  -o-transition: opacity 0.5s;
  transition: opacity 0.5s;
  }
  
div.theme-carousel ul.slides a:hover h3,
div.theme-carousel ul.slides a:focus h3 {opacity: 1;}

section[role=main] div.theme-carousel ul.slides h3 {font-size: 1.1em;}

/*div.theme-carousel ul.slides li.slide-2 a h3 {background-color: #ed8fb3;}
div.theme-carousel ul.slides li.slide-3 a h3 {background-color: #887dba;}
div.theme-carousel ul.slides li.slide-4 a h3 {background-color: #5bc4bf;}
div.theme-carousel ul.slides li.slide-5 a h3 {background-color: #b2c248;}
div.theme-carousel ul.slides li.slide-6 a h3 {background-color: #ffc20e;}
div.theme-carousel ul.slides li.slide-7 a h3 {background-color: #e2d0d7;}*/

/* Buttons */

div.theme-carousel a.carousel-button {
  display: block;
  position: absolute;
  top: 50%;
  z-index: 1;
  margin-top: -20px;
  width: 20px;
  height: 40px;
  background-repeat: no-repeat;
  text-indent: -1000em;
  cursor: pointer;
  transition: none;
  }

div.theme-carousel a.carousel-button.previous {left: -36px; background-image: url(/images/slides-arrow-left.png);}
div.theme-carousel a.carousel-button.next {right: -36px; background-image: url(/images/slides-arrow-right.png);}

/* Pinterest section
----------------------------------------------------------------*/

/*section.pinterest div.slide.hide {
  position: absolute;
  left: -1000em;
  opacity: 0;
  }
  */
  
section.pinterest {
  display: block;
  margin: 0;
  padding: 50px 0 10px;
  width: auto;
  background: #f0efeb;
  text-align: center;
  }
  
.home section.pinterest header .decorate {background-color: #f0efeb;}

section.pinterest header {text-align: center;}

section.pinterest p.created-on {
  font-size: 1em;
  color: #6d6d66;
  }

section.pinterest p.created-on a {
  display: block;
  float: none;
  margin: 0 auto;
  width: 114px;
  height: 30px;
  width: 85px;
  height: 21px;
  background: url(/images/pinterest-logo.png) no-repeat;
  text-indent: -1000em;
  }
  
section.pinterest p.pinterest-info {
  float: none;
  position: absolute;
  left: 0;
  top: 20px;
  border-radius: 0.5em;
  padding: 0.7em 1em;
  width: 200px;
  background: #e5e5e3;
  font-size: 1em;
  color: #575754;
  }

section.pinterest p.pinterest-info a {
  float: none;
  margin: 0;
  }
  
section.pinterest header span.button a {
  position: absolute;
  right: 0;
  bottom: 0;
  float: none;
  border-radius: 0.3em;
  padding: 0 20px 0 10px;
  background: #f15b40 url(/images/arrow-right-2.png) no-repeat 88% 50%;
  line-height: 2em;
  color: #fff;
  }
  
section.pinterest header span.button a.previous {
  padding: 0 10px 0 20px;
  background: #f15b40 url(/images/arrow-left-2.png) no-repeat 8% 50%;
  }

section.pinterest header span.button a:hover,
section.pinterest header span.button a:focus {background-color: #404040;}

section.pinterest ul.gallery {overflow: hidden; margin-bottom: 0;}

section.pinterest ul.gallery li:last-of-type,
section.featured-seller-list ul.gallery li:nth-child(5),
section.featured-seller-list ul.gallery li:nth-child(6) {display: none;}

/* Favourite item in a product list
----------------------------------------------------------------*/

a.favourite-item {
  position: absolute!important;
  right: 5px;
  top: 5px;
  z-index: 10;
  border-radius: 50%;
  border: 4px solid #fff;
  padding: 0!important;
  width: 25px;
  height: 25px;
  background: #eaeaea url(/images/favourite-item.png) no-repeat 50% 55%!important;
  text-indent: -1000em;
  outline: none;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: background 0.3s, opacity 0.3s;
  -moz-transition: background 0.3s, opacity 0.3s;
  transition: background 0.3s, opacity 0.3s;
  }

:hover > a.favourite-item,
a.favourite-item.favourited,
.touch a.favourite-item {visibility: visible; opacity: 1;}
a.favourite-item:hover,
a.favourite-item:focus,
a.favourite-item.favourited {background-color: #e94f8a!important;}
/*a.favourite-item.favourited:hover,
a.favourite-item.favourited:focus {background-color: #eaeaea!important;}*/

/* Favourite widget
----------------------------------------------------------------*/

section.favourite-widget {
  overflow: hidden;
  margin-bottom: 2em;
  border-bottom: 10px solid #887fb9;
  }

section.favourite-widget header {
  position: relative;
  margin: 0;
  }
  
section.favourite-widget header h3 {
  margin: 0;
  font-size: 1em;
  }

section.favourite-widget header h3 span.title,
section.favourite-widget header h3 span.info {
  display: inline-block;
  vertical-align: baseline;
  }
  
section.favourite-widget header h3 span.title {
  position: relative;
  padding: 0.75em 3em 0.75em 1em;
  max-width: 50%;
  background: #887fb9;
  font-size: 1.5em;
  color: #fff;
  letter-spacing: -1px;
  }
  
section.favourite-widget header h3 span.title:after {
  position: absolute;
  top: 50%;
  right: 1em;
  margin-top: -13px;
  border-radius: 50%;
  width: 25px;
  height: 25px;
  background: #fff url(/images/favourite-item-pink.png) no-repeat 50% 55%;
  content: "";
  }
  
section.favourite-widget header h3 span.title b {white-space: nowrap;}
   
section.favourite-widget header h3 span.info {
  margin-left: 1em;
  color: #6f6f6e;
  }

section.favourite-widget header a.favourites-tab {
  position: absolute;
  right: 0;
  bottom: 0;
  border: solid #e8e8e4;
  border-width: 1px 1px 0;
  padding: 0.5em 1em;
  background: #f0efeb;
  white-space: nowrap;
  }

section.favourite-widget header a.favourites-tab:hover,
section.favourite-widget header a.favourites-tab:focus {
  border-color: #e2e1dc;
  background: #e2e1dc;
  }

section.favourite-widget ol {
  overflow: hidden;
  margin: 0 0 0 -2%;
  padding: 15px;
  background: #fff;
  list-style: none;
  }

section.favourite-widget ol li {
  position: relative;
  float: left;
  margin: 0 0 0 2%;
  width: 14.6%;
  }

section.favourite-widget ol img {
  display: block;
  max-width: 100%;
  }
  
section.favourite-widget ol a:hover img,
section.favourite-widget ol a:focus img {opacity: 0.9;}
  
/* My Folksy arrow
----------------------------------------------------------------*/

div.arrow-cta {
  overflow: hidden;
  margin-bottom: 4em;
  text-align: right;
  }

div.arrow-cta a {
  display: block;
  background: #d4dc9e;
  }

  div.arrow-cta.arrow-cta--alt a {
    background: #52899B;
  } 

div.arrow-cta div.container {
  position: relative;
  padding: 1em 0 1.2em;
  background: #b2c248;
  color: #fff;
  }

  div.arrow-cta.arrow-cta--alt div.container {
    background: #047DA3;
  }

div.arrow-cta div.container::before,
div.arrow-cta div.container::after {
  position: absolute;
  top: 50%;
  margin-top: -4em;
  border: 4em solid transparent;
  width: 0;
  height: 0;
  content: "";
  visibility: visible;
  }
  
div.arrow-cta div.container::before {
  right: 100%;
  border-color: #b2c248;
  border-left-color: transparent!important;
  border-right-width: 0;
  }

  div.arrow-cta.arrow-cta--alt div.container::before {
    border-color: #047DA3;
  }
  
div.arrow-cta div.container::after {
  left: 100%;
  border-left-color: #b2c248;
  border-right-width: 0;
  }

  div.arrow-cta.arrow-cta--alt div.container::after {
    border-left-color: #047DA3;
  }
 
div.arrow-cta div.container h2,
div.arrow-cta div.container p {
  margin: 0 20px;
  line-height: 1.2;
  }
 
div.arrow-cta div.container h2 {
  font-size: 2.25em;
  text-transform: uppercase;
  }

div.arrow-cta div.container p {font-size: 1.4em;}
div.arrow-cta div.container * {color: #fff!important;}

div.arrow-cta a:hover,
div.arrow-cta a:focus {background: #b2c248;}

  div.arrow-cta.arrow-cta--alt a:hover,
  div.arrow-cta.arrow-cta--alt a:focus {background: #047DA3;}

div.arrow-cta a:hover div.container *,
div.arrow-cta a:focus div.container * {color: #879816!important;}

  div.arrow-cta.arrow-cta--alt a:hover div.container *,
  div.arrow-cta.arrow-cta--alt a:focus div.container * {color: #115469!important;}

div.arrow-cta a:hover div.container,
div.arrow-cta a:focus div.container {background: #d4dc9e;}

  div.arrow-cta.arrow-cta--alt a:hover div.container,
  div.arrow-cta.arrow-cta--alt a:focus div.container {background: #52899B;}

div.arrow-cta a:hover div.container:before,
div.arrow-cta a:focus div.container:before {border-color: #d4dc9e;}
  div.arrow-cta.arrow-cta--alt a:hover div.container:before,
  div.arrow-cta.arrow-cta--alt a:focus div.container:before {border-color: #52899B;}
div.arrow-cta a:hover div.container:after,
div.arrow-cta a:focus div.container:after {border-left-color: #d4dc9e;}
  div.arrow-cta.arrow-cta--alt a:hover div.container:after,
  div.arrow-cta.arrow-cta--alt a:focus div.container:after {
    border-left-color: #52899B;
  }

/* Temp styles
----------------------------------------------------------------*/

body.anon div.top-nav {display: none;}

/* Explore funnels
----------------------------------------------------------------*/

section.explore header {
  overflow: visible;
  position: relative;
  margin: 0;
  }

section.explore header h2 {
  position: relative;
  margin: 0 0 30px;
  padding: 0 1em;
  height: 2em; 
  line-height: 2em; 
  background: #e7e6e2;
  text-align: center;
  color: #4e4e4e;
  font-size: 2.5em; 
  font-weight: 300; 
  letter-spacing: normal;
  }
  
section.explore header h2 span {color: #4e4e4e;}

section.explore header h2:before,
section.explore header h2:after {
  position: absolute;
  top: 0; bottom: 0;
  border: 1em solid #e7e6e2;
  width: 0;
  height: 0;
  content: "";
  }

section.explore header h2:before {
  left: -1em;
  border-right-width: 0;
  border-left-color: transparent;
  }

section.explore header h2:after {
  right: -1em;
  border-left-width: 0;
  border-right-color: transparent;
  }
  
/* Product grid */

section.explore div.explore-grid {position: relative;}

section.explore .grid {margin-bottom: 20px;}

section.explore .grid a h3 {
  margin: 0;
  border-radius: 0 0 3px 3px;
  padding: 0.8em 0.5em;
  background: #fff;
  text-align: center;
  line-height: 1.1;
  font-size: 1.7em;
  color: #4083A9;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,0.1);
  }
  
/* Recently added */
  
section.explore .grid li.recently-added-badge {
  position: absolute;
  bottom: 100%;
  right: 0;
  z-index: 10000;
  float: none;
  margin: 0;
  width: auto;
  }
  
section.explore .grid li.recently-added-badge a {
  display: block;
  width: 160px;
  height: 120px;
  background: url(/images/badges/recently-added-homepage.png) no-repeat 50% 100%;
  background-size: auto 100%;
  text-indent: -1000em;
  }

/* Explore categories nav */

section.explore div.categories {text-align: center;}

section.explore div.categories h3 {
  display: inline-block;
  position: relative;
  margin: 0 0 30px;
  padding: 0 2em;
  height: 2em; 
  line-height: 2em; 
  background: #f15941;
  color: #fff;
  font-size: 1.75em; 
  font-weight: 300; 
  letter-spacing: normal;
  text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
  }

section.explore div.categories h3:before,
section.explore div.categories h3:after {
  position: absolute;
  top: 0; bottom: 0;
  border: 1em solid #f15941;
  width: 0;
  height: 0;
  content: "";
  }

section.explore div.categories h3:before {
  left: -1em;
  border-right-width: 0;
  border-left-color: transparent;
  }

section.explore div.categories h3:after {
  right: -1em;
  border-left-width: 0;
  border-right-color: transparent;
  }  

section.explore div.categories ul {
  position: relative;
  margin: 0 0 40px;
  border-radius: 3px;
  background: #fff;
  font-size: 1.4em;
  list-style: none;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,0.1);
  }

section.explore div.categories ul li {display: inline-block;}

section.explore div.categories ul a {
  display: block;
  padding: 1.5em 1.2em;
  }

section.explore div.categories ul a:hover,
section.explore div.categories ul a:focus {
  background: #f0efeb;
  }

/* Featured Brands
----------------------------------------------------------------*/

section.featured-brands {
  margin-bottom: 30px;
  text-align: center;
  }

section.featured-brands header {margin: 0;}

section.featured-brands header h2 {
  display: inline-block;
  position: relative;
  margin: 0 0 30px;
  padding: 0 2em;
  height: 2em; 
  line-height: 2em; 
  background: #e7e6e2;
  color: #4e4e4e;
  font-size: 1.75em; 
  font-weight: 300; 
  letter-spacing: normal;
  }
  
section.featured-brands header h2:before,
section.featured-brands header h2:after {
  position: absolute;
  top: 0; bottom: 0;
  border: 1em solid #e7e6e2;
  width: 0;
  height: 0;
  content: "";
  }

section.featured-brands header h2:before {
  left: -1em;
  border-right-width: 0;
  border-left-color: transparent;
  }

section.featured-brands header h2:after {
  right: -1em;
  border-left-width: 0;
  border-right-color: transparent;
  } 
  
section.featured-brands ul li {
  display: inline-block;
  margin: 0 0.5em 10px;
  vertical-align: top;
  } 
  
section.featured-brands ul img {
  display: block;
  border-radius: 3px;
  border: 1px solid #eee;
  background: #fff;
  } 

/* Smorgasbord
----------------------------------------------------------------*/

section.smorgasbord {
  margin-top: 3em;
  padding: 0;
  text-align: center;
  }

section.smorgasbord a.sb-reload {
  float: right;
  display: inline-block;
  margin-top: -30px;
  border-radius: 0.3em;
  padding: 0 33px 0 10px;
  height: 2.5em;
  line-height: 2.7em;
  background: #f15b40 url(/images/refresh.png) no-repeat 93% 50%;
  font-size: 1em;
  font-weight: bold;
  text-transform: uppercase;
  color: #fff;
  }

section.smorgasbord a.sb-reload:hover,
section.smorgasbord a.sb-reload:focus {background-color: #404040;}

section.smorgasbord div.sb-columns {
  overflow: hidden;
  margin-bottom: 2em;
  }
 
section.smorgasbord div.sb-column {
  float: left;
  margin-right: 1.5%;
  width: 26.2%;
  }

  
section.smorgasbord div.sb-column.sb-two {width: 44.6%;}
section.smorgasbord div.sb-column.sb-three {margin-right: 0;}

/* Inner blocks */
     
section.smorgasbord div.sb-block {
  position: relative;
  margin-bottom: 1.5em;
  }

/* CTA */
       
section.smorgasbord div.sb-block a.sb-cta {
  display: block;
  border-radius: 3px;
  background: #fff;
  box-shadow: 0 1px 0 rgba(0,0,0,0.1);
  text-align: left;
  font-size: 1.1em;
  }
         
section.smorgasbord div.sb-block a.sb-cta img {
  position: relative;
  z-index: 1;
  display: block;
  border-radius: 3px 3px 0 0;
  border-bottom: 1px solid #eee;
  width: 100%;
  -webkit-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  transition: opacity 0.2s;
  }
         
section.smorgasbord div.sb-block.sb-social a.sb-cta img {border-bottom: 0;}
                 
section.smorgasbord div.sb-block a.sb-cta:hover img,
section.smorgasbord div.sb-block a.sb-cta:focus img {opacity: 0.9;}
           
section.smorgasbord div.sb-block a.sb-cta div.sb-text {
  position: relative;
  z-index: 2;
  padding: 0.75em 0.85em 0.85em;
  }
           
section.smorgasbord div.sb-block a.sb-cta div.sb-text h2 {
  position: absolute;
  bottom: 100%;
  right: 0;
  margin: 0 0 10px;
  border: 0;
  border-radius: 2px 0 0 2px;
  padding: 0.35em 0.75em;
  background: #fff;
  line-height: 1.2;
  font-size: 1.2em;
  color: #fff;
  letter-spacing: normal;
  }

section.smorgasbord div.sb-block.favourite-find a.sb-cta div.sb-text h2 {background-color: #f15a40;}
section.smorgasbord div.sb-block.popular-favourite a.sb-cta div.sb-text h2 {background-color: #e84f8a;}
section.smorgasbord div.sb-block.recent-addition a.sb-cta div.sb-text h2 {background-color: #8a7dbb;}
section.smorgasbord div.sb-block.recent-favourite a.sb-cta div.sb-text h2 {background-color: #fdc22d;}
section.smorgasbord div.sb-block.sold-item a.sb-cta div.sb-text h2 {background-color: #5ac4be;}
section.smorgasbord div.sb-block.basket-item a.sb-cta div.sb-text h2 {background-color: #b2c249;}
section.smorgasbord div.sb-block.featured-shop-item a.sb-cta div.sb-text h2 {background-color: #888888;}
             
section.smorgasbord div.sb-block a.sb-cta div.sb-text h3 {
  margin: 0 0 0.3em;
  font-size: 1.1em;
  line-height: 1.1;
  color: #4083A9;
  }

section.smorgasbord div.sb-block a.sb-cta div.sb-text p.sb-info {
  margin: 0;
  line-height: 1.2;
  color: #888;
  }
                
section.smorgasbord div.sb-block a.sb-cta div.sb-text p.sb-info span {
  float: right;
  margin-left:5px
  }


/* Gift guide */
       
section.smorgasbord div.sb-block.sb-gift-guide a.sb-cta {box-shadow: none;}

section.smorgasbord div.sb-block.sb-gift-guide h2 {
  border: 0;
  border-radius: 0 0 3px 3px;
  padding: 0.7em;
  background: #5bc4bf;
  text-align: center;
  line-height: 1.1;
  font-size: 1.4em;
  color: #fff;
  text-transform: uppercase;
  text-shadow: 1px 1px 1px rgba(0,0,0,0.4);
  box-shadow: inset 0 -1px 0 rgba(0,0,0,0.1);
  }

/* NEW EXPERIENCE FOR GIFT GUIDES (THEMES) ON MOBILE: JR MAY 2015 */

input#theme-filter-cb {
  display: none;
}

body.theme main[role="main"],
body.category main[role="main"],
body.subcategory main[role="main"] {
  overflow: hidden;
}


@media screen and (max-width: 30.999em) {


  body.theme div.top-nav,
  body.theme a.gg-link-desk,
  div.filter-expanded,
  body.subcategory .top-nav,
  body.subcategory a.gg-link-desk {
    display: none;
  }

  body.theme .smorgasbord header,
  body.category .smorgasbord header,
  body.subcategory .smorgasbord header,
  body.section .smorgasbord header {
    width: 100%;
  }


  body.subcategory main[role="main"] nav.section-title > h1 {
    margin-bottom: 0;
  }

  body.theme main[role="main"] {
    padding-top: 2em;
  }

  body.theme main[role="main"] section header p,
  body.subcategory main[role="main"] section header p {
    text-align: left;
  }

  body.theme main[role="main"] div.filters,
  body.category main[role="main"] div.filters,
  body.subcategory main[role="main"] div.filters,
  body.theme main[role="main"] div.filters div.filter-expanded,
  body.category main[role="main"] div.filters div.filter-expanded,
  body.subcategory main[role="main"] div.filters div.filter-expanded,
  body.theme main[role="main"] div.filters div.filter-expanded div.sort-list,
  body.category main[role="main"] div.filters div.filter-expanded div.sort-list,
  body.subcategory main[role="main"] div.filters div.filter-expanded div.sort-list {
    overflow: hidden;
  }

  body.theme main[role="main"] div.filters > header,
  body.category main[role="main"] div.filters > header {
    border-top: 2px solid #ececea;
    padding-top: 1em;
  }
  body.subcategory main[role="main"] div.filters > header {
    padding-top: 1em;
  }

  body.theme main[role="main"] div.filters header > label[for="theme-filter-cb"],
  body.category main[role="main"] div.filters header > label[for="theme-filter-cb"],
  body.subcategory main[role="main"] div.filters header > label[for="theme-filter-cb"] {
    font-weight: normal;
    color: #047da3;
    float: right;
  }

  body.theme input#theme-filter-cb:checked ~ div.filter-expanded,
  body.category input#theme-filter-cb:checked ~ div.filter-expanded,
  body.subcategory input#theme-filter-cb:checked ~ div.filter-expanded {
    display: block;
    margin-bottom: 2em;
  }

  body.theme input#theme-filter-cb:checked ~ header > label[for="theme-filter-cb"]:before,
  body.category input#theme-filter-cb:checked ~ header > label[for="theme-filter-cb"]:before,
  body.subcategory input#theme-filter-cb:checked ~ header > label[for="theme-filter-cb"]:before {
    content: 'Close ';
    position: relative;
    display: inline;
  }

  body.theme section[role="navigation"],
  body.category section[role="navigation"],
  body.subcategory section[role="navigation"] {
    margin-bottom: 1em;
  }

  body.theme div.filters div.filter-expanded header.controls div.sort-list ul,
  body.category div.filters div.filter-expanded header.controls div.sort-list ul,
  body.subcategory div.filters div.filter-expanded header.controls div.sort-list ul {
    margin-top: 1em;
    margin-bottom: 0;
  }

  body.theme div.filters div.filter-expanded header.controls div.sort-list ul li,
  body.category div.filters div.filter-expanded header.controls div.sort-list ul li,
  body.subcategory div.filters div.filter-expanded header.controls div.sort-list ul li {
    width: 100%;
    margin: 0;
    height: 2em;
    line-height 2em;
  }

  body.theme section.items ul li,
  body.category section.items ul li,
  body.subcategory section.items ul li {
    background: none;
    height: auto;
  }

  body.theme section.items > ul li a,
  body.category section.items > ul li a,
  body.subcategory section.items > ul li a {
    overflow: hidden;
    padding: 0;
    border-radius: 2px;
    font-size: 0;
  }

  body.theme section.items ul li a h3,
  body.category section.items ul li a h3,
  body.subcategory section.items ul li a h3,
  body.theme section.items ul li a h4,
  body.category section.items ul li a h4,
  body.subcategory section.items ul li a h4,
  body.theme section.items ul li a p,
  body.category section.items ul li a p,
  body.subcategory section.items ul li a p {
    display: none;
  }

  body.theme section.items ul li a span.mobiletag,
  body.category section.items ul li a span.mobiletag,
  body.subcategory section.items ul li a span.mobiletag {
    position: absolute;
    bottom: 10px;
    right: 0;
    z-index: 1;
    border: 0;
    border-radius: 2px 0 0 2px;
    padding: 0.35em 0.75em;
    background: #8a7dbb;
    line-height: 1.2;
    font-size: 0.75rem;
    color: #fff;
    letter-spacing: normal;
  }

  .for-desktop {
    display: none;
  }

  .for-mobile {
    display: block;
  }

  body.theme main[role="main"] section header p,
  body.category main[role="main"] section[role="navigation"] .filters header.controls p,
  body.subcategory main[role="main"] section[role="navigation"] .filters header.controls p {
    text-align: left;
  }

  body.theme nav.paging  > p,
  body.category nav.paging  > p,
  body.subcategory nav.paging  > p {
    float: none !important;
    width: 100%;
    text-align: center;
  }
  body.theme nav.paging div.pagination,
  body.category nav.paging div.pagination,
  body.subcategory nav.paging div.pagination {
    float: none;
    padding: 1rem 0;
    width: 100%;
  }

}

@media only screen and (min-width: 31em) {
  body.theme section.items ul li a span.mobiletag,
  body.category section.items ul li a span.mobiletag,
  body.subcategory section.items ul li a span.mobiletag {
    display: none;
  }


  body.theme section.theme-header,
  body.category nav.section-title,
  body.subcategory nav.section-title {
    width: 74.233129%;
    display: inline-block;
    float: right;
  }

  .for-desktop {
    display: block;
    margin-bottom: 2em;
    overflow: hidden;
    width: 100%;
  }

  .for-desktop li {
    display: inline-block;
    width: auto;
    white-space: nowrap;
  }

  .for-mobile {
    display: none;
  }

  body.theme label[for="theme-filter-cb"],
  body.category label[for="theme-filter-cb"],
  body.subcategory label[for="theme-filter-cb"] {
    font-size: 1.2em;
    margin-top: 1em;
  }

  body.theme label[for="theme-filter-cb"]:after,
  body.category label[for="theme-filter-cb"]:after,
  body.subcategory label[for="theme-filter-cb"]:after {
    content: ' items by';
    position: relative;
    display: inline;
  }

  body.theme main[role="main"] div.filters > header,
  body.category main[role="main"] div.filters > header,
  body.subcategory main[role="main"] div.filters > header {
    margin-bottom: 0;
  }

  body.theme main[role="main"] div.filters > header > span,
  body.category main[role="main"] div.filters > header > span,
  body.subcategory main[role="main"] div.filters > header > span {
    font-size: 2em;
    font-weight: 300;
    margin-top: -0.1em;
    color: #8a8a8a;
    display: inline-block;
    white-space: nowrap;
  }

  body.theme header.controls,
  body.category header.controls,
  body.subcategory header.controls {
    margin-bottom: 1rem;
    box-sizing: border-box;
  }

}

/* NEW EXPERIENCE FOR SECTION ON MOBILE: JR MAY 2015 */

body.section main[role="main"] nav.section-title,
body.category main[role="main"] nav.section-title label[for="section-title-cb"] {
  padding-bottom: 0.6rem;
  border-bottom: 1px solid #d5d5d5;
  margin-bottom: 0.6rem;
}

body.subcategory main[role="main"] nav.section-title > h1 {
  padding-bottom: 1rem;
}

nav.section-title input#section-title-cb {
    display: none;
}

body.section section[role="main"] section.smorgasbord {
  margin-top: 0;
}

body.subcategory nav.section-title > p {
  margin-bottom: 0;
}

body.section section[role="main"] .sb-columns {
  width: 110%;
  overflow-y: hidden;
  overflow-x: scroll;
  -webkit-overflow-scrolling: touch;
  padding: 0 5%;
  box-sizing: border-box;
  margin-left: -5%;
  padding-bottom: 2rem;
  white-space: nowrap;
}

body.section section[role="main"] .sb-columns > div {
  width: initial;
  display: inline-block;
  float: none;
  margin: 0;
}

body.section section[role="main"] .sb-columns > div > div.sb-block {
  margin: 0 0.5rem 0 0;
  width: 10rem;
  display: inline-block;
}

@media screen and (max-width: 30.999em) {

  body.subcategory main[role="main"] nav.section-title > h1 {
    padding-bottom: 0.6rem;
    border-bottom: 1px solid #d5d5d5;
  }

  nav.section-title > a,
  nav.section-title > p {
    height: 2rem;
    line-height: 2rem;
    font-size: 1rem;
    display: block;
    width: 100%;
    margin-top: -1rem;
  }

  nav.section-title > ul,
  nav.section-title ul li a.active {
    display: none;
  }
  
  nav.section-title input#section-title-cb:checked ~ ul {
    display: block;
    margin-top: 0.4rem;
  }

  body.category nav.section-title input#section-title-cb:checked ~ label[for="section-title-cb"] {
      border-bottom: 1px transparent solid;
      margin: 0;
  }

  body.category nav.section-title input#section-title-cb:checked ~ ul {
    margin: 0 0 1rem 0;
  }

  nav.section-title label {
    margin: 0;
    position: relative;
  }

  nav.section-title label:before,
  nav.section-title label:after {
    content: "";
    position: absolute;
    display: inline-block;
    width: 0;
    height: 0;
    border-style: solid; 
    border-color: transparent #d5d5d5;
    right: 0.6rem;
  }

  nav.section-title label:before {
    border-top: 0.4rem solid #d5d5d5;
    border-left: 0.4rem solid transparent;
    border-right: 0.4rem solid transparent;
    bottom: 0.2rem;
  }

  body.category nav.section-title label:before {
    bottom: 0.8rem;
  }

  nav.section-title label:after {
    border-bottom: 0.4rem solid #d5d5d5;
    border-left: 0.4rem solid transparent;
    border-right: 0.4rem solid transparent;
    border-top: 0;
    top: 0.4rem;
  }

  nav.section-title ul li a {
    font-size: 1.2rem;
    height: 2.6rem;
    line-height: 2.6rem;
    border-bottom: 1px solid #e6e6e6;
    display: block;
  }

  nav.section-title ul li:last-of-type a {
    border-bottom: 0;
  }


  body.section div.top-nav,
  body.category div.top-nav,
  body.section a.gg-link-desk,
  body.category a.gg-link-desk {
    display: none;
  }

  body.section main[role="main"],
  body.category main[role="main"],
  body.subcategory main[role="main"] {
    padding-top: 2em;
    overflow: hidden;
  }

  body.section main[role="main"] section[role="main"] {
    margin-bottom: 1rem;
  }

  body.section section[role="main"] ul.gallery li {
    height: auto;
    background: transparent;
  }

  body.section section[role="main"] ul.gallery li a,
  body.section section[role="main"] ul.gallery li div {
    padding: 0;
    margin: 0;
  }

  body.section section[role="main"] .sb-columns > div > div.sb-block > a {
    background: none;
    box-shadow: none;
  }

  body.section section[role="main"] .sb-columns > div > div.sb-block img {
    border-bottom: 0;
  }

  body.section section[role="main"] .sb-columns > div > div.sb-block.favourite-find img {
    border-radius: 3px;
    box-shadow: 0 1px 0 rgba(0,0,0,0.1);
  }

  body.section section[role="main"] .sb-columns > div > div.sb-block .sb-info,
  body.section section[role="main"] ul.gallery div.sb-block .sb-text,
  body.section section[role="main"] .sb-columns > div > div.sb-block h3 {
    display: none;
  }

  body.section section[role="main"] .sb-columns > div > div.sb-block .sb-text {
    padding: 0;
  }

  body.section section[role="main"] .sb-columns > div > div.sb-block .sb-text h2 {
    margin: 0;
    width: 100%;
    box-sizing: border-box;
    border-radius: 0;
    height: 1.6rem;
    top: 0;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    box-shadow: 0 1px 0 rgba(0,0,0,0.1);
    white-space: initial;
    display: block;
  }

  body.section section[role="main"] .sb-columns > div > div.sb-block.sb-gift-guide h2 {
    position: absolute;
    right: 0;
    border: 0;
    border-radius: 2px 0 0 2px;
    padding: 0.6em 0.75em 0.6em 0.75em;
    line-height: 1.2;
    font-size: 1em;
    color: #fff;
    letter-spacing: normal;
    z-index: 1;
    width: 100%;
    box-sizing: border-box;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    white-space: initial;
    display: block;
  }

  body.section span.mobiletag {
    position: absolute;
    bottom: 10px;
    right: 0;
    z-index: 1;
    border: 0;
    border-radius: 2px 0 0 2px;
    padding: 0.35em 0.75em;
    background: #8a7dbb;
    line-height: 1.2;
    font-size: 0.75rem;
    color: #fff;
    letter-spacing: normal;
  }

  body.section section[role="navigation"] ul#theme-links,
  body.category section[role="navigation"] ul#theme-links,
  body.subcategory section[role="navigation"] ul#theme-links {
    width: 112%;
    white-space: nowrap;
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    height: 3rem;
    margin: 1rem 0 0.4rem -6%;
    padding: 0 6%;
    box-sizing: border-box;
    font-size: 1.2rem;
  }

  body.section section[role="navigation"] .highlights h2,
  body.category section[role="navigation"] .highlights h2,
  body.subcategory section[role="navigation"] .highlights h2 {
    z-index: 1;
    position: relative;
  }

  body.section section[role="navigation"] ul#theme-links::before,
  body.category section[role="navigation"] ul#theme-links::before,
  body.subcategory section[role="navigation"] ul#theme-links::before {
    position: absolute;
    content: '';
    left: -10%;
    right: -10%;
    top: -1rem;
    bottom: 0;
    background: #f1f1f0;
    height: 11rem;
    z-index: 0;
  }

  body.section section[role="navigation"] ul#theme-links li,
  body.category section[role="navigation"] ul#theme-links li,
  body.subcategory section[role="navigation"] ul#theme-links li {
    position: relative;
    z-index: 1;
  }

  body.section section[role="navigation"] ul#theme-links li a,
  body.category section[role="navigation"] ul#theme-links li a,
  body.subcategory section[role="navigation"] ul#theme-links li a {
    padding: 0.4rem 0.6rem 0.5rem 0.6rem;
    background-color: white;
    border-radius: 0.2rem;
    font-size: 0.8rem;
    color: #8a7dbb;
    box-shadow: 0 1px 0 rgba(0,0,0,0.1);
  }

  section#cat-sub-menus {
    border: 1px solid #e6e6e6;
    box-sizing: border-box;
  }

  body.category section#cat-sub-menus {
    margin-bottom: 2rem;
  }
  
  section#cat-sub-menus ul {
    margin: 0;
  }

  body.section section[role="navigation"] div.contracted h4 a,
  body.category section[role="navigation"] ul.in-this-category li,
  section#cat-sub-menus > h3 {
    font-size: 1em;
    height: 2.6rem;
    line-height: 2.7rem;
    border-bottom: 1px solid #e6e6e6;
    display: block;
    font-weight: normal;
    text-transform: uppercase;
    background-color: white;
    text-indent: 10px;
    margin-bottom: 0;
    text-align: left;
  }

  body.section section[role="navigation"] header h2,
  body.category section[role="navigation"] header h2,
  body.subcategory section[role="navigation"] header h2 {
    border-top: 1px solid #d5d5d5;
    padding: 0.6rem 0 0 0;
    margin: 1rem 0 0rem 0;
  }

  body.section section[role="navigation"] div.contracted h4 a,
  body.category section[role="navigation"] ul.in-this-category li {
    background: #fff url(../images/arrow-right.png) 98% 54% no-repeat;
  }

  body.category section[role="navigation"] ul.in-this-category li a {
    display: inline-block;
    text-indent: 0;
  }

  body.section section[role="navigation"] div.contracted:last-of-type h4 a,
  body.category section[role="navigation"] ul.in-this-category li:last-of-type {
    border-bottom: 0;
  }

  body.section section[role="navigation"] div.contracted h4 a.expand-contract {
    display: none;
  }


  body.section section[role="navigation"] div.contracted h4,
  body.category section[role="navigation"] ul.in-this-category li  {
    margin: 0;
    padding: 0;
  }

  .giftguide-button {
    z-index: 1;
    position: relative;
    display: inline-block;
    border-radius: 0.3em;
    padding: 0 14px;
    height: 3.5em;
    line-height: 3.45em;
    background: #8a7dbb;
    font-size: 1.2em;
    font-weight: bold;
    text-transform: uppercase;
    color: #fff;
    text-decoration: none;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    white-space: nowrap;
    margin-bottom: 3rem;
    width: 100%;
    box-sizing: border-box;
  }

  .giftguide-button::after {
    
  }

  body.section .highlights,
  body.category .highlights,
  body.subcategory .highlights {
    margin-top: 1rem;
  }

  body.section .highlights span,
  body.section .recent-activity > header span,
  body.category .highlights span,
  body.subcategory .highlights span {
    z-index: 1;
    position: absolute;
    top: 0;
    right: 0;
    line-height: 1.8;
    color: #8a8a8a;
  }
  body.section .recent-activity > header span {
    line-height: 2.4;
  }

}


@media screen and (min-width: 31em) {
  body.section section[role="main"],
  body.category section[role="main"],
  body.subcategory section[role="main"] {
    float: right;
  }
  nav.section-title label {
    cursor: inherit;
  }
  
  body.section main[role="main"] nav.section-title {
    float: left;
    width: 22.699387%;
    margin-right: 3.0674847%;
  }

  body.section section[role="main"] section.smorgasbord header:first-of-type h2 {
    line-height: 2.2rem;
  }
  
  body.section section[role="main"] section.smorgasbord section.recent-activity > div {
    position: relative;
    overflow: hidden;
    width: calc(134.8% + 6rem);
    padding: 0;
    margin-left: -34.766872%;
    left: -5rem;
  }

  body.section section[role="main"] section.smorgasbord section.recent-activity > div::before,
  body.section section[role="main"] section.smorgasbord section.recent-activity > div::after {
    content: '';
    position: absolute;
    top: 0;
    height: 100%;
    width: 5rem;
    z-index: 1;
  }

  body.section section[role="main"] section.smorgasbord section.recent-activity > div::before  {
    left: 0;
    background: -moz-linear-gradient(left,  rgba(246,246,244,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(246,246,244,1)), color-stop(100%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left,  rgba(246,246,244,1) 0%,rgba(255,255,255,0) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left,  rgba(246,246,244,1) 0%,rgba(255,255,255,0) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left,  rgba(246,246,244,1) 0%,rgba(255,255,255,0) 100%); /* IE10+ */
    background: linear-gradient(to right,  rgba(246,246,244,1) 0%,rgba(255,255,255,0) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f6f4', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 */
  }

  body.section section[role="main"] section.smorgasbord section.recent-activity > div::after  {
    right: 0;
    background: -moz-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(246,246,244,1) 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(100%,rgba(246,246,244,1)));
    background: -webkit-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(246,246,244,1) 100%);
    background: -o-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(246,246,244,1) 100%);
    background: -ms-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(246,246,244,1) 100%);
    background: linear-gradient(to right,  rgba(255,255,255,0) 0%,rgba(246,246,244,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#f6f6f4',GradientType=1 );


  }

  body.section section[role="main"] .sb-columns {
    width: 100%;
    padding: 0;
    position: relative;
    z-index: 0;
    margin-left: 0;
    padding-left: 5rem;
  }

  body.section section[role="main"] .sb-columns > div > div.sb-block {
    width: 16rem;
    vertical-align: top;
    margin: 0 1.6rem 0 0;
    box-shadow: 0 1px 0 rgba(0,0,0,0.1);
    margin-bottom: 1rem;
  }

  section.smorgasbord div.sb-block a.sb-cta div.sb-text h2 {
    font-size: 1em;
  }

  body.section section[role="main"] section.smorgasbord ul.gallery li {
    background: transparent;
    border-radius: 3px;
    overflow: hidden;
    box-shadow: 0 1px 0 rgba(0,0,0,0.1);
  }


  body.section section[role="main"] section.smorgasbord ul.gallery li div {
    padding: 0;
  }

  body.section section[role="main"] section.smorgasbord ul.gallery li div h3 {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body.section section[role="main"] section.smorgasbord ul.gallery li div > a:first-of-type {
    border-radius: 0;
    box-shadow: none;
  }

  body.section section[role="main"] section.smorgasbord ul.gallery li div img {
    min-width: calc(100% + 2.66em);
    left: -1.33em;
    top: -1.33em;
  }

  body.section section[role="main"] section.smorgasbord .sb-columns div.sb-block a.sb-cta div.sb-text {
    padding: 1.33em;
  }

}


body.section section.smorgasbord div.sb-column {
  width: auto;
}


div.sb-column h2,
div.sb-column h3 {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}



/* Social */

section.smorgasbord div.sb-block.sb-social a.sb-cta {box-shadow: none;}

section.smorgasbord div.sb-block.sb-social p.sb-platform {
  margin: 0;
  border-radius: 3px;
  padding: 15px 10px 15px 45px;
  background: no-repeat 10px 50%;
  font-weight: bold;
  font-size: 1.2em;
  line-height: 1.2;
  color: #fff;
  text-shadow: 1px 1px 0 rgba(0,0,0,0.4);
  box-shadow: inset 0 -1px 0 rgba(0,0,0,0.1);
  }

section.smorgasbord div.sb-block.sb-social.sb-twitter p.sb-platform {background-image: url(/images/social/twitter.png);}
section.smorgasbord div.sb-block.sb-social.sb-facebook p.sb-platform {background-image: url(/images/social/facebook.png);}
section.smorgasbord div.sb-block.sb-social.sb-instagram p.sb-platform {background-image: url(/images/social/instagram.png);}
section.smorgasbord div.sb-block.sb-social.sb-pinterest p.sb-platform {background-image: url(/images/social/pinterest.png);}
section.smorgasbord div.sb-block.sb-social.sb-blog p.sb-platform {background-image: url(/images/social/blog.png);}
  
section.smorgasbord div.sb-block.sb-social.sb-twitter p.sb-platform {background-color: #2dabdf;}
section.smorgasbord div.sb-block.sb-social.sb-facebook p.sb-platform {background-color: #3d5b99;}
section.smorgasbord div.sb-block.sb-social.sb-instagram p.sb-platform {background-color: #4481b0;}
section.smorgasbord div.sb-block.sb-social.sb-pinterest p.sb-platform {background-color: #c9151a;}
section.smorgasbord div.sb-block.sb-social.sb-blog p.sb-platform {background-color: #f15b40;}

/* Brand banner */

div.brand-banner {
  position: relative;
  margin: 0 0 3em;
  background: url(/images/brand-banner/1.jpg) no-repeat 50% 50%;
  background-size: cover;
  }

div.brand-banner div.container {height: 400px;}

div.brand-banner div.text {
  position: absolute;
  left: 0;
  bottom: 0;
  text-align: left;
  }
  
div.brand-banner div.text h2,
div.brand-banner div.text p {
  padding: 10px 15px;
  background: rgba(0,0,0,0.4);
  text-shadow: 1px 1px 1px rgba(0,0,0,0.65);
  }

div.brand-banner div.text h2 {
  display: inline-block;
  margin: 0 0 2px;
  font: bold 3em/1.2 Lora, Georgia, sans-serif;
  color: #fff;
  }

div.brand-banner div.text p.bb-message {
  margin: 0;
  border: 0;
  border-radius: 0;
  max-width: 50%;
  font-size: 1.7em;
  line-height: 1.2;
  font-family: Lora, Georgia, sans-serif;
  color: #fff;
  }

div.brand-banner div.text p.bb-message span {display: block;}

div.brand-banner div.text p.attribute {
  position: absolute;
  bottom: 0;
  right: 0;
  margin: 0;
  padding: 0.2em 0.8em;
  color: #fff;
  white-space: nowrap;
  }

div.brand-banner div.text p.attribute a {color: #ffbf2e;}
div.brand-banner div.text p.attribute a:hover,
div.brand-banner div.text p.attribute a:focus {color: #fff;}

/* Newsletter banner
----------------------------------------------------------------*/

section.newsletter {
  margin: 1em 0;
  background-color: #ef8fb4;
}
ul.newsletter__ul {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin: 0;
  padding: 6px 0 8px 0;
  color: white;
  font-size: 130%;
  text-shadow: 1px 1px #d47b9d;
}
ul.newsletter__ul li {
  padding: 0 2em 0 2em;
}
a.newsletter__link {
  margin: 4px 0 0 0;
  padding: 4px 6px;
  display: inline-block;
  border-radius: 4px;
  background-color: #444;
  color: white;
  text-shadow: none;
  font-size: 110%;
  font-weight: bold;
  text-transform: uppercase;
  transition: background-color 0.2s ease;
}
a.newsletter__link:hover {
  background-color: #000;
}
ul.footer__buyers-mailing-list {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-size: 140%;
  margin-bottom: 1em;
}
a.footer__buyers-mailing-list__link {
  margin: 4px 0 0 0;
  padding: 4px 6px;
  display: inline-block;
  border-radius: 4px;
  background-color: #488d38;
  color: white;
  text-shadow: none;
  font-size: 110%;
  font-weight: bold;
  text-transform: uppercase;
  transition: background-color 0.2s ease;
}
a.footer__buyers-mailing-list__link:hover {
  background-color: #39702c;
}
/* Footer
----------------------------------------------------------------*/

footer[role=contentinfo] {
  border-top: 1px solid #e8e8e4;
  padding: 3em 0 5em;
  background: #fff;
  }
  
footer[role=contentinfo] div.container {overflow: hidden;}

footer[role=contentinfo] div.col-left {
  float: left;
  width: 55%;
  }
  
footer[role=contentinfo] div.col-right {
  float: right;
  width: 45%;
  text-align: right;
  }
  
/* Links */
  
footer[role=contentinfo] ul.links {
  margin: 0 0 2em;
  list-style: none;
  font-size: 1.1em;
  }

footer[role=contentinfo] ul.links > li {
  display: inline-block;
  margin: 0 10% 0 0;
  vertical-align: top;
  }
  
footer[role=contentinfo] ul.links h2 {
  margin-bottom: 0.2em;
  font-weight: bold;
  font-size: 1em;
  letter-spacing: 0;
  color: #666;
  }

footer[role=contentinfo] ul.links ul li {margin: 0; line-height: 1.5;}

/* Social */

footer[role=contentinfo] div.social {
  display: inline-block;
  vertical-align: top;
  }

footer[role=contentinfo] div.social h2 {
  position: absolute;
  left: -1000em;
  }

footer[role=contentinfo] div.social ul { margin-bottom: 1em;}

footer[role=contentinfo] div.social ul li {
  display: inline-block;
  margin: 0 5px 0 0;
  }

footer[role=contentinfo] div.social ul a {display: block;}

footer[role=contentinfo] div.social ul a img {
  display: block;
  width: 40px;
  border-radius: 3px;
  }

/* Newsletter */

footer[role=contentinfo] form fieldset {
  border-bottom: 2px solid #f2f2f2;
  padding-bottom: 2em;
  }

footer[role=contentinfo] form label {
  display: block;
  margin-bottom: 0.8em;
  font-size: 1.4em;
  line-height: 1.2;
  color: #666;
  }
  
footer[role=contentinfo] form input {
  display: inline-block;
  margin: 0 0 0 5px;
  border-radius: 2px;
  vertical-align: middle;
  font-size: 1.1em;
  }
  
footer[role=contentinfo] form input.standard {
  margin-left: 5px;
  border: 1px solid #ddd;
  padding: 0.7em 0 0.8em 0.5em;
  width: 60%;
  background: #fff;
  }
      
footer[role=contentinfo] form input.button {
  padding: 0.8em 1em;
  line-height: 1.2;
  }
  
/* Info */

footer[role=contentinfo] div.info {
  overflow: hidden;
  text-align: left;
  color: #bbb;
  }

footer[role=contentinfo] div.info p {margin: 0 0 0.3em;}

footer[role=contentinfo] div.info ul li {
  display: inline;
  margin-right: 10px;
  }
  
footer[role=contentinfo] p.paypal img {max-width: 100%;}

/* Modal
----------------------------------------------------------------*/

#modal-overlay {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  z-index: 3000;
  }

#modal-overlay.modal-hidden {display: none;}

#modal-bg {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  z-index: 1;
  background: rgb(128,128,128);
  background: rgba(0,0,0,0.2);
  }

/* Cancel button */

#modal-content a.modal-cancel {
  position: absolute;
  top: 7px;
  right: 7px;
  width: 18px;
  height: 18px;
  background: url(../images/close-cross.png) no-repeat 50% 50%;
  background-size: 100% auto;
  text-indent: -1000em;
  opacity: 0.2;
  }
  
#modal-content a.modal-cancel:hover,
#modal-content a.modal-cancel:focus {opacity: 1;}

/* Content */

#modal-content {
  position: relative;
  z-index: 2;
  margin: 10% auto 0;
  border-radius: 0.4em;
  padding: 1em 1.5em;
  max-width: 26em;
  background-color: #fff;
  background-color: rgba(255,255,255,0.9);
  font-size: 1.1em;
  }

#modal-content h2 {
  margin: 0 0 0.8em;
  font-weight: 300;
  font-size: 1.4em;
  line-height: 1.2;
  letter-spacing: normal;
  color: #404040;
  }

#modal-content ul,
#modal-content ol,
#modal-content p {margin-bottom: 1em;}
  
#modal-content ul {
  margin-left: 20px;
  list-style-type: disc;
  }
  
#modal-content ul li {margin: 0;}
#modal-content input {display: inline-block;}

#modal-content form > :last-child,
#modal-content.user-options div.inner-wrap div > :last-child {margin-bottom: 0;}
#modal-content.registered-popup {
  max-width: 30em;
}

/* User options */

#modal-content.user-options {
  padding: 0 0 20px;
  max-width: 30em;
  }

#modal-content.user-options ul.tabs {
  margin: 0;
  border-bottom: 1px solid #e5e5e5;
  padding: 20px 0 0 20px;
  list-style: none;
  }

#modal-content.user-options ul.tabs li {
  display: inline-block;
  margin-right: 5px;
  vertical-align: bottom;
  }

#modal-content.user-options ul.tabs a {
  display: block;
  margin-bottom: -1px;
  border: 1px solid #e5e5e5;
  border-radius: 3px 3px 0 0;
  padding: 0.5em 1em;
  background: #f6f6f4;
  font-size: 1.2em;
  }

#modal-content.user-options ul.tabs a.selected,
#modal-content.user-options ul.tabs a:hover,
#modal-content.user-options ul.tabs a:focus {
  border-bottom-color: #fff;
  background: #fff;
  }
  
#modal-content.user-options div.inner-wrap {
  border-bottom: 1px solid #e5e5e5;
  padding: 2em 1.5em;
  background: #fff;
  }

#modal-content.user-options div.inner-wrap > div {display: none;}
#modal-content.user-options div.inner-wrap > div.show {display: block;}

/* Responsive changes
----------------------------------------------------------------*/

@media screen and (max-width: 64.499em) {
  #banner nav {
    position: absolute;
    top: 1.25rem;
    left: 7.2rem;
  }
  #banner form {
    width: 100%;
  }
}

@media screen and (min-width: 30em) and (max-width: 64.499em) {
  #banner img {
    margin-top: 4px;
  }
}

@media screen and (max-width: 64.499em) {

#banner {text-align: left;}   
#banner div.container {padding-top: 15px; padding-bottom: 15px;}
#banner h1 {display: block; padding: 0 0 10px;}
#banner h1 img {margin: 0 auto;}
#banner form {margin: 0!important;width: 80%;}

#banner nav {float: none!important; text-align: left;}
#banner nav h2 {display: block; font-size: 1em;}
  
#banner nav h2 a {
  position: relative;
  display: block;
  margin-right: 1px;
  width: 4.2em;
  height: 3.15em;
  line-height: 3.15em;
  font-weight: bold;
  text-align: center;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #4083A9;
  }
  
#banner nav h2 a:hover,
#banner nav h2 a.on {

  }
  
/*#banner nav h2 a:after {
  position: absolute;
  top: 50%; left: 50%;
  margin: -9px 0 0 -1.2em;
  border: solid #047da3;
  border-width: 3px 0;
  width: 2.4em;
  height: 17px;
  box-sizing: border-box;
  content: "";
  }
   
#banner nav h2 a:before {
  position: absolute;
  top: 50%; left: 50%;
  margin: -2px 0 0 -1.2em;
  width: 2.4em;
  height: 3px;
  background: #047da3;
  content: "";
  }
   
#banner nav h2 a:hover:after,
#banner nav h2 a.on:after {border-color: #fff;}
#banner nav h2 a:hover:before,
#banner nav h2 a.on:before {background: #fff;}*/

#banner nav > ul {
  position: absolute;
  top: 100%;
  left: -1000em;
  z-index: 20000;
  margin: 13px 0 0;
  border-radius: 0.2em;
  padding: 5px 0;
  background: #047da3;
  font-size: 1em;
  box-shadow: 3px 3px 3px rgba(0,0,0,0.3);
  opacity: 0;
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
  }
      
#banner nav > ul.open {left: -9px; opacity: 1;}
  
#banner nav > ul:after {
  position: absolute;
  top: -10px;
  left: 10px;
  margin: 0 10px 0 0;
  border-width: 0 10px 10px;
  border-style: solid;
  border-color: transparent transparent #047da3;
  height: 0;
  width: 0;
  content: "";
  }

#banner nav ul li {display: block; margin: 0;} 
#banner nav ul li.alt {display: none;}
#banner nav ul li.alt2 {display: block;}
#banner nav ul a {display: block; padding: 0.6em 1.25em!important; color: #eee;}
#banner nav ul a:hover,
#banner nav ul a:focus {background: #205f82!important; color: #fff;} 
#banner nav ul a.title {display: none;}
#banner nav ul.sub-nav {position: static; opacity: 1; visibility: visible;}
#banner nav ul.sub-nav li.divider {border-bottom: 0;}

footer[role=contentinfo] div.col-left,
footer[role=contentinfo] div.col-right {float: none; width: auto; text-align: center;}
footer[role=contentinfo] ul.links,
footer[role=contentinfo] div.social ul {margin-bottom: 2em;}
footer[role=contentinfo] ul.links > li {margin: 0 5% 20px; text-align: left;}

section.explore div.categories ul {font-size: 1.3em;}
section.featured-brands ul li {margin: 0 0.25em 10px;} 
section.explore header h2 {text-align: left;}

}

@media screen and (max-width: 42.999em) {

.columns {margin: 0;}
.columns > .column {float: none; margin: 0 0 2em;}
.columns.two > .column {width: auto;}
section.register-benefits {margin: 0;}

div.user-account {display: flex; flex-direction: column;}
div.user-account div.columns {order: 2;}
div.user-account section.checkout-guest {border-width: 0 0 1px; padding: 0; order: 1;}

}

@media screen and (max-width: 64.499em) {

  #site-search {
    box-sizing: border-box;
    position: absolute;
    width: 100%;
    z-index: 1;
    padding-left: 74px;
  }
  
  #site-search input.standard {
    width: calc(100% - 80px);
    height: 1.9rem;
  }

  #site-search input.search-button {
    float: right;
    position: absolute;
    right: 4px;
  }

  #banner form {
    width: 100%;
  }
}

@media screen and (max-width: 30.999em) {

#banner form,
#banner nav h2 {font-size: 0.9em;}
#site-search input.button {padding: 0 0.5em;}

div.user-account h1 {font-size: 1.6em;}
div.user-account h2 {font-size: 1.4em;}

}

/* Tablet */

@media only screen and (max-width: 768px) {

section.editorials {padding: 2em;}
section.editorials ul {text-align: center;}
  
section.editorials ul li {
  display: inline-block;
  float: none!important;
  width: auto;
  vertical-align: top;
  }
    
section.editorials ul li.one,
section.editorials ul li.two {margin-bottom: 15px;}

section.favourite-finds header {margin-bottom: 0.5em;}

section.pinterest ul.gallery li:last-of-type,
section.featured-seller-list ul.gallery li:nth-child(5),
section.featured-seller-list ul.gallery li:nth-child(6) {display: block;}

section.favourite-finds a.refresh,
section.pinterest header span.button a {
  position: static;
  display: inline-block;
  margin: 10px 0;
  }

section.favourite-finds div.wrapper,
section.favourite-finds ul.items {
  margin: 0 auto;
  max-width: 600px;
  padding: 0;
  background: none;
  text-align: center;
  }
  
section.favourite-finds ul.items li.small,
section.favourite-finds ul.items li.big {
  display: inline-block;
  float: none;
  margin: 5px;
  border: 10px solid #fff;
  width: auto;
  vertical-align: top;
  }
  
section.favourite-finds ul.items li.big {border-width: 18px;}
section.pinterest header {margin-bottom: 1em;}
       
section.pinterest p.pinterest-info {
  position: static;
  margin: 10px 0 5px;
  width: auto;
  }

div.arrow-cta,
section.newsletter {text-align: center; font-size: 0.8em;}
div.arrow-cta div.container:before,
div.arrow-cta div.container:after,
section.newsletter div.container::before,
section.newsletter div.container::after {display: none;}
section.newsletter div.container {padding: 1em 0;}
section.newsletter label {display: block; margin-bottom: 10px; text-align: center;}
section.newsletter input.standard {width: 85%;}

section.explore .grid li.recently-added-badge {
  position: static;
  bottom: auto;
  right: auto;
  margin: 0 0 1em 2%;
  width: auto;
  text-align: center;
  }
    
section.explore .grid li.recently-added-badge a { 
  display: inline-block;
  position: relative;
  margin: 0 0 1em;
  border-radius: 0.3em;
  padding: 0.25em 1em;
  width: auto;
  height: auto;
  line-height: 2em;
  background: #887cba;
  color: #fff;
  font-size: 1.1em;
  font-weight: 700;
  letter-spacing: normal;
  text-transform: uppercase;
  text-indent: 0;
  text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
  }

div.theme-carousel ul.slides a h3 {font-size: 1em;}

section.favourite-widget {border-bottom-width: 7px;}
section.favourite-widget header h3 span.title {display: block; max-width: none; text-align: center; font-size: 1.3em;}
section.favourite-widget header h3 span.info,
section.favourite-widget header a.favourites-tab {display: none;}
section.favourite-widget ol {padding: 10px 10px 3px;}
section.favourite-widget ol li {margin-bottom: 2%; width: 31.3%;}

section.favourite-finds ul.items li.small a.favourite-item,
section.favourite-widget ol a.favourite-item {top: -6px; right: -6px;}

div.brand-banner div.container {height: 300px;}
div.brand-banner div.text h2 {font-size: 2em;}
div.brand-banner div.text p.bb-message {font-size: 1.4em;}
div.brand-banner div.text p.bb-message span {display: inline;}
section.smorgasbord a.sb-reload {float: none; margin: 20px 0 0;}
section.smorgasbord div.sb-column,
section.smorgasbord div.sb-column.sb-two {margin-right: 2.5%; width: 31.666%;}
section.smorgasbord div.sb-column.sb-one > :last-child,
section.smorgasbord div.sb-column.sb-three > :last-child {display: none;}
section.smorgasbord div.sb-block {margin-bottom: 7%;}
section.smorgasbord div.sb-block a.sb-cta {font-size: 1em!important;}
section.smorgasbord div.sb-block.sb-social {font-size: 0.9em;}

section.explore header h2 {margin-bottom: 1em; text-align: center; font-size: 1.7em;}
section.explore .grid a h3 {font-size: 1.3em;}
section.explore div.categories h3,
section.featured-brands header h2 {display: block; padding: 0 1em;}
section.explore header h2:before,
section.explore header h2:after,
section.explore div.categories h3:before,
section.explore div.categories h3:after,
section.featured-brands header h2:before,
section.featured-brands header h2:after {display: none;}
section.explore div.categories ul li {display: block;}
section.explore div.categories ul a {padding: 0.5em 1.2em;}

#toTop {display: none!important;}
footer[role=contentinfo] {padding-bottom: 3em;}
footer[role=contentinfo] form label {font-size: 1.2em;}
footer[role=contentinfo] form input.standard {width: 50%;}
footer[role=contentinfo] div.social ul a img {width: 30px;}

.error main[role=main] section {float: none; width: auto; margin-right: 0; margin-bottom: 2em;}

}

/* Wide phone */

@media only screen and (max-width: 480px) {

.grid {margin-left: -5%;}
.grid > li {margin: 0 0 5% 5%;}
.grid.three > li,
.grid.five > li {width: 95%;}
.grid.four > li {width: 45%;}
.grid.six > li {width: 28.3%;}

section.favourite-finds ul.items li.small {max-width: 39%;}
section.favourite-finds ul.items li.small span {display: none;}
div.theme-carousel {border-bottom-width: 50px;}
div.theme-carousel ul.slides li {width: 400px;}
div.theme-carousel a.carousel-button {top: auto; bottom: -45px; left: 50%!important; right: auto!important;}
div.theme-carousel a.carousel-button.next {margin-right: -20px}
div.theme-carousel a.carousel-button.previous {margin-left: -20px}
div.theme-carousel ul.slides a h3 {font-size: 0.8em;}
section.pinterest ul.gallery li:last-of-type,
section.featured-seller-list ul.gallery li:nth-child(5),
section.featured-seller-list ul.gallery li:nth-child(6) {display: none;}
section.total {text-align: center;}
section.total div.actions input[type="submit"] {display: inline-block; float: none;margin: 0 0 20px;}

div.brand-banner div.container {height: 250px;}
div.brand-banner {margin: 20px 0;}
div.brand-banner div.text {text-align: center;}
div.brand-banner div.text p.bb-message {left: 0; right: 0; bottom: 0; max-width: none; text-align: center; font-size: 1.2em;}
div.brand-banner div.text p.bb-message span {display: inline;}
div.brand-banner div.text p.attribute {display: none;}
section.smorgasbord div.sb-block a.sb-cta {font-size: 0.9em!important;}

section.explore header h2 span,
section.explore div.categories h3 span {display: none;}
section.explore .grid li {float: none; width: auto;}

a.button-social.big {font-size: 1.1em;}

}

/* Narrow phone */

@media only screen and (max-width: 400px) {

section.smorgasbord div.sb-column {float: none; margin: 0!important; width: auto!important;}
section.smorgasbord div.sb-block {float: none; margin: 0 0 1em; width: auto;}
section.smorgasbord div.sb-block.sb-social {font-size: 1em;}

}


/* Media Queries
----------------------------------------------------------------*/


/*layouts larger than 1020px*/
@media screen and (min-width: 1200px) {

  ul.gallery li {
    width: 22.699387%; /* 222px */
    margin: 0 3.0674847% 3.0674847% 0;
    }

  }

@media screen and (max-width: 860px) {

  a.more-items, a.power.middle, .card-action p.current, input[type="submit"].power.middle {width: 50%;}
  }


@media only screen and (min-width: 768px) and (max-width: 1024px)  {
  section.total .advice div {width: 29%;}
 }



/*iPad and medium width styles*/
@media only screen and (max-width: 768px) {

  body {background: url("../images/top-fade.png") repeat-x scroll 0 30px #F6F6F4;}
  header[role="banner"] h2 {}

  header[role="banner"] hgroup {position: relative; width: 100%; top: 0; left: 0; margin: 1.5em 0 1em 0; overflow: hidden;}
  header[role="banner"] form {position: relative; top: 0; left: 0; clear: both;}
  header[role="banner"] {margin-bottom: 2em; overflow: visible;}

  section.global {height: auto; overflow: hidden}
  section.global ul {float: none; margin-bottom: 0.5em;}
  section.global ul.user-info {position: relative; left: 0;}
  section.global details, section.global .basket-info  {top: 3.8em;}
  section.global details summary a, section.global .basket-info div.summary a {background: none; padding: 0; top: -5.75em;}
  section.global div.summary a:hover strong, .basket-info:hover div.summary a strong {background: #3c3c3c;}

  nav[role="navigation"] ul {}
  nav[role="navigation"] ul a#index {display: none;}
  .sections ul {display: none;}

  .home ul.gallery li {width: 30.379124%; margin: 0 4.313146% 4.313146% 0;}
  .home ul.gallery li:nth-child(3n) {margin-right: 0;}
  a.more-items, a.power.middle, .card-action p.current, input[type="submit"].power.middle {width: 50%;} ul.item-list .item-meta {margin: 0;}
  .home section[role="main"] {clear: both;}

  .two-column .unavailable ul.gallery-strip, header p.short-note {display: block; float: none; width: auto; clear: both;}
  .two-column section.unavailable header {float: none; width: auto; margin-bottom: 1em;}
  .two-column ul.gallery li {width: 47.01152%; margin: 0 5.9760956% 5.9760956% 0} /* 502 */
  .two-column ul.gallery li a {}

  .two-column ul.gallery li:nth-child(3n),
  /*ul.gallery li:nth-child(4n),*/
  ul.gallery.popular li:nth-child(3n),
  .two-column ul.gallery.favourite li:nth-child(3n),
  .two-column ul.gallery li:nth-child(3n),
  .two-column .unavailable ul.gallery li:nth-child(4n)
   {margin-right:5.9760956%}

   .two-column ul.gallery li:nth-child(2n), .two-column ul.gallery li:nth-child(6n) {margin-right: 0;}



  .image-select li {width: auto;}
  .image-select li:nth-child(8n) {margin-right: 2%;}
  .image-select li:nth-child(5n){margin-right: 0;}

  .facet-header a {clear: left; display: block; margin: 0.167em 0; padding-left: 0; float: none;}

  .sort-list p {float: none; margin: 0;}

  .item aside article header {padding: 1.5em;}
  .item ul.slide-controls {margin: 0 0 0.5em 0; float: none; clear: both;}

  .shop .biog div a:first-child {display: none;}
  .shop .biog div {padding: 1.5em;}

  .benefits dl {width: 100%;}
  .benefits dt, .benefits dd {display: block; width: 100%; border: none; }
  .benefits dd {margin-bottom: 1em;}
  .benefits dl dd:nth-child(4n), .benefits dl dt:nth-of-type(2n+4), .benefits dl dt:nth-of-type(2) {background-color: transparent;}

    td ul.action li, td ul.action li:first-child {display: block; margin: 0 0 0.5em 0}

    /* adjusting the promotional slider */
    .slidecontrols a {margin-top: -7em;}
    .slider .slide {margin-left: 0.28071%}

    .two-column .slidecontrols a {margin-top: -4em;}
  .two-column .slidecontrols a.previous {margin-top: -7.5em;}

  .adr {width: 45%; margin-bottom: 2em;}
  .shipping-address li:nth-child(even) {margin-right: 0;}
  .shipping-address li:nth-child(3n) {margin-right: 4.132234%;}

  .basket td.item-image, .basket td.item-description {float: none;}
  .message, .message.warning, message.holiday {background-image: none; padding-left: 1em;}

    footer .networks .newsletter, footer .networks .newsletter form {display: block; float: none; margin-bottom: 1em;}
  .networks li:nth-child(2) {margin-left: 0;}

  section.chevron {width: auto; text-align: left; padding: 1em; left: auto; height: auto; overflow: hidden;}
  section.chevron div {text-align: left; width: 100%; overflow: hidden;}
  .chevron:before, .chevron:after {display: none;}

  section.chevron {min-height: inherit;}
  .home .activity .chevron ul.gallery-strip {margin: 0;}

  header p.short-note {text-align: left; margin: 0;}
  .shop .shop-info header {border: none; width: 100%; padding-bottom: 0;}
  .shop-share ul.x-list li {display: block; margin: 0 0 0.5em 0; width: 100%;}

  .card {}
  .card-center {width: 44%;}
  .item aside .share li, section.total .advice div {float: none; margin: 0 0 0.5em 0; width: auto;}
  div.button-choice {width: 80%;}

  section.christmas-feature div {width: 15%;}

  }


/*Just iPhone*/
@media only screen and (max-width: 480px) {

  body {background: url("../images/top-fade.png") repeat-x scroll 0 51px #F6F6F4;}

  section.global {height: auto; overflow: hidden}
  section.global ul {float: none; margin-bottom: 0.5em;}
  section.global ul.user-info, section.global details, section.global .basket-info {position: relative; left: 0;}
  section.global .basket-info div.summary a {background: none; padding: 0; position: relative; top: 0; left: 0; text-align: left; display: inline-block; }
  section.global div.summary a:hover, .basket-info:hover div.summary a {background: #0f0f0f; color: #fcfcfc}
  section.global div.summary a:hover strong, .basket-info:hover div.summary a strong {background: #3c3c3c;}
  section.global .basket-info {top: 0;}

  header[role="banner"] hgroup {position: relative; width: 100%; top: 0; left: 0; margin: 1.5em 0 1em 0; overflow: hidden;}
  header[role="banner"] hgroup h2 {font-size: 1.25em; margin-top: 1.5em;}
  header[role="banner"] form {position: relative; top: 0; left: 0; clear: both;}

  .ie8 header[role="banner"] form {margin-bottom: 2em;}

  header[role="banner"] {margin-bottom: 2em; overflow: visible;}

  .sections h1 {margin-left: 0px; width: 99.5%;}
  input[type="submit"] {-webkit-appearance:none; -webkit-border-radius:0px;}
  input[type="search"] {-moz-appearance:none; -webkit-appearance:none; -webkit-border-radius:0px;}
  /*form[role="search"] div {width: 23em;}*/

  /* home page */
  .home ul.gallery li {width: 48%; margin: 0 4% 4% 0; height: 22.5em;}
  .home ul.gallery li:nth-child(2n) {margin-right: 0;}
  .home ul.gallery li:nth-child(3n) {margin-right: 4%;}
  .home ul.gallery li:nth-child(even) {margin-right: 0;} /* test */

  .home .featured header .decorate {display: none;}
  section.featured header {overflow: hidden;}
  .home section header a {display: block; float: none; margin: 0;}
  footer section {width: 50%;}
  /*.home section header h2,*/ .account section header h2 {text-align: left;}
  .home section header.featured-collection h2 {width: 100%; }
  .home section header .pinterest-promo {position: relative; display: block; right: auto; top: auto;}
  .home section header a.shop-name {display: inline-block;}
  .home section header .pinterest-promo a {margin-top: 0;}
  .home section header .pinterest-promo a.pinterest-theme {}

  .promote {width: auto;}
  .promote li, .promote li:first-child {display: block; float: none; margin: 0 0 1em 0; width: 100%;}
  .promote li:last-child {margin: 0;}
  .promote li a img {width: 100%;}

  body.two-column section[role="main"], section.sign-in, section.new-customer {clear: both; float: none; width: 100%;}
  a.more-items, a.power.middle, .card-action p.current {width: 50%;} ul.item-list .item-meta {margin: 0;}

  section.sign-in {border: none; padding: 0;}
  section.new-customer span {display: none;}

  section[role="navigation"], .shop aside  {width: 100%;}
  ul.recently-viewed li {width: 21%;}

  .two-column ul.gallery.popular li {height: 19.167em;} /*fixing the height of the popular category sections to 230px */
  .two-column ul.gallery li:nth-child(6n) {margin-right: 0;}
  .two-column ul.gallery li {height: 24em;}

  .image-select li {margin: 0 4% 4% 0; width: 30.5%;}
  .image-select li:nth-child(8n), .image-select li:nth-child(5n) {margin-right: 4%;}
  .image-select li:nth-child(3n){margin-right: 0;}

  section[role="navigation"] ul li, .shop aside ul li {display: inline-block; margin-right: 0.5em; white-space: nowrap;}
  .shop aside ul.recently-viewed li {margin-right: 1em;}

  footer section {width: 45%; margin: 0 5% 1em 0;}
  footer section:nth-child(2n) {margin-right: 0;}
  footer section:nth-child(5) {clear: both; width: 100%; border-top: 1px solid #404041; padding-top: 2em; margin-top: 1em;}

  footer ul.networks {text-align: left;}
  footer ul.networks li:nth-child(3) {margin-left: 0;}
  footer ul.networks li {float: left; margin-bottom: 0.5em;}

  /* item page */
  body.two-column.item section[role="main"] {float: none; width: 100%; margin-bottom: 1em}
  .item aside, .selling-intro div {float: none; width: 100%; margin: 0;} 
  .item section.mobile-options {display: block;}
  .item section.mobile-options {

  }
  .buy-item button {margin-top: 2px; font-size: 1.1em;}
  .item aside article header {padding: 0;}
  .unavailable span {top: 3em;}

  .item aside article header {padding: 1.5em;}
  .item aside article header h4 + a {width: 22.2222%; float: right; position: relative; margin: 0 2% 0 0; top: -1.5em;}

  /*selling page */
  ul.gallery.selling li {height: auto;}
  ul.brands li {width: 80px;}
  .selling .partner div, .selling .partner div:last-child {width: 100%; margin-bottom: 1em;}
  .selling-intro div.card {width: 90%; margin-bottom: 2em; border-radius: 8px;}


  .selling section[role="main"] h1 {font-size: 3em;}

  /*messages */
  .message {background-image: none; padding-left: 1.5em;}


  /*promotional slider*/
  .slidewrap .slider {margin-bottom: 0;}
  .slidewrap .slider {text-transform: lowercase;} /* Here for JS */
  .slidewrap .slider li a, .two-column .slidewrap .slider li a {}
  .slidewrap .slider li {width: 9.4%; margin-left: 0.455%}
  /* reset the slide controls to remove the arrows from side */

  .slidecontrols {background: white; height: 40px;}
  .slidecontrols a, .slidecontrols a.next, .slidecontrols a.previous, .two-column .slide-controls a, .two-column .slidecontrols a.previous {margin: 0; left: 42%;}

  .slidecontrols a.next {left: 52%;}
  .two-column .slidewrap .slide {width: ; margin-left: 0.43%;}

  /*
  .slidecontrols {display: none;}
  ol.carousel-tabs {display: block;}
  */

  .overlay {width: 300px;}
  .selling h1.feature-heading {font-size: 3em; clear: both;}
  .selling .upgrade-message.card p span.left {text-align: left;}
  .selling .upgrade-message.card p span.right {width: 30%;}
  .selling .upgrade-message.card span.badge {top: 0.5em;}

  .item aside .share li {float: left; margin: 0 1em 0 0; word-break: 80px;}

  div.button-choice {width: 100%;}
  div.button-choice input, div.button-choice input:last-child {float: none; margin: 0 0 4em 0;}
  div.button-choice span.or {float: none; left: 0;}

  section.christmas-feature {padding: 40px 0;}

  section.christmas-feature h1 {margin: 0 auto; display: block; float: none; clear: both;}
  section.christmas-feature div {float: none; margin: 1em auto; width: 50%;}

  .selling header:first-child p {width: 100%; line-height: 1.4;}

  }


@media only screen and (min-width: 1120px) {
  section.christmas-feature div {width: 20%;}

}

/* Hide popup-only content in main pages. Overridden by popup.css for popup content */
.popup-only
{
  display: none;
}

/* Print formatting & overrides. Attention for the item page.
  * note: inlined to avoid required HTTP connection www.phpied.com/delay-loading-your-print-css/
*/

/* hide print-only content on screen */
.print-only { display: none; }

@media print {
  /*first some general resets */
  * { background: transparent !important; color: #444 !important; text-shadow: none; padding: 0; font-size: 75%;}
  a, a:visited {color: #444 !important;}

  pre, blockquote {border: 1px solid #999; page-break-inside: avoid;}
  thead {display: table-header-group;} /* css-discuss.incutio.com/wiki/Printing_Tables */
  tr, img {page-break-inside: avoid;}

  @page {margin: 0.5cm;}
  p, h2, h3 {orphans: 3; widows: 3;}
  h2, h3, h4 {page-break-after: avoid; font-weight: bold;}

  abbr[title]:after {content: " (" attr(title) ")";}


  /* show print-only content on print */
  .print-only { display: block; }


  /* kill floats on article body */
  section[role="main"] {
    float: none;
    width: 85%;
    margin-left: auto;
    margin-right: auto;
  }
  
  body.two-column section[role="main"], header {float: none; width: auto;}

  header[role="banner"] hgroup {position: relative; top: 0; left: 0; width: 100%;}
  header[role="banner"] h1 {float: none; font-size: 3em; margin: 0; font-weight: bold;}
  header[role="banner"] h2 {float: none; font-size: 1em; margin: 0; text-transform: none;}
  header[role="banner"] h1 a {background: none; text-indent: 0;}
  .item aside a {padding: 0;}
  .item section.unavailable header {margin-left: 0;}

  .buyer-info div, .seller-info div, .buyer-info, .seller-info {border: none; padding: 0; background: transparent;}

  /* hide elements that are unnecessary to print experience */
  nav[role="navigation"], section.global, form[role="search"], footer, div.menu, div.your-account, .no-print, header[role="banner"] h1 a span, #banner .container > div, #banner .container > nav, #banner .container > form {display: none !important;}

  #banner {
      border: none;
      margin-top: 2em;
  }

  section[role="main"] header,
  section[role="main"] header h1 {
    position: relative;
    left: 0;
    float: left;
    width: 100%;

  }

}

/* DOUG ADDED THIS FOR ADMIN FEES PAGES */
tr.to-refund {
  background-color: #f6cece;
}

table.fees {
  width: 70%;
}

/* category-and-subcategories */
div.category-and-subcategories ul.subcategories {
  display: none;
}
div.category-and-subcategories h4 {
  margin-bottom: 0.5em;
}
div.category-and-subcategories h4 a {
  display: inline-block;
  vertical-align: middle;
}
div.category-and-subcategories h4 a.expand-contract {
  margin: 0 0 0 3px;
  width: 8px;
  height: 8px;
  background: #f6f6f4 url(../images/right-arrow.png) no-repeat 50% 50%;
  text-indent: -1000em;
}
div.category-and-subcategories.contracted h4 a.expand-contract {background-image: url(../images/down-arrow.png);}
div.category-and-subcategories.expanded h4 a.expand-contract {background-image: url(../images/up-arrow.png);}
/* /category-and-subcategories */



.feature-link {
  display: block;
  position: relative;
  margin: 2em 0;
}

.feature-link a {
  display: block;
  background-size: cover;
  background-repeat: no-repeat;
  text-align: center;
  padding: 50px 0;
  border: 1px solid rgba(205, 205, 205, 0.43);
  background-position: 50%;
}

.feature-link a:hover .feature-text {
  background-color: rgba(64, 131, 169, 0.85);
}

.feature-link a:hover .feature-text h3, .feature-link a:hover .feature-text span {
  color: white;
}

.feature-link.christmas a {
  background-image: url('/images/xmas-gift.jpg');
}

.feature-link .feature-text {
  display: block;
  padding: 10px 5px;
  background: rgba(255,255,255, 0.69);
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.feature-text h3 {
  font-family: Lora, Georgia, sans-serif;
  font-size: 1.8em;
  margin-bottom: 0.7em;
}

.feature-text span {
  color: #404040;
}








ul.trad { list-style-type: circle; }
ul.trad li { margin-left: 1em; }

/* trial */
section.global li a.trial {
  color: #f37200;
}

/* favourited-item-flash */
div.favourited-item-flash {
  display: inline-block;
  border: 1px solid #fbeed5;
  padding: 10px;
  background: #fcf8e3;
  font-size: 1.1em;
  }

div.favourited-item-flash div.text,
div.favourited-item-flash a.thumb {
  display: inline-block;
  vertical-align: middle;
  }
  
div.favourited-item-flash a.thumb {margin-right: 10px;}
  
div.favourited-item-flash a.thumb img {
  display: block;
  border: 8px solid #fff;
  }
  
div.favourited-item-flash a.thumb:hover img,
div.favourited-item-flash a.thumb:focus img {opacity: 0.9;}

div.favourited-item-flash h3 {
  margin: 0 0 0.5em;
  line-height: 1.2;
  }
  
div.favourited-item-flash ul {
  margin: 0;
  line-height: 1.3;
  list-style: none;
  }
/* /favourited-item-flash */

/* begin admin themes */
form#delete-themes {
  display: none;
}
th#delete-button th.delete-theme {
  text-align: center;
}
th#delete-button span {
  display: inline-block;
  margin-top: 0.5em;
  margin-bottom: 0;
  padding-left: 0.5em;
  padding-right: 0.5em;
  min-width: 2em;
  min-height: 1em;
  background-color: #ddd;
  color: #666;
  border-radius: 3px;
}
th#delete-button span.enabled {
  background-color: red;
  color: white;
}
th#delete-button span.enabled:hover {
  cursor: pointer;
}
td.delete-theme span {
  display: inline-block;
  margin-left: 1.5em;
  background-color: #fcc;
  width: 1.5em;
  text-align: center;
  border-radius: 3px;
  font-weight: bold;
  color: #888;
}
td.delete-theme span:hover {
  cursor: pointer;
}
td.delete-theme span.selected {
  background-color: red;
  color: white;
}
/* end admin themes */

/* begin themes-admin-widget */
#themes-admin-widget table {
  background: #fff;
  border: 1px solid #d5d5d5;
}
#themes-admin-widget table thead {
  background-color: #F4F3F2;
}
#themes-admin-widget table ul {
  list-style: none;
}
#themes-admin-widget table ul li {
  display: inline-block;
  margin-right: 1em;
}
#themes-admin-widget tbody span {
  display: inline-block;
  margin-left: 1.5em;
  width: 16px;
  height: 16px;
  text-align: center;
  border-radius: 3px;
  font-weight: bold;
}
#themes-admin-widget span.activate {
  background: url(../images/checkbox-uncheckable.png) no-repeat;
}
#themes-admin-widget span.activate.can-activate {
  background: url(../images/checkbox-unchecked.png) no-repeat;
}
#themes-admin-widget span.activate.active {
  /* background-color: #cfc; */
  background: url(../images/checkbox-checked.png) no-repeat;
}
#themes-admin-widget span.pending {
  background-color: #ffc;
  color: #888;
  background: url(../images/ajax_loader.gif) no-repeat;
}
#themes-admin-widget span.activate.can-activate:hover,
#themes-admin-widget span.activate.active:hover {
  cursor: pointer;
}
#themes-admin-widget span#delete-button {
  display: inline-block;
  margin-top: 0.5em;
  margin-bottom: 0;
  padding-left: 0.5em;
  padding-right: 0.5em;
  min-width: 2em;
  min-height: 1em;
  background-color: #ddd;
  color: #666;
  border-radius: 3px;
}
#themes-admin-widget span#delete-button.active {
  background-color: red;
  color: white;
}
#themes-admin-widget span#delete-button.active:hover {
  cursor: pointer;
}
#themes-admin-widget span.delete {
  background-color: #fcc;
}
#themes-admin-widget span.delete.selected {
  background-color: #f00;
}
#themes-admin-widget span.delete:hover {
  cursor: pointer;
}
#themes-admin-widget table.delete-pending,
#themes-admin-widget table.delete-pending a,
#themes-admin-widget table.delete-pending span:hover,
#themes-admin-widget table.delete-pending span.pending:hover,
#themes-admin-widget table.delete-pending span.activate:hover,
#themes-admin-widget table.delete-pending span.activate.active:hover,
#themes-admin-widget table.delete-pending span.activate.can-activate:hover,
#themes-admin-widget table.delete-pending span#delete-button:hover,
#themes-admin-widget table.delete-pending span#delete-button.active:hover {
  cursor: wait;
}
#themes-admin-widget table.delete-pending {
  background: #eee;
}
/* end themes-admin-widget */

.gg-banner {
  background-color: #e3ddfb;
  margin-bottom: 1.5em;
}

  .gg-banner .container {
    display: block;
    font-size: 1em;
    margin-top: 1em;
    padding: 1em 0;
    background-repeat: no-repeat;
    background-size: 4em;
    background-position: middle right;
    color: #766ab0;
    font-weight: bold;
    text-transform: uppercase;
  }
  

  .gg-banner .gg-badge {
    position: absolute;
    right: 0;
    bottom: 0;
    height: 5em;
  }

  .gg-link-desk {
    display: none;
  }
  

  @media (min-width: 0px) {
    .gg-banner {
      display: none;
    }

    .gg-badge {
      height: 5em;
      display: block;
    }

    .gg-link-desk {
      position: absolute;
      top: -5em;
      right: 0em;
      text-indent: -999em;
      width: 8em;
      height: 5em;
      display: block;
    }
  }

  @media (min-width: 810px) and (max-width: 964px) {
    
  }

.gg-link-desk {
  background-image: url(../images/gg-badge.png);
  background-size: 98px 62px;
}

/* 404 */


body.error main[role="main"] form {
  margin-bottom: 2em;
}

body.error main[role="main"] form > div {
  width: 100%;
}


body.error main[role="main"] form > div > input:first-of-type {
  outline: none;
  box-shadow: none;
  border: 0;
  height: 4em;
  width: 60%;
  border: 1px solid #ddd;
}
body.error main[role="main"] form > div > input#search-submit {
  height: 4em;
  width: 30%;
  min-width: 6em;
}

ul#i404-options {

}

@media screen and (max-width: 399px) {
  body.error main[role="main"] {
    padding-top: 1.4em;
  }
}

ul#i404-options a {
  display: inline-block;
  margin: 0 0 1em 0;
  height: 3em;
  line-height: 3em;
  color: white;
  font-weight: 500;
  border-radius: 3px;
  padding: 0 1em;
}

ul#i404-options a.homepage-link {
  background: #f15b40;
}
ul#i404-options a.gguide-link {
  background: #8a7dbb;
}
ul#i404-options a.fsellers-link {
  background: #5ac4be;
}

ul#i404-options a.homepage-link:hover,
ul#i404-options a.homepage-link:active {
  background: #D84227;
}

ul#i404-options a.gguide-link:hover,
ul#i404-options a.gguide-link:active {
  background: #7164A2;
}

ul#i404-options a.fsellers-link:hover,
ul#i404-options a.fsellers-link:active {
  background: #41ABA5;
}

@media screen and (min-width: 768px) {
  .error main[role=main] section {
    margin-bottom: 4em;
  }
  body.error main[role="main"] h2 {
    font-size: 2em;
  }
  body.error main[role="main"] p {
    font-size: 1.2em;
    max-width: 380px;
  }
  body.error main[role="main"] form > div {
    width: 180%;
    
  }
  body.error main[role="main"] form > div > input:first-of-type {
    font-size: 1.4em;
  }
  body.error main[role="main"] form > div > input#search-submit {
    font-size: 1.4em;
    width: 10em;
  }

  ul#i404-options ul,
  ul#i404-options li {
    display: inline-block;
  }
  ul#i404-options li {
    margin-right: 1.4em;
  }
  ul#i404-options a {
    font-size: 1.2em;
    height: 3.2em;
  }
}

/* /404 */

img#iview { display: none; }

/* SIMILAR-ITEMS */
#similar-items, #similar-items p, #similar-items div {
  margin: 0;
  padding: 0;
}
#similar-items {
  background-color: white;
  padding: 2em;
  margin-bottom: 2em;
  border-radius: 8px;
}
#similar-items div {
  display: inline-block;
}
#similar-items div.unavailable {
  width: 44%;
  vertical-align: top;
  position: relative;
}
#similar-items div.unavailable img {
  margin-bottom: 1em;
}
#similar-items div.similar {
  width: 55%;
  text-align: right;
}
#similar-items div.similar a:hover {
  opacity: 0.9;
}
#similar-items div.similar li {
  display: inline-table;
  width: 27%;
  padding: 1em;
}
#similar-items div.similar img {
  border-radius: 6px;
}
#similar-items h2 {
  font-size: 2.2em;
  margin-bottom: 1em;
}
#similar-items div.unavailable p {
  font-size: 1.3em;
}
#similar-items div.similar p.see-more a {
  font-size: 1.5em;
  color: #444;
}
@media screen and (max-width: 980px) {
  #similar-items h2 {
    font-size: 2em;
  }
}
@media screen and (max-width: 900px) {
  #similar-items h2 {
    font-size: 1.5em;
  }
  #similar-items div.unavailable {
    width: 25%;
  }
  #similar-items div.similar {
    width: 74%;
  }
}
@media screen and (max-width: 710px) {
  #similar-items h2 {
    font-size: 2em;
    margin-bottom: 0.3em;
  }
  #similar-items div.unavailable {
    width: 100%;
  }
  #similar-items div.unavailable img {
    display: none;
  }
  #similar-items div.unavailable p {
    margin: 0;
  }
  #similar-items div.similar {
    text-align: center;
    width: 100%;
  }
}
@media screen and (max-width: 520px) {
  #similar-items div.similar li {
    display: inline-table;
    width: 40%;
    padding: 1em;
  }
  #similar-items div.similar li:nth-of-type(5), #similar-items div.similar li:nth-of-type(6) {
    display: none;
  }
}
@media screen and (max-width: 440px) {
  #similar-items {
    padding-left: 10px;
    padding-right: 10px;
  }
  #similar-items h2 {
    font-size: 1.5em;
  }
}
@media screen and (max-width: 350px) {
  #similar-items {
    padding-left: 8px;
    padding-right: 8px;
  }
  #similar-items div.similar li {
    padding: 0.5em;
  }
}
/* /SIMILAR-ITEMS */


/* ITEM-NOT-fOUND */

section.item-not-found {
  max-width: 978px;
}
section.item-not-found h1 {
  margin-bottom: 10px;
}
section.item-not-found form {
  margin: 0 auto 0 auto;
  border: solid 1px #d5d5d5;
  background-color: #f0efeb;
  padding: 10px;
  border-radius: 8px;
  text-align: left;
  padding: 1em 3%;
}
section.item-not-found form p {
  font-size: 120%;
  margin: 0;
}
section.item-not-found form p:nth-of-type(2) {
  margin-top: 1em;
}

section.item-not-found form p:nth-of-type(2) input {
  width: 20em;
}
section.item-not-found form p:nth-of-type(2) button {
  margin-top: 4px;
  display: inline-block;
  padding: 8px 10px;
  margin-left: 4px;
  background-color: #047da3;
  border: 0;
  border-radius: 2px;
  color: #fff;
  text-transform: uppercase;
  font-weight: bold;
}
section.item-not-found form p:nth-of-type(2) button:hover {
  background-color: #000;
}
section.item-not-found ul.more-items {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}
section.item-not-found ul.more-items li {
  margin: 8px;
  padding: 16px;
  border-radius: 8px;
  display: inline-block;
  background-color: white;
}
section.item-not-found ul.more-items li:hover {
  opacity: 0.9;
}
section.item-not-found ul.more-items p {
  padding: 0;
  margin: 0;
}
section.item-not-found div.links {
  margin: 1em 0 2em 1em;
}
section.item-not-found div.links p {
  margin: 0 0 0.5em 0;
}
section.item-not-found div.links a {
  display: inline-block;
  background-color: #047da3;
  color: #fff;
  text-transform: uppercase;
  font-weight: bold;
  text-shadow: 0px 1px 0px rgba(0,0,0,0.2);
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 4px;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 110%;
}
section.item-not-found div.links a:hover {
  background-color: #000;
}

/* /ITEM-NOT-FOUND */

/* FEEDBACK */
.Feedback {
  margin-bottom: 2em;
}
.Feedback .rating {
  margin: 1em 0 1em 0;
}
.Feedback h1 {
  margin-bottom: 4px;
}
.Feedback h2 {
  font-family: arial;
  font-weight: bold;
  margin-bottom: 8px;
}
.Feedback p {
  margin: 0;
  display: flex;
}
.Feedback p span:first-of-type {
  font-weight: bold;
  margin-right: 4px;
}
/* /FEEDBACK */