Two columns site with flex

<div class="row">
	<div class="container">
    <h2 class="page-title">Two Div with using Flex</h2>
		<div class="flex-wrap">
			<div class="content-wrap">
				<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi ut ultricies ligula. Vivamus sed pharetra justo. Duis commodo sem quis nisi eleifend porttitor. Aenean tristique nunc blandit, aliquam lorem a, hendrerit eros. Nulla facilisi. Aliquam tristique eros sed mi scelerisque vulputate. Phasellus tellus velit, faucibus nec lacus eu, mattis pharetra lacus. Donec tristique, sem consectetur aliquam imperdiet, leo leo tristique erat, eu blandit orci tortor id risus. Donec dapibus sit amet augue in viverra.</p>

				<p>Nulla quam quam, gravida non lobortis et, mollis vitae metus. Praesent non blandit massa. In pellentesque sodales lectus, vel consequat mi aliquet vitae. Aenean dui justo, elementum ac sem id, euismod posuere nisl. Aliquam finibus, elit vel volutpat rutrum, dolor dolor luctus nibh, nec semper nisl ex egestas neque. Pellentesque sit amet arcu sit amet leo interdum venenatis. Maecenas viverra eleifend enim ut pharetra. Aenean tristique condimentum ligula eget cursus. Aenean libero erat, iaculis quis mollis ac, consectetur vel justo.</p>
			</div>
			<div class="image-wrap">
        <img src="https://pixelthemes.com/wp-content/uploads/2023/12/112-600x400-1.jpg" alt="Nature">
        </div>
		</div>
	</div>
</div>

img{
	max-width:100%
}
.container{
	width:1160px;
	max-width:90%;
	margin:0 auto
}
.flex-wrap{
	display:flex;
	gap:30px
}
.content-wrap,
.image-wrap{
	border:1px solid;
	padding:5%;
}
.content-wrap{
	width:40%
}
.image-wrap{
	width:60%
}
.image-wrap img{
	width:100%
}
@media(max-width:680px){
	.flex-wrap{
		flex-wrap:wrap
	}
	.content-wrap,.image-wrap{
		width:auto
	}
}