/* MUSIC CONFIRM */

.bg-music-confirm {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    position: fixed;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    background: #000;
    z-index: 10;
	opacity: 0;
    visibility: hidden;
    transition: all 1s;
}

.bg-music-confirm.show {
    opacity: 1;
    visibility: visible;
}

.bg-music-confirm p:first-child {
	color: #EDEDED;
	letter-spacing: 2px;
    text-transform: uppercase;
}

.bg-music-confirm a {
    display: inline-block;
    margin: 0 1em;
    cursor: pointer;
    font-size: 200%;
    font-weight: 300;
	color: #FFF;
	text-decoration: none;
}

.cool-link {
    background-image: linear-gradient(transparent 88%, #2c00ff 12%);
    background-repeat: no-repeat;
    background-size: 0% 100%;
    transition: all 1s;
}

/* Music Control */

.play-music {
	display: flex; 
	position: relative;
	justify-content: end;
	right: 110px;
	top: 10px;
	z-index: 9; 
	transition: opacity 1.5s;
}

.music-bar {
    width: 1px;
    background-color: #fff;
    height: 2px;
    display: block;
    margin: 0 1px;
}

.music-animation {
	display: flex;
	margin-right: 10px;
	align-items: flex-end;
	position: relative;
	top: -5px;
}

.music-animation.on .music-bar {
	animation: bar 1.2s infinite;
}

.music-animation.on .bar2 {
	animation-delay: .1s;
}

.music-animation.on .bar3 {
	animation-delay: .2s;
}

.music-animation.on .bar4 {
	animation-delay: .3s;
}

.music-animation.on .bar5 {
	animation-delay: .4s;
}

.music-toggle {
	cursor: pointer; position: relative;
}

.music-toggle a, 
.music-toggle a:hover {
	font-size: 10px; 
	letter-spacing: 1px; 
	text-transform: uppercase; 
	color: #fff !important; 
	text-shadow: 0 0 8px rgba(0, 0, 0, 0.59);
}

.music-toggle:after {
	content: ""; 
	display: block; 
	height: 1px; 
	width: 0; 
	background-color: #fff; 
	position: absolute; 
	transition: .2s;
}

.music-toggle:hover:after {
	width: 100%;
}

@keyframes bar {
	0% {
		height: 4px; 
	}
	50% {
		height: 14px;
	}
	100% {
		height: 4px;
	}
}

