@charset "utf-8";


/* -- Tabs begins -- */

ul.tabs { /* -- The unordered list containing the tabs -- */
	margin:0 0 0 22px;
	padding:0;
	list-style:none;
}

ul.tabs.pop-up { margin:0 0 0 3px; }

ul.tabs li { /* -- Each list item within the above defined unordered list -- */
	display:block;
	margin:0 12px 0 0;
	float:left;
	height:37px;
	background:url(../../images/private/layout/tab-background.png) repeat-x;
	text-align:center;
	font-size:14px;
	font-weight:bold;
	*width:180px; /* -- Sadly, the tabs break on IE7 because of a pixel-width rendering bug. Needs more space -- */
}

ul.tabs li a { /* -- The links within each of the above defined list items -- */
	display:block;
	color:#676767;
	height:27px;
	padding:11px 15px 0 30px;
	background-position:10px 50% !important;
	white-space:nowrap;
}

ul.tabs.pop-up li a { padding:11px 15px 0 15px; }

ul.tabs li:hover a { color:#F90; }
ul.tabs li.current a, ul.tabs li.active a { color:#369; }
ul.tabs li.current, ul.tabs li.active { background:url(../images/private/layout/tab-hover-background.png) repeat-x; }

ul.tabs li a.homepage-icon { background:url(/images/icons/my-homepage.png) no-repeat; padding-left:35px; }
ul.tabs li a.bookmarks-icon { background:url(/images/icons/my-bookmarks.png) no-repeat; }
ul.tabs li a.autologin-icon { background:url(/images/icons/autologin.png) no-repeat left center;}
ul.tabs li a.autologin-icon:hover { background:url(/images/icons/autologin-hover.png) no-repeat left center; }
ul.tabs li a.password-vault-icon { background:url(/images/icons/password-vault.png) no-repeat left center; }

ul.tabs li.current span.left-tab-border, ul.tabs li.active span.left-tab-border {/* -- The left border for the .current state -- */
	display:block;
	margin:0 0 0 -3px;
	float:left;
	width:7px;
	height:37px;
	background:url(/images/private/layout/tab-hover-left-border-background.png) no-repeat;
	cursor:pointer;
}

ul.tabs li.current span.right-tab-border, ul.tabs li.active span.right-tab-border { /* -- Right border for the .current state -- */
	display:block;
	margin:0 -3px 0 0;
	float:right;
	width:7px;
	height:37px;
	background:url(/images/private/layout/tab-hover-right-border-background.png) no-repeat;
	cursor:pointer;
}

ul.tabs li:hover.current a { color:#315B9A; }

ul.tabs li span.left-tab-border { /* -- Left border for the normal state -- */
	display:block;
	margin:0 0 0 -3px;
	float:left;
	width:7px;
	height:37px;
	background:url(/images/private/layout/tab-left-border-background.png) no-repeat;
	cursor:pointer;
}

ul.tabs li span.right-tab-border { /* -- Right border for the normal state -- */
	display:block;
	margin:0 -3px 0 0;
	float:right;
	width:7px;
	height:37px;
	background:url(/images/private/layout/tab-right-border-background.png) no-repeat;
	cursor:pointer;
}

/* -- Private tabs ends -- */


/* -- PAGE BEGINS --
	  Most of this is already set in the public CSS, so only styles SPECIFICALLY
	  for the private pages here please. -- */

/* -- Accordion begins (Left-column multi-state navigation / folder tree.) -- */

.tag-list{
	width: 100%; /* -- Width of the folder list -- */
}

.tag-list .heading{ /* -- For the folder headings (Auto Login, Bookmarks) -- */
	color:#336699;
	font-size:16px;
	background:url(../../images/private/layout/accordion-background.png) top right;
	font-weight:bold;
	margin:0 0 5px 0;
	padding:9px 0 9px 15px;
	cursor: hand;
	cursor: pointer;
	border:1px solid #CCC;
}

.tag-list .open-heading{ /* -- Apply this when the heading is expanded -- */
	background:url(../../images/private/layout/accordion-background.png) bottom right;
}

.tag-list ul{ /* -- Semi-global style for sub-list items (Each list of folders under each heading) -- */
	list-style-type: none;
	margin:0 0 10px 15px;
	padding: 0;
}

.tag-list ul li { 
	padding:0 0 2px 0; 
	position:relative; 
	z-index:9999!important;
} /* -- Spacing between items -- */

.tag-list ul li.separator {
	width:218px;
	height:18px;
	margin:0 0 0 -10px;
	background:url(../images/private/layout/separator-line.png);
}

.tag-list ul li.search h3 { margin:10px 0 0 0; }

.tag-list ul li.search input.text {
	border:1px solid #666;
	padding:2px;
	width:140px;
	color:#666;
}

.tag-list ul li.search input.submit {
	margin:0 0 0 10px;
	padding:1px 5px;
	border:1px solid #006600;
	background:url(../../images/private/layout/search-button-background.jpg) repeat-x;
	cursor:pointer;
	color:#FFF;
	font-size:14px;
	font-weight:bold;
	font-family:Arial, Helvetica, sans-serif;
	text-shadow:0 1px 0 #266426;
}

.tag-list ul li a {
	color: #666;
	display: block;
	padding: 2px 0 2px 20px;
	text-decoration: none;
}

.tag-list ul li a:hover{ /* -- Hover state for default item -- */
	color: #336699;
}

.tag-list ul li a.tag-list-none {
	padding:0 0 0 5px;
	overflow:hidden;
}

.tag-list ul li a.tag-list-default {
	background:url(../../images/icons/bookmark.png) no-repeat left center;
}

.tag-list ul li a.tag-list-deleted-items {
	background:url(../../images/icons/recycle-bin.png) no-repeat left center;
}

.tag-list ul li a.tag-list-deleted-items:hover {
	background:url(../../images/icons/recycle-bin-hover.png) no-repeat left center;
}

.tag-list ul li a.view-more-tags {
	cursor:pointer;
}

.tag-list ul li a.tag-list-autologin {
	background:url(../../images/icons/autologin.png) no-repeat left center;
}

.tag-list ul li a.tag-list-autologin:hover {
	background:url(../../images/icons/autologin-hover.png) no-repeat left center;
}




.tag-list ul li a.tag-list-bookmark {
	background:url(../../images/icons/my-bookmarks-grey.png) no-repeat left center;
}

.tag-list ul li a.tag-list-bookmark:hover {
	background:url(../../images/icons/my-bookmarks.png) no-repeat left center;
}


.tag-list ul li a.tag-list-import-bookmark {
	background:url(../../images/icons/my-bookmarks-grey.png) no-repeat left center;
}

.tag-list ul li a.tag-list-import-bookmark:hover {
	background:url(../../images/icons/my-bookmarks.png) no-repeat left center;
}




.tag-list ul li a.tag-list-view-all {
	background:url(../../images/icons/bookmarks-grey.png) no-repeat left center;
}

.tag-list ul li a.tag-list-view-all:hover {
	background:url(../../images/icons/bookmarks.png) no-repeat left center;
}

.tag-list ul li a.tag-list-edit {
	background:url(../images/icons/bookmarks.png) no-repeat left center;
}

.tag-list ul li a.add-new-tags {
		background:url(../../images/icons/add-bookmark-grey.png) no-repeat left center;
}	

.tag-list ul li a.add-new-tags:hover {
		background:url(../../images/icons/add-bookmark.png) no-repeat left center;
}	

	.tag-list ul li a.add-new-folder {
		background:url(../images/private/layout/icons/navs-folder-add.png) no-repeat left center;
}	
	.tag-list ul li a.add-new-folder:hover {
		background:url(../images/private/layout/icons/navs-folder-add-hover.png) no-repeat left center;
}		
	.tag-list ul li a.edit-folders {
		background:url(../images/private/layout/icons/navs-folder-edit.png) no-repeat left center;
}	
	.tag-list ul li a.edit-folders:hover {
		background:url(../images/private/layout/icons/navs-folder-edit-hover.png) no-repeat left center;
}
	.tag-list ul li a.home-page {
		background:url(../images/private/layout/icons/navs-folder-home.png) no-repeat left center;
}	
	.tag-list ul li a.home-page:hover {
		background:url(../images/private/layout/icons/navs-folder-home-hover.png) no-repeat left center;
}	
	
.tag-list ul li a.current {
	color:#336699;
	font-weight:bold;
}

/* -- Left-hand boxes begins -- */

.left-column .left-informational {
	padding:10px 10px 0 10px;
	background:url(/images/private/layout/informational-bg.png) repeat-x top;
	border:1px solid #CCC;
	margin:20px 0 0 0;
	font-size:13px;
	color:#666666;
}

.left-informational ul {
	padding:0 0 0 15px;
	*margin:10px 5px; /* -- IE7 looks at this in its own way, so we have to use quirks to force it to standard -- */
	list-style-image:url(/images/private/layout/icons/arrow-bullet-grey.png);
}
	
	.left-informational h3 { margin:0; }
	.left-informational ul li { margin:0 0 5px 0; }
	.left-informational#things-to-do h3 { color:#F60; font-weight:bold; }
	.left-informational#security h3 { color:#666; font-weight:bold; }
	.left-informational#bookmark-setup h3 { color:#666; font-weight:bold; }

/* -- Left-hand boxes ends -- */

/* -- Left column ends -- */


/* -- FOLDER VIEW -- 
	  This is for the "Edit folders" page. It styles the list of folders, their respective
	  "edit" and "delete" buttons, and the typography within. -- */

ul#all-folders-view {
	list-style:none;
	margin:0;
	padding:0;
	width:100%;
	float:left;
}

	ul#all-folders-view { border-top:1px solid #CCC; }

ul#all-folders-view li {
	border-bottom:1px solid #CCC;
	overflow:hidden;
}

	ul#all-folders-view li:hover { background:#DEF; }

ul#all-folders-view li a {
	font-size:16px;
	font-weight:bold;
	color:#336699;
	padding:10px 0;
	display:block;
	float:left;
}

	ul#all-folders-view li a:hover { color:#333; }

	ul#all-folders-view li ul.edits {
		float:right;
		width:200px;
		padding:13px 0 0 0;
		list-style:none;
}

	ul#all-folders-view li ul li {
		border:none;
		float:right;
		margin:0 0 0 15px;
}

	ul#all-folders-view li ul li a {
		font-size:14px;
		font-weight:normal;
		line-height:14px;
}

		ul#all-folders-view li ul li a.delete {
			padding:1px 0 1px 18px;
			background:url(/images/private/layout/icons/icon_folder_delete.png) no-repeat;
}

		ul#all-folders-view li ul li a.delete:hover {
			background:url(/images/private/layout/icons/icon_folder_delete_hover.png) no-repeat;
			color:#333;
}

		ul#all-folders-view li ul li a.edit {
			padding:1px 0 1px 18px;
			background:url(/images/private/layout/icons/icon_edit_folder.png) no-repeat;
}

		ul#all-folders-view li ul li a.edit:hover {
			background:url(/images/private/layout/icons/icon_edit_folder_hover.png) no-repeat;
			color:#333;
}

.folder-options {
	display:block;
	float:left;
	clear:both;
	font-size:11px;
	text-transform:uppercase;
	width:175px;
}

.folder-options a {
	color:#666;
	padding:2px 10px 0 20px;
	display:block;
	float:left;
	margin:0 20px 0 0;
}

.folder-options a:hover { color:#369; }

.folder-options a.edit { background:url(/images/private/layout/icons/icon_edit_folder.png) no-repeat; }
.folder-options a.edit:hover { background:url(/images/private/layout/icons/icon_edit_folder_hover.png) no-repeat; }

.folder-options a.delete { background:url(/images/private/layout/icons/icon_folder_delete.png) no-repeat; }
.folder-options a.delete:hover { background:url(/images/private/layout/icons/icon_folder_delete_hover.png) no-repeat; }

/* -- Folder view ends -- */

/* -- Post-registration boxes begins -- */
.post-register-message,
#post-register-message {
	border:2px solid #393;
	background:url(/images/private/layout/post-registration-message-bg.png) repeat-x top;
	padding:10px;
	overflow:hidden;
	text-shadow:0 1px 0 #FFF;
	margin:0 0 20px 0;
}
.post-register-message h3,
#post-register-message h3 {
	color:#393;
	font-size:18px;
	font-weight:bold;
	float:left;
	margin:0 0 20px 0;
}
.post-register-message a.close-this,
#post-register-message a.close-this {
	float:right;
	text-align:right;
	font-size:12px;
	text-transform:uppercase;
	color:#999;
}
.post-register-message p,
#post-register-message p {
	float:left;
	text-align:justify;
	color:#666;
	font-size:13px;
	width:100%;
	*margin:10px 0;
}
.post-register-message a.close-this strong,
#post-register-message a.close-this strong { font-family:"Arial Black", Arial, Helvetica, sans-serif; }

/* -- The numbered list -- */
.post-register-message ol, .numbered-list,
#post-register-message ol, .numbered-list {
	margin:0;
	padding:0;
	list-style:none;
	float:left;
	font-size:13px;
	color:#336699;
	line-height:16px;
}
.post-register-message ol li, .numbered-list,
#post-register-message ol li, .numbered-list {
	display:inline-block;
	width:160px;
	float:left;
}

.numbered-list {
	display:block
}
.post-register-message ol li.one, .numbered-list li.one,
#post-register-message ol li.one, .numbered-list li.one {
	background:url(/images/private/layout/number-list/one.png) no-repeat top left;
	padding:0 0 0 20px;
	margin:0;
	margin:0 0 0 10px;
}
.post-register-message ol li.oneIE, .numbered-list li.oneIE,
#post-register-message ol li.oneIE, .numbered-list li.oneIE {
	background:url(/images/private/layout/number-list/oneIE.png) no-repeat top left;
	padding:0 0 0 20px;
	margin:0;
	margin:0 0 0 10px;
}
.post-register-message ol li.one a.bookmark-button, .numbered-list li.one a.bookmark-button,
#post-register-message ol li.one a.bookmark-button, .numbered-list li.one a.bookmark-button {
	display:block;
	margin:3px 0 0 0;
	width:130px;
	text-align:center;
	padding:5px 0;
}
.post-register-message ol li.two, .numbered-list li.two,
#post-register-message ol li.two, .numbered-list li.two {
	background:url(/images/private/layout/number-list/two.png) no-repeat top left;
	padding:0 0 0 25px;
	margin:0 0 0 50px;
}
.post-register-message ol li.three, .numbered-list li.three,
#post-register-message ol li.three, .numbered-list li.three {
	background:url(/images/private/layout/number-list/three.png) no-repeat top left;
	padding:0 0 0 25px;
	margin:0 0 0 50px;
}

.numbered-list li.one, .numbered-list li.two, .numbered-list li.three {
	margin:10px 0;
}

/* -- Pagination begins -- */

#pagination {
	border:1px solid #CCC;
	width:99%;
	background:#EFEFEF;
	text-shadow:0 1px 0 #FFF;
	clear:both;
	float:left;
	padding:4px;
	margin:30px 0 0 0;
}

#pagination .left { float:left; margin:2px 0 0 0; }
#pagination .right { float:right; }

#pagination .right a {
	padding:3px 5px;
	background:#FFF;
	border:1px solid #CCC;
	color:#333;
	float:right;
	margin:0 0 0 3px;
}
	#pagination .right a:hover { border:1px solid #666; }
	#pagination .right a.disabled { color:#ADADAD; }


h1.bookmarks { float:left; margin:0; }

/* -- Pagination ends -- */

/* -- BOOKMARKS THUMBNAILS BEGINS -- 
	  This is where the thumbnails for the bookmarks and Auto-login
	  pages goes. These should be uinform wherever possible. -- */
	  
.thumbnails {
	width:100%;
	margin:15px auto 30px auto;
}

.thumbnail { /* -- The picture in the "Edit bookmark" section -- */
	display:block;	
	margin:0 0 10px 0;
	padding:2px;
	border:1px solid #DDDDDD;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
}

.bookmark {
	width:231px;
	float:left;
	height:200px;
}

.thumb {
	z-index: 0;
	width: 218px;
	height: 156px;
	position: relative;
}

.thumbnails.my-homepage .bookmark { margin:0 0 0 6px; }

.thumb a img {
	z-index: 1;
	border:3px solid #698CAD;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
}

.thumb:hover a img { border-color:#666; }

/* -- Always display none until fired on hover below -- */
.thumb a.autologin-available,
.thumb a.autologin-now
	{ display: none; }

/* -- Tells the image to have an orange border if class set to "autologin-available" -- */
.thumb.autologin-available:hover a img { border-color:#E68D1C; }

/* -- Tells the image to have a green border if class set to "autologin-now" -- */
.thumb.autologin-now:hover a img { border-color:#339933; }

/* -- Give the messages shape and dimensions -- */
.thumb.autologin-available:hover a.autologin-available,
.thumb.autologin-now:hover a.autologin-now {
	display: block;
	position: absolute;
	width:192px;
	bottom: 3px;
	left:3px;
	z-index: 2;
	padding:10px 0 10px 20px;
	text-align:center;
	color: #FFF;
	font-weight: bold;
}

/* -- Define the colours of the messages -- */
.thumb.autologin-now:hover a.autologin-now {
	background:url(/images/private/layout/green-visibility.png) no-repeat center;
	text-shadow:0 1px 1px #367C36;
}
.thumb.autologin-available:hover a.autologin-available {
	background:url(/images/private/layout/orange-visibility.png) no-repeat center;
	text-shadow:0 1px 1px #B17426;
}

.thumb-options { /* -- The text link and the button that opens the menu -- */
	width:218px;
	margin:5px 0 0 0;
}

.thumb-options.homepage {
    *margin:-20px 0 0 0;
}

.thumb-options .text-link-fade {
	display:block;
	width:10px;
	height:16px;
	margin:-16px 0 0 0;
	background:url(/images/private/layout/links-fade-out.png) no-repeat left center;
	position:relative;
	z-index:1;
	float:right;
}

.details .text-link-fade {
	display:block;
	width:10px;
	height:16px;
	margin:-16px -8px 0 0;
	background:url(/images/private/layout/links-fade-out.png) no-repeat left center;
	position:relative;
	z-index:1;
	float:right;
}

.text-link {
	width:150px;
	height:16px;
	overflow:hidden;
	float:left;
}

.thumb-options a.text-link {
	position:relative;
	z-index:0;
}



/* -- Bookmarks thumbnail options -- */

.open-options-menu {
	display:block;
	padding:2px 16px 2px 3px;
	border:1px solid #369;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	text-transform:uppercase;
	overflow:hidden;
	margin:0;
	float:right;
	font-size:9px;
	background: #B9E9FF url(/images/private/layout/icons/arrow-up.png) no-repeat right center;
}

.open-options-menu-click {
	background:#F60 url(/images/private/layout/icons/arrow-down.png) no-repeat right center;
	border-color:#A50;
	color:#FFF;
}

.open-options-menu-click:hover {
	color:#FFF;
}

.options-menu {
	display:none;
	width:202px;
	padding:25px 0 0 10px;
	height:125px;
	background:url(/images/private/layout/drop-down-bg.png) repeat-x top;
	list-style:none;
	position:absolute;
	z-index:3;
	bottom:0;
	margin:0 0 3px 3px;
	*margin:0 0 3px -219px;
}

.options-menu-opened {
	display:block;
	width:202px;
	padding:25px 0 0 10px;
	height:117px;
	background:url(/images/private/layout/drop-down-bg.png) repeat-x top;
	list-style:none;
	position:absolute;
	z-index:3;
	bottom:0;
	margin:0 0 3px 3px;
	*margin:0 0 3px -219px;
}


.options-menu li a,
div.list-view ul li a{
	color:#666;
	font-size:12px;
	display:block;
	padding:1px 0 1px 20px;
	line-height:14px;
	margin:4px 0;
}

div.list-view ul li a:hover, .options-menu li a:hover { color:#369; }

.options-menu li a.heading {
	font-weight:bold;
	font-size:14px;
	color:#336699;
	padding:0 0 10px 0;
	display:block;
	width:190px;
	height:6px;
	overflow:hidden;
}

.options-menu li a.visit, div.list-view ul li a.visit { background:url(/images/private/layout/icons/icon_visit.png) no-repeat; } 
.options-menu li a.visit:hover, div.list-view ul li a.visit:hover { background:url(/images/private/layout/icons/icon_visit_hover.png) no-repeat; }

.options-menu li a.add-to-myhomepage, div.list-view ul li a.add-to-myhomepage { background:url(/images/private/layout/icons/page_white_add.png) no-repeat; } 
.options-menu li a.add-to-myhomepage:hover, div.list-view ul li a.add-to-myhomepage:hover { background:url(/images/private/layout/icons/page_white_add_hover.png) no-repeat; }

.options-menu li a.remove-from-myhomepage, div.list-view ul li a.remove-from-myhomepage { background:url(/images/private/layout/icons/icon_delete.png) no-repeat; } 
.options-menu li a.remove-from-myhomepage:hover, div.list-view ul li a.remove-from-myhomepage:hover { background:url(/images/private/layout/icons/icon_delete_hover.png) no-repeat; }

.options-menu li a.edit-autologin, div.list-view ul li a.edit-autologin { background:url(/images/private/layout/icons/icon_login.png) no-repeat; } 
.options-menu li a.edit-autologin:hover, div.list-view ul li a.edit-autologin:hover { background:url(/images/private/layout/icons/icon_login_hover.png) no-repeat; }

.options-menu li a.edit-bookmark, div.list-view ul li a.edit-bookmark { background:url(/images/private/layout/icons/icon_edit.png) no-repeat; } 
.options-menu li a.edit-bookmark:hover, div.list-view ul li a.edit-bookmark:hover { background:url(/images/private/layout/icons/icon_edit_hover.png) no-repeat; }

.options-menu li a.delete,
div.list-view ul li a.delete { background:url(/images/private/layout/icons/icon_delete.png) no-repeat; } 
.options-menu li a.delete:hover, div.list-view ul li a.delete:hover { background:url(/images/private/layout/icons/icon_delete_hover.png) no-repeat; }

.options-menu li a.tag-this,
div.list-view ul li a.tag-this { background:url(/images/icons/tag-this.png) no-repeat left center; cursor:pointer; } 
.options-menu li a.tag-this:hover, div.list-view ul li a.tag-this:hover { background:url(/images/icons/tag-this-hover.png) no-repeat left center; }

.options-menu li a.email-this,
div.list-view ul li a.email-this { background:url(/images/icons/email-this.png) no-repeat left center; cursor:pointer; } 
.options-menu li a.email-this:hover, div.list-view ul li a.email-this:hover { background:url(/images/icons/email-this-hover.png) no-repeat left center; }


/* -- Bookmarks detail view -- */

div.detail-view { /* -- WARNING! This is also the name of the view switch class (use "div" before the class). -- */
	overflow:hidden;
	margin:10px 0 20px 0;
	padding:0 0 15px 0;
	border-bottom:1px solid #EEEEEE;
}

.detail-view .thumb-left {
	float:left;
}

.detail-view .thumb-right {
	float:right;
	width:440px;
}

div.detail-view.myhomepage .thumb-right { width:75%; }

div.detail-view h3 { margin:0 0 10px 0; }

.bookmark-detail a.url { color:#008000; text-decoration:none; }

/* -- Bookmarks detail view ends -- */


/* -- Bookmarks list view -- */

div.list-view { /* -- WARNING! This is also the name of the view switch class (use "div" before the class). -- */
	width:98%;
	margin:10px 0 0 0;
	border:1px solid #EEEEEE;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	padding:1px 5px;
	overflow:hidden;
	float:left;
	clear:both;
}

div.list-view:hover { border-color:#CCC; background:#FEFEFE; }

div.list-view h3 { margin:0; }
div.list-view p { margin:0; }

div.list-view .bookmark-detail {
	float:left;
	width:70%;
}

div.list-view ul {
	float:right;
	margin:0;
	padding:0 0 0 15px;
	list-style:none;
	background:url(/images/private/layout/options-ul-bg.png) no-repeat left center;
}

div.list-view .bookmark-detail .details h3 { font-weight:normal; font-size:14px; padding:4px 0 0 0; }

.list-view.myhomepage { 
	float:left;
	width:47%;
	margin:10px 10px 0 0;
}

.list-view.myhomepage .bookmark-detail .details h3 {
	width:320px;
	height:16px;
	overflow:hidden;
}

/* -- VIEW SWITCHER -- 
	  This is where we define the style for the bookmark view switcher -- */
	  
.view-switcher {
	width:200px;
	float:right;
	text-align:right;
	list-style:none;
	margin:0;
	padding:0;
}

.view-switcher.autologin { margin:20px 5px -10px 0; }

.view-switcher li { display:inline; }

.view-switcher li a {
	font-size:12px;
	color:#333;
	padding:1px 0 0 20px;
	line-height:12px;
	margin:0 0 0 10px;
	color:#666;
}

.view-switcher li a.tile-view { background:url(/images/private/layout/icons/icon_grid.png) no-repeat; }
.view-switcher li a.tile-view.active {
	background:url(/images/private/layout/icons/icon_grid_hover.png) no-repeat;
	color:#369;
}

.view-switcher li a.list-view { background:url(/images/private/layout/icons/icon_detail.png) no-repeat; }
.view-switcher li a.list-view.active {
	background:url(/images/private/layout/icons/icon_detail_hover.png) no-repeat;
	color:#369;
}

.view-switcher li a.detail-view { background:url(/images/private/layout/icons/icon_list.png) no-repeat; }
.view-switcher li a.detail-view.active {
	background:url(/images/private/layout/icons/icon_list_hover.png) no-repeat;
	color:#369;
}

.autologin-switch {
	font-size:12px;
	margin:-24px 0 10px 225px;
}

.autologin-switch a {
	color:#333;
	padding:0 5px;
}
.autologin-switch a.disabled { color:#999; }


/* -- AUTO-LOGIN FORM -- 
	  This is the set-up / edit form for Auto-login. -- */

.auto-login-form {
	float:left;
	width:90%;
}

.auto-login-form input.text {
	font-size:14px;
	font-family:Arial, Helvetica, sans-serif;
	background:#FFF;
}

.auto-login-form label { font-weight:bold; cursor:pointer; }

.auto-login-form input.text, .newFolderName {
	width:415px;
	border:1px solid #666;
	padding:3px;
	color:#333;
	margin:0 0 15px 0;
}

.auto-login-form #actions { /* -- Puts buttons on the right -- */
	width:100%;
	display:block;
	text-align:right; 
}

.select-form {
	display:block;
	width:100%;
	margin:0 0 5px 0;
	padding:2px;
	border:1px solid #959595;
	background:#FFF;
	outline:none;
}

.select-results { width:200px; margin:0 5px 0 0; float:left;}
.image-select-results { width:140px; margin:0 5px 2px 0;}

.textarea-form {
	display:block;
	width:100%;
	height:100px;
	margin:0 0 5px 0;
	padding:2px;
	border:1px solid #959595;
	background:#FFF;
	font-size:12px;
	font-family:Arial, Helvetica, sans-serif;
}


/* -- Action buttons for forms -- */

.action-button {
	padding:5px 0 5px 18px !important;
	*padding:5px 0 5px 20px !important;
	cursor:pointer;
	font-weight:bold;
	font-size:16px !important;
	color:#666;
	border:0;
	margin:0 0 0 10px;
}

.action-button:hover { color:#369; }
	

.action-button.save-button {
	background:url(../../images/private/layout/icons/tick.png) no-repeat left center !important;
}
.action-button.save-button:hover {
	background:url(../../images/private/layout/icons/tick_hover.png) no-repeat left center !important;
}

.action-button.delete-button {
	background:url(../../images/private/layout/icons/cross.png) no-repeat left center !important;
}
.action-button.delete-button:hover {
	background:url(../../images/private/layout/icons/cross_hover.png) no-repeat left center !important;
}

.action-button.password-button {
	background:url(../../images/private/layout/icons/password.png) no-repeat left center !important;
}
.action-button.password-button:hover {
	background:url(../../images/private/layout/icons/password_hover.png) no-repeat left center !important;
}


/* -- Page content ends -- */

.pointer { cursor:pointer!important;} /* -- Class for setting the cursor as a pointer -- */


a.make-this {
	display:block;
	float:left;
	margin:5px 0 0 20px;
	padding:5px 0;
	color:#FFF;
	border:1px solid #C60;
	background:#F60 url(/images/layout/orange-button-bg.png) repeat-x top;
	text-shadow:0 1px 1px #B95C00;
	font-weight:bold;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	text-align:center;
	font-size:14px;
	width:210px;
	overflow:hidden;
}

a.make-this:hover {
	color:#333;
	text-shadow:0 1px 0 #F96;
}

.add-new-folder {
	/*float:right;*/
}
.add-new-folder label {
	color:#369;
	font-weight:bold;
	cursor:pointer;
}
.add-new-folder input {
	border:1px solid #666;
	color:#333;
	padding:2px;
	
}




/* -- Start Drag and Drop Styles -- */

#OrderedList {
	list-style: none;
	padding:0;
	margin:0;
}

#OrderedList li {
	display:block;
	float:left;
	width:221px;
	margin:0 0 0 8px;
}

#OrderedList li.ui-sortable-placeholder {
	background:#F9F9F9;
	border:2px dashed #CCC;
	visibility:visible!important;
	margin:0 0 0 4px;
	height:200px;
}

#OrderedListSmall {
	list-style: none;
	padding:0;
	margin:0;
}

#OrderedListSmall li {
	display:block;
	width:100%;
	margin:0 0 0 8px;
	float:none;
}

#OrderedListSmall li.ui-sortable-placeholder {
	display:block;
	background:#F9F9F9;
	border:2px dashed #CCC;
	visibility:visible!important;
	height:20px;
	width:99%;
	margin:10px 0 4px 8px;
	float:none;
}

#OrderedListDetail {
	list-style: none;
	padding:0;
	margin:0;
}

#OrderedListDetail li {
	display:block;
	float:left;
	margin:10px 0 0 8px;
}

#OrderedListDetail li.ui-sortable-placeholder {
	background:#F9F9F9;
	border:2px dashed #CCC;
	visibility:visible!important;
	margin:10px 0 40px 4px;
	height:200px;
}

#OrderedListDetail .thumb-right {
	margin:0 0 0 10px;
}

#OrderedListFull {
	list-style: none;
	padding:0;
	margin:0;
}

#OrderedListFull li {
	display:block;
	float:left;
	margin:0;
	padding:0;
}

#OrderedListFull li.ui-sortable-placeholder {
	background:#F9F9F9;
	border:2px dashed #CCC;
	visibility:visible!important;
	margin:0 19px 20px 0;
	height:176px;
	width:214px!important;
}

#OrderedListFull a.visit {
	display:block!important;
	float:none!important;
}

#OrderedListHomepageList {
	list-style:none;
	padding:0;
	margin:0;
}

#OrderedListHomepageList li {
	display:block;
	margin:0;
	padding:0;
	width:976px!important;
	cursor:move;
}

#OrderedListHomepageList li.ui-sortable-helper {
	display:block;
	margin:0;
	padding:0;
	width:945px!important;
}

#OrderedListHomepageList li.ui-sortable-placeholder {
	background:#F9F9F9;
	border:2px dashed #CCC;
	visibility:visible!important;
	width:945px!important;
	height:24px;
	margin:10px 10px 0 0;
	float:left;
}

#OrderedListHomepageList a.visit {
	display:block!important;
	float:none!important;
}

#OrderedListHomepageList li div ul li a {
	width:100px;
}

#OrderedListHomepageList li ul {
	width:120px;	
}

#OrderedListHomepageList li ul li {
	width:120px;	
}

ul.folders li.ui-draggable-dragging {
	display:inline-block;
	background:#FFF;
	padding:2px;
	min-width:60px;
}

#OrderedListHomepageOrganise {
	list-style: none;
	padding:0;
	margin:0;
	width:1000px;
}

#OrderedListHomepageOrganise li {
	display:block;
	float:left;
	margin:0;
	padding:0;
	width:120px;
	margin:5px 18px 5px 0;
}

#OrderedListHomepageOrganise li a img {
	border:3px solid #698CAD;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
}
	
#OrderedListHomepageOrganise li a {
	display:block;
	float:none;
	margin:0;
	padding:0;
}

#OrderedListHomepageOrganise li.ui-sortable-placeholder {
	background:#F9F9F9;
	border:2px dashed #CCC;
	visibility:visible!important;
	width:116px;
	height:76px;
	margin:23px 18px 4px 0;
}

.longoptions {
	width:350px	
}

#OrderedListDetailHome {
	list-style: none;
	padding:0;
	margin:0;
}

#OrderedListDetailHome li {
	display:block;
	float:left;
	margin:10px 0 0 8px;
	width:99%;
}

#OrderedListDetailHome li.ui-sortable-placeholder {
	background:#F9F9F9;
	border:2px dashed #CCC;
	visibility:visible!important;
	margin:10px 0 40px 4px;
	height:200px;
}


#OrderedListDetailHome .thumb-right {
	margin:0 0 0 10px;
	width:75%;
}

/* -- End Drag and Drop Styles -- */

span.tag {
	background:#F9F9F9;
	border:1px solid #E9E9E9;
	display:block; 
	padding:4px; 
	margin:0 5px 0 0;
	min-width:40px;	
	max-width:300px;	
	float:left;
}

a.pointer {
	cursor:pointer;	
}

.droptofolder {
	position:absolute;
	z-index:2!important;
	width:310px;
	height:40px;
	margin:-30px 0 0 -40px;
}

.droptopage {
	position:absolute;
	z-index:2!important;
	min-width:20px;
	height:20px;
	margin:-18px 0 0 -6px;
}
.ui-multidraggable {
	font-weight:bold;
	display:block;
	cursor:grabbing;
	cursor: -moz-grabbing;
}

.move-to-page {
	background:#F9F9F9;
	border:2px dashed #CDE3FC;
	color:#777;
	padding:20px;
	margin:10px 0 0 10px;
	text-align:center;
	width:42%;
	float:left;
	display:none;
}

li.tags-folder a {
	background:;
}

li.tags a {
	background:url(../images/icons/bookmark-tag.png) no-repeat!important;
	margin:5px 0 0 0;
}

.more-tags {
	display:none;
	min-height:1px;
}


a.delete-bookmark {
	display:block;
	color:#666;
	text-shadow:0 1px 0 #FFF;
	cursor:default;
	margin:10px 0 0 0;
	padding:20px 0;
	background:#EFEFEF;
	text-align:center;
	border:1px solid #CCC;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	border-radius:2px;
}

a.trash:hover {
	color:#666;
}

a.tag {
	background: url(../images/icons/bookmark-tag.png) no-repeat;
	padding:0 0 2px 20px;
	cursor:pointer;	
}

#tag-list-alphabet {
	width:350px;
	height:200px;
	overflow:auto;
	border:1px solid #EEEEEE;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	border-radius:2px;
}

#tag-list-popularity {
	width:200px;
	height:200px;
	overflow:auto;
	float:left;
	border:1px solid #369;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;
	margin:0 10px;
}

#tag-list-selected {
	width:200px;
	height:200px;
	overflow:auto;
	float:left;
	border:1px solid #369;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;
}


#popup-container {
	width:630px;
	height:260px;
	overflow:hidden;
}

#tags-popup h2 {
	font-size:22px;
	color:#369;
	font-weight:normal;
	margin:0 0 10px 0;
}

#switch-views{
	font-size:12px;
	width:600px;
	float:left;
	padding:0 0 10px 0;
}

#switch-views a {
	padding:0 10px 0 0;
}




#sortable1, #sortable2, #sortable3, #sortable4 {
	list-style-type: none;
	margin:0;
	padding:0 0 100px 0;
	float:left;
	width:216px;
	min-height:500px;
}

.my-homepage #sortable1, .my-homepage #sortable2, .my-homepage #sortable3 { margin:0 28px 0 0; }

.thumbnails #sortable1, .thumbnails #sortable2 { margin:0 25px 0 0; }

#sortable1 li, #sortable2 li, #sortable3 li, #sortable4 li {
	width: 216px;
	height:216px;
	padding:5px;
	border:2px solid transparent;
}

#sortable1 li ul li, #sortable2 li ul li, #sortable3 li ul li, #sortable4 li ul li {
	width: auto;
	height:auto;
	padding:0;
	border:none;
}

.my-homepage #sortable1, .thumbnails #sortable1 { margin-left:-10px; }

.ui-state-highlight {
	height: 200px;
	border:2px dashed #CCC !important;
	width: 216px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
	background:#FFF url(../images/misc/drop-here.gif) no-repeat center 20px !important;
}



a.tag-this {
	background:url(../images/icons/bookmark.png) no-repeat left center;
}












/* -- Tags control panel -- */

.tabs-container {
	width: 560px;
	margin: 10px auto;
	background:url(../images/private/layout/tabs-seperator-shadow.png) repeat-x bottom;
}

ul.sort-tabs {
	margin: 0;
	padding: 0;
	float: left;
	list-style: none;
	height: 32px;
	border-bottom: 1px solid #999;
	border-left: 1px solid #999;
	width: 100%;
}

ul.sort-tabs li {
	float: left;
	margin: 0;
	padding: 0;
	height: 31px;
	line-height: 31px;
	border: 1px solid #999;
	border-left: none;
	margin-bottom: -1px;
	background: #EEEEEE;
	overflow: hidden;
	position: relative;
	text-shadow:0 1px 0 #FFF;
}

ul.sort-tabs li a {
	text-decoration: none;
	color: #000;
	display: block;
	font-size: 1.2em;
	padding: 0 20px;
	border: 1px solid #fff;
	outline: none;
}

ul.sort-tabs li a:hover {
	background: #ccc;
	text-shadow:#DDDDDD;
}	

html ul.sort-tabs li.active, html ul.sort-tabs li.active a:hover  {
	background: #fff;
	border-bottom: 1px solid #fff;
}

.tab_container {
	border: 1px solid #b7b7b7;
	border-top: none;
	clear: both;
	float: left; 
	width: 100%;
	background: #fff;
}

.tab_content {
	padding: 20px;
	height:200px;
	overflow:auto;
}

.tab_content h2 {
	font-weight:normal;
	font-size:18px;
	color:#333;
	margin:0 0 10px 0;
}

.add-tags-form {
	float:left;
	width:350px;
}

.search-tags-form {
	float:left;
	margin:10px 0 0 10px;
}

.search-tags-form span, .add-tags-form span {
	font-weight:bold;
	display:block;
	margin:0 0 4px 0;
}

.search-tags-form input.text, .add-tags-form input.text {
	width:230px;
	padding:5px;
	border:1px solid #336699;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	background:#FFF;
	font-size:14px;
	color:#333;
	float:left;
	margin:0 5px 0 0;
}

.search-tags-form input.text:focus, .add-tags-form input.text:focus {
	border-color:#06C;
	-moz-box-shadow:0 0 10px #09F;
}

.search-tags-form input.button, .add-tags-form input.button {
	padding:4px 20px;
	*padding:4px 10px;
	border:1px solid #369;
	background:#336699 url(../../images/private/blue-button-bg.png) repeat-x top;
	color:#FFF;
	text-shadow:0 1px 1px #003366;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
}



/* jqModal base Styling courtesy of;
	Brice Burgess <bhb@iceburg.net> */

/* The Window's CSS z-index value is respected (takes priority). If none is supplied,
	the Window's z-index value will be set to 3000 by default (via jqModal.js). */
	
.jqmWindow {
    display: none;
    position: fixed;
    top: 17%;
    left: 50%;
    margin-left: -300px;
    width: 590px;
    background-color: #FFFFFF;
    color: #333;
    border: 10px solid #666;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	z-index:99999;
	overflow:hidden;
}

.jqmOverlay { background:none; }

/* Fixed posistioning emulation for IE6
     Star selector used to hide definition from browsers other than IE6
     For valid CSS, use a conditional include instead */
* html .jqmWindow {
     position: absolute;
     top: expression((document.documentElement.scrollTop || document.body.scrollTop) + Math.round(17 * (document.documentElement.offsetHeight || document.body.clientHeight) / 100) + 'px');
}

.dialogue-footer {
	min-width:500px;
	padding:10px;
	background:#EEEEEE;
	border-top:1px solid #369;
	margin:20px 0 0 0;
	text-shadow:0 1px 0 #FFF;
	overflow:hidden;
	*float:left;
}

.dialogue-footer a.cancel {
	float:right;
	padding:2px 0 2px 20px;
	color:#333;
	margin:25px 0 0 0;
	background:url(../../images/private/layout/icons/cross.png) no-repeat left center;
}

.dialogue-footer a.save {
	float:right;
	padding:2px 0 2px 20px;
	color:#333;
	margin:25px 0 0 10px;
	background:url(../../images/private/layout/icons/tick.png) no-repeat left center;
}

.dialogue-footer a.save:hover {
	color:#369;
	background:url(../../images/private/layout/icons/tick_hover.png) no-repeat left center;
}

.dialogue-footer a.cancel:hover {
	color:#369;
	background:url(../../images/private/layout/icons/cross_hover.png) no-repeat left center;
}

.dialogue-header {
	padding:10px;
	overflow:hidden;
	background:#369;
}

.dialogue-header h2 {
	font-size:24px;
	color:#FFF;
	text-shadow:0 1px 1px #036;
	font-weight:normal;
	margin:0;
}

.dialogue-subheader {
	min-width:500px;
	padding:5px 10px;
	background:#EEEEEE;
	border-bottom:1px solid #369;
	overflow:hidden;
}

.dialogue-subheader h3 {
	font-weight:normal;
	margin:0;
	color:#333;
	font-size:14px;
	text-shadow:0 1px 0 #FFF;
}

.tag label.tag-label {
	color:#333;
}

.tag label.tag-label:hover {
	color:#369;
}

.tag label.selected {
	font-weight:bold;
	color:#369;
}


.ui-sortable-helper {
	position:relative;
	z-index:9999999 !important;
}



.image-handle {
	margin:-25px 0 0 0;
	position:relative;
	z-index:0;
}

img.handle {
	cursor:grab;
	cursor: -moz-grab;
	z-index:1 !important;
	position:relative;
	margin:0 0 -5px 188px;
	width:24px;
	height:24px;
}

img.handle:hover 
{
    width:32px;
    height:32px;
    margin:0 0 -13px 180px;
}






#tipped{
	/* position & display are necessary */
	position:absolute;
	display:none;
	margin:-35px 0 0 -135px;
	
	/* The rest are just to make it look good & can be changed as you want */
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	border-radius:2px;
	-moz-box-shadow:0 2px 5px rgba(0,0,0,0.7);
	-webkit-box-shadow:0 2px 5px rgba(0,0,0,0.7);
	box-shadow:0 2px 5px rgba(0,0,0,0.7);
	background-color:#FFF;
	padding:5px;
}

/* The tip content gets inserted into this element */
#tipped-content{}

#loading {
 	width: 200px;
 	height: 100px;
 	background-color: #c0c0c0;
 	position: absolute;
 	left: 50%;
 	top: 50%;
 	margin-top: -50px;
 	margin-left: -100px;
 	text-align: center;
}


a.tag-this-edit { background:url(../../images/icons/tag-this.png) no-repeat left center; padding:1px 0 1px 20px; }
a.tag-this-edit:hover { background:url(../../images/icons/tag-this-hover.png) no-repeat left center; padding:1px 0 1px 20px; }








/** ==================================================================================== **/

/** ==================================================================================== **/

/** ==================================================================================== **/

/** ============================ Jenson Added ========================================== **/

/**
 * this is the hidden input text field which appears on the search results page 
 * when the user selects to create a new folder
**/
.newFolderName
{
    display:none;
}

#newFolderName
{
    clear:both;
}


/* -- Post-registration boxes begins -- */
/* JT: the id has been changed to a class so that we can use the same styles for more than one message */

h3.helpheading{ /* -- For the Help headings (to look like folder heading) -- */
	color:#336699;
	font-size:16px;
	font-weight:bold;
	margin:0 0 5px 0;
	padding:9px 0 9px 15px;
	cursor: hand;
	cursor: pointer;
	border:1px solid #CCC;
}



/* -- 19/15/2010 -- */

.popup-content {
	padding:20px;
}

	.popup-content label {
		display:block;
		padding:0 0 5px 0;
}

	.popup-content input {
		width:240px;
		padding:5px;
		border:1px solid #336699;
		-moz-border-radius:3px;
		-webkit-border-radius:3px;
		border-radius:3px;
		background:#FFF;
		font-size:14px;
		color:#333;
}

		.popup-content input:focus,
		.popup-content textarea:focus {
			border-color:#06C;
			-moz-box-shadow:0 0 10px #09F;
}

	.popup-content textarea {
		width:535px;
		height:150px;
		padding:5px;
		font-family:Arial, Helvetica, sans-serif;
		border:1px solid #336699;
		-moz-border-radius:3px;
		-webkit-border-radius:3px;
		border-radius:3px;
		background:#FFF;
		font-size:14px;
		color:#333;
}

	
/* -- 11-06-2010 -- */



label.label {
	display:block;
	border:3px solid #369;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	cursor:pointer;
}

label.label:hover {
	border-color:#F90;
}

label.label span {
	float:left;
	display:block;
	*width:66px;
	font-size:12px;
	position:absolute;
	padding:3px;
	background:#369;
	color:#FFF;
	bottom:10px;
	right:10px;
	position:absolute;
	border:1px solid #369;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
}

label.label:hover span {
	border-color:#F90;
	background:#F90;
}

	label.label span input{
		float:right;
		padding:0;
		margin:1px 0 0 3px;
		*margin:-18px 0 0 0;
}

label.label.clicked {
	border-color:#F90;
}

label.label.clicked span {
	border-color:#F90;
	background:#F90;
}

.bookmark.post-reg {
	margin:0 0 10px 0 !important;
}

	.bookmark.post-reg.blank {
		border:3px dashed #DDDDDD;
		width:210px;
		padding:40px 0 0 0;
		-moz-border-radius:5px;
		-webkit-border-radius:5px;
		text-align:center;
		border-radius:5px;
		height:110px;
		position:relative;
		margin:0 0 35px 0 !important;
}

			.bookmark.post-reg.blank.loading {
				background:url(../../images/private/loading.gif) no-repeat center;
}

	.bookmark.post-reg.blank input.text {
		width:140px;
		padding:3px 5px;
		border:1px solid #CCC;
		-moz-border-radius:2px;
		color:#666;
}

	.bookmark.post-reg.blank input.button {
		width:30px;
		padding:2px 5px;
		border:1px solid #CCC;
		-moz-border-radius:2px;
		background:#FFF url(../../images/icons/mini-search.png) no-repeat center;
		cursor:pointer;
}

.bookmark.post-reg .thumb {
	margin:0 !important;
}

.post-reg-col-1 {
	width:218px;
	float:left;
	overflow:hidden;
	margin:0 25px 0 0;
}

.post-reg-col-2 {
	width:218px;
	float:left;
	overflow:hidden;
	margin:0 25px 0 0;
}

.post-reg-col-3 {
	width:218px;
	float:left;
	overflow:hidden;
	margin:0 25px 0 0;
}

.post-reg-col-4 {
	width:218px;
	float:left;
	overflow:hidden;
	margin:0;
}

.loading-box {
	width:210px;
	position:absolute;
	top:0;
	z-index:100;
	left:0;
	height:30px;
	padding:120px 0 0 0;
	background:#FFF url(../../images/private/loading.gif) no-repeat center;
}

/* -- 01-11-2010 -- */

#auto-login-screen {
	width:300px;
	height:400px;
	position:absolute;
	z-index:9999999999999999;
	top:200px;
	left:42px;
	background:#DEDEDE;
	border:1px solid #369;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	padding:10px;
	-moz-box-shadow:0 0 5px #999;
}

	#auto-login-screen h3 {
		font-size:18px;
		font-weight:normal;
		color:#369;
		text-shadow:0 1px 0 #FFF;
		margin:0;
}

	#auto-login-screen p {
		font-size:14px;
		color:#333;
		text-shadow:0 1px 0 #FFF;
}

	#auto-login-screen a.bookmark-button {
		margin:0 auto;
}

#auto-login-toggle {
	display:block;
	width:40px;
	height:143px;
	position:absolute;
	left:0;
	top:200px;
	z-index:99999999;
	background:url(../../images/misc/auto-login-help.png) no-repeat top left;
}

	#auto-login-toggle:hover {
		background:url(../../images/misc/auto-login-help.png) no-repeat center left;
}

	#auto-login-toggle.selected {
		background:url(../../images/misc/auto-login-help.png) no-repeat bottom left;
}