/* Copyright (c) 2011, Jan-Christoph Borchardt, http://jancborchardt.net
   This file is licensed under the Affero General Public License version 3 or later.
   See the COPYING-README file. */
  
  /* FILE MENU */
  .actions { padding:.3em; height:2em; width: 100%; }
  .actions input, .actions button, .actions .button { margin:0; float:left; }

  .actions .button a { color: #555; }
  .actions .button a:hover, .actions .button a:active { color: #333; }

  
  #new {

  	z-index: 1010;
  	float: left;
  	padding: 0 !important; /* override default control bar button padding */
  }
  #trash {
  	margin-right: 8px;
  	float: right;
  	z-index: 1010;
  	padding: 10px;
  	font-weight: normal;
  }
  #new>a {
  	padding: 14px 10px;
  	position: relative;
  	top: 7px;
  }
  #new.active {
  	border-bottom-left-radius: 0;
  	border-bottom-right-radius: 0;
  	border-bottom: none;

  }

  #new>ul {

  	display: none;
  	position: fixed;
  	min-width: 7em;
  	z-index: 10;
  	padding: .5em;
  	padding-bottom: 0;
  	margin-top: 14px;
  	margin-left: -1px;

  	text-align:left;

  	background: #f8f8f8;
  	border: 1px solid #ddd;
  	border-radius: 5px;
  	border-top-left-radius: 0;

  	box-shadow:0 2px 7px rgba(170,170,170,.4);
  }

  #new>ul>li { height:36px; margin:.3em; padding-left:3em; padding-bottom:0.1em;

  		background-repeat:no-repeat; cursor:pointer; }

  #new>ul>li>p { cursor:pointer; padding-top: 7px; padding-bottom: 7px;}
  
  #new .error, #fileList .error {
  	color: #e9322d;
  	border-color: #e9322d;
  	-webkit-box-shadow: 0 0 6px #f8b9b7;
  	-moz-box-shadow: 0 0 6px #f8b9b7;
  	box-shadow: 0 0 6px #f8b9b7;
  }

  /* FILE TABLE */

  #filestable {
  	position: relative;
  	top: 44px;
  	width: 100%;

  }

  /* make sure there's enough room for the file actions */
  #body-user #filestable {
  	min-width: 750px;

  }

  #body-user #controls {
  	min-width: 600px;
  }

  #filestable tbody tr { background-color:#fff; height:2.5em; }
  #filestable tbody tr:hover, tbody tr:active {
  	background-color: rgb(240,240,240);

  }

  #filestable tbody tr.selected {
  	background-color: rgb(230,230,230);

  }

  #filestable tbody tr.searchresult {
  	background-color: rgb(240,240,240);

  }

  tbody a { color:#000; }
  span.extension, span.uploading, td.date { color:#999; }
  span.extension { text-transform:lowercase; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; filter:alpha(opacity=70); opacity:.7; -webkit-transition:opacity 300ms; -moz-transition:opacity 300ms; -o-transition:opacity 300ms; transition:opacity 300ms; }
  tr:hover span.extension { -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter:alpha(opacity=100); opacity:1; color:#777; }
  table tr.mouseOver td { background-color:#eee; }
  table th { height:2em; padding:0 .5em; color:#999; }

  table th .name {
  	position: absolute;
  	left: 55px;
  	top: 15px;
  }

  table th, table td { border-bottom:1px solid #ddd; text-align:left; font-weight:normal; }

  table td {
  	border-bottom: 1px solid #eee;
  	font-style: normal;
  	background-position: 8px center;
  	background-repeat: no-repeat;
  }
  table th#headerName {
  	position: relative;

  	width: 9999px; /* not really sure why this works better than 100% … table styling */

  	padding: 0;
  }
  #headerName-container {
  	position: relative;
  	height: 50px;
  }
  table th#headerSize, table td.filesize {
  	min-width: 3em;
  	padding: 0 1em;
  	text-align: right;
  }
  table th#headerDate, table td.date {
  	-moz-box-sizing: border-box;
  	box-sizing: border-box;
  	position: relative;
  	min-width: 11em;
  }

  
  /* Multiselect bar */

  #filestable.multiselect {
  	top: 95px;
  }
  table.multiselect thead {
  	position: fixed;
  	top: 89px;
  	z-index: 10;
  	-moz-box-sizing: border-box;
  	box-sizing: border-box;
  	left: 0;
  	padding-left: 80px;
  	width: 100%;
  }
  
  table.multiselect thead th {
  	background-color: rgba(220,220,220,.8);
  	color: #000;
  	font-weight: bold;
  	border-bottom: 0;
  }
  table.multiselect #headerName {
  	position: relative;

  	width: 9999px; /* when we use 100%, the styling breaks on mobile … table styling */

  }

  table td.selection, table th.selection, table td.fileaction { width:2em; text-align:center; }

  table td.filename a.name {
  	position:relative; /* Firefox needs to explicitly have this default set … */
  	-moz-box-sizing: border-box;
  	box-sizing: border-box;
  	display: block;
  	height: 50px;
  	vertical-align: middle;
  	padding: 0;
  }

  table tr[data-type="dir"] td.filename a.name span.nametext {font-weight:bold; }

  table td.filename input.filename {
  	width: 80%;
  	font-size: 14px;
  	margin-top: 8px;
  	margin-left: 2px;
  	cursor: text;
  }
  table td.filename a, table td.login, table td.logout, table td.download, table td.upload, table td.create, table td.delete { padding:.2em .5em .5em .3em; }

  table td.filename .nametext, .uploadtext, .modified { float:left; padding:.3em 0; }

  
  #modified {
  	position: absolute;
  	top: 15px;
  }
  .modified {
  	position: relative;
  }

  /* TODO fix usability bug (accidental file/folder selection) */

  table td.filename .nametext {
  	position: absolute;
  	top: 16px;
  	left: 55px;
  	padding: 0;
  	overflow: hidden;
  	text-overflow: ellipsis;
  	max-width: 800px;
  }

  table td.filename .uploadtext { font-weight:normal; margin-left:.5em; }
  table td.filename form { font-size:.85em; margin-left:3em; margin-right:3em; }

  .ie8 input[type="checkbox"]{
  	padding: 0;
  }

  /* File checkboxes */

  #fileList tr td.filename>input[type="checkbox"]:first-child {
  	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  	filter: alpha(opacity=0);
  	opacity: 0;
  	float: left;
  	margin: 32px 0 4px 32px; /* bigger clickable area doesn’t work in FF width:2.8em; height:2.4em;*/
  }
  /* Show checkbox when hovering, checked, or selected */
  #fileList tr:hover td.filename>input[type="checkbox"]:first-child,
  #fileList tr td.filename>input[type="checkbox"]:checked:first-child,
  #fileList tr.selected td.filename>input[type="checkbox"]:first-child {
  	opacity: 1;
  }
  .lte9 #fileList tr:hover td.filename>input[type="checkbox"]:first-child,
  .lte9 #fileList tr td.filename>input[type="checkbox"][checked=checked]:first-child,
  .lte9 #fileList tr.selected td.filename>input[type="checkbox"]:first-child {
  	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  	filter: alpha(opacity=100);
  }
  
  /* Use label to have bigger clickable size for checkbox */
  #fileList tr td.filename>input[type="checkbox"] + label,
  #select_all + label {
  	height: 50px;
  	position: absolute;
  	width: 50px;
  	z-index: 5;
  }
  #fileList tr td.filename>input[type="checkbox"] + label {
  	left: 0;
  }
  #select_all + label {
  	top: 0;
  }
  #select_all {
  	position: absolute;
  	top: 18px;
  	left: 18px;
  }

  
  #fileList tr td.filename {
  	position:relative; width:100%;
  	-webkit-transition:background-image 500ms; -moz-transition:background-image 500ms; -o-transition:background-image 500ms; transition:background-image 500ms;
  }

  
  #fileList tr td.filename a.name label {
  	position: absolute;

  	width: 80%;

  	height: 50px;
  }

  #uploadsize-message,#delete-confirm { display:none; }
  
  /* File actions */
  .fileactions {

  	position: absolute;
  	top: 14px;
  	right: 0;

  }

  #fileList img.move2trash { display:inline; margin:-.5em 0; padding:1em .5em 1em .5em !important; float:right; }

  #fileList a.action.delete {
  	position: absolute;
  	right: 0;
  	padding: 9px 14px 19px !important;
  }

  a.action>img { max-height:16px; max-width:16px; vertical-align:text-bottom; }

  
  /* Actions for selected files */
  .selectedActions {
  	display: none;
  	position: absolute;
  	top: -1px;
  	right: 0;
  	padding: 15px 8px;
  }
  .selectedActions a {
  	display: inline;
  	padding: 17px 5px;
  }
  .selectedActions a img {
  	position:relative;
  	top:.3em;
  }

  
  #fileList a.action {

  	display: inline;
  	margin: -.5em 0;
  	padding: 18px 8px !important;

  	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  	filter: alpha(opacity=0);
  	opacity: 0;
  	display:none;
  }
  #fileList tr:hover a.action, #fileList a.action.permanent {

  	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
  	filter: alpha(opacity=50);

  	opacity: .5;
  	display:inline;
  }
  #fileList tr:hover a.action:hover {

  	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  	filter: alpha(opacity=100);

  	opacity: 1;
  	display:inline;
  }

  .summary {
  	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
  	filter: alpha(opacity=30);
  	opacity: .3;
  	height: 70px;
  }

  .summary:hover, .summary, table tr.summary td {
  	background-color: transparent;
  }
  
  .summary td {
  	padding-top: 8px;
  	padding-bottom: 8px;
  	border-bottom: none;
  }
  .summary .info {
  	margin-left: 55px;
  }
  
  #scanning-message{ top:40%; left:40%; position:absolute; display:none; }

  
  table.dragshadow {
  	width:auto;
  }
  table.dragshadow td.filename {

  	padding-left:60px;

  	padding-right:16px;

  	height: 36px;

  }
  table.dragshadow td.size {
  	padding-right:8px;
  }
  #upgrade {
  	width: 400px;
  	position: absolute;
  	top: 200px;
  	left: 50%;
  	text-align: center;
  	margin-left: -200px;
  }

  .mask {
  	z-index: 50;
  	position: fixed;
  	top: 0;
  	left: 0;
  	right: 0;
  	bottom: 0;
  	background-color: white;
  	background-repeat: no-repeat no-repeat;
  	background-position: 50%;
  	opacity: 0.7;
  	filter: alpha(opacity=70);
  	transition: opacity 100ms;
  	-moz-transition: opacity 100ms;
  	-o-transition: opacity 100ms;
  	-ms-transition: opacity 100ms;
  	-webkit-transition: opacity 100ms;
  }
  .mask.transparent{
  	opacity: 0;

  }