html, body, form, fieldset, h1, h2, h3, h4, h5, h6, p, pre, blockquote, ul, ol, dl, address {
	margin:0;
	padding:0;
	}
/* Layout Stylesheet */ 

body, .ScreenAlbums a{ 
 background:#000000;
 color: #CCCCCC;
 font:76%/140% Verdana,Arial,Helvetica,sans-serif;
}	 
ul,li {
	list-style-type:none;
}
img{
	border: none;
}
a:link,
a:visited {
	text-decoration:none;
	color:#ffffff;
	}	

/* LEFT BAR */
#ScreenBar{
	margin:0;
	padding:0;
	position: fixed;
	top: 0;
	background-color: #333;
	color: white;	
	z-index:30;
	height: 100%;
}
.Bar_open{
	right:160px;
	width:100%;
}
.Bar_closed{
	width: 250px;
	left:0px;
}

#Bar_visibleArea{
	position:absolute;
	right:0px;
  top:0px;
  height:100%;
	width:250px;
	background: #000000;
	color: #CCCCCC;
}

#Bar_extendedArea{
margin-left: 180px;
margin-top: 20px;	
}

#Bar_extendedArea_navigation{
	width: 600px;
	bottom: 0px;
	position: absolute;
	padding: 20px;
	background:  #000000 url(images/border-tl.gif) no-repeat;
	
}
#Bar_extendedArea_navigation ul li {
	margin-right: 10px;
	font-size:1.2em;
	display:inline;
}
#Bar_extendedArea_navigation ul li a {	
	padding: 6px 3px 6px 28px;
}
#Bar_extendedArea_navigation ul li a:hover {
	color:#FF9900;
}
#Bar_extendedArea_close a , #Bar_visibleArea_gallery a{
	background: transparent url(images/bg-nav-gallery.gif) no-repeat bottom left;
}
#Bar_extendedArea_close a:hover, #Bar_visibleArea_gallery a:hover{
	background: #000000 url(images/bg-nav-gallery.gif) no-repeat bottom left;
}


#Bar_visibleArea_navigation{
	width: 100%;
	bottom: 0px;
	position: absolute;
	background:  #666666 url(images/border-tl.gif) no-repeat top left;
}

#Bar_visibleArea_navigation ul{
	float:left;
	width:200px;
	margin-left: 50px;
	margin-bottom:20px;
	margin-top: 15px;
}

#Bar_visibleArea_navigation ul li {
	font-size:1.2em;
}
#Bar_visibleArea_navigation ul li a {
	display:block;
	padding:6px 3px 6px 28px;

	
}
#Bar_visibleArea_navigation ul li a:hover {
	color:#333333;
}


#Bar_visibleArea_btnPreviousStep a{
	background: transparent url(images/bg-nav-albums.gif) no-repeat bottom left;
}
#Bar_visibleArea_btnPreviousStep a:hover{
	background: #333333 url(images/bg-nav-albums.gif) no-repeat bottom left;
}

#Bar_visibleArea_btnNextStep a{
	background: transparent url(images/bg-nav-basket.gif) no-repeat bottom left;
}

#Bar_visibleArea_btnNextStep a:hover{
	background: #333333 url(images/bg-nav-basket.gif) no-repeat bottom left;
}


#Bar_visibleArea_navigation ul li a:link,
#Bar_visibleArea_navigation ul li a:visited {
	color: #FF9900;
}


.Bar_visibleArea h2{
	color:#CCC;
	letter-spacing:-1px;
	font: normal 24px/26px "Century Gothic","Trebuchet MS",Arial,Helvetica,sans-serif;
}

#Bar_visibleArea_logo{
	width: 250px;
	height: 156px;
	background: #000000 url(images/border-bl.gif) no-repeat bottom left;
	
	
}
#Bar_visibleArea_logo table{
	margin-top: 0px;
	margin-left: 0px;
	width: 250px;
	height: 130px;
	text-align:center;
	vertical-align:middle;
	background: #000000;
}


#Bar_extendedArea_pricesArea{
	position: absolute;
	top: 20px;
	background:black;
	opacity: 0.9;
	z-index: 100;
	width: 550px;
	height: 250px;
	
}


.Bar_visibleArea table{
	background-color: #000000;
	width: 245px;
}

.Bar_visibleArea_tableHeader{
	background: #000000;
	color:#CCC;
	letter-spacing:-1px;
	font: normal 16px/18px "Century Gothic","Trebuchet MS",Arial,Helvetica,sans-serif;
}

#Bar_visibleArea_tableQty{
	width:30px;
}
#Bar_visibleArea_tableDesc{
	width: 300px;
}
#Bar_visibleArea_tablePrice{
	text-align:right;
}

#Bar_visibleArea_clearButton{
	margin-top: 3px;
}
#Bar_visibleArea_clearButton a{
	background: transparent url(images/cross.gif) no-repeat 0 0;
	padding-left: 20px;
	color: #FF9900;
	
}

#Bar_visibleArea_basketUpdatedMsg{
	color: #FFFFFF;
}

/* SELECT ALBUM SCREEN */
#ScreenAlbums{
	top:0;left:0;
	position:absolute;
	z-index:50;
	background-color: #000000;
	width:100%;
	height:100%;
}

#AlbumsArea{
	margin: 50px 100px;
}

#Albums_logo{
	float: left;
	width: 220px;
	height: 156px;
	background: transparent url(images/logo-frame.gif)  no-repeat;
	
	margin: 0 20px 0 0;
}

#Albums_logo table{
	margin-top: 15px;
	margin-left: 15px;
	width: 184px;
	height: 122px;
	text-align:center;
	vertical-align:middle;
}

#Albums_topText{
	width: 100%;
	font: normal 24px/30px "Century Gothic","Trebuchet MS",Arial,Helvetica,sans-serif;
	color: #CCCCCC;
}

#Albums_main{
	margin: 20px 0 0 0;
	background-color: #999999;
	padding: 0px 0px 50px 0px;
	
}
#Albums_mainTL{
	
	width: 12px;
	height: 12px;
	background: url(images/main-tl.gif) 0 0 no-repeat;
}
#Albums_mainBR{
	float:right;
	width: 12px;
	height: 12px;
	background: url(images/main-br.gif) 100% 0 no-repeat;
	margin-top: 41px;
}
#Albums_mainHeader{
	margin: 20px 0px 0 20px;
	font: normal 48px/52px "Century Gothic","Trebuchet MS",Arial,Helvetica,sans-serif;
	color: #FFFFFF;
}
#Albums_mainText{
	font: normal 12px/14px "Century Gothic","Trebuchet MS",Arial,Helvetica,sans-serif;
	color: #FFFFFF;
	margin:5px 20px 15px 20px;
}
.Albums_foldername{
	font: normal 24px/26px "Century Gothic","Trebuchet MS",Arial,Helvetica,sans-serif;
	color: #CCCCCC;
	margin:20px 0px 0px 0px;
	
}

div .Albums_imgFrame {
	width:135px;
	height: 135px;
	padding-right: 30px;
	padding-bottom: 30px;
	background: url(../theme/images/pic-frame.gif) no-repeat top left;
	cursor: pointer;
}
.Albums_imgFrame table {
	
	margin-top: 9px;
	margin-left: 9px;
	width: 130px;
	height: 130px;
	text-align:center;
	vertical-align:middle;
}

#Albums_list{
	margin-left: auto;
	margin-right: auto;
}

.Albums_image{
	cursor: pointer;
}

/* GALLERY SCREEN */
#ScreenGallery{
	position: absolute;
	margin: 0 0 0 0;
	padding: 0 0 0 0px;
  left:0px; top:0px;
  width:100%;
  height:100%;
	z-index:20;
	background:#000000;
	overflow:auto;
}
.Gallery_closed{
	padding-right: 50px;
	padding-left: 305px;
}
.Gallery_open{
	position:absolute;
	padding:0px;
	margin:0px;
	width: 167px;
	right: 0px;
}

.Gallery_imageFrame{
	float:left;
	text-align:center;
	cursor: pointer;
	margin: 30px 0px 0px 30px;
	border: none;
	background: #666666;
}

.Gallery_imageFrame-hover{
 background: #CCCCCC;
}

/* Basket Screen -----------------------------*/
#ScreenBasket{
	font:76%/140% Verdana,Arial,Helvetica,sans-serif;
	position:absolute;
	top: 0; left: 0;
	margin: 0 0 0 0;
  width:100%;
  height:100%;
	z-index:0;
	overflow:auto;
}
#BasketArea{
	top:0px;
	left:0px;
	margin:0px;
	background:#000000;
	width:100%;
}
#Basket_page{
	margin-top: 50px;
	margin-left:255px;
	margin-right: 20px;
	
	padding: 20px;
	background-color: #666;
}

.ScreenBasket h2{
	color:#CCC;
	letter-spacing:-1px;
	font: normal 24px/26px "Century Gothic","Trebuchet MS",Arial,Helvetica,sans-serif;
	
}

.ScreenBasket .picture{
	border: 4px #000000 solid;
}

.Basket_productPreHeader{
	color: #000000;
}


.Basket_productHeader{
	background: #000000;
	color:#CCC;
	letter-spacing:-1px;
	font: normal 16px/18px "Century Gothic","Trebuchet MS",Arial,Helvetica,sans-serif;
}

#BasketArea ul li {
	margin-right: 10px;
	font-size:1.2em;
}
#BasketArea ul li a {	
	padding: 6px 3px 0px 20px;
}
#BasketArea ul li a:hover {
	color:#FF9900;
}

#BasketArea a{
	background: transparent url(images/cross.gif) no-repeat bottom left;
}

Basket_Buttons ul li{
	display:inline;
}


/* FORMS ---------------------------------------*/
.Basket_input{
	border:1px solid #FF9900;
	margin-right:5px;
}

/*Buttons --------------------------------------*/
.Button{

	width:85px;
	height: 34px;
	
}
.PaymentButton{
	cursor: pointer;
}

.Button_left{
	cursor: pointer;
	width:6px;
	height: 34px;
	background-image: url(images/button-green-left.gif);
	background-repeat: no-repeat;
	margin:0;
	padding:0;
} 

.Button_center{
	cursor: pointer;
	background-image: url(images/button-green-center.gif);
	background-repeat: repeat-x;
	margin:0;
	padding:0 2px 0 2px;
}

.Button_content{
	cursor: pointer;
	font-weight:bold;
	color: white;
	margin:0;
	padding:0;
}

.Button_right{
	cursor: pointer;
	width:6px;
	height: 34px;
	background-image: url(images/button-green-right.gif);
	background-repeat: no-repeat;
	margin: 0;
	padding:0;

}

/* PLUGINS */
/* spinbutton --------------------------*/
INPUT.spin-button {
	padding-right:20px;					/* Padding pevents text from covering the up/dn img. Works better in Firefox but also causes textbox to widen by 20px. Arrows can go wonky in IE when text is too long. Perhaps it could be fixed with script that monitored the horiz-scroll position? */
	background-repeat:no-repeat;		/* Warning: Img may disappear in Firefox if you use 'background-attachment:fixed' ! */
	background-position:100% 0%;
	background-image:url(images/spinbtn_updn.gif);
	width: 20px;
}

INPUT.spin-button.up {					/* Change button img when mouse is over the UP-arrow */
	cursor:pointer;
	background-position:100% -18px;		/* 18px matches height of 2 visible buttons */
}
INPUT.spin-button.down {				/* Change button img when mouse is over the DOWN-arrow */
	cursor:pointer;
	background-position:100% -36px;		/* 36px matches height of 2x2 visible buttons */
}

/*hovertip -----------------------------*/
.hovertip, .clicktip {
    display: none; /* in case javascript is disabled */
		background-color: #333;
		border-color: #CCC;
		border:solid 1px #CCC;
		color: #CCC;
		z-index: 1000;
    /* you can add additional style attributes here */
}
.hovertip-caption{
	background: #333333;
	color: #CCC;
	margin: 1px;
	padding: 0 3px 0 3px;
	text-align: center;
}
.hovertipAnchor{
	cursor:pointer;
}
/* dialogs ------------------------------*/
.dialogYesNo, .dialogError, .dialogYes{
	border: solid 2px #333333;
	color: #CCCCCC;
	background: #666666;
  padding:30px;
	
}

.dialogYesNo  h1, .dialogError h1, .dialogYes h1{
	color:#CCCCCC;
	letter-spacing:-1px;
	font: normal 24px/26px "Century Gothic","Trebuchet MS",Arial,Helvetica,sans-serif;
	margin-bottom: 10px;
	text-align: left;
	
}

.dialogYesNo p, .dialogError p, .dialogYes p{
	color:#CCCCCC;
	font:76%/140% Verdana,Arial,Helvetica,sans-serif;
	margin-bottom: 10px;
	text-align: left;
}
/* select boxes --------------------------*/
div.autocomplete {
  position:absolute;
  width:400px;
  background-color:white;
  border:1px solid #ccc;
  margin:0px;
  padding:0px;
  font-size:1em;
  text-align:left;
  max-height:200px;
  overflow:auto;
}
div.autocomplete ul {
  list-style-type:none;
  margin:0px;
  padding:0px;
	color: black;
	display:block;
	
}
div.autocomplete ul li.selected { 
  background-color: #FFFFFF;
}
div.autocomplete ul li {
  list-style-type:none;
  display:block;
  margin:0;
  padding:2px;
  cursor:pointer;
	
}
.Basket_combo
{
	margin:0px;
	/*font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size:1.8em;*/
	width : 10em; 
	display : block;
	text-align:left; 
	background: url(images/bg_select.jpg) right;
	height:18px;
	cursor: pointer;
	border:1px solid #ccc;
	/*color:#999;*/
}



div.comboOptions {
  position:absolute;
  background-color:white;
  border:1px solid #ccc;
  margin:0px;
  padding:0px;
  font-size:0.8em;
  text-align:left;
  max-height:200px;
  overflow:auto;
}
div.comboOptions ul {
	
  list-style-type:none;
  margin:0px;
  padding:0px;
}
.lihover { 
  background-color: #ffffff;
}
div.comboOptions ul li {
  list-style-type:none;
  display:block;
  margin:0;
  padding:2px;
  cursor:pointer;
}