/*
Theme Name: Void
Theme URI: https://wordpress.org/themes/void/
Author: the WordPress team
Author URI: https://wordpress.org/
Description: Void is a modernized take on an ever-popular WordPress layout — the horizontal masthead with an optional right sidebar that works perfectly for blogs and websites. It has custom color options with beautiful default color schemes, a harmonious fluid grid using a mobile-first approach, and impeccable polish in every detail. Void will make your WordPress look beautiful everywhere.
Version: 1.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: black, blue, gray, red, white, yellow, dark, light, one-column, two-columns, right-sidebar, fixed-layout, responsive-layout, accessibility-ready, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-images, flexible-header, microformats, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-ready
Text Domain: void

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

@font-face {
    font-family: NeutraDispTitling;
    src: url("NeutraDisp-Titling.otf") format("opentype");
}

@font-face {
    font-family: NeutraTextBoldSC;
    src: url("NeutraText-BoldSC.otf") format("opentype");
}

@font-face {
    font-family: ACaslonProItalic;
    src: url("ACaslonPro-Italic.otf") format("opentype");
}

@font-face {
    font-family: ACaslonProRegular;
    src: url("ACaslonPro-Regular.otf") format("opentype");
}

html, body {
	background-color: #e3e3e3;
	font-family: NeutraDispTitling;
	font-size: 16px;
	color: #2d2d2b;
}
body {
	padding: 150px 0 0;
}

a,
a:hover {
	color: #2d2d2b;
}

#esqueleto {
	width: 976px;
	margin: 0 auto;
	position: relative;
}

#masthead {
	position: fixed;
	right: 60px;
	top: 60px;
	z-index: 100;
}

.block-instagram {

	display:block;
	background: url(instagram-text.png), url(instagram-img.png);
	background-repeat: no-repeat;
	background-color: transparent;
	background-size: auto;
	background-position: left top, left bottom;
	transition: top 1s ease-out;

	position: fixed;
	left: 60px;
	top: 45%; /* 330px; */
	font-size: 0%;
	height: 134px;
	width: 40px;
	z-index: 90;

	/*
	transform: rotate(-90deg);

	/ * Legacy vendor prefixes that you probably don't need... * /
	-webkit-transform: rotate(-90deg); / * Safari * /
	-moz-transform: rotate(-90deg); / * Firefox * / 
	-ms-transform: rotate(-90deg); / * IE * /
	-o-transform: rotate(-90deg); / * Opera * /
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); / * Internet Explorer * /
	*/
}
	.block-instagram.visible-footer {
		top: 120px;
	}

.block-mail {

	display:block;
	background: url(mail-text.png), url(mail-img.png);
	background-repeat: no-repeat;
	background-color: transparent;
	background-size: auto;
	background-position: right 33px, right bottom;
	transition: top 1s ease-out;

	position: fixed;
	right: 60px;
	top: 45%; /* 330px; */
	font-size: 0%;
	height: 128px;
	width: 40px;
	z-index: 90;
}
	.block-mail.visible-footer {
		top: 120px;
	}

.products.columns-1 {
	text-align: center;
}
	.woocommerce ul.products li.product.block-buy .button {
		background: transparent;
	}
		.block-buy a .buy {
			border: 1px #000 solid;
			display: block;
			padding: 0;
			text-align: center;
			line-height: 30px;
			width: 196px;
			margin: 0 auto;
		}
			.woocommerce ul.products li.product.block-buy a img {
				-webkit-box-shadow: 10px 10px 20px 0px rgba(120,120,120,1);
				-moz-box-shadow: 10px 10px 20px 0px rgba(120,120,120,1);
				box-shadow: 10px 10px 20px 0px rgba(120,120,120,1);
				margin-bottom: 60px;
			}
			.block-buy a .buy .price {
				float: right;
				border-left: 1px #000 solid;
				padding: 0 7px;
				margin-bottom: 0;
			}

h2 {
	font-size: 48px;
	text-align: center;
	text-transform: uppercase;
	margin-bottom: 65px;
	text-align: center;
	color: #2d2d2b;
}
	span.line {
		border-bottom: 2px #fff solid;
		margin-bottom: 0;
		width: 90%;
		position: absolute;
		left: 15px;
		z-index: 2;
		bottom: 40px;
	}
.container-in {
	max-width: 810px;
	margin: 0 auto;
	position: relative;
}

.about {
	height: 129px;
	z-index: 1;
	position: relative;
	display: block;
}
	.about h2 {
		padding-right: 60px;
	}
	.about img {
		position: absolute;
		right: 0;
		top: 11px;
		z-index: 1;
		max-width: 40%;
	}
	.about span {
		display:block;
	}
	.about .image-mask {
		position: relative;
	}
		.about .image-mask span {
			background: rgba(126,142,58,0.8);
			position: absolute;
			top: 40px;
			left: 0;
			right: 0;
			bottom: 0;
		}

.about-container {
	position: relative;
	z-index: 10;
	background: rgba(126,142,58,0.8);
	min-height: 425px;
	font-family: NeutraTextBoldSC;
	font-size: 22px;
	line-height: 26px;
	color: #fff;
	text-align: justify;
	text-align-last: center;
}
	.about-content {
		position: relative;
		padding: 15px 0;
		max-width: 810px;
		margin: 0 auto;
	}
		.about-content .container {
			max-width: 575px;
			margin: 0;
		}
			.about-content .claim {
				font-family: ACaslonProItalic;
				font-size: 22px;
				border-bottom: 1px #fff solid;
				display: inline-block;
				margin: 110px 0 70px;
			}
		.about-content .shop {
			height: 129px;
			z-index: 1;
			position: relative;
			display: block;
		}
		.product-list {
			font-family: NeutraDispTitling;
			font-size: 16px;
			color:#2d2d2b;
		}
			.product-list .woocommerce ul.products li.product .price {
				color:inherit;
			}
		.product-list .woocommerce ul.products li.product.block-buy a img {
			height: 180px;
			width: auto;
			margin: 0 auto -5px;
			box-shadow: none;
		}
		.product-list .block-buy a .buy {
			position: relative;
		}

footer {
	background: url(logo-footer.png) no-repeat center center #789370;
	color: #4d5e48;
	padding: 145px 0;
	font-family: ACaslonProRegular;
	font-size: 21px;
}
	footer a,
	footer a:hover {
		color: #4d5e48;
		float: left;
		clear: both;
	}
	footer .container {
		max-width: 100%;
		padding: 0 45px;
	}
	footer .footer-instagram {
		background: url(instagram-img-footer.png) no-repeat left top transparent;
		padding: 2px 8px 2px 70px;
		margin-bottom: 10px;
	}
	footer .footer-mail {
		background: url(mail-img-footer.png) no-repeat left top transparent;
		padding: 2px 8px 2px 70px;
		margin-bottom: 10px;
	}

.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
	color:inherit;
}

/**
 * 6.2 - Menus
 */

.site-header-menu {
	display: none;
	-webkit-flex: 0 1 100%;
	-ms-flex: 0 1 100%;
	flex: 0 1 100%;
	margin: 0.875em 0;
}

.site-header-menu.toggled-on,
.no-js .site-header-menu {
	display: block;
}



/**
 * 9.0 - Clearings
 */

.clear:before,
.clear:after,
blockquote:before,
blockquote:after,
.entry-content:before,
.entry-content:after,
.entry-summary:before,
.entry-summary:after,
.comment-content:before,
.comment-content:after,
.site-content:before,
.site-content:after,
.site-main > article:before,
.site-main > article:after,
.primary-menu:before,
.primary-menu:after,
.social-links-menu:before,
.social-links-menu:after,
.textwidget:before,
.textwidget:after,
.content-bottom-widgets:before,
.content-bottom-widgets:after {
	content: "";
	display: table;
}

.clear:after,
blockquote:after,
.entry-content:after,
.entry-summary:after,
.comment-content:after,
.site-content:after,
.site-main > article:after,
.primary-menu:after,
.social-links-menu:after,
.textwidget:after,
.content-bottom-widgets:after {
	clear: both;
}





/**
 * 11.1 - Header
 */


.menu-toggle {
	background-color: transparent;
	border: 1px solid #d1d1d1;
	color: #1a1a1a;
	font-size: 13px;
	font-size: 0.8125rem;
	margin: 1.076923077em 0;
	padding: 0.769230769em;
}
.no-js .menu-toggle {
	display: none;
}


.menu-toggle:hover,
.menu-toggle:focus {
}




/**
 * 14.3 - >= 910px
 */

@media screen and (min-width: 56.875em) {
	.site-header-menu {
		display: block;
		-webkit-flex: 0 1 auto;
		-ms-flex: 0 1 auto;
		flex: 0 1 auto;
	}

	.dropdown-toggle,
	.main-navigation ul .dropdown-toggle.toggled-on,
	.menu-toggle,
	.site-header .social-navigation,
	.site-footer .main-navigation {
		display: none;
	}
}

@media screen and (max-width: 768px) {
	.woocommerce ul.products[class*="columns-"] li.product, 
	.woocommerce-page ul.products[class*="columns-"] li.product {
		float: none;
		width: auto;
	}
	.container-in {
		max-width: 575px;
	}
	.about-content {
		max-width: 575px;
		font-size: 16px;
		line-height: 20px;
	}
	.about-content .container {
		max-width: 430px;
	}
	footer .container {
		max-width: 772px;
	}
	.block-instagram {
		left: 30px;
	}
	.block-mail {
		right: 30px;
	}
	.about img {
		max-width: 205px;
	}
	.about-content .claim {
		margin: 50px 0 70px;
	    font-size: 18px;
	}
	footer {
		background-size: 100px auto;
		padding: 80px 0;
		font-size: 18px;
		line-height: 32px;
	}
		footer .container {
			padding: 0 30px;
		}
}
@media screen and (max-width: 767px) {
	body {
		padding: 50px 0 0;
	}
	#masthead {
		position: fixed;
		right: 15px;
		top: 15px;
	}
		#masthead img {
			width: 50px;
		}
	.woocommerce ul.products[class*="columns-"] li.product, 
	.woocommerce-page ul.products[class*="columns-"] li.product {
		float: none;
		width: 100%; /* auto; */
	}
	.woocommerce ul.products li.product.block-buy a img {
		width: 80%;
		margin: 0 auto 30px;
	}
	.block-instagram {
		left: 10px;
		top: 160px;
		background-size: auto, 25px auto;
		height: 115px;
		width: 28px;
	}
	.block-mail {
		right: 10px;
		top: 160px;
		background-size: auto, 25px auto;
		height: 111px;
		width: 28px;
	}
	.about h2 {
		padding-right: 0;
	}
	.about img {
	    top: 66px;
	}
	footer {
		padding: 40px 0;
		background: #789370;
	}
		footer .container {
			background: url(logo-footer.png) no-repeat right center / 70px auto #789370;
			padding: 0;
		}
		footer .footer-instagram {
			background-size: 32px auto;
			padding: 0 0 0 40px;
			line-height: 28px;
			font-size: 14px;
		}
		footer .footer-mail {
			background-size: 32px auto;
			padding: 0 0 0 40px;
			line-height: 28px;
			font-size: 14px;
			margin-bottom: 0;
		}
}