/**************************
' TTT -  http://www.tttcompany.com
' Copyright (c) 1992-2009
' by TTT Corporation
'
' Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated 
' documentation files (the "Software"), to deal in the Software without restriction, including without limitation 
' the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and 
' to permit persons to whom the Software is furnished to do so, subject to the following conditions:
'
' The above copyright notice and this permission notice shall be included in all copies or substantial portions 
' of the Software.
'
' THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED 
' TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL 
' THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF 
' CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER 
' DEALINGS IN THE SOFTWARE.
***************************/

/**************************
*   overwrite DNN skin default
***************************/
p, div, ul, li {
border:0 none;
color:#000000;
margin:0;
padding:0;
}

/**************************
*   DISPLAY STYLES
***************************/
.gallery-header
{   
    height:28px;    
    border-bottom:solid 1px #dedede;
} 

.gallery-container
{       
     display: block;
} 

.tbSearch, .ddlSort, .ddlCategory
{
    margin-bottom: 5px;  
}

.chkDesc 
{
    margin-bottom: 8px;
}

/* to be dynamic generated based on config setting
.gallery-container
{
    width: 100%; 
    height: 580px; 
}
*/

.HR {
    background: url("images/HR.png") repeat-x scroll center bottom transparent;
    height: 1px;
    margin: 3px 0;
}

/******************
    BREADCRUMB
*******************/

.breadcrumb
{		
	margin: 0;
	padding: 0;	
	height: 22px;
	display: block;
	float: left;
	overflow: visible; 
}

.breadcrumb li
{
	display: block;
	float: left;
	position: relative;
	height: 21px;
	overflow: hidden;
	line-height: 21px;
	margin: 0px 2px 0px 0px;		
	font-weight:bold; 		
}

.breadcrumb li a
{
	display: block;
	text-indent: 20px;
	position: relative;
	height: 20px;
	line-height: 20px;
	overflow: hidden;
	float: left;
	font-weight:bold; 
	color: #999; 
	margin: 0 0 0 5px;
	background: url(images/breadcrumb.gif) no-repeat 100%;
	background-position: 0px 5px;
}

.breadcrumb li a:hover
{
    text-decoration: none; 
    color: #000; 
}

.breadcrumb li.first a
{
	height: 20px !important;
	text-indent:25px;
    /*overflow: hidden;*/
	width:auto;
	padding: 0 0 2px 2px; 
	background:url(images/IconHome.gif) no-repeat;
	background-position:  0px -20px;
}

.breadcrumb li.first a:hover
{
    /*width: auto;
    text-indent: 24px;
    overflow: visible;*/
	background-position:  0px 0px;
}

.breadcrumb li.last
{
	/*background: none;	*/	
}

.album-content
{
	position: relative;
}
.ui-layout-west
{ 
    padding: 0px;
    margin: 0px;           
    position: relative; 
    float: left;     
}

.ui-layout-center {
    position: relative;    
}  

.album-tree
{   
    margin: 3px;         
}

.content-area
{
    width: 100%;
}


.gallery-command
{
    width: 200px;   
    display: block; 
    list-style: none;
    
}
/**/
.album-menu-top
{      
    display: block; 
    padding: 0 0 5px 22px;   
    margin-left: 10px;  
    background: url(images/photo.gif) no-repeat; 
    background-position:  0px -22px;        
    font-family: arial,helvetica,verdana;
    font-size: 12px;
    font-weight: bold;
    color: #999 !important; 
}

.command-slideshow
{    
	display: block;  /*this attribute is important as a trigger to run slideshow on space-bar key-down */
	margin-left: 10px; 
    padding:   0 0 5px 22px;    
    background: url(images/video.gif) no-repeat; 
    background-position:  0px -22px;   
    font-family: arial,helvetica,verdana;
    font-size: 12px;
    color: #999 !important;     
}


/*
.command-edit
{    
    padding:  0 0 5px 22px;
    background: url(images/photo.gif) no-repeat; 
    background-position:  0px -22px;  
}
*/


.command-slideshow:hover, .album-menu-top:hover
{     
    
    background-position:  0px 0px;  
    color: black !important;    
    text-decoration: none; 
}

/* border-width top/bottom is important for layout, do not change*
border-top:  solid 1px #fff;
	border-bottom:  solid 1px #999;
	background-image: url("images/tab0.gif");
	
.navigator
{   	
	height: 26px; 	
	padding: 0; 
	list-style: none;
	
} 
*/

.album-command, .info, .status, .breadcrumb-bottom 
{ 
    float: left;     
}

.pager-top
{		
	display: block;		
	height: 21px;
	margin-top: 5px;
}

.pager-top, .pager-bottom
{
    width: auto;
    float: right; 
    margin-right: 5px; 
    list-style: none;      
}

.pager-top li, .pager-bottom li, .info li
{      
    list-style: none;    
}

.pager-current
{   
    font-weight: bold; 
    color: Orange;    
}

#pictures-area   
{   
	padding-top: 20px; 
    margin: 0 auto; 
}

.album-strip
{
  
}
.album-menu, .album-menu-top, .album-menu-albums, .album-menu-pictures
{
   list-style: none; 
}

.thumb-view
{
    text-align: center;     
    margin-bottom: 20px;    
}

.thumb-view .picture-strip
{       
    padding:   15px 0 0 0;       
    position:  relative;     
}

.thumb-view .picture , .detail-view .picture
{   
    padding: 1px;        
    background-color: #bbb;      
    list-style: none; 
    display: inline-block;
	overflow: hidden; 
	border: 5px solid #ccc;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;	
	z-index: 2; 
}

.thumb-view .picture {
	 float: none; 	
}

.thumb-view .picture:hover {
	 border-color: Orange; 	
}

.thumb-view .text 
{
    float: none;
}
   
.thumb-view .text h2 
{
    float: none;
    height: 24px;
}

.display a 	
{
    color: #999;
	text-decoration: none;
}

.display a:hover 	
{
    color: black;	
}

.display a img {	
	border: 0;	
	float: none;
}

.display .text 
{    
    padding: 5px;   
}

.display .text h2 {	
	padding: 0;    
	margin-top: 10px;   
    display: block;    
    font-size: 12px;    
    font-weight: bold;  
}

.title
{     
   color: Black !important;  
   float:none !important;
}

.title:hover
{
    color: Orange !important; 
}

.view-comment /*, .view-comment a*/
{
    float: none;
    font-weight: normal !important; 
    color: #999;
}

#footer
{
    width: 99%;
    border-top:solid 1px #dedede;
}

#footer, #navigator 
{    
    height: 28px;     
    display: block;           
}

#footer ul, #navigator ul 
{
   padding: 5px;    
}

#footer ul li, #footer ul a, #navigator ul li, #navigator ul a
{  	
	color: #999;  
}

#footer ul a:hover, #navigator ul a:hover
{         
     color: black;   
     text-decoration: none; 
}

.info
{
    margin: 0 0 0 10px;
}

.status
{
    width: 16px;
}

.loadingimage
{
    position: absolute;   
    width: 20px;
    height: 20px;
    border: 0;
}

.button:hover
{
    border: none;    
} 

.button
{
   border-left: 0;
   border-top: 0;
   border-right: 0;
   border-bottom: solid 1px transparent;    
}

/***********************************
*	PICTURE DETAILS
***********************************/

.picture-details
{
	width: 99%;	
}
.picture-details .picture-area
{		
	float: left;	
	position: relative;	
}
.picture-details .picture-area img
{	
	border: 10px solid #ccc;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	margin: 5px;	
} 

.picture-details .text
{	
	padding-left: 5px;		
	float: left;
	width: 52%; 	
	margin: 5px;	
}

.picture-details .text .navigator
{
    border-bottom: solid 1px #dedede;
}

.picture-details .text h3
{
	 font-size: 12px;
	 font-weight: bold;   
	 text-align: left; 	 
	 display: block; 
	 /*border-bottom: solid 1px #dedede;*/	
}

.picture-details .text a:hover
{
    text-decoration: none;
    color: Orange;  
}

.picture-details .text h4
{
    font-size: 12px;
	font-weight: normal;     
}

/*
.picture-details .text div .div-input
{
    display: block;
    border: none !important;   
    margin: 2px;
}*/

.div-input, .div-input-button, .div-input-textarea
{
    display: block;
    border: none !important;   
    margin: 2px;
}

.div-input-textarea
{
    width: 98%;
}

.comment-submit
{
    width: 96%;    
    text-align: right;   
}

.comment-submit button
{
    margin: 5px 0 5px 0; 
}

.comment-submit .div-input input
{
    width: 250px;    
}

.submit-button
{
    width: 60px;
}

#ccomment
{
    padding: 6px; 
    width: 90%;
    margin: 5px 0 5px 0;
}

#comment-list, #exif-list
{
	margin: 5px 0 5px 0;	
	width: 98%;
	float: left;	
}  

.comment-data
{	
	border: 1px dotted #DEDEDE !important;
    margin: 5px !important;  
    padding: 5px !important;  
    text-align: left;    
}

.comment-info
{
    color: #999;
}

.exif-icon
{
	padding: 3px;
	width: 24px;
}

.exif-name
{
	 padding-left: 5px; 
	 width: 120px;
}
.exif-value
{
	width: 200px;
}


/***********************************
*	SLIDESHOW
***********************************/

#slideshow 
{
	float: none;
    text-align: center;  
    overflow: hidden; 
    z-index: 9999;
}

/*
.slideshow-title
{
	height: 20px;
	display: block;
	font-size: 12px;
	font-weight: bold;  
	margin-bottom: 5px; 
}

.slideshow-info
{	
	width: 200px;
	list-style: none; 
	float: left;
	text-align: left;   
    display: block;     
    left: 10px;
    top: 50px;  
    position: absolute;
	z-index: 10001; 
}

.slideshow-navigator
{	
	width: 50%;		
	height: 40px; 
	display: inline-block; 
	float: none;		
	overflow: auto;  
	z-index: 10; 	
}

*/

.slideshow-info
{	
	width: 100%;
	list-style: none; 
	float: none;
	text-align: center;   
    display: block;     
    /*left: 10px;
    top: 50px;  */
    top: 0; 
    position: absolute;    
    overflow: visible;
	z-index: 10001; 
}

.slideshow-title
{
	height: 20px;
	display: block;
	font-size: 12px;
	font-weight: bold;  	
}

.slideshow-caption
{	
	font-weight: normal; 	
	top:20px;
	/*width:600px;
	display:block;
	overflow: visible;*/	
	float: none; 
	display:block; 	
}

.slideshow-navigator
{			
	height: 40px; 
	display: inline-block; 
	float: left;
	left: 10px;
    top: 60px;  	
    position: absolute; 	
	overflow: auto;  
	z-index: 10001; 	
}
        
.slideshow-navigator li
{
	width: 30px;	
	margin: 1px;
	float: left;
	list-style: none;
}
        
.slideshow-navigator a
{
	width: 30px;
	padding: 3px;
	display: block;
	border: 0;
}   
             
.slideshow-navigator img
{           
	border: 0;
}  
              
.slideshow-navigator a.activeSlide
{
	background: #ea0;
}    
            
.slideshow-navigator a:focus
{
	outline: none;
}  

.slideshow-ext-caption
{
	width: 200px;	
	height: 300px; 
	float: left;
	left: 10px;
    top: 150px;      
    text-align:left; 
    position: absolute; 	
	overflow: auto;  
	z-index: 10001; 	
}


.slideshow-pictures  
{		
	left: 0px;
	width: 0px;
	top: 55px;
	float: none !important;	
    display: inline-block; 
    text-align: center;  
    overflow: hidden; 
    z-index: 0; 
    position: absolute; 
      
}

/*position: relative !important;*/ 
.slideshow-picture
{		
	 border: 10px solid #ccc;	 
	-moz-border-radius: 15px; 
	-webkit-border-radius: 15px;	
}

/**************************
*	SLIDESHOW CONTROL
***************************/
.slideshow-controls
{	
	float: left;	
    display: block;     
    left: 10px;
    top: 100px;  
    width: 105px;
	height: 20px;
    position: absolute;
    background: none;
	z-index: 1; 
}
.slideshow-controls ul {
	position: relative;
	height: 20px;
	list-style: none;
	background: none;
	margin: 0;
	padding: 0;
	background: url(images/slideshow-control.gif) right -90px no-repeat;
}
.slideshow-controls li {
	padding: 0;
	margin:0;
	float: left;
	list-style: none; 
}
.slideshow-controls a {
	background-image: url(images/slideshow-control.gif);
	display: block;
	float: left;
	height: 20px;
	width: 20px;
	outline: none;
}
.slideshow-controls a.disabled {
	cursor: default;
}
.slideshow-controls a.disabled span {
	cursor: default;
}
.slideshow-controls a span {	
	display: none;
	cursor: pointer;
}
.slideshow-controls .slideshow-previous a {
	background-position: 0 0;
}
.slideshow-controls .slideshow-previous a:hover {
	background-position: 0 -20px;
}
.slideshow-controls .slideshow-previous a.disabled {
	background-position: 0 -40px !important;
}
.slideshow-controls .slideshow-play{	
}
.slideshow-controls .slideshow-play a {
	background-position: -20px 0;	
	display: none; 	 
}
.slideshow-controls .slideshow-play a:hover {
	background-position: -20px -20px;
}
.slideshow-controls .slideshow-play a.disabled {
	background-position: -20px -40px !important;
}
.slideshow-controls .slideshow-pause a {
	background-position: -40px 0;
}
.slideshow-controls .slideshow-pause a:hover {
	background-position: -40px -20px;
}
.slideshow-controls .slideshow-next a {
	background-position: -60px 0;
}
.slideshow-controls .slideshow-next a:hover {
	background-position: -60px -20px;
}
.slideshow-controls .slideshow-next a.disabled {
	background-position: -60px -40px !important;
}
.slideshow-controls .slideshow-full-expand a {
	background-position: -100px 0;
}
.slideshow-controls .slideshow-full-expand a:hover {
	background-position: -100px -20px;
}
.slideshow-controls .slideshow-full-expand a.disabled {
	background-position: -100px -40px !important;
}
.slideshow-controls .slideshow-close a {
	background-position: -120px 0;
}
.slideshow-controls .slideshow-close a:hover {
	background-position: -120px -20px;
}

/**************************
* LIGHTBOX
***************************/
/* SLIMBOX */

#lbOverlay {
	position: fixed;
	z-index: 9999;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	cursor: pointer;
}

#lbCenter, #lbBottomContainer {
	position: absolute;
	z-index: 9999;
	overflow: hidden;
	background-color: #fff;
}

.lbLoading {
	background: #fff url(images/slimbox/loading.gif) no-repeat center;
}

#lbImage {
	position: absolute;
	left: 0;
	top: 0;
	border: 10px solid #ccc;
	background-repeat: no-repeat;
	-webkit-border-radius: 15px; 	
	-moz-border-radius:15px;	
}

#lbPrevLink, #lbNextLink {
	display: block;
	position: absolute;
	top: 0;
	width: 50%;
	outline: none;
}

#lbPrevLink {
	left: 0;
}

#lbPrevLink:hover {
	background: transparent url(images/slimbox/btnPrevious.png) no-repeat 0 15%;
}

#lbNextLink {
	right: 0;
}

#lbNextLink:hover {
	background: transparent url(images/slimbox/btnNext.png) no-repeat 100% 15%;
}

#lbBottom {
	font-family: Verdana, Arial, Geneva, Helvetica, sans-serif;
	font-size: 10px;
	color: #666;
	line-height: 1.4em;
	text-align: left;
	border: 10px solid #fff;
	border-top-style: none;
}

#lbCloseLink {
	display: block;
	float: right;
	width: 66px;
	height: 22px;
	background: transparent url(images/slimbox/closelabel.gif) no-repeat center;
	margin: 5px 0;
	outline: none;
}

#lbCaption, #lbNumber {
	margin-right: 71px;
}

#lbCaption {
	font-weight: bold;
}


/**************************
*   STYLES
***************************/
/*
.pin
{   
    margin: 1px;
    width: 28px;
	height: 21px;
	display: block;
	position: absolute;
	top: 0px;			
	background: url(images/style/pin.png) no-repeat;    
	z-index: 3;  
}

.mask
{   
    width: 110px;
	height: 110px;
	display: block;
	position: absolute;
	top: 14px;	
	background: url(images/style/mask-s.png) no-repeat;
	z-index: 3; 
}

.mask-darken
{   
    width: 108px;
	height: 156px;
	display: block;
	position: absolute;
	top: 3;	
	background: url(images/style/mask-v-darken.png) no-repeat;
	z-index: 3; 
}

.round-corner {
	width: 120px;
	height: 170px;
	display: block;
	position: absolute;
	top: 10;	
	background: url(images/style/round-corner.png) no-repeat;
}

.paper-clip {
	width: 30px;
	height: 60px;
	display: block;
	position: absolute;
	top: 10px;	
	background: url(images/style/paper-clip.png) no-repeat;
	z-index: 3; 
}

/*.golden-frame 
.golden-frame {
	width: 160px;	
	height: 210px; 
	display: block;
	position: absolute;	
	top: 10px;		
	background: url(images/style/gold-frame-v.png) no-repeat;		
}

.floral-corner
{
    margin: 1px;
	width: 120px;
	height: 72px;
	display: block;
	position: absolute;
	top: 0px;	
	background: url(images/style/floral-corner.png) no-repeat;
	z-index: 3;
}

.watercolor {
	width: 120px;
	height: 164px;
	display: block;
	position: absolute;
	top: 15px;	
	background: url(images/style/watercolor-top-v.png) no-repeat;	
}

.ancient {
	width: 116px;
	height: 160px;
	display: block;
	position: absolute;
	top: 15px;	
	opacity: 0.2;
	filter: alpha(opacity=20);	
	background: url(images/style/watercolor-bg-v.png) no-repeat;	
}
*/

/**************************
*   UI.LAYOUT
***************************/

/* all 'panes' */ 
.pane  
{
    overflow: auto;
    padding: 1px !important;
    margin: 1px !important; 
    background-color: Transparent !important;     
} 

.pane-west {   
    border: 0 !important;
} 
    
.pane-center 
{
     border: 0 !important;            
}   

.resizer-west {	
	/*opacity: 1;
	filter: alpha(opacity=100);*/
}

.resizer-west:hover {
	/*opacity: 0.5;
	filter: alpha(opacity=50);*/
}

/*  .toggler-west-open:hover  .ui-layout-toggler-west-open*/
.toggler-west-open
{
    background-image: url("images/mini-left.gif") !important; 
}

.toggler-west-closed
{
    background-image: url("images/mini-right.gif") !important; 
} 

span.button-pin ,
span.button-close {
	position:	absolute;
	top:		0;
	width: 		20px;
	height:		20px;
	z-index:	2;
	display:	block;
	cursor: 	pointer;
}

#west-closer
{ 
    left:	 0 !important; 
    background-image: url(images/go-lt-off.gif) !important; 
}
span.button-pin-west	{ right: 1px; }
span.button-pin-east	{ left:	 1px; }

/* CUSTOM pin-buttons */
span.button-pin-up 		  		{ background: url(images/pin-up-off.gif) no-repeat center; }
span.button-pin-up:hover   		{ background: url(images/pin-up-on.gif)  no-repeat center; }
span.button-pin-down 	  		{ background: url(images/pin-dn-off.gif) no-repeat center; }
span.button-pin-down:hover 		{ background: url(images/pin-dn-on.gif)  no-repeat center; }

/* CUSTOM close-buttons */
.ui-layout-button-close-west			{ background-image: url(images/go-lt-off.gif); }
.ui-layout-button-close-west:hover	{ background-image: url(images/go-lt-on.gif)  no-repeat center; }

/**************************
*	UI ALL
***************************/
.ui-icon { width: 16px; height: 16px; background-image: url(images/ui/ui-icons_222222_256x240.png); }
.ui-widget-content .ui-icon {background-image: url(images/ui/ui-icons_222222_256x240.png); }
.ui-widget-header .ui-icon {background-image: url(images/ui/ui-icons_222222_256x240.png); }
.ui-state-default .ui-icon { background-image: url(images/ui/ui-icons_888888_256x240.png); }
.ui-state-active .ui-icon {background-image: url(images/ui/ui-icons_454545_256x240.png); }
.ui-state-hover .ui-icon, .ui-state-focus .ui-icon {background-image: url(images/ui/ui-icons_454545_256x240.png); }
/*
.ui-state-highlight .ui-icon {background-image: url(images/ui-icons_2e83ff_256x240.png); }
.ui-state-error .ui-icon, .ui-state-error-text .ui-icon {background-image: url(images/ui-icons_cd0a0a_256x240.png); }
*/
.ui-icon-circle-arrow-e  
{
    background-image: url(images/ui/ui-icons_888888_256x240.png);
    background-position: -112px -192px; 
}

.ui-icon-circle-arrow-s 
{ 
    background-image: url(images/ui/images/ui/ui-icons_454545_256x240.png);
    background-position: -128px -192px; 
}

/**************************
*	ACCORDION WIDGET
***************************/

/*
 * jQuery UI Accordion 1.8.14
 *
 * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about)
 * Dual licensed under the MIT or GPL Version 2 licenses.
 * http://jquery.org/license
 *
 * http://docs.jquery.com/UI/Accordion#theming
 */
/* IE/Win - Fix animation bug - #4615 
.ui-accordion { width: 100%; }
.ui-accordion .ui-accordion-header { cursor: pointer; position: relative; margin-top: 1px; zoom: 1; }
.ui-accordion .ui-accordion-li-fix { display: inline; }
.ui-accordion .ui-accordion-header-active { border-bottom: 0 !important; }
.ui-accordion .ui-accordion-header a { display: block; font-size: 1em; padding: .5em .5em .5em .7em; }
.ui-accordion-icons .ui-accordion-header a { padding-left: 2.2em; }
.ui-accordion .ui-accordion-header .ui-icon { position: absolute; left: .5em; top: 50%; margin-top: -8px; }
.ui-accordion .ui-accordion-content { padding: 1em 2.2em; border-top: 0; margin-top: -2px; position: relative; top: 1px; margin-bottom: 2px; overflow: auto; display: none; zoom: 1; }
.ui-accordion .ui-accordion-content-active { display: block; }
/*
*/
div.basic  {
	margin:  0;
	padding: 0;
}
.basic > div 
{
    padding-top: 3px; 
	background-color: transparent;
}
.basic > div.scrolling {
	overflow: auto !important;
}

.basic > div > p 
{    
	margin-bottom : 10px;
	border: none;
	text-decoration: none;
	font-weight: bold;
	font-size: 10px;
	margin: 0px;
	padding: 10px;
}
.basic > a {
	color: #333;
	font-weight: bold;
	font-size: 12px;
	text-decoration: none;
	cursor:pointer;
	display:block;
	padding:5px;
	margin-top: 0;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #999;
	background-image: url("images/tab0.gif");
}
.basic > a.selected ,
.basic > a.active ,
.basic > a:hover {
	color: black;
	background-image: url("images/tab2.gif");
}
.basic > a.active {
	color: #00C;
}

.accordion-header
{
    background-image: url("images/album_open.png");
}

/******************************************************************************* 
 * Tree container
 */
div.ui-dynatree-container
{	
	font-size: 10pt; /* font-family: arial; font size should not be too big */
	white-space: nowrap; 
	padding-top: 5px; 
	background-color: Transparent;  
	/* border: 1px dotted gray; */
}

/* Style, when control is disabled */
.ui-dynatree-disabled div.ui-dynatree-container
{
	/*opacity: 0.5;
	filter: alpha(opacity=50);  Yields a css warning */
	background-color: silver; 
}


/******************************************************************************* 
 * Vertical line image
 */
div.ui-dynatree-container img
{
	width: 16px;
	height: 16px;
	margin-left: 3px;
	vertical-align: top;
	border-style: none;
}

/******************************************************************************* 
 * Common icon definitions
 */
span.ui-dynatree-empty,
span.ui-dynatree-vline,
span.ui-dynatree-connector,
span.ui-dynatree-expander,
span.ui-dynatree-icon,
span.ui-dynatree-checkbox
{
	width: 16px;
	height: 16px;
	display: -moz-inline-box; /* @ FF 1+2 */
	display: inline-block; /* Required to make a span sizeable */
	vertical-align: top;	
	background-repeat: no-repeat;
	background-position: left;	
}

/******************************************************************************* 
 * Lines and connectors
 */
span.ui-dynatree-empty
{
}
span.ui-dynatree-vline
{
	background-image: url("images/dynatree/ltL_ns.gif");
}
span.ui-dynatree-connector
{
	background-image: url("images/dynatree/ltL_nes.gif");
}
.ui-dynatree-lastsib span.ui-dynatree-connector
{
	background-image: url("images/dynatree/ltL_ne.gif");
}

/******************************************************************************* 
 * Expander icon
 * Note: IE6 doesn't correctly evaluate multiples class names,
 *		 so we create combined class names that can be used in the CSS.
 *
 * Prefix: ui-dynatree-exp-
 * 1st character: 'e': expanded, 'c': collapsed
 * 2nd character (optional): 'd': lazy (Delayed)
 * 3rd character (optional): 'l': Last sibling       
 */
 
span.ui-dynatree-expander
{
	background-image: url("images/dynatree/ltP_nes.gif");
	cursor: pointer;
}
.ui-dynatree-exp-cl span.ui-dynatree-expander /* Collapsed, not delayed, last sibling */
{
	background-image: url("images/dynatree/ltP_ne.gif");
}
.ui-dynatree-exp-cd span.ui-dynatree-expander /* Collapsed, delayed, not last sibling */
{
	background-image: url("images/dynatree/ltD_nes.gif");
}
.ui-dynatree-exp-cdl span.ui-dynatree-expander /* Collapsed, delayed, last sibling */
{
	background-image: url("images/dynatree/ltD_ne.gif");
}
.ui-dynatree-exp-e span.ui-dynatree-expander,  /* Expanded, not delayed, not last sibling */
.ui-dynatree-exp-ed span.ui-dynatree-expander  /* Expanded, delayed, not last sibling */
{
	background-image: url("images/dynatree/ltM_nes.gif");
}
.ui-dynatree-exp-el span.ui-dynatree-expander,  /* Expanded, not delayed, last sibling */
.ui-dynatree-exp-edl span.ui-dynatree-expander  /* Expanded, delayed, last sibling */
{
	background-image: url("images/dynatree/ltM_ne.gif");
}


/******************************************************************************* 
 * Checkbox icon
 */
span.ui-dynatree-checkbox
{
	margin-left: 3px;
	background-image: url("images/dynatree/cbUnchecked.gif");
}
span.ui-dynatree-checkbox:hover
{
	background-image: url("images/dynatree/cbUnchecked_hover.gif");
}

.ui-dynatree-partsel span.ui-dynatree-checkbox
{
	background-image: url("images/dynatree/cbIntermediate.gif");
}
.ui-dynatree-partsel span.ui-dynatree-checkbox:hover
{
	background-image: url("images/dynatree/cbIntermediate_hover.gif");
}

.ui-dynatree-selected span.ui-dynatree-checkbox
{
	background-image: url("images/dynatree/cbChecked.gif");
}
.ui-dynatree-selected span.ui-dynatree-checkbox:hover
{
	background-image: url("images/dynatree/cbChecked_hover.gif");
}

/******************************************************************************* 
 * Node type icon
 * Note: IE6 doesn't correctly evaluate multiples class names,
 *		 so we create combined class names that can be used in the CSS.
 *
 * Prefix: ui-dynatree-ico-
 * 1st character: 'e': expanded, 'c': collapsed
 * 2nd character (optional): 'f': folder
 */
 
span.ui-dynatree-icon /* Default icon */
{
	margin-left: 3px;
	background-image: url("images/dynatree/ltDoc.gif");
}

.ui-dynatree-ico-cf span.ui-dynatree-icon  /* Collapsed Folder */
{
	background-image: url("images/dynatree/ltFld.gif");
}

.ui-dynatree-ico-ef span.ui-dynatree-icon, .ui-dynatree-active span.ui-dynatree-icon  /* Expanded Folder */
{
	background-image: url("images/dynatree/ltFld_o.gif");
}

/* Status node icons */

.ui-dynatree-statusnode-wait span.ui-dynatree-icon
{
	background-image: url("images/dynatree/ltWait.gif");	
}

.ui-dynatree-statusnode-error span.ui-dynatree-icon
{
	background-image: url("images/dynatree/ltError.gif");
}

/******************************************************************************* 
 * Node titles
 */

/* Remove blue color and underline from title links */
div.ui-dynatree-container a 
{
	color: #333; /* inherit doesn't work on IE */
	text-decoration: none;
	vertical-align: top;
	margin: 0px;
	margin-left: 3px;	
/*	outline: 0; /* @ Firefox, prevent dotted border after click */
}

div.ui-dynatree-container a:hover
{
	text-decoration: none;
	color: #000;
}

span.ui-dynatree-document a,
span.ui-dynatree-folder a
{
	display: inline-block; /* Better alignment, when title contains <br> */  
/*	vertical-align: top;*/
    padding-top: 3px;
	padding-left: 3px;
	padding-right: 3px; /* Otherwise italic font will be outside bounds */
	/*	line-height: 16px; /* should be the same as img height, in case 16 px */
}
span.ui-dynatree-folder a
{
	font-weight: bold;
}

div.ui-dynatree-container a:focus, span.ui-dynatree-focused a:link  /* @IE */
{
	background-color: #eee !important; /* gray */	
}

span.ui-dynatree-expanded a
{
	
}

span.ui-dynatree-selected a 
{
	color: #333; 	
	font-style: normal;
}

span.ui-dynatree-active a
{
    background-color: #bbb !important;   
    /*color: #fff !important;  @ IE6 */
}
    

