
/* General text and background colors */
body{ 
 background: #000000;
 color: #FFFFFF;
}	 
/* General links colors */
a:link,
a:visited{
	color:#A1A5A9;
}	

/* FIRST SCREEN: ALBUMS ------------------------------------------------------------*/

#ScreenAlbums{ 
	background-color: #000000;
}
 
/* Logo Area*/
#Albums_logo{
	background-color: #000000;
}

/* Text Next to Logo*/
#Albums_topText{
	color: #36B4CD;
}

/* Area containing albums list*/
#Albums_main{
	background-color: #2C2D2C;
}

/* Header text in area containing albums list*/
#Albums_mainHeader{
	color: #36B4CD;
}
/* Subheader*/
#Albums_mainText{
	color: #FFFFFF;
}

/* Albums name text*/
.Albums_foldername{
	color: #FFFFFF;
}

/* Frames for albums list*/
div .Albums_imgFrame {
	background-color: #000000;
	border-color:#FFFFFF;
	
}

/* Top Left Corner in Area Containing Albums list*/
#Albums_mainTL{
	width: 12px;
	height: 12px;
	/* Rounded corners. If you don't want them remove next line*/
	/*background: url(images/main-tl.gif) 0 0 no-repeat;*/
}
/* Bottom Right Corner*/
#Albums_mainBR{
	width: 12px;
	height: 12px;
	margin-top: 38px;
	/* Rounded corners. If you don't want them remove next line*/
	/*background: url(images/main-br.gif) 100% 0 no-repeat;*/
}


/* BAR ON THE LEFT -------------------------------------------------------- */
/* Has two sections: Visible area and extended Area. Extended is the area visible on its left */
/* when the pictures are enlarged */

#ScreenBar{
	background-color: #000000;
	color: #FFFFFF;	
	border-right: white solid 1px;
}

/* Bar Visible Area (Column containing logo, always visible)---------------------*/
#Bar_visibleArea{
	background-color: #000000;
	color: #FFFFFF;
}
/* "Add or Edit Quantity" Text*/
.Bar_visibleArea h2{
	color:#36B4CD;
}

/* Logo */
#Bar_visibleArea_logo{
	/* Rounded corners. Remove next line if you don't want squared corners*/
	/*background: url(images/border-bl.gif) no-repeat bottom left;*/
}

/* Logo Color Area */
#Bar_visibleArea_logo{
	background-color: #2C2D2C;
	border-bottom: white 1px solid;
}


/* Prices table */
.Bar_visibleArea table{
	background-color: #2C2D2C;
	border-color: #FFFFFF;
}
/* Prices table caption*/
.Bar_visibleArea_tableHeader{
	background-color: #000000;
	color:#36B4CD;
}

/* "Basket updated" green message above prices table*/
#Bar_visibleArea_basketUpdatedMsg{
	color: #85B666;
}

/* Clear button below prices table */
#Bar_visibleArea_clearButton{
	color: #E45A49;
}

/* Navigation and buttons */
#Bar_visibleArea_navigation{
	/* Rounded corners. Remove next line if you don't want squared corners*/
	/*background:  url(images/border-tl.gif) no-repeat top left;*/
	
	background-color: #2C2D2C;
	border-top: white 1px solid;
}

/* Buttons Text Color on normal state*/
#Bar_visibleArea_navigation ul li a,
#Bar_visibleArea_navigation ul li a:visited  {
	color: #FFFFFF;	
}
/* Buttons Text Color on clic */
#Bar_visibleArea_navigation ul li a:hover{
	color:#36B4CD;
}

/* Button colors on click */
#Bar_visibleArea_btnPreviousStep a:hover,
#Bar_visibleArea_btnNextStep a:hover,
#Bar_visibleArea_gallery a:hover,
#Bar_visibleArea_btnMontage a:hover{
	background-color: #000000;
}


/* Bar Extended Area (Area showing enlarged icons when the bar moves to right)---------------------*/


/* Navigation */
#Bar_extendedArea_navigation{
	/* Rounded corners. Use next line if you don't want squared corners*/
	/*background: url(images/border-tl.gif) no-repeat;*/
	
	background-color: #2C2D2C;
	border-top: white 1px solid;
}
/* Button text color */
#Bar_extendedArea_navigation ul li a{
	color:#FFFFFF;
}

/* Button text color on click */
#Bar_extendedArea_navigation ul li a:hover {
	color:#36B4CD;
}
/* Button Background Color on click*/
#Bar_extendedArea_close a:hover{
	background-color: #000000;
}

#enlargedImage img{
	border: white 1px solid;
}

/* GALLERY SCREEN showing all pictures in selected album ---------------------------- */
/* Main background color */
#ScreenGallery{
	background-color:#2C2D2C;
}

/* Picture boxes colors*/
.Gallery_imageFrame{
	background-color: #000000;
	border-color: #FFFFFF;
}

/* Picture boxes color when mouse is over it*/
.Gallery_imageFrame-hover{
 background-color: #000000;
 border-color: #36B4CD;
}

/* MONTAGES ---------------------------------------------------------------*/

/* Selected images for montage list area*/
.Montage_imageArea{
	border: none;
}

/* Selected images for montage list frames */
.Montage_imageFrame{
	border: 1px solid;
	background-color: #000000;
	border-color: #FFFFFF;
}

/* Montage Frame properties */
.Bar_extendedArea_montageFrame{
	 background-color: black;
	 border: solid 1px white;
}
/* Montage picture boxes properties */
.Bar_extendedArea_montageBox{
	background-color: transparent;
	color: #36B4CD;
}
/* Montage picture boxes border properties */
.Bar_extendedArea_montageBoxWithBorders{
		border: dashed 1px #222;
}
/* Montage picture box properties on mouse over it */
.Bar_extendedArea_montageBox-hover{
	border-color: #36B4CD;
}


/*Tabs area in montage area*/
.MontagePicturesArea_tabsArea{
  border:1px solid #222;
	background:#181818;
}
/* Tab properties on normal state */
.MontagePicturesArea_tabsArea ul a, #MontagePicturesArea_tabsLabel {
  color:#FFF;
  background:#444;
}
/* Tab properties on mouse over it */
.MontagePicturesArea_tabsArea ul a:hover {
  color:#36B4CD;
  background:#111;
}
/* Selected tab properties */
.MontagePicturesArea_tabsArea ul a.selected {
  color:#36B4CD;
  background:#000;
}
/* Select layout button normal state properties */
.montageTab_controlsArea a.montageTab_btnTemplate {	
	background: url(images/bg-nav-layouts.gif) no-repeat bottom left;
	color: white;
}
/* Select layout button on mouse over it */
.montageTab_controlsArea a.montageTab_btnTemplate:hover{
	background: black url(images/bg-nav-layouts.gif) no-repeat bottom left;
}
/* Montage color list properties */
.montageCombo {
	border:1px solid #ccc;
}

/* TEMPLATE LIST (Select layout) SCREEN ----------------------------------------------*/
/* Whole area */
#ScreenTemplates{
	background-color: black;
}
/* Header area */
#TemplatesArea_header{
	background-color: #2C2D2C;
	border-bottom: solid 1px white;
	color: #36B4CD;
}

/* Template in list properties*/
.TemplatesArea_template{
	border:1px solid #222;
	background:#181818;
}

/* Template in list properties on mouse over it */
.TemplatesArea_template-hover{
	border:1px solid #36B4CD;
}
/* Filter by picture number selector properties */
.MontageList_layoutsCombo{
	border:1px solid #ccc;
}

/* Template Frame properties*/
.TemplatesArea_montageListFrame{
	 background-color: black;
	 border: solid 1px white;
}

/* Template picture boxes properties*/
.TemplatesArea_montageListBox{
	border: dashed 1px #222;
	background-color: transparent;
	color: #36B4CD;
}


/* BASKET SCREEN (showing items in basket and order form)-----------------------------*/
/* Deep background color */
#BasketArea{
	background-color:#000000;
}

/* Main background color (page look & feel)*/
#Basket_page{
	background-color: #2C2D2C;
	border: white solid 1px;
}
/* Section headers, like "Prints" text */
.ScreenBasket h2{
	color:#36B4CD;
}

/* Border color for pictures in basket */
.ScreenBasket .picture{
	border-color: #FFFFFF;
}

/* Picture references in basket (first line next to picture above order subtables) */
.Basket_productPreHeader{
	color: #CCCCCC;
}

/* Header for subtables (Description, Price, Qty. Cost)*/
.Basket_productHeader{
	background-color: #000000;
	color:#36B4CD;
}

/* Montage Frame properties*/
.BasketArea_montageFrame{
	 background-color: black;
	 border: solid 1px white;
}

/* Montage picture boxes properties*/
.BasketArea_montageBox{
	border: dashed 1px #222;
	background-color: transparent;
	color: #36B4CD;
}

/* Onsite Checkout button */
#Basket_submitButton_onsite a{ 

	color: #36B4CD;
	border: 1px solid white;
	background-color: black;
}

#Basket_submitButton_onsite a:hover{
	background-color: black;
	border-color: white;
	color: white;
	
}

/* Clear Basket Button Color */
#BasketArea ul li a,
#BasketArea ul li a:hover {	
	color: #e45a49;
}


/* Order Form */
/* All Text Boxes in the basket form will have these colors */
.Basket_input,
.Basket_combo{
	border-color: #b6b3b3;
}

/* EXTRAS (Other elements) ------------------------------------------- */

/* TOOLTIPS appearing with the price discounts for instance.*/
/* Caption*/
.hovertip-caption{
	background: #000000;
	color: #36B4CD;
	border-bottom: #FFFFFF solid 1px;
}
/* Main Body */
.hovertip, .clicktip {
	background-color: #000000;
	border-color: #FFFFFF;
	color: #FFFFFF;
}


/* MESSAGE DIALOGS ------------------------------*/
/* Box colors*/
.dialogYesNo, .dialogError, .dialogYes, .dialogProcess{
	border-color:#FFFFFF;
	color: #000000;
	background-color: #2C2D2C;
}

/* Header colors*/
.dialogYesNo  h1, .dialogError h1, .dialogYes h1, .dialogProcess h1{
	color:#36B4CD;
}
/* Main body text color*/
.dialogYesNo p, .dialogError p, .dialogYes p, .dialogProcess p{
	color:#FFFFFF;
}


/* FORM SELECT BOXES --------------------------*/
/* Main colors*/
div.autocomplete {
  background-color: white;
  border-color:#CCCCCC;
}
/* Main Text Color*/
div.autocomplete ul {
	color: black;
}

/* Main colors for list items*/
div.comboOptions {
  background-color:white;
  border-color: #CCCCCC;
}
/* List selected item color */
div.autocomplete ul li.selected,
.lihover { 
  background-color: #EAF2FB;
}




