@font-face {
  font-family: HelveticaNeo;
  src: url(fonts/HelveticaNowMicro-Regular.otf);
}

*                 {font-family: Helvetica; outline: transparent; -webkit-tap-highlight-color: transparent;}
html			  {-webkit-text-size-adjust: 100%; scroll-behavior: smooth;}
body              {margin: 0; background: white; touch-action: manipulation;}

nav {height: 55px; width: 100%; position: fixed; top: 0; background: rgba(244, 244, 244, 0.85); transition: .4s ease-out; z-index: 99; box-sizing: border-box; -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);}
/* .nav-blur {background: rgba(244, 244, 244, 0.8); backdrop-filter: blur(7px);} */
nav .nav-menu {display: none; position: absolute; width: calc(100% - 190px);}
nav .nav-menu a {font-weight: bold; padding: 8px 10px; border-radius: 10px; transition: .2s ease-in-out; font-size: 16px; margin-right: 7px; box-sizing: border-box;}
nav a {display: inline-block;}
/* #hamburger, .hamburger-close {display: inline-block; max-height: 35px; margin-top: 10px; cursor: pointer; position: absolute; top: 0; right: 15px; filter: invert(1);} */
/* .hamburger-close {display: none;} */
.hamburger-new {display: inline-block; height: 35px; width: 35px; margin-top: 10px; cursor: pointer; position: absolute; top: 0; right: 15px;}
.hamburger-bun {background-color: #141414; position: absolute; height: 3px; width: 100%; transition: .2s ease-in-out;}
.hamburger-bun:nth-of-type(1) {top: 8px;}
.hamburger-bun:nth-of-type(2) {top: 16px;}
.hamburger-bun:nth-of-type(3) {top: 24px;}
#hamburger.close .hamburger-bun:nth-of-type(1) {top: 16px; transform: rotate(45deg);}
#hamburger.close .hamburger-bun:nth-of-type(2) {top: 16px; opacity: 0;}
#hamburger.close .hamburger-bun:nth-of-type(3) {top: 16px; transform: rotate(-45deg);}
nav #more-menu-container, nav #more-menu-container.visible {display: none;}

.mobile-menu {z-index: 250; position: fixed; top: 55px; right: 15px; bottom: 25px; left: 15px; padding: 0; border-radius: 10px; background: #2d2d2d; height: 0; overflow-x: hidden; box-sizing: border-box; transition: .3s ease-out;}
.mobile-menu a {padding: 2px 13px; display: block; text-decoration: none; font-weight: bold; color: white; font-size: 16pt; margin: 6px 0;}
.mobile-menu a.active {border-radius: 10px; padding: 8.2px 12.2px; color: #0074D9; background: rgba(0, 0, 0, 0.4); border: 1px solid rgba(255,255,255,0.15);}

main {background: #f4f4f4;}
.wrapper:not(#homepage-content .wrapper) {padding: 30px 15px 15px; max-width: 1600px; margin: auto;}
h1 {margin: 5px auto 15px; transition: .2s ease-in-out;}
pre {background: gainsboro; padding: 10px; border-radius: 10px; white-space: pre-wrap; border: 1px solid white;}
.no-margin {margin: 0;}

/* Home */
#homepage-content .homepage-content-element:last-of-type {margin-bottom: 10px;}
#homepage-content .homepage-content-element h1 {margin: 30px 0;}
#homepage-content .homepage-content-element:first-of-type h1 {margin: 0 0 30px;}
#homepage-content .homepage-content-element .text-container {padding: 0;}
#homepage-content .homepage-content-element .text-container p:first-of-type {margin-top: 0;}
#homepage-content .homepage-content-element .text-container p:last-of-type {margin-bottom: 0;}
#homepage-content .homepage-content-element .grid-list {margin: 0;}
#homepage-content .homepage-content-element .section-see-more {display: inline-block; margin-top: 15px; padding: 7.2px 12.2px; border-radius: 10px; background: white; border: 1px solid rgba(0,0,0,0.15);}
#homepage-content .homepage-content-element div.blog-list {margin: 0;}

/* Heading*/
.carousel {height: 400px; overflow: hidden; position: relative; border-radius: 10px; background: white;}
.carousel .arrow-prev {left: 12px;}
.carousel .arrow-next {right: 12px;}
.carousel .carousel-item {position: relative; width: 100%; height: 100%; border-radius: 10px; position: absolute; left: 0; display: block;}
.carousel .carousel-item img {width: 100%; height: 100%; object-fit: cover;}
.carousel-heading {position: absolute; bottom: 12px; left: 12px; right: 12px; cursor: pointer; transition: .3s ease-in-out; width: fit-content; border-radius: 8px; border: 1px solid rgba(255, 255, 255, 0.25)}
.carousel-heading-container {transition: .2s ease-in-out; background: rgba(0, 0, 0, 0.7); padding: 12px 15px; border-radius: 8px; display: inline-block; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);}
.carousel-heading-container:hover {background: rgba(0, 0, 0, 0.5);}
.carousel-heading-container:active {background: rgba(0, 0, 0, 0.4);}
.carousel-heading-container p {margin: 0; font-weight: bold; font-size: 22px; background: linear-gradient(to left, #fff, #fff); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}

.mini-items-heading-parent {transition: .2s ease-in-out;}
.mini-items-heading {position: relative; grid-template-columns: repeat(auto-fill, minmax(0, 100%)); gap: 12px; grid-gap: 12px; display: grid; margin: 12px 0 0;}
.mini-items-heading div {position: relative; cursor: pointer; overflow: hidden; border-radius: 10px;}
.mini-items-heading a {text-decoration: none;}
.mini-items-heading div .content {position: relative; height: 100%; width: 100%; background: rgba(0, 0, 0, 0.5); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); z-index: 2; border-radius: 10px; box-sizing: border-box; padding: 22px; color: white; font-weight: bold; font-size: 22px; transition: .2s ease-in-out; overflow: hidden;}
.mini-items-heading div .content .background-text {display: block; position: absolute; top: -25px; margin: 0; left: -10px; font-size: 110px; overflow: hidden; white-space: nowrap; animation: backgroundTextResize 100s; animation-fill-mode: forwards; text-shadow: rgba(0, 0, 0, 0.5) 2px 2px 10px; -webkit-text-stroke: 1px black;}
.mini-items-heading div .content:hover {background: rgba(0, 0, 0, 0.43);}
.mini-items-heading div .content:active {background: rgba(0, 0, 0, 0.37);}
.mini-items-heading div img {position: absolute; top: 0; object-fit: cover; height: 100%; width: 100%; border-radius: 10px;  transition: .4s ease;}
.mini-items-heading div:hover img {transform: scale(1.07);}

/* Buttons*/
.button-generic {color: black; background: #ffcc00; border: 1px solid #e6b800; text-decoration: none; padding: 10px 20px; box-sizing: border-box; display: inline-block; position: relative; line-height: normal; transition: .1s ease-in; font-size: 1em; cursor: pointer; font-weight: bold;}
.button-generic:hover {background: #e6b800;}
.button-generic:active {background: #cca300;}
.button-generic:after {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; 
  -webkit-box-shadow: 0px 0px 17px 0px rgba(0,0,0,0.2); box-shadow: 0px 0px 17px 0px rgba(0,0,0,0.2);}
.link, .link-button, .link-button:visited {text-decoration: none; color: #e6b800; cursor: pointer !important;}
.link-underlined{color: #e6b800;}
.link:hover, .link-button:hover, .link-underlined:hover {color: #cca300;}
.link:active, .link-button:active, .link-underlined:active {color: #cca300;}
.link:visited, .link-underlined:visited {color: #b38f00;}
.strong {font-weight: bold;}

/* Grid*/
div.grid-list {margin: 30px auto 15px; z-index: 1; display: grid; grid-template-columns: repeat(auto-fill, minmax(0, 100%)); gap: 15px; grid-gap: 15px; transition: .2s ease-in-out;}
div.grid-list .list-item {background: black; position: relative; display: inline-block; vertical-align: top; border-radius: 14px; width: 100%; transition: .3s ease-in-out;}
div.grid-list .list-item:hover, div.gallery-grid-list .list-item:hover {transform: scale(1.015);}
div.grid-list .list-item:hover .grid-list-item-img img {transform: scale(1.06);}
div.grid-list .list-item:hover .empty-img img {transform: translate(-50%, -50%) scale(1.15);}
div.grid-list .list-item:hover .grid-list-item-title {transform: scale(1.03);}
div.grid-list .list-item img {height: 200px; width: 100%; object-fit: cover; filter: none; transform: scale(1.01); transition: transform 0.4s cubic-bezier(0, 0.45, 0.6, 0.97); position: relative;}
div.grid-list .list-item .grid-list-item-img, div.grid-list .empty-img {position: relative; height: 200px; box-sizing: content-box; max-width:100%; max-height:100%; border-top-left-radius: 12px; border-top-right-radius: 12px; overflow: hidden; -webkit-mask-image: -webkit-radial-gradient(white, black); transition: .2s ease-in-out;}
div.grid-list .empty-img img {margin: auto; width: 60px !important; height: 60px !important; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: brightness(0.9);}
div.grid-list .empty-img {position: relative; height: 200px; background: #1a1a1a;}
div.grid-list .list-item .grid-list-item-title {position: relative; margin: 0; color: white; background: black; padding: 11px 20px 19px; transition: .2s ease-in-out; font-size: 21px;}
div.grid-list .list-item a {text-decoration: none; display: block; overflow: hidden; border-radius: 14px;}
.image-gradient {background: linear-gradient(
  hsl(0, 0%, 0%) 0%,hsla(0, 0%, 0%, 0.738) 19%,hsla(0, 0%, 0%, 0.541) 34%,hsla(0, 0%, 0%, 0.382) 47%,hsla(0, 0%, 0%, 0.278) 56.5%,hsla(0, 0%, 0%, 0.194) 65%,hsla(0, 0%, 0%, 0.126) 73%,hsla(0, 0%, 0%, 0.075) 80.2%,hsla(0, 0%, 0%, 0.042) 86.1%,hsla(0, 0%, 0%, 0.021) 91%,hsla(0, 0%, 0%, 0.008) 95.2%,hsla(0, 0%, 0%, 0.002) 98.2%,hsla(0, 0%, 0%, 0) 100%);
  position: absolute; width: 100%; height: 37%; bottom: -1px; z-index: 10; transform: rotate(180deg);}

/* Gallery */
div.gallery-grid-list {grid-template-columns: repeat(auto-fill, minmax(0, calc(50% - 4px))); gap: 8px 8px; grid-gap: 8px 8px; margin: 30px auto 15px; z-index: 1; display: grid; transition: .2s ease-in-out;}
div.gallery-grid-list .list-item {background: black; position: relative; display: inline-block; vertical-align: top; width: 100%; transition: .3s ease-in-out; height: fit-content; aspect-ratio: 1; cursor: pointer;}
div.gallery-grid-list .list-item:hover .item-img img {transform: scale(1.06);}
div.gallery-grid-list .list-item img {width: 100%; display: block; object-fit: cover; filter: none; transform: scale(1.01); transition: transform 0.4s cubic-bezier(0, 0.45, 0.6, 0.97); position: relative; aspect-ratio: 1;}
div.gallery-grid-list .list-item .item-img {position: relative; box-sizing: content-box; max-width:100%; max-height:100%; overflow: hidden; -webkit-mask-image: -webkit-radial-gradient(white, black); transition: .2s ease-in-out;}
.image-gradient {background: linear-gradient(
  hsl(0, 0%, 0%) 0%,hsla(0, 0%, 0%, 0.738) 19%,hsla(0, 0%, 0%, 0.541) 34%,hsla(0, 0%, 0%, 0.382) 47%,hsla(0, 0%, 0%, 0.278) 56.5%,hsla(0, 0%, 0%, 0.194) 65%,hsla(0, 0%, 0%, 0.126) 73%,hsla(0, 0%, 0%, 0.075) 80.2%,hsla(0, 0%, 0%, 0.042) 86.1%,hsla(0, 0%, 0%, 0.021) 91%,hsla(0, 0%, 0%, 0.008) 95.2%,hsla(0, 0%, 0%, 0.002) 98.2%,hsla(0, 0%, 0%, 0) 100%);
  position: absolute; width: 100%; height: 37%; bottom: -1px; z-index: 10; transform: rotate(180deg);}

/* Images*/
.images-module-container {position: relative; width: 100%; max-width: 620px; margin: 15px 0 0; display: inline-block;}
.image-module-element {display: none;}
.images-wrapper {position: relative; width: 100%; min-height: 310px; aspect-ratio: 16/9; cursor: pointer; overflow: hidden;}
.images-wrapper .image-module-element {position: absolute; width: 100%; height: 100%; object-fit: cover; display: block;}
.arrow-prev, .arrow-next {position: absolute; height: 25px; padding: 13px; background: rgba(0,0,0,0.7); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-radius: 40px; top: 50%; transform: translateY(-50%); cursor: pointer; transition: .2s ease-in-out; z-index: 5; border: 1px solid rgba(255, 255, 255, 0.25);}
.arrow-prev:hover, .arrow-next:hover, .viewer.close:hover {background: rgba(20, 20, 20, 0.5);}
.arrow-prev:active, .arrow-next:active .viewer.close:hover {background: rgba(0,0,0,0.4);}
.images-wrapper .arrow-prev {left: 10px;}
.images-wrapper .arrow-next {right: 10px;}
.image-selectors {margin: 1px 5px;}
.carousel-image-selectors {margin: 1px 5px -8px;}
.selector-dot {width: 30px; height: 8px; border-radius: 4px; background: rgba(0, 0, 0, 0.8); display: inline-block; cursor: pointer; margin-top: 6px;}
.selector-dot:hover {background: rgba(0, 0, 0, 0.6);}
.selector-dot:active {background: rgba(0, 0, 0, 0.5);}
.selector-dot.active {background: rgba(0, 0, 0, 0.4);}

/* Text Container*/
.text-container {max-width: 1100px; padding: 5px 0 0;}
.text-container a {color: #cca300; font-weight: bold;}
.text-container p, .text-container p .ql-size-normal {font-size: 17px; min-height: 1px;}
.text-container p .ql-size-tiny {font-size: 10px;}
.text-container p .ql-size-small {font-size: 14px;}
.text-container p .ql-size-large {font-size: 24px;}
.text-container p .ql-size-huge {font-size: 36px;}
.text-container h1, .text-container h1 .ql-size-normal {font-size: 32px;}
.text-container h1 .ql-size-tiny {font-size: 18px;}
.text-container h1 .ql-size-small {font-size: 26px;}
.text-container h1 .ql-size-large {font-size: 36px;}
.text-container h1 .ql-size-huge {font-size: 42px;}
.text-container h2, .text-container h2 .ql-size-normal {font-size: 26px;}
.text-container h2 .ql-size-tiny {font-size: 16px;}
.text-container h2 .ql-size-small {font-size: 22px;}
.text-container h2 .ql-size-large {font-size: 32px;}
.text-container h2 .ql-size-huge {font-size: 36px;}
.text-container h3, .text-container h3 .ql-size-normal {font-size: 22px;}
.text-container h3 .ql-size-tiny {font-size: 14px;}
.text-container h3 .ql-size-small {font-size: 18px;}
.text-container h3 .ql-size-large {font-size: 26px;}
.text-container h3 .ql-size-huge {font-size: 32px;}
.text-container h4, .text-container h4 .ql-size-normal {font-size: 18px;}
.text-container h4 .ql-size-tiny {font-size: 12px;}
.text-container h4 .ql-size-small {font-size: 14px;}
.text-container h4 .ql-size-large {font-size: 22px;}
.text-container h4 .ql-size-huge {font-size: 26px;}


.text-container img {width: 100%; max-width: 500px;}

/* Image- Viewer*/
#image-viewer {display: none;}
.viewer-image {display:none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 101; max-width: calc(100% - 40px); max-height: calc(100% - 140px); border-radius: 10px;}
.image-viewer-controls {z-index: 101; position: fixed; background: rgba(0, 0, 0, 0.8); border-radius: 12px; top: 10px; right: 10px; padding: 3px 3px 0 3px}
.image-viewer-controls .arrow-prev, .image-viewer-controls .arrow-next {border: none;}
.viewer.close {position: fixed; z-index: 101; height: 25px; padding: 13px; background: rgba(0,0,0,0.7); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-radius: 40px; top: 15px; right: 15px; cursor: pointer; transition: .2s ease-in-out;}
.viewer.arrow-prev, .viewer.arrow-next, .image-viewer-controls .viewer.close {height: 22px; padding: 10px; position: relative; display: inline-block; transform: none; top:0; left: 0; right: 0; background: rgba(255, 255, 255, 0.03);}
.viewer.arrow-prev:hover, .viewer.arrow-next:hover, .image-viewer-controls .viewer.close:hover {background: rgba(255, 255, 255, 0.1);}
.viewer.arrow-prev:active, .viewer.arrow-next:active, .image-viewer-controls .viewer.close:active {background: rgba(255, 255, 255, 0.15);}

/* Popup- General*/
.popup-background {width: 100%; height: 130%; position: fixed; display: block; z-index: 100; background:rgba(0, 0, 0, 0.1); backdrop-filter: blur(0px); -webkit-backdrop-filter: blur(0px); top: 0; left: 0; animation: dimAndBlur .4s; animation-fill-mode: forwards;}

/* Popup - Small*/
.popup-small {position: fixed; z-index: 101; background: white; top: 50%; left: 50%; transform: translate(-50%, -50%); overflow: hidden; text-align: center; width: 90%; max-width: 400px; box-sizing: border-box; padding: 25px; will-change: transform, opacity; animation: popupLoad .5s; animation-fill-mode: forwards;}
#cookies-popup h3 {margin-top: 5px;}
#cookies-popup p {margin-bottom: 22px;}
#cookies-popup .button-generic {margin: 5px auto;}
#cookies-popup p a {color: #cca300; font-weight: bold;}

/* Input*/
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active {background: transparent;}
.input-generic {-webkit-appearance: none; user-select: text; border: 1px solid; padding: 12px; position: relative; border-color: #f2f2f2; font-size: 14px; transition: .2s ease;}
.input-generic:after {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; 
	-webkit-box-shadow: 0px 0px 17px 0px rgba(0,0,0,0.2); box-shadow: 0px 0px 17px 0px rgba(0,0,0,0.2);}
.input-generic:focus, .select-generic:focus {border-color: #cca300;}

/* Shadows*/
.shadow		{-webkit-box-shadow: 10px 7px 33px -6px rgba(0,0,0,0.4); -moz-box-shadow: 10px 7px 33px -6px rgba(0,0,0,0.4); box-shadow: 10px 7px 33px -6px rgba(0,0,0,0.4);}
.shadow-2	{-webkit-box-shadow: 10px 7px 33px -6px rgba(0,0,0,0.3); -moz-box-shadow: 10px 7px 33px -6px rgba(0,0,0,0.3); box-shadow: 10px 7px 33px -6px rgba(0,0,0,0.3);}
.shadow-3	{-webkit-box-shadow: 10px 7px 33px -6px rgba(0,0,0,0.2); -moz-box-shadow: 10px 7px 33px -6px rgba(0,0,0,0.2); box-shadow: 10px 7px 33px -6px rgba(0,0,0,0.2);}
.shadow-center {-webkit-box-shadow: 0px 0px 17px 0px rgba(0,0,0,0.2); -moz-box-shadow: 0px 0px 17px 0px rgba(0,0,0,0.2); box-shadow: 0px 0px 17px 0px rgba(0,0,0,0.2);}
.shadow-center-strong {-webkit-box-shadow: 0px 0px 17px 0px rgba(0,0,0,0.3); -moz-box-shadow: 0px 0px 17px 0px rgba(0,0,0,0.3); box-shadow: 0px 0px 17px 0px rgba(0,0,0,0.3);}
.shadow-input {-webkit-box-shadow: 0px 0px 17px 0px rgba(0,0,0,0.2); -moz-box-shadow: 0px 0px 17px 0px rgba(0,0,0,0.2); box-shadow: 0px 0px 17px 0px rgba(0,0,0,0.2);}
.shadow-box:after {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; border-radius: 9px; 
  -webkit-box-shadow: 0px 0px 17px 0px rgba(0,0,0,0.2); -moz-box-shadow: 0px 0px 17px 0px rgba(0,0,0,0.2); box-shadow: 0px 0px 17px 0px rgba(0,0,0,0.2);}

/* Footer*/
footer {padding: 20px 20px 40px; background: white; max-width: 1600px; margin: auto;}
footer p, footer .copyright-info a, footer .copyright-info a:link, footer .copyright-info a:visited, footer .copyright-info:hover a, footer .copyright-info a:active {color: #515154; font-size: 15px;}
.footer-items {display: block;}
.footer-items a {display: inline-block; margin: 0 0 5px 0;}
footer .footer-separator {margin: 0 2px;}
footer .footer-separator:last-of-type {display: none;}
.footer-social-icons {display: inline-block; margin: 0 0 3px -3px;} 
.footer-social-icon {display: inline-block;}
.footer-social-icon, .footer-social-icon img {height: 25px; transition: .2s ease-in-out; filter: invert(15%)}
.footer-social-icon:hover > img {filter: invert(30%)}

/* TEMPLATES */
/* Contact form */
.contact-form .input-generic {margin: 5px 0; width: 100%; max-width: 500px; box-sizing: border-box;}
.contact-form textarea.input-generic {height: 200px; resize: none;}
.contact-form #submit {margin: 10px 0 15px;}
.contact-form small {color: gray;}
.contact-form small a {color: #cca300; font-weight: bold;}

/* Other */
.hidden {display: none;}
.h0 {height: 0px !important;}
.w0 {width: 0px !important;}
.h0, .w0 {margin: 0px !important; padding: 0px !important; border: 0px !important; display: block !important;}
.grecaptcha-badge {border-radius: 10px !important; box-shadow: none !important; visibility: hidden;}

/* Transitions*/
@keyframes dimAndBlur {
	0% {background:rgba(0, 0, 0, 0.1); -webkit-backdrop-filter: blur(0px); backdrop-filter: blur(0px);}
	100% {background:rgba(0, 0, 0, 0.7); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);}
}
@keyframes popupLoad {
	0% {transform: translate(-50%, -50%) scale(.4) translateY(-10%);}
	100% {transform: translate(-50%, -50%) scale(1) translateY(0);}
}
@keyframes backgroundTextResize {
	0% {transform: scale(1); opacity: 0.06;}
	50% {opacity: 0.06;}
	100% {transform: scale(2); opacity: 0;}
}
@keyframes backgroundImageResize {
	0% {transform: scale(1);}
	100% {transform: scale(1.2);}
}

/* Media Query*/
@media screen and (min-width: 350px) {
	div.grid-list .list-item img {height: 250px;}
	div.grid-list .list-item .grid-list-item-img, div.grid-list .empty-img {height: 250px;}
}

@media screen and (min-width: 460px) {
	.mini-items-heading {grid-template-columns: repeat(auto-fill, minmax(0, calc(50% - 6px))); margin: 12px 0 0;}
}

@media screen and (min-width: 530px) {
	div.grid-list {grid-template-columns: repeat(auto-fill, minmax(0, calc(50% - 5px))); gap: 10px 8px; grid-gap: 15px 10px;}
}

@media screen and (min-width: 600px) {
	div.blog-list .list-item .list-item-img {height: 230px; width: 230px;}
	div.blog-list .list-item .list-item-info {margin: 20px 20px 20px 0; width: calc(100% - 295px);}
	div.blog-list .list-item.imageless .list-item-info {width: calc(100% - 40px);}

	div.blog-list .list-item .blog-intro-gradient-wrapper {max-height: 174px; box-sizing: border-box; border-radius: 11px;}
}

@media screen and (min-width: 960px) {
}