/*! normalize.css 2012-03-11T12:53 UTC - http://github.com/necolas/normalize.css */

/* =============================================================================
   HTML5 display definitions
   ========================================================================== */

/*
 * Corrects block display not defined in IE6/7/8/9 & FF3
 */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section,
summary {
  display: block;
}

/*
 * Corrects inline-block display not defined in IE6/7/8/9 & FF3
 */

audio,
canvas,
video {
  display: inline-block;
  *display: inline;
  *zoom: 1;
}

/*
 * Prevents modern browsers from displaying 'audio' without controls
 * Remove excess height in iOS5 devices
 */

audio:not([controls]) {
  display: none;
  height: 0;
}

/*
 * Addresses styling for 'hidden' attribute not present in IE7/8/9, FF3, S4
 * Known issue: no IE6 support
 */

[hidden] {
  display: none;
}

/* =============================================================================
   Base
   ========================================================================== */

/*
 * 1. Corrects text resizing oddly in IE6/7 when body font-size is set using em units
 *    http://clagnut.com/blog/348/#c790
 * 2. Prevents iOS text size adjust after orientation change, without disabling user zoom
 *    www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/
 */

html {
  font-size: 100%;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
  -ms-text-size-adjust: 100%;
  /* 2 */
}

/*
 * Addresses font-family inconsistency between 'textarea' and other form elements.
 */

html,
button,
input,
select,
textarea {
  font-family: sans-serif;
}

/*
 * Addresses margins handled incorrectly in IE6/7
 */

body {
  margin: 0;
}

/* =============================================================================
   Links
   ========================================================================== */

/*
 * Addresses outline displayed oddly in Chrome
 */

a:focus {
  outline: thin dotted;
}

/*
 * Improves readability when focused and also mouse hovered in all browsers
 * people.opera.com/patrickl/experiments/keyboard/test
 */

a:hover,
a:active {
  outline: 0;
}

/* =============================================================================
   Typography
   ========================================================================== */

/*
 * Addresses font sizes and margins set differently in IE6/7
 * Addresses font sizes within 'section' and 'article' in FF4+, Chrome, S5
 */

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

h2 {
  font-size: 1.5em;
  margin: 0.83em 0;
}

h3 {
  font-size: 1.17em;
  margin: 1em 0;
}

h4 {
  font-size: 1em;
  margin: 1.33em 0;
}

h5 {
  font-size: 0.83em;
  margin: 1.67em 0;
}

h6 {
  font-size: 0.75em;
  margin: 2.33em 0;
}

/*
 * Addresses styling not present in IE7/8/9, S5, Chrome
 */

abbr[title] {
  border-bottom: 1px dotted;
}

/*
 * Addresses style set to 'bolder' in FF3+, S4/5, Chrome
*/

b,
strong {
  font-weight: bold;
}

blockquote {
  margin: 1em 40px;
}

/*
 * Addresses styling not present in S5, Chrome
 */

dfn {
  font-style: italic;
}

/*
 * Addresses styling not present in IE6/7/8/9
 */

mark {
  background: #ff0;
  color: #000;
}

/*
 * Addresses margins set differently in IE6/7
 */

p,
pre {
  margin: 1em 0;
}

/*
 * Corrects font family set oddly in IE6, S4/5, Chrome
 * en.wikipedia.org/wiki/User:Davidgothberg/Test59
 */

pre,
code,
kbd,
samp {
  font-family: monospace, serif;
  _font-family: 'courier new', monospace;
  font-size: 1em;
}

/*
 * Improves readability of pre-formatted text in all browsers
 */

pre {
  white-space: pre;
  white-space: pre-wrap;
  word-wrap: break-word;
}

/*
 * 1. Addresses CSS quotes not supported in IE6/7
 * 2. Addresses quote property not supported in S4
 */

/* 1 */

q {
  quotes: none;
}

/* 2 */

q:before,
q:after {
  content: '';
  content: none;
}

small {
  font-size: 75%;
}

/*
 * Prevents sub and sup affecting line-height in all browsers
 * gist.github.com/413930
 */

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/* =============================================================================
   Lists
   ========================================================================== */

/*
 * Addresses margins set differently in IE6/7
 */

dl,
menu,
ol,
ul {
  margin: 1em 0;
}

dd {
  margin: 0 0 0 40px;
}

/*
 * Addresses paddings set differently in IE6/7
 */

menu,
ol,
ul {
  padding: 0 0 0 40px;
}

/*
 * Corrects list images handled incorrectly in IE7
 */

nav ul,
nav ol {
  list-style: none;
  list-style-image: none;
}

/* =============================================================================
   Embedded content
   ========================================================================== */

/*
 * 1. Removes border when inside 'a' element in IE6/7/8/9, FF3
 * 2. Improves image quality when scaled in IE7
 *    code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/
 */

img {
  border: 0;
  /* 1 */
  -ms-interpolation-mode: bicubic;
  /* 2 */
}

/*
 * Corrects overflow displayed oddly in IE9
 */

svg:not(:root) {
  overflow: hidden;
}

/* =============================================================================
   Figures
   ========================================================================== */

/*
 * Addresses margin not present in IE6/7/8/9, S5, O11
 */

figure {
  margin: 0;
}

/* =============================================================================
   Forms
   ========================================================================== */

/*
 * Corrects margin displayed oddly in IE6/7
 */

form {
  margin: 0;
}

/*
 * Define consistent border, margin, and padding
 */

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/*
 * 1. Corrects color not being inherited in IE6/7/8/9
 * 2. Corrects text not wrapping in FF3
 * 3. Corrects alignment displayed oddly in IE6/7
 */

legend {
  border: 0;
  /* 1 */
  padding: 0;
  white-space: normal;
  /* 2 */
  *margin-left: -7px;
  /* 3 */
}

/*
 * 1. Corrects font size not being inherited in all browsers
 * 2. Addresses margins set differently in IE6/7, FF3+, S5, Chrome
 * 3. Improves appearance and consistency in all browsers
 */

button,
input,
select,
textarea {
  font-size: 100%;
  /* 1 */
  margin: 0;
  /* 2 */
  vertical-align: baseline;
  /* 3 */
  *vertical-align: middle;
  /* 3 */
}

/*
 * Addresses FF3/4 setting line-height on 'input' using !important in the UA stylesheet
 */

button,
input {
  line-height: normal;
  /* 1 */
}

/*
 * 1. Improves usability and consistency of cursor style between image-type 'input' and others
 * 2. Corrects inability to style clickable 'input' types in iOS
 * 3. Removes inner spacing in IE7 without affecting normal text inputs
 *    Known issue: inner spacing remains in IE6
 */

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
  cursor: pointer;
  /* 1 */
  -webkit-appearance: button;
  /* 2 */
  *overflow: visible;
  /* 3 */
}

/*
 * Re-set default cursor for disabled elements
 */

button[disabled],
input[disabled] {
  cursor: default;
}

/*
 * 1. Addresses box sizing set to content-box in IE8/9
 * 2. Removes excess padding in IE8/9
 * 3. Removes excess padding in IE7
      Known issue: excess padding remains in IE6
 */

input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
  *height: 13px;
  /* 3 */
  *width: 13px;
  /* 3 */
}

/*
 * 1. Addresses appearance set to searchfield in S5, Chrome
 * 2. Addresses box-sizing set to border-box in S5, Chrome (include -moz to future-proof)
 */

input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  /* 2 */
  box-sizing: content-box;
}

/*
 * Removes inner padding and search cancel button in S5, Chrome on OS X
 */

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: none;
}

/*
 * Removes inner padding and border in FF3+
 * www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/
 */

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

/*
 * 1. Removes default vertical scrollbar in IE6/7/8/9
 * 2. Improves readability and alignment in all browsers
 */

textarea {
  overflow: auto;
  /* 1 */
  vertical-align: top;
  /* 2 */
}

/* =============================================================================
   Tables
   ========================================================================== */

/*
 * Remove most spacing between table cells
 */

table {
  border-collapse: collapse;
  border-spacing: 0;
}

.pie {
  color: #EC4E89;
  background: #bbb;
  border: 2px solid white;
}

.tip {
  position: absolute;
  padding: 5px;
  z-index: 1000;
  /* default offset for edge-cases: https://github.com/component/tip/pull/12 */
  top: 0;
  left: 0;
}

/* effects */

.tip.fade {
  transition: opacity 100ms;
  -moz-transition: opacity 100ms;
  -webkit-transition: opacity 100ms;
}

.tip-hide {
  opacity: 0;
}

#drop-anywhere {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,.8);
  display: none;
}

#drop-anywhere.show {
  display: block;
}

#notifications {
  position: fixed;
  top: 10px;
  right: 15px;
}

#notifications li {
  margin-bottom: 5px;
  list-style: none;
}

.notification {
  position: relative;
  max-width: 600px;
  min-width: 250px;
  border: 1px solid #eee;
  background: white;
  z-index: 100;
}

.notification .content {
  padding: 15px 20px;
}

.notification .title {
  margin: 0 0 5px 0;
  font-size: 16px;
  font-weight: normal;
}

.notification p {
  margin: 0;
  padding: 0;
  font-size: .9em;
}

.notification .close {
  position: absolute;
  top: 5px;
  right: 10px;
  text-decoration: none;
  color: #888;
  display: none;
}

.notification.closable .close {
  display: block;
}

.notification .close:hover {
  color: black;
}

.notification .close:active {
  margin-top: 1px;
}

/* close */

.notification .close {
  position: absolute;
  top: 3px;
  right: 10px;
  text-decoration: none;
  color: #888;
  font-size: 16px;
  font-weight: bold;
  display: none;
}

/* slide */

.notification.slide {
  -webkit-transition: opacity 300ms, top 300ms;
  -moz-transition: opacity 300ms, top 300ms;
}

.notification.slide.hide {
  opacity: 0;
  top: -500px;
}

/* fade */

.notification.fade {
  -webkit-transition: opacity 300ms;
  -moz-transition: opacity 300ms;
}

.notification.fade.hide {
  opacity: 0;
}

/* scale */

.notification.scale {
  -webkit-transition: -webkit-transform 300ms;
  -moz-transition: -moz-transform 300ms;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
}

.notification.scale.hide {
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
}

.box {
  border: 1px solid #cdcdcd;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: 0 3px 3px rgba(51,51,51,0.2);
  box-shadow: 0 3px 3px rgba(51,51,51,0.2);
}

.box-top {
  background: #f2f2f2;
  position: relative;
  display: block;
  padding: 11px 13px;
  -webkit-border-top-left-radius: 5px;
  border-top-left-radius: 5px;
  -webkit-border-top-right-radius: 5px;
  border-top-right-radius: 5px;
}

.activity-view .overlay {
  z-index: 500;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: none;
  position: absolute;
  display: none;
}

.activity-view.shown .overlay {
  display: block;
}

.activity-view .view {
  position: fixed;
  width: 100%;
  height: 0;
  bottom: 0;
  left: 0;
  margin: 0;
  overflow: visible;
  z-index: 1000;
  font-family: Arial;
  display: none;
}

.activity-view.shown .view {
  display: block;
}

.activity-view .inner {
  border-top: 1px solid #28282A;
  background: rgba(51, 52, 56, .95);
  padding-top: 15px;
  transition: transform 500ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
  -moz-transition: -moz-transform 500ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
  -webkit-transition: -webkit-transform 500ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
  -o-transition: -o-transform 500ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
}

.activity-view table {
  padding-top: 0px;
  width: 100%;
}

.activity-view table td {
  vertical-align: middle;
  text-align: center;
  padding: 10px;
  width: 33%;
}

.activity-view .action {
  display: inline-block;
  background: #eee;
  border: none;
  width: 59px;
  height: 59px;
  border-radius: 4px;
  cursor: pointer;
}

.activity-view .text {
  color: #fff;
  text-transform: uppercase;
  font-size: 12px;
  font-size: 10px;
  margin-top: 5px;
}

.activity-view .cancel {
  padding: 5px 50px 15px 50px;
}

.activity-view .cancel-btn {
  margin-top: 10px;
  padding: 10px;
  font-size: 12px;
  text-transform: uppercase;
  background: #545454;
  color: #fff;
  border: none;
  width: 100%;
  box-shadow: 0 1px 0 #000;
  border-radius: 4px;
  cursor: pointer;
  line-height: normal;
}

.activity-view .cancel-btn:active {
  opacity: .8;
}

.gist {
  color: #000;
  height: 100%;
}

.gist-syntax {
  height: 100%;
}

.gist .highlighttable {
  height: 100%;
  width: 100%;
}

.gist .highlight {
  -webkit-animation-name: none !important;
  -moz-animation-name: none !important;
  -ms-animation-name: none !important;
  animation-name: none !important;
}

.gist-syntax pre {
  tab-size: 2;
  margin: 0;
  padding: 0;
  text-align: left;
  white-space: pre;
}

.gist-syntax table {
  margin-top: 0;
}

.gist-syntax td {
  margin: 0;
  padding: 0;
  vertical-align: top;
}

.gist-syntax .linenos {
  width: auto;
  margin-top: 0;
  margin-bottom: 0;
  margin-right: 5px;
  padding: 0 2px;
  font-size: 11px;
  font-weight: normal !important;
  border-right: 1px solid #F3F3F3;
  background: #FAFAFA;
  color: #B1B1B1;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.gist-syntax .code {
  width: 100%;
  background: white;
  padding: 5px;
  font-size: 11px;
}

.gist-syntax .linenodiv {
  padding: 5px 10px;
}

.gist-syntax .linenodiv pre {
  text-align: center;
}

.gist div {
  padding: 0;
  margin: 0;
}

.gist .gist-file {
  border: 1px solid #dedede;
  /* gray */
  font-family: Monaco, "Courier New", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", monospace;
  margin-bottom: 1em;
}

.gist .gist-file .gist-meta {
  overflow: hidden;
  font-size: 85%;
  padding: .5em;
  color: #666;
  background-color: #eaeaea;
}

.gist .gist-file .gist-meta a {
  color: #369;
}

.gist .gist-file .gist-meta a:visited {
  color: #737;
}

.gist .gist-file .gist-data {
  overflow: auto;
  word-wrap: normal;
  background-color: #f8f8ff;
  border-bottom: 1px solid #ddd;
  font-size: 100%;
}

.gist .gist-file .gist-data pre {
  font-family: 'Bitstream Vera Sans Mono', 'Courier', monospace;
  background: transparent !important;
  margin: 0 !important;
  border: none !important;
  padding: .25em .5em .5em .5em !important;
}

.gist .gist-file .gist-data .gist-highlight {
  background: transparent !important;
}

.gist .gist-file .gist-data .gist-line-numbers {
  background-color: #ececec;
  color: #aaa;
  border-right: 1px solid #ddd;
  text-align: right;
}

.gist .gist-file .gist-data .gist-line-numbers span {
  clear: right;
  display: block;
}

.gist-syntax {
  background: #ffffff;
}

.gist-syntax .c {
  color: #999988;
  font-style: italic;
}

/* Comment */

.gist-syntax .err {
  color: #a61717;
  background-color: #e3d2d2;
}

/* Error */

.gist-syntax .k {
  color: #000000;
  font-weight: bold;
}

/* Keyword */

.gist-syntax .o {
  color: #000000;
  font-weight: bold;
}

/* Operator */

.gist-syntax .cm {
  color: #999988;
  font-style: italic;
}

/* Comment.Multiline */

.gist-syntax .cp {
  color: #999999;
  font-weight: bold;
}

/* Comment.Preproc */

.gist-syntax .c1 {
  color: #999988;
  font-style: italic;
}

/* Comment.Single */

.gist-syntax .cs {
  color: #999999;
  font-weight: bold;
  font-style: italic;
}

/* Comment.Special */

.gist-syntax .gd {
  color: #000000;
  background-color: #ffdddd;
}

/* Generic.Deleted */

.gist-syntax .gd .x {
  color: #000000;
  background-color: #ffaaaa;
}

/* Generic.Deleted.Specific */

.gist-syntax .ge {
  color: #000000;
  font-style: italic;
}

/* Generic.Emph */

.gist-syntax .gr {
  color: #aa0000;
}

/* Generic.Error */

.gist-syntax .gh {
  color: #999999;
}

/* Generic.Heading */

.gist-syntax .gi {
  color: #000000;
  background-color: #ddffdd;
}

/* Generic.Inserted */

.gist-syntax .gi .x {
  color: #000000;
  background-color: #aaffaa;
}

/* Generic.Inserted.Specific */

.gist-syntax .go {
  color: #888888;
}

/* Generic.Output */

.gist-syntax .gp {
  color: #555555;
}

/* Generic.Prompt */

.gist-syntax .gs {
  font-weight: bold;
}

/* Generic.Strong */

.gist-syntax .gu {
  color: #aaaaaa;
}

/* Generic.Subheading */

.gist-syntax .gt {
  color: #aa0000;
}

/* Generic.Traceback */

.gist-syntax .kc {
  color: #000000;
  font-weight: bold;
}

/* Keyword.Constant */

.gist-syntax .kd {
  color: #000000;
  font-weight: bold;
}

/* Keyword.Declaration */

.gist-syntax .kp {
  color: #000000;
  font-weight: bold;
}

/* Keyword.Pseudo */

.gist-syntax .kr {
  color: #000000;
  font-weight: bold;
}

/* Keyword.Reserved */

.gist-syntax .kt {
  color: #445588;
  font-weight: bold;
}

/* Keyword.Type */

.gist-syntax .m {
  color: #009999;
}

/* Literal.Number */

.gist-syntax .s {
  color: #d14;
}

/* Literal.String */

.gist-syntax .na {
  color: #008080;
}

/* Name.Attribute */

.gist-syntax .nb {
  color: #0086B3;
}

/* Name.Builtin */

.gist-syntax .nc {
  color: #445588;
  font-weight: bold;
}

/* Name.Class */

.gist-syntax .no {
  color: #008080;
}

/* Name.Constant */

.gist-syntax .ni {
  color: #800080;
}

/* Name.Entity */

.gist-syntax .ne {
  color: #990000;
  font-weight: bold;
}

/* Name.Exception */

.gist-syntax .nf {
  color: #990000;
  font-weight: bold;
}

/* Name.Function */

.gist-syntax .nn {
  color: #555555;
}

/* Name.Namespace */

.gist-syntax .nt {
  color: #000080;
}

/* Name.Tag */

.gist-syntax .nv {
  color: #008080;
}

/* Name.Variable */

.gist-syntax .ow {
  color: #000000;
  font-weight: bold;
}

/* Operator.Word */

.gist-syntax .w {
  color: #bbbbbb;
}

/* Text.Whitespace */

.gist-syntax .mf {
  color: #009999;
}

/* Literal.Number.Float */

.gist-syntax .mh {
  color: #009999;
}

/* Literal.Number.Hex */

.gist-syntax .mi {
  color: #009999;
}

/* Literal.Number.Integer */

.gist-syntax .mo {
  color: #009999;
}

/* Literal.Number.Oct */

.gist-syntax .sb {
  color: #d14;
}

/* Literal.String.Backtick */

.gist-syntax .sc {
  color: #d14;
}

/* Literal.String.Char */

.gist-syntax .sd {
  color: #d14;
}

/* Literal.String.Doc */

.gist-syntax .s2 {
  color: #d14;
}

/* Literal.String.Double */

.gist-syntax .se {
  color: #d14;
}

/* Literal.String.Escape */

.gist-syntax .sh {
  color: #d14;
}

/* Literal.String.Heredoc */

.gist-syntax .si {
  color: #d14;
}

/* Literal.String.Interpol */

.gist-syntax .sx {
  color: #d14;
}

/* Literal.String.Other */

.gist-syntax .sr {
  color: #009926;
}

/* Literal.String.Regex */

.gist-syntax .s1 {
  color: #d14;
}

/* Literal.String.Single */

.gist-syntax .ss {
  color: #990073;
}

/* Literal.String.Symbol */

.gist-syntax .bp {
  color: #999999;
}

/* Name.Builtin.Pseudo */

.gist-syntax .vc {
  color: #008080;
}

/* Name.Variable.Class */

.gist-syntax .vg {
  color: #008080;
}

/* Name.Variable.Global */

.gist-syntax .vi {
  color: #008080;
}

/* Name.Variable.Instance */

.gist-syntax .il {
  color: #009999;
}

/* Literal.Number.Integer.Long */

.mobile #dev {
  display: none;
}

#dev {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background: rgba(0,0,0,0.75);
  text-align: left;
  z-index: 999999;
  top: -100px;
  -webkit-transition: top 300ms ease-out;
  -moz-transition: top 300ms ease-out;
  -o-transition: top 300ms ease-out;
  -ms-transition: top 300ms ease-out;
  transition: top 300ms ease-out;
}

#dev.show {
  top: 0;
}

#dev ul {
  margin: 0;
  padding: 0 10px;
  height: 60px;
}

#dev ul li {
  margin: 0;
  padding: 20px 15px;
  height: 60px;
  display: inline-block;
  border-left: 1px solid rgba(0,0,0,0.2);
  border-right: 1px solid rgba(255,255,255,0.15);
}

#dev ul li:first-child {
  border-left: none;
}

#dev ul li:last-child {
  border-right: none;
}

#dev a {
  color: rgba(255,255,255,0.8);
}

#dev a:hover {
  color: #fff;
}

#dev input {
  margin: 0;
  background: #fff;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  font-size: 12px;
  height: 30px;
  line-height: 30px;
  color: #333;
  margin-top: -5px;
}

.pie {
  border-width: 1px;
  color: #ef594b !important;
}

@font-face {
  font-family: 'icons';
  src: url("https://s1.cldup.com/icons/font/icons.eot?4");
  src: url("https://s1.cldup.com/icons/font/icons.eot?4#iefix") format('embedded-opentype'), url("https://s1.cldup.com/icons/font/icons.woff?4") format('woff'), url("https://s1.cldup.com/icons/font/icons.ttf?4") format('truetype'), url("https://s1.cldup.com/icons/font/icons.svg?4#icons") format('svg');
  font-weight: normal;
  font-style: normal;
}

i.icon,
[class^="icon-"]:before,
[class*=" icon-"]:before {
  font-family: 'icons';
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: 0.2em;
  text-align: center;
  cursor: default;
  line-height: 1em;
}

@charset "UTF-8";


.icon-link-ext-alt:before {
  content: '\e80e';
}

/* '' */

.icon-plus:before {
  content: '\2b';
}

/* '+' */

.icon-minus:before {
  content: '\2d';
}

/* '-' */

.icon-appstore:before {
  content: '\41';
}

/* 'A' */

.icon-google:before {
  content: '\47';
}

/* 'G' */

.icon-twitter:before {
  content: '\54';
}

/* 'T' */

.icon-windows:before {
  content: '\57';
}

/* 'W' */

.icon-keyboard:before {
  content: '\2328';
}

/* '⌨' */

.icon-pause:before {
  content: '\2389';
}

/* '⎉' */

.icon-hourglass:before {
  content: '\23f3';
}

/* '⏳' */

.icon-play:before {
  content: '\25b6';
}

/* '▶' */

.icon-star:before {
  content: '\2605';
}

/* '★' */

.icon-star-empty:before {
  content: '\2606';
}

/* '☆' */

.icon-heart-empty:before {
  content: '\2661';
}

/* '♡' */

.icon-heart:before {
  content: '\2665';
}

/* '♥' */

.icon-music:before {
  content: '\266a';
}

/* '♪' */

.icon-note-beamed:before {
  content: '\e807';
}

/* '' */

.icon-th-1:before {
  content: '\268f';
}

/* '⚏' */

.icon-cog:before {
  content: '\2699';
}

/* '⚙' */

.icon-attention:before {
  content: '\26a0';
}

/* '⚠' */

.icon-flash:before {
  content: '\26a1';
}

/* '⚡' */

.icon-pencil:before {
  content: '\270e';
}

/* '✎' */

.icon-ok:before {
  content: '\2713';
}

/* '✓' */

.icon-cancel:before {
  content: '\2715';
}

/* '✕' */

.icon-cancel-circle:before {
  content: '\2716';
}

/* '✖' */

.icon-help:before {
  content: '\2753';
}

/* '❓' */

.icon-quote-left:before {
  content: '\275d';
}

/* '❝' */

.icon-quote-right:before {
  content: '\275e';
}

/* '❞' */

.icon-plus-circle:before {
  content: '\2795';
}

/* '➕' */

.icon-minus-circle:before {
  content: '\2796';
}

/* '➖' */

.icon-direction:before {
  content: '\27a2';
}

/* '➢' */

.icon-up-thin:before {
  content: '\2b06';
}

/* '⬆' */

.icon-down-thin:before {
  content: '\2b07';
}

/* '⬇' */

.icon-cog-1:before {
  content: '\9881';
}

/* '颁' */

.icon-trash:before {
  content: '\e01b';
}

/* '' */

.icon-doc:before {
  content: '\e0c1';
}

/* '' */

.icon-left-bold:before {
  content: '\e4ad';
}

/* '' */

.icon-right-bold:before {
  content: '\e4ae';
}

/* '' */

.icon-help-circle:before {
  content: '\e704';
}

/* '' */

.icon-info-circle:before {
  content: '\e705';
}

/* '' */

.icon-eye-1:before {
  content: '\e801';
}

/* '' */

.icon-export:before {
  content: '\e715';
}

/* '' */

.icon-print:before {
  content: '\e716';
}

/* '' */

.icon-location:before {
  content: '\e724';
}

/* '' */

.icon-resize-full:before {
  content: '\e744';
}

/* '' */

.icon-resize-small:before {
  content: '\e746';
}

/* '' */

.icon-zoom-in:before {
  content: '\e750';
}

/* '' */

.icon-zoom-out:before {
  content: '\e751';
}

/* '' */

.icon-down-open:before {
  content: '\e75c';
}

/* '' */

.icon-left-open:before {
  content: '\e75d';
}

/* '' */

.icon-right-open:before {
  content: '\e75e';
}

/* '' */

.icon-up-open:before {
  content: '\e75f';
}

/* '' */

.icon-back-in-time:before {
  content: '\e771';
}

/* '' */

.icon-dot:before {
  content: '\e78b';
}

/* '' */

.icon-dot-3:before {
  content: '\e78d';
}

/* '' */

.icon-easel:before {
  content: '\e7b5';
}

/* '' */

.icon-emo-happy:before {
  content: '\e804';
}

/* '' */

.icon-emo-unhappy:before {
  content: '\e805';
}

/* '' */

.icon-garden:before {
  content: '\e81a';
}

/* '' */

.icon-firefox:before {
  content: '\e840';
}

/* '' */

.icon-chrome:before {
  content: '\e841';
}

/* '' */

.icon-opera:before {
  content: '\e842';
}

/* '' */

.icon-ie:before {
  content: '\e843';
}

/* '' */

.icon-move:before {
  content: '\f047';
}

/* '' */

.icon-filter:before {
  content: '\f0b0';
}

/* '' */

.icon-menu:before {
  content: '\f0c9';
}

/* '' */

.icon-mail-alt:before {
  content: '\f0e0';
}

/* '' */

.icon-download-cloud:before {
  content: '\f0ed';
}

/* '' */

.icon-doc-alt:before {
  content: '\f0f6';
}

/* '' */

.icon-facebook:before {
  content: '\f300';
}

/* '' */

.icon-github:before {
  content: '\f308';
}

/* '' */

.icon-picture:before {
  content: '\f304';
}

/* '' */

.icon-globe:before {
  content: '\f30e';
}

/* '' */

.icon-mic:before {
  content: '\f3a4';
}

/* '' */

.icon-video:before {
  content: '\f3ac';
}

/* '' */

.icon-monitor:before {
  content: '\f4bb';
}

/* '' */

.icon-cd:before {
  content: '\f4bf';
}

/* '' */

.icon-folder-open:before {
  content: '\f4c2';
}

/* '' */

.icon-doc-2:before {
  content: '\e803';
}

/* '' */

.icon-chart-bar:before {
  content: '\f4ca';
}

/* '' */

.icon-attach:before {
  content: '\f4ce';
}

/* '' */

.icon-download:before {
  content: '\f4e5';
}

/* '' */

.icon-mobile:before {
  content: '\f4f1';
}

/* '' */

.icon-camera:before {
  content: '\f4f7';
}

/* '' */

.icon-light-up:before {
  content: '\f506';
}

/* '' */

.icon-search:before {
  content: '🔍';
}

/* '\1f50d' */

.icon-key:before {
  content: '\f511';
}

/* '' */

.icon-lock-1:before {
  content: '\e802';
}

/* '' */

.icon-lock-open-1:before {
  content: '\e806';
}

/* '' */

.icon-link:before {
  content: '\f517';
}

/* '' */

.icon-clock:before {
  content: '\f554';
}

/* '' */

.icon-chart-area:before {
  content: '\e800';
}

/* '' */

.icon-zoom-in:before {
  content: '\e808';
}

/* '' */

.icon-zoom-out:before {
  content: '\e809';
}

/* '' */

.icon-article:before {
  content: '\e80b';
}

/* '' */

.icon-code:before {
  content: '\e80a';
}

/* '' */

.icon-article:before {
  content: '\e80b';
}

/* '' */

.icon-info:before {
  content: '\e80d';
}

/* '' */

.box {
  border: 1px solid #cdcdcd;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: 0 3px 3px rgba(51,51,51,0.2);
  box-shadow: 0 3px 3px rgba(51,51,51,0.2);
}

.box-top {
  background: #f2f2f2;
  position: relative;
  display: block;
  padding: 11px 13px;
  -webkit-border-top-left-radius: 5px;
  border-top-left-radius: 5px;
  -webkit-border-top-right-radius: 5px;
  border-top-right-radius: 5px;
}

#notifications {
  z-index: 1000;
}

#notifications li.notification {
  padding-left: 50px;
  border-top: 1px solid #fff;
  -webkit-box-shadow: 0 0 0 1px #d2d2d2;
  box-shadow: 0 0 0 1px #d2d2d2;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  font-size: 13px;
  background: rgba(255,255,255,1) url("https://cloudup.com/core/icons/Location_Marker_32.png") 10px 50% no-repeat;
}

#notifications li.notification:hover {
  -webkit-box-shadow: 0 0 0 1px #bdbdbd;
  box-shadow: 0 0 0 1px #bdbdbd;
  background: rgba(255,255,255,1) url("https://cloudup.com/core/icons/Location_Marker_32.png") 10px 50% no-repeat;
}

#notifications li.notification .content {
  border-left: 1px solid #dbdbdb;
  -webkit-box-shadow: -1px 0 0 #fff;
  box-shadow: -1px 0 0 #fff;
  text-align: left;
  padding: 10px 20px;
  color: #535353;
}

#notifications li.notification .title {
  font-size: 13px;
  color: #1f7dca;
}

#notifications li.notification .close {
  opacity: 0.5;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
  filter: alpha(opacity=50);
}

#notifications li.notification .close:hover {
  opacity: 0.75;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=75);
  filter: alpha(opacity=75);
}

#notifications li.progress-notification {
  padding-left: 0;
  background-image: none;
}

#notifications li.progress-notification .content {
  border-left: 0;
  padding-top: 20px;
  padding-bottom: 20px;
  padding-left: 60px;
}

#notifications li.progress-notification .progress-notification-canvas {
  position: absolute;
  top: 50%;
  left: 10px;
  margin-top: -20px;
}

#notifications li.progress-notification ul {
  margin: 0;
  padding: 0;
}

.box {
  border: 1px solid #cdcdcd;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: 0 3px 3px rgba(51,51,51,0.2);
  box-shadow: 0 3px 3px rgba(51,51,51,0.2);
}

.box-top {
  background: #f2f2f2;
  position: relative;
  display: block;
  padding: 11px 13px;
  -webkit-border-top-left-radius: 5px;
  border-top-left-radius: 5px;
  -webkit-border-top-right-radius: 5px;
  border-top-right-radius: 5px;
}

.progress-bar {
  position: relative;
  background: -webkit-gradient(linear, left bottom, left top, color-stop(0.4, #f2f2f2), color-stop(1, #f2f2f2));
  background: -webkit-linear-gradient(bottom, #f2f2f2 40%, #f2f2f2 100%);
  background: -moz-linear-gradient(bottom, #f2f2f2 40%, #f2f2f2 100%);
  background: -o-linear-gradient(bottom, #f2f2f2 40%, #f2f2f2 100%);
  background: -ms-linear-gradient(bottom, #f2f2f2 40%, #f2f2f2 100%);
  background: linear-gradient(bottom, #f2f2f2 40%, #f2f2f2 100%);
  height: 40px;
  line-height: 34px;
  -webkit-border-radius: 40px;
  border-radius: 40px;
  padding: 2px;
  border: 1px solid #cdcdcd;
  -webkit-box-shadow: inset 0 0 3px #cdcdcd;
  box-shadow: inset 0 0 3px #cdcdcd;
}

.progress-current {
  background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #00a0cb), color-stop(0.9, #40d9fa), color-stop(0.3, #40d9fa));
  background: -webkit-linear-gradient(bottom, #00a0cb 0%, #40d9fa 90%, #40d9fa 30%);
  background: -moz-linear-gradient(bottom, #00a0cb 0%, #40d9fa 90%, #40d9fa 30%);
  background: -o-linear-gradient(bottom, #00a0cb 0%, #40d9fa 90%, #40d9fa 30%);
  background: -ms-linear-gradient(bottom, #00a0cb 0%, #40d9fa 90%, #40d9fa 30%);
  background: linear-gradient(bottom, #00a0cb 0%, #40d9fa 90%, #40d9fa 30%);
  position: absolute;
  -webkit-border-radius: 50px;
  border-radius: 50px;
  top: 2px;
  left: 2px;
  text-align: right;
  color: #fff;
  padding-right: 20px;
  line-height: 34px;
  -webkit-transition: width 500ms ease-out;
  -moz-transition: width 500ms ease-out;
  -o-transition: width 500ms ease-out;
  -ms-transition: width 500ms ease-out;
  transition: width 500ms ease-out;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-shadow: inset 0 0 2px rgba(0,0,0,0.3);
  box-shadow: inset 0 0 2px rgba(0,0,0,0.3);
}

.progress-current em {
  text-shadow: -1px -1px 0 rgba(0,0,0,0.2);
  font-style: normal;
}

.progress-total {
  color: #cdcdcd;
  text-align: right;
  padding-right: 20px;
}

.progress-total em {
  font-style: normal;
  text-shadow: 1px 1px 0 #fff;
}

.progress-bar.small {
  font-size: 12px;
  line-height: 20px;
  -webkit-border-radius: 20px;
  border-radius: 20px;
}

.progress-bar.small .progress-current {
  padding-right: 10px;
  height: 20px;
}

.progress-bar.small .progress-total {
  padding-right: 10px;
}

.progress-bar.tiny {
  height: 16px;
  font-size: 10px;
  line-height: 5px;
  -webkit-border-radius: 15px;
  border-radius: 15px;
}

.progress-bar.tiny em {
  display: none;
}

.progress-bar.tiny .progress-current {
  padding-right: 5px;
  height: 10px;
  line-height: 0;
}

.progress-bar.tiny .progress-total {
  padding-right: 5px;
}

.box {
  border: 1px solid #cdcdcd;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: 0 3px 3px rgba(51,51,51,0.2);
  box-shadow: 0 3px 3px rgba(51,51,51,0.2);
}

.box-top {
  background: #f2f2f2;
  position: relative;
  display: block;
  padding: 11px 13px;
  -webkit-border-top-left-radius: 5px;
  border-top-left-radius: 5px;
  -webkit-border-top-right-radius: 5px;
  border-top-right-radius: 5px;
}

.box {
  border: 1px solid #cdcdcd;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: 0 3px 3px rgba(51,51,51,0.2);
  box-shadow: 0 3px 3px rgba(51,51,51,0.2);
}

.box-top {
  background: #f2f2f2;
  position: relative;
  display: block;
  padding: 11px 13px;
  -webkit-border-top-left-radius: 5px;
  border-top-left-radius: 5px;
  -webkit-border-top-right-radius: 5px;
  border-top-right-radius: 5px;
}

.switch {
  display: inline-block;
  width: 90px;
  height: 40px;
  position: relative;
  background: red;
  cursor: pointer;
}

.switch-knob {
  width: 40px;
  height: 40px;
  position: absolute;
  left: 0;
  background: blue;
}

input[type=text].suggestive,
input[type=email].suggestive {
  background-color: transparent;
  position: relative;
  z-index: 10;
}

input[type=text].suggestion,
input[type=email].suggestion {
  border: 1px solid transparent;
  color: #d4d4d4;
  z-index: 1;
  -ms-box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.user-avatar {
  height: 26px;
  width: 26px;
  display: inline-block;
  zoom: 1;
  *display: inline;
  background-position: top center;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  -ms-background-size: cover;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  -ms-border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  -ms-transition: 50ms opacity ease-in;
  -moz-transition: 50ms opacity ease-in;
  -webkit-transition: 50ms opacity ease-in;
  transition: 50ms opacity ease-in;
}

.user-avatar.ready {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

#bar {
  padding-top: 23px;
  padding-left: 20px;
  padding-right: 20px;
  text-align: left;
  overflow: hidden;
}

#bar a {
  text-decoration: none;
  color: white;
}

#bar .logo {
  display: block;
}

#bar.logged_in {
  background: inherit;
  padding-top: 0;
  padding-bottom: 0;
  height: 70px;
  position: fixed;
  width: 100%;
  z-index: 10000;
  -ms-transition: height 200ms ease;
  -moz-transition: height 200ms ease;
  -webkit-transition: height 200ms ease;
  transition: height 200ms ease;
}

#bar.logged_in .links {
  display: none;
}

#bar.logged_in a.logo:hover {
  opacity: 0.9;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=90);
  filter: alpha(opacity=90);
}

#bar.logged_in a.logo {
  text-indent: -500em;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  width: 48px;
  height: 48px;
  position: relative;
  top: 11px;
  margin-left: 5px;
  margin-top: 1px;
  background: url("https://s1.cldup.com/bar/images/logo-bar.png");
  background-repeat: no-repeat;
  float: left;
  -ms-background-size: contain;
  -moz-background-size: contain;
  -webkit-background-size: contain;
  background-size: contain;
  -ms-transition: height 200ms ease, width 200ms ease;
  -moz-transition: height 200ms ease, width 200ms ease;
  -webkit-transition: height 200ms ease, width 200ms ease;
  transition: height 200ms ease, width 200ms ease;
}

#bar.logged_in.loaded .logo {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

#bar.logged_in.detached {
  height: 60px;
  background: #f2f2f2;
  border-bottom: 1px solid #cfcdcb;
}

#bar.logged_in.detached a.logo {
  width: 36px;
  height: 36px;
}

#bar.logged_in .user {
  text-align: right;
  margin-right: 5px;
  float: right;
  padding-top: 12px;
  padding-right: 0;
  padding-left: 20px;
  padding-bottom: 11px;
  height: 70px;
  width: 150px;
}

#bar.logged_in .user .badge,
#bar.logged_in .user .user-badge {
  display: inline-block;
  zoom: 1;
  *display: inline;
  vertical-align: middle;
}

#bar.logged_out {
  height: 90px;
  background-color: #ef6c5e;
}

#bar.logged_out a.logo {
  background: url("https://s1.cldup.com/bar/images/logo-login.png");
  float: left;
  margin-left: 80px;
  font-size: 40px;
  margin-top: 8px;
  width: 136px;
  height: 46px;
}

#bar.logged_out .links span {
  margin-right: 10px;
}

#bar.logged_out .links a {
  margin-left: 44px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

#bar.logged_out .links {
  float: right;
  margin-right: 80px;
  font-size: 14px;
  margin-top: 28px;
  color: white;
}

#bar.logged_out .link-signup {
  display: none;
}

#bar.logged_out .link-login,
#bar.logged_out .link-blog {
  display: inline-block;
  zoom: 1;
  *display: inline;
}

#bar.logged_out.page_login .link-login {
  display: none;
}

#bar.logged_out.page_login .link-signup {
  display: inline-block;
  zoom: 1;
  *display: inline;
}

#bar .user-badge,
#bar .buttons {
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  -ms-transition: linear opacity 200ms;
  -moz-transition: linear opacity 200ms;
  -webkit-transition: linear opacity 200ms;
  transition: linear opacity 200ms;
}

#bar .buttons {
  float: left;
  text-transform: uppercase;
  margin-left: 20px;
}

#bar .buttons a {
  margin: 0 10px;
  color: #333;
  text-shadow: 0 1px 0 #fff;
  display: inline-block;
  zoom: 1;
  *display: inline;
}

#bar .buttons a:hover {
  color: #f0594c;
}

#bar a.people {
  display: none;
}

#bar.sidebar_hidden a.people {
  display: inline-block;
  zoom: 1;
  *display: inline;
}

#bar.logged_in .user-badge,
#bar.logged_in .buttons {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

@media only screen and (max-width: 320px) {
  #bar.logged_out .links .link-blog {
    display: none;
  }
}

@media only screen and (max-width: 768px) {
  #bar.logged_in a.logo {
    width: 36px;
    height: 36px;
    margin-left: 20px;
  }

  #bar.logged_in .user {
    margin-right: 25px;
    background: none;
    border-left: none;
    border-right: none;
    -ms-box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    -ms-transition: none;
    -moz-transition: none;
    -webkit-transition: none;
    transition: none;
  }

  #bar.logged_in {
    padding-left: 0;
    padding-right: 0;
  }

  #bar.logged_in.detached .user {
    margin-right: 25px;
  }

  #bar.logged_out a.logo {
    margin-left: 0;
  }

  #bar.logged_out .links a {
    margin-left: 26px;
  }

  #bar.logged_out .links {
    margin-right: 0;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  #bar.logged_in a.logo {
    background-image: url("https://s1.cldup.com/bar/images/logo-bar@2x.png");
    background-size: contain;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  #bar.logged_out a.logo {
    background-image: url("https://s1.cldup.com/bar/images/logo-login@2x.png");
    background-size: contain;
  }
}

html.blog-page > body {
  background-color: #fefefe;
}

.blog-list {
  background-color: inherit;
}

.blog-post {
  padding: 0 30px;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  max-width: 700px;
  width: 100%;
  margin: 0 auto 100px;
}

.blog-post.loaded {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

.blog-post h1 a.deep-link,
.blog-post h2 a.deep-link,
.blog-post h3 a.deep-link,
.blog-post h4 a.deep-link,
.blog-post h5 a.deep-link,
.blog-post h6 a.deep-link {
  margin-left: -30px;
  width: 30px;
  font-size: 0.8em;
  line-height: 1em;
  text-align: right;
  vertical-align: middle;
  display: none;
}

.blog-post h1:hover a.deep-link,
.blog-post h2:hover a.deep-link,
.blog-post h3:hover a.deep-link,
.blog-post h4:hover a.deep-link,
.blog-post h5:hover a.deep-link,
.blog-post h6:hover a.deep-link {
  display: inline-block;
  zoom: 1;
  *display: inline;
}

.blog-post h1 {
  margin-bottom: 0;
  font-weight: bold;
  font-size: 26px;
  line-height: 28px;
  color: #333;
  letter-spacing: 0.4px;
  -ms-user-select: auto;
  -moz-user-select: auto;
  -webkit-user-select: auto;
  user-select: auto;
}

.blog-post h1 a:hover {
  color: #4ba0bf;
}

.blog-post h1 a:visited {
  color: #333;
}

.blog-post h1 a {
  font-weight: bold;
  color: #333;
}

.blog h2 {
  font-size: 20px;
  letter-spacing: 1px;
}

.blog-post a {
  text-decoration: none;
}

.blog-post a.read-more {
  color: #29a3c7;
  font-size: 12px;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 1.5px;
}

.blog-post img {
  max-width: 100%;
}

.blog-post a:visited,
.blog-post a:hover {
  color: #4ba0bf;
}

.blog-post .summary {
  -ms-user-select: auto;
  -moz-user-select: auto;
  -webkit-user-select: auto;
  user-select: auto;
}

.blog-post p,
.blog-post ul li {
  font-family: droid-serif, Georgia, serif;
  font-size: 20px;
  text-align: left;
  cursor: text;
  color: #111111;
  line-height: 28px;
  -ms-user-select: auto;
  -moz-user-select: auto;
  -webkit-user-select: auto;
  user-select: auto;
}

.blog-post hr {
  display: block;
  border: 0;
  border-bottom: 1px solid rgba(223, 228, 234, 0.8);
  top: 50px;
  position: relative;
}

.blog-post a.see-all {
  display: block;
  border-bottom: 1px solid #dfe4ea;
  position: relative;
  top: 10px;
  font-size: 12px;
  text-transform: uppercase;
  color: #29a3c7;
}

.blog-post a.see-all::before {
  content: 'See all posts';
  position: absolute;
  width: 134px;
  text-indent: 0px;
  right: 0;
  top: 0;
  text-align: center;
  height: 36px;
  line-height: 36px;
  background-color: white;
  border: 1px solid #dfe4ea;
  -ms-border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

.blog-post a.see-all:hover::before {
  background-color: #fbfbfb;
}

.blog-post .user-avatar {
  float: right;
  width: 50px;
  height: 50px;
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

.blog-post .views {
  padding: 0;
  font-size: 15px;
  display: inline-block;
  zoom: 1;
  *display: inline;
  text-align: justify;
  white-space: nowrap;
  font-weight: bold;
  word-spacing: -4px;
  -ms-transition: -ms-transform 150ms ease-in;
  -moz-transition: -moz-transform 150ms ease-in;
  -webkit-transition: -webkit-transform 150ms ease-in;
  -webkit-transition: -webkit-transform 150ms ease-in;
  -moz-transition: -moz-transform 150ms ease-in;
  -ms-transition: -ms-transform 150ms ease-in;
  -o-transition: -o-transform 150ms ease-in;
  -ms-transition: transform 150ms ease-in;
  -moz-transition: transform 150ms ease-in;
  -webkit-transition: transform 150ms ease-in;
  transition: transform 150ms ease-in;
}

.blog-post .views.onchange {
  -ms-transform: scale(1.5);
  -moz-transform: scale(1.5);
  -webkit-transform: scale(1.5);
  transform: scale(1.5);
}

.blog-post .summary {
  display: block;
}

.blog-post .summary blockquote::before,
.blog-post .summary blockquote::after {
  content: ' ';
  display: block;
  position: absolute;
  background-color: white;
  left: -21px;
  width: 21px;
  height: 8px;
}

.blog-post .summary blockquote::after {
  height: 6px;
  bottom: 0;
}

.blog-post .summary blockquote p {
  color: #434343;
  font-style: oblique;
}

.blog-post .summary blockquote {
  margin: 29px 0;
  border-left: 1px solid rgba(0, 0, 0, 0.8);
  padding-left: 20px;
  position: relative;
}

.blog-post .summary .author {
  text-align: right;
  margin-top: 30px;
}

.blog-post span.private::after {
  margin-left: 10px;
  color: #999;
  content: 'Private';
  text-transform: uppercase;
  background-color: #eb3d31;
  color: white;
  font-size: 10px;
  font-weight: 700;
  padding: 2px 5px;
  margin-left: 15px;
}

.blog-post span.private {
  display: none;
}

.blog-post.private span.private {
  display: inline-block;
  zoom: 1;
  *display: inline;
}

@media only screen and (max-width: 600px) {
  .blog-post {
    width: 100%;
    margin-bottom: 50px;
  }

  .blog-post h1 {
    font-size: 20px;
    line-height: 24px;
    letter-spacing: 0;
  }

  .blog-post h2 {
    font-size: 16px;
    line-height: 18px;
  }

  .blog-post p,
  .blog-post ul li {
    font-size: 17px;
    line-height: 23px;
  }

  .blog-post .user-avatar {
    width: 30px;
    height: 30px;
  }

  .blog-post hr {
    top: 25px;
    position: relative;
  }

  .blog-post a.see-all::before {
    right: 50%;
  }

  .blog-post a.see-all {
    border: 0;
    margin-left: 134px;
    margin-top: 50px;
    top: -10px;
  }
}

html,
body {
  height: 100%;
}

body a:hover,
body a:active,
body a:focus {
  outline: 0;
}

#top,
#bottom {
  position: relative;
  z-index: 10;
}

#content {
  color: #535353;
  text-align: left;
  z-index: 5;
  position: relative;
  width: 100%;
  padding: 0;
  margin: -90px auto -60px;
  min-height: 100%;
  padding-bottom: 60px;
  padding-top: 120px;
}

#top {
  min-height: 70px;
  margin-bottom: 20px;
}

#footer {
  min-height: 60px;
}

#status-icons {
  position: fixed;
  bottom: 15px;
  left: 25px;
  z-index: 100;
}

#status-icons > div {
  display: inline-block;
  zoom: 1;
  *display: inline;
}

.logged_out #status-icons {
  display: none;
}

@media only screen and (min-width : 320px) and (max-width : 480px),
(max-width : 568px) {
  #status-icons {
    display: none;
  }
}

body button:active,
body a.button:active,
body button.active,
body a.button.active {
  background-color: #1591b3;
  -ms-box-shadow: inset 0 1px 4px rgba(21, 145, 179, .75);
  -moz-box-shadow: inset 0 1px 4px rgba(21, 145, 179, .75);
  -webkit-box-shadow: inset 0 1px 4px rgba(21, 145, 179, .75);
  box-shadow: inset 0 1px 4px rgba(21, 145, 179, .75);
}

body button:hover,
body a.button:hover,
body button.hover,
body a.button.hover {
  background: #1591b3;
}

body button.disabled,
body a.button.disabled,
body button[disabled],
body a.button[disabled] {
  opacity: 0.5;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
  filter: alpha(opacity=50);
  color: #d7d7d7;
  pointer-events: none;
  cursor: default;
}

body button,
body a.button {
  display: inline-block;
  zoom: 1;
  *display: inline;
  padding: 0 20px;
  height: 36px;
  line-height: 36px;
  font-size: 12px;
  font-weight: bold;
  text-transform: uppercase;
  border: none;
  background-color: #25a1c3;
  text-decoration: none;
  font-family: 'proxima-nova', 'Helvetica Neue', Arial, Helvetica, sans-serif !important;
  letter-spacing: 0.1em;
  -webkit-font-smoothing: antialiased;
  text-shadow: 0 1px 1px rgba(42, 42, 42, .1);
  color: #fff;
  margin: 0;
  -ms-border-radius: 2px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  -ms-box-shadow: inset 0 -1px 0 #1591b3;
  -moz-box-shadow: inset 0 -1px 0 #1591b3;
  -webkit-box-shadow: inset 0 -1px 0 #1591b3;
  box-shadow: inset 0 -1px 0 #1591b3;
}

body button.spin,
body a.button.spin {
  position: relative;
  color: rgba(255, 255, 255, .1);
}

body button.small,
body a.button.small {
  padding: 0 14px;
  height: 29px;
  line-height: 29px;
  font-size: 11px;
  letter-spacing: 0.1em;
}

body button.large i,
body a.button.large i {
  font-size: 16px;
  margin-right: 6px;
}

body button.large,
body a.button.large {
  letter-spacing: 0;
  text-align: center;
  width: 236px;
  padding: 0;
  height: 50px;
  line-height: 50px;
  font-size: 14px !important;
  -ms-border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

body button.green:hover,
body a.button.green:hover {
  background: #57a047;
}

body button.green.disabled,
body a.button.green.disabled {
  opacity: 0.5;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
  filter: alpha(opacity=50);
  pointer-events: none;
  background: #d7d7d7;
  cursor: default;
}

body button.green,
body a.button.green {
  background: #7cbd6a;
  -ms-box-shadow: 0 1px 0 #57a047;
  -moz-box-shadow: 0 1px 0 #57a047;
  -webkit-box-shadow: 0 1px 0 #57a047;
  box-shadow: 0 1px 0 #57a047;
}

body button.red:hover,
body a.button.red:hover {
  background: #b90f15;
}

body button.red.disabled,
body a.button.red.disabled {
  opacity: 0.5;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
  filter: alpha(opacity=50);
  pointer-events: none;
  background: #d7d7d7;
  cursor: default;
}

body button.red,
body a.button.red {
  background: #d8322e;
  -ms-box-shadow: 0 1px 0 #b90f15;
  -moz-box-shadow: 0 1px 0 #b90f15;
  -webkit-box-shadow: 0 1px 0 #b90f15;
  box-shadow: 0 1px 0 #b90f15;
}

body button.gray:active,
body a.button.gray:active {
  -ms-box-shadow: inset 0 1px 4px rgba(228, 228, 228, .75);
  -moz-box-shadow: inset 0 1px 4px rgba(228, 228, 228, .75);
  -webkit-box-shadow: inset 0 1px 4px rgba(228, 228, 228, .75);
  box-shadow: inset 0 1px 4px rgba(228, 228, 228, .75);
}

body button.gray:hover,
body a.button.gray:hover {
  background: #dddddd;
}

body button.gray.disabled,
body a.button.gray.disabled {
  background: #f6f6f6;
  border-bottom-color: #efefef;
  color: #84cfcd;
}

body button.gray,
body a.button.gray {
  color: #25a1c3;
  background-color: #ededed;
  text-shadow: 0 1px 1px rgba(255, 255, 255, .1);
  -ms-box-shadow: inset 0 -1px 0 #dddddd;
  -moz-box-shadow: inset 0 -1px 0 #dddddd;
  -webkit-box-shadow: inset 0 -1px 0 #dddddd;
  box-shadow: inset 0 -1px 0 #dddddd;
}

body button.orange:hover,
body a.button.orange:hover {
  background: #EC9D63;
}

body button.orange.disabled,
body a.button.orange.disabled {
  opacity: 0.5;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
  filter: alpha(opacity=50);
  pointer-events: none;
  background: #d7d7d7;
  cursor: default;
}

body button.orange,
body a.button.orange {
  background: #f2a973;
  -ms-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
  -moz-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
}

.checkmark {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 70px;
  height: 70px;
  margin-left: -35px;
  margin-top: -35px;
  line-height: 75px;
  color: white;
  font-size: 28px;
  background: rgba(255, 255, 255, .8);
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  -ms-transition: -ms-transform 200ms cubic-bezier(0.175, 0.885, 0.320, 1.275), opacity 200ms;
  -moz-transition: -moz-transform 200ms cubic-bezier(0.175, 0.885, 0.320, 1.275), opacity 200ms;
  -webkit-transition: -webkit-transform 200ms cubic-bezier(0.175, 0.885, 0.320, 1.275), opacity 200ms;
  text-indent: 2px;
  text-shadow: 0 0 1px black;
  border: 1px solid rgba(0, 0, 0, .15);
  z-index: 100;
  -ms-border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  -ms-transform: scale(0);
  -moz-transform: scale(0);
  -webkit-transform: scale(0);
  transform: scale(0);
  -ms-transition: transform 200ms cubic-bezier(0.175, 0.885, 0.320, 1.275), opacity 200ms;
  -moz-transition: transform 200ms cubic-bezier(0.175, 0.885, 0.320, 1.275), opacity 200ms;
  -webkit-transition: transform 200ms cubic-bezier(0.175, 0.885, 0.320, 1.275), opacity 200ms;
  transition: transform 200ms cubic-bezier(0.175, 0.885, 0.320, 1.275), opacity 200ms;
}

.checkmark.show {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
  -ms-transform: scale(1);
  -moz-transform: scale(1);
  -webkit-transform: scale(1);
  transform: scale(1);
}

.checkmark:before {
  margin: 0;
}

.collection-carousel {
  overflow: hidden;
  height: 100%;
}

.collection-carousel .panes {
  overflow: hidden;
  height: 100%;
}

.collection-carousel .panes-inner {
  height: 100%;
}

.collection-carousel .pane {
  float: left;
  height: 100%;
  -webkit-backface-visibility: hidden;
  -ms-transition: opacity 100ms ease-out;
  -moz-transition: opacity 100ms ease-out;
  -webkit-transition: opacity 100ms ease-out;
  transition: opacity 100ms ease-out;
}

.collection-carousel[count='2'] #grid {
  display: none;
}

.collection.editing .collection-carousel[count='2'] #grid {
  display: block;
}

.collection-carousel .navigator > div {
  width: 40px;
  height: 60px;
  line-height: 62px;
  position: absolute;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  top: 50%;
  margin-top: -30px;
  text-align: center;
  font-size: 30px;
  font-weight: normal;
  cursor: pointer;
  color: #666;
  background: rgba(18, 18, 18, .9);
  -ms-transition: opacity 100ms ease-in;
  -moz-transition: opacity 100ms ease-in;
  -webkit-transition: opacity 100ms ease-in;
  transition: opacity 100ms ease-in;
}

.collection-carousel .navigator > div:hover {
  color: white;
}

.collection-carousel .navigator > div.left-arrow {
  left: 0px;
  -ms-border-radius: right 4px;
  -moz-border-radius: right 4px;
  -webkit-border-radius: right 4px;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.collection-carousel .navigator > div.right-arrow {
  right: 0px;
  padding-left: 5px;
  -ms-border-radius: left 4px;
  -moz-border-radius: left 4px;
  -webkit-border-radius: left 4px;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

.collection-carousel .bottom {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  pointer-events: none;
}

.collection.loaded .navigator > div {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

body.mobile .collection-carousel .navigator > div,
.collection.empty .collection-carousel .navigator > div,
.collection.editing .collection-carousel .navigator > div,
.collection .collection-carousel .navigator.hide > div,
.collection .collection-carousel .navigator.hide-left .left-arrow,
.collection .collection-carousel .navigator.hide-right .right-arrow {
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  pointer-events: none;
}

body.inactive-cursor .left-arrow,
body.inactive-cursor .right-arrow {
  opacity: 0 !important;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0) !important;
  filter: alpha(opacity=0) !important;
}

.collection.chromeless .collection-carousel .bottom {
  border-top: solid 1px rgba(255, 255, 255, .15);
  height: 40px;
}

.collection-carousel .bottom > a {
  display: none;
}

.collection.chromeless .collection-carousel .bottom > a {
  display: block;
  color: #fff;
  opacity: 0.6;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=60);
  filter: alpha(opacity=60);
  line-height: 0;
  pointer-events: auto;
  text-decoration: none;
  -ms-transition: opacity 100ms ease-out;
  -moz-transition: opacity 100ms ease-out;
  -webkit-transition: opacity 100ms ease-out;
  transition: opacity 100ms ease-out;
}

.collection.chromeless .collection-carousel .bottom > a:hover {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

.collection.chromeless .collection-carousel .bottom > a.logo {
  position: absolute;
  bottom: 0px;
  left: 0px;
  margin-left: 20px;
  margin-bottom: 7px;
}

.collection.chromeless .collection-carousel .bottom > a.logo span.img {
  overflow-x: hidden;
  background: url("https://s1.cldup.com/bar/images/logo-login.png");
  text-indent: -9999px;
  display: inline-block;
  zoom: 1;
  *display: inline;
  background-repeat: no-repeat;
  width: 67px;
  height: 22px;
  -ms-background-size: cover;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
}

.collection.chromeless .collection-carousel .bottom > a.popout {
  position: absolute;
  bottom: 0px;
  right: 0px;
  margin-right: 20px;
  margin-bottom: 10px;
  font-size: 20px;
  color: #BEBEB8;
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  .collection.chromeless .collection-carousel .bottom > a.logo span.img {
    background-image: url("https://s1.cldup.com/bar/images/logo-login@2x.png");
    background-size: cover;
  }
}

.collection {
  z-index: 200;
  width: 100%;
  height: 100%;
  background: #000;
  position: fixed;
  top: 0;
  left: 0;
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
  -ms-transition: 300ms opacity ease-out;
  -moz-transition: 300ms opacity ease-out;
  -webkit-transition: 300ms opacity ease-out;
  transition: 300ms opacity ease-out;
}

.collection-view {
  color: white;
  width: 100%;
  height: 100%;
  background: #121212;
  padding-top: 40px;
  position: relative;
  z-index: 1000;
  min-width: 320px;
  -webkit-transition-property: -webkit-transform;
  -webkit-transform: translate3d(0, 0, 0);
}

.collection-view [contenteditable] {
  outline: none;
  cursor: text;
}

.collection-view [contenteditable]:hover {
  outline: 1px dashed #575757;
}

.collection-view [contenteditable]:focus {
  outline: none;
}

.collection.locked .collection-view {
  background: #fafafa;
}

.collection-view .top {
  z-index: 40;
  background: -ms-linear-gradient(-180deg, #1E1E1E 0%, #121212 100%);
  background: -moz-linear-gradient(-180deg, #1E1E1E 0%, #121212 100%);
  background: -webkit-linear-gradient(-180deg, #1E1E1E 0%, #121212 100%);
  background: linear-gradient(-180deg, #1E1E1E 0%, #121212 100%);
  height: 40px;
  line-height: 42px;
  position: fixed;
  top: 0;
  width: 100%;
  opacity: 0.8;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  filter: alpha(opacity=80);
  -ms-transition: opacity 100ms ease-in;
  -moz-transition: opacity 100ms ease-in;
  -webkit-transition: opacity 100ms ease-in;
  transition: opacity 100ms ease-in;
}

.collection.full .collection-view {
  padding-top: 0;
}

.collection.full .collection-view .top {
  display: none;
}

.collection.full .collection-item .img-outer .img-inner {
  vertical-align: top;
  text-align: center;
}

.collection .collection-item.has_zoom .img-inner a {
  cursor: default;
}

.collection .collection-item.has_zoom .img-inner a img {
  cursor: pointer;
  cursor: -webkit-zoom-in;
  cursor: -moz-zoom-in;
  cursor: zoom-in;
}

.collection.full .collection-item .img-inner a {
  cursor: default;
}

.collection.full .collection-item .img-inner a img {
  cursor: pointer;
  cursor: -webkit-zoom-out;
  cursor: -moz-zoom-out;
  cursor: zoom-out;
}

.collection.full .collection-view .img-outer {
  display: block;
}

.collection.full .collection-view .img-inner {
  display: block;
  height: 100%;
}

.collection.full .collection-view .img-wrapper {
  width: 100%;
  height: 100%;
  overflow: scroll;
}

.collection.full .exif {
  display: none;
}

.collection.full .collection-carousel .panes-inner {
  -ms-transition: none !important;
  -moz-transition: none !important;
  -webkit-transition: none !important;
  transition: none !important;
}

.collection.full .navigator,
.collection.full .pagination {
  display: none;
}

body.handheld .collection .collection-view {
  padding-top: 0;
}

body.handheld .collection .collection-view .top.hide {
  top: -41px;
}

body.handheld .collection .collection-view .top {
  opacity: 0.8;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  filter: alpha(opacity=80);
  position: absolute;
  top: 0;
  left: 0;
  -ms-transition: top .2s ease-in;
  -moz-transition: top .2s ease-in;
  -webkit-transition: top .2s ease-in;
  transition: top .2s ease-in;
}

.collection-view .top .left {
  float: left;
  height: 40px;
  margin-right: 15px;
}

.collection-view .top .left .inner {
  display: inline-block;
  zoom: 1;
  *display: inline;
  height: 40px;
  line-height: 40px;
  vertical-align: top;
  width: 53px;
}

.collection-view .top .left a {
  color: #ccc;
  text-transform: uppercase;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1px;
  height: 40px;
  line-height: 40px;
  vertical-align: middle;
  display: block;
  padding: 1px 12px;
}

.collection-view .top .left a:hover {
  color: #eee;
}

.collection-view .top .left a,
.collection-view .top .left span {
  pointer-events: none;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  -ms-transition: opacity 200ms ease-in;
  -moz-transition: opacity 200ms ease-in;
  -webkit-transition: opacity 200ms ease-in;
  transition: opacity 200ms ease-in;
}

.collection-view .top .left .avatar {
  display: none;
  width: 26px;
  height: 26px;
  margin: 6px 10px 9px;
}

.collection.not_mine .collection-view .top .edit {
  display: none;
}

.collection.not_mine .collection-view .top .avatar {
  opacity: 0.3;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=30);
  filter: alpha(opacity=30);
  display: inline-block;
  zoom: 1;
  *display: inline;
}

.collection-view .top .edit:before {
  content: "Edit";
}

.collection-view .top .collection-title,
.collection-view .top .item-title {
  white-space: nowrap;
  line-height: 1;
  padding: 5px;
  margin: 8px 0;
  overflow: hidden;
  float: left;
  max-width: 40%;
  -ms-user-select: text;
  -moz-user-select: text;
  -webkit-user-select: text;
  user-select: text;
}

.collection-view .top .collection-title:not(.editing),
.collection-view .top .item-title:not(.editing) {
  text-overflow: ellipsis;
}

.collection-view .top .item-title {
  min-width: 35px;
  color: #9a9a9a;
  font-weight: normal;
}

.collection-view .top .item-title.hide {
  display: none;
}

.collection-view .top .title {
  float: left;
  width: 70%;
  text-align: left;
  font-weight: bold;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  -ms-transition: opacity 200ms ease-in;
  -moz-transition: opacity 200ms ease-in;
  -webkit-transition: opacity 200ms ease-in;
  transition: opacity 200ms ease-in;
}

.collection.showing-grid .item-title,
.collection[items="1"] .item-title {
  display: none;
}

.collection[items="1"] .collection-title {
  max-width: 80%;
}

.collection-view .top .collection-lock:before {
  display: block;
  float: left;
  color: #8bb66b;
  content: '\e802';
  position: relative;
  top: 12px;
  width: 17px;
  height: 17px;
  font-size: 17px;
  line-height: 17px;
  font-family: 'icons';
  margin-right: 5px;
  -ms-transition: color 200ms ease-in;
  -moz-transition: color 200ms ease-in;
  -webkit-transition: color 200ms ease-in;
  transition: color 200ms ease-in;
}

.collection.has_password .top .collection-lock:before {
  color: #cf4850;
}

.collection.not_mine .top .collection-lock:before,
.collection.not_mine.has_password .top .collection-lock:before {
  color: #999;
}

.collection-view .top .right {
  position: absolute;
  top: 0;
  right: 0;
}

.collection.not_mine .collection-view .top .share {
  display: none;
}

.collection-view .top .join {
  display: none;
  padding-right: 15px;
  margin-left: 10px;
}

.collection-view .top .join a {
  height: 26px;
  line-height: 26px;
  padding: 0 8px;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  -ms-transition: opacity 200ms ease-in;
  -moz-transition: opacity 200ms ease-in;
  -webkit-transition: opacity 200ms ease-in;
  transition: opacity 200ms ease-in;
}

.collection-view .top .join:before {
  content: 'w';
  display: block;
  overflow: hidden;
  text-indent: -500px;
  float: left;
  background: red;
  margin-right: 15px;
}

.collection-view .top .options {
  display: inline-block;
  zoom: 1;
  *display: inline;
  vertical-align: top;
}

.collection-view .top .options a span {
  float: right;
}

.collection-view .top .options a.disabled:hover {
  color: #7d7d7d;
}

.collection-view .top .options a.disabled {
  color: #7d7d7d;
}

.collection-view .top .options a:hover {
  color: #eee;
}

.collection-view .top .options a {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin: 0 10px;
  color: #c1c1c1;
  text-decoration: none;
  display: inline-block;
  zoom: 1;
  *display: inline;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  pointer-events: none;
  -ms-transition: opacity 200ms ease-in;
  -moz-transition: opacity 200ms ease-in;
  -webkit-transition: opacity 200ms ease-in;
  transition: opacity 200ms ease-in;
}

.collection.locked .collection-view .top .options > a:not(.close) {
  display: none;
}

.collection.locked .collection-view .top .join:before {
  border-left-width: 0;
}

.collection.locked .collection-view .top .join {
  border-left-width: 0;
}

.collection-view .top .options a:last-child {
  margin-left: 10px;
}

.collection-view .top .options .close {
  color: #cccbd0;
  margin: 0;
  padding-left: 4px;
  display: none;
  height: 40px;
  line-height: 42px;
  width: 40px;
  font-size: 20px;
  float: right;
}

.collection-view .top .options .close:hover {
  color: #eee;
}

.collection-view .top .options .close:active {
  background: rgba(0, 0, 0, .2);
}

.collection-view .top .options .close:before {
  font-family: helvetica;
}

.collection.loaded .collection-view .top {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
  pointer-events: all;
}

.collection.loaded .collection-view .top .title,
.collection.loaded .collection-view .top .left a,
.collection.loaded .collection-view .top .left span,
.collection.loaded .collection-view .top .options a,
.collection.loaded .collection-view .top .join a {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
  pointer-events: all;
}

.collection.loaded .collection-view .top .options a.disabled {
  pointer-events: none;
}

.collection.loaded .collection-view .top .left span.avatar:hover {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
  -webkit-filter: saturate(100%);
}

.collection.loaded .collection-view .top .left span.avatar {
  opacity: 0.7;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
  filter: alpha(opacity=70);
  -webkit-filter: saturate(0%);
  -ms-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -ms-transition: -webkit-filter 50ms ease-in;
  -moz-transition: -webkit-filter 50ms ease-in;
  -webkit-transition: -webkit-filter 50ms ease-in;
  transition: -webkit-filter 50ms ease-in;
}

.collection.chromeless .collection-view {
  padding-top: 0;
}

.collection.chromeless .collection-view .top {
  display: none;
}

.collection.chromeless .collection-view .main {
  padding-bottom: 40px;
}

.collection.editing .collection-view .top .options a {
  display: none;
}

body.logged_in .collection-view .top .options a.close,
.collection.close-collection-mode .collection-view .top .options a.close {
  display: inline-block;
  zoom: 1;
  *display: inline;
}

body.logged_out .collection-view .top .join {
  display: inline-block;
  zoom: 1;
  *display: inline;
}

.collection.close-collection-mode .collection-view .top .join {
  display: none;
}

.collection-view .main {
  height: 100%;
}

.collection.locked .collection-view .main {
  color: #0f0f0f;
}

.collection-view .main.loading {
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  -ms-transition: 100ms opacity ease-out;
  -moz-transition: 100ms opacity ease-out;
  -webkit-transition: 100ms opacity ease-out;
  transition: 100ms opacity ease-out;
}

.collection-view .main.loaded,
.collection.locked .collection-view .main.loading {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

.collection.hide {
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  pointer-events: none;
}

.collection-view > a.logo {
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  pointer-events: none;
  position: fixed;
  bottom: 17px;
  right: 15px;
  text-decoration: none;
  color: #fff;
  -ms-transition: opacity 100ms ease-out;
  -moz-transition: opacity 100ms ease-out;
  -webkit-transition: opacity 100ms ease-out;
  transition: opacity 100ms ease-out;
}

.collection-view > a.logo span.text {
  font-size: 12px;
}

.collection-view > a.logo span.img {
  overflow-x: hidden;
  background: url("https://s1.cldup.com/bar/images/logo-login.png");
  margin-left: 10px;
  text-indent: -500px;
  display: inline-block;
  zoom: 1;
  *display: inline;
  background-repeat: no-repeat;
  width: 72px;
  height: 24px;
  -ms-background-size: cover;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
}

.logged_out .collection.loaded .collection-view > a.logo {
  opacity: 0.6;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=60);
  filter: alpha(opacity=60);
  pointer-events: all;
}

.logged_out .collection.loaded .collection-view > a.logo span {
  display: inline-block;
  zoom: 1;
  *display: inline;
  vertical-align: top;
  height: 24px;
  line-height: 24px;
}

.logged_out .collection.loaded .collection-view > a.logo:hover {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

.collection.chromeless .collection-view > a.logo {
  display: none;
}

.collection-shim {
  position: fixed;
  z-index: 90000;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -ms-user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  user-select: none;
}

html:fullscreen {
  overflow-y: hidden;
}

html:fullscreen .collection .top,
html:fullscreen .collection .logo {
  display: none !important;
}

html:-moz-full-screen {
  overflow-y: hidden;
}

html:-moz-full-screen .collection .top,
html:-moz-full-screen .collection .logo {
  display: none !important;
}

html:-webkit-full-screen {
  overflow-y: hidden;
}

html:-webkit-full-screen .collection .top,
html:-webkit-full-screen .collection .logo {
  display: none !important;
}

body.mobile .collection.locked .collection-view .top .close {
  display: inline-block;
  zoom: 1;
  *display: inline;
}

body.mobile .collection.locked .collection-view .top .join {
  display: none;
}

body.mobile .collection-view .top .title:before,
body.mobile .collection-view .top .options .download,
body.mobile .collection-view .top .options .fullscreen,
body.mobile .collection-view .top .options .more {
  display: none;
}

body.mobile .collection-view .top .options .share:before {
  top: -2px;
  margin-right: 8px;
  position: relative;
}

body.mobile .collection-view .top .options .close:before {
  position: relative;
  top: -1px;
}

body.mobile .collection-view > a.logo .text {
  margin-top: -2px;
  font-size: 11px;
}

body.mobile .collection-view > a.logo .img {
  margin-left: 3px;
  height: 18px;
  width: 54px;
}

body.mobile .collection-view > a.logo {
  bottom: 0px;
  right: 5px;
}

@media screen and (max-width: 700px) {
  .collection.showing-grid .collection-title {
    max-width: 50%;
  }

  .collection.showing-grid .item-title {
    display: none;
  }

  .collection:not(.showing-grid) .collection-title {
    display: none;
  }

  .collection:not(.showing-grid) .item-title:before {
    content: '';
  }

  .collection:not(.showing-grid) .item-title {
    padding-left: 0;
    max-width: 50%;
  }

  .collection[items="1"] .collection-title {
    display: block;
    max-width: 50%;
  }

  .collection-sidebar .hide {
    display: none;
  }

  .collection-sidebar .main {
    padding-right: 15px;
  }

  .collection-view .top .options a span {
    display: none;
  }

  .collection-view .top .options a.close {
    padding-left: 10px;
    margin: 0;
  }

  .collection-view .top .options a {
    display: inline-block;
    zoom: 1;
    *display: inline;
    font-size: 20px;
    margin: 0;
    padding: 0 10px;
    vertical-align: middle;
    font-family: 'icons';
    -webkit-font-smoothing: antialiased;
  }

  .collection-view .top .join {
    margin-left: 7px;
  }

  .collection-view .top .options .fullscreen,
  .collection-view .top .options .download.many {
    display: none;
  }

  .collection-view .top .options .download:before {
    content: '\f4e5';
    font-weight: normal;
    position: relative;
    top: -1px;
  }

  .collection-view .top .options .share:before {
    content: '\e715';
    font-weight: normal;
    position: relative;
    top: -2px;
  }

  .collection-view .top .options .more:before {
    font-size: 18px;
    content: '\f0c9';
    font-weight: normal;
    position: relative;
    top: -1px;
  }

  .logged_out .collection.loaded .collection-view > a.logo span.img,
  .logged_out .collection.loaded .collection-view > a.logo span.text {
    margin: 0;
  }

  .logged_out .collection.loaded .collection-view > a.logo span.text {
    font-size: 11px;
    line-height: 18px;
  }

  .logged_out .collection.loaded .collection-view > a.logo span.img {
    margin-left: 6px;
    height: 18px;
    width: 54px;
  }

  .logged_out .collection.loaded .collection-view > a.logo {
    text-align: left;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  .collection-view > a.logo span.img {
    background-image: url("https://s1.cldup.com/bar/images/logo-login@2x.png");
    background-size: cover;
  }
}

.dialog.delete-dialog {
  min-width: 340px;
}

.dialog.delete-dialog .body button,
.dialog.delete-dialog .body a.button {
  margin: 0 5px;
  min-width: 70px;
}

.dialog.delete-dialog .body {
  text-align: center;
}

.grid-item:not(.complete) .img.onload {
  opacity: 0.5 !important;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50) !important;
  filter: alpha(opacity=50) !important;
}

.grid-item.complete .img {
  opacity: 1 !important;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100) !important;
  filter: alpha(opacity=100) !important;
}

.grid-item .spinner {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -10px;
  margin-left: -10px;
}

.grid-item .message {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
}

.grid-item .retry-message,
.grid-item .failed-message {
  width: 100%;
  background: rgba(34, 34, 34, .7);
  padding: 8px 20px;
  margin: 0 auto;
  color: white;
  font-size: 12px;
  margin-top: 40%;
}

.grid-item .retry-message em,
.grid-item .failed-message em {
  font-weight: bold;
  font-style: normal;
}

.grid-item:after {
  position: absolute;
  bottom: 10px;
  left: 50%;
  margin-left: -35px;
  display: block;
  color: white;
}

.grid-item.state-progressing:after {
  content: 'processing';
}

.grid-item.state-submitted:after {
  content: 'pending conversion';
  margin-left: -65px;
}

.grid-item .markdown {
  background: white;
  color: #454545;
  font-size: .7em;
  text-align: left;
  padding: 20px;
}

.grid-item .markdown h1 {
  display: none;
}

.grid-item .markdown img {
  max-width: 100%;
}

.grid-item.code .gist {
  overflow: hidden;
}

.collection-grid {
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  height: 100%;
  vertical-align: middle;
  padding: 10px;
  -ms-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

body.mobile .collection-grid {
  padding: 40px 4px 4px 4px;
}

body.mobile .collection-grid.editing {
  padding-top: 45px;
}

.collection-grid.hidden {
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
}

.collection-grid.shown {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
  -ms-transition: opacity 600ms ease-out;
  -moz-transition: opacity 600ms ease-out;
  -webkit-transition: opacity 600ms ease-out;
  transition: opacity 600ms ease-out;
}

.collection-grid .progress {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -40px;
  margin-top: -40px;
}

.collection-grid .grid-item[progress="0"] .progress {
  display: none;
}

.collection-grid .grid-items {
  height: 100%;
  position: relative;
}

.collection-grid.with-transitions .grid-item {
  -ms-transition: all 200ms ease-out;
  -moz-transition: all 200ms ease-out;
  -webkit-transition: all 200ms ease-out;
  transition: all 200ms ease-out;
}

.collection-grid .grid-item {
  display: none;
  width: 240px;
  height: 205px;
  background-color: #222;
  position: absolute;
}

.collection-grid .grid-item .inner {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.collection-grid .grid-item .delete:active:before {
  color: #ccc;
}

.collection-grid .grid-item .delete:active {
  border-color: #ccc;
}

.collection-grid .grid-item .delete:before {
  font-family: 'icons';
  content: '\2715';
  color: #fff;
  font-size: 14px;
  font-weight: 400;
  width: 20px;
  height: 20px;
  line-height: 20px;
  display: block;
  margin-left: -2px;
  margin-top: -2px;
}

.collection-grid .grid-item .delete {
  display: none;
  position: absolute;
  position: absolute;
  top: -10px;
  left: -10px;
  width: 20px;
  height: 20px;
  background: #555;
  border: 2px solid #555;
  padding: 0;
  margin: 0;
  -ms-border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  -ms-box-shadow: 0 1px 2px rgba(0, 0, 0, .3);
  -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .3);
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .3);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .3);
  -ms-user-drag: none;
  -moz-user-drag: none;
  -webkit-user-drag: none;
  user-drag: none;
}

.collection-grid .grid-item .title.shown {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

.collection-grid .grid-item .title .main-title {
  max-width: 60%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  zoom: 1;
  *display: inline;
}

.collection-grid .grid-item .title .sub {
  color: #ccc;
  display: inline-block;
  zoom: 1;
  *display: inline;
  padding-left: 5px;
  font-size: 12px;
}

.collection-grid .grid-item .title {
  background: -ms-linear-gradient(bottom, rgba(0, 0, 0, 0.8) 0, rgba(0, 0, 0, 0.3) 70%, rgba(0, 0, 0, 0) 100%);
  background: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0.8) 0, rgba(0, 0, 0, 0.3) 70%, rgba(0, 0, 0, 0) 100%);
  background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.8) 0, rgba(0, 0, 0, 0.3) 70%, rgba(0, 0, 0, 0) 100%);
  background: linear-gradient(bottom, rgba(0, 0, 0, 0.8) 0, rgba(0, 0, 0, 0.3) 70%, rgba(0, 0, 0, 0) 100%);
  position: absolute;
  bottom: 0;
  left: 0;
  max-height: 51px;
  padding: 10px;
  -webkit-text-stroke: 0.35px;
  text-shadow: 0 1px 0 #000;
  width: 100%;
  text-align: left;
  font-size: 13px;
  color: #eee;
  overflow: hidden;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  -ms-transition: opacity 200ms ease-out;
  -moz-transition: opacity 200ms ease-out;
  -webkit-transition: opacity 200ms ease-out;
  transition: opacity 200ms ease-out;
}

.collection-grid .grid-item .img.small {
  -ms-background-size: inherit;
  -moz-background-size: inherit;
  -webkit-background-size: inherit;
  background-size: inherit;
}

.collection-grid .grid-item .img.onload {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

.collection-grid .grid-item .img {
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  text-align: center;
  -ms-background-size: cover;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  -ms-transition: opacity 500ms ease-out;
  -moz-transition: opacity 500ms ease-out;
  -webkit-transition: opacity 500ms ease-out;
  transition: opacity 500ms ease-out;
  -ms-user-drag: none;
  -moz-user-drag: none;
  -webkit-user-drag: none;
  user-drag: none;
}

.collection-grid .grid-item.oembed_youtube .img {
  -ms-background-size: 180%;
  -moz-background-size: 180%;
  -webkit-background-size: 180%;
  background-size: 180%;
}

body.mobile .collection-grid .grid-item .title .sub {
  display: none;
}

body.mobile .collection-grid .grid-item .title {
  background: rgba(0, 0, 0, .7);
  padding: 2px 5px;
  border: 1px solid rgba(0, 0, 0, .9);
  font-size: 11px;
  max-height: 35px;
}

.collection-grid .grid-item:before {
  font-family: 'icons';
  color: #141414;
  font-size: 500%;
  height: 80px;
  width: 80px;
  line-height: 80px;
  vertical-align: middle;
  text-align: center;
  position: absolute;
  top: 50%;
  margin-top: -40px;
  left: 50%;
  margin-left: -40px;
  display: block;
}

.collection-grid .grid-item.url:before,
.collection-grid .grid-item.doc:before,
.collection-grid .grid-item.unknown:before,
.collection-grid .grid-item.audio:before {
  content: '\f30e';
}

.collection-grid .grid-item.audio:before {
  content: '\e807';
}

.collection-grid .grid-item.video.complete:before,
.collection-grid .grid-item.oembed_video:before {
  content: '\25b6';
  color: rgba(255, 255, 255, .9);
  text-shadow: 0 0 1px #000;
  z-index: 10;
}

.collection-grid .grid-item.flash:before {
  content: '';
  background: url("https://i.cloudup.com/kxkM3Vw1Fd.png") no-repeat top center;
  -ms-background-size: 70%;
  -moz-background-size: 70%;
  -webkit-background-size: 70%;
  background-size: 70%;
}

body.mobile .grid-item.video.complete:before,
body.mobile .grid-item.oembed_video:before {
  font-size: 50px;
}

.collection-grid .grid-item.unknown:before,
.collection-grid .grid-item.doc:before {
  content: '\e0c1';
}

.collection-grid .grid-item.unknown .title,
.collection-grid .grid-item.flash .title,
.collection-grid .grid-item.audio .title {
  background: transparent;
  text-align: center;
  color: #888;
  text-shadow: none;
}

.collection-grid.editing .grid-item.unknown .title {
  color: #b3b3b3;
}

.collection-grid .grid-item a.link {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 50;
  display: block;
}

.collection-grid .grid-item a.link:hover {
  background: rgba(0, 0, 0, .1);
}

.collection-grid.editing {
  overflow-y: auto;
}

.collection-grid.editing .delete {
  display: block;
}

.collection-grid.editing .grid-items {
  margin-right: 250px;
  padding: 5px;
}

.collection-grid.editing .grid-item {
  -ms-user-drag: element;
  -moz-user-drag: element;
  -webkit-user-drag: element;
  user-drag: element;
}

.collection-grid.editing .grid-item .inner,
.collection-grid.editing .sortable-placeholder .inner {
  border: 1px dashed #c1c1c1;
  padding: 2px;
}

.collection-grid.editing .grid-item a.link,
.collection-grid.editing .sortable-placeholder a.link {
  display: none;
}

.collection-grid.editing .grid-item,
.collection-grid.editing .sortable-placeholder {
  float: left;
  position: relative;
  margin: 4px;
  background: #fff;
  -ms-transform: none !important;
  -moz-transform: none !important;
  -webkit-transform: none !important;
  transform: none !important;
}

.collection-grid.editing .sortable-placeholder {
  border: 2px dashed #333;
  background: transparent;
}

body.mobile .collection-grid.editing .grid-items {
  margin-right: 235px;
}

.collection-grid .placeholder-wrap {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  pointer-events: none;
  -ms-transition: 200ms opacity ease-out;
  -moz-transition: 200ms opacity ease-out;
  -webkit-transition: 200ms opacity ease-out;
  transition: 200ms opacity ease-out;
}

.collection-grid .placeholder-wrap.hide {
  display: none;
}

.collection-grid .placeholder-wrap {
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
}

.collection.empty .collection-grid .placeholder-wrap {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
  pointer-events: auto;
}

.collection.empty.adding .collection-grid .placeholder-wrap {
  display: none;
}

.collection.empty .collection-grid .grid-items {
  display: none;
}

.collection-grid .placeholder {
  max-width: 460px;
  margin: auto;
  margin-top: 15%;
  position: relative;
}

.collection.empty.editing .placeholder {
  left: -100px;
}

body.mobile .collection.mine .collection-grid .placeholder {
  margin-top: 40%;
}

body.mobile .collection.mine .collection-grid .placeholder .title {
  font-size: 20px;
  line-height: 22px;
}

body.mobile .collection.mine .collection-grid .placeholder p.url {
  display: none;
}

body.mobile .collection.mine .collection-grid .placeholder .title-owner:before {
  content: "Tap here to add items from your phone";
}

body.mobile .collection.mine .collection-grid .placeholder .title-owner {
  width: 80%;
}

.collection-grid .placeholder .title {
  color: white;
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 50px;
  line-height: 26px;
  display: none;
}

.collection.mine .collection-grid .placeholder-clickable {
  cursor: pointer;
}

.collection.mine .collection-grid .placeholder-clickable:hover p.title {
  color: #aeaeae;
}

.collection.mine .collection-grid .placeholder .title-owner {
  display: block;
  width: 280px;
  margin: 0 auto;
}

.collection.mine .collection-grid .placeholder .title-owner:before {
  content: "Upload or drag files & urls to this window";
}

.collection.not_mine .collection-grid .placeholder .title-visitor {
  display: block;
}

body.has_global_paste .collection.mine .collection-grid .placeholder .title-owner:before {
  content: "Upload, paste or drag files & urls to this window";
}

.collection-grid .placeholder .icons {
  font-size: 30px;
  line-height: 34px;
  height: 30px;
  margin-bottom: 120px;
  vertical-align: top;
}

.collection-grid .placeholder .icons i {
  color: #aeaeae;
  vertical-align: top;
  display: inline-block;
  zoom: 1;
  *display: inline;
  height: 30px;
  padding: 0 8px;
}

.collection-grid .placeholder .icons i.icon-note-beamed {
  font-size: 24px;
  top: 1px;
  position: relative;
}

.collection-grid .placeholder .icons i.icon-doc-alt {
  font-size: 27px;
}

.collection-grid .placeholder .icons i.icon-easel {
  font-size: 28px;
  position: relative;
  top: 2px;
}

.collection-grid .placeholder .icons i.icon-chart-bar {
  font-size: 28px;
}

.collection-grid .placeholder .icons i.icon-video {
  font-size: 24px;
}

.collection-grid .placeholder .icons i.icon-picture {
  font-size: 26px;
}

.collection-grid .placeholder p:last-child {
  color: #25a1c3;
  font-size: 18px;
  font-weight: 600;
  line-height: 20px;
}

.collection-grid .placeholder p:last-child span {
  cursor: text;
  -ms-user-select: auto;
  -moz-user-select: auto;
  -webkit-user-select: auto;
  user-select: auto;
}

.collection-grid .placeholder p:last-child ::selection {
  background: #ffffff;
  color: #1a1a1a;
}

.collection-grid .placeholder p:last-child ::-moz-selection {
  background: #ffffff;
  color: #1a1a1a;
}

body.tablet .collection.mine .collection-grid .placeholder .title-owner:before {
  content: "Tap here to add items from your tablet";
}

/**/

body.handheld .collection:not(.editing)[items="2"] .collection-grid,
body.handheld .collection:not(.editing)[items="3"] .collection-grid,
body.handheld .collection:not(.editing)[items="4"] .collection-grid,
body.handheld .collection:not(.editing)[items="5"] .collection-grid,
body.handheld .collection:not(.editing)[items="6"] .collection-grid {
  padding: 40px 0 0 0;
}

body.handheld .collection:not(.editing)[items="2"] .grid-item .inner,
body.handheld .collection:not(.editing)[items="3"] .grid-item .inner,
body.handheld .collection:not(.editing)[items="4"] .grid-item .inner,
body.handheld .collection:not(.editing)[items="5"] .grid-item .inner,
body.handheld .collection:not(.editing)[items="6"] .grid-item .inner {
  padding: 5px;
}

body.handheld .collection:not(.editing)[items="2"] .grid-item,
body.handheld .collection:not(.editing)[items="3"] .grid-item,
body.handheld .collection:not(.editing)[items="4"] .grid-item,
body.handheld .collection:not(.editing)[items="5"] .grid-item,
body.handheld .collection:not(.editing)[items="6"] .grid-item {
  background: inherit;
  position: absolute;
  display: block;
  top: 0;
  left: 0;
}

body.handheld .collection:not(.editing)[items="4"] .grid-item:nth-child(1) .inner,
body.handheld .collection:not(.editing)[items="4"] .grid-item:nth-child(2) .inner {
  padding-bottom: 5px;
}

body.handheld .collection:not(.editing)[items="4"] .grid-item:nth-child(3) .inner,
body.handheld .collection:not(.editing)[items="4"] .grid-item:nth-child(4) .inner {
  padding-top: 0px;
}

body.handheld .collection:not(.editing)[items="4"] .grid-item:nth-child(3),
body.handheld .collection:not(.editing)[items="4"] .grid-item:nth-child(4) {
  top: 50%;
}

body.handheld .collection:not(.editing)[items="4"] .grid-item:nth-child(odd) .inner {
  padding-right: 5px;
}

body.handheld .collection:not(.editing)[items="4"] .grid-item:nth-child(even) .inner {
  padding-left: 0px;
}

body.handheld .collection:not(.editing)[items="4"] .grid-item:nth-child(even) {
  left: 50%;
}

body.handheld .collection:not(.editing)[items="4"] .grid-item {
  width: 50%;
  height: 50%;
}

@media screen and (orientation:portrait) {
  body.handheld .collection:not(.editing)[items="2"] .grid-item .inner {
    padding-bottom: 0;
  }

  body.handheld .collection:not(.editing)[items="2"] .grid-item:nth-child(2) .inner {
    padding-bottom: 5px;
  }

  body.handheld .collection:not(.editing)[items="2"] .grid-item:nth-child(2) {
    top: 50%;
  }

  body.handheld .collection:not(.editing)[items="2"] .grid-item {
    width: 100%;
    height: 50%;
  }

  body.handheld .collection:not(.editing)[items="3"] .grid-item .inner {
    padding-bottom: 0px;
  }

  body.handheld .collection:not(.editing)[items="3"] .grid-item:last-child .inner {
    padding-bottom: 5px;
  }

  body.handheld .collection:not(.editing)[items="3"] .grid-item:nth-child(2) {
    top: 33.33%;
  }

  body.handheld .collection:not(.editing)[items="3"] .grid-item:nth-child(3) {
    top: 66.66%;
  }

  body.handheld .collection:not(.editing)[items="3"] .grid-item {
    width: 100%;
    height: 33.33%;
  }

  body.handheld .collection:not(.editing)[items="5"] .grid-item .inner,
  body.handheld .collection:not(.editing)[items="6"] .grid-item .inner {
    padding-right: 0;
    padding-bottom: 0;
  }

  body.handheld .collection:not(.editing)[items="5"] .grid-item:nth-child(3),
  body.handheld .collection:not(.editing)[items="6"] .grid-item:nth-child(3),
  body.handheld .collection:not(.editing)[items="5"] .grid-item:nth-child(4),
  body.handheld .collection:not(.editing)[items="6"] .grid-item:nth-child(4) {
    top: 33.33%;
  }

  body.handheld .collection:not(.editing)[items="5"] .grid-item:nth-child(5) .inner,
  body.handheld .collection:not(.editing)[items="6"] .grid-item:nth-child(5) .inner,
  body.handheld .collection:not(.editing)[items="5"] .grid-item:nth-child(6) .inner,
  body.handheld .collection:not(.editing)[items="6"] .grid-item:nth-child(6) .inner {
    padding-bottom: 5px;
  }

  body.handheld .collection:not(.editing)[items="5"] .grid-item:nth-child(5),
  body.handheld .collection:not(.editing)[items="6"] .grid-item:nth-child(5),
  body.handheld .collection:not(.editing)[items="5"] .grid-item:nth-child(6),
  body.handheld .collection:not(.editing)[items="6"] .grid-item:nth-child(6) {
    top: 66.66%;
  }

  body.handheld .collection:not(.editing)[items="5"] .grid-item:nth-child(even) .inner,
  body.handheld .collection:not(.editing)[items="6"] .grid-item:nth-child(even) .inner {
    padding-right: 5px;
  }

  body.handheld .collection:not(.editing)[items="5"] .grid-item:nth-child(even),
  body.handheld .collection:not(.editing)[items="6"] .grid-item:nth-child(even) {
    left: 50%;
  }

  body.handheld .collection:not(.editing)[items="5"] .grid-item,
  body.handheld .collection:not(.editing)[items="6"] .grid-item {
    width: 50%;
    height: 33.33%;
  }
}

@media screen and (orientation:landscape) {
  body.handheld .collection:not(.editing)[items="2"] .grid-item .inner {
    padding-right: 0;
  }

  body.handheld .collection:not(.editing)[items="2"] .grid-item:nth-child(2) .inner {
    padding-right: 5px;
  }

  body.handheld .collection:not(.editing)[items="2"] .grid-item:nth-child(2) {
    left: 50%;
  }

  body.handheld .collection:not(.editing)[items="2"] .grid-item {
    width: 50%;
    height: 100%;
  }

  body.handheld .collection:not(.editing)[items="3"] .grid-item .inner {
    padding-right: 0;
  }

  body.handheld .collection:not(.editing)[items="3"] .grid-item:nth-child(2) {
    left: 33.33%;
  }

  body.handheld .collection:not(.editing)[items="3"] .grid-item:nth-child(3) .inner {
    padding-right: 5px;
  }

  body.handheld .collection:not(.editing)[items="3"] .grid-item:nth-child(3) {
    left: 66.66%;
  }

  body.handheld .collection:not(.editing)[items="3"] .grid-item {
    width: 33.33%;
    height: 100%;
  }

  body.handheld .collection:not(.editing)[items="5"] .grid-item .inner,
  body.handheld .collection:not(.editing)[items="6"] .grid-item .inner {
    padding-right: 0;
    padding-bottom: 0;
  }

  body.handheld .collection:not(.editing)[items="5"] .grid-item:nth-child(2),
  body.handheld .collection:not(.editing)[items="6"] .grid-item:nth-child(2),
  body.handheld .collection:not(.editing)[items="5"] .grid-item:nth-child(5),
  body.handheld .collection:not(.editing)[items="6"] .grid-item:nth-child(5) {
    left: 33.33%;
  }

  body.handheld .collection:not(.editing)[items="5"] .grid-item:nth-child(3) .inner,
  body.handheld .collection:not(.editing)[items="6"] .grid-item:nth-child(3) .inner,
  body.handheld .collection:not(.editing)[items="5"] .grid-item:nth-child(6) .inner,
  body.handheld .collection:not(.editing)[items="6"] .grid-item:nth-child(6) .inner {
    padding-right: 5px;
  }

  body.handheld .collection:not(.editing)[items="5"] .grid-item:nth-child(3),
  body.handheld .collection:not(.editing)[items="6"] .grid-item:nth-child(3),
  body.handheld .collection:not(.editing)[items="5"] .grid-item:nth-child(6),
  body.handheld .collection:not(.editing)[items="6"] .grid-item:nth-child(6) {
    left: 66.66%;
  }

  body.handheld .collection:not(.editing)[items="5"] .grid-item:nth-child(n+4) .inner,
  body.handheld .collection:not(.editing)[items="6"] .grid-item:nth-child(n+4) .inner {
    padding-bottom: 5px;
  }

  body.handheld .collection:not(.editing)[items="5"] .grid-item:nth-child(n+4),
  body.handheld .collection:not(.editing)[items="6"] .grid-item:nth-child(n+4) {
    top: 50%;
  }

  body.handheld .collection:not(.editing)[items="5"] .grid-item,
  body.handheld .collection:not(.editing)[items="6"] .grid-item {
    width: 33.33%;
    height: 50%;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  .collection-grid .grid-item.flash:before {
    background-image: url("https:/i.cloudup.com/kxkM3Vw1Fd@2x.png");
    background-size: 70%;
  }
}

.collection-item {
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  height: 100%;
  -webkit-transform: translate3d(0,0,0);
  position: relative;
}

.collection-item.video,
.collection-item.article,
.collection-item.embed,
.collection-item.code,
.collection-item.pdf,
.collection-item.doc,
.collection-item.markdown {
  border-bottom: 60px solid #121212;
}

body.mobile .collection-item.article,
body.mobile .collection-item.embed,
body.mobile .collection-item.code,
body.mobile .collection-item.pdf,
body.mobile .collection-item.markdown {
  border-bottom: none;
}

.collection.chromeless .collection-item.video,
.collection.chromeless .collection-item.article,
.collection.chromeless .collection-item.embed,
.collection.chromeless .collection-item.code,
.collection.chromeless .collection-item.pdf,
.collection.chromeless .collection-item.doc,
.collection.chromeless .collection-item.markdown {
  border-bottom: none;
}

.collection-carousel[count="2"] .collection-item.video,
.collection-carousel[count="2"] .collection-item.code,
.collection-carousel[count="2"] .collection-item.pdf,
.collection-carousel[count="2"] .collection-item.article,
.collection-carousel[count="2"] .collection-item.embed,
.collection-carousel[count="2"] .collection-item.doc,
.collection-carousel[count="2"] .collection-item.markdown {
  border-bottom: 0;
}

.collection-carousel[count="2"] .collection-paginator .title {
  pointer-events: none;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
}

body.mobile .collection-carousel[count="2"] .collection-paginator.has_title .title {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
  pointer-events: auto;
}

.collection-item.code {
  overflow-x: scroll;
}

body.mobile .collection-item.article,
body.mobile .collection-item.code,
body.mobile .collection-item.pdf,
body.mobile .collection-item.markdown {
  padding: 40px 0;
}

.collection-item .failure-message h2 {
  font-size: 16px;
  font-weight: normal;
}

.collection-item .failure-message {
  margin-top: 250px;
  display: none;
}

.collection-item.failed .failure-message {
  display: block;
}

.collection-item.failed .spinner,
.collection-item.in-progress .spinner {
  display: none;
}

.collection-item .progress-message h2 {
  font-size: 16px;
  font-weight: normal;
}

.collection-item .progress-message {
  margin-top: 250px;
  display: none;
}

.collection-item.video.complete .progress-message.state-submitted h2:before {
  content: 'Submitted for conversion';
}

.collection-item.video.complete .progress-message.state-progressing h2:before {
  content: 'Processing the video';
}

.collection-item.video.complete .progress-message.state-canceled h2:before {
  content: 'Video processing canceled';
}

.collection-item.video.complete .progress-message.state-complete {
  display: none;
}

.collection-item.video.complete .progress-message {
  display: block;
}

.collection-item .button {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

.collection-item .button.hide {
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  -ms-transition: opacity 1s;
  -moz-transition: opacity 1s;
  -webkit-transition: opacity 1s;
  transition: opacity 1s;
}

.collection-item .progress {
  z-index: 100;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-top: -40px;
  margin-left: -40px;
}

.collection-item[progress="0"] .progress {
  display: none;
}

.collection-item .iframe-wrap {
  height: 100%;
  width: 100%;
}

.collection-item .iframe-wrap iframe {
  width: 100%;
  height: 100%;
  border: 0;
  background: #fff;
}

.collection-item.pdf_content {
  padding: 20px 20px 0;
}

.collection-item .pdf-wrap {
  position: relative;
  height: 100%;
}

.collection-item .pdf-reader-wrap {
  height: 100%;
  width: 100%;
  position: absolute;
}

.collection-item .pdf-reader {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.collection-item .pdf-reader .pdf-reader-page {
  border-bottom: 1px solid #000;
}

.collection-item.image {
  overflow: hidden;
}

.collection-item.image img.scaled {
  display: block;
}

.collection-item.image img {
  display: none;
}

body.handheld .collection-item .img-outer {
  -webkit-user-select: none;
}

body.handheld .collection-item .img-outer .img-inner img {
  -ms-transition: none;
  -moz-transition: none;
  -webkit-transition: none;
  transition: none;
}

.collection-item .img-outer {
  display: table;
  max-width: 100%;
  position: static;
  height: 100%;
  width: 100%;
}

.collection-item .img-outer .img-wrapper .progress {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -10px;
  margin-top: -10px;
}

.collection-item .img-outer .img-wrapper {
  position: relative;
  display: inline-block;
  zoom: 1;
  *display: inline;
}

.collection-item .img-outer .img-inner img.loaded {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

.collection-item .img-outer .img-inner img {
  margin: auto;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  -ms-transition: opacity 300ms ease-out;
  -moz-transition: opacity 300ms ease-out;
  -webkit-transition: opacity 300ms ease-out;
  transition: opacity 300ms ease-out;
}

.collection-item .img-outer .img-inner {
  display: table-cell;
  vertical-align: middle;
  position: static;
  margin: auto;
}

.collection-item .code-wrap {
  height: 100%;
  cursor: text;
}

.collection-item .gist .code pre,
.collection-item .gist-syntax {
  cursor: text;
  -ms-user-select: text;
  -moz-user-select: text;
  -webkit-user-select: text;
  user-select: text;
}

body.mobile .collection-item .gist-syntax .linenos {
  padding-left: 15px;
  display: none;
}

body.mobile .collection-item .gist-syntax .code {
  font-size: 9px;
}

.collection-item > .spinner {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -10px;
  margin-left: -10px;
}

.collection-item .unsafe-html {
  width: 100%;
  height: 99%;
}

.collection-item .unsafe-html iframe {
  border: none;
  width: 100%;
  height: 100%;
  background: #121212;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  -ms-transition: opacity 200ms ease-in;
  -moz-transition: opacity 200ms ease-in;
  -webkit-transition: opacity 200ms ease-in;
  transition: opacity 200ms ease-in;
}

.collection-item .unsafe-html iframe.loaded {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

.collection-item .article,
.collection-item.markdown {
  background: #fff;
}

.collection-item .article .article-main,
.collection-item.markdown .article-main,
.collection-item .article .code-wrap,
.collection-item.markdown .code-wrap {
  color: #454545;
  max-width: 700px;
  padding: 20px 50px 90px;
  text-align: left;
  margin: auto;
}

.collection-item .article h1,
.collection-item.markdown h1,
.collection-item .article h2,
.collection-item.markdown h2,
.collection-item .article h3,
.collection-item.markdown h3,
.collection-item .article h4,
.collection-item.markdown h4 {
  color: #333;
  margin: 35px 0 0 0;
  font-weight: bold;
  font-family: 'proxima-nova', "Helvetica Neue", Arial, sans-serif;
}

.collection-item .article h2 + p,
.collection-item.markdown h2 + p,
.collection-item .article h3 + p,
.collection-item.markdown h3 + p,
.collection-item .article h4 + p,
.collection-item.markdown h4 + p {
  margin-top: 4px;
}

.collection-item .article h2:before,
.collection-item.markdown h2:before {
  display: block;
  content: ' ';
  width: 200px;
  height: 2px;
  background: #eee;
  margin: 50px auto;
}

.collection-item .article p > code,
.collection-item.markdown p > code {
  color: #525252;
}

.collection-item .article pre,
.collection-item.markdown pre {
  background: #f2f2f0;
  padding: 20px 15px;
  color: #2d2c2c;
  font-size: .8em;
  -ms-border-radius: 2px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
}

.collection-item.markdown img {
  max-width: 100%;
}

.collection-item.unknown {
  max-height: 600px;
}

.collection-item.unknown .unknown-wrap {
  display: table;
  width: 100%;
  height: 100%;
}

.collection-item.unknown .unknown .thumb img {
  max-width: 100%;
  max-height: 250px;
}

.collection-item.unknown .unknown {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}

.collection-item.unknown.complete .thumb {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

.collection-item .unknown-title {
  margin: 15px auto;
  max-width: 400px;
  padding: 0 20px 20px 20px;
  position: relative;
  font-size: 18px;
  -ms-border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

.collection-item .unknown-title span.title {
  max-width: 250px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  display: inline-block;
  zoom: 1;
  *display: inline;
}

.collection-item .unknown-title i:before {
  margin-right: 0;
}

.collection-item .unknown-title i .ext {
  width: 100%;
  text-align: center;
  color: black;
  font-size: 16px;
  position: absolute;
  bottom: 30px;
  left: 0;
  font-style: normal;
  letter-spacing: 0.1em;
  font-weight: 600;
}

.collection-item .unknown-title i {
  font-size: 150px;
  position: relative;
}

.collection-item .unknown-title .thumb {
  margin-bottom: 15px;
}

.collection-item .unknown-title .size:before {
  vertical-align: top;
  content: '(';
}

.collection-item .unknown-title .size:after {
  vertical-align: top;
  content: ')';
}

.collection-item .unknown-title .size {
  margin-left: 5px;
  color: rgba(255, 255, 255, .7);
  vertical-align: top;
}

.collection-item .img-info {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background: rgba(26, 26, 26, .9);
  cursor: pointer;
}

.collection-item.video {
  display: block;
  height: 100%;
  width: 100%;
}

.collection-item.video .vid-outer .vid-inner {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}

.collection-item.video .vid-outer {
  display: table;
  width: 100%;
  height: 100%;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  -ms-transition: opacity 200ms ease-in;
  -moz-transition: opacity 200ms ease-in;
  -webkit-transition: opacity 200ms ease-in;
  transition: opacity 200ms ease-in;
}

.collection-item.video .vid-progress a.download:hover {
  color: #eee;
}

.collection-item.video .vid-progress a.download {
  text-decoration: none;
  text-transform: uppercase;
  font-size: 13px;
  color: #b7b5b2;
}

.collection-item.video .vid-progress .title-error {
  display: none;
}

.collection-item.video .vid-progress {
  display: none;
}

.collection-item[transcode_state="error"] .vid-progress .title-progress {
  display: none;
}

.collection-item[transcode_state="error"] .vid-progress .title-error {
  display: block;
}

.collection-item.needs_transcoding .vid-progress {
  height: 100%;
  display: block;
}

.collection-item.needs_transcoding .vid-progress .vid-outer {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
  margin-top: -50px;
  text-align: center;
}

.collection-item.needs_transcoding .vid-progress i {
  color: #3abcd5;
  font-size: 95px;
  position: relative;
  left: 5px;
}

.collection-carousel[count="2"] .collection-item.video {
  padding: 0;
}

.collection-item.video.sublime_loaded .vid-outer {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

.collection-item.audio {
  max-height: 600px;
}

.collection-item.audio .audio-wrap {
  display: table;
  width: 100%;
  height: 100%;
}

.collection-item.audio .audio-item i {
  display: block;
  margin: auto;
  width: 150px;
  font-size: 130px;
}

.collection-item.audio .audio-item audio {
  margin-top: 30px;
  width: 100%;
}

.collection-item.audio .audio-item .content .duration {
  float: right;
  padding-top: 4px;
}

.collection-item.audio .audio-item .content .artist {
  display: block;
}

.collection-item.audio .audio-item .content .artist,
.collection-item.audio .audio-item .content .duration {
  font-size: 16px;
  color: #aaa8a5;
}

.collection-item.audio .audio-item .content {
  max-width: 500px;
  margin: 0 auto;
  padding: 0 40px;
  text-align: left;
  font-size: 20px;
}

.collection-item.audio .audio-item {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}

body.handheld .collection-item.embed .unsafe-html:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 33%;
  height: 100%;
}

body.handheld .collection-item.embed .unsafe-html:after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 33%;
  height: 100%;
}

@media only screen and (max-width: 600px) {
  .collection-item.audio .audio-wrap,
  .collection-item.unknown .unknown-wrap {
    margin-top: -20px;
    max-height: 100%;
    height: 100%;
  }

  .collection-item.doc {
    padding-left: 0;
    padding-right: 0;
  }
}

.collection-menu .disabled a {
  color: #d1d1d1 !important;
  pointer-events: none;
  cursor: default;
}

.collection-menu .hide a {
  display: none;
}

.collection-paginator {
  margin-left: 0 auto;
}

.collection.editing .collection-paginator {
  display: none;
}

.collection-paginator .inner {
  pointer-events: auto;
  text-align: center;
  vertical-align: top;
  line-height: 12px;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  -ms-transition: opacity 200ms ease-out;
  -moz-transition: opacity 200ms ease-out;
  -webkit-transition: opacity 200ms ease-out;
  transition: opacity 200ms ease-out;
}

.collection.loaded .collection-paginator .inner {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

.collection-paginator .dots,
.collection-paginator .text {
  display: inline-block;
  zoom: 1;
  *display: inline;
  background: rgba(18, 18, 18, .9);
  padding: 6px 7px;
  margin-bottom: 4px;
  -ms-border-radius: 2px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
}

.collection-paginator .dots {
  display: none;
  position: relative;
}

.collection-paginator .dots .dot {
  display: inline-block;
  zoom: 1;
  *display: inline;
  cursor: pointer;
  width: 11px;
  height: 13px;
  line-height: 11px;
  z-index: 500;
  text-decoration: none;
  vertical-align: middle;
  text-align: center;
}

.collection-paginator .dots .dot:before {
  display: inline-block;
  zoom: 1;
  *display: inline;
  content: ' ';
  width: 6px;
  height: 6px;
  margin: 0 2px;
  background-color: #5a5a5a;
  -ms-border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  -ms-transition: background-color 100ms ease-out;
  -moz-transition: background-color 100ms ease-out;
  -webkit-transition: background-color 100ms ease-out;
  transition: background-color 100ms ease-out;
}

.collection-paginator .dots .dot#grid {
  margin-right: 8px;
}

.collection-paginator .dots .dot#grid:before {
  width: 11px;
  height: 11px;
  position: relative;
  bottom: -1px;
  background-image: url("https://s1.cldup.com/collection/images/grid.png");
  -ms-border-radius: 0;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  border-radius: 0;
}

.collection-paginator .dots .dot.current {
  cursor: default;
}

.collection-paginator .dots .dot.current:before {
  background-color: #fff;
}

.collection-paginator .dots .dot:hover:before {
  background-color: #fff;
}

body.handheld .collection-paginator .dots .dot:hover:before {
  background-color: #5a5a5a;
}

.collection-paginator .text {
  color: #707070;
  font-size: 12px;
  font-weight: bold;
  -ms-transition: color 100ms ease-out;
  -moz-transition: color 100ms ease-out;
  -webkit-transition: color 100ms ease-out;
  transition: color 100ms ease-out;
}

.collection-paginator .text .grid {
  float: left;
  display: inline-block;
  zoom: 1;
  *display: inline;
  text-decoration: none;
  width: 11px;
  height: 11px;
  margin-right: 7px;
  content: ' ';
  cursor: pointer;
  background: #707070 url("https://s1.cldup.com/collection/images/grid.png");
  -ms-transition: background-color 100ms ease-out;
  -moz-transition: background-color 100ms ease-out;
  -webkit-transition: background-color 100ms ease-out;
  transition: background-color 100ms ease-out;
}

.collection-paginator .text span.current,
.collection-paginator .text span.total {
  width: 10px;
  text-align: center;
}

.collection-paginator .text span.of {
  padding: 0 2px;
}

.collection-paginator .text span.current {
  color: #fff;
}

.collection-paginator[current="grid"] .text span.current {
  color: #707070;
}

.collection-paginator[current="grid"] .text a.grid {
  background-color: #fff;
  cursor: default;
}

.collection-paginator[count=""] .dots,
.collection-paginator[count=""] .text {
  display: none;
}

.collection-paginator[count="1"] .dots,
.collection-paginator[count="2"] .dots,
.collection-paginator[count="3"] .dots,
.collection-paginator[count="4"] .dots,
.collection-paginator[count="5"] .dots,
.collection-paginator[count="6"] .dots {
  display: inline-block;
  zoom: 1;
  *display: inline;
}

.collection-paginator[count="1"] .text,
.collection-paginator[count="2"] .text,
.collection-paginator[count="3"] .text,
.collection-paginator[count="4"] .text,
.collection-paginator[count="5"] .text,
.collection-paginator[count="6"] .text {
  display: none;
}

.collection-paginator .title {
  display: inline-block;
  zoom: 1;
  *display: inline;
  font-size: 12px;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  color: #707070;
  overflow: hidden;
  background: rgba(18, 18, 18, .9);
  line-height: 16px;
  padding: 1px 4px 1px;
  margin-bottom: 1px;
  text-shadow: 0 1px 0 #000;
  vertical-align: bottom;
  position: relative;
  -ms-border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  -ms-transition: opacity 100ms ease-out;
  -moz-transition: opacity 100ms ease-out;
  -webkit-transition: opacity 100ms ease-out;
  transition: opacity 100ms ease-out;
}

.collection-paginator .title a:hover {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

.collection-paginator .title a {
  color: #707070;
  text-decoration: none;
  font-weight: 100;
  display: inline-block;
  zoom: 1;
  *display: inline;
  max-width: 300px;
  overflow-x: hidden;
  overflow-y: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  height: 15px;
}

.collection-paginator.has_title .title {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
  pointer-events: auto;
}

.collection.chromeless .collection-paginator .title {
  display: none;
}

.collection.chromeless .collection-paginator .inner {
  line-height: 12px;
  position: relative;
  top: 7px;
}

.collection .collection-paginator[count="1"] .inner,
.collection .collection-paginator[count="2"] .inner,
.collection .collection-paginator.hide .inner,
.collection .collection-paginator.hide .title {
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  pointer-events: none;
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  .collection-paginator .dots .dot#grid:before {
    background-image: url("https://s1.cldup.com/collection/images/grid@2x.png");
    background-size: contain;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  .collection-paginator .text .grid {
    background-image: url("https://s1.cldup.com/collection/images/grid@2x.png");
    background-size: contain;
  }
}

.password-dialog h1:before {
  font-family: 'icons';
  content: '\e802';
  color: #db4e48;
  display: inline-block;
  zoom: 1;
  *display: inline;
  position: relative;
  left: -24px;
}

.password-dialog input.has_password:-ms-input-placeholder {
  font-size: 15px;
  color: black;
  font-size: 400;
  font-style: normal;
}

.password-dialog input.has_password:-moz-placeholder {
  font-size: 15px;
  color: black;
  font-size: 400;
  font-style: normal;
}

.password-dialog input.has_password::-moz-placeholder {
  font-size: 15px;
  color: black;
  font-size: 400;
  font-style: normal;
}

.password-dialog input.has_password::-webkit-input-placeholder {
  font-size: 15px;
  color: black;
  font-size: 400;
  font-style: normal;
}

.password-dialog input.has_password:focus:-ms-input-placeholder {
  color: transparent;
}

.password-dialog input.has_password:focus:-moz-placeholder {
  color: transparent;
}

.password-dialog input.has_password:focus::-moz-placeholder {
  color: transparent;
}

.password-dialog input.has_password:focus::-webkit-input-placeholder {
  color: transparent;
}

.password-dialog .buttons {
  margin: 10px 0 5px 0;
}

.password-dialog form p {
  text-align: left;
}

.password-dialog form p input[type=text],
.password-dialog form p input[type=password] {
  position: relative;
}

.password-dialog form p span {
  top: 40px;
}

body.mobile .password-dialog .msg-placeholder {
  height: auto;
}

body.mobile .password-dialog .head {
  padding-top: 20px;
  padding-bottom: 10px;
}

body.mobile .password-dialog .buttons {
  margin-top: 0px;
}

article.reader {
  font-family: droid-serif, Georgia, serif;
  font-size: 20px;
  text-align: left;
  cursor: text;
  overflow: hidden;
  color: #111111;
  -ms-user-select: all;
  -moz-user-select: all;
  -webkit-user-select: all;
  user-select: all;
}

article.reader h1.title {
  font-weight: bold;
  font-size: 1.33em;
  line-height: 1.25em;
  text-align: start;
  margin-top: 16px;
  display: block;
  -webkit-hyphens: manual;
}

article.reader p.article-url {
  margin: 5px 0 0;
  line-height: 15px;
}

article.reader p.article-url a {
  font-size: 13px;
  color: #999;
  display: block;
  max-width: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

article.reader h1 {
  padding-top: 10px;
  font-size: 1.33em;
  margin-bottom: 0px;
}

article.reader h2 {
  font-size: 1.125em;
}

article.reader h3 {
  font-size: 1.05em;
}

article.reader a {
  text-decoration: none;
  color: #c27943;
  font-weight: normal;
}

article.reader a:hover {
  color: #080808;
  font-weight: normal;
}

article.reader a:visited {
  color: #800080;
  font-weight: normal;
}

article.reader p {
  line-height: 32px;
  font-size: 20px;
}

article.reader .author {
  display: inline-block;
  zoom: 1;
  *display: inline;
  font-style: italic;
}

article.reader .date {
  margin-left: 20px;
  display: inline-block;
  zoom: 1;
  *display: inline;
  color: #b2b2b2;
  float: right;
}

article.reader .lead-image {
  padding-top: 15px;
  margin: auto;
  float: none;
  display: block;
  clear: both;
  max-width: 100%;
}

article.reader .reg-image {
  float: left;
  margin: 12px 20px 12px 0;
  max-width: 30%;
  height: auto;
}

article.reader .tiny-image {
  float: none;
  margin: 0;
}

article.reader img {
  max-width: 100%;
  height: auto !important;
}

@media only screen and (max-width: 600px) {
  .collection-item .article .article-main {
    padding: 15px 20px;
  }

  article.reader {
    font-size: 1.1em;
  }

  article.reader h1.title {
    margin-top: 0;
  }

  article.reader p {
    line-height: 1.4em;
    font-size: 1.1em;
  }
}

.share-dialog {
  overflow: hidden;
  width: 380px;
  max-width: 380px !important;
}

.share-dialog h2 span.locked,
.share-dialog h2 span.unlocked {
  overflow: hidden;
}

.share-dialog h2 {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  zoom: 1;
  *display: inline;
  width: 100%;
}

.share-dialog h2:before {
  content: '\e802';
  font-family: 'icons';
  display: inline-block;
  zoom: 1;
  *display: inline;
  color: #8bb66b;
  margin-right: 5px;
  font-size: 14px;
  position: relative;
  top: 1px;
  font-style: normal;
}

.share-dialog span.locked {
  display: none;
}

.share-dialog .body {
  text-align: left;
}

.dialog.share-dialog .body {
  padding-left: 18px;
  padding-right: 18px;
}

.dialog.share-dialog .body form {
  position: relative;
}

.dialog.share-dialog .body {
  color: #c4c4c4;
}

.dialog.share-dialog .body .msg-placeholder .msg {
  margin: 0 50px 0 0;
  line-height: 18px;
}

.dialog.share-dialog .body .button-ph {
  position: relative;
  text-align: right;
}

.dialog.share-dialog .body .recipients {
  margin-top: -28px;
  text-align: right;
  display: inline-block;
  zoom: 1;
  *display: inline;
  min-width: 10px;
  position: absolute;
  padding-left: 25px;
  padding-right: 4px;
  right: 0;
}

.dialog.share-dialog .body .recipients:before {
  position: absolute;
  left: 4px;
  font-family: icons;
  content: '\f0e0';
}

.dialog.share-dialog .body .recipients.error {
  color: #cf4850;
}

.dialog.share-dialog .body .contacts {
  position: relative;
  margin-top: 2px;
}

.dialog.share-dialog .body .contacts textarea {
  min-height: 132px;
  padding-top: 10px;
}

.dialog.share-dialog .body .contacts span.error {
  top: 9px;
}

.dialog.share-dialog .body .contacts ul.share-items li {
  list-style: none;
  display: inline-block;
  zoom: 1;
  *display: inline;
}

.dialog.share-dialog .body .contacts ul.share-items {
  height: 34px;
  border-top: 1px dashed #d9d9d9;
  position: relative;
  margin-top: -35px;
  list-style: none;
  padding: 7px;
  cursor: default;
  pointer-events: none;
}

.dialog.share-dialog .body .contacts .share-items-count {
  cursor: default;
  position: absolute;
  right: 10px;
  bottom: 9px;
  font-weight: bold;
  padding: 2px 5px;
  text-shadow: 1px 0px 0 #fff, -1px 0px 0 #fff, 0px 1px 0 #fff, 0px -1px 0 #fff;
}

.dialog.share-dialog .errors-ph ul,
.dialog.share-dialog .errors-ph p {
  padding: 0px;
  color: #cf4850;
}

.dialog.share-dialog .errors-ph ul li {
  line-height: 18px;
  height: 18px;
  padding-left: 10px;
  list-style-position: inside;
}

.dialog.share-dialog .foot {
  margin: 30px 5px 20px;
  height: 40px;
  line-height: 40px;
  background-color: rgba(0, 0, 0, 0.9);
  position: relative;
  -ms-border-radius: 20px;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  border-radius: 20px;
  -ms-box-shadow: 0 0 0 1px rgba(255, 255, 255, .1);
  -moz-box-shadow: 0 0 0 1px rgba(255, 255, 255, .1);
  -webkit-box-shadow: 0 0 0 1px rgba(255, 255, 255, .1);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .1);
}

.dialog.share-dialog .foot .share-link .short.link-copied {
  color: #0ac;
}

.dialog.share-dialog .foot .share-link .short {
  -ms-transition: color 200ms ease-out;
  -moz-transition: color 200ms ease-out;
  -webkit-transition: color 200ms ease-out;
  transition: color 200ms ease-out;
}

.dialog.share-dialog .foot .share-link span.scheme {
  font-size: 1px;
  opacity: 0.1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=10);
  filter: alpha(opacity=10);
}

.dialog.share-dialog .foot .share-link {
  color: white;
  max-width: 250px;
  margin-left: 10px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 600;
  font-size: 15px;
  -ms-user-select: text;
  -moz-user-select: text;
  -webkit-user-select: text;
  user-select: text;
}

.dialog.share-dialog .foot ul li:hover {
  cursor: pointer;
  color: #5db1d3;
}

.dialog.share-dialog .foot ul li:before {
  text-align: center;
  font-family: 'icons';
}

.dialog.share-dialog .foot ul li.icon-tw:before {
  content: '\54';
}

.dialog.share-dialog .foot ul li.icon-fb:before {
  content: '\f300';
}

.dialog.share-dialog .foot ul li.icon-link:before {
  content: '';
}

.dialog.share-dialog .foot ul li.icon-link {
  position: relative;
}

.dialog.share-dialog .foot ul li {
  width: 25px;
  margin: 0 5px;
  height: 37px;
  line-height: 37px;
  color: #2da1c3;
  font-size: 16px;
  display: inline-block;
  zoom: 1;
  *display: inline;
  vertical-align: top;
}

.dialog.share-dialog .foot ul {
  list-style: none;
  margin: 0;
  position: absolute;
  right: 12px;
  top: 0;
}

.dialog-overlay.has_password .dialog.share-dialog > .head h2:before {
  color: #cf4850;
}

.dialog.share-dialog div.button-el {
  position: absolute;
  left: 0;
  display: none;
}

.has_clipboard .dialog.share-dialog div.button-el div {
  width: 76px;
  text-align: center;
}

.has_clipboard .dialog.share-dialog div.button-el span:before {
  font-family: 'icons';
  content: '\f517';
}

.has_clipboard .dialog.share-dialog div.button-el span {
  width: 30px;
  display: block;
}

.has_clipboard .dialog.share-dialog div.button-el {
  display: inline-block;
  zoom: 1;
  *display: inline;
}

.tip-share {
  cursor: pointer;
}

.collection-sidebar {
  position: fixed;
  width: 260px;
  background: #2c2c2f;
  top: 0;
  left: 0;
  margin-top: 40px;
}

body.handheld .collection-sidebar {
  width: 235px;
}

.collection-sidebar .top {
  overflow: hidden;
  position: fixed;
  height: 40px;
  width: inherit;
  top: 0;
  left: 0;
  z-index: 500;
  line-height: 40px;
  vertical-align: middle;
}

.collection-sidebar .top > a {
  display: inline-block;
  zoom: 1;
  *display: inline;
  vertical-align: middle;
}

.collection-sidebar .top .hide {
  float: left;
}

.collection-sidebar .top .save {
  float: right;
}

.collection-sidebar .hide {
  height: 41px;
  text-decoration: none;
  padding: 0 15px;
}

.collection-sidebar .hide:before {
  font-family: 'icons';
  content: '\e4ad';
  font-size: 16px;
  color: #c5c5c5;
}

.collection-sidebar .hide:hover:before {
  color: #eee;
}

.collection-sidebar .top .save {
  height: 26px;
  line-height: 26px;
  padding: 0 10px;
  font-size: 10px;
  margin: 7px 16px 0 0;
}

.collection-sidebar .save:before {
  content: 'Save';
}

.collection-sidebar .main {
  padding: 10px 10px 0 15px;
  text-align: left;
  height: 100%;
}

.collection-sidebar h2 {
  color: #c4c4c4;
  font-size: 14px;
  margin-top: 20px;
  margin-bottom: 10px;
}

.collection-sidebar textarea {
  font-size: 13px;
  border: 1px solid #1b1b1e;
  display: block;
  width: 100%;
  vertical-align: top;
  resize: none;
  padding: 10px;
  height: 78px;
  -ms-border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -ms-box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.collection-sidebar .inline-save,
.collection-sidebar .success {
  float: right;
  color: #25a1c3;
  text-transform: uppercase;
  font-size: 11px;
  margin-top: -113px;
  font-weight: bold;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  pointer-events: none;
  -ms-transition: opacity 100ms ease-out;
  -moz-transition: opacity 100ms ease-out;
  -webkit-transition: opacity 100ms ease-out;
  transition: opacity 100ms ease-out;
}

.collection-sidebar .inline-save.title-save:before {
  content: 'Save';
}

.collection-sidebar .inline-save.note-save:before {
  content: '+ Add ';
}

.collection-sidebar .inline-save.url-save:before {
  content: '+ Add ';
}

.collection-sidebar textarea.dirty + a.inline-save {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
  pointer-events: all;
}

.collection-sidebar .success {
  color: #999;
  width: 100px;
  text-align: right;
  -ms-transition: opacity 350ms ease-out;
  -moz-transition: opacity 350ms ease-out;
  -webkit-transition: opacity 350ms ease-out;
  transition: opacity 350ms ease-out;
}

.collection-sidebar .success.shown {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

.collection-sidebar .success.title-success:before {
  content: 'Saved!';
}

.collection-sidebar .success.note-success:before {
  content: 'Added!';
}

.collection-sidebar .success.url-success:before {
  content: 'Added ';
}

.collection-sidebar .locked {
  display: none;
}

.collection-sidebar .locked,
.collection-sidebar .unlocked {
  position: relative;
  padding-left: 24px;
  margin-bottom: 40px;
}

.collection-sidebar .locked p,
.collection-sidebar .unlocked p {
  color: #eee;
  margin-bottom: 8px;
}

.collection-sidebar .locked a,
.collection-sidebar .unlocked a {
  color: #4ba0bf;
  font-size: 12px;
  text-transform: uppercase;
  text-decoration: none;
}

.collection-sidebar .locked a.pwd-remove,
.collection-sidebar .unlocked a.pwd-remove {
  color: #c4c4c4;
}

.collection-sidebar a.pwd-change:before {
  content: 'Change';
}

.collection-sidebar a.pwd-remove {
  float: right;
}

.collection-sidebar a.pwd-remove:before {
  content: 'Remove';
}

.collection-sidebar .locked:before,
.collection-sidebar .unlocked:before {
  content: '\e802';
  font-family: 'icons';
  font-size: 24px;
  width: 25px;
  height: 25px;
  display: block;
  position: absolute;
  top: -5px;
  left: 0;
  color: #8bb66b;
}

.collection-sidebar .locked:before {
  color: #cf4850;
}

.collection.has_password .collection-sidebar .unlocked {
  display: none;
}

.collection.has_password .collection-sidebar .locked {
  display: block;
}

.collection-sidebar .delete {
  position: absolute;
  left: 15px;
  bottom: 17px;
}

.collection-sidebar .delete:before {
  display: inline-block;
  zoom: 1;
  *display: inline;
  color: #aeaeae;
  font-size: 14px;
  font-family: 'icons';
  content: '\e01b';
  margin-right: 10px;
}

.collection-sidebar .delete:after {
  content: 'Delete';
  display: inline;
  font-size: 12px;
  color: #c4c4c4;
  border-bottom: 1px solid #605f61;
}

.collection-sidebar .delete:hover:before,
.collection-sidebar .delete:hover:after {
  color: #fff;
  border-bottom-color: #fff;
}

.collection-sidebar .bottom {
  height: 60px;
  padding-top: 20px;
}

.collection-sidebar.has_scrollbar .bottom {
  position: relative;
}

.collection-sidebar.has_scrollbar .delete {
  bottom: 15px;
  left: 0;
}

.collection.sidebar-opening .collection-view,
.collection.sidebar-closing .collection-view {
  -ms-transition-duration: 200ms;
  -moz-transition-duration: 200ms;
  -webkit-transition-duration: 200ms;
  transition-duration: 200ms;
  -ms-transition-timing-function: ease-in;
  -moz-transition-timing-function: ease-in;
  -webkit-transition-timing-function: ease-in;
  transition-timing-function: ease-in;
}

.collection.sidebar-moving .collection-view {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-user-select: none;
}

.collection.sidebar-open .collection-sidebar .main {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.collection.sidebar-open .collection-view {
  margin-left: 260px;
}

body.mobile .collection.sidebar-open .collection-view {
  margin-left: 0;
}

.collection.sidebar-open .collection-sidebar .main::-webkit-scrollbar {
  width: 10px;
}

.collection.sidebar-open .collection-sidebar .main::-webkit-scrollbar-thumb:vertical {
  background: #616164;
  border-right: 5px solid transparent;
  -ms-background-clip: padding-box;
  -moz-background-clip: padding-box;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
}

.collection-sidebar .note {
  display: none;
}

@media screen and (max-width: 650px) {
  .collection.sidebar-open .placeholder {
    display: none;
  }
}

.collection-unlock {
  max-width: 600px;
  text-align: left;
  margin: auto;
  margin-top: 200px;
}

.collection-unlock .avatar {
  width: 135px;
  height: 135px;
  float: left;
}

.collection-unlock .avatar .user-avatar {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
  width: inherit;
  height: inherit;
}

.collection-unlock p {
  margin: 0;
  padding-bottom: 20px;
}

.collection-unlock .form {
  width: 400px;
  float: right;
}

.collection-unlock .form p {
  font-size: 24px;
  line-height: 32px;
  font-family: 'droid-serif';
  font-style: oblique;
  color: #333;
}

.collection-unlock .form:before {
  display: block;
  position: absolute;
  margin-left: -35px;
  margin-top: -40px;
  font-family: 'icons';
  color: #444;
  content: '\275d';
  font-size: 60px;
  opacity: 0.1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=10);
  filter: alpha(opacity=10);
}

.collection-unlock .hint p {
  padding-bottom: 10px;
}

.collection-unlock .hint span {
  font-style: normal;
  font-family: 'proxima-nova';
}

.collection-unlock .hint.hide {
  display: none;
}

.collection-unlock form .msg-placeholder {
  margin-bottom: 5px;
  white-space: nowrap;
}

.collection-unlock form p.msg {
  text-align: left;
  font-size: 13px;
  font-weight: normal;
}

.collection-unlock .pass input[type=password] {
  width: 250px;
  margin: 0;
  margin-right: 10px;
}

.collection-unlock .pass button:before {
  display: none;
}

.collection-unlock span.hint-text {
  display: inline-block;
  zoom: 1;
  *display: inline;
  background: #e9f5f8;
  font-size: 18px;
  font-weight: bold;
  padding: 5px 15px;
  line-height: 22px;
  -ms-border-radius: 18px;
  -moz-border-radius: 18px;
  -webkit-border-radius: 18px;
  border-radius: 18px;
}

body.mobile .collection-unlock .collection-view.top {
  display: none;
}

body.mobile .collection-unlock .avatar {
  width: 75px;
  height: 75px;
  float: none;
  margin: 0 auto;
}

body.mobile .collection-unlock .form:before {
  display: none;
}

body.mobile .collection-unlock .form p {
  line-height: 30px;
  font-weight: 300;
  font-size: 18px;
  padding-bottom: 10px;
}

body.mobile .collection-unlock .form {
  width: 100%;
  padding: 20px;
}

body.mobile .collection-unlock .pass input[type=password] {
  margin: 0;
  width: 100%;
  border-right: 0;
  -ms-border-radius: right 0;
  -moz-border-radius: right 0;
  -webkit-border-radius: right 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

body.mobile .collection-unlock .pass button.icon-ok:before {
  display: inline-block;
  zoom: 1;
  *display: inline;
}

body.mobile .collection-unlock .pass button.icon-ok {
  float: right;
  margin-right: -36px;
  border-left: 1px solid #2295b5;
  padding: 0;
  padding-left: 4px;
  padding-top: 1px;
  font-size: 16px;
  width: 36px;
  -ms-border-radius: left 0;
  -moz-border-radius: left 0;
  -webkit-border-radius: left 0;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

body.mobile .collection-unlock .pass {
  padding-right: 36px;
}

body.mobile .collection-unlock {
  height: 100%;
  width: 100%;
  margin-top: 0;
  padding-top: 60px;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}

@media only screen and (max-width: 600px) {
  .collection-unlock .avatar {
    width: 100px;
    height: 100px;
    float: none;
    margin: 40px auto;
  }

  .collection-unlock .form {
    margin: 0 auto;
  }

  .collection-unlock .pass input {
    width: 220px;
  }

  .collection-unlock {
    height: 100%;
    width: 100%;
    margin-top: 0;
    padding-top: 60px;
  }
}

.collections-list .list {
  text-align: center;
  padding-bottom: 25px;
}

.collections-list .col {
  height: 294px;
  display: inline-block;
  zoom: 1;
  *display: inline;
  vertical-align: top;
  margin: 20px 17px;
}

.collections-list .col-inner {
  text-align: left;
  font-size: 12px;
  height: inherit;
  background-position: 50% 10%;
  position: relative;
  width: 336px;
  display: inline-block;
  zoom: 1;
  *display: inline;
  vertical-align: top;
  background: #fff;
  -ms-background-size: cover;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  -ms-border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -ms-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}

.collections-list .col-inner .remove {
  display: none;
}

.collections-list .col a {
  text-decoration: none;
}

.collections-list .col .title i.icon-lock-1:before,
.collections-list .col .title a.icon-pencil:before,
.collections-list .col .title a.icon-cog:before {
  cursor: pointer;
}

.collections-list .col .title i.icon-lock-1:hover,
.collections-list .col .title a.icon-pencil:hover,
.collections-list .col .title a.icon-cog:hover {
  background: #eee;
}

.collections-list .col .title i.icon-lock-1,
.collections-list .col .title a.icon-pencil,
.collections-list .col .title a.icon-cog {
  font-size: 18px;
  color: #b6d88b;
  float: right;
  display: none;
  position: relative;
  top: 0;
  line-height: 16px;
  padding: 1px 0 1px 2px;
}

.collections-list .col .title a.icon-pencil,
.collections-list .col .title a.icon-cog {
  font-size: 12px;
  color: #fff;
  text-decoration: none;
  left: 4px;
  line-height: 14px;
  color: #666;
  float: none;
}

.collections-list .col .title a.icon-cog.dropdown-shown {
  display: inline-block;
  zoom: 1;
  *display: inline;
}

.collections-list .col .title {
  text-decoration: none;
  padding: 12px 20px 0 20px;
  display: block;
  font-weight: bold;
  z-index: 15;
  font-size: 15px;
  width: 100%;
  line-height: 16px;
}

.collections-list .col .title span.total,
.collections-list .col .title span.locked {
  color: #c2bdb8;
  font-weight: normal;
  font-size: 12px;
  font-weight: bold;
  text-transform: uppercase;
}

.collections-list .col .title span.locked {
  color: #cf4850;
  display: none;
}

.collections-list .col .title span.name-wrap {
  width: 250px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #25a1c3;
  display: inline-block;
  zoom: 1;
  *display: inline;
}

.collections-list .col .title a.name:hover {
  text-decoration: underline;
}

.collections-list .col .title a.name {
  color: #25a1c3;
  text-decoration: none;
  width: 150px;
}

.collections-list .col .title {
  height: 55px;
}

.collections-list .col.locked .thumbs-wrap:before {
  color: #cf4850;
  display: block;
  font-family: 'icons';
  font-size: 80px;
  padding-top: 65px;
  content: '\e802';
}

.collections-list .col.locked .thumbs-wrap {
  text-align: center;
}

.collections-list .col.locked .title span.total {
  display: none;
}

.collections-list .col.locked .title span.locked {
  display: inline;
}

.collections-list .col.locked .title .name-wrap a {
  color: #999;
}

.collections-list .col .title input {
  background: none;
  color: #25a1c3;
  border: none;
  -webkit-font-smoothing: antialiased;
  font: bold 15px 'proxima-nova', 'Helvetica Neue', Arial, Helvetica, sans-serif;
  display: none;
  width: 100%;
  padding: 0;
  height: auto;
  margin: 0;
  -ms-box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.collections-list .col .user-avatar {
  float: right;
  margin: 5px 0 0 0;
}

.collections-list .col.mine .title i.icon-lock-1 {
  display: block;
}

.collections-list .col.mine:hover .title a.icon-pencil,
.collections-list.key-collections_seen .col:hover .title a.icon-cog {
  display: inline-block;
  zoom: 1;
  *display: inline;
}

body.handheld .collections-list .col.mine:hover .title a.icon-pencil,
body.handheld .collections-list.key-collections_seen .col:hover .title a.icon-cog {
  display: none;
}

.collections-list .col.preloading {
  display: none;
}

body.development .collections-list .col.preloading {
  opacity: 0.3;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=30);
  filter: alpha(opacity=30);
  display: inline-block;
  zoom: 1;
  *display: inline;
}

.collections-list .col.placeholder .col-inner {
  border: 1px dashed #cfcdcb;
  text-align: center;
  padding: 90px 0;
  position: relative;
  text-decoration: none;
  -ms-box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.collections-list .col.placeholder .col-inner span.text,
.collections-list .col.placeholder .col-inner .icons {
  -ms-transition: color 100ms ease-in;
  -moz-transition: color 100ms ease-in;
  -webkit-transition: color 100ms ease-in;
  transition: color 100ms ease-in;
}

.collections-list .col.placeholder .col-inner {
  overflow: hidden;
  cursor: pointer;
}

.collections-list .col.placeholder .col-inner input {
  position: absolute;
  top: -25%;
  left: 0;
  width: 100%;
  height: 200%;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
}

.collections-list .col.placeholder .col-inner.busy input {
  display: none;
}

.collections-list .col.placeholder span.text:before {
  content: "Click here or drag any type of file to your browser";
}

.collections-list .col.placeholder span.text {
  color: #d9d9d9;
  font-weight: bold;
  display: block;
  margin-bottom: 40px;
  padding: 0 40px;
  font-size: 18px;
  line-height: 18px;
}

.collections-list .col.placeholder.busy span.text {
  color: #eee;
}

.collections-list .col.placeholder .icons i {
  vertical-align: top;
  display: inline-block;
  zoom: 1;
  *display: inline;
  height: 30px;
  padding: 0 5px;
}

.collections-list .col.placeholder .icons i.icon-note-beamed {
  font-size: 24px;
  top: 1px;
  position: relative;
}

.collections-list .col.placeholder .icons i.icon-doc-alt {
  font-size: 27px;
}

.collections-list .col.placeholder .icons i.icon-easel {
  font-size: 28px;
  position: relative;
  top: 2px;
}

.collections-list .col.placeholder .icons i.icon-chart-bar {
  font-size: 28px;
}

.collections-list .col.placeholder .icons i.icon-video {
  font-size: 24px;
}

.collections-list .col.placeholder .icons i.icon-picture {
  font-size: 26px;
}

.collections-list .col.placeholder .icons {
  color: #bfbfbf;
  font-size: 30px;
  line-height: 34px;
  height: 30px;
  vertical-align: top;
}

.collections-list .col.placeholder.busy {
  pointer-events: none;
}

.collections-list .col.placeholder.busy .icons {
  color: #eee;
}

.collections-list .col.placeholder:hover span.text {
  color: #bfbfbf;
}

.collections-list .col.placeholder:hover .icons {
  color: #999;
}

.collections-list .col.placeholder.busy:hover {
  cursor: default;
}

.collections-list .col.placeholder.busy:hover span.text,
.collections-list .col.placeholder.busy:hover .icons {
  color: #eee;
}

.collections-list .placeholder-seen {
  padding: 150px 25px;
  margin: auto;
}

.collections-list .placeholder-seen .title {
  color: #777;
  font-size: 22px;
  font-weight: bold;
}

.collections-list .placeholder-seen p {
  font-size: 16px;
  font-family: "droid-serif";
  color: #acacac;
  font-style: oblique;
  line-height: 18px;
  margin: 5px 0;
}

body.mobile .collections-list .placeholder-seen {
  padding-top: 100px;
  padding-bottom: 0;
}

.collections-list .col.placeholder,
.collections-list .placeholder-seen {
  display: none;
}

.collections-list[count=""] .list {
  display: none;
}

.collections-list[count="0"].key-collections .col.placeholder,
.collections-list[count="1"].key-collections .col.placeholder,
.collections-list[count="2"].key-collections .col.placeholder,
.collections-list[count="3"].key-collections .col.placeholder,
.collections-list[count="4"].key-collections .col.placeholder {
  display: inline-block;
  zoom: 1;
  *display: inline;
}

.collections-list[count="0"].key-collections_seen .placeholder-seen {
  display: block;
}

.collections-list .col .thumbs-wrap {
  margin: 0 10px;
  margin-top: 10px;
  display: block;
  height: 222px;
}

.collections-list .col .thumbs {
  position: relative;
  display: block;
  height: 100%;
  overflow: hidden;
}

.collections-list .col .thumb-item:before {
  font-size: 500%;
}

.collections-list .col .thumb-item.small {
  -ms-background-size: inherit;
  -moz-background-size: inherit;
  -webkit-background-size: inherit;
  background-size: inherit;
}

.collections-list .col .thumb-item.preload {
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
}

.collections-list .col .thumb-item {
  display: block;
  background-position: center;
  background-repeat: no-repeat;
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
  position: absolute;
  top: 0;
  left: 0;
  -ms-background-size: cover;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  -ms-transform: translate3d(0,0,0);
  -moz-transform: translate3d(0,0,0);
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
  -ms-transition: opacity 100ms ease-in, width 100ms ease-in, height 100ms ease-in;
  -moz-transition: opacity 100ms ease-in, width 100ms ease-in, height 100ms ease-in;
  -webkit-transition: opacity 100ms ease-in, width 100ms ease-in, height 100ms ease-in;
  transition: opacity 100ms ease-in, width 100ms ease-in, height 100ms ease-in;
}

.collections-list .thumb-item.has_type:before,
.collections-list .thumb-item.has_type:after {
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  -ms-transition: opacity 100ms ease-in;
  -moz-transition: opacity 100ms ease-in;
  -webkit-transition: opacity 100ms ease-in;
  transition: opacity 100ms ease-in;
}

.collections-list .thumb-item.has_type:before {
  content: '\f30e';
  font-family: 'icons';
  color: rgba(0, 0, 0, .2);
  z-index: -1;
  text-align: center;
  display: block;
  vertical-align: middle;
  line-height: 80px;
  position: absolute;
  height: 80px;
  width: 80px;
  top: 50%;
  margin-top: -40px;
  left: 50%;
  margin-left: -40px;
}

.collections-list .thumb-item.has_icon:before {
  opacity: 0.5;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
  filter: alpha(opacity=50);
}

.collections-list .thumb-item.has_icon:after {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

.collections-list .thumb-item.code:before,
.collections-list .thumb-item.markdown:before,
.collections-list .thumb-item.pdf:before,
.collections-list .thumb-item.doc:before,
.collections-list .thumb-item.unknown:before {
  content: '\e0c1';
}

.collections-list .thumb-item.image:before {
  content: '\f4f7';
}

.collections-list .thumb-item.audio:before {
  content: '\e807';
}

.collections-list .thumb-item.flash:before {
  content: '';
  background: url("https://i.cloudup.com/7CqnziNFX2.png") no-repeat center;
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
  -ms-background-size: 50%;
  -moz-background-size: 50%;
  -webkit-background-size: 50%;
  background-size: 50%;
}

.collections-list .thumb-item.onload:before,
.collections-list .thumb-item.code.loaded:before,
.collections-list .thumb-item.onload:after,
.collections-list .thumb-item.code.loaded:after {
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
}

.collections-list .thumb-item.video:before {
  content: '\25b6';
  color: rgba(255, 255, 255, .7);
  text-shadow: 0 0 1px rgba(0, 0, 0, .3);
  z-index: 10;
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

.collections-list .thumb-item.pdf:after,
.collections-list .thumb-item.doc:after,
.collections-list .thumb-item.unknown:after {
  content: attr(file_ext);
  font-size: 13px;
  position: absolute;
  font-family: arial;
  display: block;
  width: 100%;
  text-align: center;
  top: 50%;
  color: #666;
  font-size: 9px;
}

.collections-list .thumb-item.markdown img {
  display: none;
}

.collections-list .thumb-item.markdown {
  font-size: .5em;
  overflow: hidden;
  color: #454545;
  padding: 5px 10px;
}

.collections-list .thumb-item.code .gist-syntax {
  overflow: hidden;
}

.collections-list .thumb-item.code .gist-syntax .linenos,
.collections-list .thumb-item.code .gist-syntax .code {
  font-size: 8px;
}

.collections-list .thumb-item.code .gist-syntax .linenodiv {
  padding: 5px 0;
}

.collections-list .thumb-item.code {
  font-weight: normal;
  overflow: hidden;
}

.collections-list .gist-syntax,
.collections-list .gist-syntax .code {
  background: transparent;
}

.collections-list .thumbs[count="1"] .thumb-item {
  width: 100%;
  height: 100%;
}

.collections-list .thumbs[count="2"] .thumb-item:nth-child(2) {
  left: 50%;
}

.collections-list .thumbs[count="2"] .thumb-item {
  width: 50%;
  height: 100%;
}

.collections-list .thumbs[count="3"] .thumb-item:nth-child(2) {
  width: 33.4%;
  left: 33.3%;
}

.collections-list .thumbs[count="3"] .thumb-item:nth-child(3) {
  left: 66.7%;
}

.collections-list .thumbs[count="3"] .thumb-item {
  width: 33.3%;
  height: 100%;
}

.collections-list .thumbs[count="4"] .thumb-item:nth-child(3),
.collections-list .thumbs[count="4"] .thumb-item:nth-child(4) {
  top: 50%;
}

.collections-list .thumbs[count="4"] .thumb-item:nth-child(2),
.collections-list .thumbs[count="4"] .thumb-item:nth-child(4) {
  left: 50%;
}

.collections-list .thumbs[count="4"] .thumb-item {
  width: 50%;
  height: 50%;
}

.collections-list .thumbs[count="5"] .thumb-item:nth-child(2) {
  width: 33.4%;
  left: 33.3%;
}

.collections-list .thumbs[count="5"] .thumb-item:nth-child(3) {
  left: 66.7%;
}

.collections-list .thumbs[count="5"] .thumb-item:nth-child(4),
.collections-list .thumbs[count="5"] .thumb-item:nth-child(5) {
  top: 50%;
  width: 50%;
}

.collections-list .thumbs[count="5"] .thumb-item:nth-child(5) {
  left: 50%;
}

.collections-list .thumbs[count="5"] .thumb-item {
  width: 33.3%;
  height: 50%;
}

.collections-list .thumbs[count="6"] .thumb-item:nth-child(2),
.collections-list .thumbs[count="6"] .thumb-item:nth-child(5) {
  left: 33.3%;
  width: 33.4%;
}

.collections-list .thumbs[count="6"] .thumb-item:nth-child(3),
.collections-list .thumbs[count="6"] .thumb-item:nth-child(6) {
  left: 66.7%;
}

.collections-list .thumbs[count="6"] .thumb-item:nth-child(4),
.collections-list .thumbs[count="6"] .thumb-item:nth-child(5),
.collections-list .thumbs[count="6"] .thumb-item:nth-child(6) {
  top: 50%;
}

.collections-list .thumbs[count="6"] .thumb-item {
  width: 33.3%;
  height: 50%;
}

.collections-list .col.has_many .title {
  border-bottom: 1px solid #ececec;
  padding-bottom: 7px;
  -ms-border-bottom-left-radius: 3px;
  -moz-border-bottom-left-radius: 3px;
  -webkit-border-bottom-left-radius: 3px;
  border-bottom-left-radius: 3px;
  -ms-border-bottom-right-radius: 3px;
  -moz-border-bottom-right-radius: 3px;
  -webkit-border-bottom-right-radius: 3px;
  border-bottom-right-radius: 3px;
  -ms-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.03);
  -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.03);
  -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.03);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.03);
}

.collections-list .col.has_two .title {
  border-bottom-color: #fff;
  -ms-box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.collections-list .col.has_many .col-inner:after {
  content: ' ';
  display: block;
  height: 8px;
  margin-top: -5px;
  border-bottom: 1px solid #ececec;
  -ms-border-radius: 6px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  -ms-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.03);
  -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.03);
  -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.03);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.03);
}

.collections-list .col.has_password .title i.icon-lock-1 {
  color: #cf4850;
}

.collections-list .col.loading span.title,
.collections-list .col.loading a.link {
  display: none;
}

.collections-list .more {
  display: none;
}

.collections-list.has_more .more {
  display: block;
}

.collections-list .col.editing .col-inner .icon-pencil {
  display: none !important;
}

.collections-list .col.editing .col-inner .title a.name {
  display: none;
}

.collections-list .col.editing .col-inner .title {
  pointer-events: inherit;
}

.collections-list .col.editing .col-inner input {
  display: inline;
}

.collections-list .col.editing .col-inner {
  background: #f9f9f9;
}

.collections-list .scrollbar-tip {
  position: fixed;
  right: 0;
  left: inherit;
  padding: 0 5px 0 0;
  margin-right: 10px;
  margin-top: -15px;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  -ms-transition: opacity ease-out 150ms;
  -moz-transition: opacity ease-out 150ms;
  -webkit-transition: opacity ease-out 150ms;
  transition: opacity ease-out 150ms;
}

.collections-list .scrollbar-tip .tip-inner {
  background: rgba(0, 0, 0, .5);
}

.collections-list .scrollbar-tip .tip-arrow {
  border-color: rgba(0, 0, 0, .5);
}

.collections-list .scrollbar-tip.shown {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

body.mobile .collections-list .more {
  padding: 20px 0;
}

body.mobile .collections-list .col.placeholder .col-inner {
  padding: 60px 0;
}

body.mobile .collections-list .col .col-inner span.text:before {
  content: "Tap here to add items from your phone";
}

body.tablet .collections-list .col .col-inner span.text:before {
  content: "Tap here to add items from your tablet";
}

@media only screen and (min-width : 320px) and (max-width : 480px),
(max-width : 568px) {
  .collections-list .list {
    -ms-column-count: 1;
    -moz-column-count: 1;
    -webkit-column-count: 1;
    column-count: 1;
  }

  .collections-list .placeholder-seen .title {
    font-size: 18px;
  }

  .collections-list .placeholder-seen p {
    font-size: 16px;
  }
}

@media screen and (max-device-width: 480px) and (orientation: portrait) {
  .collections-list .col .col-inner {
    width: 285px;
  }

  .collections-list .col .title span.name-wrap {
    width: 199px;
  }

  .collections-list .col .thumbs-wrap {
    height: 168px;
  }

  .collections-list .col {
    height: 240px;
    margin: 10px 17px;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  .collections-list .thumb-item.flash:before {
    background-image: url("https:/i.cloudup.com/7CqnziNFX2@2x.png");
    background-size: 50%;
  }
}

.collections-switch {
  display: inline-block;
  zoom: 1;
  *display: inline;
  position: fixed;
  top: 16px;
  left: 50%;
  margin-left: -96px;
  z-index: 100;
}

.collections-switch .switch {
  margin-bottom: -3px;
  background: #e6e2dd;
  height: 32px;
  width: 70px;
  -ms-border-radius: 30px;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  border-radius: 30px;
  -ms-box-shadow: inset 0 1px 2px #bab7b3, 0 1px 0 #fafafa;
  -moz-box-shadow: inset 0 1px 2px #bab7b3, 0 1px 0 #fafafa;
  -webkit-box-shadow: inset 0 1px 2px #bab7b3, 0 1px 0 #fafafa;
  box-shadow: inset 0 1px 2px #bab7b3, 0 1px 0 #fafafa;
}

.collections-switch .switch:before,
.collections-switch .switch:after {
  font-family: 'icons';
  color: #f4f2ee;
  display: block;
  position: absolute;
  font-size: 21px;
  z-index: 1;
  pointer-events: none;
  -webkit-transition: 100ms opacity ease-in;
}

.collections-switch .switch:before {
  content: '\e4ad';
  left: 8px;
  top: 0px;
}

.collections-switch .switch:after {
  content: '\e4ae';
  right: 8px;
  top: 0px;
}

.collections-switch .label {
  color: #4ba0bf;
  font-size: 18px;
  font-weight: bold;
  position: relative;
  top: -7px;
  padding: 0 10px;
  cursor: pointer;
  -ms-transition: 100ms color ease-in;
  -moz-transition: 100ms color ease-in;
  -webkit-transition: 100ms color ease-in;
  transition: 100ms color ease-in;
}

.collections-switch.mine .label.seen,
.collections-switch.seen .label.mine {
  color: #c8c5c1;
  text-shadow: 0 1px 0 #fafafa;
}

.collections-switch .switch-knob {
  background: #f3f3f3;
  border: 1px solid #aca9a4;
  height: 33px;
  width: 33px;
  z-index: 3;
  margin-top: -1px;
  -ms-border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  -ms-box-shadow: 0 1px 2px rgba(0, 0, 0, .3);
  -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .3);
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .3);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .3);
}

.collections-switch .switch-knob:after {
  color: #4ba0bf;
  font-size: 21px;
  left: 5px;
  position: absolute;
  padding-top: 0;
  display: inline-block;
  zoom: 1;
  *display: inline;
  content: '\e801';
  font-family: 'icons';
}

.notice a.resend-email {
  margin-left: 20px;
}

body.onboarding .notice-wrap {
  display: none;
}

:root {
  var-color-main: red;
}

* {
  -webkit-font-smoothing: antialiased;
  cursor: inherit;
  -ms-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -ms-user-drag: inherit;
  -moz-user-drag: inherit;
  -webkit-user-drag: inherit;
  user-drag: inherit;
  -ms-user-select: inherit;
  -moz-user-select: inherit;
  -webkit-user-select: inherit;
  user-select: inherit;
}

body {
  -webkit-user-select: none;
  -ms-user-select: none;
  cursor: default;
  background-color: #fefefe;
  text-align: center;
  min-width: 320px;
  font: normal 14px/1.5 'proxima-nova', 'Helvetica Neue', Arial, Helvetica, sans-serif;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -ms-user-drag: none;
  -moz-user-drag: none;
  -webkit-user-drag: none;
  user-drag: none;
}

body.logged_in,
body.logging_in {
  background-color: #f4f1ed;
}

body ::selection {
  background: rgba(255, 124, 110, 0.45);
}

body ::-moz-selection {
  background: rgba(255, 124, 110, 0.45);
}

body.windows ::selection {
  background: rgba(255, 124, 110, 0.45);
  color: white;
}

body.windows ::-moz-selection {
  background: rgba(255, 124, 110, 0.45);
  color: white;
}

body.windows .buttons {
  text-align: left;
}

body.mac ::selection {
  background: rgba(255, 124, 110, 0.45);
}

body.mac ::-moz-selection {
  background: rgba(255, 124, 110, 0.45);
}

body.mac .buttons {
  text-align: right;
}

.wf-loading {
  visibility: hidden;
}

*[class^='icon-'] {
  -webkit-font-smoothing: antialiased;
}

h1,
h2 {
  font-weight: 700;
}

h3,
h4,
h5,
h6,
a {
  font-weight: 600;
}

p {
  line-height: 1.5;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
}

a {
  cursor: pointer;
  color: #1f7dca;
  font-weight: bold;
}

a:focus {
  outline: none;
}

input[type=submit]:focus,
input[type=button]:focus {
  outline: none;
}

button: :-moz-focus-inner,
;


input[type=button]::-moz-focus-inner,
input[type=submit]::-moz-focus-inner {
  border: 0;
}

.left {
  float: left;
}

.right {
  float: right;
}

.actions {
  background: #2f2660;
  border-left: 1px solid #684D6B;
  border-right: 1px solid #684D6B;
  padding: 10px 25px;
  font-size: 12px;
  color: #fff;
}

.actions a:last-child {
  margin-right: 0;
}

.actions a.active {
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

.actions a {
  margin: 0 10px;
  color: #fff;
  text-decoration: none;
  text-transform: uppercase;
  font-size: 11px;
}

.clearfix:before,
.clearfix:after {
  content: " ";
  display: table;
}

.clearfix:after {
  clear: both;
}

:root {
  var-color-main: #ef6c5e;
}

.color-main {
  background-color: #ef6c5e;
}

.color-yellow {
  background-color: #f2a973;
}

.color-maroon {
  background-color: #910335;
}

.color-purple {
  background-color: #2a233d;
}

.color-blue {
  background-color: #25a1c3;
}

.color-gray {
  background-color: #eeeeee;
}

.color-lighten.color-main {
  background-color: #ff7c6e;
}

.color-lighten.color-yellow {
  background-color: #f2b983;
}

.color-lighten.color-maroon {
  background-color: #a11345;
}

.color-lighten.color-purple {
  background-color: #3a334d;
}

.color-lighten.color-blue {
  background-color: #35b1d3;
}

.color-lighten.color-gray {
  background-color: #f4f4f4;
}

.color-darken.color-main {
  background-color: #df5c4f;
}

.color-darken.color-yellow {
  background-color: #e29963;
}

.color-darken.color-maroon {
  background-color: #810325;
}

.color-darken.color-purple {
  background-color: #1a132d;
}

.color-darken.color-blue {
  background-color: #1591b3;
}

.color-darken.color-gray {
  background-color: #e4e4e4;
}

.color-bg {
  background-color: #f4f1ed;
}

.color-black {
  background-color: #373737;
}

.color-success {
  background-color: #7abf66;
}

.color-warning {
  background-color: #e41d3e;
}

.corpo-container .corpo-about {
  padding: 0 30px;
}

.corpo-container .corpo-about a {
  text-decoration: none;
}

.corpo-container .corpo-about .header h1 {
  max-height: 256px;
  line-height: 256px;
  color: #3a3a3a;
  font-family: 'proxima-nova', "Helvetica Neue", Arial, sans-serif;
  font-style: normal;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  font-size: 54px;
}

.corpo-container .corpo-about .header {
  margin-top: 40px;
}

.corpo-container .corpo-about .body ul.team li .avatar-container:before {
  width: 100%;
  height: 100%;
  line-height: 100px;
  background-color: #25a1c3;
  position: absolute;
  z-index: 100;
  left: 0px;
  top: 0px;
  font-family: 'icons';
  content: '\E80D';
  font-size: 36px;
  color: white;
  font-weight: normal;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  -ms-border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
}

.corpo-container .corpo-about .body ul.team li .avatar-container:hover:before {
  opacity: 0.8;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  filter: alpha(opacity=80);
}

.corpo-container .corpo-about .body ul.team li .avatar-container {
  width: 100px;
  height: 100px;
  margin: 0 auto 6px;
  position: relative;
}

.corpo-container .corpo-about .body ul.team li h5 {
  height: 24px;
  line-height: 24px;
  margin: 0;
  text-transform: uppercase;
  font-weight: 600;
  font-size: 14px;
  color: black;
  letter-spacing: 0.1em;
}

.corpo-container .corpo-about .body ul.team li {
  width: 25%;
  height: 150px;
  margin-bottom: 15px;
  float: left;
}

.corpo-container .corpo-about .body ul.team {
  list-style-type: none;
  margin: 30px auto 0 auto;
  padding: 0;
  max-width: 600px;
  width: 100%;
}

.corpo-container .corpo-about .body .clear {
  clear: both;
}

.corpo-container .corpo-about .body .desc h2 {
  font-size: 20px;
  color: #1a1a1a;
  margin-bottom: 10px;
  -ms-user-select: auto;
  -moz-user-select: auto;
  -webkit-user-select: auto;
  user-select: auto;
}

.corpo-container .corpo-about .body .desc p {
  margin: 0 0 50px 0;
  font-family: droid-serif, Georgia, serif;
  font-size: 20px;
  text-align: left;
  cursor: text;
  color: #111111;
  line-height: 32px;
  -ms-user-select: auto;
  -moz-user-select: auto;
  -webkit-user-select: auto;
  user-select: auto;
}

.corpo-container .corpo-about .body .desc p:last-child {
  margin-bottom: 160px;
}

.corpo-container .corpo-about .body .desc {
  text-align: left;
  font-size: 17px;
  margin-top: 40px;
}

.corpo-container .corpo-about .body {
  max-width: 660px;
  width: 100%;
  margin: 0 auto;
  overflow: hidden;
}

@media only screen and (max-width: 600px) {
  .corpo-container .corpo-about .header h1 {
    max-height: 100px;
    line-height: 100px;
    font-size: 35px;
  }

  .corpo-container .corpo-about .body .desc {
    margin-top: 0;
  }

  .corpo-container .corpo-about .body .desc h2 {
    font-size: 20px;
  }

  .corpo-container .corpo-about .body .desc p {
    font-size: 17px;
    line-height: 23px;
  }

  .corpo-container .corpo-about .body ul.team li .avatar-container:before {
    line-height: 86px;
    font-size: 24px;
  }

  .corpo-container .corpo-about .body ul.team li .avatar-container {
    width: 86px;
    height: 86px;
  }

  .corpo-container .corpo-about .body ul.team li {
    width: 33.333333%;
  }

  .corpo-container .corpo-about .body ul.team {
    margin-top: 40px;
  }
}

@media only screen and (max-width: 480px) {
  .corpo-container .corpo-about .body ul.team li {
    width: 50%;
  }

  .corpo-container .corpo-about .body .desc p:last-child {
    margin-bottom: 100px;
  }
}

html.corporate-page > body {
  background-color: #fefefe;
}

a.automattic-blog-mobile {
  display: none;
  text-decoration: none;
  font-weight: 600;
}

a.automattic-blog-mobile .announcement .automattic-logo {
  display: inline-block;
  zoom: 1;
  *display: inline;
  width: 166px;
  height: 18px;
  background: url("https://s1.cldup.com/corporate/images/automattic-logo.png");
  background-repeat: no-repeat;
  vertical-align: middle;
  position: relative;
  top: -2px;
  margin: 0;
  margin-left: 6px;
  margin-right: 12px;
  -ms-background-size: contain;
  -moz-background-size: contain;
  -webkit-background-size: contain;
  background-size: contain;
}

a.automattic-blog-mobile .announcement span {
  color: #848484;
}

a.automattic-blog-mobile .announcement .icon-right-open {
  float: right;
  font-size: 1.2em;
}

a.automattic-blog-mobile .announcement {
  background-color: #303030;
  color: white;
  font-size: 16px;
  height: 80px;
  line-height: 80px;
  padding: 0 10px;
}

.corpo-container {
  padding: 0;
  margin-top: -50px;
  text-align: center;
}

.corpo-container .header h1 {
  font-size: 54px;
  font-family: 'droid-serif', Georgia, serif;
  font-style: oblique;
  font-weight: 400;
  color: white;
  margin: 0;
}

.corpo-container .header h2 {
  font-weight: 400;
  font-size: 26px;
  height: 40px;
  line-height: 42px;
  margin: 0;
}

.corpo-container a.automattic-blog {
  text-decoration: none;
}

.corpo-container a.automattic-blog:hover .announcement {
  background-color: #EC9D63;
}

.corpo-container .announcement .automattic-logo {
  display: inline-block;
  zoom: 1;
  *display: inline;
  width: 276px;
  height: 30px;
  background: url("https://s1.cldup.com/corporate/images/automattic-logo.png");
  background-repeat: no-repeat;
  vertical-align: middle;
  position: relative;
  top: -2px;
  margin: 0;
  margin-left: 6px;
  margin-right: 12px;
  -ms-background-size: contain;
  -moz-background-size: contain;
  -webkit-background-size: contain;
  background-size: contain;
}

.corpo-container .announcement .icon-right-open {
  float: right;
  font-size: 2em;
}

.corpo-container .announcement {
  display: none;
  background-color: #f1aa75;
  color: white;
  height: 100px;
  margin: 0 -30px;
  font-size: 20px;
  font-weight: 400;
  line-height: 100px;
}

.corpo-container .body {
  background-color: white;
}

body.mobile .corpo-container a.automattic-blog {
  display: none;
}

@media only screen and (max-width: 600px) {
  .corpo-container a.automattic-blog .announcement {
    display: none;
    font-size: 16px;
    height: 80px;
    line-height: 80px;
  }

  .corpo-container a.automattic-blog .big {
    display: none;
  }

  .corpo-container a.automattic-blog .automattic-logo {
    width: 166px;
    height: 18px;
  }

  .corpo-container a.automattic-blog .icon-right-open {
    font-size: 1.2em;
  }

  a.automattic-blog-mobile {
    display: none;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  a.automattic-blog-mobile .announcement .automattic-logo {
    background-image: url("https://s1.cldup.com/corporate/images/automattic-logo@2x.png");
    background-size: contain;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  .corpo-container .announcement .automattic-logo {
    background-image: url("https://s1.cldup.com/corporate/images/automattic-logo@2x.png");
    background-size: contain;
  }
}

#footer.corpo-footer {
  position: relative;
  z-index: 100;
  text-align: center;
  max-width: 800px;
  margin: 0 auto;
  height: 35px;
  line-height: 35px;
}

#footer.corpo-footer a {
  color: #29a3c7;
  font-size: 12px;
  text-decoration: none;
  text-transform: uppercase;
  padding: 0 8px;
  margin: 0 8px;
  letter-spacing: 1.5px;
}

#footer.corpo-footer .links-wrap .links-block {
  background-color: #f7f8f9;
  margin: 0 10px;
  display: inline-block;
  zoom: 1;
  *display: inline;
  padding: 0 15px;
  -ms-border-radius: 17px;
  -moz-border-radius: 17px;
  -webkit-border-radius: 17px;
  border-radius: 17px;
}

#footer.corpo-footer .links-wrap .links-block.dev {
  display: none;
}

#footer.corpo-footer .links-wrap {
  float: left;
}

#footer.corpo-footer .social-menu a:after {
  font-family: 'icons';
}

#footer.corpo-footer .social-menu a.twitter:after {
  content: '\54';
}

#footer.corpo-footer .social-menu a.facebook:after {
  content: '\f300';
}

#footer.corpo-footer .social-menu a {
  padding: 0 4px;
  margin: 0 4px;
  font-size: 14px;
}

#footer.corpo-footer .social-menu {
  display: inline-block;
  zoom: 1;
  *display: inline;
  text-align: right;
  float: right;
  min-width: 100px;
  max-width: 200px;
  width: 100%;
}

@media only screen and (max-width: 850px) {
  #footer.corpo-footer .links-wrap .links-block {
    margin-bottom: 20px;
  }

  #footer.corpo-footer .social-menu {
    text-align: center;
    float: none;
  }
}

.corpo-container .corpo-homepage {
  padding-left: 30px;
  padding-right: 30px;
}

.corpo-container .corpo-homepage .head-wrap .header h1 {
  height: 56px;
  line-height: 56px;
  font-size: 44px;
  font-style: oblique;
  font-weight: 400;
  margin: 15px 10px 0;
  color: #ffecde;
}

.corpo-container .corpo-homepage .head-wrap .header h2 {
  font-size: 22px;
}

.corpo-container .corpo-homepage .head-wrap .header {
  color: rgba(255, 255, 255, 0.9);
  background-color: inherit;
}

.corpo-container .corpo-homepage .head-wrap {
  padding: 60px 0;
  background-color: #ef6c5e;
  margin: 0 -30px;
}

.corpo-container .corpo-homepage .video-placeholder {
  height: 260px;
}

.corpo-container .corpo-homepage .video-placeholder .video-container a.link-box:hover .icon-play::before {
  color: white;
}

.corpo-container .corpo-homepage .video-placeholder .video-container a.link-box:hover {
  opacity: 0.9;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=90);
  filter: alpha(opacity=90);
}

.corpo-container .corpo-homepage .video-placeholder .video-container a.link-box .icon-play:before {
  font-size: 30px;
  margin: 0;
  left: 0px;
  top: 0px;
  display: block;
  text-align: left;
  display: block;
  line-height: 50px;
  color: #ccc;
  -ms-transition: color 100ms ease-in;
  -moz-transition: color 100ms ease-in;
  -webkit-transition: color 100ms ease-in;
  transition: color 100ms ease-in;
}

.corpo-container .corpo-homepage .video-placeholder .video-container a.link-box .icon-play {
  position: absolute;
  font-size: 84px;
  content: '\25b6';
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
  width: 50px;
  height: 50px;
  line-height: 50px;
  left: 50%;
  margin-left: -25px;
  top: 50%;
  margin-top: -25px;
  text-align: center;
  text-decoration: none;
}

.corpo-container .corpo-homepage .video-placeholder .video-container a.link-box {
  width: 423px;
  height: 190px;
  text-decoration: none;
  background-image: url("https://s1.cldup.com/corporate/images/video-thumb.png");
  display: block;
  background-color: rgba(0, 0, 0, 0.1);
  position: relative;
  -ms-box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.4) inset;
  -moz-box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.4) inset;
  -webkit-box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.4) inset;
  box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.4) inset;
  -ms-transition: opacity 100ms ease-in;
  -moz-transition: opacity 100ms ease-in;
  -webkit-transition: opacity 100ms ease-in;
  transition: opacity 100ms ease-in;
}

.corpo-container .corpo-homepage .video-placeholder .video-container {
  width: auto;
  display: inline-block;
  zoom: 1;
  *display: inline;
  margin: 0 auto;
  position: relative;
  top: 22px;
  background-color: #f5f2ee;
  padding: 9px;
  -ms-border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
}

.corpo-container .corpo-homepage .signup-notification-form {
  height: 80px;
  margin: 20px 0 5px 0;
}

.corpo-container .corpo-homepage .signup-notification-form .button:hover {
  border: 1px solid white;
}

.corpo-container .corpo-homepage .signup-notification-form .button {
  margin: 14px 10px 0;
  height: 54px;
  line-height: 54px;
  border: 1px solid #f2a973;
  background-color: transparent;
  text-shadow: none;
  font-size: 20px;
  font-weight: 300;
  letter-spacing: 0;
  text-transform: none;
  padding: 0 30px;
  -ms-border-radius: 30px;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  border-radius: 30px;
  -ms-box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  -ms-transition: all 0.1s ease-in;
  -moz-transition: all 0.1s ease-in;
  -webkit-transition: all 0.1s ease-in;
  transition: all 0.1s ease-in;
}

.corpo-container .corpo-homepage .signup-notification-form .button.icon-play:before {
  cursor: inherit;
  position: relative;
  top: 4px;
  left: 2px;
  font-size: 30px;
  margin: 0;
}

.corpo-container .corpo-homepage .signup-notification-form .button.icon-play {
  padding: 0 12px;
}

.corpo-container .corpo-homepage .body {
  padding-top: 96px;
}

.corpo-container .corpo-homepage .body .body-wrapper {
  max-width: 960px;
  margin: 0 auto;
}

.corpo-container .corpo-homepage .invite-only-info {
  border-top: 1px solid rgb(223, 228, 234);
  position: relativee;
}

.corpo-container .corpo-homepage .invite-only-info h2 span {
  color: rgb(37, 161, 195);
}

.corpo-container .corpo-homepage .invite-only-info h2 {
  background-color: white;
  font-size: 13px;
  font-weight: bold;
  height: 40px;
  letter-spacing: 2px;
  line-height: 42px;
  margin: 0px auto;
  margin-bottom: 5px;
  max-width: 350px;
  position: relative;
  top: -20px;
  text-transform: uppercase;
}

.corpo-container .corpo-homepage .invite-only-info p:last-child {
  margin-bottom: 60px;
}

.corpo-container .corpo-homepage .invite-only-info p {
  font-size: 18px;
  line-height: 22px;
  margin-bottom: 40px;
}

.corpo-container .corpo-homepage .invite-only-info .small a {
  color: #1e1e1e;
  font-weight: bold;
  text-decoration: none;
}

.corpo-container .corpo-homepage .invite-only-info .small {
  font-size: 14px;
}

.corpo-container .corpo-homepage .invite-only-info .msg.sending {
  display: none;
}

.corpo-container .corpo-homepage .invite-only-info form {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  max-width: 400px;
  margin: 0 auto 25px;
  -ms-flex-direction: row;
  -moz-flex-direction: row;
  -webkit-flex-direction: row;
  flex-direction: row;
}

.corpo-container .corpo-homepage .invite-only-info input {
  margin: 0;
  -ms-flex: 1;
  -moz-flex: 1;
  -webkit-flex: 1;
  flex: 1;
}

.corpo-container .corpo-homepage .invite-only-info button {
  height: 44px;
  margin-left: 20px;
  -ms-border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

.corpo-container .corpo-homepage .why-use-it {
  border-top: 1px solid #dfe4ea;
  height: 304px;
  color: #2f353f;
}

.corpo-container .corpo-homepage .why-use-it h2 span {
  color: #25a1c3;
}

.corpo-container .corpo-homepage .why-use-it h2 {
  font-weight: bold;
  text-transform: uppercase;
  font-size: 13px;
  letter-spacing: 2px;
  height: 40px;
  line-height: 42px;
  position: relative;
  top: -20px;
  max-width: 400px;
  background-color: white;
  margin: 0 auto;
}

.corpo-container .corpo-homepage .why-use-it .media a.icon:hover {
  color: #1f252f;
}

.corpo-container .corpo-homepage .why-use-it .media a.icon:before {
  font-family: 'icons';
  font-size: 27px;
}

.corpo-container .corpo-homepage .why-use-it .media a.icon {
  margin-top: 50px;
  padding: 10px;
  display: inline-block;
  zoom: 1;
  *display: inline;
  color: rgba(31, 37, 47, 0.85);
  text-decoration: none;
  font-weight: normal;
  -ms-transition: color 150ms ease-in;
  -moz-transition: color 150ms ease-in;
  -webkit-transition: color 150ms ease-in;
  transition: color 150ms ease-in;
}

.corpo-container .corpo-homepage .why-use-it .media span {
  font-size: 13px;
  letter-spacing: 1px;
  text-transform: uppercase;
  display: block;
  width: 100%;
  font-weight: 700;
  position: absolute;
  bottom: 0px;
}

.corpo-container .corpo-homepage .why-use-it .media .tip-ph {
  display: none;
}

.corpo-container .corpo-homepage .why-use-it .media.media-video .icon:before {
  content: '\f3ac';
}

.corpo-container .corpo-homepage .why-use-it .media.media-picture .icon:before {
  content: '\f304';
}

.corpo-container .corpo-homepage .why-use-it .media.media-music .icon:before {
  content: '\266a';
}

.corpo-container .corpo-homepage .why-use-it .media.media-document .icon:before {
  content: '\f0f6';
}

.corpo-container .corpo-homepage .why-use-it .media.media-url .icon:before {
  content: '\f30e';
}

.corpo-container .corpo-homepage .why-use-it .media {
  max-width: 155px;
  width: 20%;
  height: 140px;
  display: inline-block;
  zoom: 1;
  *display: inline;
  vertical-align: top;
  position: relative;
  text-align: center;
}

.corpo-container .corpo-homepage .block.feature-block {
  max-width: 800px;
  width: 100%;
  margin: 0 auto 120px;
}

.corpo-container .corpo-homepage .block.feature-block .description,
.corpo-container .corpo-homepage .block.feature-block .picture {
  display: inline-block;
  zoom: 1;
  *display: inline;
  vertical-align: middle;
}

.corpo-container .corpo-homepage .block.feature-block .description h1,
.corpo-container .corpo-homepage .block.feature-block .description p {
  vertical-align: middle;
  text-align: left;
}

.corpo-container .corpo-homepage .block.feature-block .description h1 {
  margin: 0px;
  color: #1e1e1e;
  font-weight: 600;
}

.corpo-container .corpo-homepage .block.feature-block .description p {
  margin-top: 8px;
  line-height: 22px;
  font-size: 18px;
  color: #5c5c5c;
}

.corpo-container .corpo-homepage .block.feature-block .description {
  width: auto;
}

.corpo-container .corpo-homepage .block.feature-block .picture {
  background-repeat: no-repeat;
  background-position: left center;
  background-color: transparent;
  width: 100%;
  -ms-background-size: 100% auto;
  -moz-background-size: 100% auto;
  -webkit-background-size: 100% auto;
  background-size: 100% auto;
}

.corpo-container .corpo-homepage .block.feature-block.left-orientation .description {
  margin-right: 14%;
}

.corpo-container .corpo-homepage .block.feature-block.right-orientation .description {
  margin-left: 14%;
}

.corpo-container .corpo-homepage .block.feature-block.simple-as-drag-and-drop .description {
  width: 43%;
}

.corpo-container .corpo-homepage .block.feature-block.simple-as-drag-and-drop .picture .drag-image {
  background-repeat: no-repeat;
  background-position: left top;
  background-color: transparent;
  background-image: url("https://s1.cldup.com/corporate/images/drag-image.png");
  max-width: 78px;
  width: 25%;
  height: 85px;
  position: absolute;
  left: -40px;
  bottom: 80px;
  -ms-background-size: 100% auto;
  -moz-background-size: 100% auto;
  -webkit-background-size: 100% auto;
  background-size: 100% auto;
}

.corpo-container .corpo-homepage .block.feature-block.simple-as-drag-and-drop .picture {
  background-image: url("https://s1.cldup.com/corporate/images/drop-anywhere.png");
  width: 43%;
  max-width: 340px;
  height: 184px;
  position: relative;
}

.corpo-container .corpo-homepage .block.feature-block.the-fastener .description h1:before {
  content: "The fastest sharing experience";
}

.corpo-container .corpo-homepage .block.feature-block.the-fastener .description {
  width: 55%;
}

.corpo-container .corpo-homepage .block.feature-block.the-fastener .picture {
  background-image: url("https://s1.cldup.com/corporate/images/fastener.png");
  width: 31%;
  max-width: 243px;
  height: 243px;
}

.corpo-container .corpo-homepage .block.feature-block.one-click .description {
  width: 30%;
}

.corpo-container .corpo-homepage .block.feature-block.one-click .picture {
  background-image: url("https://s1.cldup.com/corporate/images/one-click.png");
  max-width: 438px;
  height: 222px;
}

.corpo-container .corpo-homepage .block.free-block {
  margin: 0 auto 120px;
  border: 1px solid #d3d3d3;
  background-color: #fbfbfb;
  position: relative;
  max-width: 800px;
  -ms-border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

.corpo-container .corpo-homepage .block.free-block .label:before {
  width: 175px;
  height: 175px;
  display: block;
  content: 'FREE';
  background-color: #25a1c3;
  position: absolute;
  right: 34px;
  bottom: 37px;
  z-index: 10;
  -ms-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.corpo-container .corpo-homepage .block.free-block .label:after {
  width: 200px;
  height: 200px;
  display: block;
  content: ' ';
  position: absolute;
  left: 0;
  top: 0;
  z-index: 0;
  -ms-box-shadow: 8px 8px 0 #1581a3 inset;
  -moz-box-shadow: 8px 8px 0 #1581a3 inset;
  -webkit-box-shadow: 8px 8px 0 #1581a3 inset;
  box-shadow: 8px 8px 0 #1581a3 inset;
}

.corpo-container .corpo-homepage .block.free-block .label {
  width: 123px;
  height: 123px;
  position: absolute;
  left: -8px;
  top: -8px;
  overflow: hidden;
  line-height: 300px;
  color: rgba(0, 0, 0, 0.3);
  font-weight: bold;
  font-size: 24px;
  -ms-border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -ms-border-top-left-radius: 5px;
  -moz-border-top-left-radius: 5px;
  -webkit-border-top-left-radius: 5px;
  border-top-left-radius: 5px;
}

.corpo-container .corpo-homepage .block.free-block .free-block-container h1 {
  color: #1e1e1e;
  margin: 0;
  font-size: 36px;
}

.corpo-container .corpo-homepage .block.free-block .free-block-container p {
  font-size: 17px;
  color: #5c5c5c;
  line-height: 33px;
  margin: 0;
}

.corpo-container .corpo-homepage .block.free-block .free-block-container {
  max-width: 645px;
  margin: 0 auto;
  padding: 40px 0;
  text-align: left;
}

.tip .tip-inner.media-tip {
  font-size: 13px;
  width: 170px;
  padding: 15px 10px;
}

@media only screen and (max-width: 850px) {
  .corpo-container .corpo-homepage .head-wrap .header h1 {
    font-size: 32px;
    margin-top: 15px;
  }

  .corpo-container .corpo-homepage .head-wrap .header h2 {
    font-size: 20px;
    line-height: 22px;
    text-align: center;
    margin: 0 auto;
    margin-bottom: 30px;
    max-width: 300px;
    width: 100%;
  }

  .corpo-container .corpo-homepage .video-placeholder .video-container a.link-box span.icon-play {
    width: 35px;
    height: 45px;
    font-size: 60px;
    margin-left: -12px;
    margin-top: -25px;
  }

  .corpo-container .corpo-homepage .video-placeholder .video-container a.link-box {
    background-image: url("https://s1.cldup.com/corporate/images/mobile/video-thumb.png");
    width: 100px;
    height: 100px;
    -ms-background-size: 100px 100px;
    -moz-background-size: 100px 100px;
    -webkit-background-size: 100px 100px;
    background-size: 100px 100px;
    -ms-border-radius: 60px;
    -moz-border-radius: 60px;
    -webkit-border-radius: 60px;
    border-radius: 60px;
    -ms-box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
  }

  .corpo-container .corpo-homepage .video-placeholder .video-container {
    padding: 5px;
    background-color: rgba(255, 255, 255, 0.85);
    -ms-border-radius: 60px;
    -moz-border-radius: 60px;
    -webkit-border-radius: 60px;
    border-radius: 60px;
    -ms-box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
  }

  .corpo-container .corpo-homepage .video-placeholder {
    height: 158px;
  }

  .corpo-container .corpo-homepage .signup-notification-form form p span.error {
    margin-right: 60px;
    bottom: -20px;
  }

  .corpo-container .corpo-homepage .signup-notification-form form p input,
  .corpo-container .corpo-homepage .signup-notification-form form p button.orange {
    position: absolute;
    height: 48px;
  }

  .corpo-container .corpo-homepage .signup-notification-form form p input {
    max-width: 252px;
    width: 100%;
    left: 8px;
  }

  .corpo-container .corpo-homepage .signup-notification-form form p button.orange:before {
    font-family: 'icons';
    content: '\2713';
    font-size: 20px;
    line-height: 48px;
    margin-left: -2px;
  }

  .corpo-container .corpo-homepage .signup-notification-form form p button.orange:after {
    display: none;
  }

  .corpo-container .corpo-homepage .signup-notification-form form p button.orange {
    width: 52px;
    right: 8px;
  }

  .corpo-container .corpo-homepage .signup-notification-form form p {
    max-width: 320px;
  }

  .corpo-container .corpo-homepage .signup-notification-form form {
    padding-top: 22px;
    margin: 0 auto;
  }

  .corpo-container .corpo-homepage .signup-notification-form {
    height: 90px;
  }

  .corpo-container .corpo-homepage .body .body-wrapper .invite-only-info {
    border-top: none;
  }

  .corpo-container .corpo-homepage .body .body-wrapper .why-use-it h2 {
    margin-bottom: 5px;
    font-size: 12px;
  }

  .corpo-container .corpo-homepage .body .body-wrapper .why-use-it .media.media-music {
    display: none;
  }

  .corpo-container .corpo-homepage .body .body-wrapper .why-use-it .media a.icon {
    margin-top: 13px;
    font-weight: normal;
  }

  .corpo-container .corpo-homepage .body .body-wrapper .why-use-it .media {
    width: 50%;
    max-width: 181px;
    height: 94px;
  }

  .corpo-container .corpo-homepage .body .body-wrapper .why-use-it {
    border-top: none;
  }

  .corpo-container .corpo-homepage .body {
    padding-top: 68px;
  }

  .corpo-container .corpo-homepage .block.why-use-it {
    height: 250px;
    margin-bottom: 70px;
  }

  .corpo-container .corpo-homepage .block.feature-block.left-orientation .description h1,
  .corpo-container .corpo-homepage .block.feature-block.right-orientation .description h1 {
    font-size: 20px;
  }

  .corpo-container .corpo-homepage .block.feature-block.left-orientation .description p,
  .corpo-container .corpo-homepage .block.feature-block.right-orientation .description p {
    font-size: 16px;
  }

  .corpo-container .corpo-homepage .block.feature-block.left-orientation .description,
  .corpo-container .corpo-homepage .block.feature-block.right-orientation .description {
    width: 100%;
    margin: 0;
  }

  .corpo-container .corpo-homepage .block.feature-block .picture {
    -ms-background-size: auto;
    -moz-background-size: auto;
    -webkit-background-size: auto;
    background-size: auto;
  }

  .corpo-container .corpo-homepage .block.feature-block.simple-as-drag-and-drop .picture .drag-image {
    left: 10px;
    bottom: -10px;
    background-image: url("https://s1.cldup.com/corporate/images/mobile/drag-image.png");
  }

  .corpo-container .corpo-homepage .block.feature-block.simple-as-drag-and-drop .picture {
    width: 100%;
    margin: 20px auto 0;
    background-image: url("https://s1.cldup.com/corporate/images/mobile/drop-anywhere.png");
  }

  .corpo-container .corpo-homepage .block.feature-block.the-fastener .description h1:before {
    content: "The fastest way to share";
  }

  .corpo-container .corpo-homepage .block.feature-block.the-fastener .picture {
    width: 100%;
    position: absolute;
    left: 50%;
    margin-left: -105px;
    bottom: 0;
    background-image: url("https://s1.cldup.com/corporate/images/mobile/fastener.png");
  }

  .corpo-container .corpo-homepage .block.feature-block.the-fastener {
    position: relative;
    padding-bottom: 250px;
  }

  .corpo-container .corpo-homepage .block.feature-block.one-click {
    margin-bottom: 40px;
  }

  .corpo-container .corpo-homepage .block.feature-block {
    margin-bottom: 70px;
    max-width: 600px;
  }

  .corpo-container .corpo-homepage .block.free-block .label {
    display: none;
  }

  .corpo-container .corpo-homepage .block.free-block .free-block-container h1 {
    font-size: 24px;
    line-height: 24px;
  }

  .corpo-container .corpo-homepage .block.free-block .free-block-container p span.main-free-feature {
    display: inline;
  }

  .corpo-container .corpo-homepage .block.free-block .free-block-container p span {
    display: none;
  }

  .corpo-container .corpo-homepage .block.free-block .free-block-container p {
    margin-top: 30px;
    line-height: 22px;
  }

  .corpo-container .corpo-homepage .block.free-block .free-block-container {
    max-width: 260px;
    padding: 40px 0 20px;
    text-align: center;
  }

  .corpo-container .corpo-homepage .block.free-block {
    border: none;
    border-top: 1px solid #d3d3d3;
    border-bottom: 1px solid #d3d3d3;
    background-color: #fbfbfb;
    margin: 0 -30px 40px -30px;
    max-width: 850px;
  }
}

@media only screen and (max-width: 600px) {
  .corpo-container .corpo-homepage .block.feature-block.simple-as-drag-and-drop .picture .drag-image {
    left: 10px;
    bottom: -10px;
    background-image: url("https://s1.cldup.com/corporate/images/mobile/drag-image.png");
  }

  .corpo-container .corpo-homepage .block.feature-block.simple-as-drag-and-drop .picture {
    width: 261px;
    margin: 20px auto 0;
    height: 185px;
    background-image: url("https://s1.cldup.com/corporate/images/mobile/drop-anywhere.png");
  }

  .corpo-container .corpo-homepage .block.feature-block.the-fastener .picture {
    min-width: 210px;
    height: 210px;
    position: absolute;
    left: 50%;
    margin-left: -105px;
    bottom: 0;
    background-image: url("https://s1.cldup.com/corporate/images/mobile/fastener.png");
  }

  .corpo-container .corpo-homepage .block.feature-block.one-click .picture {
    max-width: 260px;
    background-image: url("https://s1.cldup.com/corporate/images/mobile/one-click.png");
  }
}

@media only screen and (max-width: 600px) and (-webkit-min-device-pixel-ratio: 1.5) {
  .corpo-container .corpo-homepage .video-placeholder .video-container a {
    background-image: url("https://s1.cldup.com/corporate/images/mobile/video-thumb-2x.png") !important;
  }
}

@media only screen and (min-width: 600px) {
  .corpo-container .corpo-homepage .signup-notification-form form p button.orange:before {
    content: 'JOIN';
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  .corpo-container .corpo-homepage .video-placeholder .video-container a.link-box {
    background-image: url("https://s1.cldup.com/corporate/images/video-thumb@2x.png");
    background-size: contain;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  .corpo-container .corpo-homepage .block.feature-block.simple-as-drag-and-drop .picture .drag-image {
    background-image: url("https://s1.cldup.com/corporate/images/drag-image@2x.png");
    background-size: 100% auto;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  .corpo-container .corpo-homepage .block.feature-block.simple-as-drag-and-drop .picture {
    background-image: url("https://s1.cldup.com/corporate/images/drop-anywhere@2x.png");
    background-size: contain;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  .corpo-container .corpo-homepage .block.feature-block.the-fastener .picture {
    background-image: url("https://s1.cldup.com/corporate/images/fastener@2x.png");
    background-size: contain;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  .corpo-container .corpo-homepage .block.feature-block.one-click .picture {
    background-image: url("https://s1.cldup.com/corporate/images/one-click@2x.png");
    background-size: contain;
  }
}

.create-button {
  background-color: #4ba0bf;
  position: relative;
  font-weight: 500;
  font-size: 45px;
  border: none;
  outline: none;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  height: 56px;
  width: 56px;
  padding-right: 14px;
  padding-bottom: 9px;
  -ms-border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  -ms-box-shadow: 0 0 4px rgba(0, 0, 0, .14),0 4px 8px rgba(0, 0, 0, .28);
  -moz-box-shadow: 0 0 4px rgba(0, 0, 0, .14),0 4px 8px rgba(0, 0, 0, .28);
  -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, .14),0 4px 8px rgba(0, 0, 0, .28);
  box-shadow: 0 0 4px rgba(0, 0, 0, .14),0 4px 8px rgba(0, 0, 0, .28);
}

.create-button:hover:after {
  width: 100px;
  position: absolute;
  content: attr(data-title);
  bottom: 10px;
  right: 70px;
  background-color: rgba(242, 169, 115, 0.96);
  color: #fff;
  padding: 8px 10px;
  text-align: center;
  font: normal 400 12px "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0;
  -ms-border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}

.dashboard {
  max-width: 1200px;
  margin: auto;
}

.create {
  position: fixed;
  right: 25px;
  bottom: 25px;
}

@media only screen and (max-width: 768px) {
  .create {
    right: 20px;
    bottom: 30px;
  }
}

.delete-account-dialog form .msg-placeholder {
  display: none;
}

.delete-account-dialog form p strong {
  color: #373737;
}

.delete-account-dialog form p .error {
  top: 40px;
}

.delete-account-dialog form .buttons a {
  margin-right: 10px;
}

.dialog-overlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2000;
  width: 100%;
  height: 100%;
  display: table;
}

.dialog-overlay > .wrap {
  display: table-cell;
  vertical-align: middle;
  position: static;
  margin: auto;
}

.dialog-overlay > .wrap > .inner {
  padding: 0 20px;
  position: relative;
  display: inline-block;
  zoom: 1;
  *display: inline;
}

.dialog-overlay > .wrap > .inner > .close-button:hover {
  background-color: #ccc;
}

.dialog-overlay > .wrap > .inner > .close-button:before {
  font-family: 'icons';
  color: #fff;
  content: '\2715';
}

.dialog-overlay > .wrap > .inner > .close-button {
  position: absolute;
  top: 10px;
  right: 30px;
  width: 20px;
  height: 20px;
  background: #dfdfdf;
  text-decoration: none;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-content: center;
  justify-content: center;
  -ms-border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
}

.dialog-overlay.modal {
  background: rgba(0, 0, 0, .7);
  z-index: 400;
}

.dialog {
  max-width: 340px;
  min-width: 260px;
  margin: auto;
}

body.mobile .dialog {
  max-width: 280px;
  min-width: 240px;
  font-size: 85%;
  height: 100%;
  max-height: 440px;
}

.dialog > .head {
  background: #eef1f2;
  padding: 25px 20px 25px;
  border-bottom: 1px solid #e5e5e5;
  -ms-border-top-left-radius: 6px;
  -moz-border-top-left-radius: 6px;
  -webkit-border-top-left-radius: 6px;
  border-top-left-radius: 6px;
  -ms-border-top-right-radius: 6px;
  -moz-border-top-right-radius: 6px;
  -webkit-border-top-right-radius: 6px;
  border-top-right-radius: 6px;
}

.dialog > .head h1 {
  font-size: 22px;
  margin: 10px 0 2px 0;
  line-height: 24px;
  color: #6e6e6e;
}

.dialog > .head h2 {
  font-size: 14px;
  color: #909292;
  font-weight: normal;
  margin: 0;
  font-family: "droid-serif";
  font-style: oblique;
  text-overflow: ellipsis;
  overflow: hidden;
}

.dialog > .body {
  background: #fff;
  padding: 12px 20px;
  -ms-border-bottom-left-radius: 6px;
  -moz-border-bottom-left-radius: 6px;
  -webkit-border-bottom-left-radius: 6px;
  border-bottom-left-radius: 6px;
  -ms-border-bottom-right-radius: 6px;
  -moz-border-bottom-right-radius: 6px;
  -webkit-border-bottom-right-radius: 6px;
  border-bottom-right-radius: 6px;
}

.dialog > .body form p {
  text-align: left;
}

.dialog > .body form p label {
  letter-spacing: 0;
}

.dialog > .body form p input,
.dialog > .body form p select {
  margin-top: 0;
  margin-bottom: 10px;
}

.download-block > h1 {
  margin: 0;
  line-height: 50px;
  color: #25a1c3;
  font-weight: 600;
}

.download-block > h2 {
  font-size: 22px;
  color: #303030;
  line-height: 25px;
  font-size: 1.2em;
  font-weight: 600;
  text-shadow: 0 1px white;
  text-align: left;
  margin-bottom: 20px;
}

.download-block > .download {
  border: 1px solid #e0e2e1;
  display: block;
  margin-top: 30px;
  margin-bottom: 30px;
  padding: 8px;
  position: relative;
  text-decoration: none;
  -ms-border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}

.download-block > .download > i {
  color: #221e1f;
  text-align: center;
  display: table-cell;
  font-size: 2.5em;
  padding: 0;
  margin: 0;
  vertical-align: middle;
  width: 70px;
}

.download-block > .download.mac > i {
  color: #221e1f;
  padding-top: 2px;
}

.download-block > .download.win > i {
  color: #12cefd;
  font-size: 2.2em;
  padding-top: 7px;
  padding-right: 15px;
}

.download-block > .download > .info {
  display: table-cell;
  text-align: left;
}

.download-block > .download > .info > h3 {
  color: #1a92b2;
  margin: 0;
}

.download-block > .download > .info > p {
  color: #666;
  margin: 0;
  font-size: 14px;
}

.download-block > a:hover {
  border: 1px solid rgba(37, 161, 195, .75);
  background-color: #fcfcfc;
}

@media only screen and (max-width: 600px) {
  .download-block > h1 {
    font-size: 22px;
  }

  .download-block p {
    margin: 0;
    font-size: 15px;
    line-height: 1.3;
  }

  .download-block > .download > .info > h3 {
    font-size: 12px;
  }

  .download-block > .download > i {
    width: 50px;
    font-size: 25px;
  }

  .download-block > .download.win > i {
    font-size: 22px;
  }
}

@media only screen and (max-height: 600px) {
  .download-block .hide-in-short-view {
    display: none;
  }
}

#download {
  max-width: 500px;
  height: auto;
  text-align: center;
}

#download > .top {
  background-color: white;
  padding: 60px;
}

#download > .bottom {
  border-top: 1px solid #e0e2e1;
  background-color: #f8f8f8;
  position: relative;
  padding: 14px;
  -ms-border-radius: 0 0 3px 3px;
  -moz-border-radius: 0 0 3px 3px;
  -webkit-border-radius: 0 0 3px 3px;
  border-radius: 0 0 3px 3px;
}

@media only screen and (max-width: 600px) {
  #download {
    max-width: 100%;
    border: 0;
    -ms-border-radius: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
  }

  #download > .top {
    padding: 30px;
  }
}

#drop-anywhere {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, .85);
  font-size: 20px;
  z-index: 1000000;
  color: #e0e0e0;
  display: none;
}

#drop-anywhere.show {
  display: block;
}

#drop-anywhere:before {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-left: -150px;
  margin-top: -50px;
  content: 'Drop anywhere to upload!';
  background: rgba(0, 0, 0, .5);
  padding: 12px 30px;
  border: 1px solid rgba(255, 255, 255, .12);
  -ms-border-radius: 30px;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  border-radius: 30px;
  -ms-box-shadow: inset 0 0 5px rgba(0, 0, 0, .8);
  -moz-box-shadow: inset 0 0 5px rgba(0, 0, 0, .8);
  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, .8);
  box-shadow: inset 0 0 5px rgba(0, 0, 0, .8);
}

body.collection #drop-anywhere {
  background: rgba(0, 0, 0, .70);
}

.menu {
  text-align: center;
  z-index: 300;
  line-height: 16px;
  margin-left: -60px;
  min-width: 120px;
  position: fixed;
  top: -9999px;
  left: -9999px;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  -ms-transition: opacity ease-out 100ms, -ms-transform ease-out 100ms;
  -moz-transition: opacity ease-out 100ms, -moz-transform ease-out 100ms;
  -webkit-transition: opacity ease-out 100ms, -webkit-transform ease-out 100ms;
  transition: opacity ease-out 100ms, -ms-transform ease-out 100ms;
  pointer-events: none;
  -ms-transition: opacity ease-out 100ms, transform ease-out 100ms;
  -moz-transition: opacity ease-out 100ms, transform ease-out 100ms;
  -webkit-transition: opacity ease-out 100ms, transform ease-out 100ms;
  transition: opacity ease-out 100ms, transform ease-out 100ms;
  -ms-transition: opacity ease-out 100ms, -webkit-transform ease-out 100ms;
  -moz-transition: opacity ease-out 100ms, -webkit-transform ease-out 100ms;
  -webkit-transition: opacity ease-out 100ms, -webkit-transform ease-out 100ms;
  transition: opacity ease-out 100ms, -webkit-transform ease-out 100ms;
}

.menu.shown,
.menu.menu-mode-below.shown {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
  pointer-events: all;
  -ms-transform: translate3d(0, 15px, 0);
  -moz-transform: translate3d(0, 15px, 0);
  -webkit-transform: translate3d(0, 15px, 0);
  transform: translate3d(0, 15px, 0);
}

.menu.menu-mode-above.shown {
  -ms-transform: translate3d(0, -15px, 0);
  -moz-transform: translate3d(0, -15px, 0);
  -webkit-transform: translate3d(0, -15px, 0);
  transform: translate3d(0, -15px, 0);
}

body.firefox .menu {
  -ms-transition: opacity ease-out 100ms, margin-top ease-out 100ms;
  -moz-transition: opacity ease-out 100ms, margin-top ease-out 100ms;
  -webkit-transition: opacity ease-out 100ms, margin-top ease-out 100ms;
  transition: opacity ease-out 100ms, margin-top ease-out 100ms;
}

body.firefox .menu.shown,
body.firefox .menu.menu-mode-below.shown {
  -moz-transform: none;
  margin-top: 15px;
}

body.firefox .menu.menu-mode-above.shown {
  margin-top: -15px;
}

.menu .arrow,
.menu.menu-mode-above .arrow,
.menu.menu-mode-below .arrow {
  width: 0;
  height: 0;
  display: inline-block;
  zoom: 1;
  *display: inline;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  position: absolute;
  left: 50%;
  margin-left: -6px;
}

.menu.menu-mode-below .arrow {
  border-bottom: 6px solid #ff5850;
  margin-bottom: -4px;
  top: -6px;
}

.menu.menu-mode-above .arrow {
  border-top: 6px solid #ff5850;
  margin-top: -4px;
  bottom: -6px;
}

.menu.light .arrow {
  border-bottom-color: #f8f8f8;
}

.menu ul {
  margin: 0;
  padding: 0;
}

.menu li {
  list-style-type: none;
  display: block;
  font-size: 12px;
  text-transform: uppercase;
  text-align: left;
}

.menu li a {
  padding: 13px 15px;
  display: block;
  text-decoration: none;
  color: #fff;
  border-top: 1px solid #ff5850;
  border-bottom: 1px solid #ff5850;
  background: #ff5850;
}

.menu.light li a {
  color: #25a1c3;
  border-top-color: #f8f8f8;
  border-bottom-color: #f8f8f8;
  background: #f8f8f8;
}

.menu li {
  position: relative;
}

.menu li a:hover,
.menu li a.hover {
  background: #d9322b;
  border-top-color: #b82c25;
  border-bottom-color: #ff746c;
}

.menu.light li a:hover,
.menu.light li a.hover {
  border-top-color: #e1e1e1;
  border-bottom-color: #ffffff;
  background: #f2f2f2;
}

.menu li:first-child a {
  border-top-width: 0;
  -ms-border-radius: top 3px;
  -moz-border-radius: top 3px;
  -webkit-border-radius: top 3px;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}

.menu li:last-child a {
  border-bottom-width: 0;
  -ms-border-radius: bottom 3px;
  -moz-border-radius: bottom 3px;
  -webkit-border-radius: bottom 3px;
  border-bottom-left-radius: 3px;
  border-bottom-right-radius: 3px;
}

.exif {
  opacity: 0.9;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=90);
  filter: alpha(opacity=90);
  color: white;
  text-align: center;
  padding: 15px 0;
}

.exif table tr.taken td,
.exif table tr.camera td,
.exif table tr.lens td {
  text-transform: capitalize;
}

.exif table td:first-child {
  width: 100px;
  font-weight: normal;
  color: rgba(255, 255, 255, .5);
  text-transform: capitalize;
}

.exif table td:last-child {
  text-transform: lowercase;
}

.exif table td {
  padding: 2px;
}

.exif table {
  margin: 15px auto 20px auto;
  text-align: left;
}

.exif table + table {
  display: none;
}

body.mobile .exif {
  font-size: 75%;
}

#faq-container {
  text-align: left;
  padding-left: 30px;
  padding-right: 30px;
  padding-bottom: 40px;
}

#faq-container #faq p {
  font-size: 14px;
  color: #222222;
}

#faq-container #faq {
  margin: 0 auto;
  max-width: 600px;
  width: 100%;
  -ms-user-select: auto;
  -moz-user-select: auto;
  -webkit-user-select: auto;
  user-select: auto;
}

.dialog.feedback-dialog {
  display: inline-block;
  zoom: 1;
  *display: inline;
  min-width: 320px;
  width: auto;
}

.dialog.feedback-dialog p {
  text-align: left;
}

.dialog.feedback-dialog textarea {
  height: 150px;
}

#footer {
  position: relative;
  z-index: 100;
  text-align: center;
  max-width: 800px;
  margin: 0 auto;
  height: 35px;
  line-height: 35px;
}

#footer a {
  color: #29a3c7;
  font-size: 12px;
  text-decoration: none;
  text-transform: uppercase;
  padding: 0 8px;
  margin: 0 8px;
  letter-spacing: 1.5px;
}

#footer .links-wrap .links-block {
  background-color: #f7f8f9;
  margin: 0 10px;
  display: inline-block;
  zoom: 1;
  *display: inline;
  padding: 0 15px;
  -ms-border-radius: 17px;
  -moz-border-radius: 17px;
  -webkit-border-radius: 17px;
  border-radius: 17px;
}

#footer .links-wrap .links-block.dev {
  display: none;
}

#footer .links-wrap {
  float: left;
}

#footer .social-menu a:after {
  font-family: 'icons';
}

#footer .social-menu a.email:after {
  content: '\F0E0';
}

#footer .social-menu a.twitter:after {
  content: '\54';
}

#footer .social-menu a.facebook:after {
  content: '\f300';
}

#footer .social-menu a {
  padding: 0 4px;
  margin: 0 4px;
  font-size: 16px;
  font-weight: 400;
}

#footer .social-menu {
  display: inline-block;
  zoom: 1;
  *display: inline;
  text-align: right;
  float: right;
  min-width: 100px;
  max-width: 200px;
  width: 100%;
}

#footer .automattic-corp a.automattic:hover {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

#footer .automattic-corp a.automattic {
  display: inline-block;
  zoom: 1;
  *display: inline;
  background-image: url("https://s1.cldup.com/corporate/images/automattic-footer-logo.png");
  width: 136px;
  height: 10px;
  background-repeat: no-repeat;
  background-position: left top;
  background-color: transparent;
  opacity: 0.5;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
  filter: alpha(opacity=50);
  margin-bottom: 50px;
  -ms-background-size: 136px 10px;
  -moz-background-size: 136px 10px;
  -webkit-background-size: 136px 10px;
  background-size: 136px 10px;
}

#footer .automattic-corp {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  justify-content: center;
  position: relative;
  text-align: center;
  width: 100%;
  margin: 0 auto;
  top: 50px;
}

body.logged_in #footer,
body.logging_in #footer {
  display: none;
}

#footer.page_login,
#footer.page_signup,
#footer.page_forgot,
#footer.page_404 {
  display: none;
}

@media only screen and (max-width: 600px) {
  #footer .links-wrap .links-block {
    margin-bottom: 20px;
  }

  #footer .social-menu {
    display: block;
    max-width: none;
    min-width: 0;
    text-align: center;
    float: none;
    padding-bottom: 20px;
  }

  #footer .automattic-corp a.automattic {
    margin-bottom: 20px;
  }

  #footer .automattic-corp {
    top: 20px;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  #footer .automattic-corp a.automattic {
    background-image: url("https://s1.cldup.com/corporate/images/automattic-footer-logo@2x.png");
    background-size: 136px 10px;
  }
}

.footer-menu {
  display: inline-block;
  zoom: 1;
  *display: inline;
  margin-left: 15px;
  position: relative;
  bottom: 2px;
}

.footer-menu a:hover {
  color: #f1ab77;
}

.footer-menu a {
  color: #aeaeae;
  text-shadow: 0 1px 0 #fff;
  text-transform: uppercase;
  text-decoration: none;
  margin-right: 15px;
}

.footer-menu a.help.dropdown-shown {
  color: #f1ab77;
}

.footer-menu a.help:after {
  content: '\e75c';
  font-family: 'icons';
  width: 10px;
  display: inline-block;
  zoom: 1;
  *display: inline;
  padding-left: 5px;
  font-weight: bold;
}

#login .forgot-success {
  text-align: left;
  margin-bottom: 30px;
}

#login .forgot-username {
  color: #3FA5C9;
}

#login.forgot h1,
#login.forgot-recover h1 {
  margin: 0;
}

#login.forgot p input,
#login.forgot-recover p input {
  top: 0;
}

#login.forgot p span,
#login.forgot-recover p span {
  top: 52px;
}

#login.forgot p .subtitle,
#login.forgot-recover p .subtitle {
  margin-bottom: 22px;
}

#login.forgot .error,
#login.forgot-recover .error {
  color: #cf4850;
}

#login.forgot .success,
#login.forgot-recover .success {
  color: #25a1c3;
}

#login.forgot .error a,
#login.forgot-recover .error a,
#login.forgot .success a,
#login.forgot-recover .success a {
  text-decoration: none;
}

#login.forgot-recover .msg-placeholder .msg p {
  font-size: 14px;
  font-weight: 400;
  margin-bottom: 22px;
}

#login.forgot-recover .msg-placeholder {
  z-index: 100;
  top: 0;
  display: block;
  height: auto;
  position: relative;
}

#login-container .global-msg {
  text-align: center;
  color: #f0594c;
  font-weight: 600;
}

textarea,
select,
.input-field,
input[type=text],
input[type=password],
input[type=email] {
  cursor: text;
  margin: 8px 0;
  width: 100%;
  padding: 2px 8px 0px;
  font-weight: 100;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  border: 1px solid #d4d4d4;
  outline: none;
  background-color: #fff;
  color: #111;
  -webkit-appearance: none;
  -moz-appearance: none;
  -webkit-font-smoothing: subpixel-antialiased;
  -ms-border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -ms-user-select: auto;
  -moz-user-select: auto;
  -webkit-user-select: auto;
  user-select: auto;
}

textarea::-webkit-input-placeholder,
select::-webkit-input-placeholder,
.input-field::-webkit-input-placeholder,
input[type=text]::-webkit-input-placeholder,
input[type=password]::-webkit-input-placeholder,
input[type=email]::-webkit-input-placeholder {
  color: rgba(54, 54, 54, .40);
  font-style: oblique;
}

textarea:-ms-input-placeholder,
select:-ms-input-placeholder,
.input-field:-ms-input-placeholder,
input[type=text]:-ms-input-placeholder,
input[type=password]:-ms-input-placeholder,
input[type=email]:-ms-input-placeholder {
  color: rgba(54, 54, 54, .40);
  font-style: oblique;
}

textarea:-moz-placeholder,
select:-moz-placeholder,
.input-field:-moz-placeholder,
input[type=text]:-moz-placeholder,
input[type=password]:-moz-placeholder,
input[type=email]:-moz-placeholder {
  color: rgba(54, 54, 54, .40);
  font-style: oblique;
}

textarea::-moz-placeholder,
select::-moz-placeholder,
.input-field::-moz-placeholder,
input[type=text]::-moz-placeholder,
input[type=password]::-moz-placeholder,
input[type=email]::-moz-placeholder {
  color: rgba(54, 54, 54, .40);
  font-style: oblique;
}

textarea::-webkit-validation-bubble-message,
select::-webkit-validation-bubble-message,
.input-field::-webkit-validation-bubble-message,
input[type=text]::-webkit-validation-bubble-message,
input[type=password]::-webkit-validation-bubble-message,
input[type=email]::-webkit-validation-bubble-message {
  display: none;
}

textarea:focus::-webkit-input-placeholder,
select:focus::-webkit-input-placeholder,
.input-field:focus::-webkit-input-placeholder,
input[type=text]:focus::-webkit-input-placeholder,
input[type=password]:focus::-webkit-input-placeholder,
input[type=email]:focus::-webkit-input-placeholder {
  color: rgba(54, 54, 54, .12);
}

textarea:focus:-ms-input-placeholder,
select:focus:-ms-input-placeholder,
.input-field:focus:-ms-input-placeholder,
input[type=text]:focus:-ms-input-placeholder,
input[type=password]:focus:-ms-input-placeholder,
input[type=email]:focus:-ms-input-placeholder {
  color: rgba(54, 54, 54, .12);
}

textarea:focus:-moz-placeholder,
select:focus:-moz-placeholder,
.input-field:focus:-moz-placeholder,
input[type=text]:focus:-moz-placeholder,
input[type=password]:focus:-moz-placeholder,
input[type=email]:focus:-moz-placeholder {
  color: rgba(54, 54, 54, .12);
}

textarea:focus::-moz-placeholder,
select:focus::-moz-placeholder,
.input-field:focus::-moz-placeholder,
input[type=text]:focus::-moz-placeholder,
input[type=password]:focus::-moz-placeholder,
input[type=email]:focus::-moz-placeholder {
  color: rgba(54, 54, 54, .12);
}

textarea:focus,
select:focus,
.input-field:focus,
input[type=text]:focus,
input[type=password]:focus,
input[type=email]:focus {
  border-color: #91c0e5;
}

textarea.focused::-webkit-input-placeholder,
select.focused::-webkit-input-placeholder,
.input-field.focused::-webkit-input-placeholder,
input[type=text].focused::-webkit-input-placeholder,
input[type=password].focused::-webkit-input-placeholder,
input[type=email].focused::-webkit-input-placeholder {
  color: rgba(54, 54, 54, .12);
}

textarea.focused:-ms-input-placeholder,
select.focused:-ms-input-placeholder,
.input-field.focused:-ms-input-placeholder,
input[type=text].focused:-ms-input-placeholder,
input[type=password].focused:-ms-input-placeholder,
input[type=email].focused:-ms-input-placeholder {
  color: rgba(54, 54, 54, .12);
}

textarea.focused:-moz-placeholder,
select.focused:-moz-placeholder,
.input-field.focused:-moz-placeholder,
input[type=text].focused:-moz-placeholder,
input[type=password].focused:-moz-placeholder,
input[type=email].focused:-moz-placeholder {
  color: rgba(54, 54, 54, .12);
}

textarea.focused::-moz-placeholder,
select.focused::-moz-placeholder,
.input-field.focused::-moz-placeholder,
input[type=text].focused::-moz-placeholder,
input[type=password].focused::-moz-placeholder,
input[type=email].focused::-moz-placeholder {
  color: rgba(54, 54, 54, .12);
}

textarea.focused,
select.focused,
.input-field.focused,
input[type=text].focused,
input[type=password].focused,
input[type=email].focused {
  border-color: #91c0e5;
}

textarea.error,
select.error,
.input-field.error,
input[type=text].error,
input[type=password].error,
input[type=email].error {
  border-color: #f4999d;
}

select {
  color: #535353;
  background-color: #f6f6f6;
  background-image: url("https://s1.cldup.com/form-styles/images/double-arrow.png");
  background-repeat: no-repeat;
  background-position: right 50%;
  cursor: default;
  -ms-background-size: 20px;
  -moz-background-size: 20px;
  -webkit-background-size: 20px;
  background-size: 20px;
  -ms-box-shadow: inset 0 0 0 1px #fcfcfc;
  -moz-box-shadow: inset 0 0 0 1px #fcfcfc;
  -webkit-box-shadow: inset 0 0 0 1px #fcfcfc;
  box-shadow: inset 0 0 0 1px #fcfcfc;
}

select + .error {
  right: 28px;
}

input.search {
  background-color: white;
}

input[disabled],
input.read-only {
  background-color: #f6f6f6;
  color: #bbb;
}

.input-field,
input[type=text],
input[type=password],
input[type=email] {
  height: 44px;
}

.input-badge {
  position: relative;
}

.input-badge:after {
  position: absolute;
  right: 8px;
  top: 14px;
  font-family: 'icons';
  width: 24px;
  height: 24px;
  text-align: center;
  line-height: 24px;
  color: white;
  -ms-border-radius: 12px;
  -moz-border-radius: 12px;
  -webkit-border-radius: 12px;
  border-radius: 12px;
}

.badge-success:after {
  content: "\2713";
  background-color: #7cc266;
}

.badge-warning:after {
  content: "!";
  font-weight: bold;
  background-color: #f2a973;
}

.email-field,
input[name=email],
input[name=email-suggestion] {
  position: relative;
}

.email-field,
input[name=email] {
  z-index: 100;
}

input[name=email-suggestion] {
  margin-top: -52px;
  display: block;
  border-color: transparent;
}

form p {
  margin: 0;
  position: relative;
}

form p label {
  letter-spacing: 0.01em;
  height: 30px;
  line-height: 30px;
  color: #c4c4c4;
  font-weight: bold;
}

form span.error {
  position: absolute;
  top: 19px;
  right: 10px;
  color: #cf4850;
  font-size: 12px;
  text-align: right;
  height: 14px;
  line-height: 14px;
  z-index: 2;
}

form .msg-placeholder {
  height: 28px;
  text-align: center;
}

form .msg-placeholder p {
  font-weight: bold;
}

form .msg-placeholder .fade {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
  -ms-transition: all 300ms ease-in;
  -moz-transition: all 300ms ease-in;
  -webkit-transition: all 300ms ease-in;
  transition: all 300ms ease-in;
}

form .msg-placeholder .fade-out {
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
}

form .msg-placeholder p.msg {
  color: #535353;
}

form .msg-placeholder p.error {
  color: #f0594c;
}

form .msg-placeholder p.success {
  color: #79b766;
}

form .msg-placeholder p.sending {
  color: #cdcdcd;
}

input ~ .error {
  z-index: -1;
}

input:-webkit-autofill ~ .error {
  pointer-events: none;
  z-index: inherit;
}

.buttons {
  margin-top: 20px;
  margin-bottom: 20px;
  text-align: center;
}

.buttons button .shortcut-mac,
.buttons button .shortcut-win {
  display: none;
  letter-spacing: -2px;
  opacity: 0.8;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  filter: alpha(opacity=80);
  padding-left: 5px;
}

.win .buttons .shortcut-win {
  display: inline-block;
  zoom: 1;
  *display: inline;
}

.mac .buttons button.shortcut-mac:after {
  margin-left: 5px;
  letter-spacing: -1px;
  content: '⌘ ↩';
}

input[type=checkbox] {
  -webkit-appearance: none;
  width: 20px;
  height: 20px;
  display: inline-block;
  zoom: 1;
  *display: inline;
  border: none;
  background: none;
}

input[type=checkbox]:focus {
  outline: none;
}

input[type=checkbox]:after {
  display: inline-block;
  zoom: 1;
  *display: inline;
  height: 20px;
  width: 20px;
  content: ' ';
  color: #25a1c3;
  vertical-align: middle;
  margin: 0px 3px 3px 1px;
  -webkit-font-smoothing: antialiased;
  border: 1px solid #d3d3d3;
  background-color: #f6f6f6;
  -ms-border-radius: 2px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
}

input[type=checkbox]:checked:after {
  font-family: 'icons';
  content: '\2713';
  font-size: 18px;
  background-color: white;
  text-align: center;
}

input[type=checkbox].error:after {
  border: 1px solid rgba(228, 29, 62, .5);
}

input[type=checkbox]:focus:after {
  border-color: #91c0e5;
  outline: none;
}

input[type=radio] {
  margin: 0px 8px;
  background-position: -20px 0;
}

input[type=radio]:checked {
  background-position: 0 0;
}

form a.cancel {
  position: relative;
  color: #cdcdcd;
  text-transform: uppercase;
  height: 36px;
  line-height: 36px;
  font-size: 12px;
  display: inline-block;
  zoom: 1;
  *display: inline;
  padding: 0 10px;
  margin: 0 10px;
}

form a.cancel:active {
  top: 1px;
}

form .inputs-inline input {
  width: auto;
  margin-left: 10px;
}

form .inputs-inline input:first-child {
  margin-left: 0;
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  select {
    background-image: url("https://s1.cldup.com/form-styles/images/double-arrow@2x.png");
    background-size: 20px;
  }
}

.highlight {
  -ms-animation-duration: 500ms;
  -moz-animation-duration: 500ms;
  -webkit-animation-duration: 500ms;
  animation-duration: 500ms;
  -ms-animation-name: highlight;
  -moz-animation-name: highlight;
  -webkit-animation-name: highlight;
  animation-name: highlight;
}

.textlight {
  -ms-animation-duration: 1s;
  -moz-animation-duration: 1s;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -ms-animation-name: textlight;
  -moz-animation-name: textlight;
  -webkit-animation-name: textlight;
  animation-name: textlight;
}

@keyframes highlight {
  from {
    background-color: #fefbbf;
  }

  to {
    background-color: #fff;
  }
}

@keyframes textlight {
  from {
    color: #fefbbf;
  }

  to {
    color: #fff;
  }
}

@-ms-keyframes highlight {
  from {
    background-color: #fefbbf;
  }

  to {
    background-color: #fff;
  }
}

@-moz-keyframes highlight {
  from {
    background-color: #fefbbf;
  }

  to {
    background-color: #fff;
  }
}

@-webkit-keyframes highlight {
  from {
    background-color: #fefbbf;
  }

  to {
    background-color: #fff;
  }
}

@-ms-keyframes textlight {
  from {
    color: #fefbbf;
  }

  to {
    color: #fff;
  }
}

@-moz-keyframes textlight {
  from {
    color: #fefbbf;
  }

  to {
    color: #fff;
  }
}

@-webkit-keyframes textlight {
  from {
    color: #fefbbf;
  }

  to {
    color: #fff;
  }
}

.items-counter {
  position: relative;
  text-decoration: none;
}

.items-counter .icon {
  font-size: 22px;
  color: #aeaeae;
  cursor: pointer;
}

.items-counter.onchange .icon {
  -ms-transition: color 150ms ease-in;
  -moz-transition: color 150ms ease-in;
  -webkit-transition: color 150ms ease-in;
  transition: color 150ms ease-in;
}

.items-counter.tip-shown .icon,
.items-counter.tip-shown:hover .icon,
.items-counter.onchange .icon {
  color: #f1ab77;
  text-shadow: 0 1px white;
}

.items-counter.show-news:after {
  content: '!';
  display: block;
  position: absolute;
  top: -3px;
  right: 0;
  width: 14px;
  height: 14px;
  line-height: 14px;
  background: #7cc266;
  color: #fff;
  font-weight: bold;
  font-size: 10px;
  font-family: Verdana;
  -webkit-animation-name: anim;
  -webkit-animation-duration: 200ms;
  -ms-border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
}

.tip .tip-inner.items-counter-tip {
  height: 32px;
  cursor: pointer;
}

.tip .tip-inner.items-counter-tip strong.onchange {
  -ms-transform: scale(1.25);
  -moz-transform: scale(1.25);
  -webkit-transform: scale(1.25);
  transform: scale(1.25);
}

.tip .tip-inner.items-counter-tip strong {
  padding: 0;
  font-size: 15px;
  display: inline-block;
  zoom: 1;
  *display: inline;
  text-align: justify;
  white-space: nowrap;
  word-spacing: -4px;
  -ms-transition: -ms-transform 150ms ease-in;
  -moz-transition: -moz-transform 150ms ease-in;
  -webkit-transition: -webkit-transform 150ms ease-in;
  -webkit-transition: -webkit-transform 150ms ease-in;
  -moz-transition: -moz-transform 150ms ease-in;
  -ms-transition: -ms-transform 150ms ease-in;
  -o-transition: -o-transform 150ms ease-in;
  -ms-transition: transform 150ms ease-in;
  -moz-transition: transform 150ms ease-in;
  -webkit-transition: transform 150ms ease-in;
  transition: transform 150ms ease-in;
}

.tip .tip-inner.items-counter-tip strong[digits="1"] {
  width: 8px;
}

.tip .tip-inner.items-counter-tip strong[digits="2"] {
  width: 20px;
}

.tip .tip-inner.items-counter-tip strong[digits="3"] {
  width: 27px;
}

.tip .tip-inner.items-counter-tip strong[digits="4"] {
  width: 37px;
}

.tip .tip-inner.items-counter-tip a {
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
}

.dialog.items-dialog {
  max-width: 567px;
  width: 100%;
}

.dialog.items-dialog .body h3 {
  height: 44px;
  line-height: 39px;
  font-size: 30px;
  text-align: left;
  padding: 0;
  margin-bottom: 0;
}

.dialog.items-dialog .body p strong.items-removed {
  color: #e1003f;
}

.dialog.items-dialog .body p strong {
  font-weight: bold;
  color: #7cc266;
}

.dialog.items-dialog .body p.comming-soon {
  height: 47px;
  background-color: #fcf2e6;
  line-height: 47px;
  margin-top: 20px;
  margin-left: -60px;
  margin-right: -60px;
  text-align: center;
  font-family: droid-serif;
  font-style: oblique;
  font-size: 16px;
  color: #111;
}

.dialog.items-dialog .body p {
  margin: 3px 0 0 0;
  text-align: left;
  font-size: 16px;
  color: #343434;
  line-height: 20px;
  height: 68px;
}

.dialog.items-dialog .body {
  padding: 25px 60px 50px;
  height: 100%;
  -ms-border-radius: 6px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
}

.dialog.items-dialog .body .stats-ph {
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  -ms-transition: opacity 50ms ease-in;
  -moz-transition: opacity 50ms ease-in;
  -webkit-transition: opacity 50ms ease-in;
  transition: opacity 50ms ease-in;
}

.dialog.items-dialog.loaded .body .stats-ph {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

.dialog.items-dialog .body ul.items-summary {
  margin: 0;
  padding: 0;
  list-style: none;
  height: 120px;
}

.dialog.items-dialog .body ul.items-summary li span {
  padding: 2px 5px;
  -ms-border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}

.dialog.items-dialog .body ul.items-summary li.items-count span {
  -ms-border-radius: 20px;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  border-radius: 20px;
}

.dialog.items-dialog .body ul.items-summary li.items-count.overflown {
  color: #e1003f;
}

.dialog.items-dialog .body ul.items-summary li.items-count.onchange {
  color: #666;
}

.dialog.items-dialog .body ul.items-summary li.items-count.overflown.onchange {
  color: #f1225f;
}

.dialog.items-dialog .body ul.items-summary li.items-count:before {
  font-family: 'icons';
  content: '\e800';
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  zoom: 1;
  *display: inline;
  cursor: default;
  color: #7cc266;
  position: absolute;
  left: -7px;
  bottom: 5px;
  font-size: 60px;
  -ms-transition: color 250ms ease-in;
  -moz-transition: color 250ms ease-in;
  -webkit-transition: color 250ms ease-in;
  transition: color 250ms ease-in;
}

.dialog.items-dialog .body ul.items-summary li.items-count.overflown:before {
  color: #e1003f;
}

.dialog.items-dialog .body ul.items-summary li.items-count {
  font-size: 72px;
  width: 227px;
  color: #343434;
  position: relative;
  padding-top: 13px;
}

.dialog.items-dialog .body ul.items-summary li.items-total:after,
.dialog.items-dialog .body ul.items-summary li.item-views:after {
  color: #343434;
  text-transform: uppercase;
  font-size: 11px;
  position: absolute;
  bottom: 2px;
  right: 6px;
}

.dialog.items-dialog .body ul.items-summary li.items-total,
.dialog.items-dialog .body ul.items-summary li.item-views {
  font-size: 30px;
  position: relative;
}

.dialog.items-dialog .body ul.items-summary li.items-total:after {
  content: 'items';
}

.dialog.items-dialog .body ul.items-summary li.items-total:before {
  content: '/';
  position: absolute;
  left: 4px;
  color: #343434;
}

.dialog.items-dialog .body ul.items-summary li.items-total {
  width: 100px;
  color: #686868;
}

.dialog.items-dialog .body ul.items-summary li.item-views:after {
  content: 'views';
}

.dialog.items-dialog .body ul.items-summary li.item-views {
  width: 120px;
  color: #7cc266;
}

.dialog.items-dialog .body ul.items-summary li {
  font-family: Arial;
  display: inline-block;
  zoom: 1;
  *display: inline;
  vertical-align: top;
  font-weight: bold;
  text-align: right;
  height: 120px;
  padding-top: 60px;
  -ms-transition: color 150ms ease-in;
  -moz-transition: color 150ms ease-in;
  -webkit-transition: color 150ms ease-in;
  transition: color 150ms ease-in;
}

.dialog.items-dialog .body ul.items-summary li.items-count[digits="4"] {
  font-size: 62px;
  padding-top: 24px;
}

.dialog.items-dialog .body ul.items-summary li.items-count[digits="5"] {
  padding-top: 39px;
  font-size: 50px;
}

.dialog.items-dialog p strong.item-remove-count,
.dialog.items-dialog p strong.item-left.negative-count {
  color: #e1003f;
}

@media only screen and (max-width: 600px) {
  .dialog.items-dialog .body h3 {
    font-size: 22px;
  }

  .dialog.items-dialog .body p.comming-soon {
    margin-left: -10px;
    margin-right: -10px;
    margin-bottom: 10px;
    padding: 0;
    font-size: 10px;
    height: 35px;
    line-height: 35px;
  }

  .dialog.items-dialog .body .stats {
    font-size: 14px;
  }

  .dialog.items-dialog .body ul.items-summary li.items-count:before {
    left: -25px;
    font-size: 35px;
    bottom: 20px;
  }

  .dialog.items-dialog .body ul.items-summary li.items-count {
    width: 100px;
    position: relative;
    left: 30px;
    font-size: 35px;
    padding-top: 49px;
  }

  .dialog.items-dialog .body ul.items-summary li.items-total:before {
    content: 'of ';
    left: 6px;
    font-size: 14px;
  }

  .dialog.items-dialog .body ul.items-summary li.items-total:after {
    right: -37px;
    top: 63px;
    display: none;
  }

  .dialog.items-dialog .body ul.items-summary li.items-total {
    color: #343434;
    font-size: 14px;
    width: 60px;
    position: relative;
    left: -35px;
    top: 34px;
  }

  .dialog.items-dialog .body ul.items-summary li.item-views:after {
    bottom: 7px;
  }

  .dialog.items-dialog .body ul.items-summary li.item-views {
    padding-top: 60px;
    width: 80px;
    left: -10px;
    font-size: 25px;
  }

  .dialog.items-dialog .body {
    padding: 0 10px 10px;
  }

  .dialog.items-dialog .body ul.items-summary li.items-count[digits="4"]:before {
    left: -40px;
  }

  .dialog.items-dialog .body ul.items-summary li.items-count[digits="4"] {
    padding-top: 54px;
    left: 30px;
    font-size: 30px;
  }

  .dialog.items-dialog .body ul.items-summary li.items-count[digits="5"]:before {
    left: -45px;
  }

  .dialog.items-dialog .body ul.items-summary li.items-count[digits="5"] {
    padding-top: 54px;
    font-size: 30px;
    left: 30px;
  }
}

.layout-box {
  width: 100%;
  height: 100%;
  position: absolute;
  bottom: 0;
  margin: -50px auto 0;
  padding-top: 70px;
}

.layout-box > div {
  width: 100%;
  min-height: 100%;
  border: 1px solid #cdcdcd;
  position: relative;
  z-index: 10;
  background-color: #fff;
  margin: 0 auto;
  top: -50px;
  -ms-border-radius: 0 0 3px 3px;
  -moz-border-radius: 0 0 3px 3px;
  -webkit-border-radius: 0 0 3px 3px;
  border-radius: 0 0 3px 3px;
  -ms-box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.3);
  -moz-box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.3);
  -webkit-box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.3);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.3);
}

@media only screen and (max-width: 600px) {
  .layout-box > div {
    top: -30px;
    padding-bottom: 0;
  }

  .layout-box {
    margin: 0 0 -120px 0;
    height: auto;
    top: 0px;
  }
}

#login-container {
  text-align: left;
  max-width: 360px;
  width: 100%;
  margin: 60px auto 0;
}

#login {
  margin: 0;
  position: relative;
  z-index: 10;
}

#login h1 {
  font-size: 18px;
  margin: 0 0 25px;
  color: #373737;
  height: 28px;
  line-height: 28px;
}

#login p.subtitle {
  margin: 0px;
  color: #6f6f6f;
}

#login form .msg-placeholder .msg {
  font-size: 12px;
  text-align: left;
  whitespace: nowrap;
}

#login form .msg-placeholder {
  width: 100%;
  height: 0;
  position: absolute;
  top: 26px;
}

#login form p span {
  top: 43px;
}

#login form p label.forgot a i,
#login form p label.tw a i {
  margin-left: 3px;
  font-size: 14px;
}

#login form p label.forgot a,
#login form p label.tw a {
  color: #25a1c3;
  font-size: 11px;
  font-weight: bold;
  text-transform: uppercase;
  text-decoration: none;
  -ms-transition: color 250ms ease-in;
  -moz-transition: color 250ms ease-in;
  -webkit-transition: color 250ms ease-in;
  transition: color 250ms ease-in;
}

#login form p label.forgot a.tw-link.loading,
#login form p label.tw a.tw-link.loading {
  color: #999;
  pointer-events: none;
}

#login form p label.forgot,
#login form p label.tw {
  position: absolute;
  right: 0;
  top: 0;
}

#login form p input {
  position: relative;
  top: -9px;
}

#login form p input[name=email-suggestion] {
  background: #fff !important;
}

#login form p {
  position: relative;
}

#login form .buttons {
  text-align: right;
}

#login form .password-visible {
  text-align: right;
  position: absolute;
  right: 0;
  padding: 16px 10px;
  display: none;
}

#login .invite-only-info a {
  color: #c4c4c4;
  font-weight: bold;
  text-decoration: none;
}

#login .invite-only-info {
  color: #c4c4c4;
  font-size: 12px;
  margin-top: 60px;
  text-align: center;
}

#login p.status {
  margin: 0;
}

#login p.status.initial {
  color: #808080;
}

#login + p {
  float: left;
  clear: both;
  font-size: 12px;
  margin-left: 80px;
}

@media only screen and (max-width: 600px) {
  #login-container .buttons button {
    width: 100%;
  }

  #login-container {
    margin-top: 30px;
    padding: 0 20px;
  }
}

#bar.hide_logo .logo {
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
}

#bar.logged_in.hide_logo .logo {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

#logo {
  height: 100%;
}

#logo .top {
  display: block;
}

#logo .top h1 {
  padding: 160px 0 40px 0;
  font-size: 20px;
  font-weight: 100;
  color: #7bb9b1;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}

#logo ul {
  padding: 0;
}

#logo .top ul>li {
  margin: auto;
  width: 300px;
  color: #ab9476;
  font-size: 14px;
  text-align: left;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 2px;
  list-style-type: none;
  padding-top: 20px;
}

#logo .top ul>li p {
  text-transform: none;
  letter-spacing: 1px;
  margin-bottom: 80px;
  padding: 0 30px;
  font-family: georgia, serif;
  font-style: oblique;
}

#logo .top ul>li .logo {
  background: url("https://s1.cldup.com/logo/cloudup-salmon-logo.png");
  background-repeat: no-repeat;
  width: 268px;
  height: 90px;
  margin: 40px 0 40px 20px;
  -ms-background-size: 268px 90px;
  -moz-background-size: 268px 90px;
  -webkit-background-size: 268px 90px;
  background-size: 268px 90px;
}

.salmon-bg {
  background-color: #ef6c5e;
  padding: 30px 20px;
  margin-bottom: 40px;
}

#logo .top ul>li .alt {
  background: url("https://s1.cldup.com/logo/cloudup-white-logo.png");
  background-repeat: no-repeat;
  width: 268px;
  height: 90px;
  -ms-background-size: 268px 90px;
  -moz-background-size: 268px 90px;
  -webkit-background-size: 268px 90px;
  background-size: 268px 90px;
}

#logo .top ul>li .marker {
  background: url("https://s1.cldup.com/logo/cloudup-marker.png");
  background-repeat: no-repeat;
  height: 80px;
  width: 80px;
  margin: 40px 0;
  -ms-background-size: 80px 80px;
  -moz-background-size: 80px 80px;
  -webkit-background-size: 80px 80px;
  background-size: 80px 80px;
}

#logo .top ul>li .colors {
  clear: left;
  margin-top: 30px;
  display: block;
}

#logo .top ul>li .colors .sample {
  height: 40px;
  width: 40px;
  margin-right: 10px;
  float: left;
  background-color: #ff0;
}

#logo .top ul>li #one {
  background-color: #ef6c5e;
}

#logo .top ul>li #two {
  background-color: #f2a973;
}

#logo .top ul>li #three {
  background-color: #910335;
}

#logo .top ul>li #four {
  background-color: #2a233d;
}

#logo .top ul>li #five {
  background-color: #25a1c3;
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  #logo .top ul>li .logo {
    background-image: url("https://s1.cldup.com/logo/cloudup-salmon-logo@2x.png");
    background-size: 268px 90px;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  #logo .top ul>li .alt {
    background-image: url("https://s1.cldup.com/logo/cloudup-white-logo@2x.png");
    background-size: 268px 90px;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  #logo .top ul>li .marker {
    background-image: url("https://s1.cldup.com/logo/cloudup-marker@2x.png");
    background-size: 80px 80px;
  }
}

.logout-shim {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #fff;
  z-index: 3000;
  -ms-transition: opacity 200ms ease-out;
  -moz-transition: opacity 200ms ease-out;
  -webkit-transition: opacity 200ms ease-out;
  transition: opacity 200ms ease-out;
}

.logout-shim.hide {
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
}

.activity-view .action {
  font-size: 26px;
  color: white;
  -ms-box-shadow: inset 0 -1px 0 #333;
  -moz-box-shadow: inset 0 -1px 0 #333;
  -webkit-box-shadow: inset 0 -1px 0 #333;
  box-shadow: inset 0 -1px 0 #333;
}

.activity-view .action:hover {
  opacity: 0.8;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  filter: alpha(opacity=80);
}

.activity-view .action i {
  margin-left: -3px;
  margin-top: -1px;
}

.activity-view .action.facebook,
.activity-view .action.direct-link {
  font-size: 30px;
}

.activity-view .action.facebook i {
  margin-top: 4px;
}

.activity-view .action.facebook {
  background: #3076D6;
}

.activity-view .action.twitter i {
  margin-top: 5px;
  margin-left: -5px;
}

.activity-view .action.twitter {
  background: #2CB1D5;
}

.activity-view .action.mail {
  background: #315FD6;
}

.activity-view .action.direct-link i,
.activity-view .action.open-in-browser i {
  margin-top: 3px;
}

.activity-view .action.direct-link,
.activity-view .action.open-in-browser {
  background: #7E7D83;
}

.notice-wrap {
  overflow: hidden;
  height: 37px;
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
  position: relative;
  width: 100%;
  left: 0;
  top: 0px;
  -ms-transition: opacity 100ms ease-in, height 100ms ease-out;
  -moz-transition: opacity 100ms ease-in, height 100ms ease-out;
  -webkit-transition: opacity 100ms ease-in, height 100ms ease-out;
  transition: opacity 100ms ease-in, height 100ms ease-out;
}

.notice-wrap .notice {
  height: 36px;
  line-height: 36px;
  text-align: center;
  text-transform: uppercase;
  font-weight: bold;
  color: #a9a9a9;
  font-size: 12px;
}

.notice-wrap.info .notice a {
  color: #e09963;
}

.notice-wrap.info .notice {
  color: #7cc266;
}

.notice-wrap.warn .notice a {
  color: #e29963;
}

.notice-wrap.warn .notice {
  color: #f0a974;
}

.notice-wrap.error .notice a {
  color: #e29999;
}

.notice-wrap.error .notice {
  color: #f06644;
}

.notice-wrap.hidden {
  height: 0;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
}

body.logged_out .notice-wrap {
  top: 84px;
}

@media only screen and (max-width: 600px) {
  .notice-wrap .notice {
    font-size: 10px;
  }
}

.dialog.onboarding-desktop-dialog {
  max-width: 510px;
}

.dialog.onboarding-desktop-dialog .body {
  padding-left: 0;
  padding-right: 0;
}

.dialog.onboarding-desktop-dialog .footer {
  left: 60px;
}

.dialog.onboarding-desktop-dialog .steps .steps-inner > .step {
  min-width: 510px;
  width: 510px;
  padding-left: 60px;
  padding-right: 60px;
}

.dialog.onboarding-desktop-dialog .steps .steps-inner > .step .drag-drop,
.dialog.onboarding-desktop-dialog .steps .steps-inner > .step .drag-picture,
.dialog.onboarding-desktop-dialog .steps .steps-inner > .step .drag-video,
.dialog.onboarding-desktop-dialog .steps .steps-inner > .step .plus-button,
.dialog.onboarding-desktop-dialog .steps .steps-inner > .step .select-button,
.dialog.onboarding-desktop-dialog .steps .steps-inner > .step .browser-url,
.dialog.onboarding-desktop-dialog .steps .steps-inner > .step .share-box {
  background-position: center center;
  background-repeat: no-repeat;
  background-color: transparent;
  -ms-background-size: auto 100%;
  -moz-background-size: auto 100%;
  -webkit-background-size: auto 100%;
  background-size: auto 100%;
}

.dialog.onboarding-desktop-dialog .steps .steps-inner > .step-1 .drag-drop .drag-picture,
.dialog.onboarding-desktop-dialog .steps .steps-inner > .step-1 .drag-drop .drag-video {
  position: absolute;
}

.dialog.onboarding-desktop-dialog .steps .steps-inner > .step-1 .drag-drop .drag-picture {
  width: 78px;
  height: 85px;
  left: 20px;
  top: 140px;
  background-image: url("https://s1.cldup.com/onboarding-desktop-dialog/images/picture.png");
}

.dialog.onboarding-desktop-dialog .steps .steps-inner > .step-1 .drag-drop .drag-video {
  width: 151px;
  height: 32px;
  right: 0;
  top: 160px;
  background-image: url("https://s1.cldup.com/onboarding-desktop-dialog/images/link.png");
}

.dialog.onboarding-desktop-dialog .steps .steps-inner > .step-1 .drag-drop {
  position: relative;
  max-width: 510px;
  height: 220px;
  margin: 6px auto 30px;
  background-image: url("https://s1.cldup.com/onboarding-desktop-dialog/images/browser.png");
}

.dialog.onboarding-desktop-dialog .steps .steps-inner > .step-2 .plus-button {
  width: 252px;
  height: 120px;
  margin: 20px auto;
  background-image: url("https://s1.cldup.com/onboarding-desktop-dialog/images/plus.png");
}

.dialog.onboarding-desktop-dialog .steps .steps-inner > .step-2 .select-button {
  width: 285px;
  height: 149px;
  margin: 20px auto;
  background-image: url("https://s1.cldup.com/onboarding-desktop-dialog/images/edit.png");
}

.dialog.onboarding-desktop-dialog .steps .steps-inner > .step-3 .browser-url {
  width: 377px;
  height: 57px;
  margin: 40px auto;
  background-image: url("https://s1.cldup.com/onboarding-desktop-dialog/images/url.png");
}

.dialog.onboarding-desktop-dialog .steps .steps-inner > .step-3 .share-box {
  width: 270px;
  height: 139px;
  margin: 30px auto;
  background-image: url("https://s1.cldup.com/onboarding-desktop-dialog/images/share.png");
}

.dialog.onboarding-desktop-dialog .steps .steps-inner > .step-4 .info p {
  font-size: 14px;
}

.inner.inner-onboarding-desktop a.close-button {
  display: none;
}

@media only screen and (max-width: 600px) {
  .dialog.onboarding-desktop-dialog {
    max-width: 360px;
  }

  .dialog.onboarding-desktop-dialog .steps .steps-inner > div.step h1 {
    font-size: 24px;
    margin: 0;
  }

  .dialog.onboarding-desktop-dialog .steps .steps-inner > div.step p {
    margin: 0;
    font-size: 15px;
    line-height: 1.3;
  }

  .dialog.onboarding-desktop-dialog .steps .steps-inner > div.step {
    padding-left: 30px;
    padding-right: 30px;
    max-width: 360px;
    min-width: 360px;
  }

  .dialog.onboarding-desktop-dialog .steps .steps-inner > .step-3 .browser-url {
    width: 300px;
    background-position: left center !important;
  }
}

@media only screen and (max-height: 600px) {
  .dialog.onboarding-desktop-dialog .body {
    padding-top: 0;
    padding-bottom: 60px;
  }

  .dialog.onboarding-desktop-dialog .steps .steps-inner > div.step h1 {
    margin-bottom: 0px;
  }

  .dialog.onboarding-desktop-dialog .steps .steps-inner > div.step p {
    margin: 0;
  }

  .dialog.onboarding-desktop-dialog .steps .steps-inner > div.step .hide-in-short-view {
    display: none;
  }

  .dialog.onboarding-desktop-dialog .steps .steps-inner > .step-1 .drag-drop .drag-picture {
    top: 60px;
  }

  .dialog.onboarding-desktop-dialog .steps .steps-inner > .step-1 .drag-drop .drag-video {
    top: 110px;
  }

  .dialog.onboarding-desktop-dialog .steps .steps-inner > .step-1 .drag-drop {
    height: 160px;
    margin-bottom: 0;
    margin-top: 20px;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  .dialog.onboarding-desktop-dialog .steps .steps-inner > .step-1 .drag-drop .drag-picture {
    background-image: url("https://s1.cldup.com/onboarding-desktop-dialog/images/picture@2x.png");
    background-size: contain;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  .dialog.onboarding-desktop-dialog .steps .steps-inner > .step-1 .drag-drop .drag-video {
    background-image: url("https://s1.cldup.com/onboarding-desktop-dialog/images/link@2x.png");
    background-size: contain;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  .dialog.onboarding-desktop-dialog .steps .steps-inner > .step-1 .drag-drop {
    background-image: url("https://s1.cldup.com/onboarding-desktop-dialog/images/browser@2x.png");
    background-size: contain;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  .dialog.onboarding-desktop-dialog .steps .steps-inner > .step-2 .plus-button {
    background-image: url("https://s1.cldup.com/onboarding-desktop-dialog/images/plus@2x.png");
    background-size: contain;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  .dialog.onboarding-desktop-dialog .steps .steps-inner > .step-2 .select-button {
    background-image: url("https://s1.cldup.com/onboarding-desktop-dialog/images/edit@2x.png");
    background-size: contain;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  .dialog.onboarding-desktop-dialog .steps .steps-inner > .step-3 .browser-url {
    background-image: url("https://s1.cldup.com/onboarding-desktop-dialog/images/url@2x.png");
    background-size: contain;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  .dialog.onboarding-desktop-dialog .steps .steps-inner > .step-3 .share-box {
    background-image: url("https://s1.cldup.com/onboarding-desktop-dialog/images/share@2x.png");
    background-size: contain;
  }
}

.onboarding-dialog-overlay {
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
}

.onboarding-dialog-overlay.loaded {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

.dialog.onboarding-dialog .body {
  min-height: 150px;
  position: relative;
  padding-bottom: 83px;
  padding-top: 20px;
  -ms-border-radius: 6px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
}

.dialog.onboarding-dialog .steps {
  overflow: hidden;
}

.dialog.onboarding-dialog .steps .steps-inner > div.step h1 {
  margin: 20px 0;
  line-height: 50px;
  color: #25a1c3;
  font-weight: bold;
  text-align: center;
}

.dialog.onboarding-dialog .steps .steps-inner > div.step p {
  line-height: 1.5;
  font-weight: 400;
  font-size: 16px;
}

.dialog.onboarding-dialog .steps .steps-inner > div.step.current {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

.dialog.onboarding-dialog .steps .steps-inner > div.step {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
  float: left;
  min-width: 300px;
  text-align: left;
  color: #303030;
  -webkit-backface-visibility: hidden;
  -ms-transition: opacity 100ms ease-out;
  -moz-transition: opacity 100ms ease-out;
  -webkit-transition: opacity 100ms ease-out;
  transition: opacity 100ms ease-out;
}

.dialog.onboarding-dialog .footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  background-color: #e9e9e9;
  padding: 15px 26px 16px 26px;
  height: 62px;
  margin: 0 -60px;
  -ms-border-radius: 0 0 6px 6px;
  -moz-border-radius: 0 0 6px 6px;
  -webkit-border-radius: 0 0 6px 6px;
  border-radius: 0 0 6px 6px;
}

.dialog.onboarding-dialog .footer > ul.pager {
  padding: 0;
  height: 26px;
  margin: 2px auto;
  position: relative;
  z-index: 10;
  display: inline-block;
  zoom: 1;
  *display: inline;
  overflow: hidden;
}

.dialog.onboarding-dialog .footer > ul.pager li a {
  display: block;
  height: 26px;
  line-height: 20px;
  text-decoration: none;
  font-size: 48px;
  color: white;
}

.dialog.onboarding-dialog .footer > ul.pager li.current a {
  color: #2da1c3;
}

.dialog.onboarding-dialog .footer > ul.pager li {
  width: 21px;
  display: inline-block;
  zoom: 1;
  *display: inline;
  margin: 0px 1px;
}

.dialog.onboarding-dialog .footer > .buttons {
  width: 100%;
  position: absolute;
  z-index: 0;
  left: 0;
  top: 17px;
  margin: 0;
}

.dialog.onboarding-dialog .footer > .buttons .button.back-step::after {
  content: 'Back';
}

.dialog.onboarding-dialog .footer > .buttons .button.back-step {
  left: 25px;
}

.dialog.onboarding-dialog .footer > .buttons .button.next-step::after {
  content: 'Next';
}

.dialog.onboarding-dialog .footer > .buttons .button.next-step {
  right: 25px;
}

.dialog.onboarding-dialog .footer > .buttons .button {
  top: -1px;
  width: 66px;
  position: absolute;
  text-align: center;
}

.dialog.onboarding-dialog.first .footer > .buttons .button.back-step {
  display: none;
}

.dialog.onboarding-dialog.last .footer > .buttons .button.next-step::after {
  content: 'Done!';
}

@media only screen and (max-height: 600px) {
  .dialog.onboarding-dialog .footer > .buttons {
    top: 12px;
  }

  .dialog.onboarding-dialog .footer {
    padding-top: 10px;
    padding-bottom: 11px;
    height: 52px;
  }
}

.dialog-overlay > .wrap > .inner.inner-onboarding-mobile {
  padding: 0;
}

.dialog.onboarding-mobile-dialog {
  margin-top: 6px;
}

.dialog.onboarding-mobile-dialog .body {
  padding-left: 0;
  padding-right: 0;
  padding-bottom: 65px;
}

.dialog.onboarding-mobile-dialog .footer {
  left: 60px;
}

.dialog.onboarding-mobile-dialog .steps .steps-inner > div.step {
  padding-left: 20px;
  padding-right: 20px;
  width: 100%;
}

.dialog.onboarding-mobile-dialog .steps .steps-inner > div.step .picture {
  margin: 0 auto;
  background-position: center center;
  background-repeat: no-repeat;
  background-color: transparent;
  -ms-background-size: 100% auto;
  -moz-background-size: 100% auto;
  -webkit-background-size: 100% auto;
  background-size: 100% auto;
}

body.mobile .dialog.onboarding-mobile-dialog .steps .steps-inner > div.step {
  max-width: 280px;
  min-width: 100px;
}

body.mobile .dialog.onboarding-mobile-dialog .steps .steps-inner > div.step h1 {
  margin: 0 15px auto;
  height: 20px;
  line-height: 20px;
  font-size: 20px;
}

body.mobile .dialog.onboarding-mobile-dialog .steps .steps-inner > div.step p {
  margin: 10px 0;
  font-size: 16px;
  line-height: 19px;
}

body.mobile .dialog.onboarding-mobile-dialog .steps .steps-inner > div.step.step-1 .picture.plus-button {
  width: 93px;
  height: 180px;
  background-image: url("https://s1.cldup.com/onboarding-mobile-dialog/images/mobile/plus-button.png");
}

body.mobile .dialog.onboarding-mobile-dialog .steps .steps-inner > div.step.step-2 .picture.share {
  width: 193px;
  height: 145px;
  background-image: url("https://s1.cldup.com/onboarding-mobile-dialog/images/mobile/share.png");
}

body.tablet .dialog.onboarding-mobile-dialog .steps .steps-inner > div.step {
  padding-left: 30px;
  padding-right: 30px;
  max-width: 340px;
  min-width: 100px;
}

body.tablet .dialog.onboarding-mobile-dialog .steps .steps-inner > div.step h1 {
  margin: 10px 25px 20px;
  height: 20px;
  line-height: 20px;
  font-size: 24px;
}

body.tablet .dialog.onboarding-mobile-dialog .steps .steps-inner > div.step p {
  margin: 20px 0;
  font-size: 16px;
  line-height: 19px;
}

body.tablet .dialog.onboarding-mobile-dialog .steps .steps-inner > div.step.step-1 .picture.plus-button {
  width: 224px;
  height: 286px;
  background-image: url("https://s1.cldup.com/onboarding-mobile-dialog/images/tablet/plus-button.png");
}

body.tablet .dialog.onboarding-mobile-dialog .steps .steps-inner > div.step.step-2 p:last-child {
  margin-bottom: 50px;
}

body.tablet .dialog.onboarding-mobile-dialog .steps .steps-inner > div.step.step-2 .picture.share {
  margin-left: -5px;
  width: 290px;
  height: 181px;
  background-image: url("https://s1.cldup.com/onboarding-mobile-dialog/images/tablet/share.png");
}

.dialog.onboarding-mobile-dialog .footer {
  height: 49px;
  padding-top: 9px;
}

.dialog.onboarding-mobile-dialog .footer .buttons .button.small.next-step {
  right: 15px;
}

.dialog.onboarding-mobile-dialog .footer .buttons .button.small.back-step {
  left: 15px;
}

.dialog.onboarding-mobile-dialog .footer .buttons {
  top: 11px;
}

.dialog.onboarding-mobile-dialog .footer ul.pager {
  display: none;
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  body.mobile .dialog.onboarding-mobile-dialog .steps .steps-inner > div.step.step-1 .picture.plus-button {
    background-image: url("https://s1.cldup.com/onboarding-mobile-dialog/images/mobile/plus-button@2x.png");
    background-size: contain;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  body.mobile .dialog.onboarding-mobile-dialog .steps .steps-inner > div.step.step-2 .picture.share {
    background-image: url("https://s1.cldup.com/onboarding-mobile-dialog/images/mobile/share@2x.png");
    background-size: contain;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  body.tablet .dialog.onboarding-mobile-dialog .steps .steps-inner > div.step.step-1 .picture.plus-button {
    background-image: url("https://s1.cldup.com/onboarding-mobile-dialog/images/tablet/plus-button@2x.png");
    background-size: contain;
  }
}

@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi), (min-resolution: 1.5dppx) {
  body.tablet .dialog.onboarding-mobile-dialog .steps .steps-inner > div.step.step-2 .picture.share {
    background-image: url("https://s1.cldup.com/onboarding-mobile-dialog/images/tablet/share@2x.png");
    background-size: contain;
  }
}

.pdf-reader-page {
  background: #fff;
  margin: 0 auto 20px;
  overflow: hidden;
  position: relative;
}

.pdf-reader-page canvas {
  position: absolute;
  top: 0;
  left: 0;
}

.pdf-reader-page canvas.spinner {
  top: 50%;
  left: 50%;
  position: absolute;
  margin-top: -8px;
  margin-left: -8px;
  opacity: 0.7;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
  filter: alpha(opacity=70);
}

.pdf-reader-page > .text {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  color: #000;
  font-family: sans-serif;
  overflow: hidden;
  -ms-user-select: auto;
  -moz-user-select: auto;
  -webkit-user-select: auto;
  user-select: auto;
}

.pdf-reader-page > .text > div {
  color: transparent;
  position: absolute;
  line-height: 1;
  white-space: pre;
  cursor: text;
}

.pdf-reader-page > .text > div::selection {
  background: rgba(255, 0, 0, .3);
}

.pdf-reader-page > .text > div::moz-selection {
  background: rgba(255, 0, 0, .3);
}

.pdf-reader-page > .annotations {
  font: message-box;
  color: #000;
  text-align: left;
  -ms-user-select: auto;
  -moz-user-select: auto;
  -webkit-user-select: auto;
  user-select: auto;
}

.pdf-reader-page > .annotations > div {
  cursor: text;
}

.pdf-reader-page a.internal:hover {
  opacity: 0.2;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=20);
  filter: alpha(opacity=20);
  background: #ff0;
  -ms-box-shadow: 0px 2px 10px #ff0;
  -moz-box-shadow: 0px 2px 10px #ff0;
  -webkit-box-shadow: 0px 2px 10px #ff0;
  box-shadow: 0px 2px 10px #ff0;
}

.pdf-reader-page .highlight {
  margin: -1px;
  padding: 1px;
  background-color: rgba(180, 0, 170, 0.2);
  -ms-border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
}

.pdf-reader-page .highlight.begin {
  -ms-border-radius: 4px 0px 0px 4px;
  -moz-border-radius: 4px 0px 0px 4px;
  -webkit-border-radius: 4px 0px 0px 4px;
  border-radius: 4px 0px 0px 4px;
}

.pdf-reader-page .highlight.end {
  -ms-border-radius: 0px 4px 4px 0px;
  -moz-border-radius: 0px 4px 4px 0px;
  -webkit-border-radius: 0px 4px 4px 0px;
  border-radius: 0px 4px 4px 0px;
}

.pdf-reader-page .highlight.middle {
  -ms-border-radius: 0px;
  -moz-border-radius: 0px;
  -webkit-border-radius: 0px;
  border-radius: 0px;
}

.pdf-reader-page .highlight.selected {
  background-color: rgba(0, 100, 0, 0.2);
}

#policy-container {
  text-align: left;
  padding-left: 30px;
  padding-right: 30px;
  padding-bottom: 40px;
}

#policy-container #policy h1 {
  line-height: 1.2em;
}

#policy-container #policy p {
  font-size: 14px;
  color: #222222;
}

#policy-container #policy {
  margin: 0 auto;
  max-width: 600px;
  width: 100%;
  word-wrap: break-word;
  -ms-user-select: auto;
  -moz-user-select: auto;
  -webkit-user-select: auto;
  user-select: auto;
}

@media only screen and (max-width: 480px) {
  #policy-container #policy h1 {
    font-size: 1.4em;
  }

  #policy-container #policy h2 {
    font-size: 1.1em;
  }

  #policy-container #policy h3 {
    font-size: 1em;
  }
}

#settings .settings-content .applications-settings h2:not(:nth-of-type(1)) {
  margin-top: 50px;
}

.apps ul,
.access-tokens ul,
.registered-apps ul {
  position: relative;
  min-height: 50px;
  padding: 0;
}

.apps ul li:last-child,
.access-tokens ul li:last-child,
.registered-apps ul li:last-child {
  border-bottom: none;
}

.apps ul li .edit,
.access-tokens ul li .edit,
.registered-apps ul li .edit,
.apps ul li .remove,
.access-tokens ul li .remove,
.registered-apps ul li .remove {
  text-transform: lowercase;
}

.apps ul li .edit,
.access-tokens ul li .edit,
.registered-apps ul li .edit {
  position: absolute;
  top: 12px;
  right: 75px;
}

.apps ul li .remove,
.access-tokens ul li .remove,
.registered-apps ul li .remove {
  position: absolute;
  top: 12px;
  right: 0;
}

.apps ul li,
.access-tokens ul li,
.registered-apps ul li {
  margin: 0;
  padding: 0;
  list-style: none;
  display: block;
  width: 100%;
  padding: 15px 0;
  border-bottom: 1px solid #eee;
  position: relative;
}

.access-tokens .spinner {
  position: absolute;
  top: 50%;
  left: 50%;
}

.apps.hide,
.access-tokens.hide,
.registered-apps.hide {
  display: none;
}

.register-settings p {
  -ms-user-select: text;
  -moz-user-select: text;
  -webkit-user-select: text;
  user-select: text;
}

.registered-apps .user-count {
  position: absolute;
  top: 12px;
  right: 95px;
}

@media only screen and (max-width: 600px) {
  #applications-wrapper {
    display: none;
  }
}

.register-settings {
  margin-top: 40px;
}

.register-settings form span.error {
  top: 16px !important;
}

.edit-settings [name='name'],
.edit-settings [name='url'] {
  width: 70%;
}

.edit-settings form {
  position: relative;
}

.edit-settings .image-upload.over {
  background: #fcfcfc;
  border-color: #d0d0d0;
}

.edit-settings .image-upload {
  position: absolute;
  top: 45px;
  right: 0;
  z-index: 50;
  width: 95px;
  height: 95px;
  line-height: 95px;
  text-align: center;
  border: 2px dashed #eee;
  background-repeat: no-repeat;
  -ms-background-size: cover;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
}

#notifications-wrapper #notifications-settings h4 {
  margin-bottom: 6px;
}

#notifications-wrapper #notifications-settings input[type="checkbox"] {
  display: inline-block;
  zoom: 1;
  *display: inline;
  margin-right: 20px;
  float: left;
}

#notifications-wrapper #notifications-settings .desc {
  display: inline-block;
  zoom: 1;
  *display: inline;
  line-height: 2.3em;
  width: 80%;
}

#notifications-wrapper #notifications-settings .list {
  min-height: 45px;
}

#notifications-wrapper #notifications-settings p.updates {
  margin-top: 20px;
  margin-bottom: 20px;
}

#notifications-wrapper #notifications-settings .buttons {
  margin-top: 40px;
}

#notifications-wrapper.token #notifications-settings #msg {
  height: 20px;
  width: 100%;
  text-align: left;
}

#notifications-wrapper.token #notifications-settings p {
  font-size: 14px;
  line-height: 1.3em;
}

#notifications-wrapper.token #notifications-settings a {
  color: #25a1c3;
  font-weight: bold;
  text-transform: uppercase;
  text-decoration: none;
  -ms-transition: color 250ms ease-in;
  -moz-transition: color 250ms ease-in;
  -webkit-transition: color 250ms ease-in;
  transition: color 250ms ease-in;
}

#notifications-wrapper.token #notifications-settings {
  max-width: 450px;
  margin: 0 auto;
  padding: 18px;
}

#profile-wrapper .profile-settings p.email .input-badge {
  width: 24px;
  height: 24px;
  position: absolute;
  right: 8px;
  top: 50%;
  margin-top: -12px;
  z-index: 100;
}

#profile-wrapper .profile-settings p.email .input-badge:after {
  right: 0;
  top: 0;
}

#profile-wrapper .profile-settings p.email span.error + .input-badge {
  display: none;
}

#profile-wrapper .profile-settings .buttons {
  display: block;
  position: relative;
}

#profile-wrapper .profile-settings .buttons .delete-ph a:hover {
  border-bottom: 1px solid #d42929;
}

#profile-wrapper .profile-settings .buttons .delete-ph a {
  color: #d42929;
  font-weight: normal;
  text-decoration: none;
  font-size: 12px;
}

#profile-wrapper .profile-settings .buttons .delete-ph {
  position: absolute;
  top: 0;
  height: 38px;
  line-height: 38px;
}

body.windows #profile-wrapper .delete-ph {
  right: 0;
}

#profile-wrapper .profile-settings {
  position: relative;
}

#profile-wrapper .profile-settings .staff:before {
  margin-right: 5px;
  content: '♥';
  font-family: 'icons';
}

#profile-wrapper .profile-settings .staff {
  display: none;
  position: absolute;
  top: 2px;
  right: 0;
  color: #ff5753;
  font-weight: bold;
  text-transform: uppercase;
  font-size: 12px;
}

#profile-wrapper .profile-settings .username-ph .avatar-container .user-avatar-container .clean-avatar {
  right: -10px;
  top: -10px;
}

#profile-wrapper .profile-settings .username-ph .avatar-container {
  width: 46px;
  height: 46px;
  position: absolute;
  right: 0;
  top: 20px;
}

#profile-wrapper .profile-settings .username-ph {
  position: relative;
  padding-right: 70px;
}

body.mobile #profile-wrapper .profile-settings .username-ph .edit-avatar-circle {
  display: block;
}

#profile-wrapper.is_staff .staff {
  display: block;
}

#content.settings-page {
  min-height: 400px;
}

.layout-box > #settings {
  max-width: 650px;
  top: -11px;
}

#settings .settings-content {
  background: #fff;
  padding: 20px 75px 50px;
  margin-left: 140px;
  height: 100%;
  -ms-border-radius: 0 0 3px 0;
  -moz-border-radius: 0 0 3px 0;
  -webkit-border-radius: 0 0 3px 0;
  border-radius: 0 0 3px 0;
}

#settings .settings-content h2 {
  color: #2a233d;
  text-transform: uppercase;
  font-size: 14px;
  margin: 0;
}

#settings .settings-content p {
  line-height: 1.3em;
}

#settings .settings-content form .msg-placeholder p.msg {
  text-align: left;
}

#settings .settings-content form .msg-placeholder {
  margin-bottom: 13px;
}

#settings .settings-content form p span.error {
  top: 37px;
  z-index: 110;
}

#settings .settings-content form label {
  line-height: 17px;
}

#settings .settings-content form input {
  margin: 4px 0 20px;
  display: inline-block;
  zoom: 1;
  *display: inline;
}

#settings .settings-content form .button.remove {
  color: #d82227;
  letter-spacing: 1px;
}

#settings .settings-content .devices {
  margin-top: 40px;
}

#settings .settings-content > div {
  margin-top: 12px;
}

#settings .settings-content > .hidden {
  display: none;
}

#settings .sidebar-container {
  width: 140px;
  height: 100%;
  position: absolute;
}

#settings .sidebar-container ul.settings-menu li:first-child {
  padding: 32px 0 10px 20px;
  font-size: 12px;
  font-weight: bold;
  color: #c4c4c4;
  letter-spacing: 0.1em;
}

#settings .sidebar-container ul.settings-menu li a:hover {
  background-color: #ededed;
}

#settings .sidebar-container ul.settings-menu li a {
  width: 100%;
  display: inline-block;
  zoom: 1;
  *display: inline;
  text-decoration: none;
  color: #25a1c3;
  font-size: 12px;
  font-weight: bold;
  padding: 10px 20px;
  text-shadow: 0 1px 0 #fff;
}

#settings .sidebar-container ul.settings-menu li:active a,
#settings .sidebar-container ul.settings-menu li.active a {
  background: #f2f2f2;
  -ms-box-shadow: 0 1px 0 #fff, inset 0 1px 0 #e1e1e1;
  -moz-box-shadow: 0 1px 0 #fff, inset 0 1px 0 #e1e1e1;
  -webkit-box-shadow: 0 1px 0 #fff, inset 0 1px 0 #e1e1e1;
  box-shadow: 0 1px 0 #fff, inset 0 1px 0 #e1e1e1;
}

#settings .sidebar-container ul.settings-menu li {
  list-style: none;
}

#settings .sidebar-container ul.settings-menu {
  height: 100%;
  background-color: #f8f8f8;
  border-right: 1px solid #e0e2e1;
  text-transform: uppercase;
  margin: 0;
  padding: 0;
}

@media only screen and (max-width: 600px) {
  #content.settings-page {
    width: 100%;
  }

  #settings-container,
  #settings,
  #settings-content {
    height: auto;
  }

  #settings {
    border-width: 0;
  }

  #settings .settings-content {
    margin-left: 0;
    padding: 20px;
  }

  #settings .sidebar-container {
    display: none;
  }

  #settings .settings-content > .hidden,
  #profile-wrapper {
    border-bottom: 1px solid #dcdcdc;
    display: block;
    padding-bottom: 20px;
    margin-bottom: 40px;
  }

  #settings .settings-content #notifications-wrapper {
    border-bottom: none;
    margin-bottom: 0;
  }
}

#signup-disabled-message {
  text-align: center;
}

#signup-manual.signup .buttons button,
#signup-manual.signup .buttons a.button {
  margin-bottom: 20px;
}

#signup-container {
  text-align: left;
  max-width: 360px;
  width: 100%;
  margin: 0 auto;
}

#signup-container #create-account .avatar-img.loading,
#signup-container #create-account .avatar-container.loading {
  opacity: 0.4;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
  filter: alpha(opacity=40);
}

#signup-container #create-account .avatar-img a.clean-avatar:hover,
#signup-container #create-account .avatar-container a.clean-avatar:hover {
  background-color: #ee685c;
}

#signup-container #create-account .avatar-img a.clean-avatar.show,
#signup-container #create-account .avatar-container a.clean-avatar.show {
  display: block;
}

#signup-container #create-account .avatar-img a.clean-avatar,
#signup-container #create-account .avatar-container a.clean-avatar {
  text-align: center;
  position: absolute;
  right: -3px;
  top: 0;
  background-color: #333;
  color: white;
  width: 13px;
  height: 13px;
  font-size: 8px;
  font-weight: bold;
  line-height: 13px;
  display: none;
  -ms-border-radius: 7px;
  -moz-border-radius: 7px;
  -webkit-border-radius: 7px;
  border-radius: 7px;
}

#signup-container #create-account .avatar-img .progress,
#signup-container #create-account .avatar-container .progress {
  position: relative;
  top: -5px;
  left: -5px;
}

#signup-container #create-account .avatar-img .edit-avatar-circle a.edit-avatar-vp,
#signup-container #create-account .avatar-container .edit-avatar-circle a.edit-avatar-vp {
  padding-top: 73px;
  text-align: center;
  background-color: rgba(0, 0, 0, 0.3);
  width: 95px;
  height: 95px;
  text-align: center;
  position: absolute;
  bottom: 0;
  font-size: 13px;
  text-decoration: none;
  color: white;
  -ms-border-radius: 47px;
  -moz-border-radius: 47px;
  -webkit-border-radius: 47px;
  border-radius: 47px;
}

#signup-container #create-account .avatar-img .edit-avatar-circle,
#signup-container #create-account .avatar-container .edit-avatar-circle {
  text-transform: uppercase;
  width: 96px;
  height: 22px;
  line-height: 22px;
  overflow: hidden;
  position: absolute;
  bottom: 0;
}

#signup-container #create-account .avatar-img input[type=file],
#signup-container #create-account .avatar-container input[type=file] {
  position: absolute;
  top: 0;
  left: 0;
  border: solid transparent;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  width: 95px;
  height: 95px;
  cursor: pointer;
}

#signup-container #create-account .avatar-img.uploading .edit-avatar-vp,
#signup-container #create-account .avatar-container.uploading .edit-avatar-vp {
  display: none;
}

#signup-container #create-account .avatar-img,
#signup-container #create-account .avatar-container {
  width: 95px;
  height: 95px;
  margin: 0 auto 20px auto;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  -ms-background-size: cover;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  -ms-border-radius: 50px;
  -moz-border-radius: 50px;
  -webkit-border-radius: 50px;
  border-radius: 50px;
  -ms-transition: opacity 150ms ease-in;
  -moz-transition: opacity 150ms ease-in;
  -webkit-transition: opacity 150ms ease-in;
  transition: opacity 150ms ease-in;
}

#signup-container #create-account .avatar-img {
  cursor: pointer;
  position: absolute;
  top: 0;
}

#signup-container #create-account form .msg-placeholder.tw-signup .msg i {
  margin-right: 8px;
  font-size: 22px;
}

#signup-container #create-account form .msg-placeholder.tw-signup .msg {
  color: #25a1c3;
  height: 22px;
  line-height: 22px;
  text-align: left;
  font-size: 18px;
}

#signup-container #create-account form .msg-placeholder.tw-signup {
  margin-top: 61px;
  margin-bottom: 19px;
  height: 22px;
  line-height: 22px;
}

#signup-container #create-account form p input.gravatar-populated {
  background-color: rgba(0, 200, 255, 0.03);
}

#signup-container #create-account form p input {
  position: relative;
  top: -9px;
}

#signup-container #create-account form p span {
  top: 44px;
}

#signup-container #create-account form p.note a {
  text-transform: none;
}

#signup-container #create-account form p.note span {
  float: right;
}

#signup-container #create-account form p.note {
  font-size: 12px;
  text-align: right;
  font-weight: 600;
  position: relative;
  top: -14px;
  z-index: 100;
  color: #535353;
}

#signup-container #create-account form a {
  color: #25a1c3;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  text-decoration: none;
}

#signup-container #create-account form p.policy-text input {
  top: 0;
  margin-right: 20px;
}

#signup-container #create-account form p.policy-text label span.error {
  display: none;
}

#signup-container #create-account form p.policy-text label span.conditions,
#signup-container #create-account form p.policy-text label span.conditions a {
  vertical-align: top;
  height: 22px;
  line-height: 22px;
}

#signup-container #create-account form p.policy-text label span.error + span.conditions,
#signup-container #create-account form p.policy-text label span.error + span.conditions a {
  color: #cf4850;
}

#signup-container #create-account form p.policy-text label a {
  font-size: 14px;
  text-transform: none;
}

#signup-container #create-account form p.policy-text label {
  font-weight: normal;
  letter-spacing: 0;
  font-size: 14px;
  height: 18px;
  line-height: 18px;
}

#signup-container #create-account form p.policy-text {
  height: 55px;
  margin-top: 10px;
}

#signup-container #create-account form .buttons {
  text-align: right;
}

#signup-container #create-account {
  position: relative;
  z-index: 10;
}

#create-account input[name=email],
#create-account input[name=email-suggestion] {
  -ms-transition: width 300ms ease-out;
  -moz-transition: width 300ms ease-out;
  -webkit-transition: width 300ms ease-out;
  transition: width 300ms ease-out;
}

#create-account input[name=email].has-gravatar,
#create-account input[name=email].has-gravatar ~ input {
  width: 88%;
}

#create-account input[name=email] ~ .error {
  -ms-transition: right 300ms ease-out;
  -moz-transition: right 300ms ease-out;
  -webkit-transition: right 300ms ease-out;
  transition: right 300ms ease-out;
}

#create-account input[name=email].has-gravatar ~ .error {
  right: 56px;
}

#create-account .gravatar {
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  top: 9px;
  right: 0;
  position: absolute;
  -ms-border-radius: 20px;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  border-radius: 20px;
  -ms-transition: opacity 300ms;
  -moz-transition: opacity 300ms;
  -webkit-transition: opacity 300ms;
  transition: opacity 300ms;
}

#create-account .gravatar.show {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

#signup-manual.signup .buttons {
  text-align: center;
}

@media only screen and (max-width: 600px) {
  #signup-manual.signup {
    padding: 0 30px;
    margin: 0 auto;
  }

  #signup-manual.signup .buttons button,
  #signup-manual.signup .buttons a.button {
    width: 100%;
  }

  #signup-container #create-account form .msg-placeholder {
    display: none;
  }

  #signup-container #create-account form p span {
    top: 40px;
  }

  #signup-container #create-account form p.policy-text {
    height: 30px;
  }

  #signup-container #create-account form p.note {
    width: 100%;
    right: 0;
    line-height: 15px;
  }

  #signup-container #create-account .buttons button {
    width: 100%;
  }

  #signup-container {
    margin-top: -10px;
    padding: 0 20px;
  }
}

html.info-page > body {
  background-color: #fefefe;
}

#terms-container {
  text-align: left;
  padding-left: 30px;
  padding-right: 30px;
  padding-bottom: 40px;
}

#terms-container #terms h1 {
  line-height: 1.2em;
}

#terms-container #terms p {
  font-size: 14px;
  color: #222222;
}

#terms-container #terms .terms-hightlight {
  background-color: rgba(255, 124, 110, 0.45);
}

#terms-container #terms {
  margin: 0 auto;
  max-width: 600px;
  width: 100%;
  word-wrap: break-word;
  -ms-user-select: auto;
  -moz-user-select: auto;
  -webkit-user-select: auto;
  user-select: auto;
}

@media only screen and (max-width: 480px) {
  #terms-container #terms h1 {
    font-size: 1.4em;
  }

  #terms-container #terms h2 {
    font-size: 1.1em;
  }

  #terms-container #terms h3 {
    font-size: 1em;
  }
}

.tip a {
  color: white;
}

.tip-inner {
  background-color: rgba(242, 169, 115, 0.96);
  color: #fff;
  padding: 8px 10px;
  text-align: center;
  font: normal 400 12px "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 600;
  -ms-border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -ms-box-shadow: 0 1px 0 rgba(255, 255, 255, .75);
  -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, .75);
  -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, .75);
  box-shadow: 0 1px 0 rgba(255, 255, 255, .75);
}

.tip-light .tip-inner {
  background-color: #e1e1e1;
  color: #4ba0bf;
  -ms-box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.tip-arrow {
  position: absolute;
  width: 0;
  height: 0;
  line-height: 0;
  border: 5px dashed rgba(242, 169, 115, 0.96);
}

.tip-light .tip-arrow {
  border: 5px dashed #e1e1e1;
}

.tip-bottom .tip-arrow,
.tip-bottom-left .tip-arrow,
.tip-bottom-right .tip-arrow {
  top: 0px;
  left: 50%;
  margin-left: -5px;
  border-bottom-style: solid;
  border-top: none;
  border-left-color: transparent !important;
  border-right-color: transparent !important;
}

.tip-top .tip-arrow,
.tip-top-left .tip-arrow,
.tip-top-right .tip-arrow {
  bottom: 0;
  left: 50%;
  margin-left: -5px;
  border-top-style: solid;
  border-bottom: none;
  border-left-color: transparent !important;
  border-right-color: transparent !important;
}

.tip-left .tip-arrow {
  right: 0;
  top: 50%;
  margin-top: -5px;
  border-left-style: solid;
  border-right: none;
  border-top-color: transparent !important;
  border-bottom-color: transparent !important;
}

.tip-right .tip-arrow {
  left: 0;
  top: 50%;
  margin-top: -5px;
  border-right-style: solid;
  border-left: none;
  border-top-color: transparent !important;
  border-bottom-color: transparent !important;
}

.tip-bottom-right .tip-arrow,
.tip-top-right .tip-arrow {
  left: 15px;
}

.tip-bottom-left .tip-arrow,
.tip-top-left .tip-arrow {
  left: 85%;
}

.tip.tip-success .tip-inner {
  background-color: #7cc266;
}

.tip.tip-success .tip-arrow {
  border-color: #7cc266;
}

.tip.tip-warning .tip-inner {
  background-color: #f2a973;
}

.tip.tip-warning .tip-arrow {
  border-color: #f2a973;
}

.user-avatar-container {
  height: 100%;
  width: 100%;
  position: relative;
  background-repeat: no-repeat;
  background-position: center center;
  -ms-background-size: cover;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  -ms-border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
}

.user-avatar-container .avatar-image.loaded {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

.user-avatar-container .avatar-image {
  width: 100%;
  height: 100%;
  display: inline-block;
  zoom: 1;
  *display: inline;
  vertical-align: middle;
  background-repeat: no-repeat;
  background-position: center center;
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  -ms-background-size: cover;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-size: cover;
  -ms-border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
}

.user-avatar-container .edit-avatar img.fake-image {
  opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  filter: alpha(opacity=0);
  position: absolute;
  left: -999999px;
  top: -999999px;
}

.user-avatar-container .edit-avatar {
  display: none;
}

.user-avatar-container a.clean-avatar {
  display: none;
}

.user-avatar-container.editable .edit-avatar::after,
.user-avatar-container.editable .edit-avatar::before {
  width: 100%;
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
}

.user-avatar-container.editable .edit-avatar::after {
  content: ' ';
  height: 200%;
  z-index: 1;
  background-color: rgba(0, 0, 0, 0.3);
  -ms-border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
}

.user-avatar-container.editable .edit-avatar::before {
  z-index: 2;
  height: 100%;
  text-align: center;
  content: '\270e';
  font-family: icons;
  font-size: 16px;
  color: white;
}

.user-avatar-container.editable .edit-avatar {
  width: 100%;
  height: 50%;
  overflow: hidden;
  display: block;
  position: relative;
  top: -50%;
  opacity: 0.3;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=30);
  filter: alpha(opacity=30);
  cursor: pointer;
  -ms-transition: opacity 100ms ease-in;
  -moz-transition: opacity 100ms ease-in;
  -webkit-transition: opacity 100ms ease-in;
  transition: opacity 100ms ease-in;
}

.user-avatar-container.editable:hover .edit-avatar {
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  filter: alpha(opacity=100);
}

.user-avatar-container.cleanable a.clean-avatar:hover {
  background-color: #ee685c;
}

.user-avatar-container.cleanable a.clean-avatar.show {
  display: block;
}

.user-avatar-container.cleanable a.clean-avatar {
  text-align: center;
  position: absolute;
  right: -3px;
  top: 0;
  background-color: #333;
  color: white;
  width: 13px;
  height: 13px;
  font-size: 11px;
  font-weight: bold;
  line-height: 12px;
  display: none;
  text-decoration: none;
  -ms-border-radius: 7px;
  -moz-border-radius: 7px;
  -webkit-border-radius: 7px;
  border-radius: 7px;
}

.user-avatar-container canvas {
  display: inline-block;
  zoom: 1;
  *display: inline;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 100;
  width: 120%;
  height: 120%;
}

.user-avatar-container.processing {
  opacity: 0.7;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
  filter: alpha(opacity=70);
}

.user-avatar-container.progressing.editable .edit-avatar {
  display: none !important;
}

.user-avatar-container.progressing .spinner {
  display: none;
}

.user-badge {
  -ms-user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  user-select: none;
}

.user-badge .notifications,
.user-badge .name {
  height: 58px;
  line-height: 58px;
  vertical-align: middle;
  display: inline-block;
  zoom: 1;
  *display: inline;
}

.user-badge .notifications {
  position: relative;
  padding: 0 17px 0 20px;
  cursor: pointer;
  background: #109d9d;
  margin-right: -3px;
  color: #fff;
  font-size: 20px;
  -ms-border-bottom-left-radius: 3px;
  -moz-border-bottom-left-radius: 3px;
  -webkit-border-bottom-left-radius: 3px;
  border-bottom-left-radius: 3px;
  -ms-border-top-left-radius: 3px;
  -moz-border-top-left-radius: 3px;
  -webkit-border-top-left-radius: 3px;
  border-top-left-radius: 3px;
}

.user-badge .notifications:hover,
.user-badge .notifications:active {
  background: #0d7e7e;
}

.user-badge .notifications[count="0"] {
  display: none;
}

.user-badge .name {
  color: #fff;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 13px;
  margin-left: 15px;
  display: none;
}

.user-badge .avatar-container {
  display: inline-block;
  zoom: 1;
  *display: inline;
  width: 36px;
  height: 36px;
}

.user-badge .user-data {
  display: inline-block;
  zoom: 1;
  *display: inline;
  padding: 0;
  cursor: pointer;
}

.user-menu {
  width: 140px;
  margin-left: -105px;
}

.menu.user-menu .arrow {
  margin-left: 30px;
}

body.mobile .user-menu li.get-app {
  display: none;
}