diff --git a/public/css/items.styl b/public/css/items.styl
index 35dd7e7ef2..213e499835 100644
--- a/public/css/items.styl
+++ b/public/css/items.styl
@@ -4,7 +4,7 @@
   line-height: 1.5em
   padding-left: 0.75em
 
-.shop_gold, .shop_silver, .shop_copper
+.shop_gold, .shop_silver, .shop_copper, .shop_spell
   vertical-align: top
   display: inline-block
 
diff --git a/views/shared/tasks/lists.jade b/views/shared/tasks/lists.jade
index e73661adfc..372410dda7 100644
--- a/views/shared/tasks/lists.jade
+++ b/views/shared/tasks/lists.jade
@@ -103,13 +103,13 @@ script(id='templates/habitrpg-tasks.html', type="text/ng-template")
                   span.task-notes
                     span.glyphicon.glyphicon-comment
                 //left-hand size commands
-                .task-controls
+                .task-controls.task-primary
                   a.money.btn-buy.item-btn(ng-click='castStart(Content.spells.special.#{k})')
                     if canceler
                       span.shop_gold
                       span.reward-cost {{Content.spells.special.#{k}.value}}
                     else
-                      span(class='shop_#{k}',style='display:inline-block;vertical-align:top;')
+                      span.shop_spell(class='shop_#{k}')
                       span.reward-cost {{user.items.special.#{k}}}
                 // main content
                 p.task-text {{Content.spells.special.#{k}.text()}}