body {border: 1px solid lightblue; margin: 0; padding: 0; 
      background: lightyellow; color: black;}
body.image {margin: 0; padding: 0; background: lightyellow;}
body#banner {position: relative; margin: 0; padding: 0; border: black solid 0px;}
p {text-align: justify; line-height: 18px; margin: 0.5em 0 0.5em 0; padding: 0;}
p.initial:first-letter {font-size: 300%; font-weight: bold; width: 1em; float: left;}
p.initial {vertical-align: top;}
p#james {clear: both;}

p#bannerHeading {margin: 0; padding: 10px; font: bold 400% "Monotype Corsiva", Helvetica, Arial; 
                 color: blue; line-height: 100px; text-align: center;  border: black solid 0px;}
h2.welcome{text-align: center; margin: 0.5em 0 0.5em 0;}
div.mainpage {width: 611px; padding: 0 15px 0 30px;}
div.bannerImages {position: absolute; top: 2px; left: 3px;
                  width: 150px; height: 100px;}

div#sitenav {width: 8em; margin-left: 4px; margin-top: 7px; padding: 0; overflow: hidden;}
div#sitenav a {display: block; text-decoration: none; margin: 2px 0 2px 0; 
               width: 7.5em; color: black; background-color: lightblue;
               padding: 0px 0px 0px 0.5em; overflow: hidden;}
div#sitenav a:hover {background: lightgreen; color: red;}
div#sitenav a.dropMenu1,  div#sitenav a.dropMenu2 {background: lightblue url(eng/arrowDn.gif) 6.5em 50% no-repeat;}
div#sitenav div.level1 a {padding-left: 1em;}
div#sitenav div.level2 a {padding-left: 1.5em;}
div#sitenav a#contact {font-weight: bold;}

a.pageSel {text-decoration: none; color:#000000; margin: 0.1em;}

object#trial {position: absolute; top: 3px; left: 159px;
                width: 638px; height: 100px; margin: 0; padding: 0;
                visibility: visible; 
                overflow: hidden;
                border: red solid 0px;}
				
img#anireindeer3 {float: left;}
div#background {position: absolute; top: 3px; left: 159px;
                width: 638px; height: 100px; margin: 0; padding: 0;
                visibility: visible; 
                overflow: hidden;
                border: red solid 0px;}
div#introBanner {position: absolute; top: 0; left: 0;
                 width: 638px; height: 100px; margin: 0; padding: 0;
                 background-color: white;
                 visibility: visible;
                 z-index: 60;
                 border: blue solid 0px;}
p#pIntroMessage {position: absolute; left: 0; top: 0; 
                 width: 638px; height: 100px; margin: 0; padding: 15px 0 0 0;
                 text-align: center; font: bold 40pt "Monotype Corsiva", Arial, Helvetica;
                 border: green solid 0px;}
div#santa    {position: absolute; top:53; left: 660; visibility: visible; z-index: 40;}
div#SantaBanner {position: absolute; top:53; left: 880; visibility: visible; z-index: 40;}
div#snowloversx1  {position: absolute; top:10; left: 35;  visibility: visible; z-index: 50;}
div#snowloversx2  {position: absolute; top:10; left: 527; visibility: visible; z-index: 50;}
div#treex90x1     {position: absolute; top:15; left: -40; visibility: visible; z-index: 50; }
div#treex90x2     {position: absolute; top:15; left: 610; visibility: visible; z-index: 50; }
div#lefttrees     {position: absolute; top:25; left: -15; visibility: visible; z-index: 30; }
div#righttrees    {position: absolute; top:25; left: 587; visibility: visible; z-index: 30; }
div#reindeerLeft  {position: absolute; top: 35; left: 110; visibility: hidden; z-index: 10;}
div#reindeerRight {position: absolute; top: 35; left: 497; visibility: visible; z-index: 10;}

/* div#welcomePhotosContainer {position: relative; margin: 1em 10px 0 10px; padding: 0; float: right; overflow: hidden;
                            width: 150px; height: 100px;
                            border: rgb(164,135,73) 1px solid;}
div#welcomePhotos {position: absolute; left: 0; top: 0; margin: 0; padding: 0; width: 150px; height: 100px; z-index: 1;} */

h1#children {text-align: center; size: 100%;}
/* h2 {text-align: center}; */
h3, hr {clear: both;}
hr {color: lightblue;}

/* ----------------- Styles for defining single and clusters of images ------------------- */

/* landscape individual image with borders */
img.ls   {width: 150px; height: 100px; border: lightyellow solid 1px; padding: 0; margin: 0;}
img.lsx2 {width: 300px; height: 200px; border: lightyellow solid 1px; padding: 0; margin: 0;}

/* portrait individual image with borders */
img.pt {width: 100px; height: 150px; border: lightyellow solid 1px;}

/* x1 landscape */
div.extraLsx2FloatLeft  {float: left;  width: 302px; height: 202px; margin-right: 0.5em;}
div.extraLsFloatLeft    {float: left;  width: 152px; height: 102px; margin-right: 0.5em;}
div.extraLsFloatRight   {float: right; width: 152px; height: 102px; margin-left:  0.5em;}

/* x1 portrait */
div.extraPtFloatLeft  {float: left;  width: 102px; height: 152px; margin-right: 0.5em;}
div.extraPtFloatRight {float: right; width: 102px; height: 152px; margin-left:  0.5em;}

/* x2 landscape vertical */
div.extraLs2vFloatLeft  {float: left; width: 154px; height: 205px; margin-right: 0.5em;}
div.extraLs2vFloatRight {float: right; width: 154px; height: 205px; margin-left: 0.5em;}
div.intraLs2v {position: relative;}
img.ls2vL1 {position: absolute; top: 0;     left:0; border: lightyellow solid 1px;}
img.ls2vL2 {position: absolute; top: 102px; left:0; border: lightyellow solid 1px;}

/* x2 landscape vertical left x2 landscape vertical right */
div.extraLs2xls2FloatLeft  {float: left;  width: 307px; height: 205px; margin-right: 0.5em;}
div.extraLs2xls2FloatRight {float: right; width: 307px; height: 205px; margin-left:  0.5em;}
div.intraLs2xls2 {position: relative;}
img.ls2xls2L1 {position: absolute; top: 0;     left:0; border: lightyellow solid 1px;}
img.ls2xls2L2 {position: absolute; top: 102px; left:0; border: lightyellow solid 1px;}
img.ls2xls2L3 {position: absolute; top: 0;     left:153px; border: lightyellow solid 1px;}
img.ls2xls2L4 {position: absolute; top: 102px; left:153px; border: lightyellow solid 1px;}

/* x2 portrait vertical left x2 portrait vertical right */
div.extraPt2xpt2FloatLeft  {float: left;  width: 209px; height: 307px; margin-right: 0.5em;}
div.extraPt2xpt2FloatRight {float: right; width: 209px; height: 307px; margin-left:  0.5em;}
div.intraPt2xpt2 {position: relative;}
img.pt2xpt2P1 {position: absolute; top: 0;     left:0; border: lightyellow solid 1px;}
img.pt2xpt2P2 {position: absolute; top: 153px; left:0; border: lightyellow solid 1px;}
img.pt2xpt2P3 {position: absolute; top: 0;     left:104px; border: lightyellow solid 1px;}
img.pt2xpt2P4 {position: absolute; top: 153px; left:104px; border: lightyellow solid 1px;}

/* x3 landscape vertical */
div.extraLs3vFloatLeft  {float: left;  width: 154px; height: 306px; margin-right: 0.5em;}
div.extraLs3vFloatRight {float: right; width: 154px; height: 306px; margin-left:  0.5em;}
div.intraLs3v {position: relative;}
img.ls3vL1 {position: absolute; top: 0;     left:0; border: lightyellow solid 1px;}
img.ls3vL2 {position: absolute; top: 102px; left:0; border: lightyellow solid 1px;}
img.ls3vL3 {position: absolute; top: 204px; left:0; border: lightyellow solid 1px;}

/* x3 landscape vertical left x2 portrait vertical right */
div.extraLs3xpt2FloatLeft  {float: left;  width: 259px; height: 307px; margin-right: 0.5em;}
div.extraLs3xpt2FloatRight {float: right; width: 259px; height: 307px; margin-left:  0.5em;}
div.intraLs3xpt2 {position: relative;}
img.ls3xpt2L1 {position: absolute; top: 0;     left:0; border: lightyellow solid 1px;}
img.ls3xpt2L2 {position: absolute; top: 102px; left:0; border: lightyellow solid 1px;}
img.ls3xpt2L3 {position: absolute; top: 204px; left:0; border: lightyellow solid 1px;}
img.ls3xpt2P1 {position: absolute; top: 0;     left:153px; border: lightyellow solid 1px;}
img.ls3xpt2P2 {position: absolute; top: 153px; left:153px; border: lightyellow solid 1px;}

/* x3 landscape vertical left x2 portrait vertical right x3 landscape vertical right */
div.extraLs3xpt2xls3FloatLeft  {float: left;  width: 411px; height: 307px; margin-right: 0.5em;}
div.extraLs3xpt2xls3FloatRight {float: right; width: 411px; height: 307px; margin-left:  0.5em;}
div.intraLs3xpt2xls3 {position: relative;}
img.ls3xpt2xls3L1 {position: absolute; top: 0;     left:0; border: lightyellow solid 1px;}
img.ls3xpt2xls3L2 {position: absolute; top: 102px; left:0; border: lightyellow solid 1px;}
img.ls3xpt2xls3L3 {position: absolute; top: 204px; left:0; border: lightyellow solid 1px;}
img.ls3xpt2xls3P1 {position: absolute; top: 0;     left:153px; border: lightyellow solid 1px;}
img.ls3xpt2xls3P2 {position: absolute; top: 153px; left:153px; border: lightyellow solid 1px;}
img.ls3xpt2xls3L4 {position: absolute; top: 0;     left:257px; border: lightyellow solid 1px;}
img.ls3xpt2xls3L5 {position: absolute; top: 102px; left:257px; border: lightyellow solid 1px;}
img.ls3xpt2xls3L6 {position: absolute; top: 204px; left:257px; border: lightyellow solid 1px;}

/* x2 portrait vertical left x3 landscape vertical right */
div.extraPt2xls3FloatLeft  {float: left;  width: 259px; height: 307px; margin-right: 0.5em;}
div.extraPt2xls3FloatRight {float: right; width: 259px; height: 307px; margin-left:  0.5em;}
div.intraPt2xls3 {position: relative;}
img.pt2xls3L1 {position: absolute; top: 0;     left:104px; border: lightyellow solid 1px;}
img.pt2xls3L2 {position: absolute; top: 102px; left:104px; border: lightyellow solid 1px;}
img.pt2xls3L3 {position: absolute; top: 204px; left:104px; border: lightyellow solid 1px;}
img.pt2xls3P1 {position: absolute; top: 0;     left:0px; border: lightyellow solid 1px;}
img.pt2xls3P2 {position: absolute; top: 153px; left:0px; border: lightyellow solid 1px;}


/* x3 landscape vertical left x3 landscape vertical right */
div.extraLs3xls3FloatLeft  {float: left;  width: 307px; height: 307px; margin-right: 0.5em;}
div.extraLs3xls3FloatRight {float: right; width: 307px; height: 307px; margin-left:  0.5em;}
div.intraLs3xls3 {position: relative;}
img.ls3xls3L1 {position: absolute; top: 0;     left:0; border: lightyellow solid 1px;}
img.ls3xls3L2 {position: absolute; top: 102px; left:0; border: lightyellow solid 1px;}
img.ls3xls3L3 {position: absolute; top: 204px; left:0; border: lightyellow solid 1px;}
img.ls3xls3L4 {position: absolute; top: 0;     left:153px; border: lightyellow solid 1px;}
img.ls3xls3L5 {position: absolute; top: 102px; left:153px; border: lightyellow solid 1px;}
img.ls3xls3L6 {position: absolute; top: 204px; left:153px; border: lightyellow solid 1px;}
 
/* Magic text */
p.ht{background: lightyellow; color: lightyellow;}

/* Welcome page */
div#welcomePhotosContainer {position: relative; margin: 0 auto 0 auto; padding: 0; overflow: hidden;
                            width: 440px; height: 290px;
                            border: rgb(164,135,73) 5px solid;}
							
div#welcomeWishContainer {position: relative; margin: 0 auto 0 auto; padding: 0; overflow: hidden;
                            width: 460px; height: 327px;
                            border: rgb(164,135,73) 5px solid;}
							
body#bodyWelcome {text-align: center;}
p.bluehot{color: #0000FF;}
p.introWelcome{color: #0000FF; text-align: center;}

div#welcomePhotos1 {position: absolute; left: -5px;   top: -5px; margin: 0; padding: 0; width: 450px; height: 300px; z-index: 10;}
div#welcomePhotos2 {position: absolute; left: 440px;  top: -5px; margin: 0; padding: 0; width: 450px; height: 300px; z-index: 20;}

div#welcomeWishPhoto {position: absolute; left: 0px;   top: 0px; margin: 0; padding: 0; width: 450px; height: 317px; z-index: 10;}

div#star1 {float: left; width: auto; text-align: left;}
div#star2 {float: right; width: auto;text-align: left;}
div#credits {width: 100%; text-align: right;}

table th {color: blue;}
table #mainheading {color:red;}
table td {color:green;}