/* PLUGIN-SPECIFIC CSS */
/* SITE CSS */
/* ==========================================================================
	Variables
========================================================================== */
/* ==========================================================================
	Mixins
========================================================================== */
/* CSS3 ELEMENTS
============================== */
/* ================================================================ *\
	#Reset
\* ================================================================ */
* {
  padding: 0;
  margin: 0;
  outline: 0; }

/* ================================================================ *\
	#Base
\* ================================================================ */
article, aside, figcaption, figure, footer, header, main, nav, section {
  display: block; }

html, body {
  height: 100%; }

html {
  overflow-y: scroll;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%; }

body {
  min-width: 320px;
  background: #555;
  font-family: Arial, sans-serif;
  font-size: 14px;
  line-height: 1.5;
  color: #000;
  -webkit-font-smoothing: antialiased; }

a {
  text-decoration: underline; }

a:hover {
  text-decoration: none; }

img {
  border: 0;
  vertical-align: middle; }

strong {
  font-weight: bold; }

small {
  font-size: 80%; }

button, input, select, textarea {
  font-family: inherit;
  font-size: inherit;
  color: inherit;
  -webkit-font-smoothing: antialiased; }

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

button::-moz-focus-inner, input::-moz-focus-inner {
  padding: 0;
  border: 0; }

button {
  overflow: visible; }

textarea {
  overflow: auto;
  resize: none; }

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

th, td {
  padding: 0; }

h1 {
  font-size: 28px;
  line-height: 1.21;
  padding-bottom: 5px; }

h6 {
  font-size: 12px; }

/* ================================================================ *\
	#Helpers
\* ================================================================ */
.alignleft {
  float: left; }

.alignright {
  float: right; }

.hidden {
  display: none;
  visibility: hidden; }

.clearfix:before, .clearfix:after {
  display: table;
  content: ' '; }

.clearfix:after {
  clear: both; }

/* ================================================================ *\
	#Containers
\* ================================================================ */
.wrapper {
  position: relative; }

.shell {
  width: 980px;
  margin: 0 auto; }

/* ================================================================ *\
	#Header
\* ================================================================ */
.header {
  border-top: 10px solid #989898; }
  .header .shell {
    background: #fff;
    height: 38px; }

.header-inner {
  float: right;
  padding-top: 3px;
  padding-right: 140px; }

.nav-utilities ul {
  list-style: none outside none;
  overflow: hidden; }
.nav-utilities li {
  float: left; }
.nav-utilities li + li {
  border-left: 1px solid #000; }
.nav-utilities a {
  display: block;
  padding: 6px 8px;
  text-decoration: none;
  color: #000;
  font-size: 12px;
  font-weight: bold;
  -webkit-transition: background 0.3s linear;
  -moz-transition: background 0.3s linear;
  -o-transition: background 0.3s linear;
  transition: background 0.3s linear; }
  .nav-utilities a:hover {
    background: #ebedf5; }
@media (min-width: 768px) {
  .nav-utilities .mobile {
    display: none !important; } }

/* ================================================================ *\
	#Intro
\* ================================================================ */
.intro {
  background: url(../img/temp/intro.jpg) no-repeat center 0;
  height: 200px; }

.intro-content {
  color: #fff;
  font-size: 19px;
  padding: 27px 0 0 42px; }
  .intro-content h1 {
    padding-bottom: 0;
    line-height: 1; }
  .intro-content p {
    padding-bottom: 13px; }

.logo {
  width: 104px;
  height: 86px;
  background: url(../img/sprite.png) no-repeat 0 0;
  display: block;
  text-indent: 100%;
  overflow: hidden;
  white-space: nowrap; }

.cart {
  position: absolute;
  top: 110px;
  right: 50%;
  margin-right: -480px; }

.cart-inner {
  border-radius: 7px;
  overflow: hidden; }

.cart a {
  color: #000; }

.cart-head, .cart-body {
  padding: 0 9px 0 46px; }

.cart-head {
  background: rgba(118, 118, 118, 0.9);
  font-size: 12px;
  padding-top: 3px;
  padding-bottom: 2px; }

.cart-head h6 a {
  margin-left: 10px; }

.cart-body {
  background: rgba(228, 228, 228, 0.9);
  font-size: 11px;
  padding-bottom: 5px; }

.cart .ico-cart {
  position: absolute;
  top: 7px;
  left: 4px; }

/* ================================================================ *\
	#Nav
\* ================================================================ */
.nav {
  background: #767676; }

.nav ul {
  list-style: none outside none; }

.nav li {
  position: relative; }

.nav a {
  display: block;
  color: #fff;
  font-size: 12px;
  text-decoration: none; }

.nav > ul {
  height: 30px; }

.nav > ul > li {
  float: left;
  border-right: 1px solid #000; }

.nav > ul > li > a {
  padding: 6px 7px;
  font-weight: bold; }

.nav > ul > li:hover > a {
  background: #555; }

.nav > ul > .has-dropdown:hover + li {
  box-shadow: inset 2px 0 2px rgba(0, 0, 0, 0.3); }

.nav ul ul {
  top: 30px;
  left: 0;
  background: #555;
  opacity: 0;
  visibility: hidden;
  position: absolute;
  width: 200px;
  box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.3);
  z-index: 1; }

.ipad .nav ul ul {
  -webkit-transition: all 0.3s linear;
  -moz-transition: all 0.3s linear;
  -o-transition: all 0.3s linear;
  transition: all 0.3s linear;
  /*
	-webkit-transition: opacity .3s linear, visibility .3s linear; 
	   -moz-transition: opacity .3s linear, visibility .3s linear; 
	        transition: opacity .3s linear, visibility .3s linear; 
	*/
  -webkit-transform: translateZ(0px); }

.nav ul ul a {
  padding: 6px 30px 6px 11px;
  line-height: 1.17; }

.nav ul ul ul {
  top: 0;
  left: 100%;
  background: #444; }

.nav ul ul ul ul {
  background: #333; }

.has-dropdown.active > ul, .nav li:hover > ul, .nav li:active > ul, .nav li:hover > ul {
  opacity: 1;
  visibility: visible;
  backface-visibility: hidden; }

.nav > ul > li > ul > li:hover a {
  background: #444; }

.nav > ul > li > ul > li > ul > li:hover a {
  background: #333; }

.nav > ul > li > ul > li > ul > li > ul a {
  padding: 10px 30px 10px 11px; }

.nav > ul > li > ul > li > ul > li > ul a:before {
  display: none; }

.nav ul ul li.has-dropdown > a:before {
  position: absolute;
  top: 50%;
  right: 15px;
  content: '';
  width: 8px;
  height: 12px;
  margin-top: -6px;
  background: url(../img/sprite.png) no-repeat -119px -74px; }

.nav ul ul li.has-dropdown:hover > a:before {
  opacity: 0; }

/* #Css3 transitions, transforms and animations */
.nav ul ul li.has-dropdown > a:before {
  -webkit-transition: all 0.3s linear;
  -moz-transition: all 0.3s linear;
  -o-transition: all 0.3s linear;
  transition: all 0.3s linear; }

.nav-moved + .nav-moved {
  display: none; }

/* ================================================================ *\
	#Main
\* ================================================================ */
.main {
  padding: 20px 30px;
  background: #fff; }

.breadcrumbs {
  font-size: 12px;
  color: #989898;
  margin-bottom: 10px; }
  .breadcrumbs a {
    color: #555;
    text-decoration: none; }
    .breadcrumbs a:hover {
      color: #9a281e; }

.typography:before, .typography:after {
  display: table;
  content: ' '; }
.typography:after {
  clear: both; }

.products {
  float: left;
  width: 75%;
  padding-right: 20px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

.list-products {
  list-style: none outside none;
  font-size: 0;
  line-height: 0;
  margin: -8px -10px; }
  .list-products li {
    display: inline-block;
    vertical-align: top;
    padding: 10px;
    width: 33%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; }
  .list-products a {
    display: block;
    font-size: 12px;
    line-height: 1.5;
    background: #ebedf5;
    min-height: 88px;
    text-align: center;
    text-decoration: none;
    color: #000;
    padding: 8px 10px 4px;
    -webkit-transition: background 0.3s linear;
    -moz-transition: background 0.3s linear;
    -o-transition: background 0.3s linear;
    transition: background 0.3s linear; }
    .list-products a:hover {
      background: #d2d7ed; }
    .list-products a strong {
      color: #00f;
      text-decoration: underline;
      text-transform: uppercase;
      display: block; }

.widget-news {
  float: right;
  width: 25%;
  padding-top: 2px; }
  .widget-news .widget-head {
    background: #767676;
    color: #fff;
    text-transform: uppercase;
    padding: 7px 12px 4px; }
  .widget-news .widget-body {
    padding: 11px 9px 9px;
    border: 1px solid #eeeeee;
    min-height: 170px; }
  .widget-news .widget-actions {
    padding-top: 11px; }
  .widget-news ol {
    list-style: none outside none;
    line-height: 1.1;
    font-size: 12px; }
  .widget-news li {
    padding-left: 2px; }
    .widget-news li + li {
      padding-top: 11px; }
    .widget-news li a {
      color: #00f;
      text-decoration: none; }
      .widget-news li a:hover {
        text-decoration: underline; }

/* ================================================================ *\
	#Footer
\* ================================================================ */
.footer {
  text-align: center;
  color: #fff;
  padding-top: 17px; }
  .footer a {
    color: #fff;
    text-decoration: none; }
  .footer p {
    padding-bottom: 0; }
  .footer .shell {
    position: relative; }
  .footer .socials {
    list-style-type: none;
    margin: 0;
    padding: 0;
    position: absolute;
    right: 0;
    top: 0; }
    .footer .socials li {
      display: inline-block;
      vertical-align: top; }
      .footer .socials li a {
        display: block;
        width: 32px;
        height: 32px;
        overflow: hidden;
        text-indent: -999999em; }
        .footer .socials li a.facebook {
          background: url(../img/icon-facebook.png) no-repeat 0 0; }
        .footer .socials li a.linkedin {
          background: url(../img/icon-linkedin.png) no-repeat 0 0; }
        .footer .socials li a.twitter {
          background: url(../img/icon-twitter.png) no-repeat 0 0; }
    @media (max-width: 767px) {
      .footer .socials {
        position: relative;
        margin: 10px auto;
        text-align: center; } }

.footer-nav {
  padding-bottom: 13px; }
  .footer-nav p {
    padding-bottom: 0; }
  .footer-nav ul {
    list-style: none outside none;
    font-size: 0;
    line-height: 0;
    text-align: center; }
  .footer-nav li {
    display: inline-block;
    vertical-align: middle;
    font-size: 14px;
    line-height: 13px;
    height: 13px; }
    .footer-nav li + li {
      padding-left: 5px;
      border-left: 1px solid #fff;
      margin-left: 5px; }
  .footer-nav a:hover {
    text-decoration: underline; }

.footer-contacts span {
  padding: 0 5px; }

@media (max-width: 767px) {
  .footer-nav {
    padding-bottom: 17px; }
    .footer-nav li {
      margin-bottom: 6px; }
    .footer-nav a {
      font-size: 12px; }
  .footer-contacts {
    padding: 0 20px; }
  .footer {
    padding: 14px 0 5px; } }

/* ================================================================ *\
	#Button
\* ================================================================ */
.btn {
  display: inline-block;
  vertical-align: middle;
  padding: 5px 9px 3px;
  color: #41443f;
  font-size: 12px;
  text-transform: uppercase;
  font-family: 'PT Sans';
  text-decoration: none;
  border: 1px solid #cccccc;
  font-weight: bold; }

.btn {
  background: #fcfcfc;
  background: -moz-linear-gradient(top, #fcfcfc 0%, #e3e3e3 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fcfcfc), color-stop(100%, #e3e3e3));
  background: -webkit-linear-gradient(top, #fcfcfc 0%, #e3e3e3 100%);
  background: -o-linear-gradient(top, #fcfcfc 0%, #e3e3e3 100%);
  background: -ms-linear-gradient(top, #fcfcfc 0%, #e3e3e3 100%);
  background: linear-gradient(to bottom, #fcfcfc 0%, #e3e3e3 100%); }

.btn:hover {
  text-decoration: none; }

.btn:hover {
  background: #e3e3e3;
  background: -moz-linear-gradient(top, #e3e3e3 0%, #fcfcfc 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #e3e3e3), color-stop(100%, #fcfcfc));
  background: -webkit-linear-gradient(top, #e3e3e3 0%, #fcfcfc 100%);
  background: -o-linear-gradient(top, #e3e3e3 0%, #fcfcfc 100%);
  background: -ms-linear-gradient(top, #e3e3e3 0%, #fcfcfc 100%);
  background: linear-gradient(to bottom, #e3e3e3 0%, #fcfcfc 100%); }

.btn .ico-arrow {
  margin: -1px 3px 0 6px; }

/* ================================================================ *\
	#Icons
\* ================================================================ */
[class^="ico-"] {
  display: inline-block;
  vertical-align: middle;
  background-image: url(../img/sprite.png);
  background-repeat: no-repeat; }

.ico-arrow {
  width: 7px;
  height: 12px;
  background-position: -108px -74px; }

.ico-cart {
  width: 40px;
  height: 34px;
  background-position: -108px 0px; }

/* ================================================================ *\
	#Products
\* ================================================================ */
table.product-list a {
  display: block;
  color: #000;
  text-decoration: none; }
table.product-list .name {
  font-weight: bold;
  width: 35%;
  word-break: break-all; }
table.product-list .desc {
  width: 50%; }
table.product-list .price {
  width: 15%; }
table.product-list tr:hover, table.product-list tr:nth-child(odd):hover {
  background-color: rgba(0, 74, 142, 0.2); }

/* ================================================================ *\
	SIDE NAV
\* ================================================================ */
.typography .widget-nav {
  float: right;
  width: 250px;
  margin: 0 0 20px 20px;
  border: 1px solid #C7C7C7;
  background: #F0F0F0; }
  .typography .widget-nav .widgettitle {
    padding: 10px 0 9px 12px;
    background: #555;
    color: #fff;
    font-size: 18px;
    line-height: 1.05;
    font-weight: 600;
    text-transform: uppercase; }
    .typography .widget-nav .widgettitle a {
      color: #FFF;
      margin-left: 20px; }
  .typography .widget-nav ul {
    list-style: none outside none;
    padding: 0;
    margin: 0; }
    .typography .widget-nav ul li {
      margin: 0; }
  .typography .widget-nav a {
    color: #004a8e;
    font-size: 12px;
    display: block;
    position: relative;
    text-decoration: none; }
  .typography .widget-nav .current > a, .typography .widget-nav a:hover {
    text-decoration: none;
    color: #7f1d1f; }
  .typography .widget-nav > ul {
    padding-top: 1px; }
    .typography .widget-nav > ul > li {
      padding: 5px 10px; }
      .typography .widget-nav > ul > li + li {
        border-top: 1px solid #eeeeee; }
      .typography .widget-nav > ul > li > a {
        font-weight: 600; }
    .typography .widget-nav > ul ul {
      padding: 5px 0 5px 15px; }
      .typography .widget-nav > ul ul li + li {
        padding-top: 4px; }
  .typography .widget-nav .icon-arrow {
    position: absolute;
    display: block;
    right: 0;
    top: 50%;
    width: 0;
    height: 0;
    margin-top: -4px;
    border-left: 6px solid #004a8e;
    border-right: none;
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent; }
  .typography .widget-nav .section > a .icon-arrow, .typography .widget-nav .current > a .icon-arrow {
    border-top: 6px solid #004a8e;
    border-bottom: none;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent; }
  @media (max-width: 767px) {
    .typography .widget-nav {
      display: none; } }

.collapsible {
  background: #555;
  color: #FFF;
  padding: 2px 10px;
  margin-bottom: 1px;
  cursor: pointer;
  position: relative;
  font-size: 16px;
  line-height: 24px; }
  .collapsible:hover {
    background: #004a8e; }
  .collapsible:after {
    display: block;
    position: absolute;
    right: 10px;
    top: 2px;
    font-size: 24px;
    line-height: 24px;
    font-weight: bold; }
  .collapsible.collapse-close:after {
    content: '+'; }
  .collapsible.collapse-open:after {
    content: '-'; }
  .collapsible + .container {
    padding: 10px; }

.tutorial + .typography {
  margin-top: 10px;
  border-top: 1px solid #004a8e;
  padding-top: 10px; }

/* ================================================================ *\
	FUN WITH COLUMNS!
\* ================================================================ */
.cols > .col {
  display: inline-block;
  vertical-align: top;
  margin-right: -4px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }
.cols.cols1 > .col {
  width: 100%; }
.cols.cols2 > .col {
  width: 50%; }
  .cols.cols2 > .col:nth-child(1) {
    padding-right: 10px; }
  .cols.cols2 > .col:nth-child(2) {
    padding-left: 10px; }

@media (max-width: 767px) {
  .base-form.order .cols > .col {
    display: block;
    margin-right: 0; }
  .base-form.order .cols.cols2 > .col {
    width: 100%; }
    .base-form.order .cols.cols2 > .col:nth-child(1) {
      padding-right: 0; }
    .base-form.order .cols.cols2 > .col:nth-child(2) {
      padding-left: 0; } }

/* ==========================================================================
	Forms
========================================================================== */
.base-form fieldset {
  border: none;
  padding: 0;
  margin: 0; }
.base-form input {
  padding: 5px 10px; }
.base-form.order fieldset {
  border: 1px solid #CCC;
  background: #EFEFEF;
  padding: 10px;
  position: relative;
  margin-bottom: 20px; }
  .base-form.order fieldset legend {
    background: #CCC;
    padding: 5px 20px 5px 10px; }
  .base-form.order fieldset .field {
    display: block;
    margin: 0 0 5px; }
    .base-form.order fieldset .field:before, .base-form.order fieldset .field:after {
      display: table;
      content: ' '; }
    .base-form.order fieldset .field:after {
      clear: both; }
.base-form.order input {
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }
  .base-form.order input.readonly {
    background: transparent;
    border: none;
    text-align: right;
    padding: 0;
    float: right; }
.base-form.order .styled-table {
  width: 100%; }
  .base-form.order .styled-table th, .base-form.order .styled-table td {
    padding: 5px 10px;
    text-align: left;
    line-height: 30px; }
    .base-form.order .styled-table th.price, .base-form.order .styled-table th.amount, .base-form.order .styled-table td.price, .base-form.order .styled-table td.amount {
      text-align: right; }
  .base-form.order .styled-table tfoot input.readonly {
    width: auto; }
.base-form .actions {
  text-align: center; }
  .base-form .actions button {
    height: 28px; }
.base-form .alert {
  border: 1px solid #9a281e;
  padding: 10px;
  background: rgba(154, 40, 30, 0.1);
  margin: 10px 0 0; }

/* ==========================================================================
	PRODUCT DETAIL
========================================================================== */
#addToCart label {
  font-weight: bold;
  display: inline-block;
  vertical-align: middle; }
  #addToCart label + select {
    display: inline-block;
    vertical-align: middle; }
#addToCart .cost {
  margin: 20px 0; }

/* ==========================================================================
	SILVERSTRIPE SEARCH FORM
========================================================================== */
.search {
  /* non silverstripe positioning */
  position: absolute;
  top: 15px;
  left: 50%;
  margin-left: 356px; }
  @media (max-width: 979px) {
    .search {
      margin: 0;
      right: 5px;
      left: auto; } }
  @media (max-width: 767px) {
    .search {
      position: relative;
      top: auto;
      left: auto;
      right: auto;
      margin-top: 9px;
      padding: 10px; } }

#SearchForm_SearchForm fieldset {
  border: none; }
  #SearchForm_SearchForm fieldset #Search input {
    width: 89px;
    height: 17px;
    padding: 4px 30px 5px 8px;
    border: 1px solid #cccccc;
    background: #e4e4e4;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    -webkit-appearance: none;
    border-radius: 0;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box; }
    #SearchForm_SearchForm fieldset #Search input::-webkit-input-placeholder {
      opacity: 1;
      color: #000; }
    #SearchForm_SearchForm fieldset #Search input:-moz-placeholder {
      opacity: 1;
      color: #000; }
    #SearchForm_SearchForm fieldset #Search input::-moz-placeholder {
      opacity: 1;
      color: #000; }
    #SearchForm_SearchForm fieldset #Search input:-ms-input-placeholder {
      opacity: 1;
      color: #000; }
  #SearchForm_SearchForm fieldset .action {
    position: absolute;
    top: 3px;
    right: 5px;
    width: 20px;
    height: 20px;
    background: url(../img/sprite.png) no-repeat 0px -90px;
    font-size: 0;
    line-height: 0;
    border: 0; }
@media (max-width: 767px) {
  #SearchForm_SearchForm fieldset #Search input {
    border-width: 2px;
    width: 100%;
    height: 28px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; }
  #SearchForm_SearchForm fieldset .action {
    top: 13px;
    right: 15px; } }

/* ==========================================================================
	#Form Elements
========================================================================== */
.typography form ::-webkit-input-placeholder {
  color: #004a8e;
  opacity: 1; }
.typography form :-moz-placeholder {
  color: #004a8e;
  opacity: 1; }
.typography form ::-moz-placeholder {
  color: #004a8e;
  opacity: 1; }
.typography form :-ms-input-placeholder {
  color: #004a8e;
  opacity: 1; }
.typography form input, .typography form textarea, .typography form select {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  line-height: 20px;
  color: #004a8e;
  height: 30px;
  display: block;
  padding: 5px 15px;
  border: 1px solid #004a8e;
  background-color: #fff;
  border-radius: 0;
  box-shadow: none; }
.typography form select {
  font-family: Tahoma, Verdana, Helvetica, Arial, sans-serif; }
.typography form textarea {
  height: 80px;
  resize: none;
  overflow: auto;
  -webkit-overflow-scrolling: touch; }
.typography form input[type="hidden"] {
  display: none; }
.typography form input[type="radio"], .typography form input[type="checkbox"] {
  width: auto;
  height: auto;
  padding: 0;
  border: 0;
  display: inline-block; }
.typography form input, .typography form textarea, .typography form a[href^="tel"] {
  -webkit-appearance: none;
  -moz-appearance: none; }
.typography form input[type="checkbox"] {
  -webkit-appearance: checkbox;
  -moz-appearance: checkbox; }
.typography form input[type="radio"] {
  -webkit-appearance: radio;
  -moz-appearance: radio; }
.typography form fieldset {
  border: none;
  padding: 0;
  margin: 0; }
.typography form .field {
  margin-bottom: 10px; }
  .typography form .field label {
    font-size: 14px;
    line-height: 1.5em; }
    .typography form .field label.left {
      font-weight: bold;
      float: none; }
    .typography form .field label.right {
      float: none; }
  .typography form .field input[type="text"], .typography form .field input[type="password"], .typography form .field input[type="email"], .typography form .field input[type="tel"], .typography form .field select {
    background: #F0F0F0;
    border: 1px solid #C7C7C7;
    color: #555;
    width: 100%;
    height: 30px;
    -webkit-border-radius: 1px;
    border-radius: 1px;
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding;
    background-clip: padding-box;
    font-size: 1em;
    padding: 0 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; }
  .typography form .field input[type="text"]:hover, .typography form .field input[type="text"]:focus, .typography form .field input[type="email"]:hover, .typography form .field input[type="email"]:focus, .typography form .field input[type="password"]:hover, .typography form .field input[type="password"]:focus, .typography form .field input[type="tel"]:hover, .typography form .field input[type="tel"]:focus {
    border: 1px solid #004a8e; }
  .typography form .field textarea {
    background: #F0F0F0;
    color: #555;
    width: 100%;
    min-height: 100px;
    border: 1px solid #C7C7C7;
    padding: 10px;
    text-indent: 0;
    -webkit-border-radius: 1px;
    border-radius: 1px;
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding;
    background-clip: padding-box;
    font-size: 1em;
    box-sizing: border-box; }
  .typography form .field textarea:hover, .typography form .field textarea:focus {
    border: 1px solid #004a8e; }
  .typography form .field .placeholder {
    color: #a2a2a2;
    text-transform: none; }
  .typography form .field ::-webkit-input-placeholder {
    color: #a2a2a2;
    text-transform: none; }
  .typography form .field ::-moz-placeholder {
    color: #a2a2a2;
    text-transform: none; }
  .typography form .field :-ms-input-placeholder {
    color: #a2a2a2;
    text-transform: none; }
  .typography form .field input:-moz-placeholder {
    color: #a2a2a2;
    text-transform: none; }
  .typography form .field.checkbox input[type="checkbox"], .typography form .field.checkbox input[type="radio"], .typography form .field.optionset input[type="checkbox"], .typography form .field.optionset input[type="radio"], .typography form .field.checkboxset input[type="checkbox"], .typography form .field.checkboxset input[type="radio"] {
    display: inline-block;
    vertical-align: middle; }
  .typography form .field.checkbox label.right, .typography form .field.optionset label.right, .typography form .field.checkboxset label.right {
    margin-left: 5px; }
  .typography form .field.checkbox ul.optionset, .typography form .field.checkbox ul.checkboxset, .typography form .field.optionset ul.optionset, .typography form .field.optionset ul.checkboxset, .typography form .field.checkboxset ul.optionset, .typography form .field.checkboxset ul.checkboxset {
    list-style-type: none;
    padding-left: 15px;
    margin-left: 0; }
    .typography form .field.checkbox ul.optionset li, .typography form .field.checkbox ul.checkboxset li, .typography form .field.optionset ul.optionset li, .typography form .field.optionset ul.checkboxset li, .typography form .field.checkboxset ul.optionset li, .typography form .field.checkboxset ul.checkboxset li {
      list-style-type: none;
      padding-left: 0;
      background: none; }
      .typography form .field.checkbox ul.optionset li label, .typography form .field.checkbox ul.checkboxset li label, .typography form .field.optionset ul.optionset li label, .typography form .field.optionset ul.checkboxset li label, .typography form .field.checkboxset ul.optionset li label, .typography form .field.checkboxset ul.checkboxset li label {
        margin-left: 5px; }
      .typography form .field.checkbox ul.optionset li:before, .typography form .field.checkbox ul.checkboxset li:before, .typography form .field.optionset ul.optionset li:before, .typography form .field.optionset ul.checkboxset li:before, .typography form .field.checkboxset ul.optionset li:before, .typography form .field.checkboxset ul.checkboxset li:before {
        display: none; }
  .typography form .field.file {
    padding: 10px;
    background: #F0F0F0;
    border: 1px solid #C7C7C7;
    color: #555; }
    .typography form .field.file:hover, .typography form .field.file:focus {
      border: 1px solid #004a8e; }
    .typography form .field.file input[type="file"] {
      border: none;
      padding: 0;
      display: inline-block;
      vertical-align: middle;
      background: #F0F0F0; }
  .typography form .field .mollom-captcha {
    margin-top: 10px; }
.typography form .Actions input {
  float: right;
  text-indent: 0;
  margin: 0 0 15px 10px;
  padding: 5px 20px; }
.typography form input[type="submit"] {
  background-color: #004a8e;
  color: #fff;
  height: 30px;
  border: none;
  -webkit-border-radius: 1px;
  border-radius: 1px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding;
  background-clip: padding-box;
  cursor: pointer;
  -webkit-transition: all 0.3s linear;
  -moz-transition: all 0.3s linear;
  -o-transition: all 0.3s linear;
  transition: all 0.3s linear; }
  .typography form input[type="submit"]:hover, .typography form input[type="submit"]:focus {
    background-color: #9a281e; }
.typography form input[type="reset"] {
  background-color: #a6c0d3;
  color: #9a281e;
  height: 30px;
  border: none;
  -webkit-border-radius: 1px;
  border-radius: 1px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding;
  background-clip: padding-box; }
.typography form input[type="reset"]:hover, .typography form input[type="reset"]:focus {
  background-color: #9a281e; }
.typography form .recaptcha input[type="text"], .typography form .recaptcha input {
  height: auto;
  background: #FFF;
  display: inline-block; }
.typography form .requiredField input.required {
  border: 1px solid #9a281e; }
.typography form .requiredField label.required, .typography form .requiredField span.required {
  color: #9a281e;
  font-weight: bold;
  display: block; }

.filter-set {
  background: #F0F0F0;
  border: 1px solid #C7C7C7;
  padding: 10px 10px 0;
  margin: 20px 0;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding;
  background-clip: padding-box; }
  .filter-set label {
    display: inline-block;
    vertical-align: top;
    margin: 0 10px 10px 0; }
  .filter-set select {
    max-width: 280px; }
  .filter-set button[type="submit"] {
    display: inline-block;
    vertical-align: bottom;
    text-indent: 0;
    margin: 0 10px 10px 0;
    padding: 5px 20px;
    background-color: #004a8e;
    color: #fff;
    height: 30px;
    border: none;
    -webkit-border-radius: 1px;
    border-radius: 1px;
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding;
    background-clip: padding-box;
    cursor: pointer;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear; }
    .filter-set button[type="submit"]:hover, .filter-set button[type="submit"]:focus {
      background-color: #9a281e; }

#payment-form .cards {
  list-style-type: none;
  margin: 0;
  padding: 0;
  display: inline-block;
  vertical-align: bottom; }
  #payment-form .cards li {
    margin: 0;
    display: inline-block;
    vertical-align: bottom;
    background-image: url(../img/creditcards.png);
    background-repeat: no-repeat;
    text-indent: -9999em;
    height: 32px;
    width: 47px;
    opacity: 1; }
    #payment-form .cards li.off {
      opacity: 0.4; }
    #payment-form .cards li.visa {
      background-position: 0 0; }
    #payment-form .cards li.mastercard {
      background-position: -47px 0; }
    #payment-form .cards li.amex {
      background-position: -94px 0; }
    #payment-form .cards li.discover {
      background-position: -141px 0; }
    #payment-form .cards li.jcb {
      background-position: -188px 0; }
    #payment-form .cards li.diners_club_international {
      background-position: -235px 0; }
#payment-form .totals {
  text-align: right;
  background: none; }
#payment-form #ordertotal {
  font-weight: bold; }

/* ==========================================================================
	#Media queries
========================================================================== */
/* max-width: 979px */
@media (max-width: 979px) {
  .shell {
    width: auto; }
  .cart {
    margin: 0;
    right: 5px;
    left: auto; }
  .nav > ul > li > a {
    padding: 6px 2px; } }

/* max-width: 767px */
@media (max-width: 767px) {
  body {
    font-size: 12px;
    line-height: 1.5; }
  h1 {
    font-size: 20px;
    padding-bottom: 8px; }
  p {
    padding-bottom: 18px; }
  .header {
    border: 0; }
  .header .shell {
    background: #555;
    height: auto; }
  .logo {
    float: left;
    width: 38px;
    height: 32px;
    background-position: -108px -38px; }
  .intro {
    height: 65px;
    background-size: cover;
    background-position: right center; }
  .intro-content {
    position: absolute;
    top: 0;
    left: 0;
    width: 214px;
    padding: 5px 0 0 5px; }
  .intro-content h1 {
    float: right;
    max-width: 170px;
    line-height: 1;
    font-size: 15px;
    padding-top: 2px; }
  .intro-content p {
    display: none; }
  .cart {
    position: relative;
    top: auto;
    left: auto;
    right: auto; }
  .cart {
    background: #fff;
    text-align: center;
    padding: 5px 0 2px; }
  .cart-inner {
    display: inline-block;
    position: relative;
    text-align: left; }
  .nav-utilities, .nav {
    display: none; }
  .header-inner {
    padding: 0;
    text-align: right;
    float: none;
    font-size: 0;
    line-height: 0;
    position: relative; }
  .header-inner:before {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 1px;
    content: '';
    background: #fff; }
  .btn-menu {
    display: inline-block;
    background: #767676;
    padding: 19px 8px 4px;
    border-left: 1px solid #969696;
    text-align: left; }
  .btn-menu span {
    position: relative;
    display: block;
    width: 26px;
    height: 15px;
    border-top: 4px solid #d6d6d6; }
  .btn-menu span:before, .btn-menu span:after {
    position: absolute;
    width: 100%;
    height: 4px;
    background: #d6d6d6;
    content: ''; }
  .btn-menu span:before {
    top: -12px; }
  .btn-menu span:after {
    top: 4px; }
  .btn-menu span:before, .btn-menu span:after, .btn-menu span {
    -webkit-transition: all .3s linear;
    -o-transition: all .3s linear;
    transition: all .3s linear; }
  .btn-menu.active span {
    border-color: transparent; }
  .btn-menu.active span:before, .btn-menu.active span:after {
    background: #fefefe; }
  .btn-menu.active span:before {
    -webkit-transform: rotate(45deg) translate(4.5px, 7px);
    -ms-transform: rotate(45deg) translate(4.5px, 7px);
    -o-transform: rotate(45deg) translate(4.5px, 7px);
    transform: rotate(45deg) translate(4.5px, 7px); }
  .btn-menu.active span:after {
    -webkit-transform: rotate(-45deg) translate(4.5px, -7px);
    -ms-transform: rotate(-45deg) translate(4.5px, -7px);
    -o-transform: rotate(-45deg) translate(4.5px, -7px);
    transform: rotate(-45deg) translate(4.5px, -7px); }
  .nav-utilities {
    position: relative;
    z-index: 99;
    background: #767676;
    padding-bottom: 15px;
    border-top: 1px solid #fff;
    margin-bottom: -1px;
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.3); }
  .nav-utilities ul {
    padding-top: 5px; }
  .nav-utilities ul + ul {
    padding: 0; }
  .nav-utilities li {
    float: none; }
  .nav-utilities li + li {
    border: 0; }
  .nav-utilities a {
    text-align: left;
    color: #fff;
    padding: 5px 12px;
    font-size: 12px;
    line-height: 1.17;
    position: relative; }
  .nav-utilities a:hover {
    background: none; }
  .nav-utilities ul ul {
    display: none;
    background: #555;
    padding-top: 0; }
  .nav-utilities ul ul a {
    padding-left: 25px; }
  .nav-utilities ul ul ul {
    background: #444; }
  .nav-utilities ul ul ul a {
    padding-left: 35px; }
  .nav-utilities ul ul ul ul {
    background: #333; }
  .nav-utilities ul ul ul ul a {
    padding-left: 45px; }
  .nav-utilities .has-dropdown > a:before {
    position: absolute;
    top: 5px;
    right: 15px;
    width: 8px;
    height: 12px;
    content: '';
    background: url(../img/sprite.png) no-repeat -119px -74px; }
  .nav-utilities .has-dropdown > a:before {
    -webkit-transition: -webkit-transform .3s;
    -o-transition: -o-transform .3s;
    transition: transform .3s; }
  .nav-utilities .active > a:before {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg); }
  .main {
    padding: 10px; }
  .products {
    width: 100%;
    float: none;
    padding: 0;
    margin-top: -5px; }
  .list-products {
    margin: 0;
    padding: 0; }
    .list-products li {
      width: auto;
      display: block;
      padding: 0; }
      .list-products li + li {
        padding-top: 5px; }
    .list-products a {
      min-height: 64px; }
  .widget-news {
    width: 100%;
    float: none;
    padding-top: 10px; }
    .widget-news .widget-body {
      min-height: 0; }
    .widget-news .widget-head h5 {
      font-size: 12px;
      font-weight: bold; }
    .widget-news .widget-actions {
      padding-top: 20px; } }

.ie8 .cart-head {
  background: #CCC; }
.ie8 .cart-body {
  background: #FFF; }
.ie8 .mobile {
  display: none; }

.typography {
  /* ==========================================================================
	Typography
========================================================================== */
  /* ==========================================================================
#STYLED TABLES
========================================================================== */ }
  .typography p {
    font-size: 16px;
    margin-bottom: 20px;
    padding-bottom: 0; }
  .typography ul, .typography ol {
    padding-top: 3px;
    margin: 0 0 15px 15px;
    padding-left: 15px; }
    .typography ul li, .typography ol li {
      margin-bottom: 10px;
      position: relative;
      font-size: 16px; }
      .typography ul li p, .typography ol li p {
        margin-bottom: 15px; }
  .typography ul {
    list-style-type: square; }
  .typography a {
    color: #9a281e; }
  .typography img {
    max-width: 100%;
    height: auto; }
    .typography img.left, .typography img.right {
      margin-bottom: 20px; }
    .typography img.left {
      float: left;
      margin-right: 20px; }
    .typography img.right {
      float: right;
      margin-left: 20px; }
    .typography img.center {
      float: none;
      margin: 0 auto 20px;
      display: block; }
    .typography img.leftAlone {
      display: block;
      float: none;
      margin-bottom: 20px; }
    @media (max-width: 400px) {
      .typography img {
        max-width: 100%;
        height: auto; }
        .typography img.left, .typography img.right {
          float: none;
          margin: 0 auto 20px;
          display: block; } }
  .typography table[align=center] {
    margin: 0 auto 20px !important; }
  .typography .captionImage {
    background-color: #F0F0F0;
    border-bottom: .25em solid #9a281e;
    text-align: left;
    margin-bottom: 1.25em; }
    .typography .captionImage img {
      float: none;
      margin: 0; }
    .typography .captionImage p.caption {
      font-size: 12px;
      line-height: 16px;
      padding: 1em;
      margin: 0; }
    .typography .captionImage.right {
      float: right;
      margin-left: 1.25em;
      clear: right; }
    .typography .captionImage.left {
      float: left;
      margin-right: 1.25em;
      clear: left; }
    .typography .captionImage.leftAlone {
      clear: left; }
    .typography .captionImage.center {
      clear: both;
      margin: 0 auto 1.25em; }
    @media (max-width: 400px) {
      .typography .captionImage img {
        max-width: 100%;
        height: auto; }
      .typography .captionImage.left, .typography .captionImage.right, .typography .captionImageleftAlone, .typography .captionImage.center {
        float: none;
        margin: 0 auto 20px;
        max-width: 100%;
        height: auto;
        display: block;
        clear: both; }
      .typography .captionImage p.caption {
        float: none; } }
  .typography iframe {
    max-width: 100%;
    display: block;
    margin-bottom: 10px; }
  .typography .clear {
    clear: both; }
  .typography h1 {
    font-size: 32px;
    line-height: 1.2;
    font-weight: 700;
    color: #004a8e;
    margin-bottom: 20px; }
    .typography h1.reversed {
      color: #fff;
      padding: 6px 10px;
      background: #000; }
    .typography h1.underline {
      padding-bottom: 6px;
      border-bottom: 1px solid #000; }
  .typography > h1:first-child {
    font-size: 32px;
    line-height: 1.2;
    font-weight: 700;
    color: #004a8e;
    margin-bottom: 20px; }
  .typography h2 {
    font-size: 24px;
    line-height: 1.2;
    color: #004a8e;
    font-weight: 400;
    margin-bottom: 15px; }
    .typography h2.reversed {
      color: #fff;
      padding: 6px 10px;
      background: #000; }
    .typography h2.underline {
      padding-bottom: 6px;
      border-bottom: 1px solid #000; }
  .typography h3 {
    font-size: 18px;
    line-height: 1.2;
    color: #004a8e;
    margin-bottom: 3px; }
    .typography h3 em {
      font-size: 14px;
      font-weight: 300; }
    .typography h3.reversed {
      color: #fff;
      padding: 6px 10px;
      background: #000; }
    .typography h3.underline {
      padding-bottom: 6px;
      border-bottom: 1px solid #000; }
  .typography h4 {
    font-size: 14px;
    line-height: 21px;
    color: #000;
    margin: 20px 0 10px; }
    .typography h4.reversed {
      color: #fff;
      padding: 6px 10px;
      background: #000; }
    .typography h4.underline {
      padding-bottom: 6px;
      border-bottom: 1px solid #000; }
  .typography h6 {
    font-size: 12px;
    line-height: 19px;
    color: #000;
    margin: 20px 0 10px;
    font-weight: normal; }
    .typography h6.reversed {
      color: #fff;
      padding: 6px 10px;
      background: #000; }
    .typography h6.underline {
      padding-bottom: 6px;
      border-bottom: 1px solid #000; }
  .typography .btn {
    visibility: visible;
    color: #41443f; }
  .typography .reversed {
    color: #fff;
    padding: 6px 10px;
    background: #004a8e; }
  .typography .underline {
    padding-bottom: 6px;
    border-bottom: 1px solid #9a281e; }
  .typography .styled-table {
    border-collapse: collapse;
    margin: 0 0 20px; }
    .typography .styled-table tr:nth-child(odd) {
      background-color: #EFEFEF; }
    .typography .styled-table th, .typography .styled-table td {
      padding: 5px;
      border: 1px solid #CCC;
      text-align: left;
      vertical-align: top; }
    .typography .styled-table th {
      font-weight: bold; }
    .typography .styled-table thead th {
      background-color: #9a281e;
      color: #FFF;
      text-align: center; }
    .typography .styled-table thead td {
      background-color: #989898;
      font-weight: bold; }
    .typography .styled-table tfoot td {
      background-color: #C7C7C7; }

@media print {
  .header, nav, .logo, .cart, .breadcrumbs, .search {
    display: none; }
  html, body, .wrapper, .shell, .container {
    width: 100%;
    display: block;
    clear: both; }
  a {
    color: #004a8e; }
  .intro {
    background: none;
    text-align: center;
    width: 100%;
    display: block; }
  .intro-content {
    color: #000;
    text-align: center;
    width: 100%;
    padding: 0;
    display: block; }
    .intro-content h1 {
      max-width: none;
      float: none;
      font-size: 28px;
      padding: 20px 0;
      border-bottom: 1px solid #000;
      margin-bottom: 40px; }
    .intro-content p {
      font-size: 20px; }
  .main {
    padding: 20px 30px; }
  .footer {
    border-top: 1px solid #000;
    color: #000;
    page-break-inside: avoid; }
    .footer a {
      color: #004a8e; }
  .collapsible:after {
    display: none !important; }
  .collapsible + .container {
    display: block !important; } }