/* @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap'); */

:root {
	--font-default: 'Arial', sans-serif;
	--font-alternative: 'Montserrat', sans-serif;
	--font-default-weight: 400;
	--font-bold-weight: 700;
	--font-size-default: 16px;
	--font-size-xl: 32px;
	--font-size-lg: 24px;
	--font-size-md: 18px;
	--font-size-sm: 14px;
	--font-size-xs: 12px;
	--c-ink-100: #111;
	--c-ink-90: #333;
	--c-ink-75: #666;
	--c-ink-50: #999;
	--c-ink-30: #ccc;
	--c-ink-20: #ddd;
	--c-ink-10: #eee;
	--c-ink-0: #fff;
	--c-primary: #fc0;
	--c-primary-rgb: 255, 204, 0;
	--opacity-hover: .75;
	--opacity-50: .5;
	--opacity-focus: .25;
	--transition: all .2s ease-out;
	--transition-loading: opacity 1s ease-out;
}

/*Basics*/
body { font-size: var(--font-size-default); font-family: var(--font-default); background: var(--c-ink-100); color: var(--c-ink-20); }
.text-primary { color: var(--c-primary) !important; }
.text-dark { color: var(--c-ink-100) !important; }

/*Lazyload animation*/
.lazy { opacity: 0; }
.lazy:not(.initial) { transition: var(--transition-loading); }
.lazy.initial,
.lazy.loaded,
.lazy.error { opacity: 1; }
.lazy:not([src]) { visibility: hidden; }

/*Typography*/
h1, h2, h3, h4, h5, h6,
.altFont { font-family: var(--font-alternative); }
h1, h2, h3, h4, h5, h6,
.bold { font-weight: var(--font-bold-weight); }
.text-xl { font-size: var(--font-size-xl); font-family: var(--font-alternative); }
.text-lg { font-size: var(--font-size-lg); font-family: var(--font-alternative); }
.text-md { font-size: var(--font-size-md); font-family: var(--font-alternative); }
.text-default { font-size: var(--font-size-default); }
.text-sm { font-size: var(--font-size-sm); }
.text-xs { font-size: var(--font-size-xs); }

/*Link and Button*/
a { color: var(--c-primary); transition: var(--transition); }
a:hover { color: var(--c-primary); opacity: var(--opacity-hover); }
.btn-outline-primary { text-transform: uppercase; padding: 10px 30px 9px; border-color: var(--c-primary); color: var(--c-primary); _font-family: var(--font-alternative); font-weight: var(--font-bold-weight); }
.btn-outline-primary:hover,
.btn-check:active+.btn-outline-primary,
.btn-check:checked+.btn-outline-primary,
.btn-outline-primary.active,
.btn-outline-primary.dropdown-toggle.show,
.btn-outline-primary:active { border-color: var(--c-primary); background-color: var(--c-primary); color: var(--c-ink-100); opacity: 1; }
.btn-check:focus+.btn-outline-primary,
.btn-outline-primary:focus,
.btn-check:active+.btn-outline-primary:focus,
.btn-check:checked+.btn-outline-primary:focus,
.btn-outline-primary.active:focus,
.btn-outline-primary.dropdown-toggle.show:focus,
.btn-outline-primary:active:focus { box-shadow: 0 0 0 0.25rem rgba(var(--c-primary-rgb) , var(--opacity-focus)); }

/*overwrite classes*/
.border, .border-top, .border-bottom, .border-start, .border-end { border-color: var(--c-ink-90) !important; }


/*Header*/
header { background: var(--c-ink-100); }
header .navbar { height: 80px; }
header .navbar .navbar-nav { align-items: center; justify-content: center; width: 100%; }
header .navbar .nav-item {  }
header .navbar .nav-item.item-logo { order: 3; }
header .navbar .nav-item.item-bio { order: 1; }
header .navbar .nav-item.item-gallery { order: 2; }
header .navbar .nav-item.item-events { order: 4; }
header .navbar .nav-item.item-contacts { order: 5; }
header .navbar .nav-item a { margin: 0 30px; padding-bottom: 28px; color: var(--c-ink-0); text-decoration: none; }
header .navbar .nav-item a:hover { color: var(--c-primary); opacity: 1 }
header .navbar .nav-item.active a { color: var(--c-primary); border-bottom: 3px solid var(--c-primary); }
header .navbar .nav-item.item-logo a { border: none; }
header .navbar-collapse { background: var(--c-ink-100); }
header .navbar-toggler { position: absolute; left: 0; top: calc(50% - 20px); }
.navbar-dark .navbar-toggler,
.navbar-dark .navbar-toggler:focus,
.navbar-dark .navbar-toggler { border: none; box-shadow: none; }
@media only screen and (max-width: 767px) {
	header .navbar .navbar-nav { padding: 20px; border-bottom: 1px solid var(--c-ink-90); }
	header .navbar .nav-item { margin-bottom: 5px; }
	header .navbar .nav-item.active a { border: none; }
}


/*Hero(s)*/
.hero-area { /*background: #ccc url(../_img/hero-homepage.jpg) no-repeat center top / cover;*/ height: calc(100vh - 80px); display: flex; align-items: flex-end; position: relative; }
.hero-area > .hero-overlay { background-image: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,.2), rgba(255,255,255,.8)); display: block; position: absolute; left: 0; right: 0; bottom: 0; height: 200px; z-index: 1; }
.hero-area .container { position: relative; z-index: 10; }
.hero-area .cite-text { max-width: 650px; margin: 0 auto; }
.hero-area cite { font-style: normal; display: inline; background: var(--c-ink-100); line-height: 1.2; padding: 2px; }
.hero-area cite > span { color: var(--c-primary); }

.hero-area-page { height: 320px; display: flex; position: relative; align-items: center; justify-content: center; }
.hero-area-page > .hero-overlay { background: var(--c-ink-100); display: block; position: absolute; left: 0; right: 0; bottom: 0; top:0; z-index: 1; opacity: var(--opacity-50); }
.hero-area-page > h1 { position: relative; z-index: 10; }


/*Bio*/
.photo-bio { border: 10px solid rgba(var(--c-primary-rgb) , var(--opacity-focus)); }
@media only screen and (max-width: 767px) {
	.photo-bio { margin-bottom: 2rem; }
}


/*Gallery*/
.item-preview { background: no-repeat center top / 100%; display: block; height: 300px; text-decoration: none; color: var(--c-ink-0); position: relative; transition: var(--transition); }
.item-preview::after { content: ''; border: 10px solid rgba(0,0,0,.5); position: absolute; bottom: 0; top: 0; left: 0; right: 0; z-index: 10; transition: var(--transition); }
.item-preview:hover { opacity: 1; color: var(--c-ink-0); background-size: 115%; }
.item-preview:hover::after { border-width: 2px; }
.item-preview > span { background: rgba(0,0,0,.65); position: absolute; bottom: 0; left: 0; right: 0; padding: 10px 0; }
.item-preview.gallery-olio { background-image: url(../_img/gallery-olio.jpg); }
.item-preview.gallery-grafite { background-image: url(../_img/gallery-grafite.jpg); }
.item-preview.gallery-tecniche-miste { background-image: url(../_img/gallery-tecniche-miste.jpg); background-position: center; }

.category-list a { display: block; color: var(--c-ink-0); text-decoration: none; border-bottom: 2px solid transparent; }
.category-list a:hover { color: var(--c-primary); opacity: 1; }
.category-list .active a { color: var(--c-primary); border-color: var(--c-primary); }

@media only screen and (max-width: 767px) {
	.category-list a { font-size: var(--font-size-default); text-transform: capitalize; }
}

.gallery-list .gallery-item { color: var(--c-ink-50); }
.gallery-list .gallery-item > a { height: 380px; overflow: hidden; display: block; }
.gallery-list .gallery-item > a > img { object-fit: cover; object-position: 50% 0; min-width: 100%; min-height: 100%; max-width: 100%; transition: var(--transition); }
.gallery-list .gallery-item > a:hover { opacity: 1; }
.gallery-list .gallery-item > a:hover > img { transform: scale(1.2); }
.gallery-list .gallery-item h3 { font-weight: normal; color: var(--c-ink-0); }

	.page-event .gallery-list .gallery-item > a { height: 260px; }

@media only screen and (max-width: 992px) {
	.gallery-list .gallery-item > a { height: 300px; }
}
@media only screen and (max-width: 768px) {
	.gallery-list .gallery-item > a { height: auto; }
	.gallery-list .gallery-item > a > img { object-fit: initial; object-position: unset; min-height: 0; min-width: 0; }
}





/*Footer*/
footer { color: var(--c-ink-50); }