diff --git a/less/account.less b/less/account.less
index 7e93a65..01cf89e 100644
--- a/less/account.less
+++ b/less/account.less
@@ -182,4 +182,15 @@
 		font-size:16px;
 		width:100px;
 	}
+}
+
+.picture-switcher {
+	img, .user-icon {
+		.user-icon-style(46px, 2.4rem, 50%);
+	}
+
+	h4 {
+		line-height: 46px;
+		margin: 0;
+	}
 }
\ No newline at end of file
diff --git a/templates/partials/modals/change_picture_modal.tpl b/templates/partials/modals/change_picture_modal.tpl
index f6a40b0..3ca7b2b 100644
--- a/templates/partials/modals/change_picture_modal.tpl
+++ b/templates/partials/modals/change_picture_modal.tpl
@@ -1,36 +1,38 @@
-	<div id="change-picture-modal" class="modal" tabindex="-1" role="dialog" aria-labelledby="change-picture" aria-hidden="true">
-		<div class="modal-dialog">
-			<div class="modal-content">
-				<div class="modal-header">
-					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
-					<h3 id="change-picture">[[user:change_picture]]</h3>
-				</div>
-				<div class="modal-body">
-					<div id="default-box">
-						<div class="user-icon user-profile-picture"></div>
-						<span class="user-picture-label">[[user:default_picture]]</span>
-						<i class='fa fa-check fa-2x'></i>
-					</div>
-					<br/>
-
-					<!-- IF config.allowProfileImageUploads -->
-					<div id="uploaded-box">
-						<img id="user-uploaded-picture" src="" class="user-profile-picture">
-						<span class="user-picture-label">[[user:uploaded_picture]]</span>
-						<i class='fa fa-check fa-2x'></i>
-					</div>
-
-					<a id="uploadPictureBtn" href="#">[[user:upload_new_picture]]</a> <br/>
-					<!-- IF config.hasImageUploadPlugin -->
-					<a id="uploadFromUrlBtn" href="#">[[user:upload_new_picture_from_url]]</a> <br/>
-					<!-- ENDIF config.hasImageUploadPlugin -->
-					<a id="removeUploadedPictureBtn" href="#" class="<!-- IF !uploadedpicture -->hide<!-- ENDIF !uploadedpicture -->">[[user:remove_uploaded_picture]]</a>
-					<!-- ENDIF config.allowProfileImageUploads -->
-				</div>
-				<div class="modal-footer">
-					<button class="btn btn-default" data-dismiss="modal" aria-hidden="true">[[global:close]]</button>
-					<button id="savePictureChangesBtn" class="btn btn-primary">[[global:save_changes]]</button>
-				</div>
-			</div>
+<div class="list-group media">
+	<button type="button" class="list-group-item" data-type="default">
+		<div class="media-left">
+			<div class="user-icon media-object"></div>
+		</div>
+		<div class="media-body">
+			<h4 class="media-heading">[[user:default_picture]]</h4>
+		</div>
+	</button>
+	<!-- BEGIN pictures -->
+	<button type="button" class="list-group-item" data-type="{pictures.type}">
+		<div class="media-left">
+			<img class="media-object" src="{pictures.url}" title="{pictures.text}" />
 		</div>
+		<div class="media-body">
+			<h4 class="media-heading">{pictures.text}</h4>
+		</div>
+	</button>
+	<!-- END pictures -->
+</div>
+
+<div class="btn-group btn-group-justified" role="group">
+	<!-- IF config.allowProfileImageUploads -->
+	<div class="btn-group" role="group">
+		<button type="button" class="btn btn-default" data-action="upload">[[user:upload_new_picture]]</button>
+	</div>
+	<!-- ENDIF config.allowProfileImageUploads -->
+	<!-- IF config.hasImageUploadPlugin -->
+	<div class="btn-group" role="group">
+		<button type="button" class="btn btn-default" data-action="upload-url">[[user:upload_new_picture_from_url]]</button>
+	</div>
+	<!-- ENDIF config.hasImageUploadPlugin -->
+	<!-- IF uploaded -->
+	<div class="btn-group" role="group">
+		<button type="button" class="btn btn-default" data-action="remove-uploaded">[[user:remove_uploaded_picture]]</button>
 	</div>
+	<!-- ENDIF uploaded -->
+</div>