diff --git a/app/assets/stylesheets/client_management/backend.css b/app/assets/stylesheets/client_management/backend.css
new file mode 100644
index 0000000..ff208ff
--- /dev/null
+++ b/app/assets/stylesheets/client_management/backend.css
@@ -0,0 +1,208 @@
+h1, h2, h3, h4, h5, h6, label, legend {
+  font-family: 'Chivo';
+}
+#main-wrap .wrap-inner {
+  padding-bottom: 100px;
+}
+.page-client {
+  background: #fff;
+  padding: 20px;
+  border: 1px solid #ddd;
+  margin: 30px;
+  max-width: 1000px;
+}
+.sub-title {
+  color: #337ab7;
+  font-size: 20px;
+  font-weight: 400;
+  margin: 50px 0 5px;
+  padding: 0 0 0 8px;
+}
+.page-client > div:first-child .sub-title {
+  margin: 20px 0 5px;
+}
+.line-content {
+  width: 100%;
+  margin: 0 0 15px;
+  font-size: 15px;
+  line-height: 2;
+  font-weight: 400;
+  border-top: 1px dashed #dadada;
+  padding: 15px 10px 0;
+  box-sizing: border-box;
+}
+.line-content:after {
+  content: ".";
+  display: block;
+  height: 0px;
+  clear: both;
+  visibility: hidden;
+}
+div .line-content:nth-child(1) {
+  border-top: 0px dashed #dadada;
+}
+.line-content.middle {
+  text-align: center;
+}
+.line-content .header-line {
+  color: #000;
+  font-weight: 500;
+  float: left;
+  width: 200px;
+}
+.line-content .header-line label {
+  color: #000;
+  font-weight: 500;
+  float: left;
+  width: 200px;
+}
+.line-content .content-line {
+  color: #888;
+  float: right;
+  width: calc(100% - 220px);
+}
+.line-content .content-line .label {
+  margin: 0 2px 0 0;
+  padding: 5px 10px;
+  font-size: 13px;
+}
+.line-content .content-line .label a {
+  font-size: 13px;
+}
+.line-content.qt .header-line {
+  width: calc(100% - 110px);
+}
+.line-content.qt .content-line {
+  width: 100px;
+  text-align: right;
+}
+.line-content.qt ol.custom-module {
+  background: rgba(0, 0, 0, 0.04);
+  padding: 10px 10px 10px 30px;
+  margin: 10px 0;
+  border-radius: 4px;
+}
+.line-content.qt ol.custom-module li {
+  margin: 5px 0;
+}
+.line-content.qt.hr {
+  border-top: 1px solid #ccc;
+  border-bottom: 1px solid #ccc;
+  padding: 15px 10px;
+}
+.line-content.qt.hr .header-line {
+  font-size: 18px;
+}
+.line-content.qt.hr .content-line {
+  color: #333;
+  font-size: 18px;
+}
+.line-content input[type="file"] {
+  height: 30px;
+  line-height: 8px;
+  float: left;
+  font-size: 13px;
+  margin: 6px 0 0;
+}
+.line-content.file .btn {
+  float: right;
+  width: 100px;
+  margin: 0;
+}
+.line-content.button .btn {
+  margin: 0 5px 10px;
+  box-sizing: border-box;
+  width: auto;
+  min-width: 150px;
+}
+.line-content .selected-module {
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+.line-content .selected-module:after {
+  content: ".";
+  display: block;
+  height: 0px;
+  clear: both;
+  visibility: hidden;
+}
+.line-content .selected-module li {
+  margin: 0 10px 10px 0;
+  float: left;
+}
+.line-content .selected-module li span {
+  position: relative;
+  padding: 5px 10px 5px 20px !important;
+}
+.line-content .selected-module li span:before {
+  content: "";
+  display: block;
+  width: 6px;
+  height: 6px;
+  position: absolute;
+  left: 7px;
+  top: 9px;
+  background: #fff;
+  border-radius: 50%;
+}
+.btn, input.btn {
+  width: 150px;
+  margin: 20px 0;
+}
+.btn.flat {
+  margin: 0;
+}
+.site_added_item {
+  margin: 0 0 10px;
+  position: relative;
+  padding: 0 0 0 15px;
+}
+.site_added_item:before {
+  content: "";
+  width: 5px;
+  height: 5px;
+  border-radius: 50%;
+  background: #888;
+  position: absolute;
+  left: 0;
+  top: 13px;
+}
+.site_added_item .label {
+  background: #d9534f;
+  margin: 0 5px !important;
+}
+
+.site_added_item.success .label {
+  background: #5cb85c;
+  margin: 0 5px;
+}
+
+@media (max-width: 480px) {
+  .line-content .header-line {
+    display: block;
+    float: none;
+    width: 100%;
+  }
+  .line-content .content-line {
+    display: block;
+    float: none;
+    width: 100%;
+  }
+  .line-content.qt .header-line {
+    float: left;
+    width: calc(100% - 110px);
+  }
+  .line-content.qt .content-line {
+    float: right;
+    width: 100px;
+    text-align: right;
+  }
+  .line-content.file .btn {
+    float: left;
+  }
+  .line-content.button .btn {
+    margin: 0 0 10px;
+    width: 100%;
+  }
+}
\ No newline at end of file
diff --git a/app/assets/stylesheets/client_management/default.css b/app/assets/stylesheets/client_management/default.css
index 96d52e7..67b7d73 100644
--- a/app/assets/stylesheets/client_management/default.css
+++ b/app/assets/stylesheets/client_management/default.css
@@ -372,11 +372,26 @@ select.form-control {
   line-height: 18px;
   color: #888;
 }
-/* line 332, ../sass/default.scss */
+/* line 331, ../sass/default.scss */
+.cp-main .cp-content .cp-page-title .pull-right {
+  position: relative;
+  top: -3px;
+  right: -3px;
+  font-size: 12px;
+}
+/* line 338, ../sass/default.scss */
+.cp-main .cp-content .cp-page-title .label-primary {
+  font-size: 13px;
+  font-weight: 400;
+  border-radius: 4px;
+  display: block;
+  padding: 6px 10px;
+}
+/* line 346, ../sass/default.scss */
 .cp-main .cp-content .cp-submenu-box {
   margin: 0 0 10px;
 }
-/* line 334, ../sass/default.scss */
+/* line 348, ../sass/default.scss */
 .cp-main .cp-content .cp-submenu-box:after {
   content: ".";
   display: block;
@@ -384,13 +399,13 @@ select.form-control {
   clear: both;
   visibility: hidden;
 }
-/* line 341, ../sass/default.scss */
+/* line 355, ../sass/default.scss */
 .cp-main .cp-content .cp-submenu-box .submenu-item {
   background: #fafafa;
   color: #666;
   float: left;
   border-radius: 4px;
-  padding: 7px 10px;
+  padding: 5px 10px 6px;
   margin: 0 15px 10px 0;
   text-decoration: none;
   box-shadow: 0 -2px 0 rgba(0, 0, 0, 0.05) inset;
@@ -399,23 +414,34 @@ select.form-control {
   letter-spacing: 0.05em;
   border: 1px solid #ddd;
 }
-/* line 354, ../sass/default.scss */
+/* line 368, ../sass/default.scss */
+.cp-main .cp-content .cp-submenu-box .submenu-item.active {
+  background: #51adf6;
+  color: #fff;
+  border: 1px solid #39a1f4;
+}
+/* line 373, ../sass/default.scss */
 .cp-main .cp-content .cp-submenu-box .submenu-item:hover {
   background: #2196f3;
   color: #fff;
   border: 1px solid #0d8aee;
 }
-/* line 360, ../sass/default.scss */
+/* line 378, ../sass/default.scss */
 .cp-main .cp-content .cp-submenu-box .submenu-item:active {
   box-shadow: none;
 }
-/* line 365, ../sass/default.scss */
+/* line 382, ../sass/default.scss */
+.cp-main .cp-content .cp-submenu-box .cp-filter-box {
+  float: left;
+  margin: 0 15px 10px 0;
+}
+/* line 387, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail {
   margin: 40px;
   border: 1px solid #ddd;
   padding: 40px;
 }
-/* line 369, ../sass/default.scss */
+/* line 391, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail .sub-title {
   color: #337ab7;
   font-size: 20px;
@@ -423,15 +449,15 @@ select.form-control {
   width: 90%;
   margin: 60px 0 10px;
 }
-/* line 375, ../sass/default.scss */
+/* line 397, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail .sub-title.ft {
   margin: 0 0 10px;
 }
-/* line 378, ../sass/default.scss */
+/* line 400, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail .sub-title + .line-detail {
   border-top: 0px;
 }
-/* line 382, ../sass/default.scss */
+/* line 404, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail .line-contract {
   width: 100%;
   margin: 0 auto 15px;
@@ -441,39 +467,39 @@ select.form-control {
   border-top: 1px dashed #dadada;
   padding: 15px 10px 0;
 }
-/* line 391, ../sass/default.scss */
+/* line 413, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail .line-contract.qt .header-detail {
   width: calc(100% - 110px);
 }
-/* line 394, ../sass/default.scss */
+/* line 416, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail .line-contract.qt .content-detail {
   width: 100px;
   text-align: right;
 }
-/* line 399, ../sass/default.scss */
+/* line 421, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail .line-contract.hr {
   border-top: 1px solid #ccc;
   border-bottom: 1px solid #ccc;
   padding: 15px 10px;
 }
-/* line 403, ../sass/default.scss */
+/* line 425, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail .line-contract.hr .header-detail {
   font-size: 18px;
 }
-/* line 406, ../sass/default.scss */
+/* line 428, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail .line-contract.hr .content-detail {
   color: #333;
   font-size: 18px;
 }
-/* line 410, ../sass/default.scss */
+/* line 432, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail .line-contract.hr + div {
   border: none;
 }
-/* line 414, ../sass/default.scss */
+/* line 436, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail .line-contract.file {
   padding: 15px 0 0;
 }
-/* line 416, ../sass/default.scss */
+/* line 438, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail .line-contract.file .file-box {
   height: 30px;
   line-height: 8px;
@@ -481,16 +507,16 @@ select.form-control {
   font-size: 13px;
   margin: 6px 0 0;
 }
-/* line 423, ../sass/default.scss */
+/* line 445, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail .line-contract.file .btn {
   float: right;
   margin: 0;
 }
-/* line 428, ../sass/default.scss */
+/* line 450, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail .line-contract.buttons {
   padding: 15px 0 0;
 }
-/* line 431, ../sass/default.scss */
+/* line 453, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail .line-contract:after {
   content: ".";
   display: block;
@@ -498,54 +524,54 @@ select.form-control {
   clear: both;
   visibility: hidden;
 }
-/* line 438, ../sass/default.scss */
+/* line 460, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail .line-contract:first-child, .cp-main .cp-content .cp-contract-detail .line-contract:last-child {
   border-top: 0px dashed #dadada;
 }
-/* line 441, ../sass/default.scss */
+/* line 463, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail .line-contract.middle {
   text-align: center;
 }
-/* line 444, ../sass/default.scss */
+/* line 466, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail .line-contract .header-detail {
   color: #000;
   font-weight: 500;
   float: left;
   width: 160px;
 }
-/* line 450, ../sass/default.scss */
+/* line 472, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail .line-contract ol.custom-module {
   background: rgba(0, 0, 0, 0.04);
   padding: 10px 10px 10px 30px;
   margin: 10px 0;
   border-radius: 4px;
 }
-/* line 456, ../sass/default.scss */
+/* line 478, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail .line-contract .content-detail {
   color: #888;
   float: right;
   width: calc(100% - 170px);
 }
-/* line 461, ../sass/default.scss */
+/* line 483, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail .line-contract .btn {
   width: auto;
   margin: 20px 0;
 }
-/* line 465, ../sass/default.scss */
+/* line 487, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail .line-contract .btn-gray {
   color: #333;
   background: #eee;
   border-color: #ccc;
 }
-/* line 469, ../sass/default.scss */
+/* line 491, ../sass/default.scss */
 .cp-main .cp-content .cp-contract-detail .line-contract .btn-gray:hover {
   background: #ddd;
 }
-/* line 475, ../sass/default.scss */
+/* line 497, ../sass/default.scss */
 .cp-main .cp-content .cp-requested-detail {
   padding: 40px 0;
 }
-/* line 477, ../sass/default.scss */
+/* line 499, ../sass/default.scss */
 .cp-main .cp-content .cp-requested-detail .line-detail {
   width: 80%;
   margin: 0 auto 15px;
@@ -555,7 +581,7 @@ select.form-control {
   border-top: 1px dashed #dadada;
   padding: 15px 0 0;
 }
-/* line 485, ../sass/default.scss */
+/* line 507, ../sass/default.scss */
 .cp-main .cp-content .cp-requested-detail .line-detail:after {
   content: ".";
   display: block;
@@ -563,44 +589,48 @@ select.form-control {
   clear: both;
   visibility: hidden;
 }
-/* line 492, ../sass/default.scss */
+/* line 514, ../sass/default.scss */
 .cp-main .cp-content .cp-requested-detail .line-detail:first-child, .cp-main .cp-content .cp-requested-detail .line-detail:last-child {
   border-top: 0px dashed #dadada;
 }
-/* line 495, ../sass/default.scss */
+/* line 517, ../sass/default.scss */
 .cp-main .cp-content .cp-requested-detail .line-detail.middle {
   text-align: center;
 }
-/* line 498, ../sass/default.scss */
+/* line 520, ../sass/default.scss */
 .cp-main .cp-content .cp-requested-detail .line-detail .header-detail {
   color: #000;
   font-weight: 500;
   float: left;
-  width: 150px;
+  width: 160px;
 }
-/* line 504, ../sass/default.scss */
+/* line 526, ../sass/default.scss */
 .cp-main .cp-content .cp-requested-detail .line-detail .content-detail {
   color: #888;
   float: right;
-  width: calc(100% - 160px);
+  width: calc(100% - 170px);
 }
-/* line 509, ../sass/default.scss */
+/* line 531, ../sass/default.scss */
 .cp-main .cp-content .cp-requested-detail .line-detail .btn {
   width: 150px;
   margin: 20px 0;
 }
-/* line 516, ../sass/default.scss */
+/* line 538, ../sass/default.scss */
+.cp-main .cp-content .cp-addsite-history > div {
+  margin: 0 0 30px;
+}
+/* line 541, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-history .box-request-history {
   margin: 0 0 30px;
 }
-/* line 519, ../sass/default.scss */
+/* line 544, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-history .sub-title {
   color: #888;
   font-size: 20px;
   font-weight: 400;
   margin: 0 0 20px;
 }
-/* line 525, ../sass/default.scss */
+/* line 550, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-history .item-history {
   border: 1px solid #ddd;
   padding: 10px 0 0;
@@ -609,7 +639,7 @@ select.form-control {
   border-radius: 4px;
   box-shadow: 0 -3px 0 rgba(0, 0, 0, 0.05) inset;
 }
-/* line 532, ../sass/default.scss */
+/* line 557, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-history .item-history:after {
   content: ".";
   display: block;
@@ -617,15 +647,15 @@ select.form-control {
   clear: both;
   visibility: hidden;
 }
-/* line 539, ../sass/default.scss */
+/* line 564, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-history .item-history:last-child {
   margin: 0;
 }
-/* line 544, ../sass/default.scss */
+/* line 569, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-history .item-history .fa {
   margin: 0 10px 0 0;
 }
-/* line 547, ../sass/default.scss */
+/* line 572, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-history .item-history .site-title-history {
   display: block;
   border-bottom: 1px solid #ddd;
@@ -634,11 +664,55 @@ select.form-control {
   text-transform: uppercase;
   font-size: 18px;
 }
-/* line 555, ../sass/default.scss */
+/* line 579, ../sass/default.scss */
+.cp-main .cp-content .cp-addsite-history .item-history .site-title-history strong {
+  margin: 0 0 0 10px;
+  color: #666;
+  font-weight: 600;
+}
+/* line 583, ../sass/default.scss */
+.cp-main .cp-content .cp-addsite-history .item-history .site-title-history strong:before {
+  content: "[";
+  padding: 0 5px 0 0;
+}
+/* line 587, ../sass/default.scss */
+.cp-main .cp-content .cp-addsite-history .item-history .site-title-history strong:after {
+  content: "]";
+  padding: 0 0 0 5px;
+}
+/* line 593, ../sass/default.scss */
+.cp-main .cp-content .cp-addsite-history .item-history .status-detail {
+  position: absolute;
+  right: -1px;
+  top: -1px;
+  background: #ddd;
+  color: #fff;
+  padding: 5px 20px;
+  font-size: 12px;
+  border-radius: 0 4px 0 4px;
+  box-shadow: 0 -3px 0 rgba(0, 0, 0, 0.05) inset;
+}
+/* line 603, ../sass/default.scss */
+.cp-main .cp-content .cp-addsite-history .item-history .status-detail.requested {
+  background: #5cb85c;
+}
+/* line 606, ../sass/default.scss */
+.cp-main .cp-content .cp-addsite-history .item-history .status-detail.confirmed {
+  background: #337ab7;
+}
+/* line 609, ../sass/default.scss */
+.cp-main .cp-content .cp-addsite-history .item-history .status-detail.purchased {
+  background: #d9534f;
+}
+/* line 612, ../sass/default.scss */
+.cp-main .cp-content .cp-addsite-history .item-history .status-detail.pending {
+  background: #ccc;
+}
+/* line 616, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-history .item-history .info-site {
   margin: 0 0 10px;
 }
-/* line 557, ../sass/default.scss */
+/* line 618, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-history .item-history .info-site:after {
   content: ".";
   display: block;
@@ -646,7 +720,7 @@ select.form-control {
   clear: both;
   visibility: hidden;
 }
-/* line 564, ../sass/default.scss */
+/* line 625, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-history .item-history .info-site .url-site {
   float: left;
   padding: 0 10px;
@@ -654,7 +728,7 @@ select.form-control {
   font-size: 13px;
   line-height: 34px;
 }
-/* line 571, ../sass/default.scss */
+/* line 632, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-history .item-history .info-site .time-site {
   float: left;
   padding: 0 10px;
@@ -662,7 +736,7 @@ select.form-control {
   font-size: 13px;
   line-height: 34px;
 }
-/* line 580, ../sass/default.scss */
+/* line 641, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-history .item-history .status-site {
   position: absolute;
   right: -1px;
@@ -674,19 +748,19 @@ select.form-control {
   border-radius: 0 4px 0 4px;
   box-shadow: 0 -3px 0 rgba(0, 0, 0, 0.05) inset;
 }
-/* line 590, ../sass/default.scss */
+/* line 651, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-history .item-history .status-site.tk-open {
   background: #5cb85c;
 }
-/* line 593, ../sass/default.scss */
+/* line 654, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-history .item-history .status-site.tk-close {
   background: #888888;
 }
-/* line 596, ../sass/default.scss */
+/* line 657, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-history .item-history .status-site.tk-processing {
   background: #9f57b9;
 }
-/* line 600, ../sass/default.scss */
+/* line 661, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-history .item-history .action-site {
   background: rgba(0, 0, 0, 0.02);
   padding: 10px;
@@ -695,45 +769,96 @@ select.form-control {
   display: block;
   text-align: right;
 }
-/* line 607, ../sass/default.scss */
+/* line 668, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-history .item-history .action-site a {
   margin: 0 0 0 6px;
 }
-/* line 610, ../sass/default.scss */
+/* line 671, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-history .item-history .action-site .btn-gray {
   color: #333;
   background: #eee;
   border-color: #ccc;
 }
-/* line 614, ../sass/default.scss */
+/* line 675, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-history .item-history .action-site .btn-gray:hover {
   background: #ddd;
 }
-/* line 621, ../sass/default.scss */
+/* line 682, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step0 {
-  border: 1px solid #ddd;
-  text-align: center;
-  padding: 50px 0;
-  border-radius: 4px;
-  width: 80%;
   margin: 80px auto 0;
+  width: 80%;
 }
-/* line 628, ../sass/default.scss */
-.cp-main .cp-content .cp-addsite-step0 .add-new {
-  display: inline-block;
-  font-size: 24px;
-  margin: 0 auto 10px;
+/* line 685, ../sass/default.scss */
+.cp-main .cp-content .cp-addsite-step0 a {
+  display: block;
+  margin: 0 0 30px;
+  border: 1px solid #eee;
   border-radius: 4px;
-  padding: 20px;
-  text-decoration: none;
+  padding: 50px 30px;
+  box-shadow: 0 -4px 0 rgba(0, 0, 0, 0.02) inset;
+  background: rgba(255, 255, 255, 0.02);
+  position: relative;
   color: #333;
   transition: 0.3s;
+  overflow: hidden;
+  text-decoration: none;
 }
-/* line 639, ../sass/default.scss */
-.cp-main .cp-content .cp-addsite-step0 .add-new:hover {
-  background: rgba(0, 0, 0, 0.05);
+/* line 698, ../sass/default.scss */
+.cp-main .cp-content .cp-addsite-step0 a .fa {
+  color: #ccc;
+  font-size: 30px;
+  margin: 0 20px 0 0;
+  text-shadow: 0 2px 0 #fff;
+  position: absolute;
+  left: 20px;
+  top: 50px;
+  line-height: 1;
+  z-index: 1;
 }
-/* line 643, ../sass/default.scss */
+/* line 709, ../sass/default.scss */
+.cp-main .cp-content .cp-addsite-step0 a .fa-sp {
+  right: -40px;
+  left: auto;
+  font-size: 300px;
+  top: -80px;
+  transform: rotate(10deg);
+  color: rgba(0, 0, 0, 0.03) !important;
+  text-shadow: none;
+  z-index: 0;
+}
+/* line 719, ../sass/default.scss */
+.cp-main .cp-content .cp-addsite-step0 a span {
+  font-size: 24px;
+  line-height: 30px;
+  display: block;
+  padding: 0 0 0 40px;
+  color: #666;
+  position: relative;
+  z-index: 1;
+}
+/* line 728, ../sass/default.scss */
+.cp-main .cp-content .cp-addsite-step0 a:hover {
+  border: 1px solid #ddd;
+  background: rgba(0, 0, 0, 0.02);
+}
+/* line 731, ../sass/default.scss */
+.cp-main .cp-content .cp-addsite-step0 a:hover .fa {
+  color: #337ab7;
+}
+/* line 734, ../sass/default.scss */
+.cp-main .cp-content .cp-addsite-step0 a:hover span {
+  color: #222;
+}
+/* line 740, ../sass/default.scss */
+.cp-main .cp-content .cp-addsite-step0 .add-new .fa {
+  left: 22px;
+}
+/* line 743, ../sass/default.scss */
+.cp-main .cp-content .cp-addsite-step0 .add-new .fa-sp {
+  left: auto;
+  right: 0;
+}
+/* line 750, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step0 .sp-text {
   display: block;
   font-style: italic;
@@ -741,7 +866,7 @@ select.form-control {
   position: relative;
   width: 150px;
 }
-/* line 649, ../sass/default.scss */
+/* line 756, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step0 .sp-text span {
   background: #fff;
   padding: 0 15px 0 10px;
@@ -749,22 +874,7 @@ select.form-control {
   z-index: 2;
   color: #888;
 }
-/* line 657, ../sass/default.scss */
-.cp-main .cp-content .cp-addsite-step0 .add-yours {
-  display: inline-block;
-  font-size: 24px;
-  margin: 0 auto 20px;
-  border-radius: 4px;
-  padding: 20px;
-  text-decoration: none;
-  color: #333;
-  transition: 0.3s;
-}
-/* line 668, ../sass/default.scss */
-.cp-main .cp-content .cp-addsite-step0 .add-yours:hover {
-  background: rgba(0, 0, 0, 0.05);
-}
-/* line 672, ../sass/default.scss */
+/* line 768, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step0 .box-add-yours {
   display: none;
   margin: 0 30px 30px;
@@ -775,7 +885,7 @@ select.form-control {
   text-align: left;
   box-shadow: 0 0 10px rgba(0, 0, 0, 0.04) inset;
 }
-/* line 681, ../sass/default.scss */
+/* line 777, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step0 .box-add-yours:before {
   content: "";
   width: 0;
@@ -788,19 +898,19 @@ select.form-control {
   top: -10px;
   margin: 0 0 0 -5px;
 }
-/* line 693, ../sass/default.scss */
+/* line 789, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step0 .box-add-yours label {
   display: block;
   font-size: 18px;
   font-weight: 400;
   margin: 0 0 10px;
 }
-/* line 699, ../sass/default.scss */
+/* line 795, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step0 .box-add-yours .text-add-info {
   resize: none;
   margin: 0 0 20px;
 }
-/* line 704, ../sass/default.scss */
+/* line 800, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step0 .box-add-yours .line-add:after {
   content: ".";
   display: block;
@@ -808,7 +918,7 @@ select.form-control {
   clear: both;
   visibility: hidden;
 }
-/* line 711, ../sass/default.scss */
+/* line 807, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step0 .box-add-yours .line-add .notice-text {
   float: right;
   width: calc(100% - 80px);
@@ -818,14 +928,14 @@ select.form-control {
   color: #888;
   letter-spacing: 0.02em;
 }
-/* line 723, ../sass/default.scss */
+/* line 819, ../sass/default.scss */
 .cp-main .cp-content .cp-progress {
   position: relative;
   height: 60px;
   margin: 50px auto;
   width: 60%;
 }
-/* line 728, ../sass/default.scss */
+/* line 824, ../sass/default.scss */
 .cp-main .cp-content .cp-progress .tag-step {
   display: block;
   position: relative;
@@ -835,7 +945,7 @@ select.form-control {
   font-size: 12px;
   border-radius: 4px;
 }
-/* line 736, ../sass/default.scss */
+/* line 832, ../sass/default.scss */
 .cp-main .cp-content .cp-progress .tag-step:before {
   content: "";
   width: 0;
@@ -848,12 +958,12 @@ select.form-control {
   top: -6px;
   margin: 0 0 0 -6px;
 }
-/* line 748, ../sass/default.scss */
+/* line 844, ../sass/default.scss */
 .cp-main .cp-content .cp-progress .tag-step.active {
   background: #337ab7;
   color: #fff;
 }
-/* line 751, ../sass/default.scss */
+/* line 847, ../sass/default.scss */
 .cp-main .cp-content .cp-progress .tag-step.active:before {
   content: "";
   width: 0;
@@ -866,30 +976,30 @@ select.form-control {
   top: -6px;
   margin: 0 0 0 -6px;
 }
-/* line 765, ../sass/default.scss */
+/* line 861, ../sass/default.scss */
 .cp-main .cp-content .cp-progress .step1 {
   position: absolute;
-  left: -10px;
+  left: -4px;
 }
-/* line 769, ../sass/default.scss */
+/* line 865, ../sass/default.scss */
 .cp-main .cp-content .cp-progress .step2 {
   position: absolute;
   left: 50%;
   transform: translateX(-50%);
 }
-/* line 774, ../sass/default.scss */
+/* line 870, ../sass/default.scss */
 .cp-main .cp-content .cp-progress .step3 {
   position: absolute;
   right: -10px;
 }
-/* line 779, ../sass/default.scss */
+/* line 875, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 {
   width: 80%;
   margin: 0 auto;
   position: relative;
   overflow: hidden;
 }
-/* line 785, ../sass/default.scss */
+/* line 881, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form {
   border-radius: 4px;
   border: 1px solid #ddd;
@@ -897,15 +1007,15 @@ select.form-control {
   position: relative;
   padding: 0 0 64px;
 }
-/* line 792, ../sass/default.scss */
+/* line 888, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form.form2 {
   display: none;
 }
-/* line 795, ../sass/default.scss */
+/* line 891, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form.form3 {
   display: none;
 }
-/* line 798, ../sass/default.scss */
+/* line 894, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .form-title {
   border-bottom: 1px solid #ddd;
   margin: 0 20px 30px;
@@ -914,7 +1024,7 @@ select.form-control {
   color: #666;
   padding: 20px 0;
 }
-/* line 806, ../sass/default.scss */
+/* line 902, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .form-sub-title {
   font-size: 18px;
   color: #888;
@@ -922,7 +1032,7 @@ select.form-control {
   margin: 0;
   position: relative;
 }
-/* line 812, ../sass/default.scss */
+/* line 908, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .form-sub-title:before {
   content: "";
   height: 100%;
@@ -934,13 +1044,13 @@ select.form-control {
   display: block;
   border-radius: 4px;
 }
-/* line 824, ../sass/default.scss */
+/* line 920, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .default-mod-list {
   margin: 0;
   list-style: none;
   padding: 0;
 }
-/* line 828, ../sass/default.scss */
+/* line 924, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .default-mod-list .item-mod {
   border: 1px solid #ddd;
   border-radius: 4px;
@@ -952,7 +1062,7 @@ select.form-control {
   vertical-align: top;
   overflow: hidden;
 }
-/* line 838, ../sass/default.scss */
+/* line 934, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .default-mod-list .item-mod:before {
   width: 20px;
   height: 20px;
@@ -963,25 +1073,25 @@ select.form-control {
   top: -10px;
   transform: rotate(-45deg);
 }
-/* line 848, ../sass/default.scss */
+/* line 944, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .default-mod-list .item-mod:nth-child(3), .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .default-mod-list .item-mod:nth-child(6) {
   margin: 0 0 10px;
 }
-/* line 851, ../sass/default.scss */
+/* line 947, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .default-mod-list .item-mod .mod-name {
   font-size: 18px;
   display: block;
 }
-/* line 856, ../sass/default.scss */
+/* line 952, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .default-mod-list .item-mod .mod-info {
   font-size: 13px;
   color: #aaa;
 }
-/* line 862, ../sass/default.scss */
+/* line 958, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .box-drop {
   display: flex;
 }
-/* line 864, ../sass/default.scss */
+/* line 960, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .box-drop .additional-mod-list {
   flex: 1;
   width: 50%;
@@ -993,11 +1103,11 @@ select.form-control {
   position: relative;
   box-shadow: 0 0 10px rgba(0, 0, 0, 0.05) inset;
 }
-/* line 874, ../sass/default.scss */
+/* line 970, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .box-drop .additional-mod-list .item-mod {
   margin: 0 0 15px;
 }
-/* line 876, ../sass/default.scss */
+/* line 972, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .box-drop .additional-mod-list .item-mod span {
   background: rgba(255, 255, 255, 0.5);
   border: 1px solid rgba(0, 0, 0, 0.1);
@@ -1009,7 +1119,7 @@ select.form-control {
   position: relative;
   cursor: pointer;
 }
-/* line 886, ../sass/default.scss */
+/* line 982, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .box-drop .additional-mod-list .item-mod span:before {
   content: "";
   height: calc(100% - 10px);
@@ -1020,7 +1130,7 @@ select.form-control {
   background: #337ab7;
   display: block;
 }
-/* line 900, ../sass/default.scss */
+/* line 996, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .box-drop .selected-mod-list {
   flex: 1;
   width: 50%;
@@ -1032,7 +1142,7 @@ select.form-control {
   position: relative;
   box-shadow: 0 0 10px rgba(0, 0, 0, 0.05) inset;
 }
-/* line 910, ../sass/default.scss */
+/* line 1006, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .box-drop .selected-mod-list:empty:before {
   content: "Drop item here to select";
   position: absolute;
@@ -1044,11 +1154,11 @@ select.form-control {
   width: 100%;
   text-align: center;
 }
-/* line 921, ../sass/default.scss */
+/* line 1017, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .box-drop .selected-mod-list .item-mod {
   margin: 0 0 15px;
 }
-/* line 923, ../sass/default.scss */
+/* line 1019, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .box-drop .selected-mod-list .item-mod span {
   background: rgba(255, 255, 255, 0.5);
   border: 1px solid rgba(0, 0, 0, 0.1);
@@ -1060,7 +1170,7 @@ select.form-control {
   position: relative;
   cursor: pointer;
 }
-/* line 933, ../sass/default.scss */
+/* line 1029, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .box-drop .selected-mod-list .item-mod span:before {
   content: "";
   height: calc(100% - 10px);
@@ -1071,11 +1181,11 @@ select.form-control {
   background: #337ab7;
   display: block;
 }
-/* line 948, ../sass/default.scss */
+/* line 1044, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .line-add {
   margin: 0 20px 20px;
 }
-/* line 950, ../sass/default.scss */
+/* line 1046, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .line-add:after {
   content: ".";
   display: block;
@@ -1083,7 +1193,7 @@ select.form-control {
   clear: both;
   visibility: hidden;
 }
-/* line 957, ../sass/default.scss */
+/* line 1053, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .line-add label {
   float: left;
   width: 25%;
@@ -1093,12 +1203,12 @@ select.form-control {
   padding: 8px 0;
   text-align: left;
 }
-/* line 966, ../sass/default.scss */
+/* line 1062, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .line-add .form-control {
   float: right;
   width: 75%;
 }
-/* line 970, ../sass/default.scss */
+/* line 1066, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .line-add.box-buttons {
   position: absolute;
   left: 0;
@@ -1107,14 +1217,14 @@ select.form-control {
   text-align: center;
   margin: 0;
 }
-/* line 977, ../sass/default.scss */
+/* line 1073, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .line-add.box-buttons .btn {
-  width: 140px;
+  width: 160px;
   display: inline-block;
   margin: 0 50px;
   float: none;
 }
-/* line 987, ../sass/default.scss */
+/* line 1083, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .line-add .title-custom-check {
   display: inline-block;
   float: none;
@@ -1123,38 +1233,38 @@ select.form-control {
   color: #888;
   margin: 0 0 10px;
 }
-/* line 996, ../sass/default.scss */
+/* line 1092, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .line-add .custom-check {
   margin: 9px 5px 0 0;
   display: inline-block;
   vertical-align: top;
 }
-/* line 1001, ../sass/default.scss */
+/* line 1097, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .line-add .custom-check2 {
   margin: 9px 5px 0 0;
   display: inline-block;
   vertical-align: top;
 }
-/* line 1006, ../sass/default.scss */
+/* line 1102, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .line-add .custom-module-detail {
   float: none;
   width: 100%;
   resize: none;
 }
-/* line 1011, ../sass/default.scss */
+/* line 1107, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .line-add .custom-template-detail {
   float: none;
   width: 100%;
   resize: none;
 }
-/* line 1016, ../sass/default.scss */
+/* line 1112, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .line-add .text-line {
   display: block;
   font-size: 18px;
   color: #888;
   margin: 0 0 10px;
 }
-/* line 1022, ../sass/default.scss */
+/* line 1118, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .line-add .title-rwd-check {
   display: inline-block;
   float: none;
@@ -1163,13 +1273,13 @@ select.form-control {
   color: #888;
   margin: 0 0 10px;
 }
-/* line 1031, ../sass/default.scss */
+/* line 1127, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .line-add .rwd-check {
   margin: 9px 5px 0 0;
   display: inline-block;
   vertical-align: top;
 }
-/* line 1037, ../sass/default.scss */
+/* line 1133, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .box-check-host {
   display: none;
   clear: both;
@@ -1180,23 +1290,23 @@ select.form-control {
   border-radius: 4px;
   padding: 20px;
 }
-/* line 1046, ../sass/default.scss */
+/* line 1142, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .box-check-host .text-check {
   color: #666;
   display: block;
   margin: 0 0 10px;
 }
-/* line 1051, ../sass/default.scss */
+/* line 1147, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .box-check-host .line-check-host {
   margin: 0 0 20px;
 }
-/* line 1053, ../sass/default.scss */
+/* line 1149, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .box-check-host .line-check-host input[type="radio"] {
   display: inline-block;
   margin: 0;
   vertical-align: middle;
 }
-/* line 1058, ../sass/default.scss */
+/* line 1154, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .box-check-host .line-check-host label {
   display: inline-block;
   float: none;
@@ -1206,37 +1316,37 @@ select.form-control {
   vertical-align: middle;
   margin: 0;
 }
-/* line 1067, ../sass/default.scss */
+/* line 1163, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .box-check-host .line-check-host .form-control {
   float: none;
   width: 100%;
 }
-/* line 1071, ../sass/default.scss */
+/* line 1167, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .box-check-host .line-check-host textarea {
   resize: none;
 }
-/* line 1074, ../sass/default.scss */
+/* line 1170, ../sass/default.scss */
 .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .box-check-host .line-check-host .text-check {
   color: #666;
   display: block;
   margin: 0 0 10px;
   padding: 0;
 }
-/* line 1085, ../sass/default.scss */
+/* line 1181, ../sass/default.scss */
 .cp-main .cp-content .box-add-yours {
   display: none;
 }
-/* line 1088, ../sass/default.scss */
+/* line 1184, ../sass/default.scss */
 .cp-main .cp-content .cp-profile-setting {
   padding: 40px 0;
 }
-/* line 1090, ../sass/default.scss */
+/* line 1186, ../sass/default.scss */
 .cp-main .cp-content .cp-profile-setting .line-profile {
   display: block;
   margin: 0 auto 30px;
   width: 80%;
 }
-/* line 1094, ../sass/default.scss */
+/* line 1190, ../sass/default.scss */
 .cp-main .cp-content .cp-profile-setting .line-profile:after {
   content: ".";
   display: block;
@@ -1244,7 +1354,7 @@ select.form-control {
   clear: both;
   visibility: hidden;
 }
-/* line 1101, ../sass/default.scss */
+/* line 1197, ../sass/default.scss */
 .cp-main .cp-content .cp-profile-setting .line-profile label {
   float: left;
   width: 25%;
@@ -1253,38 +1363,38 @@ select.form-control {
   line-height: 1;
   padding: 8px 0;
 }
-/* line 1109, ../sass/default.scss */
+/* line 1205, ../sass/default.scss */
 .cp-main .cp-content .cp-profile-setting .line-profile input {
   float: right;
   width: 75%;
 }
-/* line 1113, ../sass/default.scss */
+/* line 1209, ../sass/default.scss */
 .cp-main .cp-content .cp-profile-setting .line-profile textarea {
   float: right;
   width: 75%;
   min-height: 10em;
   resize: none;
 }
-/* line 1119, ../sass/default.scss */
+/* line 1215, ../sass/default.scss */
 .cp-main .cp-content .cp-profile-setting .line-profile .link-profile {
   display: block;
   text-align: center;
 }
-/* line 1123, ../sass/default.scss */
+/* line 1219, ../sass/default.scss */
 .cp-main .cp-content .cp-profile-setting .line-profile .pull-r {
   float: right;
   width: 75%;
   text-align: center;
 }
-/* line 1129, ../sass/default.scss */
+/* line 1225, ../sass/default.scss */
 .cp-main .cp-content .cp-profile-setting .line-profile .pull-r .btn {
   width: 100%;
 }
-/* line 1134, ../sass/default.scss */
+/* line 1230, ../sass/default.scss */
 .cp-main .cp-content .cp-function-box {
   margin: 0 0 30px;
 }
-/* line 1136, ../sass/default.scss */
+/* line 1232, ../sass/default.scss */
 .cp-main .cp-content .cp-function-box:after {
   content: ".";
   display: block;
@@ -1292,32 +1402,32 @@ select.form-control {
   clear: both;
   visibility: hidden;
 }
-/* line 1143, ../sass/default.scss */
+/* line 1239, ../sass/default.scss */
 .cp-main .cp-content .cp-function-box .pull-right {
   margin: 0 0 0 10px;
 }
-/* line 1146, ../sass/default.scss */
+/* line 1242, ../sass/default.scss */
 .cp-main .cp-content .cp-function-box .btn-gray {
   color: #333;
   background: #eee;
   border-color: #ccc;
 }
-/* line 1150, ../sass/default.scss */
+/* line 1246, ../sass/default.scss */
 .cp-main .cp-content .cp-function-box .btn-gray:hover {
   background: #ddd;
 }
-/* line 1154, ../sass/default.scss */
+/* line 1250, ../sass/default.scss */
 .cp-main .cp-content .cp-function-box label {
   color: #666;
   margin-right: 10px;
   margin-bottom: 5px;
 }
-/* line 1159, ../sass/default.scss */
+/* line 1255, ../sass/default.scss */
 .cp-main .cp-content .cp-function-box .cp-search-box {
   float: left;
   width: 70%;
 }
-/* line 1162, ../sass/default.scss */
+/* line 1258, ../sass/default.scss */
 .cp-main .cp-content .cp-function-box .cp-search-box:after {
   content: ".";
   display: block;
@@ -1325,7 +1435,7 @@ select.form-control {
   clear: both;
   visibility: hidden;
 }
-/* line 1170, ../sass/default.scss */
+/* line 1266, ../sass/default.scss */
 .cp-main .cp-content .cp-function-box .cp-search-box form:after {
   content: ".";
   display: block;
@@ -1333,39 +1443,39 @@ select.form-control {
   clear: both;
   visibility: hidden;
 }
-/* line 1177, ../sass/default.scss */
+/* line 1273, ../sass/default.scss */
 .cp-main .cp-content .cp-function-box .cp-search-box form > * {
   float: left;
   margin: 0 2% 0 0;
 }
-/* line 1180, ../sass/default.scss */
+/* line 1276, ../sass/default.scss */
 .cp-main .cp-content .cp-function-box .cp-search-box form > *:last-child {
   margin: 0;
 }
-/* line 1185, ../sass/default.scss */
+/* line 1281, ../sass/default.scss */
 .cp-main .cp-content .cp-function-box .cp-search-box .cp-select {
   width: 28%;
 }
-/* line 1188, ../sass/default.scss */
+/* line 1284, ../sass/default.scss */
 .cp-main .cp-content .cp-function-box .cp-search-box .cp-input {
   width: calc(68% - 120px);
 }
-/* line 1191, ../sass/default.scss */
+/* line 1287, ../sass/default.scss */
 .cp-main .cp-content .cp-function-box .cp-search-box .cp-submit {
   width: 40px;
   margin: 0 10px 0 0;
 }
-/* line 1195, ../sass/default.scss */
+/* line 1291, ../sass/default.scss */
 .cp-main .cp-content .cp-function-box .cp-search-box .cp-reset {
   width: 70px;
 }
-/* line 1199, ../sass/default.scss */
+/* line 1295, ../sass/default.scss */
 .cp-main .cp-content .cp-function-box.bottom {
   position: absolute;
   right: 30px;
   bottom: 0;
 }
-/* line 1205, ../sass/default.scss */
+/* line 1301, ../sass/default.scss */
 .cp-main .cp-content .cp-message-box {
   border: 1px solid #ddd;
   border-radius: 4px;
@@ -1374,28 +1484,28 @@ select.form-control {
   margin: 0 0 20px;
   text-align: center;
 }
-/* line 1214, ../sass/default.scss */
+/* line 1310, ../sass/default.scss */
 .cp-main .cp-content .cp-loading-box {
   padding: 40px 0;
   text-align: center;
 }
-/* line 1217, ../sass/default.scss */
+/* line 1313, ../sass/default.scss */
 .cp-main .cp-content .cp-loading-box .loading-text {
   color: #888;
   display: block;
   margin: 0 0 20px;
 }
-/* line 1222, ../sass/default.scss */
+/* line 1318, ../sass/default.scss */
 .cp-main .cp-content .cp-loading-box .fa {
   color: #ccc;
 }
-/* line 1226, ../sass/default.scss */
+/* line 1322, ../sass/default.scss */
 .cp-main .cp-content .list-servers {
   margin: 0 0 20px;
   padding: 0;
   list-style: none;
 }
-/* line 1230, ../sass/default.scss */
+/* line 1326, ../sass/default.scss */
 .cp-main .cp-content .list-servers .item-servers {
   border: 1px solid #ddd;
   padding: 10px 0 0;
@@ -1404,11 +1514,11 @@ select.form-control {
   border-radius: 4px;
   box-shadow: 0 -3px 0 rgba(0, 0, 0, 0.05) inset;
 }
-/* line 1237, ../sass/default.scss */
+/* line 1333, ../sass/default.scss */
 .cp-main .cp-content .list-servers .item-servers:last-child {
   margin: 0;
 }
-/* line 1240, ../sass/default.scss */
+/* line 1336, ../sass/default.scss */
 .cp-main .cp-content .list-servers .item-servers .name-server {
   display: block;
   border-bottom: 1px solid #ddd;
@@ -1417,18 +1527,18 @@ select.form-control {
   text-transform: uppercase;
   font-size: 18px;
 }
-/* line 1248, ../sass/default.scss */
+/* line 1344, ../sass/default.scss */
 .cp-main .cp-content .list-servers .item-servers .info-server {
   margin: 0 0 10px;
 }
-/* line 1250, ../sass/default.scss */
+/* line 1346, ../sass/default.scss */
 .cp-main .cp-content .list-servers .item-servers .info-server .address-server {
   display: block;
   text-decoration: none;
   margin: 0 0 10px;
   padding: 0 10px;
 }
-/* line 1255, ../sass/default.scss */
+/* line 1351, ../sass/default.scss */
 .cp-main .cp-content .list-servers .item-servers .info-server .address-server a {
   display: block;
   position: relative;
@@ -1436,7 +1546,7 @@ select.form-control {
   word-wrap: break-word;
   word-break: break-all;
 }
-/* line 1261, ../sass/default.scss */
+/* line 1357, ../sass/default.scss */
 .cp-main .cp-content .list-servers .item-servers .info-server .address-server a .fa {
   color: #888;
   font-size: 12px;
@@ -1444,7 +1554,7 @@ select.form-control {
   left: 0;
   top: 7px;
 }
-/* line 1270, ../sass/default.scss */
+/* line 1366, ../sass/default.scss */
 .cp-main .cp-content .list-servers .item-servers .info-server .regdate-server {
   display: block;
   font-size: 13px;
@@ -1452,12 +1562,12 @@ select.form-control {
   padding: 0 10px 0 32px;
   position: relative;
 }
-/* line 1276, ../sass/default.scss */
+/* line 1372, ../sass/default.scss */
 .cp-main .cp-content .list-servers .item-servers .info-server .regdate-server a {
   word-wrap: break-word;
   word-break: break-all;
 }
-/* line 1280, ../sass/default.scss */
+/* line 1376, ../sass/default.scss */
 .cp-main .cp-content .list-servers .item-servers .info-server .regdate-server .fa {
   color: #888;
   font-size: 12px;
@@ -1465,7 +1575,7 @@ select.form-control {
   left: 11px;
   top: 3px;
 }
-/* line 1289, ../sass/default.scss */
+/* line 1385, ../sass/default.scss */
 .cp-main .cp-content .list-servers .item-servers .status-server {
   position: absolute;
   right: -1px;
@@ -1477,15 +1587,15 @@ select.form-control {
   border-radius: 0 4px 0 4px;
   box-shadow: 0 -3px 0 rgba(0, 0, 0, 0.05) inset;
 }
-/* line 1299, ../sass/default.scss */
+/* line 1395, ../sass/default.scss */
 .cp-main .cp-content .list-servers .item-servers .status-server.online {
   background: #5cb85c;
 }
-/* line 1302, ../sass/default.scss */
+/* line 1398, ../sass/default.scss */
 .cp-main .cp-content .list-servers .item-servers .status-server.offline {
   background: #d9534f;
 }
-/* line 1306, ../sass/default.scss */
+/* line 1402, ../sass/default.scss */
 .cp-main .cp-content .list-servers .item-servers .action-server {
   background: rgba(0, 0, 0, 0.02);
   padding: 10px;
@@ -1494,27 +1604,27 @@ select.form-control {
   display: block;
   text-align: right;
 }
-/* line 1313, ../sass/default.scss */
+/* line 1409, ../sass/default.scss */
 .cp-main .cp-content .list-servers .item-servers .action-server a {
   margin: 0 0 0 6px;
 }
-/* line 1316, ../sass/default.scss */
+/* line 1412, ../sass/default.scss */
 .cp-main .cp-content .list-servers .item-servers .action-server .btn-gray {
   color: #333;
   background: #eee;
   border-color: #ccc;
 }
-/* line 1320, ../sass/default.scss */
+/* line 1416, ../sass/default.scss */
 .cp-main .cp-content .list-servers .item-servers .action-server .btn-gray:hover {
   background: #ddd;
 }
-/* line 1327, ../sass/default.scss */
+/* line 1423, ../sass/default.scss */
 .cp-main .cp-content .list-ticket {
   margin: 0 0 20px;
   padding: 0;
   list-style: none;
 }
-/* line 1331, ../sass/default.scss */
+/* line 1427, ../sass/default.scss */
 .cp-main .cp-content .list-ticket li {
   border: 1px solid #ddd;
   padding: 10px 0 0;
@@ -1523,7 +1633,7 @@ select.form-control {
   border-radius: 4px;
   box-shadow: 0 -3px 0 rgba(0, 0, 0, 0.05) inset;
 }
-/* line 1338, ../sass/default.scss */
+/* line 1434, ../sass/default.scss */
 .cp-main .cp-content .list-ticket li:after {
   content: ".";
   display: block;
@@ -1531,15 +1641,15 @@ select.form-control {
   clear: both;
   visibility: hidden;
 }
-/* line 1345, ../sass/default.scss */
+/* line 1441, ../sass/default.scss */
 .cp-main .cp-content .list-ticket li:last-child {
   margin: 0;
 }
-/* line 1350, ../sass/default.scss */
+/* line 1446, ../sass/default.scss */
 .cp-main .cp-content .list-ticket li .fa {
   margin: 0 10px 0 0;
 }
-/* line 1353, ../sass/default.scss */
+/* line 1449, ../sass/default.scss */
 .cp-main .cp-content .list-ticket li .subject-ticket {
   display: block;
   border-bottom: 1px solid #ddd;
@@ -1548,11 +1658,11 @@ select.form-control {
   text-transform: uppercase;
   font-size: 18px;
 }
-/* line 1361, ../sass/default.scss */
+/* line 1457, ../sass/default.scss */
 .cp-main .cp-content .list-ticket li .info-ticket {
   margin: 0 0 10px;
 }
-/* line 1363, ../sass/default.scss */
+/* line 1459, ../sass/default.scss */
 .cp-main .cp-content .list-ticket li .info-ticket:after {
   content: ".";
   display: block;
@@ -1560,7 +1670,7 @@ select.form-control {
   clear: both;
   visibility: hidden;
 }
-/* line 1370, ../sass/default.scss */
+/* line 1466, ../sass/default.scss */
 .cp-main .cp-content .list-ticket li .info-ticket .number-ticket {
   float: left;
   padding: 0 10px;
@@ -1568,7 +1678,7 @@ select.form-control {
   font-size: 13px;
   line-height: 34px;
 }
-/* line 1377, ../sass/default.scss */
+/* line 1473, ../sass/default.scss */
 .cp-main .cp-content .list-ticket li .info-ticket .type-ticket {
   float: left;
   padding: 0 10px;
@@ -1576,7 +1686,7 @@ select.form-control {
   font-size: 13px;
   line-height: 34px;
 }
-/* line 1384, ../sass/default.scss */
+/* line 1480, ../sass/default.scss */
 .cp-main .cp-content .list-ticket li .info-ticket .time-ticket {
   float: left;
   padding: 0 10px;
@@ -1584,7 +1694,7 @@ select.form-control {
   font-size: 13px;
   line-height: 34px;
 }
-/* line 1393, ../sass/default.scss */
+/* line 1489, ../sass/default.scss */
 .cp-main .cp-content .list-ticket li .status-ticket {
   position: absolute;
   right: -1px;
@@ -1596,19 +1706,19 @@ select.form-control {
   border-radius: 0 4px 0 4px;
   box-shadow: 0 -3px 0 rgba(0, 0, 0, 0.05) inset;
 }
-/* line 1403, ../sass/default.scss */
+/* line 1499, ../sass/default.scss */
 .cp-main .cp-content .list-ticket li .status-ticket.tk-open {
   background: #5cb85c;
 }
-/* line 1406, ../sass/default.scss */
+/* line 1502, ../sass/default.scss */
 .cp-main .cp-content .list-ticket li .status-ticket.tk-close {
   background: #888888;
 }
-/* line 1409, ../sass/default.scss */
+/* line 1505, ../sass/default.scss */
 .cp-main .cp-content .list-ticket li .status-ticket.tk-processing {
   background: #9f57b9;
 }
-/* line 1413, ../sass/default.scss */
+/* line 1509, ../sass/default.scss */
 .cp-main .cp-content .list-ticket li .action-ticket {
   background: rgba(0, 0, 0, 0.02);
   padding: 10px;
@@ -1617,21 +1727,21 @@ select.form-control {
   display: block;
   text-align: right;
 }
-/* line 1420, ../sass/default.scss */
+/* line 1516, ../sass/default.scss */
 .cp-main .cp-content .list-ticket li .action-ticket a {
   margin: 0 0 0 6px;
 }
-/* line 1423, ../sass/default.scss */
+/* line 1519, ../sass/default.scss */
 .cp-main .cp-content .list-ticket li .action-ticket .btn-gray {
   color: #333;
   background: #eee;
   border-color: #ccc;
 }
-/* line 1427, ../sass/default.scss */
+/* line 1523, ../sass/default.scss */
 .cp-main .cp-content .list-ticket li .action-ticket .btn-gray:hover {
   background: #ddd;
 }
-/* line 1434, ../sass/default.scss */
+/* line 1530, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket {
   border: 1px solid #ddd;
   padding: 10px 0 0;
@@ -1640,7 +1750,7 @@ select.form-control {
   border-radius: 4px;
   box-shadow: 0 -3px 0 rgba(0, 0, 0, 0.05) inset;
 }
-/* line 1441, ../sass/default.scss */
+/* line 1537, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket:after {
   content: ".";
   display: block;
@@ -1648,19 +1758,19 @@ select.form-control {
   clear: both;
   visibility: hidden;
 }
-/* line 1448, ../sass/default.scss */
+/* line 1544, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket:last-child {
   margin: 0;
 }
-/* line 1453, ../sass/default.scss */
+/* line 1549, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .header-comments {
   border-bottom: 1px solid #ddd;
 }
-/* line 1455, ../sass/default.scss */
+/* line 1551, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .header-comments .fa {
   margin: 0 10px 0 0;
 }
-/* line 1458, ../sass/default.scss */
+/* line 1554, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .header-comments .subject-ticket {
   display: block;
   border-bottom: 1px solid #ddd;
@@ -1669,11 +1779,11 @@ select.form-control {
   text-transform: uppercase;
   font-size: 18px;
 }
-/* line 1466, ../sass/default.scss */
+/* line 1562, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .header-comments .info-ticket {
   margin: 0 0 10px;
 }
-/* line 1468, ../sass/default.scss */
+/* line 1564, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .header-comments .info-ticket:after {
   content: ".";
   display: block;
@@ -1681,7 +1791,7 @@ select.form-control {
   clear: both;
   visibility: hidden;
 }
-/* line 1475, ../sass/default.scss */
+/* line 1571, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .header-comments .info-ticket .number-ticket {
   float: left;
   padding: 0 10px;
@@ -1689,7 +1799,7 @@ select.form-control {
   font-size: 13px;
   line-height: 34px;
 }
-/* line 1482, ../sass/default.scss */
+/* line 1578, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .header-comments .info-ticket .type-ticket {
   float: left;
   padding: 0 10px;
@@ -1697,7 +1807,7 @@ select.form-control {
   font-size: 13px;
   line-height: 34px;
 }
-/* line 1489, ../sass/default.scss */
+/* line 1585, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .header-comments .info-ticket .time-ticket {
   float: left;
   padding: 0 10px;
@@ -1705,7 +1815,7 @@ select.form-control {
   font-size: 13px;
   line-height: 34px;
 }
-/* line 1498, ../sass/default.scss */
+/* line 1594, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .header-comments .status-ticket {
   position: absolute;
   right: -1px;
@@ -1717,27 +1827,27 @@ select.form-control {
   border-radius: 0 4px 0 4px;
   box-shadow: 0 -3px 0 rgba(0, 0, 0, 0.05) inset;
 }
-/* line 1508, ../sass/default.scss */
+/* line 1604, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .header-comments .status-ticket.tk-open {
   background: #5cb85c;
 }
-/* line 1511, ../sass/default.scss */
+/* line 1607, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .header-comments .status-ticket.tk-close {
   background: #888888;
 }
-/* line 1514, ../sass/default.scss */
+/* line 1610, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .header-comments .status-ticket.tk-processing {
   background: #9f57b9;
 }
-/* line 1519, ../sass/default.scss */
+/* line 1615, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .comments-group {
   border-bottom: 40px solid #eee;
 }
-/* line 1521, ../sass/default.scss */
+/* line 1617, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .comments-group:last-child {
   border-bottom: 0;
 }
-/* line 1524, ../sass/default.scss */
+/* line 1620, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .comments-group .post-comments {
   color: #888;
   padding: 20px 30px 30px;
@@ -1745,32 +1855,32 @@ select.form-control {
   text-align: justify;
   line-height: 2;
 }
-/* line 1530, ../sass/default.scss */
+/* line 1626, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .comments-group .post-comments a {
   color: #337ab7;
   text-decoration: underline;
   word-wrap: break-word;
   word-break: break-all;
 }
-/* line 1536, ../sass/default.scss */
+/* line 1632, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .comments-group .post-comments p {
   text-align: justify;
   line-height: 2;
 }
-/* line 1540, ../sass/default.scss */
+/* line 1636, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .comments-group .post-comments br {
   content: "";
   clear: both;
   display: block;
   margin: 0 0 10px;
 }
-/* line 1546, ../sass/default.scss */
+/* line 1642, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .comments-group .post-comments img {
   max-width: 100%;
   height: auto;
   margin: 0 0 20px;
 }
-/* line 1553, ../sass/default.scss */
+/* line 1649, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .comments-group .talk-comments .box-talk {
   margin: 0 30px 30px;
   border: 1px solid #ddd;
@@ -1780,7 +1890,7 @@ select.form-control {
   overflow: hidden;
   background: rgba(0, 0, 0, 0.015);
 }
-/* line 1562, ../sass/default.scss */
+/* line 1658, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .comments-group .talk-comments .box-talk .header-talk .talk-title {
   background: #337ab7;
   color: #fff;
@@ -1791,7 +1901,7 @@ select.form-control {
   position: relative;
   padding: 10px 10px 10px 35px;
 }
-/* line 1571, ../sass/default.scss */
+/* line 1667, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .comments-group .talk-comments .box-talk .header-talk .talk-title .fa {
   font-size: 18px;
   line-height: 20px;
@@ -1802,22 +1912,22 @@ select.form-control {
   padding: 0;
   margin: 0;
 }
-/* line 1583, ../sass/default.scss */
+/* line 1679, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .comments-group .talk-comments .box-talk .response-talk {
   border-bottom: 1px solid #ddd;
   margin: 0 0 20px;
 }
-/* line 1586, ../sass/default.scss */
+/* line 1682, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .comments-group .talk-comments .box-talk .response-talk:last-child {
   border-bottom: 0;
   margin: 0;
 }
-/* line 1590, ../sass/default.scss */
+/* line 1686, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .comments-group .talk-comments .box-talk .response-talk .author-talk {
   padding: 10px 30px;
   position: relative;
 }
-/* line 1593, ../sass/default.scss */
+/* line 1689, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .comments-group .talk-comments .box-talk .response-talk .author-talk .pic-author {
   height: 30px;
   width: 30px;
@@ -1827,19 +1937,19 @@ select.form-control {
   margin: 0 10px 0 0;
   vertical-align: middle;
 }
-/* line 1602, ../sass/default.scss */
+/* line 1698, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .comments-group .talk-comments .box-talk .response-talk .author-talk .pic-author img {
   height: 100%;
   width: auto;
   margin: 0 0 20px;
 }
-/* line 1607, ../sass/default.scss */
+/* line 1703, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .comments-group .talk-comments .box-talk .response-talk .author-talk .name-author {
   font-size: 18px;
   display: inline-block;
   vertical-align: middle;
 }
-/* line 1612, ../sass/default.scss */
+/* line 1708, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .comments-group .talk-comments .box-talk .response-talk .author-talk .time-author {
   display: inline-block;
   vertical-align: middle;
@@ -1850,7 +1960,7 @@ select.form-control {
   font-size: 13px;
   line-height: 18px;
 }
-/* line 1621, ../sass/default.scss */
+/* line 1717, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .comments-group .talk-comments .box-talk .response-talk .author-talk .time-author:before {
   content: "";
   width: 8px;
@@ -1860,7 +1970,7 @@ select.form-control {
   left: 5px;
   top: 8px;
 }
-/* line 1632, ../sass/default.scss */
+/* line 1728, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .comments-group .talk-comments .box-talk .response-talk .text-talk {
   padding: 10px 30px;
   color: #888;
@@ -1868,7 +1978,7 @@ select.form-control {
   line-height: 2;
   margin: 0 0 20px;
 }
-/* line 1638, ../sass/default.scss */
+/* line 1734, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .comments-group .talk-comments .box-talk .response-talk .text-talk a {
   color: #337ab7;
   text-decoration: underline;
@@ -1877,25 +1987,25 @@ select.form-control {
   font-size: 14px;
   line-height: 2;
 }
-/* line 1646, ../sass/default.scss */
+/* line 1742, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .comments-group .talk-comments .box-talk .response-talk .text-talk p {
   text-align: justify;
   line-height: 2;
 }
-/* line 1650, ../sass/default.scss */
+/* line 1746, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .comments-group .talk-comments .box-talk .response-talk .text-talk br {
   content: "";
   clear: both;
   display: block;
   margin: 0 0 10px;
 }
-/* line 1656, ../sass/default.scss */
+/* line 1752, ../sass/default.scss */
 .cp-main .cp-content .cp-comments-ticket .comments-group .talk-comments .box-talk .response-talk .text-talk img {
   max-width: 100%;
   height: auto;
   margin: 0 0 20px;
 }
-/* line 1670, ../sass/default.scss */
+/* line 1766, ../sass/default.scss */
 .cp-main .cp-login-page .cp-login-box {
   background: rgba(0, 0, 0, 0.02);
   border-radius: 4px;
@@ -1905,14 +2015,14 @@ select.form-control {
   border: 1px solid #ddd;
   padding: 40px;
 }
-/* line 1678, ../sass/default.scss */
+/* line 1774, ../sass/default.scss */
 .cp-main .cp-login-page .cp-login-box .line-login {
   display: block;
   margin: 0 auto 20px;
   width: 80%;
   max-width: 200px;
 }
-/* line 1683, ../sass/default.scss */
+/* line 1779, ../sass/default.scss */
 .cp-main .cp-login-page .cp-login-box .line-login:after {
   content: ".";
   display: block;
@@ -1920,7 +2030,7 @@ select.form-control {
   clear: both;
   visibility: hidden;
 }
-/* line 1690, ../sass/default.scss */
+/* line 1786, ../sass/default.scss */
 .cp-main .cp-login-page .cp-login-box .line-login .icon-lock {
   width: 80px;
   display: block;
@@ -1930,50 +2040,50 @@ select.form-control {
   margin: 0 auto 20px;
   text-align: center;
 }
-/* line 1698, ../sass/default.scss */
+/* line 1794, ../sass/default.scss */
 .cp-main .cp-login-page .cp-login-box .line-login .icon-lock .fa {
   color: #666;
   line-height: 70px;
   font-size: 50px;
 }
-/* line 1704, ../sass/default.scss */
+/* line 1800, ../sass/default.scss */
 .cp-main .cp-login-page .cp-login-box .line-login .text-input {
   display: block;
   font-size: 16px;
   font-weight: 400;
 }
-/* line 1710, ../sass/default.scss */
+/* line 1806, ../sass/default.scss */
 .cp-main .cp-login-page .cp-login-box .line-login input[type="text"], .cp-main .cp-login-page .cp-login-box .line-login input[type="password"] {
   width: 100%;
   border-radius: 4px;
   border: 1px solid #ccc;
   padding: 5px;
 }
-/* line 1715, ../sass/default.scss */
+/* line 1811, ../sass/default.scss */
 .cp-main .cp-login-page .cp-login-box .line-login input[type="text"]:focus, .cp-main .cp-login-page .cp-login-box .line-login input[type="password"]:focus {
   outline: none;
 }
-/* line 1719, ../sass/default.scss */
+/* line 1815, ../sass/default.scss */
 .cp-main .cp-login-page .cp-login-box .line-login input[type="submit"] {
   width: 100%;
 }
-/* line 1724, ../sass/default.scss */
+/* line 1820, ../sass/default.scss */
 .cp-main .cp-login-page .cp-forgot-box {
   width: 80%;
   max-width: 600px;
   margin: 0 auto 30px;
   text-align: center;
 }
-/* line 1729, ../sass/default.scss */
+/* line 1825, ../sass/default.scss */
 .cp-main .cp-login-page .cp-forgot-box p {
   margin: 0;
 }
-/* line 1732, ../sass/default.scss */
+/* line 1828, ../sass/default.scss */
 .cp-main .cp-login-page .cp-forgot-box a {
   font-size: 15px;
   letter-spacing: 0.05em;
 }
-/* line 1735, ../sass/default.scss */
+/* line 1831, ../sass/default.scss */
 .cp-main .cp-login-page .cp-forgot-box a span {
   color: #888;
   font-size: 13px;
@@ -1981,17 +2091,17 @@ select.form-control {
   padding: 0 5px;
 }
 
-/* line 1746, ../sass/default.scss */
+/* line 1842, ../sass/default.scss */
 .cp-footer .container {
   border: 1px solid #ddd;
 }
-/* line 1749, ../sass/default.scss */
+/* line 1845, ../sass/default.scss */
 .cp-footer .cp-footer-info {
   text-align: center;
   padding: 10px 0;
 }
 
-/* line 1755, ../sass/default.scss */
+/* line 1851, ../sass/default.scss */
 .clear:after {
   content: ".";
   display: block;
@@ -2000,7 +2110,7 @@ select.form-control {
   visibility: hidden;
 }
 
-/* line 1763, ../sass/default.scss */
+/* line 1859, ../sass/default.scss */
 .go-back-top {
   background: rgba(51, 122, 183, 0.9);
   text-align: center;
@@ -2015,7 +2125,7 @@ select.form-control {
   border-radius: 2px;
   z-index: 1050;
 }
-/* line 1777, ../sass/default.scss */
+/* line 1873, ../sass/default.scss */
 .go-back-top:hover {
   background: #337ab7;
 }
diff --git a/app/assets/stylesheets/client_management/rwd.css b/app/assets/stylesheets/client_management/rwd.css
index 510beb1..3d8bb30 100644
--- a/app/assets/stylesheets/client_management/rwd.css
+++ b/app/assets/stylesheets/client_management/rwd.css
@@ -134,128 +134,150 @@
     float: none;
     width: 100%;
   }
+  /* line 155, ../sass/rwd.scss */
+  .cp-main .cp-content .cp-addsite-step0 {
+    width: 100%;
+  }
+  /* line 157, ../sass/rwd.scss */
+  .cp-main .cp-content .cp-addsite-step0 a {
+    padding: 30px;
+  }
   /* line 159, ../sass/rwd.scss */
+  .cp-main .cp-content .cp-addsite-step0 a .fa {
+    top: 30px;
+  }
+  /* line 162, ../sass/rwd.scss */
+  .cp-main .cp-content .cp-addsite-step0 a .fa-sp {
+    font-size: 180px;
+    top: -45px;
+    right: -10px;
+  }
+  /* line 167, ../sass/rwd.scss */
+  .cp-main .cp-content .cp-addsite-step0 a span {
+    font-size: 20px;
+  }
+  /* line 176, ../sass/rwd.scss */
   .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .line-add.box-buttons .btn {
     margin: 0 10px;
   }
-  /* line 167, ../sass/rwd.scss */
+  /* line 184, ../sass/rwd.scss */
   .cp-main .cp-content .cp-function-box .cp-search-box {
     float: none;
     width: 100%;
     margin: 0 0 20px;
   }
-  /* line 174, ../sass/rwd.scss */
+  /* line 191, ../sass/rwd.scss */
   .cp-main .cp-content .cp-profile-setting .line-profile {
     width: 100%;
   }
-  /* line 176, ../sass/rwd.scss */
+  /* line 193, ../sass/rwd.scss */
   .cp-main .cp-content .cp-profile-setting .line-profile label {
     float: none;
     width: 100%;
   }
-  /* line 180, ../sass/rwd.scss */
+  /* line 197, ../sass/rwd.scss */
   .cp-main .cp-content .cp-profile-setting .line-profile input {
     float: none;
     width: 100%;
   }
-  /* line 184, ../sass/rwd.scss */
+  /* line 201, ../sass/rwd.scss */
   .cp-main .cp-content .cp-profile-setting .line-profile textarea {
     float: none;
     width: 100%;
   }
-  /* line 188, ../sass/rwd.scss */
+  /* line 205, ../sass/rwd.scss */
   .cp-main .cp-content .cp-profile-setting .line-profile .pull-r {
     float: none;
     width: 100%;
   }
 }
 @media only screen and (max-width: 480px) {
-  /* line 201, ../sass/rwd.scss */
+  /* line 218, ../sass/rwd.scss */
   .cp-banner .box-banner .item-ba .text-ba {
     font-size: 15px;
     width: 80%;
     text-align: center;
   }
 
-  /* line 211, ../sass/rwd.scss */
+  /* line 228, ../sass/rwd.scss */
   .cp-main .cp-login-page .cp-login-box {
     width: 100%;
   }
-  /* line 213, ../sass/rwd.scss */
+  /* line 230, ../sass/rwd.scss */
   .cp-main .cp-login-page .cp-login-box .line-login {
     width: 100%;
     max-width: 100vw;
   }
-  /* line 223, ../sass/rwd.scss */
+  /* line 240, ../sass/rwd.scss */
   .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .form-title {
     margin: 0 20px 20px;
   }
-  /* line 226, ../sass/rwd.scss */
+  /* line 243, ../sass/rwd.scss */
   .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .box-check-host {
     float: none;
     width: 100%;
   }
-  /* line 231, ../sass/rwd.scss */
+  /* line 248, ../sass/rwd.scss */
   .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .line-add label {
     display: block;
     float: none;
     width: 100%;
   }
-  /* line 236, ../sass/rwd.scss */
+  /* line 253, ../sass/rwd.scss */
   .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .line-add .form-control {
     float: none;
     width: 100%;
   }
-  /* line 240, ../sass/rwd.scss */
+  /* line 257, ../sass/rwd.scss */
   .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .line-add .title-custom-check {
     width: calc(100% - 30px);
   }
-  /* line 244, ../sass/rwd.scss */
+  /* line 261, ../sass/rwd.scss */
   .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .line-add.box-buttons .btn {
     margin: 0 5px;
     width: calc(50% - 20px);
     font-size: 12px;
   }
-  /* line 252, ../sass/rwd.scss */
+  /* line 269, ../sass/rwd.scss */
   .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .default-mod-list .item-mod {
     width: 100%;
     margin: 0 0 10px;
   }
-  /* line 257, ../sass/rwd.scss */
+  /* line 274, ../sass/rwd.scss */
   .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .box-drop {
     display: block;
   }
-  /* line 259, ../sass/rwd.scss */
+  /* line 276, ../sass/rwd.scss */
   .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .box-drop .additional-mod-list {
     width: 100%;
     margin: 0 0 20px;
   }
-  /* line 263, ../sass/rwd.scss */
+  /* line 280, ../sass/rwd.scss */
   .cp-main .cp-content .cp-addsite-step1 .box-addsite-forms .box-form .box-drop .selected-mod-list {
     width: 100%;
     margin: 0;
   }
-  /* line 272, ../sass/rwd.scss */
+  /* line 289, ../sass/rwd.scss */
   .cp-main .cp-content .list-ticket .item-ticket {
     padding: 30px 0 0;
   }
-  /* line 274, ../sass/rwd.scss */
+  /* line 291, ../sass/rwd.scss */
   .cp-main .cp-content .list-ticket .item-ticket .subject-ticket {
     padding: 10px;
   }
-  /* line 278, ../sass/rwd.scss */
+  /* line 295, ../sass/rwd.scss */
   .cp-main .cp-content .list-ticket .item-ticket .info-ticket span {
     display: block;
   }
-  /* line 285, ../sass/rwd.scss */
+  /* line 302, ../sass/rwd.scss */
   .cp-main .cp-content .list-servers .item-servers {
     padding: 30px 0 0;
   }
-  /* line 287, ../sass/rwd.scss */
+  /* line 304, ../sass/rwd.scss */
   .cp-main .cp-content .list-servers .item-servers .name-server {
     padding: 10px;
   }
-  /* line 293, ../sass/rwd.scss */
+  /* line 310, ../sass/rwd.scss */
   .cp-main .cp-content .cp-function-box .cp-search-box {
     float: none;
     width: 100%;
diff --git a/app/views/admin/client_managements/_add_site_spec.html.erb b/app/views/admin/client_managements/_add_site_spec.html.erb
index 05f93c2..0e4898f 100644
--- a/app/views/admin/client_managements/_add_site_spec.html.erb
+++ b/app/views/admin/client_managements/_add_site_spec.html.erb
@@ -1,11 +1,11 @@
-<tr>
-	<th>Sites to add :</th>
-	<td>
+<div class="line-content">
+	<span class="header-line">Sites to add :</span>
+	<span class="content-line">
 		<%= form_for @site_request, :url => {:action => "add_sites"} do |f| %>
 			<% x = 0 %>
 			<% @site_request.sites_to_add.each_with_index do |sid,i| %>
 				<% site = RegisteredSite.where(:site_domain => sid).first rescue nil %> 
-				<div>
+				<div class="site_added_item">
 					<% if !site.nil? %>
 						<% x = 1 %>
 						<input type="checkbox" name="site_request[sites_added][]" value="<%= site.id %>" id="check_<%= i.to_s %>" >
@@ -18,7 +18,7 @@
 			<% end %>
 			<% @site_request.sites_added.each_with_index do |sid,i| %>
 				<% site = RegisteredSite.find(sid) rescue nil %> 
-				<div>
+				<div class="site_added_item success">
 					<span><%= site.title %><span class="label label-default">Site Already Added</span></span>
 					<a href="http://<%= site.site_domain %>" target="_blank"><i class="icons-export"></i></a>
 				</div>
@@ -30,5 +30,5 @@
 				<a href="<%= complete_request_admin_client_management_path(@site_request.id) %>" class="btn btn-info">Complete Request</a>
 			<% end %>
 		<% end %>
-	</td>
-</tr>
\ No newline at end of file
+	</span>
+</div>
\ No newline at end of file
diff --git a/app/views/admin/client_managements/_index.html.erb b/app/views/admin/client_managements/_index.html.erb
index 0e3e8e4..22615bd 100644
--- a/app/views/admin/client_managements/_index.html.erb
+++ b/app/views/admin/client_managements/_index.html.erb
@@ -21,4 +21,4 @@
       <% end %>
     </td>
   </tr>
-<% end %>
\ No newline at end of file
+<% end %>
diff --git a/app/views/admin/client_managements/_site_spec.html.erb b/app/views/admin/client_managements/_site_spec.html.erb
index 345bd31..c4e0f1c 100644
--- a/app/views/admin/client_managements/_site_spec.html.erb
+++ b/app/views/admin/client_managements/_site_spec.html.erb
@@ -1,69 +1,70 @@
 <% if @site_request.type == "existing" %>
-	<tr>
-		<th>Site Title : </th>
-		<td><%= @site_request.get_site.title %></td>
-	</tr>
-	<tr>
-		<th>Site Domain : </th>
-		<td><a href="<%= @site_request.get_site.site_domain %>" target="_blank"><%= @site_request.get_site.site_domain %></td>
-	</tr>
+	<div class="line-content">
+		<span class="header-line">Site Title : </span>
+		<span class="content-line"><%= @site_request.get_site.title %></span>
+	</div>
+	<div class="line-content">
+		<span class="header-line">Site Domain : </span>
+		<span class="content-line"><a href="<%= @site_request.get_site.site_domain %>" target="_blank"><%= @site_request.get_site.site_domain %></a>
+		</span>
+	</div>
 <% else %>
 	<% if @site_request.host_with_rulingdigital %>
-		<tr>
-			<th>Host with RulingDigital : </th>
-			<td><span class="label label-success">Yes</span></td>
-		</tr>
+		<div class="line-content">
+			<span class="header-line">Host with RulingDigital : </span>
+			<span class="content-line"><span class="label label-success">Yes</span></span>
+		</div>
 	<% else %>
-		<tr>
-			<th>Host with RulingDigital : </th>
-			<td><span class="label label-danger">No</span></td>
-		</tr>
-		<tr>
-			<th>Server Details :</th>
-			<td><%= @site_request.server_details %></td>
-		</tr>
+		<div class="line-content">
+			<span class="header-line">Host with RulingDigital : </span>
+			<span class="content-line"><span class="label label-danger">No</span></span>
+		</div>
+		<div class="line-content">
+			<span class="header-line">Server Details :</span>
+			<span class="content-line"><%= @site_request.server_details %></span>
+		</div>
 	<% end %>
 <% end %>
 <% if !@site_request.optional_modules.blank? %>
-<tr>
-	<th>Optional Module :</th>
-	<td>
-		<% rsm = RegisteredModule.find(@site_request.optional_modules) %>
-		<% rsm.each do |mod| %>
-			<span class="label label-info"><%= mod.name %></span>
-		<% end %>
-	</td>
-</tr>
+	<div class="line-content">
+		<span class="header-line">Optional Module :</span>
+		<span class="content-line">
+			<% rsm = RegisteredModule.find(@site_request.optional_modules) %>
+			<% rsm.each do |mod| %>
+				<span class="label label-info"><%= mod.name %></span>
+			<% end %>
+		</span>
+	</div>
 <% end %>
 <% if @site_request.custom_module %>
-	<tr>
-		<th>Custom Module Required : </th>
-		<td><span class="label label-success">Yes</span></td>
-	</tr>
-	<tr>
-		<th>Custom Module Requirements :</th>
-		<td><%= @site_request.custom_module_details.html_safe %></td>
-	</tr>
+	<div class="line-content">
+		<span class="header-line">Custom Module Required : </span>
+		<span class="content-line"><span class="label label-success">Yes</span></span>
+	</div>
+	<div class="line-content">
+		<span class="header-line">Custom Module Requirements :</span>
+		<span class="content-line"><%= @site_request.custom_module_details.html_safe %></span>
+	</div>
 <% end %>
 <% if !@site_request.template_number.empty? %>
-	<tr>
-		<th>Template Number :</th>
-		<td><a href="http://www.rulingstyle.net/template/<%= @site_request.template_number %>/" target="_blank"><%= @site_request.template_number %></a></td>
-	</tr>
+	<div class="line-content">
+		<span class="header-line">Template Number :</span>
+		<span class="content-line"><a href="http://www.rulingstyle.net/template/<%= @site_request.template_number %>/" target="_blank"><%= @site_request.template_number %></a></span>
+	</div>
 <% end %>
 <% if @site_request.custom_template %>
-	<tr>
-		<th>Custom Template Required : </th>
-		<td><span class="label label-success">Yes</span></td>
-	</tr>
-	<tr>
-		<th>Custom Template Requirements :</th>
-		<td><%= @site_request.custom_template_details.html_safe %></td>
-	</tr>
+	<div class="line-content">
+		<span class="header-line">Custom Template Required : </span>
+		<span class="content-line"><span class="label label-success">Yes</span></span>
+	</div>
+	<div class="line-content">
+		<span class="header-line">Custom Template Requirements :</span>
+		<span class="content-line"><%= @site_request.custom_template_details.html_safe %></span>
+	</div>
 <% end %>
 <% if @site_request.rwd %>
-	<tr>
-		<th>RWD : </th>
-		<td><span class="label label-success">Yes</span></td>
-	</tr>
+	<div class="line-content">
+		<span class="header-line">RWD : </span>
+		<span class="content-line"><span class="label label-success">Yes</span></span>
+	</div>
 <% end %>
diff --git a/app/views/admin/client_managements/_site_spec_form.html.erb b/app/views/admin/client_managements/_site_spec_form.html.erb
index 5d845e7..6fc258b 100644
--- a/app/views/admin/client_managements/_site_spec_form.html.erb
+++ b/app/views/admin/client_managements/_site_spec_form.html.erb
@@ -1,111 +1,122 @@
 <% if @site_request.type == "existing" %>
-	 <div class="control-group">
-    <label class="control-label">Site Title :</label>
-    <div class="controls">
-      <%= @site_request.get_site.title %>
-    </div>
-  </div>
-  <div class="control-group">
-    <label class="control-label">Site Domain :</label>
-    <div class="controls">
-      <a href="<%= @site_request.get_site.site_domain %>" target="_blank"><%= @site_request.get_site.site_domain %></a>
-    </div>
-  </div>
+	<div class="line-content">
+		<span class="header-line">Site Title :</span>
+		<span class="content-line"><%= @site_request.get_site.title %></span>
+	</div>
+	<div class="line-content">
+		<span class="header-line">Site Domain :</span>
+		<span class="content-line">
+			<a href="<%= @site_request.get_site.site_domain %>" target="_blank"><%= @site_request.get_site.site_domain %></a>
+		</span>
+	</div>
 <% else %>
-	<div class="control-group">
-		<%= f.label :new_site_cost, "New Site Cost:", :class => "control-label" %>
-  	<div class="controls">
-			<%= f.number_field :new_site_cost, :min => "0" %>	
-  	</div>
+	<div class="line-content">
+		<span class="header-line"><%= f.label :new_site_cost, "New Site Cost :"%></span>
+	  	<span class="content-line"><%= f.number_field :new_site_cost, :min => "0" %></span>
 	</div>
 	<% if @site_request.host_with_rulingdigital %>
-  	<div class="control-group">
-			<%= f.label :hosting_with_rulingdigital_cost, "Host with RulingDigital:", :class => "control-label" %>
-    	<div class="controls">
-				<%= f.number_field :hosting_with_rulingdigital_cost, :min => "0" %>	
-    	</div>
-  	</div>
+	  	<div class="line-content">
+			<span class="header-line"><%= f.label :hosting_with_rulingdigital_cost, "Host with RulingDigital:" %></span>
+	    	<span class="content-line"><%= f.number_field :hosting_with_rulingdigital_cost, :min => "0" %></span>
+	  	</div>
 	<% end %>
 <% end %>
-<div class="control-group">
-	<%= f.label :service_cost, "Maintainance Cost:", :class => "control-label" %>
-	<div class="controls">
-		<%= f.number_field :service_cost, :min => "0" %>	
-	</div>
+
+<div class="line-content">
+	<span class="header-line"><%= f.label :service_cost, "Maintainance Cost:" %></span>
+	<span class="content-line"><%= f.number_field :service_cost, :min => "0" %></span>
 </div>
+
 <% if !@site_request.optional_modules.blank? %>
-	<div class="control-group">
-		<%= f.label :option_module_cost, "Optional Modules Cost:", :class => "control-label" %>
+	<div class="line-content">
+		<span class="header-line"><%= f.label :option_module_cost, "Optional Modules Cost:" %></span>
 		<% rsm = RegisteredModule.find(@site_request.optional_modules) %>
-  	<div class="controls">
-  		<ul>
-  		<% rsm.each do |mod| %>
+  		<span class="content-line">
+  			<ul class="selected-module">
+  				<% rsm.each do |mod| %>
 				<li><span class="label label-info"><%= mod.name %></span></li>
-			<% end %>
+				<% end %>
 			</ul>
 			<%= f.number_field :option_module_cost, :min => "0" %>	
-  	</div>
+  		</span>
 	</div>
 <% end %>
+
 <% if @site_request.custom_module %>
-	<div class="control-group">
-		<%= f.label :customized_module_cost, "Optional Module Cost:", :class => "control-label" %>
-  	<div class="controls">
+	<div class="line-content">
+		<span class="header-line">
+			<%= f.label :customized_module_cost, "Optional Module Cost:" %>
+		</span>
+  		<span class="content-line">
 			<%= f.number_field :customized_module_cost, :min => "0" %>	
-  	</div>
+  		</span>
 	</div>
 <% end %>
+
 <% if !@site_request.template_number.empty? %>
-	<div class="control-group">
-		<%= f.label :template_cost, "Template Cost:", :class => "control-label" %>
-  	<div class="controls">
+	<div class="line-content">
+		<span class="header-line">
+			<%= f.label :template_cost, "Template Cost:" %>
+		</span>
+		<span class="content-line">
 			<%= f.number_field :template_cost, :min => "0" %>	
-  	</div>
+		</span>
 	</div>
 <% end %>
 <% if @site_request.custom_template %>
-	<div class="control-group">
-		<%= f.label :customized_template_cost, "Customized Template Cost:", :class => "control-label" %>
-  	<div class="controls">
+	<div class="line-content">
+		<span class="header-line">
+			<%= f.label :customized_template_cost, "Customized Template Cost:" %>
+		</span>
+		<span class="content-line">
 			<%= f.number_field :customized_template_cost, :min => "0" %>	
-  	</div>
+		</span>
 	</div>
 <% end %>
 <% if @site_request.rwd %>
-	<div class="control-group">
-		<%= f.label :rwd_cost, "RWD Cost:", :class => "control-label" %>
-  	<div class="controls">
+	<div class="line-content">
+		<span class="header-line">
+			<%= f.label :rwd_cost, "RWD Cost:" %>
+		</span>
+  		<span class="content-line">
 			<%= f.number_field :rwd_cost, :min => "0" %>	
-  	</div>
+  		</span>
 	</div>
 <% end %>
 <% if !@contract.contract_file.url.nil? %>
-	<a href="<%= @contract.contract_file.url %>" target="_blank">Download Contract</a>
-<% end %>
-<div class="control-group">
-	<%= f.label :contract_file, "Contract File:", :class => "control-label" %>
-	<div class="controls">
-		<%= f.file_field :contract_file %>	
+	<div class="line-content">
+		<span class="header-line">Contract File :</span>
+		<span class="content-line"><a href="<%= @contract.contract_file.url %>" target="_blank" class="btn btn-primary flat">Download Contract</a></span>
 	</div>
+<% end %>
+<div class="line-content">
+	<span class="header-line"><%= f.label :contract_file, "Upload Contract File :" %></span>
+	<span class="content-line"><%= f.file_field :contract_file %></span>
 </div>
 
-<div>
-	<h3>Total Amount : <span id="total-amount"><%= @contract.new_record? ? 0 : @contract.total_amount %></span> NTD.</h3>
+<div class="line-content">
+	<span class="header-line">Total Amount :</span>
+	<span class="content-line"><%= @contract.new_record? ? 0 : @contract.total_amount %> NTD.</span>
 </div>
 <% if @contract.new_record? %>
 	<%= f.hidden_field :site_request, :value => @site_request.id.to_s %>
 <% end %>
-<%= f.submit "Submit", :class => "btn btn-primary" %>
-<a href="<%= see_contract_admin_client_management_path(@contract.id) %>" class="btn">Back</a>
-<script type="text/javascript">
-	var costFields = $("form.contract-form input[type=number]"),
-			totalAmountDom = $("#total-amount");
-	costFields.on("change",function(){
-		var totalAmount = 0;
-		$.each(costFields,function(){
-			var amt = ($(this).val() == "" ? 0 : $(this).val());
-			totalAmount += parseInt(amt);
-		})
-		totalAmountDom.text(totalAmount);
-	})
-</script>
\ No newline at end of file
+<div class="line-content button">
+	<span class="header-line"></span>
+	<span class="content-line">
+		<%= f.submit "Submit", :class => "btn btn-primary" %>
+		<a href="<%= see_contract_admin_client_management_path(@contract.id) %>" class="btn">Back</a>
+		<script type="text/javascript">
+			var costFields = $("form.contract-form input[type=number]"),
+					totalAmountDom = $("#total-amount");
+			costFields.on("change",function(){
+				var totalAmount = 0;
+				$.each(costFields,function(){
+					var amt = ($(this).val() == "" ? 0 : $(this).val());
+					totalAmount += parseInt(amt);
+				})
+				totalAmountDom.text(totalAmount);
+			})
+		</script>
+	</span>
+</div>
\ No newline at end of file
diff --git a/app/views/admin/client_managements/edit_contract.html.erb b/app/views/admin/client_managements/edit_contract.html.erb
index 185b56a..52e5065 100644
--- a/app/views/admin/client_managements/edit_contract.html.erb
+++ b/app/views/admin/client_managements/edit_contract.html.erb
@@ -1,48 +1,58 @@
-<style type="text/css">
-	table th{
-		text-align: right;
-		padding-right: 15px;
-	}
-</style>
-<h2>Site Id : <%= @site_request.uid %></h2>
-<h2>Site type : <%= @site_request.get_request_type %></h2>
-<table width="100%">
-  <caption><h3>User Details</h3></caption>
-  <% if !@user.fullname.nil? %>
-	  <tr>
-	    <th>Name :</th>
-	    <td><%= @user.fullname %></td>
-	  </tr>
-  <% end %>
-  <tr>
-    <th>Email :</th>
-    <td><%= @site_request.c_panel_user.email %></td>
-  </tr>
-  <% if !@user.phone_number.nil? %>
-	  <tr>
-	    <th>Phone Number :</th>
-	    <td><%= @user.phone_number %></td>
-	  </tr>
-  <% end %>
-  <% if !@user.address.nil? %>
-	  <tr>
-	    <th>Address :</th>
-	    <td><%= @user.address %></td>
-	  </tr>
-  <% end %>
-  <% if !@user.registered_site_ids.empty? %>
-	  <tr>
-	    <th>Registered Sites :</th>
-	    <td>
-	    	<% @user.registered_sites.each do |rs| %>
-	    		<span class="label label-default"><a style="color:#fff;" href="http://<%= rs.site_domain %>" target="_blank"><%= rs.title %></a></span>
-	    	<% end %>
-	    </td>
-	  </tr>
-  <% end %>
-</table>
-<hr>
-<%= form_for @contract, :url => {:action => :update_contract}, :html => {:class => "form-horizontal contract-form"} do |f| %>
-	<h3>Request Specifications</h3>
-	<%= render :partial => "site_spec_form", :locals => {:f => f} %>
-<% end %>
\ No newline at end of file
+<% content_for :page_specific_css do %>
+  <%= stylesheet_link_tag "client_management/backend" %>
+<% end %>
+
+<div class="page-contract page-client">
+	<div class="info-contract">
+		<h3 class="sub-title">Contract Info</h3>
+		<div class="line-content">
+			<span class="header-line">Id :</span>
+			<span class="content-line"><%= @site_request.uid %></span>
+		</div>
+		<div class="line-content">
+			<span class="header-line">Site type :</span>
+			<span class="content-line"><%= @site_request.get_request_type %></span>
+		</div>	
+	</div>
+	<div class="info-contract-user">
+	  <h3 class="sub-title">User Details</h3>
+	  <% if !@user.fullname.nil? %>
+		  <div class="line-content">
+		    <span class="header-line">Name :</span>
+		    <span class="content-line"><%= @user.fullname %></span>
+		  </div>
+	  <% end %>
+	  <div class="line-content">
+	    <span class="header-line">Email :</span>
+	    <span class="content-line"><%= @site_request.c_panel_user.email %></span>
+	  </div>
+	  <% if !@user.phone_number.nil? %>
+		  <div class="line-content">
+		    <span class="header-line">Phone Number :</span>
+		    <span class="content-line"><%= @user.phone_number %></span>
+		  </div>
+	  <% end %>
+	  <% if !@user.address.nil? %>
+		  <div class="line-content">
+		    <span class="header-line">Address :</span>
+		    <span class="content-line"><%= @user.address %></span>
+		  </div>
+	  <% end %>
+	  <% if !@user.registered_site_ids.empty? %>
+		  <div class="line-content">
+		    <span class="header-line">Registered Sites :</span>
+		    <span class="content-line">
+		    	<% @user.registered_sites.each do |rs| %>
+		    		<span class="label label-default"><a style="color:#fff;" href="http://<%= rs.site_domain %>" target="_blank"><%= rs.title %></a></span>
+		    	<% end %>
+		    </span>
+		  </div>
+	  <% end %>
+	</div>
+	<div class="info-contract-detail">
+		<%= form_for @contract, :url => {:action => :update_contract}, :html => {:class => "form-horizontal contract-form"} do |f| %>
+			<h3 class="sub-title">Request Specifications</h3>
+			<%= render :partial => "site_spec_form", :locals => {:f => f} %>
+		<% end %>
+	</div>
+</div>
\ No newline at end of file
diff --git a/app/views/admin/client_managements/index.html.erb b/app/views/admin/client_managements/index.html.erb
index 3cd7bd4..4a3442a 100644
--- a/app/views/admin/client_managements/index.html.erb
+++ b/app/views/admin/client_managements/index.html.erb
@@ -1,3 +1,5 @@
+
+
 <table class="table main-list">
   <thead>
     <tr class="sort-header">
diff --git a/app/views/admin/client_managements/make_contract.html.erb b/app/views/admin/client_managements/make_contract.html.erb
index 7b9ade2..4ff4a29 100644
--- a/app/views/admin/client_managements/make_contract.html.erb
+++ b/app/views/admin/client_managements/make_contract.html.erb
@@ -1,48 +1,60 @@
-<style type="text/css">
-	table th{
-		text-align: right;
-		padding-right: 15px;
-	}
-</style>
-<h2>Site Id : <%= @site_request.uid %></h2>
-<h2>Site type : <%= @site_request.get_request_type %></h2>
-<table width="100%">
-  <caption><h3>User Details</h3></caption>
-  <% if !@user.fullname.nil? %>
-	  <tr>
-	    <th>Name :</th>
-	    <td><%= @user.fullname %></td>
-	  </tr>
-  <% end %>
-  <tr>
-    <th>Email :</th>
-    <td><%= @site_request.c_panel_user.email %></td>
-  </tr>
-  <% if !@user.phone_number.nil? %>
-	  <tr>
-	    <th>Phone Number :</th>
-	    <td><%= @user.phone_number %></td>
-	  </tr>
-  <% end %>
-  <% if !@user.address.nil? %>
-	  <tr>
-	    <th>Address :</th>
-	    <td><%= @user.address %></td>
-	  </tr>
-  <% end %>
-  <% if !@user.registered_site_ids.empty? %>
-	  <tr>
-	    <th>Registered Sites :</th>
-	    <td>
-	    	<% @user.registered_sites.each do |rs| %>
-	    		<span class="label label-default"><a style="color:#fff;" href="http://<%= rs.site_domain %>" target="_blank"><%= rs.title %></a></span>
-	    	<% end %>
-	    </td>
-	  </tr>
-  <% end %>
-</table>
-<hr>
-<%= form_for @contract, :url => {:action => :create_contract}, :html => {:class => "form-horizontal contract-form"} do |f| %>
-	<h3>Request Specifications</h3>
-	<%= render :partial => "site_spec_form", :locals => {:f => f} %>
-<% end %>
\ No newline at end of file
+<% content_for :page_specific_css do %>
+  <%= stylesheet_link_tag "client_management/backend" %>
+<% end %>
+
+<div class="page-client page-contract">
+	<div class="info-contract">
+		<h3 class="sub-title">Site Info</h3>
+		<div class="line-content">
+			<span class="header-line">Site Id :</span>
+			<span class="content-line"><%= @site_request.uid %></span>
+		</div>
+		<div class="line-content">
+			<span class="header-line">Site type :</span>
+			<span class="content-line"><%= @site_request.get_request_type %></span>
+		</div>
+	</div>
+	
+	<div class="info-detail">
+		<h3 class="sub-title">User Details</h3>
+
+		<% if !@user.fullname.nil? %>
+		  <div class="line-content">
+		    <span class="header-line">Name :</span>
+		    <span class="content-line"><%= @user.fullname %></span>
+		  </div>
+		<% end %>
+		<div class="line-content">
+		<span class="header-line">Email :</span>
+		<span class="content-line"><%= @site_request.c_panel_user.email %></span>
+		</div>
+		<% if !@user.phone_number.nil? %>
+		  <div class="line-content">
+		    <span class="header-line">Phone Number :</span>
+		    <span class="content-line"><%= @user.phone_number %></span>
+		  </div>
+		<% end %>
+		<% if !@user.address.nil? %>
+		  <div class="line-content">
+		    <span class="header-line">Address :</span>
+		    <span class="content-line"><%= @user.address %></span>
+		  </div>
+		<% end %>
+		<% if !@user.registered_site_ids.empty? %>
+		  <div class="line-content">
+		    <span class="header-line">Registered Sites :</span>
+		    <span class="content-line">
+		    	<% @user.registered_sites.each do |rs| %>
+		    		<span class="label label-default"><a style="color:#fff;" href="http://<%= rs.site_domain %>" target="_blank"><%= rs.title %></a></span>
+		    	<% end %>
+		    </span>
+		  </div>
+		<% end %>
+	</div>
+	<div class="info-spec">
+		<%= form_for @contract, :url => {:action => :create_contract}, :html => {:class => "form-horizontal contract-form"} do |f| %>
+			<h3 class="sub-title">Request Specifications</h3>
+			<%= render :partial => "site_spec_form", :locals => {:f => f} %>
+		<% end %>
+	</div>
+</div>
\ No newline at end of file
diff --git a/app/views/admin/client_managements/see_contract.html.erb b/app/views/admin/client_managements/see_contract.html.erb
index d805e82..8c8e037 100644
--- a/app/views/admin/client_managements/see_contract.html.erb
+++ b/app/views/admin/client_managements/see_contract.html.erb
@@ -1,109 +1,125 @@
-<style type="text/css">
-	table th{
-		text-align: right;
-		padding-right: 15px;
-	}
-</style>
-<h2>Contract Id : <%= @contract.uid %></h2>
-<h4> <%= @contract.created_at.strftime("%Y-%m-%d") %> </h4>
-<h4>Confirmed : <%= (@contract.is_confirmed? ? "<span class='label label-success'>Yes</span>" : "<span class='label label-important'>No</span>").html_safe %></h4>
-<table>
-	<caption>Request</caption>
-	<tr>
-		<th>Type :</th>
-		<td><%= @site_request.get_request_type %></td>
-	</tr>
-</table>
-
-<% if @site_request.type == "existing" %>
-<table >
-	<caption>Site Details</caption>
-	<tr>
-		<th>Site ID :</th>
-		<td><%= @site_request.get_site.uid %></td>
-	</tr>
-	<tr>
-		<th>Site Name  : </th>
-		<td><%= @site_request.get_site.title %></td>
-	</tr>
-	<tr>
-		<th>Site Domain  : </th>
-		<td><%= @site_request.get_site.site_domain %></td>
-	</tr>
-</table>
+<% content_for :page_specific_css do %>
+  <%= stylesheet_link_tag "client_management/backend" %>
 <% end %>
-<table >
-	<caption>Contract Files</caption>
-	<% if !@contract.contract_file.url.nil? %>
-		<tr>
-			<th>Contract :</th>
-			<td><a href="<%= @contract.contract_file.url %>" target="_blank">Download</a></td>
-		</tr>
-	<% end %>
-	<% if !@contract.signed_contract_file.url.nil? %>
-		<tr>
-			<th>Signed Contract :</th>
-			<td><a href="<%= @contract.signed_contract_file.url %>" target="_blank">Download</a></td>
-		</tr>
-	<% end %>
-</table>
-<table width="50%">
-	<caption>Quotaion</caption>
-	<tr>
-		<td><b>Item</b></td>
-		<td><b>Cost in NTD.</b></td>
-	</tr>
-	<% total_amount = 0 %>
-	<% ["new_site_cost","hosting_with_rulingdigital_cost","service_cost","option_module_cost","customized_module_cost","template_cost","customized_template_cost","rwd_cost"].each do |attrib| %>
-		<% amount = @contract.send(attrib.to_sym) %>
-		<% if amount > 0 %>
-			<tr>
-				<td>
-					<%= t("client_management.#{attrib}") %>
-					<% if attrib == "option_module_cost" %>
-					<ol>
-						<% rsm = RegisteredModule.find(@site_request.optional_modules) %>
-						<% rsm.each do |rs|%>
-							<li><%= rs.name %></li>
-						<% end %>
-					</ol>
-					<% end %>	
-				</td>
-				<td><%= amount %></td>
-			</tr>
-			<% total_amount = total_amount + amount %>
-		<% end %>
- 	<% end %>
- 	<tr>
- 		<td colspan="2"><hr></td>
- 	</tr>
- 	<tr>
- 		<td><strong>Total :</strong></td>
- 		<td><strong><%= total_amount.to_s %> NTD.</strong></td>
- 	</tr>
- 	<tr>
- 		<td colspan="2"><hr></td>
- 	</tr>
-</table>
-<%= form_for @contract, :url => {:action => "update_contract"}, :html => {:class => "form-horizontal"} do |f| %>
-	<div class="control-group">
-		<%= f.label :signed_contract_file, "Signed Contract File:", :class => "control-label" %>
-		<div class="controls">
-			<%= f.file_field :signed_contract_file %>	
+
+<div class="page-contract page-client">
+	<div class="info-contract">
+		<h3 class="sub-title">Contract Info</h3>
+		<div class="line-content">
+			<span class="header-line">Contract Id :</span>
+			<span class="content-line"><%= @contract.uid %></span>
+		</div>
+		<div class="line-content">
+			<span class="header-line">Contract Date :</span>
+			<span class="content-line"><%= @contract.created_at.strftime("%Y-%m-%d") %></span>
+		</div>
+		<div class="line-content">
+			<span class="header-line">Confirmed :</span>
+			<span class="content-line">
+				<%= (@contract.is_confirmed? ? "<span class='label label-success'>Yes</span>" : "<span class='label label-important'>No</span>").html_safe %>
+			</span>
+		</div>
+	</div>
+	<div class="info-contract-request">
+		<h3 class="sub-title">Request</h3>
+		<div class="line-content">
+			<span class="header-line">Type :</span>
+			<span class="content-line"><%= @site_request.get_request_type %></span>
 		</div>
 	</div>
-	<%= f.submit "Upload", :class => "btn-small btn-primary" %>
-<% end %>
-
-<% if !@contract.is_confirmed? %>
-	<a href="<%= edit_contract_admin_client_management_path(@contract.id) %>" class="btn btn-warning">Edit Contract</a>
-	<a href="<%= confirm_contract_admin_client_management_path(@contract.id, :confirm => "true") %>" class="btn btn-success">Confirm Contract</a>
-<% else %>
-	<a href="<%= make_purchase_admin_client_management_path(@contract.id) %>" class="btn btn-warning">Make Purchase</a>
-	<a href="<%= confirm_contract_admin_client_management_path(@contract.id, :confirm => "false") %>" class="btn btn-danger">Un-Confirm Contract</a>
-<% end %>
-<a href="#" class="btn btn-info">Export Contract</a>
-<a href="<%= admin_client_managements_completed_requests_path(:page => params[:page]) %>" class="btn">Back</a>
 
 
+	<% if @site_request.type == "existing" %>
+		<div class="info-contract-detail">
+			<h3 class="sub-title">Site Details</h3>
+			<div class="line-content">
+				<span class="header-line">Site ID :</span>
+				<span class="content-line"><%= @site_request.get_site.uid %></span>
+			</div>
+			<div class="line-content">
+				<span class="header-line">Site Name  : </span>
+				<span class="content-line"><%= @site_request.get_site.title %></span>
+			</div>
+			<div class="line-content">
+				<span class="header-line">Site Domain  : </span>
+				<span class="content-line"><%= @site_request.get_site.site_domain %></span>
+			</div>
+		</div>
+	<% end %>
+
+	<div class="info-contract-file">
+		<h3 class="sub-title">Contract Files</h3>
+		<% if !@contract.contract_file.url.nil? %>
+			<div class="line-content">
+				<span class="header-line">Contract :</span>
+				<span class="content-line"><a href="<%= @contract.contract_file.url %>" target="_blank">Download</a></span>
+			</div>
+		<% end %>
+		<% if !@contract.signed_contract_file.url.nil? %>
+			<div class="line-content">
+				<span class="header-line">Signed Contract :</span>
+				<span class="content-line"><a href="<%= @contract.signed_contract_file.url %>" target="_blank">Download</a></span>
+			</div>
+		<% end %>
+	</div>
+
+	<div class="info-contract-quatation">
+		<h3 class="sub-title">Quotaion</h3>
+	    <div class="line-content qt">
+	      <span class="header-line">Item</span>
+	      <span class="content-line">Cost in NTD.</span>
+	    </div>
+		<% total_amount = 0 %>
+		<% ["new_site_cost","hosting_with_rulingdigital_cost","service_cost","option_module_cost","customized_module_cost","template_cost","customized_template_cost","rwd_cost"].each do |attrib| %>
+			<% amount = @contract.send(attrib.to_sym) %>
+			<% if amount > 0 %>
+				<div class="line-content qt">
+					<span class="header-line">
+						<%= t("client_management.#{attrib}") %>
+						<% if attrib == "option_module_cost" %>
+						<ol class="custom-module">
+							<% rsm = RegisteredModule.find(@site_request.optional_modules) %>
+							<% rsm.each do |rs|%>
+								<li><%= rs.name %></li>
+							<% end %>
+						</ol>
+						<% end %>	
+					</span>
+					<span class="content-line"><%= amount %></span>
+				</div>
+				<% total_amount = total_amount + amount %>
+			<% end %>
+	 	<% end %>
+	 	<div class="line-content qt hr">
+	 		<span class="header-line">Total :</span>
+	 		<span class="content-line"><%= total_amount.to_s %></span>
+	 	</div>
+	</div>
+
+	<div class="info-contract-file-upload">
+		<div class="line-content file">
+			<%= form_for @contract, :url => {:action => "update_contract"}, :html => {:class => "form-horizontal"} do |f| %>
+				<span class="header-line">Signed Contract File :</span>
+				<span class="content-line">
+					<%= f.file_field :signed_contract_file, :class => "file-box" %>	
+					<%= f.submit "Upload", :class => "btn btn-primary" %>
+				</span>
+			<% end %>
+		</div>
+	</div>
+
+	<div class="info-contract-buttons">
+		<div class="line-content button">
+			<% if !@contract.is_confirmed? %>
+				<a href="<%= edit_contract_admin_client_management_path(@contract.id) %>" class="btn btn-warning">Edit Contract</a>
+				<a href="<%= confirm_contract_admin_client_management_path(@contract.id, :confirm => "true") %>" class="btn btn-success">Confirm Contract</a>
+			<% else %>
+				<a href="<%= make_purchase_admin_client_management_path(@contract.id) %>" class="btn btn-warning">Make Purchase</a>
+				<a href="<%= confirm_contract_admin_client_management_path(@contract.id, :confirm => "false") %>" class="btn btn-danger">Un-Confirm Contract</a>
+			<% end %>
+			<a href="#" class="btn btn-info">Export Contract</a>
+			<a href="<%= admin_client_managements_completed_requests_path(:page => params[:page]) %>" class="btn">Back</a>
+		</div>
+	</div>
+</div>
 
diff --git a/app/views/admin/client_managements/show.html.erb b/app/views/admin/client_managements/show.html.erb
index 9241f7b..7f374b2 100644
--- a/app/views/admin/client_managements/show.html.erb
+++ b/app/views/admin/client_managements/show.html.erb
@@ -1,67 +1,86 @@
-<style type="text/css">
-	table th{
-		text-align: right;
-		padding-right: 15px;
-	}
-</style>
-<h2>Request ID : <%= @site_request.uid %></h2>
-<h2>Request type : <%= @site_request.get_request_type %></h2>
-<table width="100%">
-  <caption><h3>User Details</h3></caption>
-  <% if !@user.fullname.nil? %>
-	  <tr>
-	    <th>Name :</th>
-	    <td><%= @user.fullname %></td>
-	  </tr>
-  <% end %>
-  <tr>
-    <th>Email :</th>
-    <td><%= @site_request.c_panel_user.email %></td>
-  </tr>
-  <% if !@user.phone_number.nil? %>
-	  <tr>
-	    <th>Phone Number :</th>
-	    <td><%= @user.phone_number %></td>
-	  </tr>
-  <% end %>
-  <% if !@user.address.nil? %>
-	  <tr>
-	    <th>Address :</th>
-	    <td><%= @user.address %></td>
-	  </tr>
-  <% end %>
-  <% if !@user.registered_site_ids.empty? %>
-	  <tr>
-	    <th>Registered Sites :</th>
-	    <td>
-	    	<% @user.registered_sites.each do |rs| %>
-	    		<span class="label label-default"><a style="color:#fff;" href="http://<%= rs.site_domain %>" target="_blank"><%= rs.title %></a></span>
-	    	<% end %>
-	    </td>
-	  </tr>
-  <% end %>
-</table>
-<hr>
-<table width="100%">
-  <caption><h3>Request Specifications</h3></caption>
-  <% case @site_request.type %>
-  <% when "newsite" %>
-		<%= render :partial => "site_spec" %>
-  <% when "existing" %>
-		<%= render :partial => "site_spec" %>
-  <% when "addsites" %>
-		<%= render :partial => "add_site_spec" %>
-  <% end %>
-</table>
+<% content_for :page_specific_css do %>
+  <%= stylesheet_link_tag "client_management/backend" %>
+<% end %>
+
+<div class="page-request page-client">
+  <div class="info-request">
+    <h3 class="sub-title">
+      Request Info
+    </h3>
+    <div class="line-content">
+    	<span class="header-line">Request ID :</span>
+    	<span class="content-line"><%= @site_request.uid %></span>
+    </div>
+    <div class="line-content">
+    	<span class="header-line">Request type :</span>
+    	<span class="content-line"><%= @site_request.get_request_type %></span>
+    </div>
+  </div>
+
+  <div class="info-user">
+    <h3 class="sub-title">User Details</h3>
+    <% if !@user.fullname.nil? %>
+      <div class="line-content">
+        <span class="header-line">Name :</span>
+        <span class="content-line"><%= @user.fullname %></span>
+      </div>
+    <% end %>
+    <div class="line-content">
+    <span class="header-line">Email :</span>
+    <span class="content-line"><%= @site_request.c_panel_user.email %></span>
+    </div>
+    <% if !@user.phone_number.nil? %>
+      <div class="line-content">
+        <span class="header-line">Phone Number :</span>
+        <span class="content-line"><%= @user.phone_number %></span>
+      </div>
+    <% end %>
+    <% if !@user.address.nil? %>
+      <div class="line-content">
+        <span class="header-line">Address :</span>
+        <span class="content-line"><%= @user.address %></span>
+      </div>
+    <% end %>
+    <% if !@user.registered_site_ids.empty? %>
+      <div class="line-content">
+        <span class="header-line">Registered Sites :</span>
+        <span class="content-line">
+        	<% @user.registered_sites.each do |rs| %>
+        		<span class="label label-default"><a style="color:#fff;" href="http://<%= rs.site_domain %>" target="_blank"><%= rs.title %></a></span>
+        	<% end %>
+        </span>
+      </div>
+    <% end %>
+  </div>
+
+  <div class="info-site">
+    <h3 class="sub-title">Request Specifications</h3>
+    <% case @site_request.type %>
+    <% when "newsite" %>
+    	<%= render :partial => "site_spec" %>
+    <% when "existing" %>
+    	<%= render :partial => "site_spec" %>
+    <% when "addsites" %>
+    	<%= render :partial => "add_site_spec" %>
+    <% end %>
+  </div>
+  <div class="info-button">
+    <div class="line-content">
+      <span class="header-line"></span>
+      <span class="content-line">
+        <% if @site_request.request_contract.nil? %>
+          <% case @site_request.type %>
+          <% when "existing","newsite" %>
+            <a class="btn btn-primary" href="<%= make_contract_admin_client_management_path(@site_request.id) %>">Make Contract</a>
+          <% end %>
+        <% else %>
+          <% case @site_request.type %>
+          <% when "existing","newsite" %>
+            <a class="btn btn-primary" href="<%= see_contract_admin_client_management_path(@site_request.request_contract.id) %>">View Contract</a>
+          <% end %>
+        <% end %>
+      </span>
+    </div>
+  </div>
+</div>
 
-<% if @site_request.request_contract.nil? %>
-	<% case @site_request.type %>
-	<% when "existing","newsite" %>
-		<a class="btn btn-primary" href="<%= make_contract_admin_client_management_path(@site_request.id) %>">Make Contract</a>
-	<% end %>
-<% else %>
-	<% case @site_request.type %>
-	<% when "existing","newsite" %>
-		<a class="btn btn-primary" href="<%= see_contract_admin_client_management_path(@site_request.request_contract.id) %>">View Contract</a>
-	<% end %>
-<% end %>
\ No newline at end of file
diff --git a/app/views/client_managements/addsite.html.erb b/app/views/client_managements/addsite.html.erb
index ecea9af..3afd2f2 100644
--- a/app/views/client_managements/addsite.html.erb
+++ b/app/views/client_managements/addsite.html.erb
@@ -16,9 +16,17 @@
   	<div class="sp-text text-center"><a href="/cpanel/sites">My Sites</a></div>
   <% else %>
 	  <div class="cp-addsite-step0">
-	    <a href="<%= cpanel_add_new_site_path %>" class="add-new">Add New Site</a>
-	    <div class="sp-text"><span>or</span></div>
-	    <a href="#" class="add-yours">Add site(s) to your account</a>
+	    <a href="<%= cpanel_add_new_site_path %>" class="add-new">
+	    	<i class="fa fa-plus-circle" aria-hidden="true"></i>
+	    	<span>Add New Site</span>
+	    	<i class="fa fa-sp fa-plus-circle" aria-hidden="true"></i>
+	    </a>
+	    
+	    <a href="#" class="add-yours">
+			<i class="fa fa-sitemap" aria-hidden="true"></i>
+			<span>Add Sites to your account</span>
+			<i class="fa fa-sitemap fa-sp" aria-hidden="true"></i>
+	    </a>
 	    <div class="box-add-yours">
 	      <form action="/cpanel/addsitestouser" method="post">
 	        <label for="add-info">Site URL(s)</label>
diff --git a/app/views/client_managements/history.html.erb b/app/views/client_managements/history.html.erb
index cc954fd..e05c49a 100644
--- a/app/views/client_managements/history.html.erb
+++ b/app/views/client_managements/history.html.erb
@@ -15,6 +15,14 @@
     <a href="#" class="submenu-item active">Requests</a>
     <a href="#" class="submenu-item">Contracts</a>
     <a href="#" class="submenu-item">Purchases</a>
+    <div class="cp-filter-box">
+      <select name="filter" id="filter" class="form-control">
+        <option value="1">Purchased</option>
+        <option value="2">Contract Confirmed</option>
+        <option value="3">Pending</option>
+        <option value="4">Requested</option>
+      </select>
+    </div>
   </div>
   <div class="cp-addsite-history">
     <div class="box-request-history">
@@ -37,6 +45,7 @@
             <% end %>
             <span class="time-site"><i class="fa fa-clock-o" aria-hidden="true"></i>Time :&nbsp;&nbsp;<%= obj.created_at.strftime("%d %B %Y - %H:%M") %></span>
           </div>
+          <span class="status-detail requested">Requested</span>
           <span class="action-site">
           <% if !obj.completed %>
             <a href="#" class="btn btn-warning">Cancel</a>