/* For more straightforward sizing in CSS, we switch the global box-sizing value from content-box to border-box. This ensures padding does not affect the final computed width of an element, but it can cause problems with some third-party software like Google Maps and Google Custom Search Engine.
On the rare occasion you need to override it, use something like the following:

@font-face {
		font-family: 'FAMILY_NAME';
		font-style: NORMAL_OR_ITALIC;
		font-weight: NUMERIC_WEIGHT_VALUE;
		src: url(FONT_FILE_NAME.woff2) format('woff2');
}
.selector-for-some-widget {
		box-sizing: content-box;
}
*/
/* tooltips 
.custom-tooltip {
		--bs-tooltip-bg: var(--bd-violet-bg);
		--bs-tooltip-color: var(--bs-white);
}*/
body {
		background-color: #211010EE;
		color: #fff;
		font-family: Inter, Montserrat, Verdana, "sans-serif";
}
footer {
		font-size: 80%;
		padding: 2rem 1rem;
	}
button, .btn {
	text-transform: uppercase;
}
pre {
font-size: .8rem;
}
#maincontent {
	background-image: url("../grafix/bgs/grayish.jpg");
	background-position: center;
	background-repeat: repeat;
	color: #000;
		
}
#hbg-header {
min-height: 20vh;
}
#welcome {
		text-align: center;
		width: 100%;
	}
#featured	{
		background-image: url("../grafix/bgs/pinkish.jpg")!important;
	}
header {
		background-color: rgba(61, 20, 20, 0.606);
}
a {
	color: #000;
}
nav a {
		color: #EEEEEEEE !important;
}
.navbar-toggler {
		background-color: rgba(138, 46, 46, 1);
		color: #EEEEEEE;
}
ul.dropdown-menu {
		background-color: rgba(61, 20, 20, 0.8);
}
li ul.dropdown-menu .dropdown-item:hover {
		background-color: #000;
}
h1, h2, h3, h4, h5, h6 {
		letter-spacing: 2%;
		font-weight: 500;
		text-transform: capitalize;
		font-family: "Playfair Display", "Cormorant Garamond", Garamond, "serif";	
}

.fancy {
	font-family: "Lucida Calligraphy", fantasy;	
}
.offcanvas-title, .card-title {
		font-family: Inter, Montserrat, Verdana, "sans-serif";
}
a, .navlink, .navbar-nav {
			color: #222222!important;
	}
.offcanvas.utilities {
		height: 70vh;
		right: 5vw;
		top: 12vh
	}
.offcanvas.services {
		height: 70vh;
		right: 10vw;
		left: 10vw;
		top: 20vh;
		bottom: auto;
	}
.services.card	{
		background-image: url("../grafix/bgs/grayish.jpg")!important;
	}