/*!
Theme Name: ZenMacrame
Description: ZenMacrame is a Fully Responsive Multi-Purpose WordPress Theme, a child theme of ZenLife WordPress Theme. This Free Zen Templates WordPress Theme comes with some of these features included: Built-in Materialize Slider (Displayed on a Static Front Page), Animation Appearing Effects, Custom Logo, Multi-level Drop-down Menu, Custom Background, Full-Width Page Template, Widget Areas: Homepage Above Columns, Right Sidebar and 3 Footer Columns, Footer Menu, Footer Copyright Text, Search Engine Optimized, Multiple Browsers Support, Translation-Ready, WooCommerce plugin support, Header and Footer Social Icons: Facebook, Twitter, Instagram, RSS Feeds, Tumblr, YouTube channel, Pinterest, VK, Flickr, Vine, GitHub, BitBucket, Reddit, Xing, Slack, WeChat, SnapChat, Dribbble, Bandcamp, Last.fm, SoundCloud, Vimeo, Skype, DeviantArt, Yahoo, Amazon, Etsy, Foursquare, Quora, Yelp. Easy to use zen theme, easy to customize, best suitable for macrame art site, zen macrame blog, macrame knitting website.
Theme URI: https://zentemplates.com/product/zenmacrame
Author: zentemplates
Author URI: https://zentemplates.com
Template: zenlife
Version: 1.3.6
Text Domain: zenmacrame
Tags: blog, news, two-columns, right-sidebar, custom-logo, custom-background, custom-header, custom-menu, featured-images, threaded-comments, translation-ready, sticky-post, theme-options, footer-widgets, full-width-template, editor-style
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Requires PHP: 7.0
Requires at least: 6.2
Tested up to: 6.7
*/

/* general styles */
body {
	font-family:"Merriweather",Arial,Helvetica,sans-serif;
	font-size:16px;
}

body:before {
	content: none !important;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Merriweather';
  font-style: normal;
  font-weight: 400;
  src: url(./assets/fonts/Merriweather-google-font-1.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Merriweather';
  font-style: normal;
  font-weight: 400;
  src: url(./assets/fonts/Merriweather-google-font-2.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Merriweather';
  font-style: normal;
  font-weight: 400;
  src: url(./assets/fonts/Merriweather-google-font-3.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Merriweather';
  font-style: normal;
  font-weight: 400;
  src: url(./assets/fonts/Merriweather-google-font-4.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Merriweather';
  font-style: normal;
  font-weight: 400;
  src: url(./assets/fonts/Merriweather-google-font-5.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
  font-family: 'Cinzel Decorative';
  font-style: normal;
  font-weight: 400;
  src: url(./assets/fonts/Cinzel-Decorative-google-font.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

article a {
	text-decoration: underline;
}

.entry-title a,
.post-entry-title a {
	text-decoration: none;
}

a {
	color:#815667;
}

a:hover {
	color:#643842;
}

article,
.recent-posts-slider-after-content {
	line-height:1.5;
}


h1, h2, h3, h4, h5, h6{
	color:#000000;
}
	
h1 {
	text-align:center;
}

h2 {
	font-size:22px;
}

h3 {
	font-size:20px;
}

h4 {
	font-size:18px;
}

img {
	max-width:100%;
	height:auto;
}

.header-social-widget {
	display:inline-block;
	text-align:center;
	padding:0;
	margin:0;
}

.header-social-widget li {
	margin-right:5px !important;
	display:inline;
}

.header-social-widget li:last-of-type {
	margin-right:0;
}

#header-top {
	text-align:center;
	background-color:#FFFFFF;
}

.facebook-icon:before {
	content: "\f09a";
}

.instagram-icon:before {
	content: "\f16d";
}

.linkedin-icon:before {
	content: "\f0e1";
}

.rss-icon:before {
	content: "\f09e";
}

.tumblr-icon:before {
	content: "\f173";
}

.twitter-icon:before {
	content: "\f099";
}

.youtube-icon:before {
	content: "\f167";
}

.pinterest-icon:before {
    content: "\f0d2";
}

.vk-icon:before {
    content: "\f189";
}

.flickr-icon:before {
    content: "\f16e";
}

.vine-icon:before {
    content: "\f1ca";
}

.github-icon:before {
	content: "\f09b";
}

.bitbucket-icon:before {
	content: "\f171";
}

.reddit-icon:before {
	content: "\f1a1";
}

.xing-icon:before {
	content: "\f168";
}

.slack-icon:before {
	content: "\f198";
}

.wechat-icon:before {
	content: "\f1d7";
}

.snapchat-icon:before {
	content: "\f2ab";
}

.dribbble-icon:before {
	content: "\f17d";
}

.bandcamp-icon:before {
	content: "\f2d5";
}

.lastfm-icon:before {
	content: "\f202";
}

.soundcloud-icon:before {
  content: "\f1be";
}

.vimeo-icon:before {
	content: "\f27d";
}

.skype-icon:before {
	content: "\f17e";
}

.deviantart-icon:before {
  content: "\f1bd";
}

.yahoo-icon:before {
  content: "\f19e";
}

.amazon-icon:before {
  content: "\f270";
}

.etsy-icon:before {
  content: "\f2d7";
}

.foursquare-icon:before {
  content: "\f180";
}

.quora-icon:before {
  content: "\f2c4";
}

.yelp-icon:before {
  content: "\f1e9";
}

.github-icon:before,
.bitbucket-icon:before,
.reddit-icon:before,
.xing-icon:before,
.slack-icon:before,
.wechat-icon:before,
.snapchat-icon:before,
.dribbble-icon:before,
.bandcamp-icon:before,
.lastfm-icon:before,
.soundcloud-icon:before,
.vimeo-icon:before,
.skype-icon:before,
.deviantart-icon:before,
.yahoo-icon:before,
.amazon-icon:before,
.etsy-icon:before,
.foursquare-icon:before,
.quora-icon:before,
.yelp-icon:before,
.facebook-icon:before,
.google-icon:before,
.instagram-icon:before,
.rss-icon:before,
.tumblr-icon:before,
.linkedin-icon:before,
.twitter-icon:before,
.youtube-icon:before,
.pinterest-icon:before,
.vk-icon:before,
.flickr-icon:before,
.vine-icon:before {
	font-family:'FontAwesome';
	font-size: 16px;
}



.header-social-widget a {
	display:inline-block;
	height:20px;
	line-height:20px;
	text-align:center;
}

#header-logo > a.custom-logo-link,
#header-logo #site-identity {
    float:left;
    margin-right:10px;
}

#header-logo #site-identity h1 { 
	line-height:1;
	font-size:70px;
	font-family:'Cinzel Decorative',Verdana, Geneva, sans-serif;
}

#header-logo { 
 	display:flex; 
	justify-content:center; 
	float:none;
} 
	 
#header-logo #site-identity, 
#header-logo .custom-logo-link { 
	align-self:center; 
}

#site-identity strong {
	font-weight:normal;
}


#footer-bottom-widget-area {
	margin-top:10px;
}

#footer-bottom-area {
	clear:both;
	padding:15px 2% 10px 2%;
	background-color:#63BFCA;
}

#footer-bottom-area {
	color:#888888;
}

#footer-bottom-area a {
	color:#815667;
}

#footer-bottom-area a:hover {
	color:#ffffff;
}

#header-logo h1 {
	padding:0;
}

/* header */
#header-main-fixed {
	clear:both;
	background-color:#FFFFFF;
	margin:0;
	width:100%;
	z-index:5000;
    box-shadow: 0 2px 2px -2px #777;
	color:#434343;
	text-align:center;
}

#header-main-fixed a h1,
#header-main-fixed a {
	color:#434343;
}

#header-main-fixed a:hover {
	text-decoration: none;
	color:#8b8b8b;
}

#navmain {
	margin:0 auto;
	clear:both;
	text-align:center;
	display:table;
	float:none;
}

#navmain a, .cart-contents-icon, .search-form-icon {
	color:#434343;
}

/* main content */
#main-content,
#main-content-full,
#main {
	padding:5px 0 0 0;
}

#main-content > article:first-of-type h1 {
	margin-top:0;
	padding-top:0;
}

#main-content-full {
	margin:0 0 20px 2%;
	width:96%;
}

#sidebar ul:not(.social-widget):not(.ui-tabs-nav):not(#teammembers-grid):not(.teammember-social-icons) > li:before {
	content:"\f0da";
}

#footer-menu {
	margin:15px 0;
	clear:both;
	text-align:center;
}

#footer-main {
	clear:both;
	background-color:#78e7f4;
	color:#888888;
}

#footer-main a {
	color:#815667;
}

#footer-main a:hover {
	color:#ffffff;
}

#footer-menu li {
	margin:0 10px;
}

.footer-social-widget li {
    display: inline-block;
    height: 18px;
    padding: 5px;
    text-align: center;
    width: 18px;
}

.footer-social-widget {
	text-align:center;
}

input[type="submit"],
button {
	font-size:16px;
}

.button,
input[type="submit"],
button,
.btn,
#main .button,
#main #respond input[type="submit"],
#main-content-wrapper .woocommerce .checkout-button,
#main-content-wrapper .woocommerce #place_order,
#main-content-wrapper article .wc-block-grid__products .wp-block-button .wp-block-button__link {
	padding:12px 16px;
	background-image: -ms-linear-gradient(top, #810c3a0%, #815667 100%);
	background-image: -moz-linear-gradient(top, #810c3a0%, #815667 100%);
	background-image: -o-linear-gradient(top, #810c3a0%, #815667 100%);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #643842), color-stop(1, #815667));
	background-image: -webkit-linear-gradient(top, #810c3a0%, #815667 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#643842', endColorstr='#815667');
	background-image: linear-gradient(top, #810c3a0%, #815667 100%);
}

.button:hover,
input[type="submit"]:hover,
button:hover,
#main .button:hover,
.btn:hover,
#main #respond input[type="submit"]:hover,
#main-content-wrapper .woocommerce .checkout-button:hover,
#main-content-wrapper .woocommerce #place_order:hover,
#main-content-wrapper article .wc-block-grid__products .wp-block-button .wp-block-button__link:hover {
	background-image: -ms-linear-gradient(top, #815667 0%, #810c3a100%);
	background-image: -moz-linear-gradient(top, #815667 0%, #810c3a100%);
	background-image: -o-linear-gradient(top, #815667 0%, #810c3a100%);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #815667), color-stop(1, #643842));
	background-image: -webkit-linear-gradient(top, #815667 0%, #810c3a100%);
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#815667', endColorstr='#643842');
	background-image: linear-gradient(top, #815667 0%, #810c3a100%);
}

.navigation .page-dots,
.navigation .page-numbers {
	padding:5px 11px;
	border:1px solid #dddddd;
	margin:0 10px 10px 0;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	-ms-border-radius:3px;
	-o-border-radius:3px;
	border-radius:3px;
}

.navigation .current,
.navigation .current:hover {
	text-decoration:none;
	background:#dddddd !important;
	text-align:center;
	margin:0 10px 10px 0;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	-ms-border-radius:3px;
	-o-border-radius:3px;
	border-radius:3px;
}

.before-content,
.after-content,
.custom-after-content,
.page-after-content {
	padding-top:5px;
	padding-bottom:5px;
}

.after-content,
.custom-after-content,
.page-after-content {
	border-top:1px solid #CCCCCC;
	margin-top:5px;
	border-bottom:none;
}

.page-after-content {
	clear:both;
}

.comments-icon,
.tags-icon,
.category-icon,
.author-icon {
    display: inline-block;
}

.scrollup {
	width: 45px;
	height: 45px;
	border:2px solid #cbc8b5 !important;
	border-radius:2px;
	bottom: 15px;
	line-height:36px;
}

.scrollup:hover {
	background-color:#810c3a!important;
	color:#858282 !important;
}

#page-header,
#page-header h1 {
	color:#000000;
	text-align:center;
}

#page-header a {
	color:#815667;
}

#page-header a:hover {
	color:#643842;
}

#page-header h1 {
    margin:0;
	padding:0 0 20px 0;
}

/* Accessibility */
/* Text meant only for screen readers. */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important;
  /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
  background-color: #f1f1f1;
  border-radius: 3px;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  clip-path: none;
  color: #21759b;
  display: block;
  font-size: 16px;
  font-size: 0.875rem;
  font-weight: bold;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
  /* Above WP toolbar. */
}

/* Do not show the outline on the skip link target. */
#main-content-wrapper[tabindex="-1"]:focus {
  outline: 0;
}

.wp-block-post {
	list-style-type:none !important;
}

.wp-block-query .wp-block-columns {
	margin-bottom: 0;
}

/* Large Resolution */
@media screen and (min-width: 800px) {

	#header-logo #site-identity { 
 		margin-top:5px; 
 	}
	
	#header-logo {
		display:inline-block;
		margin:20px 0 5px 0;
	}
	
	

	#header-content-wrapper {
		position:relative;
		text-align:center;
	}
	
	#navmain ul {
		padding:0;
		margin:0;
		white-space:nowrap;
	}
	
	#navmain ul  li {
		position:relative;
		float:left;
	}
	
	#navmain > div > ul > li {
		margin-right:25px;
	}
	
	#navmain ul a {
		padding:27px 5px 24px 5px;
		font-size:16px;
		white-space:nowrap;
		display:inline-block;
	}

	#navmain ul li:hover > a,
	#navmain > div > ul > .current-menu-item > a,
	#navmain > div > ul > .current-menu-ancestor > a {
		color:#434343;
		border-bottom:2px solid #815667;
		padding-bottom: 10px;
	}

	#navmain > div > ul > li:hover > a,
	#navmain > div > ul > .current-menu-item > a,
	#navmain > div > ul > .current-menu-ancestor > a {
		padding-bottom: 22px;
	}

	#navmain ul ul {
		list-style:none;
		margin:0;
		padding:0;
		position:absolute;
		z-index:-1;
		background-color:#FFFFFF;
		text-align:left;
		border:1px solid #ededef;
	}

	

	#navmain ul li:hover > ul {
       display:block;
       opacity:1;
       animation: opacity 500ms ease-in-out normal;
       -moz-animation: opacity 500ms ease-in-out normal;
       -ms-animation: opacity 500ms ease-in-out normal;
       -o-animation: opacity 500ms ease-in-out normal;
       -webkit-animation: opacity 500ms ease-in-out normal;    
    }

	#navmain ul li ul a {
		display:block;
	}
	
	#navmain ul ul li:hover > ul,
  	#navmain ul ul li:focus-within > ul {
  		top:-1px;
  		left:100%;
  	}

  	#navmain ul ul li.menu-item-focused > ul {
  		top:-1px;
  		left:100%;
  	}
	
	#navmain ul ul li {
		float:none;
	}
	
	#navmain ul ul a {
		padding:12px 35px 12px 10px;
		-webkit-box-shadow: inset 0 -2px 2px -2px rgba(0, 0, 0, 0.25);
		-moz-box-shadow: inset 0 -2px 2px -2px rgba(0, 0, 0, 0.25);
		box-shadow: 0 -2px 2px -2px rgba(0, 0, 0, 0.15) inset;
	}

	#navmain ul ul a:hover {
		padding:12px 35px 10px 10px;
	}
	
	.post-before-content {
		width:60px;	
		padding:5px 0;
	}
	
	.post-before-content .day {
		font-size:22px;
		line-height:22px;
	}
	
	.post-before-content .month {
		font-size:16px;
		line-height:16px;
		margin:3px 0;
	}
	
	.post-before-content .year {
		font-size:10px;
		line-height:10px;
	}
	
	.post-content,
	h1.post-entry-title {
		padding-left:80px;
	}
	
	.post-after-content {
		padding-top:10px;
		clear:both;
	}
}

/* Medium Resolution */
@media screen and (max-width: 799px) {

	#header-top {
		padding:0;
		margin:0;
		text-align:center;
	}

	#navmain ul ul {
		z-index:-1;
        	position:absolute;
	}

	#navmain .sub-menu-item-toggle {
		display:inline-block;
		padding:10px;
		float:right;
	}

	#navmain .sub-menu-item-toggle:before {
		font:16px 'FontAwesome';
		content:"\f067";
		width:20px;
		height:20px;
		padding:2px;
	}

	#navmain .sub-menu-item-toggle-expanded:before {
		content:"\f068";
	}

	#navmain ul.sub-menu > li > a {
		padding-left:25px;
	}

	#navmain ul.sub-menu ul.sub-menu > li > a {
		padding-left:50px;
	}
	
	h1 {
		font-size:24px;
	}
	
	#navmain {
		cursor:pointer;
		float:left;
	}
	
	#navmain div.mobile-menu-expanded:before {
		content:"\f00d" !important;
	}
	
	#navmain div:first-of-type:before {
		font:36px 'FontAwesome';
		content:"\f0c9";
		margin:0 0 0 5%;
		text-shadow:1px 1px 2px rgba(0,0,0,0.25);
		color:#434343;
	}

	#navmain div {
		clear:both;
		text-align:left;
	}

	#navmain ul {
		padding:0;
	}
				
	#navmain div ul,
	#navmain div li {
		background-color: #FFFFFF;
	}
				
	#navmain div > ul {
		z-index:-1;
		list-style:none;
		margin:0 0 0 2px;
		padding:0 0 5px 0;
		position:absolute;
		overflow:hidden;
		width:280px;
		text-align:left;
		border:1px solid #ededef;
	}
	
	#navmain ul  li {
		position:relative;
		float:left;
		clear:both;
		width:100%;
	}
	
	#navmain ul a {
		white-space:nowrap;
		width:100%;
		display:block;
		padding:12px 0 12px 10px;
		-webkit-box-shadow: inset 0 -2px 2px -2px rgba(0, 0, 0, 0.25);
		-moz-box-shadow: inset 0 -2px 2px -2px rgba(0, 0, 0, 0.25);
		box-shadow: 0 -2px 2px -2px rgba(0, 0, 0, 0.15) inset;
		color:#434343;
	}

	#navmain ul ul a {
		padding-left:25px;
	}

	#navmain ul a:hover {
		border-top:none;
		border-right:none;
		border-left:none;
		border-bottom:2px solid #815667;
		padding:12px 0 10px 10px;
		color:#434343;
	}
	
	#page-header {
		padding:10px 2%;
	}
	
	#page-header h1 {
		float:none;
		clear:both;
		margin-top:5px;
	}
	

	.separator {
		height:1px;
	}

	.post-before-content {
	    border-radius: 1px;
	    font-size: 16px;
	    margin-bottom: 5px;
	    padding: 2px 10px;
	    text-align: center;
	}

	.post-before-content .day,
	.post-before-content .month,
	.post-before-content .year {
	    display: inline;
	}

	.post-content {
	    clear:both;
	}
}

/* Small Resolution */
@media screen and (max-width: 360px) {

	body {
		font-size: 16px;
	}
}

/**
 * Slider
 */
.slider {
  position: relative;
  height: 800px;
  width: 100%;
}

.slider.fullscreen {
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.slider.fullscreen ul.slides {
  height: 100%;
}

.slider.fullscreen ul.indicators {
  z-index: 2;
  bottom: 30px;
}

.slider .slides {
  background-color: #9e9e9e;
  margin: 0;
  height: 800px;
}

.slider .slides h3 {
	font-size:28px;
}

.slider .slides li {
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: inherit;
  overflow: hidden;
}

.slider .slides li img {
  height: 100%;
  width: 100%;
  background-size: cover;
  background-position: center;
  opacity:0.6;
}

.slider .slides li .caption {
  color: #fff;
  position: absolute;
  top: 25%;
  left: 15%;
  width: 70%;
  opacity: 0;
  text-align: center;
}

.slider .slides li .caption,
.slider .slides li .caption h1,
.slider .slides li .caption h2,
.slider .slides li .caption h3 {
	color:#000000;
}

.slider .slides li.active {
  z-index: 2;
}

.slider .indicators {
  position: absolute;
  text-align: center;
  left: 0;
  right: 0;
  bottom: 0;
  margin: 0;
}

.slider .indicators .indicator-item {
  display: inline-block;
  position: relative;
  cursor: pointer;
  height: 16px;
  width: 16px;
  margin: 0 12px;
  background-color: #e0e0e0;
  -webkit-transition: background-color .3s;
  transition: background-color .3s;
  border-radius: 50%;
  padding:0;
}

.slider .indicators .indicator-item.active {
  background-color: #555555;
}