html { height:100%; font-family:  Verdana, Lucida, Arial; font-size: 11px }
body { height:100%; margin:0; padding:0 }

a img { border: 0px }
a { text-decoration: none; color: #ff00ff }

#bodybg { position: fixed; z-index: 0; top: 0px; left: 0px; width: 100%; height: 100% }

#bodycontent { 
  position: absolute; z-index: 1; top: 0px; left: 0px; color: #ffffff; text-align: center; 
  color: #cc9966
}

#wrapper { position: relative; width: 760px; height: 560px; margin: 0px auto; text-align: left; padding-top: 20px; }

img#imglogo { 
  position: absolute; left: 25px; top: 10px;
  width: 220px; height: 41px; 
  background-image: url('images/xttras-logo.png'); 
}

#logo { position: absolute; left: 2px; top: 10px; width: 365px; height: 50px; x-border: 1px solid white }
#menu { position: absolute; left: 400px; top: 23px; width: 365px; height: 50px; x-border: 1px solid white }
#leftpanel { position: absolute; left: 5px; top: 90px; width: 365px; height: 470px; x-border: 1px solid white }
#rightpanel { position: absolute; left: 400px; top: 90px; width: 365px; height: 470px; x-border: 1px solid white; overflow-y: auto; padding-right: 10px  }
#panelsep { position: absolute; left: 385px; top: 90px; width: 10px; height: 470px }
#contactbox { position: absolute; left: 260px; width: 130px; top: 23px; height: 100px; font-size: 13px; font-weight: bold; color: #ffccaa; line-height: 1.5; x-display: none }
#disclaimer { position: absolute; left: 10px; top: 590px; right: 10px; bottom: 0px; font-size: 9px; color: #bb8844 }

#rightpanel {
 scrollbar-face-color: #cc9966;
 scrollbar-shadow-color: #FFFFFF;
 scrollbar-highlight-color: #6F4709;
 scrollbar-3dlight-color:#000000;
 scrollbar-darkshadow-color: #6F4709;
 scrollbar-track-color: #FFE8C1;
 scrollbar-arrow-color: #000000;
}

#contactbox #imgphone { 
  width: 28px; height: 28px; margin-left: 0px; margin-right: 2px;
  background-image: url('images/icon-phone.png'); vertical-align: middle 
}

img#imgpanelsep { width: 1px; height: 100%; background-image: url('images/panelsep.jpg') } 

.panelcaption { font-size: 22px; color: #f6a636; padding-bottom: 10px; letter-spacing: -0.1ex }
.panelcaption .highlight { color: #cc5533 }

.sectioncaption { font-size: 16px; color: red; padding-bottom: 5px; padding-top: 5px; letter-spacing: -0.1ex }
#leftpanel .sectioncaption { text-align: right; margin-right: 10px }

.xkw { x-font-weight: bold; color: #ffddaa }

.para { padding-top: 5px; padding-bottom: 0px }
.para .caption { font-size: 12px; font-weight: bold; padding-bottom: 5px; color: #ffdd99 }
.para .content { padding-top: 5px; padding-bottom: 5px; line-height: 1.3 }

.para a { font-weight: bold; color: #ffcc88 }
.para a:hover { color: #ffeecc }

#leftpanel .para { text-align: right }

.att { font-size: 14px; font-weight: bold; color: #ffccaa; padding-top: 5px; padding-bottom: 10px; text-align: center }

.menubutton { position: relative; height: 40px; width: 90px;  }
.menubutton .bg { 
  width: 100%; height: 100%; z-index: 2;
  background-image: url('images/menubutton.jpg');
}
.menubutton .caption { 
  font-family: Arial;
  position: absolute; left: 5px; top: 11px; right: 5px; bottom: 5px; z-index: 3; 
  cursor: hand;
  font-size: 14px; 
  xletter-spacing: -0.1ex; color: #ffffff; text-align: center;
}
.menubutton a .caption { 
  color: #ffaa88; 
}
.menubutton a:hover .bg { background-image: url('images/menubutton-active.jpg'); }
.menubutton a:hover .caption { color: #ffffff }

.menubutton#mbhome { xwidth: 120px }

.menubutton#mbhome { position: absolute; left: 0px; top: 0px }
.menubutton#mbpackages { position: absolute; left: 95px; top: 0px }
.menubutton#mbgallery { position: absolute; left: 190px; top: 0px }
.menubutton#mbcontact { position: absolute; left: 285px; top: 0px }


.menuitem { position: relative; width: 365px; height: 102px; padding-bottom: 20px; x-border: 1px solid white }

.menuitem .caption { 
  position: absolute; left: 0px; top: 5px; right: 130px; bottom: 20px;
  color: #ffcc99; font-size: 11px; font-weight: bold; text-align: right; 
}
.menuitem a .caption { cursor: hand }
.menuitem .desc { 
  position: absolute; left: 0px; top: 30px; right: 130px; bottom: 0px;
  color: #cc9977; text-align: right;
}
.menuitem a .desc { cursor: hand }
.menuitem .pic { position: absolute; left: 245px; top: 0px; width: 120px; height: 99px; z-order: 4 }
.menuitem .overlay { position: absolute; left: 245px; top: 0px; width: 120px; height: 99px; z-order: 5 }

.menuitem a:hover .caption { color: #ffffff }
.menuitem a:hover .desc { color: #ffeebb }
.menuitem a:hover .overlay { background-image: url('images/menupic-highlight.png'); }

.menuitem#lmifountains .pic { background-image: url('images/menupic-fountain.png'); }
.menuitem#lmismoochies .pic { background-image: url('images/menupic-smoochies.png'); }
.menuitem#lmifullservice .pic { background-image: url('images/menupic-fullservice.png'); }
.menuitem#lmiextras .pic { background-image: url('images/menupic-extras.png'); }
.menuitem#lmiclients .pic { background-image: url('images/menupic-clients.png'); }

table#contactform { margin-top: 15px; margin-bottom: 15px }
table#contactform td { padding-top: 2px }
table#contactform td.caption { 
  text-align: right; padding-left: 10px; vertical-align: top
}
table#contactform td.field input,
table#contactform td.field textarea,
 { 
  font-size: 10px; 
  color: #ffffff;
  background-color: #442211; border: 1px solid #f0a030;
  margin-left: 10px; width: 230px
}
table#contactform td.field textarea {
  height: 100px; font-size: 11px;
}

FORM.contactform { }
FORM.contactform input.reset, 
FORM.contactform input.submit { 
  font-size: 11px; border: 0px; margin: 0px; margin-top: -10px; padding: 2px 6px 2px 6px; 
  background-color: #442211; border: 1px solid #f0a030; color: #cc9966; cursor: hand;
}

FORM.contactform input.submit { position: absolute; left: 128px; width: 100px }
FORM.contactform input.reset { position: absolute; right: 0px; width: 50px }
FORM.contactform input:hover { color: #ffffff }


ul.contacts { margin: 5px; margin-left: 0px }
ul.contacts li { padding-top: 5px }
ul.contacts a { color: #ffcc88 }

ul.faq { margin: 5px; margin-left: 0px }
ul.faq li { padding-top: 5px; padding-bottom: 20px }
ul.faq li .question { font-weight: bold; color: #ffcc99; padding-bottom: 5px }
ul.faq li a { color: #ffcc88 }

ul.plan { margin-top: 10px }
ul.plan a { color: #ffcc88 }
ul.plan a:hover { color: #ffffff }

ul.clientlist { margin-top: 10px }
ul.clientlist li { margin-top: 1px }
ul.clientlist li a { font-weight: normal }

a:hover img#picfountain { border: 1px solid white }

img#picfountain { 
  width: 340px; height: 205px; 
  background-position-y: -35px; margin-left: 10px; background-image: url('images/pic-fountain4.jpg'); 
  border: 1px solid #ffcc99; border-right: 1px solid #000000
}

img#picfountain2 {
  width: 122px; height: 170px; 
  float: right; margin-left: 5px; border: 1px solid white;
  background-image: url('images/pic-fountain3.jpg');
}

img#picdippedstrawberry {
  width: 122px; height: 145px; 
  float: right; margin-left: 5px; border: 1px solid white;
  background-image: url('images/pic-dippedstrawberry.jpg');
}

img#pichersheykisses {
  width: 110px; height: 125px; 
  float: right; margin-left: 5px; margin-top: 4px; border: 1px solid white;
  background-image: url('images/pic-hersheykisses.jpg');
}

img#picdippedstrawberrybubble {
  width: 120px; height: 99px; 
  float: right; margin-left: 5px; 
  background-image: url('images/menupic-dippedstrawberry.png');
}

img#picdippables {
  width: 120px; height: 99px; 
  float: right; margin-left: 5px; 
  background-image: url('images/menupic-dippables.png');
}

img#picarch {
  width: 360px; height: 205px; 
  margin-top: 3px;
  background-image: url('images/pic-arch.jpg');
  border: 1px solid white
}

img#picchampagnebottle {
  width: 112px; height: 300px; margin-top: 4px;
  float: right; margin-left: 5px; 
  background-image: url('images/pic-champagnebottle.jpg'); 
  border: 1px solid white
}

img#picfullservice {
  width: 360px; height: 222px; 
  background-image: url('images/pic-fullservice.jpg'); 
  border: 1px solid white
}

img#picclients {
  width: 360px; height: 85px; 
  background-image: url('images/pic-service.jpg'); 
  border: 1px solid white
}

TABLE.imagelist td img { width: 110px; height: 110px; display: block; margin: 2px; border: 1px solid white }
TABLE.imagelist td { text-align: center }
TABLE.imagelist td a { color: #ffffff }

img#picphotofountain1 {
  background-image: url('images/photo-fountain1-small.jpg');
}
img#picphotofountain2 {
  background-image: url('images/photo-fountain2-small.jpg');
}

TABLE.imagegrid { margin-top: 10px; border-collapse: collapse }

TABLE.imagegrid#smoochies { margin-top: 5px; border-collapse: collapse; }
TABLE.imagegrid#smoochies td { padding-top: 5px; padding-right: 5px }
TABLE.imagegrid#smoochies img { width: 160px; height: 125px; border: 1px solid #ffcc88 }

img#smoochies1 { background-image: url('images/pic-smoochies1.jpg') }
img#smoochies2 { background-image: url('images/pic-smoochies2.jpg') }
img#smoochies3 { background-image: url('images/pic-smoochies3.jpg') }
img#smoochies4 { background-image: url('images/pic-smoochies4.jpg') }

img#picchocolate { 
  width: 360px; height: 190px; 
  background-image: url('images/pic-chocolate.jpg');
  border: 1px solid white;
}

TABLE.clientpics { border-collapse: collapse  }

TABLE.clientpics IMG { 
  width: 110px; height: 90px; margin-right: 3px;
  border: 1px solid white;
}

img#picclientsdanza { 
  background-image: url('images/pic-client-danza.jpg');
}
img#picclientsjoli { 
  background-image: url('images/pic-client-joli.jpg');
}
img#picclientsapprentice { 
  background-image: url('images/pic-client-apprentice.jpg');
}

.para#thankyou { text-align: left }

TABLE.null { border-collapse: collapse; border-spacing: 0; }
TABLE.null td, th { padding: 0; }

TABLE.contacts { margin-left: -10px }
TABLE.contacts TD#img { padding-right: 4px }