@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');

root { --bs-font-sans-serif: 'Lato', sans-serif; }

body,p
{
	font-size: 18px;
	font-weight: 400;
	font-family: "Lato", sans-serif;
	line-height: 2.2rem;
}

#site_content { min-height: 60vh; }
h1,.h1,h2,.h2,h3,.h3,h4,.h4,h5,.h5,h6,.h6 { font-family: 'Lato', sans-serif; }
h1,.h1,h2,.h2,.font-weight-bold { }
.text-green { color: #002b2f !important; }
.bg-green { background: #1E4951 !important; }
.bg-dark-green { background: #193F46 !important; }
.bg-tan { background: #F7ECE2; }

.logo,.invert-logo
{
	filter: brightness(0) invert(1);
	height: auto;
}

.header-title
{
	z-index: 999;
	margin: 0 auto;
	width: 100%;
	bottom: 20% !important;
 	font-weight: 700;
	position: absolute;
	color: #d4a161;
	text-align: center;
}

.tan-card
{
	background: #F7ECE2;
	color: #002b2f;
	border: 0px;
	border-radius: 1rem;
}

.tan-card h4
font-size:30px;
color: #002b2f;
}
.tan-card p
{
	font-size: 17px;
	color: #002b2f;
}

.tan-card:hover { background: #1E4951 !important; }
.tan-card:hover h4,.tan-card:hover p { color: #fff; }
.tan-card:hover .bi { display: inline-block !important; }

.pills-nav
{
	background: #23565F;
	border-radius: 3.5rem;
}

.pills-nav .nav-link
{
	color: #fff;
	font-size: 16px;
	text-transform: uppercase;
	border-radius: 3.5rem;
	padding: .7rem;
}
.pills-nav .nav-link:hover
{
	background: #193F46;
	color: #D9A779;
}
.pills-nav .nav-link.active
{
	background: #193F46;
	color: #D9A779;
}

.navbar-nav .nav-link { font-family: 'Lato', sans-serif; }

.navbar-custom
{
	background: transparent;
	position: fixed;
	width: 100%;
	top: 0;
	z-index: 1000;
	transition: background-color 0.3s;
}

.navbar-custom.scrolled
{
	background-color: #fff;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.navbar-custom.scrolled .nav-link { color: #1E4951; }
.navbar-custom.scrolled	.logo { filter: none; }

.navbar-custom .nav-link
{
	color: #fff;
	text-transform: uppercase;
	font-weight: 500;
	letter-spacing: 0.2em;
	font-size: 15px;
}

.navbar-custom .nav-link.active,
    .navbar-custom .nav-link:hover { color: #bc8549; }

/* Mega Menu */
.dropdown-menu.megamenu
{
	width: 100%;
	border: none;
	top: 100%;
	left: 0;
	right: 0;
	background: white;
	padding: 3rem 1rem;
	border-top-left-radius: 0px;
	border-top-right-radius: 0px;
}

.megamenu-content
{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	text-align: center;
}

.megamenu-item
{
	flex: 1 1 30%;
	max-width: 30%;
	padding: 1rem;
}

.megamenu-item img
{
	height: 50px;
	margin-bottom: 1rem;
}

.megamenu-item h6
{
	text-transform: uppercase;
	font-weight: bold;
	margin-bottom: 0.5rem;
}

.megamenu-item p
{
	font-size: 0.875rem;
	color: #444;
}

.hero h1
{
	font-size: 4rem;
	max-width: 700px;
	font-weight: bold;
}

.highlight,.text-gold { color: #d4a161 !important; }

.slant-tan-card
{
	background-color: #F7ECE2 !important;
	border: none;
}
.form-control-tan{
	background-color:#F7ECE2 !important;
	

}
.form-floating > label {
color: #7D8688;
left:10px
}
.btn-default{
background: #AD7644;
border-color: #AD7644;
color:#fff;
border-radius:0px;
font-weight:400;
letter-spacing:0.2rem;
}
.gray-flip{
filter:grayscale(1);
}
.gray-flip:hover{
filter:grayscale(0);
}
@media (max-width: 991px)
{
	.dropdown-menu.megamenu { padding: 1rem; }
	
	.megamenu-content
	{
		flex-direction: column;
		text-align: left;
	}
	
	.megamenu-item { max-width: 100%; }
}

.nav-spacer { height: 80px; }
section { }

.hero
{
	background-size: cover;
	height: 100vh;
	color: white;
	display: flex;
	align-items: center;
}

@media (min-width:1000px)
{
	.header-title
{
	z-index: 999;
	margin: 0 auto;
	width: 100%;
	bottom: 20% !important;
	font-size: 73px;
	font-weight: 700;
	position: absolute;
	color: #d4a161;
	text-align: center;
}
	.home-offset-left
	{
		margin-left: -15%;
		max-width: 120%;
	}
	
	.hero h1, .hero p
	{
		position: relative;
		left: 10%;
	}
	
	.slant-card
	{
		background: url('../images/slant.png');
		background-size: contain;
		background-position: center right;
		background-repeat: no-repeat;
		background-color: #fff;
	}
	
	.slant-tan-card
	{
		background: url('../images/reverse-tan-slant.png');
		background-size: contain;
		background-position: center left;
		background-repeat: no-repeat;
	}
	
	.pp-01
	{
		margin-top: -10rem;
		z-index: 10;
	}
	.mw-120{
		max-width:120%;
	}
	.ps-lg-10{
		padding-left: 7.5rem !important;
	}
	.pe-lg-10{
		padding-right: 7.5rem !important;
	
	}
	.cares-img-3{
		right:15%;
	}
}
