/*
 Theme Name:     	jw•storefront
 Description:    	Custom theme for Jenni Ward (child theme of Storefront WooTheme)
 Author:         	Priscilla Shih Cinque
 Author URI:     	https://www.zaptuba.com
 Template:       	storefront
 Version: 				1.0.3
 Text Domain:  		jenniward-storefront
*/

/* =Theme customization starts here
-------------------------------------------------------------- */
body {
  font-family: HelveticaNeue-Light, "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
	background: #fcfcfc;
}

img {
  border-radius: 0px;
  display:  inline-block;
}

a:focus {
	outline: 0;
}
a:hover {
  color:  #ff4800;
}

.input-text, 
input[type="email"], 
input[type="password"], 
input[type="search"], 
input[type="text"], 
input[type="url"], 
textarea {
	max-width: 100%;
	padding: .3em;
}

.hentry {
	margin-bottom: 0;
}

.hentry .entry-header {
	border-bottom: none;
}

.entry p {
	text-align: justify;
}

.post {
	border-bottom: dotted 1px #999999;
}

article.post:last-child,
.single.single-post .post {
	border-bottom:  none;
}

.post .post-meta {
	border-bottom: none;
}

.post .post-meta ul {
	display: none;
}

.type-post aside.meta {
  float: right;
}

.type-post aside.meta a {
	display: none;
}

.type-post .post-content {
	width: auto;
	float:  none;
}

/* The Magnificent Clearfix: Updated to prevent margin-collapsing on child elements.
   j.mp/bestclearfix */
.fix:before,
.fix:after,
.col-full:before,
.col-full:after {
  content: "\0020";
  display: block;
  height: 0;
  overflow: hidden;
}
.fix:after,
.col-full:after {
  clear: both;
}

/*** Typography ***/
h1,
h2,
h3,
h4,
h5,
h6 {
	clear: none;
	margin: 0 0 0 0;
	font-family: Raleway, HelveticaNeue-Light, "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}

.menu-item,
.entry-title {
  	font-family:  Raleway, HelveticaNeue-Light, "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}

.secondary-navigation .menu .menu-item {
  	font-family: "Special Elite", HelveticaNeue-Light, "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  	font-weight: 700;
}

.main-navigation ul.menu ul li a, .main-navigation ul.nav-menu ul li a {
  	font-size: 1.4em;
	text-transform: lowercase;
}

.main-navigation ul.menu>li>a, .main-navigation ul.nav-menu>li>a {
  	font-size: 1.4em;
	text-transform: lowercase;
}

.entry-title {
  	text-transform: lowercase;
}

.series-title {
  text-transform: capitalize;
}

.custom-footer-right .copyright {
	font-size: .8em;
	text-align: right;
}

/*** Colors ***/
.site-header {
	background-color: #fcfcfc;
}

.site-footer {
  background-color:  #f7f7f7;
}

/*** Captions ***/
.wp-caption .wp-caption-text {
	text-align: center;
	font-style: normal;
	border-bottom: none;
	padding: .5em 0;
}
/*** Header ***/
.home.blog .site-header, 
.home.page:not(.page-template-template-homepage) .site-header,
.page-template-template-fullwidth-php .site-header {
	margin-bottom: 2em;
}
.page-header,
.woocommerce-products-header {
	margin: 1em 0;
}

.site-header .site-branding {
  width:  auto;
  max-width:  40%;
}

.site-header .custom-logo-link img {
  max-width:  100%;
}

.storefront-breadcrumb {
  display: none;
}

.storefront-full-width-content .woocommerce-products-header {
  padding-bottom: 0px;
}

/*** Navigation ***/
button.menu-toggle:before,
button.menu-toggle:after,
button.menu-toggle span:before {
  left:  1.3em;
}

#site-navigation .menu-toggle {
  /*** For the smartphone, position the menu toggle to the right of the logo ***/
  position: absolute;
  right: 2.5em;
  top: 2.5em;
  font-size: 1em;
  padding-top: 2em;
  background-color: transparent;
  background-image: none;
  border: 1px solid #888888;
  -webkit-border-radius: 0px;
  border-radius: 0px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
}

.main-navigation ul li a, 
.site-title a, ul.menu li a {
  color: rgb(102,102,102);
}

.site-header .secondary-navigation ul.menu li.current-menu-item > a {
  color: #404040;
}

.main-navigation ul ul li a, 
.secondary-navigation ul ul li a {
	width: 280px;
}

.main-navigation .primary-navigation ul.nav-menu > li.current-menu-ancestor > a,
.main-navigation .primary-navigation ul.nav-menu > li.current-page-ancestor > a,
.main-navigation .primary-navigation ul.nav-menu > li.current_page_parent > a,
.main-navigation .primary-navigation ul.nav-menu > li.current_page_item > a {
    color: #ff4800;
	font-weight: 400;
}
  
.main-navigation .primary-navigation ul.sub-menu > li.current_page_item a,
.main-navigation .primary-navigation ul.sub-menu > li.current-page-ancestor a,
.main-navigation .primary-navigation ul.sub-menu > li.current-menu-item a {
	color: #ff4800 !important;
}

/* Implement Handheld menu as sidebar that slides out from the left on top of the website */
/* instead of pushing all of the contents down below the bottom of the Handheld menu */
.handheld-navigation {
  position: fixed;
    top: 0;
    left: -80%;
    width: 80%;
    height: 100%;
    transition: left 0.2s;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    -webkit-transition: left 0.2s;
    -moz-transition: left 0.2s;
    -ms-transition: left 0.2s;
    -o-transition: left 0.2s;
    transition: left 0.2s;
    z-index: 9999;
    display: block !important;
  	background-color: rgba(255,255,255,0.96);
}

.main-navigation.toggled .handheld-navigation {
    left: 0;
    box-shadow: 0 0 2em rgba(0, 0, 0, 0.7); 
}

.handheld-navigation ul li a {
    padding: .857em 1.387em;
}

.handheld-navigation .menu>.menu-item {
  border-bottom: 1px solid #333333;
}

.handheld-navigation .menu>.menu-item-has-children>a,
.handheld-navigation .sub-menu>.menu-item {
  border-bottom: 1px dotted #333333;
}

.handheld-navigation .menu>.menu-item:last-child,
.handheld-navigation .sub-menu>.menu-item:last-child {
  border-bottom: none;
}
    
/*** ***/
.jwa-standard-page.cart-empty .nav.footer-menu,
.jwa-standard-page.cart-empty .nav.wc-nav,
.jwa-standard-page.cart-empty #site-header-cart,
.jwa-standard-page.cart-empty .site-search,
.jwa-standard-page.cart-empty .storefront-handheld-footer-bar {
  display: none;
}

/*** Footer ***/
.site-footer {
	padding-bottom: 0;
}

.zaptuba-credit {
	font-size: 0.8em;
	display: block;
	color: #877c78;
}

.zaptuba-credit > a {
	font-weight: normal;
	color: #877c78;
}

.site-info {
	padding-top: 1em;
	text-align: center;
}

/*** Archives & Categories ***/
.category header h1.page-title,
.archive header h1.page-title,
.single header h1,
.page-parent .page header h1,
.type-page header h1,
.woocommerce-page .section-title,
.woocommerce-page article header h1 {
	color:  #666666;
	text-align: center;
	border-top: dotted 1px #999999;
	border-bottom: dotted 1px #999999;
	margin-bottom: .25em;
}

.category .archive-rss a:before {
  font-family: 'FontAwesome';
  display: inline-block;
  font-size: .857em;
  margin-right: .618em;
  font-weight: normal;
  content: "\f09e";
  color: orange;
}

.category .archive-rss {
	text-align: center;
	margin-top:.75em;
}

.category.category-events .archive-rss {
  	display: none;
}

/*** The Dirt ***/
.category.category-the-dirt .archive-description {
	text-align: center;
	margin: 0 auto;
}
.category.category-the-dirt .archive-description form {
  	margin-bottom: 0;
}

.category.category-the-dirt .archive-description .name-field,
.category.category-the-dirt .archive-description .email-field {
  width:  90%;
}
.category.category-the-dirt .archive-description .subscribe-form-singleline .name-field,
.category.category-the-dirt .archive-description .subscribe-form-singleline .email-field {
  width:  100%;
}
.category.category-the-dirt .archive-description input[type="submit"] {
  background: none;
  color:  #ff5911;
  text-shadow: none;
  box-shadow: none;
  border: dotted 1px #ff5911;
  margin-top: 1em;
}

/*** Portfolio ***/
.portfolio-video-container {
	margin-top:2em;
	padding-top:2em;
	border-top: dotted 1px #999999;
}

/* @group Press custom post type */
/*** Press ***/

article.jwa_press {
	border-bottom: dotted 1px #999999;
	padding: .5em 0;
	margin: 0 1em;
}

article.jwa_press:last-child {
	border-bottom: none;
}

.press-title a {
	color:  #ff5911;
}

.press-publish-date {
	float: right;
}

.press-video-wrapper {
	max-width: 960px;
	margin: 1em auto 0;
	text-align: center;
}
/* @end */

/* @group Contact Form */
.join-form {
  text-align:  center;
  border:  1px dashed #999999;
  padding-top: 1.5em;
}

.form-label img {
	vertical-align: middle;
}

img.wpcf7-captchac {
  display: inline;
  border: none;
  background-color:  #fcfcfc;
}

ul.ctct-lists {
  list-style-type: none;
}

.wpcf7 .subscribe-form .mc4wp-checkbox,
.wpcf7 .subscribe-form-singleline .mc4wp-checkbox,
.wpcf7 .join-form .mc4wp-checkbox,
#the_dirt_checkbox,
#monthly_news_checkbox {
  display: none;
}

/* @end */

/* @group Checkout */

.ssl-badge {
  text-align: right;
  float: right;
}

/* @end */

/* @group Shop */

.single-product div.product {
	margin-top:1em;
}
.single-product .summary.entry-summary {
  	clear: both;
}
.storefront-full-width-content.single-product div.product .woocommerce-product-gallery.woocommerce-product-gallery--columns-4 .woocommerce-product-gallery__image:not(:first-child) {
  display: inline-block;
}

/* Override Storefront WooCommerce Tab - Hide the Tab title since it seems redundant */
.single-product .wc-tab h2 {
	display:none;
}

/* @end */

/* @group Galleries */
/*** Responsive Gallery Grid - Custom Caption Styles ***/
.metaslider .caption-wrap,
.rgg-caption-container .rgg-caption,
.wp-block-image .wp-element-caption {
	font-family: Raleway, HelveticaNeue-Light, "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif !important;
  background: none !important;
	background-color: rgba(128,128,128,0.9) !important;
  color: #eeeeee !important;
  font-size: 22px !important;
  text-align: right !important;
  padding: 0px 10px !important;
  text-transform:  lowercase;
  font-weight: 300 !important;
}

.wp-block-gallery.has-nested-images figure.wp-block-image {
	flex-grow: 0;
}

.metaslider .caption-wrap {
  opacity: 1.0 !important;
}

/* @end */

@media screen and (max-width: 480px) {
	/* Smartphone Portrait Orientation */
	.metaslider .caption-wrap {
    	font-size: 18px !important;
    	padding: 0px 5px !important;
    	line-height: 1em !important;
 	}
}

@media (min-width: 768px) {
	/* Tablet Portrait Orientation, Tablet Landscape Orientation, Desktop */
	.col-full-responsive {
		margin-left: 0;
		margin-right: 0;
		padding: 0;
		box-sizing: content-box;
	}
	
	/* Header */
	.site-header {
		padding-top: 1em;
  		border-bottom: none;
	}	
	
	/* Branding */
	.site-header .site-branding {
		float:  none !important;
	  clear:  none;
	  margin-top: .5em;
	  margin-right: 0;
		max-width: 100%;
	}
	
	/* Top (Secondary) Navigation */
	.secondary-navigation {
  		margin-bottom: 1em;
  	}
	
	.secondary-navigation .menu {
		font-size: 1em;
		float: none;
	}

	.secondary-navigation .menu a {
  		padding: 1em .875em;
	}
	
	.secondary-navigation .menu .menu-item:first-child a{
		padding-left: 0;
	}
	
	.woocommerce-active .site-header .site-header-cart {
		width:auto;
		margin-right: 2em;
	}
	
	.woocommerce-active .site-header-cart .cart-contents {
		padding: .75em 0 1em 0 !important;
	}
	
	.woocommerce-active .site-header-cart .cart-contents .count {
		margin-right: 1em;
	}
	
	.woocommerce-active .site-header-cart .widget_shopping_cart {
		min-width: 150%;
	}
	
	.woocommerce-active header .widget_product_search,
	.site-search {
  		margin-bottom:  0.5em;
	}
	
	/* Primary Navigation */
	
		/** Adapted from mystile theme **/ 
	.main-navigation .primary-navigation ul.nav-menu > li a {
		border: 1px solid transparent;
		background: none;
		text-transform: lowercase;
	  	-webkit-border-radius: 0.236em;
	  	border-radius: 0.236em;
	  	-moz-background-clip: padding;
	  	-webkit-background-clip: padding-box;
	  	background-clip: padding-box;
	}
	.main-navigation .primary-navigation ul.nav-menu > li a:hover {
	  	border-color: #e8e4e3;
	  	background: #fff;
	}
	.main-navigation .primary-navigation ul.nav-menu > li:hover a {
		border-color: #e8e4e3;
		background: #fff;
	}
	.main-navigation .primary-navigation ul.nav-menu > li.menu-item-has-children a {
	-webkit-border-bottom-left-radius: 0;
	-webkit-border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	-moz-background-clip: padding;
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
	}
	.main-navigation ul.menu > li.menu-item-has-children > a::after, 
	.main-navigation ul.menu > li.page_item_has_children > a::after, 
	.main-navigation ul.nav-menu > li.menu-item-has-children > a::after, 
	.main-navigation ul.nav-menu > li.page_item_has_children > a::after {
		margin-left: .5em;
	}
	.main-navigation .primary-navigation ul.nav-menu > li.menu-item-has-children a:hover:before {
	content: "";
	display: block;
	height: 2px;
	position: absolute;
	bottom: -1px;
	left: 0;
	right: 0;
	background: #fff;
	z-index: 100000;
	}
	.main-navigation .primary-navigation ul.nav-menu > li.menu-item-has-children:hover a:before {
	content: "";
	display: block;
	height: 2px;
	position: absolute;
	bottom: -1px;
	left: 0;
	right: 0;
	background: #fff;
	z-index: 100000;
	}
	.main-navigation .primary-navigation ul.nav-menu > li.menu-item-has-children:hover a:after {
	color: #ff4800;
	}
	.main-navigation .primary-navigation ul.nav-menu ul {
	border: 1px solid #e8e4e3;
	margin-top: -1px;
	padding: .372em 0;
	box-shadow: 0 0.202em 0 0 rgba(232, 228, 227, 0.4);
	-webkit-box-shadow: 0 0.202em 0 0 rgba(232, 228, 227, 0.4);
	background: #fff;
	}
	.main-navigation .primary-navigation ul.nav-menu ul li a {
	border: 0;
	background: #fff;
	}
	.main-navigation ul.menu>li>a, 
	.main-navigation ul.nav-menu ul li>a {
			padding: .25em 1em .25em 1em;
	}
	.main-navigation .primary-navigation ul.nav-menu ul ul {
	left: 100%;
	top: -0.372em;
	}
	
	.storefront-primary-navigation {
  		width:  auto;
  		border-top:  1px solid #f0f0f0;
	}
	
	.woocommerce-active .site-header .main-navigation,
	.primary-navigation {
		float:  right;
		margin-right:  0;
		margin-top: 1em;
	}
	
	/* Footer */
	.footer-widgets {
		padding-top: 0;
	}
	.social-media {
		text-align:  right;
	}
		
	/* Archives & Categories */
		
		/* Since we remove the meta data from the post content, make sure the content is full width */
	.hentry.type-post .entry-content {
		width: auto;
		float: none;
	}
	.category .archive-rss {
  		float: left;
  	}
	.category.category-the-dirt .archive-description {
		text-align: center;
	}
	
	.category.category-the-dirt .archive-description .subscribe-form-singleline .name-field,
	.category.category-the-dirt .archive-description .subscribe-form-singleline .email-field {
	  width:  25%;
	}
	
	.category.category-the-dirt .archive-description .subscribe-form,
	.category.category-the-dirt .archive-description .wpcf7-response-output {
  	  float: right;
	}
	
	.category.category-the-dirt .archive-description .widget_sf_widget_constantcontact input[type="submit"] {
	  display: inline-block;
	}

	.category.category-the-dirt .archive-description input[type="submit"] {
	  margin-top: 0;
	}
		
	.category.category-the-dirt .archive-description .subscribe-form .email-field {
	  width:  330px;
	}
	
	/* Shop */
	.single-product .summary.entry-summary {
	  clear: none;
	}
	
	/* Join */
	.join-form {
  		max-width:  75%;
  		margin: 0 auto;
	}
}

@media screen and (min-width: 768px) and (max-width:800px) {
	/* Tablet Portrait Orientation */
	.site-header .site-branding {
		margin-top: 1em;
  	max-width: 25%;
	}
}

@media (min-width: 800px) {
	.site-header .site-branding {
	  	max-width: 100%;
			padding: 10px 0;
	}
	
	.category.category-the-dirt .archive-description {
	  clear: none;
	}
	
	.category.category-the-dirt .archive-description .subscribe-form,
	.category.category-the-dirt .archive-description .wpcf7-response-output {
  	  float: right;
	}
		
	.category.category-the-dirt .archive-description .subscribe-form .email-field {
	  width:  354px;
	}
}