Hello people will help me to divide the css code of html file, I css file is in Odell
Html css JS
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Yahoo Dynamic HTML Banner Example</title>
<link rel="stylesheet" href="style.css">
<!-- update the paths to the Greensock source -->
</head>
<body>
<style type="text/css">
.a {position:absolute;}
.o {overflow:hidden;}
.f {font-family:Arial, Helvetica, sans-serif; font-weight:bold;}
</style>
<div id="yahoo_bannerContainer" class="a o" style="width:300px; height:250px; border-color:#666; border-style:solid; border-width:thin">
<div id="bg1" class="a" style="width:300px; height:250px; background-image:url(bg1.jpg); z-index:1;"></div>
<div id="www" class="a" style="width:117px; height:74px; background-image:url(www.png); z-index:2; top: 11px; left: 5px;"></div>
<div id="com" class="a" <p>ddsadasda </p> </div>
<div id="title" class="a f" style="z-index:3; top: 90px; left: 0px; font-size:26px; color:#fff; width:300px;; text-align:center;">Здравейте<br />КА СТЕ </div>
<div id="bg2" class="a" style="width:300px; height:250px; background-image:url(bg1.jpg); z-index:5;"></div>
<div id="tag" class="a f"style="z-index:6; left:18px; top:10px; line-height:1.2em; font-size:24px; color:#7c019a;">ДСАФСДАФДСА<br />Добре дошли—<br />Заповядайте при нас</div>
<div id="ysb" class="a" style="z-index:7; background-image:url(ysb.jpg); width:300px; height:59px; left: 0px; top: 191px;"></div>
</div>
<script type="text/javascript">
function getElem(id){ return document.getElementById(id); }
var scon = getElem('bg1');
var stars = [];
var sCnt = 0;
function star(x,y){
scon.innerHTML += '<img id="star'+sCnt+'" src="star.png" style="position:absolute; left:'+x+'px; top:'+y+'px;" />';
sCnt++;
stars.push('star'+sCnt);
}
function makeStars(){
var i = 0;
var max = 40;
for(i = 0; i < max; i++){
star( Math.floor(Math.random()*300) , Math.floor(Math.random()*140) ) ;
}
setTimeout('tweenStars()', 200);
}
function tweenStars(){
var i = 0;
var max = stars.length - 1;
var dur = 8;
var tog = true;
var s = null;
for(i = 0; i < max; i++){
tog = !tog;
TweenLite.to(getElem(stars[i]), (dur + Math.floor(Math.random()*12)), { css:{rotation:(tog == true ? 720 : -720)} });
}
}
makeStars();
var seq = new TimelineLite();
seq.append( TweenLite.from(getElem('bg1'), 1, {css:{alpha:0}}) );
seq.append( TweenLite.from(getElem('www'), 0.8, {css:{alpha:0}}) );
seq.append( TweenLite.from(getElem('com'), 0.8, {css:{alpha:0}}) );
seq.append( TweenLite.from(getElem('title'), 0.7, {delay:0.4, css:{alpha:0}}) );
seq.append( TweenLite.from(getElem('bg2'), 1.1, {delay:1.5, css:{top:310}}) );
seq.append( TweenLite.from(getElem('tag'), 0.7, {css:{left:-310}}) );
seq.append( TweenLite.from(getElem('ysb'), 0.6, {css:{top:310}}) );
seq.append( TweenLite.from(getElem('reg'), 0.7, {css:{top:310}}) );
seq.play();
</script>
</body>
</html>
10X