@import 'mixins'; .image-upload { text-align: center; margin: 0 auto; font-weight: bold; position: relative; height: 100px; width: 140px; cursor: pointer; overflow: hidden; border: 2px dashed $sky; background-color: white; background-size: cover; background-position: center; } .image-upload--large { height: 146px; width: 192px; } .image-upload span { margin-top: 30px; padding: 5px; display: inline-block; background: rgba(white, 0.95); color: $logo-blue; @include basicShadow; } .image-upload--large span { margin-top: 60px; } .image-upload input { @include opacity(0); width: 100%; height: 100%; position: absolute; top: 0; left: 0; cursor: pointer; } .image-upload:hover { border-color: darken($sky, 10); } .image-upload:hover span { color: darken($logo-blue, 10); }