@charset "UTF-8";
/* CSS Document */

/*-----------------------------------------------
1) GENERAL
-----------------------------------------------*/

:root {
    --accent-color: #efdea8;
    --main-color: #1d1d1d;
}


html {
  scroll-behavior: smooth;
}
html, body {
  font-size: 15px;
  line-height: 1.2;
}
body {

	font-family: mr-eaves-xl-modern-narrow, sans-serif;
	font-weight: 300;
	font-style: normal;
    color: var(--main-color);
    background-color: white;
    transition: all 1s ease-out;
}

a{
	color: #000;
	text-decoration: none;
}

.curry{color:#B89817;}

.logo {
  width: 30vw;
  min-width: 200px;
  max-width: 500px;
}

h1, h2, h3, h4 {
	font-family: mr-eaves-xl-modern-narrow, sans-serif;
	font-weight: 200;
	font-style: normal;
	}


img {margin-bottom: -7px}
.w3-row-padding img {margin-bottom: 12px}


/* Intro*/
#intro{
	text-align: center
}

.figure-intro {
    max-width: 100%;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    grid-template-areas: 
      "all";
    justify-items: center;
    align-items: start;
    margin: 0 auto;
}

.circle-intro {
    grid-area: all;
    max-width: 60%;
    z-index: 1;
    opacity: 0;
    animation: appear-circle 1.25s ease-out forwards;
}
@keyframes appear-circle {
    from {
      opacity: 0;
      transform: scale(0.3);
    }
    to {
      opacity: 1;
      transform: scale(1);
    }
}

.img-intro {
    grid-area: all;
    max-width: 65%;
    z-index: 2;
    opacity: 0;
    animation: appear-img 2s 1.25s ease-out forwards;
	min-width: 350px;
	margin-top: -10%;
}
@keyframes appear-img {
    from {
      opacity: 0;
    }
    to {
      opacity: 1;
    }
}
.w3-black, .w3-hover-black:hover {
  color: #000 !important;
  background-color: #fff !important;
}
.w3-text-grey, .w3-hover-text-grey:hover, .w3-text-gray, .w3-hover-text-gray:hover {
  color: #B89817 !important;
}
/* Portfolio*/
.img-product {
  width: 80%;
}
.product-quote{
	width: 80%;
	margin: 0 auto;
}
.w3-row {
  display: flex;
  flex-direction: row;
	flex-wrap:wrap;
	justify-content: space-around;
}

.as-center{
	align-self:center;
}
.as-top{
	align-self: flex-start;
}
.as-bottom{
	align-self: flex-end;
}

.ta-center{
	text-align: center;
}
.ta-left{
	text-align: left;
}
.ta-right{
	text-align: right;
}

li{list-style:none;
margin-bottom: 100px;
}

.product-quote > p {
  font-size: 1.5em;
}

.white-bg{
	background-color: #fff;
}
/*** effect zoom in ***/

.img-zoom-in img 
{
transition:all .2s ease-in-out;
-webkit-transition:all .5s ease-in-out;
-moz-transition:all .5s ease-in-out;
-ms-transition:all .5s ease-in-out;
-o-transition:all .5s ease-in-out;
}

.img-zoom-in:hover img 
{
transform:scale(1.1);
-webkit-transform:scale(1.1);
-moz-transform:scale(1.1);
-ms-transform:scale(1.1);
-o-transform:scale(1.1)
}

.button {
  font-size: 0.8rem;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.25em;
  text-decoration: none;
  color: inherit;
  border: 1px solid #B89817;
	background-color: #fff;
box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, 0.2);
  padding: 1rem 1.5rem;
  cursor: pointer;
}
.vita{
	padding: 0;
}
.vita>li{
	list-style: disc;
	font-size: 1.5em;
}
.vita li::marker{
	color: #B89817;
}

/*-------------Foto-----------------*/
.person {
  align-items: center;
  display: flex;
  flex-direction: column;
}
.container {
  border-radius: 50%;
  height: 312px;
  -webkit-tap-highlight-color: transparent;
  transform: scale(0.48);
  transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1);
  width: 400px;
}
.container:hover {
  transform: scale(0.54);
}
.container-inner {
  clip-path: path(
    "M 390,400 C 390,504.9341 304.9341,590 200,590 95.065898,590 10,504.9341 10,400 V 10 H 200 390 Z"
  );
  position: relative;
  transform-origin: 50%;
  top: -200px;
}
.circle {
  background-color: #B89817;
  border-radius: 50%;
  cursor: pointer;
  height: 380px;
  left: 10px;
  pointer-events: none;
  position: absolute;
  top: 210px;
  width: 380px;
}
.img {
  pointer-events: none;
  position: relative;
  transform: translateY(20px) scale(1.15);
  transform-origin: 50% bottom;
  transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);
}
.container:hover .img {
  transform: translateY(0) scale(1.2);
}
.img1{
left: -10px;
top: 215px;
width: 380px;}

.slider{
	margin-top: 200px;
}
.gallerytext{
	width:600px;
	max-width: 600px;
}
.event-txt{
	font-size: 1.5em;
}
.event-img{
	width: 90%;
	max-width: 700px;
}
@media (max-width:700px){
	.gallerytext{
	width:400px;
}
}
@media (max-width:450px){
	.gallerytext{
	width:300px;
}
}
/*-------------- Vita ------------------------*/
#vita{
	margin-top: 100px;
}
#vita>h2{
	text-align: center;
}
#vita div .w3-col{
	padding: 20px;
}
.portrait {
  max-width: 250px;
}
.vitali{
	text-align: right;
	display: flex;
	align-items: center;
	justify-content: flex-end;
}
.vitare{
  vertical-align: bottom;
  display: flex;
  align-content: flex-end;
  align-items: end;
}
.vitare>p{
	font-size: 1.5em;
	line-height: 1.5;
	padding-top: 50px;
}