@import url("https://fonts.googleapis.com/css2?family=Young+Serif&display=swap");
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap');

.hp-body-content {
	position: relative;
	z-index: 3000;
}


/* Holding Page 1 */
.hp-body-1 {
    --primary-font: 'Inter', sans-serif;
	--alt-font: "Young Serif", serif;

	background-color: var(--primary-color);
	overflow: hidden;
}
.hp-body-1 .hp-back-container {
	height: 100vh;
	width: 100vw;
	overflow: hidden;
}
.hp-body-1 .hp-back {
	min-height: 100vh;
	filter: brightness(0) invert(1);
	-webkit-filter: brightness(0) invert(1);
	opacity: 10%;
}
.hp-body-1 .hp-logo-container {
	height: 100vh;
	width: 100vw;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	position: absolute;
}
.hp-body-1 .hp-content-container {
	text-align: center;
	width: 100vw;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	position: absolute;
	padding: calc(2rem + 3.5vh) 1rem;
	bottom: 0;
	top: 0;
}
.hp-body-1 .hp-logo {
	width: 100%;
	max-width: 40rem;
	margin-bottom: calc(2rem + 3.5vh);
	filter: brightness(0) invert(1);
	-webkit-filter: brightness(0) invert(1);
	opacity: 70%;
}
.hp-body-1 .hp-slogan {
	margin-bottom: calc(2rem + 3.5vh);
	font-size: 5rem;
	color: var(--secondary-color);
	opacity: 80%;
	font-weight: 200;
}
.hp-body-1 .hp-description {
	font-size: 2.5rem;
	font-weight: 200;
	color: var(--secondary-color);
	font-family: var(--alt-font);
}
.hp-body-1 .hp-coming-soon {
	font-size: 2rem;
	text-transform: lowercase;
	color: var(--secondary-color);
	font-family: var(--alt-font);
}
.hp-body-1 .hp-email {
	font-size: 1.3rem;
	font-weight: 300;
	margin: 0;
}
.hp-body-1 .hp-email a {
	color: var(--primary-color);
}
.hp-body-1 .hp-email a:hover {
	color: var(--primary-hover-color);
}
.hp-body-1 .hp-phone {
	font-size: 1.3rem;
	font-weight: 300;
	margin: 0;
}
.hp-body-1 .hp-phone a {
	color: var(--primary-color);
}
.hp-body-1 .hp-phone a:hover {
	color: var(--primary-hover-color);
}
@media (max-width: 900px) {
	.hp-body-1 .hp-slogan {
		font-size: 3rem;
		font-weight: 200;
	}
	.hp-body-1 .hp-description {
		font-size: 1.5rem;
		font-weight: 200;
	}
	.hp-body-1 .hp-coming-soon {
		font-size: 1.2rem;
		text-transform: lowercase;
	}
	.hp-body-1 .hp-email {
		font-size: 1rem;
		font-weight: 300;
	}
	.hp-body-1 .hp-phone {
		font-size: 1rem;
		font-weight: 300;
	}
}
@media (max-width: 500px) {
	.hp-body-1 .hp-slogan {
		font-size: 1.8rem;
		font-weight: 200;
	}
	.hp-body-1 .hp-description {
		font-size: 1.4rem;
		font-weight: 200;
	}
	.hp-body-1 .hp-coming-soon {
		font-size: 1.1rem;
		text-transform: lowercase;
	}
	.hp-body-1 .hp-email {
		font-size: 0.95rem;
		font-weight: 300;
	}
	.hp-body-1 .hp-phone {
		font-size: 0.95rem;
		font-weight: 300;
	}
}

:root {
	--content-width: 1100px;
	--br-def: 0.8rem;
	--nav-hide: 0px;
	--nav-height: 0px;
	--transition-def: 0.4s;
	--long-transition-def: 2.5s;
    --primary-font: 'Inter', sans-serif;
	--alt-font: "Young Serif", serif;
}

/* General Styling */
body {
	font-family: var(--primary-font);
	transition: var(--transition-def) !important;
	background-color: var(--page-bg-color);
	color: var(--page-text-color);
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	overflow-x: hidden;
}
.body-grow {
  flex-grow: 1;
}
.lock-movement {
	overflow: hidden;
}
.no-br {
	border-radius: 0;
}
.br-c {
	border-radius: var(--br-def) !important;
	-webkit-border-radius: var(--br-def) !important;
	-moz-border-radius: var(--br-def) !important;
	-ms-border-radius: var(--br-def) !important;
	-o-border-radius: var(--br-def) !important;
}
.br-c .br-c {
	border-radius: calc(var(--br-def) / 2);
	-webkit-border-radius: calc(var(--br-def) / 2);
	-moz-border-radius: calc(var(--br-def) / 2);
	-ms-border-radius: calc(var(--br-def) / 2);
	-o-border-radius: calc(var(--br-def) / 2);
}
.vh-100 {
	height: 100vh !important;
	height: calc(var(--vh, 1vh) * 100) !important;
}
.img-left {
	float: left;
	max-width: 50%;
	padding: 10px 10px 10px 0px;
	height: auto;
}
.img-right {
	float: right;
	max-width: 50%;
	padding: 10px 0px 10px 10px;
	height: auto;
}
.row {
	margin: 0;
}
/* ::-webkit-scrollbar {
  width: 7px;
}
::-webkit-scrollbar-track {
  background: #000000;
}
::-webkit-scrollbar-thumb {
  background: var(--primary-color);
  border-radius: var(--br-def);
} */
a {
	text-decoration: none;
	color: var(--nav-text-color);
	transition: var(--transition-def);
	-webkit-transition: var(--transition-def);
	-moz-transition: var(--transition-def);
	-ms-transition: var(--transition-def);
	-o-transition: var(--transition-def);
}
a:hover {
	color: var(--nav-text-hover-color);
}
.card {
	border-radius: var(--br-def);
}
::selection {
	background: var(--secondary-color);
	color: white;
}
::-moz-selection {
	background: var(--secondary-color);
	color: white;
}
body::after {
	content: "";
	position: fixed;
	pointer-events: none;
	z-index: 900;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: rgba(var(--page-bg-color-rgb), 1);
	transition: var(--long-transition-def);
	-webkit-transition: var(--long-transition-def);
	-moz-transition: var(--long-transition-def);
	-ms-transition: var(--long-transition-def);
	-o-transition: var(--long-transition-def);
}
body.loaded::after {
	background-color: rgba(var(--page-bg-color-rgb), 0);
}
body::-webkit-scrollbar {
	width: 0px;
  }
.SmoothScroll {
	position: fixed;
	width: 100%;
  }

/* Buttons */
.btn {
	border: 0 !important;
	box-shadow: none !important;
	outline: 0 !important;
	font-weight: 600;
	border-radius: var(--br-def) !important;
	-webkit-border-radius: var(--br-def) !important;
	-moz-border-radius: var(--br-def) !important;
	-ms-border-radius: var(--br-def) !important;
	-o-border-radius: var(--br-def) !important;
}
.btn-primary {
	background-color: var(--primary-color);
	color: white;
}
.btn-primary:hover {
	background-color: var(--primary-hover-color);
	color: white;
}
.btn-secondary {
	background-color: var(--secondary-color);
	color: white;
}
.btn-secondary:hover {
	background-color: var(--secondary-hover-color);
	color: white;
}
.btn-info {
	background-color: var(--info-color);
	color: white;
}
.btn-info:hover {
	background-color: var(--info-hover-color);
	color: white;
}
.btn-light {
	background-color: white;
	color: var(--primary-color);
}
.btn-light:hover {
	background-color: rgb(224, 229, 231);
	color: var(--primary-color);
}

/* Testimonials */
.blockquote-footer {
	background: none;
}
.testimonial-custom {
	min-height: 350px;
	background-color: #ebebeb;
}
.testimonial-panel {
	width: 100%;
	min-height: 350px;
	background-color: #dddddd;
}
@media only screen and (max-width: 576px) {
	.testimonial-panel {
		min-height: 600px;
	}
	footer .text-start,
	footer .text-end {
		text-align: center !important;
	}
}
.testimonial-overlay {
	text-align: center;
	width: 100%;
	height: 100%;
	position: relative;
}
.blockquote {
	font-size: 1.15rem;
}
.testimonial-overlay .blockquote {
	line-height: 1.67;
	color: black;
	font-style: italic;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.blockquote-footer {
	font-weight: 800;
}
.testimonial-overlay cite {
	font-style: normal;
}
.fade {
	transition: opacity 0.4s linear !important;
}
.show {
	opacity: 1 !important;
}
.hide {
	opacity: 0 !important;
}

/* Carousel */
.carousel-img {
	background-position: center;
	background-size: cover;
	min-height: 40rem;
	display: flex;
	align-items: end;
}
.carousel-gradient {
	min-height: 50%;
	width: 100%;
	padding: 0 10% 1.5rem 10%;
	color: var(--carousel-text);
	text-shadow: 0px 3px 20px #000000;
	display: flex;
	align-items: end;
	justify-content: center;
	background: linear-gradient(0deg, #000000be 0%, rgba(255, 255, 255, 0) 100%);
}
.carousel-gradient h3 {
	font-size: calc(1vw + 2rem);
	margin: 0;
}
.carousel-gradient p {
	font-size: calc(0.5vw + 1rem);
}
.carousel-btn {
	background-color: transparent;
	border: 2px solid var(--carousel-text);
	color: var(--carousel-text);
	border-radius: 50rem;
	-webkit-border-radius: 50rem;
	-moz-border-radius: 50rem;
	-ms-border-radius: 50rem;
	-o-border-radius: 50rem;
	padding: 0.3rem 1rem;
	transition: var(--transition-def);
	-webkit-transition: var(--transition-def);
	-moz-transition: var(--transition-def);
	-ms-transition: var(--transition-def);
	-o-transition: var(--transition-def);
}
.carousel-btn:hover {
	background-color: var(--carousel-text);
	color: black;
}

/* Forms */
.nostyle-form {
	display: block;
	width: 100%;
	font-size: 1rem;
	font-weight: 400;
	color: #212529;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border-radius: 0 0 10px 10px;
	padding: 0.2rem 0.5rem;
	border: 0 !important;
	outline: 0 !important;
	background-color: #ffffff75 !important;
}
.nostyle-form-box {
	border: 1px solid rgba(214, 214, 214, 0.514);
	background-color: #ffffff75;
	border-radius: var(--br-def);
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
	transition: background-color 5000s ease-in-out 0s;
}
.form-control {
	border-radius: var(--br-def);
}

/* Navbar */
#navTop {
	position: fixed;
	z-index: 1500;
	top: 3rem;
	left: 3rem;
	right: 3rem;
	transition: 0.8s;
	-webkit-transition: 0.8s;
	-moz-transition: 0.8s;
	-ms-transition: 0.8s;
	-o-transition: 0.8s;
}
.nav-icon {
  max-width: 100%;
  filter: brightness(0) invert(1)  drop-shadow(0px 0px 10px #000000c2);
  -webkit-filter: brightness(0) invert(1)  drop-shadow(0px 0px 10px #000000c2);
  opacity: 80%;
}
.nav-icon-mob {
	display: none;
	filter: brightness(0) invert(1)  drop-shadow(0px 0px 10px #000000c2);
	-webkit-filter: brightness(0) invert(1)  drop-shadow(0px 0px 10px #000000c2);
	opacity: 80%;
}
.nav-scroll {
	top: 1rem !important;
}
.nav-hide {
	top: calc(var(--nav-height) * -1) !important;
}
#navTop .content {
	padding: 0.5rem;
	display: flex;
	flex-wrap: wrap;
  justify-content: end;
}
#navTop .left-container {
  flex-grow: 1;
  position: relative;
  z-index: 1100;
}
#navTop .right-container {
	width: auto;
}
#navTop img {
	max-height: 4rem;
}
#navTop ul {
	backdrop-filter: blur(40px);
	-webkit-backdrop-filter: blur(35px);
	border-radius: var(--br-def);
	-webkit-border-radius: var(--br-def);
	-moz-border-radius: var(--br-def);
	-ms-border-radius: var(--br-def);
	-o-border-radius: var(--br-def);
	box-shadow: 0px 0px 30px 0px #00000031;
	padding: 1rem 2rem;
	background-color: rgba(var(--nav-bg-color-rgb), 0.1);
	border: 1px solid rgba(var(--nav-bg-color-rgb), 0.2);
	list-style: none;
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}
#navTop li {
	padding: 0 1rem;
	float: left;
}
#navTop li a {
	color: var(--nav-text-color);
	font-size: 1.1rem;
	font-weight: 600;
}
#navTop li a:hover {
	color: var(--nav-text-hover-color);
	font-size: 1.1rem;
	font-weight: 600;
}
#navTop button#expandNav {
	display: none;
	width: 4rem;
	height: 4rem;
	background-color: rgba(var(--nav-bg-color-rgb), 0.1);
	border: 1px solid rgba(var(--nav-bg-color-rgb), 0.2);
	backdrop-filter: blur(40px);
	-webkit-backdrop-filter: blur(35px);
	border-radius: var(--br-def);
	-webkit-border-radius: var(--br-def);
	-moz-border-radius: var(--br-def);
	-ms-border-radius: var(--br-def);
	-o-border-radius: var(--br-def);
	box-shadow: 0px 0px 30px 0px #00000031;
	color: var(--nav-text-color);
	position: relative;
}
#navTop button#expandNav .icon-holder {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0%;
	pointer-events: none;
	transition: var(--transition-def);
	-webkit-transition: var(--transition-def);
	-moz-transition: var(--transition-def);
	-ms-transition: var(--transition-def);
	-o-transition: var(--transition-def);
}
#navTop button#expandNav .icon-holder.active {
	opacity: 100%;
}
body#home .nav-slogan {
	display: none;
}

/* footer */
footer {
	background-color: var(--page-bg-color);
	color: var(--footer-text);
	/* min-height: 100vh; */
	position: relative;
	padding: 1rem 2rem;
}
footer::before {
	content: "";
	position: absolute;
	z-index: 150;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: linear-gradient(0deg, var(--footer-bg) 0%, #ffffff00 100%);
}
.footer-content {
	position: relative;
	z-index: 200;
	/* min-height: 100vh; */
	display: flex;
	flex-direction: column;
	justify-content: end;
	align-items: center;
}
.footer-fill {
	flex-grow: 1;
	width: 100%;
	margin-bottom: 1rem;
	padding: 0 var(--br-def);
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: end;
}
.footer-logo {
	max-width: 30rem;
	width: 100%;
	filter: brightness(0) invert(1);
	-webkit-filter: brightness(0) invert(1);
	margin-bottom: 0.75rem;
}
.footer-slogan {
	margin-bottom: 0;
	font-size: 1.1rem;
	font-weight: 600;
	color: rgba(var(--footer-text-rgb), 0.75);
	padding: 0 2rem;
}
.footer-header {
	margin-bottom: 0.2rem;
	font-size: 1.1rem;
	font-weight: 600;
	color: rgba(var(--footer-text-rgb), 1);
}
.footer-links {
	display: flex;
	flex-wrap: wrap;
	padding: 3rem 2rem;
}
.footer-links ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
.footer-links a {
	position: relative;
	margin-bottom: 3px;
	font-weight: 500;
}
.footer-links a::after {
	content: "";
	background-color: var(--footer-link-color);
	position: absolute;
	bottom: -2px;
	height: 2px;
	left: 0;
	right: 100%;
	border-radius: 1rem;
	-webkit-border-radius: 1rem;
	-moz-border-radius: 1rem;
	-ms-border-radius: 1rem;
	-o-border-radius: 1rem;
	transition: var(--transition-def);
	-webkit-transition: var(--transition-def);
	-moz-transition: var(--transition-def);
	-ms-transition: var(--transition-def);
	-o-transition: var(--transition-def);
}
.footer-links a:hover::after {
	background-color: var(--footer-link-color-hover);
	right: 0;
}
.footer-links .quick-links {
	min-width: 20rem;
	max-width: 100%;
}
.footer-links .contact {
	min-width: 20rem;
	max-width: 100%;
}
#topBtn {
	background-color: rgba(var(--footer-text-rgb), 0.1);
	border: 1px solid rgba(var(--footer-text-rgb), 0.1);
	position: absolute;
	right: 0;
	bottom: 0;
	height: 4rem;
	width: 4rem;
	border-radius: var(--br-def);
	-webkit-border-radius: var(--br-def);
	-moz-border-radius: var(--br-def);
	-ms-border-radius: var(--br-def);
	-o-border-radius: var(--br-def);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--footer-text);
}
.footer-bottom {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	background-color: rgba(var(--footer-text-rgb), 0.1);
	border: 1px solid rgba(var(--footer-text-rgb), 0.1);
	border-radius: var(--br-def);
	-webkit-border-radius: var(--br-def);
	-moz-border-radius: var(--br-def);
	-ms-border-radius: var(--br-def);
	-o-border-radius: var(--br-def);
}
.footer-bottom p {
	margin: 0;
}
.footer-bottom-left {
	width: auto;
	text-align: center;
	padding: 1rem 1.5rem;
}
.footer-bottom-right {
	width: auto;
	text-align: center;
	padding: 1rem 1.5rem;
}
footer a {
	color: var(--footer-link-color);
}
footer a:hover {
	color: var(--footer-link-color-hover);
}

/* General Backgrounds */
.gradient-bg {
	background: linear-gradient(
		-45deg,
		var(--primary-color),
		var(--primary-hover-color),
		var(--secondary-color),
		var(--secondary-hover-color),
		var(--info-color),
		var(--info-hover-color)
	);
	background-size: 4000% 4000%;
	animation: gradient 60s linear infinite;
	-webkit-animation: gradient 60s linear infinite;
}
@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}
.bg-trans {
	background-color: transparent;
}
.bg-primary {
	background-color: var(--primary-color) !important;
}
.bg-secondary {
	background-color: var(--secondary-color) !important;
}
.bg-info {
	background-color: var(--info-color) !important;
}
.bg-grey {
	background-color: #f3f3f3;
}

/* General Text Formatting */
.text-trans {
	color: #ffffffaf;
}
.hero-title {
	font-size: 5rem;
	color: white;
	padding: 4rem 5vw 2rem 5vw;
}
.text-primary {
	color: var(--primary-color) !important;
}
.text-secondary {
	color: var(--secondary-color) !important;
}
.text-info {
	color: var(--info-color) !important;
}
.fw-100 {
	font-weight: 100 !important;
}
.fw-200 {
	font-weight: 200 !important;
}
.fw-300 {
	font-weight: 300 !important;
}
.fw-400 {
	font-weight: 400 !important;
}
.fw-500 {
	font-weight: 500 !important;
}
.fw-600 {
	font-weight: 600 !important;
}
.fw-700 {
	font-weight: 700 !important;
}
.fw-800 {
	font-weight: 800 !important;
}
.fw-900 {
	font-weight: 900 !important;
}
.fs-xs {
	font-size: 0.8rem;
}
.fs-sm {
	font-size: 0.9rem;
}

/* 404 Page */
.title-404 {
	font-size: calc(1.2rem + 3vw);
}
.links-404 {
	list-style: none;
	font-size: calc(1.2rem + 0.5vw);
	font-weight: 800;
	padding: 0;
}
.links-404 li {
	margin: 0 1.5rem 0 0;
}
.links-404 a {
	color: white;
}
.links-404 a:hover {
	color: #ffffffb2;
}

/* Gallery */
.galpreview {
	overflow: hidden;
	height: 10rem;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

/* Contact Page */
.contact-form .form-control {
	border: 0 !important;
	outline: 0 !important;
	box-shadow: none !important;
	padding: 0;
}
.contact-form h6 {
	user-select: none;
}
.contact-form {
	margin: 0.5rem;
	border: 1px solid rgba(var(--page-text-color-rgb), 0.2);
	background-color:  rgba(var(--page-text-color-rgb), 0.2);
	border-radius: var(--br-def);
	padding: var(--br-def);
	-webkit-border-radius: var(--br-def);
	-moz-border-radius: var(--br-def);
	-ms-border-radius: var(--br-def);
	-o-border-radius: var(--br-def);
	box-shadow: 0px 0px 30px 0px #00000075;
	text-align: center !important;
	backdrop-filter: blur(30px);
	-webkit-backdrop-filter: blur(30px);
}
.contact-form .form-control {
	color: var(--secondary-color);
	border: 1px solid rgba(var(--page-text-color-rgb), 0.3) !important;
	background-color:  rgba(var(--page-text-color-rgb), 0.2);
	padding:  calc(var(--br-def) / 2);
	border-radius:  calc(var(--br-def) / 2);
	-webkit-border-radius:  calc(var(--br-def) / 2);
	-moz-border-radius:  calc(var(--br-def) / 2);
	-ms-border-radius:  calc(var(--br-def) / 2);
	-o-border-radius:  calc(var(--br-def) / 2);
	transition: var(--transition-def);
	-webkit-transition: var(--transition-def);
	-moz-transition: var(--transition-def);
	-ms-transition: var(--transition-def);
	-o-transition: var(--transition-def);
	box-shadow: 0px 0px 30px 0px #00000075;
	text-align: center;
}
.contact-form .form-control:focus {
	border: 1px solid rgba(var(--page-text-color-rgb), 0.5) !important;
	background-color:  rgba(var(--page-text-color-rgb), 0.4);
}
.contact-form .form-control::placeholder {
	color: rgba(var(--page-text-color-rgb), 0.4);
	opacity: 1;
}
.captcha-border {
	width: 295px;
	height: 70px;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	border-radius: var(--br-def);
	-webkit-border-radius: var(--br-def);
	-moz-border-radius: var(--br-def);
	-ms-border-radius: var(--br-def);
	-o-border-radius: var(--br-def);
}
.form-control:focus ~ .contact-form {
	outline-color: var(--secondary-color);
}
.contact-content {
	width: 100%;
	max-width: 40rem;
	margin: 5rem auto;
}
.captcha-container {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: var(--br-def);
}
.send-btn-container {
	width: 100%;
	padding: 0.25rem;
	text-align: center;
}
.send-btn {
	border-radius: var(--br-def);
	-webkit-border-radius: var(--br-def);
	-moz-border-radius: var(--br-def);
	-ms-border-radius: var(--br-def);
	-o-border-radius: var(--br-def);
	padding: 0.5rem 1rem;
	border: 0;
	background-color: var(--page-text-color);
	color: rgba(var(--page-bg-color-rgb), 1);
	font-weight: 600;
}
.business-card {
	text-align: start;
	max-width: 40rem;
	margin: 0.5rem;
	margin-bottom: 4rem;
	background-color: rgba(var(--page-text-color-rgb), 0.2);
	border: 1px solid rgba(var(--page-text-color-rgb), 0.2);
	padding: 1rem;
	display: flex;
	flex-wrap: wrap;
	border-radius: var(--br-def);
	-webkit-border-radius: var(--br-def);
	-moz-border-radius: var(--br-def);
	-ms-border-radius: var(--br-def);
	-o-border-radius: var(--br-def);
	box-shadow: 0px 0px 30px 0px #00000036;
	backdrop-filter: blur(30px);
	-webkit-backdrop-filter: blur(30px);
}
.business-image {
	width: auto;
	max-width: 20rem;
}
.business-image img {
	border-radius: calc(var(--br-def) / 2);
	-webkit-border-radius: calc(var(--br-def) / 2);
	-moz-border-radius: calc(var(--br-def) / 2);
	-ms-border-radius: calc(var(--br-def) / 2);
	-o-border-radius: calc(var(--br-def) / 2);
	
	border: 1px solid rgba(var(--page-text-color-rgb), 0.2);
}
.business-text {
	padding: 1rem;
	/* color: var(--page-text-color); */
	margin: auto 0;
	flex-grow: 1;
}
.business-text a {
	color: var(--primary-color);
}
.business-text a:hover {
	color: var(--primary-hover-color);
}
.business-text .name {
	font-size: 1.5rem;
	font-weight: 500;
	margin-bottom: 0;
	color: rgba(var(--page-text-color-rgb), 1);
	line-height: 1.2rem;
}
.business-text .role {
	font-size: 1.25rem;
	font-weight: 700;
	margin-bottom: 1rem;
	color: rgba(var(--page-text-color-rgb), 0.7);
}
.business-text .phone {
	font-size: 1.1rem;
	font-weight: 400;
	margin-bottom: 0;
}
.business-text .email {
	font-size: 1.1rem;
	font-weight: 400;
	margin-bottom: 0;
}

/* Marquee */
.marquee {
	--gap: 2rem;
	position: relative;
	display: flex;
	overflow: hidden;
	user-select: none;
	padding: 1rem 0;
  }
.hero-marquee {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 200;
}
  .marquee li {
	width: calc(5rem + 4vw);
	height: calc(5rem + 4vw);
	margin: 0 1rem;
	max-width: 100%;
	min-width: auto;
	padding: 1.5rem;
	border: 1px solid rgba(var(--page-text-color-rgb), 0.2);
	background-color: rgba(var(--page-text-color-rgb), 0.3);
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 100%;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	-ms-border-radius: 100%;
	-o-border-radius: 100%;
	overflow: hidden;
	box-shadow: 0px 0px 40px 0px #00000041;
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
}
  .marquee li img {
	width: 100%;
  }
  .marquee__content {
	flex-shrink: 0;
	display: flex;
	justify-content: space-around;
	align-items: center;
	width: auto;
	height: 100%;
	list-style: none;
	text-align: center;
	margin: 0;
	padding: 0;
	min-width: 100%;
  }
  @keyframes scroll {
	from {
	  transform: translateX(0);
	}
	to {
	  transform: translateX(-100%);
	}
  }
  @media (prefers-reduced-motion: reduce) {
	.marquee__content {
	  animation-play-state: paused !important;
	}
  }
  .marquee__content {
	animation: scroll 50s linear infinite;
  }
  /* Reverse animation */
  .marquee__reverse .marquee__content {
	animation-direction: reverse;
  }
  .marquee__fit-content {
	max-width: fit-content;
  }
  .marquee__pos-absolute .marquee__content:last-child {
	position: absolute;
	top: 0;
	left: 0;
  }
  .marquee__pos-absolute .marquee__content:last-child {
	animation-name: scroll-abs;
  }
  @keyframes scroll-abs {
	from {
	  transform: translateX(100%);
	}
	to {
	  transform: translateX(0);
	}
  }

/* General Page Formatting */
.page-hero {
	background-color: var(--primary-color);
	background-position: center;
	background-size: cover;
}
.hero-content {
	width: 100%;
	padding: 0 1rem;
}
.info-block {
	background-color: #ececec;
	border-radius: var(--br-def);
	-webkit-border-radius: var(--br-def);
	-moz-border-radius: var(--br-def);
	-ms-border-radius: var(--br-def);
	-o-border-radius: var(--br-def);
	padding: 1rem 1.5rem;
	margin: 0.5rem 0;
}
.info-block p:last-child {
	margin: 0;
}

.hero-block {
	position: relative;
	min-height: 100vh;
}
.hero-block::before {
	content: "";
	position: absolute;
	z-index: 150;
	top: 0;
	bottom: -2px;
	left: 0;
	right: 0;
	background: linear-gradient(0deg, var(--page-bg-color) 2%, rgba(var(--page-bg-color-rgb), 0) 100%);
}
.hero-block::after {
	content: "";
	position: absolute;
	z-index: 125;
	background-size: cover;
	background-position: center;
	top: 0;
	bottom: 2%;
	left: 0;
	right: 0;
}
.hero-block.home::after {
	background-image: url(/images/city-scape.jpg);
}
.hero-block.about::after {
	background-image: url(/images/plaza.jpg);
}
.hero-block.services::after {
	background-image: url(/images/window.jpg);
}
.hero-block.clients::after {
	background-image: url(/images/people.jpg);
}
.hero-block.contact::after {
	background-image: url(/images/typing.jpg);
}
.hero-content {
	position: relative;
	padding: calc(8rem + 4vw) 1.5rem;
	z-index: 200;
	min-height: 100vh;
	width: auto;
	max-width: var(--content-width);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin: auto;
	text-align: center;
	color: var(--page-text-color);
	text-shadow: 0px 0px 20px #000000;
	opacity: 0%;
	transform: translateY(0.2rem);
	transition: calc(var(--long-transition-def) / 1.5);
	-webkit-transition: calc(var(--long-transition-def) / 1.5);
	-moz-transition: calc(var(--long-transition-def) / 1.5);
	-ms-transition: calc(var(--long-transition-def) / 1.5);
	-o-transition: calc(var(--long-transition-def) / 1.5);
	-webkit-transform: translateY(0.2rem);
	-moz-transform: translateY(0.2rem);
	-ms-transform: translateY(0.2rem);
	-o-transform: translateY(0.2rem);
}
body.loaded .hero-content, body.loaded .contact-3 #c3Text {
	transition-delay: calc(var(--long-transition-def) / 5);
	opacity: 100%;
	transform: translateY(0rem);
	-webkit-transform: translateY(0rem);
	-moz-transform: translateY(0rem);
	-ms-transform: translateY(0rem);
	-o-transform: translateY(0rem);
}
.hero-content h1 {
	font-size: 4rem;
	margin: 0;
}
.hero-content h3 {
	font-size: 4rem;
	margin: 0;
}
.hero-content p {
	font-size: 1.3rem;
	margin: 0;
	opacity: 95%;
}
.h-unset {
	height: unset;
}
.whole-page {
	padding-top: 10rem;
	padding-bottom: 10rem;
	min-height: 100vh;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}
.half-page {
	padding-top: 7rem;
	padding-bottom: 7rem;
	min-height: 50vh;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}
.quarter-page {
	padding-top: 2rem;
	padding-bottom: 2rem;
	min-height: 15vh;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}
.contact-grid {
	display: grid;
	grid-template-columns: auto min-content;
	grid-template-rows: auto min-content;
	grid-template-areas: 
        "contactContent contactDetails" 
        "contactFooter contactDetails";
	height: 100vh;
    width: 100vw;
    overflow: hidden;

    background-color: var(--page-bg-color);
	background-position: center;
	background-size: cover;
	overflow: hidden;
}
.contact-grid::before {
	content: "";
	position: absolute;
	z-index: 150;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: linear-gradient(0deg, var(--page-bg-color) 2%, rgba(var(--page-bg-color-rgb), 0) 100%);
}
.contact-grid::after {
	content: "";
	position: absolute;
	z-index: 125;
	background-image: url(/images/typing.jpg);
	background-size: cover;
	background-position: center;
	top: 0;
	bottom: 2%;
	left: 0;
	right: 0;
}
#contactContent {
	position: relative;
	z-index: 175;
	grid-area: contactContent;
	padding: 2rem 4rem;
	padding-top: 15rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
}
#contactContent .details-container {
	width: 900px;
}
#contactContent h1 {
	font-size: 4rem;
	margin: 0;
}
#contactContent h3 {
	font-size: 4rem;
	margin: 0;
}
#contactContent p {
	font-size: 1.3rem;
	margin: 0;
	opacity: 80%;
}
#contactContent::before {
	content: "";
	position: absolute;
	z-index: 150;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: linear-gradient(90deg, var(--page-bg-color) 2%, rgba(var(--page-bg-color-rgb), 0) 100%);
}
#contactDetails {
	padding: 2rem 5rem;
	padding-top: 8rem;
	position: relative;
	z-index: 175;
	grid-area: contactDetails;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}
#contactFooter {
	padding: 1rem 4rem;
	position: relative;
	z-index: 175;
	grid-area: contactFooter;
	display: flex;
	align-items: center;
	justify-content: end;
	flex-direction: column;
}
#contactFooter::before {
	content: "";
	position: absolute;
	z-index: 150;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: linear-gradient(90deg, var(--page-bg-color) 2%, rgba(var(--page-bg-color-rgb), 0) 100%);
}
#contactFooter::after {
	pointer-events: none;
	content: "";
	position: absolute;
	z-index: 150;
	top: 0;
	bottom: -100%;
	left: -100%;
	right: 0;
	background: radial-gradient(var(--footer-bg) 0%, #ffffff00 60%);
	transform: scale(200%);
	-webkit-transform: scale(200%);
	-moz-transform: scale(200%);
	-ms-transform: scale(200%);
	-o-transform: scale(200%);
}
.contact-grid .content-holder {
	position: relative;
	z-index: 185;
}
.details-container {
	width: 30rem;
}
.details-card {
	width: 100%;
	background-color: rgba(var(--page-text-color-rgb), 0.2);
	border: 1px solid rgba(var(--page-text-color-rgb), 0.2);
	border-radius: var(--br-def);
	-webkit-border-radius: var(--br-def);
	-moz-border-radius: var(--br-def);
	-ms-border-radius: var(--br-def);
	-o-border-radius: var(--br-def);
	backdrop-filter: blur(30px);
	-webkit-backdrop-filter: blur(30px);
	padding: var(--br-def);
	box-shadow: 0px 0px 30px 0px #00000031;
}
.details-card .image {
	max-width: 100%;
	border-radius: calc(var(--br-def) / 2);
	-webkit-border-radius: calc(var(--br-def) / 2);
	-moz-border-radius: calc(var(--br-def) / 2);
	-ms-border-radius: calc(var(--br-def) / 2);
	-o-border-radius: calc(var(--br-def) / 2);
}
.details-card .name {
	font-size: 1.5rem;
	font-weight: 500;
	margin-bottom: 0;
	color: rgba(var(--page-text-color-rgb), 1);
	line-height: 1.2rem;
}
.details-card .role {
	font-size: 1.25rem;
	font-weight: 600;
	margin-bottom: 0.5rem;
	color: rgba(var(--page-text-color-rgb), 0.85);
}
.details-card .phone {
	font-size: 1.1rem;
	font-weight: 400;
	margin-bottom: 0;
}
.details-card .email {
	font-size: 1.1rem;
	font-weight: 400;
	margin-bottom: 0;
}


.contact-3 {
	--side-size: 7vw;

	display: grid;
	grid-template-columns: var(--side-size) auto var(--side-size);
	grid-template-rows: auto auto auto auto;
	grid-template-areas: 
        "Left Text Right" 
        "Left Form Right"
		"Left Form Right"
		"Left Form Right";
    width: 100vw;
    overflow: hidden;
	padding-top: 8rem;
	position: relative;

	background-position: center;
	background-size: cover;
	text-align: center;
}
.contact-3 .hero-content {
	min-height: unset;
}

.contact-3::before {
	content: "";
	position: absolute;
	z-index: 150;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: linear-gradient(0deg, var(--page-bg-color) 2%, rgba(var(--page-bg-color-rgb), 0) 100%);
}
.contact-3::after {
	content: "";
	position: absolute;
	z-index: 125;
	background-image: url(/images/typing.jpg);
	background-size: cover;
	background-position: center;
	top: 0;
	bottom: 2%;
	left: 0;
	right: 0;
}
.contact-form-grid {
	grid-area: Form;
	--side-size: 7vw;

	display: grid;
	grid-auto-flow: column;
	grid-template-columns: 35% 15% 15% 35%;
	grid-template-areas: 
        "Card Name Name Message"
		"Card Email Email Message"
		"Send Send Send Send"
		"Thanks Thanks Thanks Thanks";
}
@media (max-width: 1250px) {
	.contact-form-grid {
		grid-template-areas: 
			"Card Card Name Name"
			"Card Card Email Email"
			"Message Message Message Message"
			"Send Send Send Send"
			"Thanks Thanks Thanks Thanks";
	}
}
@media (max-width: 1000px) {
	.contact-form-grid {
		grid-template-areas: 
			"Card Card Card Card"
			"Name Name Name Name"
			"Message Message Message Message"
			"Send Send Send Send"
			"Thanks Thanks Thanks Thanks";
	}
}
@media (max-width: 700px) {
	.contact-form-grid {
		grid-template-areas: 
			"Card Card Card Card"
			"Name Name Name Name"
			"Phone Phone Phone Phone"
			"Email Email Email Email"
			"Message Message Message Message"
			"Send Send Send Send"
			"Thanks Thanks Thanks Thanks";
	}
}

.contact-3 #c3Left {
	position: relative;
	z-index: 180;
	grid-area: Left;
}
.contact-3 #c3Right {
	position: relative;
	z-index: 180;
	grid-area: Right;
}
.contact-3 #c3Text {
	position: relative;
	z-index: 180;
	grid-area: Text;
	padding: 5rem 2rem 2rem 2rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	
	text-shadow: 0px 0px 30px #000000;
	opacity: 0%;
	transform: translateY(0.2rem);
	transition: calc(var(--long-transition-def) / 1.5);
	-webkit-transition: calc(var(--long-transition-def) / 1.5);
	-moz-transition: calc(var(--long-transition-def) / 1.5);
	-ms-transition: calc(var(--long-transition-def) / 1.5);
	-o-transition: calc(var(--long-transition-def) / 1.5);
	-webkit-transform: translateY(0.2rem);
	-moz-transform: translateY(0.2rem);
	-ms-transform: translateY(0.2rem);
	-o-transform: translateY(0.2rem);
}
.contact-3 #c3Text h1 {
	position: relative;
	z-index: 180;
	font-size: 4rem;
	margin: 0;
}
.contact-3 #c3Text p {
	position: relative;
	z-index: 180;
	font-size: 1.3rem;
	margin: 0;
	opacity: 80%;
}
.contact-3 #c3Card {
	position: relative;
	z-index: 180;
	grid-area: Card;
	padding: 0.25rem;
}
.contact-3 #c3Name {
	position: relative;
	z-index: 180;
	grid-area: Name;
	padding: 0.25rem;
}
.contact-3 #c3Phone {
	position: relative;
	z-index: 180;
	grid-area: Phone;
	padding: 0.25rem;
}
.contact-3 #c3Email {
	position: relative;
	z-index: 180;
	grid-area: Email;
	padding: 0.25rem;
}
.contact-3 #c3Message {
	position: relative;
	z-index: 180;
	grid-area: Message;
	padding: 0.25rem;
}
.contact-3 #c3Send {
	position: relative;
	z-index: 180;
	grid-area: Send;
	padding: 0.25rem;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.glass-container {
	background-color: rgba(var(--page-text-color-rgb), 0.2);
	border: 1px solid rgba(var(--page-text-color-rgb), 0.2);
	padding: var(--br-def);
	border-radius: var(--br-def);
	-webkit-border-radius: var(--br-def);
	-moz-border-radius: var(--br-def);
	-ms-border-radius: var(--br-def);
	-o-border-radius: var(--br-def);
	height: 100%;
	width: 100%;
	display: flex;
	flex-direction: column;
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	overflow: hidden;
}
.glass-container .input-style {
	color: rgba(var(--page-text-color-rgb), 1);
	background-color: rgba(var(--page-text-color-rgb), 0.2);
	border: 1px solid rgba(var(--page-text-color-rgb), 0.2);
	text-align: center;
	flex-grow: 1;
	padding: calc(var(--br-def) / 2);
	border-radius: calc(var(--br-def) / 2);
	-webkit-border-radius: calc(var(--br-def) / 2);
	-moz-border-radius: calc(var(--br-def) / 2);
	-ms-border-radius: calc(var(--br-def) / 2);
	-o-border-radius: calc(var(--br-def) / 2);
	outline: 0;
	transition: var(--transition-def);
	-webkit-transition: var(--transition-def);
	-moz-transition: var(--transition-def);
	-ms-transition: var(--transition-def);
	-o-transition: var(--transition-def);
}
.glass-container .input-style:focus {
	background-color: rgba(var(--page-text-color-rgb), 0.5);
	border: 1px solid rgba(var(--page-text-color-rgb), 0.2);
}
.glass-container .input-style::placeholder {
	color: rgba(var(--page-text-color-rgb), 0.4);
	opacity: 1;
}
.glass-header {
	font-size: 1.1rem;
	font-weight: 500;
	color: rgba(var(--page-text-color-rgb), 0.9);
	margin-bottom: 0.3rem;
}
.c-name {
	font-size: 1.5rem;
	font-weight: 600;
	color: rgba(var(--page-text-color-rgb), 0.9);
	margin-bottom: 0.1rem;
}
.c-role {
	font-size: 1.2rem;
	font-weight: 500;
	color: rgba(var(--page-text-color-rgb), 0.7);
	margin-bottom: 0;
}
.c-site {
	font-size: 1.2rem;
	font-weight: 400;
	color: rgba(var(--page-text-color-rgb), 0.7);
	margin-bottom: 0.7rem;
}
.c-phone {
	font-size: 1rem;
	font-weight: 300;
	margin-bottom: 0.1rem;
}
.c-email {
	font-size: 0.95rem;
	font-weight: 300;
	margin-bottom: 0;
}
.contact-thanks {
	grid-area: Thanks;
	height: var(--contact-height);
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	flex-direction: column;
	color: rgba(var(--page-text-color-rgb), 1);
	background-color: rgba(var(--page-text-color-rgb), 0.2);
	border: 1px solid rgba(var(--page-text-color-rgb), 0.2);
	border-radius: var(--br-def);
	-webkit-border-radius: var(--br-def);
	-moz-border-radius: var(--br-def);
	-ms-border-radius: var(--br-def);
	-o-border-radius: var(--br-def);
	z-index: 180;
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
}
.glass-container img {
	border: 1px solid rgba(var(--page-text-color-rgb), 0.2);
	border-radius: calc(var(--br-def) / 2);
	-webkit-border-radius: calc(var(--br-def) / 2);
	-moz-border-radius: calc(var(--br-def) / 2);
	-ms-border-radius: calc(var(--br-def) / 2);
	-o-border-radius: calc(var(--br-def) / 2);
}
.rectangle-image-block {
	width: 100%;
	height: 20rem;
	margin-bottom: 0.5rem;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	border-radius: var(--br-def);
	-webkit-border-radius: var(--br-def);
	-moz-border-radius: var(--br-def);
	-ms-border-radius: var(--br-def);
	-o-border-radius: var(--br-def);
}
.rectangle-image-block.placeholder-img {
	background-image: url(/images/placeholder.jpg);
}

.block-content {
	position: relative;
	z-index: 200;
	padding-top: 5rem;
	padding-bottom: 5rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	overflow-x: hidden;
}
.block-title {
	font-size: 2rem;
	font-weight: 600;
	color: rgba(var(--page-text-color-rgb), 0.8);
	text-shadow: 0px 0px 30px #0000009c;
	margin-bottom: 0.2rem;
}
.block-text {
	font-size: 1.2rem;
	text-shadow: 0px 0px 20px #00000063;
}
.block-button {
	background-color: transparent;
	border: 2px solid var(--page-text-color);
	color: var(--page-text-color);
	padding: 0.5rem 1.2rem;
	border-radius: 100rem;
	-webkit-border-radius: 100rem;
	-moz-border-radius: 100rem;
	-ms-border-radius: 100rem;
	-o-border-radius: 100rem;
	font-weight: 500;
	transition: var(--transition-def) !important;
	-webkit-transition: var(--transition-def) !important;
	-moz-transition: var(--transition-def) !important;
	-ms-transition: var(--transition-def) !important;
	-o-transition: var(--transition-def) !important;
}
.block-button:hover {
	background-color: var(--page-text-color);
	color: var(--page-bg-color);
}
.block-secondary-image-page {
	position: relative;
}
.block-secondary-image-page::before {
	content: "";
	position: absolute;
	z-index: 150;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: linear-gradient(180deg, var(--secondary-color) 2%, rgba(var(--secondary-color-rgb), 0.5) 50%, var(--page-bg-color) 98%);
}
.block-secondary-image-page::after {
	content: "";
	position: absolute;
	z-index: 125;
	background-image: url(/images/laptop.jpg);
	background-size: cover;
	background-position: center;
	top: 2%;
	bottom: 2%;
	left: 0;
	right: 0;
}

.block-secondary-image-info::before {
	content: "";
	position: absolute;
	z-index: 150;
	top: 0;
	bottom: -2px;
	left: 0;
	right: 0;
	background: linear-gradient(180deg, var(--secondary-color) 2%, rgba(var(--secondary-color-rgb), 0.5) 50%, var(--info-color) 98%);
}
.block-secondary-image-info::after {
	content: "";
	position: absolute;
	z-index: 125;
	background-image: url(/images/abstract.jpg);
	background-size: cover;
	background-position: center;
	top: 2%;
	bottom: 2%;
	left: 0;
	right: 0;
}

.block-info {
	position: relative;
}
.block-info::before {
	content: "";
	position: absolute;
	z-index: 150;
	top: 0;
	bottom: -2px;
	left: 0;
	right: 0;
	background: linear-gradient(180deg, #ffffff00 2%, rgba(var(--info-color-rgb), 1) 90%);
}

.block-info-secondary {
	position: relative;
}
.block-info-secondary::before {
	content: "";
	position: absolute;
	z-index: 150;
	top: 0;
	bottom: -2px;
	left: 0;
	right: 0;
	background: linear-gradient(0deg,  rgba(var(--secondary-color-rgb), 1) 5%, rgba(var(--info-color-rgb), 1) 96%);
}

.block-info-page {
	position: relative;
}
.block-info-page::before {
	content: "";
	position: absolute;
	z-index: 150;
	top: 0;
	bottom: -2px;
	left: 0;
	right: 0;
	background: linear-gradient(180deg,  rgba(var(--info-color-rgb), 1) 5%, rgba(var(--page-bg-color-rgb), 1) 96%);
}

.block-page-secondary {
	position: relative;
}
.block-page-secondary::before {
	content: "";
	position: absolute;
	z-index: 150;
	top: 0;
	bottom: -2px;
	left: 0;
	right: 0;
	background: linear-gradient(0deg,  rgba(var(--secondary-color-rgb), 1) 5%, rgba(var(--page-bg-color-rgb), 1) 96%);
}

.block-secondary-info {
	position: relative;
}
.block-secondary-info::before {
	content: "";
	position: absolute;
	z-index: 150;
	top: 0;
	bottom: -2px;
	left: 0;
	right: 0;
	background: linear-gradient(180deg,  rgba(var(--secondary-color-rgb), 1) 5%, rgba(var(--info-color-rgb), 1) 96%);
}

.block-info-page {
	position: relative;
}
.block-info-page::before {
	content: "";
	position: absolute;
	z-index: 150;
	top: 0;
	bottom: -2px;
	left: 0;
	right: 0;
	background: linear-gradient(180deg,  rgba(var(--info-color-rgb), 1) 5%, rgba(var(--page-bg-color-rgb), 1) 96%);
}

.block-info-image-page::before {
	content: "";
	position: absolute;
	z-index: 150;
	top: 0;
	bottom: -2px;
	left: 0;
	right: 0;
	background: linear-gradient(180deg, var(--info-color) 2%, rgba(var(--page-bg-color-rgb), 0.6) 50%, var(--page-bg-color) 98%);
}
.block-info-image-page::after {
	content: "";
	position: absolute;
	z-index: 125;
	background-image: url(/images/abstract-2.jpg);
	background-size: cover;
	background-position: center;
	top: 2%;
	bottom: 2%;
	left: 0;
	right: 0;
}

.block-page-image-page::before {
	content: "";
	position: absolute;
	z-index: 150;
	top: 0;
	bottom: -2px;
	left: 0;
	right: 0;
	background: linear-gradient(180deg, var(--page-bg-color) 2%, rgba(var(--page-bg-color-rgb), 0.6) 50%, var(--page-bg-color) 98%);
}
.block-page-image-page::after {
	content: "";
	position: absolute;
	z-index: 125;
	background-image: url(/images/abstract-3.jpg);
	background-size: cover;
	background-position: center;
	top: 2%;
	bottom: 2%;
	left: 0;
	right: 0;
}

@media (max-width: 1000px) {
	#navTop ul {
		opacity: 0%;
		pointer-events: none;
		backdrop-filter: blur(20px);
		-webkit-backdrop-filter: blur(20px);
		border-radius: 0;
		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		-ms-border-radius: 0;
		-o-border-radius: 0;
		box-shadow: 0;
		padding: 1rem 2rem;
		background-color: rgba(var(--nav-bg-color-rgb), 0.1);
		border: 0;
		list-style: none;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		position: fixed;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		transition: var(--transition-def);
		-webkit-transition: var(--transition-def);
		-moz-transition: var(--transition-def);
		-ms-transition: var(--transition-def);
		-o-transition: var(--transition-def);
	}
	#navTop ul.active {
		opacity: 100%;
		pointer-events: all;
	}
	#navTop li {
		padding: 0.05rem 1rem;
		margin: 0.2rem 0;
		float: unset;
	}
	#navTop li a {
		font-size: 1.6rem;
		font-weight: 600;
	}
	#navTop li a:hover {
		font-size: 1.6rem;
		font-weight: 600;
	}
	#navTop button#expandNav {
		display: unset;
	}
	.hero-content h3 {
		font-size: 2.5rem !important;
	}
	.hero-content p {
		font-size: 1.15rem !important;
	}
	.block-title {
		font-size: 1.5rem !important;
	}
	.block-text {
		font-size: 1rem !important;
	}
	.block-button {
		padding: 0.25rem 1rem;
	}
	.whole-page {
		padding-top: 5rem;
		padding-bottom: 5rem;
		min-height: 50vh;
	}
}
@media (max-width: 500px) {
	#navTop {
		top: 1rem;
		left: 1rem;
		right: 1rem;
	}
	.nav-icon {
		max-width: 100%;
	}
	.nav-slogan {
		display: none;
	}
	.nav-icon {
		display: none;
	}
	.nav-icon-mob {
		display: unset;
	}
	#navTop li {
		margin: 0.1rem 0;
	}
	#navTop li a {
		font-size: 1.3rem;
	}
	#navTop li a:hover {
		font-size: 1.3rem;
	}
	.hero-content h3 {
		font-size: 1.8rem !important;
	}
	.hero-content p {
		font-size: 1.1rem !important;
	}
	#topBtn {
		display: none;
	}
	.block-title {
		font-size: 1.25rem !important;
	}
	.footer-fill {
		padding: 0;
	}
	.footer-links {
		padding: 2rem 0;
	}
	#c3Left, #c3Right {
		display: none;
	}
}