diff --git a/src/main/twirl/gitbucket/core/settings/danger.scala.html b/src/main/twirl/gitbucket/core/settings/danger.scala.html
index 9aa69f5..c7b3c93 100644
--- a/src/main/twirl/gitbucket/core/settings/danger.scala.html
+++ b/src/main/twirl/gitbucket/core/settings/danger.scala.html
@@ -4,9 +4,9 @@
 @html.main("Danger Zone", Some(repository)){
   @html.menu("settings", repository){
     @menu("danger", repository){
-      <div class="box">
-        <div class="box-header"><span class="strong">Danger Zone</span></div>
-        <div class="box-content-bottom">
+      <div class="panel panel-default">
+        <div class="panel-heading strong">Danger Zone</div>
+        <div class="panel-body">
           <form id="transfer-form" method="post" action="@url(repository)/settings/transfer" validate="true" autocomplete="off">
             <fieldset class="form-group">
               <label class="strong">Transfer Ownership</label>
@@ -42,4 +42,4 @@
     return confirm('Once you delete a repository, there is no going back.\nAre you sure?');
   });
 });
-</script>
\ No newline at end of file
+</script>
diff --git a/src/main/twirl/gitbucket/core/settings/edithooks.scala.html b/src/main/twirl/gitbucket/core/settings/edithooks.scala.html
index a99846f..f99b41e 100644
--- a/src/main/twirl/gitbucket/core/settings/edithooks.scala.html
+++ b/src/main/twirl/gitbucket/core/settings/edithooks.scala.html
@@ -14,11 +14,9 @@
     @menu("hooks", repository){
       @helper.html.information(info)
 
-      <div class="box">
-        <div class="box-header">
-          <span class="strong">Webhook / Manage webhook</span>
-        </div>
-        <div class="box-content-bottom">
+      <div class="panel panel-default">
+        <div class="panel-heading strong">Webhook / Manage webhook</div>
+        <div class="panel-body">
           <form method="POST" validate="true">
             <fieldset class="form-group">
               <label class="strong">Payload URL</label>
diff --git a/src/main/twirl/gitbucket/core/settings/hooks.scala.html b/src/main/twirl/gitbucket/core/settings/hooks.scala.html
index 2184c73..f745eb2 100644
--- a/src/main/twirl/gitbucket/core/settings/hooks.scala.html
+++ b/src/main/twirl/gitbucket/core/settings/hooks.scala.html
@@ -7,42 +7,39 @@
   @html.menu("settings", repository){
     @menu("hooks", repository){
       @helper.html.information(info)
+      <div class="panel panel-default">
+        <div class="panel-heading strong">
+          <a href="@url(repository)/settings/hooks/new" class="btn btn-success btn-sm pull-right">Add webhook</a>
+          Webhooks
+        </div>
+        <div class="panel-body">
+          <p>
+            Webhooks allow external services to be notified when certain events happen within your repository.
+            When the specified events happen, we’ll send a POST request to each of the URLs you provide.
+            Learn more in <a href="https://github.com/takezoe/gitbucket/wiki/API-WebHook" target="_blank">GitBucket Wiki Webhook Page</a>.
+          </p>
 
-<div class="box">
-  <div class="box-header">
-    <a href="@url(repository)/settings/hooks/new" class="btn btn-success btn-sm pull-right">Add webhook</a>
-    <span class="strong">Webhooks</span>
-  </div>
-  <div class="box-content-bottom">
-    <p>
-      Webhooks allow external services to be notified when certain events happen within your repository.
-      When the specified events happen, we’ll send a POST request to each of the URLs you provide.
-      Learn more in <a href="https://github.com/takezoe/gitbucket/wiki/API-WebHook" target="_blank">GitBucket Wiki Webhook Page</a>.
-    </p>
-
-    <table class="table table-condensed" style="margin-bottom:0">
-      @webHooks.map { case (webHook, events) =>
-        <tr><td style="vertical-align: middle;">
-          <a href="@url(repository)/settings/hooks/edit/@urlEncode(webHook.url)" class="css-truncate" style="max-width:360px">
-            <span class="css-truncate-target">@webHook.url</span>
-          </a>
-          <em class="css-truncate" style="max-width: 225px;">(<span class="css-truncate-target">@events.map(_.name).mkString(", ")</span>)</em>
-        </td><td>
-          <div class="btn-group pull-right">
-            <a href="@url(repository)/settings/hooks/edit/@urlEncode(webHook.url)" class="btn btn-small">
-              <span class="octicon octicon-pencil"></span>
-            </a>
-            <a href="@url(repository)/settings/hooks/delete?url=@urlEncode(webHook.url)" class="btn btn-small btn-danger" onclick="return confirm('delete webhook for @webHook.url ?')">
-              <span class="octicon octicon-x"></span>
-            </a>
-          </div>
-        </td></tr>
-      }
-    </table>
-
-  </div>
-</div>
-
+          <table class="table table-condensed" style="margin-bottom:0">
+            @webHooks.map { case (webHook, events) =>
+              <tr><td style="vertical-align: middle;">
+                <a href="@url(repository)/settings/hooks/edit/@urlEncode(webHook.url)" class="css-truncate" style="max-width:360px">
+                  <span class="css-truncate-target">@webHook.url</span>
+                </a>
+                <em class="css-truncate" style="max-width: 225px;">(<span class="css-truncate-target">@events.map(_.name).mkString(", ")</span>)</em>
+              </td><td>
+                <div class="btn-group pull-right">
+                  <a href="@url(repository)/settings/hooks/edit/@urlEncode(webHook.url)" class="btn btn-small">
+                    <span class="octicon octicon-pencil"></span>
+                  </a>
+                  <a href="@url(repository)/settings/hooks/delete?url=@urlEncode(webHook.url)" class="btn btn-small btn-danger" onclick="return confirm('delete webhook for @webHook.url ?')">
+                    <span class="octicon octicon-x"></span>
+                  </a>
+                </div>
+              </td></tr>
+            }
+          </table>
+        </div>
+      </div>
     }
   }
 }
diff --git a/src/main/twirl/gitbucket/core/settings/options.scala.html b/src/main/twirl/gitbucket/core/settings/options.scala.html
index 1c55ab9..fd477fe 100644
--- a/src/main/twirl/gitbucket/core/settings/options.scala.html
+++ b/src/main/twirl/gitbucket/core/settings/options.scala.html
@@ -6,9 +6,9 @@
     @menu("options", repository){
       @helper.html.information(info)
       <form id="form" method="post" action="@url(repository)/settings/options" validate="true">
-        <div class="box">
-          <div class="box-header"><span class="strong">Settings</span></div>
-          <div class="box-content-bottom">
+        <div class="panel panel-default">
+          <div class="panel-heading strong">Settings</div>
+          <div class="panel-body">
             <fieldset class="form-group">
               <label for="repositoryName" class="strong">Repository Name:</label>
               <input type="text" name="repositoryName" id="repositoryName" class="form-control" value="@repository.name"/>
@@ -20,7 +20,7 @@
             </fieldset>
             <fieldset class="margin form-group">
               <label for="defaultBranch" class="strong">Default Branch:</label>
-              <select name="defaultBranch" id="defaultBranch"@if(repository.branchList.isEmpty){ disabled}>
+              <select name="defaultBranch" id="defaultBranch"@if(repository.branchList.isEmpty){ disabled} class="form-control">
                 @if(repository.branchList.isEmpty){
                   <option value="none" selected>No Branch</option>
                 } else {