/* decorate the tree */

#stable {
width:700px; 
height:370px; 
padding-bottom: 300px;
z-index:1;
overflow:visible;
background: url("nativity/stable.png") no-repeat top left;
}

#items {
z-index:3;
}

#items img {

}

#isaac { 
position:absolute;
left:250px;
top:720px;
z-index: 10; 
width: 109px; 
height: 172px;
background: url(nativity/isaac.png) no-repeat top left;
}

#david {
position:absolute;
left:310px;
top:720px;
z-index: 11; 
width: 128px; 
height: 172px;
background: url(nativity/david.png) no-repeat top left;
}

#moses {
position:absolute;
left:360px;
top:720px;
z-index: 12; 
width: 91px; 
height: 176px;
background: url(nativity/moses.png) no-repeat top left;
}

#melchior {
position:absolute;
left:800px;
top:700px;
z-index: 13; 
width: 97px; 
height: 194px;
background: url(nativity/melchior.png) no-repeat top left;
}

#balthazar {
position:absolute;
left:840px;
top:720px;
z-index: 14; 
width: 112px; 
height: 177px;
background: url(nativity/balthazar.png) no-repeat top left;
}

#gaspar {
position:absolute;
left:880px;
top:720px;
z-index: 15; 
width: 118px; 
height: 176px;
background: url(nativity/gaspar.png) no-repeat top left;
}

#joseph {
position:absolute;
left:575px;
top:720px;
z-index: 16; 
width: 91px; 
height: 173px;
background: url(nativity/joseph.png) no-repeat top left;
}

#mary {
position:absolute;
left:625px;
top:720px;
z-index: 17; 
width: 80px; 
height: 173px;
background: url(nativity/mary.png) no-repeat top left;
}

#sheep-r {
position:absolute;
left:425px;
top:820px; 
z-index: 18; 
width: 104px; 
height: 75px;
background: url(nativity/sheep-r.png) no-repeat top left;
}

#sheep-l {
position:absolute;
left:350px;
top:820px; 
z-index: 19; 
width: 104px; 
height: 75px;
background: url(nativity/sheep-l.png) no-repeat top left;
}

#manger {
position:absolute;
left:665px;
top:840px; 
z-index: 20; 
width: 97px; 
height: 55px;
background: url(nativity/manger.png) no-repeat top left;
}

#jesus {
position:absolute;
left:680px;
top:810px; 
z-index: 21; 
width: 72px; 
height: 29px;
background: url(nativity/jesus.png) no-repeat top left;
}

#spider {
position:absolute;
left:475px;
top:750px; 
z-index: 22; 
width: 73px; 
height: 58px;
background: url(nativity/spider.png) no-repeat top left;
}



/* NEW!!!! decorate the tree */

#tree {
float: right;
width:450px; 
height:650px; 
z-index:1;
overflow:visible;
background: url("tree/treeblank.gif") no-repeat top left;
}

#candle-blue { 
position:absolute;
left:250px;
top:300px;
z-index: 10; 
width: 48px; 
height: 48px;
background: url(tree/candle-blue.png) no-repeat top left;
}

#candle-green { 
position:absolute;
left:295px;
top:300px;
z-index: 10; 
width: 48px; 
height: 48px;
background: url(tree/candle-green.png) no-repeat top left;
}

#candle-red { 
position:absolute;
left:340px;
top:300px;
z-index: 10; 
width: 48px; 
height: 48px;
background: url(tree/candle-red.png) no-repeat top left;
}

#candle-grey { 
position:absolute;
left:385px;
top:300px;
z-index: 10; 
width: 48px; 
height: 48px;
background: url(tree/candle-grey.png) no-repeat top left;
}

#star { 
position:absolute;
left:435px;
top:300px;
z-index: 10; 
width: 48px; 
height: 48px;
background: url(tree/star.png) no-repeat top left;
}

#light-blue { 
position:absolute;
left:250px;
top:360px;
z-index: 10; 
width: 48px; 
height: 48px;
background: url(tree/light-blue.png) no-repeat top left;
}

#light-green { 
position:absolute;
left:295px;
top:360px;
z-index: 10; 
width: 48px; 
height: 48px;
background: url(tree/light-green.png) no-repeat top left;
}

#light-red { 
position:absolute;
left:340px;
top:360px;
z-index: 10; 
width: 48px; 
height: 48px;
background: url(tree/light-red.png) no-repeat top left;
}

#light-orange { 
position:absolute;
left:385px;
top:360px;
z-index: 10; 
width: 48px; 
height: 48px;
background: url(tree/light-orange.png) no-repeat top left;
}

#light-pink { 
position:absolute;
left:435px;
top:360px;
z-index: 10; 
width: 48px; 
height: 48px;
background: url(tree/light-pink.png) no-repeat top left;
}

#bauble-blue { 
position:absolute;
left:250px;
top:420px;
z-index: 10; 
width: 48px; 
height: 48px;
background: url(tree/bauble-blue.png) no-repeat top left;
}

#bauble-green { 
position:absolute;
left:295px;
top:420px;
z-index: 10; 
width: 48px; 
height: 48px;
background: url(tree/bauble-green.png) no-repeat top left;
}

#bauble-red { 
position:absolute;
left:340px;
top:420px;
z-index: 10; 
width: 48px; 
height: 48px;
background: url(tree/bauble-red.png) no-repeat top left;
}

#bauble-orange { 
position:absolute;
left:385px;
top:420px;
z-index: 10; 
width: 48px; 
height: 48px;
background: url(tree/bauble-orange.png) no-repeat top left;
}

#bauble-pink { 
position:absolute;
left:435px;
top:420px;
z-index: 10; 
width: 48px; 
height: 48px;
background: url(tree/bauble-pink.png) no-repeat top left;
}

#gift-blue { 
position:absolute;
left:250px;
top:480px;
z-index: 10; 
width: 48px; 
height: 48px;
background: url(tree/gift-blue.png) no-repeat top left;
}

#gift-green { 
position:absolute;
left:295px;
top:480px;
z-index: 10; 
width: 48px; 
height: 48px;
background: url(tree/gift-green.png) no-repeat top left;
}

#gift-red { 
position:absolute;
left:340px;
top:480px;
z-index: 10; 
width: 48px; 
height: 48px;
background: url(tree/gift-red.png) no-repeat top left;
}

#gingerbread { 
position:absolute;
left:385px;
top:480px;
z-index: 10; 
width: 48px; 
height: 48px;
background: url(tree/gingerbread.png) no-repeat top left;
}

#snowflake { 
position:absolute;
left:435px;
top:480px;
z-index: 10; 
width: 48px; 
height: 48px;
background: url(tree/snowflake.png) no-repeat top left;
}

/* decorate the tree 

#dectree {
float: right;
width:300px; 
height:450px; 
z-index:1;
overflow:visible;
background: url("dectree/treeblank2.gif") no-repeat top left;
}

#santahat { 
position:absolute;
left:350px;
top:375px;
z-index: 2; 
width: 32px; 
height: 32px;
}

#presentblue {
position:absolute;
left:400px;
top:375px;
z-index: 2; 
width: 32px; 
height: 32px;
}

#presentwhite {
position:absolute;
left:450px;
top:375px;
z-index: 2; 
width: 32px; 
height: 32px;
}

#presentred {
position:absolute;
left:500px;
top:375px; 
z-index: 2; 
width: 32px; 
height: 32px;
}

#holly {
position:absolute;
left:350px;
top:425px; 
z-index: 2; 
width: 32px; 
height: 32px;
}

#candycane {
position:absolute;
left:400px;
top:425px; 
z-index: 2; 
width: 32px; 
height: 32px;
}

#bells {
position:absolute;
left:450px;
top:425px;
z-index: 2; 
width: 32px; 
height: 32px;
}

#stocking {
position:absolute;
left:500px;
top:425px; 
z-index: 2; 
width: 32px; 
height: 32px;
}

#goldstar {
position:absolute;
left:350px;
top:475px; 
z-index: 2; 
width: 32px; 
height: 32px;
}

#silverstar {
position:absolute;
left:400px;
top:475px; 
z-index: 2; 
width: 32px; 
height: 32px;
}

#wreath01 {
position:absolute;
left:450px;
top:475px; 
z-index: 2; 
width: 32px; 
height: 32px;
}

#wreath02 {
position:absolute;
left:500px;
top:475px; 
z-index: 2; 
width: 32px; 
height: 32px;
}

#silvercandle {
position:absolute;
left:350px;
top:525px; 
z-index: 2; 
width: 32px; 
height: 32px;
}

#greencandle {
position:absolute;
left:400px;
top:525px; 
z-index: 2; 
width: 32px; 
height: 32px;
}
 
#redcandle {
position:absolute;
left:450px;
top:525px; 
z-index: 2; 
width: 32px; 
height: 32px;
}

#goldcandle {
position:absolute;
left:500px;
top:525px; 
z-index: 2; 
width: 32px; 
height: 32px;
}

#silverball {
position:absolute;
left:350px;
top:575px; 
z-index: 2; 
width: 32px; 
height: 32px;
}

#purpleball {
position:absolute;
left:400px;
top:575px; 
z-index: 2; 
width: 32px; 
height: 32px;
}

#redball {
position:absolute;
left:450px;
top:575px; 
z-index: 2; 
width: 32px; 
height: 32px;
}

#goldball {
position:absolute;
left:500px;
top:575px; 
z-index: 2; 
width: 32px; 
height: 32px;
}

*/

/* puzzle */

#puzzle {
position: relative;
width: 675px;
border: 0px solid red;
}

#pieces {
width:250px; 
height:450px; 
position: absolute;
top: 0px;
left: 0px; 
border: 0px solid green;
}

#canvas {
width:400px;
height:400px;
background: #a96705;
position: absolute;
top: 0;
right: 0;
z-index:5;
}

#canvasFinal {
width:400px;
height:400px;
float:right;
position:absolute;
display:none;
z-index:9;
text-align: center;
padding-top: 310px;
}

.drag {
margin:0px;
width:100px;
height:100px;
border:0px solid blue;
z-index:10;
}

.droppableP {
width:156px;
height:156px;
border:0px solid aqua;
background-color:transparent;
float:left;
margin:-28px;
z-index:10;
}

.sensible {
margin:27px;
width:100px;
height:100px;
border:0px solid red;
z-index:10;
}

.piece {
z-index:10;
}


/* slider 

#puzzle {
position:absolute; 
left:380px; 
top:250px; 
width:400px; 
height:400px; 
border: 3px solid #40407C;
}

.sortableitem {
float: left;
width: 100px;
height: 100px;
}

.sorthelper {
background-color: #40407C;
float: left;
}

.sortableactive {
background-color: #eee;
}

.sortablehover {
background-color: #eee;
}

#note {
position:absolute; 
left:350px; 
top:250px; 
width:180px; 
z-index:3;
}

*/


/* concentration */

.blk {
width:44px;
height:44px;
overflow:hidden;
}