* {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
}
body {
	font-family: "Google Sans", sans-serif;
}
.container {
	width: 100%;
	margin: 0 auto;
	padding: 0 20px;
}
header {
	nav {
		ul {
			display: flex;
			padding: 20px 0;
			li {
				list-style: none;
				margin: 0 10px;
				a {
					display: inline-block;
					position: relative;
					padding: 10px 20px;
					text-decoration: none;
					color: #003049;
					transition: color 0.3s;
					&:after {
						content: '';
						position: absolute;
						bottom: 0;
						left: 0;
						display: block;
						width: 100%;
						height: 2px;
						background: #003049;
						z-index: -1;
						transition: height 0.3s;
					}
					&:is(:hover, :focus) {
						color: #fff;
						&:after {
							height: 100%;
						}
					}
					&.active {
						color: #fff;
						&:after {
							height: 100%;
						}
					}
				}
			}
		}
	}
}
#main-content {
	padding: 30px 0;
}
#active-url {
	padding: 20px 0;
}