/* /////////////////////////////////
	Default CSS (SCSS)
	by Benek Lisefski
	http://www.benekdesign.com
///////////////////////////////// */
/* /////////////////////////////////
	MIXINS
///////////////////////////////// */
/* font-face */
/* transition on hover and click */
/* rounded corners */
/* background clip for rgba borders */
/* box shadow */
/* inset box shadow */
/* opacity */
/* multiple backgrounds */
/* gradient background */
/* animations */
/* @2x */
/* Placeholder texts */
/* /////////////////////////////////
	LAYOUT
///////////////////////////////// */
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.left {
  float: left; }

.right {
  float: right; }

.clear {
  clear: both;
  height: 0;
  line-height: 0px;
  font-size: 0px;
  text-indent: -1000em; }

/* General Layout */
.row {
  padding: 26px 25px; }

.columns {
  margin: 0 -25px; }

.large-one {
  width: 50%; }

.large-two {
  width: 50%; }

/* for elements with content replaced by background image -
	apply this class and then the element only needs height, width, and background image */
.ir {
  display: block;
  background-color: transparent;
  border: 0;
  overflow: hidden;
  text-indent: -1000em; }

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

/* use .clearfix to clear containers with floats inside */
.clearfix:before, .row:before, .columns:before, .center:before, ul#nav:before, .mainContent:before, .subCol:before, .clearfix:after, .row:after, .columns:after, .center:after, ul#nav:after, .mainContent:after, .subCol:after {
  content: "";
  display: table; }

.clearfix:after, .row:after, .columns:after, .center:after, ul#nav:after, .mainContent:after, .subCol:after {
  clear: both; }

.clearfix, .row, .columns, .center, ul#nav, .mainContent, .subCol {
  *zoom: 1; }

.box-sizing, ul#nav li, ul#nav li a:link, ul#nav li a:visited, form fieldset.left, form fieldset.right, form input.input, form select.input, form textarea.input, .mainCol, .productDetail, .productImage, .productGrid li, .subCol, #footer-categories > li {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

/* /////////////////////////////////
	OFH CSS Tweaks
	by Kinson Lau
///////////////////////////////// */
/* styles here */
* {
  margin: 0; }

body {
  font: normal 14px/22px arial, tahoma, verdana;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.center {
  max-width: 1200px;
  padding: 0 20px !important;
  width: auto; }

/* /////////////////////////////////
	NAV
///////////////////////////////// */
#navBar {
  height: auto;
  padding-left: 20px;
  padding-right: 20px; }

ul#nav {
  max-width: 1200px;
  height: auto;
  overflow: hidden;
  margin: 0 auto;
  list-style-type: none;
  background: #333;
  padding: 0;
  width: auto;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px; }

ul#nav li {
  border-left: 1px solid #505050; }

ul#nav li:first-child {
  border-left: 0; }

ul#nav li a:link, ul#nav li a:visited {
  background-image: none !important;
  width: auto !important; }

ul#nav li a:link, ul#nav li a:visited {
  display: block;
  float: left;
  height: 46px;
  color: #fff;
  font: normal 17px/46px 'Droid Sans', sans-serif;
  overflow: hidden;
  padding: 0 17px;
  text-indent: 0;
  background-color: transparent;
  -webkit-transition: background 0.2s ease 0s;
  -moz-transition: background 0.2s ease 0s;
  -o-transition: background 0.2s ease 0s;
  transition: background 0.2s ease 0s; }
ul#nav li a:link.current, ul#nav li a:link.current:hover, ul#nav li a:visited.current, ul#nav li a:visited.current:hover {
  background: #0196bf; }
ul#nav li a:link:hover, ul#nav li a:visited:hover {
  background: #000;
  -webkit-transition: background 0.2s ease 0s;
  -moz-transition: background 0.2s ease 0s;
  -o-transition: background 0.2s ease 0s;
  transition: background 0.2s ease 0s; }

ul#nav li#navSearch {
  background: transparent;
  float: left;
  width: auto; }

/* /////////////////////////////////
	CONTENT 
///////////////////////////////// */
a.button:link, a.button:visited {
  color: #fff !important;
  display: inline-block;
  font: bold 14px/33px arial;
  height: 33px;
  min-width: 160px;
  overflow: hidden;
  opacity: 0.9;
  padding: 0 15px;
  text-indent: 0;
  text-transform: lowercase;
  background: #0196bf;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-transition: opacity 0.2s ease 0s;
  -moz-transition: opacity 0.2s ease 0s;
  -o-transition: opacity 0.2s ease 0s;
  transition: opacity 0.2s ease 0s; }
a.button:link:hover, a.button:visited:hover {
  opacity: 1;
  -webkit-transition: opacity 0.2s ease 0s;
  -moz-transition: opacity 0.2s ease 0s;
  -o-transition: opacity 0.2s ease 0s;
  transition: opacity 0.2s ease 0s; }

#button-ofh:link, #button-ofh:visited, #button-efh:link, #button-efh:visited, #button-pp:link, #button-pp:visited {
  background: #d61317;
  width: auto !important; }

#button-acr:link, #button-acr:visited {
  background: #0196bf; }

#content .center {
  overflow: hidden;
  padding: 0;
  position: relative;
  background: transparent; }

form {
  width: 100%; }
form fieldset.left, form fieldset.right {
  width: 50%; }
form fieldset.left {
  padding-right: 20px; }
form input.input, form select.input, form textarea.input {
  width: 100%; }

.image-zoom {
  width: 211px; }

.mainCol {
  background: #fffeff;
  width: 75%; }
.mainCol.extraCol {
  padding: 0; }

.mainContent {
  position: relative; }

.productDetail {
  background: transparent url("../i/bg-subcol.gif") repeat-y 0 top;
  padding: 30px;
  width: 60%; }

.productImage {
  width: 40%;
  margin-bottom: 30px;
  padding-top: 30px; }
.productImage .product-image-zoom {
  position: relative; }
.productImage .section1 {
  height: auto;
  min-height: 0; }
.productImage .section1 img {
  height: auto; }

.productGrid .desc {
  height: 54px;
  overflow: hidden;
  text-overflow: ellipsis; }
.productGrid img {
  height: auto;
  width: auto !important; }
.productGrid li {
  height: auto;
  width: 33.3%; }
.productGrid li img {
  float: none; }

.productRelated {
  width: 100%; }

#slides {
  height: auto;
  overflow: hidden;
  position: relative;
  width: 100%;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px; }
#slides .bx-controls {
  bottom: 0;
  padding: 12px;
  position: absolute;
  right: 0;
  z-index: 4000; }
#slides .bx-controls .bx-pager-item {
  display: inline-block; }
#slides .bx-controls .bx-pager-item a {
  background: #fff;
  display: block;
  margin-right: 2px;
  font-size: 11px;
  line-height: 18px;
  text-align: center;
  color: #159cb6;
  opacity: 0.6;
  width: 18px;
  height: 18px;
  -webkit-border-radius: 60px;
  -moz-border-radius: 60px;
  border-radius: 60px; }
#slides .bx-controls .bx-pager-item a.active, #slides .bx-controls .bx-pager-item a:hover {
  opacity: 1; }
#slides img {
  display: block;
  width: 100%; }
#slides ul {
  margin: 0; }

.subCol {
  background: transparent url("../i/bg-subcol.gif") repeat-y 0 top;
  position: relative;
  z-index: 4000;
  width: 25%; }

.bg {
  background: transparent url("../i/bg-subcol.gif") repeat-y 0 top;
  bottom: 0;
  display: block;
  top: 0;
  position: absolute;
  right: 0;
  width: 25%; }

/* /////////////////////////////////
	FOOTER 
///////////////////////////////// */
#footer-categories {
  padding-top: 30px; }
#footer-categories > li {
  display: inline-block;
  margin-bottom: 5px;
  vertical-align: top;
  width: 24%; }
#footer-categories > li > a {
  color: #000 !important;
  font-weight: bold; }
#footer-categories > li > ul {
  margin: 5px 0; }

/* /////////////////////////////////
	Responsive Design
///////////////////////////////// */
/* /////////////////////////////////
	Wider - screens over breakpoint
///////////////////////////////// */
/* /////////////////////////////////
	Tablet
///////////////////////////////// */
@media all and (max-width: 999px) {
  /* /////////////////////////////////
  	HEADER
  ///////////////////////////////// */
  #header {
    height: auto; }
  #header h3 {
    float: none;
    margin: 20px 0 20px;
    width: auto; }
  #header #logo {
    float: none; }

  /* /////////////////////////////////
  	NAV
  ///////////////////////////////// */
  ul#nav li {
    text-align: center;
    width: 12.5%; }
  ul#nav li a:link, ul#nav li a:visited {
    font-size: 18px;
    padding: 0 10px;
    width: 100% !important; }
  ul#nav li#navSearch {
    border-top: 1px solid #505050;
    width: 100%; }

  /* /////////////////////////////////
  	CONTENT 
  ///////////////////////////////// */
  a.button:link, a.button:visited {
    font: bold 14px/16px arial;
    height: auto;
    padding: 12px 15px; }

  .image-zoom {
    width: 211px; }

  .mainCol {
    width: 65%; }

  #navBar {
    padding-left: 0;
    padding-right: 0; }

  .subCol, span.bg {
    width: 35%; }

  .thumbs {
    float: none; }

  .productDetail, .productImage {
    width: 100%; } }
/* /////////////////////////////////
	Mobile
///////////////////////////////// */
@media all and (max-width: 679px) {
  /* /////////////////////////////////
  	NAV
  ///////////////////////////////// */
  ul#nav li {
    border-top: 1px solid #505050;
    text-align: center;
    width: 100%; }
  ul#nav li a:link, ul#nav li a:visited {
    font-size: 18px;
    padding: 0 10px;
    width: 100% !important; }
  ul#nav li:first-child {
    border-top: 0; }

  /* /////////////////////////////////
  	CONTENT
  ///////////////////////////////// */
  .mainCol {
    padding-right: 0;
    width: 100%; }

  .productGrid li {
    width: 100%; }

  .productImage .section1 {
    text-align: center; }

  #slides .bx-controls {
    display: none; }

  .subCol {
    background: #f0eef0;
    margin-bottom: 30px;
    margin-top: 20px;
    padding: 46px 20px 20px 20px;
    position: static;
    width: 100%; }

  span.bg {
    display: none; }

  /* /////////////////////////////////
  	FOOTER
  ///////////////////////////////// */
  #footer-categories li {
    width: 49%; } }

/*# sourceMappingURL=custom.css.map */