html {
	height: 100vh;
}
body {
	background-color: #313131;
	margin: 0;
	padding: 0;
	background: linear-gradient(180deg, #024198 0%, #024198 20%, #1f1f1f 40%, #313131 100%);
}

h3 {
	color: #fff;
	font-weight: 600;
	font-size: 24px;
	text-align: center;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	max-width: 760px;
	margin: auto;
}

h4 {
	color: #fff;
	font-weight: 200;
	font-size: 20px;
	text-align: center;
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	max-width: 760px;
	margin: 0 auto 40px auto;
}


header {
	height: 450px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
	background-image: url("images/graphic-test3-2.avif");
	background-size: cover;
	background-position: center top -250px;
	background-repeat: no-repeat;
}

main {
	margin-top: 30px;
}
.logo {
	display: block;
	margin: auto;
	height: 84px;
	width: 317px;
}

.logos {
	margin: 0 auto;
	max-width: 760px;
}

.logos div {
	margin-bottom: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.logos img {
	max-height: 44px;
	margin-right: 60px;
}

.logos img:last-of-type {
	margin-right: 0;
}

.meta {
	height: 27px;
}

.amazon {
	height: 39px;
	margin-bottom: -14px;
}

.microsoft {
	height: 440px;
}

.sap {
	height: 44px;
}

.nordstrom {
	height: 27px;
}

.kickstarter {
	height: 26px;
}

.trulia {
	height: 36px;
	margin-top: -9px;
}


@media only screen and (min-width: 320px) and (max-width: 1075px) {
	
	header {
		height: 450px;
		width: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
		background-image: url("images/graphic-test3-2.avif");
		background-size: 100%;
		background-position: center top -150px;
		background-repeat: no-repeat;
	}
	h3 {
		font-size: 38px;
	}
	h4 {
		font-size: 30px;
	}
	.logo {
		height: 160px;
		width: 600px;
	}
}