cwsvJudo/homepage/redesign2018/markdownExperiment/src/css/cwsvJudo-2018-subNav.css

.subNav {
	display: flex;
	flex-direction: row;
	font-family: 'Orbitron-Medium', sans-serif;
	line-height: 1.6;
	margin: .5em 0;
	padding: 0;
	border: 1px solid #a2a2a2;
	background-color: #FF8100;
	border-radius: .25em;
}

.subNav > a {
	color: #34495e;
	text-decoration: none;
	padding: .25em .5em;
	text-transform: uppercase;
	text-align: center;
	display: block;
	color: #34495e;
}
.subNav > a:last-child{
	margin-left: auto;
}

.subNav > a > amp-img{
	max-width: 1em;
}
.subNav > a > img{
	height: 1.75em;
	width: auto;
	display: block;
}

.subNav > a > span{
	display: none;
}

.subNav a:hover {
	background-color: #FFAE00;
	color: #718daa;
}


/* ================================= 
  Media Queries
==================================== */


@media (min-width: 640px) {
	.subNav {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-end;
	}
	.subNav > a:last-child{
		display: none;
	}
	.subNav > a{
		display: flex;
		justify-content: flex-end;
		align-items: center;
	}
	.subNav > a > amp-img, 
	.subNav > a > img{
		display: none;
	}
	.subNav > a > span{
		display: initial;
		text-align: right;
	}
}

@media (min-width: 1280px) {
	.subNav{
		justify-content: center;
	}
	.subNav > a > amp-img, 
	.subNav > a > img{
		display: initial;
	}
	.subNav > a{
		justify-content: flex-start;
	}
	.subNav > a > span{
		text-align: initial;
	}
}