/**
 * This script contains styles specific to My NavPix(tm)
 * 
 * @copyright (C) 2006 Fhlame Limited.
 * @author caphun <caphun@yelotfu.com>
 */

/*******************************************************
 * Override styles (These may affect areas outside 
 * the centreContainer
 ******************************************************/ 

body.navpix #pageContainer {
	background:none;
}

body.navpix #mainContainer {
	border:none;
}

body.navpix #centreContainer {
	min-height:345px;
}

body.navpix #mainContainer>#centreContainer {
	height:auto;
}

/*******************************************************
 * Common styles related to My NavPix
 ******************************************************/ 
 
.myNavPix a.arrow {
	background: url(../../images/MyNavpix/ico_arrow.gif) 100% 50% no-repeat;
	padding-right:1.5em;
}

.myNavPix a.plus {
	background: url(../../images/MyNavpix/ico_plus.gif) 0 60% no-repeat;
	padding-left:.85em;
}
.myNavPix a.minus {
	background: url(../../images/MyNavpix/ico_minus.gif) 0 60% no-repeat;
	padding-left:.85em;
}

/* Vertical scrollbars */

.myNavPix .vscroll {
	float:left;
}
.myNavPix .vscroll .vscroll_bar {
	position:relative;
	margin:0 auto;
	background: url(../../images/MyNavpix/vscroll_bar.gif) 50% 0 no-repeat;
	width:18px;
	height:227px;
}
.myNavPix .vscroll .vscroll_track {
	position:absolute;
	top:0;
	left:1px;
	background: url(../../images/MyNavpix/vscroll_track.png) 0 0 no-repeat;
	width:18px;
	height:35px;
}

/* End : Vertical scrollbars */

/* Horizontal scrollbars */

.myNavPix .hscroll {
	margin-left:auto;
	margin-right:auto;
	position:relative;
	clear:both;
	width:730px;
	margin-bottom:2em;
}

.myNavPix .hscroll .hscroll_trackbar {
	position:relative;
	float:left;
}

.myNavPix .hscroll .hscroll_leftArrow {
	position:relative;
	top:1px;
	float:left;
	background:url(../../images/MyNavpix/hscroll_larrow.gif);
	width:17px;
	height:17px;
}
.myNavPix .hscroll .hscroll_rightArrow {
	position:relative;
	top:1px;
	float:right;
	background:url(../../images/MyNavpix/hscroll_rarrow.gif);
	width:17px;
	height:17px;			
}

.myNavPix .hscroll .hscroll_bar {
	background: url(../../images/MyNavpix/hscroll_bar.gif) 0 50% no-repeat;
	width:691px;
	height:17px;
}

.myNavPix .hscroll .hscroll_track {
	position:absolute;
	left:0;
	top:1px;	
	background: url(../../images/MyNavpix/hscroll_track.png) no-repeat;
	width:35px;
	height:18px;
}

/* End : Horizontal scrollbars */

.myNavPix .separator {
	height:1px;
	background:url(../../images/MyNavpix/separator.gif) repeat-x;
}

.myNavPix .myNavPixTop {
	height:85px;
	min-height:85px;
}

.myNavPix>.myNavPixTop {
	height:auto;
}

/*******************************************************
 * Styles related to the My NavPix Sidebar
 ******************************************************/ 
#centreContent_myNavPixSidebar { 
	float:left; 
	width:190px;
}

#centreContent_myNavPixSidebar .myNavPixTop {
	text-align:left;
}

#centreContent_myNavPixSidebar .logo {
	margin:0;
	padding:0;
	background:url(../../images/MyNavpix/title_my-navpix.gif) no-repeat;
	width:112px;
	height:20px;
	text-indent:-3000px;
	margin-bottom:25px;
}

#centreContent_myNavPixSidebar .separator {
	width:150px;
}

#centreContent_myNavPixSidebar a,
body.navpix #centreContent_myNavPixSidebar a {
	font-weight:bold;	
	background: url(../../images/MyNavpix/ico_arrow.gif) 100% 100% no-repeat;
	padding-right:1.5em;
	color:#666;
}

#centreContent_myNavPixSidebar a:hover,
body.navpix #centreContent_myNavPixSidebar a:hover {
	color:#00729D;
}

#centreContent_myNavPixSidebar #myNavPixNavTreeWrapper {
	float:left;
	width:90%;
	height:225px;
	overflow:hidden;	
	position:relative;
	margin-bottom:1.5em;
}

#centreContent_myNavPixSidebar ul {
	margin:0;
	padding:0;
	text-align:left;
	position:relative;
}

#centreContent_myNavPixSidebar ul li {
	background: url(../../images/MyNavpix/ico_folder.gif) 0 .5em no-repeat;
		padding-left:20px;
}

#centreContent_myNavPixSidebar li.new {
	background: url(../../images/MyNavpix/ico_folder_new.gif) 0 .5em no-repeat;
	padding-left:20px;	
}

/*******************************************************
 * Styles related to the My NavPix Body Area
 ******************************************************/ 
#centreContent_myNavPixBody { 
	float:right;
	width:545px; 
	margin-bottom:1.5em;
}

#centreContent_myNavPixBody input,
#centreContent_myNavPixBody textarea
 {	
 	font-size:1em;
	font-family:Arial,sans-serif;
	border:1px solid #cfcfcf;
	color:#666;
}

#centreContent_myNavPixBody .myNavPixTop {
	text-align:left;
}

/* this following override is very bad but there's no other way unless the global styles change somewhat */
body#product.navpix #centreContent_myNavPixBody .myNavPixTop label {
	color:#666 !important;
}

#centreContent_myNavPixBody .myNavPixTop div {
	float:left;
}

body.navpix #centreContent_myNavPixBody .myNavPixTop a {
	color:#ccc;
}

body.navpix #centreContent_myNavPixBody .myNavPixTop a.active {
	color:#666;
	font-weight:bold;
}

#centreContent_myNavPixBody .albumTitleContent {
	position:relative;
}

#centreContent_myNavPixBody .albumTitleContent input {
 	width:156px; 
	padding:3px 2px;
}



#centreContent_myNavPixBody .notSaved input {
	background:#FFC6C6;
}

#centreContent_myNavPixBody .saving input {
	background:#BDFF8C;
}

#centreContent_myNavPixBody .waiting input {
	background:#FFFF8C;
}


#centreContent_myNavPixBody .indicator {
	background:url(../../images/mynavpix/spinner_sm.gif);
	width:24px;
	height:24px;
	position:absolute; 
	right:1px; 
	top:50px;
	background-repeat: no-repeat; 
}

#centreContent_myNavPixBody .albumDescContent {
	padding-left:10px;
}

#centreContent_myNavPixBody .albumDescContent textarea {
 	width:366px; 
	height:49px;
	padding:3px 2px;
}

#centreContent_myNavPixBody .centreContentDropArea {
	position:relative; 
	border:1px solid #cfcfcf;
	width:525px;
	height:225px;
	float:left;
	overflow:hidden;	
	z-index:1;
}

#centreContent_myNavPixBody .centreContentDropArea .innerContent {
	margin:10px 15px;
	width:100%;
	height:1000px;
	position:relative;
}

#centreContent_myNavPixBody .centreContentDropArea .innerContentEmpty {
	margin:1px;
	background:url(../../images/mynavpix/bg_empty.png);
	height:99%;
}

#centreContent_myNavPixBody .centreContentDropArea .innerContentText {
	position:relative;
	top:50%;
	text-align:center;
}

#centreContent_myNavPixBody .centreContentDropArea .innerContent div {
	float:left;
	padding:8px 5px;
	width:74px;
	height:62px;
}

#centreContent_myNavPixBody .centreContentDropArea .folder {
	background:url(../../images/mynavpix/ico_folder_large.gif) no-repeat;
	
}
#centreContent_myNavPixBody .centreContentDropArea .folder div {
	padding:0;
	margin:0;
}
#centreContent_myNavPixBody .centreContentDropArea img {
	float:left;
	border:none;	
	margin-right:20px;
	border-top:1px solid #666;
	border-left:1px solid #666;
	/* crop images */	
	width:62px;
	height:49px;
}



/* Context menu */
#myNavPixContextMenu {	
	position:absolute; 
/*
	top:300px;
	left:450px;
*/	
	width:256px;
	z-index:10;
}
#centreContainer>#myNavPixConextMenu {
	height:auto;
}

#myNavPixContextMenu .contextMenu_pin {
	position:absolute;
	top:16px;
	left:-11px;
	width:12px;
	height:15px;	
}
#myNavPixContextMenu>.contextMenu_pin {
	background: url(../../images/mynavpix/context-menu_pin.png) no-repeat;
}

#myNavPixContextMenu .contextMenu_bottom {
	position:absolute;
	left:-11px;
	background:url(../../images/mynavpix/context-menu_bottom.png) no-repeat;
	width:272px;
	height:9px;	
}

#myNavPixContextMenu .contextMenu_top {
	position:absolute;
	top:0;
	left:-11px;
	background:url(../../images/mynavpix/context-menu_top.png) no-repeat;
	width:272px;
	height:8px;	
	z-index:-1;
}

#myNavPixContextMenu .contextMenu_shadow {
	position:absolute;
	top:8px;
	bottom:0;
	left:-11px;
	background:url(../../images/mynavpix/context-menu_bg.png) repeat-y;
	width:272px;
	z-index:-1;
}

#myNavPixContextMenu .contextMenu_content {	
	border:1px solid #cfcfcf;
	background:#fff url(../../images/mynavpix/separator_v.gif) 102px 0 repeat-y;
	padding:1px;
	text-align:left;
	color:#333;	
	font-size:1em;
}

#myNavPixContextMenu .contextMenu_content ul {
	float:left;	
	margin:0;
	padding:0;	
	padding-right:1px;	
}
#myNavPixContextMenu .contextMenu_content ul li {
	width:100px;
	padding:0;
	margin:0;
	text-decoration: underline;
}
#myNavPixContextMenu .contextMenu_content ul li a {
	display:block;	
	line-height:21px;
	padding:0 12px;
	color:#333;
	text-decoration: underline;
}

#myNavPixContextMenu .contextMenu_content ul li a:hover {
	display:block;
	background:#ccc;	
}

#myNavPixContextMenu .contextMenu_content .details {
	float:right;
	width:120px;
	padding:3px 12px 10px 12px;
	color:#666;
	font-size:.9em;
}

body#product.navpix #myNavPixContextMenu p {
	color:#00729D !important;
}

/* End : Context menu */

/*******************************************************
 * Styles related to the My NavPix Browser
 ******************************************************/ 
#centreContent_myNavPixBrowser { 
	clear:both; 
	border:1px solid #cfcfcf;
	background:#e5e5e5 url(../../images/MyNavpix/bg_browser.gif) 50% 0 repeat-y;
}

#centreContent_myNavPixBrowser input,
#centreContent_myNavPixBrowser select,
#centreContent_myNavPixBrowser textarea {
	font-size:1em;
	color:#333;
}

#centreContent_myNavPixBrowser input,
#centreContent_myNavPixBrowser select {
	padding:3px 2px;
}

body#product.navpix #centreContent_myNavPixBrowser label {
	color:#333 !important;
}

#centreContent_myNavPixBrowser .advSearch,
#centreContent_myNavPixBrowser .quickSearch {
	position:relative;
	padding-top:10px;
	margin:0;
	text-align:left;
}


#centreContent_myNavPixBrowser #advSearchBtn {
	position:absolute;
	right:7px;
	color:#666;
	font-size:.85em;
	text-decoration:underline;
}

#centreContent_myNavPixBrowser #qSearchBtn {
	color:#333;
	font-size:1em;
	font-weight:bold;
	margin-left:.5em;
}

#centreContent_myNavPixBrowser select {
	margin:0 8px;
}

#centreContent_myNavPixBrowser .long {
	width:200px;
}

#centreContent_myNavPixBrowser .longer {
	width:240px;
}

#centreContent_myNavPixBrowser .max {
	width:270px;
}

#centreContent_myNavPixBrowser .previewer {
/*
	position:relative;
	overflow:hidden;
	width:720px;
*/		
	height:100px;	
	margin:10px 8px 5px 8px;
}

/*
#centreContent_myNavPixBrowser .previewer div {
	position:absolute;
	top:0;
	left:0;
	width:1000px;	
}

#centreContent_myNavPixBrowser .previewer img {
	float:left;
	border-top:1px solid #666;
	border-left:1px solid #666;
	margin-right:20px;
}
*/

#centreContent_myNavPixBrowser .imagePanelImg {
	position:relative;
	padding:0px 10px 0px;
	width:80px;
	height:80px;
	float:left;
/*	overflow:hidden; */
}

/*---drag style-----*/
.drag{
	position:relative;
	cursor:hand;
	z-index: 100;
}

/*-----------floating view/share/... divs............*/

.opaque {
	opacity: .;
	filter: alpha(opacity=60);
}
.noOpaque{
	opacity: 1;
	filter: alpha(opacity=100);
	 background-color: #ffffff;
	

}
.floatBox {
   opacity: 0.96;
   position: absolute;
   width: 500px;
   height: 400px;
   top: 130px;
   left: 620px;
   border: 1px solid #000000;
   background-color: #ffffff;
   z-index:900;
   font-family:arial,sans-serif;
   text-align:left;
   overflow: auto; 
   overflow-x: hidden;
   
   
   
   
}





