/* Font ---------------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@600&display=swap');

/*Global------------------------------------------*/
body {
	background-color: #161616!important;
}

h1 {
	font-weight: bold;
}

* {
	color:white;
	font-family: 'Inter', sans-serif;
}

.card {
	background-color: black;
}

img.imgline {
	max-height: 50px;
	max-width: 20px;
	min-height: 5px;
	min-width: 5px;
}

/* Nav Bar*/
@media screen and (min-width:601px) {
	#soulace {
		display: inline;
		max-height: 60px;
	}

	hr {
	   border-top: 1px solid white;
	   width: 10vw;
	   margin-right: 10px;
	}
}

@media screen and (max-width: 600px) {
	#soulace {
		display: inline;
		max-height: 40px;
	}
   
}

.nav-item:hover .nav-link,
.nav-item:focus .nav-link {
	text-decoration: underline;
}

/* Banner Section------------------------------------ */

#banner {
	background-image:linear-gradient(180deg,#161616, transparent, #161616), url("/images/banners/home/banner.png");
	background-size: cover;
	height: 100vh;
	color: black;
}

@media screen and (min-width: 601px) {
	#bannertext h1 {
		font-weight: bold;
		font-size: 5vw;
	}
}

/* Services */
@media screen and (min-width: 600px) {
	#services {
		height: 80;
	}
}

.services {
	border-radius: 20px 60px 60px 55px;
	cursor: pointer;
}

.card-img-overlay {
	display: none;
	text-align: center;
	border-radius: 20px 50px 50px 50px;
	transition: all .5s;
	background-color: rgba(52, 73, 94, 0.75);
}

.services:hover .card-img-overlay,
.services:focus .card-img-overlay,
.services:active .card-img-overlay {
   display: block;
}

/* Going Online --------------------------------*/
@media screen and (max-width: 600px) {
	#onlineserv {
		text-align: center;
	}
}

#onlineserv {
	background-image: linear-gradient(180deg,#161616, transparent, #161616), url("/images/banners/home/onlineimgbg.png");
	background-size: cover;
	height: 100;
	color: black;
	align-items: center;
	display: flex;
	justify-content: center;
}

/* What People Say----------------------- */
#opinion {
	background-color: #161616;
}

#item {
	margin: auto;
}

/* Obituary ----------------------------*/
#obituary {
	margin: auto;
	background-image: linear-gradient(180deg,#161616, transparent, #161616),url("/images/banners/home/obituary/obituarybg.png");
	background-size: cover;
	color: black;
}

.obname {
	color:black;
}

.obituarycard {
	margin: auto;
	background-color: white;
	color:black;
}

@media screen and (max-width: 600px) {
	#obituary {
		text-align: center;
	}

	.obituarycard {
		margin: auto;
		background-color: white;
		color:black;
	}

	.mark {
		display: none;
	}
}

@media screen and (max-width: 992px) {
	.mark {
		display: none;
	}
}

@media screen and (min-width:768px) {
	.fillimg {
		max-height: 300px;
		justify-content: center;
		align-items: center;
	}

	.mark {
		display:flex;
		float:right;
		margin-right: 10px;
		max-height: 250px;
		max-width: 150px;
	}
}

/* Lets Talk ------------------------------- */
@media screen and (min-width:992px) {
	#inputtalk {
		border-right: 1px solid white;
	}
}

.nameform {
   margin-bottom: 10px;
}

#firstname {
	margin-right: 10px;
}

#submitbtn {
	float: right;
}

/* Map ------------------------- */
#map {
	height: 70vh;
}

/* Footer ---------------------------*/
#newsletter {
	border-left: 1px solid white;
	border-right: 1px solid white;
}

.footer-link {
	font-weight: bold;
	font-size: 14px;
	color: white;
	text-decoration: transparent;
}

@media screen and (min-width: 600px) {
	#footer-links {
		margin-left: 30px;
	}
}

@media screen and (max-width: 992px) {
	#footer-links {
	   text-align: center; 
	}

	#logo {
		text-align: center;
	}
}

.reserved {
	border-top: 1px solid white;
}

#policy {
	float:left;
	text-align: left;
}

#soulrights {
	float: right;
	text-align: right;
}