﻿nav{
	position:fixed;
	top:0;
	left:0;
	right:0;
	display:block;
	z-index:100;
	height:80px;

	background:linear-gradient(180deg, rgba(8,8,16,0),rgba(8,8,16,.4)),url('common/slate.png');
	background:-webkit-linear-gradient(270deg, rgba(8,8,16,0),rgba(8,8,16,.4)),url('common/slate.png');
}
.navBorder {
	margin-bottom:-3px;
	height:3px;

	/* for rotation */
	background:linear-gradient(90deg, #0090c2,#fff,#0090c2,orange,purple,#0090c2,#fff,#0090c2,orange,purple,#0090c2 );
	background:-webkit-linear-gradient(0deg, #0090c2,#fff,#0090c2,orange,purple,#0090c2,#fff,#0090c2,orange,purple,#0090c2 );
	background-size:200% 100%;

	animation:bannerGradientRotation 90s linear infinite;
	-webkit-animation:bannerGradientRotation 90s linear infinite;
}
@keyframes bannerGradientRotation{
	0% {
		background-position:right;
	}
	100% {
		background-position:left;
	}
}
@-webkit-keyframes bannerGradientRotation{
	0% {
		background-position:right;
	}
	100% {
		background-position:left;
	}
}

/* for validator callouts */
@keyframes validatorCalloutExpand{
	0% {
		width:20px;
	}
	100% {
		width:200px;
	}
}
@-webkit-keyframes validatorCalloutExpand{
	0% {
		max-width:0;
	}
	100% {
		max-width:200px;
	}
}