/*
Theme Name: Gruni
Theme URI: https://re-fresh.ro/
Author: RE
Author URI: https://re-fresh.ro/
Description: bijuterii, veselă și obiecte decorative din ceramică și porțelan
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: re_folio
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready, woocommerce

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.

re_folio is based on Underscores http://underscores.me/, (C) 2012-2016 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Normalize
# Typography
# Elements
# Forms
# Navigation
	## Links
	## Menus
# Accessibility
# Alignments
# Clearings
# Widgets
# Content
	## Posts and pages
	## Comments
# Infinite scroll
# Media
	## Captions
	## Galleries
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/
html {
	font-family: sans-serif;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust:     100%;
}

body {
	margin: 0;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
	display: block;
}

audio,
canvas,
progress,
video {
	display: inline-block;
	vertical-align: baseline;
}

audio:not([controls]) {
	display: none;
	height: 0;
}

[hidden],
template {
	display: none;
}

a {
	background-color: transparent;
}

a:active,
a:hover {
	outline: 0;
}

abbr[title] {
	border-bottom: 1px dotted;
}

b,
strong {
	font-weight: bold;
}

dfn {
	font-style: italic;
}

h1 {
	font-size: 2em;
	margin: 0.67em 0;
}

mark {
	background: #ff0;
	color: #000;
}

small {
	font-size: 80%;
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	top: -0.5em;
}

sub {
	bottom: -0.25em;
}

img {
	border: 0;
}

svg:not(:root) {
	overflow: hidden;
}

figure {
	margin: 0;
}

hr {
	box-sizing: content-box;
	height: 0;
}

pre {
	overflow: auto;
}

code,
kbd,
pre,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

button,
input,
optgroup,
select,
textarea {
	color: inherit;
	font: inherit;
	margin: 0;
}

button {
	overflow: visible;
}

button,
select {
	text-transform: none;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
	-webkit-appearance: button;
	cursor: pointer;
}

button[disabled],
html input[disabled] {
	cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

input {
	line-height: normal;
}

input[type="checkbox"],
input[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

fieldset {
	border: 1px solid #c0c0c0;
	margin: 0 2px;
	padding: 0.35em 0.625em 0.75em;
}

legend {
	border: 0;
	padding: 0;
}

textarea {
	overflow: auto;
}

optgroup {
	font-weight: bold;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

td,
th {
	padding: 0;
}

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
body,
button,
input,
select,
optgroup,
textarea {
	font-family: "PT Sans Narrow", sans-serif;
  font-weight: 400;
  font-style: normal;
	font-size: 1.125rem;
	line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
}

h1, h2, h3 {
	font-weight: 500;
}

p {
	margin-bottom: 1.5em;
}

dfn,
cite,
em,
i {
	font-style: italic;
}

blockquote {
	margin: 0 1.5em;
}

address {
	margin: 0 0 1.5em;
}

pre {
	background: #eee;
	font-family: "Courier 10 Pitch", Courier, monospace;
	font-size: 15px;
	font-size: 0.9375rem;
	line-height: 1.6;
	margin-bottom: 1.6em;
	max-width: 100%;
	overflow: auto;
	padding: 1.6em;
}

code,
kbd,
tt,
var {
	font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
	font-size: 15px;
	font-size: 0.9375rem;
}

abbr,
acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

mark,
ins {
	background: #fff9c0;
	text-decoration: none;
}

big {
	font-size: 125%;
}

/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/
html {
	box-sizing: border-box;
}

*,
*:before,
*:after { /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
	box-sizing: inherit;
}

body {
	background: #fff; /* Fallback for when there is no custom background color defined. */
}

blockquote:before,
blockquote:after,
q:before,
q:after {
	content: "";
}

blockquote,
q {
	quotes: "" "";
}

hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin-bottom: 1.5em;
}

ul,
ol {
	margin: 0 0 1.5em 3em;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 1.5em;
}

dt {
	font-weight: bold;
}

dd {
	margin: 0 1.5em 1.5em;
}

img {
	height: auto; /* Make sure images are scaled correctly. */
	max-width: 100%; /* Adhere to container width. */
}


table {
	margin: 0 0 1.5em;
	width: 100%;
}

/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	font-size: 100%;
	margin: 0;
	line-height: 1em;
	cursor: pointer;
	position: relative;
	text-decoration: none;
	overflow: visible;
	padding: 1em 1.5em;
	font-weight: 300;
	border-radius: 0;
	left: auto;
	color: white;
	background-color: #d3995f;
	border: 0;
	white-space: nowrap;
	display: inline-block;
	background-image: none;
	box-shadow: none;
	-webkit-box-shadow: none;
	text-shadow: none;

}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
}

button:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus,
button:active,
input[type="button"]:active,
input[type="reset"]:active,
input[type="submit"]:active {
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #666;
	border: 1px solid #ccc;
	padding: 10px 15px;
}

select {
	border: 1px solid #ccc;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: #111;
}

textarea {
	width: 100%;
}



/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/
a {
	color: black;
}

a:visited {

}

a:hover,
a:focus,
a:active {

}

a:focus {
	outline: none;
}

a:hover,
a:active {
	outline: 0;
}

.btn {
	font-size: 100%;
	margin: 0;
	line-height: 1em;
	cursor: pointer;
	position: relative;
	text-decoration: none;
	overflow: visible;
	padding: .65em 1.5em;
	font-weight: 300;
	border: solid 1px black;
	color: black;
	background: transparent;
	white-space: nowrap;
	display: inline-block;
}
/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/
/* Main navigation */
.main-navigation {

}

.main-navigation a {
	text-decoration: none;
	text-transform: uppercase;
	color: black;
	padding: 5px 10px;
	display: block;
}
.main-navigation li {
	position: relative;
	list-style: none;
	margin: 0 5px;
}
.main-navigation .menu-toggle {
	display: none;
	cursor: pointer;
}
.main-navigation .menu {
	display: flex;
	position: relative;
	margin: 0;
	padding: 0;
	list-style: none;
}
.main-navigation .sub-menu {
	display: none;
	margin: 0;
	padding: .65em 0;
	list-style: none;
	line-height: 1;
}
.main-navigation .sub-menu a {
	text-transform: none;
}
.main-navigation .sub-menu {
	min-width: 280px;
	background: white;
}
.main-navigation .menu > .menu-item > a {
	display: block;
}
.main-navigation .menu > .menu-item > a:hover {
	color: #B68C3B;
}
@media only screen and (max-width: 64em) {
	.main-navigation {
		padding-top: 0;
	}
}
.main-navigation .expand-button {
	display: none;
	cursor: pointer;
}

@media only screen and (min-width: 64em) {
	.main-navigation {
		margin-left: 15%;
	}
	.main-navigation .menu > .menu-item:hover .sub-menu {
		display: flex;
		flex-direction: column;
		position: absolute;
		left: 0;
		top: 30px;
		z-index: 9999;
		padding: 1em 0;
	}
}

@media only screen and (max-width: 64em) {
	.main-navigation {
		float: none;
		width: 100%;
	}
	.main-navigation .menu {
		display: none;
	}
	.main-navigation.show .menu {
		display: block;
		width: 100%;
	}
	.main-navigation .menu .menu-item {
		display: block;
		width: 100%;
	}
	.main-navigation .menu > .menu-item {
		position: relative;
	}
	.main-navigation .menu li {
		border-bottom: solid 1px #ccc;
		margin: 0;
	}
	.main-navigation .menu .sub-menu li {
		border: none;
	}
	.main-navigation .expand-button {
		font-weight: bold;
		color: black;
		display: block;
		position: absolute;
		right: 5px;
		top: 5px;
		padding: 0 10px;
		z-index: 9999;
		border-left: solid 1px #ccc;
	}
	.main-navigation .sub-menu.show {
		display: block;
	}
	.main-navigation .menu-toggle {
		display: block;
		position: absolute;
		z-index: 1;
		top: 0;
		right: 0;
		background: transparent;
		padding: 10px;
		border: 0;
	}
}

.main-navigation .current_page_item > a, 
.main-navigation .current-menu-item > a, 
.main-navigation .current_page_ancestor > a {
  color: #B68C3B;
}

.ico-menu {
	display: block;
	width: 25px;
	height: 25px;
	background: url('images/nav.svg') no-repeat center center;
}
.ico-search {
	display: block;
	width: 25px;
	height: 25px;
	background: url('images/icons/search_icon.svg') no-repeat center center;
}
.ico-cart {
	display: block;
	width: 25px;
	height: 25px;
	background: url('images/icons/cart_icon.svg') no-repeat center center;
}
.ico-user {
	display: block;
	width: 25px;
	height: 25px;
	background: url('images/icons/user_icon.svg') no-repeat center center;
}

/* Footer Shop Nav */
.shop-navigation {
	font-family: 'PT Sans Narrow', sans-serif;
}
.shop-navigation ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
.shop-navigation ul li {
	line-height: 1em;
	display: inline-block;
	margin-right: .5em;
	padding-right: .5em;
	border-right: solid 1px black;
}
.shop-navigation ul li:last-child {
	border-right: none;
}
@media only screen and (max-width: 64em) {
	.shop-navigation {
		text-align: center;
	}
}


.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {
	margin: 0 0 1.5em;
	overflow: hidden;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	float: left;
	width: 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
	float: right;
	text-align: right;
	width: 50%;
}

/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
	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;
	color: #21759b;
	display: block;
	font-size: 14px;
	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. */
#content[tabindex="-1"]:focus {
	outline: 0;
}

/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/
.alignleft {
	display: inline;
	float: left;
	margin-right: 1.5em;
}

.alignright {
	display: inline;
	float: right;
	margin-left: 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.text-center {
	text-align: center;
}
.uppercase {
	text-transform: uppercase;
}
/*--------------------------------------------------------------
# Clearings
--------------------------------------------------------------*/
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
	content: "";
	display: table;
	table-layout: fixed;
}

.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
	clear: both;
}

/*--------------------------------------------------------------
# Widgets
--------------------------------------------------------------*/
.widget {
	margin: 0 0 1.5em;
}

/* Make sure select elements fit in widgets. */
.widget select {
	max-width: 100%;
}

/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/
.sticky {
	display: block;
}

.hentry {
	margin: 0 0 1.5em;
}

.updated:not(.published) {
	display: none;
}

.page-content,
.entry-content,
.entry-summary {
	margin: 1.5em 0 0;
}

.page-links {
	clear: both;
	margin: 0 0 1.5em;
}

/*--------------------------------------------------------------
## Comments
--------------------------------------------------------------*/
.comment-content a {
	word-wrap: break-word;
}

.bypostauthor {
	display: block;
}

/*--------------------------------------------------------------
# Infinite scroll
--------------------------------------------------------------*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .posts-navigation, /* Older / Newer Posts Navigation (always hidden) */
.infinite-scroll.neverending .site-footer { /* Theme Footer (when set to scrolling) */
	display: none;
}

/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */
.infinity-end.neverending .site-footer {
	display: block;
}

/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
	display: inline-block;
}

/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/
.gallery {
	margin-bottom: 1.5em;
	padding-top: 2px;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	vertical-align: top;
	width: 100%;
	padding: 2px;
}

.gallery-columns-2 .gallery-item {
	max-width: 50%;
}

.gallery-columns-3 .gallery-item {
	max-width: 33.33333%;
}

.gallery-columns-4 .gallery-item {
	max-width: 25%;
}

.gallery-columns-5 .gallery-item {
	max-width: 20%;
}

.gallery-columns-6 .gallery-item {
	max-width: 16.66667%;
}

.gallery-columns-7 .gallery-item {
	max-width: 14.28571%;
}

.gallery-columns-8 .gallery-item {
	max-width: 12.5%;
}

.gallery-columns-9 .gallery-item {
	max-width: 11.11111%;
}

.gallery-caption {
	display: block;
}
/* Containers */
.container {
	width: 95%;
	max-width: 1600px;
	margin: 0 auto;
}
.container-m {
	max-width: 740px;
	margin: 0 auto;
}

/* Header */
.top-header {
	background: #E1D2BC;
}
.top-header .widget {
	font-size: .9em;
	text-align: center;
	line-height: 1;
	margin: 0;
	padding: 10px;
}
.site-header {
	width: 95%;
	max-width: 1600px;
	margin: 0 auto;
	position: relative;
	display: flex;
	margin-top: 25px;
}
.site-branding {
	display: flex;
}
.site-logo {
	width: 120px;
}

.site-description {
	position: relative;
	margin-left: 15px;
	max-width: 250px;
	color: black;
	font-size: .9em;
	line-height: 1;
}

.header-right {
	display: flex;
	margin-left: auto;
}

@media only screen and (max-width:64em) {
	.site-header {
		flex-direction: column;
	}
	.site-branding {
		float: none;
	}
	.site-logo {
		width: 100px;
	}
	.site-description {
		display: none;
	}
	.header-right {
		position: absolute;
		top: 0;
		right: 50px;
	}
}

/* Header cart */
.header-cart {
	display: block;
	padding: 5px;
	width: 35px;
	height: 35px;
	position: relative;
	line-height: 1;
	margin-right: 15px;
	margin-top: 5px;
}
.cart-customlocation {
	position: absolute;
	right: -8px;
	top: -8px;
	font-size: .8em;
	font-weight: bold;
	width: 20px;
	height: 20px;
	color: black;
	display: flex;
	justify-content: center;
	align-items: center;
}
.header-user {
	margin-right: 15px;
	margin-top: 10px;
}

/* Search button */
.search-button {
	margin-top: 10px;
	margin-right: 15px;
}

.search-button button {
	background: none;
	color: #111;
	cursor: pointer;
	padding: 0;
}

.search-popup {
	position: fixed;
	top: 0;
	left: 0;
	display: none;
	background: #fff;
	width: 100vw;
	height: 100vh;
	z-index: 100001;
}

.search-popup.show-popup {
	display: block;
}

.search-popup .popup-close {
	position: absolute;
	top: 1em;
	right: 2%;
	margin-right: 1em;
	cursor: pointer;
	padding: 10px;
}

.search-popup .popup-content {
	display: flex;
	align-items: center;
	width: 100%;
	height: 100%;
}

.search-popup .search-popup-form {
	padding-left: min(200px, 10vw);
	width: calc(100% - min(200px, 10vw));
}

.search-popup .search-popup-form input {
	font-size: 4em;
	max-width: 100%;
	padding: 0;
	border: none;
	outline: none;
}

@media only screen and (max-width: 64em) {
	.search-popup .search-popup-form input {
		font-size: 2em;
	}
}



/* Content */
.entry-meta {
	font-size: .8em;
}
/* Footer */
.post-footer {
	font-size: .75em;
	display: block;
	width: 100%;
	float: left;
	background: white;
	text-align: center;
}
.site-footer {
	background: white;
	padding-top: 2em;
}
.footer-container {
	width: 95%;
	max-width: 1600px;
	margin: 0 auto;
}
.footer-logo {
	margin-left: auto;
}
.footer-logo img {
	width: 120px;
	height: auto;
}
@media only screen and (max-width:48em) {
	.footer-logo {
		margin-right: auto;
	}
}

.site-footer a {
	text-decoration: none;
}
.site-info {
	color: #999999;
	font-size: .9em;
}

/* Home */
.hero-container {
	min-height: 540px;
	display: flex;
	align-items: center;
	max-width: 1024px;
	margin: 0 auto;
}
.hero-content h2 {
	font-size: 2em;
}

.section-title {
	font-size: 1em;
}

/* Masonry Grid*/
.grid-item {
	margin: 0 1% 1.5em 1%;
	width: 23%;
}
@media only screen and (max-width:48em) {
	.grid-item{
		width: 100%;
	}
}

/* Projects listing*/
.project img {
	width:100%;
	display:block;
	margin: 0;
}

.project figcaption {
      position: absolute;
      top: 0;
      margin: 0;
      height: 100%;
      width: 100%;
      box-sizing: border-box;
      display: flex;
      align-items: center;
      justify-content: center;
      background: rgba(256, 256, 256, 0.7);
      transition: opacity .25s ease-in-out;
      text-align: center;
      opacity: 0;
}

.project h2 {
      color: #000;
      display: block;
      width: 100%!important;
      line-height: inherit;
      padding: 1em;
      opacity: 0;
      font-size: 1.2em;
}
.project p {
	display: block;
	width: 100%!important;
}

.project figcaption::before,
.project figcaption::after {
      pointer-events: none;
}

.project:hover figcaption, 
.project:hover h2{
	  opacity: 1;
}

/* Newsletter */
.popup-newsletter {
	min-height: 640px;
	text-align: center;
	background: url(https://gruni.ro/wp/wp-content/uploads/bg_newsletter.jpg) no-repeat center center;
}
.newsletter-content {
	max-width: 500px;
	padding-top: 180px;
	margin: 0 auto;
}
.newsletter-content h2 {
	font-weight: lighter;
	margin: 0;
}
.newsletter-content input[type="email"],
.newsletter-content input[type="submit"] {
	width: 100%!important;
}

/* Flex */
.row-flex {
	display: flex;
}
.flex-center {
	align-items: center;
}
.flex-center-m {
	align-items: center;
}
.flex-space {
	justify-content: space-between;
}
.flex-around {
	justify-content: space-around;
}
.flex-end {
	justify-content: flex-end;
}
.flex-gap {
	gap: 2.5em;
}
@media only screen and (max-width:64em) {
	.flex-m {
		flex-direction: column;
		max-width: 100%;
	}
	.flex-center-m {
		align-items: start;
	}
}

/* Grid col*/
.grid-2 {
        -moz-column-count: 2;
        -webkit-column-count: 2;
        column-count: 2;
}
.grid-3 {
        -moz-column-count: 3;
        -webkit-column-count: 3;
        column-count: 3;
}
@media only screen and (max-width:48em) {
	.grid-2,
	.grid-3{
		-moz-column-count: 1;
        -webkit-column-count: 1;
        column-count: 1;
	}
}
/* GRID */
.row {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(12, 1fr);
}
.grid-gap {
	gap: 2.5rem;
}
.grid-center {
	align-items: center;
}

[class*="col-"],
.half {
    box-sizing: border-box;
}

/* Column spans */
.col-1  { grid-column: span 1; }
.col-2  { grid-column: span 2; }
.col-3  { grid-column: span 3; }
.col-4  { grid-column: span 4; }
.col-5  { grid-column: span 5; }
.col-6  { grid-column: span 6; }
.col-7  { grid-column: span 7; }
.col-8  { grid-column: span 8; }
.col-9  { grid-column: span 9; }
.col-10 { grid-column: span 10; }
.col-11 { grid-column: span 11; }
.col-12 { grid-column: span 12; }

.half {
    grid-column: span 6;
}

@media only screen and (max-width: 48em) {
    [class*="col-"],
    .half {
        grid-column: span 12;
    }
}


.wa-button {
	text-decoration: none;
  color: white;
  background: #282828;
  font-size: 2em;
  position: fixed;
  right: .5em;
  bottom: .5em;
  z-index: 9999;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
/*--------------------------------------------------------------
## FlexSlider
--------------------------------------------------------------*/

/* FlexSlider Necessary Styles
*********************************/ 
.flexslider ul.slides{margin: 0; padding: 0;}
.flexslider li {list-style: none;}
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {display: block;}
.flex-pauseplay span {text-transform: capitalize;}

/* Clearfix for the .slides element */
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} 
html[xmlns] .slides {display: block;} 
* html .slides {height: 1%;}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}

/* FlexSlider Default Theme
*********************************/
.flexslider {position: relative; zoom: 1;}
.flex-viewport {max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease;}
.loading .flex-viewport {max-height: 300px;}

.flexslider .slides {zoom: 1;}
.carousel li {margin-right: 5px}

/* Direction Nav */
.flexslider .flex-direction-nav {display: none;}

/* Control Nav */
.flexslider .flex-control-nav {position: absolute; bottom: 20px; left: 0; right: 0; text-align: center; margin: 0; padding: 0;}
.flexslider .flex-control-nav li {margin: 0 3px; display: inline-block; zoom: 1; *display: inline;}
.flexslider .flex-control-paging li a {width: 12px; height: 12px; display: block; border: solid 1px white; border-radius: 1em;  cursor: pointer; text-indent: -9999px;}
.flexslider .flex-control-paging li a:hover { background: white;}
.flexslider .flex-control-paging li a.flex-active { background: white; cursor: default;}



/* Reviews */
.reviews-section {
	width: 100%;
	display: block;
	float: left;
  background-color: #E1D2BC;
	padding: 4em 0;
	margin: 8em 0;
}

.reviews-header {
	text-align: center;
	margin-bottom: 3em;
}

.reviews-footer {
	margin-top: 3em;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.google-rating {
	margin-bottom: 2em;
}

.rating-number {
	font-size: 4em;
	font-weight: 700;
	color: var(--color-primary);
	line-height: 1;
	font-family: serif;
	margin-bottom: 0.1em;
}

.rating-stars {
	font-size: 1.5em;
	margin-bottom: 0.5em;
	letter-spacing: 0.1em;
}

.rating-stars .star {
	display: inline-block;
	animation: starPulse 2s ease-in-out infinite;
}

.rating-stars .star:nth-child(1) { animation-delay: 0s; }
.rating-stars .star:nth-child(2) { animation-delay: 0.1s; }
.rating-stars .star:nth-child(3) { animation-delay: 0.2s; }
.rating-stars .star:nth-child(4) { animation-delay: 0.3s; }
.rating-stars .star:nth-child(5) { animation-delay: 0.4s; }

@keyframes starPulse {
	0%, 100% {
		transform: scale(1);
	}
	50% {
		transform: scale(1.1);
	}
}

.reviews-title {
	font-size: 2em;
    font-weight: 400;
}

.reviews-slider {
	margin: 0;
	padding: 0 60px;
	overflow: visible;
}

.reviews-carousel {
	position: relative;
	overflow: hidden;
}

.reviews-slider .slides {
	margin: 0;
	padding: 0;
	display: flex;
	align-items: stretch;
}

.reviews-slider .slides > li {
	box-sizing: border-box;
	display: flex;
}

.review-card-container {
	width: 100%;
	height: 100%;
	transition: all 0.6s ease;
}

/* Cardurile laterale sunt mai mici și transparente */
.reviews-slider .slides > li:not(.center-slide) .review-card-container {
	transform: scale(0.9);
	opacity: 0.6;
}

/* Cardul central este la dimensiune maximă */
.reviews-slider .slides > li.center-slide .review-card-container {
	transform: scale(1);
	opacity: 1;
}

.review-card {
	background: white;
	border-radius: 1em;
	padding: 2.5em;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
}

.review-text {
	font-size: 1.05em;
	line-height: 1.7;
	color: var(--color-gray-darker);
	font-style: italic;
	margin: 0 0 1.5em 0;
	flex-grow: 1;
}

.review-author {
	font-style: normal;
	font-weight: 600;
	color: var(--color-primary);
	font-size: 1em;
	display: block;
	margin-top: auto;
}

/* FlexSlider customization for reviews */
.reviews-slider .flex-direction-nav {
	display: block;
}

.reviews-slider .flex-direction-nav a {
	display: block;
	width: 50px;
	height: 50px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 10;
	overflow: hidden;
	opacity: 0.6;
	cursor: pointer;
	color: var(--color-primary);
	background: white;
	border-radius: 50%;
	text-align: center;
	line-height: 50px;
	font-size: 18px;
	transition: all 0.3s ease;
	text-indent: 0;
}

.reviews-slider .flex-direction-nav a {
	text-decoration: none;
}
.reviews-slider .flex-direction-nav a:hover {
	opacity: 1;
	background: var(--color-secondary);
	color: white;
}

.reviews-slider .flex-direction-nav .flex-prev {
	left: 0;
}

.reviews-slider .flex-direction-nav .flex-next {
	right: 0;
}

.reviews-slider .flex-direction-nav .flex-prev:before {
	content: "\f053";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
}

.reviews-slider .flex-direction-nav .flex-next:before {
	content: "\f054";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
}

.reviews-slider .flex-control-nav {
	bottom: -40px;
}

.reviews-slider .flex-control-paging li a {
	background: var(--color-gray);
	width: 10px;
	height: 10px;
}

.reviews-slider .flex-control-paging li a:hover {
	background: var(--color-secondary);
}

.reviews-slider .flex-control-paging li a.flex-active {
	background: var(--color-primary);
	width: 12px;
	height: 12px;
}

/* Responsive adjustments */
@media screen and (max-width: 82em) {

}

@media only screen and (max-width: 64em) {
	.reviews-title {
		font-size: 2em;
	}
	
	.review-card {
		min-height: auto;
		padding: 2em;
	}
	
	.reviews-slider {
		padding: 0 60px;
	}
}

@media only screen and (max-width: 48em) {
	.reviews-section {
		padding: 2em 0;
		margin: 3em 0;
	}
	
	.rating-number {
		font-size: 4em;
	}
	
	.rating-stars {
		font-size: 1.5em;
	}

	
	.reviews-title {
		font-size: 1.6em;
	}
	
	.reviews-header {
		margin-bottom: 2em;
	}
	
	.review-card {
		padding: 1.5em;
	}
	
	.reviews-slider {
		padding: 0 40px;
		overflow: hidden;
	}
	
	/* Pe mobile, disable efectul de scale și opacity */
	.reviews-slider .slides > li:not(.center-slide) .review-card-container {
		transform: scale(1);
		opacity: 1;
	}

	.review-card-container {
		padding: 1em;
	}
	
	.reviews-slider .flex-direction-nav a {
		width: 34px;
		height: 34px;
		margin: -17px 0 0;
		line-height: 34px;
		font-size: 14px;
	}
}
