body{
	background-color: rgb(31,31,31);
}






.title h1{
    font-size: 4em;
    font-family: Arial, Helvetica, sans-serif;
    margin-top: 1em;
    text-align: center;
		font-weight: 700;

    /* Stryling the text and giving it gradiant */
    color:#ffffff;
    background: -webkit-linear-gradient(#eee, rgb(0, 0, 0));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
		-webkit-text-stroke: 0.03em rgba(255, 255, 255, 0.46);
    text-shadow: 6px 6px 0px rgba(0,0,0,0.2);

    /* Make sure text is infront of background images */
    display:block;
    position: relative;
    z-index: 3;
}

@keyframes move-twink-back {
    from {background-position:0 0;}
    to {background-position:-10000px 5000px;}
}

.stars, .twinkling {
  position:absolute;
  top:0;
  left:0;
  right:0;
  bottom:0;
  width:100%;
  height:100%;
  display:block;
}

.stars {
  background:#000 url(stars.png) repeat top center;
  z-index:0;
}

.twinkling{
  background:transparent url(twinkling.png) repeat top center;
  z-index:1;
  animation:move-twink-back 200s linear infinite;
}








#ann{
	color: white;
	font-size: 1.5em;
	text-align: center;
	position: relative;
  z-index: 3;
}

h2{
	color: red;
	text-shadow: 3px 3px 8px rgba(255, 0, 0, 0.936);
	-webkit-text-stroke: 0.01em rgba(255, 255, 255, 0.655);
	font-size: 1.1em;
	text-align: center;
	position: relative;
	z-index: 3;
	margin-bottom: 0.5em;

}

#timer{
	color: white;
	-webkit-text-stroke: 0.01em rgb(255, 9, 9);
	text-align: center;
	font-size: 3em;
	font-weight: bold;
	position: relative;
  z-index: 3;
}

p{
	color: white;
	font-size: 1.5em;
	text-align: center;
	position: relative;
  z-index: 3;
	margin-top: 18em;

}

button{
	display: flex;
	padding: 0.5em 1em;
	font-size: 1em;
	border-radius: 0.7em;
	border: none;
	box-shadow: 0px 0px 20px rgba(255, 255, 255, 0.936);
	position: relative;
  z-index: 3;
}

#button1{
	color: rgb(54, 54, 54);
	font-size: 2em;
	padding: 0em;
	padding-left: 0.5em;
	padding-right: 0.5em;
	border-radius: 0.3em;
	-webkit-text-stroke: 0.01em rgba(0, 0, 0, 0.936);
}

#button1:hover{
	background-color: rgb(31, 31, 31);
	color: white;
	transition: 0.3s;
	box-shadow: 0px 0px 30px rgba(255, 255, 255, 0.936);
	font-size: 2.2em;
}

#button2{
	color: black;
	font-weight: bold;
	border: none;
	-webkit-text-stroke: 0.01em rgba(0, 0, 0, 0.936);
}

.video{
	font-size: 0.35em;
}


.music, .video{
	display: flex;
	justify-content: center;
	position: relative;
  z-index: 3;
}


#videoContainer{
	margin-top: 1em;
	text-align: center;
	position: relative;
  z-index: 3;
}

#videoGojo{
	display: flex;
	justify-content: flex-end;
	position: relative;
  z-index: 3;
}

#video2{
	justify-content: flex-end;
	display: inline-flex;
	text-align: right;
	position: relative;
  z-index: 3;
	vertical-align: middle;
}
