@import url(master.webkit.css);
@import url(master.moz.css);

#atat {
    width: 300px;
    height: 300px;
    position: relative;
    top: 60px;
    left: 50px;
    margin: 0;
    padding: 0;
    z-index: 10;
}
#atat #shell {
    width: 300px;
    height: 195px;
    background: transparent url(atat-body.png) no-repeat top left;
    position: absolute;
}
#leg-a, #leg-b, #leg-c, #leg-d {
    height: 450px;
    width: 131px;
    position: relative;
}
#leg-a {
    left: -10px;
    position: absolute;
    top: 140px;
}
#leg-b {
    position: absolute;
    right: 20px;
    top: 140px;
}
#leg-c {
    left: 3px;
    position: absolute;
    top: 150px;
}
#leg-d {
    position: absolute;
    right: 10px;
    top: 150px;
}
.leg-thigh {
    height: 120px;
    width: 131px;
    background: url(atat-thigh.png) top center no-repeat;
    position: relative;
}
.background .leg-thigh {
    background: url(atat-thigh-dark.png) top center no-repeat;
}
.leg-shin {
    position: absolute;
    top: 100px;
    height: 115px;
    width: 131px;
}
.leg-shin .exo {
    height: 115px;
    width: 131px;
    position: relative;
    background: url(atat-knee.png) center top no-repeat,
    url(atat-shin.png) center bottom no-repeat;
    z-index: 20;
}
.background .leg-shin .exo {
    background: url(atat-knee-dark.png) center top no-repeat,
    url(atat-shin-dark.png) center bottom no-repeat;
}
.leg-foot {
    height: 90px;
    width: 131px;
    position: absolute;
    bottom: -70px;
    background: url(atat-foot.png) center bottom no-repeat;
}
.background .leg-foot {
    background: url(atat-foot-dark.png) center bottom no-repeat;
}
#head {
    height: 100px;
    position: absolute;
    right: -190px;
    top: 30px;
    width: 230px;
}
#skull {
    background: url(atat-skull.png) left center no-repeat;
    width: 186px;
    height: 123px;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 300;
}
#neck {
    width: 82px;
    height: 50px;
    position: absolute;
    top: 30%;
    left: 0;
    background: url(atat-neck.png) left center no-repeat;
}
#the-screen {
    background: #53809F url(atat-background.jpg) no-repeat scroll 0 100%;
    height: 519px;
    width: 676px;
    position: absolute;
    top: 0; left: 0;
    z-index: -1;
}

header { color: white; font-family: monospace; position: relative;
width: 676px;}
h1 {margin: 0; display: inline; font-size: 20px;}
a {color: #FFF!important; font-weight: bold }
p {display: inline}
button {position: absolute; top: 0px; right: 10px; width: 80px;}

.bones #atat{border:1px dotted red;}
.bones #atat #shell{border:1px dotted blue;}
.bones #leg-a{left:-10px;position:absolute;top:140px;}
.bones .leg-thigh{border:1px dotted red;}
.bones .leg-shin{border:1px dotted blue;}
.bones .leg-foot{border:1px dotted green;}
.bones #head{border:1px dotted red;}
.bones #skull{border:1px dotted blue;}
.bones #neck{border:1px dotted green;}
