/*=== Files public view CSS ===*/
.screens.pub_view {
	.resize_compensation_top(0px);
}
.pub_view .panel.files {
	width: 100%;
}
/*=== END Files public view CSS ===*/
/*=== Files screen CSS ===*/
.panel.files {
	width: 85%;
	position: relative;
	
	.middle_bar {
		.resize_compensation_top(28px);
	}
	
	.toolbar .search_block {
		width: 200px;
		float: right;
		padding-right: 0;

		html.rtl & {
			float: left;
			padding-left: 0;
		}
	}
	
	.pathway {
		background: #fff;
		border-bottom: 1px solid #D5D5D5;
		padding: 6px 10px 6px 30px;
		
		html.rtl & {
			padding-left: 10px;
			padding-right: 30px;
		}
		
		a,
		b {
			display: inline-block;
			height: 1em;
			line-height: 100%;
			padding: 2px 4px;
			vertical-align: text-top;
		}
		
		.droppableHover {
			border-radius: 2px;
		}
	}
	
	.items_list {
		
		.uploader_mask {
			.box-sizing;
			.transition(opacity 250ms ease 0s);

			background: #FFFDD6;
			padding: 11px;
			color: #D3B910;
			font-size: 18pt;
			text-align: center;
			opacity: 0;
			position: absolute;
			top: 0px;
			left: 0px;
			height: 100%;
			width: 100%;
			visibility: hidden;

			&.active {
				visibility: visible;
				opacity: 0.5;
			}

			.inner {
				.box-sizing;

				height: 100%;
				border: 3px dashed #E2DA36;
				border-radius: 5px;
			}
		}
		
		.items_sub_list {
			font-size: 0px;
			padding: 10px;
		}
		
		.item {
			display: inline-block;
			width: 160px;
			height: 155px;
			max-width: 160px;
			max-height: 160px;
			text-align: center;
			vertical-align: top;
			opacity: 1;
			font-size: 9pt;
			margin: 0px 4px 4px 0px;
			cursor: pointer;

			background: none;
			
			html.rtl & {
				margin-left: 4px;
				margin-right: 0px;
			}
			
			&.helper {
				margin-bottom: 0px;
				height: 0px;
				visibility: hidden;
			}
			
			&.deleted {
				overflow: hidden;
				opacity: 0;
				max-height: 160px !important;
				max-width: 0px !important;
				-webkit-transition: -webkit-transform 500ms ease 0s, opacity 500ms ease 0s, max-width 250ms ease 250ms;
				-moz-transition: transform 500ms ease 0s, opacity 500ms ease 0s, max-width 250ms ease 250ms;
				transition: transform 500ms ease 0s, opacity 500ms ease 0s, max-width 250ms ease 250ms;
				-webkit-transform: scale(0.5);
				transform: scale(0.5);
			}
			
			&.incomplete {
				opacity: 0.5;
				
				.cancel {
					display: block;
				}
			}
			
			&.selected,
			&.checked {
				background: #ebf7cb;
				color: #3D3D3D;
				border-radius: 5px;
			}
			
			&.shared .shared_icon {
				display: block;
				float: right;
				font-size: 0;
				height: 16px;
				width: 16px;
				margin-left: -16px;
				position: relative;
				overflow: hidden;
				margin-top: 5px;
				background: #64AEDC url("images/sprites.png?%VERSION%") no-repeat -818px -98px;
				right: 41px;
				top: 76px;
				height: 18px;
				width: 18px;
				border-radius: 2px;
				
				&:hover {
					background-color: #328DC5;
				}
			}
			
			.cancel {
				background: url("images/sprites.png?%VERSION%") no-repeat -80px -240px;
				display: none;
				float: right;
				font-size: 0;
				height: 14px;
				width: 14px;
				overflow: hidden;
				margin-top: 5px;
				cursor: pointer;
			}
			
			.item_content {
				.box-sizing;

				padding: 1px 6px;
				border: 0px;
				display: inline-block;
				vertical-align: bottom;
				width: 100%;
				height: 100%;
			}
			
			.header {
				display: none;
				height: 24px;
				margin: 0px 0px -28px;
				white-space: normal;
				padding-top: 4px;
				line-height: 100%;
				overflow: hidden;

				.author,
				.date {
					font-size: 8pt;
					color: #626262;
					padding: 0px;
					margin: 0px;
					float: none !important;
					display: inline-block;
					white-space: nowrap;
				}
			}
			
			.controls {
				display: none;
				font-size: 8pt;
				margin: -22px 0px 0px;
				padding-top: 2px;
				height: 20px;

				float: none;
			}
			
			&:hover,
			&.selected,
			&.checked {
				.item_content {
					padding: 0px 5px;
					border: 1px solid #c9c9c9;

					border-radius: 3px;
				}
				
				.header {
					display: block;
				}
				
				.controls {
					display: block;
				}
			}
		}
		
		
		
		
	}
}

.cssanimations .panel.files .items_list .item .item_content.recivedAnim {
	border-radius: 4px;
	.animation(highlight 0.5s linear);
}



.panel.files .items_list .item > .mask {
	display: none;
	width: 100%;
	height: 100%;
	margin-top: -155px;
	border-radius: 3px;
}
.panel.files .items_list.dragover .item > .mask {
	display: block;
}





.panel.files .items_list .data {
	margin: 32px 0px 25px;
	overflow: visible;
}
.panel.files .items_list .item {
	
	.name {
		display: block;
		-ms-word-break: break-all;
		word-wrap: break-word;
		white-space: normal;
		height: 2.6em;
		overflow: hidden;
	}
	
	.progress {
		display: block;
		margin-top: -3px;
		height: 3px;
		
		span {
			display: block;
			height: 100%;
			background: #EF4A4A;
		}
	}
	
	.percent {
		color: #CF2A2A;
		background: none !important;
		margin-top: -10px;
		text-shadow: 0 0 2px #FFFFFF, 0 0 2px #FFFFFF, 0 0 2px #FFFFFF, 0 0 2px #FFFFFF, 0 0 2px #FFFFFF, 0 0 2px #FFFFFF;
	}
}

.panel.files .items_list .folder .icon {
	display: inline-block;
	width: 35px;
	height: 30px;
	background: url("images/sprites.png?%VERSION%");
	background-position: -440px -360px;
}
.panel.files .items_list .large .folder .icon {
	width: 70px;
	height: 65px;
	background-position: -880px -400px;
}
.panel.files .items_list .file .icon {
	width: 32px;
	height: 32px;
}
.panel.files .items_list .large .file .icon {
	width: 64px;
	height: 64px;
}


.panel.files .item .droppableHover,
.panel.folders .item .droppableHover,
.panel.files .panel_top .droppableHover{
	background: #DCD9D1 !important;
	color: #626262 !important;
	text-shadow: 0px 1px 0px #fff !important;
}

.sharing_panel {
	display: block;
    width: 280px;
	margin: 0px auto;
	padding: 130px 20px 20px;
	background: url("images/logo.png?%VERSION%") no-repeat center 20px;
	text-align: center;
	
	.item {
		.box-sizing;

		display: inline-block;
		padding: 1px 6px;
		text-align: left;
		vertical-align: top;
		
		.icon {
			display: inline-block;
			float: left;
			background: url("images/sprites.png?%VERSION%") no-repeat 80px 0px;
			width: 55px;
			height: 65px;
			background-position: -480px -200px;
		}
	}
	
	.buttons {
		display: block;
		text-align: center;
	}
	
	.button {
		text-decoration: none;
	}
}
/*=== END Files screen CSS ===*/
