diff --git a/index.js b/index.js
index 0117385..c9a7fb0 100644
--- a/index.js
+++ b/index.js
@@ -9,6 +9,7 @@ const TPLSmartDevice = require('tplink-lightbulb'),
     accessLogStream = rfs('access.log', { interval: '1d', path: __dirname + '/logs' }),
     router = express.Router(),
     ip = process.argv[3] || '10.0.0.130',
+    transition = 0,
     bulb = new TPLSmartDevice(ip)
 
 app.use(morgan('combined', { stream: accessLogStream }))
@@ -17,43 +18,43 @@ app.use(morgan('combined', { stream: accessLogStream }))
     .listen(process.argv[2] || 3000)
 
 router.use('/on/:brightness', (req, res, next) => {
-    bulb.power(true, 0, { brightness: parseInt(req.params.brightness) })
+    bulb.power(true, transition, { brightness: parseInt(req.params.brightness) })
         .then(r => res.json(r))
-        .catch(console.error)
+        .catch(next)
 })
     .use('/on', (req, res, next) => {
-        bulb.power(true, 0, { brightness: 100 })
+        bulb.power(true, transition, { brightness: 100 })
             .then(r => res.json(r))
-            .catch(console.error)
+            .catch(next)
     })
     .use('/off', (req, res, next) => {
         bulb.power(false, 0)
             .then(r => res.json(r))
-            .catch(console.error)
+            .catch(next)
     })
     .use('/color/hex/:color', (req, res, next) => {
         let color = colorsys.hexToHsl(req.params.color)
-        bulb.power(true, 0, {
+        bulb.power(true, transition, {
             hue: color.h,
             saturation: color.s,
             brightness: color.l,
             color_temp: 0
         })
             .then(r => res.json(r))
-            .catch(console.error)
+            .catch(next)
     })
     .use('/color/chsb/:colortemp/:hue/:saturation/:brightness', (req, res, next) => {
-        bulb.power(true, 0, {
+        bulb.power(true, transition, {
             color_temp: parseInt(req.params.colortemp),
             hue: parseInt(req.params.hue),
             saturation: parseInt(req.params.saturation),
             brightness: parseInt(req.params.brightness)
         })
             .then(r => res.json(r))
-            .catch(console.error)
+            .catch(next)
     })
     .use('/info', (req, res, next) => {
         bulb.info()
             .then(r => res.json(r.light_state))
-            .catch(console.error)
+            .catch(next)
     })
\ No newline at end of file
diff --git a/public/assets/css/.gitignore b/public/assets/css/.gitignore
deleted file mode 100644
index e69de29..0000000
diff --git a/public/assets/css/main.css b/public/assets/css/main.css
new file mode 100644
index 0000000..3144a03
--- /dev/null
+++ b/public/assets/css/main.css
@@ -0,0 +1,3 @@
+body form, body > div > div {
+    margin: 2rem 0rem;
+}
\ No newline at end of file
diff --git a/public/assets/js/main.js b/public/assets/js/main.js
index b438e4a..8008a2f 100644
--- a/public/assets/js/main.js
+++ b/public/assets/js/main.js
@@ -13,29 +13,21 @@ $(document).ready(function () {
         $('#saturation').val(data.saturation || 0)
         $('#colortemp').val(data.color_temp || 0)
     }
-    function setCHSB() {
-        $.getJSON('/api/color/chsb/' + $('#colortemp').val() + '/' + $('#hue').val() + '/' + $('#saturation').val() + '/' + $('#brightness').val(), setData)
-    }
-    function setColor() {
-        $.getJSON('/api/color/hex/' + $('#color').val().replace('#', ''))
-    }
     $('.on').on('click', function () {
-        if (parseInt($('.brightness').text()) > 0)
-            url = '/api/on/' + $('.brightness').text()
-        else
-            url = '/api/on'
-        $.getJSON(url, setData)
+        $.getJSON(parseInt($('.brightness').text()) > 0 ? '/api/on/' + $('.brightness').text() : '/api/on', setData)
     })
     $('.off').on('click', function () {
         $.getJSON('/api/off', setData)
     })
     $('form#chsb').on('submit', function (event) {
         event.preventDefault()
-        setCHSB()
+        event.stopPropagation()
+        $.getJSON('/api/color/chsb/' + $('#colortemp').val() + '/' + $('#hue').val() + '/' + $('#saturation').val() + '/' + $('#brightness').val(), setData)
     })
     $('form#colorform').on('submit', function (event) {
         event.preventDefault()
-        setColor()
+        event.stopPropagation()
+        $.getJSON('/api/color/hex/' + $('#color').val().replace('#', ''), setData)
     })
     $.getJSON('/api/info', setData)
 })
\ No newline at end of file
diff --git a/public/index.html b/public/index.html
index b941e18..72c4ade 100644
--- a/public/index.html
+++ b/public/index.html
@@ -4,6 +4,7 @@
 <head>
     <title>TP-Link Bulb Web</title>
     <link rel="stylesheet" href="assets/css/bootstrap.min.css">
+    <link rel="stylesheet" href="assets/css/main.css">
     <script src="assets/js/jquery.min.js"></script>
     <script src="assets/js/bootstrap.min.js"></script>
     <script src="assets/js/main.js"></script>
@@ -12,14 +13,14 @@
 <body class="text-center col-md-12">
     <h2>TP-Link Bulb Web</h2>
     <div class="col-md-8 col-md-offset-2 container">
-        <p>
-            <img class="bulb img-responsive center-block">
-        </p>
-        <p class="lead">
+        <div>
+            <img class="bulb img-responsive center-block" src="assets/images/lb130-off.jpg">
+        </div>
+        <div>
             <button class="on btn btn-success">ON</button>
             <button class="off btn btn-warning">OFF</button>
-        </p>
-        <p>
+        </div>
+        <div>
             <span class="text-primary">Brightness:
                 <span class="brightness"></span>
             </span>
@@ -35,44 +36,45 @@
             <span class="text-info">Color Temp:
                 <span class="colortemp"></span>
             </span>
-        </p>
-        <form class="form-horizontal" id="chsb">
-            <div class="form-group">
-                <label class="control-label col-md-2 col-md-offset-4" for="brightness">Brightness (0-100)</label>
-                <div class="col-md-1">
-                    <input class="form-control" id="brightness" type="number" min="0" max="100">
+        </div>
+        <div>
+            <form class="form-horizontal" id="chsb">
+                <div class="form-group">
+                    <label class="control-label col-md-2 col-md-offset-4" for="brightness">Brightness (0-100)</label>
+                    <div class="col-md-1">
+                        <input class="form-control" id="brightness" type="number" min="0" max="100">
+                    </div>
                 </div>
-            </div>
-            <div class="form-group">
-                <label class="control-label col-md-2 col-md-offset-4" for="hue">Hue (0-360)</label>
-                <div class="col-md-1">
-                    <input class="form-control" id="hue" type="number" min="0" max="360">
+                <div class="form-group">
+                    <label class="control-label col-md-2 col-md-offset-4" for="hue">Hue (0-360)</label>
+                    <div class="col-md-1">
+                        <input class="form-control" id="hue" type="number" min="0" max="360">
+                    </div>
                 </div>
-            </div>
-            <div class="form-group">
-                <label class="control-label col-md-2 col-md-offset-4" for="saturation">Saturation (0-100)</label>
-                <div class="col-md-1">
-                    <input class="form-control" id="saturation" type="number" min="0" max="100">
+                <div class="form-group">
+                    <label class="control-label col-md-2 col-md-offset-4" for="saturation">Saturation (0-100)</label>
+                    <div class="col-md-1">
+                        <input class="form-control" id="saturation" type="number" min="0" max="100">
+                    </div>
                 </div>
-            </div>
-            <div class="form-group">
-                <label class="control-label col-md-2 col-md-offset-4" for="colortemp">Color Temp (0-7000)</label>
-                <div class="col-md-1">
-                    <input class="form-control" id="colortemp" type="number" min="0" max="7000">
+                <div class="form-group">
+                    <label class="control-label col-md-2 col-md-offset-4" for="colortemp">Color Temp (0-7000)</label>
+                    <div class="col-md-1">
+                        <input class="form-control" id="colortemp" type="number" min="0" max="7000">
+                    </div>
                 </div>
-            </div>
-            <button class="setCHSB btn btn-primary">Set</button>
-        </form>
-        <p>&nbsp;</p>
-        <form class="form-horizontal" id="colorform">
-            <div class="form-group">
-                <label class="control-label col-md-2 col-md-offset-4" for="brightness">Color Hex</label>
-                <div class="col-md-1">
-                    <input class="form-control" id="color" type="color" value="#FFFFFF">
+                <button class="btn btn-primary">Set</button>
+            </form>
+            <form class="form-horizontal" id="colorform">
+                <div class="form-group">
+                    <label class="control-label col-md-2 col-md-offset-4" for="color">Color Hex</label>
+                    <div class="col-md-1">
+                        <input class="form-control" id="color" type="color" value="#FFFFFF">
+                    </div>
                 </div>
-            </div>
-            <button class="setColor btn btn-success">Set Color</button>
-        </form>
+                <button class="btn btn-success">Set Color</button>
+            </form>
+        </div>
     </div>
 </body>