@charset "UTF-8";
/* CSS Document */

.top-bar {
	width: 100%;
	padding: 5px 30px 25px 30px;
	text-align: center;
	height: 80px;
}
.top-bar__headline {
	margin: 0;
	background-color: rgba(16,211,55,1.00)
}
/* MAIN MENU */

.codrops-demos {
	position: relative;
	text-align: center;
	z-index: 99;
	padding-top: 10px;
}

.codrops-demos a {
	font-weight: 400;
	text-transform: uppercase;
	font-size: 0.8em;
	letter-spacing: 1px;
	line-height: inherit;
	display: inline-block;
	padding-top: 3px;
	width:175px;
	color: rgba(255,255,255,0.65);
	text-decoration: none;
	border-radius: 2px;
	height: 40px;
	background-color: rgba(0,0,0,0.05);
	border: 1px solid;
	border-color: rgba(255,152,0,0.05);
	transition: .4s ease;
	-webkit-font-smoothing: antialiased;
}
.codrops-demos a.active {
	color: rgba(255,255,255,0.8);
	 border-bottom: 1px solid rgba(255,255,255,0.50);
}
.codrops-demos a:hover, 
.codrops-demos a.current-demo {
    opacity: 1;
    border-bottom: 2px solid rgba(255,152,0,0.80);
    display: inline-block;
    text-decoration: none;
    margin-bottom: -1px;
	color: rgba(255,255,255,1);
	
}
.codrops-demos a.current-demo {
	border-bottom: 3px solid #69606b;
	
}
@media screen and (max-width: 47em) {
.codrops-demos a {
	font-size: 80%;
}
}
/* small screen changes for sidebar (it becomes an off-canvas menu) */
@media screen and (max-width: 599px) {
	
	.top-bar{
		padding: 0px;
	
}	
.codrops-demos a {
	width: 125px;
	font-weight: 400;
	text-transform: uppercase;
	font-size: 0.6em;
	letter-spacing: 1px;
	padding: 0.5em 0;
}
}