diff --git a/bootstrap-components/css/bootstrap-components.min.css b/bootstrap-components/css/bootstrap-components.min.css
new file mode 100644
index 0000000..8e24c04
--- /dev/null
+++ b/bootstrap-components/css/bootstrap-components.min.css
@@ -0,0 +1 @@
+.progress [data-toggle="slider"] {height: 100%;vertical-align: top;float: left;}.progress[data-slider-container] {position: relative;}.progress[data-slider-container] [data-toggle="slider"] {position: absolute;height: 20px;}.progress[data-slider-container] [data-toggle="slider-background"] {position: absolute;height: 20px;}.callout {margin: 0 0 18px 0;padding: 20px;border-left: 3px solid #eee;}.callout h1,.callout h2,.callout h3,.callout h4,.callout h5,.callout h6,.callout h7 {margin-top: 0;margin-bottom: 5px;}.callout p,.callout span {color: #333;}.callout p:last-child {margin-bottom: 0;}.callout-success {background-color: #f4fff4;border-color: #bcf1c8;color: #3c763d;}.callout-info {background-color: #f4f8fa;border-color: #bce8f1;color: #34789a;}.callout-warning {background-color: #faf8f0;border-color: #faebcc;color: #8a6d3b;}.callout-danger {background-color: #fdf7f7;border-color: #eed3d7;color: #b94a48;}.checkbox[data-toggle="checkbox"] {margin: 0 0 1px 0;padding: 0 0 0 0;min-height: inherit;display: inline-block;width: 16px;height: 17px;position: relative;top: 0;font-family: 'Glyphicons Halflings';-webkit-font-smoothing: antialiased;}.checkbox[data-toggle="checkbox"]:before {content: "\e013";position: relative;top: -3px;font-size: 10px;opacity: 0;transition: all 0.2s;-moz-transition: all 0.2s;-webkit-transition: all 0.2s;-o-transition: all 0.2s;}.checkbox[data-toggle="checkbox"][checked]:before {font-size: 15px;opacity: 1;}.bsc-datepicker {background: white;display: inline-block;border: 1px solid #CCC;padding: 0 10px;border-radius: 5px;box-shadow: 0 5px 15px rgba(0,0,0,0.5);overflow-y: hidden;position: absolute;z-index: 10;}.bsc-datepicker .picker-group {border-top: 1px solid gray;padding: 15px 0 13px 0;margin-top: -2px;}.bsc-datepicker .picker-group.first-group {border-top: none;padding-top: 0;}.bsc-datepicker .picker-group.last-group {padding-bottom: 0;}.bsc-datepicker .picker-group .picker-header {text-align: center;margin-bottom: 5px;}.bsc-datepicker > .picker-group .picker-header button {padding: 6px 7px;line-height: 100%;vertical-align: top;}.bsc-datepicker > .picker-group .picker-header button.minus {float: left;}.bsc-datepicker > .picker-group .picker-header button.plus {float: right;}.bsc-datepicker > .picker-group .picker-header h4 {display: inline-block;margin: 0;padding: 5px 0 7px 0;cursor: pointer;}.bsc-datepicker > .picker-group .picker-body {width: 238px;}.bsc-datepicker > .picker-group .picker-body span {display: inline-block;padding: 5px 0;margin: 3px 2px 0 2px;float: left;text-align: center;border-radius: 5px;cursor: pointer;}.bsc-datepicker > .picker-group .picker-selectable span:hover {background: #EEE;}.bsc-datepicker > .picker-group .picker-selectable span:active {background: #DDD;}.bsc-datepicker > .picker-group .picker-selectable span.active {color: white;background: #3276b1;}.bsc-datepicker > .picker-group .picker-selectable span.inactive:hover {background: transparent;cursor: default;}.bsc-datepicker > .picker-group .picker-selectable span.disabled {color: #DDD;cursor: default;}.bsc-datepicker > .picker-group .picker-selectable span.disabled:hover {color: #DDD;background: #FFF;}.bsc-datepicker > .picker-group .picker-selectable span.disabled.active {color: #FFF;background: #DDD;}.bsc-datepicker > .yearpicker .picker-body span {width: 43px;}.bsc-datepicker > .yearpicker .picker-header h4 {cursor: default;}.bsc-datepicker > .monthpicker .picker-body span {width: 55px;}.bsc-datepicker > .datepicker .picker-body span {width: 30px;}.bsc-datepicker > .timepicker {width: 238px;}.bsc-datepicker > .timepicker .timepicker-group {width: 60px;float: left;}.bsc-datepicker > .timepicker .timepicker-group input {font-size: 40px;height: 65px;text-align: center;padding: 0;margin: 0 0 10px 0;border-radius: 5px;display: block;}.bsc-datepicker > .timepicker .timepicker-group button {padding: 6px 6px;line-height: 100%;vertical-align: top;}.bsc-datepicker > .timepicker .timepicker-group button.time-plus {float: right;}.bsc-datepicker > .timepicker .timepicker-spliter {float: left;font-size: 45px;font-weight: bolder;display: inline-block;width: 29px;text-align: center;}.notification-body {display: inline-block;position: fixed;padding: 7px 10px 7px 10px;margin: 10px;max-width: 300px;z-index: 1040;box-shadow: 0px 1px 5px;}.notification-body button.close {position: absolute;right: 7px;top: 3px;}.notification-body h5 {padding: 0 15px 0 0;margin: 0 0 3px 0;}.notification-body.alert-normal h5 {color: #666;}.notification-body.alert-normal {border: 1px solid #ccc;background: white;color: #666;}.notification-body.left {left: 0;}.notification-body.right {right: 0;}.notification-body.top {top: 0;}.notification-body.bottom {bottom: 0;}.radio[data-toggle="radio"] {display: inline-block;margin: 0 0 1px 0;padding: 0;border: 1px solid #adadad;border-radius: 10px;width: 16px;height: 16px;min-height: inherit;line-height: 100%;position: relative;top: 0;font-family: 'Glyphicons Halflings';-webkit-font-smoothing: antialiased;}.radio[data-toggle="radio"]:before {content: "\e013";position: relative;top: -1px;font-size: 10px;opacity: 0;transition: all 0.2s;-moz-transition: all 0.2s;-webkit-transition: all 0.2s;-o-transition: all 0.2s;}.radio[data-toggle="radio"][checked]:before {font-size: 15px;opacity: 1;}.dropdown-toggle[data-toggle="dropdown"][data-type="selector"] {text-align: left;}.dropdown-toggle[data-toggle="dropdown"][data-type="selector"] .caret {float: right;margin-top: 9px;}ul.dropdown-menu[role="menu"][data-type="selector"] li a {cursor: default;}.progress [data-toggle="slider"] {height: 100%;vertical-align: top;float: left;}.progress[data-slider-container] {position: relative;}.progress[data-slider-container] [data-toggle="slider"] {position: absolute;height: 20px;}.progress[data-slider-container] [data-toggle="slider-background"] {position: absolute;height: 20px;}
\ No newline at end of file
diff --git a/bootstrap-components/js/bootstrap-components.min.js b/bootstrap-components/js/bootstrap-components.min.js
new file mode 100644
index 0000000..cadce80
--- /dev/null
+++ b/bootstrap-components/js/bootstrap-components.min.js
@@ -0,0 +1 @@
+$.extend({_bc:new Object}),$._bc.vals=new Object,$._bc.vars=function(e,t){var n=new Object;return typeof e=="object"?n.options=e:typeof e=="function"?n.callback=e:typeof e=="string"&&(n.key=e),typeof t=="function"&&(n.callback=t),n},$._bc.get=function(e,t,n){return e!=null?e[t]!=null?e[t]:n:n},$._bc.list=function(){var e=new Array;return e.add=function(t){e.push(t)},e.remove=function(t){var n=null;for(var r=0;r<e.length;r++){var i=e[r];if(t==i){n=r;break}}n!=null&&e.splice(n,1)},e};var userAgent=navigator.userAgent.toLowerCase();$._bc.browser={version:(userAgent.match(/.+(?:rv|it|ra|ie)[\/: ]([\d.]+)/)||[])[1],safari:/webkit/.test(userAgent),opera:/opera/.test(userAgent),msie:/msie/.test(userAgent)&&!/opera/.test(userAgent),mozilla:/mozilla/.test(userAgent)&&!/(compatible|webkit)/.test(userAgent)},!function(e){function n(){var t=e(this);t.attr("data-original-title")==null&&t.tooltip("show")}var t=!1;e.extend({autotooltip:function(r){r===!0&&t==0?(e(document).on("mouseover.bs.autotooltip","[data-toggle='tooltip']",n),t=!0):r===!1&&t==1&&(e(document).off("mouseover.bs.autotooltip"),t=!1)}})}(window.jQuery),!function(e){function t(e,t){t?e.attr("checked","checked"):e.removeAttr("checked","checked")}function n(e,t){e!=null&&e.prop("checked",t)}e.fn.extend({checkbox:function(r){var i=e(this),s=e._bc.vars(r),o=s.options,u=e._bc.get(o,"checked",null),a=e._bc.get(o,"to",null),f=a!=null?e(a):e(i.attr("data-to"));a!=null&&i.attr("data-to",a),u!=null&&(t(i,u),n(f,u))}}),e(document).on("click.bs.checkbox","label",function(r){var i=e(this),s=i.find(".checkbox[data-toggle='checkbox']"),o=null;if(s.length!=0){var u=e(s.attr("data-to")),a=i.find("input[type='checkbox']");a.length!=0?o=a.prop("checked"):(o=s.attr("checked")==null,n(u,o)),t(s,o),s.add(u).change()}}),e(document).on("click.bs.checkbox",".checkbox[data-toggle='checkbox']",function(r){var i=e(this),s=e(i.attr("data-to")),o=null;i.closest("label").length==0&&(o=i.attr("checked")==null,t(i,o),n(s,o),i.add(s).change())})}(window.jQuery),$._bc.vals.datepicker=new Object,$._bc.vals.datepicker.index=1,!function(e){function r(e){if(t!=null){var n=t.getType(),r=t.getDate(),i=t.getTarget(),s=i.val(),u=null;switch(n){case"year":u=r.getFullYear();break;case"month":u=r.getFullYear()+"-"+o(r.getMonth()+1);break;case"date":u=r.getFullYear()+"-"+o(r.getMonth()+1)+"-"+o(r.getDate());break;case"time":u=o(r.getHours())+":"+o(r.getMinutes())+":"+o(r.getSeconds());break;default:u=r.getFullYear()+"-"+o(r.getMonth()+1)+"-"+o(r.getDate())+" ",u+=o(r.getHours())+":"+o(r.getMinutes())+":"+o(r.getSeconds())}i.val(u),t.remove(),t=null,u!=s&&i.change()}t=e}function i(e){if(e==null)return new Date;var t=e.trim().replace(/-/g,"/");t.match(/^\d{4}$/)?t+="/01/01":t.match(/^\d{4}\/\d{1,2}$/)?t+="/01":t.match(/^\d{1,2}:\d{1,2}:\d{1,2}$/)&&(t="2013/11/14 "+t);var n=new Date(t);return n==null||isNaN(n)?new Date:n}function s(e){var t,n,r=new Date(e.getTime());return r.setMonth(r.getMonth()+1,0),n=r.getDate(),r.setDate(1),t=r.getDay(),[t,n]}function o(e,t){t==null&&(t=2);var n=e+"";while(n.length<t)n="0"+n;return n}function u(e){returndate.getFullYear()+"-"+o(e.getMonth()+1)+"-"+o(e.getDate())+" "+o(e.getHours())+":"+o(e.getMinutes())+":"+o(e.getSeconds())}function a(e,t,n,r){n==null&&(n=0),r==null&&(r=0);var i=new Date(e.getTime()),o=i.getFullYear(),u=i.getMonth()+n+t*12,a=i.getDate();i.setMonth(u,1);var f=s(i)[1];return a<=f?i.setDate(a):i.setDate(f),a=i.getDate()+r,i.setDate(a),i}function f(e,t,n,r){t==null&&(t=e.getFullYear()),n==null&&(n=e.getMonth()),r==null&&(r=e.getDate());var i=new Date(e.getTime());i.setFullYear(t,n,1);var o=s(i);return r>o&&(r=o),i.setFullYear(t,n,r),i}function l(e,t,n){var r=e+"",i=Number(r);if(isNaN(i)||i==null)i=0;return i<t&&(i=t),i>n&&(i=n),i}function c(e,t,n,r){return n!=null&&t>n?new Date(n.getTime()):r!=null&&t<r?new Date(r.getTime()):t}var t=null,n=!1;e(document).on("click.bs.datepicker","[data-toggle='datepicker']",function(t){function ct(){T=c(T,x,C,L)}function ht(){var t=x.getFullYear(),n=t-t%20,r=n+19,i=x.getMonth(),u=i+1,a=x.getDate(),f=s(x),l=x.getHours(),c=x.getMinutes(),h=x.getSeconds();D.text(n+" - "+r),H.empty();for(var p=n;p<=r;p+=1){var d=e("<span>");d.text(p),p==t&&d.addClass("active"),(C.getFullYear()<p||L.getFullYear()>p)&&d.addClass("disabled"),H.append(d)}I.text(t),R.find("span").each(function(n,r){var s=e(r);s.removeClass("active"),s.removeClass("disabled"),n==i&&s.addClass("active"),(C.getFullYear()*100+C.getMonth()<t*100+n||L.getFullYear()*100+L.getMonth()>t*100+n)&&s.addClass("disabled")}),X.text(t+"-"+o(u)),Q.empty();for(var p=0;p<f[0];p+=1){var d=e('<span class="inactive">');Q.append(d)}for(var p=1;p<=f[1];p+=1){var d=e("<span>");d.text(o(p)),p==a&&d.addClass("active"),(C.getFullYear()*1e4+C.getMonth()*100+C.getDate()<t*1e4+i*100+p||L.getFullYear()*1e4+L.getMonth()*100+L.getDate()>t*1e4+i*100+p)&&d.addClass("disabled"),Q.append(d)}Z.val(o(l)),rt.val(o(c)),ut.val(o(h))}function pt(){var e=H.find("span.active")}n=!0;var u=e(this),h=e(u.attr("data-to")),p=h.length!=0?h:u,d=e(u.attr("data-container")),v=p.parent();v.hasClass("input-group-btn")&&(v=v.parent()),v.hasClass("input-group")&&(v=v.parent()),v=d.length!=0?d:v;var m=u.attr("data-type"),g=!1,y=!1,b=!1,w=!1;switch(m){case"year":g=!0;break;case"month":y=!0;break;case"date":b=!0;break;case"time":w=!0;break;default:m="all",b=!0,w=!0}var E=p.val(),S=i(E),x=new Date(S.getTime()),T=new Date(S.getTime()),N=u.attr("data-before"),C=N==null?null:i(N),k=u.attr("data-after"),L=k==null?null:i(k),A=e('<div class="bsc-datepicker">'),O=e('<div class="yearpicker picker-group">'),M=e('<div class="picker-header">'),_=e('<button class="btn btn-default minus" type="button">');_.html('<span class="glyphicon glyphicon-chevron-left"></span>');var D=e("<h4>&nbsp;</h4>"),P=e('<button class="btn btn-default plus" type="button">');P.html('<span class="glyphicon glyphicon-chevron-right"></span>');var H=e('<div class="picker-body picker-selectable clearfix">'),B=e('<div class="monthpicker picker-group">'),j=e('<div class="picker-header">'),F=e('<button class="btn btn-default minus" type="button">');F.html('<span class="glyphicon glyphicon-chevron-left"></span>');var I=e("<h4>&nbsp;</h4>"),q=e('<button class="btn btn-default plus" type="button">');q.html('<span class="glyphicon glyphicon-chevron-right"></span>');var R=e('<div class="picker-body picker-selectable clearfix">'),U=e('<div class="datepicker picker-group">'),z=e('<div class="picker-header">'),W=e('<button class="btn btn-default minus" type="button">');W.html('<span class="glyphicon glyphicon-step-backward"></span>');var X=e("<h4>&nbsp;</h4>"),V=e('<button class="btn btn-default plus" type="button">');V.html('<span class="glyphicon glyphicon-step-forward"></span>');var J=e('<div class="picker-body">'),K=e('<div class="datepicker-body-description clearfix">'),Q=e('<div class="datepicker-body-value picker-selectable clearfix">'),G=e('<div class="timepicker picker-group clearfix">'),Y=e('<div class="timepicker-group">'),Z=e('<input class="form-control" type="text" />'),et=e('<button type="button" class="btn btn-default time-minus">');et.html('<span class="glyphicon glyphicon-minus"></span>');var tt=e('<button type="button" class="btn btn-default time-plus">');tt.html('<span class="glyphicon glyphicon-plus"></span>');var nt=e('<div class="timepicker-group">'),rt=e('<input class="form-control" type="text" />'),it=e('<button type="button" class="btn btn-default time-minus">');it.html('<span class="glyphicon glyphicon-minus"></span>');var st=e('<button type="button" class="btn btn-default time-plus">');st.html('<span class="glyphicon glyphicon-plus"></span>');var ot=e('<div class="timepicker-group">'),ut=e('<input class="form-control" type="text" />'),at=e('<button type="button" class="btn btn-default time-minus">');at.html('<span class="glyphicon glyphicon-minus"></span>');var ft=e('<button type="button" class="btn btn-default time-plus">');ft.html('<span class="glyphicon glyphicon-plus"></span>'),A.appendTo(v),A.append(O),O.append(M),M.append(_),M.append(D),M.append(P),O.append(H),A.append(B),B.append(j),j.append(F),j.append(I),j.append(q),B.append(R),e.each(["Jan","Feb","Mar","Apr","May","June","July","Aug","Sept","Oct","Nov","Dec"],function(t,n){var r=e("<span>");r.attr("data-month",t),r.text(n),R.append(r)}),A.append(U),U.append(z),z.append(W),z.append(X),z.append(V),U.append(J),J.append(K),e.each(["Sun","Mon","Tue","Wed","Thur","Fri","Sat"],function(t,n){var r=e("<span>");r.text(n),K.append(r)}),J.append(Q),A.append(G),G.append(Y),Y.append(Z),Y.append(et),Y.append(tt),G.append('<span class="timepicker-spliter">:</span>'),G.append(nt),nt.append(rt),nt.append(it),nt.append(st),G.append('<span class="timepicker-spliter">:</span>'),G.append(ot),ot.append(ut),ot.append(at),ot.append(ft),r(A);var lt=p.offset();A.offset({left:lt.left,top:lt.top+p.outerHeight()}).click(function(){n=!0}),A.getTarget=function(){return p},A.getType=function(){return m},A.getDate=function(){return T},X.click(function(){U.slideUp(),B.slideDown()}),I.click(function(){B.slideUp(),O.slideDown()}),_.click(function(){x=a(x,-20),ct(),ht()}),P.click(function(){x=a(x,20),ct(),ht()}),H.on("click","span:not(.disabled)",function(){var t=Number(e(this).text());x=f(x,t),ct(),ht(),g||(O.slideUp(),B.slideDown())}),F.click(function(){x=a(x,-1),ct(),ht()}),q.click(function(){x=a(x,1),ct(),ht()}),R.on("click","span:not(.disabled)",function(){var t=Number(e(this).attr("data-month"));x=f(x,null,t),ct(),ht(),y||(B.slideUp(),U.slideDown())}),W.click(function(){x=a(x,0,-1),ct(),ht()}),V.click(function(){x=a(x,0,1),ct(),ht()}),J.on("click","span:not(.inactive):not(.disabled)",function(){var t=Number(e(this).text());x=f(x,null,null,t),ct(),ht()}),et.click(function(){x.setHours(x.getHours()-1),ct(),ht()}),tt.click(function(){x.setHours(x.getHours()+1),ct(),ht()}),Z.change(function(){var t=l(e(this).val(),0,23);x.setHours(t),ct(),ht()}),it.click(function(){x.setMinutes(x.getMinutes()-1),ct(),ht()}),st.click(function(){x.setMinutes(x.getMinutes()+1),ct(),ht()}),rt.change(function(){var t=l(e(this).val(),0,59);x.setMinutes(t),ct(),ht()}),at.click(function(){x.setSeconds(x.getSeconds()-1),ct(),ht()}),ft.click(function(){x.setSeconds(x.getSeconds()+1),ct(),ht()}),ut.change(function(){var t=l(e(this).val(),0,59);x.setSeconds(t),ct(),ht()}),g||O.hide(),y||B.hide(),b||U.hide(),w||G.hide(),ht()}),e(document).on("click.bs.datepicker",function(e){n==1?n=!1:r(null)})}(window.jQuery),$._bc.vals.dialog=new Object,$._bc.vals.dialog.z_index=1051,$.extend({dialog:function(e,t){var n=$._bc.vars(e,t),r=n.options,i=n.callback,s=$._bc.get(r,"title",""),o=$._bc.get(r,"content",""),u=$._bc.get(r,"close",!0),a=$._bc.get(r,"confirm",!1),f=$._bc.get(r,"buttons",null),l=null,c=$('<div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">'),h=$('<div class="modal-dialog">'),p=$('<div class="modal-content">'),d=$('<div class="modal-header">'),v=$('<button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>'),m=$('<h4 class="modal-title" id="myModalLabel">'),g=$('<div class="modal-body">'),y=$('<div class="modal-footer">');c.appendTo("body"),c.append(h),h.append(p),p.append(d),u&&d.append(v),d.append(m),p.append(g),p.append(y),m.html(s),g.html(o);if(f!=null){var b=f.length;for(var w=0;w<b;w+=1){var E=f[w],S=E.name,x=$._bc.get(E,"class","btn-default"),T=E.left===!0,N=$._bc.get(E,"value",S),C=$('<button type="button" class="btn">');C.text(S),C.addClass(x),T&&C.addClass("pull-left"),C.data("value",N),y.append(C),C.add(L).click(function(){l=$(this).data("value"),c.modal("hide")})}}else if(a){var k=$('<button type="button" class="btn btn-default">Cancel</button>').data("value",!1),L=$('<button type="button" class="btn btn-primary">Comfirm</button>').data("value",!0);y.append(k),y.append(L),k.add(L).click(function(){l=$(this).data("value"),c.modal("hide")})}else{var A=$('<button type="button" class="btn btn-default">Close</button>').data("value",!0);y.append(A),A.click(function(){l=$(this).data("value"),c.modal("hide")})}c.modal(r);var O=$("body div.modal-backdrop:last");return O.css("z-index",$._bc.vals.dialog.z_index),c.css("z-index",$._bc.vals.dialog.z_index+1),$._bc.vals.dialog.z_index+=2,c.on("hide.bs.modal",function(){if(i!=null)return i.call(c,l)}),c.on("hidden.bs.modal",function(){$(this).remove(),$._bc.vals.dialog.z_index-=2}),c}}),$._bc.vals.notify=new Object,$._bc.vals.notify.region=new Object,$.extend({notify:function(e,t){function g(){p!=null&&p.remove(v),v.fadeOut(function(){v.remove()})}function y(e){var t=e==null?f:e;if(p==null)v.setAutoFadeOut(t);else{var n=u.indexOf("top")!=-1,r=u.indexOf("bottom")!=-1,i=0;for(var s=p.length-1;s>=0;s--){var o=p[s];n?o.animate({top:i},{queue:!1}):r&&o.animate({bottom:i},{queue:!1});var a=parseInt(o.css("margin-top").replace("px",""),10);i+=o.outerHeight()+a,o.setAutoFadeOut(t+s*c)}}}var n=$._bc.vars(e,t),r=n.options,i=n.callback,s=$._bc.get(r,"title","Notification"),o=$._bc.get(r,"content",""),u=$._bc.get(r,"position","right,top"),a=$._bc.get(r,"type","normal"),f=$._bc.get(r,"timeout",4e3),l=$._bc.get(r,"overtimeout",1e3),c=$._bc.get(r,"queuetimeout",1e3),h=$._bc.get(r,"region",""),p=null,d=null,v=$("<div class='alert notification-body'>"),m=$("<button type='button' class='close'>x</button>");return h!=""&&(v.attr("data-region",h),p=$._bc.vals.notify.region[h],p==null&&(p=$._bc.list(),$._bc.vals.notify.region[h]=p),p.add(v)),u.indexOf("left")!=-1&&v.addClass("left"),u.indexOf("right")!=-1&&v.addClass("right"),u.indexOf("top")!=-1&&v.addClass("top"),u.indexOf("bottom")!=-1&&v.addClass("bottom"),a=="normal"&&v.addClass("alert-normal"),a=="warning"&&v.addClass("alert-warning"),a=="danger"&&v.addClass("alert-danger"),a=="success"&&v.addClass("alert-success"),a=="info"&&v.addClass("alert-info"),v.append(m),s==""&&(s="&nbsp;"),typeof s=="string"&&(s="<h5>"+s+"</h5>"),v.append(s),o!=""&&v.append(o),$("body").append(v),v.hide(),v.fadeIn(),m.click(function(){g(),y()}),v.stopAutoFadeOut=function(){window.clearTimeout(d)},v.setAutoFadeOut=function(e){if(f>0){var t=e==null?f:e;v.stopAutoFadeOut(),d=window.setTimeout(function(){g()},t)}},f>0&&(v.mouseenter(function(){if(p==null)v.stopAutoFadeOut();else for(var e=p.length-1;e>=0;e--){var t=p[e];t.stopAutoFadeOut()}}),v.mouseleave(function(){y(l)})),y(),i!=null&&i.call(v),v}}),!function(e){function t(t){if(t.attr("checked")!=null)return;var n=t.attr("name"),r=e(".radio[data-toggle='radio'][name='"+n+"']");r.removeAttr("checked"),t.attr("checked","checked");var i=t.attr("data-value"),s=e(t.attr("data-to")),o=s.val();s.val(i),t.change(),o!=i&&s.change()}e(document).on("click.bs.radio",".radio[data-toggle='radio']",function(n){var r=e(this);t(r)}),e(document).on("click.bs.radio","label",function(n){var r=e(this),i=r.find(".radio[data-toggle='radio']");i.length!=0&&t(i)})}(window.jQuery),!function(e){e(document).on("click.bs.select",".btn-group ul.dropdown-menu[role='menu'][data-type='selector'] li a",function(t){var n=e(this),r=n.attr("value"),i=n.text();r==null&&(r=i);var s=e(this).closest(".btn-group").find("[data-toggle='dropdown'][data-type='selector']"),o=s.find("[data-value]"),u=e(s.attr("data-to")),a=o.attr("data-value"),f=u.val();o.val(r).text(i).attr("data-value",r),u.val(r),a!=r&&n.change(),f!=r&&u.change()})}(window.jQuery),!function(e){function t(e){return e.parent().find("button[data-toggle='slider']").index(e)}function n(e){var t=e.parent();return t.attr("data-slider-container")==null?Number(e.css("margin-left").replace("px","")):Number(e.css("left").replace("px",""))}function r(e){var t=e.outerWidth();if(e.parent().attr("data-slider-container")!=null){var n=Number(e.css("margin-left").replace("px",""));t+=n*2}return t}function o(i){var s=Number(i.parent().attr("data-min")),o=Number(i.parent().attr("data-max"));if(s==null||isNaN(s))s=0;if(o==null||isNaN(o))o=100;var u=i.parent(),a=u.find("button[data-toggle='slider']"),f=a.length,l=t(i),c=u.attr("data-slider-mixed")!=null,h=0,p=u.outerWidth();c?p-=r(i):e.each(a,function(t,n){var i=e(n);p-=r(i)});if(u.attr("data-slider-container")==null)for(var d=0;d<=l;d+=1){var v=e(a[d]),m=n(v);h+=m}else{h=n(i);if(!c)for(var d=0;d<l;d+=1){var v=e(a[d]);h-=r(v)}}var g=h/p,y=s+(o-s)*g;return y}function u(n,i){var s=n.parent(),o=Number(s.attr("data-min")),u=Number(s.attr("data-max"));if(o==null||isNaN(o))o=0;if(u==null||isNaN(u))u=100;var a=s.find("button[data-toggle='slider']"),f=t(n),l=s.outerWidth();e.each(a,function(t,n){var i=e(n);l-=r(i)});var c=l*(i-o)/(u-o);for(var h=0;h<f;h+=1){var p=e(a[h]);c+=r(p)}s.attr("data-slider-container")==null?n.css("margin-left",c):n.css("left",c),n.val(i).attr("data-value",i)}function a(i,o){s=o.pageX-i.offset().left;var u=i.parent();if(u.attr("data-slider-container")==null){var a=u.find("button[data-toggle='slider']"),f=t(i);for(var l=0;l<f;l+=1){var c=e(a[l]);s+=r(c)+n(c)}}}function f(i,o,u){var a=i.parent(),f=a.find("button[data-toggle='slider']"),l=f.length,c=t(i),h=a.outerWidth();if(a.attr("data-slider-container")==null){e.each(f,function(t,n){var i=e(n);h-=r(i)});var p=h;for(var d=0;d<c;d+=1){var v=e(f[d]);p-=n(v)}for(var d=c+1;d<l;d+=1){var v=e(f[d]);p-=n(v)}var m=o.pageX-a.offset().left-s;m<0&&(m=0),m>p&&(m=p),i.css("margin-left",m)}else{var g=a.attr("data-slider-mixed")!=null,y=g||a.attr("data-slider-single")!=null,b=n(i),w=0,E=h-r(i);if(!g){if(c>0){var S=e(f[c-1]);w=n(S)+r(S)}if(c<l-1)if(y){var x=e(f[c+1]);E=n(x)-r(i)}else{var x=e(f[c+1]),T=e(f[l-1]);E=h-(n(T)-n(i))-r(T)}}var m=o.pageX-a.offset().left-s;m<w&&(m=w),m>E&&(m=E),i.css("left",m);if(!y){var N=m-b;for(var d=c+1;d<l;d+=1){var v=e(f[d]);v.css("left",n(v)+N)}}}}function l(t){var n=e(t.attr("data-to")),r=Number(n.val()),i=o(t);t.val(i).attr("data-value",i),n.val(i),r!=i&&n.change()}function c(t){var i=e(t);i.attr("data-slider-container")==null&&(i=i.parent());var s=i.find("button[data-toggle='slider']"),o=s.length,u=i.find("div[data-toggle='slider-background']"),a=u.length;for(var f=0;f<a;f+=1){var l=e(u[f]),c=e(s[f]),h=e(s[f+1]),p=n(c)+r(c)*.5,d=n(h)+r(h)*.5,v=d-p;l.css("left",p),l.outerWidth(v)}}e.fn.extend({slider:function(t){var n=e(this),r=e._bc.vars(t),i=r.options,s=e._bc.get(i,"min",0),o=e._bc.get(i,"max",100);n.attr("data-min",s),n.attr("data-max",o);var a=e._bc.get(i,"value",[]),f=e._bc.get(i,"single",!1),l=e._bc.get(i,"mixed",!1),h=i.number;h==null&&a.length!=0&&(h=a.length);if(h!=null){n.empty();for(var p=0;p<h;p+=1){var d=e("<button type='button' class='btn btn-primary slider' data-toggle='slider'>");n.append(d)}}n.attr("data-slider-container",""),f&&n.attr("data-slider-single",""),l&&n.attr("data-slider-mixed","");var v=n.find("button[data-toggle='slider']"),m=v.length;for(var p=m-1;p>0;p-=1){var g=e("<div data-toggle='slider-background'>");g.attr("data-from",p-1),g.attr("data-to",p),n.prepend(g)}var m=a.length,y=m==0?s:a[m-1];e.each(v,function(t,n){var r=e(n),i=t<m?a[t]:y;u(r,i);var s=r.attr("style");s!=null&&r.attr("style",s.replace(/margin-left/g,"left"))}),c(n)}});var i=null,s=0;e(document).on("mousedown.bs.slider","button[data-toggle='slider']",function(t){t.button==0&&(i=e(this),a(i,t))}),e(document).on("mousemove.bs.slider",function(n){if(i!=null){f(i,n),l(i);var r=i.parent(),s=r.find("button[data-toggle='slider']"),o=s.length,u=t(i);e.each(s,function(t,n){t!=u&&l(e(n))}),c(i)}}),e(document).on("mouseup.bs.slider",function(e){e.button==0&&(i=null)})}(window.jQuery)
\ No newline at end of file
diff --git a/example/callout.html b/example/callout.html
new file mode 100755
index 0000000..f1e0d40
--- /dev/null
+++ b/example/callout.html
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<title>Bootstrap Component Sample</title>
+		<meta name="viewport" content="width=device-width, initial-scale=1.0">
+		<!-- jQuery -->
+		<script src="assets/jquery-1.10.2.min.js"></script>
+		<!-- Bootstrap -->
+		<script src="assets/bootstrap/js/bootstrap.min.js"></script>
+		<link href="assets/bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen">
+		<!-- src -->
+		<script src="../src/common/bootstrap-common.js"></script>
+		<link href="../src/callout/bootstrap-callout.css" rel="stylesheet" media="screen">
+	</head>
+	<body>
+		<div class="container">
+		<div class="callout callout-success">
+			<h4>Callout - Success</h4>
+			<p>Well done! You successfully read this important alert message.</p>
+		</div>
+		<div class="callout callout-info">
+			<h4>Callout - Info</h4>
+			<p>Heads up! This alert needs your attention, but it's not super important.</p>
+		</div>
+		<div class="callout callout-warning">
+			<h4>Callout - Warning</h4>
+			<p>Warning! Best check yo self, you're not looking too good.</p>
+		</div>
+		<div class="callout callout-danger">
+			<h4>Callout - Danger</h4>
+			<p>Oh snap! Change a few things up and try submitting again.</p>
+		</div>
+		</div>
+	</body>
+</html>
\ No newline at end of file
diff --git a/src/callout/bootstrap-callout.css b/src/callout/bootstrap-callout.css
new file mode 100755
index 0000000..0d13416
--- /dev/null
+++ b/src/callout/bootstrap-callout.css
@@ -0,0 +1,49 @@
+.callout {
+	margin: 0 0 18px 0;
+	padding: 20px;
+	border-left: 3px solid #eee;
+}
+
+.callout h1,
+.callout h2,
+.callout h3,
+.callout h4,
+.callout h5,
+.callout h6,
+.callout h7 {
+	margin-top: 0;
+	margin-bottom: 5px;
+}
+
+.callout p,
+.callout span {
+	color: #333;
+}
+
+.callout p:last-child {
+	margin-bottom: 0;
+}
+
+.callout-success {
+	background-color: #f4fff4;
+	border-color: #bcf1c8;
+	color: #3c763d;
+}
+
+.callout-info {
+	background-color: #f4f8fa;
+	border-color: #bce8f1;
+	color: #34789a;
+}
+
+.callout-warning {
+	background-color: #faf8f0;
+	border-color: #faebcc;
+	color: #8a6d3b;
+}
+
+.callout-danger {
+	background-color: #fdf7f7;
+	border-color: #eed3d7;
+	color: #b94a48;
+}
\ No newline at end of file