/*top styling*/

.hero-img {
	height: 345px;
	width: 100%;
	background-size: cover;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}

.hero-filter {
	background-color: var(--filter);
	opacity: 0.7;
	z-index: 1;
	width: 100%;
	height: 345px;
}

.hero-content {
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	height: 255px;
	z-index: 2;
}

.hero-logo {
	width: 100%;
	height: 165px;
	background-image: url("../imgs/logoone.png");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.hero-img h1 {
	font-family: 'Quicksand', sans-serif;
	font-weight: 700;
	font-size: 42pt;
	color: white;
}
.hero-img h2 {
	font-family: 'Quicksand', sans-serif;
	font-weight: 700;
	font-size: 16pt;
	color: white;
}

/*content styling*/

.two-col-box {
	width: 960px;
	display: flex;
	margin-top: 45px;
	margin-bottom: 95px;
}

.left-col, .right-col {
	width: 50%;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	font-family: 'Open Sans', sans-serif;
	font-size: 12pt;
	line-height: 200%;
	color: var(--text);
}

.left-col {
	margin-right: 40px;
}

p {
	padding-top: 20px;
}

.content h3 {
	font-family: 'Quicksand', sans-serif;
	font-size: 24pt;
	font-weight: 700;
	color: var(--pri);
}

.button-box {
	width: 930px;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	margin-bottom: 95px;
}

.button {
	font-family: 'Quicksand', sans-serif;
	font-size: 15pt;
	min-width: 200px;
	font-weight: 700;
	text-align: center;
}


.button a {
	text-decoration: none;
	color: white;
	min-width: 200px;
	padding: 20px 25px;
	background-color: var(--sec);
	border-radius: 20px;
	transition: all 0.3s;
}
.button a:hover {
	background-color: var(--ter);
}