#hero {

	background-size: cover;

	background-position: center;

	background-repeat: no-repeat;

	text-align: center;

	padding: 35px 0 288px 0;

	margin-bottom: 51px;

}



#hero img {

	max-width: 321px;

	margin: 0 auto;

}



#hero .text {

	text-align: left;

	color: #fff;

	padding-top: 234px;

}



#hero p {

	margin-top: 10px;

}



#hero .button {

	margin-top: 28px;

}

#hero h2 {
	font-size: 47px;
}



@media screen and (max-width: 992px) {

	.text-with-image {

		padding: 0;

	}



	#hero {

		height: 100vh;

	}



	#hero .container {

		height: 100%;

		display: flex;

		flex-direction: column;

		justify-content: center;

	}



	#hero .container img {

		margin-bottom: auto;

	}



	#hero .container .text {

		padding-top: 0;

	}



	#hero .container .button {

		margin-bottom: auto;

	}

}



@media screen and (max-width: 768px) {

	#hero {

		padding: 50px 0;

	}

}



@media screen and (max-width: 567px) {

	#hero img {

		max-width: 320px;

		width: 100%;

		margin: 0 auto;

	}

	#hero h2 {
		font-size: 32px;
	}

}