@charset "utf-8";

/*
   New Perspectives on HTML5 and CSS3, 8th Edition
   Tutorial 5
   Coding Challenge 1

   Author:   Ariel Kainu
   Date:     October 14th, 2026
   Filename: code5-1_media.css

*/

@media only screen and (max-width: 500px) {

article img {
	display: none;
}

ul.submenu {
	text-align: center;
}

}

@media only screen and (min-width: 501px) {

nav {
	float: left;
	width: 130px;
	height: 400px;
	margin: 30px 25px 0px 0px;
}

}

@media only screen and (min-width: 710px) {

nav {
	float: none;
	width: 100%;
	height: auto;
	margin: 0px;
}

ul.mainmenu {
	display: flex;
	flex-flow: row nowrap;
	justify-content: center;
}

ul.mainmenu li {
	flex: 0 1 120px;
}

}