*{
	margin:0px;
	padding:0px;
	border:0px;
}


body{
	background-color:#000;
}

#container{
	width:670px;
	height:360px;
	margin:100px auto;
	overflow:hidden;
	border:4px solid #fff;
	border-radius:5px;
}

#fundo1{
	background-image:url(bg.png);
}

#fundo2{
	background-image:url(bg2.jpg);
}

#fundo3{
	background-image:url(bg-maior.jpg);
	background-size:2016px 360px;
	background-position:right top;
}

#fundo3.animate{
	animation: animatedBackground 10s linear infinite;
	-webkit-animation: animatedBackground 40s linear infinite;
}

#fundo1, #fundo2, #fundo3{
	background-size:auto 360px;
	width:670px;
	height:360px;
	position:absolute;
}

#fim{
	background-image:url(img-fim.jpeg);
	background-repeat:no-repeat;
	background-size:auto 360px;
	background-color:#FFFFFF;
	background-position:top center;
	width:670px;
	height:360px;
	position:absolute;
}

#cartman, #cartman2{
	background-image:url(catman.gif);
	width:135px;
	height:136px;
	position:relative;
	z-index:10;
}

#cartman{
	top:170px;
	left:805px;
}

#cartman2{
	top:170px;
	left:275px;
	display:none;
}

#cartman.animate{
	left:-235px;
}


#cartman.animate,#cartman2.animate{
	transition:all 6s linear;
	animation-name: andar;
	animation-duration: 0.2s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	
	-webkit-transition:all 6s linear;
	-webkit-animation-name: andar;
	-webkit-animation-duration: 0.2s;
	-webkit-animation-timing-function: linear;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-direction: alternate;
}


	
@-webkit-keyframes andar {
	from {
		transform: rotate(3deg);
		-webkit-transform: rotate(3deg);
	}
	to {
		transform: rotate(-3deg);
		-webkit-transform: rotate(-3deg);
	}
}

@-webkit-keyframes animatedBackground {
	from{
		background-position: right top;
	}
	
	to{
		background-position: left top;
	}
}