/*!
Theme Name: Base WP - Sanctuary Hill Vineyard
Theme URI: http://www.sanctuaryhill.com.au/
Author: Sean Moten
Author URI: http://www.sanctuaryhill.com.au/
Template: base-wp
Description: This is a child theme of Base WP by iograficathemes.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: base-wp
Domain Path: /languages/
Tags: one-column, two-columns, left-sidebar, right-sidebar, flexible-header, custom-background, custom-colors, custom-header, custom-menu, featured-image-header, featured-images, footer-widgets, full-width-template, microformats, post-formats, sticky-post, theme-options, threaded-comments, translation-ready, blog, e-commerce
*/


/* base overrides to collapse menu later */
@media screen and (min-width: 600px) {
  .main-navigation {
    clear: both;
    display: block;
    float: left;
    width: 100%;
    border-top: 1px solid rgba(100, 105, 105, 0.1);
    border-bottom: 1px solid rgba(100, 105, 105, 0.1);
    margin-bottom: -1px;
  }
  .main-navigation ul {
    display: none;
    list-style: none;
    margin: 0;
    padding-left: 0;
    text-align: center;
  }
  .main-navigation ul:after {
    width: 100%;
    display: block;
    content: "";
    margin-bottom: -5px;
    height: 5px;
    background: -webkit-radial-gradient(50% -3%, ellipse cover, rgba(0, 0, 0, 0.2), rgba(97, 97, 97, 0) 40%);
    background: radial-gradient(ellipse at 50% 0%, rgba(0, 0, 0, 0.2), rgba(97, 97, 97, 0) 80%);
  }
  .main-navigation ul li {
    *float: left;
    display: inline-block;
    position: relative;
  }
  .main-navigation ul li a {
    display: block;
    padding: .9em 1em;
  }
  .main-navigation ul li:hover > ul,
  .main-navigation ul li.focus > ul {
    left: 0;
    right: auto;
  }
  .main-navigation ul ul {
    float: left;
    position: absolute;
    top: 100%;
    left: -999em;
    z-index: 99999;
    text-align: left;
    margin-top: 0;
  }
  .main-navigation ul ul:after {
    content: none;
  }
  .main-navigation ul ul li:hover > ul,
  .main-navigation ul ul li.focus > ul {
    left: 100%;
    width: 100%;
    margin-top: 0;
  }
  .main-navigation ul ul li a {
    width: 200px;
    padding: 15px;
  }
  .main-navigation ul ul ul {
    left: -999em;
    top: 0;
  }
  .main-navigation ul ul .menu-item-has-children > a:after {
    font-family: 'simple-line-icons';
    content: "\e606";
    position: relative;
    float: right;
    opacity: 0.5;
    filter: alpha(opacity=50);
  }
  .menu-toggle {
    display: none;
  }
  .main-navigation ul {
    display: block;
  }
}

article {
  border: none;
  padding: 0;
  background: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}

main {
  border: 1px solid rgba(100, 105, 105, 0.1);
  padding: 1em;
  background: rgba(255, 255, 255, 0.8);
  -moz-box-shadow: 0px 2px 2px rgba(100, 105, 105, 0.1);
  -webkit-box-shadow: 0px 2px 2px rgba(100, 105, 105, 0.1);
  box-shadow: 0px 2px 2px rgba(100, 105, 105, 0.1);
}



@import url(https://fonts.googleapis.com/css?family=Lora);
@import url(https://fonts.googleapis.com/css?family=Radley);
@import url(https://fonts.googleapis.com/css?family=Amethysta);
@import url(https://fonts.googleapis.com/css?family=PT+Serif);

body, label {
	font-family: 'PT Serif', serif;
}

/*resets*/

.widget {
  margin: 0 0 1.5em 0;
  border: none;
  padding: 0.25em;
  background: none;
  box-shadow: none;
}

.widget ul li {
  border: none;
  background: none;
}

.widget-area {
	/* i have a feeling this may come back to haunt me */
	width: auto;
}

/* globals */

a:hover {
	transition: all 0.25s linear
}

li:hover {
	transition: all 0.10s linear
}

hr {
	clear:both;
}


/* header */

.site-branding img {
	max-height: 30vh;
	width: auto;
}

@media screen and (min-width: 600px) {
	.site-branding {
		height: 150px;
		line-height: 150px;
	}

	.site-branding a {
		vertical-align: middle;
		margin-bottom: 0.25em;
	}
}

/* Widgets */

h3.widget-title {
	text-shadow: none;
    background: none;
    margin: 0;
    padding: 0;
    border: none;
    color: white;
}

.widget_text h3.widget-title:before {
	content:none;
}



.site-footer h3.widget-title {
	color: white;
}

/* content and such */

.cwc-photo-text {
	width: 100%;
	height: 20em;
	margin: 0 auto;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 50% 0%;
	color: white;
	text-shadow: 1px 1px 1px #000;
	margin-bottom: 0.75em;
	background-color: rgba(0,0,0,0.2);
	background-blend-mode: multiply;
}

.cwc-photo-text .cwc-photo-text-content {
	font-size: 1.5em;
	position: relative;
	top: 50%;
	transform: translateY(-50%);
	padding: 0.5em;
}

.cwc-photo-text .cwc-photo-text-content h3 {
	color: white;
	font-size: 1em;
	text-align: center;
}

.cwc-photo-text-content p {
	font-size: 0.8em;
}

.content-area
{
	float: none;
	margin: 0 auto;
	width: 100%;
}

/* Center content */
.content-area:last-child {
	margin: 0 auto;
}	

.main-navigation ul:after {
	display:none;
}

.header-widget-region
{
	padding:0;
	margin:0;
}

.site-content
{
	padding:0;
	margin: 0;
	max-width: none;
}

.menu-main-menu-container .menu.nav-menu > .current_page_ancestor, 
.menu-main-menu-container .menu.nav-menu > .current-menu-item  {
	border-bottom: 5px solid #720151; 
}

.menu-main-menu-container .menu.nav-menu > .menu-item:hover {
	border-bottom: 5px solid #26001b; /*dark*/
	border-bottom: 5px solid #be0287; /*light*/
}

/* wjy does this exist */
#header-navigation {
	display:none;
}

header.site-header {
	padding: 0.25em;
}

header a:focus {
	/*Hide outline when clicked*/
	outline: none; 
}

.main-navigation ul li:hover > a {
	/*TODO: better way*/
	color:lightgrey !important;
}

img.custom-logo {
	max-width: 360px;
	padding: 0.5em;
}


@media screen and (min-width: 500px) { 
	.main-navigation #primary-menu li a {
		padding: 10px;
	}
}

@media screen and (min-width: 970px) { 
	main.sidebar-active article {
		width: 50%;
		float: left;
	}

	aside.widget-area {
		width: 50%;
	}
}

/* For the /wines page the floating images produced by the WYSIWYG 
	editor cause the next to wrap so that one character is on one line 
	on small browser widths. 
 */
@media screen and (max-width: 500px) {

	.entry-content img {
		clear:both;
		float:none;
		margin: 0 auto;
		display: block;
	}

}

@media screen and (min-width: 600px) {
	header.site-header {
		/*transparent background
		background: rgba(0,0,0,0.80);
		position:absolute;
		z-index: 3;
		padding: 0.5em;
		width: 100%;
		max-height: 170px; */
		height: 10em;
	}

	img.custom-logo {
		border: none;
		max-height: 150px;
		width: auto;
		max-width: 100%;
		padding: 0;
	}

	.header-content {
		float: left;
		width: 40%;
	}

	.main-navigation {
		float: left;
		width: 60%;
		clear:none;
	}

	nav.main-navigation {
		background:none;
		border:none;
		padding-top: 2.5em;
	}

	nav.main-navigation a {
		color: white;
	}

	.content-area
	{
		width: 80%;
	}

	.cwc-photo-text .cwc-photo-text-content {
		padding: 1em;
	}

	.cwc-photo-text .cwc-photo-text-content h3 {
		color: white;
		font-size: 1.5em;
	}

	.cwc-photo-text-content p {
		font-size: 1em;
	}

	.cwc-photo-text .cwc-photo-text-middle {
		text-align: center;
	}

	.cwc-photo-text .cwc-photo-text-left{
		float: left;
		width: 60%;
		padding-left: 0.5em;
	}

	.cwc-photo-text .cwc-photo-text-right {
		float: right;
		width: 60%;
		padding-right: 0.5em;
	}
}

/*Footer*/
footer .menu {
	border:none;
}


/***
WooCommerce Overrides

do not use .woocommerce as that is a class on the <body>, use .woocommerce-wrapper instead

***/

.woocommerce-wrapper h1 {
	text-align: center;
}

.woocommerce-wrapper #content div.product div.images, .woocommerce-wrapper div.product div.images, .woocommerce-page #content div.product div.images, .woocommerce-page div.product div.images {
	width: auto;
	margin-right: 2em;
	float:left;
}

.woocommerce-wrapper div.product div.images img {
	max-height: 600px;
	max-height: 75vw;
	width: auto;
}

.woocommerce-wrapper #content div.product div.summary, .woocommerce-wrapper div.product div.summary, .woocommerce-page #content div.product div.summary, .woocommerce-page div.product div.summary {
	float:left;
}

.woocommerce-wrapper {
	text-align: center;
}

.woocommerce-wrapper div.product div.images img {
	margin: 0 auto;
}
.woocommerce-wrapper div.product form.cart, .woocommerce-wrapper div.product p.cart {
	display: inline-block;
}

.woocommerce-wrapper #content div.product div.images, .woocommerce-wrapper div.product div.images, .woocommerce-page #content div.product div.images, .woocommerce-page div.product div.images {
	width: 100%;
	margin-right: 2em;
	float:none;
}


.woocommerce-wrapper #content div.product div.images, .woocommerce-wrapper #content div.product div.summary, .woocommerce-wrapper div.product div.images, .woocommerce-wrapper div.product div.summary, .woocommerce-page #content div.product div.images, .woocommerce-page #content div.product div.summary, .woocommerce-page div.product div.images, .woocommerce-page div.product div.summary {
	width: 100%;
	margin: 0 auto;
}

@media only screen and (min-width: 769px) {
	.woocommerce-wrapper {
		text-align: center;
	}

	.woocommerce-wrapper div.product div.images img {
		margin: 0 auto;
	}

	.woocommerce-wrapper #content div.product div.images, .woocommerce-wrapper div.product div.images, .woocommerce-page #content div.product div.images, .woocommerce-page div.product div.images {
		width: 40%;
		padding-right: 1em;
		float:left;
	}
	

	.woocommerce-wrapper #content div.product div.summary, .woocommerce-wrapper div.product div.summary, .woocommerce-page #content div.product div.summary, .woocommerce-page div.product div.summary {
		width: 60%;
		margin: 0 auto;
	}
}



.woocommerce-wrapper ul.products li.product, .woocommerce-page ul.products li.product {
	width: 100%;
	border-bottom: 2px solid #720151;
	padding-bottom: 1em;
}

.woocommerce-wrapper ul.products li.product:last-child, .woocommerce-page ul.products li.product:last-child {
	border-bottom: none;
}

.woocommerce-wrapper ul.products li.product a img {
	max-height: 60vh;
	width: auto;
	margin: 0 auto;
}

.woocommerce-wrapper ul.products li.product a:hover {
	color: #444444;
}

@media screen and (min-width: 769px) {
	/* Product List */
	.woocommerce-wrapper ul.products, .woocommerce-page ul.products {
		width: 100%;
		max-width: 62em;
		text-align: center; 
		margin: 0 auto;
	}

	.woocommerce-wrapper ul.products li.product, .woocommerce-page ul.products li.product {
		width: 50%;
		margin: 0 auto;
		padding: 1em;
		border-bottom: none;
	}
}

/* Cart */

/* Expands the total div to 100%  */
.woocommerce-wrapper .cart-collaterals .cart_totals, .woocommerce-page .cart-collaterals .cart_totals {
	width:100%;
}


/* Checkout */

/* .woocommerce-wrapper doesn't appear on the page during checkout */
.woocommerce form .form-row label {
	font-size: 0.9em;
}

.woocommerce form .form-row {
	padding-bottom: 10px;
}

.checkout.woocommerce-checkout .col-1
{
	width: 100%;
}

.checkout.woocommerce-checkout .col-2
{
	width: 100%;
}

/* WP Store Locator */

#wpsl-search-wrap {
	padding: 1em;
}


/* Facebook Embed */
/* hides facebook embed if ad-block is present */
.fb-page blockquote {
	display: none;
}

.fb-page {
	width: 100%;
}

.fb-page.fb_iframe_widget span {
	margin: 0 auto;
	display: block;
}


/* Print styles to make website friendly with printers */
/* Print styles to make website friendly with printers */
@media print {
	*{
		color:black !important;	
		background-color: white !important;
	}

	.site-header button {
		display: none;
	}

	.site-header img {
		display:none;
	}

	.site-header .site-branding:after {
		content:url('/wordpress/wp-content/uploads/2016/08/logo-450px.png');
	}

	.menu-main-menu-container .menu.nav-menu > .menu-item {
		border:none;
	}

	.header-widget-region {
		display:none;
	}

	.site-footer  {
		display:block;
		border:none;
	}

	.site-footer:before {
		display:none;
	}

	.site-footer .widget_nav_menu {
		display:none;
	}

	.scroll-top, .social-url, .site-info {
		display:none !important;
	}

	.content-area {
		width: 100%;
	}

	.content-area main {
		border:none;
		box-shadow: none;
		padding: 0;
	}

	/* Styles below create an invoice like style on the order received page */
	body.woocommerce-order-received .menu-main-menu-container {
		display: none;
	}

	body.woocommerce-order-received .site-header .site-branding:after {
		content:url('/wordpress/wp-content/uploads/2016/08/logo-450px.png');
		zoom: 50%;
		margin-bottom: -200px;
		display:block;
		float:right;
	}
}