/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face*/

/* #Site Styles
================================================== */






/* =generic page layout */

#outer-wrapper {
 background:#FCFBF7 url(/images/body-bg.jpg) repeat top center;
}
#sky {
 position:absolute;
 background: #F8DF94 url(/images/home-header-sky.png) repeat-x left top;
 width:100%;
 height:30px;
 z-index:5;
 top:0;
 display:none;
}

#header-wrapper { 
 position:relative;
 background:#f8df94 url(/images/header-bg.gif) repeat-x center top;
 width:100%;
}
#header-container {
 position:relative;
 margin:0 auto;
 height:205px;
}
#header-container h1 {
 background:transparent url(/images/logo.png) no-repeat center top;
 height:200px;
 margin-bottom:0;
 position:absolute;
 text-indent:-900em;
 width:180px;
 margin-left:-90px;
 left:50%;
 z-index:10;
}
#header-container h1 a {
 display:block;
 width:180px;
 height:195px;
}


#content-container {
 padding:50px 0;
 margin:0px auto;
}
#content-container ul {
 list-style-type:disc;
 margin-left:30px;
}


/* =mail chimp mailing list signup */

#mc_embed_signup {
 position:absolute;
 font-size:11px;
 width:250px;
 height:25px;
 display:block;
 top:5px;
 right:0;
 z-index:10;
}
#mc_embed_signup label {
 position:absolute;
 top:0;
 left:0;
 font-size:11px;
}
#mc_embed_signup #mce-EMAIL {
 width:100px;
 font-size:10px;
 margin-left:110px;
}
#mc_embed_signup #mc-embedded-subscribe {
 position:absolute;
 top:0;
 right:0;
 height:20px;
 padding:3px 5px;
}


/* =back-to-things */ 

p.back-to-parent,
p.link-to-shop {
 margin-top:-14px;
}
p.back-to-parent a,
p.link-to-shop a {
 text-decoration:none;
 text-transform:uppercase;
 font-size:85%;
}
p.back-to-parent a:hover,
p.link-to-shop a:hover{
 text-decoration:underline;
}




/* =HIGHLIGHTS ------------------------------------- */
/* NOTE, not used by actual umbraco "Highlights" but rather as a callout on e.g. Accolades page... */
/* Note when you make a div a higlihght, the 1px border will throw off skeleton, so account for this or only put on inner div... */

div.highlight {
 background-color:#fff;
 padding:1em;
 margin-bottom:2em;
  position: relative;
  background-color: #f8f7ed;
  box-shadow: 0 1px 5px rgba(0,0,0,0.25), 0 0 50px rgba(0,0,0,0.1) inset;
  border-radius: 0%     0%     0%     0% /     0%     0%     0%     0%;
}


div.highlight h4 {
 font-family:sans-serif;
 color:#896832; /* move to standard site-wide H4 (greenish/brownish)??*/
 text-transform:uppercase;
 font-weight:bold;
 font-size:100%;
}



/* =NAV ------------------------------------- */

#nav,
#nav-container {
 position:relative;
 background:#4c4e16 url(/images/home-rep-bg-nav.gif) repeat-x right top;
 width:100%;
 margin:0 auto;
 height:55px;
}
ul#nav-list {
 font-weight: bold;
 color: white;
 text-align: center;
 margin: 0;
 padding-bottom: 5px;
 top: 31px;
}
#nav li {
 line-height: 18px;
 margin-bottom: 12px;
}

ul#nav-list > li {
 display: inline;
 border-right: 1px solid #000;
}
ul#nav-list > li:last-child {
 border-right-width:0;
}
#nav ul#nav-list > li {
 padding:0 7px;
}

ul#nav-list > li > a {
 padding: 0px 10px;
 color:#ffeb9f;
 text-decoration: none;
 text-shadow: 0px 1px 0px rgba(0,0,0,0); 
}
ul#nav-list > li > a.last,
ul#nav-list > li > a#last,
ul#nav-list > li:last-child > a {
 border-right-width:0;
}
ul#nav-list > li a:hover {
 color:#EBBE55;
}

/* =nav bottom border / active / hovering effect ------- */
ul#nav-list > li.active > a,
ul#nav-list > li.active:hover > a:hover {
 border-bottom:6px solid #030607;
 border-bottom:6px solid #FCFBF7;
}
/* actually invert entire active tab, not just changing bottom border effect */
#nav ul#nav-list > li.active {
 background-color: #FCFBF7;
 background-color: #DDD7B3;
 padding-top:6px;
 margin-top:-6px;
 margin-left:-1px;

}
#nav ul#nav-list > li.active > a {
 color:#4C4E16;
  
}
ul#nav-list > li.active > a, ul#nav-list > li.active:hover > a:hover {border-bottom:6px solid #DDD7B3;}
ul#nav-list > li:hover > a:hover {
 border-bottom:6px solid #EBBE55;
 border-bottom:6px solid #D2D3D6;
}


/* =SUB-NAVS ------- */
ul#nav-list li > ul {

 background-color: #D2D3D6;
 border:1px solid #FFF;
 background-color: #FFF;
 border:2px solid #D2D3D6;

 border-top-width:6px;
 top:24px;
 border-top-width:8px;
 top:18px;

 left:6px;
}
ul#nav-list li > ul a {
 padding-left:9px;
}




/* =SECTION NAV!! ================================================== */

#section-nav ul,
#section-nav li {
 list-style-type:none;
 margin:0;
 padding:0;
}
#section-nav ul {
 margin-top:2em;
}
#section-nav li {
 margin:6px;
 padding-bottom:6px;
 border-bottom:1px solid #DEDBC8;
 font-family: "Georgia","Times New Roman",serif;
 font-weight:bold;
 font-size:1.1em;
 text-align:center;
 text-transform:lowercase;
}
#section-nav li:last-child {
 border-bottom-width:0;
}

#section-nav a {
 text-decoration:none;
 display:block;
 padding:6px;
 margin:0 1em;
 background-color:transparent;
 color:#B07A42;
} 
#section-nav a:hover {
  background-color:#B07A42;
 color:#FCFBF7;
} 



/* =MINICART!! ================================================== */

/* in desktop+ mode, #header-container is 765px wide and logo stops at 355px */
/* refer to media queries for adjusting this as needed as width shrinks */


#header-container a { text-decoration:none; }
#header-container a:hover { text-decoration:underline; }

#wineshop {
 position:absolute;
 top:55px;
 left:140px;
 right:inherit;
 height:62px;
 padding:0;
 background:transparent url('/images/wineshop.png') no-repeat left top;
 padding-left:70px;
 padding-top:14px;
 text-align:center;
 line-height:20px;
 display:none;
}
a#wineshop-link,
a#account-link {
 color:#B8B441;
}
a#wineshop-link:hover,
a#account-link:hover {
 color:#DBD44E;
}
a#wineshop-link {
 font-size:.9em;
 text-transform:uppercase;
 font-weight:normal;
}
a#account-link {
 font-size:0.6em;
 text-transform:uppercase;
 font-weight:normal;
}

#xe-minicart {
 position:absolute;
 top:30px;
 right:0;
 padding:0;
 z-index:10;
}
#xe-minicart,
#xe-minicart span,
#xe-minicart a {
 color:#000;
 font-size:0.9em;
}

#xe-minicart ul,
#xe-minicart li {
 padding:0;
 margin:0;
 list-style-type:none;
 line-height:1.2;
 text-align:center;
}
#xe-minicart li {
 text-align:left;
 float:none;
 display:inline;
 padding:4px;
}

#xe-minicart li a {
 border-bottom:1px dotted #AF9F69;
}
#xe-minicart li a:hover {
 text-decoration:none;
 border-style:solid;
}

#xe-minicart-quantity:before {
 content: "CART: ";
}
#xe-minicart .second {
 display:none;
}

/* =SIDEBAR HIGHLIGHT!! Note the increase in specifity if styling LI's versus DIVs
================================================== */

#sidebar-highlight,
.sidebar-highlight,
#content-container div.sidebar-highlight {
 border:1px solid #4C4E16;
 background: #FFF url('/images/photo-truck-220x420-blank.jpg') no-repeat center bottom;
 padding:15px 20px 270px;
 font-size:85%;
 margin-bottom:1em; 
 min-height:240px;
}
#sidebar-highlight h3,
.sidebar-highlight h3 {
 color:#4C4E16;
}
#sidebar-highlight p,
.sidebar-highlight p {
 line-height:1.2;
}

#sidebar-controlpanel {
 text-align:center;
}



/* =FOOTER 
================================================== */

#footer-wrapper {
 position:relative;
 background:url(/images/footer-rep-bg.jpg) repeat-x center bottom;
 width:100%;
 height:155px;
 padding:0px;
}
#footer-container {
 padding-top:50px;
}


/* =Search- 
================================================== */

#search-container {
	position: relative;
	float: left;
	margin: 30px 0;
	padding: 0px;
}

#search-container .search-label {
	color: #DADBCC; 
	font-size: 24px;
	font-family: "Georgia", "Times New Roman", serif;
}

#search > * {
	display: inline-block;
	vertical-align: middle;
	margin: 0;
	padding: 0;
	max-width: 250px;
}

#search > [id^="___gcse_"] {
	width: 250px;
	margin-left: 10px;
}

[id^="___gcse_"],
[id^="___gcse_"] * {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
}
[id^="___gcse_"] table {
  margin: 0;
}
[id^="___gcse_"] div[style*="google_custom_search_watermark.gif"] {
  display: none !important;
}
[id^="___gcse_"] form.gsc-search-box {
  margin: 0 !important;
}
[id^="___gcse_"] form.gsc-search-box table.gsc-search-box {
  margin: 0 !important;
}
[id^="___gcse_"] form.gsc-search-box td.gsc-input,
[id^="___gcse_"] form.gsc-search-box td.gsc-search-button {
  display: inline-block;
  vertical-align: middle;
}
[id^="___gcse_"] form.gsc-search-box td.gsc-input {
  width: calc(100% - 35px);
  padding: 0 0 0 30px;
  background: white url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2732%27%20height%3D%2732%27%20data-icon%3D%27magnifying-glass%27%20viewBox%3D%270%200%2032%2032%27%20fill%3D%27%23AAAAAA%27%3E%3Cpath%20d%3D%27M12%200C5.39%200%200%205.39%200%2012s5.39%2012%2012%2012c2.74%200%205.257-.944%207.28-2.5l1.595%201.625-.53.53a.478.478%200%200%200%200%20.69l7.312%207.312a.478.478%200%200%200%20.688%200l3.313-3.313a.478.478%200%200%200%200-.688l-7.313-7.313a.478.478%200%200%200-.688%200l-.625.625-1.594-1.594A11.923%2011.923%200%200%200%2024%2012c0-6.61-5.39-12-12-12zm0%203c4.988%200%209%204.012%209%209s-4.012%209-9%209-9-4.012-9-9%204.012-9%209-9z%27/%3E%3C/svg%3E") 5px 50% no-repeat;
  -webkit-background-size: auto 60%;
  -moz-background-size: auto 60%;
  background-size: auto 60%;
  font: normal 14px/1.2 Lato, sans-serif;
  line-height: 1.2;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid #AAA;
}
[id^="___gcse_"] form.gsc-search-box td.gsc-input .gsc-input-box {
  height: auto;
  border: none;
  background: transparent !important;
}
[id^="___gcse_"] form.gsc-search-box td.gsc-input .gsc-input-box.gsc-input-box-hover,
[id^="___gcse_"] form.gsc-search-box td.gsc-input .gsc-input-box.gsc-input-box-focus {
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}
[id^="___gcse_"] form.gsc-search-box td.gsc-input .gsc-input-box .gsib_a {
  padding: 0;
}
[id^="___gcse_"] form.gsc-search-box td.gsc-input input {
  height: 28px !important;
  background: transparent !important;
  border: none !important;
}
[id^="___gcse_"] form.gsc-search-box td.gsc-input input:focus {
  outline: none;
  box-shadow: none !important;
}
[id^="___gcse_"] form.gsc-search-box td.gsc-input .gsib_b {
  padding: 0;
}
[id^="___gcse_"] form.gsc-search-box td.gsc-input .gsib_b .gsst_b {
  padding: 0 !important;
}
[id^="___gcse_"] form.gsc-search-box td.gsc-input .gsib_b .gsst_b .gsst_a {
  display: block;
  padding: 0 8px;
  text-decoration: none;
}
[id^="___gcse_"] form.gsc-search-box td.gsc-input .gsib_b .gsst_b .gsst_a .gscb_a {
  display: block;
  font-size: 25px;
  line-height: 28px;
  color: #694b27;
}
[id^="___gcse_"] form.gsc-search-box td.gsc-search-button {
  width: auto;
  margin: 0 0 0 5px;
  padding: 0 !important;
}
[id^="___gcse_"] form.gsc-search-box td.gsc-search-button input {
  display: block;
  height: 30px;
  width: 0 !important;
  margin: 0;
  padding: 0 0 0 28px;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20data-icon%3D%22arrow-thick-right-line-large%22%20width%3D%2216%22%20height%3D%2216%22%20data-container-transform%3D%22translate%280%201%29%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22%23B8B63F%22%3E%3Cpath%20d%3D%22M4.5%201l5%205H0v4h9.5l-5%205H9l7-7-7-7H4.5z%22/%3E%3C/svg%3E");
  background-position: 50% 50%;
  background-repeat: no-repeat;
  -webkit-background-size: 60% auto;
  -moz-background-size: 60% auto;
  background-size: 60% auto;
  background-color: #29290F;
  text-transform: uppercase;
  font-family: Lato, sans-serif;
  -webkit-transition: all 0.15s linear;
  -moz-transition: all 0.15s linear;
  -o-transition: all 0.15s linear;
  -ms-transition: all 0.15s linear;
  transition: all 0.15s linear;
  line-height: 1.2;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid transparent;
}


/* =Social - Facebook/Twitter
================================================== */
#social-icons {
 position: relative;
 float:right;
 margin:30px 0;
 padding:0px;
 width:160px;
 height:40px;
 }
#social-icons li {
 list-style:none;
 width: 40px;
 height: 40px;
 float:left;
}
#social-icons a {
 width: 40px;
 height: 40px;
 display: block;
 background:transparent url(/images/social-icons.png) 0 0 no-repeat;
 text-indent:-900em;
}

/* Individual social icon positioning and sprite configuration */



#social-icons #facebook a {
 background-position: 0px 0px;
}
#social-icons #twitter a {
 background-position: -40px 0px;
}
#social-icons #envelope a {
 background-position: -80px 0px;
}
#social-icons #shop a {
 background-position: -120px 0px;
}
#social-icons #facebook a:hover {
 background-position: 0px -40px;
}
#social-icons #twitter a:hover {
 background-position: -40px -40px;
}
#social-icons #envelope a:hover {
 background-position: -80px -40px;
}
#social-icons #shop a:hover {
 background-position: -120px -40px;
}


/* =CREDITS a.k.a. =FOOTER
================================================== */

#credits {
 display:block;
 float:none;
 clear:both;
 overflow:hidden;
 margin-top:2.0em;
}
#credits li {
 margin-left:15px;
 float:left;
}
#credits {
 color:#1F2009;
}
#credits a {
 text-decoration:none;
 color:#8B8E36;
 color:#797A42;
}
#credits a.active {
}
#credits a:hover {
 text-decoration:underline;
}


/* #Page Styles
================================================== */



/* =ACCOLADES */
#accolades-page {
}



/* =DISTRIBUTORS */
#distributors-page table {
 width:100%;
}
#distributors-page table th,
#distributors-page table td {

 text-align:left;
 padding:0.8em 0.5em;
 line-height:1;
}
#distributors-page table th:first-child,
#distributors-page table td:first-child {
 padding-left:0;
}
#distributors-page table th {
 font-size:130%;
 color:#C99166;
 padding-top:1em;
 padding-bottom:0.5em;
}
#distributors-page table td {
 border-top:1px solid #E8E7E2;
}

table tr.striped td {
 background-color:#F3F1E5;
}
#distributors-page h3#search-result-header {
 margin:1em 0 0;
}
#distributors-page table tbody tr:not(:first-child) td:first-child {
 color:transparent;
}






/* vineyards highlight */
body#cms-document-1146 .sidebar-highlight {
 height:300px;
 min-height:300px;
 background: -50px;
 padding:0;
 margin:0;
}
body#cms-document-1146 .sidebar-highlight div {
 display:none;
}


/* trade highlight */
body#cms-document-1150 .sidebar-highlight {
 height:350px;
 min-height:350px;
 background:center -330px;
 padding:0;
 margin:0;
}
body#cms-document-1150 .sidebar-highlight div {
 display:none;
}


/* community highlight */
body#cms-document-1166 .sidebar-highlight {
 height:300px;
 min-height:300px;
 background:center -20px;
 padding:0;
 margin:0;
}
body#cms-document-1166 .sidebar-highlight div {
 display:none;
}


/* contact highlight */
body#cms-document-1151 .sidebar-highlight {
 height:550px;
 min-height:550px;
 background:left -110px;
 padding:0;
 margin:0;
}
body#cms-document-1151 .sidebar-highlight div {
 display:none;
}


/* winemaking highlight */
body#cms-document-1062 .sidebar-highlight {
 height:350px;
 min-height:350px;
 background:center -200px;
 padding:0;
 margin:0;
}

/* privacy highlight */
body#cms-document-1063 .sidebar-highlight {
 height:740px;
 min-height:740px;
 background:-160px 0px;
 padding:0;
 margin:0;
}
body#cms-document-1063 .sidebar-highlight div {
 display:none;
}

/* terms highlight */
body#cms-document-1289 .sidebar-highlight {
 height:700px;
 min-height:700px;
 background:-130px 0px;
 padding:0;
 margin:0;
}
body#cms-document-1289 .sidebar-highlight div {
 display:none;
}









/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/




/* #Media Queries
================================================== */

/* 0. Deal with Nav issues separately from rest of following queries below */
@media only screen and (max-width: 1100px) {
	#nav {
	 font-size:95%;
	}
	#nav > ul > li > a {
	 padding:0 4px;
	}
	
	
	
	
}

/* 1. Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 959px) {

	/*#nav {
	 height:80px;
	}*/
	#nav li {
	}
	#nav li a {
	 border-bottom:6px solid transparent;
	}


}

/* 2. Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 959px) {




		body.debug::before{
			content: "Responsive layout #2 activated";
			font-weight: bold;

			display: block;
			text-align: center;
			background: rgba(255,255,0, 0.9);   /* Semi-transparent yellow */
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			z-index: 99;
		}
}

/* 3. All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {



	#nav {
	 height:auto;
	 
	 padding-bottom:1.5em;

	}
	#nav:after {
	 content: "\0020"; display: block; height: 0; clear: both; visibility: hidden;
	}
	#nav ul.sf-menu#nav-list {
	 float:none;
	 left:-225px;
	}
	#nav ul.sf-menu#nav-list li {
	 clear:left;
	 border-right-width:0;
	}

	#nav ul.sf-menu#nav-list ul {
	 z-index:999;
	 margin-left:1em;
	 top:0;
	 left:100%;
	}


	/* =nav bottom border and its hovering effect ------- */
	ul#nav-list > li.active > a,
	ul#nav-list > li.active:hover > a:hover {
	 border-bottom-width:3px;
	 margin-bottom:3px !important;
	}
	ul#nav-list > li:hover > a:hover {
	 border-bottom-width:3px;
	 margin-bottom:3px !important;
	}


	/* minicart reformat for all mobile */
	#header-container {
	}
	#wineshop, #xe-minicart {
	 top:inherit;
	 left:inherit;
	 right:inherit;
	 bottom:0;
	 left:35%;
	 position:absolute;
	 font-size:90%;
	 line-height:1;
	}



	#sidebar-highlight { background-image:none; padding:20px; margin-top:2em; }
	#sidebar-highlight p { line-height:1.5; }

	#sidebar-container {  }

	#sidebar-list { }


	/* cart layout changes at this size and smaller - note, loading these before xe_client.css, so need to make more specific */
	div.mpx-products-container .mpx-product {
	 height:auto;
	}
	div.mpx-products-container .fixed-height-container {
	 height:auto;
	}
	div.mpx-products-container .mpx-product-img-column img {
		max-height:220px;
	}
	
}

/* 4. Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {

	




		body.debug::before{
			content: "Responsive layout #4 activated";
			font-weight: bold;
			display: block;
			text-align: center;
			background: rgba(255,255,0, 0.9);   /* Semi-transparent yellow */
			position: absolute;
			top: 0;

			left: 0;
			right: 0;
			z-index: 99;
		}
}

/* 5. Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {


	

	#nav ul.sf-menu#nav-list {
	 float:none;
	 left:-160px;
	}


		body.debug::before{
			content: "Responsive layout #5 activated";
			font-weight: bold;
			display: block;
			text-align: center;
			background: rgba(255,255,0, 0.9);   /* Semi-transparent yellow */
			position: absolute;
			top: 0;

			left: 0;
			right: 0;
			z-index: 99;
		}

}