/* global */
html{height: 100%;}

body
{ font-family: arial, sans-serif;
  padding: 0px;
  margin: 0px;
  font-size: .78em;
}

p
{ margin: 0px;
  padding: 0px 0px 16px 0px;
  line-height: 1.7em;
}

h1
{ font-family: serif;
  font-size: 108%;
  letter-spacing: .1em;
}

h2
{ margin: 0px;
  padding: 0px 0px 4px 0px;
  font-size: 100%;
  letter-spacing: .1em;
  font-weight: normal;
  text-decoration: underline;
}

img{border: 0px;}

a{outline: none;}

/* image positioning - left, right and center */
.left
{ float: left; 
  padding: 0px 8px 0px 0px;
  margin-left: 8px;
}

.right
{ float: right; 
  padding: 0px 0px 0px 8px;
}

.center
{ display: block;
  text-align: center;
  margin: 0 auto;
}

/* block quote */
blockquote
{ margin: 20px 0px 20px 0px; 
  padding: 10px 20px 0px 20px;
  border-left: 8px solid;
}

/* unordered list */
ul
{ margin: 8px 0px 0px 16px;
  padding: 0px;
}

ul li
{ list-style-type: square;
  margin: 0px 0px 11px 0px; 
  padding: 0px;
}

/* ordered list */
ol
{ margin: 8px 0px 0px 24px;
  padding: 0px;
}

ol li
{ margin: 0px 0px 11px 0px; 
  padding: 0px;
}

/* margin lefts / margin rights - to centre content. margin top / margin bottom - to get it more alive */
#main, #links, #footer, #logo, #menu #content
{ margin-left: auto; 
  margin-right: auto;
  margin-top: 9px;
}

/* main container */
#main{
  width: 850px
}

/* header */
#header
{ width: 850px;
  height: 157px;
}
button {
  cursor:pointer;
}
#header {
 position:relative;
}
#header a, #header a:visited, #header a:hover,#header a:link { 
 text-decoration: none;
 color: #ff8;
 font-weight:bold;
}
#jlLogin, #jlReset, #jlActivate, #jlUser{
  position:absolute;
  right:0;
  bottom:0;
  text-align:right;
  float:right;
  font-family: tahoma,arial,helvetica;
  font-size: 10px

}
#header input, #header select {
  background: 000;
/*  height:14px;*/
  width:65px;
  color: #ff8;
  border: 1px #fff solid;
  font-family: tahoma,arial,helvetica;
  font-size: 9px;
  padding-top: 0pt;
  padding-right: 0pt;
  padding-bottom: 0pt;
  padding-left: 0pt;

}
#header button {
  font-size: 8pt;
  width:auto;
  border:0;
 color: #ff8;
 font-weight:bold;
  background: #000;
  font-family: tahoma,arial,helvetica;
  font-size: 9px;
}
#header fieldset {
  border:0;
  padding:0;
  margin-bottom:5px;
}
#header p {
padding:0; margin:0;
}

/* logo */
#logo
{ padding: 2px 0px 0px 0px;
  float: left;
  margin: 15px 0px 0px 15px;
  height: 125px;
}

#address
{ 
  padding: 0px 0px 0px 0px;
  float: right;
  text-align: right;
  margin: 15px 0px 0px 0px;
  height: 115px;
}
.song {
    position:absolute;
    top: -150px;
    width: 100%;
    background: #000 url(../img/tinyskull.png) no-repeat 5px top;
    border:0px solid #900;
    height: 16px;
    overflow:hidden;
    padding: 2px;
    padding-left:5px;
    margin:0 0 0 0;
    cursor: pointer;
}

.firstsong {
    left: 0px;
    top: 0px;
    opacity: 1 !important;
}
.song .playing {
    left: 0px;
    top: 0px;
    height: 16px;
    padding: 2px;
    padding-left:5px;
    margin:0 0 0 0;
    opacity: 1 !important;
    background-color: #010101;
}

.seekbar {
    background: #444;
    height: 4px !important;
    overflow:hidden;
    border: 0px;
    margin:0px;
    padding:0px;
    width: 0%;
    cursor: pointer;
}

.position {
    background: #fc0;
    left:0px;
    padding:0px;
    margin:0px;
    position: relative;
    width: 4px;
    height: 4px;
    overflow:hidden;
}

.song h5 {
    font-family: arial,tahoma,verdana;
    font-weight: normal;
    font-size: 9px;
    color: #FFF;
    margin: 0;
    margin-left: 22px;
    width: 140px;
    cursor: pointer;
}

#plink {
  font-family: arial,tahoma,verdana;
  font-weight: normal;
  font-size: 9px;
  right: 0px;  
  position:absolute;
  width: auto;
  height: 15px;
}
#controls {
  z-index:1;
  position:absolute;
  width: 135px;
  left:5px;
  top: 20px;
  height: auto;
  padding:0;
  margin:0;
}
#mpmini { 
  float:right;
  position:relative;
  right: 0px;
  width: 150px;
  height: auto;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
}
#next {
  left: 15px;  
  position:absolute;
  overflow:hidden; 
  background: url(../img/buts.jpg) no-repeat -16px 0px; 
  text-indent: -5000px;
  width: 11px;
  height: 10px;
}

#stop {
  left:0px;
  position:absolute;
  overflow:hidden; 
  background: url(../img/buts.jpg) no-repeat left top; 
  text-indent: -5000px;
  width: 10px;
  height: 10px;
}
#address p
{ padding: 0px;
  margin: 0px;
}

#logo h1
{ font-family: verdana, arial, sans-serif;
  margin-left: 270px;
  padding: 9px 0px 0px 0px;
  font-size: 250%;
  letter-spacing: .1em;

}

#logo h2
{ font-family: verdana, arial, sans-serif;
  padding: 5px 0px 0px 0px;
  font-size: 120%;
  letter-spacing: .2em;
  text-align: right;
}

/* navigation menu */
#menu{margin: 11px 15px 0px 15px;}

#menu ul
{ height: 38px; 
  margin: 0px auto;
} 

#menu li
{ float: left; 
  margin: 0px 0px 0px 0px; 
  padding: 0px;
  list-style: none;
} 

#links
{ float: right; 
  width: 100px;
  text-align: right;
  padding: 0px 18px 0px 0px;
}

/* sidebars */
.sidebar
{ float: left;
  width: 200px;
  padding: 16px 11px 15px 11px;
}

/* sidebar items / links */
.sidebaritem
{ text-align: left;
  width: 196px;
  float: left;
  margin: 0px 4px 11px 4px;
}

.sidebaritem h1, .sidebaritem h2, .sidebaritem p{margin: 0px 10px 0px 10px}

.sidebaritem h1
{ font-weight: normal; padding: 8px 0px 16px 0px;
  text-transform: uppercase;
}

.sidebaritem p
{ line-height: 16px; 
  padding: 0px 0px 8px 0px;
}

.sidebaritem a, .sidebaritem a:hover
{ padding: 0px 0px 2px 14px;
  text-decoration: none;
}

.sbilinks ul{margin: 0px 0px 18px 10px;}

.sbilinks li
{ list-style: none; 
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 5px 0px;
}

.sbilinks li a, .sbilinks li a:hover
{ height: 16px;
  text-decoration: none; 
  width: 149px;
} 

/* page content (centre) */
#content
{ 
  width: 402px;
  float: left;
  margin-top: 16px; margin-bottom: 16px;
  padding: 0px 0px 0px 0px; 
}

.contentitem p
{ padding: 10px 9px 10px 9px;
}

.merchitem p
{ line-height: 10px;
}

.contentitem h2
{ padding: 26px 9px 15px 9px;
}

.contentitem h3
{ padding-left: 9px;
}

#content h1
{ font-family: arial, sans-serif;
  margin: 5px 0px 12px 0px; 
  font-size: 150%;  
  font-weight: normal;
  text-transform: uppercase;
  padding: 26px 9px 15px 9px;
  text-align: center;
}

#content a, #content a:hover
{ padding: 0px 0px 2px 0px;
  text-decoration: none;
}

/* footer */
#footer
{ height: 84px;  
  padding: 0px 0px 10px 0px;
  font-size: 80%;
  text-transform: uppercase;
  font-family: verdana, arial, sans-serif;
  clear: both;
  text-align: center; 
  margin: 14px 15px 15px 15px;
}

.footeritem
{ padding: 18px 0px 55px 0px;
}

#footer a
{ text-decoration: none;
  padding: 0px 0px 2px 0px;
  border-bottom: 1px dashed;
}

#footer a:hover
{ text-decoration: none;
  padding: 0px 0px 2px 0px;
  border-bottom: 1px solid;
}


/* Based on Nifty Corners: rounded corners without images */
/* By Alessandro Fulciniti */
/* http://www.html.it/articoli/nifty/index.html */
.rtop, .rbottom{display: block;}

.rtop .r1, .rtop .r2, .rtop .r3, .rtop .r4, .rtop2 .r5, .rtop2 .r6, .rtop2 .r7, .rtop2 .r8,
.rtopmain .r11, .rtopmain .r12, .rtopmain .r13, .rtopmain .r14, 
.rbottom .r1, .rbottom .r2, .rbottom .r3, .rbottom .r4, .rbottom2 .r5, .rbottom2 .r6, .rbottom2 .r7, .rbottom2 .r8, 
.rbottommain .r11, .rbottommain .r12, .rbottommain .r13, .rbottommain .r14 
{ display: block;
  height: 1px;
  overflow: hidden; 
}

.r1{margin: 0 5px}

.r2{margin: 0 3px}

.r3{margin: 0 2px}

.r5{margin: 0 5px}

.r6{margin: 0 3px}

.r7{margin: 0 2px}

.r11{margin: 0 5px}

.r12{margin: 0 3px}

.r13{margin: 0 2px}

.rtop .r4, .rbottom .r4, .rtop2 .r8, .rbottom2 .r8, .rtopmain .r14, .rbottommain .r14
{ margin: 0 1px;
  height: 2px
}
.totaali { font-weight: bold; }
#order_confirm input, #order_confirm label, #order_confirm select
{ margin-left: 9px; }
.shipping { font-weight: bold; }
.Shipped{ border: 2px solid #090; color: #090; }
.pending{ border: #ccc 2px solid; color: #555; }
.Canceled{ border: #f00 2px solid; color: #960000; }
.contentitem li { margin-left: 9px; }
.contentitem fieldset
{ border:0;}
.contentitem input, select
{ margin-bottom: 7px; }
.contentitem label
{font-weight: bold; }
.contentitem textarea
{ margin-bottom: 7px; }
#jlUserProfileForm input, #jlUserProfileForm label, #jlUserProfileForm textarea
{ margin-left: 9px; }
label#userPrivateAgeLabel 
{ padding: 0;
  margin-left: 5px;
}
label#userPrivateEmailLabel
{ padding: 0;
  margin-left: 5px;
}
#jlResetFieldset, #jlResetButtonFieldset {
  text-align: right;
}
#jlResetFieldset p {
  padding:0;
}
.shoop, .shoopcost {
  font-weight: bold;
}
ul.autocompleter-choices
{
	position:				absolute;
	margin:					0;
	padding:				0;
	list-style:				none;
	border:					1px solid #7c7c7c;
	border-left-color:		#c3c3c3;
	border-right-color:		#c3c3c3;
	border-bottom-color:	#ddd;
	background-color:		#fff;
	text-align:				left;
	font-family:			Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 10px;
	z-index:				50;
	color: #000;
	width: auto;
}

ul.autocompleter-choices li
{
	position:				relative;
	width: auto;
	margin:					-2px 0 0 0;
	padding:				0.2em 1.5em 0.2em 1em;
	display:				block;
	float:					none !important; 
	cursor:					pointer;
	font-weight:			normal;
	white-space:			nowrap;
	font-size:				1em;
	line-height:			1.5em;
}

ul.autocompleter-choices li.autocompleter-selected
{
	background-color:		#444;
	color:					#ddd;
}

ul.autocompleter-choices span.autocompleter-queried
{
	color: #333;
	display:				inline;
	float:					none;
	font-weight:			bold;
	margin:					0;
	padding:				0;
}

ul.autocompleter-choices li.autocompleter-selected span.autocompleter-queried
{
	color:	#9FCFFF;
}
