html, body {
    margin: 0;
    padding: 0;
    height: 100%; 
	font-family: "Poppins", serif;
    font-weight:700;
	background: #000;
	color: #000;
	font-size: 17px;
	line-height: 24px;
}

h1 { line-height: 1; margin: 0; padding: 10px 0; }
a { text-decoration: none; color: #31678E; transition: 0.25s ease all; }
a:hover { color: #254E6C; padding-left: 2px; font-size: 18px; }
p { padding: 10px 0; margin: 5px; }

body {
	display: flex;
	align-items: center;
    justify-content: center;
}

#backimg {
background: url("../EdgeMarketingPeter.jpg") no-repeat center;
background-attachment: fixed;
background-size: cover;
position: fixed; width: 100%; height: 100%;
top: 0; left:  0;
filter: blur(50px);
}

@media screen and (min-width:200px){
	
	h1 { font-size: 2.5rem; }
	.wrap { 
	max-width: 80%;
	margin: 0 auto;
	padding: 10vh 0;
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	align-items: center;
	
	}
	.block{
	align-items: center;
    text-align: center;
    flex-direction: column;
	position: relative;
	}
	#image {
	background: url("../EdgeMarketingPeter.jpg") no-repeat center;
	background-size: cover;border-radius: 45px 45px 0 0 ;aspect-ratio: 16 / 9;
	width: 100%; z-index: 1;
	}
	#content {
	position: relative;background: rgba(255,255,255,0.85);
	backdrop-filter: blur(10px);border-radius: 0 0 45px 45px;
	padding: 2vw; z-index: 1; 
	}

}
@media screen and (min-width: 1400px){
	
	h1 { font-size: 3.75rem; }
	.wrap { 
	max-width: 1920px;
	flex-direction: row; 
	padding: 0;
	}
	.block {
	display: inline-flex;
	position: relative;
	flex-direction: column;
	}
	#image { 
	width: 1000px; height: auto;border-radius: 45px;
	max-width: 1000px; left: 100px;aspect-ratio: 5 / 4; }
	#content { 
	max-width: 450px; left: -100px;
	width: 50vw; height: auto;border-radius: 45px; }
	
}