/*----------------------------------------------------------------------------------------------------- Roll Over */
#rolloverFX { opacity:.50;filter:alpha(opacity=80, style=0) }
a:hover #rolloverFX{ opacity:1;filter:alpha(opacity=100) }

#rolloverFX2 { opacity:1;filter:alpha(opacity=100) }
a:hover #rolloverFX2 { opacity:.50;filter:alpha(opacity=80, style=0) }

/*----------------------------------------------------------------------------------------------------- Scroll Bar */
.scroll {
overflow-y:auto;
overflow-x:hidden;
width:100px; 
height:100px;
padding: 10px;
overflow:-moz-auto-horizontal;
}

/*----------------------------------------------------------------------------------------------------- Tabber--*/

/* $Id: example.css,v 1.5 2006/03/27 02:44:36 pat Exp $ */

/*--------------------------------------------------
  REQUIRED to hide the non-active tab content.
  But do not hide them in the print stylesheet!
  --------------------------------------------------*/
.tabberlive .tabbertabhide {
 display:none;
}

/*--------------------------------------------------
  .tabber = before the tabber interface is set up
  .tabberlive = after the tabber interface is set up
  --------------------------------------------------*/
.tabber {
}
.tabberlive {
 margin-top:1em;
}

/*--------------------------------------------------
  ul.tabbernav = the tab navigation list
  li.tabberactive = the active tab
  --------------------------------------------------*/
ul.tabbernav
{
 margin:0;
 padding: 3px 0;
 border-bottom: 1px solid #778;
 font: bold 12px Verdana, sans-serif;
}

ul.tabbernav li
{
 list-style: none;
 margin: 0;
 display: inline;
}

ul.tabbernav li a
{
 padding: 3px 0.5em;
 margin-left: 3px;
 border: 1px solid #778;
 border-bottom: none;
 background: #DDE;
 text-decoration: none;
}

ul.tabbernav li a:link { color: #448; }
ul.tabbernav li a:visited { color: #667; }

ul.tabbernav li a:hover
{
 color: #000;
 background: #AAE;
 border-color: #227;
}

ul.tabbernav li.tabberactive a
{
 background-color: #fff;
 border-bottom: 1px solid #fff;
}

ul.tabbernav li.tabberactive a:hover
{
 color: #000;
 background: white;
 border-bottom: 1px solid white;
}

/*--------------------------------------------------
  .tabbertab = the tab content
  Add style only after the tabber interface is set up (.tabberlive)
  --------------------------------------------------*/
.tabberlive .tabbertab {
 padding:5px;
 border:1px solid #aaa;
 border-top:0;

 /* If you don't want the tab size changing whenever a tab is changed
    you can set a fixed height */

 /* height:200px; */

 /* If you set a fix height set overflow to auto and you will get a
    scrollbar when necessary */

 /* overflow:auto; */
}

/* If desired, hide the heading since a heading is provided by the tab */
.tabberlive .tabbertab h2 {
 display:none;
}
.tabberlive .tabbertab h3 {
 display:none;
}

/* Example of using an ID to set different styles for the tabs on the page */
.tabberlive#tab1 {
}
.tabberlive#tab2 {
}
.tabberlive#tab2 .tabbertab {
 height:200px;
 overflow:auto;
}



/*----------------------------------------------------------------------------------------------------- Validation Advice */
.validation-advice
{
font-family:Arial;
font-size:9px;
font-style:italic;
color:#FF0000;
display:inline;
}


/*----------------------------------------------------------------------------------------------------- Menu */
.menu{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000000;
}

.menu_items{
	font-family: Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size: 15px;
	color: #000000;
	text-decoration:none;
}

.menu_items a:hover {
	color: #CCCCCC;
}

/*----------------------------------------------------------------------------------------------------- Bullet */
.bullet {
	list-style-image: url(../images/icons/bullet.gif);
}

/*----------------------------------------------------------------------------------------------------- Shopping cart CSS*/
.greetext  { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px;color: #006600;}
.blacktext { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px;color: #000000;} 
.checkout {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #000000;}
.checkoutinput {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #000000;}   
.nopcart {background: #464444;border: 1px;font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #ffffff;}
.nopheader {background: #464444;font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #FFFFFF;}
.nopentry {background: #FFFFFF;font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #000000;}
.noptotal {background: #FFFFFF;font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #000000;}
.nopbutton {background: #FFFFFF;font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #000000;} 

/*----------------------------------------------------------------------------------------------------- Telly's Background */
.back1 {
	background-image:url(../images/back1.jpg);
	background-repeat: no-repeat;
	background-position: right;
}
.back2 {
	background-image:url(../images/back2.jpg);
	background-repeat: no-repeat;
	background-position: right;
}
.back3 {
	background-image:url(../images/back3.jpg);
	background-repeat: no-repeat;
	background-position: right top;
}
.back4 {
	background-image:url(../images/back4.jpg);
	background-repeat: no-repeat;
	background-position: left;
}
.back5 {
	background-image: url(../images/back5.jpg);
	background-repeat: no-repeat;
	background-position: left;
}
.back6 {
	background-image: url(../images/back6.jpg);
	background-repeat: no-repeat;
	background-position: left;
}
.back_bot {
	background-image: url(../images/back_bot.jpg);
	background-repeat: no-repeat;
	background-position: top;
}



/*----------------------------------------------------------------------------------------------------- BUTTONS - Main */
.buttons a, .buttons button{
    display:block;
    float:left;
    margin:0 7px 0 0;
    background-color:#f5f5f5;
    border:1px solid #dedede;
    border-top:1px solid #eee;
    border-left:1px solid #eee;
    font-family:"Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
    font-size:100%;
    line-height:130%;
    text-decoration:none;
    font-weight:bold;
    color:#565656;
    cursor:pointer;
    padding:5px 10px 6px 7px; /* Links */
}
.buttons button{
    width:auto;
    overflow:visible;
    padding:4px 10px 3px 7px; /* IE6 */
}
.buttons button[type]{
    padding:5px 10px 5px 7px; /* Firefox */
    line-height:17px; /* Safari */
}
*:first-child+html button[type]{
    padding:4px 10px 3px 7px; /* IE7 */
}
.buttons button img, .buttons a img{
    margin:0 3px -3px 0 !important;
    padding:0;
    border:none;
    width:16px;
    height:16px;
}
/* BUTTONS - COLORS - STANDARD */
button:hover, .buttons a:hover{background-color:#dff4ff;border:1px solid #c2e1ef;color:#336699;}
.buttons a:active{background-color:#6299c5;border:1px solid #6299c5;color:#fff;}
/* BUTTONS - COLORS - POSITIVE */
button.positive, .buttons a.positive{color:#529214;}
.buttons a.positive:hover, button.positive:hover{background-color:#E6EFC2;border:1px solid #C6D880;color:#529214;}
.buttons a.positive:active{background-color:#529214;border:1px solid #529214;color:#fff;}
/* BUTTONS - COLORS - NEGATIVE */
.buttons a.negative, button.negative{color:#d12f19;}
.buttons a.negative:hover, button.negative:hover{background:#fbe3e4;border:1px solid #fbc2c4;color:#d12f19;}
.buttons a.negative:active{background-color:#d12f19;border:1px solid #d12f19;color:#fff;}




/*----------------------------------------------------------------------------------------------------- TABS - FLOAT */ 
/* Now with three colors */
#tabs {padding:0; margin:0 0 0 15px; list-style:none;}
#tabs li {display:inline; padding:0; background:#f8f8f8; float:left;/* this float is your problem */ margin-right:35px; position:relative;}
#tabs li.one {width:190px;}
#tabs li.two {width:240px;}
#tabs li.three {width:190px;}
#tabs li a.outer-link {background:#f8f8f8; display:block; width:100%; position:relative;}
#tabs table {border-collapse:collapse; margin:-1px;}
#tabs li b {display:block; background:transparent url(../images/icons/tab_top.gif) no-repeat 0 0; padding:2px 0 0 5px; height:15px; font-size:0.9em; overflow:hidden;}
#tabs li div {border:1px solid #888; border-width:0 1px 1px 1px; padding:20px 5px 5px 5px;}
#tabs li h3 {padding:0; margin:0; font-family:georgia, serif; font-size:17px;}
#tabs li p {font-family:verdana, serif; font-size:11px; line-height:1.5em;}
#tabs li a {color:#000; text-decoration:none;}
#tabs li a.inner-link {color:#c00; text-decoration:none;}
#tabs li a.inner-link:hover {text-decoration:underline; cursor:default;}
#tabs li.one:hover, #tabs li.one a.outer-link:hover {background:#fef;}
#tabs li.two:hover, #tabs li.two a.outer-link:hover {background:#cff;}
#tabs li.three:hover, #tabs li.three a.outer-link:hover {background:#ffc;}


/*----------------------------------------------------------------------------------------------------- TABS - MORE */
.holder {width:210px; margin:5px; padding:5px; border:1px solid #ddd; float:left; background:#f8f8f8;}
.holder h2 {text-align:left;}
a.hid {color:#000; text-decoration:none; outline-style:none; position:relative; z-index:500;}
a.hid em {display:none;}
a.hid:hover {text-decoration:none;}
a.hid:active, a.hid:focus {background:#fff;}
a.hid:active span, a.hid:focus span {display:none;}
a.hid:active em, a.hid:focus em {display:block; background:#f8f8f8; color:#000; width:210px; font-style:normal; cursor:default; padding:5px 5px 20px 5px; position:absolute; left:-6px; top:-5px; border:1px solid #ddd; border-width:0 1px 1px 1px;}
.clear {clear:both;}


/*----------------------------------------------------------------------------------------------------- TOOL TIPS */
a.tooltip b {display:none;}
a.tooltip:hover {border:0; position:relative; z-index:500; text-decoration:none;}
a.tooltip:hover b {display:block; position:absolute; top:20px; left:-25px; padding:5px; font-weight:normal; color:#000; border:1px solid #888; background:#ffc; width:150px;}
a.tooltip:hover b em {position:absolute; left:20px; top:-6px; width:11px; height:6px; background:#fff url(../images/icons/tooltip.gif) 0 0; display:block; font-size:1px;}
.clear {clear:both;}

/*----------------------------------------------------------------------------------------------------- TO CENTER HEIGHT */
 #wrapper {
      margin: 0 auto;
      text-align: left;
      vertical-align: middle;
      width: 400px;
 }

/*----------------------------------------------------------------------------------------------------- DROP SHADOW */
.out {
  display:block; 
  background:#bbb; 
  border:1px solid #ddd; 
  position:relative;
  margin:1em 0;
  }
.in {
  text-align:center; 
  background:#fff; 
  border:1px solid #555; 
  position:relative; 
  padding:5px;
  font-weight:normal;
  }
.ltin {
  left:-5px;
  }
.tpin {
  top:-5px;
  }
.narrow {width:18em;} /* change to suit */
h4 {font-weight:bold; color:#000;}

xhtml