:root {
    --bg-navbar: linear-gradient(to bottom, #eaf3f9, #f5f9fd, #d0d6e1);
	--border-navbar: #9b9b9b;
    --primary: #2e568f;
    --bg-primary-dk: #224361;
    --bg-primary: #335777;
    --bg-primary-lt: #366793;
    --border-primary: #2d3e4e;
	--glow-primary: rgb(0 75 151 / 50%);
    --info: #2d7db7;
    --bg-info: #2677ad;
    --border-info: #0863a3;
    --glow-info: rgba(43,131,191,.5);
    --intro-header-gradient: linear-gradient(to bottom, #acc5db, #dce8f5, #eef7fb, transparent);
}
body {
	background-color: #021C32;
	background-position: center top;
	background-size: cover;
}
@media (min-width: 768px) {
	body {
		background-image: url('/assets/images/bg-hapi2.svg');
        background-position: 75% 50%;
        background-attachment: fixed;
	}
    /* body::before {
        content: "";
        position: fixed;
        inset: 0;
        background: radial-gradient(circle at top left, rgba(255,255,255,0.2), transparent),
                    linear-gradient(to bottom right, rgba(0,0,0,0.05), transparent);
        z-index: -1;
        pointer-events: none;
    } */
    body::before {
        content: "";
        position: fixed;
        inset: 0;
        background: linear-gradient(to top left, rgba(125, 1, 1, 0.25), rgba(3, 123, 227, 0.25));
        z-index: -1;
        pointer-events: none;
    }
}
.navbar-light .navbar-nav .nav-link {
    color: rgb(0 40 75 / 65%);
}
.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
    color: rgb(0 40 75 / 80%);
}
.navbar-light .navbar-nav .active>.nav-link {
    color: rgb(0 40 75 / 95%);
}
#app_header {
	border-bottom: 2px solid #dee2e6!important;
}
#app_footer {
	display: block;
	position: relative;
	bottom: 0;
	z-index: 100;
	border-top: 2px solid #dee2e6!important;
}
#site_footer {
	background: rgb(243 249 255 / 80%);
    border-top: 1px solid #8da9c7;
}