body{
	font-family: 'Oswald', sans-serif;
}
.wrapper{
	max-width: 650px;
	margin: 3em auto;
}
.profile img {
	max-width: 7em;
	border-radius: 50%;
}
.profile h2 {
	margin-bottom: 0;
}
.profile p {
	margin-top: 0.2em;
	margin-bottom: 0;
	color: #8f8f8f;
}
.works {
	margin-top: 6.5em;
}
.works h4 {
	margin: 0 0 .3em .3em ;
}
.cards {
	display: grid;
	grid-template-areas: 
	'left right'
	;
	gap: 1em;
}
.cards .left , .right {
	background-color: #e5e5e5;
	border-radius: 1.1em;
	padding: .8em;

	display: flex;
	flex-direction: column;
	gap: 10em;
	justify-content: space-between;
}
.cards .left {
	grid-area: left;
}
.cards .right {
	grid-area: right;
}
.cards img {
	max-width: 7em;
	border-radius: 1.1em;
}
.cards .version {
	background-color: #c1c1c1;
	width: 7em;
	text-align: center;
	color: rgb(97, 97, 97);
	border-radius: 1em;
	font-size: .7rem;
	margin-top: .7em;
	padding-bottom: .1em;
}
.cards h4 , p {
	margin: 0;
}
.cards p {
	color: #8f8f8f;
}
.cards a {
	text-decoration: none;
	color: black;
}
footer{
	margin-top: 6.5em;
	background-color: #e5e5e5;
	padding: 8em;
}
footer p {
	text-align: center;
}
footer .social {
	display: flex;
	justify-content: center;
	gap: .4em;
	margin-top: 3em;
}
footer .social img {
	max-width: 23px;
	transition: transform 1s ease;
}
footer .social img:hover {
	transform: rotateZ(360deg);
}