/* BEGIN STYLES FOR ALL BUTTONS */
.buttons ul li > * * {
	display: none; /* hide button text from all but CSS-disabled UAs */
}

.buttons ul li > * {
	background-repeat: no-repeat;
	display: block; /* needed so that width and height will work OK */
	padding-right: 1px; /* allow an extra pixel width, to show the dividing-line (overridden by '.last') */
}
.buttons ul li .last {
	padding-right: 0px; /* remove the extra pixel of width, to hide the dividing-line on the last button */
}

.buttons ul li {
	display: inline; /* hide bullet points and line up buttons in a row */
	float: left;
}

.buttons ul {
	padding: 0px; /* remove the 'ul' element's default indent */
	margin: 0px; /* useful where 'margin-top' is not otherwise defined below */
}
.buttons {
	position: absolute; /* float buttons above other content (absolute, not relative, due to an IE bug) */
	padding: 0px; /* help position the floating elements */
	margin: 0px; /* help position the floating elements */
	width: 700px;
	height: 0px; /* prevent buttons from breaking 'panel' */
}
.narrowPanel .buttons {
	width: 400px; /* special width for forms, popups etc. */
}
/* END STYLES FOR ALL BUTTONS */


/* BEGIN IMAGE-SOURCE DEFINITIONS */
.buttons .h20_ghost_rider li > * {
	height: 20px;
	background-image: url('../images/buttons/buttons_h20_black.png');
}
.buttons .h20_knight_rider li > * {
	height: 20px;
	background-image: url('../images/buttons/buttons_h20_white.png');
}
.buttons .h26_ghost_rider li > * {
	height: 26px;
	background-image: url('../images/buttons/buttons_h26_black.png');
}
.buttons .h26_knight_rider li > * {
	height: 26px;
	background-image: url('../images/buttons/buttons_h26_white.png');
}
/* END IMAGE-SOURCE DEFINITIONS */


/* BEGIN OPACITY SETTINGS */
.buttons .h26_ghost_rider li > *, .buttons .h20_ghost_rider li > * {
	opacity: .5; /* for mozilla, gecko etc */
	filter: alpha(opacity=50); /* for IE */
}
.buttons .h26_ghost_rider li > a:hover, .buttons .h20_ghost_rider li > a:hover {
	opacity: 1;
	filter: alpha(opacity=100);
}
/* END OPACITY SETTINGS */


/* BEGIN POSITIONING 'ghost_rider' BUTTON ELEMENTS */
#tlButtons ul {
	float: left; /* position on the left */
	margin-left: -7px;
	margin-top: -25px;
}
#trButtons ul {
	float: right; /* position on the right */
	margin-right: -10px;
	margin-top: -25px;
}
.narrowPanel #trButtons { /* special spacers for forms, popups etc. */
	margin-top: 2px;
	margin-left: -1px;
}
#blButtons ul {
	float: left;
	margin-left: -10px;
}
.narrowPanel #blButtons { /* special spacers for forms, popups etc. */
	margin-top: 6px;
	margin-left: 3px;
}
#brButtons ul {
	float: right; /* position on the right */
	margin-right: -7px;
}
#fl_buttons {
	position: absolute;
	float: left;
	left: 0px;
}
/* END POSITIONING 'ghost_rider' BUTTON ELEMENTS */


/* BEGIN POSITIONING 'knight_rider' BUTTON ELEMENTS (THESE HAVE A STRIP OF BLACK BEHIND) */
#mlButtons ul {
	float:left;
	margin-top: -35px;

}
#mlButtons ul li { background-color: #000; }
#mlButtons ul li .first { margin-left: 17px; }
#mrButtons ul {
	float: right;
	margin-top: -35px;
	margin-left: 0px;

}
#mrButtons ul li { background-color: #000; }
#mrButtons ul li .last { margin-right: 17px; }
/* END POSITIONING 'knight_rider' BUTTON ELEMENTS */


/* BEGIN STYLES FOR PLAIN-TEXT BUTTONS */
#trButtons .plaintext_ghost_rider {
	margin-top: -21px;
	margin-right: 0px;
}
#trButtons .plaintext_ghost_rider {
	opacity: .5; /* for mozilla, gecko etc */
	filter: alpha(opacity=50); /* for IE */
}
#trButtons .plaintext_ghost_rider:hover {
	opacity: 1 !important; /* for mozilla, gecko etc */
	filter: alpha(opacity=100) !important; /* for IE */
}
#trButtons .plaintext_ghost_rider a {
	color: #000;
	font-style: normal;
	text-decoration: none;
}
#trButtons .plaintext_ghost_rider a:hover {
	color: #f30;
	background-color: transparent !important;
}
/* END STYLES FOR PLAIN-TEXT BUTTONS */


/* BEGIN SLICING 'h26' BUTTONS */
 li a[title="about stormstyle"]        { width: 139px; background-position:    0px   0px; }
 li a[title="about stormstyle"]:hover                { background-position:    0px -26px; }
 li a[title="sign in"]                 { width: 65px;  background-position: -140px   0px; }
 li a[title="sign in"]:hover                         { background-position: -140px -26px; }
 li a[title="register"]                { width: 76px;  background-position: -206px   0px; }
 li a[title="register"]:hover                        { background-position: -206px -26px; }
 li a[title="search"]                  { width: 60px;  background-position: -283px   0px; }
 li a[title="search"]:hover                          { background-position: -283px -26px; }
 li a[title="favourites"]              { width: 85px;  background-position: -344px   0px; }
 li a[title="favourites"]:hover                      { background-position: -344px -26px; }
 li span[title="archive"]              { width: 64px;  background-position: -430px   0px; }
/* li span[title="archive"]:hover                         { background-position: -430px -26px; } */ /* temporarily disabled */
 li a[title="feedback"]                { width: 78px;  background-position: -495px   0px; }
 li a[title="feedback"]:hover                        { background-position: -495px -26px; }
 li a[title="share"]                   { width: 55px;  background-position: -574px   0px; }
 li a[title="share"]:hover                           { background-position: -574px -26px; }
 div[title="bookmark"]                 { width: 145px; background-position: -630px   0px; height: 26px; background-image: url('../images/buttons/buttons_h26_black.png'); opacity: .5; filter: alpha(opacity=50); }
 div[title="bookmark"]:hover                         { background-position: -630px -26px; opacity: 1; filter: alpha(opacity=100); }
 li a[title="contact stormstyle"]      { width: 89px;  background-position: -776px   0px; }
 li a[title="contact stormstyle"]:hover { background-position: -776px -26px; }
/* END SLICING 'h26' BUTTONS */


/* BEGIN SLICING 'h20' BUTTONS */
 li span[title="2008 (c) Storm"]       { width: 101px; background-position:    0px   0px; }
 li a[title="terms & conditions"]      { width: 144px; background-position: -102px   0px; }
 li a[title="terms & conditions"]:hover              { background-position: -102px -20px; }
 li a[title="privacy policy"]          { width: 114px; background-position: -247px   0px; }
 li a[title="privacy policy"]:hover                  { background-position: -247px -20px; }
 li a[title="safety guidelines"]       { width: 137px; background-position: -362px   0px; }
 li a[title="safety guidelines"]:hover               { background-position: -362px -20px; }
 li a[name="comments"]                 { width:  98px; background-position: -500px   0px; } /* note 'name' attribute, as the 'title' will vary */
 li a[name="comments"]:hover                         { background-position: -500px -20px; }
 li a[name="back"]                     { width:  60px; background-position: -599px   0px; } /* note 'name' attribute, as the 'title' will vary */
 li a[name="back"]:hover                             { background-position: -599px -20px; }
 li a[title="more like this"]          { width: 109px; background-position: -660px   0px; }
 li a[title="more like this"]:hover                  { background-position: -660px -20px; }
 li a[title="add to favourites"]       { width: 152px; background-position: -770px   0px; }
 li a[title="add to favourites"]:hover               { background-position: -770px -20px; }
 li a[title="add comment"]             { width: 115px; background-position:-1096px   0px; }
 li a[title="add comment"]:hover                     { background-position:-1096px -20px; }
 li a[title="close window"]            { width: 125px; background-position:-1212px   0px; }
 li a[title="close window"]:hover                    { background-position:-1212px -20px; }
/* END SLICING 'h20' BUTTONS */
