Подвинуть border относительно картинки

Хочу сделать так. Понятно, что чтобы выдвинуть на передний план, нужно добавить z-index. Но как сделать подобный border относительно изображения?

Ответ

Решение через border и использование div
.image { position: relative; width: 150px; height: 150px; background-image: url("https://graph.facebook.com/625308780945294/picture?type=large"); } .image:before { content: ""; position: absolute; border: 2px solid #c745bc; left: 20%; top: 20%; width: 100%; height: 100%; z-index: -1; }