
body {
	background-image: url('../img/bgstar45.gif');
	font-family: "Comic Sans MS", "Comic Sans", courier, sans-serif;
	text-align: center;
	cursor: url('../img/cursor.png'), auto;
}
#container {
	width: 800px;
	margin: 0px auto;
}
#welcome {
	color: white;
	font-size: 50px;
	margin: 50px 0px;
}
h3 {
	color: lime;
}
.hitcounter {
	width: 144px;
	margin: 25px auto;
	border: 2px solid #ccc;
}
#social-container{
	margin-bottom: 50px;

}
#socials {
	display: flex;
	justify-content: center;
}
#socials .social-item {
	transition: all .2s ease-in-out;
}
#socials .social-item:hover {
	transform: scale(1.25);
}
#socials .social-item img{
	max-width: 100%;
}
.youtube {
	margin: 0px 5px;
}
.marquee-baby {
 height: 50px;	
 overflow: hidden;
 position: relative;
 margin-bottom: 50px;
}
.marquee-baby h3 {
 font-size: 3em;
 color: orange;
 position: absolute;
 width: 100%;
 height: 100%;
 margin: 0;
 line-height: 50px;
 text-align: center;
 /* Starting position */
 -moz-transform:translateX(100%);
 -webkit-transform:translateX(100%);	
 transform:translateX(100%);
 /* Apply animation to this element */	
 -moz-animation: marquee-baby 15s linear infinite;
 -webkit-animation: marquee-baby 15s linear infinite;
 animation: marquee-baby 15s linear infinite;
}
.marquee-baby .info {
 font-size: 30px;
 color: lime;
 position: absolute;
 width: 100%;
 height: 100%;
 margin: 0;
 line-height: 30px;
 text-align: center;
 /* Starting position */
 -moz-transform:translateX(100%);
 -webkit-transform:translateX(100%);	
 transform:translateX(100%);
 /* Apply animation to this element */	
 -moz-animation: marquee-baby 15s linear infinite;
 -webkit-animation: marquee-baby 15s linear infinite;
 animation: marquee-baby 15s linear infinite;
}
/* Move it (define the animation) */
@-moz-keyframes marquee-baby {
 0%   { -moz-transform: translateX(100%); }
 100% { -moz-transform: translateX(-100%); }
}
@-webkit-keyframes marquee-baby {
 0%   { -webkit-transform: translateX(100%); }
 100% { -webkit-transform: translateX(-100%); }
}
@keyframes marquee-baby {
 0%   { 
 -moz-transform: translateX(100%); /* Firefox bug fix */
 -webkit-transform: translateX(100%); /* Firefox bug fix */
 transform: translateX(100%); 		
 }
 100% { 
 -moz-transform: translateX(-100%); /* Firefox bug fix */
 -webkit-transform: translateX(-100%); /* Firefox bug fix */
 transform: translateX(-100%); 
 }
}

@keyframes blink {
to { color: red; }
}

.blinking {
color: blue;
animation: blink 1s steps(2, start) infinite;
}

@media only screen and (max-width: 800px) {
    #container{
    	width: 100%;
    }
}