article.content > figure { @include display(flex); @include flex-direction(column); @include transition(background-color 0.3s); background-color: #EEE; overflow: hidden; &.dropping div[contenteditable] { background-color: rgb(122, 199, 122); padding: 1em; } figcaption { padding: 1em; } & > div[contenteditable] { @include display(flex); @include align-items(center); @include justify-content(flex-end); @include flex-direction(column); @include flex(1); cursor: pointer; width: 100%; box-shadow: 0 0 3px 0 #aaa; &:hover { background-color: #CCC; } & > .progressbar { @include flex(0 auto); width: 100%; & > span.progress { @include transition(width 0.3s ease-out); display: block; height: 2px; width: 0%; background: #B9C8BA; } } & > img { max-width: 100%; } & > p { padding: 2em 0; text-align: center; } & > input[type=file] { display: none; } } }