Help With Id and class CSS

Hello dear friends..

I Want each id hover background its class working independient each ID with its Class…
I am starting with CSS and HTML so I am having troubles to make my ID`s work with each class indepedient from the others for instance

CSS:
[ Moderator note: Code fixed, please wrap code in <a href=”http://codex.ww.wp.xz.cn/Forum_Welcome#Posting_Code”>backticks or use the code button</a>. ]

#menu { position: absolute; top: 0px; left: 0px; } #menu { width: 1200px; height: 20px; background: url(http://revenueme.com/wp-content/uploads/2014/11/stara1.png); } div.rocket1 { position: absolute; top: 0px; left: 0px; -webkit-transition: 6s ease-in; -moz-transition: 6s ease-in; -o-transition: 6s ease-in; transition: 6s ease-in; } div.rocket1 div { width: 1380px; height: 600px; background: url(http://revenueme.com/wp-content/uploads/2014/11/stara.png); background-repeat: no-repeat; -khtml-opacity:.0; -moz-opacity:.0; -ms-filter:"alpha(opacity=0)"; filter:alpha(opacity=0); filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0.0); opacity:.00; -webkit-transition: 5s ease-in-out; -moz-transition: 5s ease-in-out; -o-transition: 8s ease-in-out; transition: 5s ease-in-out; } div.rocket1 { visibility:hidden; } #menu:hover div.rocket1 { visibility:visible; -webkit-transform: translate(50px, -0px); -moz-transform: translate(50px, -0px); -o-transform: translate(50px, -0px); -ms-transform: translate(50px, -0px); transform: translate(50px, -0px); } #menu:hover div.rocket1 div { -webkit-transform: rotateY(35deg); -moz-transform: rotateY(35deg); -o-transform: rotateY(35deg); -ms-transform: rotateY(35deg); transform: rotateY(35deg); -khtml-opacity:.90; -moz-opacity:.90; -ms-filter:"alpha(opacity=120)"; filter:alpha(opacity=120); filter: progid:DXImageTransform.Microsoft.Alpha(opacity=1); opacity:.90; } }

#menu3 { position: absolute; top: 0px; left: 0px; } #menu3 { width: 1400px; height: 20px; background: url(http://revenueme.com/wp-content/uploads/2014/11/stara1.png); } #menu4 { position: absolute; top: 0px; left: 0px; } 

 div.space1 { position: absolute; top: 0px; left: 0px; -webkit-transition: 8s ease-in; -moz-transition: 8s ease-in; -o-transition: 8s ease-in; transition: 8s ease-in; } div.space1 div { width: 1400px; height: 600px; background: url(http://revenueme.com/wp-content/uploads/2014/11/SPACESI.png); background-repeat: no-repeat; -khtml-opacity:.0; -moz-opacity:.0; -ms-filter:"alpha(opacity=0)"; filter:alpha(opacity=0); filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0.0); opacity:.00; -webkit- transition: 5s ease-in-out; -moz-transition: 5s ease-in-out; -o-transition: 8s ease-in-out; transition: 5s ease-in-out; } div.space1 { visibility:hidden; } #menu3:hover div.space1 { visibility:visible; -webkit-transform: translate(50px, -0px); -moz-transform: translate(50px, -0px); -o-transform: translate(50px, -0px); -ms-transform: translate(50px, -0px); transform: translate(50px, -0px); } #menu3:hover div.space1 div { -webkit-transform: rotateY(35deg); -moz-transform: rotateY(35deg); -o-transform: rotateY(35deg); -ms-transform: rotateY(35deg); transform: rotateY(35deg); -khtml-opacity:.90; -moz-opacity:.90; -ms-filter:"alpha(opacity=120)"; filter:alpha(opacity=120); filter: progid:DXImageTransform.Microsoft.Alpha(opacity=1); opacity:.90; } } 

#menu4 { width: 550px; height: 20px; background: url(http://revenueme.com/wp-content/uploads/2014/11/stara1.png); } }

HTML:<div id="menu">
<div class="rocket1"<div>
<div><!-- rocket1 --></div>

<div id="menu3"> <div class="space1"><div><p style="text-align:left; float: left;margin: -0px 0px 0px 650px; font-size: 150%; color:#f1f2f6;  font-weight:semibold;text-shadow: -5px -5px 25px  #002bff,-5px -5px 10px  #030c38" class="outline-inward">Affiliation for Experts</p>
<div class="rocket1"<div>
<div><!-- space1 --><p style="text-align:left; float: left; margin:100px 100px 0px 100px; font-size: 500%; color: White;" class:"grow" >Revenue Management Experience</p></div>
<div id="menu4"><p style="text-align:left; float: left;margin: -0px 0px 0px 400px; font-size: 150%; color:#f1f2f6;  font-weight:semibold;text-shadow: -5px -5px 25px  #002bff,-5px -5px 10px  #030c38" class="outline-inward">Expert Jobs</p></div>