* { padding: 0; margin: 0; }

body { background: url('images/bg.jpg') repeat; }

#topgradient { width: 100%; height: 64px; background: url('images/topgradient.png') repeat-x; position: absolute; top: 0; left: 0; }

#wrapper { width: 1010px; margin: 0 auto; position: relative; }

#logolabel a { width: 254px; height: 110px; background: url('images/logolabel.png') no-repeat; position: absolute; top: 0; left: 58px; }
#logolabel h1 { text-indent: -1000px; overflow: hidden; }

#menu { width: 492px; height: 120px; background: url('images/menu.png') no-repeat; position: absolute; top: 150px; left: 80px; }
#menuul { list-style-type: none; position: relative; }
#menuul li a.whoweare { position: absolute; top: 21px; left: 33px; display: block; height: 20px; width: 88px; background: url('images/menu.png') -33px -21px no-repeat; text-indent: -1000px; overflow: hidden; }
#menuul li a.whoweare:hover { background-position: -33px -132px; }
#menuul li a.whatwedo { position: absolute; top: 21px; left: 140px; display: block; height: 20px; width: 92px; background: url('images/menu.png') -140px -21px no-repeat; text-indent: -1000px; overflow: hidden; }
#menuul li a.whatwedo:hover { background-position: -140px -132px; }
#menuul li a.ourexperience { position: absolute; top: 21px; left: 249px; display: block; height: 20px; width: 119px; background: url('images/menu.png') -249px -21px no-repeat; text-indent: -1000px; overflow: hidden; }
#menuul li a.ourexperience:hover { background-position: -249px -132px; }
#menuul li a.contactus { position: absolute; top: 21px; left: 384px; display: block; height: 20px; width: 84px; background: url('images/menu.png') -384px -21px no-repeat; text-indent: -1000px; overflow: hidden; }
#menuul li a.contactus:hover { background-position: -384px -132px; }

#notebook { width: 776px; height: 478px; background: url('images/notebook.png') no-repeat; position: absolute; top: 195px; left: 0; }
#notebook #page { width: 776px; height: 478px; text-indent: -3000px; overflow: hidden; }
#notebook #page.home { background: url('images/page_home.png') 0 0 no-repeat; }
#notebook #page.whoweare { background: url('images/page_whoweare.png') 0 0 no-repeat; }
#notebook #page.whatwedo { background: url('images/page_whatwedo.png') 0 0 no-repeat; }
#notebook #page.ourexperience { background: url('images/page_ourexperience.png') 0 0 no-repeat; }
#notebook #page.contactus { background: url('images/page_contactus.png') 0 0 no-repeat; }

#emaillink a { position: absolute; left: 466px; top: 366px; width: 214px; height: 20px; background: url('images/emaillink.png') no-repeat; }
#emaillink a:hover { background: url('images/emaillink.png') 0 -20px no-repeat; }

#mug { width: 263px; height: 261px; position: absolute; top: 7px; right: 0; }
#mug.full { background: url('images/mug_full.png') no-repeat; }
#mug.half { background: url('images/mug_half.png') no-repeat; }
#mug.empty { background: url('images/mug_empty.png') no-repeat; }

#phone.closed { width: 258px; height: 129px; background: url('images/phone_closed.png') no-repeat; position: absolute; top: 20px; left: 364px; }
#phone.open { width: 183px; height: 358px; background: url('images/phone_open.png') no-repeat; position: absolute; top: 225px; left: 110px; }

#mouse { width: 175px; height: 240px; background: url('images/mouse.png') no-repeat; position: absolute; top: 350px; left: 805px; }

#penup { width: 106px; height: 304px; background: url('images/penup.png') no-repeat; position: absolute; }
#penup.home { top: 305px; left: 205px; }
#penup.whoweare { top: 230px; left: 45px; }

#penacross { width: 318px; height: 79px; background: url('images/penacross.png') no-repeat; position: absolute; }
#penacross.whatwedo { top: 540px; left: 440px; }
#penacross.ourexperience { top: 565px; left: 440px; }
#penacross.contactus { top: 60px; left: 370px; }

#postit { width: 223px; height: 221px; background: url('images/postit.png') no-repeat; position: absolute; top: 385px; left: 125px; text-indent: -1000px; overflow: hidden; }

#cookie.full { width: 180px; height: 171px; background: url('images/cookie_full.png') no-repeat; position: absolute; top: 230px; left: 60px; }
#cookie.half { width: 147px; height: 179px; background: url('images/cookie_half.png') no-repeat; position: absolute; top: -40px; right: 240px; }