/* General */
html {
  background: #F2EDE7;
  color: #413A32;
}

body {
  font-size:100%;
  font-family: Arial, sans-serif;
  line-height:1.125em;
}
p {
  font-size:0.875em;
}

header, article, footer {
  margin-left: auto;
  margin-right: auto;
  width: 60%;
  max-width: 650px;
}
h1 {
}
a {
  color: #1E52A1;
  text-decoration: none;
}
a:hover {
  color: #78B2FF;
}
.clearboth {
	clear: both;
	height: 0px;
	display: block;
}

/* 
 * Section new-file & uploaded-files
 */
section {
  background-color: #FFF;
  -moz-border-radius:    6px;
  -webkit-border-radius: 6px;
  border-radius:         6px;
  border-width: 1px;
  border-style: solid;
  border-color: #D4D0C9;
  margin-top:     0.4em;
  margin-bottom: 1.5em;
}
.qtip section {
  -moz-border-radius:    0;
  -webkit-border-radius: 0;
  border: none;
  margin: 0;
}
h2 {
  /* letter-spacing: -0.05em; */
  font-weight: normal;
  font-size: 1.1em;
}
h2 span.filename {
  font-size: 0.8em;
}

/*
 * Header
 */
header {
  padding: 3em 0 1.4em 0;
  position: relative;
  text-align:center;
}
header h1 {
}
header #filez-logo {
  display: block;
  margin: auto 0;
}
header #filez-header {
  letter-spacing: -0.05em;
  font-weight: normal;
  font-size: 1em;
  color: #8F837A;
  display: block;
}
header #your-logo {
  display: block;
  float: left;
  margin-top: -1em;
  margin-right: 1em;
  padding-right: 1em;
  border-right: 1px solid #D9D4CF;
}
#auth-box {
  position: absolute;
  top: 0;
  right: 0;
  -moz-border-radius-bottomleft:      6px;
  -webkit-border-bottom-left-radius:  6px;
  -moz-border-radius-bottomright:     6px;
  -webkit-border-bottom-right-radius: 6px;
  -moz-box-shadow:    inset 0 15px 15px #F2EDE7;
  -webkit-box-shadow: inset 0 15px 15px #F2EDE7;
  padding: 0.3em 0.7em;
  background: #E6E1DB;
  color: #73706E;
  border-bottom: 1px solid #DAD6D0;
  border-left: 1px solid #EBE6E0;
  border-right: 1px solid #EBE6E0;
  font-size: 0.8em;
}
header #auth-box a#logout {
  background: transparent url(../images/icons/system-log-out.png) no-repeat right center;
  padding: 8px;
  text-indent: -2000px;
  overflow: hidden;
}

/*
 * Notifications
 */
.notif {
    -moz-border-radius:		 10px;
    -webkit-border-radius: 10px;
    padding: 1em;
    margin-top: 2em;
    background: #fffec2; /* notif ok */
    border: 1px solid #E5E4AD; /* notif ok */
}
.notif.error {
    background: #f2e1dc;
    border: 1px solid #f3c5c1;
}
.notif.error h1 {
    color: #AC342B;
}
.notif .notif-close {
    float: right;
    height: 16px;
    width: 16px;
    text-indent: -3000em;
    display: block;
    background: transparent url(../images/icons/dialog-close.png) no-repeat center center;
    opacity: 0.4;
    filter:alpha(opacity=40);
    -moz-border-radius:    3px;
    -webkit-border-radius: 3px;
}
.notif .notif-close:hover ,
.notif:hover .notif-close {
    background-color: #f3c5c1;
    opacity: 1;
    filter:alpha(opacity=100);
}

/*
 * Section new-file
 */
section.new-file {
  -moz-box-shadow:    inset 0 20px 20px rgba(0,0,0,0.04);
  -webkit-box-shadow: inset 0 20px 20px rgba(0,0,0,0.04);
}
.qtip section.new-file {
  -moz-box-shadow:    none;
  -webkit-box-shadow: none;
}
section.new-file form {
  position: relative;
}
section.new-file div#start-from {
  width: 20%;
  position: absolute; top: 0;
}
section.new-file div#file {
  position: absolute; top: 0;
  width: 40%;
}
section.new-file div#file       ,
section.new-file div#lifetime   ,
section.new-file div#start-from {

}
section.new-file div#file       input ,
section.new-file div#lifetime   select ,
section.new-file div#comment    input ,
section.new-file div#start-from input {
  box-sizing:         border-box;
  -moz-box-sizing:    border-box;
  -webkit-box-sizing: border-box;
  width: 100%;
}
section.new-file div#file       { left:  1.3em; }
section.new-file div#start-from { right: 1.3em; }
section.new-file div#file input {
}
section.new-file div#lifetime {
  width: 18%;
  margin: 0 28% 0 auto;
}
section.new-file div#start-from input {
  background: transparent url(../images/icons/office-calendar.png) no-repeat 6px center;
  padding-left: 28px;
}
section.new-file div#comment ,
section.new-file ul#options {
  padding: 0 1.3em;
}
section.new-file label {
  padding-top: 0.8em;
  display: block;
}
section.new-file div#upload {
  background: #F6F8FB;
  -moz-border-radius-bottomright:     5px;
  -webkit-border-radius-bottomright:  5px;
  border-radius-bottomright:          5px;
  -moz-border-radius-bottomleft:      5px;
  -webkit-border-radius-bottomleft:   5px;
  border-radius-bottomleft:           5px;
  -moz-box-shadow:    inset 0 20px 20px rgba(63,109,177,0.05);
  -webkit-box-shadow: inset 0 20px 20px rgba(63,109,177,0.05);
  padding: 0.7em;
  margin-top: 1em;
  text-align: center;
  border-width: 1px 0 0 0;
  border-style: solid;
  border-color: #EDF2F7;
}
section.new-file div#upload * {
}
section.new-file div#upload div#upload-prospect {
  margin-top: 0.5em;
}
section.new-file div#upload-loading {
  width: 220px; height: 19px;
  background: transparent url('../images/ajax-loader.gif') no-repeat center center;
  margin: 0 auto;
}
section.new-file ul#options {
		margin-top: 0.8em;
}
section.new-file ul#options li + li {
  padding-left: 0.4em;
	margin-left: 0.4em;
  border-left: 1px solid #DDD;
}
section.new-file div#password *,
section.new-file ul#options li ,
section.new-file ul#options input ,
section.new-file ul#options li label {
  display: inline;
}

h2.new-file a.awesome {
  background-image: url(../images/icons/upload.png);
  background-position: 10px center;
  background-repeat: no-repeat;
  font-size: 0.85em;
	font-weight: normal;
	padding-left: 40px;
	float: right;
	margin-bottom: .7em;
	color: #EEE;
}
h2.new-file a.awesome:hover {
	color: #FFF;
}
.ui-dialog section.new-file {
    margin: 0;
}

 
/*
 * form
 */
select ,
textarea ,
input {
  padding: 0.4em;
  border-width: 1px;
  border-style: solid;
  border-color: #EDEBE6;
  background: #FBFAF8;
  -moz-border-radius:    4px;
  -webkit-border-radius: 4px;
  border-radius:         4px;
  border: 1px solid rgba(0,0,0,0.3);
  -moz-box-shadow:    inset 0 4px 4px rgba(0,0,0,0.05);
  -webkit-box-shadow: inset 0 4px 4px rgba(0,0,0,0.05);
}
label {
  font-size: 0.8em;
  color: #7C746C;
}

/*
 * Section uploaded-files
 */

h2#uploaded-files-title {
	padding-top: .3em;
}
section#uploaded-files {
	clear: both;
}
section#uploaded-files ul#files {
  list-style: none;
}
section#uploaded-files ul li.file {
  position: relative;
  padding-top: 0.7em;
}
section#uploaded-files ul li.file.even {
  background: #F5F4F2;
  border-width: 1px 0 1px 0;
  border-style: solid;
  border-color: #EDF2F7;
}
section#uploaded-files ul li.file:first-child {
  -moz-border-radius-topright:     5px;
  -webkit-border-top-left-radius:  5px;
  border-radius-topright:          5px;
  -moz-border-radius-topleft:      5px;
  -webkit-border-top-right-radius: 5px;
  border-radius-topleft:           5px;
}
section#uploaded-files ul li.file:last-child {
  -moz-border-radius-bottomright:     5px;
  -webkit-border-bottom-left-radius:  5px;
  border-radius-bottomright:          5px;
  -moz-border-radius-bottomleft:      5px;
  -webkit-border-bottom-left-radius:  5px;
  border-radius-bottomleft:           5px;
}
section#uploaded-files ul li.file:hover {
  background: #FFFDE9;
}

/*
 * File description
 */
section#uploaded-files ul li .file-attributes ,
section#uploaded-files ul li .file-description {
  padding: 0 0 0.2em 64px;
}
section#uploaded-files ul li .file-description p {
	display: inline;
}
section#uploaded-files ul li p.filename {
}
section#uploaded-files ul li p.filename a {
  font-weight: bold;
  font-size: 1.3em;
  letter-spacing: -0.05em;
}
section#uploaded-files ul li img.mimetype {
	position: absolute;
	top:  0.9em;
	left: 1.0em;
}


section#uploaded-files ul li p a.copy2clipboard {
	opacity: 0;
}
section#uploaded-files ul li:hover p a.copy2clipboard {
	text-indent: -5000px;
	background: transparent url(../images/icons/copy.png) no-repeat center bottom; 
	width: 16px;
	padding: 0 5px;
	display: inline-block;
	opacity: 1;
}
section#uploaded-files ul li p.comment {
	display: none;
	/* TODO */
}
section#uploaded-files ul li .filesize {
	color: #B0ABA6;
  font-size: 0.82em;
}
section#uploaded-files ul li p.share {
	padding-left: 1em;
}
section#uploaded-files ul li p.share a {
	background-image: url(../images/icons/share-this-icon.png); 
  background-position: 7px center;
  background-repeat: no-repeat;
	padding-left: 26px;
	padding-top:    4px;
	padding-bottom: 4px;
	position: absolute;
	top:   20px;
	right: 20px;
}
/*
 * File attributes
 */
section#uploaded-files ul li .file-attributes p {
	display: inline;
}
section#uploaded-files ul li .file-attributes p + p {
	border-left: 1px solid #DDD;
	padding-left: 0.5em;
	margin-left:  0.5em;
}
section#uploaded-files ul li .file-attributes {
  color: #7C746C;
  font-size: 0.82em;
	padding-bottom: 0.7em;
}
section#uploaded-files ul li .file-attributes .availability b { color: #433C34; }

section#uploaded-files ul li a.extend {
  padding-left: 20px;
  line-height: 16px;
  height: 16px;
  display: inline-block;
  background-position: left top;
  background-repeat: no-repeat;
  background-color: transparent;
}
section#uploaded-files ul li a.extend { background-image: url(../images/icons/add.png); }
section#uploaded-files ul li a.send-by-email { background-image: url(../images/icons/mail-message-new.png); }
section#uploaded-files ul li a.extend { text-indent: -5000px; width: 16px; padding: 0; }
section#uploaded-files ul li a.delete {
	background: transparent url(../images/icons/remove.png) no-repeat left center;
	text-indent: -5000px;
  line-height: 16px;
  height: 16px;
  width: 16px;
	display: inline-block;
}

/*
 * send-email-form
 */

.send-email-form label {
  display: block;
}
.send-email-form textarea ,
.send-email-form input.to {
  width: 97%;
}
.send-email-form textarea {
  height: 4em;
}

#email-modal form p {
  padding: 1em 1.5em 0 1.5em;
}
#email-modal form p.submit {
 background: #F6F8FB;
  -moz-box-shadow:    inset 0 20px 20px rgba(63,109,177,0.05);
  -webkit-box-shadow: inset 0 20px 20px rgba(63,109,177,0.05);
  padding: 0.7em;
  margin-top: 1em;
  text-align: center;
  border-width: 1px 0 0 0;
  border-style: solid;
  border-color: #EDF2F7;
}
form a.open-email-client {
  background: transparent url(../images/icons/internet-mail-22x22.png) no-repeat right center;
  padding: 4px 28px 4px 0;
  line-height: 22px;
  text-align: right;
  display: block;
}

/* Section #preview-file */
h2.preview img {
	vertical-align: middle;
}
h2.filename {
  font-size: 1.3em;
  font-weight: bold;
  padding-top: 2em;
}
section#preview-file {
  color: #7C746C;
  -moz-box-shadow:    inset 0 20px 20px rgba(0,0,0,0.05);
  -webkit-box-shadow: inset 0 20px 20px rgba(0,0,0,0.05);
  margin-top: 1em;
	padding: 1.1em;
}
section#preview-file form,
section#preview-file p {
  padding: 0.5em 0;
}
section#preview-file b {
	color: #433C34;
}
section#preview-file #preview-image {
  text-align: center;
}
section#preview-file #availability {
	float: left;
}
section#preview-file #owner {
	float: right;
}
section#preview-file #download,
section#preview-file #comment {
	clear: both;
}
section#preview-file #download {
	padding: 1.2em 0;
	text-align: center;
}
section#preview-file #download.image {
	text-align: right;
}

/*
 * Share modal
 */
 
#share-modal {
	padding: 1em;
}
#share-modal #share-link a {
	font-size: 1.8em;
	line-height: 2em;
  color: #1E52A1;
}
#share-modal #share-destinations {
	padding-top: 1em;
}
#share-modal #share-destinations li {
	display: block;
	float: left;
}
#share-modal #share-destinations li a {
	display: block;
	background-position: center top;
	background-repeat: no-repeat;
	width: 80px;
	padding-top : 50px;
	text-align: center;
	font-size: .75em;
}
#share-modal #share-destinations li a:hover {
	background-position: center 2px;
}
#share-modal #share-destinations li.email		 a { background-image: url(../images/icons/share-email.png); }
#share-modal #share-destinations li.facebook a { background-image: url(../images/icons/share-facebook.png); }
#share-modal #share-destinations li.twitter  a { background-image: url(../images/icons/share-twitter.png); }


/*
 * Login form
 */

form#login-form {
  width: 230px;
  margin: 3em auto;
  padding: 15px;
  background: #494846;
  -moz-border-radius:     7px;
  -webkit-border-radius:  7px;
  border-radius:          7px;
}
form#login-form p {
    margin: 0 0 10px 0;
}
form#login-form label {
  display: block;
  color: #BBB;
  text-shadow: 1px 1px 3px #222;
}
form#login-form input {
  width: 202px;
  padding: 5px;
  font-size: 1.2em;
}
form#login-form p#submit-login {
    padding: 10px 0 5px 0;
    text-align: center;
  font-size: 0.8em;
}
input.password ,
input.username ,
form#login-form input.username ,
form#login-form input.password {
    padding-left: 21px;
    background-repeat: no-repeat;
    background-position: 3px center;
}
input.password {
    background-image: url(../images/icons/keys.png);
}
input.username {
    background-image: url(../images/icons/user.png);
}


/*
 * Footer
 */
footer {
  text-align: center;
  padding: 4em 0;
}
footer a {
  color: #8F837A;
  font-size: 0.7em;
  text-decoration: underline;
}
footer #disk-usage {
  font-size: 0.8em;
}

div.lim-debug ,
footer div.debug {
    margin: 0 0 1em 0;
    background: #242423;
    color: red;
    text-align: left;
    padding: 0.5em;
    font-size: 0.9em;
}
div.lim-debug dl ,
footer div.debug pre {
    white-space: pre-wrap;
    border-top: 1px solid #651918;
    padding-top: 0.2em;
    margin-top: 0.2em;
    color: #BCBCBC;
}
div.lim-debug hr {display: none;}

/*
 * Support
 */
#support {
  padding: 0.7em 0;
}
#support a {
  padding: 0 .8em;
}
#support a + a {
  border-left: 1px solid #D4D0C9;
}
#support a.bug ,
#support a.help {
  padding-left: 2.7em;
  background-position: 0.8em center;
  background-repeat: no-repeat;
  display: inline-block;
  height: 16px;
}
#support a.bug  {background-image: url(../images/icons/bug.png); }
#support a.help {background-image: url(../images/icons/help.png);}

/*
 * Modal
 */

#modal-background {
    position: fixed;
    top: 0;
    left: 0;
    height: 200%;
    width: 100%;
    opacity: 0.7;
    filter:alpha(opacity=70);
    background-color: black;
    z-index: 5000;
    display: none;
}

/* Awesome button from http://www.zurb.com/blog_uploads/0000/0485/buttons-02.html */
.awesome,
.awesome:visited {
  background: #222;
  display: inline-block; 
  padding: 5px 10px 6px; 
  color: #fff; 
  text-decoration: none;
  -moz-border-radius: 5px; 
  -webkit-border-radius: 5px;
  text-shadow: -1px -1px 0px rgba(0,0,0,0.3);
  border-bottom: 1px solid rgba(0,0,0,0.25);
  position: relative;
  cursor: pointer;
  font-size: 13px;
  font-weight: bold;
  line-height: 1;
  -moz-box-shadow:    inset 0 20px 20px rgba(255,255,255,0.3);
  -webkit-box-shadow: inset 0 20px 20px rgba(255,255,255,0.3);
}
.awesome:hover { background-color: #111; color: #fff;text-shadow: 0 -1px 1px rgba(0,0,0,0.4);}
.awesome:active { top: 1px; }

.blue.awesome, .blue.awesome:visited { background-color: #1E52A1; }
.blue.awesome:hover                  { background-color: #376EBF; }

.green.awesome, .green.awesome:visited { background-color: #019652; }
.green.awesome:hover                   { background-color: #008653; }

.awesome.large {
  padding: 6px 20px 6px 20px;
}


/* jQuery UI css extend
----------------------------------*/

/* Datepicker
----------------------------------*/
.ui-datepicker {
	font-size:80%;
        z-index: 10000;
}

/* Dialog
----------------------------------*/
.ui-widget-overlay {
    opacity: 0.5;
    filter:alpha(opacity=50);
}
.ui-dialog { 
    position: relative; padding: 0; width: 300px; background: #FFF;
  -moz-box-shadow:    0 5px 20px rgba(0,0,0,0.2);
  -webkit-box-shadow: 0 5px 20px rgba(0,0,0,0.2);
  border: 0;
  font-family: Arial, sans-serif;
  font-size: 100%;
}
.ui-dialog .ui-dialog-titlebar { padding: .5em .3em .5em 1em; position: relative; border: none;
    -moz-border-radius-bottomleft: 0; -webkit-border-bottom-left-radius: 0;
    -moz-border-radius-bottomright: 0; -webkit-border-bottom-right-radius: 0;
    -moz-box-shadow:    inset 0 10px 10px rgba(255,255,255,0.06);
    -webkit-box-shadow: inset 0 10px 10px rgba(255,255,255,0.06);
    background: #333;
    color: #999;
    font-size:0.9em;
    text-shadow: 0 0 4px #000;
}
.ui-dialog .ui-dialog-title { float: left; margin: 0; }
.ui-dialog .ui-dialog-titlebar-close { position: absolute; right: .3em; top: 50%; width: 19px; margin: -10px 0 0 0; padding: 1px; height: 18px; }
.ui-dialog .ui-dialog-titlebar-close span { display: block; margin: 1px; }
.ui-dialog .ui-dialog-titlebar-close:hover, .ui-dialog .ui-dialog-titlebar-close:focus { padding: 0; }
.ui-dialog .ui-dialog-content { border: 0; padding: 0; background: none; overflow: auto; zoom: 1; }
.ui-dialog .ui-dialog-buttonpane { text-align: left; border-width: 1px 0 0 0; background-image: none; margin: .5em 0 0 0; padding: .3em 1em .5em .4em; }
.ui-dialog .ui-dialog-buttonpane button { float: right; margin: .5em .4em .5em 0; cursor: pointer; padding: .2em .6em .3em .6em; line-height: 1.4em; width:auto; overflow:visible; }
.ui-dialog .ui-resizable-se { width: 14px; height: 14px; right: 3px; bottom: 3px; }
.ui-draggable .ui-dialog-titlebar { cursor: move; }

.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {
  font-size: 0.8em;
}

/**
 * qtip
 */

.ui-tooltip-dark .ui-tooltip-titlebar,
.ui-tooltip-dark .ui-tooltip-content{
	border: 0;
}
.ui-tooltip-dark .ui-tooltip-content{
	background-color: #505050;
	background-color: rgba(0,0,0,.8);
}



/*
 * Install
 */

#install fieldset {
    margin: 1em 0;
    padding: 0 1em 1em 1em;
    background: rgba(255,255,255,0.5);
    border: 1px solid rgba(0,0,0,0.15);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-box-shadow:    0 3px 5px rgba(0,0,0,0.1);
    -webkit-box-shadow: 0 3px 5px rgba(0,0,0,0.1);
}
#install fieldset legend {
    padding: 0 0.3em;
    font-weight: bold;
}
#install label ,
#install input {
    display: block;
    width: 80%;
}
#install label ,
#install fieldset table {
    width: 100%;
    box-sizing: border-box;
}
#install input[type='checkbox'] {
    display: inline;
    width: 1em;
    height: 2em;
}
#install label {
    margin-top: 1em;
}
#install label.error {
    color: red;
    margin-top: 0;
}
#install p.submit {
    text-align: center;
}
#install p.submit input {
    display: inline;
    width: 50%;
    padding: 1em;
}
#install .help {
    margin: 1em 0.5em;
    padding: 1em;
    background: #F3EFCE;
    border: 1px solid rgba(0,0,0,0.1);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-box-shadow:    0 1px 3px rgba(0,0,0,0.1);
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}
#install .help ,
#install .help li ,
#install .help p {
    font-size: 13px;
}
#install div.help ul {
    padding-left: 2em;
}
#install h2 {
    padding-top: 1em;
    font-size: 95%;
    font-weight: bold;
}
#install h3 {
    padding-top: 1em;
    font-size: 70%;
    opacity: 0.8;
    font-weight: bold;
}

#install .required {
    color: red;
    font-size: 80%;
    opacity: 0.7;
    padding-left: 1em;
}
#install .check-item .required {
    font-weight: bold;
    font-size: 110%;
    text-transform: uppercase;
}
#install-notifs ,
#install-errors {
    -moz-border-radius:    10px;
    -webkit-border-radius: 10px;
    background: #D2E0CC;
    border: 1px solid #BDCAB8;
    padding: 0.5em 1em;
    margin: 1em 0;
}
#install-errors {
    background: #f2e1dc;
    border: 1px solid #f3c5c1;
}
#install-notifs p ,
#install-notifs ul ,
#install-errors p ,
#install-errors ul {
    padding: 0.6em 0;
}
#install-notifs ul ,
#install-errors ul {
    padding-left: 2em;
}
#install-errors input {
    background: none;
    border: none;
    display: inline;
    padding:0;margin:0;
    width: auto;
    color: red;
    text-shadow: none;
}
#install-notifs ul li ,
#install-errors ul li {
    padding: 0.4em 0;
}
#install .check-item {
    padding: 1em 0;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}
#install .check-item p {
    padding: 0.3em 0;
}
#install .help pre {
    background: rgba(0,0,0,0.7);
    color: #BBB;
    padding: 0.5em;
    margin: 0.3em 0;
}
#install .help .warning {
    background: rgba(0,0,0,0.02);
    color: red;
    padding: 1em;
    font-weight: bold;
}

/*
 * documentation
 */
article.doc section {
  padding: 1em;
}
article.doc section li ,
article.doc section h1 ,
article.doc section h2 ,
article.doc section p {
  padding: 0.5em 0;
  font-size: 0.9em;
}
article.doc section li {
  margin-left: 2em;
}
article.doc section h1 ,
article.doc section h2 {
  font-weight: bold;
}
article.doc section h1 {
  padding-top: 1.2em;
  font-size: 110%;
}
article.doc section h2 {
  padding-top: 1em;
  font-size: 82%;
}
article.doc .img-block img {
  -moz-box-shadow:    0 3px 10px #404040;
  -webkit-box-shadow: 0 3px 10px #404040;
}
article.doc .img-block {
  text-align: center;
	margin: 1em 0;
}