/* ABOUT */




/* WORK */

#work > div:nth-child(1) {
	display: flex;
	justify-content: space-between;
}

.sort {
	display: flex;
	flex-direction: column-reverse;
}

#work h2 {
	margin: 0;
}

#work a {
	color: inherit;
	font-weight: inherit;
}
#work a:hover {
	text-decoration: none;
}

#work a > article:hover {
	box-shadow: inset 0 -3px 6px rgba(0,0,0,0.16), inset 0 -3px 6px rgba(0,0,0,0.23);
}

#work h3 span {
	color: grey;
	font-size: smaller;
}

#work article div {
	display: flex;
}

#work article > div > img {
	height: 200px;
	width: 300px;
	border-radius: 10px;
}

#work article > div > div {
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin: 0 0 0 20px;
}

#work article div div p {
	margin: 0;
	text-align: justify;
}

#work article div div ul {
	margin: 0;
	padding: 0 0 0 20px;
}

#work article div div div {
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	margin: 16px 0 0 0;
}

#work article div div div img {
	margin: 0;
	height: 48px;
	width: 48px;
}


/* MEDIA QUERIES */

/* @media only screen and (max-width: 600px) {

	#about div, #work article div {
		flex-direction: column;
	}

	#about div img, #work article div img {
		margin: 0 auto 20px auto;
	}

	#work article {
		padding: 10px;
	}
} */

/* smartphone portrait and landscape */
/* @media only screen and (((max-width: 320px) and (max-height: 480px) and (orientation: portrait)) or ((max-width: 480px) and (max-height: 320px) and (orientation: landscape))) {
	#about > div > img {
		height: 160px;
		width: 160px;
	}
	
	#work article > div > img {
		height: 160px;
		width: 240px;
	}

	#about > div > div > div {
		flex-wrap: wrap;
	}
} */

/* small tablet portrait and landscape */
/* @media only screen and (((max-width: 600px) and (max-height: 800px) and (orientation: portrait)) or ((max-width: 800px) and (max-height: 600px) and (orientation: landscape))) {
	#about > div, #work article > div {
		flex-direction: column;
	}

	#about > div > img, #work article > div > img {
		margin: 0 auto 16px auto;
	}

	#about > div > div, #work article > div > div {
		margin: 0;
	}

	#work article {
		padding: 8px;
	}
} */