/* CSS Document */
/*
Theme Name: ChilliWeb Super Eleven
Author: the ChilliWeb team
Author URI: http://ChilliWeb.co/
Version: 0.1
Type: Layout
Description: This layout sheet sets the div and characters sizes, margings, border styles, displays of the website.
	It works toguether with the 'style' sheet sets the colours of borders and characters styles .
Tags:
*/

* = Reset default browser CSS. Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}

/* HTML5 display definitions */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

/* Improve readability of pre-formatted text in all browsers */
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }

/* Typography */
abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }

/* Position subscript and superscript content without affecting line-height */
sub, sup {
	font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}
sup {
	top: -0.5em;
}
sub {
	bottom: -0.25em;
}
/* 1. Improve image quality when scaled in IE7: h5bp.com/d
 * 2. Remove the gap between images and borders on image containers */
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }

/*  Correct overflow not hidden in IE9 */
svg:not(:root) { overflow: hidden; }


body {
	line-height: 1;
	-moz-transform: scale(1,1);
	zoom: 1.0;
	zoom: 100%; 
}
h1 {
    font-size: 1.5em;
    text-align: center;
	margin: 5px 0px;
}
h2 {
    font-size: 1.2em;
    text-align: left;
}

/* = General
-------------------------------------------------------------- */

body, input, textarea {
	font: 100% "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 400;
	line-height: 1.25;
}
.assistive-text { /* Assistive text */
	position: absolute !important;
	clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
	clip: rect(1px, 1px, 1px, 1px);
}
.clear {
	clear: both;
}
.f-left {
	float: left;
}
.f-right {
	float: right;
}
.t-center {
	text-align: center;
}
.t-right {
	text-align: right;
}
.t-left {
	text-align: left;
}
#message { /* Eduardo added */
}
div.table {
	display:table;
}
div.table > form { 
    display:table-row; 
}
div.table > form > div.row {
    border: solid; 
    border-width: 0.1em; 
}
div.table > form > div.cell {
    display:table-cell; 
    padding: 0em 0.25em 0em 0.25em; 
    /*width:auto;*/ 
    border: solid; 
    border-width: 0em; 
    font-size:0.7em; 
    /*float:left;*/
}
.sorted {
    background-color: #B2B2B2;
}
.sorted1 {
    background-color: #D9D9D9;
}

.btn {
  border: 0.15em solid transparent;
  color: #333;
  background-color: #fff;
  border-color: #ccc;
  display: inline-block;
  padding: 0.3em 0.8em;
  margin: 0.2em;
  font-size: 0.6em;
  font-weight: normal;
  line-height: 1.4em;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  cursor: pointer;
  border: 1px solid #d3d3d3;
  background: #e6e6e6 url("../../dv/css/img/ui-bg_glass_75_e6e6e6_1x400.png") 50% 50% repeat-x;
  border-radius: 0.25em;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}
.hidden {
	display: none !important;
}
/* = Structure
----------------------------------------------- */
body {
	margin: 0em;
	background: #CCCCCC;
}
#page {
	margin: 0.1em auto;
	max-width: 1200px;
	background: #FFFFFF;
}

/* = Header
----------------------------------------------- */
#page-title {
	margin-right: 270px;
	padding: 3.65625em 0 0;
}
#page-title a {
	font-size: 30px;
	font-weight: bold;
	line-height: 36px;
	text-decoration: none;
	color: #111111;
}
#page-title a:hover,
#page-title a:focus,
#page-title a:active {
	color: #1982d1;
}
#page-description {
	font-size: 14px;
	margin: 0 270px 3.65625em 0;
	color: #7a7a7a;
}
#branding {
	border-top: 2px solid #5889A2;
	position: relative;
	z-index: 9999;
	background: #FFFFFF;
}
#branding.fixed {
    top: 0px;
	margin: 0px;
    position: fixed;
    z-index: 999;
    width: 100%;
    max-width: inherit;
    opacity: 1;
    filter: alpha(opacity=100); /* For IE8 and earlier */
}
#branding hgroup {
	margin: 0 10px;
    display: none;
}
#branding #page-logo {
	height: auto;
	display: block;
	width: 25%;
    min-width: 4em;
    max-width: 150px;
    margin: 0.625em;
    float: left;
}
#branding.fixed #page-logo {
	width: 80px;
}
#page-logo.fixed {
	width: 30px !important;
	margin: 0.05em !important;
}
#branding .user {
	height: auto;
	display: block;
	width: 10%;
    min-width: 150px;
    margin: 0.625em;
    float: right;
}
#access #page-logo-menu {
	height: auto;
	display: block;
    float: left;
	width: 4.3em !important;
	margin: 0.05em !important;
	padding: 0px;
	background-color: #FFF;
}
#access.fixed #page-logo-menu {
	width: 80px;
}
#access.fixed #page-logo-menu a {
	padding: 0 0.1em;
}

/* Search Form */
#search {
	float: left;
    border: 1px solid #5889A2;
    border-radius: 0.2em;
	line-height: 2.5em;
    margin: 1em auto 0em;
    padding: 0.2em;
    z-index: 999;
    max-width: 180px;
}
input#s {
  background: url(../../dv/css/img/search.png) no-repeat 0.2em 0em;
  -moz-border-radius: 0.2em;
  border-radius: 0.2em;
  font-size: 1em;;
  height: 1.5em;;
  line-height: 1.2em;
  padding: 0.25em 0.8em 0.25em 1.6em;
}

#branding #searchform div {
	margin: 0;
}
#branding #s {
	float: left;
	-webkit-transition-duration: 400ms;
	-webkit-transition-property: width, background;
	-webkit-transition-timing-function: ease;
	-moz-transition-duration: 400ms;
	-moz-transition-property: width, background;
	-moz-transition-timing-function: ease;
	-o-transition-duration: 400ms;
	-o-transition-property: width, background;
	-o-transition-timing-function: ease;
	width: 100px;
}
#branding #s:focus {
	background-color: #f9f9f9;
	width: 170px;
}
#branding #searchsubmit {
	display: none;
}

#branding.fixed #search {
    margin: 1.0em auto;
    max-width: 180px;
}
#user-info {
	height: auto;
	display: block;
   	text-align:right;
    float: right;
    padding: 0.5em 0.2em;
}
#user {
    display: block;
    margin: 0.5em 0em;
}
#branding.fixed #user-info {
    display: block;
}
#time {
	height: auto;
	display: block;
   	text-align:right;
    font-size: 0.8em;
}
#branding img {
	height: auto;
	display: block;
	width: 100%;
}

/* = Navigation
-------------------------------------------------------------- */
#access a.assistive-text:focus {
	border-bottom: 1px solid;
	clip: auto !important;
	font-size: 0.75em;
	position: absolute;
	text-decoration: underline;
	top: 0;
	left: 10px;
	background: #eee;
	border-bottom: #68A1BF;
	color: #1982d1;
}

#access {
	-webkit-box-shadow: 0px 1px 2px;
	-moz-box-shadow: 0px 1px 2px;
	box-shadow: 0px 1px 2px;
/*	clear: both; */
	display: block;
	float: left;
	margin: 0 auto 0.5em;
	width: 100%;
	max-width: 1200px;
	background: #68A1BF; /* Show a solid color for older browsers */
	background: -moz-linear-gradient(#68A1BF, #5889A2);
	background: -o-linear-gradient(#68A1BF, #5889A2);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#68A1BF), to(#5889A2)); /* older webkit syntax */
	background: -webkit-linear-gradient(#68A1BF, #5889A2);
	-webkit-box-shadow: rgba(0, 0, 0, 0.4);
	-moz-box-shadow: rgba(0, 0, 0, 0.4);
	box-shadow: rgba(0, 0, 0, 0.4);
}
#access div {
/*	margin: 0 10px; */
}
#access ul {
	font-size: 0.975em;
	list-style: none;
	margin: 0 0 0 0em;
	padding-left: 0;
}
#access li {
	float: left;
	position: relative;
}
#access a {
	display: block;
	line-height: 3.333em;
	padding: 0 1.0em;
	text-decoration: none;
	color: #eee;
}
#access ul ul {
	-moz-box-shadow: 0 3px 3px;
	-webkit-box-shadow: 0 3px 3px;
	box-shadow: 0 3px 3px;
	display: none;
	float: left;
	margin: 0;
	position: absolute;
	top: 3.333em;
	left: 0;
	width: 188px;
	z-index: 99999;
	-moz-box-shadow: rgba(0,0,0,0.2);
	-webkit-box-shadow: rgba(0,0,0,0.2);
	box-shadow: rgba(0,0,0,0.2);
}
#access ul ul ul {
	left: 100%;
	top: 0;
}
#access ul ul a {
	border-bottom: 1px dotted;
	font-size: 13px;
	font-weight: normal;
	height: auto;
	line-height: 1.4em;
	padding: 0.625em 0.625em;
	width: 168px;
	background: #7FAFC9;
	border-bottom: #68A1BF;
	color: #444;
}
#access li:hover > a,
#access ul ul :hover > a,
#access a:focus {
	background: #efefef;
}
#access li:hover > a,
#access a:focus {
	background: #7FAFC9; /* Show a solid color for older browsers */
	background: -moz-linear-gradient(#7FAFC9, ##68A1BF);
	background: -o-linear-gradient(#7FAFC9, ##68A1BF);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#7FAFC9), to(##68A1BF)); /* Older webkit syntax */
	background: -webkit-linear-gradient(#7FAFC9, ##68A1BF);
	color: #373737;
}
#access ul li:hover > ul {
	display: block;
}
#access .current-menu-item > a,
#access .current-menu-ancestor > a,
#access .current_page_item > a,
#access .current_page_ancestor > a {
	font-weight: bold;
}
#access .home-icon:before {
    position: relative;
    float: left;
    display: block;
    width: 40px;
    height: 40px;
    content:'';
    background-image: url(../../dv/css/cw/img/_logo/menu.png);
    background-position: -5px -5px;
    background-repeat: no-repeat;
}
#access .current_page_item {
	background: #5889A2; /* Show a solid color for older browsers */
	background: -moz-linear-gradient(#5889A2, #68A1BF);
	background: -o-linear-gradient(#5889A2, #68A1BF);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#5889A2), to(#68A1BF)); /* older webkit syntax */
	background: -webkit-linear-gradient(#5889A2, #68A1BF);
}
#access .home-icon:hover:before {
    background-position: -5px -55px;
}
#access .options {
	margin: 0em;
}
#access .options div {
	margin: 0em 0.5em;
}
#access.fixed {
/*    top: 0px; */
	margin: 0px !important;
/*    position: fixed; */
    z-index: 999;
    width: 100%;
    opacity: 1;
    filter: alpha(opacity=100); /* For IE8 and earlier */
}
.show-filter {
	text-align: right;
    float: right;
	line-height: 2.5em;
    padding: 0.4em 0em 0em 0.5em;
    margin: 0.2em 0em;
    cursor: pointer;
    max-width: 2.5em;
}
.show-account {
	text-align: right;
    float: right;
	line-height: 2.5em;
    padding: 0.4em 0em 0em 0.5em;
    margin: 0.2em 0em;
    cursor: pointer;
    max-width: 2.5em;
}
.show-settings {
	text-align: right;
    float: right;
	line-height: 2.5em;
    padding: 0.4em 0em 0em 0.5em;
    margin: 0.2em 0em;
    cursor: pointer;
    max-width: 2.5em;
}

/* = Content
-------------------------------------------------------------- */
#content {
    margin: 1em 1em;
}
#content.fixed {
    margin-top: 9.0em; /* Just with Nav 'top: 2.875em;' with Branding top:8.0em; */
}
#pageactions {
	padding: 0.1em 0.4em;
}
#pageactions button[id="Search"] {
	border-width: medium medium 0.2em;
	border-style: none none solid;
	border-color: -moz-use-text-color -moz-use-text-color #5889A2;
	-moz-border-top-colors: none;
	-moz-border-right-colors: none;
	-moz-border-bottom-colors: none;
	-moz-border-left-colors: none;
	border-image: none;
	border-radius: 0.2em;
	border:0.2em solid #5889A2;
	background:#68A1BF;
	outline: medium none;
	margin:0.2em;
    padding: 0.4em 0.4em 0.4em 0.4em;
    color: #FFFFFF;
    font-size: 0.8em;
    line-height: 0.8em;
	float:none;
}
#pageactions button[id="HideEmpty"] {
	border-width: medium medium 0.2em;
	border-style: none none solid;
	border-color: -moz-use-text-color -moz-use-text-color #5889A2;
	-moz-border-top-colors: none;
	-moz-border-right-colors: none;
	-moz-border-bottom-colors: none;
	-moz-border-left-colors: none;
	border-image: none;
	border-radius: 0.2em;
	border:0.2em solid #5889A2;
	background:#68A1BF;
	outline: medium none;
	margin:0.2em;
    padding: 0.4em 0.4em 0.4em 0.4em;
    color: #FFFFFF;
    font-size: 0.8em;
    line-height: 0.8em;
	float:none;
}
#pageactions button[id="HideEmpty"].active  {
	border-color: -moz-use-text-color -moz-use-text-color #8560A8;
	border:0.2em solid #8560A8;
	background: #A186BE;
}
#pageactions button[id="Sort"],
#pageactions button[id="HideEmpty"] {
	border-width: medium medium 0.2em;
	border-style: none none solid;
	border-color: -moz-use-text-color -moz-use-text-color #5889A2;
	-moz-border-top-colors: none;
	-moz-border-right-colors: none;
	-moz-border-bottom-colors: none;
	-moz-border-left-colors: none;
	border-image: none;
	border-radius: 0.2em;
	border:0.2em solid #5889A2;
	background:#68A1BF;
	outline: medium none;
	margin:0.2em;
    padding: 0.4em 0.4em 0.4em 0.4em;
    color: #FFFFFF;
    font-size: 0.8em;
    line-height: 0.8em;
	float:none;
}
#pageactions button[id="Sort"].active  {
	border-color: -moz-use-text-color -moz-use-text-color #F26C4F;
	border:0.2em solid #F26C4F;
	background: #F69679;
}

/*
#test.fixed {
    top: 8.0em; 
	margin: 0px;
    position: fixed;
    z-index: 999;
    opacity: 1;
    filter: alpha(opacity=100); // For IE8 and earlier
}
*/

/* copied from boiler */
textarea { overflow: auto; vertical-align: top; resize: vertical; }
/* Contain floats: h5bp.com/q */ 
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

/* copied from combocox */
	.custom-combobox {
		position: relative;
		display: inline-block;
	}
	.custom-combobox-toggle {
		position: absolute;
		top: 0;
		bottom: 0;
		margin-left: -1px;
		padding: 0;
	}
	.custom-combobox-input {
		margin: 0;
		padding: 5px 10px;
	}
    .ui-autocomplete {
    	z-index: 999999;
        position: fixed;
        }
.glyphicon {
  position: relative;
  top: 0.1em;
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  line-height: 1;
}	

.modal-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 159900;
  opacity: 0.7;
  -ms-filter: "alpha(Opacity=70)";
  filter: alpha(opacity=70);
  -moz-opacity: .7;
  -khtml-opacity: .7;
  background-color: #000000;
}
.main-modal {
  display: none;
  position: fixed;
  top: 0.9em;
  left: 0.9em;
  right: 0.9em;
  bottom: 0.9em;
  z-index: 160000;
  overflow: scroll;
  background-color: #fff;
}
.wrap {
  margin: 0.6em 1.2em 0em 0.2em;
}
.main-modal .close-icon {
  position: absolute;
  top: 0.7em;
  right: 0.7em;
  font-size: 2em;
  cursor: pointer;
  color: #333;
  z-index: 160001;
  line-height: 0.5em;
  padding: 0.5em;
  margin: -0.25em;
}
.main-modal .main-menu {
  /*position: absolute;*/
  top: 0;
  right: 0;
  left: 0;
  /*height: 8em;*/
}
.main-modal .main-menu h1 {
  padding: 0.5em 1em;
  margin: 0.2em 1.5em;
  font-size: 1.5em;
  line-height: 1.5em;
}
.content {
    width: 99%;
    float: left;
}
.content-left {
    width: 49%;
    float: left;
}
.content-right {
    width: 49%;
    float: right;
}
	
/* = Product
-------------------------------------------------------------- */
.prod-box {
	border-width: medium medium 0.2em;
	border-style: none none solid;
	border-color: -moz-use-text-color -moz-use-text-color #5889A2;
	-moz-border-top-colors: none;
	-moz-border-right-colors: none;
	-moz-border-bottom-colors: none;
	-moz-border-left-colors: none;
	border-image: none;
	border-radius: 0.4em;
	background:#F5F9FB;
	background: linear-gradient(to bottom, #FFFFFF 0%, #F5F9FB 100%) repeat scroll 0% 0% transparent;
	outline: medium none;
	float:left;
	margin:0.6em;
	padding:0.35em;
	/*width:320px;*/
	/*min-height:240px;*/
	border:0.2em solid #5889A2;
    font-size: 80%;
    line-height: 1.0;
}
.prod-box.compact {
	border-width: medium medium 0.2em;
	border-style: none none solid;
	border-color: -moz-use-text-color -moz-use-text-color #5889A2;
	-moz-border-top-colors: none;
	-moz-border-right-colors: none;
	-moz-border-bottom-colors: none;
	-moz-border-left-colors: none;
	border-image: none;
	border-radius: 0.4em;
	background:#F5F9FB;
	background: linear-gradient(to bottom, #FFFFFF 0%, #F5F9FB 100%) repeat scroll 0% 0% transparent;
	outline: medium none;
	float:left;
	margin:0.1em;
	padding:0.25em;
	/*width:310px;*/
	/*min-height:240px;*/
	border:0.2em solid #5889A2;
    font-size: 80%;
    line-height: 1.0;
}
.prod-box.compact.checked {
	border-color: -moz-use-text-color -moz-use-text-color <br />
<b>Notice</b>:  Undefined variable: #77A043 in <b>C:\vhosts\pantryguru\pd\css\colours.css.php</b> on line <b>439</b><br />
;
	background:#c4df9b;
	border:0.2em solid #77A043;
}
.prod-box.compact.hidden {
	display: none;
}
.prod-box.compact input {
	width: 2.5em;
    font-size: 1.5em;
    float: right;
}
.prod-box.compact .cart {
    margin: 1em 0em 0em 0em; 
    float: right;
}
.prod-box.compact .cart img{
    display: none;
}
.prod-box.compact .cart input {
	width: 1.8em;
    font-size: 1.5em;
    float: right;
}
.prod-box.compact .addcart {
    margin: 1em 0em 0em 0em; 
    float: right;
}
.prod-box.compact .check {
    margin: 1em 0em 0em 0.5em; 
    float: right;
}

.prod-box.compact .pantry {
    margin: 1em 0em 0em 0em; 
    float: right;
}
.prod-box.compact .pantry input {
	width: 2.8em;
    font-size: 1.5em;
    float: right;
}
.prod-box.compact .like {
    margin: 1em 0em 0em 1em; 
}
.box .cart input {
	width: 4em;
    font-size: 0.8em;
}
.box .pantry input {
	width: 4em;
    font-size: 0.8em;
}
.prod-box.small {
	width:360px;
}
.prod-box.small:nth-child(odd) {
}
.prod-box-menu.small {
	width:400px;
	height:300px;
}
.prod-box.change {
	width:320px;
	min-height:240px;
}
.prod-box h2 {
	font-size: 0.95em;
    margin-bottom: 0.1em;
}
.prod-box p {
	margin: 0.31em 0em;
}
.prod-box input {
	width: 4em;
    font-size: 0.8em;
}
.prod-box-header {
    clear: both !important;
	text-align:center;
}
.prod-name {
	text-align:center;
    font-weight: bold;
    margin: 0.125em 0em;
}
.prod-brand {
	text-align:left;
    float:left;
    margin: 0.125em 0em;
}
.prod-net {
	text-align:right;
    float:right;
    margin: 0.125em 0em;
}
.prod-std-name {
	text-align:left;
    float:left;
    margin: 0.125em 0em;
    align = center;
}
.prod-box-content {
    clear: both !important;
}
.prod-box-content-left {
    width: 41%;
    float: left;
}
.prod-image {
	text-align:center;
}
.prod-barcode {
	text-align:center;
    margin: 0.125em 0em;
}
.prod-price-container {
	border-color: #000000;
	background:#FFFFFF;
	text-align:left;
	border-width: 0.1em;
	border-style: solid;
	border-image: none;
	border-radius: 0.125em;
    padding: 0 0.125em;
    margin: 0.125em 0;
}
.prod-price-shop {
	text-align:center;
    margin: 0.31em 0em;
}
.prod-price {
	text-align:left;
    margin: 0.125em 0.125em 0.125em 0em;
    font-size: 170%;
    font-weight: bold;
    float: left;
    width: 61%;
}
.prod-price-type {
	text-align:right;
    margin: 0.125em 0em 0.125em 0.125em;
    font-size: 80%;
    float: right;
    width: 35%;
}
.prod-price-date {
	text-align:right;
    /*text-transform: uppercase;*/
    margin: 0.125em 0em 0.125em 0.125em;
    font-size: 80%;
    float: right;
    width: 35%;
}
.prod-price-100 {
	text-align:right;
    margin: 0.125em 0em;
    font-size: 90%;
    clear: both;
}
.prod-price-was {
	text-align:left;
    font-size: 80%;
    margin: 0.125em 0em;
    float: left;
}
.prod-price-footer {
	clear: both !important;
    margin: 0.125em 0em;
    text-align:center;
}
.crossed {
    text-decoration: line-through;
}

.special {
    color:#E6001A;
}
.prod-price-other {
	border-color: #000000;
	background:#FFFFFF;
	text-align:left;
	border-width: 0.1em;
	border-style: solid;
	border-image: none;
	border-radius: 0.125em;
    padding: 0 0.125em;
    margin: 0.125em 0;
}
.prod-price-other .prod-price-shop {
	text-align:left;
    margin: 0.125em 0em;
}
.prod-price-other .prod-price-shop {
    font-size: 80%;
}
.prod-price-other .prod-price {
    font-size: 90%;
}
.prod-box-content-right {
    width:58%;
    float: right;
}
.prod-nut {
	text-align:left;
    width:100%;
    margin: 0.125em 0em;
}
.nut {
    clear: both !important;
	text-align:left;
    /*font-size:80%;*/
    width:100%;
}
.nut select, button, input {
  margin: 0em;
  font-size: 90%;
  color: initial;
  letter-spacing: normal;
  word-spacing: normal;
  text-transform: none;
  text-indent: 0em;
  text-shadow: none;
  display: inline-block;
  text-align: start;
  line-height: 1.0;
}
.name {
	text-align:left;
    float:left;
    margin: 0.125em 0em;
}
.net {
	text-align:right;
    float:right;
    margin: 0.125em 0em;
}
.nut-indented {
    margin-left: 0.625em;
}
.prod-ingr {
    clear: both !important;
	text-align:left;
    width:100%;
    margin: 0.125em 0em;
    padding: 0.15em 0em;
}
.ingr {
    margin-left: 0.25em;
    height: 1.5em;
}
.ingr .name{
    margin-right: 0.2em;
}

.prod-treat {
    clear: both !important;
	text-align:left;
    width:100%;
    margin: 0.125em 0em;
    padding: 0.15em 0em;
}
.treat {
    margin-left: 0.25em;
    height: 1.5em;
}
.treat .name{
    margin-right: 0.2em;
}
.prod-diet {
    clear: both !important;
	text-align:left;
    width:100%;
    margin: 0.125em 0em;
    padding: 0.15em 0em;
}
.diet {
    margin-left: 0.25em;
    height: 1.5em;
}
.diet .name{
    margin-right: 0.2em;
}
.prod-box-content-footer {
	clear: both !important;
    margin: 0.31em 0em;
    text-align:Left;
    -webkit-column-count: 1; /* Chrome, Safari, Opera */
    -moz-column-count: 1; /* Firefox */
    column-count: 1;
}
.prod-box-footer {
	clear: both !important;
    margin: 0.31em 0em;
    text-align:center;
    /*margin-top: 50%;*/
}
.like {
  text-decoration: none;
  display: inline-block;
  text-align: left;
  float: left;
  line-height: 2.5em;
  padding: 0em 0em 0em 0em;
  margin: 0.2em 0.2em;
  cursor: pointer;
  max-width: 2.em;
}
.cart {
  text-decoration: none;
  display: inline-block;
  text-align: left;
  float: left;
  line-height: 2.5em;
  padding: 0em 0em 0em 0em;
  margin: 0.2em 0.2em;
  cursor: pointer;
  max-width: 2.em;
}

/* = Pagination
-------------------------------------------------------------- */
.pagination {
	float:left;
	margin:0em 0.1em;
	padding: 0.1em 0em;
}
.pagination button,
input[type="submit"],
input[type="button"],
input[type="reset"] {
	background: #CCCCCC; /* Old browsers */
	background: -webkit-linear-gradient(top, #CCCCCC 0%, #999999 100%); /* Chrome 10+, Safari 5.1+ */
	background:   linear-gradient(to bottom, #CCCCCC 0%, #999999 100%); /* W3C */
	border: none;
	border-bottom: 0.18em solid #999999;
	border-radius: 0.15em;
	display: inline-block;
	padding: 0em 0.31em;
	text-decoration: none;
    line-height: 1.6em;
    font-size: 65%;
}
.pagination button:hover,
button:focus,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:focus,
input[type="button"]:focus,
input[type="reset"]:focus {
	background: #7FAFC9; /* Old browsers */
	background: -webkit-linear-gradient(top, #68A1BF 0%, #7FAFC9 100%); /* Chrome 10+, Safari 5.1+ */
	background:   linear-gradient(to bottom, #68A1BF 0%, #7FAFC9 100%); /* W3C */
    border-bottom: 0.18em solid #5889A2;
	outline: none;
    font-size: 70%;
    margin: 0em 0em;
}
.pagination button:active,
input[type="submit"]:active,
input[type="button"]:active,
input[type="reset"]:active {
	background: #7FAFC9; /* Old browsers */
	background: -webkit-linear-gradient(top, #68A1BF 0%, #7FAFC9 100%); /* Chrome 10+, Safari 5.1+ */
	background:   linear-gradient(to bottom, #68A1BF 0%, #7FAFC9 100%); /* W3C */
	border-bottom: 0.18em solid #5889A2;
	border: none;
	padding: 0em 0.31em;
    font-size: 70%;
}
.active input[type="submit"], input[type="button"], input[type="reset"] {
    color: #FFF;
	background: #7FAFC9; /* Old browsers */
	background: -webkit-linear-gradient(top, #68A1BF 0%, #7FAFC9 100%); /* Chrome 10+, Safari 5.1+ */
	background:   linear-gradient(to bottom, #68A1BF 0%, #7FAFC9 100%); /* W3C */
	border-bottom: 0.18em solid #5889A2;
	border: none;
    padding: 0em 0.31em;
    font-size: 70%;
    margin: 0em 0em;
}


/* = Right Panel
-------------------------------------------------------------- */
#container-fixed-right {
}
#container-fixed-right.fixed {
}
#container-fixed-right img {
}

#container-closed {
	text-align: right;
    float: right;
    cursor: pointer;
    border: 1px solid #5889A2;
    border-radius: 1em 0em 0em 0.2em;
	line-height: 2.5em;
    padding: 0 0.2em;
	background:#F5F9FB;
	background: linear-gradient(to bottom, #FFFFFF 0%, #F5F9FB 100%) repeat scroll 0% 0% transparent;
}
#container-closed.fixed {
    position: fixed;
    right: 0em;
	height: 2.5em;
    z-index: 999;
    opacity: 1;
    filter: alpha(opacity=100); /* For IE8 and earlier */
}
#container-open {
	display: none;
	text-align: right;
    border: 1px solid #5889A2;
    border-radius: 1em 0em 0em 0.2em;
	line-height: 2.5em;
    padding: 0em 0.2em 0em 0.5em;
    top: 9.5em; /* Just with Nav 'top: 2.875em;' with Branding top:8.0em; */
    margin: 0em 0em;
    right: 0.2em;
    position: fixed;
	background:#F5F9FB;
	background: linear-gradient(to bottom, #FFFFFF 0%, #F5F9FB 100%) repeat scroll 0% 0% transparent;
    z-index: 999999;
}
#container-open.fixed {
    position: fixed;
    top: 8.0em; /* Just with Nav 'top: 2.875em;' with Branding top:8.0em; */
    margin: 0em 0em;
    right: 0.2em;
    z-index: 999;
    opacity: 1;
    filter: alpha(opacity=100); /* For IE8 and earlier */
}
#slide-out {
	text-align: left;
    padding: 0 0.2em;
    cursor: pointer;
    float: left;
}
.side-container-box {
	text-align: right;
    float:right;
    border-radius: 0.2em;
	line-height: 2.5em;
    margin: 0.2em auto;
}
/* = Filter
-------------------------------------------------------------- */
.filter .pj-slider input[type="button"].selected {
    font-size: 100%;
}
.filter .pj-slider.unselected {
    font-size: 100%;
}

.filter .pj-slider button,
.filter input[type="submit"],
.filter input[type="button"],
.filter input[type="reset"] {
	background: #CCCCCC; // Old browsers 
	background: -webkit-linear-gradient(top, #CCCCCC 0%, #999999 100%); // Chrome 10+, Safari 5.1+ 
	background:   linear-gradient(to bottom, #CCCCCC 0%, #999999 100%); // W3C 
	border: none;
	border-bottom: 0.30em solid #999999;
    color: #000000;
	border-radius: 0.15em;
	display: inline-block;
	padding: 0.3em 0.5em;
	text-decoration: none;
    line-height: 1.6em;
    font-size: 100%;
}
.filter .pj-slider button:hover,
.filter .pj-slider button:focus,
.filter .pj-slider input[type="submit"]:hover,
.filter .pj-slider input[type="button"]:hover,
.filter .pj-slider input[type="reset"]:hover,
.filter .pj-slider input[type="submit"]:focus,
.filter .pj-slider input[type="button"]:focus,
.filter .pj-slider input[type="reset"]:focus {
	background: #7FAFC9; // Old browsers 
	background: -webkit-linear-gradient(top, #68A1BF 0%, #7FAFC9 100%); // Chrome 10+, Safari 5.1+ 
	background:   linear-gradient(to bottom, #68A1BF 0%, #7FAFC9 100%); // W3C 
    border-bottom: 0.30em solid #5889A2;
	outline: none;
    font-size: 100%;
    margin: 0em 0em;
}
.filter .pj-slider button:active,
.filter .pj-slider input[type="submit"]:active,
.filter .pj-slider input[type="button"]:active,
.filter .pj-slider input[type="reset"]:active {
	background: #7FAFC9; // Old browsers 
	background: -webkit-linear-gradient(top, #68A1BF 0%, #7FAFC9 100%); // Chrome 10+, Safari 5.1+
	background:   linear-gradient(to bottom, #68A1BF 0%, #7FAFC9 100%); // W3C 
	border-bottom: 0.30em solid #5889A2;
	border: none;
	padding: 0.3em 0.5em;
    font-size: 100%;
}
.filter .pj-slider .selected,
.filter .pj-slider .selected input[type="submit"],
.filter .pj-slider .selected input[type="button"],
.filter .pj-slider .selected input[type="reset"] {
    color: #FFF;
	background: #7FAFC9; // Old browsers 
	background: -webkit-linear-gradient(top, #68A1BF 0%, #7FAFC9 100%); // Chrome 10+, Safari 5.1+
	background:   linear-gradient(to bottom, #68A1BF 0%, #7FAFC9 100%); // W3C 
	border-bottom: 0.30em solid #5889A2;
    font-size: 100%;
}
#myFilter {
    display: none;
    width:95%;
}
.filter {
	background:#F5F9FB;
	background: linear-gradient(to bottom, #FFFFFF 0%, #F5F9FB 100%) repeat scroll 0% 0% transparent;
	border-width: medium medium 2px;
	border-style: none none solid;
	border-color: -moz-use-text-color -moz-use-text-color #5889A2;
	-moz-border-top-colors: none;
	-moz-border-right-colors: none;
	-moz-border-bottom-colors: none;
	-moz-border-left-colors: none;
	border-image: none;
	border-radius: 6px;
	outline: medium none;
	border:2px solid #5889A2;
    font-size: 80%;

    border-radius: 0.2em;
    /*margin: 0.6em;*/
    padding: 0.3em;
    text-align:justify;
    float: right;
}
.filter.fixed {
    position: fixed;
    top: 10.0em; /* Just with Nav 'top: 2.875em;' with Branding top:8.0em; */
    right: 0.5em;
    z-index: 999;
    opacity: 1;
    filter: alpha(opacity=100); /* For IE8 and earlier */
	overflow: scroll;
}
/* row_filter-eg_10192 */
#filter_form ul.list.form li {
  margin-top: 2px;
  margin-bottom: 2px;
}
#kategori_filter .selected {
  color: #fff;
  background: #4b92b2;
  border: 1px solid #4b92b2;
}
div.list.form>li.selected, table.list.form>li.selected, ul.list.form>li.selected {
  background-color: #fff !important;
  border-top: 1px solid #f2f2f2 !important;
}
div.list.form>li, table.list.form>li, ul.list.form>li {
  display: table-row;
}

/* label-cell indent0 */
div.list.form > li.selected > div, div.list.form > li.selected li, table.list.form > li.selected > div, table.list.form > li.selected li, ul.list.form > li.selected > div, ul.list.form > li.selected li {
  background-color: #fff !important;
  border-top: 1px solid #f2f2f2 !important;
}
div.list.form > li .label-cell, table.list.form > li .label-cell, ul.list.form > li .label-cell {
  display: table-cell;
  width: 180px;
  padding: 0 8px 0 20px;
  vertical-align: middle;
}
div.list.form > li .label-cell, table.list.form > li .label-cell, ul.list.form > li .label-cell {
  display: table-cell;
  width: 180px;
  padding: 0 8px 0 20px;
  vertical-align: middle;
}

/* control-cell */
div.list.form > li.selected > div, div.list.form > li.selected li, table.list.form > li.selected > div, table.list.form > li.selected li, ul.list.form > li.selected > div, ul.list.form > li.selected li {
  background-color: #fff !important;
  border-top: 1px solid #f2f2f2 !important;
}
div.list.form > li .control-cell, table.list.form > li .control-cell, ul.list.form > li .control-cell {
  display: table-cell;
  padding: 5px 8px 5px 1px;
  position: relative;
  width: 790px;
}

/* eg_10192_slider */
div.list.form > li .control-cell .pj-slider, table.list.form > li .control-cell .pj-slider, ul.list.form > li .control-cell .pj-slider {
  height: 38px;
}
#kategori_filter .selected {
  color: #fff;
  background: #4b92b2;
  border: 1px solid #4b92b2;
}

/* textbox-container */
.pj-slider .textbox-container {
  float: right;
  z-index: 2;
  /*width: 220px;*/
  padding-left: 10px;
  white-space: nowrap;
  overflow: hidden;
}

/* textbox-left */
.pj-slider .textbox-container .textbox-left {
  display: inline-block;
  width: 2.2em;
}
div.list.form > li .control-cell .pj-slider .pj-slider-textbox, table.list.form > li .control-cell .pj-slider .pj-slider-textbox, ul.list.form > li .control-cell .pj-slider .pj-slider-textbox {
  color: #000;
  font-size: 14px;
  line-height: 18px;
  margin: 0;
  background-color: #fff;
}
div.list.form > li .control-cell input, table.list.form > li .control-cell input, ul.list.form > li .control-cell input {
  background-color: #f8f8f8;
  color: #5c5c5c;
  border-color: #e8e8e8;
  font-size: 14px;
  height: 29px;
  margin: -2px 0 -2px 0;
  line-height: 17px;
  -webkit-box-shadow: inset 0px 2px 5px rgba(0,0,0,0.05);
  -moz-box-shadow: inset 0px 2px 5px rgba(0,0,0,0.05);
  box-shadow: inset 0px 2px 5px rgba(0,0,0,0.05);
}

.input-container  {
  min-width: 140px;
  float: left;
  line-height: 2.5em;
  font-size: 1.2em;
  text-align: left;
  padding: 1em 0.5em;
}
.input-container input {
  min-width: 150px;
  max-width: 500px;
  padding-left: 5px;
  margin: 0em auto;  
  font-size: 1em;
}
.textbox-container  {
  min-width: 150px;
  float: right;
  line-height: 2.5em;
}
.textbox-container span {
  margin: 0em 0.2em;
}
.textbox-container input {
  width: 3.0em;
  font-size: 0.85em;
}
.pj-slider-textbox {
  text-align: right;
}
.textbox-container .textbox-separator {
  display: inline-block;
  width: 12px;
  padding-left: 3px;
}

/* textbox-right */
#kategori_filter .selected .textbox-right {
  color: #5c5c5c;
}
.pj-slider .textbox-container .textbox-right {
  display: inline-block;
  width: 95px;
}

/* bars-container */
.pj-slider .bars-container {
  height: 12px;
  margin: 0 170px 0 0;
  white-space: nowrap;
  overflow: hidden;
}
.pj-slider .slider-bars {
  margin-left: 14px;
  height: 12px;
  width: 100%;
  display: none;
}
.pj-slider .slider-bars .slider-bar {
  float: left;
  width: 50px;
  height: 12px;
  font-size: 12px;
  line-height: 12px;
  text-align: center;
}
#kategori_filter .selected .st_s {
  background: #93bed1;
  border: 0px !important;
}
.pj-slider .slider-bars .slider-bar .st_s {
  width: 16px;
  vertical-align: bottom;
}
.st_s {
  background-color: #4693b6;
  margin: 0px 5px 0px 0px;
  width: 8px;
  display: inline-block;
}

/* track-container */
.pj-slider .track-container {

}
.ui-slider-horizontal {
  height: 10px;
  background-color: #e0e1e2;
}
.ui-slider {
  position: relative;
  text-align: left;
  border-color: #d9dadd;
}
.ui-corner-all {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
.ui-widget-content {
  border: 1px solid #d9dadd;
  background: #fff;
  color: #5c5c5c;
}
.ui-slider-horizontal .ui-slider-range {
  top: -1px;
  height: 10px;
}
.ui-slider .ui-slider-range {
  position: absolute;
  z-index: 1;
  font-size: 7px;
  display: block;
  background: #4693b6;
  background-position: 0 0;
}

.ui-widget-header {
  border: 1px solid #8d8e90;
  color: #fff;
  font-weight: bold;
  background-color: #b2b3b7;
}
#kategori_filter .ui-slider-handle.left-handle, #kategori_filter .ui-slider-handle.right-handle {
  margin-left: -5px;
}
#kategori_filter .ui-slider-handle {
  border-radius: 20px;
  box-shadow: none;
  background-color: #f9f9f9;
  border: 1px solid #cccad2 !important;
}

.pj-slider {
  margin: 0em 1em;
  font-size: 0.8em;
  line-height: 1.5em;
}
/* ticks-container */
.pj-slider .ticks-container {
  margin: 0.4em 1em;
  font-size: 0.8em;
  line-height: 1.5em;
}
.pj-slider .slider-ticks {
  color: #8d8e90;
  white-space: nowrap;
  width: 100%;
}
.pj-slider .slider-ticks {
  color: #8d8e90;
  white-space: nowrap;
  width: 100%;
}
.pj-slider .slider-ticks .slider-ticks-label {
  display: inline-block;
  width: 50px;
  text-align: center;
}
* {
  -webkit-font-smoothing: antialiased;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.filter li {
  margin-top: 0px;
  margin-bottom: 0px;
  list-style-type: none;
}
.label-cell {
    float: left;
    min-width: 140px;
}
.slider {
    min-width: 250;
    max-width: 500px;
    padding-left: 5px;
    margin: 0em auto;
}
.pj-slider button .selected {
}
.pj-slider button .unselected {
}

/* = Account
-------------------------------------------------------------- */
#myAccount {
	background: #FFFFFF; /* Show a solid color for older browsers */
	border-width: medium medium 2px;
	border-style: none none solid;
	border-color: -moz-use-text-color -moz-use-text-color #5889A2;
	-moz-border-top-colors: none;
	-moz-border-right-colors: none;
	-moz-border-bottom-colors: none;
	-moz-border-left-colors: none;
	border-image: none;
	border-radius: 6px;
	outline: medium none;
	border:2px solid #5889A2;
    font-size: 100%;
    border-radius: 0.2em;
    padding: 0.3em;
    display: none;
    text-align:center;
    float: right;
    margin: -0.5em 4em 0em 0em;
    z-index: 999999;
}
#myAccount.startfixed {
    position: fixed;
    top: 9.4em; /* Just with Nav 'top: 2.875em;' with Branding top:8.0em; */
    margin: 0em 0em;
    right: 4em;
    z-index: 999999;
    opacity: 1;
    filter: alpha(opacity=100); /* For IE8 and earlier */
}
#myAccount.fixed {
    position: fixed;
    top: 8.0em; /* Just with Nav 'top: 2.875em;' with Branding top:8.0em; */
    margin: 0em 0em;
    right: 4em;
    z-index: 999;
    opacity: 1;
    filter: alpha(opacity=100); /* For IE8 and earlier */
}
#loginForm {
	background: #FFFFFF; /* Show a solid color for older browsers */
	background: -moz-linear-gradient(#FFFFFF, #FFFFFF);
	background: -o-linear-gradient(#FFFFFF, #FFFFFF);
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFFFFF), to(#FFFFFF>)); /* older webkit syntax */
	background: -webkit-linear-gradient(#FFFFFF, #FFFFFF);
	-webkit-box-shadow: rgba(0, 0, 0, 0.4);
	-moz-box-shadow: rgba(0, 0, 0, 0.4);
	box-shadow: rgba(0, 0, 0, 0.4);
}
#loginWrapper #loginLink {
	width:6em;
	height:2.5em;
	border-width: medium medium 0.2em;
	border-style: none none solid;
	border:0.2em solid #5889A2;
	border-color: -moz-use-text-color -moz-use-text-color #5889A2;
	-moz-border-top-colors: none;
	-moz-border-right-colors: none;
	-moz-border-bottom-colors: none;
	-moz-border-left-colors: none;
	border-radius: 0.4em 0.4em 0em 0.4em;
	background:#F5F9FB;
	background: linear-gradient(to bottom, #FFFFFF 0%, #F5F9FB 100%) repeat scroll 0% 0% transparent;
	outline: medium none;
	float:right;
	margin:0.6em 0.6em 0em;
	padding:0.35em;
    font-size: 80%;
    line-height: 1.75em;
    text-align: center;
    text-decoration: none;
    z-index: 9999;
    cursor: pointer;
}
#loginWrapper #accountLink {
	width:8em;
	height:2.5em;
	border-width: medium medium 0.2em;
	border-style: none none solid;
	border:0.2em solid #5889A2;
	border-color: -moz-use-text-color -moz-use-text-color #5889A2;
	-moz-border-top-colors: none;
	-moz-border-right-colors: none;
	-moz-border-bottom-colors: none;
	-moz-border-left-colors: none;
	border-radius: 0.4em 0.4em 0em 0.4em;
	background:#F5F9FB;
	background: linear-gradient(to bottom, #FFFFFF 0%, #F5F9FB 100%) repeat scroll 0% 0% transparent;
	outline: medium none;
	float:right;
	margin:0.6em 0.6em 0em;
	padding:0.35em;
    font-size: 80%;
    line-height: 1.75em;
    text-align: center;
    text-decoration: none;
    z-index: 9999;
    cursor: pointer;
}

#loginWrapper form {
	/*width:230px;*/
	/*height:95px;*/
	border-width: medium medium 0.2em;
	border-style: none none solid;
	border-color: -moz-use-text-color -moz-use-text-color #5889A2;
	-moz-border-top-colors: none;
	-moz-border-right-colors: none;
	-moz-border-bottom-colors: none;
	-moz-border-left-colors: none;
	border-image: none;
	border-radius: 0.4em 0em 0.4em 0.4em;
	outline: medium none;
	float:right;
	margin: -0.2em 0.6em 0.6em;
	padding:0.35em;
	border:0.2em solid #5889A2;
    font-size: 80%;
    line-height: 1.0;
    z-index: 999;
}
#loginFormWrapper {
    display: none;
}
#accountFormWrapper {
    display: none;
}
#loginWrapper form input[type="submit"] {
	width:6em;
	height:2.0em;
    font-size: 0.9em;
    line-height: 1.5em;
    text-align: center;
    padding:0.35em;
    float: right;
}
#loginWrapper .middleColumn {
	margin: 0.2em 0.2em;
	padding: 0.2em;
    width: 100%;
}

/* = Settings
-------------------------------------------------------------- */
#mySettings {
	border-width: medium medium 2px;
	border-style: none none solid;
	border-color: -moz-use-text-color -moz-use-text-color #5889A2;
	-moz-border-top-colors: none;
	-moz-border-right-colors: none;
	-moz-border-bottom-colors: none;
	-moz-border-left-colors: none;
	border-image: none;
	border-radius: 6px;
	outline: medium none;
	border:2px solid #5889A2;
    font-size: 100%;
    border-radius: 0.2em;
    padding: 0.3em;
    display: none;
    text-align:center;
    float: right;
    margin: -0.5em 4em 0em 0em;
    background: #FFFFFF;
}
#mySettings.fixed {
    position: fixed;
    top: 8.0em; /* Just with Nav 'top: 2.875em;' with Branding top:8.0em; */
    margin: 0em 0em;
    right: 4em;
    z-index: 999;
    opacity: 1;
    filter: alpha(opacity=100); /* For IE8 and earlier */
}
#mySettings img {
	max-width: 2.5em;
    max-height: 1.5em;
    padding: 0 0.2em;
    cursor: pointer;
    margin: 0.5em 0em;
}



/* = Footer
-------------------------------------------------------------- */

#colophon {
  clear: both;
}
#site-generator {
	font-size: 0.8em;
	line-height: 2.1em;
	padding: 2.2em 0.5em;
	text-align: center;
	background: #F5F9FB;
	border-top: 0.15em solid #68A1BF;
	color: #666666;
}
#site-generator a {
	font-weight: bold;
	color: #555555;
}
.site-info a {  /* Eduardo added */
	text-decoration: none;
	line-height: 2.1em;
	padding: 0 1.8em 0 0;
	display:inline-block;
	background-image:url('../../dv/css/img/cw-logo.png');
	background-size:1.5em; 2.1em;
	background-position: right center;
	background-repeat:no-repeat;
}

