/*
 Theme Name:   Storefront Child (for Aquatex)
 Description:  Storefront Child Theme (for Aquatex)
 Author:       Shaun Tan (shauntmw@zeroii.net)
 Template:     storefront
 Version:      2020.08.02.01
*/

/* ------------------------------------------------------------------------- */
/* Theme General */
/* ------------------------------------------------------------------------- */
a:focus, button:focus, .button.alt:focus, input:focus, textarea:focus, input[type="button"]:focus, input[type="reset"]:focus, input[type="submit"]:focus, input[type="email"]:focus, input[type="tel"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus {
	outline: none !important;
}

@media only screen and (min-width: 768px) and (max-device-width: 1023px) {
	/* iPad Portrait only */
	h2 { font-size: 1.8em; }
}

@media only screen and (min-device-width: 320px) and (max-device-width: 767px) {
	/* Mobile phone only */
	
	h1 { font-size: 2em; }
	h2 { font-size: 1.5em; }
	ul, ol { text-align: left; }
}

@media only screen and (min-device-width: 320px) and (max-device-width: 479px) {
	/* Mobile phone Portrait only */
	
	ul, ol { margin-left: 1em; }
}

/* ------------------------------------------------------------------------- */
/* Theme Header */
/* ------------------------------------------------------------------------- */
div.zero_header_container {
	display: flex;
	align-items: center;
}

@media only screen and (min-width: 1024px) {
	/* iPad landscape and desktop */
	.site-header { padding: 0.5em 0; }
	
	.main-navigation ul.menu > li > a, 
	.main-navigation ul.nav-menu > li > a {
		padding: 0.5em 0;
		margin: 0 1em;
	}
}

@media only screen and (min-width: 768px) {
	/* iPad Portrait and above */
	.woocommerce-active .site-header .site-branding {
		width: auto;
		margin: 0;
	}

	.storefront-primary-navigation { width: 100%; }
	.storefront-primary-navigation nav#site-navigation { width: 100%; }
}

@media only screen and (min-width: 768px) and (max-device-width: 1023px) {
	/* iPad Portrait only */
	.site-header { padding: 0; }
	
	div.zero_header_container {
		margin-left: 0;
		margin-right: 0;
	}
	
	div.zero_header_container .storefront-primary-navigation > .col-full {
		margin-left: 0;
		margin-right: 0;
	}
	
	.main-navigation ul.menu {		
		margin-left: 0;
		text-align: center;
	}
	
	.main-navigation ul.menu > li > a, 
	.main-navigation ul.nav-menu > li > a {
		padding: 0.5em 0;
		margin: 0 0.5em;
	}
}

@media only screen and (min-device-width: 320px) and (max-device-width: 767px) {
	/* Mobile phone only */
	.site-header { padding: 0; }
	
	div.zero_header_container {
		margin-left: 0;
		margin-right: 0;
	}
	
	button.menu-toggle, button.menu-toggle:hover {
		border-color: #999999;
	}
}

.site-header ul.menu li.current-menu-item > a {
	color: black;
	border-bottom: 0.15em solid #008fff;
}

div.storefront-breadcrumb {
    background: white;
    padding: 0.5em 0;
    margin-bottom: 0;
	border-bottom: 1px solid #dfdfdf;
}

/* ------------------------------------------------------------------------- */
/* Theme Footer */
/* ------------------------------------------------------------------------- */
.site-footer {
	padding: 0.5em 0;
	border-top: 1px solid #ddd;
}

.site-info {
	padding: 0;
	text-align: center;
	font-size: 0.8em;
}

/* ------------------------------------------------------------------------- */
/* For Homepage */
/* ------------------------------------------------------------------------- */
.page-template-template-homepage .entry-header h1 {
	display: none;
}

.page-template-template-homepage:not(.has-post-thumbnail) .site-main {
	padding-top: 0;
}

.page-template-template-homepage .type-page {
	background: rgba(255, 255, 255, 0.5);
    border-radius: 0.3em;
	box-shadow: 0 0 1px #aaa;
}

.page-template-template-homepage .entry-content {
	max-width: 45em;
	text-align: left;
}

.storefront-product-section .section-title {
	font-weight: bold;
}

ul.products li.product {
	padding: 1em;
    background: rgba(255, 255, 255, 0.5);
	border-radius: 0.3em;
	box-shadow: 0 0 1px #aaa;
}

.wpcp-carousel-section.wpcp-standard.slick-initialized {
	padding: 0;
}

/* ------------------------------------------------------------------------- */
/* For Page */
/* ------------------------------------------------------------------------- */
article.page {
    background: rgba(255, 255, 255, 0.5);
    border-radius: 0.3em;
	box-shadow: 0 0 1px #aaa;
    padding: 3em;
}

h1.page-title {
	font-weight: bold;
}

h1.woocommerce-products-header__title,
article.page h1.entry-title {
	text-align: left;
    font-weight: bold;
    border-bottom: 1px dotted #777777;
}

.hentry .entry-content .wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
	margin-top: 3em;
	margin-bottom: 3em;
}

.entry-content h2 {
	font-weight: bold;
    border-bottom: 1px dotted #777777;
}

.entry-content h2 + h3 {
	border-top: none;
	padding-top: 0;
}

.entry-content h3 {
	font-weight: bold;
}

@media only screen and (min-width: 768px) and (max-device-width: 1023px) {
	/* iPad Portrait only */
	div#content > div.col-full {
		margin-left: 2em;
		margin-right: 2em;
	}
	
	div#content div.content-area {
		margin-top: 2em;
		padding: 2em;
		margin-bottom: 2em;
	}
	
	div#content div#main {
		margin-bottom: 2em;
	}
	
	article.page {
		padding: 2em;
		margin-bottom: 2em;
	}
	
	.site-main { margin-bottom: 2em; }
	
	.hentry .entry-content .wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
		margin-top: 2em;
		margin-bottom: 2em;
	}
}

@media only screen and (min-device-width: 320px) and (max-device-width: 767px) {
	/* Mobile phone only */
	div#content > div.col-full {
		margin-left: 1em;
		margin-right: 1em;
	}
	
	div#content div.content-area {
		margin-top: 1em;
		padding: 1em;
		margin-bottom: 1em;
	}
	
	article.page {
		padding: 1em;
		margin-bottom: 1em;
	}
	
	.site-main { margin-bottom: 1em; }
	
	.page-template-template-homepage .type-page {
		padding-top: 1em;
		padding-bottom: 1em;
	}
	
	.hentry .entry-content .wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
		margin-top: 1em;
		margin-bottom: 1em;
	}
	
	.page-template-template-homepage .entry-content, .entry-content {
		text-align: center;
	}
}

/* ------------------------------------------------------------------------- */
/* For product lists page */
/* ------------------------------------------------------------------------- */
@media (min-width: 768px) {
	.storefront-full-width-content .woocommerce-products-header {
		padding-bottom: 2em;
	}
}

.storefront-sorting {
	display: none;
}

@media only screen and (min-device-width: 320px) and (max-device-width: 767px) {
	/* Mobile phone only */
	ul.products li.product { margin-bottom: 1em; }
}

/* ------------------------------------------------------------------------- */
/* For product details page */
/* ------------------------------------------------------------------------- */
.storefront-full-width-content .content-area {
    background: rgba(255, 255, 255, 0.5);
    border-radius: 0.3em;
	box-shadow: 0 0 1px #aaa;
    padding: 3em;
	margin-top: 3em;
}

.single-product div.product .product_meta {
	border-top: 1px solid #777777;
}

.woocommerce-tabs ul.tabs {
	border-top: 1px solid #777777;
}

.woocommerce-tabs ul.tabs li {
	border-bottom: 1px solid #777777;
}

section.related.products {
    border-top: 1px dotted #777777;
    padding-top: 2em;
}

@media only screen and (min-device-width: 320px) and (max-device-width: 767px) {
	/* Mobile phone only */
	div.woocommerce-Tabs-panel { text-align: left; }
	div.woocommerce-Tabs-panel h2 { display: none; }
}

/* ------------------------------------------------------------------------- */
/* The WP-Form plugin */
/* ------------------------------------------------------------------------- */
@media only screen and (min-device-width: 320px) and (max-device-width: 767px) {
	/* Mobile phone only */
	
	div.wpforms-container { text-align: left; }
	div.wpforms-container-full .wpforms-form div.wpforms-submit-container button { width: 100%; }
}

/* ------------------------------------------------------------------------- */
/* The FAQ plugin */
/* ------------------------------------------------------------------------- */
.sp-ea-one.sp-easy-accordion .sp-ea-single .ea-header a {
	font-weight: bold;
}

@media only screen and (min-device-width: 320px) and (max-device-width: 767px) {
	/* Mobile phone only */
	div.sp-easy-accordion { text-align: left; }
}

/* ------------------------------------------------------------------------- */
/* Custom responsive table (Contact Us page table) */
/* ------------------------------------------------------------------------- */
@media only screen and (min-device-width: 320px) and (max-device-width: 479px) {
	/* Mobile phone Portrait only */
	
	.wp-block-table:not( .has-background ):not( .is-style-stripes ) tbody tr:nth-child(2n) {
		background-color: #fdfdfd;
	}
	
	.zero-responsive-table table,
	.zero-responsive-table tbody,
	.zero-responsive-table tr,
	.zero-responsive-table td {
		display: block;
	}
	
	.zero-responsive-table tr { padding: 1em; }
	
	.hentry .entry-content .wp-block-table.zero-responsive-table td { 
		padding: 0; 
		padding-top: 1em;
	}
	
	.hentry .entry-content .wp-block-table.zero-responsive-table td:first-child { 
		padding-top: 0;
	}
}