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

body {
	margin: 0;
	padding: 0;
}

#container {
	position: relative;
	width: 970px;
	height: 250px;
	overflow: hidden;
	border: 1px solid white;
	box-sizing: border-box; 
}

#legal_icon {
	position: absolute;
	top: 0px;
	right: 0px;
	width: 100px;
	height: 11px;
}

#legal_icon:hover {
	position: absolute;
	background: url("lc.png") 0px 250px;
	overflow:hidden;
	text-align: right;
	opacity: 1;
	width: 970px;  
	height: 250px;
	animation: legalcopy 50s linear;
}


#txt1 {
	position: absolute;
	opacity: 1;
	left: 15px;
	top: 21px;
	animation: txt1 18s ease-in-out;
}
@keyframes txt1 {
	0% { opacity: 0; }
	1% { opacity: 0; }
	3% { opacity: 1; }
	100% { opacity: 1; }
}

#txt2 {
	position: absolute;
	opacity: 0;
	left: 14px;
	top: 61px;
	animation: txt2 18s ease-in-out;
}


@keyframes txt2 {
	0% { opacity: 0; }
	10% { opacity: 0; }
	13% { opacity: 1; }
	23% { opacity: 1; }
	24% { opacity: 0; }
	100% { opacity: 0; }
}

#txt3 {
	position: absolute;
	opacity: 1;
	left: 14px;
	top: 61px;
	animation: txt3 18s ease-in-out;
}


@keyframes txt3 {
	0% { opacity: 0; }
	20% { opacity: 0; }
	23% { opacity: 1; }
	100% { opacity: 1; }
}

#txt4 {
	position: absolute;
	opacity: 1;
	left: 15px;
	top: 102px;
	animation: txt4 18s ease-in-out;
}


@keyframes txt4 {
	0% { opacity: 0; }
	25% { opacity: 0; }
	28% { opacity: 1; }
	100% { opacity: 1; }
}


#txt5 {
	position: absolute;
	opacity: 0;
	left: 15px;
	top: 160px;
	animation: txt5 18s ease-in-out;
}


@keyframes txt5 {
	0% { opacity: 0; }
	37% { opacity: 0; }
	39% { opacity: 1; }
	52% { opacity: 1; }
	54% { opacity: 0; }
	100% { opacity: 0; }
}

#txt6 {
	position: absolute;
	opacity: 0;
	left: 15px;
	top: 160px;
	animation: txt6 18s ease-in-out;
}


@keyframes txt6 {
	0% { opacity: 0; }
	54% { opacity: 0; }
	56% { opacity: 1; }
	76% { opacity: 1; }
	78% { opacity: 0; }
	100% { opacity: 0; }
}

#txt7 {
	position: absolute;
	opacity: 1;
	left: 15px;
	top: 160px;
	animation: txt7 18s ease-in-out;
}


@keyframes txt7 {
	0% { opacity: 0; }
	77% { opacity: 0; }
	79% { opacity: 1; }
	100% { opacity: 1; }
}

#txt8 {
	position: absolute;
	opacity: 0;
	left: 14px;
	top: 183px;
	animation: txt8 18s ease-in-out;
}


@keyframes txt8 {
	0% { opacity: 0; }
	77% { opacity: 0; }
	79% { opacity: 1; }
	87% { opacity: 1; }
	89% { opacity: 0; }
	100% { opacity: 0; }
}


#car_bg_red {
	position: absolute;
	opacity: 1;
	left: 400px;
	top: 45px;
	animation: car_bg_red 18s ease-in-out;
}

@keyframes car_bg_red {
	0% { opacity: 0; }
	1% { opacity: 0; }
	3% { opacity: 1; }
	49% { opacity: 1; }
}

#car_red {
	position: absolute;
	opacity: 1;
	left: 330px;
	top: 82px;
	transform:scale(1.0);
	animation: car_red 18s ease-in-out;
}

@keyframes car_red {
	0% { opacity: 0; transform:scale(0.95);left: 330px;top: 82px;}
	5% { opacity: 0; transform:scale(0.95);left: 330px;top: 82px;}
	8% { opacity: 1; transform:scale(0.95);left: 330px;top: 82px;}
	35% { opacity: 1; transform:scale(0.95);left: 330px;top: 82px;}
	38% { opacity: 1; transform:scale(1.0);left: 330px;top: 82px;}
	100% { opacity: 1; transform:scale(1.0);left: 330px;top: 82px;}		
}


#car_bg_blue {
	position: absolute;
	opacity: 1;
	left: 515px;
	top: 20px;
	animation: car_bg_blue 18s ease-in-out;
}

@keyframes car_bg_blue {
	0% { opacity: 0; }
	10% { opacity: 0; }
	13% { opacity: 1; }
	49% { opacity: 1; }
}

#car_blue {
	position: absolute;
	opacity: 1;
	left: 510px;
	top: 80px;
	transform:scale(1.0);
	animation: car_blue 18s ease-in-out;
}

@keyframes car_blue {
	0% { opacity: 0; transform:scale(0.90);left: 500px;top: 78px;}
	15% { opacity: 0; transform:scale(0.90);left: 500px;top: 78px;}
	18% { opacity: 1; transform:scale(0.90);left: 500px;top: 78px;}
	35% { opacity: 1; transform:scale(0.90);left: 500px;top: 78px;}
	38% { opacity: 1; transform:scale(1.0);left: 510px;top: 80px;}	
	100% { opacity: 1; transform:scale(1.0);left: 510px;top: 80px;}	
}

#car_bg_grey {
	position: absolute;
	opacity: 1;
	left: 675px;
	top: 40px;
	animation: car_bg_grey 18s ease-in-out;
}

@keyframes car_bg_grey {
	0% { opacity: 0; }
	20% { opacity: 0; }
	23% { opacity: 1; }
	49% { opacity: 1; }
}

#car_grey {
	position: absolute;
	opacity: 1;
	left: 670px;
	top: 88px;
	transform:scale(1.0);
	animation: car_grey 18s ease-in-out;
}

@keyframes car_grey {
	0% { opacity: 0; transform:scale(0.90);left: 680px;top: 85px;}
	25% { opacity: 0; transform:scale(0.90);left: 680px;top: 85px;}
	28% { opacity: 1; transform:scale(0.90);left: 680px;top: 85px;}
	35% { opacity: 1;  transform:scale(0.90);left: 680px;top: 85px;}
	38% { opacity: 1;  transform:scale(1.0);left: 670px;top: 88px;}
	100% { opacity: 1;  transform:scale(1.0);left: 670px;top: 88px;}
}


#cta {
	position: absolute;
	opacity: 1;
	left: 15px;
	top: 200px;
	animation: cta 18s ease-in-out;
}

@keyframes cta {
	0% { opacity: 0; }
	89% { opacity: 0; transform:scale(1.0);}
	92% { opacity: 1; transform:scale(1.0);}
	94% { opacity: 1; transform:scale(1.1);}
	96% { opacity: 1; transform:scale(1.0);}	
	98% { opacity: 1; transform:scale(1.1);}	
	100% { opacity: 1; transform:scale(1.0);}	
}


#logo {
	position: absolute;
	opacity: 1;
	right: 15px;
	bottom: 15px;
}