+++ /dev/null
-{
- "name": "bootstrap",
- "version": "3.0.0-rc1",
- "main": [
- "./docs/assets/js/bootstrap.js",
- "./docs/assets/css/bootstrap.css"
- ],
- "ignore": [
- "**/.*"
- ],
- "dependencies": {
- "jquery": ">= 1.9.0"
- },
- "homepage": "https://github.com/twbs/bootstrap",
- "_release": "3.0.0-rc1",
- "_resolution": {
- "type": "version",
- "tag": "v3.0.0-rc1",
- "commit": "9c63ffa00fd55c7e61c51b58778b06b28f93e1a8"
- },
- "_source": "git://github.com/twbs/bootstrap.git",
- "_target": "~3.0.0"
-}
\ No newline at end of file
--- /dev/null
+# editorconfig.org
+
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
--- /dev/null
+# Ignore compiled docs
+_gh_pages
+_site
+
+# Numerous always-ignore extensions
+*.diff
+*.err
+*.orig
+*.log
+*.rej
+*.swo
+*.swp
+*.zip
+*.vi
+*~
+*.sass-cache
+*.ruby-version
+
+# OS or Editor folders
+.DS_Store
+._*
+Thumbs.db
+.cache
+.project
+.settings
+.tmproj
+*.esproj
+nbproject
+*.sublime-project
+*.sublime-workspace
+
+# Komodo
+*.komodoproject
+.komodotools
+
+# grunt-html-validation
+validation-staus.json
+
+# Folders to ignore
+.hg
+.svn
+.CVS
+.idea
+node_modules
--- /dev/null
+language: node_js
+node_js:
+ - 0.8
+before_script:
+ - gem install jekyll
+ - npm install -g grunt-cli
+env:
+ global:
+ - secure: Besg41eyU+2mfxrywQ4ydOShMdc34ImaO0S0ENP+aCOBuyNBIgP59wy5tBMmyai2/8eInYeVps4Td96mWInMMxzTe3Bar7eTLG5tWVKRSr/wc4NBPZ/ppoPAmCEsz9Y+VptRH9/FO8n7hsL9EFZ+xBKbG+C0SccGoyBDpA5j7/w=
+ - secure: Ptiv7phCImFP3ALIz+sMQzrZg8k7C1gLZbFBhWxjnQr3g06wIfX3Ls5y9OHvxid+lOZZjISui3wzBVgpVHqwHUYf96+r0mo6/mJ+F4ffUmShZANVaIMD/JRTnXhUQJbvntGLvxn1EYWPdNM+2IHJrMipnjHxU9tkgAnlel4Zdew=
+ - TWBS_HAVE_OWN_BROWSERSTACK_KEY: ""
- Multiple-line approach (one property and value per line)
- Always a space after a property's colon (.e.g, `display: block;` and not `display:block;`)
- End all lines with a semi-colon
-- For multiple, comma-separated selectors, place each selector on it's own line
+- For multiple, comma-separated selectors, place each selector on its own line
- Attribute selectors, like `input[type="text"]` should always wrap the attribute's value in double quotes, for consistency and safety (see this [blog post on unquoted attribute values](http://mathiasbynens.be/notes/unquoted-attribute-values) that can lead to XSS attacks).
### JS
+/* jshint node: true */
+
module.exports = function(grunt) {
+ "use strict";
- // Project configuration.
- grunt.initConfig({
- // Metadata.
- pkg: grunt.file.readJSON('package.json'),
- banner: '/**\n' +
- '* <%= pkg.name %>.js v<%= pkg.version %> by @fat and @mdo\n' +
- '* Copyright <%= grunt.template.today("yyyy") %> <%= pkg.author %>\n' +
- '* <%= _.pluck(pkg.licenses, "url").join(", ") %>\n' +
- '*/\n',
- jqueryCheck: 'if (!jQuery) { throw new Error(\"Bootstrap requires jQuery\") }\n\n',
- // Task configuration.
- clean: {
- dist: ['dist']
- },
- concat: {
- options: {
- banner: '<%= banner %><%= jqueryCheck %>',
- stripBanners: false
- },
- bootstrap: {
- src: ['js/transition.js', 'js/alert.js', 'js/button.js', 'js/carousel.js', 'js/collapse.js', 'js/dropdown.js', 'js/modal.js', 'js/tooltip.js', 'js/popover.js', 'js/scrollspy.js', 'js/tab.js', 'js/affix.js'],
- dest: 'dist/js/<%= pkg.name %>.js'
- }
- },
- jshint: {
- options: {
- jshintrc: 'js/.jshintrc'
- },
- gruntfile: {
- src: 'Gruntfile.js'
- },
- src: {
- src: ['js/*.js']
- },
- test: {
- src: ['js/tests/unit/*.js']
- }
- },
- recess: {
- options: {
- compile: true
- },
- bootstrap: {
- files: {
- 'dist/css/bootstrap.css': ['less/bootstrap.less']
- }
- },
- min: {
- options: {
- compress: true
- },
- files: {
- 'dist/css/bootstrap.min.css': ['less/bootstrap.less']
- }
- }
- },
- uglify: {
- options: {
- banner: '<%= banner %>'
- },
- bootstrap: {
- files: {
- 'dist/js/<%= pkg.name %>.min.js': ['<%= concat.bootstrap.dest %>']
- }
- }
- },
- qunit: {
- options: {
- inject: 'js/tests/unit/phantom.js'
- },
- files: ['js/tests/*.html']
- },
- connect: {
- server: {
- options: {
- port: 3000,
- base: '.'
- }
- }
+ // Project configuration.
+ grunt.initConfig({
+
+ // Metadata.
+ pkg: grunt.file.readJSON('package.json'),
+ banner: '/**\n' +
+ '* <%= pkg.name %>.js v<%= pkg.version %> by @fat and @mdo\n' +
+ '* Copyright <%= grunt.template.today("yyyy") %> <%= pkg.author %>\n' +
+ '* <%= _.pluck(pkg.licenses, "url").join(", ") %>\n' +
+ '*/\n',
+ jqueryCheck: 'if (!jQuery) { throw new Error(\"Bootstrap requires jQuery\") }\n\n',
+
+ // Task configuration.
+ clean: {
+ dist: ['dist']
+ },
+
+ jshint: {
+ options: {
+ jshintrc: 'js/.jshintrc'
+ },
+ gruntfile: {
+ src: 'Gruntfile.js'
+ },
+ src: {
+ src: ['js/*.js']
+ },
+ test: {
+ src: ['js/tests/unit/*.js']
+ }
+ },
+
+ concat: {
+ options: {
+ banner: '<%= banner %><%= jqueryCheck %>',
+ stripBanners: false
+ },
+ bootstrap: {
+ src: [
+ 'js/transition.js',
+ 'js/alert.js',
+ 'js/button.js',
+ 'js/carousel.js',
+ 'js/collapse.js',
+ 'js/dropdown.js',
+ 'js/modal.js',
+ 'js/tooltip.js',
+ 'js/popover.js',
+ 'js/scrollspy.js',
+ 'js/tab.js',
+ 'js/affix.js'
+ ],
+ dest: 'dist/js/<%= pkg.name %>.js'
+ }
+ },
+
+ uglify: {
+ options: {
+ banner: '<%= banner %>'
+ },
+ bootstrap: {
+ src: ['<%= concat.bootstrap.dest %>'],
+ dest: 'dist/js/<%= pkg.name %>.min.js'
+ }
+ },
+
+ recess: {
+ options: {
+ compile: true
+ },
+ bootstrap: {
+ src: ['less/bootstrap.less'],
+ dest: 'dist/css/<%= pkg.name %>.css'
+ },
+ min: {
+ options: {
+ compress: true
},
- watch: {
- src: {
- files: '<%= jshint.src.src %>',
- tasks: ['jshint:src', 'qunit']
- },
- test: {
- files: '<%= jshint.test.src %>',
- tasks: ['jshint:test', 'qunit']
- },
- recess: {
- files: 'less/*.less',
- tasks: ['recess']
- }
+ src: ['less/bootstrap.less'],
+ dest: 'dist/css/<%= pkg.name %>.min.css'
+ }
+ },
+
+ qunit: {
+ options: {
+ inject: 'js/tests/unit/phantom.js'
+ },
+ files: ['js/tests/*.html']
+ },
+
+ connect: {
+ server: {
+ options: {
+ port: 3000,
+ base: '.'
}
- });
+ }
+ },
+
+ jekyll: {
+ docs: {}
+ },
+
+ validation: {
+ options: {
+ reset: true,
+ },
+ files: {
+ src: ["_gh_pages/**/*.html"]
+ }
+ },
+
+ watch: {
+ src: {
+ files: '<%= jshint.src.src %>',
+ tasks: ['jshint:src', 'qunit']
+ },
+ test: {
+ files: '<%= jshint.test.src %>',
+ tasks: ['jshint:test', 'qunit']
+ },
+ recess: {
+ files: 'less/*.less',
+ tasks: ['recess']
+ }
+ }
+ });
+
+
+ // These plugins provide necessary tasks.
+ grunt.loadNpmTasks('grunt-contrib-clean');
+ grunt.loadNpmTasks('grunt-contrib-concat');
+ grunt.loadNpmTasks('grunt-contrib-connect');
+ grunt.loadNpmTasks('grunt-contrib-jshint');
+ grunt.loadNpmTasks('grunt-contrib-qunit');
+ grunt.loadNpmTasks('grunt-contrib-uglify');
+ grunt.loadNpmTasks('grunt-contrib-watch');
+ grunt.loadNpmTasks('grunt-html-validation');
+ grunt.loadNpmTasks('grunt-jekyll');
+ grunt.loadNpmTasks('grunt-recess');
+ grunt.loadNpmTasks('browserstack-runner');
+
+
+ // Docs HTML validation task
+ grunt.registerTask('validate-docs', ['jekyll', 'validation']);
+ // Test task.
+ var testSubtasks = ['jshint', 'qunit', 'validate-docs'];
+ // Only run BrowserStack tests under Travis
+ if (process.env.TRAVIS) {
+ // Only run BrowserStack tests if this is a mainline commit in twbs/bootstrap, or you have your own BrowserStack key
+ if ((process.env.TRAVIS_REPO_SLUG === 'twbs/bootstrap' && process.env.TRAVIS_PULL_REQUEST === 'false') || process.env.TWBS_HAVE_OWN_BROWSERSTACK_KEY) {
+ testSubtasks.push('browserstack_runner');
+ }
+ }
+ grunt.registerTask('test', testSubtasks);
- // These plugins provide necessary tasks.
- grunt.loadNpmTasks('grunt-contrib-connect');
- grunt.loadNpmTasks('grunt-contrib-clean');
- grunt.loadNpmTasks('grunt-contrib-concat');
- grunt.loadNpmTasks('grunt-contrib-jshint');
- grunt.loadNpmTasks('grunt-contrib-uglify');
- grunt.loadNpmTasks('grunt-contrib-qunit');
- grunt.loadNpmTasks('grunt-contrib-watch');
- grunt.loadNpmTasks('grunt-recess');
+ // JS distribution task.
+ grunt.registerTask('dist-js', ['concat', 'uglify']);
+ // CSS distribution task.
+ grunt.registerTask('dist-css', ['recess']);
- // Test task.
- grunt.registerTask('test', ['jshint', 'qunit']);
+ // Full distribution task.
+ grunt.registerTask('dist', ['clean', 'dist-css', 'dist-js']);
- // JS distribution task.
- grunt.registerTask('dist-js', ['concat', 'uglify']);
+ // Default task.
+ grunt.registerTask('default', ['test', 'dist']);
- // CSS distribution task.
- grunt.registerTask('dist-css', ['recess']);
+ // task for building customizer
+ grunt.registerTask('build-customizer', 'Add scripts/less files to customizer.', function () {
+ var fs = require('fs')
- // Full distribution task.
- grunt.registerTask('dist', ['clean', 'dist-css', 'dist-js']);
+ function getFiles(type) {
+ var files = {}
+ fs.readdirSync(type)
+ .filter(function (path) {
+ return new RegExp('\\.' + type + '$').test(path)
+ })
+ .forEach(function (path) {
+ return files[path] = fs.readFileSync(type + '/' + path, 'utf8')
+ })
+ return 'var __' + type + ' = ' + JSON.stringify(files) + '\n'
+ }
- // Default task.
- grunt.registerTask('default', ['test', 'dist']);
+ var customize = fs.readFileSync('customize.html', 'utf-8')
+ var files = '<!-- generated -->\n<script id="files">\n' + getFiles('js') + getFiles('less') + '<\/script>\n<!-- /generated -->'
+ fs.writeFileSync('customize.html', customize.replace(/<!-- generated -->(.|[\n\r])*<!-- \/generated -->/, files))
+ });
};
-# [Bootstrap v3.0.0](http://getbootstrap.com) [](http://travis-ci.org/twitter/bootstrap)
+# [Bootstrap v3.0.0](http://getbootstrap.com) [](http://travis-ci.org/twbs/bootstrap)
Bootstrap is a sleek, intuitive, and powerful front-end framework for faster and easier web development, created and maintained by [Mark Otto](http://twitter.com/mdo) and [Jacob Thornton](http://twitter.com/fat).
Three quick start options are available:
-* [Download the latest release](https://github.com/twbs/bootstrap/zipball/master).
+* [Download the latest release](https://github.com/twbs/bootstrap/zipball/3.0.0-wip).
* Clone the repo: `git clone git://github.com/twbs/bootstrap.git`.
* Install with [Bower](http://bower.io): `bower install bootstrap`.
### Documentation for previous releases
-Documentation for v2.3.3 has been made available for the time being at [http://getbootstrap.com/2.3.3/](http://getbootstrap.com/2.3.3/) while folks transition to Bootstrap 3.
+Documentation for v2.3.2 has been made available for the time being at [http://getbootstrap.com/2.3.2/](http://getbootstrap.com/2.3.2/) while folks transition to Bootstrap 3.
[Previous releases](https://github.com/twbs/bootstrap/releases) and their documentation are also available for download.
### Available Grunt commands
#### Build - `grunt`
-Run `grunt` to run tests locally and compile the CSS and JavaScript into `/dist`. **Requires recess and uglify-js.**
+Run `grunt` to run tests locally and compile the CSS and JavaScript into `/dist`. **Requires [recess](https://github.com/twitter/recess) and [uglify-js](https://github.com/mishoo/UglifyJS).**
#### Only compile CSS and JavaScript - `grunt dist`
-`grunt dist` creates the `/dist` directory with compiled files. **Requires recess and uglify-js.**
+`grunt dist` creates the `/dist` directory with compiled files. **Requires [recess](https://github.com/twitter/recess) and [uglify-js](https://github.com/mishoo/UglifyJS).**
#### Tests - `grunt test`
-Runs jshint and qunit tests headlessly in [phantomjs](http://code.google.com/p/phantomjs/) (used for ci). **Requires phantomjs.**
+Runs jshint and qunit tests headlessly in [phantomjs](https://github.com/ariya/phantomjs/) (used for CI). **Requires [phantomjs](https://github.com/ariya/phantomjs/).**
#### Watch - `grunt watch`
This is a convenience method for watching just Less files and automatically building them whenever you save.
# Custom vars
repo: https://github.com/twbs/bootstrap
-download: https://github.com/twbs/bootstrap/archive/v3.0.0-rc1.zip
-download_dist: https://github.com/twbs/bootstrap/releases/download/v3.0.0-rc1/bs-v3.0.0-rc1-dist.zip
-
-examples: http://examples.getbootstrap.com
-examples_repo: https://github.com/twbs/bootstrap-examples
+download: https://github.com/twbs/bootstrap/archive/3.0.0-wip.zip
+download_dist: http://getbootstrap.com/bs-v3.0.0-rc.2-dist.zip
glyphicons: http://glyphicons.getbootstrap.com
glyphicons_repo: https://github.com/twbs/bootstrap-glyphicons
blog: http://blog.getbootstrap.com
expo: http://expo.getbootstrap.com
-cdn_css: //netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/css/bootstrap.min.css
-cdn_js: //netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/js/bootstrap.min.js
+cdn_css: //netdna.bootstrapcdn.com/bootstrap/3.0.0-wip/css/bootstrap.min.css
+cdn_js: //netdna.bootstrapcdn.com/bootstrap/3.0.0-wip/js/bootstrap.min.js
-<div id="carbonads-container"><div class="carbonad"><div id="azcarbon"></div><script type="text/javascript">var z = document.createElement("script"); z.type = "text/javascript"; z.async = true; z.src = "http://engine.carbonads.com/z/32341/azcarbon_2_1_0_HORIZ"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(z, s);</script></div></div>
\ No newline at end of file
+<div id="carbonads-container"><div class="carbonad"><div id="azcarbon"></div><script>var z = document.createElement("script"); z.async = true; z.src = "http://engine.carbonads.com/z/32341/azcarbon_2_1_0_HORIZ"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(z, s);</script></div></div>
<script src="{{ page.base_url }}assets/js/jquery.js"></script>
<script src="{{ page.base_url }}dist/js/bootstrap.js"></script>
-<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
+<script src="http://platform.twitter.com/widgets.js"></script>
<script src="{{ page.base_url }}assets/js/holder.js"></script>
<script src="{{ page.base_url }}assets/js/application.js"></script>
+{% if page.slug == "customize" %}
+<script src="{{ page.base_url }}assets/js/less.js"></script>
+<script src="{{ page.base_url }}assets/js/jszip.js"></script>
+<script src="{{ page.base_url }}assets/js/uglify.js"></script>
+<script src="{{ page.base_url }}assets/js/jquery.bbq.min.js"></script>
+<script src="{{ page.base_url }}assets/js/customizer.js"></script>
+{% endif %}
+
<!-- Analytics
================================================== -->
<script>
var _gauges = _gauges || [];
(function() {
var t = document.createElement('script');
- t.type = 'text/javascript';
t.async = true;
t.id = 'gauges-tracker';
t.setAttribute('data-site-id', '4f0dc9fef5a1f55508000013');
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
- <script src="/assets/js/html5shiv.js"></script>
- <script src="/assets/js/respond.min.js"></script>
+ <script src="{{ page.base_url }}assets/js/html5shiv.js"></script>
+ <script src="{{ page.base_url }}assets/js/respond.min.js"></script>
<![endif]-->
<!-- Favicons -->
<link rel="apple-touch-icon-precomposed" href="{{ page.base_url }}assets/ico/apple-touch-icon-57-precomposed.png">
<link rel="shortcut icon" href="{{ page.base_url }}assets/ico/favicon.png">
-<script type="text/javascript">
+<script>
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-146052-10']);
_gaq.push(['_trackPageview']);
(function() {
- var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
+ var ga = document.createElement('script'); ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
<li>
<a href="#btn-groups">Button groups</a>
<ul class="nav">
- <li><a href="#btn-groups-single">Basic button group</a></li>
+ <li><a href="#btn-groups-single">Basic example</a></li>
<li><a href="#btn-groups-toolbar">Button toolbar</a></li>
+ <li><a href="#btn-groups-sizing">Sizing</a></li>
+ <li><a href="#btn-groups-nested">Nesting</a></li>
<li><a href="#btn-groups-vertical">Vertical variation</a></li>
- <li><a href="#btn-groups-justified">Justified link buttons</a></li>
+ <li><a href="#btn-groups-justified">Justified link variation</a></li>
</ul>
</li>
<li>
<a href="#btn-dropdowns">Button dropdowns</a>
<ul class="nav">
- <li><a href="#btn-dropdowns-single">Single button dropdown</a></li>
- <li><a href="#btn-dropdowns-split">Split button dropdown</a></li>
- <li><a href="#btn-dropdowns-sizes">Button sizes</a></li>
+ <li><a href="#btn-dropdowns-single">Single button dropdowns</a></li>
+ <li><a href="#btn-dropdowns-split">Split button dropdowns</a></li>
+ <li><a href="#btn-dropdowns-sizing">Sizing</a></li>
<li><a href="#btn-dropdowns-dropup">Dropup variation</a></li>
</ul>
</li>
+<li>
+ <a href="#input-groups">Input groups</a>
+ <ul class="nav">
+ <li><a href="#input-groups-basic">Basic example</a></li>
+ <li><a href="#input-groups-sizing">Sizing</a></li>
+ <li><a href="#input-groups-checkboxes-radios">Checkbox and radios addons</a></li>
+ <li><a href="#input-groups-buttons">Button addons</a></li>
+ <li><a href="#input-groups-buttons-dropdowns">Buttons with dropdowns</a></li>
+ <li><a href="#input-groups-buttons-segmented">Segmented buttons</a></li>
+ </ul>
+</li>
<li>
<a href="#nav">Navs</a>
<ul class="nav">
- <li><a href="#nav-tabs">Tabs nav</a></li>
- <li><a href="#nav-pills">Pills nav</a></li>
+ <li><a href="#nav-tabs">Tabs</a></li>
+ <li><a href="#nav-pills">Pills</a></li>
<li><a href="#nav-justified">Justified nav</a></li>
<li><a href="#nav-disabled-links">Disabled links</a></li>
<li><a href="#nav-alignment">Alignment options</a></li>
<li>
<a href="#navbar">Navbar</a>
<ul class="nav">
- <li><a href="#navbar-basic">Basic navbar</a></li>
- <li><a href="#navbar-nav">Nav links</a></li>
- <li><a href="#navbar-forms">Forms in navbars</a></li>
- <li><a href="#navbar-buttons">Buttons in navbars</a></li>
- <li><a href="#navbar-text">Text in navbars</a></li>
- <li><a href="#navbar-links">Links in navbars</a></li>
+ <li><a href="#navbar-default">Default navbar</a></li>
+ <li><a href="#navbar-buttons">Buttons</a></li>
+ <li><a href="#navbar-text">Text</a></li>
+ <li><a href="#navbar-links">Non-nav links</a></li>
<li><a href="#navbar-component-alignment">Component alignment</a></li>
- <li><a href="#navbar-fixed-top">Fixed top navbar</a></li>
- <li><a href="#navbar-fixed-bottom">Fixed bottom navbar</a></li>
- <li><a href="#navbar-static-top">Static top navbar</a></li>
- <li><a href="#navbar-responsive">Responsive navbar</a></li>
+ <li><a href="#navbar-fixed-top">Fixed to top</a></li>
+ <li><a href="#navbar-fixed-bottom">Fixed to bottom</a></li>
+ <li><a href="#navbar-static-top">Static top</a></li>
+ <li><a href="#navbar-inverted">Inverted navbar</a></li>
</ul>
</li>
<li><a href="#breadcrumbs">Breadcrumbs</a></li>
</li>
<li><a href="#labels">Labels</a></li>
<li><a href="#badges">Badges</a></li>
+<li><a href="#jumbotron">Jumbotron</a></li>
+<li><a href="#page-header">Page header</a></li>
<li>
- <a href="#type-components">Typography</a>
+ <a href="#thumbnails">Thumbnails</a>
<ul class="nav">
- <li><a href="#type-components-jumbotron">Jumbotron</a></li>
- <li><a href="#type-components-page-header">Page header</a></li>
+ <li><a href="#thumbnails-default">Default example</a></li>
+ <li><a href="#thumbnails-custom-content">Custom content</a></li>
</ul>
</li>
-<li><a href="#thumbnails">Thumbnails</a></li>
<li>
<a href="#alerts">Alerts</a>
<ul class="nav">
<li><a href="#alerts-default">Default alert</a></li>
- <li><a href="#alerts-block">Block alerts</a></li>
<li><a href="#alerts-alternatives">Contextual alternatives</a></li>
+ <li><a href="#alerts-dismissable">Dismissable alerts</a></li>
<li><a href="#alerts-links">Links in alerts</a></li>
</ul>
</li>
<li>
<a href="#progress">Progress bars</a>
<ul class="nav">
- <li><a href="#progress-basic">Basic progress bar</a></li>
+ <li><a href="#progress-basic">Basic example</a></li>
<li><a href="#progress-alternatives">Contextual alternatives</a></li>
<li><a href="#progress-striped">Striped</a></li>
<li><a href="#progress-animated">Animated</a></li>
<li><a href="#progress-stacked">Stacked</a></li>
</ul>
</li>
-<li><a href="#media">Media object</a></li>
+<li>
+ <a href="#media">Media object</a>
+ <ul class="nav">
+ <li><a href="#media-default">Default media</a></li>
+ <li><a href="#media-list">Media list</a></li>
+ </ul>
+</li>
<li>
<a href="#list-group">List group</a>
<ul class="nav">
- <li><a href="#list-group-basic">Basic list group</a></li>
+ <li><a href="#list-group-basic">Basic example</a></li>
<li><a href="#list-group-badges">Badges</a></li>
<li><a href="#list-group-linked">Linked items</a></li>
<li><a href="#list-group-custom-content">Custom content</a></li>
- <!-- <li><a href="#list-group-pic">Leading picture</a></li> -->
</ul>
</li>
<li>
<a href="#panels">Panels</a>
<ul class="nav">
- <li><a href="#panels-basic">Basic panel</a></li>
+ <li><a href="#panels-basic">Basic example</a></li>
<li><a href="#panels-heading">Panel with heading</a></li>
<li><a href="#panels-alternatives">Contextual alternatives</a></li>
<li><a href="#panels-list-group">With list groups</a>
<li><a href="#overview-doctype">HTML5 doctype</a></li>
<li><a href="#overview-mobile">Mobile first</a></li>
<li><a href="#overview-responsive-images">Responsive images</a></li>
- <li><a href="#overview-type-links">Type and links</a></li>
+ <li><a href="#overview-type-links">Typography and links</a></li>
<li><a href="#overview-normalize">Normalize</a></li>
- <li><a href="#overview-container">Container</a></li>
+ <li><a href="#overview-container">Containers</a></li>
</ul>
</li>
<li>
<li>
<a href="#grid">Grid system</a>
<ul class="nav">
- <li><a href="#grid-options">Available options</a></li>
+ <li><a href="#grid-media-queries">Media queries</a></li>
+ <li><a href="#grid-options">Grid options</a></li>
<li><a href="#grid-example-basic">Ex: Stacked-to-horizonal</a></li>
- <li><a href="#grid-example-mixed">Ex: Mobile-desktop</a></li>
- <li><a href="#grid-example-mixed-complete">Ex: Mobile, tablet, desktop</a></li>
- <li><a href="#grid-offsetting">Offset columns</a></li>
- <li><a href="#grid-nesting">Nested columns</a></li>
+ <li><a href="#grid-example-mixed">Ex: Mobile and desktops</a></li>
+ <li><a href="#grid-example-mixed-complete">Ex: Mobile, tablet, desktops</a></li>
+ <li><a href="#grid-responsive-resets">Responsive column resets</a></li>
+ <li><a href="#grid-offsetting">Offsetting columns</a></li>
+ <li><a href="#grid-nesting">Nesting columns</a></li>
<li><a href="#grid-column-ordering">Column ordering</a></li>
<li><a href="#grid-less">LESS mixins and variables</a></li>
</ul>
<a href="#tables">Tables</a>
<ul class="nav">
<li><a href="#tables-example">Basic example</a></li>
- <li><a href="#tables-striped">Zebra striping</a></li>
- <li><a href="#tables-bordered">Bordered tables</a></li>
+ <li><a href="#tables-striped">Striped rows</a></li>
+ <li><a href="#tables-bordered">Bordered table</a></li>
<li><a href="#tables-hover-rows">Hover rows</a></li>
- <li><a href="#tables-condensed">Condensed tables</a></li>
- <li><a href="#tables-row-classes">Contextual row classes</a></li>
+ <li><a href="#tables-condensed">Condensed table</a></li>
+ <li><a href="#tables-contextual-classes">Contextual classes</a></li>
</ul>
</li>
<li>
<a href="#forms">Forms</a>
<ul class="nav">
<li><a href="#forms-example">Basic example</a></li>
- <li><a href="#forms-inline">Inline variation</a></li>
- <li><a href="#forms-horizontal">Horizontal variation</a></li>
+ <li><a href="#forms-inline">Inline form</a></li>
+ <li><a href="#forms-horizontal">Horizontal form</a></li>
<li><a href="#forms-controls">Supported controls</a></li>
+ <li><a href="#forms-controls-static">Static control</a></li>
<li><a href="#forms-control-states">Control states</a></li>
- <li><a href="#forms-input-groups">Input groups</a></li>
<li><a href="#forms-control-sizes">Control sizing</a></li>
<li><a href="#forms-help-text">Help text</a></li>
</ul>
<li>
<a href="#buttons">Buttons</a>
<ul class="nav">
- <li><a href="#buttons-options">Button options</a></li>
+ <li><a href="#buttons-options">Options</a></li>
<li><a href="#buttons-sizes">Sizes</a></li>
- <li><a href="#buttons-disabled">Disabled</a></li>
+ <li><a href="#buttons-disabled">Disabled state</a></li>
<li><a href="#buttons-tags">Button tags</a></li>
</ul>
</li>
<li>
<a href="#download">Download Bootstrap</a>
<ul class="nav">
- <li><a href="#download-options">Download options</a></li>
+ <li><a href="#download-source">Download source</a></li>
+ <li><a href="#download-additional">Additional downloads</a></li>
<li><a href="#download-cdn">Bootstrap CDN</a></li>
</ul>
</li>
<li>
<a href="#template">Basic template</a>
</li>
+<li>
+ <a href="#examples">Examples</a>
+</li>
+<li>
+ <a href="#disable-responsive">Disabling responsiveness</a>
+</li>
<li>
<a href="#browsers">Browser support</a>
</li>
+<li>
+ <a href="#third-parties">Third party support</a>
+</li>
+<li>
+ <a href="#accessibility">Accessibility</a>
+</li>
<li>
<a href="#license-faqs">License FAQs</a>
</li>
<li>
<a href="#customizing">Customizing Bootstrap</a>
-</li>
\ No newline at end of file
+</li>
<li><a href="#js-individual-compiled">Individual or compiled</a></li>
<li><a href="#js-data-attrs">Data attributes</a></li>
<li><a href="#js-programmatic-api">Programmatic API</a></li>
- <li><a href="#js-noconflict">No Conflict</a></li>
+ <li><a href="#js-noconflict">No conflict</a></li>
<li><a href="#js-events">Events</a></li>
</ul>
</li>
-<div class="navbar navbar-inverse navbar-fixed-top bs-docs-nav">
+<header class="navbar navbar-inverse navbar-fixed-top bs-docs-nav" role="banner">
<div class="container">
- <a href="{{ page.base_url }}" class="navbar-brand">Bootstrap 3 RC1</a>
- <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-navbar-collapse">
- <span class="icon-bar"></span>
- <span class="icon-bar"></span>
- <span class="icon-bar"></span>
- </button>
- <div class="nav-collapse collapse bs-navbar-collapse">
+ <div class="navbar-header">
+ <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-navbar-collapse">
+ <span class="sr-only">Toggle navigation</span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <a href="{{ page.base_url }}" class="navbar-brand">Bootstrap 3 RC2</a>
+ </div>
+ <nav class="collapse navbar-collapse bs-navbar-collapse" role="navigation">
<ul class="nav navbar-nav">
<li{% if page.slug == "getting-started" %} class="active"{% endif %}>
<a href="{{ page.base_url }}getting-started">Getting started</a>
<a href="{{ page.base_url }}customize">Customize</a>
</li>
</ul>
- </div>
+ </nav>
</div>
-</div>
+</header>
<div class="bs-social">
<ul class="bs-social-buttons">
<li>
- <iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=twbs&repo=bootstrap&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="100px" height="20px"></iframe>
+ <iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=twbs&repo=bootstrap&type=watch&count=true" width="100" height="20" title="Star on GitHub"></iframe>
</li>
<li>
- <iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=twbs&repo=bootstrap&type=fork&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="102px" height="20px"></iframe>
+ <iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=twbs&repo=bootstrap&type=fork&count=true" width="102" height="20" title="Fork on GitHub"></iframe>
</li>
<li class="follow-btn">
<a href="https://twitter.com/twbootstrap" class="twitter-follow-button" data-link-color="#0069D6" data-show-count="true">Follow @twbootstrap</a>
</li>
<li class="tweet-btn">
- <a href="https://twitter.com/share" class="twitter-share-button" data-url="http://twbs.github.com/bootstrap/" data-count="horizontal" data-via="twbootstrap" data-related="mdo:Creator of Twitter Bootstrap">Tweet</a>
+ <a href="https://twitter.com/share" class="twitter-share-button" data-url="http://getbootstrap.com/" data-count="horizontal" data-via="twbootstrap" data-related="mdo:Creator of Twitter Bootstrap">Tweet</a>
</li>
</ul>
</div>
<!-- Place anything custom after this. -->
</head>
<body data-spy="scroll" data-target=".bs-sidebar">
+ <a class="sr-only" href="#content">Skip navigation</a>
<!-- Docs master nav -->
{% include nav-main.html %}
<!-- Docs page layout -->
- <div class="bs-header">
+ <div class="bs-header" id="content" role="banner">
<div class="container">
<h1>{{ page.title }}</h1>
<p>{{ page.lead }}</p>
<!-- Callout for the old docs link -->
{% include old-bs-docs.html %}
- <div class="bs-customize-placeholder">
- <div class="container bs-docs-container">
- <p class="lead">Until RC2, the Bootstrap 3 customizer will be disabled. In the mean time, snag the <a href="{{ site.repo }}/releases">compiled CSS and JavaScript</a>. Hang tight!</p>
+ <div class="container bs-docs-container">
+ <div class="col-lg-12">
+ {{ content }}
</div>
</div>
<!-- Place anything custom after this. -->
</head>
<body>
+ <a class="sr-only" href="#content">Skip navigation</a>
<!-- Docs master nav -->
{% include nav-main.html %}
<!-- Docs page layout -->
- <div class="bs-header">
+ <div class="bs-header" id="content">
<div class="container">
<h1>{{ page.title }}</h1>
<p>{{ page.lead }}</p>
<div class="container bs-docs-container">
<div class="row">
- <div class="col-lg-3">
- <div class="bs-sidebar">
+ <div class="col-md-3">
+ <div class="bs-sidebar hidden-print" role="complementary">
<ul class="nav bs-sidenav">
{% if page.slug == "getting-started" %}
{% include nav-getting-started.html %}
</ul>
</div>
</div>
- <div class="col-lg-9">
+ <div class="col-md-9" role="main">
{{ content }}
</div>
</div>
</div>
- <!-- Quick back to top -->
- <a href="#" class="bs-top">Back to top</a>
-
<!-- Footer
================================================== -->
- <footer class="bs-footer">
+ <footer class="bs-footer" role="contentinfo">
{% include social-buttons.html %}
<p>Designed and built with all the love in the world by <a href="http://twitter.com/mdo" target="_blank">@mdo</a> and <a href="http://twitter.com/fat" target="_blank">@fat</a>.</p>
<!-- Place anything custom after this. -->
</head>
<body class="bs-docs-home">
+ <a class="sr-only" href="#content">Skip navigation</a>
<!-- Docs master nav -->
{% include nav-main.html %}
<!-- Callout for the old docs link -->
{% include old-bs-docs.html %}
- <div class="container">
+ <footer class="container" role="contentinfo">
{% include social-buttons.html %}
<ul class="bs-masthead-links">
<a href="{{ site.repo }}" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'GitHub project']);">GitHub project</a>
</li>
<li>
- <a href="{{ site.examples }}" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'Examples']);">Examples</a>
+ <a href="{{ page.base_url }}getting-started#examples" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'Examples']);">Examples</a>
</li>
<li>
<a href="{{ site.glyphicons }}" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'Glyphicons']);">Glyphicons</a>
</li>
<li>
- <a href="{{ site.expo }}" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'Expo']);">Bootstrap Expo</a>
+ <a href="{{ site.expo }}" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Jumbotron links', 'Expo']);">Expo</a>
</li>
</ul>
- </div>
+ </footer>
<!-- JS and analytics only. -->
{% include footer.html %}
border-color: #e5e5e5;
}
.btn-bs:hover,
+.btn-bs:focus,
.btn-bs:active {
color: #fff;
background-color: #563d7c;
border-color: #563d7c;
}
+/* Homepage button */
+.btn-outline {
+ color: #fff;
+ background-color: transparent;
+ border-color: #cdbfe3;
+}
+.btn-outline:hover,
+.btn-outline:focus,
+.btn-outline:active {
+ color: #563d7c;
+ background-color: #fff;
+ border-color: #fff;
+}
+
/* Temp CSS until RC2 */
.bs-customize-placeholder {
margin-bottom: -100px;
.bs-docs-nav {
background-color: #563d7c;
+ border-color: #463265;
+}
+.bs-docs-nav .navbar-collapse {
+ border-color: #463265;
}
.bs-docs-nav .navbar-brand {
color: #fff;
color: #555;
}
.bs-docs-home .bs-old-docs {
+ padding-top: 0;
+ padding-bottom: 0;
text-align: center;
- border-top: 1px solid #e5e5e5;
+ color: inherit;
+ background-color: transparent;
+ border-color: transparent;
+}
+.bs-docs-home .bs-old-docs a {
+ color: #fff;
+}
+
+/* Homepage */
+.bs-docs-home {
+ color: #cdbfe3;
+ background-color: #563d7c;
}
.bs-masthead h1 {
font-size: 50px;
line-height: 1;
+ color: #fff;
}
/* Download button */
-.bs-masthead .btn-bs {
- margin-top: 5px;
- margin-bottom: 5px;
+.bs-masthead .btn-outline {
+ margin-top: 20px;
+ margin-bottom: 20px;
padding: 18px 24px;
font-size: 21px;
}
.bs-masthead-links {
margin-top: 20px;
margin-bottom: 20px;
- padding-left: 0;
+ padding: 0 15px;
list-style: none;
text-align: center;
}
.bs-masthead-links li + li {
margin-left: 20px;
}
+.bs-masthead-links a {
+ color: #fff;
+}
margin-top: 15px;
}
.bs-customizer input[type="text"] {
+ font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
background-color: #fafafa;
}
.bs-customizer .help-block {
text-align: center;
}
+#less-section label {
+ font-weight: normal;
+}
+
/* Docs pages and sections
}
.bs-docs-section + .bs-docs-section {
- margin-top: 80px;
+ padding-top: 80px;
}
/* Ads in page headers */
/* Nav: second level (shown on .active) */
.bs-sidebar .nav .nav {
- display: none;
+ display: none; /* Hide by default, but at >768px, show it */
margin-bottom: 8px;
}
-.bs-sidebar .nav > .active > ul {
- display: block;
-}
.bs-sidebar .nav .nav > li > a {
padding-top: 3px;
padding-bottom: 3px;
}
+/* Examples grid
+-------------------------------------------------- */
+
+.bs-examples h4 {
+ margin-bottom: 5px;
+}
+.bs-examples p {
+ margin-bottom: 20px;
+}
+
+
/* Special grid styles
-------------------------------------------------- */
.bs-example {
position: relative;
padding: 45px 15px 15px;
- margin: 0 -15px -1px;
+ margin: 0 -15px 15px;
background-color: #fafafa;
box-shadow: inset 0 3px 6px rgba(0,0,0,.05);
border-color: #e5e5e5 #eee #eee;
}
/* Tweak display of the examples */
-.bs-example + .prettyprint,
.bs-example + .highlight {
- margin-top: 0;
- border-top-left-radius: 0;
- border-top-right-radius: 0;
+ margin: -15px -15px 15px;
+ border-radius: 0;
+ border-width: 0 0 1px;
}
/* Tweak content of examples for optimum awesome */
.bs-example > ul:last-child,
.bs-example > ol:last-child,
.bs-example > blockquote:last-child,
-.bs-example > input:last-child,
-.bs-example > select:last-child,
-.bs-example > textarea:last-child,
+.bs-example > .form-control:last-child,
.bs-example > .table:last-child,
-.bs-example > .navbar:last-child
+.bs-example > .navbar:last-child,
.bs-example > .jumbotron:last-child,
.bs-example > .alert:last-child,
.bs-example > .panel:last-child,
.bs-example > .list-group:last-child,
-.bs-example > .well:last-child {
+.bs-example > .well:last-child,
+.bs-example > .progress:last-child {
margin-bottom: 0;
}
.bs-example > p > .close {
}
/* Typography */
-.bs-example-type .table td {
+.bs-example-type .table td:last-child {
color: #999;
vertical-align: middle;
- border-color: ;
}
-.bs-example-type .table td,
-.bs-example-type .table th {
+.bs-example-type .table td {
padding: 15px 0;
border-color: #eee;
}
-.bs-example-type .table tr:first-child td,
-.bs-example-type .table tr:first-child th {
+.bs-example-type .table tr:first-child td {
border-top: 0;
}
.bs-example-type h1,
margin: 0;
}
-/* Forms */
-.bs-example.form-inline select,
-.bs-example.form-inline input[type="text"],
-.bs-example.form-inline input[type="password"] {
- width: 180px;
+/* Images */
+.bs-example > .img-circle,
+.bs-example > .img-rounded,
+.bs-example > .img-thumbnail {
+ margin: 5px;
}
+
+/* Buttons */
+.bs-example > .btn,
+.bs-example > .btn-group {
+ margin-top: 5px;
+ margin-bottom: 5px;
+}
+.bs-example > .btn-toolbar + .btn-toolbar {
+ margin-top: 10px;
+}
+
+/* Forms */
.bs-example-control-sizing select,
.bs-example-control-sizing input[type="text"] + input[type="text"] {
margin-top: 10px;
.bs-example-form .input-group {
margin-bottom: 10px;
}
+.bs-example > textarea.form-control {
+ resize: vertical;
+}
/* List groups */
.bs-example > .list-group {
.bs-navbar-bottom-example {
z-index: 1;
padding: 0;
- min-height: 110px;
overflow: hidden; /* cut the drop shadows off */
}
.bs-navbar-top-example .navbar-fixed-top,
margin-left: 0;
margin-right: 0;
}
-.bs-navbar-top-example .navbar-fixed-top {
- top: -1px;
-}
-.bs-navbar-bottom-example .navbar-fixed-bottom {
- bottom: -1px;
-}
.bs-navbar-top-example {
- -webkit-border-radius: 0 0 4px 4px;
- -moz-border-radius: 0 0 4px 4px;
- border-radius: 0 0 4px 4px;
+ padding-bottom: 45px;
}
.bs-navbar-top-example:after {
top: auto;
bottom: 15px;
- -webkit-border-radius: 0 4px 0 4px;
- -moz-border-radius: 0 4px 0 4px;
- border-radius: 0 4px 0 4px;
+}
+.bs-navbar-top-example .navbar-fixed-top {
+ top: -1px;
}
.bs-navbar-bottom-example {
- -webkit-border-radius: 4px 4px 0 0;
- -moz-border-radius: 4px 4px 0 0;
- border-radius: 4px 4px 0 0;
+ padding-top: 45px;
+}
+.bs-navbar-bottom-example .navbar-fixed-bottom {
+ bottom: -1px;
}
.bs-navbar-bottom-example .navbar {
margin-bottom: 0;
}
+@media (min-width: 768px) {
+ .bs-navbar-top-example {
+ border-radius: 0 0 4px 4px;
+ }
+ .bs-navbar-bottom-example {
+ border-radius: 4px 4px 0 0;
+ }
+}
+
+/* Pagination */
+.bs-example .pagination {
+ margin-top: 10px;
+ margin-bottom: 10px;
+}
+
/* Example modals */
.bs-example-modal {
background-color: #f5f5f5;
}
/* Example dropdowns */
-.bs-example > .dropdown > .dropdown-menu,
-.bs-example-submenu > .pull-left > .dropup > .dropdown-menu,
-.bs-example-submenu > .pull-left > .dropdown > .dropdown-menu {
+.bs-example > .dropdown > .dropdown-menu {
position: static;
display: block;
margin-bottom: 5px;
}
-.bs-example-submenu {
- min-height: 230px;
-}
-.bs-example-submenu > .pull-left + .pull-left {
- margin-left: 20px;
-}
/* Example tabbable tabs */
.bs-example-tabs .nav-tabs {
.bs-example-tooltips {
text-align: center;
}
+.bs-example-tooltips > .btn {
+ margin-top: 5px;
+ margin-bottom: 5px;
+}
/* Popovers */
.bs-example-popover {
}
-
-/* Example templates
--------------------------------------------------- */
-
-.bs-examples h4 {
- margin-bottom: 5px;
-}
-.bs-examples p {
- margin-bottom: 20px;
-}
-
-
-
/* Responsive docs
-------------------------------------------------- */
border-bottom: 0;
}
}
+.bs-table-scrollable .highlight pre {
+ white-space: normal;
+}
+
/* Related: responsive utilities tables */
.table code {
------------------------- */
.responsive-utilities-test {
margin-top: 5px;
- padding-left: 0;
- list-style: none;
- overflow: hidden; /* clear floats */
-}
-.responsive-utilities-test li {
- position: relative;
- float: left;
- width: 25%;
}
-.responsive-utilities-test li + li {
- margin-left: 10px;
+.responsive-utilities-test .col-xs-6 {
+ margin-bottom: 10px;
}
.responsive-utilities-test span {
padding: 15px 10px;
text-align: center;
border-radius: 4px;
}
-.responsive-utilities-test.visible-on [class*="hidden"],
-.responsive-utilities-test.hidden-on [class*="visible"] {
+.visible-on .col-xs-6 .hidden-xs,
+.visible-on .col-xs-6 .hidden-sm,
+.visible-on .col-xs-6 .hidden-md,
+.visible-on .col-xs-6 .hidden-lg,
+.hidden-on .col-xs-6 .visible-xs,
+.hidden-on .col-xs-6 .visible-sm,
+.hidden-on .col-xs-6 .visible-md,
+.hidden-on .col-xs-6 .visible-lg {
color: #999;
border: 1px solid #ddd;
}
-.responsive-utilities-test.visible-on [class*="visible"],
-.responsive-utilities-test.hidden-on [class*="hidden"] {
+.visible-on .col-xs-6 .visible-xs,
+.visible-on .col-xs-6 .visible-sm,
+.visible-on .col-xs-6 .visible-md,
+.visible-on .col-xs-6 .visible-lg,
+.hidden-on .col-xs-6 .hidden-xs,
+.hidden-on .col-xs-6 .hidden-sm,
+.hidden-on .col-xs-6 .hidden-md,
+.hidden-on .col-xs-6 .hidden-lg {
color: #468847;
background-color: #dff0d8;
border: 1px solid #d6e9c6;
.bs-social-buttons li {
display: inline-block;
line-height: 1;
-}
-.bs-social-buttons li + li {
- margin-left: 15px;
+ padding: 5px 8px;
}
.bs-social-buttons .twitter-follow-button {
width: 225px !important;
.bs-social-buttons .twitter-share-button {
width: 98px !important;
}
+/* Style the GitHub buttons via CSS instead of inline attributes */
+.github-btn {
+ border: 0;
+ overflow: hidden;
+}
-------------------------------------------------- */
/* Pseudo :focus state for showing how it looks in the docs */
-input.focused {
+#focusedInput {
border-color: rgba(82,168,236,.8);
outline: 0;
outline: thin dotted \9; /* IE6-9 */
margin-bottom: 5px;
}
-/* Hide the top link initially */
-.bs-top {
- display: none;
-}
-
/* Responsive variations
-------------------------------------------------- */
/* Tablets and up */
@media screen and (min-width: 768px) {
- /* Back to top link */
- .bs-top {
- display: block; /* Unhide */
- float: left;
- padding: 7px 15px;
- font-weight: 500;
- color: #999;
- background-color: #eee;
- border-radius: 4px;
- }
- .bs-top:hover {
- color: #fff;
- text-decoration: none;
- background-color: #999;
- }
- .bs-top.affix {
- position: fixed;
- right: 15px;
- bottom: 15px;
- }
.bs-header {
font-size: 21px;
text-align: left;
border-radius: 4px 4px 0 0;
box-shadow: none;
}
+ .bs-example + .prettyprint,
+ .bs-example + .highlight {
+ margin-top: -16px;
+ margin-left: 0;
+ margin-right: 0;
+ border-width: 1px;
+ border-bottom-left-radius: 4px;
+ border-bottom-right-radius: 4px;
+ }
+
+ .bs-masthead-links {
+ padding: 0;
+ }
.carbonad {
margin: 0 !important;
/* Tweak display of docs jumbotrons */
.bs-masthead {
- padding-top: 100px;
- padding-bottom: 100px;
+ padding-top: 140px;
+ padding-bottom: 140px;
}
.bs-masthead h1 {
font-size: 100px;
}
- .bs-masthead p {
+ .bs-masthead .lead {
margin-left: 15%;
margin-right: 15%;
font-size: 30px;
/* Tablets/desktops and up */
@media screen and (min-width: 992px) {
+ .bs-header h1,
+ .bs-header p {
+ margin-right: 380px;
+ }
+ .carbonad {
+ position: absolute;
+ top: 20px;
+ right: 0;
+ padding: 15px !important;
+ width: 330px !important;
+ min-height: 132px;
+ }
+ /* Show the hidden subnavs when space allows it */
+ .bs-sidebar .nav > .active > ul {
+ display: block;
+ }
/* Widen the fixed sidebar */
.bs-sidebar.affix,
.bs-sidebar.affix-bottom {
margin-top: 0;
margin-bottom: 0;
}
- .bs-header h1,
- .bs-header p {
- margin-right: 380px;
- }
- .carbonad {
- position: absolute;
- top: 20px;
- right: 0;
- padding: 15px !important;
- width: 330px !important;
- min-height: 132px;
- }
-
}
/* Large desktops and up */
/* Widen the fixed sidebar again */
.bs-sidebar.affix-bottom,
.bs-sidebar.affix {
- width: 270px;
+ width: 263px;
}
}
$(function(){
var $window = $(window)
+ var $body = $(document.body)
var navHeight = $('.navbar').outerHeight(true) + 10
- $(document.body).scrollspy({
+ $body.scrollspy({
target: '.bs-sidebar',
offset: navHeight
})
- $('[href=#]').click(function (e) {
- e.preventDefault()
+ $window.on('load', function () {
+ $body.scrollspy('refresh')
})
- $(document.body).on('click', '.bs-sidenav [href^=#]', function (e) {
- var $target = $(this.getAttribute('href'))
-
- e.preventDefault() // prevent browser scroll
-
- document.body.scrollTop =
- $target.offset().top -
- navHeight + 5 // offset scroll by nav
+ $('.bs-docs-container [href=#]').click(function (e) {
+ e.preventDefault()
})
// back to top
// tooltip demo
$('.tooltip-demo').tooltip({
- selector: "[data-toggle=tooltip]"
+ selector: "[data-toggle=tooltip]",
+ container: "body"
})
$('.tooltip-test').tooltip()
// carousel demo
$('.bs-docs-carousel-example').carousel()
-
- // javascript build logic
- var inputsComponent = $("#less input")
- , inputsPlugin = $("#plugins input")
- , inputsVariables = $("#less-variables input")
-
- // toggle all plugin checkboxes
- $('#less .toggle').on('click', function (e) {
- e.preventDefault()
- inputsComponent.prop('checked', !inputsComponent.is(':checked'))
- })
-
- $('#plugins .toggle').on('click', function (e) {
- e.preventDefault()
- inputsPlugin.prop('checked', !inputsPlugin.is(':checked'))
- })
-
- $('#less-variables .toggle').on('click', function (e) {
- e.preventDefault()
- inputsVariables.val('')
- })
-
- // request built javascript
- $('.bs-customize-download .btn').on('click', function (e) {
- e.preventDefault()
-
- var css = $("#less input:checked")
- .map(function () { return this.value })
- .toArray()
- , js = $("#plugins input:checked")
- .map(function () { return this.value })
- .toArray()
- , vars = {}
-
- $("#less-variables input")
- .each(function () {
- $(this).val() && (vars[ $(this).prev().text() ] = $(this).val())
- })
-
- $.ajax({
- type: 'POST'
- , url: /localhost/.test(window.location) ? 'http://localhost:9001' : 'http://bootstrap.herokuapp.com'
- , dataType: 'jsonpi'
- , params: {
- js: js
- , css: css
- , vars: vars
- }
- })
- })
- })
-
-// Modified from the original jsonpi https://github.com/benvinegar/jquery-jsonpi
-$.ajaxTransport('jsonpi', function(opts, originalOptions, jqXHR) {
- var url = opts.url;
-
- return {
- send: function(_, completeCallback) {
- var name = 'jQuery_iframe_' + jQuery.now()
- , iframe, form
-
- iframe = $('<iframe>')
- .attr('name', name)
- .appendTo('head')
-
- form = $('<form>')
- .attr('method', opts.type) // GET or POST
- .attr('action', url)
- .attr('target', name)
-
- $.each(opts.params, function(k, v) {
-
- $('<input>')
- .attr('type', 'hidden')
- .attr('name', k)
- .attr('value', typeof v == 'string' ? v : JSON.stringify(v))
- .appendTo(form)
- })
-
- form.appendTo('body').submit()
- }
- }
})
}(window.jQuery)
--- /dev/null
+window.onload = function () { // wait for load in a dumb way because B-0
+ var cw = '/*!\n * Bootstrap v3.0.0-rc.2\n *\n * Copyright 2013 Twitter, Inc\n * Licensed under the Apache License v2.0\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Designed and built with all the love in the world @twitter by @mdo and @fat.\n */\n\n'
+
+ function generateUrl() {
+ var vars = {}
+
+ $('#less-variables-section input')
+ .each(function () {
+ $(this).val() && (vars[ $(this).prev().text() ] = $(this).val())
+ })
+
+ var data = {
+ vars: vars,
+ css: $('#less-section input:not(:checked)').map(function () { return this.value }).toArray(),
+ js: $('#plugin-section input:not(:checked)').map(function () { return this.value }).toArray()
+ }
+
+ if ($.isEmptyObject(data.vars) && !data.css.length && !data.js.length) return
+
+ window.location = jQuery.param.querystring('/customize/', data)
+ }
+
+ function parseUrl() {
+ var data = jQuery.deparam.querystring()
+
+ if (data.js) {
+ for (var i = 0; i < data.js.length; i++) {
+ var input = $('input[value="'+data.js[i]+'"]')
+ input && input.prop('checked', false)
+ }
+ }
+
+ if (data.css) {
+ for (var i = 0; i < data.css.length; i++) {
+ var input = $('input[value="'+data.css[i]+'"]')
+ input && input.prop('checked', false)
+ }
+ }
+
+ if (data.vars) {
+ // todo (fat): vars
+ }
+ }
+
+ function generateZip(css, js, complete) {
+ if (!css && !js) return alert('you want to build nothing… o_O')
+
+ var zip = new JSZip()
+
+ if (css) {
+ var cssFolder = zip.folder('css')
+ for (var fileName in css) {
+ cssFolder.file(fileName, css[fileName])
+ }
+ }
+
+ if (js) {
+ var jsFolder = zip.folder('js')
+ for (var fileName in js) {
+ jsFolder.file(fileName, js[fileName])
+ }
+ }
+
+ var content = zip.generate()
+
+ location.href = 'data:application/zip;base64,' + content
+
+ complete()
+ }
+
+ function generateCustomCSS(vars) {
+ var result = ''
+
+ for (var key in vars) {
+ result += key + ': ' + vars[key] + ';\n'
+ }
+
+ return result + '\n\n'
+ }
+
+ function generateCSS() {
+ var $checked = $('#less-section input:checked')
+
+ if (!$checked.length) return false
+
+ var result = {}
+ var vars = {}
+ var css = ''
+
+ $('#less-variables-section input')
+ .each(function () {
+ $(this).val() && (vars[ $(this).prev().text() ] = $(this).val())
+ })
+
+ css += __less['variables.less']
+ if (vars) css += generateCustomCSS(vars)
+ css += __less['mixins.less']
+ css += $checked
+ .map(function () { return __less[this.value] })
+ .toArray()
+ .join('\n')
+
+ css = css.replace(/@import[^\n]*/gi, '') //strip any imports
+
+ try {
+ var parser = new less.Parser({
+ paths: ['variables.less', 'mixins.less']
+ , optimization: 0
+ , filename: 'bootstrap.css'
+ }).parse(css, function (err, tree) {
+ if (err) return alert(err)
+
+ result = {
+ 'bootstrap.css' : cw + tree.toCSS(),
+ 'bootstrap.min.css' : cw + tree.toCSS({ compress: true })
+ }
+ })
+ } catch (err) {
+ return alert(err)
+ }
+
+ return result
+ }
+
+ function generateJavascript() {
+ var $checked = $('#plugin-section input:checked')
+ if (!$checked.length) return false
+
+ var js = $checked
+ .map(function () { return __js[this.value] })
+ .toArray()
+ .join('\n')
+
+ return {
+ 'bootstrap.js': js,
+ 'bootstrap.min.js': cw + uglify(js)
+ }
+ }
+
+ var $downloadBtn = $('#btn-download').on('click', function (e) {
+ e.preventDefault()
+ $downloadBtn.addClass('loading')
+ generateZip(generateCSS(), generateJavascript(), function () {
+ $downloadBtn.removeClass('loading')
+ setTimeout(function () {
+ generateUrl()
+ }, 1)
+ })
+ })
+
+ var inputsComponent = $('#less-section input')
+ var inputsPlugin = $('#plugin-section input')
+ var inputsVariables = $('#less-variables-section input')
+
+ $('#less-section .toggle').on('click', function (e) {
+ e.preventDefault()
+ inputsComponent.prop('checked', !inputsComponent.is(':checked'))
+ })
+
+ $('#plugin-section .toggle').on('click', function (e) {
+ e.preventDefault()
+ inputsPlugin.prop('checked', !inputsPlugin.is(':checked'))
+ })
+
+ $('#less-variables-section .toggle').on('click', function (e) {
+ e.preventDefault()
+ inputsVariables.val('')
+ })
+
+ try {
+ parseUrl()
+ } catch (e) {
+ // maybe alert user that we can't parse their url
+ }
+}
\ No newline at end of file
--- /dev/null
+/*!
+ * jQuery BBQ: Back Button & Query Library - v1.3pre - 8/26/2010
+ * http://benalman.com/projects/jquery-bbq-plugin/
+ *
+ * Copyright (c) 2010 "Cowboy" Ben Alman
+ * Dual licensed under the MIT and GPL licenses.
+ * http://benalman.com/about/license/
+ */
+
+// Script: jQuery BBQ: Back Button & Query Library
+//
+// *Version: 1.3pre, Last updated: 8/26/2010*
+//
+// Project Home - http://benalman.com/projects/jquery-bbq-plugin/
+// GitHub - http://github.com/cowboy/jquery-bbq/
+// Source - http://github.com/cowboy/jquery-bbq/raw/master/jquery.ba-bbq.js
+// (Minified) - http://github.com/cowboy/jquery-bbq/raw/master/jquery.ba-bbq.min.js (2.2kb gzipped)
+//
+// About: License
+//
+// Copyright (c) 2010 "Cowboy" Ben Alman,
+// Dual licensed under the MIT and GPL licenses.
+// http://benalman.com/about/license/
+//
+// About: Examples
+//
+// These working examples, complete with fully commented code, illustrate a few
+// ways in which this plugin can be used.
+//
+// Basic AJAX - http://benalman.com/code/projects/jquery-bbq/examples/fragment-basic/
+// Advanced AJAX - http://benalman.com/code/projects/jquery-bbq/examples/fragment-advanced/
+// jQuery UI Tabs - http://benalman.com/code/projects/jquery-bbq/examples/fragment-jquery-ui-tabs/
+// Deparam - http://benalman.com/code/projects/jquery-bbq/examples/deparam/
+//
+// About: Support and Testing
+//
+// Information about what version or versions of jQuery this plugin has been
+// tested with, what browsers it has been tested in, and where the unit tests
+// reside (so you can test it yourself).
+//
+// jQuery Versions - 1.2.6, 1.3.2, 1.4.1, 1.4.2
+// Browsers Tested - Internet Explorer 6-8, Firefox 2-4, Chrome 5-6, Safari 3.2-5,
+// Opera 9.6-10.60, iPhone 3.1, Android 1.6-2.2, BlackBerry 4.6-5.
+// Unit Tests - http://benalman.com/code/projects/jquery-bbq/unit/
+//
+// About: Release History
+//
+// 1.3pre - (8/26/2010) Integrated <jQuery hashchange event> v1.3, which adds
+// document.title and document.domain support in IE6/7, BlackBerry
+// support, better Iframe hiding for accessibility reasons, and the new
+// <jQuery.fn.hashchange> "shortcut" method. Added the
+// <jQuery.param.sorted> method which reduces the possibility of
+// extraneous hashchange event triggering. Added the
+// <jQuery.param.fragment.ajaxCrawlable> method which can be used to
+// enable Google "AJAX Crawlable mode."
+// 1.2.1 - (2/17/2010) Actually fixed the stale window.location Safari bug from
+// <jQuery hashchange event> in BBQ, which was the main reason for the
+// previous release!
+// 1.2 - (2/16/2010) Integrated <jQuery hashchange event> v1.2, which fixes a
+// Safari bug, the event can now be bound before DOM ready, and IE6/7
+// page should no longer scroll when the event is first bound. Also
+// added the <jQuery.param.fragment.noEscape> method, and reworked the
+// <hashchange event (BBQ)> internal "add" method to be compatible with
+// changes made to the jQuery 1.4.2 special events API.
+// 1.1.1 - (1/22/2010) Integrated <jQuery hashchange event> v1.1, which fixes an
+// obscure IE8 EmulateIE7 meta tag compatibility mode bug.
+// 1.1 - (1/9/2010) Broke out the jQuery BBQ event.special <hashchange event>
+// functionality into a separate plugin for users who want just the
+// basic event & back button support, without all the extra awesomeness
+// that BBQ provides. This plugin will be included as part of jQuery BBQ,
+// but also be available separately. See <jQuery hashchange event>
+// plugin for more information. Also added the <jQuery.bbq.removeState>
+// method and added additional <jQuery.deparam> examples.
+// 1.0.3 - (12/2/2009) Fixed an issue in IE 6 where location.search and
+// location.hash would report incorrectly if the hash contained the ?
+// character. Also <jQuery.param.querystring> and <jQuery.param.fragment>
+// will no longer parse params out of a URL that doesn't contain ? or #,
+// respectively.
+// 1.0.2 - (10/10/2009) Fixed an issue in IE 6/7 where the hidden IFRAME caused
+// a "This page contains both secure and nonsecure items." warning when
+// used on an https:// page.
+// 1.0.1 - (10/7/2009) Fixed an issue in IE 8. Since both "IE7" and "IE8
+// Compatibility View" modes erroneously report that the browser
+// supports the native window.onhashchange event, a slightly more
+// robust test needed to be added.
+// 1.0 - (10/2/2009) Initial release
+
+(function($,window){
+ '$:nomunge'; // Used by YUI compressor.
+
+ // Some convenient shortcuts.
+ var undefined,
+ aps = Array.prototype.slice,
+ decode = decodeURIComponent,
+
+ // Method / object references.
+ jq_param = $.param,
+ jq_param_sorted,
+ jq_param_fragment,
+ jq_deparam,
+ jq_deparam_fragment,
+ jq_bbq = $.bbq = $.bbq || {},
+ jq_bbq_pushState,
+ jq_bbq_getState,
+ jq_elemUrlAttr,
+ special = $.event.special,
+
+ // Reused strings.
+ str_hashchange = 'hashchange',
+ str_querystring = 'querystring',
+ str_fragment = 'fragment',
+ str_elemUrlAttr = 'elemUrlAttr',
+ str_href = 'href',
+ str_src = 'src',
+
+ // Reused RegExp.
+ re_params_querystring = /^.*\?|#.*$/g,
+ re_params_fragment,
+ re_fragment,
+ re_no_escape,
+
+ ajax_crawlable,
+ fragment_prefix,
+
+ // Used by jQuery.elemUrlAttr.
+ elemUrlAttr_cache = {};
+
+ // A few commonly used bits, broken out to help reduce minified file size.
+
+ function is_string( arg ) {
+ return typeof arg === 'string';
+ };
+
+ // Why write the same function twice? Let's curry! Mmmm, curry..
+
+ function curry( func ) {
+ var args = aps.call( arguments, 1 );
+
+ return function() {
+ return func.apply( this, args.concat( aps.call( arguments ) ) );
+ };
+ };
+
+ // Get location.hash (or what you'd expect location.hash to be) sans any
+ // leading #. Thanks for making this necessary, Firefox!
+ function get_fragment( url ) {
+ return url.replace( re_fragment, '$2' );
+ };
+
+ // Get location.search (or what you'd expect location.search to be) sans any
+ // leading #. Thanks for making this necessary, IE6!
+ function get_querystring( url ) {
+ return url.replace( /(?:^[^?#]*\?([^#]*).*$)?.*/, '$1' );
+ };
+
+ // Section: Param (to string)
+ //
+ // Method: jQuery.param.querystring
+ //
+ // Retrieve the query string from a URL or if no arguments are passed, the
+ // current window.location.href.
+ //
+ // Usage:
+ //
+ // > jQuery.param.querystring( [ url ] );
+ //
+ // Arguments:
+ //
+ // url - (String) A URL containing query string params to be parsed. If url
+ // is not passed, the current window.location.href is used.
+ //
+ // Returns:
+ //
+ // (String) The parsed query string, with any leading "?" removed.
+ //
+
+ // Method: jQuery.param.querystring (build url)
+ //
+ // Merge a URL, with or without pre-existing query string params, plus any
+ // object, params string or URL containing query string params into a new URL.
+ //
+ // Usage:
+ //
+ // > jQuery.param.querystring( url, params [, merge_mode ] );
+ //
+ // Arguments:
+ //
+ // url - (String) A valid URL for params to be merged into. This URL may
+ // contain a query string and/or fragment (hash).
+ // params - (String) A params string or URL containing query string params to
+ // be merged into url.
+ // params - (Object) A params object to be merged into url.
+ // merge_mode - (Number) Merge behavior defaults to 0 if merge_mode is not
+ // specified, and is as-follows:
+ //
+ // * 0: params in the params argument will override any query string
+ // params in url.
+ // * 1: any query string params in url will override params in the params
+ // argument.
+ // * 2: params argument will completely replace any query string in url.
+ //
+ // Returns:
+ //
+ // (String) A URL with a urlencoded query string in the format '?a=b&c=d&e=f'.
+
+ // Method: jQuery.param.fragment
+ //
+ // Retrieve the fragment (hash) from a URL or if no arguments are passed, the
+ // current window.location.href.
+ //
+ // Usage:
+ //
+ // > jQuery.param.fragment( [ url ] );
+ //
+ // Arguments:
+ //
+ // url - (String) A URL containing fragment (hash) params to be parsed. If
+ // url is not passed, the current window.location.href is used.
+ //
+ // Returns:
+ //
+ // (String) The parsed fragment (hash) string, with any leading "#" removed.
+
+ // Method: jQuery.param.fragment (build url)
+ //
+ // Merge a URL, with or without pre-existing fragment (hash) params, plus any
+ // object, params string or URL containing fragment (hash) params into a new
+ // URL.
+ //
+ // Usage:
+ //
+ // > jQuery.param.fragment( url, params [, merge_mode ] );
+ //
+ // Arguments:
+ //
+ // url - (String) A valid URL for params to be merged into. This URL may
+ // contain a query string and/or fragment (hash).
+ // params - (String) A params string or URL containing fragment (hash) params
+ // to be merged into url.
+ // params - (Object) A params object to be merged into url.
+ // merge_mode - (Number) Merge behavior defaults to 0 if merge_mode is not
+ // specified, and is as-follows:
+ //
+ // * 0: params in the params argument will override any fragment (hash)
+ // params in url.
+ // * 1: any fragment (hash) params in url will override params in the
+ // params argument.
+ // * 2: params argument will completely replace any query string in url.
+ //
+ // Returns:
+ //
+ // (String) A URL with a urlencoded fragment (hash) in the format '#a=b&c=d&e=f'.
+
+ function jq_param_sub( is_fragment, get_func, url, params, merge_mode ) {
+ var result,
+ qs,
+ matches,
+ url_params,
+ hash;
+
+ if ( params !== undefined ) {
+ // Build URL by merging params into url string.
+
+ // matches[1] = url part that precedes params, not including trailing ?/#
+ // matches[2] = params, not including leading ?/#
+ // matches[3] = if in 'querystring' mode, hash including leading #, otherwise ''
+ matches = url.match( is_fragment ? re_fragment : /^([^#?]*)\??([^#]*)(#?.*)/ );
+
+ // Get the hash if in 'querystring' mode, and it exists.
+ hash = matches[3] || '';
+
+ if ( merge_mode === 2 && is_string( params ) ) {
+ // If merge_mode is 2 and params is a string, merge the fragment / query
+ // string into the URL wholesale, without converting it into an object.
+ qs = params.replace( is_fragment ? re_params_fragment : re_params_querystring, '' );
+
+ } else {
+ // Convert relevant params in url to object.
+ url_params = jq_deparam( matches[2] );
+
+ params = is_string( params )
+
+ // Convert passed params string into object.
+ ? jq_deparam[ is_fragment ? str_fragment : str_querystring ]( params )
+
+ // Passed params object.
+ : params;
+
+ qs = merge_mode === 2 ? params // passed params replace url params
+ : merge_mode === 1 ? $.extend( {}, params, url_params ) // url params override passed params
+ : $.extend( {}, url_params, params ); // passed params override url params
+
+ // Convert params object into a sorted params string.
+ qs = jq_param_sorted( qs );
+
+ // Unescape characters specified via $.param.noEscape. Since only hash-
+ // history users have requested this feature, it's only enabled for
+ // fragment-related params strings.
+ if ( is_fragment ) {
+ qs = qs.replace( re_no_escape, decode );
+ }
+ }
+
+ // Build URL from the base url, querystring and hash. In 'querystring'
+ // mode, ? is only added if a query string exists. In 'fragment' mode, #
+ // is always added.
+ result = matches[1] + ( is_fragment ? fragment_prefix : qs || !matches[1] ? '?' : '' ) + qs + hash;
+
+ } else {
+ // If URL was passed in, parse params from URL string, otherwise parse
+ // params from window.location.href.
+ result = get_func( url !== undefined ? url : location.href );
+ }
+
+ return result;
+ };
+
+ jq_param[ str_querystring ] = curry( jq_param_sub, 0, get_querystring );
+ jq_param[ str_fragment ] = jq_param_fragment = curry( jq_param_sub, 1, get_fragment );
+
+ // Method: jQuery.param.sorted
+ //
+ // Returns a params string equivalent to that returned by the internal
+ // jQuery.param method, but sorted, which makes it suitable for use as a
+ // cache key.
+ //
+ // For example, in most browsers jQuery.param({z:1,a:2}) returns "z=1&a=2"
+ // and jQuery.param({a:2,z:1}) returns "a=2&z=1". Even though both the
+ // objects being serialized and the resulting params strings are equivalent,
+ // if these params strings were set into the location.hash fragment
+ // sequentially, the hashchange event would be triggered unnecessarily, since
+ // the strings are different (even though the data described by them is the
+ // same). By sorting the params string, unecessary hashchange event triggering
+ // can be avoided.
+ //
+ // Usage:
+ //
+ // > jQuery.param.sorted( obj [, traditional ] );
+ //
+ // Arguments:
+ //
+ // obj - (Object) An object to be serialized.
+ // traditional - (Boolean) Params deep/shallow serialization mode. See the
+ // documentation at http://api.jquery.com/jQuery.param/ for more detail.
+ //
+ // Returns:
+ //
+ // (String) A sorted params string.
+
+ jq_param.sorted = jq_param_sorted = function( a, traditional ) {
+ var arr = [],
+ obj = {};
+
+ $.each( jq_param( a, traditional ).split( '&' ), function(i,v){
+ var key = v.replace( /(?:%5B|=).*$/, '' ),
+ key_obj = obj[ key ];
+
+ if ( !key_obj ) {
+ key_obj = obj[ key ] = [];
+ arr.push( key );
+ }
+
+ key_obj.push( v );
+ });
+
+ return $.map( arr.sort(), function(v){
+ return obj[ v ];
+ }).join( '&' );
+ };
+
+ // Method: jQuery.param.fragment.noEscape
+ //
+ // Specify characters that will be left unescaped when fragments are created
+ // or merged using <jQuery.param.fragment>, or when the fragment is modified
+ // using <jQuery.bbq.pushState>. This option only applies to serialized data
+ // object fragments, and not set-as-string fragments. Does not affect the
+ // query string. Defaults to ",/" (comma, forward slash).
+ //
+ // Note that this is considered a purely aesthetic option, and will help to
+ // create URLs that "look pretty" in the address bar or bookmarks, without
+ // affecting functionality in any way. That being said, be careful to not
+ // unescape characters that are used as delimiters or serve a special
+ // purpose, such as the "#?&=+" (octothorpe, question mark, ampersand,
+ // equals, plus) characters.
+ //
+ // Usage:
+ //
+ // > jQuery.param.fragment.noEscape( [ chars ] );
+ //
+ // Arguments:
+ //
+ // chars - (String) The characters to not escape in the fragment. If
+ // unspecified, defaults to empty string (escape all characters).
+ //
+ // Returns:
+ //
+ // Nothing.
+
+ jq_param_fragment.noEscape = function( chars ) {
+ chars = chars || '';
+ var arr = $.map( chars.split(''), encodeURIComponent );
+ re_no_escape = new RegExp( arr.join('|'), 'g' );
+ };
+
+ // A sensible default. These are the characters people seem to complain about
+ // "uglifying up the URL" the most.
+ jq_param_fragment.noEscape( ',/' );
+
+ // Method: jQuery.param.fragment.ajaxCrawlable
+ //
+ // TODO: DESCRIBE
+ //
+ // Usage:
+ //
+ // > jQuery.param.fragment.ajaxCrawlable( [ state ] );
+ //
+ // Arguments:
+ //
+ // state - (Boolean) TODO: DESCRIBE
+ //
+ // Returns:
+ //
+ // (Boolean) The current ajaxCrawlable state.
+
+ jq_param_fragment.ajaxCrawlable = function( state ) {
+ if ( state !== undefined ) {
+ if ( state ) {
+ re_params_fragment = /^.*(?:#!|#)/;
+ re_fragment = /^([^#]*)(?:#!|#)?(.*)$/;
+ fragment_prefix = '#!';
+ } else {
+ re_params_fragment = /^.*#/;
+ re_fragment = /^([^#]*)#?(.*)$/;
+ fragment_prefix = '#';
+ }
+ ajax_crawlable = !!state;
+ }
+
+ return ajax_crawlable;
+ };
+
+ jq_param_fragment.ajaxCrawlable( 0 );
+
+ // Section: Deparam (from string)
+ //
+ // Method: jQuery.deparam
+ //
+ // Deserialize a params string into an object, optionally coercing numbers,
+ // booleans, null and undefined values; this method is the counterpart to the
+ // internal jQuery.param method.
+ //
+ // Usage:
+ //
+ // > jQuery.deparam( params [, coerce ] );
+ //
+ // Arguments:
+ //
+ // params - (String) A params string to be parsed.
+ // coerce - (Boolean) If true, coerces any numbers or true, false, null, and
+ // undefined to their actual value. Defaults to false if omitted.
+ //
+ // Returns:
+ //
+ // (Object) An object representing the deserialized params string.
+
+ $.deparam = jq_deparam = function( params, coerce ) {
+ var obj = {},
+ coerce_types = { 'true': !0, 'false': !1, 'null': null };
+
+ // Iterate over all name=value pairs.
+ $.each( params.replace( /\+/g, ' ' ).split( '&' ), function(j,v){
+ var param = v.split( '=' ),
+ key = decode( param[0] ),
+ val,
+ cur = obj,
+ i = 0,
+
+ // If key is more complex than 'foo', like 'a[]' or 'a[b][c]', split it
+ // into its component parts.
+ keys = key.split( '][' ),
+ keys_last = keys.length - 1;
+
+ // If the first keys part contains [ and the last ends with ], then []
+ // are correctly balanced.
+ if ( /\[/.test( keys[0] ) && /\]$/.test( keys[ keys_last ] ) ) {
+ // Remove the trailing ] from the last keys part.
+ keys[ keys_last ] = keys[ keys_last ].replace( /\]$/, '' );
+
+ // Split first keys part into two parts on the [ and add them back onto
+ // the beginning of the keys array.
+ keys = keys.shift().split('[').concat( keys );
+
+ keys_last = keys.length - 1;
+ } else {
+ // Basic 'foo' style key.
+ keys_last = 0;
+ }
+
+ // Are we dealing with a name=value pair, or just a name?
+ if ( param.length === 2 ) {
+ val = decode( param[1] );
+
+ // Coerce values.
+ if ( coerce ) {
+ val = val && !isNaN(val) ? +val // number
+ : val === 'undefined' ? undefined // undefined
+ : coerce_types[val] !== undefined ? coerce_types[val] // true, false, null
+ : val; // string
+ }
+
+ if ( keys_last ) {
+ // Complex key, build deep object structure based on a few rules:
+ // * The 'cur' pointer starts at the object top-level.
+ // * [] = array push (n is set to array length), [n] = array if n is
+ // numeric, otherwise object.
+ // * If at the last keys part, set the value.
+ // * For each keys part, if the current level is undefined create an
+ // object or array based on the type of the next keys part.
+ // * Move the 'cur' pointer to the next level.
+ // * Rinse & repeat.
+ for ( ; i <= keys_last; i++ ) {
+ key = keys[i] === '' ? cur.length : keys[i];
+ cur = cur[key] = i < keys_last
+ ? cur[key] || ( keys[i+1] && isNaN( keys[i+1] ) ? {} : [] )
+ : val;
+ }
+
+ } else {
+ // Simple key, even simpler rules, since only scalars and shallow
+ // arrays are allowed.
+
+ if ( $.isArray( obj[key] ) ) {
+ // val is already an array, so push on the next value.
+ obj[key].push( val );
+
+ } else if ( obj[key] !== undefined ) {
+ // val isn't an array, but since a second value has been specified,
+ // convert val into an array.
+ obj[key] = [ obj[key], val ];
+
+ } else {
+ // val is a scalar.
+ obj[key] = val;
+ }
+ }
+
+ } else if ( key ) {
+ // No value was defined, so set something meaningful.
+ obj[key] = coerce
+ ? undefined
+ : '';
+ }
+ });
+
+ return obj;
+ };
+
+ // Method: jQuery.deparam.querystring
+ //
+ // Parse the query string from a URL or the current window.location.href,
+ // deserializing it into an object, optionally coercing numbers, booleans,
+ // null and undefined values.
+ //
+ // Usage:
+ //
+ // > jQuery.deparam.querystring( [ url ] [, coerce ] );
+ //
+ // Arguments:
+ //
+ // url - (String) An optional params string or URL containing query string
+ // params to be parsed. If url is omitted, the current
+ // window.location.href is used.
+ // coerce - (Boolean) If true, coerces any numbers or true, false, null, and
+ // undefined to their actual value. Defaults to false if omitted.
+ //
+ // Returns:
+ //
+ // (Object) An object representing the deserialized params string.
+
+ // Method: jQuery.deparam.fragment
+ //
+ // Parse the fragment (hash) from a URL or the current window.location.href,
+ // deserializing it into an object, optionally coercing numbers, booleans,
+ // null and undefined values.
+ //
+ // Usage:
+ //
+ // > jQuery.deparam.fragment( [ url ] [, coerce ] );
+ //
+ // Arguments:
+ //
+ // url - (String) An optional params string or URL containing fragment (hash)
+ // params to be parsed. If url is omitted, the current window.location.href
+ // is used.
+ // coerce - (Boolean) If true, coerces any numbers or true, false, null, and
+ // undefined to their actual value. Defaults to false if omitted.
+ //
+ // Returns:
+ //
+ // (Object) An object representing the deserialized params string.
+
+ function jq_deparam_sub( is_fragment, url_or_params, coerce ) {
+ if ( url_or_params === undefined || typeof url_or_params === 'boolean' ) {
+ // url_or_params not specified.
+ coerce = url_or_params;
+ url_or_params = jq_param[ is_fragment ? str_fragment : str_querystring ]();
+ } else {
+ url_or_params = is_string( url_or_params )
+ ? url_or_params.replace( is_fragment ? re_params_fragment : re_params_querystring, '' )
+ : url_or_params;
+ }
+
+ return jq_deparam( url_or_params, coerce );
+ };
+
+ jq_deparam[ str_querystring ] = curry( jq_deparam_sub, 0 );
+ jq_deparam[ str_fragment ] = jq_deparam_fragment = curry( jq_deparam_sub, 1 );
+
+ // Section: Element manipulation
+ //
+ // Method: jQuery.elemUrlAttr
+ //
+ // Get the internal "Default URL attribute per tag" list, or augment the list
+ // with additional tag-attribute pairs, in case the defaults are insufficient.
+ //
+ // In the <jQuery.fn.querystring> and <jQuery.fn.fragment> methods, this list
+ // is used to determine which attribute contains the URL to be modified, if
+ // an "attr" param is not specified.
+ //
+ // Default Tag-Attribute List:
+ //
+ // a - href
+ // base - href
+ // iframe - src
+ // img - src
+ // input - src
+ // form - action
+ // link - href
+ // script - src
+ //
+ // Usage:
+ //
+ // > jQuery.elemUrlAttr( [ tag_attr ] );
+ //
+ // Arguments:
+ //
+ // tag_attr - (Object) An object containing a list of tag names and their
+ // associated default attribute names in the format { tag: 'attr', ... } to
+ // be merged into the internal tag-attribute list.
+ //
+ // Returns:
+ //
+ // (Object) An object containing all stored tag-attribute values.
+
+ // Only define function and set defaults if function doesn't already exist, as
+ // the urlInternal plugin will provide this method as well.
+ $[ str_elemUrlAttr ] || ($[ str_elemUrlAttr ] = function( obj ) {
+ return $.extend( elemUrlAttr_cache, obj );
+ })({
+ a: str_href,
+ base: str_href,
+ iframe: str_src,
+ img: str_src,
+ input: str_src,
+ form: 'action',
+ link: str_href,
+ script: str_src
+ });
+
+ jq_elemUrlAttr = $[ str_elemUrlAttr ];
+
+ // Method: jQuery.fn.querystring
+ //
+ // Update URL attribute in one or more elements, merging the current URL (with
+ // or without pre-existing query string params) plus any params object or
+ // string into a new URL, which is then set into that attribute. Like
+ // <jQuery.param.querystring (build url)>, but for all elements in a jQuery
+ // collection.
+ //
+ // Usage:
+ //
+ // > jQuery('selector').querystring( [ attr, ] params [, merge_mode ] );
+ //
+ // Arguments:
+ //
+ // attr - (String) Optional name of an attribute that will contain a URL to
+ // merge params or url into. See <jQuery.elemUrlAttr> for a list of default
+ // attributes.
+ // params - (Object) A params object to be merged into the URL attribute.
+ // params - (String) A URL containing query string params, or params string
+ // to be merged into the URL attribute.
+ // merge_mode - (Number) Merge behavior defaults to 0 if merge_mode is not
+ // specified, and is as-follows:
+ //
+ // * 0: params in the params argument will override any params in attr URL.
+ // * 1: any params in attr URL will override params in the params argument.
+ // * 2: params argument will completely replace any query string in attr
+ // URL.
+ //
+ // Returns:
+ //
+ // (jQuery) The initial jQuery collection of elements, but with modified URL
+ // attribute values.
+
+ // Method: jQuery.fn.fragment
+ //
+ // Update URL attribute in one or more elements, merging the current URL (with
+ // or without pre-existing fragment/hash params) plus any params object or
+ // string into a new URL, which is then set into that attribute. Like
+ // <jQuery.param.fragment (build url)>, but for all elements in a jQuery
+ // collection.
+ //
+ // Usage:
+ //
+ // > jQuery('selector').fragment( [ attr, ] params [, merge_mode ] );
+ //
+ // Arguments:
+ //
+ // attr - (String) Optional name of an attribute that will contain a URL to
+ // merge params into. See <jQuery.elemUrlAttr> for a list of default
+ // attributes.
+ // params - (Object) A params object to be merged into the URL attribute.
+ // params - (String) A URL containing fragment (hash) params, or params
+ // string to be merged into the URL attribute.
+ // merge_mode - (Number) Merge behavior defaults to 0 if merge_mode is not
+ // specified, and is as-follows:
+ //
+ // * 0: params in the params argument will override any params in attr URL.
+ // * 1: any params in attr URL will override params in the params argument.
+ // * 2: params argument will completely replace any fragment (hash) in attr
+ // URL.
+ //
+ // Returns:
+ //
+ // (jQuery) The initial jQuery collection of elements, but with modified URL
+ // attribute values.
+
+ function jq_fn_sub( mode, force_attr, params, merge_mode ) {
+ if ( !is_string( params ) && typeof params !== 'object' ) {
+ // force_attr not specified.
+ merge_mode = params;
+ params = force_attr;
+ force_attr = undefined;
+ }
+
+ return this.each(function(){
+ var that = $(this),
+
+ // Get attribute specified, or default specified via $.elemUrlAttr.
+ attr = force_attr || jq_elemUrlAttr()[ ( this.nodeName || '' ).toLowerCase() ] || '',
+
+ // Get URL value.
+ url = attr && that.attr( attr ) || '';
+
+ // Update attribute with new URL.
+ that.attr( attr, jq_param[ mode ]( url, params, merge_mode ) );
+ });
+
+ };
+
+ $.fn[ str_querystring ] = curry( jq_fn_sub, str_querystring );
+ $.fn[ str_fragment ] = curry( jq_fn_sub, str_fragment );
+
+ // Section: History, hashchange event
+ //
+ // Method: jQuery.bbq.pushState
+ //
+ // Adds a 'state' into the browser history at the current position, setting
+ // location.hash and triggering any bound <hashchange event> callbacks
+ // (provided the new state is different than the previous state).
+ //
+ // If no arguments are passed, an empty state is created, which is just a
+ // shortcut for jQuery.bbq.pushState( {}, 2 ).
+ //
+ // Usage:
+ //
+ // > jQuery.bbq.pushState( [ params [, merge_mode ] ] );
+ //
+ // Arguments:
+ //
+ // params - (String) A serialized params string or a hash string beginning
+ // with # to merge into location.hash.
+ // params - (Object) A params object to merge into location.hash.
+ // merge_mode - (Number) Merge behavior defaults to 0 if merge_mode is not
+ // specified (unless a hash string beginning with # is specified, in which
+ // case merge behavior defaults to 2), and is as-follows:
+ //
+ // * 0: params in the params argument will override any params in the
+ // current state.
+ // * 1: any params in the current state will override params in the params
+ // argument.
+ // * 2: params argument will completely replace current state.
+ //
+ // Returns:
+ //
+ // Nothing.
+ //
+ // Additional Notes:
+ //
+ // * Setting an empty state may cause the browser to scroll.
+ // * Unlike the fragment and querystring methods, if a hash string beginning
+ // with # is specified as the params agrument, merge_mode defaults to 2.
+
+ jq_bbq.pushState = jq_bbq_pushState = function( params, merge_mode ) {
+ if ( is_string( params ) && /^#/.test( params ) && merge_mode === undefined ) {
+ // Params string begins with # and merge_mode not specified, so completely
+ // overwrite window.location.hash.
+ merge_mode = 2;
+ }
+
+ var has_args = params !== undefined,
+ // Merge params into window.location using $.param.fragment.
+ url = jq_param_fragment( location.href,
+ has_args ? params : {}, has_args ? merge_mode : 2 );
+
+ // Set new window.location.href. Note that Safari 3 & Chrome barf on
+ // location.hash = '#' so the entire URL is set.
+ location.href = url;
+ };
+
+ // Method: jQuery.bbq.getState
+ //
+ // Retrieves the current 'state' from the browser history, parsing
+ // location.hash for a specific key or returning an object containing the
+ // entire state, optionally coercing numbers, booleans, null and undefined
+ // values.
+ //
+ // Usage:
+ //
+ // > jQuery.bbq.getState( [ key ] [, coerce ] );
+ //
+ // Arguments:
+ //
+ // key - (String) An optional state key for which to return a value.
+ // coerce - (Boolean) If true, coerces any numbers or true, false, null, and
+ // undefined to their actual value. Defaults to false.
+ //
+ // Returns:
+ //
+ // (Anything) If key is passed, returns the value corresponding with that key
+ // in the location.hash 'state', or undefined. If not, an object
+ // representing the entire 'state' is returned.
+
+ jq_bbq.getState = jq_bbq_getState = function( key, coerce ) {
+ return key === undefined || typeof key === 'boolean'
+ ? jq_deparam_fragment( key ) // 'key' really means 'coerce' here
+ : jq_deparam_fragment( coerce )[ key ];
+ };
+
+ // Method: jQuery.bbq.removeState
+ //
+ // Remove one or more keys from the current browser history 'state', creating
+ // a new state, setting location.hash and triggering any bound
+ // <hashchange event> callbacks (provided the new state is different than
+ // the previous state).
+ //
+ // If no arguments are passed, an empty state is created, which is just a
+ // shortcut for jQuery.bbq.pushState( {}, 2 ).
+ //
+ // Usage:
+ //
+ // > jQuery.bbq.removeState( [ key [, key ... ] ] );
+ //
+ // Arguments:
+ //
+ // key - (String) One or more key values to remove from the current state,
+ // passed as individual arguments.
+ // key - (Array) A single array argument that contains a list of key values
+ // to remove from the current state.
+ //
+ // Returns:
+ //
+ // Nothing.
+ //
+ // Additional Notes:
+ //
+ // * Setting an empty state may cause the browser to scroll.
+
+ jq_bbq.removeState = function( arr ) {
+ var state = {};
+
+ // If one or more arguments is passed..
+ if ( arr !== undefined ) {
+
+ // Get the current state.
+ state = jq_bbq_getState();
+
+ // For each passed key, delete the corresponding property from the current
+ // state.
+ $.each( $.isArray( arr ) ? arr : arguments, function(i,v){
+ delete state[ v ];
+ });
+ }
+
+ // Set the state, completely overriding any existing state.
+ jq_bbq_pushState( state, 2 );
+ };
+
+ // Event: hashchange event (BBQ)
+ //
+ // Usage in jQuery 1.4 and newer:
+ //
+ // In jQuery 1.4 and newer, the event object passed into any hashchange event
+ // callback is augmented with a copy of the location.hash fragment at the time
+ // the event was triggered as its event.fragment property. In addition, the
+ // event.getState method operates on this property (instead of location.hash)
+ // which allows this fragment-as-a-state to be referenced later, even after
+ // window.location may have changed.
+ //
+ // Note that event.fragment and event.getState are not defined according to
+ // W3C (or any other) specification, but will still be available whether or
+ // not the hashchange event exists natively in the browser, because of the
+ // utility they provide.
+ //
+ // The event.fragment property contains the output of <jQuery.param.fragment>
+ // and the event.getState method is equivalent to the <jQuery.bbq.getState>
+ // method.
+ //
+ // > $(window).bind( 'hashchange', function( event ) {
+ // > var hash_str = event.fragment,
+ // > param_obj = event.getState(),
+ // > param_val = event.getState( 'param_name' ),
+ // > param_val_coerced = event.getState( 'param_name', true );
+ // > ...
+ // > });
+ //
+ // Usage in jQuery 1.3.2:
+ //
+ // In jQuery 1.3.2, the event object cannot to be augmented as in jQuery 1.4+,
+ // so the fragment state isn't bound to the event object and must instead be
+ // parsed using the <jQuery.param.fragment> and <jQuery.bbq.getState> methods.
+ //
+ // > $(window).bind( 'hashchange', function( event ) {
+ // > var hash_str = $.param.fragment(),
+ // > param_obj = $.bbq.getState(),
+ // > param_val = $.bbq.getState( 'param_name' ),
+ // > param_val_coerced = $.bbq.getState( 'param_name', true );
+ // > ...
+ // > });
+ //
+ // Additional Notes:
+ //
+ // * Due to changes in the special events API, jQuery BBQ v1.2 or newer is
+ // required to enable the augmented event object in jQuery 1.4.2 and newer.
+ // * See <jQuery hashchange event> for more detailed information.
+
+ special[ str_hashchange ] = $.extend( special[ str_hashchange ], {
+
+ // Augmenting the event object with the .fragment property and .getState
+ // method requires jQuery 1.4 or newer. Note: with 1.3.2, everything will
+ // work, but the event won't be augmented)
+ add: function( handleObj ) {
+ var old_handler;
+
+ function new_handler(e) {
+ // e.fragment is set to the value of location.hash (with any leading #
+ // removed) at the time the event is triggered.
+ var hash = e[ str_fragment ] = jq_param_fragment();
+
+ // e.getState() works just like $.bbq.getState(), but uses the
+ // e.fragment property stored on the event object.
+ e.getState = function( key, coerce ) {
+ return key === undefined || typeof key === 'boolean'
+ ? jq_deparam( hash, key ) // 'key' really means 'coerce' here
+ : jq_deparam( hash, coerce )[ key ];
+ };
+
+ old_handler.apply( this, arguments );
+ };
+
+ // This may seem a little complicated, but it normalizes the special event
+ // .add method between jQuery 1.4/1.4.1 and 1.4.2+
+ if ( $.isFunction( handleObj ) ) {
+ // 1.4, 1.4.1
+ old_handler = handleObj;
+ return new_handler;
+ } else {
+ // 1.4.2+
+ old_handler = handleObj.handler;
+ handleObj.handler = new_handler;
+ }
+ }
+
+ });
+
+})(jQuery,this);
+
+/*!
+ * jQuery hashchange event - v1.3 - 7/21/2010
+ * http://benalman.com/projects/jquery-hashchange-plugin/
+ *
+ * Copyright (c) 2010 "Cowboy" Ben Alman
+ * Dual licensed under the MIT and GPL licenses.
+ * http://benalman.com/about/license/
+ */
+
+// Script: jQuery hashchange event
+//
+// *Version: 1.3, Last updated: 7/21/2010*
+//
+// Project Home - http://benalman.com/projects/jquery-hashchange-plugin/
+// GitHub - http://github.com/cowboy/jquery-hashchange/
+// Source - http://github.com/cowboy/jquery-hashchange/raw/master/jquery.ba-hashchange.js
+// (Minified) - http://github.com/cowboy/jquery-hashchange/raw/master/jquery.ba-hashchange.min.js (0.8kb gzipped)
+//
+// About: License
+//
+// Copyright (c) 2010 "Cowboy" Ben Alman,
+// Dual licensed under the MIT and GPL licenses.
+// http://benalman.com/about/license/
+//
+// About: Examples
+//
+// These working examples, complete with fully commented code, illustrate a few
+// ways in which this plugin can be used.
+//
+// hashchange event - http://benalman.com/code/projects/jquery-hashchange/examples/hashchange/
+// document.domain - http://benalman.com/code/projects/jquery-hashchange/examples/document_domain/
+//
+// About: Support and Testing
+//
+// Information about what version or versions of jQuery this plugin has been
+// tested with, what browsers it has been tested in, and where the unit tests
+// reside (so you can test it yourself).
+//
+// jQuery Versions - 1.2.6, 1.3.2, 1.4.1, 1.4.2
+// Browsers Tested - Internet Explorer 6-8, Firefox 2-4, Chrome 5-6, Safari 3.2-5,
+// Opera 9.6-10.60, iPhone 3.1, Android 1.6-2.2, BlackBerry 4.6-5.
+// Unit Tests - http://benalman.com/code/projects/jquery-hashchange/unit/
+//
+// About: Known issues
+//
+// While this jQuery hashchange event implementation is quite stable and
+// robust, there are a few unfortunate browser bugs surrounding expected
+// hashchange event-based behaviors, independent of any JavaScript
+// window.onhashchange abstraction. See the following examples for more
+// information:
+//
+// Chrome: Back Button - http://benalman.com/code/projects/jquery-hashchange/examples/bug-chrome-back-button/
+// Firefox: Remote XMLHttpRequest - http://benalman.com/code/projects/jquery-hashchange/examples/bug-firefox-remote-xhr/
+// WebKit: Back Button in an Iframe - http://benalman.com/code/projects/jquery-hashchange/examples/bug-webkit-hash-iframe/
+// Safari: Back Button from a different domain - http://benalman.com/code/projects/jquery-hashchange/examples/bug-safari-back-from-diff-domain/
+//
+// Also note that should a browser natively support the window.onhashchange
+// event, but not report that it does, the fallback polling loop will be used.
+//
+// About: Release History
+//
+// 1.3 - (7/21/2010) Reorganized IE6/7 Iframe code to make it more
+// "removable" for mobile-only development. Added IE6/7 document.title
+// support. Attempted to make Iframe as hidden as possible by using
+// techniques from http://www.paciellogroup.com/blog/?p=604. Added
+// support for the "shortcut" format $(window).hashchange( fn ) and
+// $(window).hashchange() like jQuery provides for built-in events.
+// Renamed jQuery.hashchangeDelay to <jQuery.fn.hashchange.delay> and
+// lowered its default value to 50. Added <jQuery.fn.hashchange.domain>
+// and <jQuery.fn.hashchange.src> properties plus document-domain.html
+// file to address access denied issues when setting document.domain in
+// IE6/7.
+// 1.2 - (2/11/2010) Fixed a bug where coming back to a page using this plugin
+// from a page on another domain would cause an error in Safari 4. Also,
+// IE6/7 Iframe is now inserted after the body (this actually works),
+// which prevents the page from scrolling when the event is first bound.
+// Event can also now be bound before DOM ready, but it won't be usable
+// before then in IE6/7.
+// 1.1 - (1/21/2010) Incorporated document.documentMode test to fix IE8 bug
+// where browser version is incorrectly reported as 8.0, despite
+// inclusion of the X-UA-Compatible IE=EmulateIE7 meta tag.
+// 1.0 - (1/9/2010) Initial Release. Broke out the jQuery BBQ event.special
+// window.onhashchange functionality into a separate plugin for users
+// who want just the basic event & back button support, without all the
+// extra awesomeness that BBQ provides. This plugin will be included as
+// part of jQuery BBQ, but also be available separately.
+
+(function($,window,undefined){
+ '$:nomunge'; // Used by YUI compressor.
+
+ // Reused string.
+ var str_hashchange = 'hashchange',
+
+ // Method / object references.
+ doc = document,
+ fake_onhashchange,
+ special = $.event.special,
+
+ // Does the browser support window.onhashchange? Note that IE8 running in
+ // IE7 compatibility mode reports true for 'onhashchange' in window, even
+ // though the event isn't supported, so also test document.documentMode.
+ doc_mode = doc.documentMode,
+ supports_onhashchange = 'on' + str_hashchange in window && ( doc_mode === undefined || doc_mode > 7 );
+
+ // Get location.hash (or what you'd expect location.hash to be) sans any
+ // leading #. Thanks for making this necessary, Firefox!
+ function get_fragment( url ) {
+ url = url || location.href;
+ return '#' + url.replace( /^[^#]*#?(.*)$/, '$1' );
+ };
+
+ // Method: jQuery.fn.hashchange
+ //
+ // Bind a handler to the window.onhashchange event or trigger all bound
+ // window.onhashchange event handlers. This behavior is consistent with
+ // jQuery's built-in event handlers.
+ //
+ // Usage:
+ //
+ // > jQuery(window).hashchange( [ handler ] );
+ //
+ // Arguments:
+ //
+ // handler - (Function) Optional handler to be bound to the hashchange
+ // event. This is a "shortcut" for the more verbose form:
+ // jQuery(window).bind( 'hashchange', handler ). If handler is omitted,
+ // all bound window.onhashchange event handlers will be triggered. This
+ // is a shortcut for the more verbose
+ // jQuery(window).trigger( 'hashchange' ). These forms are described in
+ // the <hashchange event> section.
+ //
+ // Returns:
+ //
+ // (jQuery) The initial jQuery collection of elements.
+
+ // Allow the "shortcut" format $(elem).hashchange( fn ) for binding and
+ // $(elem).hashchange() for triggering, like jQuery does for built-in events.
+ $.fn[ str_hashchange ] = function( fn ) {
+ return fn ? this.bind( str_hashchange, fn ) : this.trigger( str_hashchange );
+ };
+
+ // Property: jQuery.fn.hashchange.delay
+ //
+ // The numeric interval (in milliseconds) at which the <hashchange event>
+ // polling loop executes. Defaults to 50.
+
+ // Property: jQuery.fn.hashchange.domain
+ //
+ // If you're setting document.domain in your JavaScript, and you want hash
+ // history to work in IE6/7, not only must this property be set, but you must
+ // also set document.domain BEFORE jQuery is loaded into the page. This
+ // property is only applicable if you are supporting IE6/7 (or IE8 operating
+ // in "IE7 compatibility" mode).
+ //
+ // In addition, the <jQuery.fn.hashchange.src> property must be set to the
+ // path of the included "document-domain.html" file, which can be renamed or
+ // modified if necessary (note that the document.domain specified must be the
+ // same in both your main JavaScript as well as in this file).
+ //
+ // Usage:
+ //
+ // jQuery.fn.hashchange.domain = document.domain;
+
+ // Property: jQuery.fn.hashchange.src
+ //
+ // If, for some reason, you need to specify an Iframe src file (for example,
+ // when setting document.domain as in <jQuery.fn.hashchange.domain>), you can
+ // do so using this property. Note that when using this property, history
+ // won't be recorded in IE6/7 until the Iframe src file loads. This property
+ // is only applicable if you are supporting IE6/7 (or IE8 operating in "IE7
+ // compatibility" mode).
+ //
+ // Usage:
+ //
+ // jQuery.fn.hashchange.src = 'path/to/file.html';
+
+ $.fn[ str_hashchange ].delay = 50;
+ /*
+ $.fn[ str_hashchange ].domain = null;
+ $.fn[ str_hashchange ].src = null;
+ */
+
+ // Event: hashchange event
+ //
+ // Fired when location.hash changes. In browsers that support it, the native
+ // HTML5 window.onhashchange event is used, otherwise a polling loop is
+ // initialized, running every <jQuery.fn.hashchange.delay> milliseconds to
+ // see if the hash has changed. In IE6/7 (and IE8 operating in "IE7
+ // compatibility" mode), a hidden Iframe is created to allow the back button
+ // and hash-based history to work.
+ //
+ // Usage as described in <jQuery.fn.hashchange>:
+ //
+ // > // Bind an event handler.
+ // > jQuery(window).hashchange( function(e) {
+ // > var hash = location.hash;
+ // > ...
+ // > });
+ // >
+ // > // Manually trigger the event handler.
+ // > jQuery(window).hashchange();
+ //
+ // A more verbose usage that allows for event namespacing:
+ //
+ // > // Bind an event handler.
+ // > jQuery(window).bind( 'hashchange', function(e) {
+ // > var hash = location.hash;
+ // > ...
+ // > });
+ // >
+ // > // Manually trigger the event handler.
+ // > jQuery(window).trigger( 'hashchange' );
+ //
+ // Additional Notes:
+ //
+ // * The polling loop and Iframe are not created until at least one handler
+ // is actually bound to the 'hashchange' event.
+ // * If you need the bound handler(s) to execute immediately, in cases where
+ // a location.hash exists on page load, via bookmark or page refresh for
+ // example, use jQuery(window).hashchange() or the more verbose
+ // jQuery(window).trigger( 'hashchange' ).
+ // * The event can be bound before DOM ready, but since it won't be usable
+ // before then in IE6/7 (due to the necessary Iframe), recommended usage is
+ // to bind it inside a DOM ready handler.
+
+ // Override existing $.event.special.hashchange methods (allowing this plugin
+ // to be defined after jQuery BBQ in BBQ's source code).
+ special[ str_hashchange ] = $.extend( special[ str_hashchange ], {
+
+ // Called only when the first 'hashchange' event is bound to window.
+ setup: function() {
+ // If window.onhashchange is supported natively, there's nothing to do..
+ if ( supports_onhashchange ) { return false; }
+
+ // Otherwise, we need to create our own. And we don't want to call this
+ // until the user binds to the event, just in case they never do, since it
+ // will create a polling loop and possibly even a hidden Iframe.
+ $( fake_onhashchange.start );
+ },
+
+ // Called only when the last 'hashchange' event is unbound from window.
+ teardown: function() {
+ // If window.onhashchange is supported natively, there's nothing to do..
+ if ( supports_onhashchange ) { return false; }
+
+ // Otherwise, we need to stop ours (if possible).
+ $( fake_onhashchange.stop );
+ }
+
+ });
+
+ // fake_onhashchange does all the work of triggering the window.onhashchange
+ // event for browsers that don't natively support it, including creating a
+ // polling loop to watch for hash changes and in IE 6/7 creating a hidden
+ // Iframe to enable back and forward.
+ fake_onhashchange = (function(){
+ var self = {},
+ timeout_id,
+
+ // Remember the initial hash so it doesn't get triggered immediately.
+ last_hash = get_fragment(),
+
+ fn_retval = function(val){ return val; },
+ history_set = fn_retval,
+ history_get = fn_retval;
+
+ // Start the polling loop.
+ self.start = function() {
+ timeout_id || poll();
+ };
+
+ // Stop the polling loop.
+ self.stop = function() {
+ timeout_id && clearTimeout( timeout_id );
+ timeout_id = undefined;
+ };
+
+ // This polling loop checks every $.fn.hashchange.delay milliseconds to see
+ // if location.hash has changed, and triggers the 'hashchange' event on
+ // window when necessary.
+ function poll() {
+ var hash = get_fragment(),
+ history_hash = history_get( last_hash );
+
+ if ( hash !== last_hash ) {
+ history_set( last_hash = hash, history_hash );
+
+ $(window).trigger( str_hashchange );
+
+ } else if ( history_hash !== last_hash ) {
+ location.href = location.href.replace( /#.*/, '' ) + history_hash;
+ }
+
+ timeout_id = setTimeout( poll, $.fn[ str_hashchange ].delay );
+ };
+
+ return self;
+ })();
+
+})(jQuery,this);
\ No newline at end of file
--- /dev/null
+/**
+
+JSZip - A Javascript class for generating and reading zip files
+<http://stuartk.com/jszip>
+
+(c) 2009-2012 Stuart Knightley <stuart [at] stuartk.com>
+Dual licenced under the MIT license or GPLv3. See LICENSE.markdown.
+
+Usage:
+ zip = new JSZip();
+ zip.file("hello.txt", "Hello, World!").file("tempfile", "nothing");
+ zip.folder("images").file("smile.gif", base64Data, {base64: true});
+ zip.file("Xmas.txt", "Ho ho ho !", {date : new Date("December 25, 2007 00:00:01")});
+ zip.remove("tempfile");
+
+ base64zip = zip.generate();
+
+**/
+"use strict";
+
+/**
+ * Representation a of zip file in js
+ * @constructor
+ * @param {String=|ArrayBuffer=|Uint8Array=|Buffer=} data the data to load, if any (optional).
+ * @param {Object=} options the options for creating this objects (optional).
+ */
+var JSZip = function(data, options) {
+ // object containing the files :
+ // {
+ // "folder/" : {...},
+ // "folder/data.txt" : {...}
+ // }
+ this.files = {};
+
+ // Where we are in the hierarchy
+ this.root = "";
+
+ if (data) {
+ this.load(data, options);
+ }
+};
+
+JSZip.signature = {
+ LOCAL_FILE_HEADER : "\x50\x4b\x03\x04",
+ CENTRAL_FILE_HEADER : "\x50\x4b\x01\x02",
+ CENTRAL_DIRECTORY_END : "\x50\x4b\x05\x06",
+ ZIP64_CENTRAL_DIRECTORY_LOCATOR : "\x50\x4b\x06\x07",
+ ZIP64_CENTRAL_DIRECTORY_END : "\x50\x4b\x06\x06",
+ DATA_DESCRIPTOR : "\x50\x4b\x07\x08"
+};
+
+// Default properties for a new file
+JSZip.defaults = {
+ base64: false,
+ binary: false,
+ dir: false,
+ date: null,
+ compression: null
+};
+
+
+JSZip.prototype = (function () {
+
+ /**
+ * Returns the raw data of a ZipObject, decompress the content if necessary.
+ * @param {ZipObject} file the file to use.
+ * @return {String|ArrayBuffer|Uint8Array|Buffer} the data.
+ */
+ var getRawData = function (file) {
+ if (file._data instanceof JSZip.CompressedObject) {
+ file._data = file._data.getContent();
+ file.options.binary = true;
+ file.options.base64 = false;
+
+ if (JSZip.utils.getTypeOf(file._data) === "uint8array") {
+ var copy = file._data;
+ // when reading an arraybuffer, the CompressedObject mechanism will keep it and subarray() a Uint8Array.
+ // if we request a file in the same format, we might get the same Uint8Array or its ArrayBuffer (the original zip file).
+ file._data = new Uint8Array(copy.length);
+ // with an empty Uint8Array, Opera fails with a "Offset larger than array size"
+ if (copy.length !== 0) {
+ file._data.set(copy, 0);
+ }
+ }
+ }
+ return file._data;
+ };
+
+ /**
+ * Returns the data of a ZipObject in a binary form. If the content is an unicode string, encode it.
+ * @param {ZipObject} file the file to use.
+ * @return {String|ArrayBuffer|Uint8Array|Buffer} the data.
+ */
+ var getBinaryData = function (file) {
+ var result = getRawData(file), type = JSZip.utils.getTypeOf(result);
+ if (type === "string") {
+ if (!file.options.binary) {
+ // unicode text !
+ // unicode string => binary string is a painful process, check if we can avoid it.
+ if (JSZip.support.uint8array && typeof TextEncoder === "function") {
+ return TextEncoder("utf-8").encode(result);
+ }
+ if (JSZip.support.nodebuffer) {
+ return new Buffer(result, "utf-8");
+ }
+ }
+ return file.asBinary();
+ }
+ return result;
+ }
+
+ /**
+ * Transform this._data into a string.
+ * @param {function} filter a function String -> String, applied if not null on the result.
+ * @return {String} the string representing this._data.
+ */
+ var dataToString = function (asUTF8) {
+ var result = getRawData(this);
+ if (result === null || typeof result === "undefined") {
+ return "";
+ }
+ // if the data is a base64 string, we decode it before checking the encoding !
+ if (this.options.base64) {
+ result = JSZip.base64.decode(result);
+ }
+ if (asUTF8 && this.options.binary) {
+ // JSZip.prototype.utf8decode supports arrays as input
+ // skip to array => string step, utf8decode will do it.
+ result = JSZip.prototype.utf8decode(result);
+ } else {
+ // no utf8 transformation, do the array => string step.
+ result = JSZip.utils.transformTo("string", result);
+ }
+
+ if (!asUTF8 && !this.options.binary) {
+ result = JSZip.prototype.utf8encode(result);
+ }
+ return result;
+ };
+ /**
+ * A simple object representing a file in the zip file.
+ * @constructor
+ * @param {string} name the name of the file
+ * @param {String|ArrayBuffer|Uint8Array|Buffer} data the data
+ * @param {Object} options the options of the file
+ */
+ var ZipObject = function (name, data, options) {
+ this.name = name;
+ this._data = data;
+ this.options = options;
+ };
+
+ ZipObject.prototype = {
+ /**
+ * Return the content as UTF8 string.
+ * @return {string} the UTF8 string.
+ */
+ asText : function () {
+ return dataToString.call(this, true);
+ },
+ /**
+ * Returns the binary content.
+ * @return {string} the content as binary.
+ */
+ asBinary : function () {
+ return dataToString.call(this, false);
+ },
+ /**
+ * Returns the content as a nodejs Buffer.
+ * @return {Buffer} the content as a Buffer.
+ */
+ asNodeBuffer : function () {
+ var result = getBinaryData(this);
+ return JSZip.utils.transformTo("nodebuffer", result);
+ },
+ /**
+ * Returns the content as an Uint8Array.
+ * @return {Uint8Array} the content as an Uint8Array.
+ */
+ asUint8Array : function () {
+ var result = getBinaryData(this);
+ return JSZip.utils.transformTo("uint8array", result);
+ },
+ /**
+ * Returns the content as an ArrayBuffer.
+ * @return {ArrayBuffer} the content as an ArrayBufer.
+ */
+ asArrayBuffer : function () {
+ return this.asUint8Array().buffer;
+ }
+ };
+
+ /**
+ * Transform an integer into a string in hexadecimal.
+ * @private
+ * @param {number} dec the number to convert.
+ * @param {number} bytes the number of bytes to generate.
+ * @returns {string} the result.
+ */
+ var decToHex = function(dec, bytes) {
+ var hex = "", i;
+ for(i = 0; i < bytes; i++) {
+ hex += String.fromCharCode(dec&0xff);
+ dec=dec>>>8;
+ }
+ return hex;
+ };
+
+ /**
+ * Merge the objects passed as parameters into a new one.
+ * @private
+ * @param {...Object} var_args All objects to merge.
+ * @return {Object} a new object with the data of the others.
+ */
+ var extend = function () {
+ var result = {}, i, attr;
+ for (i = 0; i < arguments.length; i++) { // arguments is not enumerable in some browsers
+ for (attr in arguments[i]) {
+ if (arguments[i].hasOwnProperty(attr) && typeof result[attr] === "undefined") {
+ result[attr] = arguments[i][attr];
+ }
+ }
+ }
+ return result;
+ };
+
+ /**
+ * Transforms the (incomplete) options from the user into the complete
+ * set of options to create a file.
+ * @private
+ * @param {Object} o the options from the user.
+ * @return {Object} the complete set of options.
+ */
+ var prepareFileAttrs = function (o) {
+ o = o || {};
+ if (o.base64 === true && o.binary == null) {
+ o.binary = true;
+ }
+ o = extend(o, JSZip.defaults);
+ o.date = o.date || new Date();
+ if (o.compression !== null) o.compression = o.compression.toUpperCase();
+
+ return o;
+ };
+
+ /**
+ * Add a file in the current folder.
+ * @private
+ * @param {string} name the name of the file
+ * @param {String|ArrayBuffer|Uint8Array|Buffer} data the data of the file
+ * @param {Object} o the options of the file
+ * @return {Object} the new file.
+ */
+ var fileAdd = function (name, data, o) {
+ // be sure sub folders exist
+ var parent = parentFolder(name), dataType = JSZip.utils.getTypeOf(data);
+ if (parent) {
+ folderAdd.call(this, parent);
+ }
+
+ o = prepareFileAttrs(o);
+
+ if (o.dir || data === null || typeof data === "undefined") {
+ o.base64 = false;
+ o.binary = false;
+ data = null;
+ } else if (dataType === "string") {
+ if (o.binary && !o.base64) {
+ // optimizedBinaryString == true means that the file has already been filtered with a 0xFF mask
+ if (o.optimizedBinaryString !== true) {
+ // this is a string, not in a base64 format.
+ // Be sure that this is a correct "binary string"
+ data = JSZip.utils.string2binary(data);
+ }
+ }
+ } else { // arraybuffer, uint8array, ...
+ o.base64 = false;
+ o.binary = true;
+
+ if (!dataType && !(data instanceof JSZip.CompressedObject)) {
+ throw new Error("The data of '" + name + "' is in an unsupported format !");
+ }
+
+ // special case : it's way easier to work with Uint8Array than with ArrayBuffer
+ if (dataType === "arraybuffer") {
+ data = JSZip.utils.transformTo("uint8array", data);
+ }
+ }
+
+ return this.files[name] = new ZipObject(name, data, o);
+ };
+
+
+ /**
+ * Find the parent folder of the path.
+ * @private
+ * @param {string} path the path to use
+ * @return {string} the parent folder, or ""
+ */
+ var parentFolder = function (path) {
+ if (path.slice(-1) == '/') {
+ path = path.substring(0, path.length - 1);
+ }
+ var lastSlash = path.lastIndexOf('/');
+ return (lastSlash > 0) ? path.substring(0, lastSlash) : "";
+ };
+
+ /**
+ * Add a (sub) folder in the current folder.
+ * @private
+ * @param {string} name the folder's name
+ * @return {Object} the new folder.
+ */
+ var folderAdd = function (name) {
+ // Check the name ends with a /
+ if (name.slice(-1) != "/") {
+ name += "/"; // IE doesn't like substr(-1)
+ }
+
+ // Does this folder already exist?
+ if (!this.files[name]) {
+ fileAdd.call(this, name, null, {dir:true});
+ }
+ return this.files[name];
+ };
+
+ /**
+ * Generate a JSZip.CompressedObject for a given zipOject.
+ * @param {ZipObject} file the object to read.
+ * @param {JSZip.compression} compression the compression to use.
+ * @return {JSZip.CompressedObject} the compressed result.
+ */
+ var generateCompressedObjectFrom = function (file, compression) {
+ var result = new JSZip.CompressedObject(), content;
+
+ // the data has not been decompressed, we might reuse things !
+ if (file._data instanceof JSZip.CompressedObject) {
+ result.uncompressedSize = file._data.uncompressedSize;
+ result.crc32 = file._data.crc32;
+
+ if (result.uncompressedSize === 0 || file.options.dir) {
+ compression = JSZip.compressions['STORE'];
+ result.compressedContent = "";
+ result.crc32 = 0;
+ } else if (file._data.compressionMethod === compression.magic) {
+ result.compressedContent = file._data.getCompressedContent();
+ } else {
+ content = file._data.getContent()
+ // need to decompress / recompress
+ result.compressedContent = compression.compress(JSZip.utils.transformTo(compression.compressInputType, content));
+ }
+ } else {
+ // have uncompressed data
+ content = getBinaryData(file);
+ if (!content || content.length === 0 || file.options.dir) {
+ compression = JSZip.compressions['STORE'];
+ content = "";
+ }
+ result.uncompressedSize = content.length;
+ result.crc32 = this.crc32(content);
+ result.compressedContent = compression.compress(JSZip.utils.transformTo(compression.compressInputType, content));
+ }
+
+ result.compressedSize = result.compressedContent.length;
+ result.compressionMethod = compression.magic;
+
+ return result;
+ };
+
+ /**
+ * Generate the various parts used in the construction of the final zip file.
+ * @param {string} name the file name.
+ * @param {ZipObject} file the file content.
+ * @param {JSZip.CompressedObject} compressedObject the compressed object.
+ * @param {number} offset the current offset from the start of the zip file.
+ * @return {object} the zip parts.
+ */
+ var generateZipParts = function(name, file, compressedObject, offset) {
+ var data = compressedObject.compressedContent,
+ utfEncodedFileName = this.utf8encode(file.name),
+ useUTF8 = utfEncodedFileName !== file.name,
+ o = file.options,
+ dosTime,
+ dosDate;
+
+ // date
+ // @see http://www.delorie.com/djgpp/doc/rbinter/it/52/13.html
+ // @see http://www.delorie.com/djgpp/doc/rbinter/it/65/16.html
+ // @see http://www.delorie.com/djgpp/doc/rbinter/it/66/16.html
+
+ dosTime = o.date.getHours();
+ dosTime = dosTime << 6;
+ dosTime = dosTime | o.date.getMinutes();
+ dosTime = dosTime << 5;
+ dosTime = dosTime | o.date.getSeconds() / 2;
+
+ dosDate = o.date.getFullYear() - 1980;
+ dosDate = dosDate << 4;
+ dosDate = dosDate | (o.date.getMonth() + 1);
+ dosDate = dosDate << 5;
+ dosDate = dosDate | o.date.getDate();
+
+
+ var header = "";
+
+ // version needed to extract
+ header += "\x0A\x00";
+ // general purpose bit flag
+ // set bit 11 if utf8
+ header += useUTF8 ? "\x00\x08" : "\x00\x00";
+ // compression method
+ header += compressedObject.compressionMethod;
+ // last mod file time
+ header += decToHex(dosTime, 2);
+ // last mod file date
+ header += decToHex(dosDate, 2);
+ // crc-32
+ header += decToHex(compressedObject.crc32, 4);
+ // compressed size
+ header += decToHex(compressedObject.compressedSize, 4);
+ // uncompressed size
+ header += decToHex(compressedObject.uncompressedSize, 4);
+ // file name length
+ header += decToHex(utfEncodedFileName.length, 2);
+ // extra field length
+ header += "\x00\x00";
+
+
+ var fileRecord = JSZip.signature.LOCAL_FILE_HEADER + header + utfEncodedFileName;
+
+ var dirRecord = JSZip.signature.CENTRAL_FILE_HEADER +
+ // version made by (00: DOS)
+ "\x14\x00" +
+ // file header (common to file and central directory)
+ header +
+ // file comment length
+ "\x00\x00" +
+ // disk number start
+ "\x00\x00" +
+ // internal file attributes TODO
+ "\x00\x00" +
+ // external file attributes
+ (file.options.dir===true?"\x10\x00\x00\x00":"\x00\x00\x00\x00")+
+ // relative offset of local header
+ decToHex(offset, 4) +
+ // file name
+ utfEncodedFileName;
+
+
+ return {
+ fileRecord : fileRecord,
+ dirRecord : dirRecord,
+ compressedObject : compressedObject
+ };
+ };
+
+ /**
+ * An object to write any content to a string.
+ * @constructor
+ */
+ var StringWriter = function () {
+ this.data = [];
+ };
+ StringWriter.prototype = {
+ /**
+ * Append any content to the current string.
+ * @param {Object} input the content to add.
+ */
+ append : function (input) {
+ input = JSZip.utils.transformTo("string", input);
+ this.data.push(input);
+ },
+ /**
+ * Finalize the construction an return the result.
+ * @return {string} the generated string.
+ */
+ finalize : function () {
+ return this.data.join("");
+ }
+ };
+ /**
+ * An object to write any content to an Uint8Array.
+ * @constructor
+ * @param {number} length The length of the array.
+ */
+ var Uint8ArrayWriter = function (length) {
+ this.data = new Uint8Array(length);
+ this.index = 0;
+ };
+ Uint8ArrayWriter.prototype = {
+ /**
+ * Append any content to the current array.
+ * @param {Object} input the content to add.
+ */
+ append : function (input) {
+ if (input.length !== 0) {
+ // with an empty Uint8Array, Opera fails with a "Offset larger than array size"
+ input = JSZip.utils.transformTo("uint8array", input);
+ this.data.set(input, this.index);
+ this.index += input.length;
+ }
+ },
+ /**
+ * Finalize the construction an return the result.
+ * @return {Uint8Array} the generated array.
+ */
+ finalize : function () {
+ return this.data;
+ }
+ };
+
+ // return the actual prototype of JSZip
+ return {
+ /**
+ * Read an existing zip and merge the data in the current JSZip object.
+ * The implementation is in jszip-load.js, don't forget to include it.
+ * @param {String|ArrayBuffer|Uint8Array|Buffer} stream The stream to load
+ * @param {Object} options Options for loading the stream.
+ * options.base64 : is the stream in base64 ? default : false
+ * @return {JSZip} the current JSZip object
+ */
+ load : function (stream, options) {
+ throw new Error("Load method is not defined. Is the file jszip-load.js included ?");
+ },
+
+ /**
+ * Filter nested files/folders with the specified function.
+ * @param {Function} search the predicate to use :
+ * function (relativePath, file) {...}
+ * It takes 2 arguments : the relative path and the file.
+ * @return {Array} An array of matching elements.
+ */
+ filter : function (search) {
+ var result = [], filename, relativePath, file, fileClone;
+ for (filename in this.files) {
+ if ( !this.files.hasOwnProperty(filename) ) { continue; }
+ file = this.files[filename];
+ // return a new object, don't let the user mess with our internal objects :)
+ fileClone = new ZipObject(file.name, file._data, extend(file.options));
+ relativePath = filename.slice(this.root.length, filename.length);
+ if (filename.slice(0, this.root.length) === this.root && // the file is in the current root
+ search(relativePath, fileClone)) { // and the file matches the function
+ result.push(fileClone);
+ }
+ }
+ return result;
+ },
+
+ /**
+ * Add a file to the zip file, or search a file.
+ * @param {string|RegExp} name The name of the file to add (if data is defined),
+ * the name of the file to find (if no data) or a regex to match files.
+ * @param {String|ArrayBuffer|Uint8Array|Buffer} data The file data, either raw or base64 encoded
+ * @param {Object} o File options
+ * @return {JSZip|Object|Array} this JSZip object (when adding a file),
+ * a file (when searching by string) or an array of files (when searching by regex).
+ */
+ file : function(name, data, o) {
+ if (arguments.length === 1) {
+ if (name instanceof RegExp) {
+ var regexp = name;
+ return this.filter(function(relativePath, file) {
+ return !file.options.dir && regexp.test(relativePath);
+ });
+ } else { // text
+ return this.filter(function (relativePath, file) {
+ return !file.options.dir && relativePath === name;
+ })[0]||null;
+ }
+ } else { // more than one argument : we have data !
+ name = this.root+name;
+ fileAdd.call(this, name, data, o);
+ }
+ return this;
+ },
+
+ /**
+ * Add a directory to the zip file, or search.
+ * @param {String|RegExp} arg The name of the directory to add, or a regex to search folders.
+ * @return {JSZip} an object with the new directory as the root, or an array containing matching folders.
+ */
+ folder : function(arg) {
+ if (!arg) {
+ return this;
+ }
+
+ if (arg instanceof RegExp) {
+ return this.filter(function(relativePath, file) {
+ return file.options.dir && arg.test(relativePath);
+ });
+ }
+
+ // else, name is a new folder
+ var name = this.root + arg;
+ var newFolder = folderAdd.call(this, name);
+
+ // Allow chaining by returning a new object with this folder as the root
+ var ret = this.clone();
+ ret.root = newFolder.name;
+ return ret;
+ },
+
+ /**
+ * Delete a file, or a directory and all sub-files, from the zip
+ * @param {string} name the name of the file to delete
+ * @return {JSZip} this JSZip object
+ */
+ remove : function(name) {
+ name = this.root + name;
+ var file = this.files[name];
+ if (!file) {
+ // Look for any folders
+ if (name.slice(-1) != "/") {
+ name += "/";
+ }
+ file = this.files[name];
+ }
+
+ if (file) {
+ if (!file.options.dir) {
+ // file
+ delete this.files[name];
+ } else {
+ // folder
+ var kids = this.filter(function (relativePath, file) {
+ return file.name.slice(0, name.length) === name;
+ });
+ for (var i = 0; i < kids.length; i++) {
+ delete this.files[kids[i].name];
+ }
+ }
+ }
+
+ return this;
+ },
+
+ /**
+ * Generate the complete zip file
+ * @param {Object} options the options to generate the zip file :
+ * - base64, (deprecated, use type instead) true to generate base64.
+ * - compression, "STORE" by default.
+ * - type, "base64" by default. Values are : string, base64, uint8array, arraybuffer, blob.
+ * @return {String|Uint8Array|ArrayBuffer|Buffer|Blob} the zip file
+ */
+ generate : function(options) {
+ options = extend(options || {}, {
+ base64 : true,
+ compression : "STORE",
+ type : "base64"
+ });
+
+ JSZip.utils.checkSupport(options.type);
+
+ var zipData = [], localDirLength = 0, centralDirLength = 0, writer, i;
+
+
+ // first, generate all the zip parts.
+ for (var name in this.files) {
+ if ( !this.files.hasOwnProperty(name) ) { continue; }
+ var file = this.files[name];
+
+ var compressionName = file.compression || options.compression.toUpperCase();
+ var compression = JSZip.compressions[compressionName];
+ if (!compression) {
+ throw new Error(compressionName + " is not a valid compression method !");
+ }
+
+ var compressedObject = generateCompressedObjectFrom.call(this, file, compression);
+
+ var zipPart = generateZipParts.call(this, name, file, compressedObject, localDirLength);
+ localDirLength += zipPart.fileRecord.length + compressedObject.compressedSize;
+ centralDirLength += zipPart.dirRecord.length;
+ zipData.push(zipPart);
+ }
+
+ var dirEnd = "";
+
+ // end of central dir signature
+ dirEnd = JSZip.signature.CENTRAL_DIRECTORY_END +
+ // number of this disk
+ "\x00\x00" +
+ // number of the disk with the start of the central directory
+ "\x00\x00" +
+ // total number of entries in the central directory on this disk
+ decToHex(zipData.length, 2) +
+ // total number of entries in the central directory
+ decToHex(zipData.length, 2) +
+ // size of the central directory 4 bytes
+ decToHex(centralDirLength, 4) +
+ // offset of start of central directory with respect to the starting disk number
+ decToHex(localDirLength, 4) +
+ // .ZIP file comment length
+ "\x00\x00";
+
+
+ // we have all the parts (and the total length)
+ // time to create a writer !
+ switch(options.type.toLowerCase()) {
+ case "uint8array" :
+ case "arraybuffer" :
+ case "blob" :
+ case "nodebuffer" :
+ writer = new Uint8ArrayWriter(localDirLength + centralDirLength + dirEnd.length);
+ break;
+ case "base64" :
+ default : // case "string" :
+ writer = new StringWriter(localDirLength + centralDirLength + dirEnd.length);
+ break;
+ }
+
+ for (i = 0; i < zipData.length; i++) {
+ writer.append(zipData[i].fileRecord);
+ writer.append(zipData[i].compressedObject.compressedContent);
+ }
+ for (i = 0; i < zipData.length; i++) {
+ writer.append(zipData[i].dirRecord);
+ }
+
+ writer.append(dirEnd);
+
+ var zip = writer.finalize();
+
+
+
+ switch(options.type.toLowerCase()) {
+ // case "zip is an Uint8Array"
+ case "uint8array" :
+ case "arraybuffer" :
+ case "nodebuffer" :
+ return JSZip.utils.transformTo(options.type.toLowerCase(), zip);
+ case "blob" :
+ return JSZip.utils.arrayBuffer2Blob(JSZip.utils.transformTo("arraybuffer", zip));
+
+ // case "zip is a string"
+ case "base64" :
+ return (options.base64) ? JSZip.base64.encode(zip) : zip;
+ default : // case "string" :
+ return zip;
+ }
+ },
+
+ /**
+ *
+ * Javascript crc32
+ * http://www.webtoolkit.info/
+ *
+ */
+ crc32 : function crc32(input, crc) {
+ if (typeof input === "undefined" || !input.length) {
+ return 0;
+ }
+
+ var isArray = JSZip.utils.getTypeOf(input) !== "string";
+
+ var table = [
+ 0x00000000, 0x77073096, 0xEE0E612C, 0x990951BA,
+ 0x076DC419, 0x706AF48F, 0xE963A535, 0x9E6495A3,
+ 0x0EDB8832, 0x79DCB8A4, 0xE0D5E91E, 0x97D2D988,
+ 0x09B64C2B, 0x7EB17CBD, 0xE7B82D07, 0x90BF1D91,
+ 0x1DB71064, 0x6AB020F2, 0xF3B97148, 0x84BE41DE,
+ 0x1ADAD47D, 0x6DDDE4EB, 0xF4D4B551, 0x83D385C7,
+ 0x136C9856, 0x646BA8C0, 0xFD62F97A, 0x8A65C9EC,
+ 0x14015C4F, 0x63066CD9, 0xFA0F3D63, 0x8D080DF5,
+ 0x3B6E20C8, 0x4C69105E, 0xD56041E4, 0xA2677172,
+ 0x3C03E4D1, 0x4B04D447, 0xD20D85FD, 0xA50AB56B,
+ 0x35B5A8FA, 0x42B2986C, 0xDBBBC9D6, 0xACBCF940,
+ 0x32D86CE3, 0x45DF5C75, 0xDCD60DCF, 0xABD13D59,
+ 0x26D930AC, 0x51DE003A, 0xC8D75180, 0xBFD06116,
+ 0x21B4F4B5, 0x56B3C423, 0xCFBA9599, 0xB8BDA50F,
+ 0x2802B89E, 0x5F058808, 0xC60CD9B2, 0xB10BE924,
+ 0x2F6F7C87, 0x58684C11, 0xC1611DAB, 0xB6662D3D,
+ 0x76DC4190, 0x01DB7106, 0x98D220BC, 0xEFD5102A,
+ 0x71B18589, 0x06B6B51F, 0x9FBFE4A5, 0xE8B8D433,
+ 0x7807C9A2, 0x0F00F934, 0x9609A88E, 0xE10E9818,
+ 0x7F6A0DBB, 0x086D3D2D, 0x91646C97, 0xE6635C01,
+ 0x6B6B51F4, 0x1C6C6162, 0x856530D8, 0xF262004E,
+ 0x6C0695ED, 0x1B01A57B, 0x8208F4C1, 0xF50FC457,
+ 0x65B0D9C6, 0x12B7E950, 0x8BBEB8EA, 0xFCB9887C,
+ 0x62DD1DDF, 0x15DA2D49, 0x8CD37CF3, 0xFBD44C65,
+ 0x4DB26158, 0x3AB551CE, 0xA3BC0074, 0xD4BB30E2,
+ 0x4ADFA541, 0x3DD895D7, 0xA4D1C46D, 0xD3D6F4FB,
+ 0x4369E96A, 0x346ED9FC, 0xAD678846, 0xDA60B8D0,
+ 0x44042D73, 0x33031DE5, 0xAA0A4C5F, 0xDD0D7CC9,
+ 0x5005713C, 0x270241AA, 0xBE0B1010, 0xC90C2086,
+ 0x5768B525, 0x206F85B3, 0xB966D409, 0xCE61E49F,
+ 0x5EDEF90E, 0x29D9C998, 0xB0D09822, 0xC7D7A8B4,
+ 0x59B33D17, 0x2EB40D81, 0xB7BD5C3B, 0xC0BA6CAD,
+ 0xEDB88320, 0x9ABFB3B6, 0x03B6E20C, 0x74B1D29A,
+ 0xEAD54739, 0x9DD277AF, 0x04DB2615, 0x73DC1683,
+ 0xE3630B12, 0x94643B84, 0x0D6D6A3E, 0x7A6A5AA8,
+ 0xE40ECF0B, 0x9309FF9D, 0x0A00AE27, 0x7D079EB1,
+ 0xF00F9344, 0x8708A3D2, 0x1E01F268, 0x6906C2FE,
+ 0xF762575D, 0x806567CB, 0x196C3671, 0x6E6B06E7,
+ 0xFED41B76, 0x89D32BE0, 0x10DA7A5A, 0x67DD4ACC,
+ 0xF9B9DF6F, 0x8EBEEFF9, 0x17B7BE43, 0x60B08ED5,
+ 0xD6D6A3E8, 0xA1D1937E, 0x38D8C2C4, 0x4FDFF252,
+ 0xD1BB67F1, 0xA6BC5767, 0x3FB506DD, 0x48B2364B,
+ 0xD80D2BDA, 0xAF0A1B4C, 0x36034AF6, 0x41047A60,
+ 0xDF60EFC3, 0xA867DF55, 0x316E8EEF, 0x4669BE79,
+ 0xCB61B38C, 0xBC66831A, 0x256FD2A0, 0x5268E236,
+ 0xCC0C7795, 0xBB0B4703, 0x220216B9, 0x5505262F,
+ 0xC5BA3BBE, 0xB2BD0B28, 0x2BB45A92, 0x5CB36A04,
+ 0xC2D7FFA7, 0xB5D0CF31, 0x2CD99E8B, 0x5BDEAE1D,
+ 0x9B64C2B0, 0xEC63F226, 0x756AA39C, 0x026D930A,
+ 0x9C0906A9, 0xEB0E363F, 0x72076785, 0x05005713,
+ 0x95BF4A82, 0xE2B87A14, 0x7BB12BAE, 0x0CB61B38,
+ 0x92D28E9B, 0xE5D5BE0D, 0x7CDCEFB7, 0x0BDBDF21,
+ 0x86D3D2D4, 0xF1D4E242, 0x68DDB3F8, 0x1FDA836E,
+ 0x81BE16CD, 0xF6B9265B, 0x6FB077E1, 0x18B74777,
+ 0x88085AE6, 0xFF0F6A70, 0x66063BCA, 0x11010B5C,
+ 0x8F659EFF, 0xF862AE69, 0x616BFFD3, 0x166CCF45,
+ 0xA00AE278, 0xD70DD2EE, 0x4E048354, 0x3903B3C2,
+ 0xA7672661, 0xD06016F7, 0x4969474D, 0x3E6E77DB,
+ 0xAED16A4A, 0xD9D65ADC, 0x40DF0B66, 0x37D83BF0,
+ 0xA9BCAE53, 0xDEBB9EC5, 0x47B2CF7F, 0x30B5FFE9,
+ 0xBDBDF21C, 0xCABAC28A, 0x53B39330, 0x24B4A3A6,
+ 0xBAD03605, 0xCDD70693, 0x54DE5729, 0x23D967BF,
+ 0xB3667A2E, 0xC4614AB8, 0x5D681B02, 0x2A6F2B94,
+ 0xB40BBE37, 0xC30C8EA1, 0x5A05DF1B, 0x2D02EF8D
+ ];
+
+ if (typeof(crc) == "undefined") { crc = 0; }
+ var x = 0;
+ var y = 0;
+ var byte = 0;
+
+ crc = crc ^ (-1);
+ for( var i = 0, iTop = input.length; i < iTop; i++ ) {
+ byte = isArray ? input[i] : input.charCodeAt(i);
+ y = ( crc ^ byte ) & 0xFF;
+ x = table[y];
+ crc = ( crc >>> 8 ) ^ x;
+ }
+
+ return crc ^ (-1);
+ },
+
+ // Inspired by http://my.opera.com/GreyWyvern/blog/show.dml/1725165
+ clone : function() {
+ var newObj = new JSZip();
+ for (var i in this) {
+ if (typeof this[i] !== "function") {
+ newObj[i] = this[i];
+ }
+ }
+ return newObj;
+ },
+
+
+ /**
+ * http://www.webtoolkit.info/javascript-utf8.html
+ */
+ utf8encode : function (string) {
+ // TextEncoder + Uint8Array to binary string is faster than checking every bytes on long strings.
+ // http://jsperf.com/utf8encode-vs-textencoder
+ // On short strings (file names for example), the TextEncoder API is (currently) slower.
+ if (JSZip.support.uint8array && typeof TextEncoder === "function") {
+ var u8 = TextEncoder("utf-8").encode(string);
+ return JSZip.utils.transformTo("string", u8);
+ }
+ if (JSZip.support.nodebuffer) {
+ return JSZip.utils.transformTo("string", new Buffer(string, "utf-8"));
+ }
+
+ // array.join may be slower than string concatenation but generates less objects (less time spent garbage collecting).
+ // See also http://jsperf.com/array-direct-assignment-vs-push/31
+ var result = [], resIndex = 0;
+
+ for (var n = 0; n < string.length; n++) {
+
+ var c = string.charCodeAt(n);
+
+ if (c < 128) {
+ result[resIndex++] = String.fromCharCode(c);
+ } else if ((c > 127) && (c < 2048)) {
+ result[resIndex++] = String.fromCharCode((c >> 6) | 192);
+ result[resIndex++] = String.fromCharCode((c & 63) | 128);
+ } else {
+ result[resIndex++] = String.fromCharCode((c >> 12) | 224);
+ result[resIndex++] = String.fromCharCode(((c >> 6) & 63) | 128);
+ result[resIndex++] = String.fromCharCode((c & 63) | 128);
+ }
+
+ }
+
+ return result.join("");
+ },
+
+ /**
+ * http://www.webtoolkit.info/javascript-utf8.html
+ */
+ utf8decode : function (input) {
+ var result = [], resIndex = 0;
+ var type = JSZip.utils.getTypeOf(input);
+ var isArray = type !== "string";
+ var i = 0;
+ var c = 0, c1 = 0, c2 = 0, c3 = 0;
+
+ // check if we can use the TextDecoder API
+ // see http://encoding.spec.whatwg.org/#api
+ if (JSZip.support.uint8array && typeof TextDecoder === "function") {
+ return TextDecoder("utf-8").decode(
+ JSZip.utils.transformTo("uint8array", input)
+ );
+ }
+ if (JSZip.support.nodebuffer) {
+ return JSZip.utils.transformTo("nodebuffer", input).toString("utf-8");
+ }
+
+ while ( i < input.length ) {
+
+ c = isArray ? input[i] : input.charCodeAt(i);
+
+ if (c < 128) {
+ result[resIndex++] = String.fromCharCode(c);
+ i++;
+ } else if ((c > 191) && (c < 224)) {
+ c2 = isArray ? input[i+1] : input.charCodeAt(i+1);
+ result[resIndex++] = String.fromCharCode(((c & 31) << 6) | (c2 & 63));
+ i += 2;
+ } else {
+ c2 = isArray ? input[i+1] : input.charCodeAt(i+1);
+ c3 = isArray ? input[i+2] : input.charCodeAt(i+2);
+ result[resIndex++] = String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));
+ i += 3;
+ }
+
+ }
+
+ return result.join("");
+ }
+ };
+}());
+
+/*
+ * Compression methods
+ * This object is filled in as follow :
+ * name : {
+ * magic // the 2 bytes indentifying the compression method
+ * compress // function, take the uncompressed content and return it compressed.
+ * uncompress // function, take the compressed content and return it uncompressed.
+ * compressInputType // string, the type accepted by the compress method. null to accept everything.
+ * uncompressInputType // string, the type accepted by the uncompress method. null to accept everything.
+ * }
+ *
+ * STORE is the default compression method, so it's included in this file.
+ * Other methods should go to separated files : the user wants modularity.
+ */
+JSZip.compressions = {
+ "STORE" : {
+ magic : "\x00\x00",
+ compress : function (content) {
+ return content; // no compression
+ },
+ uncompress : function (content) {
+ return content; // no compression
+ },
+ compressInputType : null,
+ uncompressInputType : null
+ }
+};
+
+/*
+ * List features that require a modern browser, and if the current browser support them.
+ */
+JSZip.support = {
+ // contains true if JSZip can read/generate ArrayBuffer, false otherwise.
+ arraybuffer : (function(){
+ return typeof ArrayBuffer !== "undefined" && typeof Uint8Array !== "undefined";
+ })(),
+ // contains true if JSZip can read/generate nodejs Buffer, false otherwise.
+ nodebuffer : (function(){
+ return typeof Buffer !== "undefined";
+ })(),
+ // contains true if JSZip can read/generate Uint8Array, false otherwise.
+ uint8array : (function(){
+ return typeof Uint8Array !== "undefined";
+ })(),
+ // contains true if JSZip can read/generate Blob, false otherwise.
+ blob : (function(){
+ // the spec started with BlobBuilder then replaced it with a construtor for Blob.
+ // Result : we have browsers that :
+ // * know the BlobBuilder (but with prefix)
+ // * know the Blob constructor
+ // * know about Blob but not about how to build them
+ // About the "=== 0" test : if given the wrong type, it may be converted to a string.
+ // Instead of an empty content, we will get "[object Uint8Array]" for example.
+ if (typeof ArrayBuffer === "undefined") {
+ return false;
+ }
+ var buffer = new ArrayBuffer(0);
+ try {
+ return new Blob([buffer], { type: "application/zip" }).size === 0;
+ }
+ catch(e) {}
+
+ try {
+ var builder = new (window.BlobBuilder || window.WebKitBlobBuilder ||
+ window.MozBlobBuilder || window.MSBlobBuilder)();
+ builder.append(buffer);
+ return builder.getBlob('application/zip').size === 0;
+ }
+ catch(e) {}
+
+ return false;
+ })()
+};
+
+(function () {
+ JSZip.utils = {
+ /**
+ * Convert a string to a "binary string" : a string containing only char codes between 0 and 255.
+ * @param {string} str the string to transform.
+ * @return {String} the binary string.
+ */
+ string2binary : function (str) {
+ var result = "";
+ for (var i = 0; i < str.length; i++) {
+ result += String.fromCharCode(str.charCodeAt(i) & 0xff);
+ }
+ return result;
+ },
+ /**
+ * Create a Uint8Array from the string.
+ * @param {string} str the string to transform.
+ * @return {Uint8Array} the typed array.
+ * @throws {Error} an Error if the browser doesn't support the requested feature.
+ * @deprecated : use JSZip.utils.transformTo instead.
+ */
+ string2Uint8Array : function (str) {
+ return JSZip.utils.transformTo("uint8array", str);
+ },
+
+ /**
+ * Create a string from the Uint8Array.
+ * @param {Uint8Array} array the array to transform.
+ * @return {string} the string.
+ * @throws {Error} an Error if the browser doesn't support the requested feature.
+ * @deprecated : use JSZip.utils.transformTo instead.
+ */
+ uint8Array2String : function (array) {
+ return JSZip.utils.transformTo("string", array);
+ },
+ /**
+ * Create a blob from the given ArrayBuffer.
+ * @param {ArrayBuffer} buffer the buffer to transform.
+ * @return {Blob} the result.
+ * @throws {Error} an Error if the browser doesn't support the requested feature.
+ */
+ arrayBuffer2Blob : function (buffer) {
+ JSZip.utils.checkSupport("blob");
+
+ try {
+ // Blob constructor
+ return new Blob([buffer], { type: "application/zip" });
+ }
+ catch(e) {}
+
+ try {
+ // deprecated, browser only, old way
+ var builder = new (window.BlobBuilder || window.WebKitBlobBuilder ||
+ window.MozBlobBuilder || window.MSBlobBuilder)();
+ builder.append(buffer);
+ return builder.getBlob('application/zip');
+ }
+ catch(e) {}
+
+ // well, fuck ?!
+ throw new Error("Bug : can't construct the Blob.");
+ },
+ /**
+ * Create a blob from the given string.
+ * @param {string} str the string to transform.
+ * @return {Blob} the result.
+ * @throws {Error} an Error if the browser doesn't support the requested feature.
+ */
+ string2Blob : function (str) {
+ var buffer = JSZip.utils.transformTo("arraybuffer", str);
+ return JSZip.utils.arrayBuffer2Blob(buffer);
+ }
+ };
+
+ /**
+ * The identity function.
+ * @param {Object} input the input.
+ * @return {Object} the same input.
+ */
+ function identity(input) {
+ return input;
+ };
+
+ /**
+ * Fill in an array with a string.
+ * @param {String} str the string to use.
+ * @param {Array|ArrayBuffer|Uint8Array|Buffer} array the array to fill in (will be mutated).
+ * @return {Array|ArrayBuffer|Uint8Array|Buffer} the updated array.
+ */
+ function stringToArrayLike(str, array) {
+ for (var i = 0; i < str.length; ++i) {
+ array[i] = str.charCodeAt(i) & 0xFF;
+ }
+ return array;
+ };
+
+ /**
+ * Transform an array-like object to a string.
+ * @param {Array|ArrayBuffer|Uint8Array|Buffer} array the array to transform.
+ * @return {String} the result.
+ */
+ function arrayLikeToString(array) {
+ // Performances notes :
+ // --------------------
+ // String.fromCharCode.apply(null, array) is the fastest, see
+ // see http://jsperf.com/converting-a-uint8array-to-a-string/2
+ // but the stack is limited (and we can get huge arrays !).
+ //
+ // result += String.fromCharCode(array[i]); generate too many strings !
+ //
+ // This code is inspired by http://jsperf.com/arraybuffer-to-string-apply-performance/2
+ var chunk = 65536;
+ var result = [], len = array.length, type = JSZip.utils.getTypeOf(array), k = 0;
+
+ while (k < len && chunk > 1) {
+ try {
+ if (type === "array" || type === "nodebuffer") {
+ result.push(String.fromCharCode.apply(null, array.slice(k, Math.max(k + chunk, len))));
+ } else {
+ result.push(String.fromCharCode.apply(null, array.subarray(k, k + chunk)));
+ }
+ k += chunk;
+ } catch (e) {
+ chunk = Math.floor(chunk / 2);
+ }
+ }
+ return result.join("");
+ };
+
+ /**
+ * Copy the data from an array-like to an other array-like.
+ * @param {Array|ArrayBuffer|Uint8Array|Buffer} arrayFrom the origin array.
+ * @param {Array|ArrayBuffer|Uint8Array|Buffer} arrayTo the destination array which will be mutated.
+ * @return {Array|ArrayBuffer|Uint8Array|Buffer} the updated destination array.
+ */
+ function arrayLikeToArrayLike(arrayFrom, arrayTo) {
+ for(var i = 0; i < arrayFrom.length; i++) {
+ arrayTo[i] = arrayFrom[i];
+ }
+ return arrayTo;
+ };
+
+ // a matrix containing functions to transform everything into everything.
+ var transform = {};
+
+ // string to ?
+ transform["string"] = {
+ "string" : identity,
+ "array" : function (input) {
+ return stringToArrayLike(input, new Array(input.length));
+ },
+ "arraybuffer" : function (input) {
+ return transform["string"]["uint8array"](input).buffer;
+ },
+ "uint8array" : function (input) {
+ return stringToArrayLike(input, new Uint8Array(input.length));
+ },
+ "nodebuffer" : function (input) {
+ return stringToArrayLike(input, new Buffer(input.length));
+ }
+ };
+
+ // array to ?
+ transform["array"] = {
+ "string" : arrayLikeToString,
+ "array" : identity,
+ "arraybuffer" : function (input) {
+ return (new Uint8Array(input)).buffer;
+ },
+ "uint8array" : function (input) {
+ return new Uint8Array(input);
+ },
+ "nodebuffer" : function (input) {
+ return new Buffer(input);
+ }
+ };
+
+ // arraybuffer to ?
+ transform["arraybuffer"] = {
+ "string" : function (input) {
+ return arrayLikeToString(new Uint8Array(input));
+ },
+ "array" : function (input) {
+ return arrayLikeToArrayLike(new Uint8Array(input), new Array(input.byteLength));
+ },
+ "arraybuffer" : identity,
+ "uint8array" : function (input) {
+ return new Uint8Array(input);
+ },
+ "nodebuffer" : function (input) {
+ return new Buffer(new Uint8Array(input));
+ }
+ };
+
+ // uint8array to ?
+ transform["uint8array"] = {
+ "string" : arrayLikeToString,
+ "array" : function (input) {
+ return arrayLikeToArrayLike(input, new Array(input.length));
+ },
+ "arraybuffer" : function (input) {
+ return input.buffer;
+ },
+ "uint8array" : identity,
+ "nodebuffer" : function(input) {
+ return new Buffer(input);
+ }
+ };
+
+ // nodebuffer to ?
+ transform["nodebuffer"] = {
+ "string" : arrayLikeToString,
+ "array" : function (input) {
+ return arrayLikeToArrayLike(input, new Array(input.length));
+ },
+ "arraybuffer" : function (input) {
+ return transform["nodebuffer"]["uint8array"](input).buffer;
+ },
+ "uint8array" : function (input) {
+ return arrayLikeToArrayLike(input, new Uint8Array(input.length));
+ },
+ "nodebuffer" : identity
+ };
+
+ /**
+ * Transform an input into any type.
+ * The supported output type are : string, array, uint8array, arraybuffer, nodebuffer.
+ * If no output type is specified, the unmodified input will be returned.
+ * @param {String} outputType the output type.
+ * @param {String|Array|ArrayBuffer|Uint8Array|Buffer} input the input to convert.
+ * @throws {Error} an Error if the browser doesn't support the requested output type.
+ */
+ JSZip.utils.transformTo = function (outputType, input) {
+ if (!input) {
+ // undefined, null, etc
+ // an empty string won't harm.
+ input = "";
+ }
+ if (!outputType) {
+ return input;
+ }
+ JSZip.utils.checkSupport(outputType);
+ var inputType = JSZip.utils.getTypeOf(input);
+ var result = transform[inputType][outputType](input);
+ return result;
+ };
+
+ /**
+ * Return the type of the input.
+ * The type will be in a format valid for JSZip.utils.transformTo : string, array, uint8array, arraybuffer.
+ * @param {Object} input the input to identify.
+ * @return {String} the (lowercase) type of the input.
+ */
+ JSZip.utils.getTypeOf = function (input) {
+ if (typeof input === "string") {
+ return "string";
+ }
+ if (input instanceof Array) {
+ return "array";
+ }
+ if (JSZip.support.nodebuffer && Buffer.isBuffer(input)) {
+ return "nodebuffer";
+ }
+ if (JSZip.support.uint8array && input instanceof Uint8Array) {
+ return "uint8array";
+ }
+ if (JSZip.support.arraybuffer && input instanceof ArrayBuffer) {
+ return "arraybuffer";
+ }
+ };
+
+ /**
+ * Throw an exception if the type is not supported.
+ * @param {String} type the type to check.
+ * @throws {Error} an Error if the browser doesn't support the requested type.
+ */
+ JSZip.utils.checkSupport = function (type) {
+ var supported = true;
+ switch (type.toLowerCase()) {
+ case "uint8array":
+ supported = JSZip.support.uint8array;
+ break;
+ case "arraybuffer":
+ supported = JSZip.support.arraybuffer;
+ break;
+ case "nodebuffer":
+ supported = JSZip.support.nodebuffer;
+ break;
+ case "blob":
+ supported = JSZip.support.blob;
+ break;
+ }
+ if (!supported) {
+ throw new Error(type + " is not supported by this browser");
+ }
+ };
+
+
+})();
+
+(function (){
+ /**
+ * Represents an entry in the zip.
+ * The content may or may not be compressed.
+ * @constructor
+ */
+ JSZip.CompressedObject = function () {
+ this.compressedSize = 0;
+ this.uncompressedSize = 0;
+ this.crc32 = 0;
+ this.compressionMethod = null;
+ this.compressedContent = null;
+ };
+
+ JSZip.CompressedObject.prototype = {
+ /**
+ * Return the decompressed content in an unspecified format.
+ * The format will depend on the decompressor.
+ * @return {Object} the decompressed content.
+ */
+ getContent : function () {
+ return null; // see implementation
+ },
+ /**
+ * Return the compressed content in an unspecified format.
+ * The format will depend on the compressed conten source.
+ * @return {Object} the compressed content.
+ */
+ getCompressedContent : function () {
+ return null; // see implementation
+ }
+ };
+})();
+
+/**
+ *
+ * Base64 encode / decode
+ * http://www.webtoolkit.info/
+ *
+ * Hacked so that it doesn't utf8 en/decode everything
+ **/
+JSZip.base64 = (function() {
+ // private property
+ var _keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
+
+ return {
+ // public method for encoding
+ encode : function(input, utf8) {
+ var output = "";
+ var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
+ var i = 0;
+
+ while (i < input.length) {
+
+ chr1 = input.charCodeAt(i++);
+ chr2 = input.charCodeAt(i++);
+ chr3 = input.charCodeAt(i++);
+
+ enc1 = chr1 >> 2;
+ enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
+ enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
+ enc4 = chr3 & 63;
+
+ if (isNaN(chr2)) {
+ enc3 = enc4 = 64;
+ } else if (isNaN(chr3)) {
+ enc4 = 64;
+ }
+
+ output = output +
+ _keyStr.charAt(enc1) + _keyStr.charAt(enc2) +
+ _keyStr.charAt(enc3) + _keyStr.charAt(enc4);
+
+ }
+
+ return output;
+ },
+
+ // public method for decoding
+ decode : function(input, utf8) {
+ var output = "";
+ var chr1, chr2, chr3;
+ var enc1, enc2, enc3, enc4;
+ var i = 0;
+
+ input = input.replace(/[^A-Za-z0-9\+\/\=]/g, "");
+
+ while (i < input.length) {
+
+ enc1 = _keyStr.indexOf(input.charAt(i++));
+ enc2 = _keyStr.indexOf(input.charAt(i++));
+ enc3 = _keyStr.indexOf(input.charAt(i++));
+ enc4 = _keyStr.indexOf(input.charAt(i++));
+
+ chr1 = (enc1 << 2) | (enc2 >> 4);
+ chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
+ chr3 = ((enc3 & 3) << 6) | enc4;
+
+ output = output + String.fromCharCode(chr1);
+
+ if (enc3 != 64) {
+ output = output + String.fromCharCode(chr2);
+ }
+ if (enc4 != 64) {
+ output = output + String.fromCharCode(chr3);
+ }
+
+ }
+
+ return output;
+
+ }
+ };
+}());
+
+// enforcing Stuk's coding style
+// vim: set shiftwidth=3 softtabstop=3:
\ No newline at end of file
--- /dev/null
+//
+// LESS - Leaner CSS v1.3.3
+// http://lesscss.org
+//
+// Copyright (c) 2009-2013, Alexis Sellier
+// Licensed under the Apache 2.0 License.
+//
+(function(e,t){function n(t){return e.less[t.split("/")[1]]}function f(){r.env==="development"?(r.optimization=0,r.watchTimer=setInterval(function(){r.watchMode&&g(function(e,t,n,r,i){t&&S(t.toCSS(),r,i.lastModified)})},r.poll)):r.optimization=3}function m(){var e=document.getElementsByTagName("style");for(var t=0;t<e.length;t++)e[t].type.match(p)&&(new r.Parser({filename:document.location.href.replace(/#.*$/,""),dumpLineNumbers:r.dumpLineNumbers})).parse(e[t].innerHTML||"",function(n,r){var i=r.toCSS(),s=e[t];s.type="text/css",s.styleSheet?s.styleSheet.cssText=i:s.innerHTML=i})}function g(e,t){for(var n=0;n<r.sheets.length;n++)w(r.sheets[n],e,t,r.sheets.length-(n+1))}function y(e,t){var n=b(e),r=b(t),i,s,o,u,a="";if(n.hostPart!==r.hostPart)return"";s=Math.max(r.directories.length,n.directories.length);for(i=0;i<s;i++)if(r.directories[i]!==n.directories[i])break;u=r.directories.slice(i),o=n.directories.slice(i);for(i=0;i<u.length-1;i++)a+="../";for(i=0;i<o.length-1;i++)a+=o[i]+"/";return a}function b(e,t){var n=/^((?:[a-z-]+:)?\/\/(?:[^\/\?#]*\/)|([\/\\]))?((?:[^\/\\\?#]*[\/\\])*)([^\/\\\?#]*)([#\?].*)?$/,r=e.match(n),i={},s=[],o,u;if(!r)throw new Error("Could not parse sheet href - '"+e+"'");if(!r[1]||r[2]){u=t.match(n);if(!u)throw new Error("Could not parse page url - '"+t+"'");r[1]=u[1],r[2]||(r[3]=u[3]+r[3])}if(r[3]){s=r[3].replace("\\","/").split("/");for(o=0;o<s.length;o++)s[o]===".."&&o>0&&(s.splice(o-1,2),o-=2)}return i.hostPart=r[1],i.directories=s,i.path=r[1]+s.join("/"),i.fileUrl=i.path+(r[4]||""),i.url=i.fileUrl+(r[5]||""),i}function w(t,n,i,s){var o=t.contents||{},u=t.files||{},a=b(t.href,e.location.href),f=a.url,c=l&&l.getItem(f),h=l&&l.getItem(f+":timestamp"),p={css:c,timestamp:h},d;r.relativeUrls?r.rootpath?t.entryPath?d=b(r.rootpath+y(a.path,t.entryPath)).path:d=r.rootpath:d=a.path:r.rootpath?d=r.rootpath:t.entryPath?d=t.entryPath:d=a.path,x(f,t.type,function(e,l){v+=e.replace(/@import .+?;/ig,"");if(!i&&p&&l&&(new Date(l)).valueOf()===(new Date(p.timestamp)).valueOf())S(p.css,t),n(null,null,e,t,{local:!0,remaining:s},f);else try{o[f]=e,(new r.Parser({optimization:r.optimization,paths:[a.path],entryPath:t.entryPath||a.path,mime:t.type,filename:f,rootpath:d,relativeUrls:t.relativeUrls,contents:o,files:u,dumpLineNumbers:r.dumpLineNumbers})).parse(e,function(r,i){if(r)return k(r,f);try{n(r,i,e,t,{local:!1,lastModified:l,remaining:s},f),N(document.getElementById("less-error-message:"+E(f)))}catch(r){k(r,f)}})}catch(c){k(c,f)}},function(e,t){throw new Error("Couldn't load "+t+" ("+e+")")})}function E(e){return e.replace(/^[a-z]+:\/\/?[^\/]+/,"").replace(/^\//,"").replace(/\.[a-zA-Z]+$/,"").replace(/[^\.\w-]+/g,"-").replace(/\./g,":")}function S(e,t,n){var r,i=t.href||"",s="less:"+(t.title||E(i));if((r=document.getElementById(s))===null){r=document.createElement("style"),r.type="text/css",t.media&&(r.media=t.media),r.id=s;var o=t&&t.nextSibling||null;(o||document.getElementsByTagName("head")[0]).parentNode.insertBefore(r,o)}if(r.styleSheet)try{r.styleSheet.cssText=e}catch(u){throw new Error("Couldn't reassign styleSheet.cssText.")}else(function(e){r.childNodes.length>0?r.firstChild.nodeValue!==e.nodeValue&&r.replaceChild(e,r.firstChild):r.appendChild(e)})(document.createTextNode(e));if(n&&l){C("saving "+i+" to cache.");try{l.setItem(i,e),l.setItem(i+":timestamp",n)}catch(u){C("failed to save")}}}function x(e,t,n,i){function a(t,n,r){t.status>=200&&t.status<300?n(t.responseText,t.getResponseHeader("Last-Modified")):typeof r=="function"&&r(t.status,e)}var s=T(),u=o?r.fileAsync:r.async;typeof s.overrideMimeType=="function"&&s.overrideMimeType("text/css"),s.open("GET",e,u),s.setRequestHeader("Accept",t||"text/x-less, text/css; q=0.9, */*; q=0.5"),s.send(null),o&&!r.fileAsync?s.status===0||s.status>=200&&s.status<300?n(s.responseText):i(s.status,e):u?s.onreadystatechange=function(){s.readyState==4&&a(s,n,i)}:a(s,n,i)}function T(){if(e.XMLHttpRequest)return new XMLHttpRequest;try{return new ActiveXObject("MSXML2.XMLHTTP.3.0")}catch(t){return C("browser doesn't support AJAX."),null}}function N(e){return e&&e.parentNode.removeChild(e)}function C(e){r.env=="development"&&typeof console!="undefined"&&console.log("less: "+e)}function k(e,t){var n="less-error-message:"+E(t),i='<li><label>{line}</label><pre class="{class}">{content}</pre></li>',s=document.createElement("div"),o,u,a=[],f=e.filename||t,l=f.match(/([^\/]+(\?.*)?)$/)[1];s.id=n,s.className="less-error-message",u="<h3>"+(e.message||"There is an error in your .less file")+"</h3>"+'<p>in <a href="'+f+'">'+l+"</a> ";var c=function(e,t,n){e.extract[t]&&a.push(i.replace(/\{line\}/,parseInt(e.line)+(t-1)).replace(/\{class\}/,n).replace(/\{content\}/,e.extract[t]))};e.stack?u+="<br/>"+e.stack.split("\n").slice(1).join("<br/>"):e.extract&&(c(e,0,""),c(e,1,"line"),c(e,2,""),u+="on line "+e.line+", column "+(e.column+1)+":</p>"+"<ul>"+a.join("")+"</ul>"),s.innerHTML=u,S([".less-error-message ul, .less-error-message li {","list-style-type: none;","margin-right: 15px;","padding: 4px 0;","margin: 0;","}",".less-error-message label {","font-size: 12px;","margin-right: 15px;","padding: 4px 0;","color: #cc7777;","}",".less-error-message pre {","color: #dd6666;","padding: 4px 0;","margin: 0;","display: inline-block;","}",".less-error-message pre.line {","color: #ff0000;","}",".less-error-message h3 {","font-size: 20px;","font-weight: bold;","padding: 15px 0 5px 0;","margin: 0;","}",".less-error-message a {","color: #10a","}",".less-error-message .error {","color: red;","font-weight: bold;","padding-bottom: 2px;","border-bottom: 1px dashed red;","}"].join("\n"),{title:"error-message"}),s.style.cssText=["font-family: Arial, sans-serif","border: 1px solid #e00","background-color: #eee","border-radius: 5px","-webkit-border-radius: 5px","-moz-border-radius: 5px","color: #e00","padding: 15px","margin-bottom: 15px"].join(";"),r.env=="development"&&(o=setInterval(function(){document.body&&(document.getElementById(n)?document.body.replaceChild(s,document.getElementById(n)):document.body.insertBefore(s,document.body.firstChild),clearInterval(o))},10))}Array.isArray||(Array.isArray=function(e){return Object.prototype.toString.call(e)==="[object Array]"||e instanceof Array}),Array.prototype.forEach||(Array.prototype.forEach=function(e,t){var n=this.length>>>0;for(var r=0;r<n;r++)r in this&&e.call(t,this[r],r,this)}),Array.prototype.map||(Array.prototype.map=function(e){var t=this.length>>>0,n=new Array(t),r=arguments[1];for(var i=0;i<t;i++)i in this&&(n[i]=e.call(r,this[i],i,this));return n}),Array.prototype.filter||(Array.prototype.filter=function(e){var t=[],n=arguments[1];for(var r=0;r<this.length;r++)e.call(n,this[r])&&t.push(this[r]);return t}),Array.prototype.reduce||(Array.prototype.reduce=function(e){var t=this.length>>>0,n=0;if(t===0&&arguments.length===1)throw new TypeError;if(arguments.length>=2)var r=arguments[1];else do{if(n in this){r=this[n++];break}if(++n>=t)throw new TypeError}while(!0);for(;n<t;n++)n in this&&(r=e.call(null,r,this[n],n,this));return r}),Array.prototype.indexOf||(Array.prototype.indexOf=function(e){var t=this.length,n=arguments[1]||0;if(!t)return-1;if(n>=t)return-1;n<0&&(n+=t);for(;n<t;n++){if(!Object.prototype.hasOwnProperty.call(this,n))continue;if(e===this[n])return n}return-1}),Object.keys||(Object.keys=function(e){var t=[];for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&t.push(n);return t}),String.prototype.trim||(String.prototype.trim=function(){return String(this).replace(/^\s\s*/,"").replace(/\s\s*$/,"")});var r,i,s;typeof environment=="object"&&{}.toString.call(environment)==="[object Environment]"?(typeof e=="undefined"?r={}:r=e.less={},i=r.tree={},r.mode="rhino"):typeof e=="undefined"?(r=exports,i=n("./tree"),r.mode="node"):(typeof e.less=="undefined"&&(e.less={}),r=e.less,i=e.less.tree={},r.mode="browser"),r.Parser=function(t){function g(){a=c[u],f=o,h=o}function y(){c[u]=a,o=f,h=o}function b(){o>h&&(c[u]=c[u].slice(o-h),h=o)}function w(e){var t=e.charCodeAt(0);return t===32||t===10||t===9}function E(e){var t,n,r,i,a;if(e instanceof Function)return e.call(p.parsers);if(typeof e=="string")t=s.charAt(o)===e?e:null,r=1,b();else{b();if(!(t=e.exec(c[u])))return null;r=t[0].length}if(t)return S(r),typeof t=="string"?t:t.length===1?t[0]:t}function S(e){var t=o,n=u,r=o+c[u].length,i=o+=e;while(o<r){if(!w(s.charAt(o)))break;o++}return c[u]=c[u].slice(e+(o-i)),h=o,c[u].length===0&&u<c.length-1&&u++,t!==o||n!==u}function x(e,t){var n=E(e);if(!!n)return n;T(t||(typeof e=="string"?"expected '"+e+"' got '"+s.charAt(o)+"'":"unexpected token"))}function T(e,t){var n=new Error(e);throw n.index=o,n.type=t||"Syntax",n}function N(e){return typeof e=="string"?s.charAt(o)===e:e.test(c[u])?!0:!1}function C(e,t){return e.filename&&t.filename&&e.filename!==t.filename?p.imports.contents[e.filename]:s}function k(e,t){for(var n=e,r=-1;n>=0&&t.charAt(n)!=="\n";n--)r++;return{line:typeof e=="number"?(t.slice(0,e).match(/\n/g)||"").length:null,column:r}}function L(e){return r.mode==="browser"||r.mode==="rhino"?e.filename:n("path").resolve(e.filename)}function A(e,t,n){return{lineNumber:k(e,t).line+1,fileName:L(n)}}function O(e,t){var n=C(e,t),r=k(e.index,n),i=r.line,s=r.column,o=n.split("\n");this.type=e.type||"Syntax",this.message=e.message,this.filename=e.filename||t.filename,this.index=e.index,this.line=typeof i=="number"?i+1:null,this.callLine=e.call&&k(e.call,n).line+1,this.callExtract=o[k(e.call,n).line],this.stack=e.stack,this.column=s,this.extract=[o[i-1],o[i],o[i+1]]}var s,o,u,a,f,l,c,h,p,d=this,t=t||{};t.contents||(t.contents={}),t.rootpath=t.rootpath||"",t.files||(t.files={});var v=function(){},m=this.imports={paths:t.paths||[],queue:[],files:t.files,contents:t.contents,mime:t.mime,error:null,push:function(e,n){var i=this;this.queue.push(e),r.Parser.importer(e,this.paths,function(t,r,s){i.queue.splice(i.queue.indexOf(e),1);var o=s in i.files;i.files[s]=r,t&&!i.error&&(i.error=t),n(t,r,o),i.queue.length===0&&v(i.error)},t)}};return this.env=t=t||{},this.optimization="optimization"in this.env?this.env.optimization:1,this.env.filename=this.env.filename||null,p={imports:m,parse:function(e,a){var f,d,m,g,y,b,w=[],S,x=null;o=u=h=l=0,s=e.replace(/\r\n/g,"\n"),s=s.replace(/^\uFEFF/,""),c=function(e){var n=0,r=/(?:@\{[\w-]+\}|[^"'`\{\}\/\(\)\\])+/g,i=/\/\*(?:[^*]|\*+[^\/*])*\*+\/|\/\/.*/g,o=/"((?:[^"\\\r\n]|\\.)*)"|'((?:[^'\\\r\n]|\\.)*)'|`((?:[^`]|\\.)*)`/g,u=0,a,f=e[0],l;for(var c=0,h,p;c<s.length;){r.lastIndex=c,(a=r.exec(s))&&a.index===c&&(c+=a[0].length,f.push(a[0])),h=s.charAt(c),i.lastIndex=o.lastIndex=c;if(a=o.exec(s))if(a.index===c){c+=a[0].length,f.push(a[0]);continue}if(!l&&h==="/"){p=s.charAt(c+1);if(p==="/"||p==="*")if(a=i.exec(s))if(a.index===c){c+=a[0].length,f.push(a[0]);continue}}switch(h){case"{":if(!l){u++,f.push(h);break};case"}":if(!l){u--,f.push(h),e[++n]=f=[];break};case"(":if(!l){l=!0,f.push(h);break};case")":if(l){l=!1,f.push(h);break};default:f.push(h)}c++}return u!=0&&(x=new O({index:c-1,type:"Parse",message:u>0?"missing closing `}`":"missing opening `{`",filename:t.filename},t)),e.map(function(e){return e.join("")})}([[]]);if(x)return a(x,t);try{f=new i.Ruleset([],E(this.parsers.primary)),f.root=!0}catch(T){return a(new O(T,t))}f.toCSS=function(e){var s,o,u;return function(s,o){var u=[],a;s=s||{},typeof o=="object"&&!Array.isArray(o)&&(o=Object.keys(o).map(function(e){var t=o[e];return t instanceof i.Value||(t instanceof i.Expression||(t=new i.Expression([t])),t=new i.Value([t])),new i.Rule("@"+e,t,!1,0)}),u=[new i.Ruleset(null,o)]);try{var f=e.call(this,{frames:u}).toCSS([],{compress:s.compress||!1,dumpLineNumbers:t.dumpLineNumbers})}catch(l){throw new O(l,t)}if(a=p.imports.error)throw a instanceof O?a:new O(a,t);return s.yuicompress&&r.mode==="node"?n("ycssmin").cssmin(f):s.compress?f.replace(/(\s)+/g,"$1"):f}}(f.eval);if(o<s.length-1){o=l,b=s.split("\n"),y=(s.slice(0,o).match(/\n/g)||"").length+1;for(var N=o,C=-1;N>=0&&s.charAt(N)!=="\n";N--)C++;x={type:"Parse",message:"Syntax Error on line "+y,index:o,filename:t.filename,line:y,column:C,extract:[b[y-2],b[y-1],b[y]]}}this.imports.queue.length>0?v=function(e){e=x||e,e?a(e):a(null,f)}:a(x,f)},parsers:{primary:function(){var e,t=[];while((e=E(this.mixin.definition)||E(this.rule)||E(this.ruleset)||E(this.mixin.call)||E(this.comment)||E(this.directive))||E(/^[\s\n]+/)||E(/^;+/))e&&t.push(e);return t},comment:function(){var e;if(s.charAt(o)!=="/")return;if(s.charAt(o+1)==="/")return new i.Comment(E(/^\/\/.*/),!0);if(e=E(/^\/\*(?:[^*]|\*+[^\/*])*\*+\/\n?/))return new i.Comment(e)},entities:{quoted:function(){var e,t=o,n;s.charAt(t)==="~"&&(t++,n=!0);if(s.charAt(t)!=='"'&&s.charAt(t)!=="'")return;n&&E("~");if(e=E(/^"((?:[^"\\\r\n]|\\.)*)"|'((?:[^'\\\r\n]|\\.)*)'/))return new i.Quoted(e[0],e[1]||e[2],n)},keyword:function(){var e;if(e=E(/^[_A-Za-z-][_A-Za-z0-9-]*/))return i.colors.hasOwnProperty(e)?new i.Color(i.colors[e].slice(1)):new i.Keyword(e)},call:function(){var e,n,r,s,a=o;if(!(e=/^([\w-]+|%|progid:[\w\.]+)\(/.exec(c[u])))return;e=e[1],n=e.toLowerCase();if(n==="url")return null;o+=e.length;if(n==="alpha"){s=E(this.alpha);if(typeof s!="undefined")return s}E("("),r=E(this.entities.arguments);if(!E(")"))return;if(e)return new i.Call(e,r,a,t.filename)},arguments:function(){var e=[],t;while(t=E(this.entities.assignment)||E(this.expression)){e.push(t);if(!E(","))break}return e},literal:function(){return E(this.entities.ratio)||E(this.entities.dimension)||E(this.entities.color)||E(this.entities.quoted)||E(this.entities.unicodeDescriptor)},assignment:function(){var e,t;if((e=E(/^\w+(?=\s?=)/i))&&E("=")&&(t=E(this.entity)))return new i.Assignment(e,t)},url:function(){var e;if(s.charAt(o)!=="u"||!E(/^url\(/))return;return e=E(this.entities.quoted)||E(this.entities.variable)||E(/^(?:(?:\\[\(\)'"])|[^\(\)'"])+/)||"",x(")"),new i.URL(e.value!=null||e instanceof i.Variable?e:new i.Anonymous(e),t.rootpath)},variable:function(){var e,n=o;if(s.charAt(o)==="@"&&(e=E(/^@@?[\w-]+/)))return new i.Variable(e,n,t.filename)},variableCurly:function(){var e,n,r=o;if(s.charAt(o)==="@"&&(n=E(/^@\{([\w-]+)\}/)))return new i.Variable("@"+n[1],r,t.filename)},color:function(){var e;if(s.charAt(o)==="#"&&(e=E(/^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})/)))return new i.Color(e[1])},dimension:function(){var e,t=s.charCodeAt(o);if(t>57||t<43||t===47||t==44)return;if(e=E(/^([+-]?\d*\.?\d+)(px|%|em|pc|ex|in|deg|s|ms|pt|cm|mm|rad|grad|turn|dpi|dpcm|dppx|rem|vw|vh|vmin|vm|ch)?/))return new i.Dimension(e[1],e[2])},ratio:function(){var e,t=s.charCodeAt(o);if(t>57||t<48)return;if(e=E(/^(\d+\/\d+)/))return new i.Ratio(e[1])},unicodeDescriptor:function(){var e;if(e=E(/^U\+[0-9a-fA-F?]+(\-[0-9a-fA-F?]+)?/))return new i.UnicodeDescriptor(e[0])},javascript:function(){var e,t=o,n;s.charAt(t)==="~"&&(t++,n=!0);if(s.charAt(t)!=="`")return;n&&E("~");if(e=E(/^`([^`]*)`/))return new i.JavaScript(e[1],o,n)}},variable:function(){var e;if(s.charAt(o)==="@"&&(e=E(/^(@[\w-]+)\s*:/)))return e[1]},shorthand:function(){var e,t;if(!N(/^[@\w.%-]+\/[@\w.-]+/))return;g();if((e=E(this.entity))&&E("/")&&(t=E(this.entity)))return new i.Shorthand(e,t);y()},mixin:{call:function(){var e=[],n,r,u=[],a=[],f,l,c,h,p,d,v,m=o,b=s.charAt(o),w,S,C=!1;if(b!=="."&&b!=="#")return;g();while(n=E(/^[#.](?:[\w-]|\\(?:[A-Fa-f0-9]{1,6} ?|[^A-Fa-f0-9]))+/))e.push(new i.Element(r,n,o)),r=E(">");if(E("(")){p=[];while(c=E(this.expression)){h=null,S=c;if(c.value.length==1){var k=c.value[0];k instanceof i.Variable&&E(":")&&(p.length>0&&(d&&T("Cannot mix ; and , as delimiter types"),v=!0),S=x(this.expression),h=w=k.name)}p.push(S),a.push({name:h,value:S});if(E(","))continue;if(E(";")||d)v&&T("Cannot mix ; and , as delimiter types"),d=!0,p.length>1&&(S=new i.Value(p)),u.push({name:w,value:S}),w=null,p=[],v=!1}x(")")}f=d?u:a,E(this.important)&&(C=!0);if(e.length>0&&(E(";")||N("}")))return new i.mixin.Call(e,f,m,t.filename,C);y()},definition:function(){var e,t=[],n,r,u,a,f,c=!1;if(s.charAt(o)!=="."&&s.charAt(o)!=="#"||N(/^[^{]*\}/))return;g();if(n=E(/^([#.](?:[\w-]|\\(?:[A-Fa-f0-9]{1,6} ?|[^A-Fa-f0-9]))+)\s*\(/)){e=n[1];do{E(this.comment);if(s.charAt(o)==="."&&E(/^\.{3}/)){c=!0,t.push({variadic:!0});break}if(!(u=E(this.entities.variable)||E(this.entities.literal)||E(this.entities.keyword)))break;if(u instanceof i.Variable)if(E(":"))a=x(this.expression,"expected expression"),t.push({name:u.name,value:a});else{if(E(/^\.{3}/)){t.push({name:u.name,variadic:!0}),c=!0;break}t.push({name:u.name})}else t.push({value:u})}while(E(",")||E(";"));E(")")||(l=o,y()),E(this.comment),E(/^when/)&&(f=x(this.conditions,"expected condition")),r=E(this.block);if(r)return new i.mixin.Definition(e,t,r,f,c);y()}}},entity:function(){return E(this.entities.literal)||E(this.entities.variable)||E(this.entities.url)||E(this.entities.call)||E(this.entities.keyword)||E(this.entities.javascript)||E(this.comment)},end:function(){return E(";")||N("}")},alpha:function(){var e;if(!E(/^\(opacity=/i))return;if(e=E(/^\d+/)||E(this.entities.variable))return x(")"),new i.Alpha(e)},element:function(){var e,t,n,r;n=E(this.combinator),e=E(/^(?:\d+\.\d+|\d+)%/)||E(/^(?:[.#]?|:*)(?:[\w-]|[^\x00-\x9f]|\\(?:[A-Fa-f0-9]{1,6} ?|[^A-Fa-f0-9]))+/)||E("*")||E("&")||E(this.attribute)||E(/^\([^()@]+\)/)||E(/^[\.#](?=@)/)||E(this.entities.variableCurly),e||E("(")&&(r=E(this.entities.variableCurly)||E(this.entities.variable)||E(this.selector))&&E(")")&&(e=new i.Paren(r));if(e)return new i.Element(n,e,o)},combinator:function(){var e,t=s.charAt(o);if(t===">"||t==="+"||t==="~"||t==="|"){o++;while(s.charAt(o).match(/\s/))o++;return new i.Combinator(t)}return s.charAt(o-1).match(/\s/)?new i.Combinator(" "):new i.Combinator(null)},selector:function(){var e,t,n=[],r,u;if(E("("))return e=E(this.entity),E(")")?new i.Selector([new i.Element("",e,o)]):null;while(t=E(this.element)){r=s.charAt(o),n.push(t);if(r==="{"||r==="}"||r===";"||r===","||r===")")break}if(n.length>0)return new i.Selector(n)},attribute:function(){var e="",t,n,r;if(!E("["))return;if(t=E(/^(?:[_A-Za-z0-9-]|\\.)+/)||E(this.entities.quoted))(r=E(/^[|~*$^]?=/))&&(n=E(this.entities.quoted)||E(/^[\w-]+/))?e=[t,r,n.toCSS?n.toCSS():n].join(""):e=t;if(!E("]"))return;if(e)return"["+e+"]"},block:function(){var e;if(E("{")&&(e=E(this.primary))&&E("}"))return e},ruleset:function(){var e=[],n,r,u,a;g(),t.dumpLineNumbers&&(a=A(o,s,t));while(n=E(this.selector)){e.push(n),E(this.comment);if(!E(","))break;E(this.comment)}if(e.length>0&&(r=E(this.block))){var f=new i.Ruleset(e,r,t.strictImports);return t.dumpLineNumbers&&(f.debugInfo=a),f}l=o,y()},rule:function(){var e,t,n=s.charAt(o),r,a;g();if(n==="."||n==="#"||n==="&")return;if(e=E(this.variable)||E(this.property)){e.charAt(0)!="@"&&(a=/^([^@+\/'"*`(;{}-]*);/.exec(c[u]))?(o+=a[0].length-1,t=new i.Anonymous(a[1])):e==="font"?t=E(this.font):t=E(this.value),r=E(this.important);if(t&&E(this.end))return new i.Rule(e,t,r,f);l=o,y()}},"import":function(){var e,n,r=o;g();var s=E(/^@import(?:-(once))?\s+/);if(s&&(e=E(this.entities.quoted)||E(this.entities.url))){n=E(this.mediaFeatures);if(E(";"))return new i.Import(e,m,n,s[1]==="once",r,t.rootpath)}y()},mediaFeature:function(){var e,t,n=[];do if(e=E(this.entities.keyword))n.push(e);else if(E("(")){t=E(this.property),e=E(this.entity);if(!E(")"))return null;if(t&&e)n.push(new i.Paren(new i.Rule(t,e,null,o,!0)));else{if(!e)return null;n.push(new i.Paren(e))}}while(e);if(n.length>0)return new i.Expression(n)},mediaFeatures:function(){var e,t=[];do if(e=E(this.mediaFeature)){t.push(e);if(!E(","))break}else if(e=E(this.entities.variable)){t.push(e);if(!E(","))break}while(e);return t.length>0?t:null},media:function(){var e,n,r,u;t.dumpLineNumbers&&(u=A(o,s,t));if(E(/^@media/)){e=E(this.mediaFeatures);if(n=E(this.block))return r=new i.Media(n,e),t.dumpLineNumbers&&(r.debugInfo=u),r}},directive:function(){var e,n,r,u,a,f,l,c,h,p;if(s.charAt(o)!=="@")return;if(n=E(this["import"])||E(this.media))return n;g(),e=E(/^@[a-z-]+/);if(!e)return;l=e,e.charAt(1)=="-"&&e.indexOf("-",2)>0&&(l="@"+e.slice(e.indexOf("-",2)+1));switch(l){case"@font-face":c=!0;break;case"@viewport":case"@top-left":case"@top-left-corner":case"@top-center":case"@top-right":case"@top-right-corner":case"@bottom-left":case"@bottom-left-corner":case"@bottom-center":case"@bottom-right":case"@bottom-right-corner":case"@left-top":case"@left-middle":case"@left-bottom":case"@right-top":case"@right-middle":case"@right-bottom":c=!0;break;case"@page":case"@document":case"@supports":case"@keyframes":c=!0,h=!0;break;case"@namespace":p=!0}h&&(e+=" "+(E(/^[^{]+/)||"").trim());if(c){if(r=E(this.block))return new i.Directive(e,r)}else if((n=p?E(this.expression):E(this.entity))&&E(";")){var d=new i.Directive(e,n);return t.dumpLineNumbers&&(d.debugInfo=A(o,s,t)),d}y()},font:function(){var e=[],t=[],n,r,s,o;while(o=E(this.shorthand)||E(this.entity))t.push(o);e.push(new i.Expression(t));if(E(","))while(o=E(this.expression)){e.push(o);if(!E(","))break}return new i.Value(e)},value:function(){var e,t=[],n;while(e=E(this.expression)){t.push(e);if(!E(","))break}if(t.length>0)return new i.Value(t)},important:function(){if(s.charAt(o)==="!")return E(/^! *important/)},sub:function(){var e;if(E("(")&&(e=E(this.expression))&&E(")"))return e},multiplication:function(){var e,t,n,r;if(e=E(this.operand)){while(!N(/^\/[*\/]/)&&(n=E("/")||E("*"))&&(t=E(this.operand)))r=new i.Operation(n,[r||e,t]);return r||e}},addition:function(){var e,t,n,r;if(e=E(this.multiplication)){while((n=E(/^[-+]\s+/)||!w(s.charAt(o-1))&&(E("+")||E("-")))&&(t=E(this.multiplication)))r=new i.Operation(n,[r||e,t]);return r||e}},conditions:function(){var e,t,n=o,r;if(e=E(this.condition)){while(E(",")&&(t=E(this.condition)))r=new i.Condition("or",r||e,t,n);return r||e}},condition:function(){var e,t,n,r,s=o,u=!1;E(/^not/)&&(u=!0),x("(");if(e=E(this.addition)||E(this.entities.keyword)||E(this.entities.quoted))return(r=E(/^(?:>=|=<|[<=>])/))?(t=E(this.addition)||E(this.entities.keyword)||E(this.entities.quoted))?n=new i.Condition(r,e,t,s,u):T("expected expression"):n=new i.Condition("=",e,new i.Keyword("true"),s,u),x(")"),E(/^and/)?new i.Condition("and",n,E(this.condition)):n},operand:function(){var e,t=s.charAt(o+1);s.charAt(o)==="-"&&(t==="@"||t==="(")&&(e=E("-"));var n=E(this.sub)||E(this.entities.dimension)||E(this.entities.color)||E(this.entities.variable)||E(this.entities.call);return e?new i.Operation("*",[new i.Dimension(-1),n]):n},expression:function(){var e,t,n=[],r;while(e=E(this.addition)||E(this.entity))n.push(e);if(n.length>0)return new i.Expression(n)},property:function(){var e;if(e=E(/^(\*?-?[_a-z0-9-]+)\s*:/))return e[1]}}}};if(r.mode==="browser"||r.mode==="rhino")r.Parser.importer=function(e,t,n,r){!/^([a-z-]+:)?\//.test(e)&&t.length>0&&(e=t[0]+e),w({href:e,title:e,type:r.mime,contents:r.contents,files:r.files,rootpath:r.rootpath,entryPath:r.entryPath,relativeUrls:r.relativeUrls},function(e,i,s,o,u,a){e&&typeof r.errback=="function"?r.errback.call(null,a,t,n,r):n.call(null,e,i,a)},!0)};(function(e){function t(t){return e.functions.hsla(t.h,t.s,t.l,t.a)}function n(t,n){return t instanceof e.Dimension&&t.unit=="%"?parseFloat(t.value*n/100):r(t)}function r(t){if(t instanceof e.Dimension)return parseFloat(t.unit=="%"?t.value/100:t.value);if(typeof t=="number")return t;throw{error:"RuntimeError",message:"color functions take numbers as parameters"}}function i(e){return Math.min(1,Math.max(0,e))}e.functions={rgb:function(e,t,n){return this.rgba(e,t,n,1)},rgba:function(t,i,s,o){var u=[t,i,s].map(function(e){return n(e,256)});return o=r(o),new e.Color(u,o)},hsl:function(e,t,n){return this.hsla(e,t,n,1)},hsla:function(e,t,n,i){function u(e){return e=e<0?e+1:e>1?e-1:e,e*6<1?o+(s-o)*e*6:e*2<1?s:e*3<2?o+(s-o)*(2/3-e)*6:o}e=r(e)%360/360,t=r(t),n=r(n),i=r(i);var s=n<=.5?n*(t+1):n+t-n*t,o=n*2-s;return this.rgba(u(e+1/3)*255,u(e)*255,u(e-1/3)*255,i)},hsv:function(e,t,n){return this.hsva(e,t,n,1)},hsva:function(e,t,n,i){e=r(e)%360/360*360,t=r(t),n=r(n),i=r(i);var s,o;s=Math.floor(e/60%6),o=e/60-s;var u=[n,n*(1-t),n*(1-o*t),n*(1-(1-o)*t)],a=[[0,3,1],[2,0,1],[1,0,3],[1,2,0],[3,1,0],[0,1,2]];return this.rgba(u[a[s][0]]*255,u[a[s][1]]*255,u[a[s][2]]*255,i)},hue:function(t){return new e.Dimension(Math.round(t.toHSL().h))},saturation:function(t){return new e.Dimension(Math.round(t.toHSL().s*100),"%")},lightness:function(t){return new e.Dimension(Math.round(t.toHSL().l*100),"%")},red:function(t){return new e.Dimension(t.rgb[0])},green:function(t){return new e.Dimension(t.rgb[1])},blue:function(t){return new e.Dimension(t.rgb[2])},alpha:function(t){return new e.Dimension(t.toHSL().a)},luma:function(t){return new e.Dimension(Math.round((.2126*(t.rgb[0]/255)+.7152*(t.rgb[1]/255)+.0722*(t.rgb[2]/255))*t.alpha*100),"%")},saturate:function(e,n){var r=e.toHSL();return r.s+=n.value/100,r.s=i(r.s),t(r)},desaturate:function(e,n){var r=e.toHSL();return r.s-=n.value/100,r.s=i(r.s),t(r)},lighten:function(e,n){var r=e.toHSL();return r.l+=n.value/100,r.l=i(r.l),t(r)},darken:function(e,n){var r=e.toHSL();return r.l-=n.value/100,r.l=i(r.l),t(r)},fadein:function(e,n){var r=e.toHSL();return r.a+=n.value/100,r.a=i(r.a),t(r)},fadeout:function(e,n){var r=e.toHSL();return r.a-=n.value/100,r.a=i(r.a),t(r)},fade:function(e,n){var r=e.toHSL();return r.a=n.value/100,r.a=i(r.a),t(r)},spin:function(e,n){var r=e.toHSL(),i=(r.h+n.value)%360;return r.h=i<0?360+i:i,t(r)},mix:function(t,n,r){r||(r=new e.Dimension(50));var i=r.value/100,s=i*2-1,o=t.toHSL().a-n.toHSL().a,u=((s*o==-1?s:(s+o)/(1+s*o))+1)/2,a=1-u,f=[t.rgb[0]*u+n.rgb[0]*a,t.rgb[1]*u+n.rgb[1]*a,t.rgb[2]*u+n.rgb[2]*a],l=t.alpha*i+n.alpha*(1-i);return new e.Color(f,l)},greyscale:function(t){return this.desaturate(t,new e.Dimension(100))},contrast:function(e,t,n,r){return e.rgb?(typeof n=="undefined"&&(n=this.rgba(255,255,255,1)),typeof t=="undefined"&&(t=this.rgba(0,0,0,1)),typeof r=="undefined"?r=.43:r=r.value,(.2126*(e.rgb[0]/255)+.7152*(e.rgb[1]/255)+.0722*(e.rgb[2]/255))*e.alpha<r?n:t):null},e:function(t){return new e.Anonymous(t instanceof e.JavaScript?t.evaluated:t)},escape:function(t){return new e.Anonymous(encodeURI(t.value).replace(/=/g,"%3D").replace(/:/g,"%3A").replace(/#/g,"%23").replace(/;/g,"%3B").replace(/\(/g,"%28").replace(/\)/g,"%29"))},"%":function(t){var n=Array.prototype.slice.call(arguments,1),r=t.value;for(var i=0;i<n.length;i++)r=r.replace(/%[sda]/i,function(e){var t=e.match(/s/i)?n[i].value:n[i].toCSS();return e.match(/[A-Z]$/)?encodeURIComponent(t):t});return r=r.replace(/%%/g,"%"),new e.Quoted('"'+r+'"',r)},unit:function(t,n){return new e.Dimension(t.value,n?n.toCSS():"")},round:function(e,t){var n=typeof t=="undefined"?0:t.value;return this._math(function(e){return e.toFixed(n)},e)},ceil:function(e){return this._math(Math.ceil,e)},floor:function(e){return this._math(Math.floor,e)},_math:function(t,n){if(n instanceof e.Dimension)return new e.Dimension(t(parseFloat(n.value)),n.unit);if(typeof n=="number")return t(n);throw{type:"Argument",message:"argument must be a number"}},argb:function(t){return new e.Anonymous(t.toARGB())},percentage:function(t){return new e.Dimension(t.value*100,"%")},color:function(t){if(t instanceof e.Quoted)return new e.Color(t.value.slice(1));throw{type:"Argument",message:"argument must be a string"}},iscolor:function(t){return this._isa(t,e.Color)},isnumber:function(t){return this._isa(t,e.Dimension)},isstring:function(t){return this._isa(t,e.Quoted)},iskeyword:function(t){return this._isa(t,e.Keyword)},isurl:function(t){return this._isa(t,e.URL)},ispixel:function(t){return t instanceof e.Dimension&&t.unit==="px"?e.True:e.False},ispercentage:function(t){return t instanceof e.Dimension&&t.unit==="%"?e.True:e.False},isem:function(t){return t instanceof e.Dimension&&t.unit==="em"?e.True:e.False},_isa:function(t,n){return t instanceof n?e.True:e.False},multiply:function(e,t){var n=e.rgb[0]*t.rgb[0]/255,r=e.rgb[1]*t.rgb[1]/255,i=e.rgb[2]*t.rgb[2]/255;return this.rgb(n,r,i)},screen:function(e,t){var n=255-(255-e.rgb[0])*(255-t.rgb[0])/255,r=255-(255-e.rgb[1])*(255-t.rgb[1])/255,i=255-(255-e.rgb[2])*(255-t.rgb[2])/255;return this.rgb(n,r,i)},overlay:function(e,t){var n=e.rgb[0]<128?2*e.rgb[0]*t.rgb[0]/255:255-2*(255-e.rgb[0])*(255-t.rgb[0])/255,r=e.rgb[1]<128?2*e.rgb[1]*t.rgb[1]/255:255-2*(255-e.rgb[1])*(255-t.rgb[1])/255,i=e.rgb[2]<128?2*e.rgb[2]*t.rgb[2]/255:255-2*(255-e.rgb[2])*(255-t.rgb[2])/255;return this.rgb(n,r,i)},softlight:function(e,t){var n=t.rgb[0]*e.rgb[0]/255,r=n+e.rgb[0]*(255-(255-e.rgb[0])*(255-t.rgb[0])/255-n)/255;n=t.rgb[1]*e.rgb[1]/255;var i=n+e.rgb[1]*(255-(255-e.rgb[1])*(255-t.rgb[1])/255-n)/255;n=t.rgb[2]*e.rgb[2]/255;var s=n+e.rgb[2]*(255-(255-e.rgb[2])*(255-t.rgb[2])/255-n)/255;return this.rgb(r,i,s)},hardlight:function(e,t){var n=t.rgb[0]<128?2*t.rgb[0]*e.rgb[0]/255:255-2*(255-t.rgb[0])*(255-e.rgb[0])/255,r=t.rgb[1]<128?2*t.rgb[1]*e.rgb[1]/255:255-2*(255-t.rgb[1])*(255-e.rgb[1])/255,i=t.rgb[2]<128?2*t.rgb[2]*e.rgb[2]/255:255-2*(255-t.rgb[2])*(255-e.rgb[2])/255;return this.rgb(n,r,i)},difference:function(e,t){var n=Math.abs(e.rgb[0]-t.rgb[0]),r=Math.abs(e.rgb[1]-t.rgb[1]),i=Math.abs(e.rgb[2]-t.rgb[2]);return this.rgb(n,r,i)},exclusion:function(e,t){var n=e.rgb[0]+t.rgb[0]*(255-e.rgb[0]-e.rgb[0])/255,r=e.rgb[1]+t.rgb[1]*(255-e.rgb[1]-e.rgb[1])/255,i=e.rgb[2]+t.rgb[2]*(255-e.rgb[2]-e.rgb[2])/255;return this.rgb(n,r,i)},average:function(e,t){var n=(e.rgb[0]+t.rgb[0])/2,r=(e.rgb[1]+t.rgb[1])/2,i=(e.rgb[2]+t.rgb[2])/2;return this.rgb(n,r,i)},negation:function(e,t){var n=255-Math.abs(255-t.rgb[0]-e.rgb[0]),r=255-Math.abs(255-t.rgb[1]-e.rgb[1]),i=255-Math.abs(255-t.rgb[2]-e.rgb[2]);return this.rgb(n,r,i)},tint:function(e,t){return this.mix(this.rgb(255,255,255),e,t)},shade:function(e,t){return this.mix(this.rgb(0,0,0),e,t)}}})(n("./tree")),function(e){e.colors={aliceblue:"#f0f8ff",antiquewhite:"#faebd7",aqua:"#00ffff",aquamarine:"#7fffd4",azure:"#f0ffff",beige:"#f5f5dc",bisque:"#ffe4c4",black:"#000000",blanchedalmond:"#ffebcd",blue:"#0000ff",blueviolet:"#8a2be2",brown:"#a52a2a",burlywood:"#deb887",cadetblue:"#5f9ea0",chartreuse:"#7fff00",chocolate:"#d2691e",coral:"#ff7f50",cornflowerblue:"#6495ed",cornsilk:"#fff8dc",crimson:"#dc143c",cyan:"#00ffff",darkblue:"#00008b",darkcyan:"#008b8b",darkgoldenrod:"#b8860b",darkgray:"#a9a9a9",darkgrey:"#a9a9a9",darkgreen:"#006400",darkkhaki:"#bdb76b",darkmagenta:"#8b008b",darkolivegreen:"#556b2f",darkorange:"#ff8c00",darkorchid:"#9932cc",darkred:"#8b0000",darksalmon:"#e9967a",darkseagreen:"#8fbc8f",darkslateblue:"#483d8b",darkslategray:"#2f4f4f",darkslategrey:"#2f4f4f",darkturquoise:"#00ced1",darkviolet:"#9400d3",deeppink:"#ff1493",deepskyblue:"#00bfff",dimgray:"#696969",dimgrey:"#696969",dodgerblue:"#1e90ff",firebrick:"#b22222",floralwhite:"#fffaf0",forestgreen:"#228b22",fuchsia:"#ff00ff",gainsboro:"#dcdcdc",ghostwhite:"#f8f8ff",gold:"#ffd700",goldenrod:"#daa520",gray:"#808080",grey:"#808080",green:"#008000",greenyellow:"#adff2f",honeydew:"#f0fff0",hotpink:"#ff69b4",indianred:"#cd5c5c",indigo:"#4b0082",ivory:"#fffff0",khaki:"#f0e68c",lavender:"#e6e6fa",lavenderblush:"#fff0f5",lawngreen:"#7cfc00",lemonchiffon:"#fffacd",lightblue:"#add8e6",lightcoral:"#f08080",lightcyan:"#e0ffff",lightgoldenrodyellow:"#fafad2",lightgray:"#d3d3d3",lightgrey:"#d3d3d3",lightgreen:"#90ee90",lightpink:"#ffb6c1",lightsalmon:"#ffa07a",lightseagreen:"#20b2aa",lightskyblue:"#87cefa",lightslategray:"#778899",lightslategrey:"#778899",lightsteelblue:"#b0c4de",lightyellow:"#ffffe0",lime:"#00ff00",limegreen:"#32cd32",linen:"#faf0e6",magenta:"#ff00ff",maroon:"#800000",mediumaquamarine:"#66cdaa",mediumblue:"#0000cd",mediumorchid:"#ba55d3",mediumpurple:"#9370d8",mediumseagreen:"#3cb371",mediumslateblue:"#7b68ee",mediumspringgreen:"#00fa9a",mediumturquoise:"#48d1cc",mediumvioletred:"#c71585",midnightblue:"#191970",mintcream:"#f5fffa",mistyrose:"#ffe4e1",moccasin:"#ffe4b5",navajowhite:"#ffdead",navy:"#000080",oldlace:"#fdf5e6",olive:"#808000",olivedrab:"#6b8e23",orange:"#ffa500",orangered:"#ff4500",orchid:"#da70d6",palegoldenrod:"#eee8aa",palegreen:"#98fb98",paleturquoise:"#afeeee",palevioletred:"#d87093",papayawhip:"#ffefd5",peachpuff:"#ffdab9",peru:"#cd853f",pink:"#ffc0cb",plum:"#dda0dd",powderblue:"#b0e0e6",purple:"#800080",red:"#ff0000",rosybrown:"#bc8f8f",royalblue:"#4169e1",saddlebrown:"#8b4513",salmon:"#fa8072",sandybrown:"#f4a460",seagreen:"#2e8b57",seashell:"#fff5ee",sienna:"#a0522d",silver:"#c0c0c0",skyblue:"#87ceeb",slateblue:"#6a5acd",slategray:"#708090",slategrey:"#708090",snow:"#fffafa",springgreen:"#00ff7f",steelblue:"#4682b4",tan:"#d2b48c",teal:"#008080",thistle:"#d8bfd8",tomato:"#ff6347",turquoise:"#40e0d0",violet:"#ee82ee",wheat:"#f5deb3",white:"#ffffff",whitesmoke:"#f5f5f5",yellow:"#ffff00",yellowgreen
+:"#9acd32"}}(n("./tree")),function(e){e.Alpha=function(e){this.value=e},e.Alpha.prototype={toCSS:function(){return"alpha(opacity="+(this.value.toCSS?this.value.toCSS():this.value)+")"},eval:function(e){return this.value.eval&&(this.value=this.value.eval(e)),this}}}(n("../tree")),function(e){e.Anonymous=function(e){this.value=e.value||e},e.Anonymous.prototype={toCSS:function(){return this.value},eval:function(){return this},compare:function(e){if(!e.toCSS)return-1;var t=this.toCSS(),n=e.toCSS();return t===n?0:t<n?-1:1}}}(n("../tree")),function(e){e.Assignment=function(e,t){this.key=e,this.value=t},e.Assignment.prototype={toCSS:function(){return this.key+"="+(this.value.toCSS?this.value.toCSS():this.value)},eval:function(t){return this.value.eval?new e.Assignment(this.key,this.value.eval(t)):this}}}(n("../tree")),function(e){e.Call=function(e,t,n,r){this.name=e,this.args=t,this.index=n,this.filename=r},e.Call.prototype={eval:function(t){var n=this.args.map(function(e){return e.eval(t)}),r;if(this.name in e.functions)try{r=e.functions[this.name].apply(e.functions,n);if(r!=null)return r}catch(i){throw{type:i.type||"Runtime",message:"error evaluating function `"+this.name+"`"+(i.message?": "+i.message:""),index:this.index,filename:this.filename}}return new e.Anonymous(this.name+"("+n.map(function(e){return e.toCSS(t)}).join(", ")+")")},toCSS:function(e){return this.eval(e).toCSS()}}}(n("../tree")),function(e){e.Color=function(e,t){Array.isArray(e)?this.rgb=e:e.length==6?this.rgb=e.match(/.{2}/g).map(function(e){return parseInt(e,16)}):this.rgb=e.split("").map(function(e){return parseInt(e+e,16)}),this.alpha=typeof t=="number"?t:1},e.Color.prototype={eval:function(){return this},toCSS:function(){return this.alpha<1?"rgba("+this.rgb.map(function(e){return Math.round(e)}).concat(this.alpha).join(", ")+")":"#"+this.rgb.map(function(e){return e=Math.round(e),e=(e>255?255:e<0?0:e).toString(16),e.length===1?"0"+e:e}).join("")},operate:function(t,n){var r=[];n instanceof e.Color||(n=n.toColor());for(var i=0;i<3;i++)r[i]=e.operate(t,this.rgb[i],n.rgb[i]);return new e.Color(r,this.alpha+n.alpha)},toHSL:function(){var e=this.rgb[0]/255,t=this.rgb[1]/255,n=this.rgb[2]/255,r=this.alpha,i=Math.max(e,t,n),s=Math.min(e,t,n),o,u,a=(i+s)/2,f=i-s;if(i===s)o=u=0;else{u=a>.5?f/(2-i-s):f/(i+s);switch(i){case e:o=(t-n)/f+(t<n?6:0);break;case t:o=(n-e)/f+2;break;case n:o=(e-t)/f+4}o/=6}return{h:o*360,s:u,l:a,a:r}},toARGB:function(){var e=[Math.round(this.alpha*255)].concat(this.rgb);return"#"+e.map(function(e){return e=Math.round(e),e=(e>255?255:e<0?0:e).toString(16),e.length===1?"0"+e:e}).join("")},compare:function(e){return e.rgb?e.rgb[0]===this.rgb[0]&&e.rgb[1]===this.rgb[1]&&e.rgb[2]===this.rgb[2]&&e.alpha===this.alpha?0:-1:-1}}}(n("../tree")),function(e){e.Comment=function(e,t){this.value=e,this.silent=!!t},e.Comment.prototype={toCSS:function(e){return e.compress?"":this.value},eval:function(){return this}}}(n("../tree")),function(e){e.Condition=function(e,t,n,r,i){this.op=e.trim(),this.lvalue=t,this.rvalue=n,this.index=r,this.negate=i},e.Condition.prototype.eval=function(e){var t=this.lvalue.eval(e),n=this.rvalue.eval(e),r=this.index,i,i=function(e){switch(e){case"and":return t&&n;case"or":return t||n;default:if(t.compare)i=t.compare(n);else{if(!n.compare)throw{type:"Type",message:"Unable to perform comparison",index:r};i=n.compare(t)}switch(i){case-1:return e==="<"||e==="=<";case 0:return e==="="||e===">="||e==="=<";case 1:return e===">"||e===">="}}}(this.op);return this.negate?!i:i}}(n("../tree")),function(e){e.Dimension=function(e,t){this.value=parseFloat(e),this.unit=t||null},e.Dimension.prototype={eval:function(){return this},toColor:function(){return new e.Color([this.value,this.value,this.value])},toCSS:function(){var e=this.value+this.unit;return e},operate:function(t,n){return new e.Dimension(e.operate(t,this.value,n.value),this.unit||n.unit)},compare:function(t){return t instanceof e.Dimension?t.value>this.value?-1:t.value<this.value?1:t.unit&&this.unit!==t.unit?-1:0:-1}}}(n("../tree")),function(e){e.Directive=function(t,n){this.name=t,Array.isArray(n)?(this.ruleset=new e.Ruleset([],n),this.ruleset.allowImports=!0):this.value=n},e.Directive.prototype={toCSS:function(e,t){return this.ruleset?(this.ruleset.root=!0,this.name+(t.compress?"{":" {\n ")+this.ruleset.toCSS(e,t).trim().replace(/\n/g,"\n ")+(t.compress?"}":"\n}\n")):this.name+" "+this.value.toCSS()+";\n"},eval:function(t){var n=this;return this.ruleset&&(t.frames.unshift(this),n=new e.Directive(this.name),n.ruleset=this.ruleset.eval(t),t.frames.shift()),n},variable:function(t){return e.Ruleset.prototype.variable.call(this.ruleset,t)},find:function(){return e.Ruleset.prototype.find.apply(this.ruleset,arguments)},rulesets:function(){return e.Ruleset.prototype.rulesets.apply(this.ruleset)}}}(n("../tree")),function(e){e.Element=function(t,n,r){this.combinator=t instanceof e.Combinator?t:new e.Combinator(t),typeof n=="string"?this.value=n.trim():n?this.value=n:this.value="",this.index=r},e.Element.prototype.eval=function(t){return new e.Element(this.combinator,this.value.eval?this.value.eval(t):this.value,this.index)},e.Element.prototype.toCSS=function(e){var t=this.value.toCSS?this.value.toCSS(e):this.value;return t==""&&this.combinator.value.charAt(0)=="&"?"":this.combinator.toCSS(e||{})+t},e.Combinator=function(e){e===" "?this.value=" ":this.value=e?e.trim():""},e.Combinator.prototype.toCSS=function(e){return{"":""," ":" ",":":" :","+":e.compress?"+":" + ","~":e.compress?"~":" ~ ",">":e.compress?">":" > ","|":e.compress?"|":" | "}[this.value]}}(n("../tree")),function(e){e.Expression=function(e){this.value=e},e.Expression.prototype={eval:function(t){return this.value.length>1?new e.Expression(this.value.map(function(e){return e.eval(t)})):this.value.length===1?this.value[0].eval(t):this},toCSS:function(e){return this.value.map(function(t){return t.toCSS?t.toCSS(e):""}).join(" ")}}}(n("../tree")),function(e){e.Import=function(t,n,r,i,s,o){var u=this;this.once=i,this.index=s,this._path=t,this.features=r&&new e.Value(r),this.rootpath=o,t instanceof e.Quoted?this.path=/(\.[a-z]*$)|([\?;].*)$/.test(t.value)?t.value:t.value+".less":this.path=t.value.value||t.value,this.css=/css([\?;].*)?$/.test(this.path),this.css||n.push(this.path,function(t,n,r){t&&(t.index=s),r&&u.once&&(u.skip=r),u.root=n||new e.Ruleset([],[])})},e.Import.prototype={toCSS:function(e){var t=this.features?" "+this.features.toCSS(e):"";return this.css?(typeof this._path.value=="string"&&!/^(?:[a-z-]+:|\/)/.test(this._path.value)&&(this._path.value=this.rootpath+this._path.value),"@import "+this._path.toCSS()+t+";\n"):""},eval:function(t){var n,r=this.features&&this.features.eval(t);return this.skip?[]:this.css?this:(n=new e.Ruleset([],this.root.rules.slice(0)),n.evalImports(t),this.features?new e.Media(n.rules,this.features.value):n.rules)}}}(n("../tree")),function(e){e.JavaScript=function(e,t,n){this.escaped=n,this.expression=e,this.index=t},e.JavaScript.prototype={eval:function(t){var n,r=this,i={},s=this.expression.replace(/@\{([\w-]+)\}/g,function(n,i){return e.jsify((new e.Variable("@"+i,r.index)).eval(t))});try{s=new Function("return ("+s+")")}catch(o){throw{message:"JavaScript evaluation error: `"+s+"`",index:this.index}}for(var u in t.frames[0].variables())i[u.slice(1)]={value:t.frames[0].variables()[u].value,toJS:function(){return this.value.eval(t).toCSS()}};try{n=s.call(i)}catch(o){throw{message:"JavaScript evaluation error: '"+o.name+": "+o.message+"'",index:this.index}}return typeof n=="string"?new e.Quoted('"'+n+'"',n,this.escaped,this.index):Array.isArray(n)?new e.Anonymous(n.join(", ")):new e.Anonymous(n)}}}(n("../tree")),function(e){e.Keyword=function(e){this.value=e},e.Keyword.prototype={eval:function(){return this},toCSS:function(){return this.value},compare:function(t){return t instanceof e.Keyword?t.value===this.value?0:1:-1}},e.True=new e.Keyword("true"),e.False=new e.Keyword("false")}(n("../tree")),function(e){e.Media=function(t,n){var r=this.emptySelectors();this.features=new e.Value(n),this.ruleset=new e.Ruleset(r,t),this.ruleset.allowImports=!0},e.Media.prototype={toCSS:function(e,t){var n=this.features.toCSS(t);return this.ruleset.root=e.length===0||e[0].multiMedia,"@media "+n+(t.compress?"{":" {\n ")+this.ruleset.toCSS(e,t).trim().replace(/\n/g,"\n ")+(t.compress?"}":"\n}\n")},eval:function(t){t.mediaBlocks||(t.mediaBlocks=[],t.mediaPath=[]);var n=new e.Media([],[]);return this.debugInfo&&(this.ruleset.debugInfo=this.debugInfo,n.debugInfo=this.debugInfo),n.features=this.features.eval(t),t.mediaPath.push(n),t.mediaBlocks.push(n),t.frames.unshift(this.ruleset),n.ruleset=this.ruleset.eval(t),t.frames.shift(),t.mediaPath.pop(),t.mediaPath.length===0?n.evalTop(t):n.evalNested(t)},variable:function(t){return e.Ruleset.prototype.variable.call(this.ruleset,t)},find:function(){return e.Ruleset.prototype.find.apply(this.ruleset,arguments)},rulesets:function(){return e.Ruleset.prototype.rulesets.apply(this.ruleset)},emptySelectors:function(){var t=new e.Element("","&",0);return[new e.Selector([t])]},evalTop:function(t){var n=this;if(t.mediaBlocks.length>1){var r=this.emptySelectors();n=new e.Ruleset(r,t.mediaBlocks),n.multiMedia=!0}return delete t.mediaBlocks,delete t.mediaPath,n},evalNested:function(t){var n,r,i=t.mediaPath.concat([this]);for(n=0;n<i.length;n++)r=i[n].features instanceof e.Value?i[n].features.value:i[n].features,i[n]=Array.isArray(r)?r:[r];return this.features=new e.Value(this.permute(i).map(function(t){t=t.map(function(t){return t.toCSS?t:new e.Anonymous(t)});for(n=t.length-1;n>0;n--)t.splice(n,0,new e.Anonymous("and"));return new e.Expression(t)})),new e.Ruleset([],[])},permute:function(e){if(e.length===0)return[];if(e.length===1)return e[0];var t=[],n=this.permute(e.slice(1));for(var r=0;r<n.length;r++)for(var i=0;i<e[0].length;i++)t.push([e[0][i]].concat(n[r]));return t},bubbleSelectors:function(t){this.ruleset=new e.Ruleset(t.slice(0),[this.ruleset])}}}(n("../tree")),function(e){e.mixin={},e.mixin.Call=function(t,n,r,i,s){this.selector=new e.Selector(t),this.arguments=n,this.index=r,this.filename=i,this.important=s},e.mixin.Call.prototype={eval:function(t){var n,r,i,s=[],o=!1,u,a,f,l,c;i=this.arguments&&this.arguments.map(function(e){return{name:e.name,value:e.value.eval(t)}});for(u=0;u<t.frames.length;u++)if((n=t.frames[u].find(this.selector)).length>0){c=!0;for(a=0;a<n.length;a++){r=n[a],l=!1;for(f=0;f<t.frames.length;f++)if(!(r instanceof e.mixin.Definition)&&r===(t.frames[f].originalRuleset||t.frames[f])){l=!0;break}if(l)continue;if(r.matchArgs(i,t)){if(!r.matchCondition||r.matchCondition(i,t))try{Array.prototype.push.apply(s,r.eval(t,i,this.important).rules)}catch(h){throw{message:h.message,index:this.index,filename:this.filename,stack:h.stack}}o=!0}}if(o)return s}throw c?{type:"Runtime",message:"No matching definition was found for `"+this.selector.toCSS().trim()+"("+(i?i.map(function(e){var t="";return e.name&&(t+=e.name+":"),e.value.toCSS?t+=e.value.toCSS():t+="???",t}).join(", "):"")+")`",index:this.index,filename:this.filename}:{type:"Name",message:this.selector.toCSS().trim()+" is undefined",index:this.index,filename:this.filename}}},e.mixin.Definition=function(t,n,r,i,s){this.name=t,this.selectors=[new e.Selector([new e.Element(null,t)])],this.params=n,this.condition=i,this.variadic=s,this.arity=n.length,this.rules=r,this._lookups={},this.required=n.reduce(function(e,t){return!t.name||t.name&&!t.value?e+1:e},0),this.parent=e.Ruleset.prototype,this.frames=[]},e.mixin.Definition.prototype={toCSS:function(){return""},variable:function(e){return this.parent.variable.call(this,e)},variables:function(){return this.parent.variables.call(this)},find:function(){return this.parent.find.apply(this,arguments)},rulesets:function(){return this.parent.rulesets.apply(this)},evalParams:function(t,n,r,i){var s=new e.Ruleset(null,[]),o,u,a=this.params.slice(0),f,l,c,h,p,d;if(r){r=r.slice(0);for(f=0;f<r.length;f++){u=r[f];if(h=u&&u.name){p=!1;for(l=0;l<a.length;l++)if(!i[l]&&h===a[l].name){i[l]=u.value.eval(t),s.rules.unshift(new e.Rule(h,u.value.eval(t))),p=!0;break}if(p){r.splice(f,1),f--;continue}throw{type:"Runtime",message:"Named argument for "+this.name+" "+r[f].name+" not found"}}}}d=0;for(f=0;f<a.length;f++){if(i[f])continue;u=r&&r[d];if(h=a[f].name)if(a[f].variadic&&r){o=[];for(l=d;l<r.length;l++)o.push(r[l].value.eval(t));s.rules.unshift(new e.Rule(h,(new e.Expression(o)).eval(t)))}else{c=u&&u.value;if(c)c=c.eval(t);else{if(!a[f].value)throw{type:"Runtime",message:"wrong number of arguments for "+this.name+" ("+r.length+" for "+this.arity+")"};c=a[f].value.eval(n)}s.rules.unshift(new e.Rule(h,c)),i[f]=c}if(a[f].variadic&&r)for(l=d;l<r.length;l++)i[l]=r[l].value.eval(t);d++}return s},eval:function(t,n,r){var i=[],s=this.frames.concat(t.frames),o=this.evalParams(t,{frames:s},n,i),u,a,f,l;return o.rules.unshift(new e.Rule("@arguments",(new e.Expression(i)).eval(t))),a=r?this.parent.makeImportant.apply(this).rules:this.rules.slice(0),l=(new e.Ruleset(null,a)).eval({frames:[this,o].concat(s)}),l.originalRuleset=this,l},matchCondition:function(e,t){return this.condition&&!this.condition.eval({frames:[this.evalParams(t,{frames:this.frames.concat(t.frames)},e,[])].concat(t.frames)})?!1:!0},matchArgs:function(e,t){var n=e&&e.length||0,r,i;if(!this.variadic){if(n<this.required)return!1;if(n>this.params.length)return!1;if(this.required>0&&n>this.params.length)return!1}r=Math.min(n,this.arity);for(var s=0;s<r;s++)if(!this.params[s].name&&!this.params[s].variadic&&e[s].value.eval(t).toCSS()!=this.params[s].value.eval(t).toCSS())return!1;return!0}}}(n("../tree")),function(e){e.Operation=function(e,t){this.op=e.trim(),this.operands=t},e.Operation.prototype.eval=function(t){var n=this.operands[0].eval(t),r=this.operands[1].eval(t),i;if(n instanceof e.Dimension&&r instanceof e.Color){if(this.op!=="*"&&this.op!=="+")throw{name:"OperationError",message:"Can't substract or divide a color from a number"};i=r,r=n,n=i}if(!n.operate)throw{name:"OperationError",message:"Operation on an invalid type"};return n.operate(this.op,r)},e.operate=function(e,t,n){switch(e){case"+":return t+n;case"-":return t-n;case"*":return t*n;case"/":return t/n}}}(n("../tree")),function(e){e.Paren=function(e){this.value=e},e.Paren.prototype={toCSS:function(e){return"("+this.value.toCSS(e)+")"},eval:function(t){return new e.Paren(this.value.eval(t))}}}(n("../tree")),function(e){e.Quoted=function(e,t,n,r){this.escaped=n,this.value=t||"",this.quote=e.charAt(0),this.index=r},e.Quoted.prototype={toCSS:function(){return this.escaped?this.value:this.quote+this.value+this.quote},eval:function(t){var n=this,r=this.value.replace(/`([^`]+)`/g,function(r,i){return(new e.JavaScript(i,n.index,!0)).eval(t).value}).replace(/@\{([\w-]+)\}/g,function(r,i){var s=(new e.Variable("@"+i,n.index)).eval(t);return s instanceof e.Quoted?s.value:s.toCSS()});return new e.Quoted(this.quote+r+this.quote,r,this.escaped,this.index)},compare:function(e){if(!e.toCSS)return-1;var t=this.toCSS(),n=e.toCSS();return t===n?0:t<n?-1:1}}}(n("../tree")),function(e){e.Ratio=function(e){this.value=e},e.Ratio.prototype={toCSS:function(e){return this.value},eval:function(){return this}}}(n("../tree")),function(e){e.Rule=function(t,n,r,i,s){this.name=t,this.value=n instanceof e.Value?n:new e.Value([n]),this.important=r?" "+r.trim():"",this.index=i,this.inline=s||!1,t.charAt(0)==="@"?this.variable=!0:this.variable=!1},e.Rule.prototype.toCSS=function(e){return this.variable?"":this.name+(e.compress?":":": ")+this.value.toCSS(e)+this.important+(this.inline?"":";")},e.Rule.prototype.eval=function(t){return new e.Rule(this.name,this.value.eval(t),this.important,this.index,this.inline)},e.Rule.prototype.makeImportant=function(){return new e.Rule(this.name,this.value,"!important",this.index,this.inline)},e.Shorthand=function(e,t){this.a=e,this.b=t},e.Shorthand.prototype={toCSS:function(e){return this.a.toCSS(e)+"/"+this.b.toCSS(e)},eval:function(){return this}}}(n("../tree")),function(e){e.Ruleset=function(e,t,n){this.selectors=e,this.rules=t,this._lookups={},this.strictImports=n},e.Ruleset.prototype={eval:function(t){var n=this.selectors&&this.selectors.map(function(e){return e.eval(t)}),r=new e.Ruleset(n,this.rules.slice(0),this.strictImports),i;r.originalRuleset=this,r.root=this.root,r.allowImports=this.allowImports,this.debugInfo&&(r.debugInfo=this.debugInfo),t.frames.unshift(r),(r.root||r.allowImports||!r.strictImports)&&r.evalImports(t);for(var s=0;s<r.rules.length;s++)r.rules[s]instanceof e.mixin.Definition&&(r.rules[s].frames=t.frames.slice(0));var o=t.mediaBlocks&&t.mediaBlocks.length||0;for(var s=0;s<r.rules.length;s++)r.rules[s]instanceof e.mixin.Call&&(i=r.rules[s].eval(t),r.rules.splice.apply(r.rules,[s,1].concat(i)),s+=i.length-1,r.resetCache());for(var s=0,u;s<r.rules.length;s++)u=r.rules[s],u instanceof e.mixin.Definition||(r.rules[s]=u.eval?u.eval(t):u);t.frames.shift();if(t.mediaBlocks)for(var s=o;s<t.mediaBlocks.length;s++)t.mediaBlocks[s].bubbleSelectors(n);return r},evalImports:function(t){var n,r;for(n=0;n<this.rules.length;n++)this.rules[n]instanceof e.Import&&(r=this.rules[n].eval(t),typeof r.length=="number"?(this.rules.splice.apply(this.rules,[n,1].concat(r)),n+=r.length-1):this.rules.splice(n,1,r),this.resetCache())},makeImportant:function(){return new e.Ruleset(this.selectors,this.rules.map(function(e){return e.makeImportant?e.makeImportant():e}),this.strictImports)},matchArgs:function(e){return!e||e.length===0},resetCache:function(){this._rulesets=null,this._variables=null,this._lookups={}},variables:function(){return this._variables?this._variables:this._variables=this.rules.reduce(function(t,n){return n instanceof e.Rule&&n.variable===!0&&(t[n.name]=n),t},{})},variable:function(e){return this.variables()[e]},rulesets:function(){return this._rulesets?this._rulesets:this._rulesets=this.rules.filter(function(t){return t instanceof e.Ruleset||t instanceof e.mixin.Definition})},find:function(t,n){n=n||this;var r=[],i,s,o=t.toCSS();return o in this._lookups?this._lookups[o]:(this.rulesets().forEach(function(i){if(i!==n)for(var o=0;o<i.selectors.length;o++)if(s=t.match(i.selectors[o])){t.elements.length>i.selectors[o].elements.length?Array.prototype.push.apply(r,i.find(new e.Selector(t.elements.slice(1)),n)):r.push(i);break}}),this._lookups[o]=r)},toCSS:function(t,n){var r=[],i=[],s=[],o=[],u=[],a,f,l;this.root||this.joinSelectors(u,t,this.selectors);for(var c=0;c<this.rules.length;c++){l=this.rules[c];if(l.rules||l instanceof e.Media)o.push(l.toCSS(u,n));else if(l instanceof e.Directive){var h=l.toCSS(u,n);if(l.name==="@charset"){if(n.charset){l.debugInfo&&(o.push(e.debugInfo(n,l)),o.push((new e.Comment("/* "+h.replace(/\n/g,"")+" */\n")).toCSS(n)));continue}n.charset=!0}o.push(h)}else l instanceof e.Comment?l.silent||(this.root?o.push(l.toCSS(n)):i.push(l.toCSS(n))):l.toCSS&&!l.variable?i.push(l.toCSS(n)):l.value&&!l.variable&&i.push(l.value.toString())}o=o.join("");if(this.root)r.push(i.join(n.compress?"":"\n"));else if(i.length>0){f=e.debugInfo(n,this),a=u.map(function(e){return e.map(function(e){return e.toCSS(n)}).join("").trim()}).join(n.compress?",":",\n");for(var c=i.length-1;c>=0;c--)s.indexOf(i[c])===-1&&s.unshift(i[c]);i=s,r.push(f+a+(n.compress?"{":" {\n ")+i.join(n.compress?"":"\n ")+(n.compress?"}":"\n}\n"))}return r.push(o),r.join("")+(n.compress?"\n":"")},joinSelectors:function(e,t,n){for(var r=0;r<n.length;r++)this.joinSelector(e,t,n[r])},joinSelector:function(t,n,r){var i,s,o,u,a,f,l,c,h,p,d,v,m,g,y;for(i=0;i<r.elements.length;i++)f=r.elements[i],f.value==="&"&&(u=!0);if(!u){if(n.length>0)for(i=0;i<n.length;i++)t.push(n[i].concat(r));else t.push([r]);return}g=[],a=[[]];for(i=0;i<r.elements.length;i++){f=r.elements[i];if(f.value!=="&")g.push(f);else{y=[],g.length>0&&this.mergeElementsOnToSelectors(g,a);for(s=0;s<a.length;s++){l=a[s];if(n.length==0)l.length>0&&(l[0].elements=l[0].elements.slice(0),l[0].elements.push(new e.Element(f.combinator,"",0))),y.push(l);else for(o=0;o<n.length;o++)c=n[o],h=[],p=[],v=!0,l.length>0?(h=l.slice(0),m=h.pop(),d=new e.Selector(m.elements.slice(0)),v=!1):d=new e.Selector([]),c.length>1&&(p=p.concat(c.slice(1))),c.length>0&&(v=!1,d.elements.push(new e.Element(f.combinator,c[0].elements[0].value,0)),d.elements=d.elements.concat(c[0].elements.slice(1))),v||h.push(d),h=h.concat(p),y.push(h)}a=y,g=[]}}g.length>0&&this.mergeElementsOnToSelectors(g,a);for(i=0;i<a.length;i++)t.push(a[i])},mergeElementsOnToSelectors:function(t,n){var r,i;if(n.length==0){n.push([new e.Selector(t)]);return}for(r=0;r<n.length;r++)i=n[r],i.length>0?i[i.length-1]=new e.Selector(i[i.length-1].elements.concat(t)):i.push(new e.Selector(t))}}}(n("../tree")),function(e){e.Selector=function(e){this.elements=e},e.Selector.prototype.match=function(e){var t=this.elements,n=t.length,r,i,s,o;r=e.elements.slice(e.elements.length&&e.elements[0].value==="&"?1:0),i=r.length,s=Math.min(n,i);if(i===0||n<i)return!1;for(o=0;o<s;o++)if(t[o].value!==r[o].value)return!1;return!0},e.Selector.prototype.eval=function(t){return new e.Selector(this.elements.map(function(e){return e.eval(t)}))},e.Selector.prototype.toCSS=function(e){return this._css?this._css:(this.elements[0].combinator.value===""?this._css=" ":this._css="",this._css+=this.elements.map(function(t){return typeof t=="string"?" "+t.trim():t.toCSS(e)}).join(""),this._css)}}(n("../tree")),function(e){e.UnicodeDescriptor=function(e){this.value=e},e.UnicodeDescriptor.prototype={toCSS:function(e){return this.value},eval:function(){return this}}}(n("../tree")),function(e){e.URL=function(e,t){this.value=e,this.rootpath=t},e.URL.prototype={toCSS:function(){return"url("+this.value.toCSS()+")"},eval:function(t){var n=this.value.eval(t),r;return typeof n.value=="string"&&!/^(?:[a-z-]+:|\/)/.test(n.value)&&(r=this.rootpath,n.quote||(r=r.replace(/[\(\)'"\s]/g,function(e){return"\\"+e})),n.value=r+n.value),new e.URL(n,this.rootpath)}}}(n("../tree")),function(e){e.Value=function(e){this.value=e,this.is="value"},e.Value.prototype={eval:function(t){return this.value.length===1?this.value[0].eval(t):new e.Value(this.value.map(function(e){return e.eval(t)}))},toCSS:function(e){return this.value.map(function(t){return t.toCSS(e)}).join(e.compress?",":", ")}}}(n("../tree")),function(e){e.Variable=function(e,t,n){this.name=e,this.index=t,this.file=n},e.Variable.prototype={eval:function(t){var n,r,i=this.name;i.indexOf("@@")==0&&(i="@"+(new e.Variable(i.slice(1))).eval(t).value);if(this.evaluating)throw{type:"Name",message:"Recursive variable definition for "+i,filename:this.file,index:this.index};this.evaluating=!0;if(n=e.find(t.frames,function(e){if(r=e.variable(i))return r.value.eval(t)}))return this.evaluating=!1,n;throw{type:"Name",message:"variable "+i+" is undefined",filename:this.file,index:this.index}}}}(n("../tree")),function(e){e.debugInfo=function(t,n){var r="";if(t.dumpLineNumbers&&!t.compress)switch(t.dumpLineNumbers){case"comments":r=e.debugInfo.asComment(n);break;case"mediaquery":r=e.debugInfo.asMediaQuery(n);break;case"all":r=e.debugInfo.asComment(n)+e.debugInfo.asMediaQuery(n)}return r},e.debugInfo.asComment=function(e){return"/* line "+e.debugInfo.lineNumber+", "+e.debugInfo.fileName+" */\n"},e.debugInfo.asMediaQuery=function(e){return"@media -sass-debug-info{filename{font-family:"+("file://"+e.debugInfo.fileName).replace(/[\/:.]/g,"\\$&")+"}line{font-family:\\00003"+e.debugInfo.lineNumber+"}}\n"},e.find=function(e,t){for(var n=0,r;n<e.length;n++)if(r=t.call(e,e[n]))return r;return null},e.jsify=function(e){return Array.isArray(e.value)&&e.value.length>1?"["+e.value.map(function(e){return e.toCSS(!1)}).join(", ")+"]":e.toCSS(!1)}}(n("./tree"));var o=/^(file|chrome(-extension)?|resource|qrc|app):/.test(location.protocol);r.env=r.env||(location.hostname=="127.0.0.1"||location.hostname=="0.0.0.0"||location.hostname=="localhost"||location.port.length>0||o?"development":"production"),r.async=r.async||!1,r.fileAsync=r.fileAsync||!1,r.poll=r.poll||(o?1e3:1500);if(r.functions)for(var u in r.functions)r.tree.functions[u]=r.functions[u];var a=/!dumpLineNumbers:(comments|mediaquery|all)/.exec(location.hash);a&&(r.dumpLineNumbers=a[1]),r.watch=function(){return r.watchMode||(r.env="development",f()),this.watchMode=!0},r.unwatch=function(){return clearInterval(r.watchTimer),this.watchMode=!1},/!watch/.test(location.hash)&&r.watch();var l=null;if(r.env!="development")try{l=typeof e.localStorage=="undefined"?null:e.localStorage}catch(c){}var h=document.getElementsByTagName("link"),p=/^text\/(x-)?less$/;r.sheets=[];for(var d=0;d<h.length;d++)(h[d].rel==="stylesheet/less"||h[d].rel.match(/stylesheet/)&&h[d].type.match(p))&&r.sheets.push(h[d]);var v="";r.modifyVars=function(e){var t=v;for(name in e)t+=(name.slice(0,1)==="@"?"":"@")+name+": "+(e[name].slice(-1)===";"?e[name]:e[name]+";");(new r.Parser).parse(t,function(e,t){S(t.toCSS(),r.sheets[r.sheets.length-1])})},r.refresh=function(e){var t,n;t=n=new Date,g(function(e,r,i,s,o){o.local?C("loading "+s.href+" from cache."):(C("parsed "+s.href+" successfully."),S(r.toCSS(),s,o.lastModified)),C("css for "+s.href+" generated in "+(new Date-n)+"ms"),o.remaining===0&&C("css generated in "+(new Date-t)+"ms"),n=new Date},e),m()},r.refreshStyles=m,r.refresh(r.env==="development"),typeof define=="function"&&define.amd&&define("less",[],function(){return r})})(window);
\ No newline at end of file
--- /dev/null
+/** @license uglifyweb Copyright (c) 2011, The Dojo Foundation All Rights Reserved.
+ * The parts that are unique to this repo (not much, just some wrapper code) are
+ * released under the new BSD and MIT licenses.
+ *
+ * This file includes UglifyJS and some parts of es5-shim, both which have
+ * their own licenses:
+ *
+ * https://github.com/mishoo/UglifyJS (BSD)
+ * https://github.com/kriskowal/es5-shim (MIT)
+ *
+ * More info on the project: https://github.com/jrburke/uglifyweb
+ */
+
+(function(){var a=Object.prototype.toString,b="a"[0]!="a",c=function(a){if(a==null)throw new TypeError;return b&&typeof a=="string"&&a?a.split(""):Object(a)};Array.prototype.forEach||(Array.prototype.forEach=function(a){var b=c(this),d=arguments[1],e=0,f=b.length>>>0;while(e<f)e in b&&a.call(d,b[e],e,b),e++}),Array.prototype.reduce||(Array.prototype.reduce=function(a){var b=c(this),d=b.length>>>0;if(!d&&arguments.length==1)throw new TypeError;var e=0,f;if(arguments.length<2){do{if(e in b){f=b[e++];break}if(++e>=d)throw new TypeError}while(!0)}else f=arguments[1];for(;e<d;e++)e in b&&(f=a.call(void 0,f,b[e],e,b));return f});var d,e,f;(function(){function g(a,b){if(a&&a.charAt(0)==="."&&b){b=b.split("/"),b=b.slice(0,b.length-1),a=b.concat(a.split("/"));var c,d;for(c=0;d=a[c];c++)if(d===".")a.splice(c,1),c-=1;else if(d==="..")if(c!==1||a[2]!==".."&&a[0]!=="..")c>0&&(a.splice(c-1,2),c-=2);else break;a=a.join("/")}return a}function h(a,d){return function(){return c.apply(null,b.call(arguments,0).concat([a,d]))}}function i(a){return function(b){return g(b,a)}}function j(b){return function(c){a[b]=c}}function k(b,c){var d,e,f=b.indexOf("!");return f!==-1?(d=g(b.slice(0,f),c),b=b.slice(f+1),e=a[d],e&&e.normalize?b=e.normalize(b,i(c)):b=g(b,c)):b=g(b,c),{f:d?d+"!"+b:b,n:b,p:e}}function l(b,c,d,e){var f=[],g,i,l,m,n,o;e||(e=b);if(typeof d=="function"){if(c)for(m=0;m<c.length;m++)o=k(c[m],e),l=o.f,l==="require"?f[m]=h(b):l==="exports"?(f[m]=a[b]={},g=!0):l==="module"?i=f[m]={id:b,uri:"",exports:a[b]}:l in a?f[m]=a[l]:o.p&&(o.p.load(o.n,h(e,!0),j(l),{}),f[m]=a[l]);n=d.apply(a[b],f),b&&(i&&i.exports!==undefined?a[b]=i.exports:g||(a[b]=n))}else b&&(a[b]=d)}var a={},b=[].slice,c;if(typeof f=="function")return;d=c=function(b,d,e,f){return typeof b=="string"?a[k(b,d).f]:(b.splice||(d.splice?(b=d,d=arguments[2]):b=[]),f?l(null,b,d,e):setTimeout(function(){l(null,b,d,e)},15),c)},c.config=function(){return c},e||(e=c),f=function(a,b,c){b.splice||(c=b,b=[]),l(a,b,c)},f.amd={}})(),f("almond",function(){}),f("lib/parse-js",["require","exports","module"],function(a,b,c){function r(a){return q.letter.test(a)}function s(a){return a=a.charCodeAt(0),a>=48&&a<=57}function t(a){return s(a)||r(a)}function u(a){return q.non_spacing_mark.test(a)||q.space_combining_mark.test(a)}function v(a){return q.connector_punctuation.test(a)}function w(a){return a=="$"||a=="_"||r(a)}function x(a){return w(a)||u(a)||s(a)||v(a)||a==""||a==""}function y(a){if(i.test(a))return parseInt(a.substr(2),16);if(j.test(a))return parseInt(a.substr(1),8);if(k.test(a))return parseFloat(a)}function z(a,b,c,d){this.message=a,this.line=b,this.col=c,this.pos=d,this.stack=(new Error).stack}function A(a,b,c,d){throw new z(a,b,c,d)}function B(a,b,c){return a.type==b&&(c==null||a.value==c)}function D(a){function c(){return b.text.charAt(b.pos)}function e(a,c){var d=b.text.charAt(b.pos++);if(a&&!d)throw C;return d=="\n"?(b.newline_before=b.newline_before||!c,++b.line,b.col=0):++b.col,d}function i(){return!b.peek()}function j(a,c){var d=b.text.indexOf(a,b.pos);if(c&&d==-1)throw C;return d}function k(){b.tokline=b.line,b.tokcol=b.col,b.tokpos=b.pos}function p(a,c,d){b.regex_allowed=a=="operator"&&!S(F,c)||a=="keyword"&&S(f,c)||a=="punc"&&S(n,c);var e={type:a,value:c,line:b.tokline,col:b.tokcol,pos:b.tokpos,nlb:b.newline_before};return d||(e.comments_before=b.comments_before,b.comments_before=[]),b.newline_before=!1,e}function q(){while(S(m,c()))e()}function r(a){var b="",d=c(),f=0;while(d&&a(d,f++))b+=e(),d=c();return b}function u(a){A(a,b.tokline,b.tokcol,b.tokpos)}function v(a){var b=!1,c=!1,d=!1,e=a==".",f=r(function(f,g){return f=="x"||f=="X"?d?!1:d=!0:!!d||f!="E"&&f!="e"?f=="-"?c||g==0&&!a?!0:!1:f=="+"?c:(c=!1,f=="."?!e&&!d?e=!0:!1:t(f)):b?!1:b=c=!0});a&&(f=a+f);var g=y(f);if(!isNaN(g))return p("num",g);u("Invalid syntax: "+f)}function z(a){var b=e(!0,a);switch(b){case"n":return"\n";case"r":return"\r";case"t":return"\t";case"b":return"\b";case"v":return"
\v";case"f":return"\f";case"0":return"\0";case"x":return String.fromCharCode(B(2));case"u":return String.fromCharCode(B(4));case"\n":return"";default:return b}}function B(a){var b=0;for(;a>0;--a){var c=parseInt(e(!0),16);isNaN(c)&&u("Invalid hex-character pattern in string"),b=b<<4|c}return b}function D(){return N("Unterminated string constant",function(){var a=e(),b="";for(;;){var c=e(!0);if(c=="\\"){var d=0,f=null;c=r(function(a){if(a>="0"&&a<="7"){if(!f)return f=a,++d;if(f<="3"&&d<=2)return++d;if(f>="4"&&d<=1)return++d}return!1}),d>0?c=String.fromCharCode(parseInt(c,8)):c=z(!0)}else if(c==a)break;b+=c}return p("string",b)})}function E(){e();var a=j("\n"),c;return a==-1?(c=b.text.substr(b.pos),b.pos=b.text.length):(c=b.text.substring(b.pos,a),b.pos=a),p("comment1",c,!0)}function G(){return e(),N("Unterminated multiline comment",function(){var a=j("*/",!0),c=b.text.substring(b.pos,a),d=p("comment2",c,!0);return b.pos=a+2,b.line+=c.split("\n").length-1,b.newline_before=c.indexOf("\n")>=0,/^@cc_on/i.test(c)&&(T("WARNING: at line "+b.line),T('*** Found "conditional comment": '+c),T("*** UglifyJS DISCARDS ALL COMMENTS. This means your code might no longer work properly in Internet Explorer.")),d})}function H(){var a=!1,b="",d;while((d=c())!=null)if(!a)if(d=="\\")a=!0,e();else if(x(d))b+=e();else break;else d!="u"&&u("Expecting UnicodeEscapeSequence -- uXXXX"),d=z(),x(d)||u("Unicode char: "+d.charCodeAt(0)+" is not valid in identifier"),b+=d,a=!1;return b}function I(a){return N("Unterminated regular expression",function(){var b=!1,c,d=!1;while(c=e(!0))if(b)a+="\\"+c,b=!1;else if(c=="[")d=!0,a+=c;else if(c=="]"&&d)d=!1,a+=c;else{if(c=="/"&&!d)break;c=="\\"?b=!0:a+=c}var f=H();return p("regexp",[a,f])})}function J(a){function b(a){if(!c())return a;var d=a+c();return S(l,d)?(e(),b(d)):a}return p("operator",b(a||e()))}function K(){e();var a=b.regex_allowed;switch(c()){case"/":return b.comments_before.push(E()),b.regex_allowed=a,O();case"*":return b.comments_before.push(G()),b.regex_allowed=a,O()}return b.regex_allowed?I(""):J("/")}function L(){return e(),s(c())?v("."):p("punc",".")}function M(){var a=H();return S(d,a)?S(l,a)?p("operator",a):S(g,a)?p("atom",a):p("keyword",a):p("name",a)}function N(a,b){try{return b()}catch(c){if(c===C)u(a);else throw c}}function O(a){if(a!=null)return I(a);q(),k();var b=c();if(!b)return p("eof");if(s(b))return v();if(b=='"'||b=="'")return D();if(S(o,b))return p("punc",e());if(b==".")return L();if(b=="/")return K();if(S(h,b))return J();if(b=="\\"||w(b))return M();u("Unexpected character '"+b+"'")}var b={text:a.replace(/\r\n?|[\n\u2028\u2029]/g,"\n").replace(/^\uFEFF/,""),pos:0,tokpos:0,line:0,tokline:0,col:0,tokcol:0,newline_before:!1,regex_allowed:!1,comments_before:[]};return O.context=function(a){return a&&(b=a),b},O}function K(a,b,c){this.name=a,this.start=b,this.end=c}function L(a,b,c){function e(a,b){return B(d.token,a,b)}function f(){return d.peeked||(d.peeked=d.input())}function g(){return d.prev=d.token,d.peeked?(d.token=d.peeked,d.peeked=null):d.token=d.input(),d.token}function h(){return d.prev}function i(a,b,c,e){var f=d.input.context();A(a,b!=null?b:f.tokline,c!=null?c:f.tokcol,e!=null?e:f.tokpos)}function j(a,b){i(b,a.line,a.col)}function k(a){a==null&&(a=d.token),j(a,"Unexpected token: "+a.type+" ("+a.value+")")}function l(a,b){if(e(a,b))return g();j(d.token,"Unexpected token "+d.token.type+", expected "+a)}function m(a){return l("punc",a)}function n(){return!b&&(d.token.nlb||e("eof")||e("punc","}"))}function o(){e("punc",";")?g():n()||k()}function p(){return P(arguments)}function q(){m("(");var a=bk();return m(")"),a}function r(a,b,c){return a instanceof K?a:new K(a,b,c)}function s(a){return c?function(){var b=d.token,c=a.apply(this,arguments);return c[0]=r(c[0],b,h()),c}:a}function u(a){d.labels.push(a);var c=d.token,e=t();return b&&!S(I,e[0])&&k(c),d.labels.pop(),p("label",a,e)}function v(){return p("stat",N(bk,o))}function w(a){var b;return n()||(b=e("name")?d.token.value:null),b!=null?(g(),R(b,d.labels)||i("Label "+b+" without matching loop or statement")):d.in_loop==0&&i(a+" not inside a loop or switch"),o(),p(a,b)}function x(){m("(");var a=null;if(!e("punc",";")){a=e("keyword","var")?(g(),V(!0)):bk(!0,!0);if(e("operator","in"))return z(a)}return y(a)}function y(a){m(";");var b=e("punc",";")?null:bk();m(";");var c=e("punc",")")?null:bk();return m(")"),p("for",a,b,c,bl(t))}function z(a){var b=a[0]=="var"?p("name",a[1][0]):a;g();var c=bk();return m(")"),p("for-in",a,b,c,bl(t))}function L(){var a=q(),b=t(),c;return e("keyword","else")&&(g(),c=t()),p("if",a,b,c)}function O(){m("{");var a=[];while(!e("punc","}"))e("eof")&&k(),a.push(t());return g(),a}function T(){var a=O(),b,c;if(e("keyword","catch")){g(),m("("),e("name")||i("Name expected");var f=d.token.value;g(),m(")"),b=[f,O()]}return e("keyword","finally")&&(g(),c=O()),!b&&!c&&i("Missing catch/finally blocks"),p("try",a,b,c)}function U(a){var b=[];for(;;){e("name")||k();var c=d.token.value;g(),e("operator","=")?(g(),b.push([c,bk(!1,a)])):b.push([c]);if(!e("punc",","))break;g()}return b}function V(a){return p("var",U(a))}function W(){return p("const",U())}function X(){var a=Y(!1),b;return e("punc","(")?(g(),b=Z(")")):b=[],bc(p("new",a,b),!0)}function Z(a,b,c){var d=!0,f=[];while(!e("punc",a)){d?d=!1:m(",");if(b&&e("punc",a))break;e("punc",",")&&c?f.push(["atom","undefined"]):f.push(bk(!1))}return g(),f}function $(){return p("array",Z("]",!b,!0))}function _(){var a=!0,c=[];while(!e("punc","}")){a?a=!1:m(",");if(!b&&e("punc","}"))break;var f=d.token.type,h=ba();f!="name"||h!="get"&&h!="set"||!!e("punc",":")?(m(":"),c.push([h,bk(!1)])):c.push([bb(),C(!1),h])}return g(),p("object",c)}function ba(){switch(d.token.type){case"num":case"string":return N(d.token.value,g)}return bb()}function bb(){switch(d.token.type){case"name":case"operator":case"keyword":case"atom":return N(d.token.value,g);default:k()}}function bc(a,b){return e("punc",".")?(g(),bc(p("dot",a,bb()),b)):e("punc","[")?(g(),bc(p("sub",a,N(bk,M(m,"]"))),b)):b&&e("punc","(")?(g(),bc(p("call",a,Z(")")),!0)):a}function bd(a){if(e("operator")&&S(E,d.token.value))return be("unary-prefix",N(d.token.value,g),bd(a));var b=Y(a);while(e("operator")&&S(F,d.token.value)&&!d.token.nlb)b=be("unary-postfix",d.token.value,b),g();return b}function be(a,b,c){return(b=="++"||b=="--")&&!bi(c)&&i("Invalid use of "+b+" operator"),p(a,b,c)}function bf(a,b,c){var f=e("operator")?d.token.value:null;f&&f=="in"&&c&&(f=null);var h=f!=null?H[f]:null;if(h!=null&&h>b){g();var i=bf(bd(!0),h,c);return bf(p("binary",f,a,i),b,c)}return a}function bg(a){return bf(bd(!0),0,a)}function bh(a){var b=bg(a);if(e("operator","?")){g();var c=bk(!1);return m(":"),p("conditional",b,c,bk(!1,a))}return b}function bi(a){if(!b)return!0;switch(a[0]+""){case"dot":case"sub":case"new":case"call":return!0;case"name":return a[1]!="this"}}function bj(a){var b=bh(a),c=d.token.value;if(e("operator")&&S(G,c)){if(bi(b))return g(),p("assign",G[c],b,bj(a));i("Invalid assignment")}return b}function bl(a){try{return++d.in_loop,a()}finally{--d.in_loop}}var d={input:typeof a=="string"?D(a,!0):a,token:null,prev:null,peeked:null,in_function:0,in_loop:0,labels:[]};d.token=g();var t=s(function(){if(e("operator","/")||e("operator","/="))d.peeked=null,d.token=d.input(d.token.value.substr(1));switch(d.token.type){case"num":case"string":case"regexp":case"operator":case"atom":return v();case"name":return B(f(),"punc",":")?u(N(d.token.value,g,g)):v();case"punc":switch(d.token.value){case"{":return p("block",O());case"[":case"(":return v();case";":return g(),p("block");default:k()};case"keyword":switch(N(d.token.value,g)){case"break":return w("break");case"continue":return w("continue");case"debugger":return o(),p("debugger");case"do":return function(a){return l("keyword","while"),p("do",N(q,o),a)}(bl(t));case"for":return x();case"function":return C(!0);case"if":return L();case"return":return d.in_function==0&&i("'return' outside of function"),p("return",e("punc",";")?(g(),null):n()?null:N(bk,o));case"switch":return p("switch",q(),Q());case"throw":return d.token.nlb&&i("Illegal newline after 'throw'"),p("throw",N(bk,o));case"try":return T();case"var":return N(V,o);case"const":return N(W,o);case"while":return p("while",q(),bl(t));case"with":return p("with",q(),t());default:k()}}}),C=s(function(a){var b=e("name")?N(d.token.value,g):null;return a&&!b&&k(),m("("),p(a?"defun":"function",b,function(a,b){while(!e("punc",")"))a?a=!1:m(","),e("name")||k(),b.push(d.token.value),g();return g(),b}(!0,[]),function(){++d.in_function;var a=d.in_loop;d.in_loop=0;var b=O();return--d.in_function,d.in_loop=a,b}())}),Q=M(bl,function(){m("{");var a=[],b=null;while(!e("punc","}"))e("eof")&&k(),e("keyword","case")?(g(),b=[],a.push([bk(),b]),m(":")):e("keyword","default")?(g(),m(":"),b=[],a.push([null,b])):(b||k(),b.push(t()));return g(),a}),Y=s(function(a){if(e("operator","new"))return g(),X();if(e("punc")){switch(d.token.value){case"(":return g(),bc(N(bk,M(m,")")),a);case"[":return g(),bc($(),a);case"{":return g(),bc(_(),a)}k()}if(e("keyword","function"))return g(),bc(C(!1),a);if(S(J,d.token.type)){var b=d.token.type=="regexp"?p("regexp",d.token.value[0],d.token.value[1]):p(d.token.type,d.token.value);return bc(N(b,g),a)}k()}),bk=s(function(a,b){arguments.length==0&&(a=!0);var c=bj(b);return a&&e("punc",",")?(g(),p("seq",c,bk(!0,b))):c});return p("toplevel",function(a){while(!e("eof"))a.push(t());return a}([]))}function M(a){var b=P(arguments,1);return function(){return a.apply(this,b.concat(P(arguments)))}}function N(a){a instanceof Function&&(a=a());for(var b=1,c=arguments.length;--c>0;++b)arguments[b]();return a}function O(a){var b={};for(var c=0;c<a.length;++c)b[a[c]]=!0;return b}function P(a,b){return Array.prototype.slice.call(a,b||0)}function Q(a){return a.split("")}function R(a,b){for(var c=b.length;--c>=0;)if(b[c]===a)return!0;return!1}function S(a,b){return Object.prototype.hasOwnProperty.call(a,b)}var d=O(["break","case","catch","const","continue","default","delete","do","else","finally","for","function","if","in","instanceof","new","return","switch","throw","try","typeof","var","void","while","with"]),e=O(["abstract","boolean","byte","char","class","debugger","double","enum","export","extends","final","float","goto","implements","import","int","interface","long","native","package","private","protected","public","short","static","super","synchronized","throws","transient","volatile"]),f=O(["return","new","delete","throw","else","case"]),g=O(["false","null","true","undefined"]),h=O(Q("+-*&%=<>!?|~^")),i=/^0x[0-9a-f]+$/i,j=/^0[0-7]+$/,k=/^\d*\.?\d*(?:e[+-]?\d*(?:\d\.?|\.?\d)\d*)?$/i,l=O(["in","instanceof","typeof","new","void","delete","++","--","+","-","!","~","&","|","^","*","/","%",">>","<<",">>>","<",">","<=",">=","==","===","!=","!==","?","=","+=","-=","/=","*=","%=",">>=","<<=",">>>=","|=","^=","&=","&&","||"]),m=O(Q(" \n\r\t\f
\v ")),n=O(Q("[{}(,.;:")),o=O(Q("[]{}(),;:")),p=O(Q("gmsiy")),q={letter:new RegExp("[\\u0041-\\u005A\\u0061-\\u007A\\u00AA\\u00B5\\u00BA\\u00C0-\\u00D6\\u00D8-\\u00F6\\u00F8-\\u02C1\\u02C6-\\u02D1\\u02E0-\\u02E4\\u02EC\\u02EE\\u0370-\\u0374\\u0376\\u0377\\u037A-\\u037D\\u0386\\u0388-\\u038A\\u038C\\u038E-\\u03A1\\u03A3-\\u03F5\\u03F7-\\u0481\\u048A-\\u0523\\u0531-\\u0556\\u0559\\u0561-\\u0587\\u05D0-\\u05EA\\u05F0-\\u05F2\\u0621-\\u064A\\u066E\\u066F\\u0671-\\u06D3\\u06D5\\u06E5\\u06E6\\u06EE\\u06EF\\u06FA-\\u06FC\\u06FF\\u0710\\u0712-\\u072F\\u074D-\\u07A5\\u07B1\\u07CA-\\u07EA\\u07F4\\u07F5\\u07FA\\u0904-\\u0939\\u093D\\u0950\\u0958-\\u0961\\u0971\\u0972\\u097B-\\u097F\\u0985-\\u098C\\u098F\\u0990\\u0993-\\u09A8\\u09AA-\\u09B0\\u09B2\\u09B6-\\u09B9\\u09BD\\u09CE\\u09DC\\u09DD\\u09DF-\\u09E1\\u09F0\\u09F1\\u0A05-\\u0A0A\\u0A0F\\u0A10\\u0A13-\\u0A28\\u0A2A-\\u0A30\\u0A32\\u0A33\\u0A35\\u0A36\\u0A38\\u0A39\\u0A59-\\u0A5C\\u0A5E\\u0A72-\\u0A74\\u0A85-\\u0A8D\\u0A8F-\\u0A91\\u0A93-\\u0AA8\\u0AAA-\\u0AB0\\u0AB2\\u0AB3\\u0AB5-\\u0AB9\\u0ABD\\u0AD0\\u0AE0\\u0AE1\\u0B05-\\u0B0C\\u0B0F\\u0B10\\u0B13-\\u0B28\\u0B2A-\\u0B30\\u0B32\\u0B33\\u0B35-\\u0B39\\u0B3D\\u0B5C\\u0B5D\\u0B5F-\\u0B61\\u0B71\\u0B83\\u0B85-\\u0B8A\\u0B8E-\\u0B90\\u0B92-\\u0B95\\u0B99\\u0B9A\\u0B9C\\u0B9E\\u0B9F\\u0BA3\\u0BA4\\u0BA8-\\u0BAA\\u0BAE-\\u0BB9\\u0BD0\\u0C05-\\u0C0C\\u0C0E-\\u0C10\\u0C12-\\u0C28\\u0C2A-\\u0C33\\u0C35-\\u0C39\\u0C3D\\u0C58\\u0C59\\u0C60\\u0C61\\u0C85-\\u0C8C\\u0C8E-\\u0C90\\u0C92-\\u0CA8\\u0CAA-\\u0CB3\\u0CB5-\\u0CB9\\u0CBD\\u0CDE\\u0CE0\\u0CE1\\u0D05-\\u0D0C\\u0D0E-\\u0D10\\u0D12-\\u0D28\\u0D2A-\\u0D39\\u0D3D\\u0D60\\u0D61\\u0D7A-\\u0D7F\\u0D85-\\u0D96\\u0D9A-\\u0DB1\\u0DB3-\\u0DBB\\u0DBD\\u0DC0-\\u0DC6\\u0E01-\\u0E30\\u0E32\\u0E33\\u0E40-\\u0E46\\u0E81\\u0E82\\u0E84\\u0E87\\u0E88\\u0E8A\\u0E8D\\u0E94-\\u0E97\\u0E99-\\u0E9F\\u0EA1-\\u0EA3\\u0EA5\\u0EA7\\u0EAA\\u0EAB\\u0EAD-\\u0EB0\\u0EB2\\u0EB3\\u0EBD\\u0EC0-\\u0EC4\\u0EC6\\u0EDC\\u0EDD\\u0F00\\u0F40-\\u0F47\\u0F49-\\u0F6C\\u0F88-\\u0F8B\\u1000-\\u102A\\u103F\\u1050-\\u1055\\u105A-\\u105D\\u1061\\u1065\\u1066\\u106E-\\u1070\\u1075-\\u1081\\u108E\\u10A0-\\u10C5\\u10D0-\\u10FA\\u10FC\\u1100-\\u1159\\u115F-\\u11A2\\u11A8-\\u11F9\\u1200-\\u1248\\u124A-\\u124D\\u1250-\\u1256\\u1258\\u125A-\\u125D\\u1260-\\u1288\\u128A-\\u128D\\u1290-\\u12B0\\u12B2-\\u12B5\\u12B8-\\u12BE\\u12C0\\u12C2-\\u12C5\\u12C8-\\u12D6\\u12D8-\\u1310\\u1312-\\u1315\\u1318-\\u135A\\u1380-\\u138F\\u13A0-\\u13F4\\u1401-\\u166C\\u166F-\\u1676\\u1681-\\u169A\\u16A0-\\u16EA\\u1700-\\u170C\\u170E-\\u1711\\u1720-\\u1731\\u1740-\\u1751\\u1760-\\u176C\\u176E-\\u1770\\u1780-\\u17B3\\u17D7\\u17DC\\u1820-\\u1877\\u1880-\\u18A8\\u18AA\\u1900-\\u191C\\u1950-\\u196D\\u1970-\\u1974\\u1980-\\u19A9\\u19C1-\\u19C7\\u1A00-\\u1A16\\u1B05-\\u1B33\\u1B45-\\u1B4B\\u1B83-\\u1BA0\\u1BAE\\u1BAF\\u1C00-\\u1C23\\u1C4D-\\u1C4F\\u1C5A-\\u1C7D\\u1D00-\\u1DBF\\u1E00-\\u1F15\\u1F18-\\u1F1D\\u1F20-\\u1F45\\u1F48-\\u1F4D\\u1F50-\\u1F57\\u1F59\\u1F5B\\u1F5D\\u1F5F-\\u1F7D\\u1F80-\\u1FB4\\u1FB6-\\u1FBC\\u1FBE\\u1FC2-\\u1FC4\\u1FC6-\\u1FCC\\u1FD0-\\u1FD3\\u1FD6-\\u1FDB\\u1FE0-\\u1FEC\\u1FF2-\\u1FF4\\u1FF6-\\u1FFC\\u2071\\u207F\\u2090-\\u2094\\u2102\\u2107\\u210A-\\u2113\\u2115\\u2119-\\u211D\\u2124\\u2126\\u2128\\u212A-\\u212D\\u212F-\\u2139\\u213C-\\u213F\\u2145-\\u2149\\u214E\\u2183\\u2184\\u2C00-\\u2C2E\\u2C30-\\u2C5E\\u2C60-\\u2C6F\\u2C71-\\u2C7D\\u2C80-\\u2CE4\\u2D00-\\u2D25\\u2D30-\\u2D65\\u2D6F\\u2D80-\\u2D96\\u2DA0-\\u2DA6\\u2DA8-\\u2DAE\\u2DB0-\\u2DB6\\u2DB8-\\u2DBE\\u2DC0-\\u2DC6\\u2DC8-\\u2DCE\\u2DD0-\\u2DD6\\u2DD8-\\u2DDE\\u2E2F\\u3005\\u3006\\u3031-\\u3035\\u303B\\u303C\\u3041-\\u3096\\u309D-\\u309F\\u30A1-\\u30FA\\u30FC-\\u30FF\\u3105-\\u312D\\u3131-\\u318E\\u31A0-\\u31B7\\u31F0-\\u31FF\\u3400\\u4DB5\\u4E00\\u9FC3\\uA000-\\uA48C\\uA500-\\uA60C\\uA610-\\uA61F\\uA62A\\uA62B\\uA640-\\uA65F\\uA662-\\uA66E\\uA67F-\\uA697\\uA717-\\uA71F\\uA722-\\uA788\\uA78B\\uA78C\\uA7FB-\\uA801\\uA803-\\uA805\\uA807-\\uA80A\\uA80C-\\uA822\\uA840-\\uA873\\uA882-\\uA8B3\\uA90A-\\uA925\\uA930-\\uA946\\uAA00-\\uAA28\\uAA40-\\uAA42\\uAA44-\\uAA4B\\uAC00\\uD7A3\\uF900-\\uFA2D\\uFA30-\\uFA6A\\uFA70-\\uFAD9\\uFB00-\\uFB06\\uFB13-\\uFB17\\uFB1D\\uFB1F-\\uFB28\\uFB2A-\\uFB36\\uFB38-\\uFB3C\\uFB3E\\uFB40\\uFB41\\uFB43\\uFB44\\uFB46-\\uFBB1\\uFBD3-\\uFD3D\\uFD50-\\uFD8F\\uFD92-\\uFDC7\\uFDF0-\\uFDFB\\uFE70-\\uFE74\\uFE76-\\uFEFC\\uFF21-\\uFF3A\\uFF41-\\uFF5A\\uFF66-\\uFFBE\\uFFC2-\\uFFC7\\uFFCA-\\uFFCF\\uFFD2-\\uFFD7\\uFFDA-\\uFFDC]"),non_spacing_mark:new RegExp("[\\u0300-\\u036F\\u0483-\\u0487\\u0591-\\u05BD\\u05BF\\u05C1\\u05C2\\u05C4\\u05C5\\u05C7\\u0610-\\u061A\\u064B-\\u065E\\u0670\\u06D6-\\u06DC\\u06DF-\\u06E4\\u06E7\\u06E8\\u06EA-\\u06ED\\u0711\\u0730-\\u074A\\u07A6-\\u07B0\\u07EB-\\u07F3\\u0816-\\u0819\\u081B-\\u0823\\u0825-\\u0827\\u0829-\\u082D\\u0900-\\u0902\\u093C\\u0941-\\u0948\\u094D\\u0951-\\u0955\\u0962\\u0963\\u0981\\u09BC\\u09C1-\\u09C4\\u09CD\\u09E2\\u09E3\\u0A01\\u0A02\\u0A3C\\u0A41\\u0A42\\u0A47\\u0A48\\u0A4B-\\u0A4D\\u0A51\\u0A70\\u0A71\\u0A75\\u0A81\\u0A82\\u0ABC\\u0AC1-\\u0AC5\\u0AC7\\u0AC8\\u0ACD\\u0AE2\\u0AE3\\u0B01\\u0B3C\\u0B3F\\u0B41-\\u0B44\\u0B4D\\u0B56\\u0B62\\u0B63\\u0B82\\u0BC0\\u0BCD\\u0C3E-\\u0C40\\u0C46-\\u0C48\\u0C4A-\\u0C4D\\u0C55\\u0C56\\u0C62\\u0C63\\u0CBC\\u0CBF\\u0CC6\\u0CCC\\u0CCD\\u0CE2\\u0CE3\\u0D41-\\u0D44\\u0D4D\\u0D62\\u0D63\\u0DCA\\u0DD2-\\u0DD4\\u0DD6\\u0E31\\u0E34-\\u0E3A\\u0E47-\\u0E4E\\u0EB1\\u0EB4-\\u0EB9\\u0EBB\\u0EBC\\u0EC8-\\u0ECD\\u0F18\\u0F19\\u0F35\\u0F37\\u0F39\\u0F71-\\u0F7E\\u0F80-\\u0F84\\u0F86\\u0F87\\u0F90-\\u0F97\\u0F99-\\u0FBC\\u0FC6\\u102D-\\u1030\\u1032-\\u1037\\u1039\\u103A\\u103D\\u103E\\u1058\\u1059\\u105E-\\u1060\\u1071-\\u1074\\u1082\\u1085\\u1086\\u108D\\u109D\\u135F\\u1712-\\u1714\\u1732-\\u1734\\u1752\\u1753\\u1772\\u1773\\u17B7-\\u17BD\\u17C6\\u17C9-\\u17D3\\u17DD\\u180B-\\u180D\\u18A9\\u1920-\\u1922\\u1927\\u1928\\u1932\\u1939-\\u193B\\u1A17\\u1A18\\u1A56\\u1A58-\\u1A5E\\u1A60\\u1A62\\u1A65-\\u1A6C\\u1A73-\\u1A7C\\u1A7F\\u1B00-\\u1B03\\u1B34\\u1B36-\\u1B3A\\u1B3C\\u1B42\\u1B6B-\\u1B73\\u1B80\\u1B81\\u1BA2-\\u1BA5\\u1BA8\\u1BA9\\u1C2C-\\u1C33\\u1C36\\u1C37\\u1CD0-\\u1CD2\\u1CD4-\\u1CE0\\u1CE2-\\u1CE8\\u1CED\\u1DC0-\\u1DE6\\u1DFD-\\u1DFF\\u20D0-\\u20DC\\u20E1\\u20E5-\\u20F0\\u2CEF-\\u2CF1\\u2DE0-\\u2DFF\\u302A-\\u302F\\u3099\\u309A\\uA66F\\uA67C\\uA67D\\uA6F0\\uA6F1\\uA802\\uA806\\uA80B\\uA825\\uA826\\uA8C4\\uA8E0-\\uA8F1\\uA926-\\uA92D\\uA947-\\uA951\\uA980-\\uA982\\uA9B3\\uA9B6-\\uA9B9\\uA9BC\\uAA29-\\uAA2E\\uAA31\\uAA32\\uAA35\\uAA36\\uAA43\\uAA4C\\uAAB0\\uAAB2-\\uAAB4\\uAAB7\\uAAB8\\uAABE\\uAABF\\uAAC1\\uABE5\\uABE8\\uABED\\uFB1E\\uFE00-\\uFE0F\\uFE20-\\uFE26]"),space_combining_mark:new RegExp("[\\u0903\\u093E-\\u0940\\u0949-\\u094C\\u094E\\u0982\\u0983\\u09BE-\\u09C0\\u09C7\\u09C8\\u09CB\\u09CC\\u09D7\\u0A03\\u0A3E-\\u0A40\\u0A83\\u0ABE-\\u0AC0\\u0AC9\\u0ACB\\u0ACC\\u0B02\\u0B03\\u0B3E\\u0B40\\u0B47\\u0B48\\u0B4B\\u0B4C\\u0B57\\u0BBE\\u0BBF\\u0BC1\\u0BC2\\u0BC6-\\u0BC8\\u0BCA-\\u0BCC\\u0BD7\\u0C01-\\u0C03\\u0C41-\\u0C44\\u0C82\\u0C83\\u0CBE\\u0CC0-\\u0CC4\\u0CC7\\u0CC8\\u0CCA\\u0CCB\\u0CD5\\u0CD6\\u0D02\\u0D03\\u0D3E-\\u0D40\\u0D46-\\u0D48\\u0D4A-\\u0D4C\\u0D57\\u0D82\\u0D83\\u0DCF-\\u0DD1\\u0DD8-\\u0DDF\\u0DF2\\u0DF3\\u0F3E\\u0F3F\\u0F7F\\u102B\\u102C\\u1031\\u1038\\u103B\\u103C\\u1056\\u1057\\u1062-\\u1064\\u1067-\\u106D\\u1083\\u1084\\u1087-\\u108C\\u108F\\u109A-\\u109C\\u17B6\\u17BE-\\u17C5\\u17C7\\u17C8\\u1923-\\u1926\\u1929-\\u192B\\u1930\\u1931\\u1933-\\u1938\\u19B0-\\u19C0\\u19C8\\u19C9\\u1A19-\\u1A1B\\u1A55\\u1A57\\u1A61\\u1A63\\u1A64\\u1A6D-\\u1A72\\u1B04\\u1B35\\u1B3B\\u1B3D-\\u1B41\\u1B43\\u1B44\\u1B82\\u1BA1\\u1BA6\\u1BA7\\u1BAA\\u1C24-\\u1C2B\\u1C34\\u1C35\\u1CE1\\u1CF2\\uA823\\uA824\\uA827\\uA880\\uA881\\uA8B4-\\uA8C3\\uA952\\uA953\\uA983\\uA9B4\\uA9B5\\uA9BA\\uA9BB\\uA9BD-\\uA9C0\\uAA2F\\uAA30\\uAA33\\uAA34\\uAA4D\\uAA7B\\uABE3\\uABE4\\uABE6\\uABE7\\uABE9\\uABEA\\uABEC]"),connector_punctuation:new RegExp("[\\u005F\\u203F\\u2040\\u2054\\uFE33\\uFE34\\uFE4D-\\uFE4F\\uFF3F]")};z.prototype.toString=function(){return this.message+" (line: "+this.line+", col: "+this.col+", pos: "+this.pos+")"+"\n\n"+this.stack};var C={},E=O(["typeof","void","delete","--","++","!","~","-","+"]),F=O(["--","++"]),G=function(a,b,c){while(c<a.length)b[a[c]]=a[c].substr(0,a[c].length-1),c++;return b}(["+=","-=","/=","*=","%=",">>=","<<=",">>>=","|=","^=","&="],{"=":!0},0),H=function(a,b){for(var c=0,d=1;c<a.length;++c,++d){var e=a[c];for(var f=0;f<e.length;++f)b[e[f]]=d}return b}([["||"],["&&"],["|"],["^"],["&"],["==","===","!=","!=="],["<",">","<=",">=","in","instanceof"],[">>","<<",">>>"],["+","-"],["*","/","%"]],{}),I=O(["for","do","while","switch"]),J=O(["atom","num","string","regexp","name"]);K.prototype.toString=function(){return this.name};var T=function(){};b.tokenizer=D,b.parse=L,b.slice=P,b.curry=M,b.member=R,b.array_to_hash=O,b.PRECEDENCE=H,b.KEYWORDS_ATOM=g,b.RESERVED_WORDS=e,b.KEYWORDS=d,b.ATOMIC_START_TOKEN=J,b.OPERATORS=l,b.is_alphanumeric_char=t,b.set_logger=function(a){T=a}}),f("lib/process",["require","exports","module","./parse-js"],function(a,b,c){function i(){function a(a){return[this[0],K(a,function(a){var b=[a[0]];return a.length>1&&(b[1]=g(a[1])),b})]}function b(a){var b=[this[0]];return a!=null&&b.push(K(a,g)),b}function g(a){if(a==null)return null;try{f.push(a);var b=a[0],e=d[b];if(e){var g=e.apply(a,a.slice(1));if(g!=null)return g}return e=c[b],e.apply(a,a.slice(1))}finally{f.pop()}}function h(a){if(a==null)return null;try{return f.push(a),c[a[0]].apply(a,a.slice(1))}finally{f.pop()}}function i(a,b){var c={},e;for(e in a)J(a,e)&&(c[e]=d[e],d[e]=a[e]);var f=b();for(e in c)J(c,e)&&(c[e]?d[e]=c[e]:delete d[e]);return f}var c={string:function(a){return[this[0],a]},num:function(a){return[this[0],a]},name:function(a){return[this[0],a]},toplevel:function(a){return[this[0],K(a,g)]},block:b,splice:b,"var":a,"const":a,"try":function(a,b,c){return[this[0],K(a,g),b!=null?[b[0],K(b[1],g)]:null,c!=null?K(c,g):null]},"throw":function(a){return[this[0],g(a)]},"new":function(a,b){return[this[0],g(a),K(b,g)]},"switch":function(a,b){return[this[0],g(a),K(b,function(a){return[a[0]?g(a[0]):null,K(a[1],g)]})]},"break":function(a){return[this[0],a]},"continue":function(a){return[this[0],a]},conditional:function(a,b,c){return[this[0],g(a),g(b),g(c)]},assign:function(a,b,c){return[this[0],a,g(b),g(c)]},dot:function(a){return[this[0],g(a)].concat(e(arguments,1))},call:function(a,b){return[this[0],g(a),K(b,g)]},"function":function(a,b,c){return[this[0],a,b.slice(),K(c,g)]},defun:function(a,b,c){return[this[0],a,b.slice(),K(c,g)]},"if":function(a,b,c){return[this[0],g(a),g(b),g(c)]},"for":function(a,b,c,d){return[this[0],g(a),g(b),g(c),g(d)]},"for-in":function(a,b,c,d){return[this[0],g(a),g(b),g(c),g(d)]},"while":function(a,b){return[this[0],g(a),g(b)]},"do":function(a,b){return[this[0],g(a),g(b)]},"return":function(a){return[this[0],g(a)]},binary:function(a,b,c){return[this[0],a,g(b),g(c)]},"unary-prefix":function(a,b){return[this[0],a,g(b)]},"unary-postfix":function(a,b){return[this[0],a,g(b)]},sub:function(a,b){return[this[0],g(a),g(b)]},object:function(a){return[this[0],K(a,function(a){return a.length==2?[a[0],g(a[1])]:[a[0],g(a[1]),a[2]]})]},regexp:function(a,b){return[this[0],a,b]},array:function(a){return[this[0],K(a,g)]},stat:function(a){return[this[0],g(a)]},seq:function(){return[this[0]].concat(K(e(arguments),g))},label:function(a,b){return[this[0],a,g(b)]},"with":function(a,b){return[this[0],g(a),g(b)]},atom:function(a){return[this[0],a]}},d={},f=[];return{walk:g,dive:h,with_walkers:i,parent:function(){return f[f.length-2]},stack:function(){return f}}}function j(a){this.names={},this.mangled={},this.rev_mangled={},this.cname=-1,this.refs={},this.uses_with=!1,this.uses_eval=!1,this.parent=a,this.children=[],a?(this.level=a.level+1,a.children.push(this)):this.level=0}function l(a){function f(a){b=new j(b);var c=b.body=a();return c.scope=b,b=b.parent,c}function g(a,c){return b.define(a,c)}function h(a){b.refs[a]=!0}function k(a,b,c){var e=this[0]=="defun";return[this[0],e?g(a,"defun"):a,b,f(function(){return e||g(a,"lambda"),K(b,function(a){g(a,"arg")}),K(c,d)})]}function l(a){return function(b){K(b,function(b){g(b[0],a),b[1]&&h(b[0])})}}var b=null,c=i(),d=c.walk,e=[];return f(function(){function i(a,b){for(b=a.children.length;--b>=0;)i(a.children[b]);for(b in a.refs)if(J(a.refs,b))for(var c=a.has(b),d=a;d;d=d.parent){d.refs[b]=c;if(d===c)break}}var f=c.with_walkers({"function":k,defun:k,label:function(a,b){g(a,"label")},"break":function(a){a&&h(a)},"continue":function(a){a&&h(a)},"with":function(a,c){for(var d=b;d;d=d.parent)d.uses_with=!0},"var":l("var"),"const":l("const"),"try":function(a,b,c){if(b!=null)return[this[0],K(a,d),[g(b[0],"catch"),K(b[1],d)],c!=null?K(c,d):null]},name:function(a){a=="eval"&&e.push(b),h(a)}},function(){return d(a)});return K(e,function(a){if(!a.has("eval"))while(a)a.uses_eval=!0,a=a.parent}),i(b),f})}function m(a,b){function g(a,c){return!b.toplevel&&!e.parent?a:b.except&&f(a,b.except)?a:e.get_mangled(a,c)}function h(a){if(b.defines)return!e.has(a)&&J(b.defines,a)?b.defines[a]:null}function j(a,b,c){var f=this[0]=="defun",h;return a&&(f?a=g(a):(h={},!e.uses_eval&&!e.uses_with?a=h[a]=e.next_mangled():h[a]=a)),c=k(c.scope,function(){return b=K(b,function(a){return g(a)}),K(c,d)},h),[this[0],a,b,c]}function k(a,b,c){var d=e;e=a;if(c)for(var f in c)J(c,f)&&a.set_mangle(f,c[f]);for(var f in a.names)J(a.names,f)&&g(f,!0);var h=b();return h.scope=a,e=d,h}function m(a){return[this[0],K(a,function(a){return[g(a[0]),d(a[1])]})]}var c=i(),d=c.walk,e;return b=b||{},c.with_walkers({"function":j,defun:function(){var a=j.apply(this,arguments);switch(c.parent()[0]){case"toplevel":case"function":case"defun":return K.at_top(a)}return a},label:function(a,b){return[this[0],g(a),d(b)]},"break":function(a){if(a)return[this[0],g(a)]},"continue":function(a){if(a)return[this[0],g(a)]},"var":m,"const":m,name:function(a){return h(a)||[this[0],g(a)]},"try":function(a,b,c){return[this[0],K(a,d),b!=null?[g(b[0]),K(b[1],d)]:null,c!=null?K(c,d):null]},toplevel:function(a){var b=this;return k(b.scope,function(){return[b[0],K(a,d)]})}},function(){return d(l(a))})}function o(a,b){return E(a).length>E(b[0]=="stat"?b[1]:b).length?b:a}function p(a){return a[0]=="block"&&a[1]&&a[1].length>0?a[1][a[1].length-1]:a}function q(a){if(a)switch(p(a)[0]){case"return":case"break":case"continue":case"throw":return!0}}function r(a){return a[0]=="unary-prefix"&&f(a[1],["!","delete"])||a[0]=="binary"&&f(a[1],["in","instanceof","==","!=","===","!==","<","<=",">=",">"])||a[0]=="binary"&&f(a[1],["&&","||"])&&r(a[2])&&r(a[3])||a[0]=="conditional"&&r(a[2])&&r(a[3])||a[0]=="assign"&&a[1]===!0&&r(a[3])||a[0]=="seq"&&r(a[a.length-1])}function s(a){return!a||a[0]=="block"&&(!a[1]||a[1].length==0)}function t(a){return a[0]=="string"||a[0]=="unary-prefix"&&a[1]=="typeof"||a[0]=="binary"&&a[1]=="+"&&(t(a[2])||t(a[3]))}function v(a){s(a)||n("Dropping unreachable code: "+E(a,!0))}function w(a){function d(a){a=K(a,c);for(var b=0;b<a.length;++b){var e=a[b];if(e[0]!="if")continue;if(e[3]&&c(e[3]))continue;var f=c(e[2]);if(!q(f))continue;var g=c(e[1]),h=a.slice(b+1),i=h.length==1?h[0]:["block",h],j=a.slice(0,b).concat([[e[0],g,f,i]]);return d(j)}return a}function e(a,b,c){return c=d(c),[this[0],a,b,c]}function f(a){return[this[0],a!=null?d(a):null]}var b=i(),c=b.walk;return b.with_walkers({defun:e,"function":e,block:f,splice:f,toplevel:function(a){return[this[0],d(a)]},"try":function(a,b,c){return[this[0],d(a),b!=null?[b[0],d(b[1])]:null,c!=null?d(c):null]}},function(){return c(a)})}function x(a,b){function g(){throw e}function h(){throw f}function j(){return b.call(this,this,c,g,h)}function k(a){if(a=="++"||a=="--")return j.apply(this,arguments)}var c=i(),d=c.walk,e={},f={};return c.with_walkers({"try":j,"throw":j,"return":j,"new":j,"switch":j,"break":j,"continue":j,assign:j,call:j,"if":j,"for":j,"for-in":j,"while":j,"do":j,"return":j,"unary-prefix":k,"unary-postfix":k,defun:j},function(){for(;;)try{d(a);break}catch(b){if(b===e)break;if(b===f)continue;throw b}})}function y(a){function e(a,b){var e=d;d=b,a=K(a,c);var f={},g=K(b.names,function(a,c){return a!="var"?K.skip:b.references(c)?(f[c]=!0,[c]):K.skip});return g.length>0&&(x(["block",a],function(a,b,c,d){if(a[0]=="assign"&&a[1]===!0&&a[2][0]=="name"&&J(f,a[2][1])){for(var e=g.length;--e>=0;)if(g[e][0]==a[2][1]){g[e][1]&&c(),g[e][1]=a[3],g.push(g.splice(e,1)[0]);break}var h=b.parent();if(h[0]=="seq"){var i=h[2];i.unshift(0,h.length),h.splice.apply(h,i)}else h[0]=="stat"?h.splice(0,h.length,"block"):c();d()}c()}),a.unshift(["var",g])),d=e,a}function f(a){var c=null;for(var d=a.length;--d>=0;){var e=a[d];if(!e[1])continue;e=["assign",!0,["name",e[0]],e[1]],c==null?c=e:c=["seq",e,c]}return c==null?b.parent()[0]=="for-in"?["name",a[0][0]]:K.skip:["stat",c]}function g(a){return[this[0],e(a,this.scope)]}var b=i(),c=b.walk,d;return b.with_walkers({"function":function(a,b,c){for(var d=b.length;--d>=0&&!c.scope.references(b[d]);)b.pop();return c.scope.references(a)||(a=null),[this[0],a,b,e(c,c.scope)]},defun:function(a,b,c){if(!d.references(a))return K.skip;for(var f=b.length;--f>=0&&!c.scope.references(b[f]);)b.pop();return[this[0],a,b,e(c,c.scope)]},"var":f,toplevel:g},function(){return c(l(a))})}function z(a,b){function h(a){var c=["unary-prefix","!",a];switch(a[0]){case"unary-prefix":return a[1]=="!"&&r(a[2])?a[2]:c;case"seq":return a=e(a),a[a.length-1]=h(a[a.length-1]),a;case"conditional":return o(c,["conditional",a[1],h(a[2]),h(a[3])]);case"binary":var d=a[1],f=a[2],g=a[3];if(!b.keep_comps)switch(d){case"<=":return["binary",">",f,g];case"<":return["binary",">=",f,g];case">=":return["binary","<",f,g];case">":return["binary","<=",f,g]}switch(d){case"==":return["binary","!=",f,g];case"!=":return["binary","==",f,g];case"===":return["binary","!==",f,g];case"!==":return["binary","===",f,g];case"&&":return o(c,["binary","||",h(f),h(g)]);case"||":return o(c,["binary","&&",h(f),h(g)])}}return c}function j(a,b,c){var d=function(){return a[0]=="unary-prefix"&&a[1]=="!"?c?["conditional",a[2],c,b]:["binary","||",a[2],b]:c?o(["conditional",a,b,c],["conditional",h(a),c,b]):["binary","&&",a,b]};return u(a,function(a,d){return v(d?c:b),d?b:c},d)}function k(a,b){var c=g;g=a;var d=b();return d.scope=a,g=c,d}function m(a){return a!=null&&a[0]=="block"&&a[1]&&(a[1].length==1?a=a[1][0]:a[1].length==0&&(a=["block"])),a}function p(a,b,c){var d=this[0]=="defun";return c=k(c.scope,function(){var b=t(c,"lambda");return!d&&a&&!g.references(a)&&(a=null),b}),[this[0],a,b,c]}function t(a,c){return a=K(a,d),a=a.reduce(function(a,b){return b[0]=="block"?b[1]&&a.push.apply(a,b[1]):a.push(b),a},[]),a=function(b,c){return a.forEach(function(a){c&&(a[0]=="var"&&c[0]=="var"||a[0]=="const"&&c[0]=="const")?c[1]=c[1].concat(a[1]):(b.push(a),c=a)}),b}([]),b.dead_code&&(a=function(c,d){return a.forEach(function(a){d?a[0]=="function"||a[0]=="defun"?c.push(a):a[0]=="var"||a[0]=="const"?(b.no_warnings||n("Variables declared in unreachable code"),a[1]=K(a[1],function(a){return a[1]&&!b.no_warnings&&v(["assign",!0,["name",a[0]],a[1]]),[a[0]]}),c.push(a)):b.no_warnings||v(a):(c.push(a),f(a[0],["return","throw","break","continue"])&&(d=!0))}),c}([])),b.make_seqs&&(a=function(b,c){return a.forEach(function(a){c&&c[0]=="stat"&&a[0]=="stat"?c[1]=["seq",c[1],a[1]]:(b.push(a),c=a)}),b.length>=2&&b[b.length-2][0]=="stat"&&(b[b.length-1][0]=="return"||b[b.length-1][0]=="throw")&&b[b.length-1][1]&&b.splice(b.length-2,2,[b[b.length-1][0],["seq",b[b.length-2][1],b[b.length-1][1]]]),b}([])),a}function x(a,b,c){return u(a,function(a,e){return e?(b=d(b),v(c),b||["block"]):(c=d(c),v(b),c||["block"])},function(){return y(a,b,c)})}function y(a,b,c){a=d(a),b=d(b),c=d(c),s(b)?(a=h(a),b=c,c=null):s(c)?c=null:function(){var d=E(a),e=h(a),f=E(e);if(f.length<d.length){var g=b;b=c,c=g,a=e}}();if(s(c)&&s(b))return["stat",a];var e=["if",a,b,c];return b[0]=="if"&&s(b[3])&&s(c)?e=o(e,d(["if",["binary","&&",a,b[1]],b[2]])):b[0]=="stat"?c?c[0]=="stat"&&(e=o(e,["stat",j(a,b[1],c[1])])):e=o(e,["stat",j(a,b[1])]):c&&b[0]==c[0]&&(b[0]=="return"||b[0]=="throw")&&b[1]&&c[1]?e=o(e,[b[0],j(a,b[1],c[1])]):c&&q(b)?(e=[["if",a,b]],c[0]=="block"?c[1]&&(e=e.concat(c[1])):e.push(c),e=d(["block",e])):b&&q(c)&&(e=[["if",h(a),c]],b[0]=="block"?b[1]&&(e=e.concat(b[1])):e.push(b),e=d(["block",e])),e}function z(a,b){return u(a,function(a,c){return c?["for",null,null,null,d(b)]:(v(b),["block"])})}b=H(b,{make_seqs:!0,dead_code:!0,no_warnings:!1,keep_comps:!0});var c=i(),d=c.walk,g;return c.with_walkers({sub:function(a,b){if(b[0]=="string"){var c=b[1];if(I(c))return["dot",d(a),c];if(/^[1-9][0-9]*$/.test(c)||c==="0")return["sub",d(a),["num",parseInt(c,10)]]}},"if":x,toplevel:function(a){return["toplevel",k(this.scope,function(){return t(a)})]},"switch":function(a,b){var c=b.length-1;return["switch",d(a),K(b,function(a,b){var e=t(a[1]);if(b==c&&e.length>0){var f=e[e.length-1];f[0]=="break"&&!f[1]&&e.pop()}return[a[0]?d(a[0]):null,e]})]},"function":p,defun:p,block:function(a){if(a)return m(["block",t(a)])},binary:function(a,b,c){return u(["binary",a,d(b),d(c)],function(a){return o(d(a),this)},function(){return function(){if(a!="=="&&a!="!=")return;var e=d(b),f=d(c);return e&&e[0]=="unary-prefix"&&e[1]=="!"&&e[2][0]=="num"?b=["num",+!e[2][1]]:f&&f[0]=="unary-prefix"&&f[1]=="!"&&f[2][0]=="num"&&(c=["num",+!f[2][1]]),["binary",a,b,c]}()||this})},conditional:function(a,b,c){return j(d(a),d(b),d(c))},"try":function(a,b,c){return["try",t(a),b!=null?[b[0],t(b[1])]:null,c!=null?t(c):null]},"unary-prefix":function(a,b){b=d(b);var c=["unary-prefix",a,b];return a=="!"&&(c=o(c,h(b))),u(c,function(a,b){return d(a)},function(){return c})},name:function(a){switch(a){case"true":return["unary-prefix","!",["num",0]];case"false":return["unary-prefix","!",["num",1]]}},"while":z,assign:function(a,b,c){b=d(b),c=d(c);var e=["+","-","/","*","%",">>","<<",">>>","|","^","&"];return a===!0&&b[0]==="name"&&c[0]==="binary"&&~e.indexOf(c[1])&&c[2][0]==="name"&&c[2][1]===b[1]?[this[0],c[1],b,c[3]]:[this[0],a,b,c]}},function(){for(var b=0;b<2;++b)a=w(a),a=l(a),a=d(a);return a})}function B(a,b){var c=0,d=0;return a=a.replace(/[\\\b\f\n\r\t\x22\x27\u2028\u2029\0]/g,function(a){switch(a){case"\\":return"\\\\";case"\b":return"\\b";case"\f":return"\\f";case"\n":return"\\n";case"\r":return"\\r";case"\t":return"\\t";case"\u2028":return"\\u2028";case"\u2029":return"\\u2029";case'"':return++c,'"';case"'":return++d,"'";case"\0":return"\\0"}return a}),b&&(a=C(a)),c>d?"'"+a.replace(/\x27/g,"\\'")+"'":'"'+a.replace(/\x22/g,'\\"')+'"'}function C(a){return a.replace(/[\u0080-\uffff]/g,function(a){var b=a.charCodeAt(0).toString(16);while(b.length<4)b="0"+b;return"\\u"+b})}function E(a,b){function m(a){var c=B(a,b.ascii_only);return b.inline_script&&(c=c.replace(/<\x2fscript([>/\t\n\f\r ])/gi,"<\\/script$1")),c}function n(a){return a=a.toString(),b.ascii_only&&(a=C(a)),a}function o(a){return a==null&&(a=""),c&&(a=G(" ",b.indent_start+j*b.indent_level)+a),a}function p(a,b){b==null&&(b=1),j+=b;try{return a.apply(null,e(arguments,1))}finally{j-=b}}function q(a){if(c)return a.join(" ");var b=[];for(var d=0;d<a.length;++d){var e=a[d+1];b.push(a[d]),e&&(/[a-z0-9_\x24]$/i.test(a[d].toString())&&/^[a-z0-9_\x24]/i.test(e.toString())||/[\+\-]$/.test(a[d].toString())&&/^[\+\-]/.test(e.toString()))&&b.push(" ")}return b.join("")}function r(a){return a.join(","+l)}function t(a){var b=y(a);for(var c=1;c<arguments.length;++c){var d=arguments[c];if(d instanceof Function&&d(a)||a[0]==d)return"("+b+")"}return b}function u(a){if(a.length==1)return a[0];if(a.length==2){var b=a[1];return a=a[0],a.length>b.length?b:a}return u([a[0],u(a.slice(1))])}function v(a){if(a[0]=="function"||a[0]=="object"){var b=e(x.stack()),c=b.pop(),d=b.pop();while(d){if(d[0]=="stat")return!0;if((d[0]=="seq"||d[0]=="call"||d[0]=="dot"||d[0]=="sub"||d[0]=="conditional")&&d[1]===c||(d[0]=="binary"||d[0]=="assign"||d[0]=="unary-postfix")&&d[2]===c)c=d,d=b.pop();else return!1}}return!J(A,a[0])}function w(a){var b=a.toString(10),c=[b.replace(/^0\./,".")],d;return Math.floor(a)===a?(a<0?c.push("-0x"+(-a).toString(16).toLowerCase(),"-0"+(-a).toString(8)):c.push("0x"+a.toString(16).toLowerCase(),"0"+a.toString(8)),(d=/^(.*?)(0+)$/.exec(a))&&c.push(d[1]+"e"+d[2].length)):(d=/^0?\.(0+)(.*)$/.exec(a))&&c.push(d[2]+"e-"+(d[1].length+d[2].length),b.substr(b.indexOf("."))),u(c)}function z(a){if(a==null)return";";if(a[0]=="do")return N([a]);var b=a;for(;;){var c=b[0];if(c=="if"){if(!b[3])return y(["block",[a]]);b=b[3]}else if(c=="while"||c=="do")b=b[2];else if(c=="for"||c=="for-in")b=b[4];else break}return y(a)}function E(a,b,c,d){var e=d||"function";return a&&(e+=" "+n(a)),e+="("+r(K(b,n))+")",e=q([e,N(c)]),v(this)?"("+e+")":e}function F(a){switch(a[0]){case"with":case"while":return s(a[2]);case"for":case"for-in":return s(a[4]);case"if":if(s(a[2])&&!a[3])return!0;if(a[3])return s(a[3])?!0:F(a[3]);return F(a[2])}}function L(a,b){for(var d=[],e=a.length-1,f=0;f<=e;++f){var g=a[f],h=y(g);h!=";"&&(!c&&f==e&&!F(g)&&(h=h.replace(/;+\s*$/,"")),d.push(h))}return b?d:K(d,o)}function M(a){var b=a.length;return b==0?"{}":"{"+k+K(a,function(a,d){var e=a[1].length>0,f=p(function(){return o(a[0]?q(["case",y(a[0])+":"]):"default:")},.5)+(e?k+p(function(){return L(a[1]).join(k)}):"");return!c&&e&&d<b-1&&(f+=";"),f}).join(k)+k+o("}")}function N(a){return a?a.length==0?"{}":"{"+k+p(function(){return L(a).join(k)})+k+o("}"):";"}function O(a){var b=a[0],c=a[1];return c!=null&&(b=q([n(b),"=",t(c,"seq")])),b}b=H(b,{indent_start:0,indent_level:4,quote_keys:!1,space_colon:!1,beautify:!1,ascii_only:!1,inline_script:!1});var c=!!b.beautify,j=0,k=c?"\n":"",l=c?" ":"",x=i(),y=x.walk;return x.with_walkers({string:m,num:w,name:n,toplevel:function(a){return L(a).join(k+k)},splice:function(a){var b=x.parent();return J(D,b)?N.apply(this,arguments):K(L(a,!0),function(a,b){return b>0?o(a):a}).join(k)},block:N,"var":function(a){return"var "+r(K(a,O))+";"},"const":function(a){return"const "+r(K(a,O))+";"},"try":function(a,b,c){var d=["try",N(a)];return b&&d.push("catch","("+b[0]+")",N(b[1])),c&&d.push("finally",N(c)),q(d)},"throw":function(a){return q(["throw",y(a)])+";"},"new":function(a,b){return b=b.length>0?"("+r(K(b,function(a){return t(a,"seq")}))+")":"",q(["new",t(a,"seq","binary","conditional","assign",function(a){var b=i(),c={};try{b.with_walkers({call:function(){throw c},"function":function(){return this}},function(){b.walk(a)})}catch(d){if(d===c)return!0;throw d}})+b])},"switch":function(a,b){return q(["switch","("+y(a)+")",M(b)])},"break":function(a){var b="break";return a!=null&&(b+=" "+n(a)),b+";"},"continue":function(a){var b="continue";return a!=null&&(b+=" "+n(a)),b+";"},conditional:function(a,b,c){return q([t(a,"assign","seq","conditional"),"?",t(b,"seq"),":",t(c,"seq")])},assign:function(a,b,c){return a&&a!==!0?a+="=":a="=",q([y(b),a,t(c,"seq")])},dot:function(a){var b=y(a),c=1;a[0]=="num"?/\./.test(a[1])||(b+="."):v(a)&&(b="("+b+")");while(c<arguments.length)b+="."+n(arguments[c++]);return b},call:function(a,b){var c=y(a);return c.charAt(0)!="("&&v(a)&&(c="("+c+")"),c+"("+r(K(b,function(a){return t(a,"seq")}))+")"},"function":E,defun:E,"if":function(a,b,c){var d=["if","("+y(a)+")",c?z(b):y(b)];return c&&d.push("else",y(c)),q(d)},"for":function(a,b,c,d){var e=["for"];a=(a!=null?y(a):"").replace(/;*\s*$/,";"+l),b=(b!=null?y(b):"").replace(/;*\s*$/,";"+l),c=(c!=null?y(c):"").replace(/;*\s*$/,"");var f=a+b+c;return f=="; ; "&&(f=";;"),e.push("("+f+")",y(d)),q(e)},"for-in":function(a,b,c,d){return q(["for","("+(a?y(a).replace(/;+$/,""):y(b)),"in",y(c)+")",y(d)])},"while":function(a,b){return q(["while","("+y(a)+")",y(b)])},"do":function(a,b){return q(["do",y(b),"while","("+y(a)+")"])+";"},"return":function(a){var b=["return"];return a!=null&&b.push(y(a)),q(b)+";"},binary:function(a,d,e){var h=y(d),i=y(e);if(f(d[0],["assign","conditional","seq"])||d[0]=="binary"&&g[a]>g[d[1]]||d[0]=="function"&&v(this))h="("+h+")";return f(e[0],["assign","conditional","seq"])||e[0]=="binary"&&g[a]>=g[e[1]]&&(e[1]!=a||!f(a,["&&","||","*"]))?i="("+i+")":!c&&b.inline_script&&(a=="<"||a=="<<")&&e[0]=="regexp"&&/^script/i.test(e[1])&&(i=" "+i),q([h,a,i])},"unary-prefix":function(a,b){var c=y(b);return b[0]=="num"||b[0]=="unary-prefix"&&!J(h,a+b[1])||!v(b)||(c="("+c+")"),a+(d.is_alphanumeric_char(a.charAt(0))?" ":"")+c},"unary-postfix":function(a,b){var c=y(b);return b[0]=="num"||b[0]=="unary-postfix"&&!J(h,a+b[1])||!v(b)||(c="("+c+")"),c+a},sub:function(a,b){var c=y(a);return v(a)&&(c="("+c+")"),c+"["+y(b)+"]"},object:function(a){var d=v(this);if(a.length==0)return d?"({})":"{}";var e="{"+k+p(function(){return K(a,function(a){if(a.length==3)return o(E(a[0],a[1][2],a[1][3],a[2]));var d=a[0],e=t(a[1],"seq");return b.quote_keys?d=m(d):(typeof d=="number"||!c&&+d+""==d)&&parseFloat(d)>=0?d=w(+d):I(d)||(d=m(d)),o(q(c&&b.space_colon?[d,":",e]:[d+":",e]))}).join(","+k)})+k+o("}");return d?"("+e+")":e},regexp:function(a,b){return"/"+a+"/"+b},array:function(a){return a.length==0?"[]":q(["[",r(K(a,function(b,d){return!c&&b[0]=="atom"&&b[1]=="undefined"?d===a.length-1?",":"":t(b,"seq")})),"]"])},stat:function(a){return y(a).replace(/;*\s*$/,";")},seq:function(){return r(K(e(arguments),y))},label:function(a,b){return q([n(a),":",y(b)])},"with":function(a,b){return q(["with","("+y(a)+")",y(b)])},atom:function(a){return n(a)}},function(){return y(a)})}function F(a,b){var c=[0];return d.parse(function(){function h(a){return a.pos-f}function i(a){f=a.pos,c.push(f)}function j(){var a=e.apply(this,arguments);c:{if(g&&g.type=="keyword")break c;if(h(a)>b)switch(a.type){case"keyword":case"atom":case"name":case"punc":i(a);break c}}return g=a,a}var e=d.tokenizer(a),f=0,g;return j.context=function(){return e.context.apply(this,arguments)},j}()),c.map(function(b,d){return a.substring(b,c[d+1]||a.length)}).join("\n")}function G(a,b){if(b>0){if(b==1)return a;var c=G(a,b>>1);return c+=c,b&1&&(c+=a),c}return""}function H(a,b){var c={};a===!0&&(a={});for(var d in b)J(b,d)&&(c[d]=a&&J(a,d)?a[d]:b[d]);return c}function I(a){return/^[a-z_$][a-z0-9_$]*$/i.test(a)&&a!="this"&&!J(d.KEYWORDS_ATOM,a)&&!J(d.RESERVED_WORDS,a)&&!J(d.KEYWORDS,a)}function J(a,b){return Object.prototype.hasOwnProperty.call(a,b)}var d=a("./parse-js"),e=d.slice,f=d.member,g=d.PRECEDENCE,h=d.OPERATORS,k=function(){var a="abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ$_";return function(b){var c="";do c=a.charAt(b%54)+c,b=Math.floor(b/54);while(b>0);return c}}();j.prototype={has:function(a){for(var b=this;b;b=b.parent)if(J(b.names,a))return b},has_mangled:function(a){for(var b=this;b;b=b.parent)if(J(b.rev_mangled,a))return b},toJSON:function(){return{names:this.names,uses_eval:this.uses_eval,uses_with:this.uses_with}},next_mangled:function(){for(;;){var a=k(++this.cname),b;b=this.has_mangled(a);if(b&&this.refs[b.rev_mangled[a]]===b)continue;b=this.has(a);if(b&&b!==this&&this.refs[a]===b&&!b.has_mangled(a))continue;if(J(this.refs,a)&&this.refs[a]==null)continue;if(!I(a))continue;return a}},set_mangle:function(a,b){return this.rev_mangled[b]=a,this.mangled[a]=b},get_mangled:function(a,b){if(this.uses_eval||this.uses_with)return a;var c=this.has(a);return c?J(c.mangled,a)?c.mangled[a]:b?c.set_mangle(a,c.next_mangled()):a:a},references:function(a){return a&&!this.parent||this.uses_with||this.uses_eval||this.refs[a]},define:function(a,b){if(a!=null){if(b=="var"||!J(this.names,a))this.names[a]=b||"var";return a}}};var n=function(){},u=function(){function b(c){switch(c[0]){case"string":case"num":return c[1];case"name":case"atom":switch(c[1]){case"true":return!0;case"false":return!1;case"null":return null}break;case"unary-prefix":switch(c[1]){case"!":return!b(c[2]);case"typeof":return typeof b(c[2]);case"~":return~b(c[2]);case"-":return-b(c[2]);case"+":return+b(c[2])}break;case"binary":var d=c[2],e=c[3];switch(c[1]){case"&&":return b(d)&&b(e);case"||":return b(d)||b(e);case"|":return b(d)|b(e);case"&":return b(d)&b(e);case"^":return b(d)^b(e);case"+":return b(d)+b(e);case"*":return b(d)*b(e);case"/":return b(d)/b(e);case"%":return b(d)%b(e);case"-":return b(d)-b(e);case"<<":return b(d)<<b(e);case">>":return b(d)>>b(e);case">>>":return b(d)>>>b(e);case"==":return b(d)==b(e);case"===":return b(d)===b(e);case"!=":return b(d)!=b(e);case"!==":return b(d)!==b(e);case"<":return b(d)<b(e);case"<=":return b(d)<=b(e);case">":return b(d)>b(e);case">=":return b(d)>=b(e);case"in":return b(d)in b(e);case"instanceof":return b(d)instanceof b(e)}}throw a}var a={};return function(c,d,e){try{var f=b(c),g;switch(typeof f){case"string":g=["string",f];break;case"number":g=["num",f];break;case"boolean":g=["name",String(f)];break;default:throw new Error("Can't handle constant of type: "+typeof f)}return d.call(c,g,f)}catch(h){if(h===a){if(c[0]!="binary"||c[1]!="==="&&c[1]!="!=="||!(t(c[2])&&t(c[3])||r(c[2])&&r(c[3]))){if(e&&c[0]=="binary"&&(c[1]=="||"||c[1]=="&&"))try{var i=b(c[2]);c=c[1]=="&&"&&(i?c[3]:i)||c[1]=="||"&&(i?i:c[3])||c}catch(j){}}else c[1]=c[1].substr(0,2);return e?e.call(c,c):null}throw h}}}(),A=d.array_to_hash(["name","array","object","string","dot","sub","call","regexp","defun"]),D=d.array_to_hash(["if","while","do","for","for-in","with"]),K;(function(){function b(a){this.v=a}function c(a){this.v=a}K=function(d,e,f){function j(){var j=e.call(f,d[i],i);j instanceof b?(j=j.v,j instanceof c?h.push.apply(h,j.v):h.push(j)):j!=a&&(j instanceof c?g.push.apply(g,j.v):g.push(j))}var g=[],h=[],i;if(d instanceof Array)for(i=0;i<d.length;++i)j();else for(i in d)J(d,i)&&j();return h.concat(g)},K.at_top=function(a){return new b(a)},K.splice=function(a){return new c(a)};var a=K.skip={}})(),b.ast_walker=i,b.ast_mangle=m,b.ast_squeeze=z,b.ast_lift_variables=y,b.gen_code=E,b.ast_add_scope=l,b.set_logger=function(a){n=a},b.make_string=B,b.split_lines=F,b.MAP=K}),f("uglify-js",["require","exports","module","./lib/parse-js","./lib/process"],function(a,b,c){function d(a,b){b||(b={});var c=d.parser,e=d.uglify,f=c.parse(a,b.strict_semicolons);f=e.ast_mangle(f,b.mangle_options),f=e.ast_squeeze(f,b.squeeze_options);var g=e.gen_code(f,b.gen_options);return g}d.parser=a("./lib/parse-js"),d.uglify=a("./lib/process"),c.exports=d}),f("lib/squeeze-more",["require","exports","module","./parse-js","./process"],function(a,b,c){function l(a){function f(a,b){var c=d,e;return d=a,e=b(),d=c,e}function g(a,b,d){return[this[0],a,b,f(d.scope,h(i,d,c))]}var b=e.ast_walker(),c=b.walk,d;return b.with_walkers({toplevel:function(a){return[this[0],f(this.scope,h(i,a,c))]},"function":g,defun:g,"new":function(a,b){if(a[0]=="name"&&a[1]=="Array"&&!d.has("Array"))return b.length!=1?["array",b]:c(["call",["name","Array"],b])},call:function(a,b){if(a[0]=="dot"&&a[2]=="toString"&&b.length==0)return["binary","+",a[1],["string",""]];if(a[0]=="name"&&a[1]=="Array"&&b.length!=1&&!d.has("Array"))return["array",b]}},function(){return c(e.ast_add_scope(a))})}var d=a("./parse-js"),e=a("./process"),f=d.slice,g=d.member,h=d.curry,i=e.MAP,j=d.PRECEDENCE,k=d.OPERATORS;b.ast_squeeze_more=l});if(!this.uglify){var g=this;e(["uglify-js","lib/process","lib/squeeze-more"],function(a,b,c){b.ast_squeeze_more=c.ast_squeeze_more,g.uglify=a;var d=g.define;typeof d=="function"&&d.amd&&d("uglifyweb",function(){return a})},null,!0)}})()
\ No newline at end of file
{
"name": "bootstrap",
"version": "3.0.0",
- "main": ["./docs/assets/js/bootstrap.js", "./docs/assets/css/bootstrap.css"],
+ "main": ["./dist/js/bootstrap.js", "./dist/css/bootstrap.css"],
"ignore": [
"**/.*"
],
--- /dev/null
+{
+ "username": "--secure--",
+ "key": "--secure--",
+ "test_path": "js/tests/index.html",
+ "browsers": [
+ {
+ "browser": "firefox",
+ "browser_version": "latest",
+ "os": "OS X",
+ "os_version": "Mountain Lion"
+ },
+ {
+ "browser": "safari",
+ "browser_version": "latest",
+ "os": "OS X",
+ "os_version": "Mountain Lion"
+ },
+ {
+ "browser": "chrome",
+ "browser_version": "latest",
+ "os": "OS X",
+ "os_version": "Mountain Lion"
+ },
+ {
+ "browser": "firefox",
+ "browser_version": "latest",
+ "os": "Windows",
+ "os_version": "7"
+ },
+ {
+ "browser": "chrome",
+ "browser_version": "latest",
+ "os": "Windows",
+ "os_version": "7"
+ }
+ ]
+}
layout: default
title: Components
slug: components
-lead: "Dozens of reusable components built to provide iconography, dropdowns, navigation, alerts, popovers, and much more."
+lead: "Over a dozen reusable components built to provide iconography, dropdowns, navigation, alerts, popovers, and much more."
base_url: "../"
---
================================================== -->
<div class="bs-docs-section">
<div class="page-header">
- <h1 id="dropdowns">Dropdown menus</h1>
+ <h1 id="dropdowns">Dropdowns</h1>
</div>
<p class="lead">Toggleable, contextual menu for displaying lists of links. Made interactive with the <a href="../javascript/#dropdowns">dropdown JavaScript plugin</a>.</p>
<p>Wrap the dropdown's trigger and the dropdown menu within <code>.dropdown</code>, or another element that declares <code>position: relative;</code>. Then add the menu's HTML.</p>
<div class="bs-example">
<div class="dropdown clearfix">
- <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu">
- <li><a tabindex="-1" href="#">Action</a></li>
- <li><a tabindex="-1" href="#">Another action</a></li>
- <li><a tabindex="-1" href="#">Something else here</a></li>
- <li class="divider"></li>
- <li><a tabindex="-1" href="#">Separated link</a></li>
+ <a id="dropdownMenu1" href="#" role="button" class="sr-only dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
+ <li role="presentation" class="divider"></li>
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
</ul>
</div>
</div><!-- /example -->
{% highlight html %}
<div class="dropdown">
<!-- Link or button to toggle dropdown -->
- <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu">
- <li><a tabindex="-1" href="#">Action</a></li>
- <li><a tabindex="-1" href="#">Another action</a></li>
- <li><a tabindex="-1" href="#">Something else here</a></li>
- <li class="divider"></li>
- <li><a tabindex="-1" href="#">Separated link</a></li>
+ <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
+ <li role="presentation" class="divider"></li>
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
</ul>
</div>
{% endhighlight %}
- <h3 id="dropdowns-alignment">Aligning the menus</h3>
+ <h3 id="dropdowns-alignment">Aligninment options</h3>
<p>Add <code>.pull-right</code> to a <code>.dropdown-menu</code> to right align the dropdown menu.</p>
{% highlight html %}
<ul class="dropdown-menu pull-right" role="menu" aria-labelledby="dLabel">
</ul>
{% endhighlight %}
- <h3 id="dropdowns-headers">Dropdown headers</h3>
- <p>Add a header to break up label sections of actions in any dropdown menu.</p>
+ <h3 id="dropdowns-headers">Headers</h3>
+ <p>Add a header to label sections of actions in any dropdown menu.</p>
<div class="bs-example">
<div class="dropdown clearfix">
- <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu">
- <li class="dropdown-header">Dropdown header</li>
- <li><a tabindex="-1" href="#">Action</a></li>
- <li><a tabindex="-1" href="#">Another action</a></li>
- <li><a tabindex="-1" href="#">Something else here</a></li>
- <li class="divider"></li>
- <li class="dropdown-header">Dropdown header</li>
- <li><a tabindex="-1" href="#">Separated link</a></li>
+ <a id="dropdownMenu2" href="#" role="button" class="sr-only dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu2">
+ <li role="presentation" class="dropdown-header">Dropdown header</li>
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
+ <li role="presentation" class="divider"></li>
+ <li role="presentation" class="dropdown-header">Dropdown header</li>
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
</ul>
</div>
</div><!-- /example -->
{% highlight html %}
-<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu">
- <li class="dropdown-header">Dropdown header</li>
+<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu2">
+ <li role="presentation" class="dropdown-header">Dropdown header</li>
...
- <li class="divider"></li>
- <li class="dropdown-header">Dropdown header</li>
+ <li role="presentation" class="divider"></li>
+ <li role="presentation" class="dropdown-header">Dropdown header</li>
...
</ul>
{% endhighlight %}
- <h3 id="dropdowns-disabled">Disabled menu options</h3>
+ <h3 id="dropdowns-disabled">Disabled menu items</h3>
<p>Add <code>.disabled</code> to a <code><li></code> in the dropdown to disable the link.</p>
<div class="bs-example">
<div class="dropdown clearfix">
- <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu">
- <li><a tabindex="-1" href="#">Regular link</a></li>
- <li class="disabled"><a tabindex="-1" href="#">Disabled link</a></li>
- <li><a tabindex="-1" href="#">Another link</a></li>
+ <a id="dropdownMenu3" href="#" role="button" class="sr-only dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu3">
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Regular link</a></li>
+ <li role="presentation" class="disabled"><a role="menuitem" tabindex="-1" href="#">Disabled link</a></li>
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another link</a></li>
</ul>
</div>
</div><!-- /example -->
{% highlight html %}
-<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu">
- <li><a tabindex="-1" href="#">Regular link</a></li>
- <li class="disabled"><a tabindex="-1" href="#">Disabled link</a></li>
- <li><a tabindex="-1" href="#">Another link</a></li>
+<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu3">
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Regular link</a></li>
+ <li role="presentation" class="disabled"><a role="menuitem" tabindex="-1" href="#">Disabled link</a></li>
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another link</a></li>
</ul>
{% endhighlight %}
</div>
<div class="page-header">
<h1 id="btn-groups">Button groups</h1>
</div>
- <p class="lead">Group a series of buttons together on a single line with the button group. Add on optional JavaScript radio and checkbox style behavior with <a href="../javascript/#js-buttons">our buttons plugin</a>.</p>
+ <p class="lead">Group a series of buttons together on a single line with the button group. Add on optional JavaScript radio and checkbox style behavior with <a href="../javascript/#buttons">our buttons plugin</a>.</p>
<div class="bs-callout bs-callout-info">
<h4>Tooltips & popovers in button groups require special setting</h4>
<p>When using tooltips or popovers on elements within a <code>.btn-group</code>, you'll have to specify the option <code>container: 'body'</code> to avoid unwanted side effects (such as the element growing wider and/or losing its rounded corners when the tooltip or popover is triggered).</p>
</div>
- <h3 id="btn-groups-single">Basic button group</h3>
+ <h3 id="btn-groups-single">Basic example</h3>
<p>Wrap a series of buttons with <code>.btn</code> in <code>.btn-group</code>.</p>
<div class="bs-example">
<div class="btn-group" style="margin: 9px 0 5px;">
</div>
{% endhighlight %}
- <h3 id="btn-groups-toolbar">Multiple button groups</h3>
+ <h3 id="btn-groups-toolbar">Button toolbar</h3>
<p>Combine sets of <code><div class="btn-group"></code> into a <code><div class="btn-toolbar"></code> for more complex components.</p>
<div class="bs-example">
<div class="btn-toolbar" style="margin: 0;">
</div>
{% endhighlight %}
- <h3 id="btn-groups-nested">Nested button groups</h3>
- <p>Place buttons groups within button groups when you want dropdown menus mixed with a series of buttons.</p>
+ <h3 id="btn-groups-sizing">Sizing</h3>
+ <p>Instead of applying button sizing classes to every button in a group, just add <code>.btn-group-*</code> to the <code>.btn-group</code>.</p>
+ <div class="bs-example">
+ <div class="btn-toolbar">
+ <div class="btn-group btn-group-lg">
+ <button type="button" class="btn btn-default">Left</button>
+ <button type="button" class="btn btn-default">Middle</button>
+ <button type="button" class="btn btn-default">Right</button>
+ </div>
+ </div>
+ <div class="btn-toolbar">
+ <div class="btn-group">
+ <button type="button" class="btn btn-default">Left</button>
+ <button type="button" class="btn btn-default">Middle</button>
+ <button type="button" class="btn btn-default">Right</button>
+ </div>
+ </div>
+ <div class="btn-toolbar">
+ <div class="btn-group btn-group-sm">
+ <button type="button" class="btn btn-default">Left</button>
+ <button type="button" class="btn btn-default">Middle</button>
+ <button type="button" class="btn btn-default">Right</button>
+ </div>
+ </div>
+ <div class="btn-toolbar">
+ <div class="btn-group btn-group-xs">
+ <button type="button" class="btn btn-default">Left</button>
+ <button type="button" class="btn btn-default">Middle</button>
+ <button type="button" class="btn btn-default">Right</button>
+ </div>
+ </div>
+ </div>
+{% highlight html %}
+<div class="btn-group btn-group-lg">...</div>
+<div class="btn-group">...</div>
+<div class="btn-group btn-group-sm">...</div>
+<div class="btn-group btn-group-xs">...</div>
+{% endhighlight %}
+
+ <h3 id="btn-groups-nested">Nesting</h3>
+ <p>Place a <code>.btn-group</code> within another <code>.btn-group</code> when you want dropdown menus mixed with a series of buttons.</p>
<div class="bs-example">
<div class="btn-group">
<button type="button" class="btn btn-default">1</button>
<button type="button" class="btn btn-default">2</button>
- <button type="button" class="btn btn-default">3</button>
<div class="btn-group">
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
<ul class="dropdown-menu">
<li><a href="#">Dropdown link</a></li>
<li><a href="#">Dropdown link</a></li>
- <li><a href="#">Dropdown link</a></li>
- </ul>
+ </ul>
</div>
</div>
</div>
+{% highlight html %}
+<div class="btn-group">
+ <button type="button" class="btn btn-default">1</button>
+ <button type="button" class="btn btn-default">2</button>
+
+ <div class="btn-group">
+ <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+ Dropdown
+ <span class="caret"></span>
+ </button>
+ <ul class="dropdown-menu">
+ <li><a href="#">Dropdown link</a></li>
+ <li><a href="#">Dropdown link</a></li>
+ </ul>
+ </div>
+</div>
+{% endhighlight %}
- <h3 id="btn-groups-vertical">Vertical button groups</h3>
+ <h3 id="btn-groups-vertical">Vertical variation</h3>
<p>Make a set of buttons appear vertically stacked rather than horizontally.</p>
<div class="bs-example">
<div class="btn-group-vertical">
<button type="button" class="btn btn-default">Button</button>
<button type="button" class="btn btn-default">Button</button>
+ <div class="btn-group">
+ <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+ Dropdown
+ <span class="caret"></span>
+ </button>
+ <ul class="dropdown-menu">
+ <li><a href="#">Dropdown link</a></li>
+ <li><a href="#">Dropdown link</a></li>
+ </ul>
+ </div>
<button type="button" class="btn btn-default">Button</button>
<button type="button" class="btn btn-default">Button</button>
+ <div class="btn-group">
+ <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+ Dropdown
+ <span class="caret"></span>
+ </button>
+ <ul class="dropdown-menu">
+ <li><a href="#">Dropdown link</a></li>
+ <li><a href="#">Dropdown link</a></li>
+ </ul>
+ </div>
+ <div class="btn-group">
+ <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+ Dropdown
+ <span class="caret"></span>
+ </button>
+ <ul class="dropdown-menu">
+ <li><a href="#">Dropdown link</a></li>
+ <li><a href="#">Dropdown link</a></li>
+ </ul>
+ </div>
+ <div class="btn-group">
+ <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+ Dropdown
+ <span class="caret"></span>
+ </button>
+ <ul class="dropdown-menu">
+ <li><a href="#">Dropdown link</a></li>
+ <li><a href="#">Dropdown link</a></li>
+ </ul>
+ </div>
</div>
</div>
{% highlight html %}
</div>
{% endhighlight %}
- <h3 id="btn-groups-justified">Justified button groups</h3>
+ <h3 id="btn-groups-justified">Justified link variation</h3>
<p>Make a group of buttons stretch at the same size to span the entire width of its parent.</p>
<div class="bs-callout bs-callout-warning">
<div class="bs-example">
<div class="btn-group btn-group-justified">
<a href="#" class="btn btn-default">Left</a>
- <a href="#" class="btn btn-default">Right</a>
<a href="#" class="btn btn-default">Middle</a>
+ <a href="#" class="btn btn-default">Right</a>
</div>
</div>
{% highlight html %}
================================================== -->
<div class="bs-docs-section">
<div class="page-header">
- <h1 id="btn-dropdowns">Button dropdown menus</h1>
+ <h1 id="btn-dropdowns">Button dropdowns</h1>
</div>
<p class="lead">Use any button to trigger a dropdown menu by placing it within a <code>.btn-group</code> and providing the proper menu markup.</p>
</div>
<h3 id="btn-dropdowns-single">Single button dropdowns</h3>
- <p>Turn a button into dropdown toggle with some basic markup changes.</p>
+ <p>Turn a button into a dropdown toggle with some basic markup changes.</p>
<div class="bs-example">
- <div class="btn-toolbar" style="margin-bottom: 10px;">
- <div class="btn-group">
- <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Action <span class="caret"></span></button>
- <ul class="dropdown-menu">
- <li><a href="#">Action</a></li>
- <li><a href="#">Another action</a></li>
- <li><a href="#">Something else here</a></li>
- <li class="divider"></li>
- <li><a href="#">Separated link</a></li>
- </ul>
- </div><!-- /btn-group -->
- <div class="btn-group">
- <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">Action <span class="caret"></span></button>
- <ul class="dropdown-menu">
- <li><a href="#">Action</a></li>
- <li><a href="#">Another action</a></li>
- <li><a href="#">Something else here</a></li>
- <li class="divider"></li>
- <li><a href="#">Separated link</a></li>
- </ul>
- </div><!-- /btn-group -->
- <div class="btn-group">
- <button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown">Danger <span class="caret"></span></button>
- <ul class="dropdown-menu">
- <li><a href="#">Action</a></li>
- <li><a href="#">Another action</a></li>
- <li><a href="#">Something else here</a></li>
- <li class="divider"></li>
- <li><a href="#">Separated link</a></li>
- </ul>
- </div><!-- /btn-group -->
- <div class="btn-group">
- <button type="button" class="btn btn-warning dropdown-toggle" data-toggle="dropdown">Warning <span class="caret"></span></button>
- <ul class="dropdown-menu">
- <li><a href="#">Action</a></li>
- <li><a href="#">Another action</a></li>
- <li><a href="#">Something else here</a></li>
- <li class="divider"></li>
- <li><a href="#">Separated link</a></li>
- </ul>
- </div><!-- /btn-group -->
- <div class="btn-group">
- <button type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown">Success <span class="caret"></span></button>
- <ul class="dropdown-menu">
- <li><a href="#">Action</a></li>
- <li><a href="#">Another action</a></li>
- <li><a href="#">Something else here</a></li>
- <li class="divider"></li>
- <li><a href="#">Separated link</a></li>
- </ul>
- </div><!-- /btn-group -->
- </div>
+ <div class="btn-group">
+ <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Default <span class="caret"></span></button>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ <div class="btn-group">
+ <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">Primary <span class="caret"></span></button>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ <div class="btn-group">
+ <button type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown">Success <span class="caret"></span></button>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ <div class="btn-group">
+ <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown">Info <span class="caret"></span></button>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ <div class="btn-group">
+ <button type="button" class="btn btn-warning dropdown-toggle" data-toggle="dropdown">Warning <span class="caret"></span></button>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ <div class="btn-group">
+ <button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown">Danger <span class="caret"></span></button>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
</div>
{% highlight html %}
<!-- Single button -->
<h3 id="btn-dropdowns-split">Split button dropdowns</h3>
<p>Similarly, create split button dropdowns with the same markup changes, only with a separate button.</p>
<div class="bs-example">
- <div class="btn-toolbar" style="margin: 0;">
- <div class="btn-group">
- <button type="button" class="btn btn-default">Action</button>
- <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
- <ul class="dropdown-menu">
- <li><a href="#">Action</a></li>
- <li><a href="#">Another action</a></li>
- <li><a href="#">Something else here</a></li>
- <li class="divider"></li>
- <li><a href="#">Separated link</a></li>
- </ul>
- </div><!-- /btn-group -->
- <div class="btn-group">
- <button type="button" class="btn btn-primary">Action</button>
- <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
- <ul class="dropdown-menu">
- <li><a href="#">Action</a></li>
- <li><a href="#">Another action</a></li>
- <li><a href="#">Something else here</a></li>
- <li class="divider"></li>
- <li><a href="#">Separated link</a></li>
- </ul>
- </div><!-- /btn-group -->
- <div class="btn-group">
- <button type="button" class="btn btn-danger">Danger</button>
- <button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
- <ul class="dropdown-menu">
- <li><a href="#">Action</a></li>
- <li><a href="#">Another action</a></li>
- <li><a href="#">Something else here</a></li>
- <li class="divider"></li>
- <li><a href="#">Separated link</a></li>
- </ul>
- </div><!-- /btn-group -->
- <div class="btn-group">
- <button type="button" class="btn btn-warning">Warning</button>
- <button type="button" class="btn btn-warning dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
- <ul class="dropdown-menu">
- <li><a href="#">Action</a></li>
- <li><a href="#">Another action</a></li>
- <li><a href="#">Something else here</a></li>
- <li class="divider"></li>
- <li><a href="#">Separated link</a></li>
- </ul>
- </div><!-- /btn-group -->
- <div class="btn-group">
- <button type="button" class="btn btn-success">Success</button>
- <button type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
- <ul class="dropdown-menu">
- <li><a href="#">Action</a></li>
- <li><a href="#">Another action</a></li>
- <li><a href="#">Something else here</a></li>
- <li class="divider"></li>
- <li><a href="#">Separated link</a></li>
- </ul>
- </div><!-- /btn-group -->
- </div><!-- /btn-toolbar -->
+ <div class="btn-group">
+ <button type="button" class="btn btn-default">Default</button>
+ <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ <div class="btn-group">
+ <button type="button" class="btn btn-primary">Primary</button>
+ <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ <div class="btn-group">
+ <button type="button" class="btn btn-success">Success</button>
+ <button type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ <div class="btn-group">
+ <button type="button" class="btn btn-info">Info</button>
+ <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ <div class="btn-group">
+ <button type="button" class="btn btn-warning">Warning</button>
+ <button type="button" class="btn btn-warning dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ <div class="btn-group">
+ <button type="button" class="btn btn-danger">Danger</button>
+ <button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
</div>
{% highlight html %}
<!-- Split button -->
<div class="btn-group">
- <button type="button" class="btn btn-default">Action</button>
- <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+ <button type="button" class="btn btn-danger">Action</button>
+ <button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown">
<span class="caret"></span>
</button>
<ul class="dropdown-menu">
</div>
{% endhighlight %}
- <h3 id="btn-dropdowns-sizes">Works with all button sizes</h3>
+ <h3 id="btn-dropdowns-sizing">Sizing</h3>
<p>Button dropdowns work with buttons of all sizes.</p>
<div class="bs-example">
- <div class="btn-toolbar" style="margin: 0;">
+ <div class="btn-toolbar">
<div class="btn-group">
- <button class="btn btn-default btn-large dropdown-toggle" type="button" data-toggle="dropdown">
+ <button class="btn btn-default btn-lg dropdown-toggle" type="button" data-toggle="dropdown">
Large button <span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li><a href="#">Separated link</a></li>
</ul>
</div><!-- /btn-group -->
+ </div><!-- /btn-toolbar -->
+ <div class="btn-toolbar">
<div class="btn-group">
- <button class="btn btn-default btn-small dropdown-toggle" type="button" data-toggle="dropdown">
+ <button class="btn btn-default btn-sm dropdown-toggle" type="button" data-toggle="dropdown">
Small button <span class="caret"></span>
</button>
<ul class="dropdown-menu">
</ul>
</div><!-- /btn-group -->
</div><!-- /btn-toolbar -->
+ <div class="btn-toolbar">
+ <div class="btn-group">
+ <button class="btn btn-default btn-xs dropdown-toggle" type="button" data-toggle="dropdown">
+ Extra small button <span class="caret"></span>
+ </button>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ </div><!-- /btn-toolbar -->
</div><!-- /example -->
{% highlight html %}
<!-- Large button group -->
<div class="btn-group">
- <button class="btn btn-default btn-large dropdown-toggle" type="button" data-toggle="dropdown">
+ <button class="btn btn-default btn-lg dropdown-toggle" type="button" data-toggle="dropdown">
Large button <span class="caret"></span>
</button>
<ul class="dropdown-menu">
<!-- Small button group -->
<div class="btn-group">
- <button class="btn btn-default btn-small dropdown-toggle" type="button" data-toggle="dropdown">
+ <button class="btn btn-default btn-sm dropdown-toggle" type="button" data-toggle="dropdown">
Small button <span class="caret"></span>
</button>
<ul class="dropdown-menu">
...
</ul>
</div>
+
+<!-- Extra small button group -->
+<div class="btn-group">
+ <button class="btn btn-default btn-xs dropdown-toggle" type="button" data-toggle="dropdown">
+ Extra small button <span class="caret"></span>
+ </button>
+ <ul class="dropdown-menu">
+ ...
+ </ul>
</div>
{% endhighlight %}
- <h3 id="btn-dropdowns-dropup">Dropup buttons</h3>
+ <h3 id="btn-dropdowns-dropup">Dropup variation</h3>
<p>Trigger dropdown menus above elements by adding <code>.dropup</code> to the parent.</p>
<div class="bs-example">
<div class="btn-toolbar">
+
+ <!-- Input groups
+ ================================================== -->
+ <div class="bs-docs-section">
+ <div class="page-header">
+ <h1 id="input-groups">Input groups</h1>
+ </div>
+ <p class="lead">Extend form controls by adding text or buttons before, after, or on both sides of any text-based input. Use <code>.input-group</code> with an <code>.input-group-addon</code> to prepend or append elements to a <code>.form-control</code>.</p>
+
+ <div class="bs-callout bs-callout-danger">
+ <h4>Cross-browser compatibility</h4>
+ <p>Avoid using <code><select></code> elements here as they cannot be fully styled in WebKit browsers.</p>
+ </div>
+ <div class="bs-callout bs-callout-info">
+ <h4>Tooltips & popovers in input groups require special setting</h4>
+ <p>When using tooltips or popovers on elements within an <code>.input-group</code>, you'll have to specify the option <code>container: 'body'</code> to avoid unwanted side effects (such as the element growing wider and/or losing its rounded corners when the tooltip or popover is triggered).</p>
+ </div>
+
+ <h2 id="input-groups-basic">Basic example</h2>
+ <form class="bs-example bs-example-form" role="form">
+ <div class="input-group">
+ <span class="input-group-addon">@</span>
+ <input type="text" class="form-control" placeholder="Username">
+ </div>
+ <br>
+ <div class="input-group">
+ <input type="text" class="form-control">
+ <span class="input-group-addon">.00</span>
+ </div>
+ <br>
+ <div class="input-group">
+ <span class="input-group-addon">$</span>
+ <input type="text" class="form-control">
+ <span class="input-group-addon">.00</span>
+ </div>
+ </form>
+{% highlight html %}
+<div class="input-group">
+ <span class="input-group-addon">@</span>
+ <input type="text" class="form-control" placeholder="Username">
+</div>
+
+<div class="input-group">
+ <input type="text" class="form-control">
+ <span class="input-group-addon">.00</span>
+</div>
+
+<div class="input-group">
+ <span class="input-group-addon">$</span>
+ <input type="text" class="form-control">
+ <span class="input-group-addon">.00</span>
+</div>
+{% endhighlight %}
+
+
+ <h2 id="input-groups-sizing">Sizing</h2>
+ <p>Add the relative form sizing classes to the <code>.input-group</code> itself and contents within will automatically resize—no need for repeating the form control size classes on each element.</p>
+ <form class="bs-example bs-example-form" role="form">
+ <div class="input-group input-group-lg">
+ <span class="input-group-addon">@</span>
+ <input type="text" class="form-control" placeholder="Username">
+ </div>
+ <br>
+ <div class="input-group">
+ <span class="input-group-addon">@</span>
+ <input type="text" class="form-control" placeholder="Username">
+ </div>
+ <br>
+ <div class="input-group input-group-sm">
+ <span class="input-group-addon">@</span>
+ <input type="text" class="form-control" placeholder="Username">
+ </div>
+ </form>
+{% highlight html %}
+<div class="input-group input-group-lg">
+ <span class="input-group-addon">@</span>
+ <input type="text" class="form-control input-lg" placeholder="Username">
+</div>
+
+<div class="input-group">
+ <span class="input-group-addon">@</span>
+ <input type="text" class="form-control" placeholder="Username">
+</div>
+
+<div class="input-group input-group-sm">
+ <span class="input-group-addon">@</span>
+ <input type="text" class="form-control" placeholder="Username">
+</div>
+{% endhighlight %}
+
+
+ <h2 id="input-groups-checkboxes-radios">Checkboxes and radio addons</h2>
+ <p>Place any checkbox or radio option within an input group's addon instead of text.</p>
+ <form class="bs-example bs-example-form">
+ <div class="row">
+ <div class="col-lg-6">
+ <div class="input-group">
+ <span class="input-group-addon">
+ <input type="checkbox">
+ </span>
+ <input type="text" class="form-control">
+ </div><!-- /input-group -->
+ </div><!-- /.col-lg-6 -->
+ <div class="col-lg-6">
+ <div class="input-group">
+ <span class="input-group-addon">
+ <input type="radio">
+ </span>
+ <input type="text" class="form-control">
+ </div><!-- /input-group -->
+ </div><!-- /.col-lg-6 -->
+ </div><!-- /.row -->
+ </form>
+{% highlight html %}
+<div class="row">
+ <div class="col-lg-6">
+ <div class="input-group">
+ <span class="input-group-addon">
+ <input type="checkbox">
+ </span>
+ <input type="text" class="form-control">
+ </div><!-- /input-group -->
+ </div><!-- /.col-lg-6 -->
+ <div class="col-lg-6">
+ <div class="input-group">
+ <span class="input-group-addon">
+ <input type="radio">
+ </span>
+ <input type="text" class="form-control">
+ </div><!-- /input-group -->
+ </div><!-- /.col-lg-6 -->
+</div><!-- /.row -->
+{% endhighlight %}
+
+
+ <h2 id="input-groups-buttons">Button addons</h2>
+ <p>Buttons in input groups are a bit different and require one extra level of nesting. Instead of <code>.input-group-addon</code>, you'll need to use <code>.input-group-btn</code> to wrap the buttons. This is required due to default browser styles that cannot be overridden.</p>
+ <form class="bs-example bs-example-form">
+ <div class="row">
+ <div class="col-lg-6">
+ <div class="input-group">
+ <span class="input-group-btn">
+ <button class="btn btn-default" type="button">Go!</button>
+ </span>
+ <input type="text" class="form-control">
+ </div><!-- /input-group -->
+ </div><!-- /.col-lg-6 -->
+ <div class="col-lg-6">
+ <div class="input-group">
+ <input type="text" class="form-control">
+ <span class="input-group-btn">
+ <button class="btn btn-default" type="button">Go!</button>
+ </span>
+ </div><!-- /input-group -->
+ </div><!-- /.col-lg-6 -->
+ </div><!-- /.row -->
+ </form>
+{% highlight html %}
+<div class="row">
+ <div class="col-lg-6">
+ <div class="input-group">
+ <span class="input-group-btn">
+ <button class="btn btn-default" type="button">Go!</button>
+ </span>
+ <input type="text" class="form-control">
+ </div><!-- /input-group -->
+ </div><!-- /.col-lg-6 -->
+ <div class="col-lg-6">
+ <div class="input-group">
+ <input type="text" class="form-control">
+ <span class="input-group-btn">
+ <button class="btn btn-default" type="button">Go!</button>
+ </span>
+ </div><!-- /input-group -->
+ </div><!-- /.col-lg-6 -->
+</div><!-- /.row -->
+{% endhighlight %}
+
+ <h2 id="input-groups-buttons-dropdowns">Buttons with dropdowns</h2>
+ <p></p>
+ <form class="bs-example bs-example-form" role="form">
+ <div class="row">
+ <div class="col-lg-6">
+ <div class="input-group">
+ <div class="input-group-btn">
+ <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Action <span class="caret"></span></button>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ <input type="text" class="form-control">
+ </div><!-- /input-group -->
+ </div><!-- /.col-lg-6 -->
+ <div class="col-lg-6">
+ <div class="input-group">
+ <input type="text" class="form-control">
+ <div class="input-group-btn">
+ <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Action <span class="caret"></span></button>
+ <ul class="dropdown-menu pull-right">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ </div><!-- /input-group -->
+ </div><!-- /.col-lg-6 -->
+ </div><!-- /.row -->
+ </form>
+{% highlight html %}
+<div class="row">
+ <div class="col-lg-6">
+ <div class="input-group">
+ <div class="input-group-btn">
+ <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Action <span class="caret"></span></button>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ <input type="text" class="form-control">
+ </div><!-- /input-group -->
+ </div><!-- /.col-lg-6 -->
+ <div class="col-lg-6">
+ <div class="input-group">
+ <input type="text" class="form-control">
+ <div class="input-group-btn">
+ <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Action <span class="caret"></span></button>
+ <ul class="dropdown-menu pull-right">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div><!-- /btn-group -->
+ </div><!-- /input-group -->
+ </div><!-- /.col-lg-6 -->
+</div><!-- /.row -->
+{% endhighlight %}
+
+ <h2 id="input-groups-buttons-segmented">Segmented buttons</h2>
+ <form class="bs-example bs-example-form" role="form">
+ <div class="row">
+ <div class="col-lg-6">
+ <div class="input-group">
+ <div class="input-group-btn">
+ <button type="button" class="btn btn-default" tabindex="-1">Action</button>
+ <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" tabindex="-1">
+ <span class="caret"></span>
+ </button>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div>
+ <input type="text" class="form-control">
+ </div><!-- /.input-group -->
+ </div><!-- /.col-lg-6 -->
+ <div class="col-lg-6">
+ <div class="input-group">
+ <input type="text" class="form-control">
+ <div class="input-group-btn">
+ <button type="button" class="btn btn-default" tabindex="-1">Action</button>
+ <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" tabindex="-1">
+ <span class="caret"></span>
+ </button>
+ <ul class="dropdown-menu pull-right">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </div>
+ </div><!-- /.input-group -->
+ </div><!-- /.col-lg-6 -->
+ </div><!-- /.row -->
+ </form>
+{% highlight html %}
+<div class="input-group">
+ <div class="input-group-btn">
+ <!-- Button and dropdown menu -->
+ </div>
+ <input type="text" class="form-control">
+</div>
+
+<div class="input-group">
+ <input type="text" class="form-control">
+ <div class="input-group-btn btn-group">
+ <!-- Button and dropdown menu -->
+ </div>
+</div>
+{% endhighlight %}
+
+</div>
+
+
+
<!-- Navs
================================================== -->
<div class="bs-docs-section">
</ul>
{% endhighlight %}
- <h2>Options</h2>
- <h3 id="nav-justified">Justified links</h3>
+ <h2 id="nav-justified">Justified</h2>
<p>Easily make tabs or pills equal widths of their parent with <code>.nav-justified</code>.</p>
<div class="bs-example">
<ul class="nav nav-tabs nav-justified">
</ul>
{% endhighlight %}
- <h3 id="nav-disabled-links">Disabled state</h3>
+
+ <h2 id="nav-disabled-links">Disabled links</h2>
<p>For any nav component (tabs, pills, or list), add <code>.disabled</code> for <strong>gray links and no hover effects</strong>.</p>
<div class="bs-callout bs-callout-warning">
{% endhighlight %}
- <h3 id="nav-alignment">Component alignment</h3>
+ <h2 id="nav-alignment">Alignment options</h2>
<p>To align nav links, use the <code>.pull-left</code> or <code>.pull-right</code> utility classes. Both classes will add a CSS float in the specified direction.</p>
- <hr class="bs-docs-separator">
-
-
- <h2 id="nav-dropdowns">Dropdowns</h2>
+ <h2 id="nav-dropdowns">Using dropdowns</h2>
<p>Add dropdown menus with a little extra HTML and the <a href="../javascript/#dropdowns">dropdowns JavaScript plugin</a>.</p>
<h3>Tabs with dropdowns</h3>
<div class="bs-example">
- <ul class="nav nav-tabs">
- <li class="active"><a href="#">Home</a></li>
- <li><a href="#">Help</a></li>
- <li class="dropdown">
- <a class="dropdown-toggle" data-toggle="dropdown" href="#">
- Dropdown <span class="caret"></span>
- </a>
- <ul class="dropdown-menu">
- <li><a href="#">Action</a></li>
- <li><a href="#">Another action</a></li>
- <li><a href="#">Something else here</a></li>
- <li class="divider"></li>
- <li><a href="#">Separated link</a></li>
- </ul>
- </li>
- </ul>
+ <nav class="navbar" role="navigation">
+ <ul class="nav nav-tabs">
+ <li class="active"><a href="#">Home</a></li>
+ <li><a href="#">Help</a></li>
+ <li class="dropdown">
+ <a class="dropdown-toggle" data-toggle="dropdown" href="#">
+ Dropdown <span class="caret"></span>
+ </a>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </li>
+ </ul>
+ </nav>
</div>
{% highlight html %}
<ul class="nav nav-tabs">
<h1 id="navbar">Navbar</h1>
</div>
- <h2 id="navbar-basic">Basic navbar</h2>
- <p>To start, navbars are static (not fixed to the top) and include support for a project name and basic navigation. Place one anywhere within a <code>.container</code>, which sets the width of your site and content.</p>
- <div class="bs-example">
- <div class="navbar">
- <a class="navbar-brand" href="#">Title</a>
- <ul class="nav navbar-nav">
- <li class="active"><a href="#">Home</a></li>
- <li><a href="#">Link</a></li>
- <li><a href="#">Link</a></li>
- </ul>
- </div>
- </div><!-- /example -->
-{% highlight html %}
-<div class="navbar">
- <a class="navbar-brand" href="#">Title</a>
- <ul class="nav navbar-nav">
- <li class="active"><a href="#">Home</a></li>
- <li><a href="#">Link</a></li>
- <li><a href="#">Link</a></li>
- </ul>
-</div>
-{% endhighlight %}
+ <h2 id="navbar-default">Default navbar</h2>
+ <p>Navbars are responsive meta components that serve as navigation headers for your application or site. They begin collapsed (and are toggleable) in mobile views and become horizontal as the available viewport width increases.</p>
- <h2>Navbar components</h2>
+ <div class="bs-callout bs-callout-info">
+ <h4>Customize the collapsing point</h4>
+ <p>Depending on the content in your navbar, you might need to change the point at which your navbar switches between collapsed and horizontal mode. Customize the <code>@grid-float-breakpoint</code> variable or add your own media query.</p>
+ </div>
- <h3 id="navbar-brand">Brand</h3>
- <p>A simple link to show your brand or project name only requires an anchor tag.</p>
<div class="bs-example">
- <div class="navbar">
- <a class="navbar-brand" href="#">Title</a>
- </div>
- </div><!-- /example -->
+ <nav class="navbar" role="navigation">
+ <!-- Brand and toggle get grouped for better mobile display -->
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
+ <span class="sr-only">Toggle navigation</span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <a class="navbar-brand" href="#">Title</a>
+ </div>
+
+ <!-- Collect the nav links, forms, and other content for toggling -->
+ <div class="collapse navbar-collapse navbar-ex1-collapse">
+ <ul class="nav navbar-nav">
+ <li class="active"><a href="#">Home</a></li>
+ <li><a href="#">Link</a></li>
+ <li><a href="#">Link</a></li>
+ <li class="dropdown">
+ <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li><a href="#">Separated link</a></li>
+ <li><a href="#">One more separated link</a></li>
+ </ul>
+ </li>
+ </ul>
+ <form class="navbar-form navbar-left" role="search">
+ <div class="form-group">
+ <input type="text" class="form-control" placeholder="Search">
+ </div>
+ <button type="submit" class="btn btn-default">Submit</button>
+ </form>
+ <ul class="nav navbar-nav navbar-right">
+ <li><a href="#">Link</a></li>
+ <li class="dropdown">
+ <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </li>
+ </ul>
+ </div><!-- /.navbar-collapse -->
+ </nav>
+ </div>
{% highlight html %}
-<a class="navbar-brand" href="#">Title</a>
-{% endhighlight %}
+<nav class="navbar" role="navigation">
+ <!-- Brand and toggle get grouped for better mobile display -->
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
+ <span class="sr-only">Toggle navigation</span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <a class="navbar-brand" href="#">Title</a>
+ </div>
- <h3 id="navbar-nav">Nav links</h3>
- <p>Nav items are simple to add via unordered lists.</p>
- <div class="bs-example">
- <div class="navbar">
- <ul class="nav navbar-nav">
- <li class="active"><a href="#">Home</a></li>
- <li><a href="#">Link</a></li>
- <li class="disabled"><a href="#">Disabled</a></li>
+ <!-- Collect the nav links, forms, and other content for toggling -->
+ <div class="collapse navbar-collapse navbar-ex1-collapse">
+ <ul class="nav navbar-nav">
+ <li class="active"><a href="#">Home</a></li>
+ <li><a href="#">Link</a></li>
+ <li><a href="#">Link</a></li>
+ <li class="dropdown">
+ <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li><a href="#">Separated link</a></li>
+ <li><a href="#">One more separated link</a></li>
</ul>
- </div>
- </div><!-- /example -->
-{% highlight html %}
-<ul class="nav navbar-nav">
- <li class="active"><a href="#">Home</a></li>
- <li><a href="#">Link</a></li>
- <li class="disabled"><a href="#">Disabled</a></li>
-</ul>
+ </li>
+ </ul>
+ <form class="navbar-form navbar-left" role="search">
+ <div class="form-group">
+ <input type="text" class="form-control" placeholder="Search">
+ </div>
+ <button type="submit" class="btn btn-default">Submit</button>
+ </form>
+ <ul class="nav navbar-nav navbar-right">
+ <li><a href="#">Link</a></li>
+ <li class="dropdown">
+ <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li><a href="#">Separated link</a></li>
+ </ul>
+ </li>
+ </ul>
+ </div><!-- /.navbar-collapse -->
+</nav>
{% endhighlight %}
- <h3 id="navbar-forms">Forms</h3>
- <p>To properly style and position a form within the navbar, add the appropriate classes as shown below. For a default form, include <code>.navbar-form</code> and either <code>.pull-left</code> or <code>.pull-right</code> to properly align it.</p>
- <div class="bs-example">
-
- <div class="navbar">
- <form class="navbar-form pull-left">
- <input type="text" class="form-control" style="width: 200px;">
- <button type="submit" class="btn btn-default">Submit</button>
- </form>
- </div>
-
- <div class="navbar">
- <form class="navbar-form pull-left">
- <select name="" id="" class="form-control" style="width: 200px;">
- <option value="1">1</option>
- <option value="2">2</option>
- <option value="3">3</option>
- <option value="4">4</option>
- </select>
- <button type="submit" class="btn btn-default">Submit</button>
- </form>
- </div>
-
- <div class="navbar">
- <form class="navbar-form pull-left">
- <input type="text" class="form-control" style="width: 200px;">
- <input type="checkbox">
- <button type="submit" class="btn btn-default">Submit</button>
- </form>
- </div>
+<div class="bs-callout bs-callout-danger">
+ <h4>Plugin dependency</h4>
+ <p>The responsive navbar requires the <a href="../javascript/#collapse">collapse plugin</a> to be included in your version of Bootstrap.</p>
+</div>
- <div class="navbar">
- <form class="navbar-form pull-left">
- <input type="text" class="form-control" style="width: 200px;">
- <label class="checkbox-inline">
- <input type="checkbox"> Remember me
- </label>
- <button type="submit" class="btn btn-default">Submit</button>
- </form>
- </div>
+<div class="bs-callout bs-callout-warning">
+ <h4>Make navbars accessible</h4>
+ <p>Be sure to add a <code>role="navigation"</code> to every navbar to help with accessibility.</p>
+</div>
- </div><!-- /example -->
-{% highlight html %}
-<form class="navbar-form pull-left">
- <input type="text" class="form-control" style="width: 200px;">
- <button type="submit" class="btn btn-default">Submit</button>
-</form>
-{% endhighlight %}
- <h3 id="navbar-buttons">Buttons</h3>
+ <h2 id="navbar-buttons">Buttons</h2>
<p>For buttons not residing in a <code><form></code>, add this class to vertically center buttons within a navbar.</p>
<div class="bs-example">
- <div class="navbar">
- <a href="#" class="navbar-brand">Brand</a>
- <button type="button" class="btn btn-default navbar-btn">Sign in</button>
- </div>
+ <nav class="navbar" role="navigation">
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex2-collapse">
+ <span class="sr-only">Toggle navigation</span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <a class="navbar-brand" href="#">Title</a>
+ </div>
+ <div class="collapse navbar-collapse navbar-ex2-collapse">
+ <button type="button" class="btn btn-default navbar-btn">Sign in</button>
+ </div>
+ </nav>
</div>
{% highlight html %}
<button type="button" class="btn btn-default navbar-btn">Sign in</button>
{% endhighlight %}
- <h3 id="navbar-text">Text</h3>
+
+ <h2 id="navbar-text">Text</h2>
<p>Wrap strings of text in an element with <code>.navbar-text</code>, usually on a <code><p></code> tag for proper leading and color.</p>
<div class="bs-example">
- <div class="navbar">
- <a href="#" class="navbar-brand">Brand</a>
- <p class="navbar-text">Signed in as Mark Otto</p>
- </div>
+ <nav class="navbar" role="navigation">
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex3-collapse">
+ <span class="sr-only">Toggle navigation</span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <a class="navbar-brand" href="#">Title</a>
+ </div>
+ <div class="collapse navbar-collapse navbar-ex3-collapse">
+ <p class="navbar-text">Signed in as Mark Otto</p>
+ </div>
+ </nav>
</div>
{% highlight html %}
-<div class="navbar">
- <a href="#" class="navbar-brand">Brand</a>
- <p class="navbar-text">Signed in as Mark Otto</p>
-</div>
+<p class="navbar-text">Signed in as Mark Otto</p>
{% endhighlight %}
- <h3 id="navbar-links">Links</h3>
+
+ <h2 id="navbar-links">Non-nav links</h2>
<p>For folks using standard links that are not within the regular navbar navigation component, use the <code>.navbar-link</code> class to add the proper colors for the default and inverse navbar options.</p>
<div class="bs-example">
- <div class="navbar">
- <a href="#" class="navbar-brand">Brand</a>
- <p class="navbar-text pull-right">Signed in as <a href="#" class="navbar-link">Mark Otto</a></p>
- </div>
+ <nav class="navbar" role="navigation">
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex4-collapse">
+ <span class="sr-only">Toggle navigation</span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <a class="navbar-brand" href="#">Title</a>
+ </div>
+ <div class="collapse navbar-collapse navbar-ex4-collapse">
+ <p class="navbar-text pull-right">Signed in as <a href="#" class="navbar-link">Mark Otto</a></p>
+ </div>
+ </nav>
</div>
{% highlight html %}
-<div class="navbar">
- <a href="#" class="navbar-brand">Brand</a>
- <p class="navbar-text pull-right">Signed in as <a href="#" class="navbar-link">Mark Otto</a></p>
-</div>
+<p class="navbar-text pull-right">Signed in as <a href="#" class="navbar-link">Mark Otto</a></p>
{% endhighlight %}
- <h3 id="navbar-component-alignment">Component alignment</h3>
- <p>Align nav links, forms, buttons, or text, using the <code>.pull-left</code> or <code>.pull-right</code> utility classes. Both classes will add a CSS float in the specified direction. To align nav links, put them in a separate <code><ul></code> with the respective utility class applied.</p>
+ <h2 id="navbar-component-alignment">Component alignment</h2>
+ <p>Align nav links, forms, buttons, or text, using the <code>.navbar-left</code> or <code>.navbar-right</code> utility classes. Both classes will add a CSS float in the specified direction. For example, to align nav links, put them in a separate <code><ul></code> with the respective utility class applied.</p>
+ <p>These classes are mixin-ed versions of <code>.pull-left</code> and <code>.pull-right</code>, but they're scoped to media queries for easier handling of navbar components across device sizes.</p>
- <h2>Optional display variations</h2>
- <p>Fix the navbar to the top or bottom of the viewport with an additional class on the outermost div, <code>.navbar</code>. These will also remove rounded corners.</p>
- <h3 id="navbar-fixed-top">Fixed to top</h3>
+ <h2 id="navbar-fixed-top">Fixed to top</h2>
<p>Add <code>.navbar-fixed-top</code>.</p>
<div class="bs-example bs-navbar-top-example">
- <div class="navbar navbar-fixed-top">
- <div class="container" style="width: auto;">
+ <nav class="navbar navbar-fixed-top" role="navigation">
+ <!-- Brand and toggle get grouped for better mobile display -->
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex5-collapse">
+ <span class="sr-only">Toggle navigation</span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
<a class="navbar-brand" href="#">Title</a>
+ </div>
+
+ <!-- Collect the nav links, forms, and other content for toggling -->
+ <div class="collapse navbar-collapse navbar-ex5-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
</ul>
- </div>
- </div>
+ </div><!-- /.navbar-collapse -->
+ </nav>
</div><!-- /example -->
{% highlight html %}
-<div class="navbar navbar-fixed-top">
+<nav class="navbar navbar-fixed-top" role="navigation">
...
-</div>
+</nav>
{% endhighlight %}
<div class="bs-callout bs-callout-danger">
<p>Make sure to include this <strong>after</strong> the core Bootstrap CSS.</p>
</div>
- <h3 id="navbar-fixed-bottom">Fixed to bottom</h3>
+
+ <h2 id="navbar-fixed-bottom">Fixed to bottom</h2>
<p>Add <code>.navbar-fixed-bottom</code> instead.</p>
<div class="bs-example bs-navbar-bottom-example">
- <div class="navbar navbar-fixed-bottom">
- <div class="container" style="width: auto;">
+ <nav class="navbar navbar-fixed-bottom" role="navigation">
+ <!-- Brand and toggle get grouped for better mobile display -->
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex6-collapse">
+ <span class="sr-only">Toggle navigation</span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
<a class="navbar-brand" href="#">Title</a>
+ </div>
+
+ <!-- Collect the nav links, forms, and other content for toggling -->
+ <div class="collapse navbar-collapse navbar-ex6-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
</ul>
- </div>
- </div>
+ </div><!-- /.navbar-collapse -->
+ </nav>
</div><!-- /example -->
{% highlight html %}
-<div class="navbar navbar-fixed-bottom">
+<nav class="navbar navbar-fixed-bottom" role="navigation">
...
-</div>
+</nav>
{% endhighlight %}
<div class="bs-callout bs-callout-danger">
<p>Make sure to include this <strong>after</strong> the core Bootstrap CSS.</p>
</div>
- <h3 id="navbar-static-top">Static top navbar</h3>
+
+ <h2 id="navbar-static-top">Static top</h2>
<p>Create a full-width navbar that scrolls away with the page by adding <code>.navbar-static-top</code>. Unlike the <code>.navbar-fixed-*</code> classes, you do not need to change any padding on the <code>body</code>.</p>
<div class="bs-example bs-navbar-top-example">
- <div class="navbar navbar-static-top" style="margin: -1px -1px 0;">
- <div class="container" style="width: auto;">
+ <nav class="navbar navbar-static-top" role="navigation">
+ <!-- Brand and toggle get grouped for better mobile display -->
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex7-collapse">
+ <span class="sr-only">Toggle navigation</span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
<a class="navbar-brand" href="#">Title</a>
+ </div>
+
+ <!-- Collect the nav links, forms, and other content for toggling -->
+ <div class="collapse navbar-collapse navbar-ex7-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
</ul>
- </div>
- </div>
+ </div><!-- /.navbar-collapse -->
+ </nav>
</div><!-- /example -->
{% highlight html %}
-<div class="navbar navbar-static-top">
+<nav class="navbar navbar-static-top" role="navigation">
...
-</div>
-{% endhighlight %}
-
-
- <h2 id="navbar-responsive">Responsive navbar</h2>
- <p>To implement a collapsing responsive navbar, wrap your navbar content in a containing div, <code>.nav-collapse.collapse</code>, and add the navbar toggle button, <code>.navbar-toggle</code>.</p>
- <div class="bs-example">
- <div class="navbar">
- <div class="container">
- <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse">
- <span class="icon-bar"></span>
- <span class="icon-bar"></span>
- <span class="icon-bar"></span>
- </button>
- <a class="navbar-brand" href="#">Title</a>
- <div class="nav-collapse collapse navbar-responsive-collapse">
- <ul class="nav navbar-nav">
- <li class="active"><a href="#">Home</a></li>
- <li><a href="#">Link</a></li>
- <li><a href="#">Link</a></li>
- <li class="dropdown">
- <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
- <ul class="dropdown-menu">
- <li><a href="#">Action</a></li>
- <li><a href="#">Another action</a></li>
- <li><a href="#">Something else here</a></li>
- <li class="divider"></li>
- <li class="dropdown-header">Dropdown header</li>
- <li><a href="#">Separated link</a></li>
- <li><a href="#">One more separated link</a></li>
- </ul>
- </li>
- </ul>
- <form class="navbar-form pull-left" action="">
- <input type="text" class="form-control col-lg-8" placeholder="Search">
- </form>
- <ul class="nav navbar-nav pull-right">
- <li><a href="#">Link</a></li>
- <li class="dropdown">
- <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
- <ul class="dropdown-menu">
- <li><a href="#">Action</a></li>
- <li><a href="#">Another action</a></li>
- <li><a href="#">Something else here</a></li>
- <li class="divider"></li>
- <li><a href="#">Separated link</a></li>
- </ul>
- </li>
- </ul>
- </div><!-- /.nav-collapse -->
- </div><!-- /.container -->
- </div><!-- /.navbar -->
- </div><!-- /example -->
-{% highlight html %}
-<div class="navbar">
- <div class="container">
-
- <!-- .navbar-toggle is used as the toggle for collapsed navbar content -->
- <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse">
- <span class="icon-bar"></span>
- <span class="icon-bar"></span>
- <span class="icon-bar"></span>
- </button>
-
- <!-- Be sure to leave the brand out there if you want it shown -->
- <a class="navbar-brand" href="#">Title</a>
-
- <!-- Place everything within .navbar-collapse to hide it until above 768px -->
- <div class="nav-collapse collapse navbar-responsive-collapse">
- ...
- </div><!-- /.nav-collapse -->
- </div><!-- /.container -->
-</div><!-- /.navbar -->
+</nav>
{% endhighlight %}
- <div class="bs-callout bs-callout-danger">
- <h4>Plugin dependency</h4>
- <p>The responsive navbar requires the <a href="../javascript/#collapse">collapse plugin</a> to be included in your version of Bootstrap.</p>
- </div>
-
- <h2>Inverted variation</h2>
+ <h2 id="navbar-inverted">Inverted navbar</h2>
<p>Modify the look of the navbar by adding <code>.navbar-inverse</code>.</p>
<div class="bs-example">
- <div class="navbar navbar-inverse">
- <div class="container">
- <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-inverse-collapse">
+ <nav class="navbar navbar-inverse" role="navigation">
+ <!-- Brand and toggle get grouped for better mobile display -->
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex8-collapse">
+ <span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Title</a>
- <div class="nav-collapse collapse navbar-inverse-collapse">
- <ul class="nav navbar-nav">
- <li class="active"><a href="#">Home</a></li>
- <li><a href="#">Link</a></li>
- <li><a href="#">Link</a></li>
- <li class="dropdown">
- <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
- <ul class="dropdown-menu">
- <li><a href="#">Action</a></li>
- <li><a href="#">Another action</a></li>
- <li><a href="#">Something else here</a></li>
- <li class="divider"></li>
- <li class="dropdown-header">Dropdown header</li>
- <li><a href="#">Separated link</a></li>
- <li><a href="#">One more separated link</a></li>
- </ul>
- </li>
- </ul>
- <form class="navbar-form pull-left" action="">
- <input type="text" class="form-control col-lg-8" placeholder="Search">
- </form>
- <ul class="nav navbar-nav pull-right">
- <li><a href="#">Link</a></li>
- <li class="dropdown">
- <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
- <ul class="dropdown-menu">
- <li><a href="#">Action</a></li>
- <li><a href="#">Another action</a></li>
- <li><a href="#">Something else here</a></li>
- <li class="divider"></li>
- <li><a href="#">Separated link</a></li>
- </ul>
- </li>
- </ul>
- </div><!-- /.nav-collapse -->
- </div><!-- /.container -->
- </div><!-- /.navbar -->
+ </div>
+
+ <!-- Collect the nav links, forms, and other content for toggling -->
+ <div class="collapse navbar-collapse navbar-ex8-collapse">
+ <ul class="nav navbar-nav">
+ <li class="active"><a href="#">Home</a></li>
+ <li><a href="#">Link</a></li>
+ <li><a href="#">Link</a></li>
+ </ul>
+ </div><!-- /.navbar-collapse -->
+ </nav>
</div><!-- /example -->
{% highlight html %}
-<div class="navbar navbar-inverse">
+<nav class="navbar navbar-inverse" role="navigation">
...
-</div>
+</nav>
{% endhighlight %}
</div>
<p class="lead">Indicate the current page's location within a navigational hierarchy.</p>
<p>Separators are automatically added in CSS through <code>:before</code> and <code>content</code>.</p>
<div class="bs-example">
- <ul class="breadcrumb">
+ <ol class="breadcrumb">
<li class="active">Home</li>
- </ul>
- <ul class="breadcrumb">
+ </ol>
+ <ol class="breadcrumb">
<li><a href="#">Home</a></li>
<li class="active">Library</li>
- </ul>
- <ul class="breadcrumb" style="margin-bottom: 5px;">
+ </ol>
+ <ol class="breadcrumb" style="margin-bottom: 5px;">
<li><a href="#">Home</a></li>
<li><a href="#">Library</a></li>
<li class="active">Data</li>
- </ul>
+ </ol>
</div>
{% highlight html %}
-<ul class="breadcrumb">
+<ol class="breadcrumb">
<li><a href="#">Home</a></li>
<li><a href="#">Library</a></li>
<li class="active">Data</li>
-</ul>
+</ol>
{% endhighlight %}
</div>
</div>
<p class="lead">Provide pagination links for your site or app with the multi-page pagination component, or the simpler <a href="#pagination-pager">pager alternative</a>.</p>
- <h2 id="pagination-default">Standard pagination</h2>
+ <h2 id="pagination-default">Default pagination</h2>
<p>Simple pagination inspired by Rdio, great for apps and search results. The large block is hard to miss, easily scalable, and provides large click areas.</p>
<div class="bs-example">
<ul class="pagination">
<div class="bs-example">
<ul class="pagination">
<li class="disabled"><a href="#">«</a></li>
- <li class="active"><a href="#">1</a></li>
+ <li class="active"><a href="#">1 <span class="sr-only">(current)</span></a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
{% highlight html %}
<ul class="pagination">
<li class="disabled"><a href="#">«</a></li>
- <li class="active"><a href="#">1</a></li>
+ <li class="active"><a href="#">1 <span class="sr-only">(current)</span></a></li>
...
</ul>
{% endhighlight %}
{% highlight html %}
<ul class="pagination">
<li class="disabled"><span>«</span></li>
- <li class="active"><span>1</span></li>
+ <li class="active"><span>1 <span class="sr-only">(current)</span></span></li>
...
</ul>
{% endhighlight %}
- <h3>Sizes</h3>
- <p>Fancy larger or smaller pagination? Add <code>.pagination-large</code> or <code>.pagination-small</code> for additional sizes.</p>
+ <h3>Sizing</h3>
+ <p>Fancy larger or smaller pagination? Add <code>.pagination-lg</code> or <code>.pagination-sm</code> for additional sizes.</p>
<div class="bs-example">
<div>
- <ul class="pagination pagination-large">
+ <ul class="pagination pagination-lg">
<li><a href="#">«</a></li>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
</ul>
</div>
<div>
- <ul class="pagination pagination-small">
+ <ul class="pagination pagination-sm">
<li><a href="#">«</a></li>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
</div>
</div>
{% highlight html %}
-<ul class="pagination pagination-large">...</ul>
-<ul class="pagination pagination">...</ul>
-<ul class="pagination pagination-small">...</ul>
+<ul class="pagination pagination-lg">...</ul>
+<ul class="pagination">...</ul>
+<ul class="pagination pagination-sm">...</ul>
{% endhighlight %}
<h3>Example</h3>
<div class="bs-example">
- <h1>Example heading <span class="label">New</span></h1>
- <h2>Example heading <span class="label">New</span></h2>
- <h3>Example heading <span class="label">New</span></h3>
- <h4>Example heading <span class="label">New</span></h4>
- <h5>Example heading <span class="label">New</span></h5>
- <h6>Example heading <span class="label">New</span></h6>
+ <h1>Example heading <span class="label label-default">New</span></h1>
+ <h2>Example heading <span class="label label-default">New</span></h2>
+ <h3>Example heading <span class="label label-default">New</span></h3>
+ <h4>Example heading <span class="label label-default">New</span></h4>
+ <h5>Example heading <span class="label label-default">New</span></h5>
+ <h6>Example heading <span class="label label-default">New</span></h6>
</div>
{% highlight html %}
-<h3>Example heading <span class="label">New</span></h3>
+<h3>Example heading <span class="label label-default">New</span></h3>
{% endhighlight %}
<h3>Available variations</h3>
<p>Add any of the below mentioned modifier classes to change the appearance of a label.</p>
<div class="bs-example">
- <span class="label">Default</span>
+ <span class="label label-default">Default</span>
+ <span class="label label-primary">Primary</span>
<span class="label label-success">Success</span>
+ <span class="label label-info">Info</span>
<span class="label label-warning">Warning</span>
<span class="label label-danger">Danger</span>
- <span class="label label-info">Info</span>
</div>
{% highlight html %}
-<span class="label">Default</span>
+<span class="label label-default">Default</span>
+<span class="label label-primary">Primary</span>
<span class="label label-success">Success</span>
+<span class="label label-info">Info</span>
<span class="label label-warning">Warning</span>
<span class="label label-danger">Danger</span>
-<span class="label label-info">Info</span>
{% endhighlight %}
</div>
- <!-- Typographic components
+ <!-- Jumbotron
================================================== -->
<div class="bs-docs-section">
<div class="page-header">
- <h1 id="type-components">Typographic components</h1>
+ <h1 id="jumbotron">Jumbotron</h1>
</div>
-
- <h2 id="type-components-jumbotron">Jumbotron</h2>
<p>A lightweight, flexible component to showcase key content on your site. It works well on marketing and content-heavy sites.</p>
<div class="bs-example">
<div class="jumbotron">
<h1>Hello, world!</h1>
<p>This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p>
- <p><a class="btn btn-primary btn-large">Learn more</a></p>
+ <p><a class="btn btn-primary btn-lg">Learn more</a></p>
</div>
</div>
{% highlight html %}
<div class="jumbotron">
<h1>Hello, world!</h1>
<p>...</p>
- <p><a class="btn btn-primary btn-large">Learn more</a></p>
+ <p><a class="btn btn-primary btn-lg">Learn more</a></p>
</div>
{% endhighlight %}
+ </div>
+
- <h2 id="type-components-page-header">Page header</h2>
+
+ <!-- Page header
+ ================================================== -->
+ <div class="bs-docs-section">
+ <div class="page-header">
+ <h1 id="page-header">Page header</h1>
+ </div>
<p>A simple shell for an <code>h1</code> to appropriately space out and segment sections of content on a page. It can utilize the <code>h1</code>'s default <code>small</code> element, as well as most other components (with additional styles).</p>
<div class="bs-example">
<div class="page-header">
</div>
<p class="lead">Extend Bootstrap's <a href="../css/#grid">grid system</a> with the thumbnail component to easily display grids of images, videos, text, and more.</p>
- <h3>Default thumbnails</h3>
+ <h3 id="thumbnails-default">Default example</h3>
<p>By default, Bootstrap's thumbnails are designed to showcase linked images with minimal required markup.</p>
<div class="bs-example">
<div class="row">
<div class="col-lg-3">
<a href="#" class="thumbnail">
- <img data-src="holder.js/100%x180" alt="">
+ <img data-src="holder.js/100%x180" alt="Generic placeholder thumbnail" src="data:image/png;base64,">
</a>
</div>
<div class="col-lg-3">
<a href="#" class="thumbnail">
- <img data-src="holder.js/100%x180" alt="">
+ <img data-src="holder.js/100%x180" alt="Generic placeholder thumbnail" src="data:image/png;base64,">
</a>
</div>
<div class="col-lg-3">
<a href="#" class="thumbnail">
- <img data-src="holder.js/100%x180" alt="">
+ <img data-src="holder.js/100%x180" alt="Generic placeholder thumbnail" src="data:image/png;base64,">
</a>
</div>
<div class="col-lg-3">
<a href="#" class="thumbnail">
- <img data-src="holder.js/100%x180" alt="">
+ <img data-src="holder.js/100%x180" alt="Generic placeholder thumbnail" src="data:image/png;base64,">
</a>
</div>
</div>
<div class="row">
<div class="col-lg-3">
<a href="#" class="thumbnail">
- <img data-src="holder.js/100%x180" alt="">
+ <img data-src="holder.js/100%x180" alt="...">
</a>
</div>
...
</div>
{% endhighlight %}
- <h3>Custom content thumbnails</h3>
+ <h3 id="thumbnails-custom-content">Custom content</h3>
<p>With a bit of extra markup, it's possible to add any kind of HTML content like headings, paragraphs, or buttons into thumbnails.</p>
<div class="bs-example">
<div class="row">
<div class="col-lg-4">
<div class="thumbnail">
- <img data-src="holder.js/300x200" alt="">
+ <img data-src="holder.js/300x200" alt="Generic placeholder thumbnail" src="data:image/png;base64,">
<div class="caption">
<h3>Thumbnail label</h3>
<p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
</div>
<div class="col-lg-4">
<div class="thumbnail">
- <img data-src="holder.js/300x200" alt="">
+ <img data-src="holder.js/300x200" alt="Generic placeholder thumbnail" src="data:image/png;base64,">
<div class="caption">
<h3>Thumbnail label</h3>
<p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
</div>
<div class="col-lg-4">
<div class="thumbnail">
- <img data-src="holder.js/300x200" alt="">
+ <img data-src="holder.js/300x200" alt="Generic placeholder thumbnail" src="data:image/png;base64,">
<div class="caption">
<h3>Thumbnail label</h3>
<p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
</div><!-- /.bs-example -->
{% highlight html %}
<div class="row">
- <div class="col-lg-3">
+ <div class="col-lg-4">
<div class="thumbnail">
- <img data-src="holder.js/300x200" alt="">
+ <img data-src="holder.js/300x200" alt="...">
<div class="caption">
<h3>Thumbnail label</h3>
<p>...</p>
</div>
<p class="lead">Provide contextual feedback messages for typical user actions with the handful of available and flexible alert messages. For inline dismissal, use the <a href="../javascript/#js-alerts">alerts jQuery plugin</a>.</p>
- <h3 id="alerts-default">Default alert</h3>
+ <h2 id="alerts-default">Default alert</h2>
<p>Wrap any text and an optional dismiss button in <code>.alert</code> for a basic warning alert message.</p>
- <div class="bs-callout bs-callout-warning">
- <h4>Ensure proper behavior across all devices</h4>
- <p>Be sure to use the <code><button></code> element with the <code>data-dismiss="alert"</code> data attribute.</p>
- </div>
-
<div class="bs-example">
<div class="alert">
- <button type="button" class="close" data-dismiss="alert">×</button>
<strong>Warning!</strong> Best check yo self, you're not looking too good.
</div>
</div>
{% highlight html %}
<div class="alert">
- <button type="button" class="close" data-dismiss="alert">×</button>
<strong>Warning!</strong> Best check yo self, you're not looking too good.
</div>
{% endhighlight %}
- <h3 id="alerts-block">Block alerts</h3>
- <p>For longer messages, increase the padding on the top and bottom of the alert wrapper by adding <code>.alert-block</code>.</p>
- <div class="bs-example">
- <div class="alert alert-block">
- <button type="button" class="close" data-dismiss="alert">×</button>
- <h4>Warning!</h4>
- <p>Best check yo self, you're not looking too good. Nulla vitae elit libero, a pharetra augue. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
- </div>
- </div>
-{% highlight html %}
-<div class="alert alert-block">
- <button type="button" class="close" data-dismiss="alert">×</button>
- <h4>Warning!</h4>
- <p>...</p>
-</div>
-{% endhighlight %}
-
- <h3 id="alerts-alternatives">Contextual alternatives</h3>
+ <h2 id="alerts-alternatives">Contextual alternatives</h2>
<p>Add optional classes to change an alert's connotation.</p>
<div class="bs-example">
- <div class="alert alert-danger">
- <button type="button" class="close" data-dismiss="alert">×</button>
- <strong>Oh snap!</strong> Change a few things up and try submitting again.
- </div>
<div class="alert alert-success">
- <button type="button" class="close" data-dismiss="alert">×</button>
<strong>Well done!</strong> You successfully read this important alert message.
</div>
<div class="alert alert-info">
- <button type="button" class="close" data-dismiss="alert">×</button>
<strong>Heads up!</strong> This alert needs your attention, but it's not super important.
</div>
+ <div class="alert alert-danger">
+ <strong>Oh snap!</strong> Change a few things up and try submitting again.
+ </div>
</div>
{% highlight html %}
-<div class="alert alert-danger">...</div>
<div class="alert alert-success">...</div>
<div class="alert alert-info">...</div>
+<div class="alert alert-danger">...</div>
+{% endhighlight %}
+
+ <h2 id="alerts-dismissable">Dismissable alerts</h2>
+ <p>Build on any alert by adding an optional <code>.alert-dismissable</code> and close button.</p>
+ <div class="bs-example">
+ <div class="alert alert-dismissable">
+ <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
+ <strong>Warning!</strong> Best check yo self, you're not looking too good.
+ </div>
+ </div>
+{% highlight html %}
+<div class="alert alert-dismissable">
+ <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
+ <strong>Warning!</strong> Best check yo self, you're not looking too good.
+</div>
{% endhighlight %}
- <h3 id="alerts-links">Links in alerts</h3>
+ <div class="bs-callout bs-callout-warning">
+ <h4>Ensure proper behavior across all devices</h4>
+ <p>Be sure to use the <code><button></code> element with the <code>data-dismiss="alert"</code> data attribute.</p>
+ </div>
+
+ <h2 id="alerts-links">Links in alerts</h2>
<p>Use the <code>.alert-link</code> utility class to quickly provide matching colored links within any alert.</p>
<div class="bs-example">
<div class="alert alert-danger">
- <button type="button" class="close" data-dismiss="alert">×</button>
<strong>Oh snap!</strong> <a href="#" class="alert-link">Change a few things up</a> and try submitting again.
</div>
<div class="alert alert-success">
- <button type="button" class="close" data-dismiss="alert">×</button>
<strong>Well done!</strong> You successfully read <a href="#" class="alert-link">this important alert message</a>.
</div>
<div class="alert alert-info">
- <button type="button" class="close" data-dismiss="alert">×</button>
<strong>Heads up!</strong> This <a href="#" class="alert-link">alert needs your attention</a>, but it's not super important.
</div>
</div>
<p>Progress bars use CSS3 transitions and animations to achieve some of their effects. These features are not supported in Internet Explorer 9 and below or older versions of Firefox. Opera 12 does not support animations.</p>
</div>
- <h3 id="progress-basic">Basic</h3>
+ <h3 id="progress-basic">Basic example</h3>
<p>Default progress bar with a vertical gradient.</p>
<div class="bs-example">
<div class="progress">
- <div class="progress-bar" style="width: 60%;"></div>
+ <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"><span class="sr-only">60% Complete</span></div>
</div>
</div>
{% highlight html %}
<div class="progress">
- <div class="progress-bar" style="width: 60%;"></div>
+ <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"><span class="sr-only">60% Complete</span></div>
</div>
{% endhighlight %}
<h3 id="progress-alternatives">Contextual alternatives</h3>
<p>Progress bars use some of the same button and alert classes for consistent styles.</p>
<div class="bs-example">
- <div class="progress" style="margin-bottom: 9px;">
- <div class="progress-bar progress-bar-info" style="width: 20%"></div>
+ <div class="progress">
+ <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: 40%"><span class="sr-only">40% Complete (success)</span></div>
</div>
- <div class="progress" style="margin-bottom: 9px;">
- <div class="progress-bar progress-bar-success" style="width: 40%"></div>
+ <div class="progress">
+ <div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="width: 20%"><span class="sr-only">20% Complete</span></div>
</div>
- <div class="progress" style="margin-bottom: 9px;">
- <div class="progress-bar progress-bar-warning" style="width: 60%"></div>
+ <div class="progress">
+ <div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%"><span class="sr-only">60% Complete (warning)</span></div>
</div>
<div class="progress">
- <div class="progress-bar progress-bar-danger" style="width: 80%"></div>
+ <div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width: 80%"><span class="sr-only">80% Complete (danger)</span></div>
</div>
</div>
{% highlight html %}
<div class="progress">
- <div class="progress-bar progress-bar-info" style="width: 20%"></div>
+ <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: 40%">
+ <span class="sr-only">40% Complete (success)</span>
+ </div>
</div>
<div class="progress">
- <div class="progress-bar progress-bar-success" style="width: 40%"></div>
+ <div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="width: 20%">
+ <span class="sr-only">20% Complete</span>
+ </div>
</div>
<div class="progress">
- <div class="progress-bar progress-bar-warning" style="width: 60%"></div>
+ <div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%">
+ <span class="sr-only">60% Complete (warning)</span>
+ </div>
</div>
<div class="progress">
- <div class="progress-bar progress-bar-danger" style="width: 80%"></div>
+ <div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width: 80%">
+ <span class="sr-only">80% Complete</span>
+ </div>
</div>
{% endhighlight %}
<h3 id="progress-striped">Striped</h3>
<p>Uses a gradient to create a striped effect. Not available in IE8.</p>
<div class="bs-example">
- <div class="progress progress-striped" style="margin-bottom: 9px;">
- <div class="progress-bar progress-bar-info" style="width: 20%"></div>
+ <div class="progress progress-striped" >
+ <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: 40%"><span class="sr-only">40% Complete (success)</span></div>
</div>
- <div class="progress progress-striped" style="margin-bottom: 9px;">
- <div class="progress-bar progress-bar-success" style="width: 40%"></div>
+ <div class="progress progress-striped">
+ <div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="width: 20%"><span class="sr-only">20% Complete</span></div>
</div>
- <div class="progress progress-striped" style="margin-bottom: 9px;">
- <div class="progress-bar progress-bar-warning" style="width: 60%"></div>
+ <div class="progress progress-striped">
+ <div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%"><span class="sr-only">60% Complete (warning)</span></div>
</div>
<div class="progress progress-striped">
- <div class="progress-bar progress-bar-danger" style="width: 80%"></div>
+ <div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width: 80%"><span class="sr-only">80% Complete (danger)</span></div>
</div>
</div>
{% highlight html %}
<div class="progress progress-striped">
- <div class="progress-bar progress-bar-info" style="width: 20%"></div>
+ <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: 40%">
+ <span class="sr-only">40% Complete (success)</span>
+ </div>
</div>
<div class="progress progress-striped">
- <div class="progress-bar progress-bar-success" style="width: 40%"></div>
+ <div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="width: 20%">
+ <span class="sr-only">20% Complete</span>
+ </div>
</div>
<div class="progress progress-striped">
- <div class="progress-bar progress-bar-warning" style="width: 60%"></div>
+ <div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%">
+ <span class="sr-only">60% Complete (warning)</span>
+ </div>
</div>
<div class="progress progress-striped">
- <div class="progress-bar progress-bar-danger" style="width: 80%"></div>
+ <div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width: 80%">
+ <span class="sr-only">80% Complete (danger)</span>
+ </div>
</div>
{% endhighlight %}
<p>Add <code>.active</code> to <code>.progress-striped</code> to animate the stripes right to left. Not available in all versions of IE.</p>
<div class="bs-example">
<div class="progress progress-striped active">
- <div class="progress-bar" style="width: 45%"></div>
+ <div class="progress-bar" role="progressbar" aria-valuenow="45" aria-valuemin="0" aria-valuemax="100" style="width: 45%"><span class="sr-only">45% Complete</span></div>
</div>
</div>
{% highlight html %}
<div class="progress progress-striped active">
- <div class="progress-bar" style="width: 45%"></div>
+ <div class="progress-bar" role="progressbar" aria-valuenow="45" aria-valuemin="0" aria-valuemax="100" style="width: 45%">
+ <span class='sr-only'>45% Complete</span>
+ </div>
</div>
{% endhighlight %}
<p>Place multiple bars into the same <code>.progress</code> to stack them.</p>
<div class="bs-example">
<div class="progress">
- <div class="progress-bar progress-bar-success" style="width: 35%"></div>
- <div class="progress-bar progress-bar-warning" style="width: 20%"></div>
- <div class="progress-bar progress-bar-danger" style="width: 10%"></div>
+ <div class="progress-bar progress-bar-success" style="width: 35%"><span class="sr-only">35% Complete (success)</span></div>
+ <div class="progress-bar progress-bar-warning" style="width: 20%"><span class="sr-only">20% Complete (warning)</span></div>
+ <div class="progress-bar progress-bar-danger" style="width: 10%"><span class='sr-only'>10% Complete (danger)</span></div>
</div>
</div>
{% highlight html %}
<div class="progress">
- <div class="progress-bar progress-bar-success" style="width: 35%"></div>
- <div class="progress-bar progress-bar-warning" style="width: 20%"></div>
- <div class="progress-bar progress-bar-danger" style="width: 10%"></div>
+ <div class="progress-bar progress-bar-success" style="width: 35%"><span class="sr-only">35% Complete (success)</span></div>
+ <div class="progress-bar progress-bar-warning" style="width: 20%"><span class="sr-only">20% Complete (warning)</span></div>
+ <div class="progress-bar progress-bar-danger" style="width: 10%"><span class="sr-only">10% Complete (danger)</span></div>
</div>
{% endhighlight %}
</div>
</div>
<p class="lead">Abstract object styles for building various types of components (like blog comments, Tweets, etc) that feature a left- or right-aligned image alongside textual content.</p>
- <h3>Default example</h3>
+ <h3 id="media-default">Default media</h3>
<p>The default media allow to float a media object (images, video, audio) to the left or right of a content block.</p>
<div class="bs-example">
<div class="media">
<a class="pull-left" href="#">
- <img class="media-object" data-src="holder.js/64x64">
+ <img class="media-object" data-src="holder.js/64x64" alt="Generic placeholder image" src="data:image/png;base64,">
</a>
<div class="media-body">
<h4 class="media-heading">Media heading</h4>
</div>
<div class="media">
<a class="pull-left" href="#">
- <img class="media-object" data-src="holder.js/64x64">
+ <img class="media-object" data-src="holder.js/64x64" alt="Generic placeholder image" src="data:image/png;base64,">
</a>
<div class="media-body">
<h4 class="media-heading">Media heading</h4>
Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis. Fusce condimentum nunc ac nisi vulputate fringilla. Donec lacinia congue felis in faucibus.
<div class="media">
<a class="pull-left" href="#">
- <img class="media-object" data-src="holder.js/64x64">
+ <img class="media-object" data-src="holder.js/64x64" alt="Generic placeholder image" src="data:image/png;base64,">
</a>
<div class="media-body">
<h4 class="media-heading">Media heading</h4>
{% highlight html %}
<div class="media">
<a class="pull-left" href="#">
- <img class="media-object" src="...">
+ <img class="media-object" src="..." alt="...">
</a>
<div class="media-body">
<h4 class="media-heading">Media heading</h4>
</div>
{% endhighlight %}
- <h3>Media list</h3>
+ <h3 id="media-list">Media list</h3>
<p>With a bit of extra markup, you can use media inside list (useful for comment threads or articles lists).</p>
<div class="bs-example">
<ul class="media-list">
<li class="media">
<a class="pull-left" href="#">
- <img class="media-object" data-src="holder.js/64x64">
+ <img class="media-object" data-src="holder.js/64x64" alt="Generic placeholder image" src="data:image/png;base64,">
</a>
<div class="media-body">
<h4 class="media-heading">Media heading</h4>
<!-- Nested media object -->
<div class="media">
<a class="pull-left" href="#">
- <img class="media-object" data-src="holder.js/64x64">
+ <img class="media-object" data-src="holder.js/64x64" alt="Generic placeholder image" src="data:image/png;base64,">
</a>
<div class="media-body">
<h4 class="media-heading">Nested media heading</h4>
<!-- Nested media object -->
<div class="media">
<a class="pull-left" href="#">
- <img class="media-object" data-src="holder.js/64x64">
+ <img class="media-object" data-src="holder.js/64x64" alt="Generic placeholder image" src="data:image/png;base64,">
</a>
<div class="media-body">
<h4 class="media-heading">Nested media heading</h4>
<!-- Nested media object -->
<div class="media">
<a class="pull-left" href="#">
- <img class="media-object" data-src="holder.js/64x64">
+ <img class="media-object" data-src="holder.js/64x64" alt="Generic placeholder image" src="data:image/png;base64,">
</a>
<div class="media-body">
<h4 class="media-heading">Nested media heading</h4>
</li>
<li class="media">
<a class="pull-right" href="#">
- <img class="media-object" data-src="holder.js/64x64">
+ <img class="media-object" data-src="holder.js/64x64" alt="Generic placeholder image" src="data:image/png;base64,">
</a>
<div class="media-body">
<h4 class="media-heading">Media heading</h4>
<ul class="media-list">
<li class="media">
<a class="pull-left" href="#">
- <img class="media-object" src="...">
+ <img class="media-object" src="..." alt="...">
</a>
<div class="media-body">
<h4 class="media-heading">Media heading</h4>
-
-
<!-- List group
================================================== -->
<div class="bs-docs-section">
</div>
<p class="lead">List groups are a flexible and powerful component for displaying not only simple lists of elements, but complex ones with custom content.</p>
- <h3 id="list-group-basic">Basic list group</h3>
+ <h3 id="list-group-basic">Basic example</h3>
<p>The most basic list group is simply an unordered list with list items, and the proper classes. Build upon it with the options that follow, or your own CSS as needed.</p>
<div class="bs-example">
<ul class="list-group">
</ul>
{% endhighlight %}
- <h3 id="list-group-badges">With badges</h3>
+ <h3 id="list-group-badges">Badges</h3>
<p>Add the badges component to any list group item and it will automatically be positioned on the right.</p>
<div class="bs-example">
<ul class="list-group">
</ul>
{% endhighlight %}
- <h3 id="list-group-linked">Linked list group</h3>
+ <h3 id="list-group-linked">Linked items</h3>
<p>Linkify list group items by using anchor tags instead of list items (that also means a parent <code><div></code> instead of an <code><ul></code>). No need for individual parents around each element.</p>
<div class="bs-example">
<div class="list-group">
<a href="#" class="list-group-item active">
Cras justo odio
</a>
- <a href="#" class="list-group-item">Dapibus ac facilisis in
- </a>
- <a href="#" class="list-group-item">Morbi leo risus
- </a>
- <a href="#" class="list-group-item">Porta ac consectetur ac
- </a>
- <a href="#" class="list-group-item">Vestibulum at eros
- </a>
+ <a href="#" class="list-group-item">Dapibus ac facilisis in</a>
+ <a href="#" class="list-group-item">Morbi leo risus</a>
+ <a href="#" class="list-group-item">Porta ac consectetur ac</a>
+ <a href="#" class="list-group-item">Vestibulum at eros</a>
</div>
</div>
{% highlight html %}
<a href="#" class="list-group-item active">
Cras justo odio
</a>
- <a href="#" class="list-group-item">Dapibus ac facilisis in
- </a>
- <a href="#" class="list-group-item">Morbi leo risus
- </a>
- <a href="#" class="list-group-item">Porta ac consectetur ac
- </a>
- <a href="#" class="list-group-item">Vestibulum at eros
- </a>
+ <a href="#" class="list-group-item">Dapibus ac facilisis in</a>
+ <a href="#" class="list-group-item">Morbi leo risus</a>
+ <a href="#" class="list-group-item">Porta ac consectetur ac</a>
+ <a href="#" class="list-group-item">Vestibulum at eros</a>
</div>
{% endhighlight %}
</div>
<p class="lead">While not always necessary, sometimes you need to put your DOM in a box. For those situations, try the panel component.</p>
- <h3 id="panels-basic">Basic panel</h3>
+ <h3 id="panels-basic">Basic example</h3>
<p>By default, all the <code>.panel</code> does is apply some basic border and padding to contain some content.</p>
<div class="bs-example">
<div class="panel">
- Basic panel example
+ <div class="panel-body">
+ Basic panel example
+ </div>
</div>
</div>
{% highlight html %}
<div class="panel">
- Basic panel example
+ <div class="panel-body">
+ Basic panel example
+ </div>
</div>
{% endhighlight %}
<div class="bs-example">
<div class="panel">
<div class="panel-heading">Panel heading</div>
- Panel content
+ <div class="panel-body">
+ Panel content
+ </div>
</div>
<div class="panel">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
- Panel content
+ <div class="panel-body">
+ Panel content
+ </div>
</div>
</div>
{% highlight html %}
<div class="panel">
<div class="panel-heading">Panel heading</div>
- Panel content
+ <div class="panel-body">
+ Panel content
+ </div>
</div>
<div class="panel">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
- Panel content
+ <div class="panel-body">
+ Panel content
+ </div>
</div>
{% endhighlight %}
<p>Wrap buttons or secondary text in <code>.panel-footer</code>.</p>
<div class="bs-example">
<div class="panel">
- Panel content
+ <div class="panel-body">
+ Panel content
+ </div>
<div class="panel-footer">Panel footer</div>
</div>
</div>
{% highlight html %}
<div class="panel">
- Panel content
+ <div class="panel-body">
+ Panel content
+ </div>
<div class="panel-footer">Panel footer</div>
</div>
{% endhighlight %}
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
- Panel content
+ <div class="panel-body">
+ Panel content
+ </div>
</div>
<div class="panel panel-success">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
- Panel content
+ <div class="panel-body">
+ Panel content
+ </div>
</div>
- <div class="panel panel-warning">
+ <div class="panel panel-info">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
- Panel content
+ <div class="panel-body">
+ Panel content
+ </div>
</div>
- <div class="panel panel-danger">
+ <div class="panel panel-warning">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
- Panel content
+ <div class="panel-body">
+ Panel content
+ </div>
</div>
- <div class="panel panel-info">
+ <div class="panel panel-danger">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
- Panel content
+ <div class="panel-body">
+ Panel content
+ </div>
</div>
</div>
{% highlight html %}
<div class="panel panel-primary">...</div>
<div class="panel panel-success">...</div>
+<div class="panel panel-info">...</div>
<div class="panel panel-warning">...</div>
<div class="panel panel-danger">...</div>
-<div class="panel panel-info">...</div>
{% endhighlight %}
<h3 id="panels-list-group">With list groups</h3>
<div class="panel">
<!-- Default panel contents -->
<div class="panel-heading">Panel heading</div>
- <p>Some default panel content here. Nulla vitae elit libero, a pharetra augue. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
+ <div class="panel-body">
+ <p>Some default panel content here. Nulla vitae elit libero, a pharetra augue. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
+ </div>
<!-- List group -->
- <ul class="list-group list-group-flush">
+ <ul class="list-group">
<li class="list-group-item">Cras justo odio</li>
<li class="list-group-item">Dapibus ac facilisis in</li>
<li class="list-group-item">Morbi leo risus</li>
<div class="panel">
<!-- Default panel contents -->
<div class="panel-heading">Panel heading</div>
- <p>...</p>
+ <div class="panel-body">
+ <p>...</p>
+ </div>
<!-- List group -->
- <ul class="list-group list-group-flush">
+ <ul class="list-group">
<li class="list-group-item">Cras justo odio</li>
<li class="list-group-item">Dapibus ac facilisis in</li>
<li class="list-group-item">Morbi leo risus</li>
<h3>Optional classes</h3>
<p>Control padding and rounded corners with two optional modifier classes.</p>
<div class="bs-example">
- <div class="well well-large">
- Look, I'm in a well!
+ <div class="well well-lg">
+ Look, I'm in a large well!
</div>
</div>
{% highlight html %}
-<div class="well well-large">...</div>
+<div class="well well-lg">...</div>
{% endhighlight %}
<div class="bs-example">
- <div class="well well-small">
- Look, I'm in a well!
+ <div class="well well-sm">
+ Look, I'm in a small well!
</div>
</div>
{% highlight html %}
-<div class="well well-small">...</div>
+<div class="well well-sm">...</div>
{% endhighlight %}
</div>
{
- "name": "twitter/bootstrap"
+ "name": "twbs/bootstrap"
, "description": "Sleek, intuitive, and powerful front-end framework for faster and easier web development."
, "keywords": ["bootstrap", "css"]
, "homepage": "http://getbootstrap.com"
</div>
<p class="lead">Get the lowdown on the key pieces of Bootstrap's infrastructure, including our approach to better, faster, stronger web development.</p>
- <h3 id="overview-doctype">HTML5 doctype required</h3>
+ <h3 id="overview-doctype">HTML5 doctype</h3>
<p>Bootstrap makes use of certain HTML elements and CSS properties that require the use of the HTML5 doctype. Include it at the beginning of all your projects.</p>
{% highlight html %}
<!DOCTYPE html>
<p>To ensure proper rendering and touch zooming, <strong>add the viewport meta tag</strong> to your <code><head></code>.</p>
{% highlight html %}
<meta name="viewport" content="width=device-width, initial-scale=1.0">
+{% endhighlight %}
+ <p>You can disable zooming capabilities on mobile devices by adding <code>user-scalable=no</code> to the viewport meta tag. This disables zooming, meaning users are only able to scroll, and results in your site feeling a bit more like a native application. Overall we don't recommend this on every site, so use caution!</p>
+{% highlight html %}
+<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
+{% endhighlight %}
+
+ <h3 id="overview-responsive-images">Responsive images</h3>
+ <p>Images in Bootstrap 3 can be made responsive-friendly via the addition of the <code>.img-responsive</code> class. This applies <code>max-width: 100%;</code> and <code>height: auto;</code> to the image so that it scales nicely to the parent element.</p>
+{% highlight html %}
+<img src="..." class="img-responsive" alt="Responsive image">
{% endhighlight %}
<h3 id="overview-type-links">Typography and links</h3>
<li>Use the <code>@font-family-base</code>, <code>@font-size-base</code>, and <code>@line-height-base</code> attributes as our typographic base</li>
<li>Set the global link color via <code>@link-color</code> and apply link underlines only on <code>:hover</code></li>
</ul>
- <p>These styles can be found within <strong>scaffolding.less</strong>.</p>
+ <p>These styles can be found within <code>scaffolding.less</code>.</p>
- <h3 id="overview-normalize">Normalize reset</h3>
+ <h3 id="overview-normalize">Normalize</h3>
<p>For improved cross-browser rendering, we use <a href="http://necolas.github.io/normalize.css/" target="_blank">Normalize</a>, a project by <a href="http://twitter.com/necolas" target="_blank">Nicolas Gallagher</a> and <a href="http://twitter.com/jon_neal" target="_blank">Jonathan Neal</a>.</p>
- <h3 id="overview-container">Centering with container</h3>
- <p>Easily center a page's contents by wrapping its contents in a container. Containers set <code>max-width</code> at various media query breakpoints to match our grid system.</p>
+ <h3 id="overview-container">Containers</h3>
+ <p>Easily center a page's contents by wrapping its contents in a <code>.container</code>. Containers set <code>max-width</code> at various media query breakpoints to match our grid system.</p>
{% highlight html %}
<div class="container">
...
</div>
<p class="lead">With the launch of Bootstrap 3, icons have been moved to a <a href="https://github.com/twbs/bootstrap-glyphicons">separate repository</a>. This keeps the primary project as lean as possible, makes it easier for folks to swap icon libraries, and makes Glyphicons icon fonts more readily available to more people outside Bootstrap.</p>
<p class="lead">
- <a href="http://glyphicons.getbootstrap.com/" class="btn btn-default btn-l
arge">Visit Glyphicons for Bootstrap</a> or <a href="https://github.com/twbs/bootstrap-glyphicons">download from GitHub</a>
+ <a href="http://glyphicons.getbootstrap.com/" class="btn btn-default btn-l
g">Visit Glyphicons for Bootstrap</a> or <a href="https://github.com/twbs/bootstrap-glyphicons">download from GitHub</a>
</p>
</div>
</div>
<p class="lead">Bootstrap includes a responsive, mobile-first fluid grid system that appropriately scales up to 12 columns as the device or viewport size increases. It includes <a href="#grid-example-basic">predefined classes</a> for easy layout options, as well as powerful <a href="#grid-less">mixins for generating more semantic layouts</a>.</p>
+ <h3 id="grid-media-queries">Media queries</h3>
+ <p>We use the following media queries to create the key breakpoints in our grid system.</p>
+{% highlight css %}
+/* Extra small devices (phones, up to 480px) */
+/* No media query since this is the default in Bootstrap */
+
+/* Small devices (tablets, 768px and up) */
+@media (min-width: @screen-tablet) { ... }
+
+/* Medium devices (desktops, 992px and up) */
+@media (min-width: @screen-desktop) { ... }
+
+/* Large devices (large desktops, 1200px and up) */
+@media (min-width: @screen-large-desktop) { ... }
+{% endhighlight %}
+ <p>We occasionally expand on these media queries to include a <code>max-width</code> to limit CSS to a narrower set of devices.</p>
+{% highlight css %}
+@media (max-width: @screen-phone-max) { ... }
+@media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) { ... }
+@media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) { ... }
+@media (min-width: @screen-large-desktop) { ... }
+{% endhighlight %}
+
<h3 id="grid-options">Grid options</h3>
<p>See how aspects of the Bootstrap grid system work across multiple devices with a handy table.</p>
<div class="bs-table-scrollable">
<tr>
<th></th>
<th>
- Tiny grid
- <small>Phones (<480px)</small>
+ Extra small devices
+ <small>Phones (<768px)</small>
+ </th>
+ <th>
+ Small devices
+ <small>Tablets (≥768px)</small>
</th>
<th>
- Small grid
- <small>Tablets (<768px)</small>
+ Medium devices
+ <small>Desktops (≥992px)</small>
</th>
<th>
- Medium-large grid
- <small>Destkops (>768px)</small>
+ Large devices
+ <small>Desktops (≥1200px)</small>
</th>
</tr>
</thead>
<tr>
<th>Grid behavior</th>
<td>Horizontal at all times</td>
- <td colspan="2">Collapsed to start, horizontal above breakpoints</td>
+ <td colspan="3">Collapsed to start, horizontal above breakpoints</td>
+ </tr>
+ <tr>
+ <th>Max container width</th>
+ <td>None (auto)</td>
+ <td>720px</td>
+ <td>940px</td>
+ <td>1140px</td>
</tr>
<tr>
<th>Class prefix</th>
- <td><code>.col-</code></td>
+ <td><code>.col-xs-</code></td>
<td><code>.col-sm-</code></td>
+ <td><code>.col-md-</code></td>
<td><code>.col-lg-</code></td>
</tr>
<tr>
<th># of columns</th>
- <td colspan="3">12</td>
+ <td colspan="4">12</td>
+ </tr>
+ <tr>
+ <th>Max column width</th>
+ <td class="text-muted">Auto</td>
+ <td>60px</td>
+ <td>78px</td>
+ <td>95px</td>
+ </tr>
+ <tr>
+ <th>Gutter width</th>
+ <td colspan="4">30px (15px on each side of a column)</td>
</tr>
<tr>
<th>Nestable</th>
- <td colspan="3">Yes</td>
+ <td colspan="4">Yes</td>
</tr>
<tr>
<th>Offsets</th>
- <td colspan="2" class="text-muted">N/A</td>
- <td>Yes</td>
+ <td colspan="1" class="text-muted">N/A</td>
+ <td colspan="3">Yes</td>
</tr>
<tr>
<th>Column ordering</th>
<td class="text-muted">N/A</td>
- <td colspan="2">Yes</td>
+ <td colspan="3">Yes</td>
</tr>
</tbody>
</table>
</div>
<h3 id="grid-example-basic">Example: Stacked-to-horizontal</h3>
- <p>Using a single set of grid classes, you can create a basic grid system that starts out stacked on mobile and tablet devices before becoming horizontal on desktop devices.</p>
+ <p>Using a single set of <code>.col-md-*</code> grid classes, you can create a basic grid system that starts out stacked on mobile devices and tablet devices (the extra small to small range) before becoming horizontal on desktop (medium) devices.</p>
<div class="bs-docs-grid">
<div class="row show-grid">
- <div class="col-lg-1">1</div>
- <div class="col-lg-1">1</div>
- <div class="col-lg-1">1</div>
- <div class="col-lg-1">1</div>
- <div class="col-lg-1">1</div>
- <div class="col-lg-1">1</div>
- <div class="col-lg-1">1</div>
- <div class="col-lg-1">1</div>
- <div class="col-lg-1">1</div>
- <div class="col-lg-1">1</div>
- <div class="col-lg-1">1</div>
- <div class="col-lg-1">1</div>
+ <div class="col-md-1">1</div>
+ <div class="col-md-1">1</div>
+ <div class="col-md-1">1</div>
+ <div class="col-md-1">1</div>
+ <div class="col-md-1">1</div>
+ <div class="col-md-1">1</div>
+ <div class="col-md-1">1</div>
+ <div class="col-md-1">1</div>
+ <div class="col-md-1">1</div>
+ <div class="col-md-1">1</div>
+ <div class="col-md-1">1</div>
+ <div class="col-md-1">1</div>
</div>
<div class="row show-grid">
- <div class="col-lg-8">8</div>
- <div class="col-lg-4">4</div>
+ <div class="col-md-8">8</div>
+ <div class="col-md-4">4</div>
</div>
<div class="row show-grid">
- <div class="col-lg-4">4</div>
- <div class="col-lg-4">4</div>
- <div class="col-lg-4">4</div>
+ <div class="col-md-4">4</div>
+ <div class="col-md-4">4</div>
+ <div class="col-md-4">4</div>
</div>
<div class="row show-grid">
- <div class="col-lg-6">6</div>
- <div class="col-lg-6">6</div>
+ <div class="col-md-6">6</div>
+ <div class="col-md-6">6</div>
</div>
</div>
{% highlight html %}
<div class="row">
- <div class="col-lg-1">1</div>
- <div class="col-lg-1">1</div>
- <div class="col-lg-1">1</div>
- <div class="col-lg-1">1</div>
- <div class="col-lg-1">1</div>
- <div class="col-lg-1">1</div>
- <div class="col-lg-1">1</div>
- <div class="col-lg-1">1</div>
- <div class="col-lg-1">1</div>
- <div class="col-lg-1">1</div>
- <div class="col-lg-1">1</div>
- <div class="col-lg-1">1</div>
+ <div class="col-md-1">1</div>
+ <div class="col-md-1">1</div>
+ <div class="col-md-1">1</div>
+ <div class="col-md-1">1</div>
+ <div class="col-md-1">1</div>
+ <div class="col-md-1">1</div>
+ <div class="col-md-1">1</div>
+ <div class="col-md-1">1</div>
+ <div class="col-md-1">1</div>
+ <div class="col-md-1">1</div>
+ <div class="col-md-1">1</div>
+ <div class="col-md-1">1</div>
</div>
-<div class="row show-grid">
- <div class="col-lg-8">8</div>
- <div class="col-lg-4">4</div>
+<div class="row">
+ <div class="col-md-8">8</div>
+ <div class="col-md-4">4</div>
</div>
<div class="row">
- <div class="col-lg-4">4</div>
- <div class="col-lg-4">4</div>
- <div class="col-lg-4">4</div>
+ <div class="col-md-4">4</div>
+ <div class="col-md-4">4</div>
+ <div class="col-md-4">4</div>
</div>
<div class="row">
- <div class="col-lg-6">6</div>
- <div class="col-lg-6">6</div>
+ <div class="col-md-6">6</div>
+ <div class="col-md-6">6</div>
</div>
{% endhighlight %}
- <h3 id="grid-example-mixed">Example: Combining mobile with desktop</h3>
- <p>Don't want your columns to simply stack in smaller devices? Use the small device grid system by adding <code>.col-*</code> classes to the existing <code>.col-lg-*</code> ones. See the example below for a better idea of how it all works.</p>
+ <h3 id="grid-example-mixed">Example: Mobile and desktop</h3>
+ <p>Don't want your columns to simply stack in smaller devices? Use the extra small and medium device grid classes by adding <code>.col-xs-*</code> <code>.col-md-*</code> to your columns. See the example below for a better idea of how it all works.</p>
<div class="bs-docs-grid">
<div class="row show-grid">
- <div class="col-12 col-lg-8">8</div>
- <div class="col-6 col-lg-4">4</div>
+ <div class="col-xs-12 col-md-8">8</div>
+ <div class="col-xs-6 col-md-4">4</div>
</div>
<div class="row show-grid">
- <div class="col-6 col-lg-4">4</div>
- <div class="col-6 col-lg-4">4</div>
- <div class="col-6 col-lg-4">4</div>
+ <div class="col-xs-6 col-md-4">4</div>
+ <div class="col-xs-6 col-md-4">4</div>
+ <div class="col-xs-6 col-md-4">4</div>
</div>
<div class="row show-grid">
- <div class="col-6 col-lg-6">6</div>
- <div class="col-6 col-lg-6">6</div>
+ <div class="col-xs-6 col-md-6">6</div>
+ <div class="col-xs-6 col-md-6">6</div>
</div>
</div>
{% highlight html %}
+<!-- Stack the columns on mobile by making one full-width and the other half-width -->
<div class="row">
- <div class="col-12 col-lg-8">8</div>
- <div class="col-6 col-lg-4">4</div>
+ <div class="col-xs-12 col-md-8">8</div>
+ <div class="col-xs-6 col-md-4">4</div>
</div>
+
+<!-- Columns start at 50% wide on mobile and bump up to 33.3% wide on desktop -->
<div class="row">
- <div class="col-6 col-lg-4">4</div>
- <div class="col-6 col-lg-4">4</div>
- <div class="col-6 col-lg-4">4</div>
+ <div class="col-xs-6 col-md-4">4</div>
+ <div class="col-xs-6 col-md-4">4</div>
+ <div class="col-xs-6 col-md-4">4</div>
</div>
+
+<!-- Columns are always 50% wide, on mobile and desktop -->
<div class="row">
- <div class="col-6 col-lg-6">6</div>
- <div class="col-6 col-lg-6">6</div>
+ <div class="col-xs-6 col-md-6">6</div>
+ <div class="col-xs-6 col-md-6">6</div>
</div>
{% endhighlight %}
- <h3 id="grid-example-mixed-complete">Example: Mobile, tablet, and desktop</h3>
+ <h3 id="grid-example-mixed-complete">Example: Mobile, tablet, desktops</h3>
<p>Build on the previous example by creating even more dynamic and powerful layouts with tablet <code>.col-sm-*</code> classes.</p>
<div class="bs-docs-grid">
<div class="row show-grid">
- <div class="col-12 col-sm-8 col-lg-8">.col-12 .col-lg-8</div>
- <div class="col-6 col-sm-4 col-lg-4">.col-6 .col-lg-4</div>
- </div>
- <div class="row show-grid">
- <div class="col-6 col-sm-4 col-lg-4">.col-6 .col-lg-4</div>
- <div class="col-6 col-sm-4 col-lg-4">.col-6 .col-lg-4</div>
- <div class="col-6 col-sm-4 col-lg-4">.col-6 .col-lg-4</div>
+ <div class="col-xs-12 col-sm-6 col-md-8">.col-xs-12 .col-sm-6 .col-md-8</div>
+ <div class="col-xs-6 col-sm-6 col-md-4">.col-xs-6 .col-sm-6 .col-md-4</div>
</div>
<div class="row show-grid">
- <div class="col-6 col-sm-6 col-lg-6">.col-6 .col-lg-6</div>
- <div class="col-6 col-sm-6 col-lg-6">.col-6 .col-lg-6</div>
+ <div class="col-xs-6 col-sm-4 col-md-4">.col-xs-6 .col-sm-4 .col-md-4</div>
+ <div class="col-xs-6 col-sm-4 col-md-4">.col-xs-6 .col-sm-4 .col-md-4</div>
+ <!-- Optional: clear the XS cols if their content doesn't match in height -->
+ <div class="clearfix visible-xs"></div>
+ <div class="col-xs-6 col-sm-4 col-md-4">.col-xs-6 .col-sm-4 .col-md-4</div>
</div>
</div>
{% highlight html %}
<div class="row">
- <div class="col-12 col-sm-8 col-lg-8">.col-12 .col-lg-8</div>
- <div class="col-6 col-sm-4 col-lg-4">.col-6 .col-lg-4</div>
+ <div class="col-xs-12 col-sm-6 col-md-8">.col-xs-12 .col-sm-6 .col-md-8</div>
+ <div class="col-xs-6 col-sm-6 col-md-4">.col-xs-6 .col-sm-6 .col-md-4</div>
+</div>
+<div class="row">
+ <div class="col-xs-6 col-sm-4 col-md-4">.col-xs-6 .col-sm-4 .col-md-4</div>
+ <div class="col-xs-6 col-sm-4 col-md-4">.col-xs-6 .col-sm-4 .col-md-4</div>
+ <!-- Optional: clear the XS cols if their content doesn't match in height -->
+ <div class="clearfix visible-xs"></div>
+ <div class="col-xs-6 col-sm-4 col-md-4">.col-xs-6 .col-sm-4 .col-md-4</div>
+</div>
+{% endhighlight %}
+
+ <h3 id="grid-responsive-resets">Responsive column resets</h3>
+ <p>With the four tiers of grids available you're bound to run into issues where, at certain breakpoints, your columns don't clear quite right as one is taller than the other. To fix that, use a combination of a <code>.clearfix</code> and our <a href="../css#responsive-utilities">responsive utility classes</a>.</p>
+{% highlight html %}
+<div class="row">
+ <div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-3</div>
+ <div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-3</div>
+
+ <!-- Add the extra clearfix for only the required viewport -->
+ <div class="clearfix visible-xs"></div>
+
+ <div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-3</div>
+ <div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-3</div>
</div>
+{% endhighlight %}
+ <p>In addition to column clearing at responsive breakpoints, you may need to <strong>reset offsets, pushes, or pulls</strong>. Those resets are available for medium and large grid tiers only, since they start only at the (second) small grid tier.</p>
+{% highlight html %}
<div class="row">
- <div class="col-6 col-sm-4 col-lg-4">.col-6 .col-lg-4</div>
- <div class="col-6 col-sm-4 col-lg-4">.col-6 .col-lg-4</div>
- <div class="col-6 col-sm-4 col-lg-4">.col-6 .col-lg-4</div>
+ <div class="col-sm-5 col-md-6">.col-sm-5 .col-md-6</div>
+ <div class="col-sm-5 col-sm-offset-2 col-md-6 col-md-offset-0">.col-sm-5 .col-sm-offset-2 .col-md-6 .col-md-offset-0</div>
</div>
+
<div class="row">
- <div class="col-6 col-sm-6 col-lg-6">.col-6 .col-lg-6</div>
- <div class="col-6 col-sm-6 col-lg-6">.col-6 .col-lg-6</div>
+ <div class="col-sm-6 col-md-5 col-lg-6">.col-sm-6 .col-md-5 .col-lg-6</div>
+ <div class="col-sm-6 col-md-5 col-md-offset-2 col-lg-6 col-lg-offset-0">.col-sm-6 .col-md-5 .col-md-offset-2 .col-lg-6 .col-lg-offset-0</div>
</div>
{% endhighlight %}
- <div class="bs-callout bs-callout-danger">
- <h4>Need more examples?</h4>
- <p>We dive into more grid layouts in a separate page, free of chrome and documentation to better show you the power of the grid.</p>
- <p><a class="btn btn-danger" target="_blank" href="http://examples.getbootstrap.com/grid/">More grid examples</a></p>
- </div>
<h3 id="grid-offsetting">Offsetting columns</h3>
- <p>Move columns to the right using <code>.col-offset-*</code> classes. These classes increase the left margin of a column by <code>*</code> columns. For example, <code>.col-offset-4</code> moves <code>.col-lg-4</code> over four columns.</p>
+ <p>Move columns to the right using <code>.col-md-offset-*</code> classes. These classes increase the left margin of a column by <code>*</code> columns. For example, <code>.col-md-offset-4</code> moves <code>.col-md-4</code> over four columns.</p>
<div class="bs-docs-grid">
<div class="row show-grid">
- <div class="col-lg-4">4</div>
- <div class="col-lg-4 col-offset-4">4 offset 4</div>
+ <div class="col-md-4">4</div>
+ <div class="col-md-4 col-md-offset-4">4 offset 4</div>
</div><!-- /row -->
<div class="row show-grid">
- <div class="col-lg-3 col-offset-3">3 offset 3</div>
- <div class="col-lg-3 col-offset-3">3 offset 3</div>
+ <div class="col-md-3 col-md-offset-3">3 offset 3</div>
+ <div class="col-md-3 col-md-offset-3">3 offset 3</div>
</div><!-- /row -->
<div class="row show-grid">
- <div class="col-lg-6 col-offset-3">6 offset 3</div>
+ <div class="col-md-6 col-md-offset-3">6 offset 3</div>
</div><!-- /row -->
</div>
{% highlight html %}
<div class="row">
- <div class="col-lg-4">...</div>
- <div class="col-lg-4 col-offset-4">...</div>
+ <div class="col-md-4">...</div>
+ <div class="col-md-4 col-md-offset-4">...</div>
</div>
<div class="row">
- <div class="col-lg-3 col-offset-3">3 offset 3</div>
- <div class="col-lg-3 col-offset-3">3 offset 3</div>
+ <div class="col-md-3 col-md-offset-3">3 offset 3</div>
+ <div class="col-md-3 col-md-offset-3">3 offset 3</div>
</div>
<div class="row">
- <div class="col-lg-6 col-offset-3">...</div>
+ <div class="col-md-6 col-md-offset-3">...</div>
</div>
{% endhighlight %}
<h3 id="grid-nesting">Nesting columns</h3>
- <p>To nest your content with the default grid, add a new <code>.row</code> and set of <code>.col-lg-*</code> columns within an existing <code>.col-lg-*</code> column. Nested rows should include a set of columns that add up to 12.</p>
+ <p>To nest your content with the default grid, add a new <code>.row</code> and set of <code>.col-md-*</code> columns within an existing <code>.col-md-*</code> column. Nested rows should include a set of columns that add up to 12.</p>
<div class="row show-grid">
- <div class="col-lg-9">
+ <div class="col-md-9">
Level 1: 9 columns
<div class="row show-grid">
- <div class="col-lg-6">
+ <div class="col-md-6">
Level 2: 6 columns
</div>
- <div class="col-lg-6">
+ <div class="col-md-6">
Level 2: 6 columns
</div>
</div>
</div>
{% highlight html %}
<div class="row">
- <div class="col-lg-9">
+ <div class="col-md-9">
Level 1: 9 columns
<div class="row">
- <div class="col-lg-6">
+ <div class="col-md-6">
Level 2: 6 columns
</div>
- <div class="col-lg-6">
+ <div class="col-md-6">
Level 2: 6 columns
</div>
</div>
{% endhighlight %}
<h3 id="grid-column-ordering">Column ordering</h3>
- <p>Easily change the order of our built-in grid columns with <code>.col-push-*</code> and <code>.col-pull-*</code> modifier classes.</p>
+ <p>Easily change the order of our built-in grid columns with <code>.col-md-push-*</code> and <code>.col-md-pull-*</code> modifier classes.</p>
<div class="row show-grid">
- <div class="col-lg-9 col-push-3">9</div>
- <div class="col-lg-3 col-pull-9">3</div>
+ <div class="col-md-9 col-md-push-3">9</div>
+ <div class="col-md-3 col-md-pull-9">3</div>
</div>
{% highlight html %}
-<div class="row show-grid">
- <div class="col-lg-9 col-push-3">9</div>
- <div class="col-lg-3 col-pull-9">3</div>
+<div class="row">
+ <div class="col-md-9 col-md-push-3">9</div>
+ <div class="col-md-3 col-md-pull-9">3</div>
</div>
{% endhighlight %}
<p>Mixins are used in conjunction with the grid variables to generate semantic CSS for individual grid columns.</p>
{% highlight css %}
// Creates a wrapper for a series of columns
-.make-row() {
- // Negative margin the row out to align the content of columns
- margin-left: (@grid-gutter-width / -2);
- margin-right: (@grid-gutter-width / -2);
+.make-row(@gutter: @grid-gutter-width) {
// Then clear the floated columns
.clearfix();
+
+ @media (min-width: @screen-small) {
+ margin-left: (@gutter / -2);
+ margin-right: (@gutter / -2);
+ }
+
+ // Negative margin nested rows out to align the content of columns
+ .row {
+ margin-left: (@gutter / -2);
+ margin-right: (@gutter / -2);
+ }
}
-// Generate the columns
-.make-column(@columns) {
+// Generate the extra small columns
+.make-xs-column(@columns; @gutter: @grid-gutter-width) {
+ position: relative;
+ // Prevent columns from collapsing when empty
+ min-height: 1px;
+ // Inner gutter via padding
+ padding-left: (@gutter / 2);
+ padding-right: (@gutter / 2);
+
+ // Calculate width based on number of columns available
@media (min-width: @grid-float-breakpoint) {
float: left;
- // Calculate width based on number of columns available
- width: percentage(@columns / @grid-columns);
+ width: percentage((@columns / @grid-columns));
}
+}
+
+// Generate the small columns
+.make-sm-column(@columns; @gutter: @grid-gutter-width) {
+ position: relative;
// Prevent columns from collapsing when empty
min-height: 1px;
- // Set inner padding as gutters instead of margin
- padding-left: (@grid-gutter-width / 2);
- padding-right: (@grid-gutter-width / 2);
+ // Inner gutter via padding
+ padding-left: (@gutter / 2);
+ padding-right: (@gutter / 2);
+
+ // Calculate width based on number of columns available
+ @media (min-width: @screen-small) {
+ float: left;
+ width: percentage((@columns / @grid-columns));
+ }
}
-// Generate the column offsets
-.make-column-offset(@columns) {
- @media (min-width: @grid-float-breakpoint) {
+// Generate the small column offsets
+.make-sm-column-offset(@columns) {
+ @media (min-width: @screen-small) {
margin-left: percentage((@columns / @grid-columns));
}
}
+.make-sm-column-push(@columns) {
+ @media (min-width: @screen-small) {
+ left: percentage((@columns / @grid-columns));
+ }
+}
+.make-sm-column-pull(@columns) {
+ @media (min-width: @screen-small) {
+ right: percentage((@columns / @grid-columns));
+ }
+}
+
+// Generate the medium columns
+.make-md-column(@columns; @gutter: @grid-gutter-width) {
+ position: relative;
+ // Prevent columns from collapsing when empty
+ min-height: 1px;
+ // Inner gutter via padding
+ padding-left: (@gutter / 2);
+ padding-right: (@gutter / 2);
+
+ // Calculate width based on number of columns available
+ @media (min-width: @screen-medium) {
+ float: left;
+ width: percentage((@columns / @grid-columns));
+ }
+}
+
+// Generate the large column offsets
+.make-md-column-offset(@columns) {
+ @media (min-width: @screen-medium) {
+ margin-left: percentage((@columns / @grid-columns));
+ }
+}
+.make-md-column-push(@columns) {
+ @media (min-width: @screen-medium) {
+ left: percentage((@columns / @grid-columns));
+ }
+}
+.make-md-column-pull(@columns) {
+ @media (min-width: @screen-medium) {
+ right: percentage((@columns / @grid-columns));
+ }
+}
+
+// Generate the large columns
+.make-lg-column(@columns; @gutter: @grid-gutter-width) {
+ position: relative;
+ // Prevent columns from collapsing when empty
+ min-height: 1px;
+ // Inner gutter via padding
+ padding-left: (@gutter / 2);
+ padding-right: (@gutter / 2);
+
+ // Calculate width based on number of columns available
+ @media (min-width: @screen-large) {
+ float: left;
+ width: percentage((@columns / @grid-columns));
+ }
+}
+
+// Generate the large column offsets
+.make-lg-column-offset(@columns) {
+ @media (min-width: @screen-large) {
+ margin-left: percentage((@columns / @grid-columns));
+ }
+}
+.make-lg-column-push(@columns) {
+ @media (min-width: @screen-large) {
+ left: percentage((@columns / @grid-columns));
+ }
+}
+.make-lg-column-pull(@columns) {
+ @media (min-width: @screen-large) {
+ right: percentage((@columns / @grid-columns));
+ }
+}
{% endhighlight %}
<h4>Example usage</h4>
.make-row();
}
.content-main {
- .make-column(8);
+ .make-lg-column(8);
}
.content-secondary {
- .make-column(3);
- .make-column-offset(1);
+ .make-lg-column(3);
+ .make-lg-column-offset(1);
}
{% endhighlight %}
{% highlight html %}
<table class="table">
<tbody>
<tr>
- <th><h1>Bootstrap heading</h1></th>
+ <td><h1>Bootstrap heading</h1></td>
<td>Semibold 38px</td>
</tr>
<tr>
- <th><h2>Bootstrap heading</h2></th>
+ <td><h2>Bootstrap heading</h2></td>
<td>Semibold 32px</td>
</tr>
<tr>
- <th><h3>Bootstrap heading</h3></th>
+ <td><h3>Bootstrap heading</h3></td>
<td>Semibold 24px</td>
</tr>
<tr>
- <th><h4>Bootstrap heading</h4></th>
+ <td><h4>Bootstrap heading</h4></td>
<td>Semibold 18px</td>
</tr>
<tr>
- <th><h5>Bootstrap heading</h5></th>
- <td>Semibold 16px</td>
+ <td><h5>Bootstrap heading</h5></td>
+ <td>Semibold 14px</td>
</tr>
<tr>
- <th><h6>Bootstrap heading</h6></th>
+ <td><h6>Bootstrap heading</h6></td>
<td>Semibold 12px</td>
</tr>
</tbody>
<div class="bs-example">
<p class="text-muted">Fusce dapibus, tellus ac cursus commodo, tortor mauris nibh.</p>
<p class="text-primary">Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
- <p class="text-warning">Etiam porta sem malesuada magna mollis euismod.</p>
- <p class="text-danger">Donec ullamcorper nulla non metus auctor fringilla.</p>
<p class="text-success">Duis mollis, est non commodo luctus, nisi erat porttitor ligula.</p>
<p class="text-info">Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
+ <p class="text-warning">Etiam porta sem malesuada magna mollis euismod.</p>
+ <p class="text-danger">Donec ullamcorper nulla non metus auctor fringilla.</p>
</div>
{% highlight html %}
<p class="text-muted">...</p>
<p class="text-primary">...</p>
-<p class="text-warning">...</p>
-<p class="text-danger">...</p>
<p class="text-success">...</p>
<p class="text-info">...</p>
+<p class="text-warning">...</p>
+<p class="text-danger">...</p>
{% endhighlight %}
<p>For quoting blocks of content from another source within your document.</p>
<h3>Default blockquote</h3>
- <p>Wrap <code><blockquote></code> around any <abbr title="HyperText Markup Language">HTML</abbr> as the quote. For straight quotes we recommend a <code><p></code>.</p>
+ <p>Wrap <code><blockquote></code> around any <abbr title="HyperText Markup Language">HTML</abbr> as the quote. For straight quotes, we recommend a <code><p></code>.</p>
<div class="bs-example">
<blockquote>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p>
{% endhighlight %}
<h3>Blockquote options</h3>
- <p>Style and content changes for simple variations on a standard blockquote.</p>
+ <p>Style and content changes for simple variations on a standard <code><blockquote></code>.</p>
<h4>Naming a source</h4>
<p>Add <code><small></code> tag for identifying the source. Wrap the name of the source work in <code><cite></code>.</p>
{% endhighlight %}
<h4>Horizontal description</h4>
- <p>Make terms and descriptions in <code><dl></code> line up side-by-side.</p>
+ <p>Make terms and descriptions in <code><dl></code> line up side-by-side. Starts off stacked like default <code><dl></code>s, but when the navbar expands, so do these.</p>
<div class="bs-example">
<dl class="dl-horizontal">
<dt>Description lists</dt>
<pre><p>Sample text here...</p></pre>
{% endhighlight %}
- <p>You may optionally add the <code>.pre-scrollable</code> class which will set a max-height of 350px and provide a y-axis scrollbar.</p>
+ <p>You may optionally add the <code>.pre-scrollable</code> class, which will set a max-height of 350px and provide a y-axis scrollbar.</p>
</div>
{% endhighlight %}
- <h2>Optional classes</h2>
- <p>Add any of the following classes to the <code>.table</code> base class.</p>
-
- <h3 id="tables-striped">Striped</h3>
+ <h2 id="tables-striped">Striped rows</h2>
<p>Use <code>.table-striped</code> to add zebra-striping to any table row within the <code><tbody></code>.</p>
<div class="bs-callout bs-callout-danger">
<h4>Cross-browser compatibility</h4>
- <p>Striped tables are styled via the <code>:nth-child</code> CSS selector, which is not available in IE8.</p>
+ <p>Striped tables are styled via the <code>:nth-child</code> CSS selector, which is not available in Internet Explorer 8.</p>
</div>
<div class="bs-example">
<table class="table table-striped">
</table>
{% endhighlight %}
- <h3 id="tables-bordered">Bordered</h3>
+
+ <h2 id="tables-bordered">Bordered table</h2>
<p>Add <code>.table-bordered</code> for borders on all sides of the table and cells.</p>
<div class="bs-example">
<table class="table table-bordered">
</table>
{% endhighlight %}
- <h3 id="tables-hover-rows">Hover rows</h3>
+
+ <h2 id="tables-hover-rows">Hover rows</h2>
<p>Add <code>.table-hover</code> to enable a hover state on table rows within a <code><tbody></code>.</p>
<div class="bs-example">
<table class="table table-hover">
{% endhighlight %}
- <h3 id="tables-condensed">Condensed</h3>
+ <h2 id="tables-condensed">Condensed table</h2>
<p>Add <code>.table-condensed</code> to make tables more compact by cutting cell padding in half.</p>
<div class="bs-example">
<table class="table table-condensed">
- <h2 id="tables-row-classes">Contextual table classes</h2>
+ <h2 id="tables-contextual-classes">Contextual classes</h2>
<p>Use contextual classes to color table rows or individual cells.</p>
<div class="bs-table-scrollable">
<table class="table table-bordered table-striped bs-table">
<tbody>
<tr>
<td>
- <code>.success</code>
+ <code>.active</code>
</td>
- <td>Indicates a successful or positive action</td>
+ <td>Applies the hover color to a particular row or cell</td>
</tr>
<tr>
<td>
- <code>.danger</code>
+ <code>.success</code>
</td>
- <td>Indicates a dangerous or potentially negative action</td>
+ <td>Indicates a successful or positive action</td>
</tr>
<tr>
<td>
</tr>
<tr>
<td>
- <code>.active</code>
+ <code>.danger</code>
</td>
- <td>Applies the hover color to a particular row or cell</td>
+ <td>Indicates a dangerous or potentially negative action</td>
</tr>
</tbody>
</table>
</tr>
</thead>
<tbody>
- <tr class="success">
+ <tr class="active">
<td>1</td>
<td>Column content</td>
<td>Column content</td>
<td>Column content</td>
<td>Column content</td>
</tr>
- <tr class="danger">
+ <tr class="success">
<td>3</td>
<td>Column content</td>
<td>Column content</td>
<td>Column content</td>
<td>Column content</td>
</tr>
- <tr class="active">
+ <tr class="danger">
<td>7</td>
<td>Column content</td>
<td>Column content</td>
</table>
</div><!-- /example -->
{% highlight html %}
-<tr class="success">
- <td>1</td>
- <td>Column content</td>
- <td>Column content</td>
- <td>Column content</td>
+<!-- On rows -->
+<tr class="active">...</tr>
+<tr class="success">...</tr>
+<tr class="warning">...</tr>
+<tr class="danger">...</tr>
+
+<!-- On cells (`td` or `th`) -->
+<tr>
+ <td class="active">...</td>
+ <td class="success">...</td>
+ <td class="warning">...</td>
+ <td class="danger">...</td>
</tr>
{% endhighlight %}
<h2 id="forms-example">Basic example</h2>
<p>Individual form controls automatically receive some global styling. All textual <code><input></code>, <code><textarea></code>, and <code><select></code> elements with <code>.form-control</code> are set to <code>width: 100%;</code> by default. Wrap labels and controls in <code>.form-group</code> for optimum spacing.</p>
- <form class="bs-example">
- <fieldset>
- <legend>Legend</legend>
- <div class="form-group">
- <label for="exampleInputEmail">Email address</label>
- <input type="text" class="form-control" id="exampleInputEmail" placeholder="Enter email">
- </div>
- <div class="form-group">
- <label for="exampleInputPassword">Password</label>
- <input type="password" class="form-control" id="exampleInputPassword" placeholder="Password">
- </div>
- <div class="form-group">
- <label for="exampleInputFile">File input</label>
- <input type="file" id="exampleInputFile">
- <p class="help-block">Example block-level help text here.</p>
- </div>
- <div class="checkbox">
- <label>
- <input type="checkbox"> Check me out
- </label>
- </div>
- <button type="submit" class="btn btn-default">Submit</button>
- </fieldset>
+ <form class="bs-example" role="form">
+ <div class="form-group">
+ <label for="exampleInputEmail1">Email address</label>
+ <input type="email" class="form-control" id="exampleInputEmail1" placeholder="Enter email">
+ </div>
+ <div class="form-group">
+ <label for="exampleInputPassword1">Password</label>
+ <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
+ </div>
+ <div class="form-group">
+ <label for="exampleInputFile">File input</label>
+ <input type="file" id="exampleInputFile">
+ <p class="help-block">Example block-level help text here.</p>
+ </div>
+ <div class="checkbox">
+ <label>
+ <input type="checkbox"> Check me out
+ </label>
+ </div>
+ <button type="submit" class="btn btn-default">Submit</button>
</form><!-- /example -->
{% highlight html %}
-<form>
- <fieldset>
- <legend>Legend</legend>
- <div class="form-group">
- <label for="exampleInputEmail">Email address</label>
- <input type="text" class="form-control" id="exampleInputEmail" placeholder="Enter email">
- </div>
- <div class="form-group">
- <label for="exampleInputPassword">Password</label>
- <input type="password" class="form-control" id="exampleInputPassword" placeholder="Password">
- </div>
- <div class="form-group">
- <label for="exampleInputFile">File input</label>
- <input type="file" id="exampleInputFile">
- <p class="help-block">Example block-level help text here.</p>
- </div>
- <div class="checkbox">
- <label>
- <input type="checkbox"> Check me out
- </label>
- </div>
- <button type="submit" class="btn btn-default">Submit</button>
- </fieldset>
+<form role="form">
+ <div class="form-group">
+ <label for="exampleInputEmail1">Email address</label>
+ <input type="email" class="form-control" id="exampleInputEmail1" placeholder="Enter email">
+ </div>
+ <div class="form-group">
+ <label for="exampleInputPassword1">Password</label>
+ <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
+ </div>
+ <div class="form-group">
+ <label for="exampleInputFile">File input</label>
+ <input type="file" id="exampleInputFile">
+ <p class="help-block">Example block-level help text here.</p>
+ </div>
+ <div class="checkbox">
+ <label>
+ <input type="checkbox"> Check me out
+ </label>
+ </div>
+ <button type="submit" class="btn btn-default">Submit</button>
</form>
{% endhighlight %}
- <h2>Optional layouts</h2>
- <p>Included with Bootstrap are optional form layouts for common use cases.</p>
-
- <h3 id="forms-inline">Inline form</h3>
+ <h2 id="forms-inline">Inline form</h2>
<p>Add <code>.form-inline</code> for left-aligned and inline-block controls for a compact layout.</p>
<div class="bs-callout bs-callout-danger">
<h4>Requires custom widths</h4>
<p>Inputs, selects, and textareas are 100% wide by default in Bootstrap. To use the inline form, you'll have to set a width on the form controls used within.</p>
</div>
- <form class="bs-example form-inline">
- <input type="text" class="form-control" placeholder="Email">
- <input type="password" class="form-control" placeholder="Password">
+ <div class="bs-callout bs-callout-danger">
+ <h4>Always add labels</h4>
+ <p>Screen readers will have trouble with your forms if you don't include a label for every input. For these inline forms, you can hide the labels using the <code>.sr-only</code> class.</p>
+ </div>
+ <form class="bs-example form-inline" role="form">
+ <div class="form-group">
+ <label class="sr-only" for="exampleInputEmail2">Email address</label>
+ <input type="email" class="form-control" id="exampleInputEmail2" placeholder="Enter email">
+ </div>
+ <div class="form-group">
+ <label class="sr-only" for="exampleInputPassword2">Password</label>
+ <input type="password" class="form-control" id="exampleInputPassword2" placeholder="Password">
+ </div>
<div class="checkbox">
<label>
<input type="checkbox"> Remember me
<button type="submit" class="btn btn-default">Sign in</button>
</form><!-- /example -->
{% highlight html %}
-<form class="form-inline">
- <input type="text" class="form-control" placeholder="Email">
- <input type="password" class="form-control" placeholder="Password">
+<form class="form-inline" role="form">
+ <div class="form-group">
+ <label class="sr-only" for="exampleInputEmail2">Email address</label>
+ <input type="email" class="form-control" id="exampleInputEmail2" placeholder="Enter email">
+ </div>
+ <div class="form-group">
+ <label class="sr-only" for="exampleInputPassword2">Password</label>
+ <input type="password" class="form-control" id="exampleInputPassword2" placeholder="Password">
+ </div>
<div class="checkbox">
<label>
<input type="checkbox"> Remember me
</form>
{% endhighlight %}
- <h3 id="forms-horizontal">Horizontal form</h3>
+
+ <h2 id="forms-horizontal">Horizontal form</h2>
<p>Use Bootstrap's predefined grid classes to align labels and groups of form controls in a horizontal layout by adding <code>.form-horizontal</code> to the form. Doing so changes <code>.form-group</code>s to behave as grid rows, so no need for <code>.row</code>.</p>
<form class="bs-example form-horizontal">
<div class="form-group">
- <label for="inputEmail" class="col-lg-2 control-label">Email</label>
+ <label for="inputEmail1" class="col-lg-2 control-label">Email</label>
<div class="col-lg-10">
- <input type="text" class="form-control" id="inputEmail" placeholder="Email">
+ <input type="email" class="form-control" id="inputEmail1" placeholder="Email">
</div>
</div>
<div class="form-group">
- <label for="inputPassword" class="col-lg-2 control-label">Password</label>
+ <label for="inputPassword1" class="col-lg-2 control-label">Password</label>
<div class="col-lg-10">
- <input type="password" class="form-control" id="inputPassword" placeholder="Password">
+ <input type="password" class="form-control" id="inputPassword1" placeholder="Password">
+ </div>
+ </div>
+ <div class="form-group">
+ <div class="col-lg-offset-2 col-lg-10">
<div class="checkbox">
<label>
<input type="checkbox"> Remember me
</label>
</div>
+ </div>
+ </div>
+ <div class="form-group">
+ <div class="col-lg-offset-2 col-lg-10">
<button type="submit" class="btn btn-default">Sign in</button>
</div>
</div>
</form>
{% highlight html %}
-<form class="form-horizontal">
+<form class="form-horizontal" role="form">
<div class="form-group">
- <label for="inputEmail" class="col-lg-2 control-label">Email</label>
+ <label for="inputEmail1" class="col-lg-2 control-label">Email</label>
<div class="col-lg-10">
- <input type="text" class="form-control" id="inputEmail" placeholder="Email">
+ <input type="email" class="form-control" id="inputEmail1" placeholder="Email">
</div>
</div>
<div class="form-group">
- <label for="inputPassword" class="col-lg-2 control-label">Password</label>
+ <label for="inputPassword1" class="col-lg-2 control-label">Password</label>
<div class="col-lg-10">
- <input type="password" class="form-control" id="inputPassword" placeholder="Password">
+ <input type="password" class="form-control" id="inputPassword1" placeholder="Password">
+ </div>
+ </div>
+ <div class="form-group">
+ <div class="col-lg-offset-2 col-lg-10">
<div class="checkbox">
<label>
<input type="checkbox"> Remember me
</label>
</div>
+ </div>
+ </div>
+ <div class="form-group">
+ <div class="col-lg-offset-2 col-lg-10">
<button type="submit" class="btn btn-default">Sign in</button>
</div>
</div>
{% endhighlight %}
- <h2 id="forms-controls">Supported form controls</h2>
+ <h2 id="forms-controls">Supported controls</h2>
<p>Examples of standard form controls supported in an example form layout.</p>
<h3>Inputs</h3>
- <p>Most common form control, text-based input fields. Includes support for all HTML5 types: text, password, datetime, datetime-local, date, month, time, week, number, email, url, search, tel, and color.</p>
+ <p>Most common form control, text-based input fields. Includes support for all HTML5 types: <code>text</code>, <code>password</code>, <code>datetime</code>, <code>datetime-local</code>, <code>date</code>, <code>month</code>, <code>time</code>, <code>week</code>, <code>number</code>, <code>email</code>, <code>url</code>, <code>search</code>, <code>tel</code>, and <code>color</code>.</p>
<div class="bs-callout bs-callout-danger">
<h4>Type declaration required</h4>
<p>Inputs will only be fully styled if their <code>type</code> is properly declared.</p>
<input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" checked>
Option one is this and that—be sure to include why it's great
</label>
+</div>
+<div class="radio">
<label>
<input type="radio" name="optionsRadios" id="optionsRadios2" value="option2">
Option two can be something else and selecting it will deselect option one
{% endhighlight %}
<h3>Selects</h3>
- <p>Use the default option or specify a <code>multiple="multiple"</code> to show multiple options at once.</p>
+ <p>Use the default option, or add <code>multiple</code> to show multiple options at once.</p>
<form class="bs-example">
<select class="form-control">
<option>1</option>
<option>5</option>
</select>
<br>
- <select multiple="multiple" class="form-control">
+ <select multiple class="form-control">
<option>1</option>
<option>2</option>
<option>3</option>
<option>5</option>
</select>
-<select multiple="multiple" class="form-control">
+<select multiple class="form-control">
<option>1</option>
<option>2</option>
<option>3</option>
{% endhighlight %}
+ <h2 id="forms-controls-static">Static control</h2>
+ <p>When you need to place plain text next to a form label within a horizontal form, use the <code>.form-control-static</code> class on a <code><p></code>.</p>
+ <form class="bs-example form-horizontal">
+ <div class="form-group">
+ <label class="col-lg-2 control-label">Email</label>
+ <div class="col-lg-10">
+ <p class="form-control-static">email@example.com</p>
+ </div>
+ </div>
+ <div class="form-group">
+ <label for="inputPassword" class="col-lg-2 control-label">Password</label>
+ <div class="col-lg-10">
+ <input type="password" class="form-control" id="inputPassword" placeholder="Password">
+ </div>
+ </div>
+ </form>
+{% highlight html %}
+<form class="form-horizontal" role="form">
+ <div class="form-group">
+ <label class="col-lg-2 control-label">Email</label>
+ <div class="col-lg-10">
+ <p class="form-control-static">email@example.com</p>
+ </div>
+ </div>
+ <div class="form-group">
+ <label for="inputPassword" class="col-lg-2 control-label">Password</label>
+ <div class="col-lg-10">
+ <input type="password" class="form-control" id="inputPassword" placeholder="Password">
+ </div>
+ </div>
+</form>
+{% endhighlight %}
+
- <h2 id="forms-control-states">Form control states</h2>
+ <h2 id="forms-control-states">Form states</h2>
<p>Provide feedback to users or visitors with basic feedback states on form controls and labels.</p>
<h3 id="forms-input-focus">Input focus</h3>
<div class="bs-callout bs-callout-danger">
<h4>Cross-browser compatibility</h4>
- <p>While Bootstrap will apply these styles in all browsers, IE and Safari don't actually support the <code><disabled></code> attribute on a <code><fieldset></code>. Use custom JavaScript to disable the fieldset in these browsers.</p>
+ <p>While Bootstrap will apply these styles in all browsers, Internet Explorer 9 and below don't actually support the <code>disabled</code> attribute on a <code><fieldset></code>. Use custom JavaScript to disable the fieldset in these browsers.</p>
</div>
- <form class="bs-example form-inline">
+ <form class="bs-example">
<fieldset disabled>
- <input type="text" class="form-control" placeholder="Disabled input">
- <select class="form-control">
- <option>Disabled select</option>
- </select>
+ <div class="form-group">
+ <label for="disabledTextInput">Disabled input</label>
+ <input type="text" id="disabledTextInput" class="form-control" placeholder="Disabled input">
+ </div>
+ <div class="form-group">
+ <label for="disabledSelect">Disabled select menu</label>
+ <select id="disabledSelect" class="form-control">
+ <option>Disabled select</option>
+ </select>
+ </div>
<div class="checkbox">
<label>
<input type="checkbox"> Can't check this
</fieldset>
</form>
{% highlight html %}
-<form class="form-inline">
+<form class="form-inline" role="form">
<fieldset disabled>
- <input type="text" class="form-control" placeholder="Disabled input">
- <select class="form-control">
- <option>Disabled select</option>
- </select>
+ <div class="form-group">
+ <label for="disabledTextInput">Disabled input</label>
+ <input type="text" id="disabledTextInput" class="form-control" placeholder="Disabled input">
+ </div>
+ <div class="form-group">
+ <label for="disabledSelect">Disabled select menu</label>
+ <select id="disabledSelect" class="form-control">
+ <option>Disabled select</option>
+ </select>
+ </div>
<div class="checkbox">
<label>
<input type="checkbox"> Can't check this
{% endhighlight %}
<h3 id="forms-validation">Validation states</h3>
- <p>Bootstrap includes validation styles for error, warning, and success states on from controls. To use, add <code>.has-warning</code>, <code>.has-error</code>, or <code>.has-success</code> to the parent element. Any <code>.control-label</code>, <code>.form-control</code>, and <code>.help-block</code> within that element will receive the validation styles.</li>
+ <p>Bootstrap includes validation styles for error, warning, and success states on form controls. To use, add <code>.has-warning</code>, <code>.has-error</code>, or <code>.has-success</code> to the parent element. Any <code>.control-label</code>, <code>.form-control</code>, and <code>.help-block</code> within that element will receive the validation styles.</p>
<form class="bs-example">
+ <div class="form-group has-success">
+ <label class="control-label" for="inputSuccess">Input with success</label>
+ <input type="text" class="form-control" id="inputSuccess">
+ </div>
<div class="form-group has-warning">
<label class="control-label" for="inputWarning">Input with warning</label>
<input type="text" class="form-control" id="inputWarning">
<label class="control-label" for="inputError">Input with error</label>
<input type="text" class="form-control" id="inputError">
</div>
- <div class="form-group has-success">
- <label class="control-label" for="inputSuccess">Input with success</label>
- <input type="text" class="form-control" id="inputSuccess">
- </div>
</form>
{% highlight html %}
+<div class="form-group has-success">
+ <label class="control-label" for="inputSuccess">Input with success</label>
+ <input type="text" class="form-control" id="inputSuccess">
+</div>
<div class="form-group has-warning">
<label class="control-label" for="inputWarning">Input with warning</label>
<input type="text" class="form-control" id="inputWarning">
<label class="control-label" for="inputError">Input with error</label>
<input type="text" class="form-control" id="inputError">
</div>
-<div class="form-group has-success">
- <label class="control-label" for="inputSuccess">Input with success</label>
- <input type="text" class="form-control" id="inputSuccess">
-</div>
{% endhighlight %}
- <h2 id="forms-input-groups">Input groups</h3>
- <p>Add text or buttons before, after, or on both sides of any text-based input. Use <code>.input-group</code> with an <code>.add-on</code> to prepend or append elements to an <code><input></code>.</p>
-
- <div class="bs-callout bs-callout-danger">
- <h4>Cross-browser compatibility</h4>
- <p>Avoid using <code><select></code> elements here as they cannot be fully styled in WebKit browsers.</p>
- </div>
- <div class="bs-callout bs-callout-info">
- <h4>Tooltips & popovers in input groups require special setting</h4>
- <p>When using tooltips or popovers on elements within an <code>.input-group</code>, you'll have to specify the option <code>container: 'body'</code> to avoid unwanted side effects (such as the element growing wider and/or losing its rounded corners when the tooltip or popover is triggered).</p>
- </div>
-
- <form class="bs-example bs-example-form">
- <div class="input-group">
- <span class="input-group-addon">@</span>
- <input type="text" class="form-control" placeholder="Username">
- </div>
- <br>
- <div class="input-group">
- <input type="text" class="form-control">
- <span class="input-group-addon">.00</span>
- </div>
- <br>
- <div class="input-group">
- <span class="input-group-addon">$</span>
- <input type="text" class="form-control">
- <span class="input-group-addon">.00</span>
- </div>
- </form>
-{% highlight html %}
-<div class="input-group">
- <span class="input-group-addon">@</span>
- <input type="text" class="form-control" placeholder="Username">
-</div>
-
-<div class="input-group">
- <input type="text" class="form-control">
- <span class="input-group-addon">.00</span>
-</div>
-
-<div class="input-group">
- <span class="input-group-addon">$</span>
- <input type="text" class="form-control">
- <span class="input-group-addon">.00</span>
-</div>
-{% endhighlight %}
-
- <h3>Optional sizes</h3>
- <p>Add the relative form sizing classes to the <code>.input-group-addon</code>.</p>
- <form class="bs-example bs-example-form">
- <div class="input-group">
- <span class="input-group-addon input-large">@</span>
- <input type="text" class="form-control input-large" placeholder="Username">
- </div>
- <br>
- <div class="input-group">
- <span class="input-group-addon">@</span>
- <input type="text" class="form-control" placeholder="Username">
- </div>
- <br>
- <div class="input-group">
- <span class="input-group-addon input-small">@</span>
- <input type="text" class="form-control input-small" placeholder="Username">
- </div>
- </form>
-{% highlight html %}
-<div class="input-group">
- <span class="input-group-addon input-large">@</span>
- <input type="text" class="form-control input-large" placeholder="Username">
-</div>
-
-<div class="input-group">
- <span class="input-group-addon">@</span>
- <input type="text" class="form-control" placeholder="Username">
-</div>
-
-<div class="input-group">
- <span class="input-group-addon input-small">@</span>
- <input type="text" class="form-control input-small" placeholder="Username">
-</div>
-{% endhighlight %}
-
- <h3>Buttons instead of text</h3>
- <p>Buttons in input groups are a bit different and require one extra level of nesting. Instead of <code>.input-group-addon</code>, you'll need to use <code>.input-group-btn</code> to wrap the buttons. This is required due to default browser styles that cannot be overridden.</p>
- <form class="bs-example bs-example-form">
- <div class="row">
- <div class="col-lg-6">
- <div class="input-group">
- <span class="input-group-btn">
- <button class="btn btn-default" type="button">Go!</button>
- </span>
- <input type="text" class="form-control">
- </div><!-- /input-group -->
- </div><!-- /.col-lg-6 -->
- <div class="col-lg-6">
- <div class="input-group">
- <input type="text" class="form-control">
- <span class="input-group-btn">
- <button class="btn btn-default" type="button">Go!</button>
- </span>
- </div><!-- /input-group -->
- </div><!-- /.col-lg-6 -->
- </div><!-- /.row -->
- </form>
-{% highlight html %}
-<div class="row">
- <div class="col-lg-6">
- <div class="input-group">
- <span class="input-group-btn">
- <button class="btn btn-default" type="button">Go!</button>
- </span>
- <input type="text" class="form-control">
- </div><!-- /input-group -->
- </div><!-- /.col-lg-6 -->
- <div class="col-lg-6">
- <div class="input-group">
- <input type="text" class="form-control">
- <span class="input-group-btn">
- <button class="btn btn-default" type="button">Go!</button>
- </span>
- </div><!-- /input-group -->
- </div><!-- /.col-lg-6 -->
-</div><!-- /.row -->
-{% endhighlight %}
-
- <h3>Button dropdowns</h3>
- <p></p>
- <form class="bs-example bs-example-form">
- <div class="row">
- <div class="col-lg-6">
- <div class="input-group">
- <div class="input-group-btn">
- <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Action <span class="caret"></span></button>
- <ul class="dropdown-menu">
- <li><a href="#">Action</a></li>
- <li><a href="#">Another action</a></li>
- <li><a href="#">Something else here</a></li>
- <li class="divider"></li>
- <li><a href="#">Separated link</a></li>
- </ul>
- </div><!-- /btn-group -->
- <input type="text" class="form-control">
- </div><!-- /input-group -->
- </div><!-- /.col-lg-6 -->
- <div class="col-lg-6">
- <div class="input-group">
- <input type="text" class="form-control">
- <div class="input-group-btn">
- <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Action <span class="caret"></span></button>
- <ul class="dropdown-menu">
- <li><a href="#">Action</a></li>
- <li><a href="#">Another action</a></li>
- <li><a href="#">Something else here</a></li>
- <li class="divider"></li>
- <li><a href="#">Separated link</a></li>
- </ul>
- </div><!-- /btn-group -->
- </div><!-- /input-group -->
- </div><!-- /.col-lg-6 -->
- </div><!-- /.row -->
- </form>
-{% highlight html %}
-<div class="row">
- <div class="col-lg-6">
- <div class="input-group">
- <div class="input-group-btn">
- <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Action <span class="caret"></span></button>
- <ul class="dropdown-menu">
- <li><a href="#">Action</a></li>
- <li><a href="#">Another action</a></li>
- <li><a href="#">Something else here</a></li>
- <li class="divider"></li>
- <li><a href="#">Separated link</a></li>
- </ul>
- </div><!-- /btn-group -->
- <input type="text" class="form-control">
- </div><!-- /input-group -->
- </div><!-- /.col-lg-6 -->
- <div class="col-lg-6">
- <div class="input-group">
- <input type="text" class="form-control">
- <div class="input-group-btn">
- <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Action <span class="caret"></span></button>
- <ul class="dropdown-menu">
- <li><a href="#">Action</a></li>
- <li><a href="#">Another action</a></li>
- <li><a href="#">Something else here</a></li>
- <li class="divider"></li>
- <li><a href="#">Separated link</a></li>
- </ul>
- </div><!-- /btn-group -->
- </div><!-- /input-group -->
- </div><!-- /.col-lg-6 -->
-</div><!-- /.row -->
-{% endhighlight %}
-
- <h3>Segmented dropdown groups</h3>
- <form class="bs-example bs-example-form">
- <div class="row">
- <div class="col-lg-6">
- <div class="input-group">
- <div class="input-group-btn">
- <button type="button" class="btn btn-default" tabindex="-1">Action</button>
- <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" tabindex="-1">
- <span class="caret"></span>
- </button>
- <ul class="dropdown-menu">
- <li><a href="#">Action</a></li>
- <li><a href="#">Another action</a></li>
- <li><a href="#">Something else here</a></li>
- <li class="divider"></li>
- <li><a href="#">Separated link</a></li>
- </ul>
- </div>
- <input type="text" class="form-control">
- </div><!-- /.input-group -->
- </div><!-- /.col-lg-6 -->
- <div class="col-lg-6">
- <div class="input-group">
- <input type="text" class="form-control">
- <div class="input-group-btn">
- <button type="button" class="btn btn-default" tabindex="-1">Action</button>
- <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" tabindex="-1">
- <span class="caret"></span>
- </button>
- <ul class="dropdown-menu pull-right">
- <li><a href="#">Action</a></li>
- <li><a href="#">Another action</a></li>
- <li><a href="#">Something else here</a></li>
- <li class="divider"></li>
- <li><a href="#">Separated link</a></li>
- </ul>
- </div>
- </div><!-- /.input-group -->
- </div><!-- /.col-lg-6 -->
- </div><!-- /.row -->
- </form>
-{% highlight html %}
-<div class="input-group">
- <div class="input-group-btn">
- <!-- Button and dropdown menu -->
- </div>
- <input type="text" class="form-control">
-</div>
-
-<div class="input-group">
- <input type="text" class="form-control">
- <div class="input-group-btn btn-group">
- <!-- Button and dropdown menu -->
- </div>
-</div>
-{% endhighlight %}
-
<h2 id="forms-control-sizes">Control sizing</h2>
- <p>Use relative sizing classes like <code>.input-large</code> or match your inputs to the grid column sizes using <code>.col-lg-*</code> classes.</p>
+ <p>Set heights using classes like <code>.input-lg</code>, and set widths using grid column classes like <code>.col-lg-*</code>.</p>
- <h3>Relative sizing</h3>
+ <h3>Height sizing</h3>
<p>Create larger or smaller form controls that match button sizes.</p>
<form class="bs-example bs-example-control-sizing">
<div class="controls docs-input-sizes">
- <input class="form-control input-large" type="text" placeholder=".input-large">
+ <input class="form-control input-lg" type="text" placeholder=".input-lg">
<input type="text" class="form-control" placeholder="Default input">
- <input class="form-control input-small" type="text" placeholder=".input-small">
+ <input class="form-control input-sm" type="text" placeholder=".input-sm">
- <select class="form-control input-large">
- <option value="">.input-large</option>
+ <select class="form-control input-lg">
+ <option value="">.input-lg</option>
</select>
<select class="form-control">
<option value="">Default select</option>
</select>
- <select class="form-control input-small">
- <option value="">.input-small</option>
+ <select class="form-control input-sm">
+ <option value="">.input-sm</option>
</select>
</div>
</form>
{% highlight html %}
-<input class="form-control input-large" type="text" placeholder=".input-large">
-<input class="form-control"type="text" placeholder="Default input">
-<input class="form-control input-small" type="text" placeholder=".input-small">
+<input class="form-control input-lg" type="text" placeholder=".input-lg">
+<input class="form-control" type="text" placeholder="Default input">
+<input class="form-control input-sm" type="text" placeholder=".input-sm">
-<select class="form-control input-large">...</select>
+<select class="form-control input-lg">...</select>
<select class="form-control">...</select>
-<select class="form-control input-small">...</select>
+<select class="form-control input-sm">...</select>
{% endhighlight %}
<h3>Column sizing</h3>
<p>Block level help text for form controls.</p>
<form class="bs-example">
<input type="text" class="form-control">
- <span class="help-block">A longer block of help text that breaks onto a new line and may extend beyond one line.</span>
+ <span class="help-block">A block of help text that breaks onto a new line and may extend beyond one line.</span>
</form>
{% highlight html %}
-<span class="help-block">A longer block of help text that breaks onto a new line and may extend beyond one line.</span>
+<span class="help-block">A block of help text that breaks onto a new line and may extend beyond one line.</span>
{% endhighlight %}
</div>
<h1 id="buttons">Buttons</h1>
</div>
- <h2 id="buttons-options">Button options</h2>
+ <h2 id="buttons-options">Options</h2>
<p>Use any of the available button classes to quickly create a styled button.</p>
<div class="bs-example">
<button type="button" class="btn btn-default">Default</button>
<button type="button" class="btn btn-link">Link</button>
{% endhighlight %}
- <h2 id="buttons-sizes">Button sizes</h2>
- <p>Fancy larger or smaller buttons? Add <code>.btn-large</code> or <code>.btn-small</code> for additional sizes.</p>
+ <h2 id="buttons-sizes">Sizes</h2>
+ <p>Fancy larger or smaller buttons? Add <code>.btn-lg</code>, <code>.btn-sm</code>, or <code>.btn-xs</code> for additional sizes.</p>
<div class="bs-example">
<p>
- <button type="button" class="btn btn-primary btn-large">Large button</button>
- <button type="button" class="btn btn-default btn-large">Large button</button>
+ <button type="button" class="btn btn-primary btn-lg">Large button</button>
+ <button type="button" class="btn btn-default btn-lg">Large button</button>
</p>
<p>
<button type="button" class="btn btn-primary">Default button</button>
<button type="button" class="btn btn-default">Default button</button>
</p>
<p>
- <button type="button" class="btn btn-primary btn-small">Small button</button>
- <button type="button" class="btn btn-default btn-small">Small button</button>
+ <button type="button" class="btn btn-primary btn-sm">Small button</button>
+ <button type="button" class="btn btn-default btn-sm">Small button</button>
+ </p>
+ <p>
+ <button type="button" class="btn btn-primary btn-xs">Extra small button</button>
+ <button type="button" class="btn btn-default btn-xs">Extra small button</button>
</p>
</div>
{% highlight html %}
<p>
- <button type="button" class="btn btn-primary btn-large">Large button</button>
- <button type="button" class="btn btn-default btn-large">Large button</button>
+ <button type="button" class="btn btn-primary btn-lg">Large button</button>
+ <button type="button" class="btn btn-default btn-lg">Large button</button>
</p>
<p>
<button type="button" class="btn btn-primary">Default button</button>
<button type="button" class="btn btn-default">Default button</button>
</p>
<p>
- <button type="button" class="btn btn-primary btn-small">Small button</button>
- <button type="button" class="btn btn-default btn-small">Small button</button>
+ <button type="button" class="btn btn-primary btn-sm">Small button</button>
+ <button type="button" class="btn btn-default btn-sm">Small button</button>
+</p>
+<p>
+ <button type="button" class="btn btn-primary btn-xs">Extra small button</button>
+ <button type="button" class="btn btn-default btn-xs">Extra small button</button>
</p>
{% endhighlight %}
<p>Create block level buttons—those that span the full width of a parent— by adding <code>.btn-block</code>.</p>
<div class="bs-example">
<div class="well" style="max-width: 400px; margin: 0 auto 10px;">
- <button type="button" class="btn btn-primary btn-large btn-block">Block level button</button>
- <button type="button" class="btn btn-default btn-large btn-block">Block level button</button>
+ <button type="button" class="btn btn-primary btn-lg btn-block">Block level button</button>
+ <button type="button" class="btn btn-default btn-lg btn-block">Block level button</button>
</div>
</div>
{% highlight html %}
-<button type="button" class="btn btn-primary btn-large btn-block">Block level button</button>
-<button type="button" class="btn btn-default btn-large btn-block">Block level button</button>
+<button type="button" class="btn btn-primary btn-lg btn-block">Block level button</button>
+<button type="button" class="btn btn-default btn-lg btn-block">Block level button</button>
{% endhighlight %}
<h3>Button element</h3>
<p>Add the <code>disabled</code> attribute to <code><button></code> buttons.</p>
<p class="bs-example">
- <button type="button" class="btn btn-primary btn-large" disabled="disabled">Primary button</button>
- <button type="button" class="btn btn-default btn-large" disabled="disabled">Button</button>
+ <button type="button" class="btn btn-primary btn-lg" disabled="disabled">Primary button</button>
+ <button type="button" class="btn btn-default btn-lg" disabled="disabled">Button</button>
</p>
{% highlight html %}
-<button type="button" class="btn btn-large btn-primary" disabled="disabled">Primary button</button>
-<button type="button" class="btn btn-default btn-large" disabled="disabled">Button</button>
+<button type="button" class="btn btn-lg btn-primary" disabled="disabled">Primary button</button>
+<button type="button" class="btn btn-default btn-lg" disabled="disabled">Button</button>
{% endhighlight %}
<div class="bs-callout bs-callout-danger">
<h3>Anchor element</h3>
<p>Add the <code>.disabled</code> class to <code><a></code> buttons.</p>
<p class="bs-example">
- <a href="#" class="btn btn-primary btn-large disabled">Primary link</a>
- <a href="#" class="btn btn-default btn-large disabled">Link</a>
+ <a href="#" class="btn btn-primary btn-lg disabled">Primary link</a>
+ <a href="#" class="btn btn-default btn-lg disabled">Link</a>
</p>
{% highlight html %}
-<a href="#" class="btn btn-primary btn-large disabled">Primary link</a>
-<a href="#" class="btn btn-default btn-large disabled">Link</a>
+<a href="#" class="btn btn-primary btn-lg disabled">Primary link</a>
+<a href="#" class="btn btn-default btn-lg disabled">Link</a>
{% endhighlight %}
<p>
We use <code>.disabled</code> as a utility class here, similar to the common <code>.active</code> class, so no prefix is required.
</div>
- <h2 id="buttons-tags">Using multiple tags</h2>
+ <h2 id="buttons-tags">Button tags</h2>
<p>Use the button classes on an <code><a></code>, <code><button></code>, or <code><input></code> element.</p>
<form class="bs-example">
<a class="btn btn-default" href="#">Link</a>
<div class="bs-callout bs-callout-warning">
<h4>Cross-browser rendering</h4>
<p>As a best practice, <strong>we highly recommend using the <code><button></code> element whenever possible</strong> to ensure matching cross-browser rendering.</p>
+ <p>Among other things, there's <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=697451">a Firefox bug</a> that prevents us from setting the <code>line-height</code> of <code><input></code>-based buttons, causing them to not exactly match the height of other buttons on Firefox.</p>
</div>
</div>
<p>Keep in mind that Internet Explorer 8 lacks support for rounded corners.</p>
</div>
<div class="bs-example bs-example-images">
- <img data-src="holder.js/140x140" class="img-rounded">
- <img data-src="holder.js/140x140" class="img-circle">
- <img data-src="holder.js/140x140" class="img-thumbnail">
+ <img data-src="holder.js/140x140" src="data:image/png;base64," class="img-rounded" alt="A generic square placeholder image with rounded corners">
+ <img data-src="holder.js/140x140" src="data:image/png;base64," class="img-circle" alt="A generic square placeholder image where only the portion within the circle circumscribed about said square is visible">
+ <img data-src="holder.js/140x140" src="data:image/png;base64," class="img-thumbnail" alt="A generic square placeholder image with a white border around it, making it resemble a photograph taken with an old instant camera">
</div>
{% highlight html %}
-<img src="..." class="img-rounded">
-<img src="..." class="img-circle">
-<img src="..." class="img-thumbnail">
+<img src="..." alt="..." class="img-rounded">
+<img src="..." alt="..." class="img-circle">
+<img src="..." alt="..." class="img-thumbnail">
{% endhighlight %}
+ <div class="bs-callout bs-callout-warning">
+ <h4>Responsive images</h4>
+ <p>Looking for how to make images more responsive? <a href="../css#overview-responsive-images">Check out the responsive images section</a> up top.</p>
+ </div>
+
</div>
<h3>Close icon</h3>
<p>Use the generic close icon for dismissing content like modals and alerts.</p>
<div class="bs-example">
- <p><button type="button" class="close">×</button></p>
+ <p><button type="button" class="close" aria-hidden="true">×</button></p>
</div>
{% highlight html %}
-<button type="button" class="close">×</button>
+<button type="button" class="close" aria-hidden="true">×</button>
{% endhighlight %}
<h3>.pull-left</h3>
{% endhighlight %}
{% highlight css %}
// Mixin
-.clearfix {
+.clearfix() {
&:before,
&:after {
content: " ";
.element {
.clearfix();
}
+{% endhighlight %}
+
+ <h3>.sr-only</h3>
+ <p>Hide an element to all users <em>except</em> screen readers. Necessary for following <a href="{{ page.base_url }}getting-started#accessibility">accessibility best practices</a>.</p>
+{% highlight html %}
+<a class="sr-only" href="#content">Skip to content</a>
{% endhighlight %}
</div>
<table class="table table-bordered table-striped responsive-utilities">
<thead>
<tr>
- <th>Class</th>
- <th>Small devices <small>Up to 768px</small></th>
- <th>Medium devices <small>768px to 979px</small></th>
- <th>Large devices <small>980px and up</small></th>
+ <th></th>
+ <th>
+ Extra small devices
+ <small>Phones (<768px)</small>
+ </th>
+ <th>
+ Small devices
+ <small>Tablets (≥768px)</small>
+ </th>
+ <th>
+ Medium devices
+ <small>Desktops (≥992px)</small>
+ </th>
+ <th>
+ Large devices
+ <small>Desktops (≥1200px)</small>
+ </th>
</tr>
</thead>
<tbody>
+ <tr>
+ <th><code>.visible-xs</code></th>
+ <td class="is-visible">Visible</td>
+ <td class="is-hidden">Hidden</td>
+ <td class="is-hidden">Hidden</td>
+ <td class="is-hidden">Hidden</td>
+ </tr>
<tr>
<th><code>.visible-sm</code></th>
+ <td class="is-hidden">Hidden</td>
<td class="is-visible">Visible</td>
<td class="is-hidden">Hidden</td>
<td class="is-hidden">Hidden</td>
<tr>
<th><code>.visible-md</code></th>
<td class="is-hidden">Hidden</td>
+ <td class="is-hidden">Hidden</td>
<td class="is-visible">Visible</td>
<td class="is-hidden">Hidden</td>
</tr>
<th><code>.visible-lg</code></th>
<td class="is-hidden">Hidden</td>
<td class="is-hidden">Hidden</td>
+ <td class="is-hidden">Hidden</td>
+ <td class="is-visible">Visible</td>
+ </tr>
+ </tbody>
+ <tbody>
+ <tr>
+ <th><code>.hidden-xs</code></th>
+ <td class="is-hidden">Hidden</td>
+ <td class="is-visible">Visible</td>
+ <td class="is-visible">Visible</td>
<td class="is-visible">Visible</td>
</tr>
<tr>
<th><code>.hidden-sm</code></th>
+ <td class="is-visible">Visible</td>
<td class="is-hidden">Hidden</td>
<td class="is-visible">Visible</td>
<td class="is-visible">Visible</td>
<tr>
<th><code>.hidden-md</code></th>
<td class="is-visible">Visible</td>
+ <td class="is-visible">Visible</td>
<td class="is-hidden">Hidden</td>
<td class="is-visible">Visible</td>
</tr>
<th><code>.hidden-lg</code></th>
<td class="is-visible">Visible</td>
<td class="is-visible">Visible</td>
+ <td class="is-visible">Visible</td>
<td class="is-hidden">Hidden</td>
</tr>
</tbody>
<p>Resize your browser or load on different devices to test the responsive utility classes.</p>
<h4>Visible on...</h4>
<p>Green checkmarks indicate the element <strong>is visible</strong> in your current viewport.</p>
- <ul class="responsive-utilities-test visible-on">
- <li>
+ <div class="row responsive-utilities-test visible-on">
+ <div class="col-xs-6 col-sm-3">
+ <span class="hidden-xs">Extra small</span>
+ <span class="visible-xs">✔ Visible on x-small</span>
+ </div>
+ <div class="col-xs-6 col-sm-3">
<span class="hidden-sm">Small</span>
<span class="visible-sm">✔ Visible on small</span>
- </li>
- <li>
+ </div>
+ <div class="clearfix visible-xs"></div>
+ <div class="col-xs-6 col-sm-3">
<span class="hidden-md">Medium</span>
<span class="visible-md">✔ Visible on medium</span>
- </li>
- <li>
+ </div>
+ <div class="col-xs-6 col-sm-3">
<span class="hidden-lg">Large</span>
<span class="visible-lg">✔ Visible on large</span>
- </li>
- </ul>
+ </div>
+ </div>
<h4>Hidden on...</h4>
<p>Here, green checkmarks indicate the element <strong>is hidden</strong> in your current viewport.</p>
- <ul class="responsive-utilities-test hidden-on">
- <li>
+ <div class="row responsive-utilities-test hidden-on">
+ <div class="col-xs-6 col-sm-3">
+ <span class="visible-xs">Extra small</span>
+ <span class="hidden-xs">✔ Hidden on x-small</span>
+ </div>
+ <div class="col-xs-6 col-sm-3">
<span class="visible-sm">Small</span>
<span class="hidden-sm">✔ Hidden on small</span>
- </li>
- <li>
+ </div>
+ <div class="clearfix visible-xs"></div>
+ <div class="col-xs-6 col-sm-3">
<span class="visible-md">Medium</span>
<span class="hidden-md">✔ Hidden on medium</span>
- </li>
- <li>
+ </div>
+ <div class="col-xs-6 col-sm-3">
<span class="visible-lg">Large</span>
- <span class="hidden-lg">✔ Hidden on desktop</span>
- </li>
- </ul>
+ <span class="hidden-lg">✔ Hidden on large</span>
+ </div>
+ </div>
</div>
---
-layout: customize
+layout: default
title: Customize and download
slug: customize
lead: Customize Bootstrap's components, LESS variables, and jQuery plugins to get your very own version.
<!-- Customize
================================================== -->
-<form class="bs-customizer">
- <div class="bs-docs-section">
+<form class="bs-customizer" role="form">
+ <div class="bs-docs-section" id="less-section">
<div class="page-header">
<button class="btn btn-default toggle" type="button">Toggle all</button>
<h1 id="less">LESS files</h1>
<h3>Basics</h3>
<div class="row">
- <div class="col-lg-4">
+ <div class="col-xs-6 col-sm-4">
<h4>Layout</h4>
<div class="checkbox">
<label>
</label>
</div>
</div>
- <div class="col-lg-4">
+ <div class="col-xs-6 col-sm-4">
<h4>Global CSS</h4>
<div class="checkbox">
<label>
</label>
</div>
</div>
- <div class="col-lg-4">
+ <div class="col-xs-6 col-sm-4">
<h4>Utility classes</h4>
<div class="checkbox">
<label>
<h3>Components</h3>
<div class="row">
- <div class="col-lg-4">
+ <div class="col-xs-6 col-sm-4">
<h4>Navigation</h4>
<div class="checkbox">
<label>
</label>
</div>
</div>
- <div class="col-lg-4">
+ <div class="col-xs-6 col-sm-4">
<h4>Content blocks</h4>
<div class="checkbox">
<label>
Jumbotron
</label>
</div>
- <div class="checkbox">
- <label>
- <input type="checkbox" checked value="accordion.less">
- Accordion
- </label>
- </div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="panels.less">
</label>
</div>
</div>
- <div class="col-lg-4">
+ <div class="col-xs-6 col-sm-4">
<h4>Behavioral (requires JS)</h4>
<div class="checkbox">
<label>
</div>
<div class="row">
- <div class="col-lg-4">
+ <div class="col-xs-6 col-sm-4">
<h4>Media</h4>
<div class="checkbox">
<label>
</label>
</div>
</div>
- <div class="col-lg-4">
+ <div class="col-xs-6 col-sm-4">
<h4>Miscellaneous</h4>
+ <div class="checkbox">
+ <label>
+ <input type="checkbox" checked value="input-groups.less">
+ Input groups
+ </label>
+ </div>
<div class="checkbox">
<label>
<input type="checkbox" checked value="button-groups.less">
- <div class="bs-docs-section">
+ <div class="bs-docs-section" id="plugin-section">
<div class="page-header">
<button class="btn btn-default toggle" type="button">Toggle all</button>
<h1 id="plugins">jQuery plugins</h1>
- <div class="bs-docs-section">
+ <div class="bs-docs-section" id="less-variables-section">
<div class="page-header">
<button class="btn btn-default toggle" type="button">Reset to defaults</button>
<h1 id="less-variables">LESS variables</h1>
<input type="text" class="form-control" placeholder="#f9f2f4">
</div>
<div class="col-lg-6">
+ <label>@pre-color</label>
+ <input type="text" class="form-control" placeholder="@gray-dark">
<label>@pre-bg</label>
<input type="text" class="form-control" placeholder="#f5f5f5">
- <label>@code-border-color</label>
+ <label>@pre-border-color</label>
<input type="text" class="form-control" placeholder="#ccc">
</div>
</div>
<p>Define the breakpoints at which your layout will change, adapting to different screen sizes.</p>
<div class="row">
<div class="col-lg-6">
- <label>@screen-tiny</label>
+ <label>@screen-xsmall</label>
<input type="text" class="form-control" placeholder="480px">
<label>@screen-small</label>
<input type="text" class="form-control" placeholder="768px">
</div>
<h2 id="variables-alerts">Alerts</h2>
- <p>Define alert colors and border radius.</p>
+ <p>Define alert colors, border radius, and padding.</p>
<h4>Border radius</h4>
+ <label>@alert-padding</label>
+ <input type="text" class="form-control" placeholder="15px">
<label>@alert-border-radius</label>
<input type="text" class="form-control" placeholder="@border-radius-base">
<div class="row">
<div class="col-lg-6">
+ <h4>Default (Warning)</h4>
+ <label>@alert-text</label>
+ <input type="text" class="form-control" placeholder="@state-warning-text">
+ <label>@alert-bg</label>
+ <input type="text" class="form-control" placeholder="@state-warning-bg">
+ <label>@alert-border</label>
+ <input type="text" class="form-control" placeholder="@state-warning-border">
<h4>Success</h4>
<label>@alert-success-text</label>
<input type="text" class="form-control" placeholder="@state-success-text">
<input type="text" class="form-control" placeholder="@state-success-bg">
<label>@alert-success-border</label>
<input type="text" class="form-control" placeholder="@state-success-border">
- <h4>Warning</h4>
- <label>@alert-warning-text</label>
- <input type="text" class="form-control" placeholder="@state-warning-text">
- <label>@alert-warning-bg</label>
- <input type="text" class="form-control" placeholder="@state-warning-bg">
- <label>@alert-warning-border</label>
- <input type="text" class="form-control" placeholder="@state-warning-border">
</div>
<div class="col-lg-6">
<h4>Danger</h4>
<h4>Basics</h4>
<label>@navbar-height</label>
<input type="text" class="form-control" placeholder="50px">
+ <label>@navbar-margin-bottom</label>
+ <input type="text" class="form-control" placeholder="@line-height-computed">
<label>@navbar-color</label>
<input type="text" class="form-control" placeholder="#777">
<label>@navbar-bg</label>
<input type="text" class="form-control" placeholder="#eee">
+ <label>@navbar-border-radius</label>
+ <input type="text" class="form-control" placeholder="@border-radius-base">
<h4>Links</h4>
<label>@navbar-link-color</label>
<input type="text" class="form-control" placeholder="#777">
<div class="row">
<div class="col-lg-6">
<h4>Common values</h4>
+ <label>@nav-link-padding</label>
+ <input type="text" class="form-control" placeholder="10px 15px">
<label>@nav-link-hover-bg</label>
<input type="text" class="form-control" placeholder="@gray-lighter">
<label>@nav-disabled-link-color</label>
<div class="row">
<div class="col-lg-6">
<h3>Inputs</h3>
+ <label>@input-color</label>
+ <input type="text" class="form-control" placeholder="@gray">
+ <p class="help-block">Text color for <code><input></code>s</p>
<label>@input-bg</label>
<input type="text" class="form-control" placeholder="#fff">
<p class="help-block"><code><input></code> background color</p>
<p class="help-block">Placeholder text color</p>
<h3>Legend</h3>
+ <label>@legend-color</label>
+ <input type="text" class="form-control" placeholder="@gray">
<label>@legend-border-color</label>
<input type="text" class="form-control" placeholder="#e5e5e5">
- <p class="help-block"><code><legend></code> border color</p>
<h3>Input groups</h3>
+ <label>@input-group-addon-bg</label>
+ <input type="text" class="form-control" placeholder="@gray-lighter">
+ <p class="help-block">Background color for textual input addons</p>
<label>@input-group-addon-border-color</label>
<input type="text" class="form-control" placeholder="@input-border">
<p class="help-block">Border color for textual input addons</p>
<label>@dropdown-divider-bg</label>
<input type="text" class="form-control" placeholder="#e5e5e5">
<p class="help-block">Dropdown divider top border color</p>
+ <label>@dropdown-header-color</label>
+ <input type="text" class="form-control" placeholder="@gray-light">
+ <p class="help-block">Text color for headers within dropdown menus</p>
</div>
<div class="col-lg-6">
<h3>Dropdown items</h3>
<label>@dropdown-link-color</label>
<input type="text" class="form-control" placeholder="@gray-dark">
<p class="help-block">Dropdown text color</p>
- <label>@dropdown-link-active-color</label>
+
+ <label>@dropdown-link-hover-color</label>
<input type="text" class="form-control" placeholder="#fff">
- <p class="help-block">Active dropdown menu entry text color</p>
+ <p class="help-block">Hovered dropdown menu entry text color</p>
<label>@dropdown-link-hover-bg</label>
<input type="text" class="form-control" placeholder="#fff">
<p class="help-block">Hovered dropdown menu entry text color</p>
+
+ <label>@dropdown-link-active-color</label>
+ <input type="text" class="form-control" placeholder="#fff">
+ <p class="help-block">Active dropdown menu entry text color</p>
<label>@dropdown-link-active-bg</label>
<input type="text" class="form-control" placeholder="@component-active-bg">
<p class="help-block">Active dropdown menu entry background color</p>
- <label>@dropdown-link-hover-bg</label>
- <input type="text" class="form-control" placeholder="@dropdown-link-active-bg">
- <p class="help-block">Hovered dropdown menu entry background color</p>
+
+ <label>@dropdown-link-disabled-color</label>
+ <input type="text" class="form-control" placeholder="@dropdown-link-disabled-color">
+ <p class="help-block">Disabled dropdown menu entry background color</p>
</div>
</div>
<h2 id="variables-thumbnails">Thumbnails</h2>
<div class="row">
<div class="col-lg-6">
- <label>@thumbnail-caption-color</label>
- <input type="text" class="form-control" placeholder="@text-color">
- <p class="help-block">Custom text color for thumbnail captions</p>
+ <label>@thumbnail-padding</label>
+ <input type="text" class="form-control" placeholder="4px">
+ <p class="help-block">Padding around the thumbnail image</p>
<label>@thumbnail-bg</label>
<input type="text" class="form-control" placeholder="@body-bg">
<p class="help-block">Thumbnail background color</p>
- </div>
- <div class="col-lg-6">
<label>@thumbnail-border</label>
<input type="text" class="form-control" placeholder="#ddd">
<p class="help-block">Thumbnail border color</p>
<input type="text" class="form-control" placeholder="@border-radius-base">
<p class="help-block">Thumbnail border radius</p>
</div>
+ <div class="col-lg-6">
+ <label>@thumbnail-caption-padding</label>
+ <input type="text" class="form-control" placeholder="@text-color">
+ <p class="help-block">Padding around the thumbnail caption</p>
+ <label>@thumbnail-caption-color</label>
+ <input type="text" class="form-control" placeholder="@text-color">
+ <p class="help-block">Custom text color for thumbnail captions</p>
+ </div>
</div>
<h2 id="variables-progress">Progress bars</h2>
<div class="row">
</div>
<div class="col-lg-4">
<label>@pagination-active-bg</label>
- <input type="text" class="form-control" placeholder="#f5f5f5">
+ <input type="text" class="form-control" placeholder="@brand-primary">
<p class="help-block">Active background color</p>
</div>
<div class="col-lg-4">
<label>@pagination-active-color</label>
- <input type="text" class="form-control" placeholder="@gray-light">
+ <input type="text" class="form-control" placeholder="#fff">
<p class="help-block">Active text color</p>
</div>
<div class="col-lg-4">
<h2 id="variables-labels">Labels</h2>
<div class="row">
<div class="col-lg-6">
+ <label>@label-default-bg</label>
+ <input type="text" class="form-control" placeholder="@gray-light">
+ <p class="help-block">Default label background color</p>
+ <label>@label-primary-bg</label>
+ <input type="text" class="form-control" placeholder="@brand-primary">
+ <p class="help-block">Primary label background color</p>
<label>@label-success-bg</label>
<input type="text" class="form-control" placeholder="@brand-success">
<p class="help-block">Success label background color</p>
+ </div>
+ <div class="col-lg-6">
<label>@label-info-bg</label>
<input type="text" class="form-control" placeholder="@brand-info">
<p class="help-block">Info label background color</p>
- </div>
- <div class="col-lg-6">
<label>@label-warning-bg</label>
<input type="text" class="form-control" placeholder="@brand-warning">
<p class="help-block">Warning label background color</p>
</div>
<p class="lead">Hooray! Your custom version of Bootstrap is now ready to be compiled. Just click the button below to finish the process.</p>
<div class="bs-customize-download">
- <a class="btn btn-block btn-large btn-bs" href="#" onclick="_gaq.push(['_trackEvent', 'Customize', 'Download', 'Customize and Download']);">Customize and Download</a>
+ <button id="btn-download" class="btn btn-block btn-lg btn-bs" onclick="_gaq.push(['_trackEvent', 'Customize', 'Download', 'Customize and Download']);">Customize and Download</button>
</div>
<div class="bs-callout bs-callout-danger">
<h4>What's included?</h4>
</div>
</div><!-- /download -->
</form>
+
+<!-- generated -->
+<script id="files">
+var __js = {"affix.js":"/* ========================================================================\n * Bootstrap: affix.js v3.0.0\n * http://twbs.github.com/bootstrap/javascript.html#affix\n * ========================================================================\n * Copyright 2012 Twitter, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n * ======================================================================== */\n\n\n+function ($) { \"use strict\";\n\n // AFFIX CLASS DEFINITION\n // ======================\n\n var Affix = function (element, options) {\n this.options = $.extend({}, Affix.DEFAULTS, options)\n this.$window = $(window)\n .on('scroll.bs.affix.data-api', $.proxy(this.checkPosition, this))\n .on('click.bs.affix.data-api', $.proxy(this.checkPositionWithEventLoop, this))\n\n this.$element = $(element)\n this.affixed =\n this.unpin = null\n\n this.checkPosition()\n }\n\n Affix.RESET = 'affix affix-top affix-bottom'\n\n Affix.DEFAULTS = {\n offset: 0\n }\n\n Affix.prototype.checkPositionWithEventLoop = function () {\n setTimeout($.proxy(this.checkPosition, this), 1)\n }\n\n Affix.prototype.checkPosition = function () {\n if (!this.$element.is(':visible')) return\n\n var scrollHeight = $(document).height()\n var scrollTop = this.$window.scrollTop()\n var position = this.$element.offset()\n var offset = this.options.offset\n var offsetTop = offset.top\n var offsetBottom = offset.bottom\n\n if (typeof offset != 'object') offsetBottom = offsetTop = offset\n if (typeof offsetTop == 'function') offsetTop = offset.top()\n if (typeof offsetBottom == 'function') offsetBottom = offset.bottom()\n\n var affix = this.unpin != null && (scrollTop + this.unpin <= position.top) ? false :\n offsetBottom != null && (position.top + this.$element.height() >= scrollHeight - offsetBottom) ? 'bottom' :\n offsetTop != null && (scrollTop <= offsetTop) ? 'top' : false\n\n if (this.affixed === affix) return\n if (this.unpin) this.$element.css('top', '')\n\n this.affixed = affix\n this.unpin = affix == 'bottom' ? position.top - scrollTop : null\n\n this.$element.removeClass(Affix.RESET).addClass('affix' + (affix ? '-' + affix : ''))\n\n if (affix == 'bottom') {\n this.$element.offset({ top: document.body.offsetHeight - offsetBottom - this.$element.height() })\n }\n }\n\n\n // AFFIX PLUGIN DEFINITION\n // =======================\n\n var old = $.fn.affix\n\n $.fn.affix = function (option) {\n return this.each(function () {\n var $this = $(this)\n var data = $this.data('bs.affix')\n var options = typeof option == 'object' && option\n\n if (!data) $this.data('bs.affix', (data = new Affix(this, options)))\n if (typeof option == 'string') data[option]()\n })\n }\n\n $.fn.affix.Constructor = Affix\n\n\n // AFFIX NO CONFLICT\n // =================\n\n $.fn.affix.noConflict = function () {\n $.fn.affix = old\n return this\n }\n\n\n // AFFIX DATA-API\n // ==============\n\n $(window).on('load', function () {\n $('[data-spy=\"affix\"]').each(function () {\n var $spy = $(this)\n var data = $spy.data()\n\n data.offset = data.offset || {}\n\n if (data.offsetBottom) data.offset.bottom = data.offsetBottom\n if (data.offsetTop) data.offset.top = data.offsetTop\n\n $spy.affix(data)\n })\n })\n\n}(window.jQuery);\n","alert.js":"/* ========================================================================\n * Bootstrap: alert.js v3.0.0\n * http://twbs.github.com/bootstrap/javascript.html#alerts\n * ========================================================================\n * Copyright 2013 Twitter, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n * ======================================================================== */\n\n\n+function ($) { \"use strict\";\n\n // ALERT CLASS DEFINITION\n // ======================\n\n var dismiss = '[data-dismiss=\"alert\"]'\n var Alert = function (el) {\n $(el).on('click', dismiss, this.close)\n }\n\n Alert.prototype.close = function (e) {\n var $this = $(this)\n var selector = $this.attr('data-target')\n\n if (!selector) {\n selector = $this.attr('href')\n selector = selector && selector.replace(/.*(?=#[^\\s]*$)/, '') // strip for ie7\n }\n\n var $parent = $(selector)\n\n if (e) e.preventDefault()\n\n if (!$parent.length) {\n $parent = $this.hasClass('alert') ? $this : $this.parent()\n }\n\n $parent.trigger(e = $.Event('close.bs.alert'))\n\n if (e.isDefaultPrevented()) return\n\n $parent.removeClass('in')\n\n function removeElement() {\n $parent.trigger('closed.bs.alert').remove()\n }\n\n $.support.transition && $parent.hasClass('fade') ?\n $parent\n .one($.support.transition.end, removeElement)\n .emulateTransitionEnd(150) :\n removeElement()\n }\n\n\n // ALERT PLUGIN DEFINITION\n // =======================\n\n var old = $.fn.alert\n\n $.fn.alert = function (option) {\n return this.each(function () {\n var $this = $(this)\n var data = $this.data('bs.alert')\n\n if (!data) $this.data('bs.alert', (data = new Alert(this)))\n if (typeof option == 'string') data[option].call($this)\n })\n }\n\n $.fn.alert.Constructor = Alert\n\n\n // ALERT NO CONFLICT\n // =================\n\n $.fn.alert.noConflict = function () {\n $.fn.alert = old\n return this\n }\n\n\n // ALERT DATA-API\n // ==============\n\n $(document).on('click.bs.alert.data-api', dismiss, Alert.prototype.close)\n\n}(window.jQuery);\n","button.js":"/* ========================================================================\n * Bootstrap: button.js v3.0.0\n * http://twbs.github.com/bootstrap/javascript.html#buttons\n * ========================================================================\n * Copyright 2013 Twitter, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n * ======================================================================== */\n\n\n+function ($) { \"use strict\";\n\n // BUTTON PUBLIC CLASS DEFINITION\n // ==============================\n\n var Button = function (element, options) {\n this.$element = $(element)\n this.options = $.extend({}, Button.DEFAULTS, options)\n }\n\n Button.DEFAULTS = {\n loadingText: 'loading...'\n }\n\n Button.prototype.setState = function (state) {\n var d = 'disabled'\n var $el = this.$element\n var val = $el.is('input') ? 'val' : 'html'\n var data = $el.data()\n\n state = state + 'Text'\n\n if (!data.resetText) $el.data('resetText', $el[val]())\n\n $el[val](data[state] || this.options[state])\n\n // push to event loop to allow forms to submit\n setTimeout(function () {\n state == 'loadingText' ?\n $el.addClass(d).attr(d, d) :\n $el.removeClass(d).removeAttr(d);\n }, 0)\n }\n\n Button.prototype.toggle = function () {\n var $parent = this.$element.closest('[data-toggle=\"buttons\"]')\n\n if ($parent.length) {\n var $input = this.$element.find('input')\n .prop('checked', !this.$element.hasClass('active'))\n .trigger('change')\n if ($input.prop('type') === 'radio') $parent.find('.active').removeClass('active')\n }\n\n this.$element.toggleClass('active')\n }\n\n\n // BUTTON PLUGIN DEFINITION\n // ========================\n\n var old = $.fn.button\n\n $.fn.button = function (option) {\n return this.each(function () {\n var $this = $(this)\n var data = $this.data('bs.button')\n var options = typeof option == 'object' && option\n\n if (!data) $this.data('bs.button', (data = new Button(this, options)))\n\n if (option == 'toggle') data.toggle()\n else if (option) data.setState(option)\n })\n }\n\n $.fn.button.Constructor = Button\n\n\n // BUTTON NO CONFLICT\n // ==================\n\n $.fn.button.noConflict = function () {\n $.fn.button = old\n return this\n }\n\n\n // BUTTON DATA-API\n // ===============\n\n $(document).on('click.bs.button.data-api', '[data-toggle^=button]', function (e) {\n var $btn = $(e.target)\n if (!$btn.hasClass('btn')) $btn = $btn.closest('.btn')\n $btn.button('toggle')\n e.preventDefault()\n })\n\n}(window.jQuery);\n","carousel.js":"/* ========================================================================\n * Bootstrap: carousel.js v3.0.0\n * http://twbs.github.com/bootstrap/javascript.html#carousel\n * ========================================================================\n * Copyright 2012 Twitter, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n * ======================================================================== */\n\n\n+function ($) { \"use strict\";\n\n // CAROUSEL CLASS DEFINITION\n // =========================\n\n var Carousel = function (element, options) {\n this.$element = $(element)\n this.$indicators = this.$element.find('.carousel-indicators')\n this.options = options\n this.paused =\n this.sliding =\n this.interval =\n this.$active =\n this.$items = null\n\n this.options.pause == 'hover' && this.$element\n .on('mouseenter', $.proxy(this.pause, this))\n .on('mouseleave', $.proxy(this.cycle, this))\n }\n\n Carousel.DEFAULTS = {\n interval: 5000\n , pause: 'hover'\n }\n\n Carousel.prototype.cycle = function (e) {\n e || (this.paused = false)\n\n this.interval && clearInterval(this.interval)\n\n this.options.interval\n && !this.paused\n && (this.interval = setInterval($.proxy(this.next, this), this.options.interval))\n\n return this\n }\n\n Carousel.prototype.getActiveIndex = function () {\n this.$active = this.$element.find('.item.active')\n this.$items = this.$active.parent().children()\n\n return this.$items.index(this.$active)\n }\n\n Carousel.prototype.to = function (pos) {\n var that = this\n var activeIndex = this.getActiveIndex()\n\n if (pos > (this.$items.length - 1) || pos < 0) return\n\n if (this.sliding) return this.$element.one('slid', function () { that.to(pos) })\n if (activeIndex == pos) return this.pause().cycle()\n\n return this.slide(pos > activeIndex ? 'next' : 'prev', $(this.$items[pos]))\n }\n\n Carousel.prototype.pause = function (e) {\n e || (this.paused = true)\n\n if (this.$element.find('.next, .prev').length && $.support.transition.end) {\n this.$element.trigger($.support.transition.end)\n this.cycle(true)\n }\n\n this.interval = clearInterval(this.interval)\n\n return this\n }\n\n Carousel.prototype.next = function () {\n if (this.sliding) return\n return this.slide('next')\n }\n\n Carousel.prototype.prev = function () {\n if (this.sliding) return\n return this.slide('prev')\n }\n\n Carousel.prototype.slide = function (type, next) {\n var $active = this.$element.find('.item.active')\n var $next = next || $active[type]()\n var isCycling = this.interval\n var direction = type == 'next' ? 'left' : 'right'\n var fallback = type == 'next' ? 'first' : 'last'\n var that = this\n\n this.sliding = true\n\n isCycling && this.pause()\n\n $next = $next.length ? $next : this.$element.find('.item')[fallback]()\n\n var e = $.Event('slide.bs.carousel', { relatedTarget: $next[0], direction: direction })\n\n if ($next.hasClass('active')) return\n\n if (this.$indicators.length) {\n this.$indicators.find('.active').removeClass('active')\n this.$element.one('slid', function () {\n var $nextIndicator = $(that.$indicators.children()[that.getActiveIndex()])\n $nextIndicator && $nextIndicator.addClass('active')\n })\n }\n\n if ($.support.transition && this.$element.hasClass('slide')) {\n this.$element.trigger(e)\n if (e.isDefaultPrevented()) return\n $next.addClass(type)\n $next[0].offsetWidth // force reflow\n $active.addClass(direction)\n $next.addClass(direction)\n $active\n .one($.support.transition.end, function () {\n $next.removeClass([type, direction].join(' ')).addClass('active')\n $active.removeClass(['active', direction].join(' '))\n that.sliding = false\n setTimeout(function () { that.$element.trigger('slid') }, 0)\n })\n .emulateTransitionEnd(600)\n } else {\n this.$element.trigger(e)\n if (e.isDefaultPrevented()) return\n $active.removeClass('active')\n $next.addClass('active')\n this.sliding = false\n this.$element.trigger('slid')\n }\n\n isCycling && this.cycle()\n\n return this\n }\n\n\n // CAROUSEL PLUGIN DEFINITION\n // ==========================\n\n var old = $.fn.carousel\n\n $.fn.carousel = function (option) {\n return this.each(function () {\n var $this = $(this)\n var data = $this.data('bs.carousel')\n var options = $.extend({}, Carousel.DEFAULTS, $this.data(), typeof option == 'object' && option)\n var action = typeof option == 'string' ? option : options.slide\n\n if (!data) $this.data('bs.carousel', (data = new Carousel(this, options)))\n if (typeof option == 'number') data.to(option)\n else if (action) data[action]()\n else if (options.interval) data.pause().cycle()\n })\n }\n\n $.fn.carousel.Constructor = Carousel\n\n\n // CAROUSEL NO CONFLICT\n // ====================\n\n $.fn.carousel.noConflict = function () {\n $.fn.carousel = old\n return this\n }\n\n\n // CAROUSEL DATA-API\n // =================\n\n $(document).on('click.bs.carousel.data-api', '[data-slide], [data-slide-to]', function (e) {\n var $this = $(this), href\n var $target = $($this.attr('data-target') || (href = $this.attr('href')) && href.replace(/.*(?=#[^\\s]+$)/, '')) //strip for ie7\n var options = $.extend({}, $target.data(), $this.data())\n var slideIndex = $this.attr('data-slide-to')\n if (slideIndex) options.interval = false\n\n $target.carousel(options)\n\n if (slideIndex = $this.attr('data-slide-to')) {\n $target.data('bs.carousel').to(slideIndex)\n }\n\n e.preventDefault()\n })\n\n $(window).on('load', function () {\n $('[data-ride=\"carousel\"]').each(function () {\n var $carousel = $(this)\n $carousel.carousel($carousel.data())\n })\n })\n\n}(window.jQuery);\n","collapse.js":"/* ========================================================================\n * Bootstrap: collapse.js v3.0.0\n * http://twbs.github.com/bootstrap/javascript.html#collapse\n * ========================================================================\n * Copyright 2012 Twitter, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n * ======================================================================== */\n\n\n+function ($) { \"use strict\";\n\n // COLLAPSE PUBLIC CLASS DEFINITION\n // ================================\n\n var Collapse = function (element, options) {\n this.$element = $(element)\n this.options = $.extend({}, Collapse.DEFAULTS, options)\n this.transitioning = null\n\n if (this.options.parent) this.$parent = $(this.options.parent)\n if (this.options.toggle) this.toggle()\n }\n\n Collapse.DEFAULTS = {\n toggle: true\n }\n\n Collapse.prototype.dimension = function () {\n var hasWidth = this.$element.hasClass('width')\n return hasWidth ? 'width' : 'height'\n }\n\n Collapse.prototype.show = function () {\n if (this.transitioning || this.$element.hasClass('in')) return\n\n var startEvent = $.Event('show.bs.collapse')\n this.$element.trigger(startEvent)\n if (startEvent.isDefaultPrevented()) return\n\n var actives = this.$parent && this.$parent.find('> .accordion-group > .in')\n\n if (actives && actives.length) {\n var hasData = actives.data('bs.collapse')\n if (hasData && hasData.transitioning) return\n actives.collapse('hide')\n hasData || actives.data('bs.collapse', null)\n }\n\n var dimension = this.dimension()\n\n this.$element\n .removeClass('collapse')\n .addClass('collapsing')\n [dimension](0)\n\n this.transitioning = 1\n\n var complete = function () {\n this.$element\n .removeClass('collapsing')\n .addClass('in')\n [dimension]('auto')\n this.transitioning = 0\n this.$element.trigger('shown.bs.collapse')\n }\n\n if (!$.support.transition) return complete.call(this)\n\n var scrollSize = $.camelCase(['scroll', dimension].join('-'))\n\n this.$element\n .one($.support.transition.end, $.proxy(complete, this))\n .emulateTransitionEnd(350)\n [dimension](this.$element[0][scrollSize])\n }\n\n Collapse.prototype.hide = function () {\n if (this.transitioning || !this.$element.hasClass('in')) return\n\n var startEvent = $.Event('hide.bs.collapse')\n this.$element.trigger(startEvent)\n if (startEvent.isDefaultPrevented()) return\n\n var dimension = this.dimension()\n\n this.$element\n [dimension](this.$element[dimension]())\n [0].offsetHeight\n\n this.$element\n .addClass('collapsing')\n .removeClass('collapse')\n .removeClass('in')\n\n this.transitioning = 1\n\n var complete = function () {\n this.transitioning = 0\n this.$element\n .trigger('hidden.bs.collapse')\n .removeClass('collapsing')\n .addClass('collapse')\n }\n\n if (!$.support.transition) return complete.call(this)\n\n this.$element\n [dimension](0)\n .one($.support.transition.end, $.proxy(complete, this))\n .emulateTransitionEnd(350)\n }\n\n Collapse.prototype.toggle = function () {\n this[this.$element.hasClass('in') ? 'hide' : 'show']()\n }\n\n\n // COLLAPSE PLUGIN DEFINITION\n // ==========================\n\n var old = $.fn.collapse\n\n $.fn.collapse = function (option) {\n return this.each(function () {\n var $this = $(this)\n var data = $this.data('bs.collapse')\n var options = $.extend({}, Collapse.DEFAULTS, $this.data(), typeof option == 'object' && option)\n\n if (!data) $this.data('bs.collapse', (data = new Collapse(this, options)))\n if (typeof option == 'string') data[option]()\n })\n }\n\n $.fn.collapse.Constructor = Collapse\n\n\n // COLLAPSE NO CONFLICT\n // ====================\n\n $.fn.collapse.noConflict = function () {\n $.fn.collapse = old\n return this\n }\n\n\n // COLLAPSE DATA-API\n // =================\n\n $(document).on('click.bs.collapse.data-api', '[data-toggle=collapse]', function (e) {\n var $this = $(this), href\n var target = $this.attr('data-target')\n || e.preventDefault()\n || (href = $this.attr('href')) && href.replace(/.*(?=#[^\\s]+$)/, '') //strip for ie7\n var $target = $(target)\n var data = $target.data('bs.collapse')\n var option = data ? 'toggle' : $this.data()\n var parent = $this.attr('data-parent')\n var $parent = parent && $(parent)\n\n if (!data || !data.transitioning) {\n if ($parent) $parent.find('[data-toggle=collapse][data-parent=' + parent + ']').not($this).addClass('collapsed')\n $this[$target.hasClass('in') ? 'addClass' : 'removeClass']('collapsed')\n }\n\n $target.collapse(option)\n })\n\n}(window.jQuery);\n","dropdown.js":"/* ========================================================================\n * Bootstrap: dropdown.js v3.0.0\n * http://twbs.github.com/bootstrap/javascript.html#dropdowns\n * ========================================================================\n * Copyright 2012 Twitter, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n * ======================================================================== */\n\n\n+function ($) { \"use strict\";\n\n // DROPDOWN CLASS DEFINITION\n // =========================\n\n var backdrop = '.dropdown-backdrop'\n var toggle = '[data-toggle=dropdown]'\n var Dropdown = function (element) {\n var $el = $(element).on('click.bs.dropdown', this.toggle)\n }\n\n Dropdown.prototype.toggle = function (e) {\n var $this = $(this)\n\n if ($this.is('.disabled, :disabled')) return\n\n var $parent = getParent($this)\n var isActive = $parent.hasClass('open')\n\n clearMenus()\n\n if (!isActive) {\n if ('ontouchstart' in document.documentElement) {\n // if mobile we we use a backdrop because click events don't delegate\n $('<div class=\"dropdown-backdrop\"/>').insertAfter($(this)).on('click', clearMenus)\n }\n\n $parent.trigger(e = $.Event('show.bs.dropdown'))\n\n if (e.isDefaultPrevented()) return\n\n $parent\n .toggleClass('open')\n .trigger('shown.bs.dropdown')\n }\n\n $this.focus()\n\n return false\n }\n\n Dropdown.prototype.keydown = function (e) {\n if (!/(38|40|27)/.test(e.keyCode)) return\n\n var $this = $(this)\n\n e.preventDefault()\n e.stopPropagation()\n\n if ($this.is('.disabled, :disabled')) return\n\n var $parent = getParent($this)\n var isActive = $parent.hasClass('open')\n\n if (!isActive || (isActive && e.keyCode == 27)) {\n if (e.which == 27) $parent.find(toggle).focus()\n return $this.click()\n }\n\n var $items = $('[role=menu] li:not(.divider):visible a', $parent)\n\n if (!$items.length) return\n\n var index = $items.index($items.filter(':focus'))\n\n if (e.keyCode == 38 && index > 0) index-- // up\n if (e.keyCode == 40 && index < $items.length - 1) index++ // down\n if (!~index) index=0\n\n $items.eq(index).focus()\n }\n\n function clearMenus() {\n $(backdrop).remove()\n $(toggle).each(function (e) {\n var $parent = getParent($(this))\n if (!$parent.hasClass('open')) return\n $parent.trigger(e = $.Event('hide.bs.dropdown'))\n if (e.isDefaultPrevented()) return\n $parent.removeClass('open').trigger('hidden.bs.dropdown')\n })\n }\n\n function getParent($this) {\n var selector = $this.attr('data-target')\n\n if (!selector) {\n selector = $this.attr('href')\n selector = selector && /#/.test(selector) && selector.replace(/.*(?=#[^\\s]*$)/, '') //strip for ie7\n }\n\n var $parent = selector && $(selector)\n\n return $parent && $parent.length ? $parent : $this.parent()\n }\n\n\n // DROPDOWN PLUGIN DEFINITION\n // ==========================\n\n var old = $.fn.dropdown\n\n $.fn.dropdown = function (option) {\n return this.each(function () {\n var $this = $(this)\n var data = $this.data('dropdown')\n\n if (!data) $this.data('dropdown', (data = new Dropdown(this)))\n if (typeof option == 'string') data[option].call($this)\n })\n }\n\n $.fn.dropdown.Constructor = Dropdown\n\n\n // DROPDOWN NO CONFLICT\n // ====================\n\n $.fn.dropdown.noConflict = function () {\n $.fn.dropdown = old\n return this\n }\n\n\n // APPLY TO STANDARD DROPDOWN ELEMENTS\n // ===================================\n\n $(document)\n .on('click.bs.dropdown.data-api', clearMenus)\n .on('click.bs.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() })\n .on('click.bs.dropdown.data-api' , toggle, Dropdown.prototype.toggle)\n .on('keydown.bs.dropdown.data-api', toggle + ', [role=menu]' , Dropdown.prototype.keydown)\n\n}(window.jQuery);\n","modal.js":"/* ========================================================================\n * Bootstrap: modal.js v3.0.0\n * http://twbs.github.com/bootstrap/javascript.html#modals\n * ========================================================================\n * Copyright 2012 Twitter, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n * ======================================================================== */\n\n\n+function ($) { \"use strict\";\n\n // MODAL CLASS DEFINITION\n // ======================\n\n var Modal = function (element, options) {\n this.options = options\n this.$element = $(element).on('click.dismiss.modal', '[data-dismiss=\"modal\"]', $.proxy(this.hide, this))\n this.$backdrop =\n this.isShown = null\n\n if (this.options.remote) this.$element.find('.modal-body').load(this.options.remote)\n }\n\n Modal.DEFAULTS = {\n backdrop: true\n , keyboard: true\n , show: true\n }\n\n Modal.prototype.toggle = function () {\n return this[!this.isShown ? 'show' : 'hide']()\n }\n\n Modal.prototype.show = function () {\n var that = this\n var e = $.Event('show.bs.modal')\n\n this.$element.trigger(e)\n\n if (this.isShown || e.isDefaultPrevented()) return\n\n this.isShown = true\n\n this.escape()\n\n this.backdrop(function () {\n var transition = $.support.transition && that.$element.hasClass('fade')\n\n if (!that.$element.parent().length) {\n that.$element.appendTo(document.body) // don't move modals dom position\n }\n\n that.$element.show()\n\n if (transition) {\n that.$element[0].offsetWidth // force reflow\n }\n\n that.$element\n .addClass('in')\n .attr('aria-hidden', false)\n\n that.enforceFocus()\n\n transition ?\n that.$element\n .one($.support.transition.end, function () {\n that.$element.focus().trigger('shown.bs.modal')\n })\n .emulateTransitionEnd(300) :\n that.$element.focus().trigger('shown.bs.modal')\n })\n }\n\n Modal.prototype.hide = function (e) {\n if (e) e.preventDefault()\n\n e = $.Event('hide.bs.modal')\n\n this.$element.trigger(e)\n\n if (!this.isShown || e.isDefaultPrevented()) return\n\n this.isShown = false\n\n this.escape()\n\n $(document).off('focusin.bs.modal')\n\n this.$element\n .removeClass('in')\n .attr('aria-hidden', true)\n\n $.support.transition && this.$element.hasClass('fade') ?\n this.$element\n .one($.support.transition.end, $.proxy(this.hideModal, this))\n .emulateTransitionEnd(300) :\n this.hideModal()\n }\n\n Modal.prototype.enforceFocus = function () {\n $(document)\n .off('focusin.bs.modal') // guard against infinite focus loop\n .on('focusin.bs.modal', $.proxy(function (e) {\n if (this.$element[0] !== e.target && !this.$element.has(e.target).length) {\n this.$element.focus()\n }\n }, this))\n }\n\n Modal.prototype.escape = function () {\n if (this.isShown && this.options.keyboard) {\n this.$element.on('keyup.dismiss.bs.modal', $.proxy(function (e) {\n e.which == 27 && this.hide()\n }, this))\n } else if (!this.isShown) {\n this.$element.off('keyup.dismiss.bs.modal')\n }\n }\n\n Modal.prototype.hideModal = function () {\n var that = this\n this.$element.hide()\n this.backdrop(function () {\n that.removeBackdrop()\n that.$element.trigger('hidden.bs.modal')\n })\n }\n\n Modal.prototype.removeBackdrop = function () {\n this.$backdrop && this.$backdrop.remove()\n this.$backdrop = null\n }\n\n Modal.prototype.backdrop = function (callback) {\n var that = this\n var animate = this.$element.hasClass('fade') ? 'fade' : ''\n\n if (this.isShown && this.options.backdrop) {\n var doAnimate = $.support.transition && animate\n\n this.$backdrop = $('<div class=\"modal-backdrop ' + animate + '\" />')\n .appendTo(document.body)\n\n this.$element.on('click', $.proxy(function (e) {\n if (e.target !== e.currentTarget) return\n this.options.backdrop == 'static'\n ? this.$element[0].focus.call(this.$element[0])\n : this.hide.call(this)\n }, this))\n\n if (doAnimate) this.$backdrop[0].offsetWidth // force reflow\n\n this.$backdrop.addClass('in')\n\n if (!callback) return\n\n doAnimate ?\n this.$backdrop\n .one($.support.transition.end, callback)\n .emulateTransitionEnd(150) :\n callback()\n\n } else if (!this.isShown && this.$backdrop) {\n this.$backdrop.removeClass('in')\n\n $.support.transition && this.$element.hasClass('fade')?\n this.$backdrop\n .one($.support.transition.end, callback)\n .emulateTransitionEnd(150) :\n callback()\n\n } else if (callback) {\n callback()\n }\n }\n\n\n // MODAL PLUGIN DEFINITION\n // =======================\n\n var old = $.fn.modal\n\n $.fn.modal = function (option) {\n return this.each(function () {\n var $this = $(this)\n var data = $this.data('bs.modal')\n var options = $.extend({}, Modal.DEFAULTS, $this.data(), typeof option == 'object' && option)\n\n if (!data) $this.data('bs.modal', (data = new Modal(this, options)))\n if (typeof option == 'string') data[option]()\n else if (options.show) data.show()\n })\n }\n\n $.fn.modal.Constructor = Modal\n\n\n // MODAL NO CONFLICT\n // =================\n\n $.fn.modal.noConflict = function () {\n $.fn.modal = old\n return this\n }\n\n\n // MODAL DATA-API\n // ==============\n\n $(document).on('click.bs.modal.data-api', '[data-toggle=\"modal\"]', function (e) {\n var $this = $(this)\n var href = $this.attr('href')\n var $target = $($this.attr('data-target') || (href && href.replace(/.*(?=#[^\\s]+$)/, ''))) //strip for ie7\n var option = $target.data('modal') ? 'toggle' : $.extend({ remote:!/#/.test(href) && href }, $target.data(), $this.data())\n\n e.preventDefault()\n\n $target\n .modal(option)\n .one('hide', function () {\n $this.is(':visible') && $this.focus()\n })\n })\n\n $(function () {\n var $body = $(document.body)\n .on('shown.bs.modal', '.modal', function () { $body.addClass('modal-open') })\n .on('hidden.bs.modal', '.modal', function () { $body.removeClass('modal-open') })\n })\n\n}(window.jQuery);\n","popover.js":"/* ========================================================================\n * Bootstrap: popover.js v3.0.0\n * http://twbs.github.com/bootstrap/javascript.html#popovers\n * ========================================================================\n * Copyright 2012 Twitter, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n * ======================================================================== */\n\n\n+function ($) { \"use strict\";\n\n // POPOVER PUBLIC CLASS DEFINITION\n // ===============================\n\n var Popover = function (element, options) {\n this.init('popover', element, options)\n }\n\n if (!$.fn.tooltip) throw new Error('Popover requires tooltip.js')\n\n Popover.DEFAULTS = $.extend({} , $.fn.tooltip.Constructor.DEFAULTS, {\n placement: 'right'\n , trigger: 'click'\n , content: ''\n , template: '<div class=\"popover\"><div class=\"arrow\"></div><h3 class=\"popover-title\"></h3><div class=\"popover-content\"></div></div>'\n })\n\n\n // NOTE: POPOVER EXTENDS tooltip.js\n // ================================\n\n Popover.prototype = $.extend({}, $.fn.tooltip.Constructor.prototype)\n\n Popover.prototype.constructor = Popover\n\n Popover.prototype.getDefaults = function () {\n return Popover.DEFAULTS\n }\n\n Popover.prototype.setContent = function () {\n var $tip = this.tip()\n var title = this.getTitle()\n var content = this.getContent()\n\n $tip.find('.popover-title')[this.options.html ? 'html' : 'text'](title)\n $tip.find('.popover-content')[this.options.html ? 'html' : 'text'](content)\n\n $tip.removeClass('fade top bottom left right in')\n\n // Hide empty titles\n //\n // IE8 doesn't accept hiding via the `:empty` pseudo selector, we have to do\n // this manually by checking the contents.\n if ($tip.find('.popover-title').html() === '') {\n $tip.find('.popover-title').hide();\n }\n }\n\n Popover.prototype.hasContent = function () {\n return this.getTitle() || this.getContent()\n }\n\n Popover.prototype.getContent = function () {\n var $e = this.$element\n var o = this.options\n\n return $e.attr('data-content')\n || (typeof o.content == 'function' ?\n o.content.call($e[0]) :\n o.content)\n }\n\n Popover.prototype.arrow = function () {\n return this.$arrow = this.$arrow || this.tip().find('.arrow')\n }\n\n Popover.prototype.tip = function () {\n if (!this.$tip) this.$tip = $(this.options.template)\n return this.$tip\n }\n\n\n // POPOVER PLUGIN DEFINITION\n // =========================\n\n var old = $.fn.popover\n\n $.fn.popover = function (option) {\n return this.each(function () {\n var $this = $(this)\n var data = $this.data('bs.popover')\n var options = typeof option == 'object' && option\n\n if (!data) $this.data('bs.popover', (data = new Popover(this, options)))\n if (typeof option == 'string') data[option]()\n })\n }\n\n $.fn.popover.Constructor = Popover\n\n\n // POPOVER NO CONFLICT\n // ===================\n\n $.fn.popover.noConflict = function () {\n $.fn.popover = old\n return this\n }\n\n}(window.jQuery);\n","scrollspy.js":"/* ========================================================================\n * Bootstrap: scrollspy.js v3.0.0\n * http://twbs.github.com/bootstrap/javascript.html#scrollspy\n * ========================================================================\n * Copyright 2012 Twitter, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n * ======================================================================== */\n\n\n+function ($) { \"use strict\";\n\n // SCROLLSPY CLASS DEFINITION\n // ==========================\n\n function ScrollSpy(element, options) {\n var href\n var process = $.proxy(this.process, this)\n\n this.$element = $(element).is('body') ? $(window) : $(element)\n this.$body = $('body')\n this.$scrollElement = this.$element.on('scroll.bs.scroll-spy.data-api', process)\n this.options = $.extend({}, ScrollSpy.DEFAULTS, options)\n this.selector = (this.options.target\n || ((href = $(element).attr('href')) && href.replace(/.*(?=#[^\\s]+$)/, '')) //strip for ie7\n || '') + ' .nav li > a'\n this.offsets = $([])\n this.targets = $([])\n this.activeTarget = null\n\n this.refresh()\n this.process()\n }\n\n ScrollSpy.DEFAULTS = {\n offset: 10\n }\n\n ScrollSpy.prototype.refresh = function () {\n var offsetMethod = this.$element[0] == window ? 'offset' : 'position'\n\n this.offsets = $([])\n this.targets = $([])\n\n var self = this\n var $targets = this.$body\n .find(this.selector)\n .map(function () {\n var $el = $(this)\n var href = $el.data('target') || $el.attr('href')\n var $href = /^#\\w/.test(href) && $(href)\n\n return ($href\n && $href.length\n && [[ $href[offsetMethod]().top + (!$.isWindow(self.$scrollElement.get(0)) && self.$scrollElement.scrollTop()), href ]]) || null\n })\n .sort(function (a, b) { return a[0] - b[0] })\n .each(function () {\n self.offsets.push(this[0])\n self.targets.push(this[1])\n })\n }\n\n ScrollSpy.prototype.process = function () {\n var scrollTop = this.$scrollElement.scrollTop() + this.options.offset\n var scrollHeight = this.$scrollElement[0].scrollHeight || this.$body[0].scrollHeight\n var maxScroll = scrollHeight - this.$scrollElement.height()\n var offsets = this.offsets\n var targets = this.targets\n var activeTarget = this.activeTarget\n var i\n\n if (scrollTop >= maxScroll) {\n return activeTarget != (i = targets.last()[0]) && this.activate(i)\n }\n\n for (i = offsets.length; i--;) {\n activeTarget != targets[i]\n && scrollTop >= offsets[i]\n && (!offsets[i + 1] || scrollTop <= offsets[i + 1])\n && this.activate( targets[i] )\n }\n }\n\n ScrollSpy.prototype.activate = function (target) {\n this.activeTarget = target\n\n $(this.selector)\n .parents('.active')\n .removeClass('active')\n\n var selector = this.selector\n + '[data-target=\"' + target + '\"],'\n + this.selector + '[href=\"' + target + '\"]'\n\n var active = $(selector)\n .parents('li')\n .addClass('active')\n\n if (active.parent('.dropdown-menu').length) {\n active = active\n .closest('li.dropdown')\n .addClass('active')\n }\n\n active.trigger('activate')\n }\n\n\n // SCROLLSPY PLUGIN DEFINITION\n // ===========================\n\n var old = $.fn.scrollspy\n\n $.fn.scrollspy = function (option) {\n return this.each(function () {\n var $this = $(this)\n var data = $this.data('bs.scrollspy')\n var options = typeof option == 'object' && option\n\n if (!data) $this.data('bs.scrollspy', (data = new ScrollSpy(this, options)))\n if (typeof option == 'string') data[option]()\n })\n }\n\n $.fn.scrollspy.Constructor = ScrollSpy\n\n\n // SCROLLSPY NO CONFLICT\n // =====================\n\n $.fn.scrollspy.noConflict = function () {\n $.fn.scrollspy = old\n return this\n }\n\n\n // SCROLLSPY DATA-API\n // ==================\n\n $(window).on('load', function () {\n $('[data-spy=\"scroll\"]').each(function () {\n var $spy = $(this)\n $spy.scrollspy($spy.data())\n })\n })\n\n}(window.jQuery);\n","tab.js":"/* ========================================================================\n * Bootstrap: tab.js v3.0.0\n * http://twbs.github.com/bootstrap/javascript.html#tabs\n * ========================================================================\n * Copyright 2012 Twitter, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n * ======================================================================== */\n\n\n+function ($) { \"use strict\";\n\n // TAB CLASS DEFINITION\n // ====================\n\n var Tab = function (element) {\n this.element = $(element)\n }\n\n Tab.prototype.show = function () {\n var $this = this.element\n var $ul = $this.closest('ul:not(.dropdown-menu)')\n var selector = $this.attr('data-target')\n\n if (!selector) {\n selector = $this.attr('href')\n selector = selector && selector.replace(/.*(?=#[^\\s]*$)/, '') //strip for ie7\n }\n\n if ($this.parent('li').hasClass('active')) return\n\n var previous = $ul.find('.active:last a')[0]\n var e = $.Event('show.bs.tab', {\n relatedTarget: previous\n })\n\n $this.trigger(e)\n\n if (e.isDefaultPrevented()) return\n\n var $target = $(selector)\n\n this.activate($this.parent('li'), $ul)\n this.activate($target, $target.parent(), function () {\n $this.trigger({\n type: 'shown.bs.tab'\n , relatedTarget: previous\n })\n })\n }\n\n Tab.prototype.activate = function (element, container, callback) {\n var $active = container.find('> .active')\n var transition = callback\n && $.support.transition\n && $active.hasClass('fade')\n\n function next() {\n $active\n .removeClass('active')\n .find('> .dropdown-menu > .active')\n .removeClass('active')\n\n element.addClass('active')\n\n if (transition) {\n element[0].offsetWidth // reflow for transition\n element.addClass('in')\n } else {\n element.removeClass('fade')\n }\n\n if (element.parent('.dropdown-menu')) {\n element.closest('li.dropdown').addClass('active')\n }\n\n callback && callback()\n }\n\n transition ?\n $active\n .one($.support.transition.end, next)\n .emulateTransitionEnd(150) :\n next()\n\n $active.removeClass('in')\n }\n\n\n // TAB PLUGIN DEFINITION\n // =====================\n\n var old = $.fn.tab\n\n $.fn.tab = function ( option ) {\n return this.each(function () {\n var $this = $(this)\n var data = $this.data('bs.tab')\n\n if (!data) $this.data('bs.tab', (data = new Tab(this)))\n if (typeof option == 'string') data[option]()\n })\n }\n\n $.fn.tab.Constructor = Tab\n\n\n // TAB NO CONFLICT\n // ===============\n\n $.fn.tab.noConflict = function () {\n $.fn.tab = old\n return this\n }\n\n\n // TAB DATA-API\n // ============\n\n $(document).on('click.bs.tab.data-api', '[data-toggle=\"tab\"], [data-toggle=\"pill\"]', function (e) {\n e.preventDefault()\n $(this).tab('show')\n })\n\n}(window.jQuery);\n","tooltip.js":"/* ========================================================================\n * Bootstrap: tooltip.js v3.0.0\n * http://twbs.github.com/bootstrap/javascript.html#affix\n * Inspired by the original jQuery.tipsy by Jason Frame\n * ========================================================================\n * Copyright 2012 Twitter, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n * ======================================================================== */\n\n\n+function ($) { \"use strict\";\n\n // TOOLTIP PUBLIC CLASS DEFINITION\n // ===============================\n\n var Tooltip = function (element, options) {\n this.type =\n this.options =\n this.enabled =\n this.timeout =\n this.hoverState =\n this.$element = null\n\n this.init('tooltip', element, options)\n }\n\n Tooltip.DEFAULTS = {\n animation: true\n , placement: 'top'\n , selector: false\n , template: '<div class=\"tooltip\"><div class=\"tooltip-arrow\"></div><div class=\"tooltip-inner\"></div></div>'\n , trigger: 'hover focus'\n , title: ''\n , delay: 0\n , html: false\n , container: false\n }\n\n Tooltip.prototype.init = function (type, element, options) {\n this.enabled = true\n this.type = type\n this.$element = $(element)\n this.options = this.getOptions(options)\n\n var triggers = this.options.trigger.split(' ')\n\n for (var i = triggers.length; i--;) {\n var trigger = triggers[i]\n\n if (trigger == 'click') {\n this.$element.on('click.' + this.type, this.options.selector, $.proxy(this.toggle, this))\n } else if (trigger != 'manual') {\n var eventIn = trigger == 'hover' ? 'mouseenter' : 'focus'\n var eventOut = trigger == 'hover' ? 'mouseleave' : 'blur'\n\n this.$element.on(eventIn + '.' + this.type, this.options.selector, $.proxy(this.enter, this))\n this.$element.on(eventOut + '.' + this.type, this.options.selector, $.proxy(this.leave, this))\n }\n }\n\n this.options.selector ?\n (this._options = $.extend({}, this.options, { trigger: 'manual', selector: '' })) :\n this.fixTitle()\n }\n\n Tooltip.prototype.getDefaults = function () {\n return Tooltip.DEFAULTS\n }\n\n Tooltip.prototype.getOptions = function (options) {\n options = $.extend({}, this.getDefaults(), this.$element.data(), options)\n\n if (options.delay && typeof options.delay == 'number') {\n options.delay = {\n show: options.delay\n , hide: options.delay\n }\n }\n\n return options\n }\n\n Tooltip.prototype.enter = function (obj) {\n var defaults = this.getDefaults()\n var options = {}\n\n this._options && $.each(this._options, function (key, value) {\n if (defaults[key] != value) options[key] = value\n })\n\n var self = obj instanceof this.constructor ?\n obj : $(obj.currentTarget)[this.type](options).data('bs.' + this.type)\n\n clearTimeout(self.timeout)\n\n if (!self.options.delay || !self.options.delay.show) return self.show()\n\n self.hoverState = 'in'\n self.timeout = setTimeout(function () {\n if (self.hoverState == 'in') self.show()\n }, self.options.delay.show)\n }\n\n Tooltip.prototype.leave = function (obj) {\n var self = obj instanceof this.constructor ?\n obj : $(obj.currentTarget)[this.type](this._options).data('bs.' + this.type)\n\n clearTimeout(self.timeout)\n\n if (!self.options.delay || !self.options.delay.hide) return self.hide()\n\n self.hoverState = 'out'\n self.timeout = setTimeout(function () {\n if (self.hoverState == 'out') self.hide()\n }, self.options.delay.hide)\n }\n\n Tooltip.prototype.show = function () {\n var e = $.Event('show.bs.'+ this.type)\n\n if (this.hasContent() && this.enabled) {\n this.$element.trigger(e)\n\n if (e.isDefaultPrevented()) return\n\n var $tip = this.tip()\n\n this.setContent()\n\n if (this.options.animation) $tip.addClass('fade')\n\n var placement = typeof this.options.placement == 'function' ?\n this.options.placement.call(this, $tip[0], this.$element[0]) :\n this.options.placement\n\n var autoToken = /\\s?auto?\\s?/i\n var autoPlace = autoToken.test(placement)\n if (autoPlace) placement = placement.replace(autoToken, '') || 'top'\n\n $tip\n .detach()\n .css({ top: 0, left: 0, display: 'block' })\n .addClass(placement)\n\n this.options.container ? $tip.appendTo(this.options.container) : $tip.insertAfter(this.$element)\n\n var pos = this.getPosition()\n var actualWidth = $tip[0].offsetWidth\n var actualHeight = $tip[0].offsetHeight\n\n if (autoPlace) {\n var $parent = this.$element.parent()\n\n var orgPlacement = placement\n var docScroll = document.documentElement.scrollTop || document.body.scrollTop\n var parentWidth = this.options.container == 'body' ? window.innerWidth : $parent.outerWidth()\n var parentHeight = this.options.container == 'body' ? window.innerHeight : $parent.outerHeight()\n var parentLeft = this.options.container == 'body' ? 0 : $parent.offset().left\n\n placement = placement == 'bottom' && pos.top + pos.height + actualHeight - docScroll > parentHeight ? 'top' :\n placement == 'top' && pos.top - docScroll - actualHeight < 0 ? 'bottom' :\n placement == 'right' && pos.right + actualWidth > parentWidth ? 'left' :\n placement == 'left' && pos.left - actualWidth < parentLeft ? 'right' :\n placement\n\n $tip\n .removeClass(orgPlacement)\n .addClass(placement)\n }\n\n var calculatedOffset = this.getCalcuatedOffset(placement, pos, actualWidth, actualHeight)\n\n this.applyPlacement(calculatedOffset, placement)\n this.$element.trigger('shown.bs.' + this.type)\n }\n }\n\n Tooltip.prototype.applyPlacement = function(offset, placement) {\n var replace\n var $tip = this.tip()\n var width = $tip[0].offsetWidth\n var height = $tip[0].offsetHeight\n\n // manually read margins because getBoundingClientRect includes difference\n var marginTop = parseInt($tip.css('margin-top'), 10)\n var marginLeft = parseInt($tip.css('margin-left'), 10)\n\n // we must check for NaN for ie 8/9\n if (isNaN(marginTop)) marginTop = 0\n if (isNaN(marginLeft)) marginLeft = 0\n\n offset.top = offset.top + marginTop\n offset.left = offset.left + marginLeft\n\n $tip\n .offset(offset)\n .addClass('in')\n\n // check to see if placing tip in new offset caused the tip to resize itself\n var actualWidth = $tip[0].offsetWidth\n var actualHeight = $tip[0].offsetHeight\n\n if (placement == 'top' && actualHeight != height) {\n replace = true\n offset.top = offset.top + height - actualHeight\n }\n\n if (/bottom|top/.test(placement)) {\n var delta = 0\n\n if (offset.left < 0) {\n delta = offset.left * -2\n offset.left = 0\n\n $tip.offset(offset)\n\n actualWidth = $tip[0].offsetWidth\n actualHeight = $tip[0].offsetHeight\n }\n\n this.replaceArrow(delta - width + actualWidth, actualWidth, 'left')\n } else {\n this.replaceArrow(actualHeight - height, actualHeight, 'top')\n }\n\n if (replace) $tip.offset(offset)\n }\n\n Tooltip.prototype.replaceArrow = function(delta, dimension, position) {\n this.arrow().css(position, delta ? (50 * (1 - delta / dimension) + \"%\") : '')\n }\n\n Tooltip.prototype.setContent = function () {\n var $tip = this.tip()\n var title = this.getTitle()\n\n $tip.find('.tooltip-inner')[this.options.html ? 'html' : 'text'](title)\n $tip.removeClass('fade in top bottom left right')\n }\n\n Tooltip.prototype.hide = function () {\n var that = this\n var $tip = this.tip()\n var e = $.Event('hide.bs.' + this.type)\n\n function complete() { $tip.detach() }\n\n this.$element.trigger(e)\n\n if (e.isDefaultPrevented()) return\n\n $tip.removeClass('in')\n\n $.support.transition && this.$tip.hasClass('fade') ?\n $tip\n .one($.support.transition.end, complete)\n .emulateTransitionEnd(150) :\n complete()\n\n this.$element.trigger('hidden.bs.' + this.type)\n\n return this\n }\n\n Tooltip.prototype.fixTitle = function () {\n var $e = this.$element\n if ($e.attr('title') || typeof($e.attr('data-original-title')) != 'string') {\n $e.attr('data-original-title', $e.attr('title') || '').attr('title', '')\n }\n }\n\n Tooltip.prototype.hasContent = function () {\n return this.getTitle()\n }\n\n Tooltip.prototype.getPosition = function () {\n var el = this.$element[0]\n return $.extend({}, (typeof el.getBoundingClientRect == 'function') ? el.getBoundingClientRect() : {\n width: el.offsetWidth\n , height: el.offsetHeight\n }, this.$element.offset())\n }\n\n Tooltip.prototype.getCalcuatedOffset = function (placement, pos, actualWidth, actualHeight) {\n return placement == 'bottom' ? { top: pos.top + pos.height, left: pos.left + pos.width / 2 - actualWidth / 2 } :\n placement == 'top' ? { top: pos.top - actualHeight, left: pos.left + pos.width / 2 - actualWidth / 2 } :\n placement == 'left' ? { top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth } :\n /* placement == 'right' */ { top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width }\n }\n\n Tooltip.prototype.getTitle = function () {\n var title\n var $e = this.$element\n var o = this.options\n\n title = $e.attr('data-original-title')\n || (typeof o.title == 'function' ? o.title.call($e[0]) : o.title)\n\n return title\n }\n\n Tooltip.prototype.tip = function () {\n return this.$tip = this.$tip || $(this.options.template)\n }\n\n Tooltip.prototype.arrow = function () {\n return this.$arrow = this.$arrow || this.tip().find('.tooltip-arrow')\n }\n\n Tooltip.prototype.validate = function () {\n if (!this.$element[0].parentNode) {\n this.hide()\n this.$element = null\n this.options = null\n }\n }\n\n Tooltip.prototype.enable = function () {\n this.enabled = true\n }\n\n Tooltip.prototype.disable = function () {\n this.enabled = false\n }\n\n Tooltip.prototype.toggleEnabled = function () {\n this.enabled = !this.enabled\n }\n\n Tooltip.prototype.toggle = function (e) {\n var self = e ? $(e.currentTarget)[this.type](this._options).data('bs.' + this.type) : this\n self.tip().hasClass('in') ? self.leave(self) : self.enter(self)\n }\n\n Tooltip.prototype.destroy = function () {\n this.hide().$element.off('.' + this.type).removeData('bs.' + this.type)\n }\n\n\n // TOOLTIP PLUGIN DEFINITION\n // =========================\n\n var old = $.fn.tooltip\n\n $.fn.tooltip = function (option) {\n return this.each(function () {\n var $this = $(this)\n var data = $this.data('bs.tooltip')\n var options = typeof option == 'object' && option\n\n if (!data) $this.data('bs.tooltip', (data = new Tooltip(this, options)))\n if (typeof option == 'string') data[option]()\n })\n }\n\n $.fn.tooltip.Constructor = Tooltip\n\n\n // TOOLTIP NO CONFLICT\n // ===================\n\n $.fn.tooltip.noConflict = function () {\n $.fn.tooltip = old\n return this\n }\n\n}(window.jQuery);\n","transition.js":"/* ========================================================================\n * Bootstrap: transition.js v3.0.0\n * http://twbs.github.com/bootstrap/javascript.html#transitions\n * ========================================================================\n * Copyright 2013 Twitter, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n * ======================================================================== */\n\n\n+function ($) { \"use strict\";\n\n // CSS TRANSITION SUPPORT (Shoutout: http://www.modernizr.com/)\n // ============================================================\n\n function transitionEnd() {\n var el = document.createElement('bootstrap')\n\n var transEndEventNames = {\n 'WebkitTransition' : 'webkitTransitionEnd'\n , 'MozTransition' : 'transitionend'\n , 'OTransition' : 'oTransitionEnd otransitionend'\n , 'transition' : 'transitionend'\n }\n\n for (var name in transEndEventNames) {\n if (el.style[name] !== undefined) {\n return { end: transEndEventNames[name] }\n }\n }\n }\n\n // http://blog.alexmaccaw.com/css-transitions\n $.fn.emulateTransitionEnd = function (duration) {\n var called = false, $el = this\n $(this).one($.support.transition.end, function () { called = true })\n var callback = function () { if (!called) $($el).trigger($.support.transition.end) }\n setTimeout(callback, duration)\n return this\n }\n\n $(function () {\n $.support.transition = transitionEnd()\n })\n\n}(window.jQuery);\n"}
+var __less = {"accordion.less":"//\n// Accordion\n// --------------------------------------------------\n\n\n// Parent container\n.accordion {\n margin-bottom: @line-height-computed;\n}\n\n// Group == heading + body\n.accordion-group {\n margin-bottom: 2px;\n border: 1px solid @accordion-border-color;\n border-radius: @border-radius-base;\n}\n.accordion-heading {\n border-bottom: 0;\n\n .accordion-toggle {\n display: block;\n padding: 8px 15px;\n cursor: pointer;\n }\n}\n\n// Inner needs the styles because you can't animate properly with any styles on the element\n.accordion-inner {\n padding: 9px 15px;\n border-top: 1px solid @accordion-border-color;\n}\n","alerts.less":"//\n// Alerts\n// --------------------------------------------------\n\n\n// Base styles\n// -------------------------\n\n.alert {\n padding: @alert-padding (@alert-padding + 20) @alert-padding @alert-padding;\n margin-bottom: @line-height-computed;\n color: @alert-text;\n background-color: @alert-bg;\n border: 1px solid @alert-border;\n border-radius: @alert-border-radius;\n\n // Headings for larger alerts\n h4 {\n margin-top: 0;\n // Specified for the h4 to prevent conflicts of changing @headingsColor\n color: inherit;\n }\n // Match the hr to the border of the alert\n hr {\n border-top-color: darken(@alert-border, 5%);\n }\n // Provide class for links that match alerts\n .alert-link {\n font-weight: @alert-link-font-weight;\n color: darken(@alert-text, 10%);\n }\n\n // Adjust close link position\n .close {\n position: relative;\n top: -2px;\n right: -21px;\n color: inherit;\n }\n\n // Improve alignment and spacing of inner content\n > p,\n > ul {\n margin-bottom: 0;\n }\n > p + p {\n margin-top: 5px;\n }\n}\n\n// Alternate styles\n// -------------------------\n\n.alert-success {\n .alert-variant(@alert-success-bg; @alert-success-border; @alert-success-text);\n}\n.alert-danger {\n .alert-variant(@alert-danger-bg; @alert-danger-border; @alert-danger-text);\n}\n.alert-info {\n .alert-variant(@alert-info-bg; @alert-info-border; @alert-info-text);\n}\n","badges.less":"//\n// Badges\n// --------------------------------------------------\n\n\n// Base classes\n.badge {\n display: inline-block;\n min-width: 10px;\n padding: 3px 7px;\n font-size: @font-size-small;\n font-weight: @badge-font-weight;\n color: @badge-color;\n line-height: @badge-line-height;\n vertical-align: baseline;\n white-space: nowrap;\n text-align: center;\n background-color: @badge-bg;\n border-radius: @badge-border-radius;\n\n // Empty labels/badges collapse\n &:empty {\n display: none;\n }\n}\n\n// Hover state, but only for links\na.badge {\n &:hover,\n &:focus {\n color: @badge-link-hover-color;\n text-decoration: none;\n cursor: pointer;\n }\n}\n\n// Quick fix for labels/badges in buttons\n.btn .badge {\n position: relative;\n top: -1px;\n}\n\n// Account for counters in navs\na.list-group-item.active > .badge,\n.nav-pills > .active > a > .badge {\n color: @badge-active-color;\n background-color: @badge-active-bg;\n}\n.nav-pills > li > a > .badge {\n margin-left: 3px;\n}\n","bootstrap.less":"/*!\n * Bootstrap v3.0.0\n *\n * Copyright 2013 Twitter, Inc\n * Licensed under the Apache License v2.0\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Designed and built with all the love in the world by @mdo and @fat.\n */\n\n// Core variables and mixins\n@import \"variables.less\";\n@import \"mixins.less\";\n\n// Reset\n@import \"normalize.less\";\n@import \"print.less\";\n\n// Core CSS\n@import \"scaffolding.less\";\n@import \"type.less\";\n@import \"code.less\";\n@import \"grid.less\";\n\n@import \"tables.less\";\n@import \"forms.less\";\n@import \"buttons.less\";\n\n// Components: common\n@import \"component-animations.less\";\n@import \"input-groups.less\";\n@import \"dropdowns.less\";\n@import \"list-group.less\";\n@import \"panels.less\";\n@import \"wells.less\";\n@import \"close.less\";\n\n// Components: Nav\n@import \"navs.less\";\n@import \"navbar.less\";\n@import \"button-groups.less\";\n@import \"breadcrumbs.less\";\n@import \"pagination.less\";\n@import \"pager.less\";\n\n// Components: Popovers\n@import \"modals.less\";\n@import \"tooltip.less\";\n@import \"popovers.less\";\n\n// Components: Misc\n@import \"alerts.less\";\n@import \"thumbnails.less\";\n@import \"media.less\";\n@import \"labels.less\";\n@import \"badges.less\";\n@import \"progress-bars.less\";\n@import \"accordion.less\";\n@import \"carousel.less\";\n@import \"jumbotron.less\";\n\n// Utility classes\n@import \"utilities.less\"; // Has to be last to override when necessary\n@import \"responsive-utilities.less\";\n","breadcrumbs.less":"//\n// Breadcrumbs\n// --------------------------------------------------\n\n\n.breadcrumb {\n padding: 8px 15px;\n margin-bottom: @line-height-computed;\n list-style: none;\n background-color: @breadcrumb-bg;\n border-radius: @border-radius-base;\n > li {\n display: inline-block;\n &+li:before {\n content: \"/\\00a0\"; // Unicode space added since inline-block means non-collapsing white-space\n padding: 0 5px;\n color: @breadcrumb-color;\n }\n }\n > .active {\n color: @breadcrumb-active-color;\n }\n}\n","button-groups.less":"//\n// Button groups\n// --------------------------------------------------\n\n// Button carets\n//\n// Match the button text color to the arrow/caret for indicating dropdown-ness.\n\n.caret {\n .btn-default & {\n border-top-color: @btn-default-color;\n }\n .btn-primary &,\n .btn-success &,\n .btn-warning &,\n .btn-danger &,\n .btn-info & {\n border-top-color: #fff;\n }\n}\n.dropup .caret {\n .btn-default & {\n border-bottom-color: @btn-default-color;\n }\n .btn-primary &,\n .btn-success &,\n .btn-warning &,\n .btn-danger &,\n .btn-info & {\n border-bottom-color: #fff;\n }\n}\n\n// Make the div behave like a button\n.btn-group,\n.btn-group-vertical {\n position: relative;\n display: inline-block;\n vertical-align: middle; // match .btn alignment given font-size hack above\n > .btn {\n position: relative;\n float: left;\n // Bring the \"active\" button to the front\n &:hover,\n &:focus,\n &:active,\n &.active {\n z-index: 2;\n }\n &:focus {\n // Remove focus outline when dropdown JS adds it after closing the menu\n outline: none;\n }\n }\n}\n\n// Prevent double borders when buttons are next to each other\n.btn-group .btn + .btn {\n margin-left: -1px;\n}\n\n// Optional: Group multiple button groups together for a toolbar\n.btn-toolbar {\n .clearfix();\n\n .btn-group {\n float: left;\n }\n // Space out series of button groups\n > .btn,\n > .btn-group {\n + .btn,\n + .btn-group {\n margin-left: 5px;\n }\n }\n}\n\n.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {\n border-radius: 0;\n}\n\n// Set corners individual because sometimes a single button can be in a .btn-group and we need :first-child and :last-child to both match\n.btn-group > .btn:first-child {\n margin-left: 0;\n &:not(:last-child):not(.dropdown-toggle) {\n .border-right-radius(0);\n }\n}\n// Need .dropdown-toggle since :last-child doesn't apply given a .dropdown-menu immediately after it\n.btn-group > .btn:last-child:not(:first-child),\n.btn-group > .dropdown-toggle:not(:first-child) {\n .border-left-radius(0);\n}\n\n// Custom edits for including btn-groups within btn-groups (useful for including dropdown buttons within a btn-group)\n.btn-group > .btn-group {\n float: left;\n}\n.btn-group > .btn-group:not(:first-child):not(:last-child) > .btn {\n border-radius: 0;\n}\n.btn-group > .btn-group:first-child {\n > .btn:last-child,\n > .dropdown-toggle {\n .border-right-radius(0);\n }\n}\n.btn-group > .btn-group:last-child > .btn:first-child {\n .border-left-radius(0);\n}\n\n// On active and open, don't show outline\n.btn-group .dropdown-toggle:active,\n.btn-group.open .dropdown-toggle {\n outline: 0;\n}\n\n\n\n// Split button dropdowns\n// ----------------------\n\n// Give the line between buttons some depth\n.btn-group > .btn + .dropdown-toggle {\n padding-left: 8px;\n padding-right: 8px;\n}\n.btn-group > .btn-lg + .dropdown-toggle {\n padding-left: 12px;\n padding-right: 12px;\n}\n\n// The clickable button for toggling the menu\n// Remove the gradient and set the same inset shadow as the :active state\n.btn-group.open .dropdown-toggle {\n .box-shadow(inset 0 3px 5px rgba(0,0,0,.125));\n}\n\n\n// Reposition the caret\n.btn .caret {\n margin-left: 0;\n}\n// Carets in other button sizes\n.btn-lg .caret {\n border-width: @caret-width-large;\n}\n// Upside down carets for .dropup\n.dropup .btn-lg .caret {\n border-bottom-width: @caret-width-large;\n}\n\n\n// Vertical button groups\n// ----------------------\n\n.btn-group-vertical > .btn {\n display: block;\n float: none;\n width: 100%;\n max-width: 100%;\n + .btn {\n margin-top: -1px;\n }\n}\n.btn-group-vertical .btn {\n &:not(:first-child):not(:last-child) {\n border-radius: 0;\n }\n &:first-child:not(:last-child) {\n .border-bottom-radius(0);\n }\n &:last-child:not(:first-child) {\n .border-top-radius(0);\n }\n}\n\n\n// Justified button groups\n// ----------------------\n\n.btn-group-justified {\n display: table;\n width: 100%;\n table-layout: fixed;\n .btn {\n float: none;\n display: table-cell;\n width: 1%;\n }\n}\n\n\n// Checkbox and radio options\n.btn-group[data-toggle=\"buttons\"] > .btn > input[type=\"radio\"],\n.btn-group[data-toggle=\"buttons\"] > .btn > input[type=\"checkbox\"] {\n display: none;\n}\n","buttons.less":"//\n// Buttons\n// --------------------------------------------------\n\n\n// Base styles\n// --------------------------------------------------\n\n// Core styles\n.btn {\n display: inline-block;\n padding: @padding-base-vertical @padding-base-horizontal;\n margin-bottom: 0; // For input.btn\n font-size: @font-size-base;\n font-weight: @btn-font-weight;\n line-height: @line-height-base;\n text-align: center;\n vertical-align: middle;\n cursor: pointer;\n border: 1px solid transparent;\n border-radius: @border-radius-base;\n white-space: nowrap;\n .user-select(none);\n\n &:focus {\n .tab-focus();\n }\n\n &:hover,\n &:focus {\n color: @btn-default-color;\n text-decoration: none;\n }\n\n &:active,\n &.active {\n outline: 0;\n .box-shadow(inset 0 3px 5px rgba(0,0,0,.125));\n }\n\n &.disabled,\n &[disabled],\n fieldset[disabled] & {\n cursor: default;\n pointer-events: none; // Future-proof disabling of clicks\n .opacity(.65);\n .box-shadow(none);\n }\n\n}\n\n\n// Alternate buttons\n// --------------------------------------------------\n\n.btn-default {\n .btn-pseudo-states(@btn-default-color; @btn-default-bg; @btn-default-border);\n}\n.btn-primary {\n .btn-pseudo-states(@btn-primary-color; @btn-primary-bg; @btn-primary-border);\n}\n// Warning appears as orange\n.btn-warning {\n .btn-pseudo-states(@btn-warning-color; @btn-warning-bg; @btn-warning-border);\n}\n// Danger and error appear as red\n.btn-danger {\n .btn-pseudo-states(@btn-danger-color; @btn-danger-bg; @btn-danger-border);\n}\n// Success appears as green\n.btn-success {\n .btn-pseudo-states(@btn-success-color; @btn-success-bg; @btn-success-border);\n}\n// Info appears as blue-green\n.btn-info {\n .btn-pseudo-states(@btn-info-color; @btn-info-bg; @btn-info-border);\n}\n\n\n// Link buttons\n// -------------------------\n\n// Make a button look and behave like a link\n.btn-link {\n color: @link-color;\n font-weight: normal;\n cursor: pointer;\n border-radius: 0;\n\n &,\n &:active,\n &[disabled],\n fieldset[disabled] & {\n background-color: transparent;\n .box-shadow(none);\n }\n &,\n &:hover,\n &:focus,\n &:active {\n border-color: transparent;\n }\n &:hover,\n &:focus {\n color: @link-hover-color;\n text-decoration: underline;\n background-color: transparent;\n }\n &[disabled],\n fieldset[disabled] & {\n &:hover,\n &:focus {\n color: @btn-link-disabled-color;\n text-decoration: none;\n }\n }\n}\n\n\n// Button Sizes\n// --------------------------------------------------\n\n.btn-lg {\n padding: @padding-large-vertical @padding-large-horizontal;\n font-size: @font-size-large;\n line-height: @line-height-large; // ensure even-numbered height of button next to large input\n border-radius: @border-radius-large;\n}\n.btn-sm,\n.btn-xs {\n padding: @padding-small-vertical @padding-small-horizontal;\n font-size: @font-size-small;\n line-height: @line-height-small; // ensure proper height of button next to small input\n border-radius: @border-radius-small;\n}\n.btn-xs {\n padding: 3px 5px;\n}\n\n\n// Block button\n// --------------------------------------------------\n\n.btn-block {\n display: block;\n width: 100%;\n padding-left: 0;\n padding-right: 0;\n}\n\n// Vertically space out multiple block buttons\n.btn-block + .btn-block {\n margin-top: 5px;\n}\n\n// Specificity overrides\ninput[type=\"submit\"],\ninput[type=\"reset\"],\ninput[type=\"button\"] {\n &.btn-block {\n width: 100%;\n }\n}\n","carousel.less":"//\n// Carousel\n// --------------------------------------------------\n\n\n// Wrapper for the slide container and indicators\n.carousel {\n position: relative;\n}\n\n.carousel-inner {\n position: relative;\n overflow: hidden;\n width: 100%;\n\n > .item {\n display: none;\n position: relative;\n .transition(.6s ease-in-out left);\n\n // Account for jankitude on images\n > img,\n > a > img {\n .img-responsive();\n line-height: 1;\n }\n }\n\n > .active,\n > .next,\n > .prev { display: block; }\n\n > .active {\n left: 0;\n }\n\n > .next,\n > .prev {\n position: absolute;\n top: 0;\n width: 100%;\n }\n\n > .next {\n left: 100%;\n }\n > .prev {\n left: -100%;\n }\n > .next.left,\n > .prev.right {\n left: 0;\n }\n\n > .active.left {\n left: -100%;\n }\n > .active.right {\n left: 100%;\n }\n\n}\n\n// Left/right controls for nav\n// ---------------------------\n\n.carousel-control {\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n width: @carousel-control-width;\n .opacity(@carousel-control-opacity);\n font-size: @carousel-control-font-size;\n color: @carousel-control-color;\n text-align: center;\n text-shadow: @carousel-text-shadow;\n // We can't have this transition here because webkit cancels the carousel\n // animation if you trip this while in the middle of another animation.\n\n // Set gradients for backgrounds\n &.left {\n #gradient > .horizontal(@start-color: rgba(0,0,0,.5); @end-color: rgba(0,0,0,.0001));\n }\n &.right {\n left: auto;\n right: 0;\n #gradient > .horizontal(@start-color: rgba(0,0,0,.0001); @end-color: rgba(0,0,0,.5));\n }\n\n // Hover/focus state\n &:hover,\n &:focus {\n color: @carousel-control-color;\n text-decoration: none;\n .opacity(.9);\n }\n\n // Toggles\n .glyphicon,\n .icon-prev,\n .icon-next {\n position: absolute;\n top: 50%;\n left: 50%;\n z-index: 5;\n display: inline-block;\n width: 20px;\n height: 20px;\n margin-top: -10px;\n margin-left: -10px;\n font-family: serif;\n }\n // Non-glyphicon toggles\n .icon-prev {\n &:before {\n content: '\\2039';// SINGLE LEFT-POINTING ANGLE QUOTATION MARK (U+2039)\n }\n }\n .icon-next {\n &:before {\n content: '\\203a';// SINGLE RIGHT-POINTING ANGLE QUOTATION MARK (U+203A)\n }\n }\n}\n\n// Optional indicator pips\n//\n// Add an unordered list with the following class and add a list item for each\n// slide your carousel holds.\n\n.carousel-indicators {\n position: absolute;\n bottom: 10px;\n left: 50%;\n z-index: 15;\n width: 60%;\n margin-left: -30%;\n padding-left: 0;\n list-style: none;\n text-align: center;\n\n li {\n display: inline-block;\n width: 10px;\n height: 10px;\n margin: 1px;\n text-indent: -999px;\n border: 1px solid @carousel-indicator-border-color;\n border-radius: 10px;\n cursor: pointer;\n }\n .active {\n margin: 0;\n width: 12px;\n height: 12px;\n background-color: @carousel-indicator-active-bg;\n }\n}\n\n// Optional captions\n// -----------------------------\n// Hidden by default for smaller viewports\n.carousel-caption {\n position: absolute;\n left: 15%;\n right: 15%;\n bottom: 20px;\n z-index: 10;\n padding-top: 20px;\n padding-bottom: 20px;\n color: @carousel-caption-color;\n text-align: center;\n text-shadow: @carousel-text-shadow;\n & .btn {\n text-shadow: none; // No shadow for button elements in carousel-caption\n }\n}\n\n\n// Scale up controls for tablets and up\n@media screen and (min-width: @screen-tablet) {\n\n // Scale up the controls a smidge\n .carousel-control .glyphicon,\n .carousel-control .icon-prev,\n .carousel-control .icon-next {\n width: 30px;\n height: 30px;\n margin-top: -15px;\n margin-left: -15px;\n font-size: 30px;\n }\n\n // Show and left align the captions\n .carousel-caption {\n left: 20%;\n right: 20%;\n padding-bottom: 30px;\n }\n\n // Move up the indicators\n .carousel-indicators {\n bottom: 20px;\n }\n}\n","close.less":"//\n// Close icons\n// --------------------------------------------------\n\n\n.close {\n float: right;\n font-size: (@font-size-base * 1.5);\n font-weight: @close-font-weight;\n line-height: 1;\n color: @close-color;\n text-shadow: @close-text-shadow;\n .opacity(.2);\n\n &:hover,\n &:focus {\n color: @close-color;\n text-decoration: none;\n cursor: pointer;\n .opacity(.5);\n }\n\n // Additional properties for button version\n // iOS requires the button element instead of an anchor tag.\n // If you want the anchor version, it requires `href=\"#\"`.\n button& {\n padding: 0;\n cursor: pointer;\n background: transparent;\n border: 0;\n -webkit-appearance: none;\n }\n}\n","code.less":"//\n// Code (inline and blocK)\n// --------------------------------------------------\n\n\n// Inline and block code styles\ncode,\npre {\n font-family: @font-family-monospace;\n}\n\n// Inline code\ncode {\n padding: 2px 4px;\n font-size: 90%;\n color: @code-color;\n background-color: @code-bg;\n white-space: nowrap;\n border-radius: 4px;\n}\n\n// Blocks of code\npre {\n display: block;\n padding: ((@line-height-computed - 1) / 2);\n margin: 0 0 (@line-height-computed / 2);\n font-size: (@font-size-base - 1); // 14px to 13px\n line-height: @line-height-base;\n word-break: break-all;\n word-wrap: break-word;\n color: @gray-dark;\n background-color: @pre-bg;\n border: 1px solid @pre-border-color;\n border-radius: @border-radius-base;\n\n // Make prettyprint styles more spaced out for readability\n &.prettyprint {\n margin-bottom: @line-height-computed;\n }\n\n // Account for some code outputs that place code tags in pre tags\n code {\n padding: 0;\n color: inherit;\n white-space: pre-wrap;\n background-color: transparent;\n border: 0;\n }\n}\n\n// Enable scrollable blocks of code\n.pre-scrollable {\n max-height: 340px;\n overflow-y: scroll;\n}\n","component-animations.less":"//\n// Component animations\n// --------------------------------------------------\n\n// Heads up!\n//\n// We don't use the `.opacity()` mixin here since it causes a bug with text\n// fields in IE7-8. Source: https://github.com/twitter/bootstrap/pull/3552.\n\n.fade {\n opacity: 0;\n .transition(opacity .15s linear);\n &.in {\n opacity: 1;\n }\n}\n\n.collapse {\n display: none;\n &.in {\n display: block;\n }\n}\n.collapsing {\n position: relative;\n height: 0;\n overflow: hidden;\n .transition(height .35s ease);\n}\n","dropdowns.less":"//\n// Dropdown menus\n// --------------------------------------------------\n\n\n// Dropdown arrow/caret\n// --------------------\n.caret {\n display: inline-block;\n width: 0;\n height: 0;\n margin-left: 2px;\n vertical-align: middle;\n border-top: @caret-width-base solid @dropdown-caret-color;\n border-right: @caret-width-base solid transparent;\n border-left: @caret-width-base solid transparent;\n content: \"\";\n}\n\n// The dropdown wrapper (div)\n// --------------------------\n.dropdown {\n position: relative;\n}\n\n// The dropdown menu (ul)\n// ----------------------\n.dropdown-menu {\n position: absolute;\n top: 100%;\n left: 0;\n z-index: @zindex-dropdown;\n display: none; // none by default, but block on \"open\" of the menu\n float: left;\n min-width: 160px;\n padding: 5px 0;\n margin: 2px 0 0; // override default ul\n list-style: none;\n background-color: @dropdown-bg;\n border: 1px solid @dropdown-fallback-border; // IE8 fallback\n border: 1px solid @dropdown-border;\n border-radius: @border-radius-base;\n .box-shadow(0 6px 12px rgba(0,0,0,.175));\n .background-clip(padding-box);\n\n // Aligns the dropdown menu to right\n &.pull-right {\n right: 0;\n left: auto;\n }\n\n // Dividers (basically an hr) within the dropdown\n .divider {\n .nav-divider(@dropdown-divider-bg);\n }\n\n // Links within the dropdown menu\n > li > a {\n display: block;\n padding: 3px 20px;\n clear: both;\n font-weight: normal;\n line-height: @line-height-base;\n color: @dropdown-link-color;\n white-space: nowrap; // prevent links from randomly breaking onto new lines\n }\n}\n\n// Hover/Focus state\n// -----------\n.dropdown-menu > li > a {\n &:hover,\n &:focus {\n text-decoration: none;\n color: @dropdown-link-hover-color;\n #gradient > .vertical(@start-color: @dropdown-link-hover-bg; @end-color: darken(@dropdown-link-hover-bg, 5%));\n background-color: darken(@dropdown-link-hover-bg, 5%);\n }\n}\n\n// Active state\n// ------------\n.dropdown-menu > .active > a {\n &,\n &:hover,\n &:focus {\n color: @dropdown-link-active-color;\n text-decoration: none;\n outline: 0;\n #gradient > .vertical(@start-color: @dropdown-link-active-bg; @end-color: darken(@dropdown-link-active-bg, 5%));\n background-color: darken(@dropdown-link-active-bg, 5%);\n }\n}\n\n// Disabled state\n// --------------\n// Gray out text and ensure the hover/focus state remains gray\n.dropdown-menu > .disabled > a {\n &,\n &:hover,\n &:focus {\n color: @gray-light;\n }\n}\n// Nuke hover/focus effects\n.dropdown-menu > .disabled > a {\n &:hover,\n &:focus {\n text-decoration: none;\n background-color: transparent;\n background-image: none; // Remove CSS gradient\n .reset-filter();\n cursor: not-allowed;\n }\n}\n\n// Open state for the dropdown\n// ---------------------------\n.open {\n // Show the menu\n > .dropdown-menu {\n display: block;\n }\n\n // Remove the outline when :focus is triggered\n > a {\n outline: 0;\n }\n}\n\n// Dropdown section headers\n// ---------------------------\n.dropdown-header {\n display: block;\n padding: 3px 20px;\n font-size: @font-size-small;\n line-height: @line-height-base;\n color: @gray-light;\n}\n\n\n\n// Backdrop to catch body clicks on mobile, etc.\n// ---------------------------\n.dropdown-backdrop {\n position: fixed;\n left: 0;\n right: 0;\n bottom: 0;\n top: 0;\n z-index: @zindex-dropdown - 10;\n}\n\n// Right aligned dropdowns\n// ---------------------------\n.pull-right > .dropdown-menu {\n right: 0;\n left: auto;\n}\n\n// Allow for dropdowns to go bottom up (aka, dropup-menu)\n// ------------------------------------------------------\n// Just add .dropup after the standard .dropdown class and you're set, bro.\n// TODO: abstract this so that the navbar fixed styles are not placed here?\n.dropup,\n.navbar-fixed-bottom .dropdown {\n // Reverse the caret\n .caret {\n border-top: 0;\n border-bottom: 4px solid @dropdown-caret-color;\n content: \"\";\n }\n // Different positioning for bottom up menu\n .dropdown-menu {\n top: auto;\n bottom: 100%;\n margin-bottom: 1px;\n }\n}\n","forms.less":"//\n// Forms\n// --------------------------------------------------\n\n\n// Normalize non-controls\n//\n// Restyle and baseline non-control form elements.\n\nfieldset {\n padding: 0;\n margin: 0;\n border: 0;\n}\n\nlegend {\n display: block;\n width: 100%;\n padding: 0;\n margin-bottom: @line-height-computed;\n font-size: (@font-size-base * 1.5);\n line-height: inherit;\n color: @gray-dark;\n border: 0;\n border-bottom: 1px solid @legend-border-color;\n}\n\nlabel {\n display: inline-block;\n margin-bottom: 5px;\n font-weight: bold;\n}\n\n\n// Normalize form controls\n\n// Override content-box in Normalize (* isn't specific enough)\ninput[type=\"search\"] {\n .box-sizing(border-box);\n}\n\n// Position radios and checkboxes better\ninput[type=\"radio\"],\ninput[type=\"checkbox\"] {\n margin: 4px 0 0;\n margin-top: 1px \\9; /* IE8-9 */\n line-height: normal;\n}\n\n// Set the height of select and file controls to match text inputs\ninput[type=\"file\"] {\n display: block;\n}\n\n// Make multiple select elements height not fixed\nselect[multiple],\nselect[size] {\n height: auto;\n}\n\n// Fix optgroup Firefox bug per https://github.com/twbs/bootstrap/issues/7611\nselect optgroup {\n font-size: inherit;\n font-style: inherit;\n font-family: inherit;\n}\n\n// Focus for select, file, radio, and checkbox\ninput[type=\"file\"]:focus,\ninput[type=\"radio\"]:focus,\ninput[type=\"checkbox\"]:focus {\n .tab-focus();\n}\n\n// Fix for Chrome number input\n// Setting certain font-sizes causes the `I` bar to appear on hover of the bottom increment button.\n// See https://github.com/twbs/bootstrap/issues/8350 for more.\ninput[type=\"number\"] {\n &::-webkit-outer-spin-button,\n &::-webkit-inner-spin-button {\n height: auto;\n }\n}\n\n\n// Placeholder\n//\n// Placeholder text gets special styles because when browsers invalidate entire\n// lines if it doesn't understand a selector/\n.form-control {\n .placeholder();\n}\n\n\n// Common form controls\n//\n// Shared size and type resets for form controls. Apply `.form-control` to any\n// of the following form controls:\n//\n// select\n// textarea\n// input[type=\"text\"]\n// input[type=\"password\"]\n// input[type=\"datetime\"]\n// input[type=\"datetime-local\"]\n// input[type=\"date\"]\n// input[type=\"month\"]\n// input[type=\"time\"]\n// input[type=\"week\"]\n// input[type=\"number\"]\n// input[type=\"email\"]\n// input[type=\"url\"]\n// input[type=\"search\"]\n// input[type=\"tel\"]\n// input[type=\"color\"]\n\n.form-control {\n display: block;\n width: 100%;\n height: @input-height-base; // Make inputs at least the height of their button counterpart (base line-height + padding + border)\n padding: @padding-base-vertical @padding-base-horizontal;\n font-size: @font-size-base;\n line-height: @line-height-base;\n color: @gray;\n vertical-align: middle;\n background-color: @input-bg;\n border: 1px solid @input-border;\n border-radius: @input-border-radius;\n .box-shadow(inset 0 1px 1px rgba(0,0,0,.075));\n .transition(~\"border-color ease-in-out .15s, box-shadow ease-in-out .15s\");\n\n // Customize the `:focus` state to imitate native WebKit styles.\n .form-control-focus();\n\n // Disabled and read-only inputs\n // Note: HTML5 says that inputs under a fieldset > legend:first-child won't be\n // disabled if the fieldset is disabled. Due to implementation difficulty,\n // we don't honor that edge case; we style them as disabled anyway.\n &[disabled],\n &[readonly],\n fieldset[disabled] & {\n cursor: not-allowed;\n background-color: @input-bg-disabled;\n }\n\n // Reset height for `textarea`s\n textarea& {\n height: auto;\n }\n}\n\n\n// Form groups\n//\n// Designed to help with the organization and spacing of vertical forms. For\n// horizontal forms, use the predefined grid classes.\n\n.form-group {\n margin-bottom: 15px;\n}\n\n\n// Checkboxes and radios\n//\n// Indent the labels to position radios/checkboxes as hanging controls.\n\n.radio,\n.checkbox {\n display: block;\n min-height: @line-height-computed; // clear the floating input if there is no label text\n margin-top: 10px;\n margin-bottom: 10px;\n padding-left: 20px;\n vertical-align: middle;\n label {\n display: inline;\n margin-bottom: 0;\n font-weight: normal;\n cursor: pointer;\n }\n}\n.radio input[type=\"radio\"],\n.radio-inline input[type=\"radio\"],\n.checkbox input[type=\"checkbox\"],\n.checkbox-inline input[type=\"checkbox\"] {\n float: left;\n margin-left: -20px;\n}\n.radio + .radio,\n.checkbox + .checkbox {\n margin-top: -5px; // Move up sibling radios or checkboxes for tighter spacing\n}\n\n// Radios and checkboxes on same line\n.radio-inline,\n.checkbox-inline {\n display: inline-block;\n padding-left: 20px;\n margin-bottom: 0;\n vertical-align: middle;\n font-weight: normal;\n cursor: pointer;\n}\n.radio-inline + .radio-inline,\n.checkbox-inline + .checkbox-inline {\n margin-top: 0;\n margin-left: 10px; // space out consecutive inline controls\n}\n\n\n\n// Form control sizing\n//\n// Relative text size, padding, and border-radii changes for form controls. For\n// horizontal sizing, wrap controls in the predefined grid classes. `<select>`\n// element gets special love because it's special, and that's a fact!\n\n.input-lg {\n height: @input-height-large;\n padding: @padding-large-vertical @padding-large-horizontal;\n font-size: @font-size-large;\n line-height: @line-height-large;\n border-radius: @border-radius-large;\n}\n.input-sm {\n height: @input-height-small;\n padding: @padding-small-vertical @padding-small-horizontal;\n font-size: @font-size-small;\n line-height: @line-height-small;\n border-radius: @border-radius-small;\n}\n\nselect {\n &.input-lg {\n height: @input-height-large;\n line-height: @input-height-large;\n }\n &.input-sm {\n height: @input-height-small;\n line-height: @input-height-small;\n }\n}\ntextarea {\n &.input-lg,\n &.input-sm {\n height: auto;\n }\n}\n\n\n// Form control feedback states\n//\n// Apply contextual and semantic states to individual form controls.\n\n// Warning\n.has-warning {\n .form-control-validation(@state-warning-text; @state-warning-text; @state-warning-bg);\n}\n// Error\n.has-error {\n .form-control-validation(@state-danger-text; @state-danger-text; @state-danger-bg);\n}\n// Success\n.has-success {\n .form-control-validation(@state-success-text; @state-success-text; @state-success-bg);\n}\n\n\n// Static form control text\n//\n// Apply class to a `p` element to make any string of text align with labels in\n// a horizontal form layout.\n\n.form-control-static {\n margin-bottom: 0; // Remove default margin from `p`\n padding-top: @padding-base-vertical;\n}\n\n\n// Help text\n//\n// Apply to any element you wish to create light text for placement immediately\n// below a form control. Use for general help, formatting, or instructional text.\n\n.help-block {\n display: block; // account for any element using help-block\n margin-top: 5px;\n margin-bottom: 10px;\n color: lighten(@text-color, 25%); // lighten the text some for contrast\n}\n\n\n\n// Inline forms\n//\n// Make forms appear inline(-block).\n\n.form-inline {\n .form-control,\n .radio,\n .checkbox {\n display: inline-block;\n }\n\n // Remove default margin on radios/checkboxes that were used for stacking, and\n // then undo the floating of radios and checkboxes to match (which also avoids\n // a bug in WebKit: https://github.com/twbs/bootstrap/issues/1969).\n .radio,\n .checkbox {\n margin-top: 0;\n margin-bottom: 0;\n padding-left: 0;\n }\n .radio input[type=\"radio\"],\n .checkbox input[type=\"checkbox\"] {\n float: none;\n margin-left: 0;\n }\n}\n\n\n// Horizontal forms\n//\n// Horizontal forms are built on grid classes and allow you to create forms with\n// labels on the left and inputs on the right.\n\n.form-horizontal .control-label,\n.form-horizontal .radio-inline,\n.form-horizontal .checkbox-inline {\n padding-top: @padding-base-vertical;\n}\n\n.form-horizontal {\n .form-group {\n .make-row();\n }\n}\n\n// Only right align form labels here when the columns stop stacking\n@media (min-width: @screen-tablet) {\n .form-horizontal .control-label {\n text-align: right;\n }\n}\n","grid.less":"//\n// Grid system\n// --------------------------------------------------\n\n// Set the container width, and override it for fixed navbars in media queries\n.container {\n .container-fixed();\n}\n\n// Mobile-first defaults\n.row {\n .make-row();\n}\n\n// Common styles for small and large grid columns\n.col-1,\n.col-2,\n.col-3,\n.col-4,\n.col-5,\n.col-6,\n.col-7,\n.col-8,\n.col-9,\n.col-10,\n.col-11,\n.col-12,\n.col-sm-1,\n.col-sm-2,\n.col-sm-3,\n.col-sm-4,\n.col-sm-5,\n.col-sm-6,\n.col-sm-7,\n.col-sm-8,\n.col-sm-9,\n.col-sm-10,\n.col-sm-11,\n.col-sm-12,\n.col-lg-1,\n.col-lg-2,\n.col-lg-3,\n.col-lg-4,\n.col-lg-5,\n.col-lg-6,\n.col-lg-7,\n.col-lg-8,\n.col-lg-9,\n.col-lg-10,\n.col-lg-11,\n.col-lg-12 {\n position: relative;\n // Prevent columns from collapsing when empty\n min-height: 1px;\n // Inner gutter via padding\n padding-left: (@grid-gutter-width / 2);\n padding-right: (@grid-gutter-width / 2);\n}\n\n\n\n//\n// Container and grid column sizing\n//\n\n// Extra small device columns (smartphones)\n.col-1,\n.col-2,\n.col-3,\n.col-4,\n.col-5,\n.col-6,\n.col-7,\n.col-8,\n.col-9,\n.col-10,\n.col-11,\n.col-12 {\n float: left;\n}\n.col-1 { width: percentage((1 / @grid-columns)); }\n.col-2 { width: percentage((2 / @grid-columns)); }\n.col-3 { width: percentage((3 / @grid-columns)); }\n.col-4 { width: percentage((4 / @grid-columns)); }\n.col-5 { width: percentage((5 / @grid-columns)); }\n.col-6 { width: percentage((6 / @grid-columns)); }\n.col-7 { width: percentage((7 / @grid-columns)); }\n.col-8 { width: percentage((8 / @grid-columns)); }\n.col-9 { width: percentage((9 / @grid-columns)); }\n.col-10 { width: percentage((10/ @grid-columns)); }\n.col-11 { width: percentage((11/ @grid-columns)); }\n.col-12 { width: 100%; }\n\n// Small device columns (phones to tablets)\n@media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {\n .container {\n max-width: @container-tablet;\n }\n\n .col-sm-1,\n .col-sm-2,\n .col-sm-3,\n .col-sm-4,\n .col-sm-5,\n .col-sm-6,\n .col-sm-7,\n .col-sm-8,\n .col-sm-9,\n .col-sm-10,\n .col-sm-11,\n .col-sm-12 {\n float: left;\n }\n .col-sm-1 { width: percentage((1 / @grid-columns)); }\n .col-sm-2 { width: percentage((2 / @grid-columns)); }\n .col-sm-3 { width: percentage((3 / @grid-columns)); }\n .col-sm-4 { width: percentage((4 / @grid-columns)); }\n .col-sm-5 { width: percentage((5 / @grid-columns)); }\n .col-sm-6 { width: percentage((6 / @grid-columns)); }\n .col-sm-7 { width: percentage((7 / @grid-columns)); }\n .col-sm-8 { width: percentage((8 / @grid-columns)); }\n .col-sm-9 { width: percentage((9 / @grid-columns)); }\n .col-sm-10 { width: percentage((10/ @grid-columns)); }\n .col-sm-11 { width: percentage((11/ @grid-columns)); }\n .col-sm-12 { width: 100%; }\n\n // Push and pull columns for source order changes\n .col-sm-push-1 { left: percentage((1 / @grid-columns)); }\n .col-sm-push-2 { left: percentage((2 / @grid-columns)); }\n .col-sm-push-3 { left: percentage((3 / @grid-columns)); }\n .col-sm-push-4 { left: percentage((4 / @grid-columns)); }\n .col-sm-push-5 { left: percentage((5 / @grid-columns)); }\n .col-sm-push-6 { left: percentage((6 / @grid-columns)); }\n .col-sm-push-7 { left: percentage((7 / @grid-columns)); }\n .col-sm-push-8 { left: percentage((8 / @grid-columns)); }\n .col-sm-push-9 { left: percentage((9 / @grid-columns)); }\n .col-sm-push-10 { left: percentage((10/ @grid-columns)); }\n .col-sm-push-11 { left: percentage((11/ @grid-columns)); }\n\n .col-sm-pull-1 { right: percentage((1 / @grid-columns)); }\n .col-sm-pull-2 { right: percentage((2 / @grid-columns)); }\n .col-sm-pull-3 { right: percentage((3 / @grid-columns)); }\n .col-sm-pull-4 { right: percentage((4 / @grid-columns)); }\n .col-sm-pull-5 { right: percentage((5 / @grid-columns)); }\n .col-sm-pull-6 { right: percentage((6 / @grid-columns)); }\n .col-sm-pull-7 { right: percentage((7 / @grid-columns)); }\n .col-sm-pull-8 { right: percentage((8 / @grid-columns)); }\n .col-sm-pull-9 { right: percentage((9 / @grid-columns)); }\n .col-sm-pull-10 { right: percentage((10/ @grid-columns)); }\n .col-sm-pull-11 { right: percentage((11/ @grid-columns)); }\n\n // Offsets\n .col-sm-offset-1 { margin-left: percentage((1 / @grid-columns)); }\n .col-sm-offset-2 { margin-left: percentage((2 / @grid-columns)); }\n .col-sm-offset-3 { margin-left: percentage((3 / @grid-columns)); }\n .col-sm-offset-4 { margin-left: percentage((4 / @grid-columns)); }\n .col-sm-offset-5 { margin-left: percentage((5 / @grid-columns)); }\n .col-sm-offset-6 { margin-left: percentage((6 / @grid-columns)); }\n .col-sm-offset-7 { margin-left: percentage((7 / @grid-columns)); }\n .col-sm-offset-8 { margin-left: percentage((8 / @grid-columns)); }\n .col-sm-offset-9 { margin-left: percentage((9 / @grid-columns)); }\n .col-sm-offset-10 { margin-left: percentage((10/ @grid-columns)); }\n .col-sm-offset-11 { margin-left: percentage((11/ @grid-columns)); }\n}\n\n// Medium and large device columns (desktop and up)\n@media (min-width: @screen-desktop) {\n .container {\n max-width: @container-desktop;\n }\n .col-lg-1,\n .col-lg-2,\n .col-lg-3,\n .col-lg-4,\n .col-lg-5,\n .col-lg-6,\n .col-lg-7,\n .col-lg-8,\n .col-lg-9,\n .col-lg-10,\n .col-lg-11,\n .col-lg-12 {\n float: left;\n }\n .col-lg-1 { width: percentage((1 / @grid-columns)); }\n .col-lg-2 { width: percentage((2 / @grid-columns)); }\n .col-lg-3 { width: percentage((3 / @grid-columns)); }\n .col-lg-4 { width: percentage((4 / @grid-columns)); }\n .col-lg-5 { width: percentage((5 / @grid-columns)); }\n .col-lg-6 { width: percentage((6 / @grid-columns)); }\n .col-lg-7 { width: percentage((7 / @grid-columns)); }\n .col-lg-8 { width: percentage((8 / @grid-columns)); }\n .col-lg-9 { width: percentage((9 / @grid-columns)); }\n .col-lg-10 { width: percentage((10/ @grid-columns)); }\n .col-lg-11 { width: percentage((11/ @grid-columns)); }\n .col-lg-12 { width: 100%; }\n\n // Push and pull columns for source order changes\n .col-lg-push-1 { left: percentage((1 / @grid-columns)); }\n .col-lg-push-2 { left: percentage((2 / @grid-columns)); }\n .col-lg-push-3 { left: percentage((3 / @grid-columns)); }\n .col-lg-push-4 { left: percentage((4 / @grid-columns)); }\n .col-lg-push-5 { left: percentage((5 / @grid-columns)); }\n .col-lg-push-6 { left: percentage((6 / @grid-columns)); }\n .col-lg-push-7 { left: percentage((7 / @grid-columns)); }\n .col-lg-push-8 { left: percentage((8 / @grid-columns)); }\n .col-lg-push-9 { left: percentage((9 / @grid-columns)); }\n .col-lg-push-10 { left: percentage((10/ @grid-columns)); }\n .col-lg-push-11 { left: percentage((11/ @grid-columns)); }\n\n .col-lg-pull-1 { right: percentage((1 / @grid-columns)); }\n .col-lg-pull-2 { right: percentage((2 / @grid-columns)); }\n .col-lg-pull-3 { right: percentage((3 / @grid-columns)); }\n .col-lg-pull-4 { right: percentage((4 / @grid-columns)); }\n .col-lg-pull-5 { right: percentage((5 / @grid-columns)); }\n .col-lg-pull-6 { right: percentage((6 / @grid-columns)); }\n .col-lg-pull-7 { right: percentage((7 / @grid-columns)); }\n .col-lg-pull-8 { right: percentage((8 / @grid-columns)); }\n .col-lg-pull-9 { right: percentage((9 / @grid-columns)); }\n .col-lg-pull-10 { right: percentage((10/ @grid-columns)); }\n .col-lg-pull-11 { right: percentage((11/ @grid-columns)); }\n\n // Offsets\n .col-lg-offset-1 { margin-left: percentage((1 / @grid-columns)); }\n .col-lg-offset-2 { margin-left: percentage((2 / @grid-columns)); }\n .col-lg-offset-3 { margin-left: percentage((3 / @grid-columns)); }\n .col-lg-offset-4 { margin-left: percentage((4 / @grid-columns)); }\n .col-lg-offset-5 { margin-left: percentage((5 / @grid-columns)); }\n .col-lg-offset-6 { margin-left: percentage((6 / @grid-columns)); }\n .col-lg-offset-7 { margin-left: percentage((7 / @grid-columns)); }\n .col-lg-offset-8 { margin-left: percentage((8 / @grid-columns)); }\n .col-lg-offset-9 { margin-left: percentage((9 / @grid-columns)); }\n .col-lg-offset-10 { margin-left: percentage((10/ @grid-columns)); }\n .col-lg-offset-11 { margin-left: percentage((11/ @grid-columns)); }\n}\n\n// Large desktops and up\n@media (min-width: @screen-large-desktop) {\n .container {\n max-width: @container-large-desktop;\n }\n}\n","input-groups.less":"//\n// Input groups\n// --------------------------------------------------\n\n// Base styles\n// -------------------------\n.input-group {\n position: relative; // For dropdowns\n display: table;\n border-collapse: separate; // prevent input groups from inheriting border styles from table cells when placed within a table\n\n // Undo padding and float of grid classes\n &.col {\n float: none;\n padding-left: 0;\n padding-right: 0;\n }\n\n .form-control {\n width: 100%;\n margin-bottom: 0;\n }\n}\n\n// Display as table-cell\n// -------------------------\n.input-group-addon,\n.input-group-btn,\n.input-group .form-control {\n display: table-cell;\n\n &:not(:first-child):not(:last-child) {\n border-radius: 0;\n }\n}\n// Addon and addon wrapper for buttons\n.input-group-addon,\n.input-group-btn {\n width: 1%;\n white-space: nowrap;\n vertical-align: middle; // Match the inputs\n}\n\n// Text input groups\n// -------------------------\n.input-group-addon {\n padding: @padding-base-vertical @padding-base-horizontal;\n font-size: @font-size-base;\n font-weight: normal;\n line-height: 1;\n text-align: center;\n background-color: @gray-lighter;\n border: 1px solid @input-group-addon-border-color;\n border-radius: @border-radius-base;\n\n // Sizing\n &.input-sm {\n padding: @padding-small-vertical @padding-small-horizontal;\n font-size: @font-size-small;\n border-radius: @border-radius-small;\n }\n &.input-lg {\n padding: @padding-large-vertical @padding-large-horizontal;\n font-size: @font-size-large;\n border-radius: @border-radius-large;\n }\n\n // Nuke default margins from checkboxes and radios to vertically center within.\n input[type=\"radio\"],\n input[type=\"checkbox\"] {\n margin-top: 0;\n }\n}\n\n// Reset rounded corners\n.input-group .form-control:first-child,\n.input-group-addon:first-child,\n.input-group-btn:first-child > .btn,\n.input-group-btn:first-child > .dropdown-toggle,\n.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle) {\n .border-right-radius(0);\n}\n.input-group-addon:first-child {\n border-right: 0;\n}\n.input-group .form-control:last-child,\n.input-group-addon:last-child,\n.input-group-btn:last-child > .btn,\n.input-group-btn:last-child > .dropdown-toggle,\n.input-group-btn:first-child > .btn:not(:first-child) {\n .border-left-radius(0);\n}\n.input-group-addon:last-child {\n border-left: 0;\n}\n\n// Button input groups\n// -------------------------\n.input-group-btn {\n position: relative;\n white-space: nowrap;\n}\n.input-group-btn > .btn {\n position: relative;\n // Jankily prevent input button groups from wrapping\n + .btn {\n margin-left: -4px;\n }\n // Bring the \"active\" button to the front\n &:hover,\n &:active {\n z-index: 2;\n }\n}\n","jumbotron.less":"//\n// Jumbotron\n// --------------------------------------------------\n\n\n.jumbotron {\n padding: 30px;\n margin-bottom: 30px;\n font-size: (@font-size-base * 1.5);\n font-weight: 200;\n line-height: (@line-height-base * 1.5);\n color: @jumbotron-lead-color;\n background-color: @jumbotron-bg;\n h1 {\n line-height: 1;\n color: @jumbotron-heading-color;\n }\n p {\n line-height: 1.4;\n }\n\n @media screen and (min-width: @screen-tablet) {\n padding: 50px 60px;\n border-radius: @border-radius-large; // Only round corners at higher resolutions\n h1 {\n font-size: (@font-size-base * 4.5);\n }\n }\n}\n","labels.less":"//\n// Labels\n// --------------------------------------------------\n\n.label {\n display: inline;\n padding: .25em .6em;\n font-size: 75%;\n font-weight: 500;\n line-height: 1;\n color: @label-color;\n text-align: center;\n white-space: nowrap;\n vertical-align: baseline;\n border-radius: .25em;\n\n // Add hover effects, but only for links\n &[href] {\n &:hover,\n &:focus {\n color: @label-link-hover-color;\n text-decoration: none;\n cursor: pointer;\n }\n }\n}\n\n// Colors\n// Contextual variations (linked labels get darker on :hover)\n\n.label-default {\n .label-variant(@label-default-bg);\n}\n\n.label-danger {\n .label-variant(@label-danger-bg);\n}\n\n.label-success {\n .label-variant(@label-success-bg);\n}\n\n.label-warning {\n .label-variant(@label-warning-bg);\n}\n\n.label-info {\n .label-variant(@label-info-bg);\n}\n","list-group.less":"//\n// List groups\n// --------------------------------------------------\n\n// Base class\n//\n// Easily usable on <ul>, <ol>, or <div>.\n.list-group {\n // No need to set list-style: none; since .list-group-item is block level\n margin-bottom: 20px;\n padding-left: 0; // reset padding because ul and ol\n}\n\n// Individual list items\n// -------------------------\n\n.list-group-item {\n position: relative;\n display: block;\n padding: 10px 30px 10px 15px;\n // Place the border on the list items and negative margin up for better styling\n margin-bottom: -1px;\n background-color: @list-group-bg;\n border: 1px solid @list-group-border;\n\n // Round the first and last items\n &:first-child {\n .border-top-radius(@list-group-border-radius);\n }\n &:last-child {\n margin-bottom: 0;\n .border-bottom-radius(@list-group-border-radius);\n }\n\n // Align badges within list items\n > .badge {\n float: right;\n margin-right: -15px;\n }\n > .badge + .badge {\n margin-right: 0;\n }\n}\n\n// Custom content options\n// -------------------------\n\n.list-group-item-heading {\n margin-top: 0;\n margin-bottom: 5px;\n}\n.list-group-item-text {\n margin-bottom: 0;\n line-height: 1.3;\n}\n\n// Linked list items\n// -------------------------\n\n// Custom content within linked items\na.list-group-item {\n // Colorize content accordingly\n .list-group-item-heading {\n color: @list-group-link-heading-color;\n }\n .list-group-item-text {\n color: @list-group-link-color;\n }\n\n // Hover state\n &:hover,\n &:focus {\n text-decoration: none;\n background-color: @list-group-hover-bg;\n }\n\n // Active class on item itself, not parent\n &.active {\n z-index: 2; // Place active items above their siblings for proper border styling\n color: @list-group-active-color;\n background-color: @list-group-active-bg;\n border-color: @list-group-active-border;\n\n // Force color to inherit for custom content\n .list-group-item-heading {\n color: inherit;\n }\n .list-group-item-text {\n color: lighten(@list-group-active-bg, 40%);\n }\n }\n}\n","media.less":"// Media objects\n// Source: http://stubbornella.org/content/?p=497\n// --------------------------------------------------\n\n\n// Common styles\n// -------------------------\n\n// Clear the floats\n.media,\n.media-body {\n overflow: hidden;\n zoom: 1;\n}\n\n// Proper spacing between instances of .media\n.media,\n.media .media {\n margin-top: 15px;\n}\n.media:first-child {\n margin-top: 0;\n}\n\n// For images and videos, set to block\n.media-object {\n display: block;\n}\n\n// Reset margins on headings for tighter default spacing\n.media-heading {\n margin: 0 0 5px;\n}\n\n\n// Media image alignment\n// -------------------------\n\n.media {\n > .pull-left {\n margin-right: 10px;\n }\n > .pull-right {\n margin-left: 10px;\n }\n}\n\n\n// Media list variation\n// -------------------------\n\n// Undo default ul/ol styles\n.media-list {\n padding-left: 0;\n list-style: none;\n}\n","mixins.less":"//\n// Mixins\n// --------------------------------------------------\n\n\n// Utilities\n// -------------------------\n\n// Clearfix\n// Source: http://nicolasgallagher.com/micro-clearfix-hack/\n//\n// For modern browsers\n// 1. The space content is one way to avoid an Opera bug when the\n// contenteditable attribute is included anywhere else in the document.\n// Otherwise it causes space to appear at the top and bottom of elements\n// that are clearfixed.\n// 2. The use of `table` rather than `block` is only necessary if using\n// `:before` to contain the top-margins of child elements.\n.clearfix() {\n &:before,\n &:after {\n content: \" \"; /* 1 */\n display: table; /* 2 */\n }\n &:after {\n clear: both;\n }\n}\n\n// Webkit-style focus\n.tab-focus() {\n // Default\n outline: thin dotted #333;\n // Webkit\n outline: 5px auto -webkit-focus-ring-color;\n outline-offset: -2px;\n}\n\n// Center-align a block level element\n.center-block() {\n display: block;\n margin-left: auto;\n margin-right: auto;\n}\n\n// Sizing shortcuts\n.size(@width; @height) {\n width: @width;\n height: @height;\n}\n.square(@size) {\n .size(@size; @size);\n}\n\n// Placeholder text\n.placeholder(@color: @input-color-placeholder) {\n &:-moz-placeholder { color: @color; } // Firefox 4-18\n &::-moz-placeholder { color: @color; } // Firefox 19+\n &:-ms-input-placeholder { color: @color; } // Internet Explorer 10+\n &::-webkit-input-placeholder { color: @color; } // Safari and Chrome\n}\n\n// Text overflow\n// Requires inline-block or block for proper styling\n.text-overflow() {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n// CSS image replacement\n// Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757\n.hide-text() {\n font: ~\"0/0\" a;\n color: transparent;\n text-shadow: none;\n background-color: transparent;\n border: 0;\n}\n\n\n\n// CSS3 PROPERTIES\n// --------------------------------------------------\n\n// Single side border-radius\n.border-top-radius(@radius) {\n border-top-right-radius: @radius;\n border-top-left-radius: @radius;\n}\n.border-right-radius(@radius) {\n border-bottom-right-radius: @radius;\n border-top-right-radius: @radius;\n}\n.border-bottom-radius(@radius) {\n border-bottom-right-radius: @radius;\n border-bottom-left-radius: @radius;\n}\n.border-left-radius(@radius) {\n border-bottom-left-radius: @radius;\n border-top-left-radius: @radius;\n}\n\n// Drop shadows\n.box-shadow(@shadow) {\n -webkit-box-shadow: @shadow; // iOS <4.3 & Android <4.1\n box-shadow: @shadow;\n}\n\n// Transitions\n.transition(@transition) {\n -webkit-transition: @transition;\n transition: @transition;\n}\n.transition-delay(@transition-delay) {\n -webkit-transition-delay: @transition-delay;\n transition-delay: @transition-delay;\n}\n.transition-duration(@transition-duration) {\n -webkit-transition-duration: @transition-duration;\n transition-duration: @transition-duration;\n}\n.transition-transform(@transition) {\n -webkit-transition: -webkit-transform @transition;\n -moz-transition: -moz-transform @transition;\n -o-transition: -o-transform @transition;\n transition: transform @transition;\n}\n\n// Transformations\n.rotate(@degrees) {\n -webkit-transform: rotate(@degrees);\n -ms-transform: rotate(@degrees); // IE9+\n transform: rotate(@degrees);\n}\n.scale(@ratio) {\n -webkit-transform: scale(@ratio);\n -ms-transform: scale(@ratio); // IE9+\n transform: scale(@ratio);\n}\n.translate(@x; @y) {\n -webkit-transform: translate(@x, @y);\n -ms-transform: translate(@x, @y); // IE9+\n transform: translate(@x, @y);\n}\n.skew(@x; @y) {\n -webkit-transform: skew(@x, @y);\n -ms-transform: skewX(@x) skewY(@y); // See https://github.com/twbs/bootstrap/issues/4885; IE9+\n transform: skew(@x, @y);\n}\n.translate3d(@x; @y; @z) {\n -webkit-transform: translate3d(@x, @y, @z);\n transform: translate3d(@x, @y, @z);\n}\n\n// Backface visibility\n// Prevent browsers from flickering when using CSS 3D transforms.\n// Default value is `visible`, but can be changed to `hidden`\n// See git pull https://github.com/dannykeane/bootstrap.git backface-visibility for examples\n.backface-visibility(@visibility){\n -webkit-backface-visibility: @visibility;\n -moz-backface-visibility: @visibility;\n backface-visibility: @visibility;\n}\n\n// Background clipping\n.background-clip(@clip) {\n background-clip: @clip;\n}\n\n// Background sizing\n.background-size(@size) {\n background-size: @size;\n}\n\n// Box sizing\n.box-sizing(@boxmodel) {\n -webkit-box-sizing: @boxmodel;\n -moz-box-sizing: @boxmodel;\n box-sizing: @boxmodel;\n}\n\n// User select\n// For selecting text on the page\n.user-select(@select) {\n -webkit-user-select: @select;\n -moz-user-select: @select;\n -ms-user-select: @select; // IE10+\n -o-user-select: @select;\n user-select: @select;\n}\n\n// Resize anything\n.resizable(@direction) {\n resize: @direction; // Options: horizontal, vertical, both\n overflow: auto; // Safari fix\n}\n\n// CSS3 Content Columns\n.content-columns(@column-count; @column-gap: @grid-gutter-width) {\n -webkit-column-count: @column-count;\n -moz-column-count: @column-count;\n column-count: @column-count;\n -webkit-column-gap: @column-gap;\n -moz-column-gap: @column-gap;\n column-gap: @column-gap;\n}\n\n// Optional hyphenation\n.hyphens(@mode: auto) {\n word-wrap: break-word;\n -webkit-hyphens: @mode;\n -moz-hyphens: @mode;\n -ms-hyphens: @mode; // IE10+\n -o-hyphens: @mode;\n hyphens: @mode;\n}\n\n// Opacity\n.opacity(@opacity) {\n opacity: @opacity;\n // IE8 filter\n @opacity-ie: (@opacity * 100);\n filter: ~\"alpha(opacity=@{opacity-ie})\";\n}\n\n\n\n// GRADIENTS\n// --------------------------------------------------\n\n#gradient {\n\n // Horizontal gradient, from left to right\n //\n // Creates two color stops, start and end, by specifying a color and position for each color stop.\n // Color stops are not available in IE9 and below.\n .horizontal(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) {\n background-image: -webkit-gradient(linear, @start-percent top, @end-percent top, from(@start-color), to(@end-color)); // Safari 4+, Chrome 2+\n background-image: -webkit-linear-gradient(left, color-stop(@start-color @start-percent), color-stop(@end-color @end-percent)); // Safari 5.1+, Chrome 10+\n background-image: -moz-linear-gradient(left, @start-color @start-percent, @end-color @end-percent); // FF 3.6+\n background-image: linear-gradient(to right, @start-color @start-percent, @end-color @end-percent); // Standard, IE10\n background-repeat: repeat-x;\n filter: e(%(\"progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)\",argb(@start-color),argb(@end-color))); // IE9 and down\n }\n\n // Vertical gradient, from top to bottom\n //\n // Creates two color stops, start and end, by specifying a color and position for each color stop.\n // Color stops are not available in IE9 and below.\n .vertical(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) {\n background-image: -webkit-gradient(linear, left @start-percent, left @end-percent, from(@start-color), to(@end-color)); // Safari 4+, Chrome 2+\n background-image: -webkit-linear-gradient(top, @start-color, @start-percent, @end-color, @end-percent); // Safari 5.1+, Chrome 10+\n background-image: -moz-linear-gradient(top, @start-color @start-percent, @end-color @end-percent); // FF 3.6+\n background-image: linear-gradient(to bottom, @start-color @start-percent, @end-color @end-percent); // Standard, IE10\n background-repeat: repeat-x;\n filter: e(%(\"progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)\",argb(@start-color),argb(@end-color))); // IE9 and down\n }\n\n .directional(@start-color: #555; @end-color: #333; @deg: 45deg) {\n background-repeat: repeat-x;\n background-image: -webkit-linear-gradient(@deg, @start-color, @end-color); // Safari 5.1+, Chrome 10+\n background-image: -moz-linear-gradient(@deg, @start-color, @end-color); // FF 3.6+\n background-image: linear-gradient(@deg, @start-color, @end-color); // Standard, IE10\n }\n .horizontal-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) {\n background-image: -webkit-gradient(left, linear, 0 0, 0 100%, from(@start-color), color-stop(@color-stop, @mid-color), to(@end-color));\n background-image: -webkit-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color);\n background-image: -moz-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color);\n background-image: linear-gradient(to right, @start-color, @mid-color @color-stop, @end-color);\n background-repeat: no-repeat;\n filter: e(%(\"progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)\",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback\n }\n .vertical-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) {\n background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@start-color), color-stop(@color-stop, @mid-color), to(@end-color));\n background-image: -webkit-linear-gradient(@start-color, @mid-color @color-stop, @end-color);\n background-image: -moz-linear-gradient(top, @start-color, @mid-color @color-stop, @end-color);\n background-image: linear-gradient(@start-color, @mid-color @color-stop, @end-color);\n background-repeat: no-repeat;\n filter: e(%(\"progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)\",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback\n }\n .radial(@inner-color: #555; @outer-color: #333) {\n background-image: -webkit-gradient(radial, center center, 0, center center, 460, from(@inner-color), to(@outer-color));\n background-image: -webkit-radial-gradient(circle, @inner-color, @outer-color);\n background-image: -moz-radial-gradient(circle, @inner-color, @outer-color);\n background-image: radial-gradient(circle, @inner-color, @outer-color);\n background-repeat: no-repeat;\n }\n .striped(@color: #555; @angle: 45deg) {\n background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255,255,255,.15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255,255,255,.15)), color-stop(.75, rgba(255,255,255,.15)), color-stop(.75, transparent), to(transparent));\n background-image: -webkit-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);\n background-image: -moz-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);\n background-image: linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);\n }\n}\n\n// Reset filters for IE\n//\n// When you need to remove a gradient background, don't forget to use this to reset\n// the IE filter for IE9 and below.\n.reset-filter() {\n filter: e(%(\"progid:DXImageTransform.Microsoft.gradient(enabled = false)\"));\n}\n\n\n\n// RETINA IMAGE SUPPORT\n// --------------------------------------------------\n\n// Short retina mixin for setting background-image and -size\n.img-retina(@file-1x; @file-2x; @width-1x; @height-1x) {\n background-image: url(\"@{file-1x}\");\n\n @media\n only screen and (-webkit-min-device-pixel-ratio: 2),\n only screen and ( min--moz-device-pixel-ratio: 2),\n only screen and ( -o-min-device-pixel-ratio: 2/1),\n only screen and ( min-device-pixel-ratio: 2),\n only screen and ( min-resolution: 192dpi),\n only screen and ( min-resolution: 2dppx) {\n background-image: url(\"@{file-2x}\");\n background-size: @width-1x @height-1x;\n }\n}\n\n\n// COMPONENT MIXINS\n// --------------------------------------------------\n\n// Horizontal dividers\n// -------------------------\n// Dividers (basically an hr) within dropdowns and nav lists\n.nav-divider(@color: #e5e5e5) {\n height: 1px;\n margin: ((@line-height-computed / 2) - 1) 0;\n overflow: hidden;\n background-color: @color;\n}\n\n// Panels\n// -------------------------\n.panel-variant(@border; @heading-text-color; @heading-bg-color; @heading-border) {\n border-color: @border;\n .panel-heading {\n color: @heading-text-color;\n background-color: @heading-bg-color;\n border-color: @heading-border;\n }\n}\n\n// Alerts\n// -------------------------\n.alert-variant(@background; @border; @text-color) {\n background-color: @background;\n border-color: @border;\n color: @text-color;\n hr {\n border-top-color: darken(@border, 5%);\n }\n .alert-link {\n color: darken(@text-color, 10%);\n }\n}\n\n// Button pseudo states\n// -------------------------\n// Easily pump out default styles, as well as :hover, :focus, :active,\n// and disabled options for all buttons\n.btn-pseudo-states(@color; @background; @border) {\n color: @color;\n background-color: @background;\n border-color: @border;\n\n &:hover,\n &:focus,\n &:active,\n &.active {\n color: @color;\n background-color: darken(@background, 8%);\n border-color: darken(@border, 12%);\n }\n\n &.disabled,\n &[disabled],\n fieldset[disabled] & {\n &,\n &:hover,\n &:focus,\n &:active,\n &.active {\n background-color: @background;\n border-color: @border\n }\n }\n}\n\n// Labels\n// -------------------------\n.label-variant(@color) {\n background-color: @color;\n &[href] {\n &:hover,\n &:focus {\n background-color: darken(@color, 10%);\n }\n }\n}\n\n// Navbar vertical align\n// -------------------------\n// Vertically center elements in the navbar.\n// Example: an element has a height of 30px, so write out `.navbar-vertical-align(30px);` to calculate the appropriate top margin.\n.navbar-vertical-align(@element-height) {\n margin-top: ((@navbar-height - @element-height) / 2);\n margin-bottom: ((@navbar-height - @element-height) / 2);\n}\n\n// Progress bars\n// -------------------------\n.progress-bar-variant(@color) {\n background-color: @color;\n .progress-striped & {\n #gradient > .striped(@color);\n }\n}\n\n// Responsive utilities\n// -------------------------\n// More easily include all the states for responsive-utilities.less.\n.responsive-visibility() {\n display: block !important;\n tr& { display: table-row !important; }\n th&,\n td& { display: table-cell !important; }\n}\n\n.responsive-invisibility() {\n display: none !important;\n tr& { display: none !important; }\n th&,\n td& { display: none !important; }\n}\n\n// Grid System\n// -----------\n\n// Centered container element\n.container-fixed() {\n margin-right: auto;\n margin-left: auto;\n .clearfix();\n}\n\n// Creates a wrapper for a series of columns\n.make-row(@gutter: @grid-gutter-width) {\n // Then clear the floated columns\n .clearfix();\n\n .container & {\n @media (min-width: @screen-small) {\n margin-left: (@gutter / -2);\n margin-right: (@gutter / -2);\n }\n }\n\n // Negative margin nested rows out to align the content of columns\n .row {\n margin-left: (@gutter / -2);\n margin-right: (@gutter / -2);\n }\n}\n\n// Generate the columns\n.make-column(@columns; @gutter: @grid-gutter-width) {\n position: relative;\n // Prevent columns from collapsing when empty\n min-height: 1px;\n // Inner gutter via padding\n padding-left: (@gutter / 2);\n padding-right: (@gutter / 2);\n\n // Calculate width based on number of columns available\n @media (min-width: @grid-float-breakpoint) {\n float: left;\n width: percentage((@columns / @grid-columns));\n }\n}\n\n// Generate the column offsets\n.make-column-offset(@columns) {\n @media (min-width: @grid-float-breakpoint) {\n margin-left: percentage((@columns / @grid-columns));\n }\n}\n.make-column-push(@columns) {\n @media (min-width: @grid-float-breakpoint) {\n left: percentage((@columns / @grid-columns));\n }\n}\n.make-column-pull(@columns) {\n @media (min-width: @grid-float-breakpoint) {\n right: percentage((@columns / @grid-columns));\n }\n}\n\n// Generate the small columns\n.make-small-column(@columns; @gutter: @grid-gutter-width) {\n position: relative;\n float: left;\n // Prevent columns from collapsing when empty\n min-height: 1px;\n // Inner gutter via padding\n padding-left: (@gutter / 2);\n padding-right: (@gutter / 2);\n @max-width: (@grid-float-breakpoint - 1);\n\n // Calculate width based on number of columns available\n @media (max-width: @max-width) {\n width: percentage((@columns / @grid-columns));\n }\n}\n\n\n// Form validation states\n//\n// Used in forms.less to generate the form validation CSS for warnings, errors,\n// and successes.\n\n.form-control-validation(@text-color: #555; @border-color: #ccc; @background-color: #f5f5f5) {\n // Color the label and help text\n .help-block,\n .control-label {\n color: @text-color;\n }\n // Set the border and box shadow on specific inputs to match\n .form-control {\n border-color: @border-color;\n .box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work\n &:focus {\n border-color: darken(@border-color, 10%);\n @shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten(@border-color, 20%);\n .box-shadow(@shadow);\n }\n }\n // Set validation states also for addons\n .input-group-addon {\n color: @text-color;\n border-color: @border-color;\n background-color: @background-color;\n }\n}\n\n// Form control focus state\n//\n// Generate a customized focus state and for any input with the specified color,\n// which defaults to the `@input-focus-border` variable.\n//\n// We highly encourage you to not customize the default value, but instead use\n// this to tweak colors on an as-needed basis. This aesthetic change is based on\n// WebKit's default styles, but applicable to a wider range of browsers. Its\n// usability and accessibility should be taken into account with any change.\n//\n// Example usage: change the default blue border and shadow to white for better\n// contrast against a dark gray background.\n\n.form-control-focus(@color: @input-border-focus) {\n @color-rgba: rgba(red(@color), green(@color), blue(@color), .6);\n &:focus {\n border-color: @color;\n outline: 0;\n .box-shadow(~\"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px @{color-rgba}\");\n }\n}\n","modals.less":"//\n// Modals\n// --------------------------------------------------\n\n// .modal-open - body class for killing the scroll\n// .modal - container to scroll within\n// .modal-dialog - positioning shell for the actual modal\n// .modal-content - actual modal w/ bg and corners and shit\n\n// Kill the scroll on the body\n.modal-open {\n overflow: hidden;\n}\n\n// Container that the modal scrolls within\n.modal {\n display: none;\n overflow: auto;\n overflow-y: scroll;\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: @zindex-modal-background;\n\n // When fading in the modal, animate it to slide down\n &.fade .modal-dialog {\n .translate(0, -25%);\n .transition-transform(~\"0.3s ease-out\");\n }\n &.in .modal-dialog { .translate(0, 0)}\n}\n\n// Shell div to position the modal with bottom padding\n.modal-dialog {\n margin-left: auto;\n margin-right: auto;\n width: auto;\n padding: 10px;\n z-index: (@zindex-modal-background + 10);\n}\n\n// Actual modal\n.modal-content {\n position: relative;\n background-color: @modal-content-bg;\n border: 1px solid @modal-content-fallback-border-color; //old browsers fallback (ie8 etc)\n border: 1px solid @modal-content-border-color;\n border-radius: @border-radius-large;\n .box-shadow(0 3px 9px rgba(0,0,0,.5));\n .background-clip(padding-box);\n // Remove focus outline from opened modal\n outline: none;\n}\n\n// Modal background\n.modal-backdrop {\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: (@zindex-modal-background - 10);\n background-color: @modal-backdrop-bg;\n // Fade for backdrop\n &.fade { .opacity(0); }\n &.in { .opacity(.5); }\n}\n\n// Modal header\n// Top section of the modal w/ title and dismiss\n.modal-header {\n padding: @modal-title-padding;\n border-bottom: 1px solid @modal-header-border-color;\n min-height: (@modal-title-padding + @modal-title-line-height);\n}\n// Close icon\n.modal-header .close {\n margin-top: -2px;\n}\n\n// Title text within header\n.modal-title {\n margin: 0;\n line-height: @modal-title-line-height;\n}\n\n// Modal body\n// Where all modal content resides (sibling of .modal-header and .modal-footer)\n.modal-body {\n position: relative;\n padding: @modal-inner-padding;\n}\n\n// Footer (for actions)\n.modal-footer {\n margin-top: 15px;\n padding: (@modal-inner-padding - 1) @modal-inner-padding @modal-inner-padding;\n text-align: right; // right align buttons\n border-top: 1px solid @modal-footer-border-color;\n .clearfix(); // clear it in case folks use .pull-* classes on buttons\n\n // Properly space out buttons\n .btn + .btn {\n margin-left: 5px;\n margin-bottom: 0; // account for input[type=\"submit\"] which gets the bottom margin like all other inputs\n }\n // but override that for button groups\n .btn-group .btn + .btn {\n margin-left: -1px;\n }\n // and override it for block buttons as well\n .btn-block + .btn-block {\n margin-left: 0;\n }\n}\n\n// Scale up the modal\n@media screen and (min-width: @screen-tablet) {\n\n .modal-dialog {\n left: 50%;\n right: auto;\n width: 600px;\n padding-top: 30px;\n padding-bottom: 30px;\n }\n .modal-content {\n .box-shadow(0 5px 15px rgba(0,0,0,.5));\n }\n\n}\n","navbar.less":"//\n// Navbars\n// --------------------------------------------------\n\n// Wrapper and base class\n.navbar {\n position: relative;\n min-height: @navbar-height; // Ensure a navbar always shows (e.g., without a .navbar-brand in collapsed mode)\n margin-bottom: 20px;\n padding-left: @navbar-padding-horizontal;\n padding-right: @navbar-padding-horizontal;\n background-color: @navbar-bg;\n border-radius: @navbar-border-radius;\n\n // Prevent floats from breaking the navbar\n .clearfix();\n}\n\n// Navbar nav links\n// -------------------------\n\n.navbar-nav {\n margin-bottom: 15px;\n\n > li > a {\n padding-top: ((@navbar-height - @line-height-computed) / 2);\n padding-bottom: ((@navbar-height - @line-height-computed) / 2);\n color: @navbar-link-color;\n line-height: @line-height-computed;\n border-radius: @border-radius-base;\n &:hover,\n &:focus {\n color: @navbar-link-hover-color;\n background-color: @navbar-link-hover-bg;\n }\n }\n > .active > a {\n &,\n &:hover,\n &:focus {\n color: @navbar-link-active-color;\n background-color: @navbar-link-active-bg;\n }\n }\n > .disabled > a {\n &,\n &:hover,\n &:focus {\n color: @navbar-link-disabled-color;\n background-color: @navbar-link-disabled-bg;\n }\n }\n\n // Right aligned contents\n // Make them full width first so that they align properly on mobile\n &.pull-right {\n width: 100%;\n }\n}\n\n\n\n//\n// Navbar alignment options\n// --------------------------------------------------\n\n// Static navbar\n.navbar-static-top {\n border-radius: 0;\n}\n\n// Fix the top/bottom navbars when screen real estate supports it\n.navbar-fixed-top,\n.navbar-fixed-bottom {\n position: fixed;\n right: 0;\n left: 0;\n z-index: @zindex-navbar-fixed;\n border-radius: 0;\n}\n.navbar-fixed-top {\n top: 0;\n}\n.navbar-fixed-bottom {\n bottom: 0;\n margin-bottom: 0; // override .navbar defaults\n}\n\n.nav-collapse {\n // Space out collapsed contents within the mobile navbar\n padding-bottom: @navbar-padding-vertical;\n // Clear floated elements and prevent collapsing of padding\n .clearfix();\n\n // When there is no `.navbar-brand` present (which normally sits between the\n // navbar brand and toggle), prevent the nav from overlapping the toggle.\n .navbar-toggle + & {\n width: 100%;\n margin-top: @navbar-height;\n }\n}\n\n\n// Scrollable navbar navigation\n//\n// Sometimes you might have too many links in your fixed navbar and you need to\n// maintain access to all that content. To help, add `.nav-collapse-scrollable`\n// to your `.nav-collapse` to prevent the the content from flowing past the max-\n// height of your browser.\n//\n// This is not automatically added to the `.navbar-fixed-top` because it causes\n// z-index bugs in iOS7 (possibly earlier).\n\n@media (max-width: @screen-small) {\n .nav-collapse-scrollable {\n margin-bottom: @navbar-padding-vertical;\n max-height: 360px;\n overflow-y: scroll;\n -webkit-overflow-scrolling: touch;\n }\n}\n\n\n//\n// Navbar optional components\n// --------------------------------------------------\n\n// Brand/project name\n.navbar-brand {\n display: block;\n max-width: 200px;\n margin-left: auto;\n margin-right: auto;\n padding: @navbar-padding-vertical @navbar-padding-horizontal;\n font-size: @font-size-large;\n font-weight: 500;\n line-height: @line-height-computed;\n color: @navbar-brand-color;\n text-align: center;\n &:hover,\n &:focus {\n color: @navbar-brand-hover-color;\n text-decoration: none;\n background-color: @navbar-brand-hover-bg;\n }\n}\n\n// Collapsible navbar toggle\n.navbar-toggle {\n position: relative;\n float: right;\n height: 34px;\n width: 48px;\n .navbar-vertical-align(34px);\n padding: @padding-base-vertical @padding-base-horizontal;\n background-color: transparent;\n border: 1px solid @navbar-toggle-border-color;\n border-radius: @border-radius-base;\n\n &:hover,\n &:focus {\n background-color: @navbar-toggle-hover-bg;\n }\n\n // Bars\n .icon-bar {\n display: block;\n width: 22px;\n height: 2px;\n background-color: @navbar-toggle-icon-bar-bg;\n border-radius: 1px;\n }\n .icon-bar + .icon-bar {\n margin-top: 4px;\n }\n}\n\n// Navbar form\n.navbar-form {\n .form-inline();\n .navbar-vertical-align(@input-height-base); // Vertically center in navbar\n}\n\n// Dropdown menus\n\n// Menu position and menu carets\n.navbar-nav > li > .dropdown-menu {\n margin-top: 0;\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n}\n// Menu position and menu caret support for dropups via extra dropup class\n.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n}\n\n// Dropdown menu items and carets\n.navbar-nav {\n // Caret should match text color on hover\n > .dropdown > a:hover .caret,\n > .dropdown > a:focus .caret {\n border-top-color: @navbar-link-hover-color;\n border-bottom-color: @navbar-link-hover-color;\n }\n\n // Remove background color from open dropdown\n > .open > a {\n &,\n &:hover,\n &:focus {\n background-color: @navbar-link-active-bg;\n color: @navbar-link-active-color;\n .caret {\n border-top-color: @navbar-link-active-color;\n border-bottom-color: @navbar-link-active-color;\n }\n }\n }\n > .dropdown > a .caret {\n border-top-color: @navbar-link-color;\n border-bottom-color: @navbar-link-color;\n }\n}\n\n// Right aligned menus need alt position\n.navbar-nav.pull-right > li > .dropdown-menu,\n.navbar-nav > li > .dropdown-menu.pull-right {\n left: auto;\n right: 0;\n}\n\n\n\n// Inverse navbar\n// --------------------------------------------------\n\n.navbar-inverse {\n background-color: @navbar-inverse-bg;\n\n .navbar-brand {\n color: @navbar-inverse-brand-color;\n &:hover,\n &:focus {\n color: @navbar-inverse-brand-hover-color;\n background-color: @navbar-inverse-brand-hover-bg;\n }\n }\n\n .navbar-text {\n color: @navbar-inverse-color;\n }\n\n .navbar-nav {\n > li > a {\n color: @navbar-inverse-link-color;\n\n &:hover,\n &:focus {\n color: @navbar-inverse-link-hover-color;\n background-color: @navbar-inverse-link-hover-bg;\n }\n }\n > .active > a {\n &,\n &:hover,\n &:focus {\n color: @navbar-inverse-link-active-color;\n background-color: @navbar-inverse-link-active-bg;\n }\n }\n > .disabled > a {\n &,\n &:hover,\n &:focus {\n color: @navbar-inverse-link-disabled-color;\n background-color: @navbar-inverse-link-disabled-bg;\n }\n }\n }\n\n // Darken the responsive nav toggle\n .navbar-toggle {\n border-color: @navbar-inverse-toggle-border-color;\n &:hover,\n &:focus {\n background-color: @navbar-inverse-toggle-hover-bg;\n }\n .icon-bar {\n background-color: @navbar-inverse-toggle-icon-bar-bg;\n }\n }\n\n // Dropdowns\n .navbar-nav {\n > .open > a {\n &,\n &:hover,\n &:focus {\n background-color: @navbar-inverse-link-active-bg;\n color: @navbar-inverse-link-active-color;\n }\n }\n > .dropdown > a:hover .caret {\n border-top-color: @navbar-inverse-link-hover-color;\n border-bottom-color: @navbar-inverse-link-hover-color;\n }\n > .dropdown > a .caret {\n border-top-color: @navbar-inverse-link-color;\n border-bottom-color: @navbar-inverse-link-color;\n }\n > .open > a {\n &,\n &:hover,\n &:focus {\n .caret {\n border-top-color: @navbar-inverse-link-active-color;\n border-bottom-color: @navbar-inverse-link-active-color;\n }\n }\n }\n }\n}\n\n\n\n// Responsive navbar\n// --------------------------------------------------\n\n@media screen and (min-width: @grid-float-breakpoint) {\n\n .navbar-brand {\n float: left;\n margin-left: -(@navbar-padding-horizontal);\n margin-right: 5px;\n max-width: none; // Disables the default mobile setting\n }\n .navbar-nav {\n float: left;\n // undo margin to make nav extend full height of navbar\n margin-top: 0;\n margin-bottom: 0;\n\n > li {\n float: left;\n > a {\n border-radius: 0;\n }\n }\n\n &.pull-right {\n width: auto;\n }\n }\n\n // Required to make the collapsing navbar work on regular desktops\n .navbar-toggle {\n position: relative;\n top: auto;\n left: auto;\n display: none;\n }\n .nav-collapse.collapse {\n display: block !important;\n height: auto !important;\n padding-bottom: 0; // Override default setting\n overflow: visible !important;\n }\n\n}\n\n\n\n// Buttons in navbars\n//\n// Vertically center a button within a navbar (when *not* in a form).\n\n.navbar-btn {\n margin-top: ((@navbar-height - @input-height-base) / 2);\n}\n\n\n\n// Text in navbars\n//\n// Add a class to make any element properly align itself vertically within the navbars.\n\n.navbar-text {\n float: left;\n padding: 0 @navbar-padding-horizontal;\n .navbar-vertical-align(@line-height-computed);\n}\n\n\n\n// Links in navbars\n//\n// Add a class to ensure links outside the navbar nav are colored correctly.\n\n// Default navbar variables\n.navbar-link {\n color: @navbar-link-color;\n &:hover {\n color: @navbar-link-hover-color;\n }\n}\n\n// Use the inverse navbar variables\n.navbar-inverse .navbar-link {\n color: @navbar-inverse-link-color;\n &:hover {\n color: @navbar-inverse-link-hover-color;\n }\n}\n","navs.less":"//\n// Navs\n// --------------------------------------------------\n\n\n// Base class\n// --------------------------------------------------\n\n.nav {\n margin-bottom: 0;\n padding-left: 0; // Override default ul/ol\n list-style: none;\n .clearfix();\n\n > li {\n position: relative;\n display: block;\n\n > a {\n position: relative;\n display: block;\n padding: 10px 15px;\n &:hover,\n &:focus {\n text-decoration: none;\n background-color: @nav-link-hover-bg;\n }\n }\n\n // Disabled state sets text to gray and nukes hover/tab effects\n &.disabled > a {\n color: @nav-disabled-link-color;\n\n &:hover,\n &:focus {\n color: @nav-disabled-link-hover-color;\n text-decoration: none;\n background-color: transparent;\n cursor: not-allowed;\n }\n }\n }\n\n // Open dropdowns\n &.open > a {\n &,\n &:hover,\n &:focus {\n color: @nav-open-link-hover-color;\n background-color: @link-color;\n border-color: @link-color;\n .caret {\n border-top-color: @nav-open-caret-border-color;\n border-bottom-color: @nav-open-caret-border-color;\n }\n }\n }\n\n // Dividers (basically an hr) within the dropdown\n .nav-divider {\n .nav-divider();\n }\n}\n\n\n// Tabs\n// -------------------------\n\n// Give the tabs something to sit on\n.nav-tabs {\n border-bottom: 1px solid @nav-tabs-border-color;\n > li {\n float: left;\n // Make the list-items overlay the bottom border\n margin-bottom: -1px;\n\n // Actual tabs (as links)\n > a {\n margin-right: 2px;\n line-height: @line-height-base;\n border: 1px solid transparent;\n border-radius: @border-radius-base @border-radius-base 0 0;\n &:hover {\n border-color: @nav-tabs-link-hover-border-color;\n }\n }\n\n // Active state, and it's :hover to override normal :hover\n &.active > a {\n &,\n &:hover,\n &:focus {\n color: @nav-tabs-active-link-hover-color;\n background-color: @nav-tabs-active-link-hover-bg;\n border: 1px solid @nav-tabs-active-link-hover-border-color;\n border-bottom-color: transparent;\n cursor: default;\n }\n }\n }\n // pulling this in mainly for less shorthand\n &.nav-justified {\n .nav-justified();\n .nav-tabs-justified();\n }\n}\n\n\n// Pills\n// -------------------------\n.nav-pills {\n > li {\n float: left;\n\n // Links rendered as pills\n > a {\n border-radius: 5px;\n }\n + li {\n margin-left: 2px;\n }\n\n // Active state\n &.active > a {\n &,\n &:hover,\n &:focus {\n color: @nav-pills-active-link-hover-color;\n background-color: @nav-pills-active-link-hover-bg;\n }\n }\n }\n}\n\n\n// Stacked pills\n.nav-stacked {\n > li {\n float: none;\n + li {\n margin-top: 2px;\n margin-left: 0; // no need for this gap between nav items\n }\n }\n}\n\n\n// Nav variations\n// --------------------------------------------------\n\n// Justified nav links\n// -------------------------\n\n.nav-justified {\n width: 100%;\n > li {\n float: none;\n display: table-cell;\n width: 1%;\n > a {\n text-align: center;\n }\n }\n}\n\n// Move borders to anchors instead of bottom of list\n.nav-tabs-justified {\n border-bottom: 0;\n > li > a {\n border-bottom: 1px solid @nav-tabs-justified-link-border-color;\n\n // Override margin from .nav-tabs\n margin-right: 0;\n }\n > .active > a {\n border-bottom-color: @nav-tabs-justified-active-link-border-color;\n }\n}\n\n\n// Tabbable tabs\n// -------------------------\n\n// Clear any floats\n.tabbable {\n .clearfix();\n}\n\n// Show/hide tabbable areas\n.tab-content > .tab-pane,\n.pill-content > .pill-pane {\n display: none;\n}\n.tab-content,\n.pill-content {\n > .active {\n display: block;\n }\n}\n\n\n\n// Dropdowns\n// -------------------------\n\n// Make dropdown carets use link color in navs\n.nav .caret {\n border-top-color: @link-color;\n border-bottom-color: @link-color;\n}\n.nav a:hover .caret {\n border-top-color: @link-hover-color;\n border-bottom-color: @link-hover-color;\n}\n\n// Specific dropdowns\n.nav-tabs .dropdown-menu {\n // make dropdown border overlap tab border\n margin-top: -1px;\n // Remove the top rounded corners here since there is a hard edge above the menu\n .border-top-radius(0);\n}\n","normalize.less":"/*! normalize.css v2.1.0 | MIT License | git.io/normalize */\n\n// ==========================================================================\n// HTML5 display definitions\n// ==========================================================================\n\n//\n// Correct `block` display not defined in IE 8/9.\n//\n\narticle,\naside,\ndetails,\nfigcaption,\nfigure,\nfooter,\nheader,\nhgroup,\nmain,\nnav,\nsection,\nsummary {\n display: block;\n}\n\n//\n// Correct `inline-block` display not defined in IE 8/9.\n//\n\naudio,\ncanvas,\nvideo {\n display: inline-block;\n}\n\n//\n// Prevent modern browsers from displaying `audio` without controls.\n// Remove excess height in iOS 5 devices.\n//\n\naudio:not([controls]) {\n display: none;\n height: 0;\n}\n\n//\n// Address styling not present in IE 8/9.\n//\n\n[hidden] {\n display: none;\n}\n\n// ==========================================================================\n// Base\n// ==========================================================================\n\n//\n// 1. Set default font family to sans-serif.\n// 2. Prevent iOS text size adjust after orientation change, without disabling\n// user zoom.\n//\n\nhtml {\n font-family: sans-serif; // 1\n -webkit-text-size-adjust: 100%; // 2\n -ms-text-size-adjust: 100%; // 2\n}\n\n//\n// Remove default margin.\n//\n\nbody {\n margin: 0;\n}\n\n// ==========================================================================\n// Links\n// ==========================================================================\n\n//\n// Address `outline` inconsistency between Chrome and other browsers.\n//\n\na:focus {\n outline: thin dotted;\n}\n\n//\n// Improve readability when focused and also mouse hovered in all browsers.\n//\n\na:active,\na:hover {\n outline: 0;\n}\n\n// ==========================================================================\n// Typography\n// ==========================================================================\n\n//\n// Address variable `h1` font-size and margin within `section` and `article`\n// contexts in Firefox 4+, Safari 5, and Chrome.\n//\n\nh1 {\n font-size: 2em;\n margin: 0.67em 0;\n}\n\n//\n// Address styling not present in IE 8/9, Safari 5, and Chrome.\n//\n\nabbr[title] {\n border-bottom: 1px dotted;\n}\n\n//\n// Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.\n//\n\nb,\nstrong {\n font-weight: bold;\n}\n\n//\n// Address styling not present in Safari 5 and Chrome.\n//\n\ndfn {\n font-style: italic;\n}\n\n//\n// Address differences between Firefox and other browsers.\n//\n\nhr {\n -moz-box-sizing: content-box;\n box-sizing: content-box;\n height: 0;\n}\n\n//\n// Address styling not present in IE 8/9.\n//\n\nmark {\n background: #ff0;\n color: #000;\n}\n\n//\n// Correct font family set oddly in Safari 5 and Chrome.\n//\n\ncode,\nkbd,\npre,\nsamp {\n font-family: monospace, serif;\n font-size: 1em;\n}\n\n//\n// Improve readability of pre-formatted text in all browsers.\n//\n\npre {\n white-space: pre-wrap;\n}\n\n//\n// Set consistent quote types.\n//\n\nq {\n quotes: \"\\201C\" \"\\201D\" \"\\2018\" \"\\2019\";\n}\n\n//\n// Address inconsistent and variable font size in all browsers.\n//\n\nsmall {\n font-size: 80%;\n}\n\n//\n// Prevent `sub` and `sup` affecting `line-height` in all browsers.\n//\n\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n\nsup {\n top: -0.5em;\n}\n\nsub {\n bottom: -0.25em;\n}\n\n// ==========================================================================\n// Embedded content\n// ==========================================================================\n\n//\n// Remove border when inside `a` element in IE 8/9.\n//\n\nimg {\n border: 0;\n}\n\n//\n// Correct overflow displayed oddly in IE 9.\n//\n\nsvg:not(:root) {\n overflow: hidden;\n}\n\n// ==========================================================================\n// Figures\n// ==========================================================================\n\n//\n// Address margin not present in IE 8/9 and Safari 5.\n//\n\nfigure {\n margin: 0;\n}\n\n// ==========================================================================\n// Forms\n// ==========================================================================\n\n//\n// Define consistent border, margin, and padding.\n//\n\nfieldset {\n border: 1px solid #c0c0c0;\n margin: 0 2px;\n padding: 0.35em 0.625em 0.75em;\n}\n\n//\n// 1. Correct `color` not being inherited in IE 8/9.\n// 2. Remove padding so people aren't caught out if they zero out fieldsets.\n//\n\nlegend {\n border: 0; // 1\n padding: 0; // 2\n}\n\n//\n// 1. Correct font family not being inherited in all browsers.\n// 2. Correct font size not being inherited in all browsers.\n// 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.\n//\n\nbutton,\ninput,\nselect,\ntextarea {\n font-family: inherit; // 1\n font-size: 100%; // 2\n margin: 0; // 3\n}\n\n//\n// Address Firefox 4+ setting `line-height` on `input` using `!important` in\n// the UA stylesheet.\n//\n\nbutton,\ninput {\n line-height: normal;\n}\n\n//\n// Address inconsistent `text-transform` inheritance for `button` and `select`.\n// All other form control elements do not inherit `text-transform` values.\n// Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+.\n// Correct `select` style inheritance in Firefox 4+ and Opera.\n//\n\nbutton,\nselect {\n text-transform: none;\n}\n\n//\n// 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`\n// and `video` controls.\n// 2. Correct inability to style clickable `input` types in iOS.\n// 3. Improve usability and consistency of cursor style between image-type\n// `input` and others.\n//\n\nbutton,\nhtml input[type=\"button\"], // 1\ninput[type=\"reset\"],\ninput[type=\"submit\"] {\n -webkit-appearance: button; // 2\n cursor: pointer; // 3\n}\n\n//\n// Re-set default cursor for disabled elements.\n//\n\nbutton[disabled],\nhtml input[disabled] {\n cursor: default;\n}\n\n//\n// 1. Address box sizing set to `content-box` in IE 8/9.\n// 2. Remove excess padding in IE 8/9.\n//\n\ninput[type=\"checkbox\"],\ninput[type=\"radio\"] {\n box-sizing: border-box; // 1\n padding: 0; // 2\n}\n\n//\n// 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.\n// 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome\n// (include `-moz` to future-proof).\n//\n\ninput[type=\"search\"] {\n -webkit-appearance: textfield; // 1\n -moz-box-sizing: content-box;\n -webkit-box-sizing: content-box; // 2\n box-sizing: content-box;\n}\n\n//\n// Remove inner padding and search cancel button in Safari 5 and Chrome\n// on OS X.\n//\n\ninput[type=\"search\"]::-webkit-search-cancel-button,\ninput[type=\"search\"]::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n//\n// Remove inner padding and border in Firefox 4+.\n//\n\nbutton::-moz-focus-inner,\ninput::-moz-focus-inner {\n border: 0;\n padding: 0;\n}\n\n//\n// 1. Remove default vertical scrollbar in IE 8/9.\n// 2. Improve readability and alignment in all browsers.\n//\n\ntextarea {\n overflow: auto; // 1\n vertical-align: top; // 2\n}\n\n// ==========================================================================\n// Tables\n// ==========================================================================\n\n//\n// Remove most spacing between table cells.\n//\n\ntable {\n border-collapse: collapse;\n border-spacing: 0;\n}\n","pager.less":"//\n// Pager pagination\n// --------------------------------------------------\n\n\n.pager {\n padding-left: 0;\n margin: @line-height-computed 0;\n list-style: none;\n text-align: center;\n .clearfix();\n li {\n display: inline;\n > a,\n > span {\n display: inline-block;\n padding: 5px 14px;\n background-color: @pagination-bg;\n border: 1px solid @pagination-border;\n border-radius: @pager-border-radius;\n }\n\n > a:hover,\n > a:focus {\n text-decoration: none;\n background-color: @pagination-active-bg;\n }\n }\n\n .next {\n > a,\n > span {\n float: right;\n }\n }\n\n .previous {\n > a,\n > span {\n float: left;\n }\n }\n\n .disabled {\n > a,\n > a:hover,\n > a:focus,\n > span {\n color: @pager-disabled-color;\n background-color: @pagination-bg;\n cursor: not-allowed;\n }\n }\n\n}\n","pagination.less":"//\n// Pagination (multiple pages)\n// --------------------------------------------------\n.pagination {\n display: inline-block;\n padding-left: 0;\n margin: @line-height-computed 0;\n border-radius: @border-radius-base;\n\n > li {\n display: inline; // Remove list-style and block-level defaults\n > a,\n > span {\n float: left; // Collapse white-space\n padding: @padding-base-vertical @padding-base-horizontal;\n line-height: @line-height-base;\n text-decoration: none;\n background-color: @pagination-bg;\n border: 1px solid @pagination-border;\n border-left-width: 0;\n }\n &:first-child {\n > a,\n > span {\n border-left-width: 1px;\n .border-left-radius(@border-radius-base);\n }\n }\n &:last-child {\n > a,\n > span {\n .border-right-radius(@border-radius-base);\n }\n }\n }\n\n > li > a:hover,\n > li > a:focus,\n > .active > a,\n > .active > span {\n background-color: @pagination-active-bg;\n }\n > .active > a,\n > .active > span {\n color: @pagination-active-color;\n cursor: default;\n }\n\n > .disabled {\n > span,\n > a,\n > a:hover,\n > a:focus {\n color: @pagination-disabled-color;\n background-color: @pagination-bg;\n cursor: not-allowed;\n }\n }\n}\n\n// Sizing\n// --------------------------------------------------\n\n// Large\n.pagination-lg {\n > li {\n > a,\n > span {\n padding: @padding-large-vertical @padding-large-horizontal;\n font-size: @font-size-large;\n }\n &:first-child {\n > a,\n > span {\n .border-left-radius(@border-radius-large);\n }\n }\n &:last-child {\n > a,\n > span {\n .border-right-radius(@border-radius-large);\n }\n }\n }\n}\n\n// Small\n.pagination-sm {\n > li {\n > a,\n > span {\n padding: @padding-small-vertical @padding-small-horizontal;\n font-size: @font-size-small;\n }\n &:first-child {\n > a,\n > span {\n .border-left-radius(@border-radius-small);\n }\n }\n &:last-child {\n > a,\n > span {\n .border-right-radius(@border-radius-small);\n }\n }\n }\n}\n","panels.less":"//\n// Panels\n// --------------------------------------------------\n\n\n// Base class\n.panel {\n padding: 15px;\n margin-bottom: 20px;\n background-color: @panel-bg;\n border: 1px solid @panel-border;\n border-radius: @panel-border-radius;\n .box-shadow(0 1px 1px rgba(0,0,0,.05));\n\n // List groups in panels\n .list-group {\n margin: 15px -15px -15px;\n\n .list-group-item {\n border-width: 1px 0;\n\n // Remove border radius for top one\n &:first-child {\n .border-top-radius(0);\n }\n // But keep it for the last one\n &:last-child {\n border-bottom: 0;\n }\n }\n }\n}\n\n// Optional heading\n.panel-heading {\n margin: -15px -15px 15px;\n padding: 10px 15px;\n background-color: @panel-heading-bg;\n border-bottom: 1px solid @panel-border;\n border-top-left-radius: (@panel-border-radius - 1);\n border-top-right-radius: (@panel-border-radius - 1);\n}\n\n// Within heading, strip any `h*` tag of it's default margins for spacing.\n.panel-title {\n margin-top: 0;\n margin-bottom: 0;\n font-size: (@font-size-base * 1.25);\n font-weight: 500;\n > a {\n color: inherit;\n }\n}\n\n// Optional footer (stays gray in every modifier class)\n.panel-footer {\n margin: 15px -15px -15px;\n padding: 10px 15px;\n background-color: @panel-footer-bg;\n border-top: 1px solid @panel-border;\n border-bottom-left-radius: (@panel-border-radius - 1);\n border-bottom-right-radius: (@panel-border-radius - 1);\n}\n\n// Contextual variations\n.panel-primary {\n .panel-variant(@panel-primary-border; @panel-primary-text; @panel-primary-heading-bg; @panel-primary-border);\n}\n.panel-success {\n .panel-variant(@panel-success-border; @panel-success-text; @panel-success-heading-bg; @panel-success-border);\n}\n.panel-warning {\n .panel-variant(@panel-warning-border; @panel-warning-text; @panel-warning-heading-bg; @panel-warning-border);\n}\n.panel-danger {\n .panel-variant(@panel-danger-border; @panel-danger-text; @panel-danger-heading-bg; @panel-danger-border);\n}\n.panel-info {\n .panel-variant(@panel-info-border; @panel-info-text; @panel-info-heading-bg; @panel-info-border);\n}\n","popovers.less":"//\n// Popovers\n// --------------------------------------------------\n\n\n.popover {\n position: absolute;\n top: 0;\n left: 0;\n z-index: @zindex-popover;\n display: none;\n max-width: @popover-max-width;\n padding: 1px;\n text-align: left; // Reset given new insertion method\n background-color: @popover-bg;\n -webkit-bg-clip: padding-box;\n -moz-bg-clip: padding;\n background-clip: padding-box;\n border: 1px solid @popover-fallback-border-color;\n border: 1px solid @popover-border-color;\n border-radius: @border-radius-large;\n .box-shadow(0 5px 10px rgba(0,0,0,.2));\n\n // Overrides for proper insertion\n white-space: normal;\n\n // Offset the popover to account for the popover arrow\n &.top { margin-top: -10px; }\n &.right { margin-left: 10px; }\n &.bottom { margin-top: 10px; }\n &.left { margin-left: -10px; }\n}\n\n.popover-title {\n margin: 0; // reset heading margin\n padding: 8px 14px;\n font-size: @font-size-base;\n font-weight: normal;\n line-height: 18px;\n background-color: @popover-title-bg;\n border-bottom: 1px solid darken(@popover-title-bg, 5%);\n border-radius: 5px 5px 0 0;\n}\n\n.popover-content {\n padding: 9px 14px;\n}\n\n// Arrows\n//\n// .arrow is outer, .arrow:after is inner\n\n.popover .arrow {\n &,\n &:after {\n position: absolute;\n display: block;\n width: 0;\n height: 0;\n border-color: transparent;\n border-style: solid;\n }\n}\n.popover .arrow {\n border-width: @popover-arrow-outer-width;\n}\n.popover .arrow:after {\n border-width: @popover-arrow-width;\n content: \"\";\n}\n\n.popover {\n &.top .arrow {\n left: 50%;\n margin-left: -@popover-arrow-outer-width;\n border-bottom-width: 0;\n border-top-color: @popover-arrow-outer-fallback-color; // IE8 fallback\n border-top-color: @popover-arrow-outer-color;\n bottom: -@popover-arrow-outer-width;\n &:after {\n content: \" \";\n bottom: 1px;\n margin-left: -@popover-arrow-width;\n border-bottom-width: 0;\n border-top-color: @popover-arrow-color;\n }\n }\n &.right .arrow {\n top: 50%;\n left: -@popover-arrow-outer-width;\n margin-top: -@popover-arrow-outer-width;\n border-left-width: 0;\n border-right-color: @popover-arrow-outer-fallback-color; // IE8 fallback\n border-right-color: @popover-arrow-outer-color;\n &:after {\n content: \" \";\n left: 1px;\n bottom: -@popover-arrow-width;\n border-left-width: 0;\n border-right-color: @popover-arrow-color;\n }\n }\n &.bottom .arrow {\n left: 50%;\n margin-left: -@popover-arrow-outer-width;\n border-top-width: 0;\n border-bottom-color: @popover-arrow-outer-fallback-color; // IE8 fallback\n border-bottom-color: @popover-arrow-outer-color;\n top: -@popover-arrow-outer-width;\n &:after {\n content: \" \";\n top: 1px;\n margin-left: -@popover-arrow-width;\n border-top-width: 0;\n border-bottom-color: @popover-arrow-color;\n }\n }\n\n &.left .arrow {\n top: 50%;\n right: -@popover-arrow-outer-width;\n margin-top: -@popover-arrow-outer-width;\n border-right-width: 0;\n border-left-color: @popover-arrow-outer-fallback-color; // IE8 fallback\n border-left-color: @popover-arrow-outer-color;\n &:after {\n content: \" \";\n right: 1px;\n border-right-width: 0;\n border-left-color: @popover-arrow-color;\n bottom: -@popover-arrow-width;\n }\n }\n\n}\n","print.less":"//\n// Basic print styles\n// --------------------------------------------------\n// Source: https://github.com/h5bp/html5-boilerplate/blob/master/css/main.css\n\n@media print {\n\n * {\n text-shadow: none !important;\n color: #000 !important; // Black prints faster: h5bp.com/s\n background: transparent !important;\n box-shadow: none !important;\n }\n\n a,\n a:visited {\n text-decoration: underline;\n }\n\n a[href]:after {\n content: \" (\" attr(href) \")\";\n }\n\n abbr[title]:after {\n content: \" (\" attr(title) \")\";\n }\n\n // Don't show links for images, or javascript/internal links\n .ir a:after,\n a[href^=\"javascript:\"]:after,\n a[href^=\"#\"]:after {\n content: \"\";\n }\n\n pre,\n blockquote {\n border: 1px solid #999;\n page-break-inside: avoid;\n }\n\n thead {\n display: table-header-group; // h5bp.com/t\n }\n\n tr,\n img {\n page-break-inside: avoid;\n }\n\n img {\n max-width: 100% !important;\n }\n\n @page {\n margin: 2cm .5cm;\n }\n\n p,\n h2,\n h3 {\n orphans: 3;\n widows: 3;\n }\n\n h2,\n h3 {\n page-break-after: avoid;\n }\n\n // Bootstrap components\n .navbar {\n display: none;\n }\n .table {\n td,\n th {\n background-color: #fff !important;\n }\n }\n .btn,\n .dropup > .btn {\n > .caret {\n border-top-color: #000 !important;\n }\n }\n .label {\n border: 1px solid #000;\n }\n\n .table {\n border-collapse: collapse !important;\n }\n .table-bordered {\n th,\n td {\n border: 1px solid #ddd !important;\n }\n }\n\n}\n","progress-bars.less":"//\n// Progress bars\n// --------------------------------------------------\n\n\n// Bar animations\n// -------------------------\n\n// Webkit\n@-webkit-keyframes progress-bar-stripes {\n from { background-position: 40px 0; }\n to { background-position: 0 0; }\n}\n\n// Firefox\n@-moz-keyframes progress-bar-stripes {\n from { background-position: 40px 0; }\n to { background-position: 0 0; }\n}\n\n// Opera\n@-o-keyframes progress-bar-stripes {\n from { background-position: 0 0; }\n to { background-position: 40px 0; }\n}\n\n// Spec and IE10+\n@keyframes progress-bar-stripes {\n from { background-position: 40px 0; }\n to { background-position: 0 0; }\n}\n\n\n\n// Bar itself\n// -------------------------\n\n// Outer container\n.progress {\n overflow: hidden;\n height: @line-height-computed;\n margin-bottom: @line-height-computed;\n background-color: @progress-bg;\n border-radius: @border-radius-base;\n .box-shadow(inset 0 1px 2px rgba(0,0,0,.1));\n}\n\n// Bar of progress\n.progress-bar {\n float: left;\n width: 0%;\n height: 100%;\n font-size: @font-size-small;\n color: @progress-bar-color;\n text-align: center;\n background-color: @progress-bar-bg;\n .box-shadow(inset 0 -1px 0 rgba(0,0,0,.15));\n .transition(width .6s ease);\n}\n\n// Striped bars\n.progress-striped .progress-bar {\n #gradient > .striped(@progress-bar-bg);\n .background-size(40px 40px);\n}\n\n// Call animation for the active one\n.progress.active .progress-bar {\n -webkit-animation: progress-bar-stripes 2s linear infinite;\n -moz-animation: progress-bar-stripes 2s linear infinite;\n -ms-animation: progress-bar-stripes 2s linear infinite;\n -o-animation: progress-bar-stripes 2s linear infinite;\n animation: progress-bar-stripes 2s linear infinite;\n}\n\n\n\n// Variations\n// -------------------------\n\n// Danger (red)\n.progress-bar-danger {\n .progress-bar-variant(@progress-bar-danger-bg);\n}\n\n// Success (green)\n.progress-bar-success {\n .progress-bar-variant(@progress-bar-success-bg);\n}\n\n// Warning (orange)\n.progress-bar-warning {\n .progress-bar-variant(@progress-bar-warning-bg);\n}\n\n// Info (teal)\n.progress-bar-info {\n .progress-bar-variant(@progress-bar-info-bg);\n}\n","responsive-utilities.less":"//\n// Responsive: Utility classes\n// --------------------------------------------------\n\n\n// IE10 Metro responsive\n// Required for Windows 8 Metro split-screen snapping with IE10\n//\n// Source: http://timkadlec.com/2012/10/ie10-snap-mode-and-responsive-design/\n@-ms-viewport{\n width: device-width;\n}\n\n// IE10 on Windows Phone 8\n// IE10 on WP8 doesn't report CSS pixels, but actual device pixels. In\n// other words, say on a Lumia, you'll get 768px as the device width,\n// meaning users will see the tablet styles and not phone styles.\n//\n// Alternatively you can override this with JS (see source below), but\n// we won't be doing that here given our limited scope.\n//\n// Source: http://timkadlec.com/2013/01/windows-phone-8-and-device-width/\n@media screen and (max-width: 400px) {\n @-ms-viewport{\n width: 320px;\n }\n}\n\n// Hide from screenreaders and browsers\n// Credit: HTML5 Boilerplate\n.hidden {\n display: none !important;\n visibility: hidden !important;\n}\n\n// Visibility utilities\n\n// For Phones\n.visible-sm {\n .responsive-visibility();\n}\n.visible-md {\n .responsive-invisibility();\n}\n.visible-lg {\n .responsive-invisibility();\n}\n\n.hidden-sm {\n .responsive-invisibility();\n}\n.hidden-md {\n .responsive-visibility();\n}\n.hidden-lg {\n .responsive-visibility();\n}\n\n\n// Tablets & small desktops only\n@media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {\n .visible-sm {\n .responsive-invisibility();\n }\n .visible-md {\n .responsive-visibility();\n }\n .visible-lg {\n .responsive-invisibility();\n }\n\n .hidden-sm {\n .responsive-visibility();\n }\n .hidden-md {\n .responsive-invisibility();\n }\n .hidden-lg {\n .responsive-visibility();\n }\n}\n\n// For desktops\n@media (min-width: @screen-desktop) {\n .visible-sm {\n .responsive-invisibility();\n }\n .visible-md {\n .responsive-invisibility();\n }\n .visible-lg {\n .responsive-visibility();\n }\n\n .hidden-sm {\n .responsive-visibility();\n }\n .hidden-md {\n .responsive-visibility();\n }\n .hidden-lg {\n .responsive-invisibility();\n }\n}\n\n// Print utilities\n.visible-print {\n .responsive-invisibility();\n}\n.hidden-print { }\n\n@media print {\n .visible-print {\n .responsive-visibility();\n }\n .hidden-print {\n .responsive-invisibility();\n }\n}\n","scaffolding.less":"//\n// Scaffolding\n// --------------------------------------------------\n\n\n// Reset the box-sizing\n// -------------------------\n\n* {\n .box-sizing(border-box);\n}\n\n\n// Body reset\n// -------------------------\n\nhtml {\n font-size: 62.5%;\n -webkit-tap-highlight-color: rgba(0,0,0,0);\n}\n\nbody {\n font-family: @font-family-base;\n font-size: @font-size-base;\n line-height: @line-height-base;\n color: @text-color;\n background-color: @body-bg;\n}\n\n// Reset fonts for relevant elements\ninput,\nbutton,\nselect,\ntextarea {\n font-family: inherit;\n font-size: inherit;\n line-height: inherit;\n}\n\n\n// Links\n// -------------------------\n\na {\n color: @link-color;\n text-decoration: none;\n}\na:hover,\na:focus {\n color: @link-hover-color;\n text-decoration: underline;\n}\na:focus {\n .tab-focus();\n}\n\n\n// Images\n// -------------------------\n\nimg {\n vertical-align: middle;\n}\n\n// Responsive images (ensure images don't scale beyond their parents)\n.img-responsive {\n display: inline-block;\n max-width: 100%; // Part 1: Set a maximum relative to the parent\n height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching\n}\n\n// Rounded corners\n.img-rounded {\n border-radius: @border-radius-large;\n}\n\n// Image thumbnails\n// See thumbnails.less for `.img-thumbnail`\n\n// Perfect circle\n.img-circle {\n border-radius: 500px; // crank the border-radius so it works with most reasonably sized images\n}\n\n\n// Horizontal rules\n// -------------------------\n\nhr {\n margin-top: @line-height-computed;\n margin-bottom: @line-height-computed;\n border: 0;\n border-top: 1px solid @hr-border;\n}\n\n// Only display content to screen readers\n// See: http://a11yproject.com/posts/how-to-hide-content/\n// -------------------------\n\n.sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n margin: -1px;\n padding: 0;\n overflow: hidden;\n clip: rect(0 0 0 0);\n border: 0;\n}\n","tables.less":"//\n// Tables\n// --------------------------------------------------\n\n\ntable {\n max-width: 100%;\n background-color: @table-bg;\n}\nth {\n text-align: left;\n}\n\n\n// Baseline styles\n// ---------------\n\n.table {\n width: 100%;\n margin-bottom: @line-height-computed;\n // Cells\n thead,\n tbody,\n tfoot {\n > tr {\n > th,\n > td {\n padding: @table-cell-padding;\n line-height: @line-height-base;\n vertical-align: top;\n border-top: 1px solid @table-border-color;\n }\n }\n }\n // Bottom align for column headings\n thead > tr > th {\n vertical-align: bottom;\n }\n // Remove top border from thead by default\n caption + thead,\n colgroup + thead,\n thead:first-child {\n tr:first-child {\n th, td {\n border-top: 0;\n }\n }\n }\n // Account for multiple tbody instances\n tbody + tbody {\n border-top: 2px solid @table-border-color;\n }\n\n // Nesting\n .table {\n background-color: @body-bg;\n }\n}\n\n\n\n// Condensed table w/ half padding\n// -------------------------------\n\n.table-condensed {\n thead,\n tbody,\n tfoot {\n > tr {\n > th,\n > td {\n padding: @table-condensed-cell-padding;\n }\n }\n }\n}\n\n\n\n// Bordered version\n// ----------------\n\n.table-bordered {\n border: 1px solid @table-border-color;\n > thead,\n > tbody,\n > tfoot {\n > tr {\n > th,\n > td {\n border: 1px solid @table-border-color;\n }\n }\n }\n}\n\n\n\n// Zebra-striping\n// --------------\n\n// Default zebra-stripe styles (alternating gray and transparent backgrounds)\n.table-striped {\n > tbody {\n > tr:nth-child(odd) {\n > td,\n > th {\n background-color: @table-bg-accent;\n }\n }\n }\n}\n\n\n\n// Hover effect\n// ------------\n\n// Placed here since it has to come after the potential zebra striping\n.table-hover {\n > tbody {\n > tr:hover {\n > td,\n > th {\n background-color: @table-bg-hover;\n }\n }\n }\n}\n\n\n\n// Table cell sizing\n// -----------------\n\n// Reset default table behavior\ntable col[class^=\"col-\"] {\n float: none;\n display: table-column;\n}\ntable {\n td,\n th {\n &[class^=\"col-\"] {\n float: none;\n display: table-cell;\n }\n }\n}\n\n\n\n// Table backgrounds\n// -----------------\n// Exact selectors below required to override `.table-striped` and prevent\n// inheritance to nested tables.\n\n.table > thead > tr,\n.table > tbody > tr,\n.table > tfoot > tr {\n > td.active,\n > th.active,\n &.active > td,\n &.active > th {\n background-color: @table-bg-active;\n }\n > td.success,\n > th.success,\n &.success > td,\n &.success > th {\n background-color: @state-success-bg;\n border-color: @state-success-border;\n }\n > td.danger,\n > th.danger,\n &.danger > td,\n &.danger > th {\n background-color: @state-danger-bg;\n border-color: @state-danger-border;\n }\n > td.warning,\n > th.warning,\n &.warning > td,\n &.warning > th {\n background-color: @state-warning-bg;\n border-color: @state-warning-border;\n }\n}\n\n// Hover states for `.table-hover`\n// Note: this is not available for cells or rows within `thead` or `tfoot`.\n.table-hover > tbody > tr {\n > td.success:hover,\n > th.success:hover,\n &.success:hover > td {\n background-color: darken(@state-success-bg, 5%);\n border-color: darken(@state-success-border, 5%);\n }\n > td.danger:hover,\n > th.danger:hover,\n &.danger:hover > td {\n background-color: darken(@state-danger-bg, 5%);\n border-color: darken(@state-danger-border, 5%);\n }\n > td.warning:hover,\n > th.warning:hover,\n &.warning:hover > td {\n background-color: darken(@state-warning-bg, 5%);\n border-color: darken(@state-warning-border, 5%);\n }\n}\n","thumbnails.less":"//\n// Thumbnails\n// --------------------------------------------------\n\n\n// Base classes\n// For thumbnail block-level composite components and simple image styles\n\n// The actual thumbnailed element\n// Can be `a`, `div`, or `img`\n.thumbnail,\n.img-thumbnail {\n padding: 4px;\n line-height: @line-height-base;\n background-color: @thumbnail-bg;\n border: 1px solid @thumbnail-border;\n border-radius: @thumbnail-border-radius;\n .transition(all .2s ease-in-out);\n}\n.thumbnail {\n display: block;\n}\n.thumbnail > img,\n.img-thumbnail {\n .img-responsive();\n}\n\n// Add a hover state for linked versions only\na.thumbnail:hover,\na.thumbnail:focus {\n border-color: @link-color;\n}\n\n// Images and captions\n.thumbnail > img {\n margin-left: auto;\n margin-right: auto;\n}\n.thumbnail .caption {\n padding: 9px;\n color: @thumbnail-caption-color;\n}\n","tooltip.less":"//\n// Tooltips\n// --------------------------------------------------\n\n\n// Base class\n.tooltip {\n position: absolute;\n z-index: @zindex-tooltip;\n display: block;\n visibility: visible;\n font-size: @font-size-small;\n line-height: 1.4;\n .opacity(0);\n\n &.in { .opacity(.9); }\n &.top { margin-top: -3px; padding: 5px 0; }\n &.right { margin-left: 3px; padding: 0 5px; }\n &.bottom { margin-top: 3px; padding: 5px 0; }\n &.left { margin-left: -3px; padding: 0 5px; }\n}\n\n// Wrapper for the tooltip content\n.tooltip-inner {\n max-width: @tooltip-max-width;\n padding: 3px 8px;\n color: @tooltip-color;\n text-align: center;\n text-decoration: none;\n background-color: @tooltip-bg;\n border-radius: @border-radius-base;\n}\n\n// Arrows\n.tooltip-arrow {\n position: absolute;\n width: 0;\n height: 0;\n border-color: transparent;\n border-style: solid;\n}\n.tooltip {\n &.top .tooltip-arrow {\n bottom: 0;\n left: 50%;\n margin-left: -@tooltip-arrow-width;\n border-width: @tooltip-arrow-width @tooltip-arrow-width 0;\n border-top-color: @tooltip-arrow-color;\n }\n &.top-left .tooltip-arrow {\n bottom: 0;\n left: 5px;\n border-width: @tooltip-arrow-width @tooltip-arrow-width 0;\n border-top-color: @tooltip-arrow-color;\n }\n &.top-right .tooltip-arrow {\n bottom: 0;\n right: 5px;\n border-width: @tooltip-arrow-width @tooltip-arrow-width 0;\n border-top-color: @tooltip-arrow-color;\n }\n &.right .tooltip-arrow {\n top: 50%;\n left: 0;\n margin-top: -@tooltip-arrow-width;\n border-width: @tooltip-arrow-width @tooltip-arrow-width @tooltip-arrow-width 0;\n border-right-color: @tooltip-arrow-color;\n }\n &.left .tooltip-arrow {\n top: 50%;\n right: 0;\n margin-top: -@tooltip-arrow-width;\n border-width: @tooltip-arrow-width 0 @tooltip-arrow-width @tooltip-arrow-width;\n border-left-color: @tooltip-arrow-color;\n }\n &.bottom .tooltip-arrow {\n top: 0;\n left: 50%;\n margin-left: -@tooltip-arrow-width;\n border-width: 0 @tooltip-arrow-width @tooltip-arrow-width;\n border-bottom-color: @tooltip-arrow-color;\n }\n &.bottom-left .tooltip-arrow {\n top: 0;\n left: 5px;\n border-width: 0 @tooltip-arrow-width @tooltip-arrow-width;\n border-bottom-color: @tooltip-arrow-color;\n }\n &.bottom-right .tooltip-arrow {\n top: 0;\n right: 5px;\n border-width: 0 @tooltip-arrow-width @tooltip-arrow-width;\n border-bottom-color: @tooltip-arrow-color;\n }\n}\n","type.less":"//\n// Typography\n// --------------------------------------------------\n\n\n// Body text\n// -------------------------\n\np {\n margin: 0 0 (@line-height-computed / 2);\n}\n.lead {\n margin-bottom: @line-height-computed;\n font-size: (@font-size-base * 1.15);\n font-weight: 200;\n line-height: 1.4;\n\n @media (min-width: 768px) {\n font-size: (@font-size-base * 1.5);\n }\n}\n\n\n// Emphasis & misc\n// -------------------------\n\n// Ex: 14px base font * 85% = about 12px\nsmall { font-size: 85%; }\n\n// Undo browser default styling\ncite { font-style: normal; }\n\n// Contextual emphasis\n.text-muted { color: @text-muted; }\n.text-primary { color: @brand-primary; }\n.text-warning { color: @state-warning-text; }\n.text-danger { color: @state-danger-text; }\n.text-success { color: @state-success-text; }\n.text-info { color: @state-info-text; }\n\n// Alignment\n.text-left { text-align: left; }\n.text-right { text-align: right; }\n.text-center { text-align: center; }\n\n\n// Headings\n// -------------------------\n\nh1, h2, h3, h4, h5, h6,\n.h1, .h2, .h3, .h4, .h5, .h6 {\n font-family: @headings-font-family;\n font-weight: @headings-font-weight;\n line-height: @headings-line-height;\n small {\n font-weight: normal;\n line-height: 1;\n color: @headings-small-color;\n }\n}\n\nh1,\nh2,\nh3 {\n margin-top: @line-height-computed;\n margin-bottom: (@line-height-computed / 2);\n}\nh4,\nh5,\nh6 {\n margin-top: (@line-height-computed / 2);\n margin-bottom: (@line-height-computed / 2);\n}\n\nh1, .h1 { font-size: ceil(@font-size-base * 2.70); } // ~38px\nh2, .h2 { font-size: ceil(@font-size-base * 2.25); } // ~32px\nh3, .h3 { font-size: ceil(@font-size-base * 1.70); } // ~24px\nh4, .h4 { font-size: ceil(@font-size-base * 1.25); } // ~18px\nh5, .h5 { font-size: @font-size-base; }\nh6, .h6 { font-size: ceil(@font-size-base * 0.85); } // ~12px\n\nh1 small, .h1 small { font-size: ceil(@font-size-base * 1.70); } // ~24px\nh2 small, .h2 small { font-size: ceil(@font-size-base * 1.25); } // ~18px\nh3 small, .h3 small,\nh4 small, .h4 small { font-size: @font-size-base; }\n\n\n// Page header\n// -------------------------\n\n.page-header {\n padding-bottom: ((@line-height-computed / 2) - 1);\n margin: (@line-height-computed * 2) 0 @line-height-computed;\n border-bottom: 1px solid @page-header-border-color;\n}\n\n\n\n// Lists\n// --------------------------------------------------\n\n// Unordered and Ordered lists\nul,\nol {\n margin-top: 0;\n margin-bottom: (@line-height-computed / 2);\n ul,\n ol{\n margin-bottom: 0;\n }\n}\n\n// List options\n\n// Unstyled keeps list items block level, just removes default browser padding and list-style\n.list-unstyled {\n padding-left: 0;\n list-style: none;\n}\n// Inline turns list items into inline-block\n.list-inline {\n .list-unstyled();\n > li {\n display: inline-block;\n padding-left: 5px;\n padding-right: 5px;\n }\n}\n\n// Description Lists\ndl {\n margin-bottom: @line-height-computed;\n}\ndt,\ndd {\n line-height: @line-height-base;\n}\ndt {\n font-weight: bold;\n}\ndd {\n margin-left: 0; // Undo browser default\n}\n\n// Horizontal description lists\n//\n// Defaults to being stacked without any of the below styles applied, until the\n// grid breakpoint is reached (default of ~768px).\n\n@media (min-width: @grid-float-breakpoint) {\n .dl-horizontal {\n dt {\n float: left;\n width: (@component-offset-horizontal - 20);\n clear: left;\n text-align: right;\n .text-overflow();\n }\n dd {\n margin-left: @component-offset-horizontal;\n .clearfix(); // Clear the floated `dt` if an empty `dd` is present\n }\n }\n}\n\n// MISC\n// ----\n\n// Abbreviations and acronyms\nabbr[title],\n// Added data-* attribute to help out our tooltip plugin, per https://github.com/twbs/bootstrap/issues/5257\nabbr[data-original-title] {\n cursor: help;\n border-bottom: 1px dotted @abbr-border-color;\n}\nabbr.initialism {\n font-size: 90%;\n text-transform: uppercase;\n}\n\n// Blockquotes\nblockquote {\n padding: (@line-height-computed / 2) @line-height-computed;\n margin: 0 0 @line-height-computed;\n border-left: 5px solid @blockquote-border-color;\n p {\n font-size: (@font-size-base * 1.25);\n font-weight: 300;\n line-height: 1.25;\n }\n p:last-child {\n margin-bottom: 0;\n }\n small {\n display: block;\n line-height: @line-height-base;\n color: @blockquote-small-color;\n &:before {\n content: '\\2014 \\00A0';// EM DASH, NBSP\n }\n }\n\n // Float right with text-align: right\n &.pull-right {\n padding-right: 15px;\n padding-left: 0;\n border-right: 5px solid @blockquote-border-color;\n border-left: 0;\n p,\n small {\n text-align: right;\n }\n small {\n &:before {\n content: '';\n }\n &:after {\n content: '\\00A0 \\2014';// NBSP, EM DASH\n }\n }\n }\n}\n\n// Quotes\nq:before,\nq:after,\nblockquote:before,\nblockquote:after {\n content: \"\";\n}\n\n// Addresses\naddress {\n display: block;\n margin-bottom: @line-height-computed;\n font-style: normal;\n line-height: @line-height-base;\n}\n","utilities.less":"//\n// Utility classes\n// --------------------------------------------------\n\n\n// Floats\n// -------------------------\n\n.clearfix {\n .clearfix();\n}\n.pull-right {\n float: right !important;\n}\n.pull-left {\n float: left !important;\n}\n\n\n// Toggling content\n// -------------------------\n\n.hide {\n display: none !important;\n}\n.show {\n display: block !important;\n}\n.invisible {\n visibility: hidden;\n}\n.text-hide {\n .hide-text();\n}\n\n\n// For Affix plugin\n// -------------------------\n\n.affix {\n position: fixed;\n}\n","variables.less":"//\n// Variables\n// --------------------------------------------------\n\n\n// Global values\n// --------------------------------------------------\n\n// Grays\n// -------------------------\n\n@gray-darker: lighten(#000, 13.5%); // #222\n@gray-dark: lighten(#000, 20%); // #333\n@gray: lighten(#000, 33.5%); // #555\n@gray-light: lighten(#000, 60%); // #999\n@gray-lighter: lighten(#000, 93.5%); // #eee\n\n// Brand colors\n// -------------------------\n\n@brand-primary: #428bca;\n@brand-success: #5cb85c;\n@brand-warning: #f0ad4e;\n@brand-danger: #d9534f;\n@brand-info: #5bc0de;\n\n// Scaffolding\n// -------------------------\n\n@body-bg: #fff;\n@text-color: @gray-dark;\n\n// Links\n// -------------------------\n\n@link-color: @brand-primary;\n@link-hover-color: darken(@link-color, 15%);\n\n// Typography\n// -------------------------\n\n@font-family-sans-serif: \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n@font-family-serif: Georgia, \"Times New Roman\", Times, serif;\n@font-family-monospace: Monaco, Menlo, Consolas, \"Courier New\", monospace;\n@font-family-base: @font-family-sans-serif;\n\n@font-size-base: 14px;\n@font-size-large: ceil(@font-size-base * 1.25); // ~18px\n@font-size-small: ceil(@font-size-base * 0.85); // ~12px\n\n@line-height-base: 1.428571429; // 20/14\n@line-height-computed: floor(@font-size-base * @line-height-base); // ~20px\n\n@headings-font-family: @font-family-base;\n@headings-font-weight: 500;\n@headings-line-height: 1.1;\n\n\n// Components\n// -------------------------\n// Based on 14px font-size and 1.428 line-height (~20px to start)\n\n@padding-base-vertical: 6px;\n@padding-base-horizontal: 12px;\n\n@padding-large-vertical: 10px;\n@padding-large-horizontal: 16px;\n\n@padding-small-vertical: 5px;\n@padding-small-horizontal: 10px;\n\n@line-height-large: 1.33;\n@line-height-small: 1.5;\n\n@border-radius-base: 4px;\n@border-radius-large: 6px;\n@border-radius-small: 3px;\n\n@component-active-bg: @brand-primary;\n\n@caret-width-base: 4px;\n@caret-width-large: 5px;\n\n// Tables\n// -------------------------\n\n@table-cell-padding: 8px;\n@table-condensed-cell-padding: 5px;\n\n@table-bg: transparent; // overall background-color\n@table-bg-accent: #f9f9f9; // for striping\n@table-bg-hover: #f5f5f5;\n@table-bg-active: @table-bg-hover;\n\n@table-border-color: #ddd; // table and cell border\n\n\n// Buttons\n// -------------------------\n\n@btn-font-weight: bold;\n\n@btn-default-color: #333;\n@btn-default-bg: #fff;\n@btn-default-border: #ccc;\n\n@btn-primary-color: #fff;\n@btn-primary-bg: @brand-primary;\n@btn-primary-border: darken(@btn-primary-bg, 5%);\n\n@btn-success-color: #fff;\n@btn-success-bg: @brand-success;\n@btn-success-border: darken(@btn-success-bg, 5%);\n\n@btn-warning-color: #fff;\n@btn-warning-bg: @brand-warning;\n@btn-warning-border: darken(@btn-warning-bg, 5%);\n\n@btn-danger-color: #fff;\n@btn-danger-bg: @brand-danger;\n@btn-danger-border: darken(@btn-danger-bg, 5%);\n\n@btn-info-color: #fff;\n@btn-info-bg: @brand-info;\n@btn-info-border: darken(@btn-info-bg, 5%);\n\n@btn-link-disabled-color: @gray-light;\n\n\n// Forms\n// -------------------------\n\n@input-bg: #fff;\n@input-bg-disabled: @gray-lighter;\n\n@input-border: #ccc;\n@input-border-radius: @border-radius-base;\n@input-border-focus: #66afe9;\n\n@input-color-placeholder: @gray-light;\n\n@input-height-base: (@line-height-computed + (@padding-base-vertical * 2) + 2);\n@input-height-large: (floor(@font-size-large * @line-height-large) + (@padding-large-vertical * 2) + 2);\n@input-height-small: (floor(@font-size-small * @line-height-small) + (@padding-small-vertical * 2) + 2);\n\n@legend-border-color: #e5e5e5;\n\n@input-group-addon-border-color: @input-border;\n\n\n// Dropdowns\n// -------------------------\n\n@dropdown-bg: #fff;\n@dropdown-border: rgba(0,0,0,.15);\n@dropdown-fallback-border: #ccc;\n@dropdown-divider-bg: #e5e5e5;\n\n@dropdown-link-active-color: #fff;\n@dropdown-link-active-bg: @component-active-bg;\n\n@dropdown-link-color: @gray-dark;\n@dropdown-link-hover-color: #fff;\n@dropdown-link-hover-bg: @dropdown-link-active-bg;\n\n@dropdown-caret-color: #000;\n\n\n// COMPONENT VARIABLES\n// --------------------------------------------------\n\n\n// Z-index master list\n// -------------------------\n// Used for a bird's eye view of components dependent on the z-axis\n// Try to avoid customizing these :)\n\n@zindex-dropdown: 1000;\n@zindex-popover: 1010;\n@zindex-tooltip: 1030;\n@zindex-navbar-fixed: 1030;\n@zindex-modal-background: 1040;\n@zindex-modal: 1050;\n\n// Media queries breakpoints\n// --------------------------------------------------\n\n// Extra small screen / phone\n@screen-xsmall: 480px;\n@screen-phone: @screen-xsmall;\n\n// Small screen / tablet\n@screen-small: 768px;\n@screen-tablet: @screen-small;\n\n// Medium screen / desktop\n@screen-medium: 992px;\n@screen-desktop: @screen-medium;\n\n// Large screen / wide desktop\n@screen-large: 1200px;\n@screen-large-desktop: @screen-large;\n\n// So media queries don't overlap when required, provide a maximum\n@screen-small-max: (@screen-medium - 1);\n@screen-tablet-max: (@screen-desktop - 1);\n@screen-desktop-max: (@screen-large-desktop - 1);\n\n\n// Grid system\n// --------------------------------------------------\n\n// Number of columns in the grid system\n@grid-columns: 12;\n// Padding, to be divided by two and applied to the left and right of all columns\n@grid-gutter-width: 30px;\n// Point at which the navbar stops collapsing\n@grid-float-breakpoint: @screen-tablet;\n\n\n// Navbar\n// -------------------------\n\n// Basics of a navbar\n@navbar-height: 50px;\n@navbar-color: #777;\n@navbar-bg: #eee;\n@navbar-border-radius: @border-radius-base;\n@navbar-padding-horizontal: floor(@grid-gutter-width / 2); // ~15px\n@navbar-padding-vertical: ((@navbar-height - @line-height-computed) / 2);\n\n// Navbar links\n@navbar-link-color: #777;\n@navbar-link-hover-color: #333;\n@navbar-link-hover-bg: transparent;\n@navbar-link-active-color: #555;\n@navbar-link-active-bg: darken(@navbar-bg, 10%);\n@navbar-link-disabled-color: #ccc;\n@navbar-link-disabled-bg: transparent;\n\n// Navbar brand label\n@navbar-brand-color: @navbar-link-color;\n@navbar-brand-hover-color: darken(@navbar-link-color, 10%);\n@navbar-brand-hover-bg: transparent;\n\n// Navbar toggle\n@navbar-toggle-hover-bg: #ddd;\n@navbar-toggle-icon-bar-bg: #ccc;\n@navbar-toggle-border-color: #ddd;\n\n\n// Inverted navbar\n//\n// Reset inverted navbar basics\n@navbar-inverse-color: @gray-light;\n@navbar-inverse-bg: #222;\n\n// Inverted navbar links\n@navbar-inverse-link-color: @gray-light;\n@navbar-inverse-link-hover-color: #fff;\n@navbar-inverse-link-hover-bg: transparent;\n@navbar-inverse-link-active-color: @navbar-inverse-link-hover-color;\n@navbar-inverse-link-active-bg: darken(@navbar-inverse-bg, 10%);\n@navbar-inverse-link-disabled-color: #444;\n@navbar-inverse-link-disabled-bg: transparent;\n\n// Inverted navbar brand label\n@navbar-inverse-brand-color: @navbar-inverse-link-color;\n@navbar-inverse-brand-hover-color: #fff;\n@navbar-inverse-brand-hover-bg: transparent;\n\n// Inverted navbar search\n// Normal navbar needs no special styles or vars\n@navbar-inverse-search-bg: lighten(@navbar-inverse-bg, 25%);\n@navbar-inverse-search-bg-focus: #fff;\n@navbar-inverse-search-border: @navbar-inverse-bg;\n@navbar-inverse-search-placeholder-color: #ccc;\n\n// Inverted navbar toggle\n@navbar-inverse-toggle-hover-bg: #333;\n@navbar-inverse-toggle-icon-bar-bg: #fff;\n@navbar-inverse-toggle-border-color: #333;\n\n\n// Navs\n// -------------------------\n\n@nav-link-hover-bg: @gray-lighter;\n\n@nav-disabled-link-color: @gray-light;\n@nav-disabled-link-hover-color: @gray-light;\n\n@nav-open-link-hover-color: #fff;\n@nav-open-caret-border-color: #fff;\n\n// Tabs\n@nav-tabs-border-color: #ddd;\n\n@nav-tabs-link-hover-border-color: @gray-lighter;\n\n@nav-tabs-active-link-hover-bg: @body-bg;\n@nav-tabs-active-link-hover-color: @gray;\n@nav-tabs-active-link-hover-border-color: #ddd;\n\n@nav-tabs-justified-link-border-color: #ddd;\n@nav-tabs-justified-active-link-border-color: @body-bg;\n\n// Pills\n@nav-pills-active-link-hover-bg: @component-active-bg;\n@nav-pills-active-link-hover-color: #fff;\n\n\n// Pagination\n// -------------------------\n\n@pagination-bg: #fff;\n@pagination-border: #ddd;\n@pagination-active-bg: #f5f5f5;\n@pagination-active-color: @gray-light;\n@pagination-disabled-color: @gray-light;\n\n// Pager\n// -------------------------\n\n@pager-border-radius: 15px;\n@pager-disabled-color: @gray-light;\n\n\n// Jumbotron\n// -------------------------\n\n@jumbotron-bg: @gray-lighter;\n@jumbotron-heading-color: inherit;\n@jumbotron-lead-color: inherit;\n\n\n// Form states and alerts\n// -------------------------\n\n@state-warning-text: #c09853;\n@state-warning-bg: #fcf8e3;\n@state-warning-border: darken(spin(@state-warning-bg, -10), 3%);\n\n@state-danger-text: #b94a48;\n@state-danger-bg: #f2dede;\n@state-danger-border: darken(spin(@state-danger-bg, -10), 3%);\n\n@state-success-text: #468847;\n@state-success-bg: #dff0d8;\n@state-success-border: darken(spin(@state-success-bg, -10), 5%);\n\n@state-info-text: #3a87ad;\n@state-info-bg: #d9edf7;\n@state-info-border: darken(spin(@state-info-bg, -10), 7%);\n\n\n// Tooltips\n// -------------------------\n@tooltip-max-width: 200px;\n@tooltip-color: #fff;\n@tooltip-bg: #000;\n\n@tooltip-arrow-width: 5px;\n@tooltip-arrow-color: @tooltip-bg;\n\n\n// Popovers\n// -------------------------\n@popover-bg: #fff;\n@popover-max-width: 276px;\n@popover-border-color: rgba(0,0,0,.2);\n@popover-fallback-border-color: #ccc;\n\n@popover-title-bg: darken(@popover-bg, 3%);\n\n@popover-arrow-width: 10px;\n@popover-arrow-color: #fff;\n\n@popover-arrow-outer-width: (@popover-arrow-width + 1);\n@popover-arrow-outer-color: rgba(0,0,0,.25);\n@popover-arrow-outer-fallback-color: #999;\n\n\n// Labels\n// -------------------------\n\n@label-default-bg: @gray-light;\n@label-success-bg: @brand-success;\n@label-info-bg: @brand-info;\n@label-warning-bg: @brand-warning;\n@label-danger-bg: @brand-danger;\n\n@label-color: #fff;\n@label-link-hover-color: #fff;\n\n\n// Modals\n// -------------------------\n@modal-inner-padding: 20px;\n\n@modal-title-padding: 15px;\n@modal-title-line-height: @line-height-base;\n\n@modal-content-bg: #fff;\n@modal-content-border-color: rgba(0,0,0,.2);\n@modal-content-fallback-border-color: #999;\n\n@modal-backdrop-bg: #000;\n@modal-header-border-color: #e5e5e5;\n@modal-footer-border-color: @modal-header-border-color;\n\n\n// Alerts\n// -------------------------\n@alert-padding: 15px;\n@alert-border-radius: @border-radius-base;\n@alert-link-font-weight: bold;\n\n@alert-bg: @state-warning-bg;\n@alert-text: @state-warning-text;\n@alert-border: @state-warning-border;\n\n@alert-success-bg: @state-success-bg;\n@alert-success-text: @state-success-text;\n@alert-success-border: @state-success-border;\n\n@alert-danger-bg: @state-danger-bg;\n@alert-danger-text: @state-danger-text;\n@alert-danger-border: @state-danger-border;\n\n@alert-info-bg: @state-info-bg;\n@alert-info-text: @state-info-text;\n@alert-info-border: @state-info-border;\n\n\n// Progress bars\n// -------------------------\n@progress-bg: #f5f5f5;\n@progress-bar-color: #fff;\n\n@progress-bar-bg: @brand-primary;\n@progress-bar-success-bg: @brand-success;\n@progress-bar-warning-bg: @brand-warning;\n@progress-bar-danger-bg: @brand-danger;\n@progress-bar-info-bg: @brand-info;\n\n\n// List group\n// -------------------------\n@list-group-bg: #fff;\n@list-group-border: #ddd;\n@list-group-border-radius: @border-radius-base;\n\n@list-group-hover-bg: #f5f5f5;\n@list-group-active-color: #fff;\n@list-group-active-bg: @component-active-bg;\n@list-group-active-border: @list-group-active-bg;\n\n@list-group-link-color: #555;\n@list-group-link-heading-color: #333;\n\n\n// Panels\n// -------------------------\n@panel-bg: #fff;\n@panel-border: #ddd;\n@panel-border-radius: @border-radius-base;\n@panel-heading-bg: #f5f5f5;\n@panel-footer-bg: #f5f5f5;\n\n@panel-primary-text: #fff;\n@panel-primary-border: @brand-primary;\n@panel-primary-heading-bg: @brand-primary;\n\n@panel-success-text: @state-success-text;\n@panel-success-border: @state-success-border;\n@panel-success-heading-bg: @state-success-bg;\n\n@panel-warning-text: @state-warning-text;\n@panel-warning-border: @state-warning-border;\n@panel-warning-heading-bg: @state-warning-bg;\n\n@panel-danger-text: @state-danger-text;\n@panel-danger-border: @state-danger-border;\n@panel-danger-heading-bg: @state-danger-bg;\n\n@panel-info-text: @state-info-text;\n@panel-info-border: @state-info-border;\n@panel-info-heading-bg: @state-info-bg;\n\n\n// Thumbnails\n// -------------------------\n@thumbnail-caption-color: @text-color;\n@thumbnail-bg: @body-bg;\n@thumbnail-border: #ddd;\n@thumbnail-border-radius: @border-radius-base;\n\n\n// Wells\n// -------------------------\n@well-bg: #f5f5f5;\n\n\n// Accordion\n// -------------------------\n@accordion-border-color: #e5e5e5;\n\n\n// Badges\n// -------------------------\n@badge-color: #fff;\n@badge-link-hover-color: #fff;\n@badge-bg: @gray-light;\n\n@badge-active-color: @link-color;\n@badge-active-bg: #fff;\n\n@badge-font-weight: bold;\n@badge-line-height: 1;\n@badge-border-radius: 10px;\n\n\n// Breadcrumbs\n// -------------------------\n@breadcrumb-bg: #f5f5f5;\n@breadcrumb-color: #ccc;\n@breadcrumb-active-color: @gray-light;\n\n\n// Carousel\n// ------------------------\n\n@carousel-text-shadow: 0 1px 2px rgba(0,0,0,.6);\n\n@carousel-control-color: #fff;\n@carousel-control-width: 15%;\n@carousel-control-opacity: .5;\n@carousel-control-font-size: 20px;\n\n@carousel-indicator-active-bg: #fff;\n@carousel-indicator-border-color: #fff;\n\n@carousel-caption-color: #fff;\n\n\n// Close\n// ------------------------\n@close-color: #000;\n@close-font-weight: bold;\n@close-text-shadow: 0 1px 0 #fff;\n\n\n// Code\n// ------------------------\n@code-color: #c7254e;\n@code-bg: #f9f2f4;\n\n@pre-bg: #f5f5f5;\n@pre-border-color: #ccc;\n\n// Type\n// ------------------------\n@text-muted: @gray-light;\n@abbr-border-color: @gray-light;\n@headings-small-color: @gray-light;\n@blockquote-small-color: @gray-light;\n@blockquote-border-color: @gray-lighter;\n@page-header-border-color: @gray-lighter;\n\n// Miscellaneous\n// -------------------------\n\n// Hr border color\n@hr-border: @gray-lighter;\n\n// Horizontal forms & lists\n@component-offset-horizontal: 180px;\n\n\n// Container sizes\n// --------------------------------------------------\n\n// Small screen / tablet\n@container-tablet: 728px;\n\n// Medium screen / desktop\n@container-desktop: 940px;\n\n// Large screen / wide desktop\n@container-large-desktop: 1170px;\n","wells.less":"//\n// Wells\n// --------------------------------------------------\n\n\n// Base class\n.well {\n min-height: 20px;\n padding: 19px;\n margin-bottom: 20px;\n background-color: @well-bg;\n border: 1px solid darken(@well-bg, 7%);\n border-radius: @border-radius-base;\n .box-shadow(inset 0 1px 1px rgba(0,0,0,.05));\n blockquote {\n border-color: #ddd;\n border-color: rgba(0,0,0,.15);\n }\n}\n\n// Sizes\n.well-lg {\n padding: 24px;\n border-radius: @border-radius-large;\n}\n.well-sm {\n padding: 9px;\n border-radius: @border-radius-small;\n}\n"}
+</script>
+<!-- /generated -->
}
}
-* {
+*,
+*:before,
+*:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
line-height: inherit;
}
+button,
+input,
+select[multiple],
+textarea {
+ background-image: none;
+}
+
a {
color: #428bca;
text-decoration: none;
}
.img-responsive {
- display: inline-block;
+ display: block;
height: auto;
max-width: 100%;
}
}
.img-circle {
- border-radius: 500px;
+ border-radius: 50%;
}
hr {
border-top: 1px solid #eeeeee;
}
+.sr-only {
+ position: absolute;
+ width: 1px;
+ height: 1px;
+ padding: 0;
+ margin: -1px;
+ overflow: hidden;
+ clip: rect(0 0 0 0);
+ border: 0;
+}
+
p {
margin: 0 0 10px;
}
margin-left: 0;
}
-.dl-horizontal dt {
- float: left;
- width: 160px;
- overflow: hidden;
- clear: left;
- text-align: right;
- text-overflow: ellipsis;
- white-space: nowrap;
-}
-
-.dl-horizontal dd {
- margin-left: 180px;
-}
-
-.dl-horizontal dd:before,
-.dl-horizontal dd:after {
- display: table;
- content: " ";
-}
-
-.dl-horizontal dd:after {
- clear: both;
-}
-
-.dl-horizontal dd:before,
-.dl-horizontal dd:after {
- display: table;
- content: " ";
-}
-
-.dl-horizontal dd:after {
- clear: both;
+@media (min-width: 768px) {
+ .dl-horizontal dt {
+ float: left;
+ width: 160px;
+ overflow: hidden;
+ clear: left;
+ text-align: right;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+ .dl-horizontal dd {
+ margin-left: 180px;
+ }
+ .dl-horizontal dd:before,
+ .dl-horizontal dd:after {
+ display: table;
+ content: " ";
+ }
+ .dl-horizontal dd:after {
+ clear: both;
+ }
+ .dl-horizontal dd:before,
+ .dl-horizontal dd:after {
+ display: table;
+ content: " ";
+ }
+ .dl-horizontal dd:after {
+ clear: both;
+ }
}
abbr[title],
}
blockquote.pull-right {
- float: right;
padding-right: 15px;
padding-left: 0;
border-right: 5px solid #eeeeee;
pre code {
padding: 0;
+ font-size: inherit;
color: inherit;
white-space: pre-wrap;
background-color: transparent;
}
@media (min-width: 768px) {
- .row {
+ .container .row {
margin-right: -15px;
margin-left: -15px;
}
margin-left: -15px;
}
-.col-1,
-.col-2,
-.col-3,
-.col-4,
-.col-5,
-.col-6,
-.col-7,
-.col-8,
-.col-9,
-.col-10,
-.col-11,
-.col-12,
+.col-xs-1,
+.col-xs-2,
+.col-xs-3,
+.col-xs-4,
+.col-xs-5,
+.col-xs-6,
+.col-xs-7,
+.col-xs-8,
+.col-xs-9,
+.col-xs-10,
+.col-xs-11,
+.col-xs-12,
.col-sm-1,
.col-sm-2,
.col-sm-3,
.col-sm-10,
.col-sm-11,
.col-sm-12,
+.col-md-1,
+.col-md-2,
+.col-md-3,
+.col-md-4,
+.col-md-5,
+.col-md-6,
+.col-md-7,
+.col-md-8,
+.col-md-9,
+.col-md-10,
+.col-md-11,
+.col-md-12,
.col-lg-1,
.col-lg-2,
.col-lg-3,
padding-left: 15px;
}
-.col-1,
-.col-2,
-.col-3,
-.col-4,
-.col-5,
-.col-6,
-.col-7,
-.col-8,
-.col-9,
-.col-10,
-.col-11,
-.col-12 {
+.col-xs-1,
+.col-xs-2,
+.col-xs-3,
+.col-xs-4,
+.col-xs-5,
+.col-xs-6,
+.col-xs-7,
+.col-xs-8,
+.col-xs-9,
+.col-xs-10,
+.col-xs-11 {
float: left;
}
-.col-1 {
+.col-xs-1 {
width: 8.333333333333332%;
}
-.col-2 {
+.col-xs-2 {
width: 16.666666666666664%;
}
-.col-3 {
+.col-xs-3 {
width: 25%;
}
-.col-4 {
+.col-xs-4 {
width: 33.33333333333333%;
}
-.col-5 {
+.col-xs-5 {
width: 41.66666666666667%;
}
-.col-6 {
+.col-xs-6 {
width: 50%;
}
-.col-7 {
+.col-xs-7 {
width: 58.333333333333336%;
}
-.col-8 {
+.col-xs-8 {
width: 66.66666666666666%;
}
-.col-9 {
+.col-xs-9 {
width: 75%;
}
-.col-10 {
+.col-xs-10 {
width: 83.33333333333334%;
}
-.col-11 {
+.col-xs-11 {
width: 91.66666666666666%;
}
-.col-12 {
+.col-xs-12 {
width: 100%;
}
@media (min-width: 768px) {
.container {
- max-width: 728px;
+ max-width: 720px;
}
.col-sm-1,
.col-sm-2,
.col-sm-8,
.col-sm-9,
.col-sm-10,
- .col-sm-11,
- .col-sm-12 {
+ .col-sm-11 {
float: left;
}
.col-sm-1 {
.col-sm-12 {
width: 100%;
}
- .col-push-1 {
+ .col-sm-push-1 {
left: 8.333333333333332%;
}
- .col-push-2 {
+ .col-sm-push-2 {
left: 16.666666666666664%;
}
- .col-push-3 {
+ .col-sm-push-3 {
left: 25%;
}
- .col-push-4 {
+ .col-sm-push-4 {
left: 33.33333333333333%;
}
- .col-push-5 {
+ .col-sm-push-5 {
left: 41.66666666666667%;
}
- .col-push-6 {
+ .col-sm-push-6 {
left: 50%;
}
- .col-push-7 {
+ .col-sm-push-7 {
left: 58.333333333333336%;
}
- .col-push-8 {
+ .col-sm-push-8 {
left: 66.66666666666666%;
}
- .col-push-9 {
+ .col-sm-push-9 {
left: 75%;
}
- .col-push-10 {
+ .col-sm-push-10 {
left: 83.33333333333334%;
}
- .col-push-11 {
+ .col-sm-push-11 {
left: 91.66666666666666%;
}
- .col-pull-1 {
+ .col-sm-pull-1 {
right: 8.333333333333332%;
}
- .col-pull-2 {
+ .col-sm-pull-2 {
right: 16.666666666666664%;
}
- .col-pull-3 {
+ .col-sm-pull-3 {
right: 25%;
}
- .col-pull-4 {
+ .col-sm-pull-4 {
right: 33.33333333333333%;
}
- .col-pull-5 {
+ .col-sm-pull-5 {
right: 41.66666666666667%;
}
- .col-pull-6 {
+ .col-sm-pull-6 {
right: 50%;
}
- .col-pull-7 {
+ .col-sm-pull-7 {
right: 58.333333333333336%;
}
- .col-pull-8 {
+ .col-sm-pull-8 {
right: 66.66666666666666%;
}
- .col-pull-9 {
+ .col-sm-pull-9 {
right: 75%;
}
- .col-pull-10 {
+ .col-sm-pull-10 {
right: 83.33333333333334%;
}
- .col-pull-11 {
+ .col-sm-pull-11 {
right: 91.66666666666666%;
}
+ .col-sm-offset-1 {
+ margin-left: 8.333333333333332%;
+ }
+ .col-sm-offset-2 {
+ margin-left: 16.666666666666664%;
+ }
+ .col-sm-offset-3 {
+ margin-left: 25%;
+ }
+ .col-sm-offset-4 {
+ margin-left: 33.33333333333333%;
+ }
+ .col-sm-offset-5 {
+ margin-left: 41.66666666666667%;
+ }
+ .col-sm-offset-6 {
+ margin-left: 50%;
+ }
+ .col-sm-offset-7 {
+ margin-left: 58.333333333333336%;
+ }
+ .col-sm-offset-8 {
+ margin-left: 66.66666666666666%;
+ }
+ .col-sm-offset-9 {
+ margin-left: 75%;
+ }
+ .col-sm-offset-10 {
+ margin-left: 83.33333333333334%;
+ }
+ .col-sm-offset-11 {
+ margin-left: 91.66666666666666%;
+ }
}
@media (min-width: 992px) {
.container {
max-width: 940px;
}
+ .col-md-1,
+ .col-md-2,
+ .col-md-3,
+ .col-md-4,
+ .col-md-5,
+ .col-md-6,
+ .col-md-7,
+ .col-md-8,
+ .col-md-9,
+ .col-md-10,
+ .col-md-11 {
+ float: left;
+ }
+ .col-md-1 {
+ width: 8.333333333333332%;
+ }
+ .col-md-2 {
+ width: 16.666666666666664%;
+ }
+ .col-md-3 {
+ width: 25%;
+ }
+ .col-md-4 {
+ width: 33.33333333333333%;
+ }
+ .col-md-5 {
+ width: 41.66666666666667%;
+ }
+ .col-md-6 {
+ width: 50%;
+ }
+ .col-md-7 {
+ width: 58.333333333333336%;
+ }
+ .col-md-8 {
+ width: 66.66666666666666%;
+ }
+ .col-md-9 {
+ width: 75%;
+ }
+ .col-md-10 {
+ width: 83.33333333333334%;
+ }
+ .col-md-11 {
+ width: 91.66666666666666%;
+ }
+ .col-md-12 {
+ width: 100%;
+ }
+ .col-md-push-0 {
+ left: auto;
+ }
+ .col-md-push-1 {
+ left: 8.333333333333332%;
+ }
+ .col-md-push-2 {
+ left: 16.666666666666664%;
+ }
+ .col-md-push-3 {
+ left: 25%;
+ }
+ .col-md-push-4 {
+ left: 33.33333333333333%;
+ }
+ .col-md-push-5 {
+ left: 41.66666666666667%;
+ }
+ .col-md-push-6 {
+ left: 50%;
+ }
+ .col-md-push-7 {
+ left: 58.333333333333336%;
+ }
+ .col-md-push-8 {
+ left: 66.66666666666666%;
+ }
+ .col-md-push-9 {
+ left: 75%;
+ }
+ .col-md-push-10 {
+ left: 83.33333333333334%;
+ }
+ .col-md-push-11 {
+ left: 91.66666666666666%;
+ }
+ .col-md-pull-0 {
+ right: auto;
+ }
+ .col-md-pull-1 {
+ right: 8.333333333333332%;
+ }
+ .col-md-pull-2 {
+ right: 16.666666666666664%;
+ }
+ .col-md-pull-3 {
+ right: 25%;
+ }
+ .col-md-pull-4 {
+ right: 33.33333333333333%;
+ }
+ .col-md-pull-5 {
+ right: 41.66666666666667%;
+ }
+ .col-md-pull-6 {
+ right: 50%;
+ }
+ .col-md-pull-7 {
+ right: 58.333333333333336%;
+ }
+ .col-md-pull-8 {
+ right: 66.66666666666666%;
+ }
+ .col-md-pull-9 {
+ right: 75%;
+ }
+ .col-md-pull-10 {
+ right: 83.33333333333334%;
+ }
+ .col-md-pull-11 {
+ right: 91.66666666666666%;
+ }
+ .col-md-offset-0 {
+ margin-left: 0;
+ }
+ .col-md-offset-1 {
+ margin-left: 8.333333333333332%;
+ }
+ .col-md-offset-2 {
+ margin-left: 16.666666666666664%;
+ }
+ .col-md-offset-3 {
+ margin-left: 25%;
+ }
+ .col-md-offset-4 {
+ margin-left: 33.33333333333333%;
+ }
+ .col-md-offset-5 {
+ margin-left: 41.66666666666667%;
+ }
+ .col-md-offset-6 {
+ margin-left: 50%;
+ }
+ .col-md-offset-7 {
+ margin-left: 58.333333333333336%;
+ }
+ .col-md-offset-8 {
+ margin-left: 66.66666666666666%;
+ }
+ .col-md-offset-9 {
+ margin-left: 75%;
+ }
+ .col-md-offset-10 {
+ margin-left: 83.33333333333334%;
+ }
+ .col-md-offset-11 {
+ margin-left: 91.66666666666666%;
+ }
+}
+
+@media (min-width: 1200px) {
+ .container {
+ max-width: 1140px;
+ }
.col-lg-1,
.col-lg-2,
.col-lg-3,
.col-lg-8,
.col-lg-9,
.col-lg-10,
- .col-lg-11,
- .col-lg-12 {
+ .col-lg-11 {
float: left;
}
.col-lg-1 {
.col-lg-12 {
width: 100%;
}
- .col-offset-1 {
+ .col-lg-push-0 {
+ left: auto;
+ }
+ .col-lg-push-1 {
+ left: 8.333333333333332%;
+ }
+ .col-lg-push-2 {
+ left: 16.666666666666664%;
+ }
+ .col-lg-push-3 {
+ left: 25%;
+ }
+ .col-lg-push-4 {
+ left: 33.33333333333333%;
+ }
+ .col-lg-push-5 {
+ left: 41.66666666666667%;
+ }
+ .col-lg-push-6 {
+ left: 50%;
+ }
+ .col-lg-push-7 {
+ left: 58.333333333333336%;
+ }
+ .col-lg-push-8 {
+ left: 66.66666666666666%;
+ }
+ .col-lg-push-9 {
+ left: 75%;
+ }
+ .col-lg-push-10 {
+ left: 83.33333333333334%;
+ }
+ .col-lg-push-11 {
+ left: 91.66666666666666%;
+ }
+ .col-lg-pull-0 {
+ right: auto;
+ }
+ .col-lg-pull-1 {
+ right: 8.333333333333332%;
+ }
+ .col-lg-pull-2 {
+ right: 16.666666666666664%;
+ }
+ .col-lg-pull-3 {
+ right: 25%;
+ }
+ .col-lg-pull-4 {
+ right: 33.33333333333333%;
+ }
+ .col-lg-pull-5 {
+ right: 41.66666666666667%;
+ }
+ .col-lg-pull-6 {
+ right: 50%;
+ }
+ .col-lg-pull-7 {
+ right: 58.333333333333336%;
+ }
+ .col-lg-pull-8 {
+ right: 66.66666666666666%;
+ }
+ .col-lg-pull-9 {
+ right: 75%;
+ }
+ .col-lg-pull-10 {
+ right: 83.33333333333334%;
+ }
+ .col-lg-pull-11 {
+ right: 91.66666666666666%;
+ }
+ .col-lg-offset-0 {
+ margin-left: 0;
+ }
+ .col-lg-offset-1 {
margin-left: 8.333333333333332%;
}
- .col-offset-2 {
+ .col-lg-offset-2 {
margin-left: 16.666666666666664%;
}
- .col-offset-3 {
+ .col-lg-offset-3 {
margin-left: 25%;
}
- .col-offset-4 {
+ .col-lg-offset-4 {
margin-left: 33.33333333333333%;
}
- .col-offset-5 {
+ .col-lg-offset-5 {
margin-left: 41.66666666666667%;
}
- .col-offset-6 {
+ .col-lg-offset-6 {
margin-left: 50%;
}
- .col-offset-7 {
+ .col-lg-offset-7 {
margin-left: 58.333333333333336%;
}
- .col-offset-8 {
+ .col-lg-offset-8 {
margin-left: 66.66666666666666%;
}
- .col-offset-9 {
+ .col-lg-offset-9 {
margin-left: 75%;
}
- .col-offset-10 {
+ .col-lg-offset-10 {
margin-left: 83.33333333333334%;
}
- .col-offset-11 {
+ .col-lg-offset-11 {
margin-left: 91.66666666666666%;
}
}
-@media (min-width: 1200px) {
- .container {
- max-width: 1170px;
- }
-}
-
table {
max-width: 100%;
background-color: transparent;
border-color: #d6e9c6;
}
+.table-hover > tbody > tr > td.success:hover,
+.table-hover > tbody > tr > th.success:hover,
+.table-hover > tbody > tr.success:hover > td {
+ background-color: #d0e9c6;
+ border-color: #c9e2b3;
+}
+
.table > thead > tr > td.danger,
.table > tbody > tr > td.danger,
.table > tfoot > tr > td.danger,
border-color: #eed3d7;
}
+.table-hover > tbody > tr > td.danger:hover,
+.table-hover > tbody > tr > th.danger:hover,
+.table-hover > tbody > tr.danger:hover > td {
+ background-color: #ebcccc;
+ border-color: #e6c1c7;
+}
+
.table > thead > tr > td.warning,
.table > tbody > tr > td.warning,
.table > tfoot > tr > td.warning,
border-color: #fbeed5;
}
-.table-hover > tbody > tr > td.success:hover,
-.table-hover > tbody > tr > th.success:hover,
-.table-hover > tbody > tr.success:hover > td {
- background-color: #d0e9c6;
- border-color: #c9e2b3;
-}
-
-.table-hover > tbody > tr > td.danger:hover,
-.table-hover > tbody > tr > th.danger:hover,
-.table-hover > tbody > tr.danger:hover > td {
- background-color: #ebcccc;
- border-color: #e6c1c7;
-}
-
-.table-hover > tbody > tr > td.warning:hover,
-.table-hover > tbody > tr > th.warning:hover,
-.table-hover > tbody > tr.warning:hover > td {
- background-color: #faf2cc;
- border-color: #f8e5be;
+.table-hover > tbody > tr > td.warning:hover,
+.table-hover > tbody > tr > th.warning:hover,
+.table-hover > tbody > tr.warning:hover > td {
+ background-color: #faf2cc;
+ border-color: #f8e5be;
}
fieldset {
.form-control {
display: block;
width: 100%;
- height: 38px;
- padding: 8px 12px;
+ height: 34px;
+ padding: 6px 12px;
font-size: 14px;
line-height: 1.428571429;
color: #555555;
}
.form-control:focus {
- border-color: rgba(82, 168, 236, 0.8);
+ border-color: #66afe9;
outline: 0;
- -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
- box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
+ -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
+ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
}
.form-control[disabled],
margin-left: 10px;
}
-.form-control.input-large {
- height: 56px;
- padding: 14px 16px;
- font-size: 18px;
- border-radius: 6px;
+input[type="radio"][disabled],
+input[type="checkbox"][disabled],
+.radio[disabled],
+.radio-inline[disabled],
+.checkbox[disabled],
+.checkbox-inline[disabled],
+fieldset[disabled] input[type="radio"],
+fieldset[disabled] input[type="checkbox"],
+fieldset[disabled] .radio,
+fieldset[disabled] .radio-inline,
+fieldset[disabled] .checkbox,
+fieldset[disabled] .checkbox-inline {
+ cursor: not-allowed;
}
-.form-control.input-small {
+.input-sm {
height: 30px;
padding: 5px 10px;
font-size: 12px;
+ line-height: 1.5;
border-radius: 3px;
}
-select.input-large {
- height: 56px;
- line-height: 56px;
-}
-
-select.input-small {
+select.input-sm {
height: 30px;
line-height: 30px;
}
+textarea.input-sm {
+ height: auto;
+}
+
+.input-lg {
+ height: 45px;
+ padding: 10px 16px;
+ font-size: 18px;
+ line-height: 1.33;
+ border-radius: 6px;
+}
+
+select.input-lg {
+ height: 45px;
+ line-height: 45px;
+}
+
+textarea.input-lg {
+ height: auto;
+}
+
.has-warning .help-block,
.has-warning .control-label {
color: #c09853;
}
.has-warning .form-control {
- padding-right: 32px;
border-color: #c09853;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}
.has-error .form-control {
- padding-right: 32px;
border-color: #b94a48;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}
.has-success .form-control {
- padding-right: 32px;
border-color: #468847;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
border-color: #468847;
}
+.form-control-static {
+ padding-top: 6px;
+ margin-bottom: 0;
+}
+
.help-block {
display: block;
margin-top: 5px;
color: #737373;
}
-.input-group {
- display: table;
- border-collapse: separate;
-}
-
-.input-group.col {
- float: none;
- padding-right: 0;
- padding-left: 0;
-}
-
-.input-group .form-control {
- width: 100%;
- margin-bottom: 0;
-}
-
-.input-group-addon,
-.input-group-btn,
-.input-group .form-control {
- display: table-cell;
-}
-
-.input-group-addon:not(:first-child):not(:last-child),
-.input-group-btn:not(:first-child):not(:last-child),
-.input-group .form-control:not(:first-child):not(:last-child) {
- border-radius: 0;
-}
-
-.input-group-addon,
-.input-group-btn {
- width: 1%;
- white-space: nowrap;
- vertical-align: middle;
-}
-
-.input-group-addon {
- padding: 8px 12px;
- font-size: 14px;
- font-weight: normal;
- line-height: 1.428571429;
- text-align: center;
- background-color: #eeeeee;
- border: 1px solid #cccccc;
- border-radius: 4px;
- -webkit-box-sizing: border-box;
- -moz-box-sizing: border-box;
- box-sizing: border-box;
-}
-
-.input-group-addon.input-small {
- padding: 5px 10px;
- font-size: 12px;
- border-radius: 3px;
-}
-
-.input-group-addon.input-large {
- padding: 14px 16px;
- font-size: 18px;
- border-radius: 6px;
-}
-
-.input-group .form-control:first-child,
-.input-group-addon:first-child,
-.input-group-btn:first-child > .btn,
-.input-group-btn:first-child > .dropdown-toggle,
-.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle) {
- border-top-right-radius: 0;
- border-bottom-right-radius: 0;
-}
-
-.input-group-addon:first-child {
- border-right: 0;
-}
-
-.input-group .form-control:last-child,
-.input-group-addon:last-child,
-.input-group-btn:last-child > .btn,
-.input-group-btn:last-child > .dropdown-toggle,
-.input-group-btn:first-child > .btn:not(:first-child) {
- border-bottom-left-radius: 0;
- border-top-left-radius: 0;
-}
-
-.input-group-addon:last-child {
- border-left: 0;
-}
-
-.input-group-btn {
- position: relative;
- white-space: nowrap;
-}
-
-.input-group-btn > .btn {
- position: relative;
-}
-
-.input-group-btn > .btn + .btn {
- margin-left: -4px;
-}
-
-.input-group-btn > .btn:hover,
-.input-group-btn > .btn:active {
- z-index: 2;
-}
-
-.form-inline .form-control,
-.form-inline .radio,
-.form-inline .checkbox {
- display: inline-block;
-}
-
-.form-inline .radio,
-.form-inline .checkbox {
- margin-top: 0;
- margin-bottom: 0;
+@media (min-width: 768px) {
+ .form-inline .form-group {
+ display: inline-block;
+ margin-bottom: 0;
+ vertical-align: middle;
+ }
+ .form-inline .form-control {
+ display: inline-block;
+ }
+ .form-inline .radio,
+ .form-inline .checkbox {
+ display: inline-block;
+ padding-left: 0;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+ .form-inline .radio input[type="radio"],
+ .form-inline .checkbox input[type="checkbox"] {
+ float: none;
+ margin-left: 0;
+ }
}
-.form-horizontal .control-label {
+.form-horizontal .control-label,
+.form-horizontal .radio-inline,
+.form-horizontal .checkbox-inline {
padding-top: 6px;
}
}
@media (min-width: 768px) {
- .form-horizontal .form-group {
+ .container .form-horizontal .form-group {
margin-right: -15px;
margin-left: -15px;
}
.btn {
display: inline-block;
- padding: 8px 12px;
+ padding: 6px 12px;
margin-bottom: 0;
font-size: 14px;
- font-weight: 500;
+ font-weight: bold;
line-height: 1.428571429;
text-align: center;
white-space: nowrap;
cursor: pointer;
border: 1px solid transparent;
border-radius: 4px;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ -o-user-select: none;
+ user-select: none;
}
.btn:focus {
.btn:hover,
.btn:focus {
- color: #ffffff;
+ color: #333333;
text-decoration: none;
}
.btn:active,
.btn.active {
+ background-image: none;
outline: 0;
-webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
.btn[disabled],
fieldset[disabled] .btn {
pointer-events: none;
- cursor: default;
+ cursor: not-allowed;
opacity: 0.65;
filter: alpha(opacity=65);
-webkit-box-shadow: none;
}
.btn-default {
- color: #ffffff;
- background-color: #474949;
- border-color: #474949;
+ color: #333333;
+ background-color: #ffffff;
+ border-color: #cccccc;
}
.btn-default:hover,
.btn-default:focus,
.btn-default:active,
-.btn-default.active {
- background-color: #3a3c3c;
- border-color: #2e2f2f;
+.btn-default.active,
+.open .dropdown-toggle.btn-default {
+ color: #333333;
+ background-color: #ebebeb;
+ border-color: #adadad;
+}
+
+.btn-default:active,
+.btn-default.active,
+.open .dropdown-toggle.btn-default {
+ background-image: none;
}
.btn-default.disabled,
.btn-default.disabled.active,
.btn-default[disabled].active,
fieldset[disabled] .btn-default.active {
- background-color: #474949;
- border-color: #474949;
+ background-color: #ffffff;
+ border-color: #cccccc;
}
.btn-primary {
color: #ffffff;
background-color: #428bca;
- border-color: #428bca;
+ border-color: #357ebd;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
-.btn-primary.active {
- background-color: #357ebd;
- border-color: #3071a9;
+.btn-primary.active,
+.open .dropdown-toggle.btn-primary {
+ color: #ffffff;
+ background-color: #3276b1;
+ border-color: #285e8e;
+}
+
+.btn-primary:active,
+.btn-primary.active,
+.open .dropdown-toggle.btn-primary {
+ background-image: none;
}
.btn-primary.disabled,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active {
background-color: #428bca;
- border-color: #428bca;
+ border-color: #357ebd;
}
.btn-warning {
color: #ffffff;
background-color: #f0ad4e;
- border-color: #f0ad4e;
+ border-color: #eea236;
}
.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active,
-.btn-warning.active {
- background-color: #eea236;
- border-color: #ec971f;
+.btn-warning.active,
+.open .dropdown-toggle.btn-warning {
+ color: #ffffff;
+ background-color: #ed9c28;
+ border-color: #d58512;
+}
+
+.btn-warning:active,
+.btn-warning.active,
+.open .dropdown-toggle.btn-warning {
+ background-image: none;
}
.btn-warning.disabled,
.btn-warning[disabled].active,
fieldset[disabled] .btn-warning.active {
background-color: #f0ad4e;
- border-color: #f0ad4e;
+ border-color: #eea236;
}
.btn-danger {
color: #ffffff;
background-color: #d9534f;
- border-color: #d9534f;
+ border-color: #d43f3a;
}
.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active,
-.btn-danger.active {
- background-color: #d43f3a;
- border-color: #c9302c;
+.btn-danger.active,
+.open .dropdown-toggle.btn-danger {
+ color: #ffffff;
+ background-color: #d2322d;
+ border-color: #ac2925;
+}
+
+.btn-danger:active,
+.btn-danger.active,
+.open .dropdown-toggle.btn-danger {
+ background-image: none;
}
.btn-danger.disabled,
.btn-danger[disabled].active,
fieldset[disabled] .btn-danger.active {
background-color: #d9534f;
- border-color: #d9534f;
+ border-color: #d43f3a;
}
.btn-success {
color: #ffffff;
background-color: #5cb85c;
- border-color: #5cb85c;
+ border-color: #4cae4c;
}
.btn-success:hover,
.btn-success:focus,
.btn-success:active,
-.btn-success.active {
- background-color: #4cae4c;
- border-color: #449d44;
+.btn-success.active,
+.open .dropdown-toggle.btn-success {
+ color: #ffffff;
+ background-color: #47a447;
+ border-color: #398439;
+}
+
+.btn-success:active,
+.btn-success.active,
+.open .dropdown-toggle.btn-success {
+ background-image: none;
}
.btn-success.disabled,
.btn-success[disabled].active,
fieldset[disabled] .btn-success.active {
background-color: #5cb85c;
- border-color: #5cb85c;
+ border-color: #4cae4c;
}
.btn-info {
color: #ffffff;
background-color: #5bc0de;
- border-color: #5bc0de;
+ border-color: #46b8da;
}
.btn-info:hover,
.btn-info:focus,
.btn-info:active,
-.btn-info.active {
- background-color: #46b8da;
- border-color: #31b0d5;
+.btn-info.active,
+.open .dropdown-toggle.btn-info {
+ color: #ffffff;
+ background-color: #39b3d7;
+ border-color: #269abc;
+}
+
+.btn-info:active,
+.btn-info.active,
+.open .dropdown-toggle.btn-info {
+ background-image: none;
}
.btn-info.disabled,
.btn-info[disabled].active,
fieldset[disabled] .btn-info.active {
background-color: #5bc0de;
- border-color: #5bc0de;
+ border-color: #46b8da;
}
.btn-link {
fieldset[disabled] .btn-link:hover,
.btn-link[disabled]:focus,
fieldset[disabled] .btn-link:focus {
- color: #333333;
+ color: #999999;
text-decoration: none;
}
-.btn-large {
- padding: 14px 16px;
+.btn-lg {
+ padding: 10px 16px;
font-size: 18px;
+ line-height: 1.33;
border-radius: 6px;
}
-.btn-small {
+.btn-sm,
+.btn-xs {
padding: 5px 10px;
font-size: 12px;
line-height: 1.5;
border-radius: 3px;
}
+.btn-xs {
+ padding: 1px 5px;
+}
+
.btn-block {
display: block;
width: 100%;
transition: height 0.35s ease;
}
-.caret {
- display: inline-block;
- width: 0;
- height: 0;
- margin-left: 2px;
- vertical-align: middle;
- border-top: 4px solid #000000;
- border-right: 4px solid transparent;
- border-left: 4px solid transparent;
- content: "";
+.input-group {
+ position: relative;
+ display: table;
+ border-collapse: separate;
}
-.dropdown-menu {
- position: absolute;
- top: 100%;
- left: 0;
- z-index: 1000;
- display: none;
- float: left;
- min-width: 160px;
- padding: 5px 0;
- margin: 2px 0 0;
- list-style: none;
- background-color: #ffffff;
- border: 1px solid #cccccc;
- border: 1px solid rgba(0, 0, 0, 0.15);
- border-radius: 4px;
- -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
- box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
- background-clip: padding-box;
+.input-group.col {
+ float: none;
+ padding-right: 0;
+ padding-left: 0;
}
-.dropdown-menu.pull-right {
- right: 0;
- left: auto;
+.input-group .form-control {
+ width: 100%;
+ margin-bottom: 0;
}
-.dropdown-menu .divider {
- height: 1px;
- margin: 9px 0;
- overflow: hidden;
- background-color: #e5e5e5;
+.input-group-lg > .form-control,
+.input-group-lg > .input-group-addon,
+.input-group-lg > .input-group-btn > .btn {
+ height: 45px;
+ padding: 10px 16px;
+ font-size: 18px;
+ line-height: 1.33;
+ border-radius: 6px;
}
-.dropdown-menu > li > a {
- display: block;
- padding: 3px 20px;
- clear: both;
- font-weight: normal;
- line-height: 1.428571429;
- color: #333333;
- white-space: nowrap;
+select.input-group-lg > .form-control,
+select.input-group-lg > .input-group-addon,
+select.input-group-lg > .input-group-btn > .btn {
+ height: 45px;
+ line-height: 45px;
}
-.dropdown-menu > li > a:hover,
-.dropdown-menu > li > a:focus {
- color: #ffffff;
- text-decoration: none;
- background-color: #357ebd;
- background-image: -webkit-gradient(linear, left 0%, left 100%, from(#428bca), to(#357ebd));
- background-image: -webkit-linear-gradient(top, #428bca, 0%, #357ebd, 100%);
- background-image: -moz-linear-gradient(top, #428bca 0%, #357ebd 100%);
- background-image: linear-gradient(to bottom, #428bca 0%, #357ebd 100%);
- background-repeat: repeat-x;
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff357ebd', GradientType=0);
+textarea.input-group-lg > .form-control,
+textarea.input-group-lg > .input-group-addon,
+textarea.input-group-lg > .input-group-btn > .btn {
+ height: auto;
+}
+
+.input-group-sm > .form-control,
+.input-group-sm > .input-group-addon,
+.input-group-sm > .input-group-btn > .btn {
+ height: 30px;
+ padding: 5px 10px;
+ font-size: 12px;
+ line-height: 1.5;
+ border-radius: 3px;
+}
+
+select.input-group-sm > .form-control,
+select.input-group-sm > .input-group-addon,
+select.input-group-sm > .input-group-btn > .btn {
+ height: 30px;
+ line-height: 30px;
+}
+
+textarea.input-group-sm > .form-control,
+textarea.input-group-sm > .input-group-addon,
+textarea.input-group-sm > .input-group-btn > .btn {
+ height: auto;
+}
+
+.input-group-addon,
+.input-group-btn,
+.input-group .form-control {
+ display: table-cell;
+}
+
+.input-group-addon:not(:first-child):not(:last-child),
+.input-group-btn:not(:first-child):not(:last-child),
+.input-group .form-control:not(:first-child):not(:last-child) {
+ border-radius: 0;
+}
+
+.input-group-addon,
+.input-group-btn {
+ width: 1%;
+ white-space: nowrap;
+ vertical-align: middle;
+}
+
+.input-group-addon {
+ padding: 6px 12px;
+ font-size: 14px;
+ font-weight: normal;
+ line-height: 1;
+ text-align: center;
+ background-color: #eeeeee;
+ border: 1px solid #cccccc;
+ border-radius: 4px;
+}
+
+.input-group-addon.input-sm {
+ padding: 5px 10px;
+ font-size: 12px;
+ border-radius: 3px;
+}
+
+.input-group-addon.input-lg {
+ padding: 10px 16px;
+ font-size: 18px;
+ border-radius: 6px;
+}
+
+.input-group-addon input[type="radio"],
+.input-group-addon input[type="checkbox"] {
+ margin-top: 0;
+}
+
+.input-group .form-control:first-child,
+.input-group-addon:first-child,
+.input-group-btn:first-child > .btn,
+.input-group-btn:first-child > .dropdown-toggle,
+.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle) {
+ border-top-right-radius: 0;
+ border-bottom-right-radius: 0;
+}
+
+.input-group-addon:first-child {
+ border-right: 0;
+}
+
+.input-group .form-control:last-child,
+.input-group-addon:last-child,
+.input-group-btn:last-child > .btn,
+.input-group-btn:last-child > .dropdown-toggle,
+.input-group-btn:first-child > .btn:not(:first-child) {
+ border-bottom-left-radius: 0;
+ border-top-left-radius: 0;
+}
+
+.input-group-addon:last-child {
+ border-left: 0;
+}
+
+.input-group-btn {
+ position: relative;
+ white-space: nowrap;
+}
+
+.input-group-btn > .btn {
+ position: relative;
+}
+
+.input-group-btn > .btn + .btn {
+ margin-left: -4px;
+}
+
+.input-group-btn > .btn:hover,
+.input-group-btn > .btn:active {
+ z-index: 2;
+}
+
+.caret {
+ display: inline-block;
+ width: 0;
+ height: 0;
+ margin-left: 2px;
+ vertical-align: middle;
+ border-top: 4px solid #000000;
+ border-right: 4px solid transparent;
+ border-left: 4px solid transparent;
+ content: "";
+}
+
+.dropdown {
+ position: relative;
+}
+
+.dropdown-toggle:focus {
+ outline: 0;
+}
+
+.dropdown-menu {
+ position: absolute;
+ top: 100%;
+ left: 0;
+ z-index: 1000;
+ display: none;
+ float: left;
+ min-width: 160px;
+ padding: 5px 0;
+ margin: 2px 0 0;
+ font-size: 14px;
+ list-style: none;
+ background-color: #ffffff;
+ border: 1px solid #cccccc;
+ border: 1px solid rgba(0, 0, 0, 0.15);
+ border-radius: 4px;
+ -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
+ box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
+ background-clip: padding-box;
+}
+
+.dropdown-menu.pull-right {
+ right: 0;
+ left: auto;
+}
+
+.dropdown-menu .divider {
+ height: 1px;
+ margin: 9px 0;
+ overflow: hidden;
+ background-color: #e5e5e5;
+}
+
+.dropdown-menu > li > a {
+ display: block;
+ padding: 3px 20px;
+ clear: both;
+ font-weight: normal;
+ line-height: 1.428571429;
+ color: #333333;
+ white-space: nowrap;
+}
+
+.dropdown-menu > li > a:hover,
+.dropdown-menu > li > a:focus {
+ color: #ffffff;
+ text-decoration: none;
+ background-color: #428bca;
}
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:focus {
color: #ffffff;
text-decoration: none;
- background-color: #357ebd;
- background-image: -webkit-gradient(linear, left 0%, left 100%, from(#428bca), to(#357ebd));
- background-image: -webkit-linear-gradient(top, #428bca, 0%, #357ebd, 100%);
- background-image: -moz-linear-gradient(top, #428bca 0%, #357ebd 100%);
- background-image: linear-gradient(to bottom, #428bca 0%, #357ebd 100%);
- background-repeat: repeat-x;
+ background-color: #428bca;
outline: 0;
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff357ebd', GradientType=0);
}
.dropdown-menu > .disabled > a,
.list-group {
padding-left: 0;
margin-bottom: 20px;
- background-color: #ffffff;
}
.list-group-item {
position: relative;
display: block;
- padding: 10px 30px 10px 15px;
+ padding: 10px 15px;
margin-bottom: -1px;
+ background-color: #ffffff;
border: 1px solid #dddddd;
}
.list-group-item > .badge {
float: right;
- margin-right: -15px;
}
-.list-group-item-heading {
- margin-top: 0;
- margin-bottom: 5px;
+.list-group-item > .badge + .badge {
+ margin-right: 5px;
}
-.list-group-item-text {
- margin-bottom: 0;
- line-height: 1.3;
+a.list-group-item {
+ color: #555555;
}
a.list-group-item .list-group-item-heading {
color: #333333;
}
-a.list-group-item .list-group-item-text {
- color: #555555;
-}
-
a.list-group-item:hover,
a.list-group-item:focus {
text-decoration: none;
background-color: #f5f5f5;
}
-a.list-group-item.active {
+.list-group-item.active,
+.list-group-item.active:hover,
+.list-group-item.active:focus {
z-index: 2;
color: #ffffff;
background-color: #428bca;
border-color: #428bca;
}
-a.list-group-item.active .list-group-item-heading {
+.list-group-item.active .list-group-item-heading,
+.list-group-item.active:hover .list-group-item-heading,
+.list-group-item.active:focus .list-group-item-heading {
color: inherit;
}
-a.list-group-item.active .list-group-item-text {
+.list-group-item.active .list-group-item-text,
+.list-group-item.active:hover .list-group-item-text,
+.list-group-item.active:focus .list-group-item-text {
color: #e1edf7;
}
+.list-group-item-heading {
+ margin-top: 0;
+ margin-bottom: 5px;
+}
+
+.list-group-item-text {
+ margin-bottom: 0;
+ line-height: 1.3;
+}
+
.panel {
- padding: 15px;
margin-bottom: 20px;
background-color: #ffffff;
border: 1px solid #dddddd;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
}
+.panel-body {
+ padding: 15px;
+}
+
+.panel > .list-group {
+ margin-bottom: 0;
+}
+
+.panel > .list-group .list-group-item {
+ border-width: 1px 0;
+}
+
+.panel > .list-group .list-group-item:first-child {
+ border-top-right-radius: 0;
+ border-top-left-radius: 0;
+}
+
+.panel > .list-group .list-group-item:last-child {
+ border-bottom: 0;
+}
+
+.panel-heading + .list-group .list-group-item:first-child {
+ border-top-width: 0;
+}
+
.panel-heading {
padding: 10px 15px;
- margin: -15px -15px 15px;
background-color: #f5f5f5;
border-bottom: 1px solid #dddddd;
border-top-right-radius: 3px;
margin-top: 0;
margin-bottom: 0;
font-size: 17.5px;
- font-weight: 500;
+}
+
+.panel-title > a {
+ color: inherit;
}
.panel-footer {
padding: 10px 15px;
- margin: 15px -15px -15px;
background-color: #f5f5f5;
border-top: 1px solid #dddddd;
border-bottom-right-radius: 3px;
border-bottom-left-radius: 3px;
}
+.panel-group .panel {
+ margin-bottom: 0;
+ overflow: hidden;
+ border-radius: 4px;
+}
+
+.panel-group .panel + .panel {
+ margin-top: 5px;
+}
+
+.panel-group .panel-heading {
+ border-bottom: 0;
+}
+
+.panel-group .panel-heading + .panel-collapse .panel-body {
+ border-top: 1px solid #dddddd;
+}
+
+.panel-group .panel-footer {
+ border-top: 0;
+}
+
+.panel-group .panel-footer + .panel-collapse .panel-body {
+ border-bottom: 1px solid #dddddd;
+}
+
.panel-primary {
border-color: #428bca;
}
-.panel-primary .panel-heading {
+.panel-primary > .panel-heading {
color: #ffffff;
background-color: #428bca;
border-color: #428bca;
}
+.panel-primary > .panel-heading + .panel-collapse .panel-body {
+ border-top-color: #428bca;
+}
+
+.panel-primary > .panel-footer + .panel-collapse .panel-body {
+ border-bottom-color: #428bca;
+}
+
.panel-success {
border-color: #d6e9c6;
}
-.panel-success .panel-heading {
+.panel-success > .panel-heading {
color: #468847;
background-color: #dff0d8;
border-color: #d6e9c6;
}
+.panel-success > .panel-heading + .panel-collapse .panel-body {
+ border-top-color: #d6e9c6;
+}
+
+.panel-success > .panel-footer + .panel-collapse .panel-body {
+ border-bottom-color: #d6e9c6;
+}
+
.panel-warning {
border-color: #fbeed5;
}
-.panel-warning .panel-heading {
+.panel-warning > .panel-heading {
color: #c09853;
background-color: #fcf8e3;
border-color: #fbeed5;
}
+.panel-warning > .panel-heading + .panel-collapse .panel-body {
+ border-top-color: #fbeed5;
+}
+
+.panel-warning > .panel-footer + .panel-collapse .panel-body {
+ border-bottom-color: #fbeed5;
+}
+
.panel-danger {
border-color: #eed3d7;
}
-.panel-danger .panel-heading {
+.panel-danger > .panel-heading {
color: #b94a48;
background-color: #f2dede;
border-color: #eed3d7;
}
+.panel-danger > .panel-heading + .panel-collapse .panel-body {
+ border-top-color: #eed3d7;
+}
+
+.panel-danger > .panel-footer + .panel-collapse .panel-body {
+ border-bottom-color: #eed3d7;
+}
+
.panel-info {
border-color: #bce8f1;
}
-.panel-info .panel-heading {
+.panel-info > .panel-heading {
color: #3a87ad;
background-color: #d9edf7;
border-color: #bce8f1;
}
-.list-group-flush {
- margin: 15px -15px -15px;
+.panel-info > .panel-heading + .panel-collapse .panel-body {
+ border-top-color: #bce8f1;
}
-.list-group-flush .list-group-item {
- border-width: 1px 0;
-}
-
-.list-group-flush .list-group-item:first-child {
- border-top-right-radius: 0;
- border-top-left-radius: 0;
-}
-
-.list-group-flush .list-group-item:last-child {
- border-bottom: 0;
+.panel-info > .panel-footer + .panel-collapse .panel-body {
+ border-bottom-color: #bce8f1;
}
.well {
border-color: rgba(0, 0, 0, 0.15);
}
-.well-large {
+.well-lg {
padding: 24px;
border-radius: 6px;
}
-.well-small {
+.well-sm {
padding: 9px;
border-radius: 3px;
}
background-color: transparent;
}
-.nav > li + .nav-header {
- margin-top: 9px;
-}
-
-.nav.open > a,
-.nav.open > a:hover,
-.nav.open > a:focus {
- color: #ffffff;
- background-color: #428bca;
+.nav .open > a,
+.nav .open > a:hover,
+.nav .open > a:focus {
+ background-color: #eeeeee;
border-color: #428bca;
}
-.nav.open > a .caret,
-.nav.open > a:hover .caret,
-.nav.open > a:focus .caret {
- border-top-color: #ffffff;
- border-bottom-color: #ffffff;
-}
-
-.nav > .pull-right {
- float: right;
-}
-
.nav .nav-divider {
height: 1px;
margin: 9px 0;
background-color: #e5e5e5;
}
+.nav > li > a > img {
+ max-width: none;
+}
+
.nav-tabs {
border-bottom: 1px solid #dddddd;
}
}
.nav-tabs > li > a:hover {
- border-color: #eeeeee;
+ border-color: #eeeeee #eeeeee #dddddd;
}
.nav-tabs > li.active > a,
}
.nav-tabs.nav-justified > li {
- display: table-cell;
float: none;
- width: 1%;
}
.nav-tabs.nav-justified > li > a {
text-align: center;
}
+@media (min-width: 768px) {
+ .nav-tabs.nav-justified > li {
+ display: table-cell;
+ width: 1%;
+ }
+}
+
.nav-tabs.nav-justified > li > a {
margin-right: 0;
border-bottom: 1px solid #dddddd;
float: none;
}
-.nav-stacked > li + li > a {
+.nav-stacked > li + li {
margin-top: 2px;
margin-left: 0;
}
}
.nav-justified > li {
- display: table-cell;
float: none;
- width: 1%;
}
.nav-justified > li > a {
text-align: center;
}
+@media (min-width: 768px) {
+ .nav-justified > li {
+ display: table-cell;
+ width: 1%;
+ }
+}
+
.nav-tabs-justified {
border-bottom: 0;
}
.navbar {
position: relative;
min-height: 50px;
- padding-right: 15px;
- padding-left: 15px;
margin-bottom: 20px;
- background-color: #eeeeee;
- border-radius: 4px;
+ background-color: #f8f8f8;
+ border: 1px solid #e7e7e7;
}
.navbar:before,
clear: both;
}
-.navbar-nav {
- margin-top: 10px;
- margin-bottom: 15px;
+@media (min-width: 768px) {
+ .navbar {
+ border-radius: 4px;
+ }
}
-.navbar-nav > li > a {
- padding-top: 15px;
- padding-bottom: 15px;
- line-height: 20px;
- color: #777777;
- border-radius: 4px;
+.navbar-header {
+ padding-right: 15px;
+ padding-left: 15px;
}
-.navbar-nav > li > a:hover,
-.navbar-nav > li > a:focus {
- color: #333333;
- background-color: transparent;
+.navbar-header:before,
+.navbar-header:after {
+ display: table;
+ content: " ";
}
-.navbar-nav > .active > a,
-.navbar-nav > .active > a:hover,
-.navbar-nav > .active > a:focus {
- color: #555555;
- background-color: #d5d5d5;
+.navbar-header:after {
+ clear: both;
}
-.navbar-nav > .disabled > a,
-.navbar-nav > .disabled > a:hover,
-.navbar-nav > .disabled > a:focus {
- color: #cccccc;
- background-color: transparent;
+.navbar-header:before,
+.navbar-header:after {
+ display: table;
+ content: " ";
}
-.navbar-nav.pull-right {
- width: 100%;
+.navbar-header:after {
+ clear: both;
+}
+
+@media (min-width: 768px) {
+ .navbar-header {
+ float: left;
+ }
+}
+
+.navbar-collapse {
+ max-height: 340px;
+ padding-right: 15px;
+ padding-left: 15px;
+ overflow-x: visible;
+ border-top: 1px solid #e6e6e6;
+ box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
+ -webkit-overflow-scrolling: touch;
+}
+
+.navbar-collapse:before,
+.navbar-collapse:after {
+ display: table;
+ content: " ";
+}
+
+.navbar-collapse:after {
+ clear: both;
+}
+
+.navbar-collapse:before,
+.navbar-collapse:after {
+ display: table;
+ content: " ";
+}
+
+.navbar-collapse:after {
+ clear: both;
+}
+
+.navbar-collapse.in {
+ overflow-y: auto;
+}
+
+@media (min-width: 768px) {
+ .navbar-collapse {
+ width: auto;
+ padding-right: 0;
+ padding-left: 0;
+ border-top: 0;
+ box-shadow: none;
+ }
+ .navbar-collapse.collapse {
+ display: block !important;
+ height: auto !important;
+ padding-bottom: 0;
+ overflow: visible !important;
+ }
+ .navbar-collapse.in {
+ overflow-y: visible;
+ }
}
.navbar-static-top {
- border-radius: 0;
+ border-width: 0 0 1px;
+}
+
+@media (min-width: 768px) {
+ .navbar-static-top {
+ border-radius: 0;
+ }
}
.navbar-fixed-top,
right: 0;
left: 0;
z-index: 1030;
- border-radius: 0;
+ border-width: 0 0 1px;
+}
+
+@media (min-width: 768px) {
+ .navbar-fixed-top,
+ .navbar-fixed-bottom {
+ border-radius: 0;
+ }
}
.navbar-fixed-top {
}
.navbar-brand {
- display: block;
- max-width: 200px;
- padding: 15px 15px;
- margin-right: auto;
- margin-left: auto;
+ float: left;
+ padding-top: 15px;
+ padding-bottom: 15px;
font-size: 18px;
- font-weight: 500;
line-height: 20px;
color: #777777;
- text-align: center;
}
.navbar-brand:hover,
}
.navbar-toggle {
- position: absolute;
- top: 9px;
- right: 10px;
- width: 48px;
- height: 32px;
- padding: 8px 12px;
+ position: relative;
+ float: right;
+ padding: 9px 10px;
+ margin-top: 8px;
+ margin-bottom: 8px;
background-color: transparent;
border: 1px solid #dddddd;
border-radius: 4px;
margin-top: 4px;
}
+@media (min-width: 768px) {
+ .navbar-toggle {
+ position: relative;
+ top: auto;
+ left: auto;
+ display: none;
+ }
+}
+
+.navbar-nav {
+ margin: 7.5px -15px;
+}
+
+.navbar-nav > li > a {
+ padding-top: 10px;
+ padding-bottom: 10px;
+ line-height: 20px;
+ color: #777777;
+}
+
+.navbar-nav > li > a:hover,
+.navbar-nav > li > a:focus {
+ color: #333333;
+ background-color: transparent;
+}
+
+.navbar-nav > .active > a,
+.navbar-nav > .active > a:hover,
+.navbar-nav > .active > a:focus {
+ color: #555555;
+ background-color: #e7e7e7;
+}
+
+.navbar-nav > .disabled > a,
+.navbar-nav > .disabled > a:hover,
+.navbar-nav > .disabled > a:focus {
+ color: #cccccc;
+ background-color: transparent;
+}
+
+@media (max-width: 767px) {
+ .navbar-nav .open .dropdown-menu {
+ position: static;
+ float: none;
+ width: auto;
+ margin-top: 0;
+ background-color: transparent;
+ border: 0;
+ box-shadow: none;
+ }
+ .navbar-nav .open .dropdown-menu > li > a,
+ .navbar-nav .open .dropdown-menu .dropdown-header {
+ padding: 5px 15px 5px 25px;
+ }
+ .navbar-nav .open .dropdown-menu > li > a {
+ line-height: 20px;
+ color: #777777;
+ }
+ .navbar-nav .open .dropdown-menu > li > a:hover,
+ .navbar-nav .open .dropdown-menu > li > a:focus {
+ color: #333333;
+ background-color: transparent;
+ background-image: none;
+ }
+ .navbar-nav .open .dropdown-menu > .active > a,
+ .navbar-nav .open .dropdown-menu > .active > a:hover,
+ .navbar-nav .open .dropdown-menu > .active > a:focus {
+ color: #555555;
+ background-color: #e7e7e7;
+ }
+ .navbar-nav .open .dropdown-menu > .disabled > a,
+ .navbar-nav .open .dropdown-menu > .disabled > a:hover,
+ .navbar-nav .open .dropdown-menu > .disabled > a:focus {
+ color: #cccccc;
+ background-color: transparent;
+ }
+}
+
+@media (min-width: 768px) {
+ .navbar-nav {
+ float: left;
+ margin: 0;
+ }
+ .navbar-nav > li {
+ float: left;
+ }
+ .navbar-nav > li > a {
+ padding-top: 15px;
+ padding-bottom: 15px;
+ }
+}
+
+@media (min-width: 768px) {
+ .navbar-left {
+ float: left !important;
+ }
+ .navbar-right {
+ float: right !important;
+ }
+ .navbar-right .dropdown-menu {
+ right: 0;
+ left: auto;
+ }
+}
+
.navbar-form {
- margin-top: 6px;
- margin-bottom: 6px;
+ padding: 10px 15px;
+ margin-top: 8px;
+ margin-right: -15px;
+ margin-bottom: 8px;
+ margin-left: -15px;
+ border-top: 1px solid #e6e6e6;
+ border-bottom: 1px solid #e6e6e6;
+ -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
+ box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
}
-.navbar-form .form-control,
-.navbar-form .radio,
-.navbar-form .checkbox {
- display: inline-block;
+@media (min-width: 768px) {
+ .navbar-form .form-group {
+ display: inline-block;
+ margin-bottom: 0;
+ vertical-align: middle;
+ }
+ .navbar-form .form-control {
+ display: inline-block;
+ }
+ .navbar-form .radio,
+ .navbar-form .checkbox {
+ display: inline-block;
+ padding-left: 0;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+ .navbar-form .radio input[type="radio"],
+ .navbar-form .checkbox input[type="checkbox"] {
+ float: none;
+ margin-left: 0;
+ }
}
-.navbar-form .radio,
-.navbar-form .checkbox {
- margin-top: 0;
- margin-bottom: 0;
+@media (max-width: 767px) {
+ .navbar-form .form-group {
+ margin-bottom: 5px;
+ }
+}
+
+@media (min-width: 768px) {
+ .navbar-form {
+ width: auto;
+ padding-top: 0;
+ padding-bottom: 0;
+ margin-right: 0;
+ margin-left: 0;
+ border: 0;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ }
}
.navbar-nav > li > .dropdown-menu {
.navbar-nav > .open > a:hover,
.navbar-nav > .open > a:focus {
color: #555555;
- background-color: #d5d5d5;
+ background-color: #e7e7e7;
}
.navbar-nav > .open > a .caret,
left: auto;
}
+.navbar-btn {
+ margin-top: 8px;
+ margin-bottom: 8px;
+}
+
+.navbar-text {
+ float: left;
+ margin-top: 15px;
+ margin-bottom: 15px;
+ color: #777777;
+}
+
+@media (min-width: 768px) {
+ .navbar-text {
+ margin-right: 15px;
+ margin-left: 15px;
+ }
+}
+
+.navbar-link {
+ color: #777777;
+}
+
+.navbar-link:hover {
+ color: #333333;
+}
+
.navbar-inverse {
background-color: #222222;
+ border-color: #080808;
}
.navbar-inverse .navbar-brand {
background-color: #ffffff;
}
+.navbar-inverse .navbar-collapse,
+.navbar-inverse .navbar-form {
+ border-color: #101010;
+}
+
.navbar-inverse .navbar-nav > .open > a,
.navbar-inverse .navbar-nav > .open > a:hover,
.navbar-inverse .navbar-nav > .open > a:focus {
border-bottom-color: #ffffff;
}
-@media screen and (min-width: 768px) {
- .navbar-brand {
- float: left;
- margin-right: 5px;
- margin-left: -15px;
+@media (max-width: 767px) {
+ .navbar-inverse .navbar-nav .open .dropdown-menu > .dropdown-header {
+ border-color: #080808;
}
- .navbar-nav {
- float: left;
- margin-top: 0;
- margin-bottom: 0;
+ .navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
+ color: #999999;
}
- .navbar-nav > li {
- float: left;
+ .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover,
+ .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus {
+ color: #ffffff;
+ background-color: transparent;
}
- .navbar-nav > li > a {
- border-radius: 0;
+ .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a,
+ .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:hover,
+ .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:focus {
+ color: #ffffff;
+ background-color: #080808;
}
- .navbar-nav.pull-right {
- float: right;
- width: auto;
+ .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a,
+ .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:hover,
+ .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:focus {
+ color: #444444;
+ background-color: transparent;
}
- .navbar-toggle {
- position: relative;
- top: auto;
- left: auto;
- display: none;
- }
- .nav-collapse.collapse {
- display: block !important;
- height: auto !important;
- overflow: visible !important;
- }
-}
-
-.navbar-btn {
- margin-top: 6px;
-}
-
-.navbar-text {
- margin-top: 15px;
- margin-bottom: 15px;
-}
-
-.navbar-link {
- color: #777777;
-}
-
-.navbar-link:hover {
- color: #333333;
}
.navbar-inverse .navbar-link {
color: #ffffff;
}
-.btn .caret {
- border-top-color: #ffffff;
+.btn-default .caret {
+ border-top-color: #333333;
}
-.dropup .btn .caret {
- border-bottom-color: #ffffff;
+.btn-primary .caret,
+.btn-success .caret,
+.btn-warning .caret,
+.btn-danger .caret,
+.btn-info .caret {
+ border-top-color: #fff;
+}
+
+.dropup .btn-default .caret {
+ border-bottom-color: #333333;
+}
+
+.dropup .btn-primary .caret,
+.dropup .btn-success .caret,
+.dropup .btn-warning .caret,
+.dropup .btn-danger .caret,
+.dropup .btn-info .caret {
+ border-bottom-color: #fff;
}
.btn-group,
.btn-group > .btn:hover,
.btn-group-vertical > .btn:hover,
+.btn-group > .btn:focus,
+.btn-group-vertical > .btn:focus,
.btn-group > .btn:active,
-.btn-group-vertical > .btn:active {
+.btn-group-vertical > .btn:active,
+.btn-group > .btn.active,
+.btn-group-vertical > .btn.active {
z-index: 2;
}
-.btn-group .btn + .btn {
+.btn-group > .btn:focus,
+.btn-group-vertical > .btn:focus {
+ outline: none;
+}
+
+.btn-group .btn + .btn,
+.btn-group .btn + .btn-group,
+.btn-group .btn-group + .btn,
+.btn-group .btn-group + .btn-group {
margin-left: -1px;
}
outline: 0;
}
+.btn-group-xs > .btn {
+ padding: 5px 10px;
+ padding: 1px 5px;
+ font-size: 12px;
+ line-height: 1.5;
+ border-radius: 3px;
+}
+
+.btn-group-sm > .btn {
+ padding: 5px 10px;
+ font-size: 12px;
+ line-height: 1.5;
+ border-radius: 3px;
+}
+
+.btn-group-lg > .btn {
+ padding: 10px 16px;
+ font-size: 18px;
+ line-height: 1.33;
+ border-radius: 6px;
+}
+
.btn-group > .btn + .dropdown-toggle {
padding-right: 8px;
padding-left: 8px;
}
-.btn-group > .btn-large + .dropdown-toggle {
+.btn-group > .btn-lg + .dropdown-toggle {
padding-right: 12px;
padding-left: 12px;
}
margin-left: 0;
}
-.btn-large .caret {
+.btn-lg .caret {
border-width: 5px;
}
-.dropup .btn-large .caret {
+.dropup .btn-lg .caret {
border-bottom-width: 5px;
}
-.btn-group-vertical > .btn {
+.btn-group-vertical > .btn,
+.btn-group-vertical > .btn-group {
display: block;
float: none;
width: 100%;
max-width: 100%;
}
-.btn-group-vertical > .btn + .btn {
+.btn-group-vertical > .btn-group:before,
+.btn-group-vertical > .btn-group:after {
+ display: table;
+ content: " ";
+}
+
+.btn-group-vertical > .btn-group:after {
+ clear: both;
+}
+
+.btn-group-vertical > .btn-group:before,
+.btn-group-vertical > .btn-group:after {
+ display: table;
+ content: " ";
+}
+
+.btn-group-vertical > .btn-group:after {
+ clear: both;
+}
+
+.btn-group-vertical > .btn-group > .btn {
+ float: none;
+}
+
+.btn-group-vertical > .btn + .btn,
+.btn-group-vertical > .btn + .btn-group,
+.btn-group-vertical > .btn-group + .btn,
+.btn-group-vertical > .btn-group + .btn-group {
margin-top: -1px;
+ margin-left: 0;
+}
+
+.btn-group-vertical > .btn:not(:first-child):not(:last-child) {
+ border-radius: 0;
+}
+
+.btn-group-vertical > .btn:first-child:not(:last-child) {
+ border-top-right-radius: 4px;
+ border-bottom-right-radius: 0;
+ border-bottom-left-radius: 0;
+}
+
+.btn-group-vertical > .btn:last-child:not(:first-child) {
+ border-top-right-radius: 0;
+ border-bottom-left-radius: 4px;
+ border-top-left-radius: 0;
}
-.btn-group-vertical .btn:not(:first-child):not(:last-child) {
+.btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn {
border-radius: 0;
}
-.btn-group-vertical .btn:first-child {
+.btn-group-vertical > .btn-group:first-child > .btn:last-child,
+.btn-group-vertical > .btn-group:first-child > .dropdown-toggle {
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
-.btn-group-vertical .btn:last-child {
+.btn-group-vertical > .btn-group:last-child > .btn:first-child {
border-top-right-radius: 0;
border-top-left-radius: 0;
}
.btn-group-justified {
display: table;
width: 100%;
+ border-collapse: separate;
+ table-layout: fixed;
}
.btn-group-justified .btn {
width: 1%;
}
-.btn-group[data-toggle="buttons"] > .btn > input[type="radio"],
-.btn-group[data-toggle="buttons"] > .btn > input[type="checkbox"] {
+[data-toggle="buttons"] > .btn > input[type="radio"],
+[data-toggle="buttons"] > .btn > input[type="checkbox"] {
display: none;
}
.pagination > li > a,
.pagination > li > span {
+ position: relative;
float: left;
- padding: 4px 12px;
+ padding: 6px 12px;
+ margin-left: -1px;
line-height: 1.428571429;
text-decoration: none;
background-color: #ffffff;
border: 1px solid #dddddd;
- border-left-width: 0;
}
.pagination > li:first-child > a,
.pagination > li:first-child > span {
- border-left-width: 1px;
+ margin-left: 0;
border-bottom-left-radius: 4px;
border-top-left-radius: 4px;
}
}
.pagination > li > a:hover,
+.pagination > li > span:hover,
.pagination > li > a:focus,
-.pagination > .active > a,
-.pagination > .active > span {
- background-color: #f5f5f5;
+.pagination > li > span:focus {
+ background-color: #eeeeee;
}
.pagination > .active > a,
-.pagination > .active > span {
- color: #999999;
+.pagination > .active > span,
+.pagination > .active > a:hover,
+.pagination > .active > span:hover,
+.pagination > .active > a:focus,
+.pagination > .active > span:focus {
+ z-index: 2;
+ color: #ffffff;
cursor: default;
+ background-color: #428bca;
+ border-color: #428bca;
}
.pagination > .disabled > span,
color: #999999;
cursor: not-allowed;
background-color: #ffffff;
+ border-color: #dddddd;
}
-.pagination-large > li > a,
-.pagination-large > li > span {
- padding: 14px 16px;
+.pagination-lg > li > a,
+.pagination-lg > li > span {
+ padding: 10px 16px;
font-size: 18px;
}
-.pagination-large > li:first-child > a,
-.pagination-large > li:first-child > span {
+.pagination-lg > li:first-child > a,
+.pagination-lg > li:first-child > span {
border-bottom-left-radius: 6px;
border-top-left-radius: 6px;
}
-.pagination-large > li:last-child > a,
-.pagination-large > li:last-child > span {
+.pagination-lg > li:last-child > a,
+.pagination-lg > li:last-child > span {
border-top-right-radius: 6px;
border-bottom-right-radius: 6px;
}
-.pagination-small > li > a,
-.pagination-small > li > span {
+.pagination-sm > li > a,
+.pagination-sm > li > span {
padding: 5px 10px;
font-size: 12px;
}
-.pagination-small > li:first-child > a,
-.pagination-small > li:first-child > span {
+.pagination-sm > li:first-child > a,
+.pagination-sm > li:first-child > span {
border-bottom-left-radius: 3px;
border-top-left-radius: 3px;
}
-.pagination-small > li:last-child > a,
-.pagination-small > li:last-child > span {
+.pagination-sm > li:last-child > a,
+.pagination-sm > li:last-child > span {
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
}
.pager li > a:hover,
.pager li > a:focus {
text-decoration: none;
- background-color: #f5f5f5;
+ background-color: #428bca;
}
.pager .next > a,
transition: transform 0.3s ease-out;
}
-.modal.fade.in .modal-dialog {
+.modal.in .modal-dialog {
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
}
.modal-dialog {
- position: relative;
- top: 0;
- right: 0;
- left: 0;
z-index: 1050;
width: auto;
padding: 10px;
+ margin-right: auto;
+ margin-left: auto;
}
.modal-content {
filter: alpha(opacity=0);
}
-.modal-backdrop.fade.in {
+.modal-backdrop.in {
opacity: 0.5;
filter: alpha(opacity=50);
}
.modal-dialog {
right: auto;
left: 50%;
- width: 560px;
+ width: 600px;
padding-top: 30px;
padding-bottom: 30px;
- margin-left: -280px;
}
.modal-content {
-webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
}
.tooltip.in {
- opacity: 1;
- filter: alpha(opacity=100);
+ opacity: 0.9;
+ filter: alpha(opacity=90);
}
.tooltip.top {
color: #ffffff;
text-align: center;
text-decoration: none;
- background-color: rgba(0, 0, 0, 0.9);
+ background-color: #000000;
border-radius: 4px;
}
bottom: 0;
left: 50%;
margin-left: -5px;
- border-top-color: rgba(0, 0, 0, 0.9);
+ border-top-color: #000000;
border-width: 5px 5px 0;
}
.tooltip.top-left .tooltip-arrow {
bottom: 0;
left: 5px;
- border-top-color: rgba(0, 0, 0, 0.9);
+ border-top-color: #000000;
border-width: 5px 5px 0;
}
.tooltip.top-right .tooltip-arrow {
right: 5px;
bottom: 0;
- border-top-color: rgba(0, 0, 0, 0.9);
+ border-top-color: #000000;
border-width: 5px 5px 0;
}
top: 50%;
left: 0;
margin-top: -5px;
- border-right-color: rgba(0, 0, 0, 0.9);
+ border-right-color: #000000;
border-width: 5px 5px 5px 0;
}
top: 50%;
right: 0;
margin-top: -5px;
- border-left-color: rgba(0, 0, 0, 0.9);
+ border-left-color: #000000;
border-width: 5px 0 5px 5px;
}
top: 0;
left: 50%;
margin-left: -5px;
- border-bottom-color: rgba(0, 0, 0, 0.9);
+ border-bottom-color: #000000;
border-width: 0 5px 5px;
}
.tooltip.bottom-left .tooltip-arrow {
top: 0;
left: 5px;
- border-bottom-color: rgba(0, 0, 0, 0.9);
+ border-bottom-color: #000000;
border-width: 0 5px 5px;
}
.tooltip.bottom-right .tooltip-arrow {
top: 0;
right: 5px;
- border-bottom-color: rgba(0, 0, 0, 0.9);
+ border-bottom-color: #000000;
border-width: 0 5px 5px;
}
-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
background-clip: padding-box;
- -webkit-bg-clip: padding-box;
- -moz-bg-clip: padding;
}
.popover.top {
}
.alert {
- padding: 10px 35px 10px 15px;
+ padding: 15px;
margin-bottom: 20px;
color: #c09853;
background-color: #fcf8e3;
}
.alert .alert-link {
- font-weight: 500;
+ font-weight: bold;
color: #a47e3c;
}
-.alert .close {
+.alert > p,
+.alert > ul {
+ margin-bottom: 0;
+}
+
+.alert > p + p {
+ margin-top: 5px;
+}
+
+.alert-dismissable {
+ padding-right: 35px;
+}
+
+.alert-dismissable .close {
position: relative;
top: -2px;
right: -21px;
color: #2d6987;
}
-.alert-block {
- padding-top: 15px;
- padding-bottom: 15px;
-}
-
-.alert-block > p,
-.alert-block > ul {
- margin-bottom: 0;
-}
-
-.alert-block p + p {
- margin-top: 5px;
-}
-
.thumbnail,
.img-thumbnail {
padding: 4px;
display: block;
}
-.thumbnail > img,
+.thumbnail > img {
+ display: block;
+ height: auto;
+ max-width: 100%;
+}
+
.img-thumbnail {
display: inline-block;
height: auto;
display: inline;
padding: .25em .6em;
font-size: 75%;
- font-weight: 500;
+ font-weight: bold;
line-height: 1;
color: #ffffff;
text-align: center;
white-space: nowrap;
- vertical-align: middle;
- background-color: #999999;
+ vertical-align: baseline;
border-radius: .25em;
}
color: #ffffff;
text-decoration: none;
cursor: pointer;
+}
+
+.label:empty {
+ display: none;
+}
+
+.label-default {
+ background-color: #999999;
+}
+
+.label-default[href]:hover,
+.label-default[href]:focus {
background-color: #808080;
}
-.label-danger {
- background-color: #d9534f;
+.label-primary {
+ background-color: #428bca;
}
-.label-danger[href]:hover,
-.label-danger[href]:focus {
- background-color: #c9302c;
+.label-primary[href]:hover,
+.label-primary[href]:focus {
+ background-color: #3071a9;
}
.label-success {
background-color: #449d44;
}
+.label-info {
+ background-color: #5bc0de;
+}
+
+.label-info[href]:hover,
+.label-info[href]:focus {
+ background-color: #31b0d5;
+}
+
.label-warning {
background-color: #f0ad4e;
}
background-color: #ec971f;
}
-.label-info {
- background-color: #5bc0de;
+.label-danger {
+ background-color: #d9534f;
}
-.label-info[href]:hover,
-.label-info[href]:focus {
- background-color: #31b0d5;
+.label-danger[href]:hover,
+.label-danger[href]:focus {
+ background-color: #c9302c;
}
.badge {
color: #ffffff;
text-align: center;
white-space: nowrap;
- vertical-align: middle;
+ vertical-align: baseline;
background-color: #999999;
border-radius: 10px;
}
}
}
-@-ms-keyframes progress-bar-stripes {
- from {
- background-position: 40px 0;
- }
- to {
- background-position: 0 0;
- }
-}
-
@-o-keyframes progress-bar-stripes {
from {
background-position: 0 0;
}
.progress-striped .progress-bar {
- background-color: #428bca;
background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
animation: progress-bar-stripes 2s linear infinite;
}
-.progress-bar-danger {
- background-color: #d9534f;
+.progress-bar-success {
+ background-color: #5cb85c;
}
-.progress-striped .progress-bar-danger {
- background-color: #d9534f;
+.progress-striped .progress-bar-success {
background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}
-.progress-bar-success {
- background-color: #5cb85c;
+.progress-bar-info {
+ background-color: #5bc0de;
}
-.progress-striped .progress-bar-success {
- background-color: #5cb85c;
+.progress-striped .progress-bar-info {
background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}
.progress-striped .progress-bar-warning {
- background-color: #f0ad4e;
background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}
-.progress-bar-info {
- background-color: #5bc0de;
+.progress-bar-danger {
+ background-color: #d9534f;
}
-.progress-striped .progress-bar-info {
- background-color: #5bc0de;
+.progress-striped .progress-bar-danger {
background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}
-.accordion {
- margin-bottom: 20px;
-}
-
-.accordion-group {
- margin-bottom: 2px;
- border: 1px solid #e5e5e5;
- border-radius: 4px;
-}
-
-.accordion-heading {
- border-bottom: 0;
-}
-
-.accordion-heading .accordion-toggle {
- display: block;
- padding: 8px 15px;
- cursor: pointer;
-}
-
-.accordion-inner {
- padding: 9px 15px;
- border-top: 1px solid #e5e5e5;
-}
-
.carousel {
position: relative;
}
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
- display: inline-block;
+ display: block;
height: auto;
max-width: 100%;
line-height: 1;
}
.carousel-control.left {
- background-color: rgba(0, 0, 0, 0.0001);
- background-color: transparent;
background-image: -webkit-gradient(linear, 0 top, 100% top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0.0001)));
background-image: -webkit-linear-gradient(left, color-stop(rgba(0, 0, 0, 0.5) 0), color-stop(rgba(0, 0, 0, 0.0001) 100%));
background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.5) 0, rgba(0, 0, 0, 0.0001) 100%);
.carousel-control.right {
right: 0;
left: auto;
- background-color: rgba(0, 0, 0, 0.5);
- background-color: transparent;
background-image: -webkit-gradient(linear, 0 top, 100% top, from(rgba(0, 0, 0, 0.0001)), to(rgba(0, 0, 0, 0.5)));
background-image: -webkit-linear-gradient(left, color-stop(rgba(0, 0, 0, 0.0001) 0), color-stop(rgba(0, 0, 0, 0.5) 100%));
background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.0001) 0, rgba(0, 0, 0, 0.5) 100%);
filter: alpha(opacity=90);
}
-.carousel-control .glyphicon,
.carousel-control .icon-prev,
.carousel-control .icon-next {
position: absolute;
bottom: 10px;
left: 50%;
z-index: 15;
- width: 120px;
+ width: 60%;
padding-left: 0;
- margin-left: -60px;
+ margin-left: -30%;
text-align: center;
list-style: none;
}
}
@media screen and (min-width: 768px) {
- .carousel-control .glyphicon,
.carousel-control .icon-prev,
.carousel-control .icon-next {
width: 30px;
}
.pull-right {
- float: right;
+ float: right !important;
}
.pull-left {
- float: left;
+ float: left !important;
}
.hide {
visibility: hidden !important;
}
-.visible-sm {
+.visible-xs {
display: block !important;
}
-tr.visible-sm {
+tr.visible-xs {
display: table-row !important;
}
-th.visible-sm,
-td.visible-sm {
+th.visible-xs,
+td.visible-xs {
display: table-cell !important;
}
-.visible-md {
- display: none !important;
-}
-
-tr.visible-md {
- display: none !important;
+@media (min-width: 768px) and (max-width: 991px) {
+ .visible-xs {
+ display: none !important;
+ }
+ tr.visible-xs {
+ display: none !important;
+ }
+ th.visible-xs,
+ td.visible-xs {
+ display: none !important;
+ }
}
-th.visible-md,
-td.visible-md {
- display: none !important;
+@media (min-width: 992px) and (max-width: 1199px) {
+ .visible-xs {
+ display: none !important;
+ }
+ tr.visible-xs {
+ display: none !important;
+ }
+ th.visible-xs,
+ td.visible-xs {
+ display: none !important;
+ }
}
-.visible-lg {
- display: none !important;
-}
-
-tr.visible-lg {
- display: none !important;
-}
-
-th.visible-lg,
-td.visible-lg {
- display: none !important;
+@media (min-width: 1200px) {
+ .visible-xs {
+ display: none !important;
+ }
+ tr.visible-xs {
+ display: none !important;
+ }
+ th.visible-xs,
+ td.visible-xs {
+ display: none !important;
+ }
}
-.hidden-sm {
+.visible-sm {
display: none !important;
}
-tr.hidden-sm {
+tr.visible-sm {
display: none !important;
}
-th.hidden-sm,
-td.hidden-sm {
+th.visible-sm,
+td.visible-sm {
display: none !important;
}
-.hidden-md {
- display: block !important;
+@media (min-width: 768px) and (max-width: 991px) {
+ .visible-sm {
+ display: block !important;
+ }
+ tr.visible-sm {
+ display: table-row !important;
+ }
+ th.visible-sm,
+ td.visible-sm {
+ display: table-cell !important;
+ }
}
-tr.hidden-md {
- display: table-row !important;
+@media (min-width: 992px) and (max-width: 1199px) {
+ .visible-sm {
+ display: none !important;
+ }
+ tr.visible-sm {
+ display: none !important;
+ }
+ th.visible-sm,
+ td.visible-sm {
+ display: none !important;
+ }
}
-th.hidden-md,
-td.hidden-md {
- display: table-cell !important;
+@media (min-width: 1200px) {
+ .visible-sm {
+ display: none !important;
+ }
+ tr.visible-sm {
+ display: none !important;
+ }
+ th.visible-sm,
+ td.visible-sm {
+ display: none !important;
+ }
}
-.hidden-lg {
- display: block !important;
+.visible-md {
+ display: none !important;
}
-tr.hidden-lg {
- display: table-row !important;
+tr.visible-md {
+ display: none !important;
}
-th.hidden-lg,
-td.hidden-lg {
- display: table-cell !important;
+th.visible-md,
+td.visible-md {
+ display: none !important;
}
@media (min-width: 768px) and (max-width: 991px) {
- .visible-sm {
+ .visible-md {
display: none !important;
}
- tr.visible-sm {
+ tr.visible-md {
display: none !important;
}
- th.visible-sm,
- td.visible-sm {
+ th.visible-md,
+ td.visible-md {
display: none !important;
}
+}
+
+@media (min-width: 992px) and (max-width: 1199px) {
.visible-md {
display: block !important;
}
td.visible-md {
display: table-cell !important;
}
+}
+
+@media (min-width: 1200px) {
+ .visible-md {
+ display: none !important;
+ }
+ tr.visible-md {
+ display: none !important;
+ }
+ th.visible-md,
+ td.visible-md {
+ display: none !important;
+ }
+}
+
+.visible-lg {
+ display: none !important;
+}
+
+tr.visible-lg {
+ display: none !important;
+}
+
+th.visible-lg,
+td.visible-lg {
+ display: none !important;
+}
+
+@media (min-width: 768px) and (max-width: 991px) {
+ .visible-lg {
+ display: none !important;
+ }
+ tr.visible-lg {
+ display: none !important;
+ }
+ th.visible-lg,
+ td.visible-lg {
+ display: none !important;
+ }
+}
+
+@media (min-width: 992px) and (max-width: 1199px) {
.visible-lg {
display: none !important;
}
td.visible-lg {
display: none !important;
}
- .hidden-sm {
+}
+
+@media (min-width: 1200px) {
+ .visible-lg {
display: block !important;
}
- tr.hidden-sm {
+ tr.visible-lg {
display: table-row !important;
}
- th.hidden-sm,
- td.hidden-sm {
+ th.visible-lg,
+ td.visible-lg {
display: table-cell !important;
}
- .hidden-md {
- display: none !important;
+}
+
+.hidden-xs {
+ display: none !important;
+}
+
+tr.hidden-xs {
+ display: none !important;
+}
+
+th.hidden-xs,
+td.hidden-xs {
+ display: none !important;
+}
+
+@media (min-width: 768px) and (max-width: 991px) {
+ .hidden-xs {
+ display: block !important;
}
- tr.hidden-md {
- display: none !important;
+ tr.hidden-xs {
+ display: table-row !important;
}
- th.hidden-md,
- td.hidden-md {
- display: none !important;
+ th.hidden-xs,
+ td.hidden-xs {
+ display: table-cell !important;
}
- .hidden-lg {
+}
+
+@media (min-width: 992px) and (max-width: 1199px) {
+ .hidden-xs {
display: block !important;
}
- tr.hidden-lg {
+ tr.hidden-xs {
display: table-row !important;
}
- th.hidden-lg,
- td.hidden-lg {
+ th.hidden-xs,
+ td.hidden-xs {
display: table-cell !important;
}
}
-@media (min-width: 992px) {
- .visible-sm {
- display: none !important;
+@media (min-width: 1200px) {
+ .hidden-xs {
+ display: block !important;
}
- tr.visible-sm {
- display: none !important;
+ tr.hidden-xs {
+ display: table-row !important;
}
- th.visible-sm,
- td.visible-sm {
- display: none !important;
+ th.hidden-xs,
+ td.hidden-xs {
+ display: table-cell !important;
}
- .visible-md {
+}
+
+.hidden-sm {
+ display: block !important;
+}
+
+tr.hidden-sm {
+ display: table-row !important;
+}
+
+th.hidden-sm,
+td.hidden-sm {
+ display: table-cell !important;
+}
+
+@media (min-width: 768px) and (max-width: 991px) {
+ .hidden-sm {
display: none !important;
}
- tr.visible-md {
+ tr.hidden-sm {
display: none !important;
}
- th.visible-md,
- td.visible-md {
+ th.hidden-sm,
+ td.hidden-sm {
display: none !important;
}
- .visible-lg {
+}
+
+@media (min-width: 992px) and (max-width: 1199px) {
+ .hidden-sm {
display: block !important;
}
- tr.visible-lg {
+ tr.hidden-sm {
display: table-row !important;
}
- th.visible-lg,
- td.visible-lg {
+ th.hidden-sm,
+ td.hidden-sm {
display: table-cell !important;
}
+}
+
+@media (min-width: 1200px) {
.hidden-sm {
display: block !important;
}
td.hidden-sm {
display: table-cell !important;
}
+}
+
+.hidden-md {
+ display: block !important;
+}
+
+tr.hidden-md {
+ display: table-row !important;
+}
+
+th.hidden-md,
+td.hidden-md {
+ display: table-cell !important;
+}
+
+@media (min-width: 768px) and (max-width: 991px) {
.hidden-md {
display: block !important;
}
td.hidden-md {
display: table-cell !important;
}
+}
+
+@media (min-width: 992px) and (max-width: 1199px) {
+ .hidden-md {
+ display: none !important;
+ }
+ tr.hidden-md {
+ display: none !important;
+ }
+ th.hidden-md,
+ td.hidden-md {
+ display: none !important;
+ }
+}
+
+@media (min-width: 1200px) {
+ .hidden-md {
+ display: block !important;
+ }
+ tr.hidden-md {
+ display: table-row !important;
+ }
+ th.hidden-md,
+ td.hidden-md {
+ display: table-cell !important;
+ }
+}
+
+.hidden-lg {
+ display: block !important;
+}
+
+tr.hidden-lg {
+ display: table-row !important;
+}
+
+th.hidden-lg,
+td.hidden-lg {
+ display: table-cell !important;
+}
+
+@media (min-width: 768px) and (max-width: 991px) {
+ .hidden-lg {
+ display: block !important;
+ }
+ tr.hidden-lg {
+ display: table-row !important;
+ }
+ th.hidden-lg,
+ td.hidden-lg {
+ display: table-cell !important;
+ }
+}
+
+@media (min-width: 992px) and (max-width: 1199px) {
+ .hidden-lg {
+ display: block !important;
+ }
+ tr.hidden-lg {
+ display: table-row !important;
+ }
+ th.hidden-lg,
+ td.hidden-lg {
+ display: table-cell !important;
+ }
+}
+
+@media (min-width: 1200px) {
.hidden-lg {
display: none !important;
}
* http://www.apache.org/licenses/LICENSE-2.0
*
* Designed and built with all the love in the world by @mdo and @fat.
- *//*! normalize.css v2.1.0 | MIT License | git.io/normalize */article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}body{margin:0}a:focus{outline:thin dotted}a:active,a:hover{outline:0}h1{margin:.67em 0;font-size:2em}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}hr{height:0;-moz-box-sizing:content-box;box-sizing:content-box}mark{color:#000;background:#ff0}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em}pre{white-space:pre-wrap}q{quotes:"\201C" "\201D" "\2018" "\2019"}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:0}fieldset{padding:.35em .625em .75em;margin:0 2px;border:1px solid #c0c0c0}legend{padding:0;border:0}button,input,select,textarea{margin:0;font-family:inherit;font-size:100%}button,input{line-height:normal}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{cursor:pointer;-webkit-appearance:button}button[disabled],html input[disabled]{cursor:default}input[type="checkbox"],input[type="radio"]{padding:0;box-sizing:border-box}input[type="search"]{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;-webkit-appearance:textfield}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0}@media print{*{color:#000!important;text-shadow:none!important;background:transparent!important;box-shadow:none!important}a,a:visited{text-decoration:underline}a[href]:after{content:" (" attr(href) ")"}abbr[title]:after{content:" (" attr(title) ")"}.ir a:after,a[href^="javascript:"]:after,a[href^="#"]:after{content:""}pre,blockquote{border:1px solid #999;page-break-inside:avoid}thead{display:table-header-group}tr,img{page-break-inside:avoid}img{max-width:100%!important}@page{margin:2cm .5cm}p,h2,h3{orphans:3;widows:3}h2,h3{page-break-after:avoid}.navbar{display:none}.table td,.table th{background-color:#fff!important}.btn>.caret,.dropup>.btn>.caret{border-top-color:#000!important}.label{border:1px solid #000}.table{border-collapse:collapse!important}.table-bordered th,.table-bordered td{border:1px solid #ddd!important}}*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}html{font-size:62.5%;-webkit-tap-highlight-color:rgba(0,0,0,0)}body{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;line-height:1.428571429;color:#333;background-color:#fff}input,button,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit}a{color:#428bca;text-decoration:none}a:hover,a:focus{color:#2a6496;text-decoration:underline}a:focus{outline:thin dotted #333;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}img{vertical-align:middle}.img-responsive{display:inline-block;height:auto;max-width:100%}.img-rounded{border-radius:6px}.img-circle{border-radius:500px}hr{margin-top:20px;margin-bottom:20px;border:0;border-top:1px solid #eee}p{margin:0 0 10px}.lead{margin-bottom:20px;font-size:16.099999999999998px;font-weight:200;line-height:1.4}@media(min-width:768px){.lead{font-size:21px}}small{font-size:85%}cite{font-style:normal}.text-muted{color:#999}.text-primary{color:#428bca}.text-warning{color:#c09853}.text-danger{color:#b94a48}.text-success{color:#468847}.text-info{color:#3a87ad}.text-left{text-align:left}.text-right{text-align:right}.text-center{text-align:center}h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:500;line-height:1.1}h1 small,h2 small,h3 small,h4 small,h5 small,h6 small,.h1 small,.h2 small,.h3 small,.h4 small,.h5 small,.h6 small{font-weight:normal;line-height:1;color:#999}h1,h2,h3{margin-top:20px;margin-bottom:10px}h4,h5,h6{margin-top:10px;margin-bottom:10px}h1,.h1{font-size:38px}h2,.h2{font-size:32px}h3,.h3{font-size:24px}h4,.h4{font-size:18px}h5,.h5{font-size:14px}h6,.h6{font-size:12px}h1 small,.h1 small{font-size:24px}h2 small,.h2 small{font-size:18px}h3 small,.h3 small,h4 small,.h4 small{font-size:14px}.page-header{padding-bottom:9px;margin:40px 0 20px;border-bottom:1px solid #eee}ul,ol{margin-top:0;margin-bottom:10px}ul ul,ol ul,ul ol,ol ol{margin-bottom:0}.list-unstyled{padding-left:0;list-style:none}.list-inline{padding-left:0;list-style:none}.list-inline>li{display:inline-block;padding-right:5px;padding-left:5px}dl{margin-bottom:20px}dt,dd{line-height:1.428571429}dt{font-weight:bold}dd{margin-left:0}.dl-horizontal dt{float:left;width:160px;overflow:hidden;clear:left;text-align:right;text-overflow:ellipsis;white-space:nowrap}.dl-horizontal dd{margin-left:180px}.dl-horizontal dd:before,.dl-horizontal dd:after{display:table;content:" "}.dl-horizontal dd:after{clear:both}.dl-horizontal dd:before,.dl-horizontal dd:after{display:table;content:" "}.dl-horizontal dd:after{clear:both}abbr[title],abbr[data-original-title]{cursor:help;border-bottom:1px dotted #999}abbr.initialism{font-size:90%;text-transform:uppercase}blockquote{padding:10px 20px;margin:0 0 20px;border-left:5px solid #eee}blockquote p{font-size:17.5px;font-weight:300;line-height:1.25}blockquote p:last-child{margin-bottom:0}blockquote small{display:block;line-height:1.428571429;color:#999}blockquote small:before{content:'\2014 \00A0'}blockquote.pull-right{float:right;padding-right:15px;padding-left:0;border-right:5px solid #eee;border-left:0}blockquote.pull-right p,blockquote.pull-right small{text-align:right}blockquote.pull-right small:before{content:''}blockquote.pull-right small:after{content:'\00A0 \2014'}q:before,q:after,blockquote:before,blockquote:after{content:""}address{display:block;margin-bottom:20px;font-style:normal;line-height:1.428571429}code,pre{font-family:Monaco,Menlo,Consolas,"Courier New",monospace}code{padding:2px 4px;font-size:90%;color:#c7254e;white-space:nowrap;background-color:#f9f2f4;border-radius:4px}pre{display:block;padding:9.5px;margin:0 0 10px;font-size:13px;line-height:1.428571429;color:#333;word-break:break-all;word-wrap:break-word;background-color:#f5f5f5;border:1px solid #ccc;border-radius:4px}pre.prettyprint{margin-bottom:20px}pre code{padding:0;color:inherit;white-space:pre-wrap;background-color:transparent;border:0}.pre-scrollable{max-height:340px;overflow-y:scroll}.container{margin-right:auto;margin-left:auto}.container:before,.container:after{display:table;content:" "}.container:after{clear:both}.container:before,.container:after{display:table;content:" "}.container:after{clear:both}.row:before,.row:after{display:table;content:" "}.row:after{clear:both}.row:before,.row:after{display:table;content:" "}.row:after{clear:both}@media(min-width:768px){.row{margin-right:-15px;margin-left:-15px}}.row .row{margin-right:-15px;margin-left:-15px}.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12{position:relative;min-height:1px;padding-right:15px;padding-left:15px}.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12{float:left}.col-1{width:8.333333333333332%}.col-2{width:16.666666666666664%}.col-3{width:25%}.col-4{width:33.33333333333333%}.col-5{width:41.66666666666667%}.col-6{width:50%}.col-7{width:58.333333333333336%}.col-8{width:66.66666666666666%}.col-9{width:75%}.col-10{width:83.33333333333334%}.col-11{width:91.66666666666666%}.col-12{width:100%}@media(min-width:768px){.container{max-width:728px}.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12{float:left}.col-sm-1{width:8.333333333333332%}.col-sm-2{width:16.666666666666664%}.col-sm-3{width:25%}.col-sm-4{width:33.33333333333333%}.col-sm-5{width:41.66666666666667%}.col-sm-6{width:50%}.col-sm-7{width:58.333333333333336%}.col-sm-8{width:66.66666666666666%}.col-sm-9{width:75%}.col-sm-10{width:83.33333333333334%}.col-sm-11{width:91.66666666666666%}.col-sm-12{width:100%}.col-push-1{left:8.333333333333332%}.col-push-2{left:16.666666666666664%}.col-push-3{left:25%}.col-push-4{left:33.33333333333333%}.col-push-5{left:41.66666666666667%}.col-push-6{left:50%}.col-push-7{left:58.333333333333336%}.col-push-8{left:66.66666666666666%}.col-push-9{left:75%}.col-push-10{left:83.33333333333334%}.col-push-11{left:91.66666666666666%}.col-pull-1{right:8.333333333333332%}.col-pull-2{right:16.666666666666664%}.col-pull-3{right:25%}.col-pull-4{right:33.33333333333333%}.col-pull-5{right:41.66666666666667%}.col-pull-6{right:50%}.col-pull-7{right:58.333333333333336%}.col-pull-8{right:66.66666666666666%}.col-pull-9{right:75%}.col-pull-10{right:83.33333333333334%}.col-pull-11{right:91.66666666666666%}}@media(min-width:992px){.container{max-width:940px}.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12{float:left}.col-lg-1{width:8.333333333333332%}.col-lg-2{width:16.666666666666664%}.col-lg-3{width:25%}.col-lg-4{width:33.33333333333333%}.col-lg-5{width:41.66666666666667%}.col-lg-6{width:50%}.col-lg-7{width:58.333333333333336%}.col-lg-8{width:66.66666666666666%}.col-lg-9{width:75%}.col-lg-10{width:83.33333333333334%}.col-lg-11{width:91.66666666666666%}.col-lg-12{width:100%}.col-offset-1{margin-left:8.333333333333332%}.col-offset-2{margin-left:16.666666666666664%}.col-offset-3{margin-left:25%}.col-offset-4{margin-left:33.33333333333333%}.col-offset-5{margin-left:41.66666666666667%}.col-offset-6{margin-left:50%}.col-offset-7{margin-left:58.333333333333336%}.col-offset-8{margin-left:66.66666666666666%}.col-offset-9{margin-left:75%}.col-offset-10{margin-left:83.33333333333334%}.col-offset-11{margin-left:91.66666666666666%}}@media(min-width:1200px){.container{max-width:1170px}}table{max-width:100%;background-color:transparent}th{text-align:left}.table{width:100%;margin-bottom:20px}.table thead>tr>th,.table tbody>tr>th,.table tfoot>tr>th,.table thead>tr>td,.table tbody>tr>td,.table tfoot>tr>td{padding:8px;line-height:1.428571429;vertical-align:top;border-top:1px solid #ddd}.table thead>tr>th{vertical-align:bottom}.table caption+thead tr:first-child th,.table colgroup+thead tr:first-child th,.table thead:first-child tr:first-child th,.table caption+thead tr:first-child td,.table colgroup+thead tr:first-child td,.table thead:first-child tr:first-child td{border-top:0}.table tbody+tbody{border-top:2px solid #ddd}.table .table{background-color:#fff}.table-condensed thead>tr>th,.table-condensed tbody>tr>th,.table-condensed tfoot>tr>th,.table-condensed thead>tr>td,.table-condensed tbody>tr>td,.table-condensed tfoot>tr>td{padding:5px}.table-bordered{border:1px solid #ddd}.table-bordered>thead>tr>th,.table-bordered>tbody>tr>th,.table-bordered>tfoot>tr>th,.table-bordered>thead>tr>td,.table-bordered>tbody>tr>td,.table-bordered>tfoot>tr>td{border:1px solid #ddd}.table-striped>tbody>tr:nth-child(odd)>td,.table-striped>tbody>tr:nth-child(odd)>th{background-color:#f9f9f9}.table-hover>tbody>tr:hover>td,.table-hover>tbody>tr:hover>th{background-color:#f5f5f5}table col[class^="col-"]{display:table-column;float:none}table td[class^="col-"],table th[class^="col-"]{display:table-cell;float:none}.table>thead>tr>td.active,.table>tbody>tr>td.active,.table>tfoot>tr>td.active,.table>thead>tr>th.active,.table>tbody>tr>th.active,.table>tfoot>tr>th.active,.table>thead>tr.active>td,.table>tbody>tr.active>td,.table>tfoot>tr.active>td,.table>thead>tr.active>th,.table>tbody>tr.active>th,.table>tfoot>tr.active>th{background-color:#f5f5f5}.table>thead>tr>td.success,.table>tbody>tr>td.success,.table>tfoot>tr>td.success,.table>thead>tr>th.success,.table>tbody>tr>th.success,.table>tfoot>tr>th.success,.table>thead>tr.success>td,.table>tbody>tr.success>td,.table>tfoot>tr.success>td,.table>thead>tr.success>th,.table>tbody>tr.success>th,.table>tfoot>tr.success>th{background-color:#dff0d8;border-color:#d6e9c6}.table>thead>tr>td.danger,.table>tbody>tr>td.danger,.table>tfoot>tr>td.danger,.table>thead>tr>th.danger,.table>tbody>tr>th.danger,.table>tfoot>tr>th.danger,.table>thead>tr.danger>td,.table>tbody>tr.danger>td,.table>tfoot>tr.danger>td,.table>thead>tr.danger>th,.table>tbody>tr.danger>th,.table>tfoot>tr.danger>th{background-color:#f2dede;border-color:#eed3d7}.table>thead>tr>td.warning,.table>tbody>tr>td.warning,.table>tfoot>tr>td.warning,.table>thead>tr>th.warning,.table>tbody>tr>th.warning,.table>tfoot>tr>th.warning,.table>thead>tr.warning>td,.table>tbody>tr.warning>td,.table>tfoot>tr.warning>td,.table>thead>tr.warning>th,.table>tbody>tr.warning>th,.table>tfoot>tr.warning>th{background-color:#fcf8e3;border-color:#fbeed5}.table-hover>tbody>tr>td.success:hover,.table-hover>tbody>tr>th.success:hover,.table-hover>tbody>tr.success:hover>td{background-color:#d0e9c6;border-color:#c9e2b3}.table-hover>tbody>tr>td.danger:hover,.table-hover>tbody>tr>th.danger:hover,.table-hover>tbody>tr.danger:hover>td{background-color:#ebcccc;border-color:#e6c1c7}.table-hover>tbody>tr>td.warning:hover,.table-hover>tbody>tr>th.warning:hover,.table-hover>tbody>tr.warning:hover>td{background-color:#faf2cc;border-color:#f8e5be}fieldset{padding:0;margin:0;border:0}legend{display:block;width:100%;padding:0;margin-bottom:20px;font-size:21px;line-height:inherit;color:#333;border:0;border-bottom:1px solid #e5e5e5}label{display:inline-block;margin-bottom:5px;font-weight:bold}input[type="search"]{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}input[type="radio"],input[type="checkbox"]{margin:4px 0 0;margin-top:1px \9;line-height:normal}input[type="file"]{display:block}select[multiple],select[size]{height:auto}select optgroup{font-family:inherit;font-size:inherit;font-style:inherit}input[type="file"]:focus,input[type="radio"]:focus,input[type="checkbox"]:focus{outline:thin dotted #333;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}input[type="number"]::-webkit-outer-spin-button,input[type="number"]::-webkit-inner-spin-button{height:auto}.form-control:-moz-placeholder{color:#999}.form-control::-moz-placeholder{color:#999}.form-control:-ms-input-placeholder{color:#999}.form-control::-webkit-input-placeholder{color:#999}.form-control{display:block;width:100%;height:38px;padding:8px 12px;font-size:14px;line-height:1.428571429;color:#555;vertical-align:middle;background-color:#fff;border:1px solid #ccc;border-radius:4px;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);-webkit-transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s}.form-control:focus{border-color:rgba(82,168,236,0.8);outline:0;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(82,168,236,0.6);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(82,168,236,0.6)}.form-control[disabled],.form-control[readonly],fieldset[disabled] .form-control{cursor:not-allowed;background-color:#eee}textarea.form-control{height:auto}.form-group{margin-bottom:15px}.radio,.checkbox{display:block;min-height:20px;padding-left:20px;margin-top:10px;margin-bottom:10px;vertical-align:middle}.radio label,.checkbox label{display:inline;margin-bottom:0;font-weight:normal;cursor:pointer}.radio input[type="radio"],.radio-inline input[type="radio"],.checkbox input[type="checkbox"],.checkbox-inline input[type="checkbox"]{float:left;margin-left:-20px}.radio+.radio,.checkbox+.checkbox{margin-top:-5px}.radio-inline,.checkbox-inline{display:inline-block;padding-left:20px;margin-bottom:0;font-weight:normal;vertical-align:middle;cursor:pointer}.radio-inline+.radio-inline,.checkbox-inline+.checkbox-inline{margin-top:0;margin-left:10px}.form-control.input-large{height:56px;padding:14px 16px;font-size:18px;border-radius:6px}.form-control.input-small{height:30px;padding:5px 10px;font-size:12px;border-radius:3px}select.input-large{height:56px;line-height:56px}select.input-small{height:30px;line-height:30px}.has-warning .help-block,.has-warning .control-label{color:#c09853}.has-warning .form-control{padding-right:32px;border-color:#c09853;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075)}.has-warning .form-control:focus{border-color:#a47e3c;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 6px #dbc59e;box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 6px #dbc59e}.has-warning .input-group-addon{color:#c09853;background-color:#fcf8e3;border-color:#c09853}.has-error .help-block,.has-error .control-label{color:#b94a48}.has-error .form-control{padding-right:32px;border-color:#b94a48;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075)}.has-error .form-control:focus{border-color:#953b39;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 6px #d59392;box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 6px #d59392}.has-error .input-group-addon{color:#b94a48;background-color:#f2dede;border-color:#b94a48}.has-success .help-block,.has-success .control-label{color:#468847}.has-success .form-control{padding-right:32px;border-color:#468847;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075)}.has-success .form-control:focus{border-color:#356635;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 6px #7aba7b;box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 6px #7aba7b}.has-success .input-group-addon{color:#468847;background-color:#dff0d8;border-color:#468847}.help-block{display:block;margin-top:5px;margin-bottom:10px;color:#737373}.input-group{display:table;border-collapse:separate}.input-group.col{float:none;padding-right:0;padding-left:0}.input-group .form-control{width:100%;margin-bottom:0}.input-group-addon,.input-group-btn,.input-group .form-control{display:table-cell}.input-group-addon:not(:first-child):not(:last-child),.input-group-btn:not(:first-child):not(:last-child),.input-group .form-control:not(:first-child):not(:last-child){border-radius:0}.input-group-addon,.input-group-btn{width:1%;white-space:nowrap;vertical-align:middle}.input-group-addon{padding:8px 12px;font-size:14px;font-weight:normal;line-height:1.428571429;text-align:center;background-color:#eee;border:1px solid #ccc;border-radius:4px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.input-group-addon.input-small{padding:5px 10px;font-size:12px;border-radius:3px}.input-group-addon.input-large{padding:14px 16px;font-size:18px;border-radius:6px}.input-group .form-control:first-child,.input-group-addon:first-child,.input-group-btn:first-child>.btn,.input-group-btn:first-child>.dropdown-toggle,.input-group-btn:last-child>.btn:not(:last-child):not(.dropdown-toggle){border-top-right-radius:0;border-bottom-right-radius:0}.input-group-addon:first-child{border-right:0}.input-group .form-control:last-child,.input-group-addon:last-child,.input-group-btn:last-child>.btn,.input-group-btn:last-child>.dropdown-toggle,.input-group-btn:first-child>.btn:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.input-group-addon:last-child{border-left:0}.input-group-btn{position:relative;white-space:nowrap}.input-group-btn>.btn{position:relative}.input-group-btn>.btn+.btn{margin-left:-4px}.input-group-btn>.btn:hover,.input-group-btn>.btn:active{z-index:2}.form-inline .form-control,.form-inline .radio,.form-inline .checkbox{display:inline-block}.form-inline .radio,.form-inline .checkbox{margin-top:0;margin-bottom:0}.form-horizontal .control-label{padding-top:6px}.form-horizontal .form-group:before,.form-horizontal .form-group:after{display:table;content:" "}.form-horizontal .form-group:after{clear:both}.form-horizontal .form-group:before,.form-horizontal .form-group:after{display:table;content:" "}.form-horizontal .form-group:after{clear:both}@media(min-width:768px){.form-horizontal .form-group{margin-right:-15px;margin-left:-15px}}.form-horizontal .form-group .row{margin-right:-15px;margin-left:-15px}@media(min-width:768px){.form-horizontal .control-label{text-align:right}}.btn{display:inline-block;padding:8px 12px;margin-bottom:0;font-size:14px;font-weight:500;line-height:1.428571429;text-align:center;white-space:nowrap;vertical-align:middle;cursor:pointer;border:1px solid transparent;border-radius:4px}.btn:focus{outline:thin dotted #333;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}.btn:hover,.btn:focus{color:#fff;text-decoration:none}.btn:active,.btn.active{outline:0;-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,0.125);box-shadow:inset 0 3px 5px rgba(0,0,0,0.125)}.btn.disabled,.btn[disabled],fieldset[disabled] .btn{pointer-events:none;cursor:default;opacity:.65;filter:alpha(opacity=65);-webkit-box-shadow:none;box-shadow:none}.btn-default{color:#fff;background-color:#474949;border-color:#474949}.btn-default:hover,.btn-default:focus,.btn-default:active,.btn-default.active{background-color:#3a3c3c;border-color:#2e2f2f}.btn-default.disabled,.btn-default[disabled],fieldset[disabled] .btn-default,.btn-default.disabled:hover,.btn-default[disabled]:hover,fieldset[disabled] .btn-default:hover,.btn-default.disabled:focus,.btn-default[disabled]:focus,fieldset[disabled] .btn-default:focus,.btn-default.disabled:active,.btn-default[disabled]:active,fieldset[disabled] .btn-default:active,.btn-default.disabled.active,.btn-default[disabled].active,fieldset[disabled] .btn-default.active{background-color:#474949;border-color:#474949}.btn-primary{color:#fff;background-color:#428bca;border-color:#428bca}.btn-primary:hover,.btn-primary:focus,.btn-primary:active,.btn-primary.active{background-color:#357ebd;border-color:#3071a9}.btn-primary.disabled,.btn-primary[disabled],fieldset[disabled] .btn-primary,.btn-primary.disabled:hover,.btn-primary[disabled]:hover,fieldset[disabled] .btn-primary:hover,.btn-primary.disabled:focus,.btn-primary[disabled]:focus,fieldset[disabled] .btn-primary:focus,.btn-primary.disabled:active,.btn-primary[disabled]:active,fieldset[disabled] .btn-primary:active,.btn-primary.disabled.active,.btn-primary[disabled].active,fieldset[disabled] .btn-primary.active{background-color:#428bca;border-color:#428bca}.btn-warning{color:#fff;background-color:#f0ad4e;border-color:#f0ad4e}.btn-warning:hover,.btn-warning:focus,.btn-warning:active,.btn-warning.active{background-color:#eea236;border-color:#ec971f}.btn-warning.disabled,.btn-warning[disabled],fieldset[disabled] .btn-warning,.btn-warning.disabled:hover,.btn-warning[disabled]:hover,fieldset[disabled] .btn-warning:hover,.btn-warning.disabled:focus,.btn-warning[disabled]:focus,fieldset[disabled] .btn-warning:focus,.btn-warning.disabled:active,.btn-warning[disabled]:active,fieldset[disabled] .btn-warning:active,.btn-warning.disabled.active,.btn-warning[disabled].active,fieldset[disabled] .btn-warning.active{background-color:#f0ad4e;border-color:#f0ad4e}.btn-danger{color:#fff;background-color:#d9534f;border-color:#d9534f}.btn-danger:hover,.btn-danger:focus,.btn-danger:active,.btn-danger.active{background-color:#d43f3a;border-color:#c9302c}.btn-danger.disabled,.btn-danger[disabled],fieldset[disabled] .btn-danger,.btn-danger.disabled:hover,.btn-danger[disabled]:hover,fieldset[disabled] .btn-danger:hover,.btn-danger.disabled:focus,.btn-danger[disabled]:focus,fieldset[disabled] .btn-danger:focus,.btn-danger.disabled:active,.btn-danger[disabled]:active,fieldset[disabled] .btn-danger:active,.btn-danger.disabled.active,.btn-danger[disabled].active,fieldset[disabled] .btn-danger.active{background-color:#d9534f;border-color:#d9534f}.btn-success{color:#fff;background-color:#5cb85c;border-color:#5cb85c}.btn-success:hover,.btn-success:focus,.btn-success:active,.btn-success.active{background-color:#4cae4c;border-color:#449d44}.btn-success.disabled,.btn-success[disabled],fieldset[disabled] .btn-success,.btn-success.disabled:hover,.btn-success[disabled]:hover,fieldset[disabled] .btn-success:hover,.btn-success.disabled:focus,.btn-success[disabled]:focus,fieldset[disabled] .btn-success:focus,.btn-success.disabled:active,.btn-success[disabled]:active,fieldset[disabled] .btn-success:active,.btn-success.disabled.active,.btn-success[disabled].active,fieldset[disabled] .btn-success.active{background-color:#5cb85c;border-color:#5cb85c}.btn-info{color:#fff;background-color:#5bc0de;border-color:#5bc0de}.btn-info:hover,.btn-info:focus,.btn-info:active,.btn-info.active{background-color:#46b8da;border-color:#31b0d5}.btn-info.disabled,.btn-info[disabled],fieldset[disabled] .btn-info,.btn-info.disabled:hover,.btn-info[disabled]:hover,fieldset[disabled] .btn-info:hover,.btn-info.disabled:focus,.btn-info[disabled]:focus,fieldset[disabled] .btn-info:focus,.btn-info.disabled:active,.btn-info[disabled]:active,fieldset[disabled] .btn-info:active,.btn-info.disabled.active,.btn-info[disabled].active,fieldset[disabled] .btn-info.active{background-color:#5bc0de;border-color:#5bc0de}.btn-link{font-weight:normal;color:#428bca;cursor:pointer;border-radius:0}.btn-link,.btn-link:active,.btn-link[disabled],fieldset[disabled] .btn-link{background-color:transparent;-webkit-box-shadow:none;box-shadow:none}.btn-link,.btn-link:hover,.btn-link:focus,.btn-link:active{border-color:transparent}.btn-link:hover,.btn-link:focus{color:#2a6496;text-decoration:underline;background-color:transparent}.btn-link[disabled]:hover,fieldset[disabled] .btn-link:hover,.btn-link[disabled]:focus,fieldset[disabled] .btn-link:focus{color:#333;text-decoration:none}.btn-large{padding:14px 16px;font-size:18px;border-radius:6px}.btn-small{padding:5px 10px;font-size:12px;line-height:1.5;border-radius:3px}.btn-block{display:block;width:100%;padding-right:0;padding-left:0}.btn-block+.btn-block{margin-top:5px}input[type="submit"].btn-block,input[type="reset"].btn-block,input[type="button"].btn-block{width:100%}.fade{opacity:0;-webkit-transition:opacity .15s linear;transition:opacity .15s linear}.fade.in{opacity:1}.collapse{display:none}.collapse.in{display:block}.collapsing{position:relative;height:0;overflow:hidden;-webkit-transition:height .35s ease;transition:height .35s ease}.caret{display:inline-block;width:0;height:0;margin-left:2px;vertical-align:middle;border-top:4px solid #000;border-right:4px solid transparent;border-left:4px solid transparent;content:""}.dropdown-menu{position:absolute;top:100%;left:0;z-index:1000;display:none;float:left;min-width:160px;padding:5px 0;margin:2px 0 0;list-style:none;background-color:#fff;border:1px solid #ccc;border:1px solid rgba(0,0,0,0.15);border-radius:4px;-webkit-box-shadow:0 6px 12px rgba(0,0,0,0.175);box-shadow:0 6px 12px rgba(0,0,0,0.175);background-clip:padding-box}.dropdown-menu.pull-right{right:0;left:auto}.dropdown-menu .divider{height:1px;margin:9px 0;overflow:hidden;background-color:#e5e5e5}.dropdown-menu>li>a{display:block;padding:3px 20px;clear:both;font-weight:normal;line-height:1.428571429;color:#333;white-space:nowrap}.dropdown-menu>li>a:hover,.dropdown-menu>li>a:focus{color:#fff;text-decoration:none;background-color:#357ebd;background-image:-webkit-gradient(linear,left 0,left 100%,from(#428bca),to(#357ebd));background-image:-webkit-linear-gradient(top,#428bca,0%,#357ebd,100%);background-image:-moz-linear-gradient(top,#428bca 0,#357ebd 100%);background-image:linear-gradient(to bottom,#428bca 0,#357ebd 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca',endColorstr='#ff357ebd',GradientType=0)}.dropdown-menu>.active>a,.dropdown-menu>.active>a:hover,.dropdown-menu>.active>a:focus{color:#fff;text-decoration:none;background-color:#357ebd;background-image:-webkit-gradient(linear,left 0,left 100%,from(#428bca),to(#357ebd));background-image:-webkit-linear-gradient(top,#428bca,0%,#357ebd,100%);background-image:-moz-linear-gradient(top,#428bca 0,#357ebd 100%);background-image:linear-gradient(to bottom,#428bca 0,#357ebd 100%);background-repeat:repeat-x;outline:0;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca',endColorstr='#ff357ebd',GradientType=0)}.dropdown-menu>.disabled>a,.dropdown-menu>.disabled>a:hover,.dropdown-menu>.disabled>a:focus{color:#999}.dropdown-menu>.disabled>a:hover,.dropdown-menu>.disabled>a:focus{text-decoration:none;cursor:not-allowed;background-color:transparent;background-image:none;filter:progid:DXImageTransform.Microsoft.gradient(enabled=false)}.open>.dropdown-menu{display:block}.open>a{outline:0}.dropdown-header{display:block;padding:3px 20px;font-size:12px;line-height:1.428571429;color:#999}.dropdown-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:990}.pull-right>.dropdown-menu{right:0;left:auto}.dropup .caret,.navbar-fixed-bottom .dropdown .caret{border-top:0;border-bottom:4px solid #000;content:""}.dropup .dropdown-menu,.navbar-fixed-bottom .dropdown .dropdown-menu{top:auto;bottom:100%;margin-bottom:1px}.list-group{padding-left:0;margin-bottom:20px;background-color:#fff}.list-group-item{position:relative;display:block;padding:10px 30px 10px 15px;margin-bottom:-1px;border:1px solid #ddd}.list-group-item:first-child{border-top-right-radius:4px;border-top-left-radius:4px}.list-group-item:last-child{margin-bottom:0;border-bottom-right-radius:4px;border-bottom-left-radius:4px}.list-group-item>.badge{float:right;margin-right:-15px}.list-group-item-heading{margin-top:0;margin-bottom:5px}.list-group-item-text{margin-bottom:0;line-height:1.3}a.list-group-item .list-group-item-heading{color:#333}a.list-group-item .list-group-item-text{color:#555}a.list-group-item:hover,a.list-group-item:focus{text-decoration:none;background-color:#f5f5f5}a.list-group-item.active{z-index:2;color:#fff;background-color:#428bca;border-color:#428bca}a.list-group-item.active .list-group-item-heading{color:inherit}a.list-group-item.active .list-group-item-text{color:#e1edf7}.panel{padding:15px;margin-bottom:20px;background-color:#fff;border:1px solid #ddd;border-radius:4px;-webkit-box-shadow:0 1px 1px rgba(0,0,0,0.05);box-shadow:0 1px 1px rgba(0,0,0,0.05)}.panel-heading{padding:10px 15px;margin:-15px -15px 15px;background-color:#f5f5f5;border-bottom:1px solid #ddd;border-top-right-radius:3px;border-top-left-radius:3px}.panel-title{margin-top:0;margin-bottom:0;font-size:17.5px;font-weight:500}.panel-footer{padding:10px 15px;margin:15px -15px -15px;background-color:#f5f5f5;border-top:1px solid #ddd;border-bottom-right-radius:3px;border-bottom-left-radius:3px}.panel-primary{border-color:#428bca}.panel-primary .panel-heading{color:#fff;background-color:#428bca;border-color:#428bca}.panel-success{border-color:#d6e9c6}.panel-success .panel-heading{color:#468847;background-color:#dff0d8;border-color:#d6e9c6}.panel-warning{border-color:#fbeed5}.panel-warning .panel-heading{color:#c09853;background-color:#fcf8e3;border-color:#fbeed5}.panel-danger{border-color:#eed3d7}.panel-danger .panel-heading{color:#b94a48;background-color:#f2dede;border-color:#eed3d7}.panel-info{border-color:#bce8f1}.panel-info .panel-heading{color:#3a87ad;background-color:#d9edf7;border-color:#bce8f1}.list-group-flush{margin:15px -15px -15px}.list-group-flush .list-group-item{border-width:1px 0}.list-group-flush .list-group-item:first-child{border-top-right-radius:0;border-top-left-radius:0}.list-group-flush .list-group-item:last-child{border-bottom:0}.well{min-height:20px;padding:19px;margin-bottom:20px;background-color:#f5f5f5;border:1px solid #e3e3e3;border-radius:4px;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.05);box-shadow:inset 0 1px 1px rgba(0,0,0,0.05)}.well blockquote{border-color:#ddd;border-color:rgba(0,0,0,0.15)}.well-large{padding:24px;border-radius:6px}.well-small{padding:9px;border-radius:3px}.close{float:right;font-size:21px;font-weight:bold;line-height:1;color:#000;text-shadow:0 1px 0 #fff;opacity:.2;filter:alpha(opacity=20)}.close:hover,.close:focus{color:#000;text-decoration:none;cursor:pointer;opacity:.5;filter:alpha(opacity=50)}button.close{padding:0;cursor:pointer;background:transparent;border:0;-webkit-appearance:none}.nav{padding-left:0;margin-bottom:0;list-style:none}.nav:before,.nav:after{display:table;content:" "}.nav:after{clear:both}.nav:before,.nav:after{display:table;content:" "}.nav:after{clear:both}.nav>li{position:relative;display:block}.nav>li>a{position:relative;display:block;padding:10px 15px}.nav>li>a:hover,.nav>li>a:focus{text-decoration:none;background-color:#eee}.nav>li.disabled>a{color:#999}.nav>li.disabled>a:hover,.nav>li.disabled>a:focus{color:#999;text-decoration:none;cursor:not-allowed;background-color:transparent}.nav>li+.nav-header{margin-top:9px}.nav.open>a,.nav.open>a:hover,.nav.open>a:focus{color:#fff;background-color:#428bca;border-color:#428bca}.nav.open>a .caret,.nav.open>a:hover .caret,.nav.open>a:focus .caret{border-top-color:#fff;border-bottom-color:#fff}.nav>.pull-right{float:right}.nav .nav-divider{height:1px;margin:9px 0;overflow:hidden;background-color:#e5e5e5}.nav-tabs{border-bottom:1px solid #ddd}.nav-tabs>li{float:left;margin-bottom:-1px}.nav-tabs>li>a{margin-right:2px;line-height:1.428571429;border:1px solid transparent;border-radius:4px 4px 0 0}.nav-tabs>li>a:hover{border-color:#eee}.nav-tabs>li.active>a,.nav-tabs>li.active>a:hover,.nav-tabs>li.active>a:focus{color:#555;cursor:default;background-color:#fff;border:1px solid #ddd;border-bottom-color:transparent}.nav-tabs.nav-justified{width:100%;border-bottom:0}.nav-tabs.nav-justified>li{display:table-cell;float:none;width:1%}.nav-tabs.nav-justified>li>a{text-align:center}.nav-tabs.nav-justified>li>a{margin-right:0;border-bottom:1px solid #ddd}.nav-tabs.nav-justified>.active>a{border-bottom-color:#fff}.nav-pills>li{float:left}.nav-pills>li>a{border-radius:5px}.nav-pills>li+li{margin-left:2px}.nav-pills>li.active>a,.nav-pills>li.active>a:hover,.nav-pills>li.active>a:focus{color:#fff;background-color:#428bca}.nav-stacked>li{float:none}.nav-stacked>li+li>a{margin-top:2px;margin-left:0}.nav-justified{width:100%}.nav-justified>li{display:table-cell;float:none;width:1%}.nav-justified>li>a{text-align:center}.nav-tabs-justified{border-bottom:0}.nav-tabs-justified>li>a{margin-right:0;border-bottom:1px solid #ddd}.nav-tabs-justified>.active>a{border-bottom-color:#fff}.tabbable:before,.tabbable:after{display:table;content:" "}.tabbable:after{clear:both}.tabbable:before,.tabbable:after{display:table;content:" "}.tabbable:after{clear:both}.tab-content>.tab-pane,.pill-content>.pill-pane{display:none}.tab-content>.active,.pill-content>.active{display:block}.nav .caret{border-top-color:#428bca;border-bottom-color:#428bca}.nav a:hover .caret{border-top-color:#2a6496;border-bottom-color:#2a6496}.nav-tabs .dropdown-menu{margin-top:-1px;border-top-right-radius:0;border-top-left-radius:0}.navbar{position:relative;min-height:50px;padding-right:15px;padding-left:15px;margin-bottom:20px;background-color:#eee;border-radius:4px}.navbar:before,.navbar:after{display:table;content:" "}.navbar:after{clear:both}.navbar:before,.navbar:after{display:table;content:" "}.navbar:after{clear:both}.navbar-nav{margin-top:10px;margin-bottom:15px}.navbar-nav>li>a{padding-top:15px;padding-bottom:15px;line-height:20px;color:#777;border-radius:4px}.navbar-nav>li>a:hover,.navbar-nav>li>a:focus{color:#333;background-color:transparent}.navbar-nav>.active>a,.navbar-nav>.active>a:hover,.navbar-nav>.active>a:focus{color:#555;background-color:#d5d5d5}.navbar-nav>.disabled>a,.navbar-nav>.disabled>a:hover,.navbar-nav>.disabled>a:focus{color:#ccc;background-color:transparent}.navbar-nav.pull-right{width:100%}.navbar-static-top{border-radius:0}.navbar-fixed-top,.navbar-fixed-bottom{position:fixed;right:0;left:0;z-index:1030;border-radius:0}.navbar-fixed-top{top:0}.navbar-fixed-bottom{bottom:0;margin-bottom:0}.navbar-brand{display:block;max-width:200px;padding:15px 15px;margin-right:auto;margin-left:auto;font-size:18px;font-weight:500;line-height:20px;color:#777;text-align:center}.navbar-brand:hover,.navbar-brand:focus{color:#5e5e5e;text-decoration:none;background-color:transparent}.navbar-toggle{position:absolute;top:9px;right:10px;width:48px;height:32px;padding:8px 12px;background-color:transparent;border:1px solid #ddd;border-radius:4px}.navbar-toggle:hover,.navbar-toggle:focus{background-color:#ddd}.navbar-toggle .icon-bar{display:block;width:22px;height:2px;background-color:#ccc;border-radius:1px}.navbar-toggle .icon-bar+.icon-bar{margin-top:4px}.navbar-form{margin-top:6px;margin-bottom:6px}.navbar-form .form-control,.navbar-form .radio,.navbar-form .checkbox{display:inline-block}.navbar-form .radio,.navbar-form .checkbox{margin-top:0;margin-bottom:0}.navbar-nav>li>.dropdown-menu{margin-top:0;border-top-right-radius:0;border-top-left-radius:0}.navbar-fixed-bottom .navbar-nav>li>.dropdown-menu{border-bottom-right-radius:0;border-bottom-left-radius:0}.navbar-nav>.dropdown>a:hover .caret,.navbar-nav>.dropdown>a:focus .caret{border-top-color:#333;border-bottom-color:#333}.navbar-nav>.open>a,.navbar-nav>.open>a:hover,.navbar-nav>.open>a:focus{color:#555;background-color:#d5d5d5}.navbar-nav>.open>a .caret,.navbar-nav>.open>a:hover .caret,.navbar-nav>.open>a:focus .caret{border-top-color:#555;border-bottom-color:#555}.navbar-nav>.dropdown>a .caret{border-top-color:#777;border-bottom-color:#777}.navbar-nav.pull-right>li>.dropdown-menu,.navbar-nav>li>.dropdown-menu.pull-right{right:0;left:auto}.navbar-inverse{background-color:#222}.navbar-inverse .navbar-brand{color:#999}.navbar-inverse .navbar-brand:hover,.navbar-inverse .navbar-brand:focus{color:#fff;background-color:transparent}.navbar-inverse .navbar-text{color:#999}.navbar-inverse .navbar-nav>li>a{color:#999}.navbar-inverse .navbar-nav>li>a:hover,.navbar-inverse .navbar-nav>li>a:focus{color:#fff;background-color:transparent}.navbar-inverse .navbar-nav>.active>a,.navbar-inverse .navbar-nav>.active>a:hover,.navbar-inverse .navbar-nav>.active>a:focus{color:#fff;background-color:#080808}.navbar-inverse .navbar-nav>.disabled>a,.navbar-inverse .navbar-nav>.disabled>a:hover,.navbar-inverse .navbar-nav>.disabled>a:focus{color:#444;background-color:transparent}.navbar-inverse .navbar-toggle{border-color:#333}.navbar-inverse .navbar-toggle:hover,.navbar-inverse .navbar-toggle:focus{background-color:#333}.navbar-inverse .navbar-toggle .icon-bar{background-color:#fff}.navbar-inverse .navbar-nav>.open>a,.navbar-inverse .navbar-nav>.open>a:hover,.navbar-inverse .navbar-nav>.open>a:focus{color:#fff;background-color:#080808}.navbar-inverse .navbar-nav>.dropdown>a:hover .caret{border-top-color:#fff;border-bottom-color:#fff}.navbar-inverse .navbar-nav>.dropdown>a .caret{border-top-color:#999;border-bottom-color:#999}.navbar-inverse .navbar-nav>.open>a .caret,.navbar-inverse .navbar-nav>.open>a:hover .caret,.navbar-inverse .navbar-nav>.open>a:focus .caret{border-top-color:#fff;border-bottom-color:#fff}@media screen and (min-width:768px){.navbar-brand{float:left;margin-right:5px;margin-left:-15px}.navbar-nav{float:left;margin-top:0;margin-bottom:0}.navbar-nav>li{float:left}.navbar-nav>li>a{border-radius:0}.navbar-nav.pull-right{float:right;width:auto}.navbar-toggle{position:relative;top:auto;left:auto;display:none}.nav-collapse.collapse{display:block!important;height:auto!important;overflow:visible!important}}.navbar-btn{margin-top:6px}.navbar-text{margin-top:15px;margin-bottom:15px}.navbar-link{color:#777}.navbar-link:hover{color:#333}.navbar-inverse .navbar-link{color:#999}.navbar-inverse .navbar-link:hover{color:#fff}.btn .caret{border-top-color:#fff}.dropup .btn .caret{border-bottom-color:#fff}.btn-group,.btn-group-vertical{position:relative;display:inline-block;vertical-align:middle}.btn-group>.btn,.btn-group-vertical>.btn{position:relative;float:left}.btn-group>.btn:hover,.btn-group-vertical>.btn:hover,.btn-group>.btn:active,.btn-group-vertical>.btn:active{z-index:2}.btn-group .btn+.btn{margin-left:-1px}.btn-toolbar:before,.btn-toolbar:after{display:table;content:" "}.btn-toolbar:after{clear:both}.btn-toolbar:before,.btn-toolbar:after{display:table;content:" "}.btn-toolbar:after{clear:both}.btn-toolbar .btn-group{float:left}.btn-toolbar>.btn+.btn,.btn-toolbar>.btn-group+.btn,.btn-toolbar>.btn+.btn-group,.btn-toolbar>.btn-group+.btn-group{margin-left:5px}.btn-group>.btn:not(:first-child):not(:last-child):not(.dropdown-toggle){border-radius:0}.btn-group>.btn:first-child{margin-left:0}.btn-group>.btn:first-child:not(:last-child):not(.dropdown-toggle){border-top-right-radius:0;border-bottom-right-radius:0}.btn-group>.btn:last-child:not(:first-child),.btn-group>.dropdown-toggle:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.btn-group>.btn-group{float:left}.btn-group>.btn-group:not(:first-child):not(:last-child)>.btn{border-radius:0}.btn-group>.btn-group:first-child>.btn:last-child,.btn-group>.btn-group:first-child>.dropdown-toggle{border-top-right-radius:0;border-bottom-right-radius:0}.btn-group>.btn-group:last-child>.btn:first-child{border-bottom-left-radius:0;border-top-left-radius:0}.btn-group .dropdown-toggle:active,.btn-group.open .dropdown-toggle{outline:0}.btn-group>.btn+.dropdown-toggle{padding-right:8px;padding-left:8px}.btn-group>.btn-large+.dropdown-toggle{padding-right:12px;padding-left:12px}.btn-group.open .dropdown-toggle{-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,0.125);box-shadow:inset 0 3px 5px rgba(0,0,0,0.125)}.btn .caret{margin-left:0}.btn-large .caret{border-width:5px}.dropup .btn-large .caret{border-bottom-width:5px}.btn-group-vertical>.btn{display:block;float:none;width:100%;max-width:100%}.btn-group-vertical>.btn+.btn{margin-top:-1px}.btn-group-vertical .btn:not(:first-child):not(:last-child){border-radius:0}.btn-group-vertical .btn:first-child{border-bottom-right-radius:0;border-bottom-left-radius:0}.btn-group-vertical .btn:last-child{border-top-right-radius:0;border-top-left-radius:0}.btn-group-justified{display:table;width:100%}.btn-group-justified .btn{display:table-cell;float:none;width:1%}.btn-group[data-toggle="buttons"]>.btn>input[type="radio"],.btn-group[data-toggle="buttons"]>.btn>input[type="checkbox"]{display:none}.breadcrumb{padding:8px 15px;margin-bottom:20px;list-style:none;background-color:#f5f5f5;border-radius:4px}.breadcrumb>li{display:inline-block}.breadcrumb>li+li:before{padding:0 5px;color:#ccc;content:"/\00a0"}.breadcrumb>.active{color:#999}.pagination{display:inline-block;padding-left:0;margin:20px 0;border-radius:4px}.pagination>li{display:inline}.pagination>li>a,.pagination>li>span{float:left;padding:4px 12px;line-height:1.428571429;text-decoration:none;background-color:#fff;border:1px solid #ddd;border-left-width:0}.pagination>li:first-child>a,.pagination>li:first-child>span{border-left-width:1px;border-bottom-left-radius:4px;border-top-left-radius:4px}.pagination>li:last-child>a,.pagination>li:last-child>span{border-top-right-radius:4px;border-bottom-right-radius:4px}.pagination>li>a:hover,.pagination>li>a:focus,.pagination>.active>a,.pagination>.active>span{background-color:#f5f5f5}.pagination>.active>a,.pagination>.active>span{color:#999;cursor:default}.pagination>.disabled>span,.pagination>.disabled>a,.pagination>.disabled>a:hover,.pagination>.disabled>a:focus{color:#999;cursor:not-allowed;background-color:#fff}.pagination-large>li>a,.pagination-large>li>span{padding:14px 16px;font-size:18px}.pagination-large>li:first-child>a,.pagination-large>li:first-child>span{border-bottom-left-radius:6px;border-top-left-radius:6px}.pagination-large>li:last-child>a,.pagination-large>li:last-child>span{border-top-right-radius:6px;border-bottom-right-radius:6px}.pagination-small>li>a,.pagination-small>li>span{padding:5px 10px;font-size:12px}.pagination-small>li:first-child>a,.pagination-small>li:first-child>span{border-bottom-left-radius:3px;border-top-left-radius:3px}.pagination-small>li:last-child>a,.pagination-small>li:last-child>span{border-top-right-radius:3px;border-bottom-right-radius:3px}.pager{padding-left:0;margin:20px 0;text-align:center;list-style:none}.pager:before,.pager:after{display:table;content:" "}.pager:after{clear:both}.pager:before,.pager:after{display:table;content:" "}.pager:after{clear:both}.pager li{display:inline}.pager li>a,.pager li>span{display:inline-block;padding:5px 14px;background-color:#fff;border:1px solid #ddd;border-radius:15px}.pager li>a:hover,.pager li>a:focus{text-decoration:none;background-color:#f5f5f5}.pager .next>a,.pager .next>span{float:right}.pager .previous>a,.pager .previous>span{float:left}.pager .disabled>a,.pager .disabled>a:hover,.pager .disabled>a:focus,.pager .disabled>span{color:#999;cursor:not-allowed;background-color:#fff}.modal-open{overflow:hidden}.modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1040;display:none;overflow:auto;overflow-y:scroll}.modal.fade .modal-dialog{-webkit-transform:translate(0,-25%);-ms-transform:translate(0,-25%);transform:translate(0,-25%);-webkit-transition:-webkit-transform .3s ease-out;-moz-transition:-moz-transform .3s ease-out;-o-transition:-o-transform .3s ease-out;transition:transform .3s ease-out}.modal.fade.in .modal-dialog{-webkit-transform:translate(0,0);-ms-transform:translate(0,0);transform:translate(0,0)}.modal-dialog{position:relative;top:0;right:0;left:0;z-index:1050;width:auto;padding:10px}.modal-content{position:relative;background-color:#fff;border:1px solid #999;border:1px solid rgba(0,0,0,0.2);border-radius:6px;outline:0;-webkit-box-shadow:0 3px 9px rgba(0,0,0,0.5);box-shadow:0 3px 9px rgba(0,0,0,0.5);background-clip:padding-box}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1030;background-color:#000}.modal-backdrop.fade{opacity:0;filter:alpha(opacity=0)}.modal-backdrop.fade.in{opacity:.5;filter:alpha(opacity=50)}.modal-header{min-height:16.428571429px;padding:15px;border-bottom:1px solid #e5e5e5}.modal-header .close{margin-top:-2px}.modal-title{margin:0;line-height:1.428571429}.modal-body{position:relative;padding:20px}.modal-footer{padding:19px 20px 20px;margin-top:15px;text-align:right;border-top:1px solid #e5e5e5}.modal-footer:before,.modal-footer:after{display:table;content:" "}.modal-footer:after{clear:both}.modal-footer:before,.modal-footer:after{display:table;content:" "}.modal-footer:after{clear:both}.modal-footer .btn+.btn{margin-bottom:0;margin-left:5px}.modal-footer .btn-group .btn+.btn{margin-left:-1px}.modal-footer .btn-block+.btn-block{margin-left:0}@media screen and (min-width:768px){.modal-dialog{right:auto;left:50%;width:560px;padding-top:30px;padding-bottom:30px;margin-left:-280px}.modal-content{-webkit-box-shadow:0 5px 15px rgba(0,0,0,0.5);box-shadow:0 5px 15px rgba(0,0,0,0.5)}}.tooltip{position:absolute;z-index:1030;display:block;font-size:12px;line-height:1.4;opacity:0;filter:alpha(opacity=0);visibility:visible}.tooltip.in{opacity:1;filter:alpha(opacity=100)}.tooltip.top{padding:5px 0;margin-top:-3px}.tooltip.right{padding:0 5px;margin-left:3px}.tooltip.bottom{padding:5px 0;margin-top:3px}.tooltip.left{padding:0 5px;margin-left:-3px}.tooltip-inner{max-width:200px;padding:3px 8px;color:#fff;text-align:center;text-decoration:none;background-color:rgba(0,0,0,0.9);border-radius:4px}.tooltip-arrow{position:absolute;width:0;height:0;border-color:transparent;border-style:solid}.tooltip.top .tooltip-arrow{bottom:0;left:50%;margin-left:-5px;border-top-color:rgba(0,0,0,0.9);border-width:5px 5px 0}.tooltip.top-left .tooltip-arrow{bottom:0;left:5px;border-top-color:rgba(0,0,0,0.9);border-width:5px 5px 0}.tooltip.top-right .tooltip-arrow{right:5px;bottom:0;border-top-color:rgba(0,0,0,0.9);border-width:5px 5px 0}.tooltip.right .tooltip-arrow{top:50%;left:0;margin-top:-5px;border-right-color:rgba(0,0,0,0.9);border-width:5px 5px 5px 0}.tooltip.left .tooltip-arrow{top:50%;right:0;margin-top:-5px;border-left-color:rgba(0,0,0,0.9);border-width:5px 0 5px 5px}.tooltip.bottom .tooltip-arrow{top:0;left:50%;margin-left:-5px;border-bottom-color:rgba(0,0,0,0.9);border-width:0 5px 5px}.tooltip.bottom-left .tooltip-arrow{top:0;left:5px;border-bottom-color:rgba(0,0,0,0.9);border-width:0 5px 5px}.tooltip.bottom-right .tooltip-arrow{top:0;right:5px;border-bottom-color:rgba(0,0,0,0.9);border-width:0 5px 5px}.popover{position:absolute;top:0;left:0;z-index:1010;display:none;max-width:276px;padding:1px;text-align:left;white-space:normal;background-color:#fff;border:1px solid #ccc;border:1px solid rgba(0,0,0,0.2);border-radius:6px;-webkit-box-shadow:0 5px 10px rgba(0,0,0,0.2);box-shadow:0 5px 10px rgba(0,0,0,0.2);background-clip:padding-box;-webkit-bg-clip:padding-box;-moz-bg-clip:padding}.popover.top{margin-top:-10px}.popover.right{margin-left:10px}.popover.bottom{margin-top:10px}.popover.left{margin-left:-10px}.popover-title{padding:8px 14px;margin:0;font-size:14px;font-weight:normal;line-height:18px;background-color:#f7f7f7;border-bottom:1px solid #ebebeb;border-radius:5px 5px 0 0}.popover-content{padding:9px 14px}.popover .arrow,.popover .arrow:after{position:absolute;display:block;width:0;height:0;border-color:transparent;border-style:solid}.popover .arrow{border-width:11px}.popover .arrow:after{border-width:10px;content:""}.popover.top .arrow{bottom:-11px;left:50%;margin-left:-11px;border-top-color:#999;border-top-color:rgba(0,0,0,0.25);border-bottom-width:0}.popover.top .arrow:after{bottom:1px;margin-left:-10px;border-top-color:#fff;border-bottom-width:0;content:" "}.popover.right .arrow{top:50%;left:-11px;margin-top:-11px;border-right-color:#999;border-right-color:rgba(0,0,0,0.25);border-left-width:0}.popover.right .arrow:after{bottom:-10px;left:1px;border-right-color:#fff;border-left-width:0;content:" "}.popover.bottom .arrow{top:-11px;left:50%;margin-left:-11px;border-bottom-color:#999;border-bottom-color:rgba(0,0,0,0.25);border-top-width:0}.popover.bottom .arrow:after{top:1px;margin-left:-10px;border-bottom-color:#fff;border-top-width:0;content:" "}.popover.left .arrow{top:50%;right:-11px;margin-top:-11px;border-left-color:#999;border-left-color:rgba(0,0,0,0.25);border-right-width:0}.popover.left .arrow:after{right:1px;bottom:-10px;border-left-color:#fff;border-right-width:0;content:" "}.alert{padding:10px 35px 10px 15px;margin-bottom:20px;color:#c09853;background-color:#fcf8e3;border:1px solid #fbeed5;border-radius:4px}.alert h4{margin-top:0;color:inherit}.alert hr{border-top-color:#f8e5be}.alert .alert-link{font-weight:500;color:#a47e3c}.alert .close{position:relative;top:-2px;right:-21px;color:inherit}.alert-success{color:#468847;background-color:#dff0d8;border-color:#d6e9c6}.alert-success hr{border-top-color:#c9e2b3}.alert-success .alert-link{color:#356635}.alert-danger{color:#b94a48;background-color:#f2dede;border-color:#eed3d7}.alert-danger hr{border-top-color:#e6c1c7}.alert-danger .alert-link{color:#953b39}.alert-info{color:#3a87ad;background-color:#d9edf7;border-color:#bce8f1}.alert-info hr{border-top-color:#a6e1ec}.alert-info .alert-link{color:#2d6987}.alert-block{padding-top:15px;padding-bottom:15px}.alert-block>p,.alert-block>ul{margin-bottom:0}.alert-block p+p{margin-top:5px}.thumbnail,.img-thumbnail{padding:4px;line-height:1.428571429;background-color:#fff;border:1px solid #ddd;border-radius:4px;-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out}.thumbnail{display:block}.thumbnail>img,.img-thumbnail{display:inline-block;height:auto;max-width:100%}a.thumbnail:hover,a.thumbnail:focus{border-color:#428bca}.thumbnail>img{margin-right:auto;margin-left:auto}.thumbnail .caption{padding:9px;color:#333}.media,.media-body{overflow:hidden;zoom:1}.media,.media .media{margin-top:15px}.media:first-child{margin-top:0}.media-object{display:block}.media-heading{margin:0 0 5px}.media>.pull-left{margin-right:10px}.media>.pull-right{margin-left:10px}.media-list{padding-left:0;list-style:none}.label{display:inline;padding:.25em .6em;font-size:75%;font-weight:500;line-height:1;color:#fff;text-align:center;white-space:nowrap;vertical-align:middle;background-color:#999;border-radius:.25em}.label[href]:hover,.label[href]:focus{color:#fff;text-decoration:none;cursor:pointer;background-color:#808080}.label-danger{background-color:#d9534f}.label-danger[href]:hover,.label-danger[href]:focus{background-color:#c9302c}.label-success{background-color:#5cb85c}.label-success[href]:hover,.label-success[href]:focus{background-color:#449d44}.label-warning{background-color:#f0ad4e}.label-warning[href]:hover,.label-warning[href]:focus{background-color:#ec971f}.label-info{background-color:#5bc0de}.label-info[href]:hover,.label-info[href]:focus{background-color:#31b0d5}.badge{display:inline-block;min-width:10px;padding:3px 7px;font-size:12px;font-weight:bold;line-height:1;color:#fff;text-align:center;white-space:nowrap;vertical-align:middle;background-color:#999;border-radius:10px}.badge:empty{display:none}a.badge:hover,a.badge:focus{color:#fff;text-decoration:none;cursor:pointer}.btn .badge{position:relative;top:-1px}a.list-group-item.active>.badge,.nav-pills>.active>a>.badge{color:#428bca;background-color:#fff}.nav-pills>li>a>.badge{margin-left:3px}@-webkit-keyframes progress-bar-stripes{from{background-position:40px 0}to{background-position:0 0}}@-moz-keyframes progress-bar-stripes{from{background-position:40px 0}to{background-position:0 0}}@-ms-keyframes progress-bar-stripes{from{background-position:40px 0}to{background-position:0 0}}@-o-keyframes progress-bar-stripes{from{background-position:0 0}to{background-position:40px 0}}@keyframes progress-bar-stripes{from{background-position:40px 0}to{background-position:0 0}}.progress{height:20px;margin-bottom:20px;overflow:hidden;background-color:#f5f5f5;border-radius:4px;-webkit-box-shadow:inset 0 1px 2px rgba(0,0,0,0.1);box-shadow:inset 0 1px 2px rgba(0,0,0,0.1)}.progress-bar{float:left;width:0;height:100%;font-size:12px;color:#fff;text-align:center;background-color:#428bca;-webkit-box-shadow:inset 0 -1px 0 rgba(0,0,0,0.15);box-shadow:inset 0 -1px 0 rgba(0,0,0,0.15);-webkit-transition:width .6s ease;transition:width .6s ease}.progress-striped .progress-bar{background-color:#428bca;background-image:-webkit-gradient(linear,0 100%,100% 0,color-stop(0.25,rgba(255,255,255,0.15)),color-stop(0.25,transparent),color-stop(0.5,transparent),color-stop(0.5,rgba(255,255,255,0.15)),color-stop(0.75,rgba(255,255,255,0.15)),color-stop(0.75,transparent),to(transparent));background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image:-moz-linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image:linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-size:40px 40px}.progress.active .progress-bar{-webkit-animation:progress-bar-stripes 2s linear infinite;-moz-animation:progress-bar-stripes 2s linear infinite;-ms-animation:progress-bar-stripes 2s linear infinite;-o-animation:progress-bar-stripes 2s linear infinite;animation:progress-bar-stripes 2s linear infinite}.progress-bar-danger{background-color:#d9534f}.progress-striped .progress-bar-danger{background-color:#d9534f;background-image:-webkit-gradient(linear,0 100%,100% 0,color-stop(0.25,rgba(255,255,255,0.15)),color-stop(0.25,transparent),color-stop(0.5,transparent),color-stop(0.5,rgba(255,255,255,0.15)),color-stop(0.75,rgba(255,255,255,0.15)),color-stop(0.75,transparent),to(transparent));background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image:-moz-linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image:linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent)}.progress-bar-success{background-color:#5cb85c}.progress-striped .progress-bar-success{background-color:#5cb85c;background-image:-webkit-gradient(linear,0 100%,100% 0,color-stop(0.25,rgba(255,255,255,0.15)),color-stop(0.25,transparent),color-stop(0.5,transparent),color-stop(0.5,rgba(255,255,255,0.15)),color-stop(0.75,rgba(255,255,255,0.15)),color-stop(0.75,transparent),to(transparent));background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image:-moz-linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image:linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent)}.progress-bar-warning{background-color:#f0ad4e}.progress-striped .progress-bar-warning{background-color:#f0ad4e;background-image:-webkit-gradient(linear,0 100%,100% 0,color-stop(0.25,rgba(255,255,255,0.15)),color-stop(0.25,transparent),color-stop(0.5,transparent),color-stop(0.5,rgba(255,255,255,0.15)),color-stop(0.75,rgba(255,255,255,0.15)),color-stop(0.75,transparent),to(transparent));background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image:-moz-linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image:linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent)}.progress-bar-info{background-color:#5bc0de}.progress-striped .progress-bar-info{background-color:#5bc0de;background-image:-webkit-gradient(linear,0 100%,100% 0,color-stop(0.25,rgba(255,255,255,0.15)),color-stop(0.25,transparent),color-stop(0.5,transparent),color-stop(0.5,rgba(255,255,255,0.15)),color-stop(0.75,rgba(255,255,255,0.15)),color-stop(0.75,transparent),to(transparent));background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image:-moz-linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image:linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent)}.accordion{margin-bottom:20px}.accordion-group{margin-bottom:2px;border:1px solid #e5e5e5;border-radius:4px}.accordion-heading{border-bottom:0}.accordion-heading .accordion-toggle{display:block;padding:8px 15px;cursor:pointer}.accordion-inner{padding:9px 15px;border-top:1px solid #e5e5e5}.carousel{position:relative}.carousel-inner{position:relative;width:100%;overflow:hidden}.carousel-inner>.item{position:relative;display:none;-webkit-transition:.6s ease-in-out left;transition:.6s ease-in-out left}.carousel-inner>.item>img,.carousel-inner>.item>a>img{display:inline-block;height:auto;max-width:100%;line-height:1}.carousel-inner>.active,.carousel-inner>.next,.carousel-inner>.prev{display:block}.carousel-inner>.active{left:0}.carousel-inner>.next,.carousel-inner>.prev{position:absolute;top:0;width:100%}.carousel-inner>.next{left:100%}.carousel-inner>.prev{left:-100%}.carousel-inner>.next.left,.carousel-inner>.prev.right{left:0}.carousel-inner>.active.left{left:-100%}.carousel-inner>.active.right{left:100%}.carousel-control{position:absolute;top:0;bottom:0;left:0;width:15%;font-size:20px;color:#fff;text-align:center;text-shadow:0 1px 2px rgba(0,0,0,0.6);opacity:.5;filter:alpha(opacity=50)}.carousel-control.left{background-color:rgba(0,0,0,0.0001);background-color:transparent;background-image:-webkit-gradient(linear,0 top,100% top,from(rgba(0,0,0,0.5)),to(rgba(0,0,0,0.0001)));background-image:-webkit-linear-gradient(left,color-stop(rgba(0,0,0,0.5) 0),color-stop(rgba(0,0,0,0.0001) 100%));background-image:-moz-linear-gradient(left,rgba(0,0,0,0.5) 0,rgba(0,0,0,0.0001) 100%);background-image:linear-gradient(to right,rgba(0,0,0,0.5) 0,rgba(0,0,0,0.0001) 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000',endColorstr='#00000000',GradientType=1)}.carousel-control.right{right:0;left:auto;background-color:rgba(0,0,0,0.5);background-color:transparent;background-image:-webkit-gradient(linear,0 top,100% top,from(rgba(0,0,0,0.0001)),to(rgba(0,0,0,0.5)));background-image:-webkit-linear-gradient(left,color-stop(rgba(0,0,0,0.0001) 0),color-stop(rgba(0,0,0,0.5) 100%));background-image:-moz-linear-gradient(left,rgba(0,0,0,0.0001) 0,rgba(0,0,0,0.5) 100%);background-image:linear-gradient(to right,rgba(0,0,0,0.0001) 0,rgba(0,0,0,0.5) 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000',endColorstr='#80000000',GradientType=1)}.carousel-control:hover,.carousel-control:focus{color:#fff;text-decoration:none;opacity:.9;filter:alpha(opacity=90)}.carousel-control .glyphicon,.carousel-control .icon-prev,.carousel-control .icon-next{position:absolute;top:50%;left:50%;z-index:5;display:inline-block;width:20px;height:20px;margin-top:-10px;margin-left:-10px;font-family:serif}.carousel-control .icon-prev:before{content:'\2039'}.carousel-control .icon-next:before{content:'\203a'}.carousel-indicators{position:absolute;bottom:10px;left:50%;z-index:15;width:120px;padding-left:0;margin-left:-60px;text-align:center;list-style:none}.carousel-indicators li{display:inline-block;width:10px;height:10px;margin:1px;text-indent:-999px;cursor:pointer;border:1px solid #fff;border-radius:10px}.carousel-indicators .active{width:12px;height:12px;margin:0;background-color:#fff}.carousel-caption{position:absolute;right:15%;bottom:20px;left:15%;z-index:10;padding-top:20px;padding-bottom:20px;color:#fff;text-align:center;text-shadow:0 1px 2px rgba(0,0,0,0.6)}.carousel-caption .btn{text-shadow:none}@media screen and (min-width:768px){.carousel-control .glyphicon,.carousel-control .icon-prev,.carousel-control .icon-next{width:30px;height:30px;margin-top:-15px;margin-left:-15px;font-size:30px}.carousel-caption{right:20%;left:20%;padding-bottom:30px}.carousel-indicators{bottom:20px}}.jumbotron{padding:30px;margin-bottom:30px;font-size:21px;font-weight:200;line-height:2.1428571435;color:inherit;background-color:#eee}.jumbotron h1{line-height:1;color:inherit}.jumbotron p{line-height:1.4}@media screen and (min-width:768px){.jumbotron{padding:50px 60px;border-radius:6px}.jumbotron h1{font-size:63px}}.clearfix:before,.clearfix:after{display:table;content:" "}.clearfix:after{clear:both}.pull-right{float:right}.pull-left{float:left}.hide{display:none!important}.show{display:block!important}.invisible{visibility:hidden}.text-hide{font:0/0 a;color:transparent;text-shadow:none;background-color:transparent;border:0}.affix{position:fixed}@-ms-viewport{width:device-width}@media screen and (max-width:400px){@-ms-viewport{width:320px}}.hidden{display:none!important;visibility:hidden!important}.visible-sm{display:block!important}tr.visible-sm{display:table-row!important}th.visible-sm,td.visible-sm{display:table-cell!important}.visible-md{display:none!important}tr.visible-md{display:none!important}th.visible-md,td.visible-md{display:none!important}.visible-lg{display:none!important}tr.visible-lg{display:none!important}th.visible-lg,td.visible-lg{display:none!important}.hidden-sm{display:none!important}tr.hidden-sm{display:none!important}th.hidden-sm,td.hidden-sm{display:none!important}.hidden-md{display:block!important}tr.hidden-md{display:table-row!important}th.hidden-md,td.hidden-md{display:table-cell!important}.hidden-lg{display:block!important}tr.hidden-lg{display:table-row!important}th.hidden-lg,td.hidden-lg{display:table-cell!important}@media(min-width:768px) and (max-width:991px){.visible-sm{display:none!important}tr.visible-sm{display:none!important}th.visible-sm,td.visible-sm{display:none!important}.visible-md{display:block!important}tr.visible-md{display:table-row!important}th.visible-md,td.visible-md{display:table-cell!important}.visible-lg{display:none!important}tr.visible-lg{display:none!important}th.visible-lg,td.visible-lg{display:none!important}.hidden-sm{display:block!important}tr.hidden-sm{display:table-row!important}th.hidden-sm,td.hidden-sm{display:table-cell!important}.hidden-md{display:none!important}tr.hidden-md{display:none!important}th.hidden-md,td.hidden-md{display:none!important}.hidden-lg{display:block!important}tr.hidden-lg{display:table-row!important}th.hidden-lg,td.hidden-lg{display:table-cell!important}}@media(min-width:992px){.visible-sm{display:none!important}tr.visible-sm{display:none!important}th.visible-sm,td.visible-sm{display:none!important}.visible-md{display:none!important}tr.visible-md{display:none!important}th.visible-md,td.visible-md{display:none!important}.visible-lg{display:block!important}tr.visible-lg{display:table-row!important}th.visible-lg,td.visible-lg{display:table-cell!important}.hidden-sm{display:block!important}tr.hidden-sm{display:table-row!important}th.hidden-sm,td.hidden-sm{display:table-cell!important}.hidden-md{display:block!important}tr.hidden-md{display:table-row!important}th.hidden-md,td.hidden-md{display:table-cell!important}.hidden-lg{display:none!important}tr.hidden-lg{display:none!important}th.hidden-lg,td.hidden-lg{display:none!important}}.visible-print{display:none!important}tr.visible-print{display:none!important}th.visible-print,td.visible-print{display:none!important}@media print{.visible-print{display:block!important}tr.visible-print{display:table-row!important}th.visible-print,td.visible-print{display:table-cell!important}.hidden-print{display:none!important}tr.hidden-print{display:none!important}th.hidden-print,td.hidden-print{display:none!important}}
\ No newline at end of file
+ *//*! normalize.css v2.1.0 | MIT License | git.io/normalize */article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}body{margin:0}a:focus{outline:thin dotted}a:active,a:hover{outline:0}h1{margin:.67em 0;font-size:2em}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}hr{height:0;-moz-box-sizing:content-box;box-sizing:content-box}mark{color:#000;background:#ff0}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em}pre{white-space:pre-wrap}q{quotes:"\201C" "\201D" "\2018" "\2019"}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:0}fieldset{padding:.35em .625em .75em;margin:0 2px;border:1px solid #c0c0c0}legend{padding:0;border:0}button,input,select,textarea{margin:0;font-family:inherit;font-size:100%}button,input{line-height:normal}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{cursor:pointer;-webkit-appearance:button}button[disabled],html input[disabled]{cursor:default}input[type="checkbox"],input[type="radio"]{padding:0;box-sizing:border-box}input[type="search"]{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;-webkit-appearance:textfield}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0}@media print{*{color:#000!important;text-shadow:none!important;background:transparent!important;box-shadow:none!important}a,a:visited{text-decoration:underline}a[href]:after{content:" (" attr(href) ")"}abbr[title]:after{content:" (" attr(title) ")"}.ir a:after,a[href^="javascript:"]:after,a[href^="#"]:after{content:""}pre,blockquote{border:1px solid #999;page-break-inside:avoid}thead{display:table-header-group}tr,img{page-break-inside:avoid}img{max-width:100%!important}@page{margin:2cm .5cm}p,h2,h3{orphans:3;widows:3}h2,h3{page-break-after:avoid}.navbar{display:none}.table td,.table th{background-color:#fff!important}.btn>.caret,.dropup>.btn>.caret{border-top-color:#000!important}.label{border:1px solid #000}.table{border-collapse:collapse!important}.table-bordered th,.table-bordered td{border:1px solid #ddd!important}}*,*:before,*:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}html{font-size:62.5%;-webkit-tap-highlight-color:rgba(0,0,0,0)}body{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;line-height:1.428571429;color:#333;background-color:#fff}input,button,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit}button,input,select[multiple],textarea{background-image:none}a{color:#428bca;text-decoration:none}a:hover,a:focus{color:#2a6496;text-decoration:underline}a:focus{outline:thin dotted #333;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}img{vertical-align:middle}.img-responsive{display:block;height:auto;max-width:100%}.img-rounded{border-radius:6px}.img-circle{border-radius:50%}hr{margin-top:20px;margin-bottom:20px;border:0;border-top:1px solid #eee}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}p{margin:0 0 10px}.lead{margin-bottom:20px;font-size:16.099999999999998px;font-weight:200;line-height:1.4}@media(min-width:768px){.lead{font-size:21px}}small{font-size:85%}cite{font-style:normal}.text-muted{color:#999}.text-primary{color:#428bca}.text-warning{color:#c09853}.text-danger{color:#b94a48}.text-success{color:#468847}.text-info{color:#3a87ad}.text-left{text-align:left}.text-right{text-align:right}.text-center{text-align:center}h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:500;line-height:1.1}h1 small,h2 small,h3 small,h4 small,h5 small,h6 small,.h1 small,.h2 small,.h3 small,.h4 small,.h5 small,.h6 small{font-weight:normal;line-height:1;color:#999}h1,h2,h3{margin-top:20px;margin-bottom:10px}h4,h5,h6{margin-top:10px;margin-bottom:10px}h1,.h1{font-size:38px}h2,.h2{font-size:32px}h3,.h3{font-size:24px}h4,.h4{font-size:18px}h5,.h5{font-size:14px}h6,.h6{font-size:12px}h1 small,.h1 small{font-size:24px}h2 small,.h2 small{font-size:18px}h3 small,.h3 small,h4 small,.h4 small{font-size:14px}.page-header{padding-bottom:9px;margin:40px 0 20px;border-bottom:1px solid #eee}ul,ol{margin-top:0;margin-bottom:10px}ul ul,ol ul,ul ol,ol ol{margin-bottom:0}.list-unstyled{padding-left:0;list-style:none}.list-inline{padding-left:0;list-style:none}.list-inline>li{display:inline-block;padding-right:5px;padding-left:5px}dl{margin-bottom:20px}dt,dd{line-height:1.428571429}dt{font-weight:bold}dd{margin-left:0}@media(min-width:768px){.dl-horizontal dt{float:left;width:160px;overflow:hidden;clear:left;text-align:right;text-overflow:ellipsis;white-space:nowrap}.dl-horizontal dd{margin-left:180px}.dl-horizontal dd:before,.dl-horizontal dd:after{display:table;content:" "}.dl-horizontal dd:after{clear:both}.dl-horizontal dd:before,.dl-horizontal dd:after{display:table;content:" "}.dl-horizontal dd:after{clear:both}}abbr[title],abbr[data-original-title]{cursor:help;border-bottom:1px dotted #999}abbr.initialism{font-size:90%;text-transform:uppercase}blockquote{padding:10px 20px;margin:0 0 20px;border-left:5px solid #eee}blockquote p{font-size:17.5px;font-weight:300;line-height:1.25}blockquote p:last-child{margin-bottom:0}blockquote small{display:block;line-height:1.428571429;color:#999}blockquote small:before{content:'\2014 \00A0'}blockquote.pull-right{padding-right:15px;padding-left:0;border-right:5px solid #eee;border-left:0}blockquote.pull-right p,blockquote.pull-right small{text-align:right}blockquote.pull-right small:before{content:''}blockquote.pull-right small:after{content:'\00A0 \2014'}q:before,q:after,blockquote:before,blockquote:after{content:""}address{display:block;margin-bottom:20px;font-style:normal;line-height:1.428571429}code,pre{font-family:Monaco,Menlo,Consolas,"Courier New",monospace}code{padding:2px 4px;font-size:90%;color:#c7254e;white-space:nowrap;background-color:#f9f2f4;border-radius:4px}pre{display:block;padding:9.5px;margin:0 0 10px;font-size:13px;line-height:1.428571429;color:#333;word-break:break-all;word-wrap:break-word;background-color:#f5f5f5;border:1px solid #ccc;border-radius:4px}pre.prettyprint{margin-bottom:20px}pre code{padding:0;font-size:inherit;color:inherit;white-space:pre-wrap;background-color:transparent;border:0}.pre-scrollable{max-height:340px;overflow-y:scroll}.container{margin-right:auto;margin-left:auto}.container:before,.container:after{display:table;content:" "}.container:after{clear:both}.container:before,.container:after{display:table;content:" "}.container:after{clear:both}.row:before,.row:after{display:table;content:" "}.row:after{clear:both}.row:before,.row:after{display:table;content:" "}.row:after{clear:both}@media(min-width:768px){.container .row{margin-right:-15px;margin-left:-15px}}.row .row{margin-right:-15px;margin-left:-15px}.col-xs-1,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9,.col-xs-10,.col-xs-11,.col-xs-12,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12{position:relative;min-height:1px;padding-right:15px;padding-left:15px}.col-xs-1,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9,.col-xs-10,.col-xs-11{float:left}.col-xs-1{width:8.333333333333332%}.col-xs-2{width:16.666666666666664%}.col-xs-3{width:25%}.col-xs-4{width:33.33333333333333%}.col-xs-5{width:41.66666666666667%}.col-xs-6{width:50%}.col-xs-7{width:58.333333333333336%}.col-xs-8{width:66.66666666666666%}.col-xs-9{width:75%}.col-xs-10{width:83.33333333333334%}.col-xs-11{width:91.66666666666666%}.col-xs-12{width:100%}@media(min-width:768px){.container{max-width:720px}.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11{float:left}.col-sm-1{width:8.333333333333332%}.col-sm-2{width:16.666666666666664%}.col-sm-3{width:25%}.col-sm-4{width:33.33333333333333%}.col-sm-5{width:41.66666666666667%}.col-sm-6{width:50%}.col-sm-7{width:58.333333333333336%}.col-sm-8{width:66.66666666666666%}.col-sm-9{width:75%}.col-sm-10{width:83.33333333333334%}.col-sm-11{width:91.66666666666666%}.col-sm-12{width:100%}.col-sm-push-1{left:8.333333333333332%}.col-sm-push-2{left:16.666666666666664%}.col-sm-push-3{left:25%}.col-sm-push-4{left:33.33333333333333%}.col-sm-push-5{left:41.66666666666667%}.col-sm-push-6{left:50%}.col-sm-push-7{left:58.333333333333336%}.col-sm-push-8{left:66.66666666666666%}.col-sm-push-9{left:75%}.col-sm-push-10{left:83.33333333333334%}.col-sm-push-11{left:91.66666666666666%}.col-sm-pull-1{right:8.333333333333332%}.col-sm-pull-2{right:16.666666666666664%}.col-sm-pull-3{right:25%}.col-sm-pull-4{right:33.33333333333333%}.col-sm-pull-5{right:41.66666666666667%}.col-sm-pull-6{right:50%}.col-sm-pull-7{right:58.333333333333336%}.col-sm-pull-8{right:66.66666666666666%}.col-sm-pull-9{right:75%}.col-sm-pull-10{right:83.33333333333334%}.col-sm-pull-11{right:91.66666666666666%}.col-sm-offset-1{margin-left:8.333333333333332%}.col-sm-offset-2{margin-left:16.666666666666664%}.col-sm-offset-3{margin-left:25%}.col-sm-offset-4{margin-left:33.33333333333333%}.col-sm-offset-5{margin-left:41.66666666666667%}.col-sm-offset-6{margin-left:50%}.col-sm-offset-7{margin-left:58.333333333333336%}.col-sm-offset-8{margin-left:66.66666666666666%}.col-sm-offset-9{margin-left:75%}.col-sm-offset-10{margin-left:83.33333333333334%}.col-sm-offset-11{margin-left:91.66666666666666%}}@media(min-width:992px){.container{max-width:940px}.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11{float:left}.col-md-1{width:8.333333333333332%}.col-md-2{width:16.666666666666664%}.col-md-3{width:25%}.col-md-4{width:33.33333333333333%}.col-md-5{width:41.66666666666667%}.col-md-6{width:50%}.col-md-7{width:58.333333333333336%}.col-md-8{width:66.66666666666666%}.col-md-9{width:75%}.col-md-10{width:83.33333333333334%}.col-md-11{width:91.66666666666666%}.col-md-12{width:100%}.col-md-push-0{left:auto}.col-md-push-1{left:8.333333333333332%}.col-md-push-2{left:16.666666666666664%}.col-md-push-3{left:25%}.col-md-push-4{left:33.33333333333333%}.col-md-push-5{left:41.66666666666667%}.col-md-push-6{left:50%}.col-md-push-7{left:58.333333333333336%}.col-md-push-8{left:66.66666666666666%}.col-md-push-9{left:75%}.col-md-push-10{left:83.33333333333334%}.col-md-push-11{left:91.66666666666666%}.col-md-pull-0{right:auto}.col-md-pull-1{right:8.333333333333332%}.col-md-pull-2{right:16.666666666666664%}.col-md-pull-3{right:25%}.col-md-pull-4{right:33.33333333333333%}.col-md-pull-5{right:41.66666666666667%}.col-md-pull-6{right:50%}.col-md-pull-7{right:58.333333333333336%}.col-md-pull-8{right:66.66666666666666%}.col-md-pull-9{right:75%}.col-md-pull-10{right:83.33333333333334%}.col-md-pull-11{right:91.66666666666666%}.col-md-offset-0{margin-left:0}.col-md-offset-1{margin-left:8.333333333333332%}.col-md-offset-2{margin-left:16.666666666666664%}.col-md-offset-3{margin-left:25%}.col-md-offset-4{margin-left:33.33333333333333%}.col-md-offset-5{margin-left:41.66666666666667%}.col-md-offset-6{margin-left:50%}.col-md-offset-7{margin-left:58.333333333333336%}.col-md-offset-8{margin-left:66.66666666666666%}.col-md-offset-9{margin-left:75%}.col-md-offset-10{margin-left:83.33333333333334%}.col-md-offset-11{margin-left:91.66666666666666%}}@media(min-width:1200px){.container{max-width:1140px}.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11{float:left}.col-lg-1{width:8.333333333333332%}.col-lg-2{width:16.666666666666664%}.col-lg-3{width:25%}.col-lg-4{width:33.33333333333333%}.col-lg-5{width:41.66666666666667%}.col-lg-6{width:50%}.col-lg-7{width:58.333333333333336%}.col-lg-8{width:66.66666666666666%}.col-lg-9{width:75%}.col-lg-10{width:83.33333333333334%}.col-lg-11{width:91.66666666666666%}.col-lg-12{width:100%}.col-lg-push-0{left:auto}.col-lg-push-1{left:8.333333333333332%}.col-lg-push-2{left:16.666666666666664%}.col-lg-push-3{left:25%}.col-lg-push-4{left:33.33333333333333%}.col-lg-push-5{left:41.66666666666667%}.col-lg-push-6{left:50%}.col-lg-push-7{left:58.333333333333336%}.col-lg-push-8{left:66.66666666666666%}.col-lg-push-9{left:75%}.col-lg-push-10{left:83.33333333333334%}.col-lg-push-11{left:91.66666666666666%}.col-lg-pull-0{right:auto}.col-lg-pull-1{right:8.333333333333332%}.col-lg-pull-2{right:16.666666666666664%}.col-lg-pull-3{right:25%}.col-lg-pull-4{right:33.33333333333333%}.col-lg-pull-5{right:41.66666666666667%}.col-lg-pull-6{right:50%}.col-lg-pull-7{right:58.333333333333336%}.col-lg-pull-8{right:66.66666666666666%}.col-lg-pull-9{right:75%}.col-lg-pull-10{right:83.33333333333334%}.col-lg-pull-11{right:91.66666666666666%}.col-lg-offset-0{margin-left:0}.col-lg-offset-1{margin-left:8.333333333333332%}.col-lg-offset-2{margin-left:16.666666666666664%}.col-lg-offset-3{margin-left:25%}.col-lg-offset-4{margin-left:33.33333333333333%}.col-lg-offset-5{margin-left:41.66666666666667%}.col-lg-offset-6{margin-left:50%}.col-lg-offset-7{margin-left:58.333333333333336%}.col-lg-offset-8{margin-left:66.66666666666666%}.col-lg-offset-9{margin-left:75%}.col-lg-offset-10{margin-left:83.33333333333334%}.col-lg-offset-11{margin-left:91.66666666666666%}}table{max-width:100%;background-color:transparent}th{text-align:left}.table{width:100%;margin-bottom:20px}.table thead>tr>th,.table tbody>tr>th,.table tfoot>tr>th,.table thead>tr>td,.table tbody>tr>td,.table tfoot>tr>td{padding:8px;line-height:1.428571429;vertical-align:top;border-top:1px solid #ddd}.table thead>tr>th{vertical-align:bottom}.table caption+thead tr:first-child th,.table colgroup+thead tr:first-child th,.table thead:first-child tr:first-child th,.table caption+thead tr:first-child td,.table colgroup+thead tr:first-child td,.table thead:first-child tr:first-child td{border-top:0}.table tbody+tbody{border-top:2px solid #ddd}.table .table{background-color:#fff}.table-condensed thead>tr>th,.table-condensed tbody>tr>th,.table-condensed tfoot>tr>th,.table-condensed thead>tr>td,.table-condensed tbody>tr>td,.table-condensed tfoot>tr>td{padding:5px}.table-bordered{border:1px solid #ddd}.table-bordered>thead>tr>th,.table-bordered>tbody>tr>th,.table-bordered>tfoot>tr>th,.table-bordered>thead>tr>td,.table-bordered>tbody>tr>td,.table-bordered>tfoot>tr>td{border:1px solid #ddd}.table-striped>tbody>tr:nth-child(odd)>td,.table-striped>tbody>tr:nth-child(odd)>th{background-color:#f9f9f9}.table-hover>tbody>tr:hover>td,.table-hover>tbody>tr:hover>th{background-color:#f5f5f5}table col[class^="col-"]{display:table-column;float:none}table td[class^="col-"],table th[class^="col-"]{display:table-cell;float:none}.table>thead>tr>td.active,.table>tbody>tr>td.active,.table>tfoot>tr>td.active,.table>thead>tr>th.active,.table>tbody>tr>th.active,.table>tfoot>tr>th.active,.table>thead>tr.active>td,.table>tbody>tr.active>td,.table>tfoot>tr.active>td,.table>thead>tr.active>th,.table>tbody>tr.active>th,.table>tfoot>tr.active>th{background-color:#f5f5f5}.table>thead>tr>td.success,.table>tbody>tr>td.success,.table>tfoot>tr>td.success,.table>thead>tr>th.success,.table>tbody>tr>th.success,.table>tfoot>tr>th.success,.table>thead>tr.success>td,.table>tbody>tr.success>td,.table>tfoot>tr.success>td,.table>thead>tr.success>th,.table>tbody>tr.success>th,.table>tfoot>tr.success>th{background-color:#dff0d8;border-color:#d6e9c6}.table-hover>tbody>tr>td.success:hover,.table-hover>tbody>tr>th.success:hover,.table-hover>tbody>tr.success:hover>td{background-color:#d0e9c6;border-color:#c9e2b3}.table>thead>tr>td.danger,.table>tbody>tr>td.danger,.table>tfoot>tr>td.danger,.table>thead>tr>th.danger,.table>tbody>tr>th.danger,.table>tfoot>tr>th.danger,.table>thead>tr.danger>td,.table>tbody>tr.danger>td,.table>tfoot>tr.danger>td,.table>thead>tr.danger>th,.table>tbody>tr.danger>th,.table>tfoot>tr.danger>th{background-color:#f2dede;border-color:#eed3d7}.table-hover>tbody>tr>td.danger:hover,.table-hover>tbody>tr>th.danger:hover,.table-hover>tbody>tr.danger:hover>td{background-color:#ebcccc;border-color:#e6c1c7}.table>thead>tr>td.warning,.table>tbody>tr>td.warning,.table>tfoot>tr>td.warning,.table>thead>tr>th.warning,.table>tbody>tr>th.warning,.table>tfoot>tr>th.warning,.table>thead>tr.warning>td,.table>tbody>tr.warning>td,.table>tfoot>tr.warning>td,.table>thead>tr.warning>th,.table>tbody>tr.warning>th,.table>tfoot>tr.warning>th{background-color:#fcf8e3;border-color:#fbeed5}.table-hover>tbody>tr>td.warning:hover,.table-hover>tbody>tr>th.warning:hover,.table-hover>tbody>tr.warning:hover>td{background-color:#faf2cc;border-color:#f8e5be}fieldset{padding:0;margin:0;border:0}legend{display:block;width:100%;padding:0;margin-bottom:20px;font-size:21px;line-height:inherit;color:#333;border:0;border-bottom:1px solid #e5e5e5}label{display:inline-block;margin-bottom:5px;font-weight:bold}input[type="search"]{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}input[type="radio"],input[type="checkbox"]{margin:4px 0 0;margin-top:1px \9;line-height:normal}input[type="file"]{display:block}select[multiple],select[size]{height:auto}select optgroup{font-family:inherit;font-size:inherit;font-style:inherit}input[type="file"]:focus,input[type="radio"]:focus,input[type="checkbox"]:focus{outline:thin dotted #333;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}input[type="number"]::-webkit-outer-spin-button,input[type="number"]::-webkit-inner-spin-button{height:auto}.form-control:-moz-placeholder{color:#999}.form-control::-moz-placeholder{color:#999}.form-control:-ms-input-placeholder{color:#999}.form-control::-webkit-input-placeholder{color:#999}.form-control{display:block;width:100%;height:34px;padding:6px 12px;font-size:14px;line-height:1.428571429;color:#555;vertical-align:middle;background-color:#fff;border:1px solid #ccc;border-radius:4px;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);-webkit-transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s}.form-control:focus{border-color:#66afe9;outline:0;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(102,175,233,0.6);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(102,175,233,0.6)}.form-control[disabled],.form-control[readonly],fieldset[disabled] .form-control{cursor:not-allowed;background-color:#eee}textarea.form-control{height:auto}.form-group{margin-bottom:15px}.radio,.checkbox{display:block;min-height:20px;padding-left:20px;margin-top:10px;margin-bottom:10px;vertical-align:middle}.radio label,.checkbox label{display:inline;margin-bottom:0;font-weight:normal;cursor:pointer}.radio input[type="radio"],.radio-inline input[type="radio"],.checkbox input[type="checkbox"],.checkbox-inline input[type="checkbox"]{float:left;margin-left:-20px}.radio+.radio,.checkbox+.checkbox{margin-top:-5px}.radio-inline,.checkbox-inline{display:inline-block;padding-left:20px;margin-bottom:0;font-weight:normal;vertical-align:middle;cursor:pointer}.radio-inline+.radio-inline,.checkbox-inline+.checkbox-inline{margin-top:0;margin-left:10px}input[type="radio"][disabled],input[type="checkbox"][disabled],.radio[disabled],.radio-inline[disabled],.checkbox[disabled],.checkbox-inline[disabled],fieldset[disabled] input[type="radio"],fieldset[disabled] input[type="checkbox"],fieldset[disabled] .radio,fieldset[disabled] .radio-inline,fieldset[disabled] .checkbox,fieldset[disabled] .checkbox-inline{cursor:not-allowed}.input-sm{height:30px;padding:5px 10px;font-size:12px;line-height:1.5;border-radius:3px}select.input-sm{height:30px;line-height:30px}textarea.input-sm{height:auto}.input-lg{height:45px;padding:10px 16px;font-size:18px;line-height:1.33;border-radius:6px}select.input-lg{height:45px;line-height:45px}textarea.input-lg{height:auto}.has-warning .help-block,.has-warning .control-label{color:#c09853}.has-warning .form-control{border-color:#c09853;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075)}.has-warning .form-control:focus{border-color:#a47e3c;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 6px #dbc59e;box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 6px #dbc59e}.has-warning .input-group-addon{color:#c09853;background-color:#fcf8e3;border-color:#c09853}.has-error .help-block,.has-error .control-label{color:#b94a48}.has-error .form-control{border-color:#b94a48;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075)}.has-error .form-control:focus{border-color:#953b39;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 6px #d59392;box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 6px #d59392}.has-error .input-group-addon{color:#b94a48;background-color:#f2dede;border-color:#b94a48}.has-success .help-block,.has-success .control-label{color:#468847}.has-success .form-control{border-color:#468847;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);box-shadow:inset 0 1px 1px rgba(0,0,0,0.075)}.has-success .form-control:focus{border-color:#356635;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 6px #7aba7b;box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 6px #7aba7b}.has-success .input-group-addon{color:#468847;background-color:#dff0d8;border-color:#468847}.form-control-static{padding-top:6px;margin-bottom:0}.help-block{display:block;margin-top:5px;margin-bottom:10px;color:#737373}@media(min-width:768px){.form-inline .form-group{display:inline-block;margin-bottom:0;vertical-align:middle}.form-inline .form-control{display:inline-block}.form-inline .radio,.form-inline .checkbox{display:inline-block;padding-left:0;margin-top:0;margin-bottom:0}.form-inline .radio input[type="radio"],.form-inline .checkbox input[type="checkbox"]{float:none;margin-left:0}}.form-horizontal .control-label,.form-horizontal .radio-inline,.form-horizontal .checkbox-inline{padding-top:6px}.form-horizontal .form-group:before,.form-horizontal .form-group:after{display:table;content:" "}.form-horizontal .form-group:after{clear:both}.form-horizontal .form-group:before,.form-horizontal .form-group:after{display:table;content:" "}.form-horizontal .form-group:after{clear:both}@media(min-width:768px){.container .form-horizontal .form-group{margin-right:-15px;margin-left:-15px}}.form-horizontal .form-group .row{margin-right:-15px;margin-left:-15px}@media(min-width:768px){.form-horizontal .control-label{text-align:right}}.btn{display:inline-block;padding:6px 12px;margin-bottom:0;font-size:14px;font-weight:bold;line-height:1.428571429;text-align:center;white-space:nowrap;vertical-align:middle;cursor:pointer;border:1px solid transparent;border-radius:4px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none}.btn:focus{outline:thin dotted #333;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}.btn:hover,.btn:focus{color:#333;text-decoration:none}.btn:active,.btn.active{background-image:none;outline:0;-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,0.125);box-shadow:inset 0 3px 5px rgba(0,0,0,0.125)}.btn.disabled,.btn[disabled],fieldset[disabled] .btn{pointer-events:none;cursor:not-allowed;opacity:.65;filter:alpha(opacity=65);-webkit-box-shadow:none;box-shadow:none}.btn-default{color:#333;background-color:#fff;border-color:#ccc}.btn-default:hover,.btn-default:focus,.btn-default:active,.btn-default.active,.open .dropdown-toggle.btn-default{color:#333;background-color:#ebebeb;border-color:#adadad}.btn-default:active,.btn-default.active,.open .dropdown-toggle.btn-default{background-image:none}.btn-default.disabled,.btn-default[disabled],fieldset[disabled] .btn-default,.btn-default.disabled:hover,.btn-default[disabled]:hover,fieldset[disabled] .btn-default:hover,.btn-default.disabled:focus,.btn-default[disabled]:focus,fieldset[disabled] .btn-default:focus,.btn-default.disabled:active,.btn-default[disabled]:active,fieldset[disabled] .btn-default:active,.btn-default.disabled.active,.btn-default[disabled].active,fieldset[disabled] .btn-default.active{background-color:#fff;border-color:#ccc}.btn-primary{color:#fff;background-color:#428bca;border-color:#357ebd}.btn-primary:hover,.btn-primary:focus,.btn-primary:active,.btn-primary.active,.open .dropdown-toggle.btn-primary{color:#fff;background-color:#3276b1;border-color:#285e8e}.btn-primary:active,.btn-primary.active,.open .dropdown-toggle.btn-primary{background-image:none}.btn-primary.disabled,.btn-primary[disabled],fieldset[disabled] .btn-primary,.btn-primary.disabled:hover,.btn-primary[disabled]:hover,fieldset[disabled] .btn-primary:hover,.btn-primary.disabled:focus,.btn-primary[disabled]:focus,fieldset[disabled] .btn-primary:focus,.btn-primary.disabled:active,.btn-primary[disabled]:active,fieldset[disabled] .btn-primary:active,.btn-primary.disabled.active,.btn-primary[disabled].active,fieldset[disabled] .btn-primary.active{background-color:#428bca;border-color:#357ebd}.btn-warning{color:#fff;background-color:#f0ad4e;border-color:#eea236}.btn-warning:hover,.btn-warning:focus,.btn-warning:active,.btn-warning.active,.open .dropdown-toggle.btn-warning{color:#fff;background-color:#ed9c28;border-color:#d58512}.btn-warning:active,.btn-warning.active,.open .dropdown-toggle.btn-warning{background-image:none}.btn-warning.disabled,.btn-warning[disabled],fieldset[disabled] .btn-warning,.btn-warning.disabled:hover,.btn-warning[disabled]:hover,fieldset[disabled] .btn-warning:hover,.btn-warning.disabled:focus,.btn-warning[disabled]:focus,fieldset[disabled] .btn-warning:focus,.btn-warning.disabled:active,.btn-warning[disabled]:active,fieldset[disabled] .btn-warning:active,.btn-warning.disabled.active,.btn-warning[disabled].active,fieldset[disabled] .btn-warning.active{background-color:#f0ad4e;border-color:#eea236}.btn-danger{color:#fff;background-color:#d9534f;border-color:#d43f3a}.btn-danger:hover,.btn-danger:focus,.btn-danger:active,.btn-danger.active,.open .dropdown-toggle.btn-danger{color:#fff;background-color:#d2322d;border-color:#ac2925}.btn-danger:active,.btn-danger.active,.open .dropdown-toggle.btn-danger{background-image:none}.btn-danger.disabled,.btn-danger[disabled],fieldset[disabled] .btn-danger,.btn-danger.disabled:hover,.btn-danger[disabled]:hover,fieldset[disabled] .btn-danger:hover,.btn-danger.disabled:focus,.btn-danger[disabled]:focus,fieldset[disabled] .btn-danger:focus,.btn-danger.disabled:active,.btn-danger[disabled]:active,fieldset[disabled] .btn-danger:active,.btn-danger.disabled.active,.btn-danger[disabled].active,fieldset[disabled] .btn-danger.active{background-color:#d9534f;border-color:#d43f3a}.btn-success{color:#fff;background-color:#5cb85c;border-color:#4cae4c}.btn-success:hover,.btn-success:focus,.btn-success:active,.btn-success.active,.open .dropdown-toggle.btn-success{color:#fff;background-color:#47a447;border-color:#398439}.btn-success:active,.btn-success.active,.open .dropdown-toggle.btn-success{background-image:none}.btn-success.disabled,.btn-success[disabled],fieldset[disabled] .btn-success,.btn-success.disabled:hover,.btn-success[disabled]:hover,fieldset[disabled] .btn-success:hover,.btn-success.disabled:focus,.btn-success[disabled]:focus,fieldset[disabled] .btn-success:focus,.btn-success.disabled:active,.btn-success[disabled]:active,fieldset[disabled] .btn-success:active,.btn-success.disabled.active,.btn-success[disabled].active,fieldset[disabled] .btn-success.active{background-color:#5cb85c;border-color:#4cae4c}.btn-info{color:#fff;background-color:#5bc0de;border-color:#46b8da}.btn-info:hover,.btn-info:focus,.btn-info:active,.btn-info.active,.open .dropdown-toggle.btn-info{color:#fff;background-color:#39b3d7;border-color:#269abc}.btn-info:active,.btn-info.active,.open .dropdown-toggle.btn-info{background-image:none}.btn-info.disabled,.btn-info[disabled],fieldset[disabled] .btn-info,.btn-info.disabled:hover,.btn-info[disabled]:hover,fieldset[disabled] .btn-info:hover,.btn-info.disabled:focus,.btn-info[disabled]:focus,fieldset[disabled] .btn-info:focus,.btn-info.disabled:active,.btn-info[disabled]:active,fieldset[disabled] .btn-info:active,.btn-info.disabled.active,.btn-info[disabled].active,fieldset[disabled] .btn-info.active{background-color:#5bc0de;border-color:#46b8da}.btn-link{font-weight:normal;color:#428bca;cursor:pointer;border-radius:0}.btn-link,.btn-link:active,.btn-link[disabled],fieldset[disabled] .btn-link{background-color:transparent;-webkit-box-shadow:none;box-shadow:none}.btn-link,.btn-link:hover,.btn-link:focus,.btn-link:active{border-color:transparent}.btn-link:hover,.btn-link:focus{color:#2a6496;text-decoration:underline;background-color:transparent}.btn-link[disabled]:hover,fieldset[disabled] .btn-link:hover,.btn-link[disabled]:focus,fieldset[disabled] .btn-link:focus{color:#999;text-decoration:none}.btn-lg{padding:10px 16px;font-size:18px;line-height:1.33;border-radius:6px}.btn-sm,.btn-xs{padding:5px 10px;font-size:12px;line-height:1.5;border-radius:3px}.btn-xs{padding:1px 5px}.btn-block{display:block;width:100%;padding-right:0;padding-left:0}.btn-block+.btn-block{margin-top:5px}input[type="submit"].btn-block,input[type="reset"].btn-block,input[type="button"].btn-block{width:100%}.fade{opacity:0;-webkit-transition:opacity .15s linear;transition:opacity .15s linear}.fade.in{opacity:1}.collapse{display:none}.collapse.in{display:block}.collapsing{position:relative;height:0;overflow:hidden;-webkit-transition:height .35s ease;transition:height .35s ease}.input-group{position:relative;display:table;border-collapse:separate}.input-group.col{float:none;padding-right:0;padding-left:0}.input-group .form-control{width:100%;margin-bottom:0}.input-group-lg>.form-control,.input-group-lg>.input-group-addon,.input-group-lg>.input-group-btn>.btn{height:45px;padding:10px 16px;font-size:18px;line-height:1.33;border-radius:6px}select.input-group-lg>.form-control,select.input-group-lg>.input-group-addon,select.input-group-lg>.input-group-btn>.btn{height:45px;line-height:45px}textarea.input-group-lg>.form-control,textarea.input-group-lg>.input-group-addon,textarea.input-group-lg>.input-group-btn>.btn{height:auto}.input-group-sm>.form-control,.input-group-sm>.input-group-addon,.input-group-sm>.input-group-btn>.btn{height:30px;padding:5px 10px;font-size:12px;line-height:1.5;border-radius:3px}select.input-group-sm>.form-control,select.input-group-sm>.input-group-addon,select.input-group-sm>.input-group-btn>.btn{height:30px;line-height:30px}textarea.input-group-sm>.form-control,textarea.input-group-sm>.input-group-addon,textarea.input-group-sm>.input-group-btn>.btn{height:auto}.input-group-addon,.input-group-btn,.input-group .form-control{display:table-cell}.input-group-addon:not(:first-child):not(:last-child),.input-group-btn:not(:first-child):not(:last-child),.input-group .form-control:not(:first-child):not(:last-child){border-radius:0}.input-group-addon,.input-group-btn{width:1%;white-space:nowrap;vertical-align:middle}.input-group-addon{padding:6px 12px;font-size:14px;font-weight:normal;line-height:1;text-align:center;background-color:#eee;border:1px solid #ccc;border-radius:4px}.input-group-addon.input-sm{padding:5px 10px;font-size:12px;border-radius:3px}.input-group-addon.input-lg{padding:10px 16px;font-size:18px;border-radius:6px}.input-group-addon input[type="radio"],.input-group-addon input[type="checkbox"]{margin-top:0}.input-group .form-control:first-child,.input-group-addon:first-child,.input-group-btn:first-child>.btn,.input-group-btn:first-child>.dropdown-toggle,.input-group-btn:last-child>.btn:not(:last-child):not(.dropdown-toggle){border-top-right-radius:0;border-bottom-right-radius:0}.input-group-addon:first-child{border-right:0}.input-group .form-control:last-child,.input-group-addon:last-child,.input-group-btn:last-child>.btn,.input-group-btn:last-child>.dropdown-toggle,.input-group-btn:first-child>.btn:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.input-group-addon:last-child{border-left:0}.input-group-btn{position:relative;white-space:nowrap}.input-group-btn>.btn{position:relative}.input-group-btn>.btn+.btn{margin-left:-4px}.input-group-btn>.btn:hover,.input-group-btn>.btn:active{z-index:2}.caret{display:inline-block;width:0;height:0;margin-left:2px;vertical-align:middle;border-top:4px solid #000;border-right:4px solid transparent;border-left:4px solid transparent;content:""}.dropdown{position:relative}.dropdown-toggle:focus{outline:0}.dropdown-menu{position:absolute;top:100%;left:0;z-index:1000;display:none;float:left;min-width:160px;padding:5px 0;margin:2px 0 0;font-size:14px;list-style:none;background-color:#fff;border:1px solid #ccc;border:1px solid rgba(0,0,0,0.15);border-radius:4px;-webkit-box-shadow:0 6px 12px rgba(0,0,0,0.175);box-shadow:0 6px 12px rgba(0,0,0,0.175);background-clip:padding-box}.dropdown-menu.pull-right{right:0;left:auto}.dropdown-menu .divider{height:1px;margin:9px 0;overflow:hidden;background-color:#e5e5e5}.dropdown-menu>li>a{display:block;padding:3px 20px;clear:both;font-weight:normal;line-height:1.428571429;color:#333;white-space:nowrap}.dropdown-menu>li>a:hover,.dropdown-menu>li>a:focus{color:#fff;text-decoration:none;background-color:#428bca}.dropdown-menu>.active>a,.dropdown-menu>.active>a:hover,.dropdown-menu>.active>a:focus{color:#fff;text-decoration:none;background-color:#428bca;outline:0}.dropdown-menu>.disabled>a,.dropdown-menu>.disabled>a:hover,.dropdown-menu>.disabled>a:focus{color:#999}.dropdown-menu>.disabled>a:hover,.dropdown-menu>.disabled>a:focus{text-decoration:none;cursor:not-allowed;background-color:transparent;background-image:none;filter:progid:DXImageTransform.Microsoft.gradient(enabled=false)}.open>.dropdown-menu{display:block}.open>a{outline:0}.dropdown-header{display:block;padding:3px 20px;font-size:12px;line-height:1.428571429;color:#999}.dropdown-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:990}.pull-right>.dropdown-menu{right:0;left:auto}.dropup .caret,.navbar-fixed-bottom .dropdown .caret{border-top:0;border-bottom:4px solid #000;content:""}.dropup .dropdown-menu,.navbar-fixed-bottom .dropdown .dropdown-menu{top:auto;bottom:100%;margin-bottom:1px}.list-group{padding-left:0;margin-bottom:20px}.list-group-item{position:relative;display:block;padding:10px 15px;margin-bottom:-1px;background-color:#fff;border:1px solid #ddd}.list-group-item:first-child{border-top-right-radius:4px;border-top-left-radius:4px}.list-group-item:last-child{margin-bottom:0;border-bottom-right-radius:4px;border-bottom-left-radius:4px}.list-group-item>.badge{float:right}.list-group-item>.badge+.badge{margin-right:5px}a.list-group-item{color:#555}a.list-group-item .list-group-item-heading{color:#333}a.list-group-item:hover,a.list-group-item:focus{text-decoration:none;background-color:#f5f5f5}.list-group-item.active,.list-group-item.active:hover,.list-group-item.active:focus{z-index:2;color:#fff;background-color:#428bca;border-color:#428bca}.list-group-item.active .list-group-item-heading,.list-group-item.active:hover .list-group-item-heading,.list-group-item.active:focus .list-group-item-heading{color:inherit}.list-group-item.active .list-group-item-text,.list-group-item.active:hover .list-group-item-text,.list-group-item.active:focus .list-group-item-text{color:#e1edf7}.list-group-item-heading{margin-top:0;margin-bottom:5px}.list-group-item-text{margin-bottom:0;line-height:1.3}.panel{margin-bottom:20px;background-color:#fff;border:1px solid #ddd;border-radius:4px;-webkit-box-shadow:0 1px 1px rgba(0,0,0,0.05);box-shadow:0 1px 1px rgba(0,0,0,0.05)}.panel-body{padding:15px}.panel>.list-group{margin-bottom:0}.panel>.list-group .list-group-item{border-width:1px 0}.panel>.list-group .list-group-item:first-child{border-top-right-radius:0;border-top-left-radius:0}.panel>.list-group .list-group-item:last-child{border-bottom:0}.panel-heading+.list-group .list-group-item:first-child{border-top-width:0}.panel-heading{padding:10px 15px;background-color:#f5f5f5;border-bottom:1px solid #ddd;border-top-right-radius:3px;border-top-left-radius:3px}.panel-title{margin-top:0;margin-bottom:0;font-size:17.5px}.panel-title>a{color:inherit}.panel-footer{padding:10px 15px;background-color:#f5f5f5;border-top:1px solid #ddd;border-bottom-right-radius:3px;border-bottom-left-radius:3px}.panel-group .panel{margin-bottom:0;overflow:hidden;border-radius:4px}.panel-group .panel+.panel{margin-top:5px}.panel-group .panel-heading{border-bottom:0}.panel-group .panel-heading+.panel-collapse .panel-body{border-top:1px solid #ddd}.panel-group .panel-footer{border-top:0}.panel-group .panel-footer+.panel-collapse .panel-body{border-bottom:1px solid #ddd}.panel-primary{border-color:#428bca}.panel-primary>.panel-heading{color:#fff;background-color:#428bca;border-color:#428bca}.panel-primary>.panel-heading+.panel-collapse .panel-body{border-top-color:#428bca}.panel-primary>.panel-footer+.panel-collapse .panel-body{border-bottom-color:#428bca}.panel-success{border-color:#d6e9c6}.panel-success>.panel-heading{color:#468847;background-color:#dff0d8;border-color:#d6e9c6}.panel-success>.panel-heading+.panel-collapse .panel-body{border-top-color:#d6e9c6}.panel-success>.panel-footer+.panel-collapse .panel-body{border-bottom-color:#d6e9c6}.panel-warning{border-color:#fbeed5}.panel-warning>.panel-heading{color:#c09853;background-color:#fcf8e3;border-color:#fbeed5}.panel-warning>.panel-heading+.panel-collapse .panel-body{border-top-color:#fbeed5}.panel-warning>.panel-footer+.panel-collapse .panel-body{border-bottom-color:#fbeed5}.panel-danger{border-color:#eed3d7}.panel-danger>.panel-heading{color:#b94a48;background-color:#f2dede;border-color:#eed3d7}.panel-danger>.panel-heading+.panel-collapse .panel-body{border-top-color:#eed3d7}.panel-danger>.panel-footer+.panel-collapse .panel-body{border-bottom-color:#eed3d7}.panel-info{border-color:#bce8f1}.panel-info>.panel-heading{color:#3a87ad;background-color:#d9edf7;border-color:#bce8f1}.panel-info>.panel-heading+.panel-collapse .panel-body{border-top-color:#bce8f1}.panel-info>.panel-footer+.panel-collapse .panel-body{border-bottom-color:#bce8f1}.well{min-height:20px;padding:19px;margin-bottom:20px;background-color:#f5f5f5;border:1px solid #e3e3e3;border-radius:4px;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.05);box-shadow:inset 0 1px 1px rgba(0,0,0,0.05)}.well blockquote{border-color:#ddd;border-color:rgba(0,0,0,0.15)}.well-lg{padding:24px;border-radius:6px}.well-sm{padding:9px;border-radius:3px}.close{float:right;font-size:21px;font-weight:bold;line-height:1;color:#000;text-shadow:0 1px 0 #fff;opacity:.2;filter:alpha(opacity=20)}.close:hover,.close:focus{color:#000;text-decoration:none;cursor:pointer;opacity:.5;filter:alpha(opacity=50)}button.close{padding:0;cursor:pointer;background:transparent;border:0;-webkit-appearance:none}.nav{padding-left:0;margin-bottom:0;list-style:none}.nav:before,.nav:after{display:table;content:" "}.nav:after{clear:both}.nav:before,.nav:after{display:table;content:" "}.nav:after{clear:both}.nav>li{position:relative;display:block}.nav>li>a{position:relative;display:block;padding:10px 15px}.nav>li>a:hover,.nav>li>a:focus{text-decoration:none;background-color:#eee}.nav>li.disabled>a{color:#999}.nav>li.disabled>a:hover,.nav>li.disabled>a:focus{color:#999;text-decoration:none;cursor:not-allowed;background-color:transparent}.nav .open>a,.nav .open>a:hover,.nav .open>a:focus{background-color:#eee;border-color:#428bca}.nav .nav-divider{height:1px;margin:9px 0;overflow:hidden;background-color:#e5e5e5}.nav>li>a>img{max-width:none}.nav-tabs{border-bottom:1px solid #ddd}.nav-tabs>li{float:left;margin-bottom:-1px}.nav-tabs>li>a{margin-right:2px;line-height:1.428571429;border:1px solid transparent;border-radius:4px 4px 0 0}.nav-tabs>li>a:hover{border-color:#eee #eee #ddd}.nav-tabs>li.active>a,.nav-tabs>li.active>a:hover,.nav-tabs>li.active>a:focus{color:#555;cursor:default;background-color:#fff;border:1px solid #ddd;border-bottom-color:transparent}.nav-tabs.nav-justified{width:100%;border-bottom:0}.nav-tabs.nav-justified>li{float:none}.nav-tabs.nav-justified>li>a{text-align:center}@media(min-width:768px){.nav-tabs.nav-justified>li{display:table-cell;width:1%}}.nav-tabs.nav-justified>li>a{margin-right:0;border-bottom:1px solid #ddd}.nav-tabs.nav-justified>.active>a{border-bottom-color:#fff}.nav-pills>li{float:left}.nav-pills>li>a{border-radius:5px}.nav-pills>li+li{margin-left:2px}.nav-pills>li.active>a,.nav-pills>li.active>a:hover,.nav-pills>li.active>a:focus{color:#fff;background-color:#428bca}.nav-stacked>li{float:none}.nav-stacked>li+li{margin-top:2px;margin-left:0}.nav-justified{width:100%}.nav-justified>li{float:none}.nav-justified>li>a{text-align:center}@media(min-width:768px){.nav-justified>li{display:table-cell;width:1%}}.nav-tabs-justified{border-bottom:0}.nav-tabs-justified>li>a{margin-right:0;border-bottom:1px solid #ddd}.nav-tabs-justified>.active>a{border-bottom-color:#fff}.tabbable:before,.tabbable:after{display:table;content:" "}.tabbable:after{clear:both}.tabbable:before,.tabbable:after{display:table;content:" "}.tabbable:after{clear:both}.tab-content>.tab-pane,.pill-content>.pill-pane{display:none}.tab-content>.active,.pill-content>.active{display:block}.nav .caret{border-top-color:#428bca;border-bottom-color:#428bca}.nav a:hover .caret{border-top-color:#2a6496;border-bottom-color:#2a6496}.nav-tabs .dropdown-menu{margin-top:-1px;border-top-right-radius:0;border-top-left-radius:0}.navbar{position:relative;min-height:50px;margin-bottom:20px;background-color:#f8f8f8;border:1px solid #e7e7e7}.navbar:before,.navbar:after{display:table;content:" "}.navbar:after{clear:both}.navbar:before,.navbar:after{display:table;content:" "}.navbar:after{clear:both}@media(min-width:768px){.navbar{border-radius:4px}}.navbar-header{padding-right:15px;padding-left:15px}.navbar-header:before,.navbar-header:after{display:table;content:" "}.navbar-header:after{clear:both}.navbar-header:before,.navbar-header:after{display:table;content:" "}.navbar-header:after{clear:both}@media(min-width:768px){.navbar-header{float:left}}.navbar-collapse{max-height:340px;padding-right:15px;padding-left:15px;overflow-x:visible;border-top:1px solid #e6e6e6;box-shadow:inset 0 1px 0 rgba(255,255,255,0.1);-webkit-overflow-scrolling:touch}.navbar-collapse:before,.navbar-collapse:after{display:table;content:" "}.navbar-collapse:after{clear:both}.navbar-collapse:before,.navbar-collapse:after{display:table;content:" "}.navbar-collapse:after{clear:both}.navbar-collapse.in{overflow-y:auto}@media(min-width:768px){.navbar-collapse{width:auto;padding-right:0;padding-left:0;border-top:0;box-shadow:none}.navbar-collapse.collapse{display:block!important;height:auto!important;padding-bottom:0;overflow:visible!important}.navbar-collapse.in{overflow-y:visible}}.navbar-static-top{border-width:0 0 1px}@media(min-width:768px){.navbar-static-top{border-radius:0}}.navbar-fixed-top,.navbar-fixed-bottom{position:fixed;right:0;left:0;z-index:1030;border-width:0 0 1px}@media(min-width:768px){.navbar-fixed-top,.navbar-fixed-bottom{border-radius:0}}.navbar-fixed-top{top:0}.navbar-fixed-bottom{bottom:0;margin-bottom:0}.navbar-brand{float:left;padding-top:15px;padding-bottom:15px;font-size:18px;line-height:20px;color:#777}.navbar-brand:hover,.navbar-brand:focus{color:#5e5e5e;text-decoration:none;background-color:transparent}.navbar-toggle{position:relative;float:right;padding:9px 10px;margin-top:8px;margin-bottom:8px;background-color:transparent;border:1px solid #ddd;border-radius:4px}.navbar-toggle:hover,.navbar-toggle:focus{background-color:#ddd}.navbar-toggle .icon-bar{display:block;width:22px;height:2px;background-color:#ccc;border-radius:1px}.navbar-toggle .icon-bar+.icon-bar{margin-top:4px}@media(min-width:768px){.navbar-toggle{position:relative;top:auto;left:auto;display:none}}.navbar-nav{margin:7.5px -15px}.navbar-nav>li>a{padding-top:10px;padding-bottom:10px;line-height:20px;color:#777}.navbar-nav>li>a:hover,.navbar-nav>li>a:focus{color:#333;background-color:transparent}.navbar-nav>.active>a,.navbar-nav>.active>a:hover,.navbar-nav>.active>a:focus{color:#555;background-color:#e7e7e7}.navbar-nav>.disabled>a,.navbar-nav>.disabled>a:hover,.navbar-nav>.disabled>a:focus{color:#ccc;background-color:transparent}@media(max-width:767px){.navbar-nav .open .dropdown-menu{position:static;float:none;width:auto;margin-top:0;background-color:transparent;border:0;box-shadow:none}.navbar-nav .open .dropdown-menu>li>a,.navbar-nav .open .dropdown-menu .dropdown-header{padding:5px 15px 5px 25px}.navbar-nav .open .dropdown-menu>li>a{line-height:20px;color:#777}.navbar-nav .open .dropdown-menu>li>a:hover,.navbar-nav .open .dropdown-menu>li>a:focus{color:#333;background-color:transparent;background-image:none}.navbar-nav .open .dropdown-menu>.active>a,.navbar-nav .open .dropdown-menu>.active>a:hover,.navbar-nav .open .dropdown-menu>.active>a:focus{color:#555;background-color:#e7e7e7}.navbar-nav .open .dropdown-menu>.disabled>a,.navbar-nav .open .dropdown-menu>.disabled>a:hover,.navbar-nav .open .dropdown-menu>.disabled>a:focus{color:#ccc;background-color:transparent}}@media(min-width:768px){.navbar-nav{float:left;margin:0}.navbar-nav>li{float:left}.navbar-nav>li>a{padding-top:15px;padding-bottom:15px}}@media(min-width:768px){.navbar-left{float:left!important}.navbar-right{float:right!important}.navbar-right .dropdown-menu{right:0;left:auto}}.navbar-form{padding:10px 15px;margin-top:8px;margin-right:-15px;margin-bottom:8px;margin-left:-15px;border-top:1px solid #e6e6e6;border-bottom:1px solid #e6e6e6;-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,0.1),0 1px 0 rgba(255,255,255,0.1);box-shadow:inset 0 1px 0 rgba(255,255,255,0.1),0 1px 0 rgba(255,255,255,0.1)}@media(min-width:768px){.navbar-form .form-group{display:inline-block;margin-bottom:0;vertical-align:middle}.navbar-form .form-control{display:inline-block}.navbar-form .radio,.navbar-form .checkbox{display:inline-block;padding-left:0;margin-top:0;margin-bottom:0}.navbar-form .radio input[type="radio"],.navbar-form .checkbox input[type="checkbox"]{float:none;margin-left:0}}@media(max-width:767px){.navbar-form .form-group{margin-bottom:5px}}@media(min-width:768px){.navbar-form{width:auto;padding-top:0;padding-bottom:0;margin-right:0;margin-left:0;border:0;-webkit-box-shadow:none;box-shadow:none}}.navbar-nav>li>.dropdown-menu{margin-top:0;border-top-right-radius:0;border-top-left-radius:0}.navbar-fixed-bottom .navbar-nav>li>.dropdown-menu{border-bottom-right-radius:0;border-bottom-left-radius:0}.navbar-nav>.dropdown>a:hover .caret,.navbar-nav>.dropdown>a:focus .caret{border-top-color:#333;border-bottom-color:#333}.navbar-nav>.open>a,.navbar-nav>.open>a:hover,.navbar-nav>.open>a:focus{color:#555;background-color:#e7e7e7}.navbar-nav>.open>a .caret,.navbar-nav>.open>a:hover .caret,.navbar-nav>.open>a:focus .caret{border-top-color:#555;border-bottom-color:#555}.navbar-nav>.dropdown>a .caret{border-top-color:#777;border-bottom-color:#777}.navbar-nav.pull-right>li>.dropdown-menu,.navbar-nav>li>.dropdown-menu.pull-right{right:0;left:auto}.navbar-btn{margin-top:8px;margin-bottom:8px}.navbar-text{float:left;margin-top:15px;margin-bottom:15px;color:#777}@media(min-width:768px){.navbar-text{margin-right:15px;margin-left:15px}}.navbar-link{color:#777}.navbar-link:hover{color:#333}.navbar-inverse{background-color:#222;border-color:#080808}.navbar-inverse .navbar-brand{color:#999}.navbar-inverse .navbar-brand:hover,.navbar-inverse .navbar-brand:focus{color:#fff;background-color:transparent}.navbar-inverse .navbar-text{color:#999}.navbar-inverse .navbar-nav>li>a{color:#999}.navbar-inverse .navbar-nav>li>a:hover,.navbar-inverse .navbar-nav>li>a:focus{color:#fff;background-color:transparent}.navbar-inverse .navbar-nav>.active>a,.navbar-inverse .navbar-nav>.active>a:hover,.navbar-inverse .navbar-nav>.active>a:focus{color:#fff;background-color:#080808}.navbar-inverse .navbar-nav>.disabled>a,.navbar-inverse .navbar-nav>.disabled>a:hover,.navbar-inverse .navbar-nav>.disabled>a:focus{color:#444;background-color:transparent}.navbar-inverse .navbar-toggle{border-color:#333}.navbar-inverse .navbar-toggle:hover,.navbar-inverse .navbar-toggle:focus{background-color:#333}.navbar-inverse .navbar-toggle .icon-bar{background-color:#fff}.navbar-inverse .navbar-collapse,.navbar-inverse .navbar-form{border-color:#101010}.navbar-inverse .navbar-nav>.open>a,.navbar-inverse .navbar-nav>.open>a:hover,.navbar-inverse .navbar-nav>.open>a:focus{color:#fff;background-color:#080808}.navbar-inverse .navbar-nav>.dropdown>a:hover .caret{border-top-color:#fff;border-bottom-color:#fff}.navbar-inverse .navbar-nav>.dropdown>a .caret{border-top-color:#999;border-bottom-color:#999}.navbar-inverse .navbar-nav>.open>a .caret,.navbar-inverse .navbar-nav>.open>a:hover .caret,.navbar-inverse .navbar-nav>.open>a:focus .caret{border-top-color:#fff;border-bottom-color:#fff}@media(max-width:767px){.navbar-inverse .navbar-nav .open .dropdown-menu>.dropdown-header{border-color:#080808}.navbar-inverse .navbar-nav .open .dropdown-menu>li>a{color:#999}.navbar-inverse .navbar-nav .open .dropdown-menu>li>a:hover,.navbar-inverse .navbar-nav .open .dropdown-menu>li>a:focus{color:#fff;background-color:transparent}.navbar-inverse .navbar-nav .open .dropdown-menu>.active>a,.navbar-inverse .navbar-nav .open .dropdown-menu>.active>a:hover,.navbar-inverse .navbar-nav .open .dropdown-menu>.active>a:focus{color:#fff;background-color:#080808}.navbar-inverse .navbar-nav .open .dropdown-menu>.disabled>a,.navbar-inverse .navbar-nav .open .dropdown-menu>.disabled>a:hover,.navbar-inverse .navbar-nav .open .dropdown-menu>.disabled>a:focus{color:#444;background-color:transparent}}.navbar-inverse .navbar-link{color:#999}.navbar-inverse .navbar-link:hover{color:#fff}.btn-default .caret{border-top-color:#333}.btn-primary .caret,.btn-success .caret,.btn-warning .caret,.btn-danger .caret,.btn-info .caret{border-top-color:#fff}.dropup .btn-default .caret{border-bottom-color:#333}.dropup .btn-primary .caret,.dropup .btn-success .caret,.dropup .btn-warning .caret,.dropup .btn-danger .caret,.dropup .btn-info .caret{border-bottom-color:#fff}.btn-group,.btn-group-vertical{position:relative;display:inline-block;vertical-align:middle}.btn-group>.btn,.btn-group-vertical>.btn{position:relative;float:left}.btn-group>.btn:hover,.btn-group-vertical>.btn:hover,.btn-group>.btn:focus,.btn-group-vertical>.btn:focus,.btn-group>.btn:active,.btn-group-vertical>.btn:active,.btn-group>.btn.active,.btn-group-vertical>.btn.active{z-index:2}.btn-group>.btn:focus,.btn-group-vertical>.btn:focus{outline:0}.btn-group .btn+.btn,.btn-group .btn+.btn-group,.btn-group .btn-group+.btn,.btn-group .btn-group+.btn-group{margin-left:-1px}.btn-toolbar:before,.btn-toolbar:after{display:table;content:" "}.btn-toolbar:after{clear:both}.btn-toolbar:before,.btn-toolbar:after{display:table;content:" "}.btn-toolbar:after{clear:both}.btn-toolbar .btn-group{float:left}.btn-toolbar>.btn+.btn,.btn-toolbar>.btn-group+.btn,.btn-toolbar>.btn+.btn-group,.btn-toolbar>.btn-group+.btn-group{margin-left:5px}.btn-group>.btn:not(:first-child):not(:last-child):not(.dropdown-toggle){border-radius:0}.btn-group>.btn:first-child{margin-left:0}.btn-group>.btn:first-child:not(:last-child):not(.dropdown-toggle){border-top-right-radius:0;border-bottom-right-radius:0}.btn-group>.btn:last-child:not(:first-child),.btn-group>.dropdown-toggle:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.btn-group>.btn-group{float:left}.btn-group>.btn-group:not(:first-child):not(:last-child)>.btn{border-radius:0}.btn-group>.btn-group:first-child>.btn:last-child,.btn-group>.btn-group:first-child>.dropdown-toggle{border-top-right-radius:0;border-bottom-right-radius:0}.btn-group>.btn-group:last-child>.btn:first-child{border-bottom-left-radius:0;border-top-left-radius:0}.btn-group .dropdown-toggle:active,.btn-group.open .dropdown-toggle{outline:0}.btn-group-xs>.btn{padding:5px 10px;padding:1px 5px;font-size:12px;line-height:1.5;border-radius:3px}.btn-group-sm>.btn{padding:5px 10px;font-size:12px;line-height:1.5;border-radius:3px}.btn-group-lg>.btn{padding:10px 16px;font-size:18px;line-height:1.33;border-radius:6px}.btn-group>.btn+.dropdown-toggle{padding-right:8px;padding-left:8px}.btn-group>.btn-lg+.dropdown-toggle{padding-right:12px;padding-left:12px}.btn-group.open .dropdown-toggle{-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,0.125);box-shadow:inset 0 3px 5px rgba(0,0,0,0.125)}.btn .caret{margin-left:0}.btn-lg .caret{border-width:5px}.dropup .btn-lg .caret{border-bottom-width:5px}.btn-group-vertical>.btn,.btn-group-vertical>.btn-group{display:block;float:none;width:100%;max-width:100%}.btn-group-vertical>.btn-group:before,.btn-group-vertical>.btn-group:after{display:table;content:" "}.btn-group-vertical>.btn-group:after{clear:both}.btn-group-vertical>.btn-group:before,.btn-group-vertical>.btn-group:after{display:table;content:" "}.btn-group-vertical>.btn-group:after{clear:both}.btn-group-vertical>.btn-group>.btn{float:none}.btn-group-vertical>.btn+.btn,.btn-group-vertical>.btn+.btn-group,.btn-group-vertical>.btn-group+.btn,.btn-group-vertical>.btn-group+.btn-group{margin-top:-1px;margin-left:0}.btn-group-vertical>.btn:not(:first-child):not(:last-child){border-radius:0}.btn-group-vertical>.btn:first-child:not(:last-child){border-top-right-radius:4px;border-bottom-right-radius:0;border-bottom-left-radius:0}.btn-group-vertical>.btn:last-child:not(:first-child){border-top-right-radius:0;border-bottom-left-radius:4px;border-top-left-radius:0}.btn-group-vertical>.btn-group:not(:first-child):not(:last-child)>.btn{border-radius:0}.btn-group-vertical>.btn-group:first-child>.btn:last-child,.btn-group-vertical>.btn-group:first-child>.dropdown-toggle{border-bottom-right-radius:0;border-bottom-left-radius:0}.btn-group-vertical>.btn-group:last-child>.btn:first-child{border-top-right-radius:0;border-top-left-radius:0}.btn-group-justified{display:table;width:100%;border-collapse:separate;table-layout:fixed}.btn-group-justified .btn{display:table-cell;float:none;width:1%}[data-toggle="buttons"]>.btn>input[type="radio"],[data-toggle="buttons"]>.btn>input[type="checkbox"]{display:none}.breadcrumb{padding:8px 15px;margin-bottom:20px;list-style:none;background-color:#f5f5f5;border-radius:4px}.breadcrumb>li{display:inline-block}.breadcrumb>li+li:before{padding:0 5px;color:#ccc;content:"/\00a0"}.breadcrumb>.active{color:#999}.pagination{display:inline-block;padding-left:0;margin:20px 0;border-radius:4px}.pagination>li{display:inline}.pagination>li>a,.pagination>li>span{position:relative;float:left;padding:6px 12px;margin-left:-1px;line-height:1.428571429;text-decoration:none;background-color:#fff;border:1px solid #ddd}.pagination>li:first-child>a,.pagination>li:first-child>span{margin-left:0;border-bottom-left-radius:4px;border-top-left-radius:4px}.pagination>li:last-child>a,.pagination>li:last-child>span{border-top-right-radius:4px;border-bottom-right-radius:4px}.pagination>li>a:hover,.pagination>li>span:hover,.pagination>li>a:focus,.pagination>li>span:focus{background-color:#eee}.pagination>.active>a,.pagination>.active>span,.pagination>.active>a:hover,.pagination>.active>span:hover,.pagination>.active>a:focus,.pagination>.active>span:focus{z-index:2;color:#fff;cursor:default;background-color:#428bca;border-color:#428bca}.pagination>.disabled>span,.pagination>.disabled>a,.pagination>.disabled>a:hover,.pagination>.disabled>a:focus{color:#999;cursor:not-allowed;background-color:#fff;border-color:#ddd}.pagination-lg>li>a,.pagination-lg>li>span{padding:10px 16px;font-size:18px}.pagination-lg>li:first-child>a,.pagination-lg>li:first-child>span{border-bottom-left-radius:6px;border-top-left-radius:6px}.pagination-lg>li:last-child>a,.pagination-lg>li:last-child>span{border-top-right-radius:6px;border-bottom-right-radius:6px}.pagination-sm>li>a,.pagination-sm>li>span{padding:5px 10px;font-size:12px}.pagination-sm>li:first-child>a,.pagination-sm>li:first-child>span{border-bottom-left-radius:3px;border-top-left-radius:3px}.pagination-sm>li:last-child>a,.pagination-sm>li:last-child>span{border-top-right-radius:3px;border-bottom-right-radius:3px}.pager{padding-left:0;margin:20px 0;text-align:center;list-style:none}.pager:before,.pager:after{display:table;content:" "}.pager:after{clear:both}.pager:before,.pager:after{display:table;content:" "}.pager:after{clear:both}.pager li{display:inline}.pager li>a,.pager li>span{display:inline-block;padding:5px 14px;background-color:#fff;border:1px solid #ddd;border-radius:15px}.pager li>a:hover,.pager li>a:focus{text-decoration:none;background-color:#428bca}.pager .next>a,.pager .next>span{float:right}.pager .previous>a,.pager .previous>span{float:left}.pager .disabled>a,.pager .disabled>a:hover,.pager .disabled>a:focus,.pager .disabled>span{color:#999;cursor:not-allowed;background-color:#fff}.modal-open{overflow:hidden}.modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1040;display:none;overflow:auto;overflow-y:scroll}.modal.fade .modal-dialog{-webkit-transform:translate(0,-25%);-ms-transform:translate(0,-25%);transform:translate(0,-25%);-webkit-transition:-webkit-transform .3s ease-out;-moz-transition:-moz-transform .3s ease-out;-o-transition:-o-transform .3s ease-out;transition:transform .3s ease-out}.modal.in .modal-dialog{-webkit-transform:translate(0,0);-ms-transform:translate(0,0);transform:translate(0,0)}.modal-dialog{z-index:1050;width:auto;padding:10px;margin-right:auto;margin-left:auto}.modal-content{position:relative;background-color:#fff;border:1px solid #999;border:1px solid rgba(0,0,0,0.2);border-radius:6px;outline:0;-webkit-box-shadow:0 3px 9px rgba(0,0,0,0.5);box-shadow:0 3px 9px rgba(0,0,0,0.5);background-clip:padding-box}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1030;background-color:#000}.modal-backdrop.fade{opacity:0;filter:alpha(opacity=0)}.modal-backdrop.in{opacity:.5;filter:alpha(opacity=50)}.modal-header{min-height:16.428571429px;padding:15px;border-bottom:1px solid #e5e5e5}.modal-header .close{margin-top:-2px}.modal-title{margin:0;line-height:1.428571429}.modal-body{position:relative;padding:20px}.modal-footer{padding:19px 20px 20px;margin-top:15px;text-align:right;border-top:1px solid #e5e5e5}.modal-footer:before,.modal-footer:after{display:table;content:" "}.modal-footer:after{clear:both}.modal-footer:before,.modal-footer:after{display:table;content:" "}.modal-footer:after{clear:both}.modal-footer .btn+.btn{margin-bottom:0;margin-left:5px}.modal-footer .btn-group .btn+.btn{margin-left:-1px}.modal-footer .btn-block+.btn-block{margin-left:0}@media screen and (min-width:768px){.modal-dialog{right:auto;left:50%;width:600px;padding-top:30px;padding-bottom:30px}.modal-content{-webkit-box-shadow:0 5px 15px rgba(0,0,0,0.5);box-shadow:0 5px 15px rgba(0,0,0,0.5)}}.tooltip{position:absolute;z-index:1030;display:block;font-size:12px;line-height:1.4;opacity:0;filter:alpha(opacity=0);visibility:visible}.tooltip.in{opacity:.9;filter:alpha(opacity=90)}.tooltip.top{padding:5px 0;margin-top:-3px}.tooltip.right{padding:0 5px;margin-left:3px}.tooltip.bottom{padding:5px 0;margin-top:3px}.tooltip.left{padding:0 5px;margin-left:-3px}.tooltip-inner{max-width:200px;padding:3px 8px;color:#fff;text-align:center;text-decoration:none;background-color:#000;border-radius:4px}.tooltip-arrow{position:absolute;width:0;height:0;border-color:transparent;border-style:solid}.tooltip.top .tooltip-arrow{bottom:0;left:50%;margin-left:-5px;border-top-color:#000;border-width:5px 5px 0}.tooltip.top-left .tooltip-arrow{bottom:0;left:5px;border-top-color:#000;border-width:5px 5px 0}.tooltip.top-right .tooltip-arrow{right:5px;bottom:0;border-top-color:#000;border-width:5px 5px 0}.tooltip.right .tooltip-arrow{top:50%;left:0;margin-top:-5px;border-right-color:#000;border-width:5px 5px 5px 0}.tooltip.left .tooltip-arrow{top:50%;right:0;margin-top:-5px;border-left-color:#000;border-width:5px 0 5px 5px}.tooltip.bottom .tooltip-arrow{top:0;left:50%;margin-left:-5px;border-bottom-color:#000;border-width:0 5px 5px}.tooltip.bottom-left .tooltip-arrow{top:0;left:5px;border-bottom-color:#000;border-width:0 5px 5px}.tooltip.bottom-right .tooltip-arrow{top:0;right:5px;border-bottom-color:#000;border-width:0 5px 5px}.popover{position:absolute;top:0;left:0;z-index:1010;display:none;max-width:276px;padding:1px;text-align:left;white-space:normal;background-color:#fff;border:1px solid #ccc;border:1px solid rgba(0,0,0,0.2);border-radius:6px;-webkit-box-shadow:0 5px 10px rgba(0,0,0,0.2);box-shadow:0 5px 10px rgba(0,0,0,0.2);background-clip:padding-box}.popover.top{margin-top:-10px}.popover.right{margin-left:10px}.popover.bottom{margin-top:10px}.popover.left{margin-left:-10px}.popover-title{padding:8px 14px;margin:0;font-size:14px;font-weight:normal;line-height:18px;background-color:#f7f7f7;border-bottom:1px solid #ebebeb;border-radius:5px 5px 0 0}.popover-content{padding:9px 14px}.popover .arrow,.popover .arrow:after{position:absolute;display:block;width:0;height:0;border-color:transparent;border-style:solid}.popover .arrow{border-width:11px}.popover .arrow:after{border-width:10px;content:""}.popover.top .arrow{bottom:-11px;left:50%;margin-left:-11px;border-top-color:#999;border-top-color:rgba(0,0,0,0.25);border-bottom-width:0}.popover.top .arrow:after{bottom:1px;margin-left:-10px;border-top-color:#fff;border-bottom-width:0;content:" "}.popover.right .arrow{top:50%;left:-11px;margin-top:-11px;border-right-color:#999;border-right-color:rgba(0,0,0,0.25);border-left-width:0}.popover.right .arrow:after{bottom:-10px;left:1px;border-right-color:#fff;border-left-width:0;content:" "}.popover.bottom .arrow{top:-11px;left:50%;margin-left:-11px;border-bottom-color:#999;border-bottom-color:rgba(0,0,0,0.25);border-top-width:0}.popover.bottom .arrow:after{top:1px;margin-left:-10px;border-bottom-color:#fff;border-top-width:0;content:" "}.popover.left .arrow{top:50%;right:-11px;margin-top:-11px;border-left-color:#999;border-left-color:rgba(0,0,0,0.25);border-right-width:0}.popover.left .arrow:after{right:1px;bottom:-10px;border-left-color:#fff;border-right-width:0;content:" "}.alert{padding:15px;margin-bottom:20px;color:#c09853;background-color:#fcf8e3;border:1px solid #fbeed5;border-radius:4px}.alert h4{margin-top:0;color:inherit}.alert hr{border-top-color:#f8e5be}.alert .alert-link{font-weight:bold;color:#a47e3c}.alert>p,.alert>ul{margin-bottom:0}.alert>p+p{margin-top:5px}.alert-dismissable{padding-right:35px}.alert-dismissable .close{position:relative;top:-2px;right:-21px;color:inherit}.alert-success{color:#468847;background-color:#dff0d8;border-color:#d6e9c6}.alert-success hr{border-top-color:#c9e2b3}.alert-success .alert-link{color:#356635}.alert-danger{color:#b94a48;background-color:#f2dede;border-color:#eed3d7}.alert-danger hr{border-top-color:#e6c1c7}.alert-danger .alert-link{color:#953b39}.alert-info{color:#3a87ad;background-color:#d9edf7;border-color:#bce8f1}.alert-info hr{border-top-color:#a6e1ec}.alert-info .alert-link{color:#2d6987}.thumbnail,.img-thumbnail{padding:4px;line-height:1.428571429;background-color:#fff;border:1px solid #ddd;border-radius:4px;-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out}.thumbnail{display:block}.thumbnail>img{display:block;height:auto;max-width:100%}.img-thumbnail{display:inline-block;height:auto;max-width:100%}a.thumbnail:hover,a.thumbnail:focus{border-color:#428bca}.thumbnail>img{margin-right:auto;margin-left:auto}.thumbnail .caption{padding:9px;color:#333}.media,.media-body{overflow:hidden;zoom:1}.media,.media .media{margin-top:15px}.media:first-child{margin-top:0}.media-object{display:block}.media-heading{margin:0 0 5px}.media>.pull-left{margin-right:10px}.media>.pull-right{margin-left:10px}.media-list{padding-left:0;list-style:none}.label{display:inline;padding:.25em .6em;font-size:75%;font-weight:bold;line-height:1;color:#fff;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25em}.label[href]:hover,.label[href]:focus{color:#fff;text-decoration:none;cursor:pointer}.label:empty{display:none}.label-default{background-color:#999}.label-default[href]:hover,.label-default[href]:focus{background-color:#808080}.label-primary{background-color:#428bca}.label-primary[href]:hover,.label-primary[href]:focus{background-color:#3071a9}.label-success{background-color:#5cb85c}.label-success[href]:hover,.label-success[href]:focus{background-color:#449d44}.label-info{background-color:#5bc0de}.label-info[href]:hover,.label-info[href]:focus{background-color:#31b0d5}.label-warning{background-color:#f0ad4e}.label-warning[href]:hover,.label-warning[href]:focus{background-color:#ec971f}.label-danger{background-color:#d9534f}.label-danger[href]:hover,.label-danger[href]:focus{background-color:#c9302c}.badge{display:inline-block;min-width:10px;padding:3px 7px;font-size:12px;font-weight:bold;line-height:1;color:#fff;text-align:center;white-space:nowrap;vertical-align:baseline;background-color:#999;border-radius:10px}.badge:empty{display:none}a.badge:hover,a.badge:focus{color:#fff;text-decoration:none;cursor:pointer}.btn .badge{position:relative;top:-1px}a.list-group-item.active>.badge,.nav-pills>.active>a>.badge{color:#428bca;background-color:#fff}.nav-pills>li>a>.badge{margin-left:3px}@-webkit-keyframes progress-bar-stripes{from{background-position:40px 0}to{background-position:0 0}}@-moz-keyframes progress-bar-stripes{from{background-position:40px 0}to{background-position:0 0}}@-o-keyframes progress-bar-stripes{from{background-position:0 0}to{background-position:40px 0}}@keyframes progress-bar-stripes{from{background-position:40px 0}to{background-position:0 0}}.progress{height:20px;margin-bottom:20px;overflow:hidden;background-color:#f5f5f5;border-radius:4px;-webkit-box-shadow:inset 0 1px 2px rgba(0,0,0,0.1);box-shadow:inset 0 1px 2px rgba(0,0,0,0.1)}.progress-bar{float:left;width:0;height:100%;font-size:12px;color:#fff;text-align:center;background-color:#428bca;-webkit-box-shadow:inset 0 -1px 0 rgba(0,0,0,0.15);box-shadow:inset 0 -1px 0 rgba(0,0,0,0.15);-webkit-transition:width .6s ease;transition:width .6s ease}.progress-striped .progress-bar{background-image:-webkit-gradient(linear,0 100%,100% 0,color-stop(0.25,rgba(255,255,255,0.15)),color-stop(0.25,transparent),color-stop(0.5,transparent),color-stop(0.5,rgba(255,255,255,0.15)),color-stop(0.75,rgba(255,255,255,0.15)),color-stop(0.75,transparent),to(transparent));background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image:-moz-linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image:linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-size:40px 40px}.progress.active .progress-bar{-webkit-animation:progress-bar-stripes 2s linear infinite;-moz-animation:progress-bar-stripes 2s linear infinite;-ms-animation:progress-bar-stripes 2s linear infinite;-o-animation:progress-bar-stripes 2s linear infinite;animation:progress-bar-stripes 2s linear infinite}.progress-bar-success{background-color:#5cb85c}.progress-striped .progress-bar-success{background-image:-webkit-gradient(linear,0 100%,100% 0,color-stop(0.25,rgba(255,255,255,0.15)),color-stop(0.25,transparent),color-stop(0.5,transparent),color-stop(0.5,rgba(255,255,255,0.15)),color-stop(0.75,rgba(255,255,255,0.15)),color-stop(0.75,transparent),to(transparent));background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image:-moz-linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image:linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent)}.progress-bar-info{background-color:#5bc0de}.progress-striped .progress-bar-info{background-image:-webkit-gradient(linear,0 100%,100% 0,color-stop(0.25,rgba(255,255,255,0.15)),color-stop(0.25,transparent),color-stop(0.5,transparent),color-stop(0.5,rgba(255,255,255,0.15)),color-stop(0.75,rgba(255,255,255,0.15)),color-stop(0.75,transparent),to(transparent));background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image:-moz-linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image:linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent)}.progress-bar-warning{background-color:#f0ad4e}.progress-striped .progress-bar-warning{background-image:-webkit-gradient(linear,0 100%,100% 0,color-stop(0.25,rgba(255,255,255,0.15)),color-stop(0.25,transparent),color-stop(0.5,transparent),color-stop(0.5,rgba(255,255,255,0.15)),color-stop(0.75,rgba(255,255,255,0.15)),color-stop(0.75,transparent),to(transparent));background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image:-moz-linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image:linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent)}.progress-bar-danger{background-color:#d9534f}.progress-striped .progress-bar-danger{background-image:-webkit-gradient(linear,0 100%,100% 0,color-stop(0.25,rgba(255,255,255,0.15)),color-stop(0.25,transparent),color-stop(0.5,transparent),color-stop(0.5,rgba(255,255,255,0.15)),color-stop(0.75,rgba(255,255,255,0.15)),color-stop(0.75,transparent),to(transparent));background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image:-moz-linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent);background-image:linear-gradient(45deg,rgba(255,255,255,0.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,0.15) 50%,rgba(255,255,255,0.15) 75%,transparent 75%,transparent)}.carousel{position:relative}.carousel-inner{position:relative;width:100%;overflow:hidden}.carousel-inner>.item{position:relative;display:none;-webkit-transition:.6s ease-in-out left;transition:.6s ease-in-out left}.carousel-inner>.item>img,.carousel-inner>.item>a>img{display:block;height:auto;max-width:100%;line-height:1}.carousel-inner>.active,.carousel-inner>.next,.carousel-inner>.prev{display:block}.carousel-inner>.active{left:0}.carousel-inner>.next,.carousel-inner>.prev{position:absolute;top:0;width:100%}.carousel-inner>.next{left:100%}.carousel-inner>.prev{left:-100%}.carousel-inner>.next.left,.carousel-inner>.prev.right{left:0}.carousel-inner>.active.left{left:-100%}.carousel-inner>.active.right{left:100%}.carousel-control{position:absolute;top:0;bottom:0;left:0;width:15%;font-size:20px;color:#fff;text-align:center;text-shadow:0 1px 2px rgba(0,0,0,0.6);opacity:.5;filter:alpha(opacity=50)}.carousel-control.left{background-image:-webkit-gradient(linear,0 top,100% top,from(rgba(0,0,0,0.5)),to(rgba(0,0,0,0.0001)));background-image:-webkit-linear-gradient(left,color-stop(rgba(0,0,0,0.5) 0),color-stop(rgba(0,0,0,0.0001) 100%));background-image:-moz-linear-gradient(left,rgba(0,0,0,0.5) 0,rgba(0,0,0,0.0001) 100%);background-image:linear-gradient(to right,rgba(0,0,0,0.5) 0,rgba(0,0,0,0.0001) 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000',endColorstr='#00000000',GradientType=1)}.carousel-control.right{right:0;left:auto;background-image:-webkit-gradient(linear,0 top,100% top,from(rgba(0,0,0,0.0001)),to(rgba(0,0,0,0.5)));background-image:-webkit-linear-gradient(left,color-stop(rgba(0,0,0,0.0001) 0),color-stop(rgba(0,0,0,0.5) 100%));background-image:-moz-linear-gradient(left,rgba(0,0,0,0.0001) 0,rgba(0,0,0,0.5) 100%);background-image:linear-gradient(to right,rgba(0,0,0,0.0001) 0,rgba(0,0,0,0.5) 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000',endColorstr='#80000000',GradientType=1)}.carousel-control:hover,.carousel-control:focus{color:#fff;text-decoration:none;opacity:.9;filter:alpha(opacity=90)}.carousel-control .icon-prev,.carousel-control .icon-next{position:absolute;top:50%;left:50%;z-index:5;display:inline-block;width:20px;height:20px;margin-top:-10px;margin-left:-10px;font-family:serif}.carousel-control .icon-prev:before{content:'\2039'}.carousel-control .icon-next:before{content:'\203a'}.carousel-indicators{position:absolute;bottom:10px;left:50%;z-index:15;width:60%;padding-left:0;margin-left:-30%;text-align:center;list-style:none}.carousel-indicators li{display:inline-block;width:10px;height:10px;margin:1px;text-indent:-999px;cursor:pointer;border:1px solid #fff;border-radius:10px}.carousel-indicators .active{width:12px;height:12px;margin:0;background-color:#fff}.carousel-caption{position:absolute;right:15%;bottom:20px;left:15%;z-index:10;padding-top:20px;padding-bottom:20px;color:#fff;text-align:center;text-shadow:0 1px 2px rgba(0,0,0,0.6)}.carousel-caption .btn{text-shadow:none}@media screen and (min-width:768px){.carousel-control .icon-prev,.carousel-control .icon-next{width:30px;height:30px;margin-top:-15px;margin-left:-15px;font-size:30px}.carousel-caption{right:20%;left:20%;padding-bottom:30px}.carousel-indicators{bottom:20px}}.jumbotron{padding:30px;margin-bottom:30px;font-size:21px;font-weight:200;line-height:2.1428571435;color:inherit;background-color:#eee}.jumbotron h1{line-height:1;color:inherit}.jumbotron p{line-height:1.4}@media screen and (min-width:768px){.jumbotron{padding:50px 60px;border-radius:6px}.jumbotron h1{font-size:63px}}.clearfix:before,.clearfix:after{display:table;content:" "}.clearfix:after{clear:both}.pull-right{float:right!important}.pull-left{float:left!important}.hide{display:none!important}.show{display:block!important}.invisible{visibility:hidden}.text-hide{font:0/0 a;color:transparent;text-shadow:none;background-color:transparent;border:0}.affix{position:fixed}@-ms-viewport{width:device-width}@media screen and (max-width:400px){@-ms-viewport{width:320px}}.hidden{display:none!important;visibility:hidden!important}.visible-xs{display:block!important}tr.visible-xs{display:table-row!important}th.visible-xs,td.visible-xs{display:table-cell!important}@media(min-width:768px) and (max-width:991px){.visible-xs{display:none!important}tr.visible-xs{display:none!important}th.visible-xs,td.visible-xs{display:none!important}}@media(min-width:992px) and (max-width:1199px){.visible-xs{display:none!important}tr.visible-xs{display:none!important}th.visible-xs,td.visible-xs{display:none!important}}@media(min-width:1200px){.visible-xs{display:none!important}tr.visible-xs{display:none!important}th.visible-xs,td.visible-xs{display:none!important}}.visible-sm{display:none!important}tr.visible-sm{display:none!important}th.visible-sm,td.visible-sm{display:none!important}@media(min-width:768px) and (max-width:991px){.visible-sm{display:block!important}tr.visible-sm{display:table-row!important}th.visible-sm,td.visible-sm{display:table-cell!important}}@media(min-width:992px) and (max-width:1199px){.visible-sm{display:none!important}tr.visible-sm{display:none!important}th.visible-sm,td.visible-sm{display:none!important}}@media(min-width:1200px){.visible-sm{display:none!important}tr.visible-sm{display:none!important}th.visible-sm,td.visible-sm{display:none!important}}.visible-md{display:none!important}tr.visible-md{display:none!important}th.visible-md,td.visible-md{display:none!important}@media(min-width:768px) and (max-width:991px){.visible-md{display:none!important}tr.visible-md{display:none!important}th.visible-md,td.visible-md{display:none!important}}@media(min-width:992px) and (max-width:1199px){.visible-md{display:block!important}tr.visible-md{display:table-row!important}th.visible-md,td.visible-md{display:table-cell!important}}@media(min-width:1200px){.visible-md{display:none!important}tr.visible-md{display:none!important}th.visible-md,td.visible-md{display:none!important}}.visible-lg{display:none!important}tr.visible-lg{display:none!important}th.visible-lg,td.visible-lg{display:none!important}@media(min-width:768px) and (max-width:991px){.visible-lg{display:none!important}tr.visible-lg{display:none!important}th.visible-lg,td.visible-lg{display:none!important}}@media(min-width:992px) and (max-width:1199px){.visible-lg{display:none!important}tr.visible-lg{display:none!important}th.visible-lg,td.visible-lg{display:none!important}}@media(min-width:1200px){.visible-lg{display:block!important}tr.visible-lg{display:table-row!important}th.visible-lg,td.visible-lg{display:table-cell!important}}.hidden-xs{display:none!important}tr.hidden-xs{display:none!important}th.hidden-xs,td.hidden-xs{display:none!important}@media(min-width:768px) and (max-width:991px){.hidden-xs{display:block!important}tr.hidden-xs{display:table-row!important}th.hidden-xs,td.hidden-xs{display:table-cell!important}}@media(min-width:992px) and (max-width:1199px){.hidden-xs{display:block!important}tr.hidden-xs{display:table-row!important}th.hidden-xs,td.hidden-xs{display:table-cell!important}}@media(min-width:1200px){.hidden-xs{display:block!important}tr.hidden-xs{display:table-row!important}th.hidden-xs,td.hidden-xs{display:table-cell!important}}.hidden-sm{display:block!important}tr.hidden-sm{display:table-row!important}th.hidden-sm,td.hidden-sm{display:table-cell!important}@media(min-width:768px) and (max-width:991px){.hidden-sm{display:none!important}tr.hidden-sm{display:none!important}th.hidden-sm,td.hidden-sm{display:none!important}}@media(min-width:992px) and (max-width:1199px){.hidden-sm{display:block!important}tr.hidden-sm{display:table-row!important}th.hidden-sm,td.hidden-sm{display:table-cell!important}}@media(min-width:1200px){.hidden-sm{display:block!important}tr.hidden-sm{display:table-row!important}th.hidden-sm,td.hidden-sm{display:table-cell!important}}.hidden-md{display:block!important}tr.hidden-md{display:table-row!important}th.hidden-md,td.hidden-md{display:table-cell!important}@media(min-width:768px) and (max-width:991px){.hidden-md{display:block!important}tr.hidden-md{display:table-row!important}th.hidden-md,td.hidden-md{display:table-cell!important}}@media(min-width:992px) and (max-width:1199px){.hidden-md{display:none!important}tr.hidden-md{display:none!important}th.hidden-md,td.hidden-md{display:none!important}}@media(min-width:1200px){.hidden-md{display:block!important}tr.hidden-md{display:table-row!important}th.hidden-md,td.hidden-md{display:table-cell!important}}.hidden-lg{display:block!important}tr.hidden-lg{display:table-row!important}th.hidden-lg,td.hidden-lg{display:table-cell!important}@media(min-width:768px) and (max-width:991px){.hidden-lg{display:block!important}tr.hidden-lg{display:table-row!important}th.hidden-lg,td.hidden-lg{display:table-cell!important}}@media(min-width:992px) and (max-width:1199px){.hidden-lg{display:block!important}tr.hidden-lg{display:table-row!important}th.hidden-lg,td.hidden-lg{display:table-cell!important}}@media(min-width:1200px){.hidden-lg{display:none!important}tr.hidden-lg{display:none!important}th.hidden-lg,td.hidden-lg{display:none!important}}.visible-print{display:none!important}tr.visible-print{display:none!important}th.visible-print,td.visible-print{display:none!important}@media print{.visible-print{display:block!important}tr.visible-print{display:table-row!important}th.visible-print,td.visible-print{display:table-cell!important}.hidden-print{display:none!important}tr.hidden-print{display:none!important}th.hidden-print,td.hidden-print{display:none!important}}
\ No newline at end of file
// http://blog.alexmaccaw.com/css-transitions
$.fn.emulateTransitionEnd = function (duration) {
var called = false, $el = this
- $(this).one('webkitTransitionEnd', function () { called = true })
- var callback = function () { if (!called) $($el).trigger('webkitTransitionEnd') }
+ $(this).one($.support.transition.end, function () { called = true })
+ var callback = function () { if (!called) $($el).trigger($.support.transition.end) }
setTimeout(callback, duration)
return this
}
var $parent = this.$element.closest('[data-toggle="buttons"]')
if ($parent.length) {
- var $input = this.$element.find('input').prop('checked', !this.$element.hasClass('active'))
+ var $input = this.$element.find('input')
+ .prop('checked', !this.$element.hasClass('active'))
+ .trigger('change')
if ($input.prop('type') === 'radio') $parent.find('.active').removeClass('active')
}
$.fn.button = function (option) {
return this.each(function () {
var $this = $(this)
- var data = $this.data('button')
+ var data = $this.data('bs.button')
var options = typeof option == 'object' && option
if (!data) $this.data('bs.button', (data = new Button(this, options)))
Carousel.DEFAULTS = {
interval: 5000
, pause: 'hover'
+ , wrap: true
}
Carousel.prototype.cycle = function (e) {
var fallback = type == 'next' ? 'first' : 'last'
var that = this
+ if (!$next.length) {
+ if (!this.options.wrap) return
+ $next = this.$element.find('.item')[fallback]()
+ }
+
this.sliding = true
isCycling && this.pause()
- $next = $next.length ? $next : this.$element.find('.item')[fallback]()
-
var e = $.Event('slide.bs.carousel', { relatedTarget: $next[0], direction: direction })
if ($next.hasClass('active')) return
this.$element.trigger(startEvent)
if (startEvent.isDefaultPrevented()) return
- var actives = this.$parent && this.$parent.find('> .accordion-group > .in')
+ var actives = this.$parent && this.$parent.find('> .panel > .in')
if (actives && actives.length) {
var hasData = actives.data('bs.collapse')
var $parent = parent && $(parent)
if (!data || !data.transitioning) {
- if ($parent) $parent.find('[data-toggle=collapse][data-parent=' + parent + ']').not($this).addClass('collapsed')
+ if ($parent) $parent.find('[data-toggle=collapse][data-parent="' + parent + '"]').not($this).addClass('collapsed')
$this[$target.hasClass('in') ? 'addClass' : 'removeClass']('collapsed')
}
this.$backdrop =
this.isShown = null
- if (this.options.remote) this.$element.find('.modal-body').load(this.options.remote)
+ if (this.options.remote) this.$element.load(this.options.remote)
}
Modal.DEFAULTS = {
, show: true
}
- Modal.prototype.toggle = function () {
- return this[!this.isShown ? 'show' : 'hide']()
+ Modal.prototype.toggle = function (_relatedTarget) {
+ return this[!this.isShown ? 'show' : 'hide'](_relatedTarget)
}
- Modal.prototype.show = function () {
+ Modal.prototype.show = function (_relatedTarget) {
var that = this
- var e = $.Event('show.bs.modal')
+ var e = $.Event('show.bs.modal', { relatedTarget: _relatedTarget })
this.$element.trigger(e)
that.enforceFocus()
+ var e = $.Event('shown.bs.modal', { relatedTarget: _relatedTarget })
+
transition ?
that.$element
.one($.support.transition.end, function () {
- that.$element.focus().trigger('shown.bs.modal')
+ that.$element.focus().trigger(e)
})
.emulateTransitionEnd(300) :
- that.$element.focus().trigger('shown.bs.modal')
+ that.$element.focus().trigger(e)
})
}
this.$element
.removeClass('in')
.attr('aria-hidden', true)
+ .off('click.dismiss.modal')
$.support.transition && this.$element.hasClass('fade') ?
this.$element
this.$backdrop = $('<div class="modal-backdrop ' + animate + '" />')
.appendTo(document.body)
- this.$element.on('click', $.proxy(function (e) {
+ this.$element.on('click.dismiss.modal', $.proxy(function (e) {
if (e.target !== e.currentTarget) return
this.options.backdrop == 'static'
? this.$element[0].focus.call(this.$element[0])
var old = $.fn.modal
- $.fn.modal = function (option) {
+ $.fn.modal = function (option, _relatedTarget) {
return this.each(function () {
var $this = $(this)
var data = $this.data('bs.modal')
var options = $.extend({}, Modal.DEFAULTS, $this.data(), typeof option == 'object' && option)
if (!data) $this.data('bs.modal', (data = new Modal(this, options)))
- if (typeof option == 'string') data[option]()
- else if (options.show) data.show()
+ if (typeof option == 'string') data[option](_relatedTarget)
+ else if (options.show) data.show(_relatedTarget)
})
}
var $this = $(this)
var href = $this.attr('href')
var $target = $($this.attr('data-target') || (href && href.replace(/.*(?=#[^\s]+$)/, ''))) //strip for ie7
- var option = $target.data('modal') ? 'toggle' : $.extend({ remote:!/#/.test(href) && href }, $target.data(), $this.data())
+ var option = $target.data('modal') ? 'toggle' : $.extend({ remote: !/#/.test(href) && href }, $target.data(), $this.data())
e.preventDefault()
$target
- .modal(option)
+ .modal(option, this)
.one('hide', function () {
$this.is(':visible') && $this.focus()
})
})
- var $body = $(document.body)
- .on('shown.bs.modal', '.modal', function () { $body.addClass('modal-open') })
- .on('hidden.bs.modal', '.modal', function () { $body.removeClass('modal-open') })
+ $(document)
+ .on('shown.bs.modal', '.modal', function () { $(document.body).addClass('modal-open') })
+ .on('hidden.bs.modal', '.modal', function () { $(document.body).removeClass('modal-open') })
}(window.jQuery);
/* ========================================================================
* Bootstrap: tooltip.js v3.0.0
- * http://twbs.github.com/bootstrap/javascript.html#affix
+ * http://twbs.github.com/bootstrap/javascript.html#tooltip
* Inspired by the original jQuery.tipsy by Jason Frame
* ========================================================================
* Copyright 2012 Twitter, Inc.
var eventIn = trigger == 'hover' ? 'mouseenter' : 'focus'
var eventOut = trigger == 'hover' ? 'mouseleave' : 'blur'
- this.$element.on(eventIn + '.' + this.type, this.options.selector, $.proxy(this.enter, this))
+ this.$element.on(eventIn + '.' + this.type, this.options.selector, $.proxy(this.enter, this))
this.$element.on(eventOut + '.' + this.type, this.options.selector, $.proxy(this.leave, this))
}
}
return options
}
- Tooltip.prototype.enter = function (obj) {
- var defaults = this.getDefaults()
+ Tooltip.prototype.getDelegateOptions = function () {
var options = {}
+ var defaults = this.getDefaults()
this._options && $.each(this._options, function (key, value) {
if (defaults[key] != value) options[key] = value
})
+ return options
+ }
+
+ Tooltip.prototype.enter = function (obj) {
var self = obj instanceof this.constructor ?
- obj : $(obj.currentTarget)[this.type](options).data('bs.' + this.type)
+ obj : $(obj.currentTarget)[this.type](this.getDelegateOptions()).data('bs.' + this.type)
clearTimeout(self.timeout)
Tooltip.prototype.leave = function (obj) {
var self = obj instanceof this.constructor ?
- obj : $(obj.currentTarget)[this.type](this._options).data('bs.' + this.type)
+ obj : $(obj.currentTarget)[this.type](this.getDelegateOptions()).data('bs.' + this.type)
clearTimeout(self.timeout)
.addClass(placement)
}
- var tp = placement == 'bottom' ? { top: pos.top + pos.height, left: pos.left + pos.width / 2 - actualWidth / 2 } :
- placement == 'top' ? { top: pos.top - actualHeight, left: pos.left + pos.width / 2 - actualWidth / 2 } :
- placement == 'left' ? { top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth } :
- /* placement == 'right' */ { top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width }
+ var calculatedOffset = this.getCalculatedOffset(placement, pos, actualWidth, actualHeight)
- this.applyPlacement(tp, placement)
+ this.applyPlacement(calculatedOffset, placement)
this.$element.trigger('shown.bs.' + this.type)
}
}
var height = $tip[0].offsetHeight
// manually read margins because getBoundingClientRect includes difference
- offset.top = offset.top + parseInt($tip.css('margin-top'), 10)
- offset.left = offset.left + parseInt($tip.css('margin-left'), 10)
+ var marginTop = parseInt($tip.css('margin-top'), 10)
+ var marginLeft = parseInt($tip.css('margin-left'), 10)
+
+ // we must check for NaN for ie 8/9
+ if (isNaN(marginTop)) marginTop = 0
+ if (isNaN(marginLeft)) marginLeft = 0
+
+ offset.top = offset.top + marginTop
+ offset.left = offset.left + marginLeft
$tip
.offset(offset)
.addClass('in')
+ // check to see if placing tip in new offset caused the tip to resize itself
var actualWidth = $tip[0].offsetWidth
var actualHeight = $tip[0].offsetHeight
if (placement == 'top' && actualHeight != height) {
replace = true
- offset.top = offset.top + height - actualHeight
+ offset.top = offset.top + height - actualHeight
}
- if (placement == 'bottom' || placement == 'top') {
+ if (/bottom|top/.test(placement)) {
var delta = 0
- if (offset.left < 0){
+ if (offset.left < 0) {
delta = offset.left * -2
offset.left = 0
var $tip = this.tip()
var e = $.Event('hide.bs.' + this.type)
+ function complete() { $tip.detach() }
+
this.$element.trigger(e)
if (e.isDefaultPrevented()) return
$.support.transition && this.$tip.hasClass('fade') ?
$tip
- .one($.support.transition.end, $tip.detach)
+ .one($.support.transition.end, complete)
.emulateTransitionEnd(150) :
- $tip.detach()
+ complete()
this.$element.trigger('hidden.bs.' + this.type)
}, this.$element.offset())
}
+ Tooltip.prototype.getCalculatedOffset = function (placement, pos, actualWidth, actualHeight) {
+ return placement == 'bottom' ? { top: pos.top + pos.height, left: pos.left + pos.width / 2 - actualWidth / 2 } :
+ placement == 'top' ? { top: pos.top - actualHeight, left: pos.left + pos.width / 2 - actualWidth / 2 } :
+ placement == 'left' ? { top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth } :
+ /* placement == 'right' */ { top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width }
+ }
+
Tooltip.prototype.getTitle = function () {
var title
var $e = this.$element
return this.$tip = this.$tip || $(this.options.template)
}
- Tooltip.prototype.arrow =function(){
- return this.$arrow = this.$arrow || this.tip().find(".tooltip-arrow")
+ Tooltip.prototype.arrow = function () {
+ return this.$arrow = this.$arrow || this.tip().find('.tooltip-arrow')
}
Tooltip.prototype.validate = function () {
}
Tooltip.prototype.toggle = function (e) {
- var self = e ? $(e.currentTarget)[this.type](this._options).data('bs.' + this.type) : this
+ var self = e ? $(e.currentTarget)[this.type](this.getDelegateOptions()).data('bs.' + this.type) : this
self.tip().hasClass('in') ? self.leave(self) : self.enter(self)
}
$tip.removeClass('fade top bottom left right in')
- $tip.find('.popover-title:empty').hide()
+ // IE8 doesn't accept hiding via the `:empty` pseudo selector, we have to do
+ // this manually by checking the contents.
+ if (!$tip.find('.popover-title').html()) $tip.find('.popover-title').hide()
}
Popover.prototype.hasContent = function () {
o.content)
}
+ Popover.prototype.arrow = function () {
+ return this.$arrow = this.$arrow || this.tip().find('.arrow')
+ }
+
Popover.prototype.tip = function () {
if (!this.$tip) this.$tip = $(this.options.template)
return this.$tip
}
- Popover.prototype.destroy = function () {
- this.hide().$element.off('.' + this.type).removeData(this.type)
- }
-
// POPOVER PLUGIN DEFINITION
// =========================
* Copyright 2013 Twitter Inc.
* http://www.apache.org/licenses/LICENSE-2.0
*/
-if(!jQuery)throw new Error("Bootstrap requires jQuery");+function(a){"use strict";function b(){var a=document.createElement("bootstrap"),b={WebkitTransition:"webkitTransitionEnd",MozTransition:"transitionend",OTransition:"oTransitionEnd otransitionend",transition:"transitionend"};for(var c in b)if(void 0!==a.style[c])return{end:b[c]}}a.fn.emulateTransitionEnd=function(b){var c=!1,d=this;a(this).one("webkitTransitionEnd",function(){c=!0});var e=function(){c||a(d).trigger("webkitTransitionEnd")};return setTimeout(e,b),this},a(function(){a.support.transition=b()})}(window.jQuery),+function(a){"use strict";var b='[data-dismiss="alert"]',c=function(c){a(c).on("click",b,this.close)};c.prototype.close=function(b){function c(){f.trigger("closed.bs.alert").remove()}var d=a(this),e=d.attr("data-target");e||(e=d.attr("href"),e=e&&e.replace(/.*(?=#[^\s]*$)/,""));var f=a(e);b&&b.preventDefault(),f.length||(f=d.hasClass("alert")?d:d.parent()),f.trigger(b=a.Event("close.bs.alert")),b.isDefaultPrevented()||(f.removeClass("in"),a.support.transition&&f.hasClass("fade")?f.one(a.support.transition.end,c).emulateTransitionEnd(150):c())};var d=a.fn.alert;a.fn.alert=function(b){return this.each(function(){var d=a(this),e=d.data("bs.alert");e||d.data("bs.alert",e=new c(this)),"string"==typeof b&&e[b].call(d)})},a.fn.alert.Constructor=c,a.fn.alert.noConflict=function(){return a.fn.alert=d,this},a(document).on("click.bs.alert.data-api",b,c.prototype.close)}(window.jQuery),+function(a){"use strict";var b=function(c,d){this.$element=a(c),this.options=a.extend({},b.DEFAULTS,d)};b.DEFAULTS={loadingText:"loading..."},b.prototype.setState=function(a){var b="disabled",c=this.$element,d=c.is("input")?"val":"html",e=c.data();a+="Text",e.resetText||c.data("resetText",c[d]()),c[d](e[a]||this.options[a]),setTimeout(function(){"loadingText"==a?c.addClass(b).attr(b,b):c.removeClass(b).removeAttr(b)},0)},b.prototype.toggle=function(){var a=this.$element.closest('[data-toggle="buttons"]');if(a.length){var b=this.$element.find("input").prop("checked",!this.$element.hasClass("active"));"radio"===b.prop("type")&&a.find(".active").removeClass("active")}this.$element.toggleClass("active")};var c=a.fn.button;a.fn.button=function(c){return this.each(function(){var d=a(this),e=d.data("button"),f="object"==typeof c&&c;e||d.data("bs.button",e=new b(this,f)),"toggle"==c?e.toggle():c&&e.setState(c)})},a.fn.button.Constructor=b,a.fn.button.noConflict=function(){return a.fn.button=c,this},a(document).on("click.bs.button.data-api","[data-toggle^=button]",function(b){var c=a(b.target);c.hasClass("btn")||(c=c.closest(".btn")),c.button("toggle"),b.preventDefault()})}(window.jQuery),+function(a){"use strict";var b=function(b,c){this.$element=a(b),this.$indicators=this.$element.find(".carousel-indicators"),this.options=c,this.paused=this.sliding=this.interval=this.$active=this.$items=null,"hover"==this.options.pause&&this.$element.on("mouseenter",a.proxy(this.pause,this)).on("mouseleave",a.proxy(this.cycle,this))};b.DEFAULTS={interval:5e3,pause:"hover"},b.prototype.cycle=function(b){return b||(this.paused=!1),this.interval&&clearInterval(this.interval),this.options.interval&&!this.paused&&(this.interval=setInterval(a.proxy(this.next,this),this.options.interval)),this},b.prototype.getActiveIndex=function(){return this.$active=this.$element.find(".item.active"),this.$items=this.$active.parent().children(),this.$items.index(this.$active)},b.prototype.to=function(b){var c=this,d=this.getActiveIndex();return b>this.$items.length-1||0>b?void 0:this.sliding?this.$element.one("slid",function(){c.to(b)}):d==b?this.pause().cycle():this.slide(b>d?"next":"prev",a(this.$items[b]))},b.prototype.pause=function(b){return b||(this.paused=!0),this.$element.find(".next, .prev").length&&a.support.transition.end&&(this.$element.trigger(a.support.transition.end),this.cycle(!0)),this.interval=clearInterval(this.interval),this},b.prototype.next=function(){return this.sliding?void 0:this.slide("next")},b.prototype.prev=function(){return this.sliding?void 0:this.slide("prev")},b.prototype.slide=function(b,c){var d=this.$element.find(".item.active"),e=c||d[b](),f=this.interval,g="next"==b?"left":"right",h="next"==b?"first":"last",i=this;this.sliding=!0,f&&this.pause(),e=e.length?e:this.$element.find(".item")[h]();var j=a.Event("slide.bs.carousel",{relatedTarget:e[0],direction:g});if(!e.hasClass("active")){if(this.$indicators.length&&(this.$indicators.find(".active").removeClass("active"),this.$element.one("slid",function(){var b=a(i.$indicators.children()[i.getActiveIndex()]);b&&b.addClass("active")})),a.support.transition&&this.$element.hasClass("slide")){if(this.$element.trigger(j),j.isDefaultPrevented())return;e.addClass(b),e[0].offsetWidth,d.addClass(g),e.addClass(g),d.one(a.support.transition.end,function(){e.removeClass([b,g].join(" ")).addClass("active"),d.removeClass(["active",g].join(" ")),i.sliding=!1,setTimeout(function(){i.$element.trigger("slid")},0)}).emulateTransitionEnd(600)}else{if(this.$element.trigger(j),j.isDefaultPrevented())return;d.removeClass("active"),e.addClass("active"),this.sliding=!1,this.$element.trigger("slid")}return f&&this.cycle(),this}};var c=a.fn.carousel;a.fn.carousel=function(c){return this.each(function(){var d=a(this),e=d.data("bs.carousel"),f=a.extend({},b.DEFAULTS,d.data(),"object"==typeof c&&c),g="string"==typeof c?c:f.slide;e||d.data("bs.carousel",e=new b(this,f)),"number"==typeof c?e.to(c):g?e[g]():f.interval&&e.pause().cycle()})},a.fn.carousel.Constructor=b,a.fn.carousel.noConflict=function(){return a.fn.carousel=c,this},a(document).on("click.bs.carousel.data-api","[data-slide], [data-slide-to]",function(b){var c,d=a(this),e=a(d.attr("data-target")||(c=d.attr("href"))&&c.replace(/.*(?=#[^\s]+$)/,"")),f=a.extend({},e.data(),d.data()),g=d.attr("data-slide-to");g&&(f.interval=!1),e.carousel(f),(g=d.attr("data-slide-to"))&&e.data("bs.carousel").to(g),b.preventDefault()}),a(window).on("load",function(){a('[data-ride="carousel"]').each(function(){var b=a(this);b.carousel(b.data())})})}(window.jQuery),+function(a){"use strict";var b=function(c,d){this.$element=a(c),this.options=a.extend({},b.DEFAULTS,d),this.transitioning=null,this.options.parent&&(this.$parent=a(this.options.parent)),this.options.toggle&&this.toggle()};b.DEFAULTS={toggle:!0},b.prototype.dimension=function(){var a=this.$element.hasClass("width");return a?"width":"height"},b.prototype.show=function(){if(!this.transitioning&&!this.$element.hasClass("in")){var b=a.Event("show.bs.collapse");if(this.$element.trigger(b),!b.isDefaultPrevented()){var c=this.$parent&&this.$parent.find("> .accordion-group > .in");if(c&&c.length){var d=c.data("bs.collapse");if(d&&d.transitioning)return;c.collapse("hide"),d||c.data("bs.collapse",null)}var e=this.dimension();this.$element.removeClass("collapse").addClass("collapsing")[e](0),this.transitioning=1;var f=function(){this.$element.removeClass("collapsing").addClass("in")[e]("auto"),this.transitioning=0,this.$element.trigger("shown.bs.collapse")};if(!a.support.transition)return f.call(this);var g=a.camelCase(["scroll",e].join("-"));this.$element.one(a.support.transition.end,a.proxy(f,this)).emulateTransitionEnd(350)[e](this.$element[0][g])}}},b.prototype.hide=function(){if(!this.transitioning&&this.$element.hasClass("in")){var b=a.Event("hide.bs.collapse");if(this.$element.trigger(b),!b.isDefaultPrevented()){var c=this.dimension();this.$element[c](this.$element[c]())[0].offsetHeight,this.$element.addClass("collapsing").removeClass("collapse").removeClass("in"),this.transitioning=1;var d=function(){this.transitioning=0,this.$element.trigger("hidden.bs.collapse").removeClass("collapsing").addClass("collapse")};return a.support.transition?(this.$element[c](0).one(a.support.transition.end,a.proxy(d,this)).emulateTransitionEnd(350),void 0):d.call(this)}}},b.prototype.toggle=function(){this[this.$element.hasClass("in")?"hide":"show"]()};var c=a.fn.collapse;a.fn.collapse=function(c){return this.each(function(){var d=a(this),e=d.data("bs.collapse"),f=a.extend({},b.DEFAULTS,d.data(),"object"==typeof c&&c);e||d.data("bs.collapse",e=new b(this,f)),"string"==typeof c&&e[c]()})},a.fn.collapse.Constructor=b,a.fn.collapse.noConflict=function(){return a.fn.collapse=c,this},a(document).on("click.bs.collapse.data-api","[data-toggle=collapse]",function(b){var c,d=a(this),e=d.attr("data-target")||b.preventDefault()||(c=d.attr("href"))&&c.replace(/.*(?=#[^\s]+$)/,""),f=a(e),g=f.data("bs.collapse"),h=g?"toggle":d.data(),i=d.attr("data-parent"),j=i&&a(i);g&&g.transitioning||(j&&j.find("[data-toggle=collapse][data-parent="+i+"]").not(d).addClass("collapsed"),d[f.hasClass("in")?"addClass":"removeClass"]("collapsed")),f.collapse(h)})}(window.jQuery),+function(a){"use strict";function b(){a(d).remove(),a(e).each(function(b){var d=c(a(this));d.hasClass("open")&&(d.trigger(b=a.Event("hide.bs.dropdown")),b.isDefaultPrevented()||d.removeClass("open").trigger("hidden.bs.dropdown"))})}function c(b){var c=b.attr("data-target");c||(c=b.attr("href"),c=c&&/#/.test(c)&&c.replace(/.*(?=#[^\s]*$)/,""));var d=c&&a(c);return d&&d.length?d:b.parent()}var d=".dropdown-backdrop",e="[data-toggle=dropdown]",f=function(b){a(b).on("click.bs.dropdown",this.toggle)};f.prototype.toggle=function(d){var e=a(this);if(!e.is(".disabled, :disabled")){var f=c(e),g=f.hasClass("open");if(b(),!g){if("ontouchstart"in document.documentElement&&a('<div class="dropdown-backdrop"/>').insertAfter(a(this)).on("click",b),f.trigger(d=a.Event("show.bs.dropdown")),d.isDefaultPrevented())return;f.toggleClass("open").trigger("shown.bs.dropdown")}return e.focus(),!1}},f.prototype.keydown=function(b){if(/(38|40|27)/.test(b.keyCode)){var d=a(this);if(b.preventDefault(),b.stopPropagation(),!d.is(".disabled, :disabled")){var f=c(d),g=f.hasClass("open");if(!g||g&&27==b.keyCode)return 27==b.which&&f.find(e).focus(),d.click();var h=a("[role=menu] li:not(.divider):visible a",f);if(h.length){var i=h.index(h.filter(":focus"));38==b.keyCode&&i>0&&i--,40==b.keyCode&&i<h.length-1&&i++,~i||(i=0),h.eq(i).focus()}}}};var g=a.fn.dropdown;a.fn.dropdown=function(b){return this.each(function(){var c=a(this),d=c.data("dropdown");d||c.data("dropdown",d=new f(this)),"string"==typeof b&&d[b].call(c)})},a.fn.dropdown.Constructor=f,a.fn.dropdown.noConflict=function(){return a.fn.dropdown=g,this},a(document).on("click.bs.dropdown.data-api",b).on("click.bs.dropdown.data-api",".dropdown form",function(a){a.stopPropagation()}).on("click.bs.dropdown.data-api",e,f.prototype.toggle).on("keydown.bs.dropdown.data-api",e+", [role=menu]",f.prototype.keydown)}(window.jQuery),+function(a){"use strict";var b=function(b,c){this.options=c,this.$element=a(b).on("click.dismiss.modal",'[data-dismiss="modal"]',a.proxy(this.hide,this)),this.$backdrop=this.isShown=null,this.options.remote&&this.$element.find(".modal-body").load(this.options.remote)};b.DEFAULTS={backdrop:!0,keyboard:!0,show:!0},b.prototype.toggle=function(){return this[this.isShown?"hide":"show"]()},b.prototype.show=function(){var b=this,c=a.Event("show.bs.modal");this.$element.trigger(c),this.isShown||c.isDefaultPrevented()||(this.isShown=!0,this.escape(),this.backdrop(function(){var c=a.support.transition&&b.$element.hasClass("fade");b.$element.parent().length||b.$element.appendTo(document.body),b.$element.show(),c&&b.$element[0].offsetWidth,b.$element.addClass("in").attr("aria-hidden",!1),b.enforceFocus(),c?b.$element.one(a.support.transition.end,function(){b.$element.focus().trigger("shown.bs.modal")}).emulateTransitionEnd(300):b.$element.focus().trigger("shown.bs.modal")}))},b.prototype.hide=function(b){b&&b.preventDefault(),b=a.Event("hide.bs.modal"),this.$element.trigger(b),this.isShown&&!b.isDefaultPrevented()&&(this.isShown=!1,this.escape(),a(document).off("focusin.bs.modal"),this.$element.removeClass("in").attr("aria-hidden",!0),a.support.transition&&this.$element.hasClass("fade")?this.$element.one(a.support.transition.end,a.proxy(this.hideModal,this)).emulateTransitionEnd(300):this.hideModal())},b.prototype.enforceFocus=function(){a(document).off("focusin.bs.modal").on("focusin.bs.modal",a.proxy(function(a){this.$element[0]===a.target||this.$element.has(a.target).length||this.$element.focus()},this))},b.prototype.escape=function(){this.isShown&&this.options.keyboard?this.$element.on("keyup.dismiss.bs.modal",a.proxy(function(a){27==a.which&&this.hide()},this)):this.isShown||this.$element.off("keyup.dismiss.bs.modal")},b.prototype.hideModal=function(){var a=this;this.$element.hide(),this.backdrop(function(){a.removeBackdrop(),a.$element.trigger("hidden.bs.modal")})},b.prototype.removeBackdrop=function(){this.$backdrop&&this.$backdrop.remove(),this.$backdrop=null},b.prototype.backdrop=function(b){var c=this.$element.hasClass("fade")?"fade":"";if(this.isShown&&this.options.backdrop){var d=a.support.transition&&c;if(this.$backdrop=a('<div class="modal-backdrop '+c+'" />').appendTo(document.body),this.$element.on("click",a.proxy(function(a){a.target===a.currentTarget&&("static"==this.options.backdrop?this.$element[0].focus.call(this.$element[0]):this.hide.call(this))},this)),d&&this.$backdrop[0].offsetWidth,this.$backdrop.addClass("in"),!b)return;d?this.$backdrop.one(a.support.transition.end,b).emulateTransitionEnd(150):b()}else!this.isShown&&this.$backdrop?(this.$backdrop.removeClass("in"),a.support.transition&&this.$element.hasClass("fade")?this.$backdrop.one(a.support.transition.end,b).emulateTransitionEnd(150):b()):b&&b()};var c=a.fn.modal;a.fn.modal=function(c){return this.each(function(){var d=a(this),e=d.data("bs.modal"),f=a.extend({},b.DEFAULTS,d.data(),"object"==typeof c&&c);e||d.data("bs.modal",e=new b(this,f)),"string"==typeof c?e[c]():f.show&&e.show()})},a.fn.modal.Constructor=b,a.fn.modal.noConflict=function(){return a.fn.modal=c,this},a(document).on("click.bs.modal.data-api",'[data-toggle="modal"]',function(b){var c=a(this),d=c.attr("href"),e=a(c.attr("data-target")||d&&d.replace(/.*(?=#[^\s]+$)/,"")),f=e.data("modal")?"toggle":a.extend({remote:!/#/.test(d)&&d},e.data(),c.data());b.preventDefault(),e.modal(f).one("hide",function(){c.is(":visible")&&c.focus()})});var d=a(document.body).on("shown.bs.modal",".modal",function(){d.addClass("modal-open")}).on("hidden.bs.modal",".modal",function(){d.removeClass("modal-open")})}(window.jQuery),+function(a){"use strict";var b=function(a,b){this.type=this.options=this.enabled=this.timeout=this.hoverState=this.$element=null,this.init("tooltip",a,b)};b.DEFAULTS={animation:!0,placement:"top",selector:!1,template:'<div class="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>',trigger:"hover focus",title:"",delay:0,html:!1,container:!1},b.prototype.init=function(b,c,d){this.enabled=!0,this.type=b,this.$element=a(c),this.options=this.getOptions(d);for(var e=this.options.trigger.split(" "),f=e.length;f--;){var g=e[f];if("click"==g)this.$element.on("click."+this.type,this.options.selector,a.proxy(this.toggle,this));else if("manual"!=g){var h="hover"==g?"mouseenter":"focus",i="hover"==g?"mouseleave":"blur";this.$element.on(h+"."+this.type,this.options.selector,a.proxy(this.enter,this)),this.$element.on(i+"."+this.type,this.options.selector,a.proxy(this.leave,this))}}this.options.selector?this._options=a.extend({},this.options,{trigger:"manual",selector:""}):this.fixTitle()},b.prototype.getDefaults=function(){return b.DEFAULTS},b.prototype.getOptions=function(b){return b=a.extend({},this.getDefaults(),this.$element.data(),b),b.delay&&"number"==typeof b.delay&&(b.delay={show:b.delay,hide:b.delay}),b},b.prototype.enter=function(b){var c=this.getDefaults(),d={};this._options&&a.each(this._options,function(a,b){c[a]!=b&&(d[a]=b)});var e=b instanceof this.constructor?b:a(b.currentTarget)[this.type](d).data("bs."+this.type);return clearTimeout(e.timeout),e.options.delay&&e.options.delay.show?(e.hoverState="in",e.timeout=setTimeout(function(){"in"==e.hoverState&&e.show()},e.options.delay.show),void 0):e.show()},b.prototype.leave=function(b){var c=b instanceof this.constructor?b:a(b.currentTarget)[this.type](this._options).data("bs."+this.type);return clearTimeout(c.timeout),c.options.delay&&c.options.delay.hide?(c.hoverState="out",c.timeout=setTimeout(function(){"out"==c.hoverState&&c.hide()},c.options.delay.hide),void 0):c.hide()},b.prototype.show=function(){var b=a.Event("show.bs."+this.type);if(this.hasContent()&&this.enabled){if(this.$element.trigger(b),b.isDefaultPrevented())return;var c=this.tip();this.setContent(),this.options.animation&&c.addClass("fade");var d="function"==typeof this.options.placement?this.options.placement.call(this,c[0],this.$element[0]):this.options.placement,e=/\s?auto?\s?/i,f=e.test(d);f&&(d=d.replace(e,"")||"top"),c.detach().css({top:0,left:0,display:"block"}).addClass(d),this.options.container?c.appendTo(this.options.container):c.insertAfter(this.$element);var g=this.getPosition(),h=c[0].offsetWidth,i=c[0].offsetHeight;if(f){var j=this.$element.parent(),k=d,l=document.documentElement.scrollTop||document.body.scrollTop,m="body"==this.options.container?window.innerWidth:j.outerWidth(),n="body"==this.options.container?window.innerHeight:j.outerHeight(),o="body"==this.options.container?0:j.offset().left;d="bottom"==d&&g.top+g.height+i-l>n?"top":"top"==d&&g.top-l-i<0?"bottom":"right"==d&&g.right+h>m?"left":"left"==d&&g.left-h<o?"right":d,c.removeClass(k).addClass(d)}var p="bottom"==d?{top:g.top+g.height,left:g.left+g.width/2-h/2}:"top"==d?{top:g.top-i,left:g.left+g.width/2-h/2}:"left"==d?{top:g.top+g.height/2-i/2,left:g.left-h}:{top:g.top+g.height/2-i/2,left:g.left+g.width};this.applyPlacement(p,d),this.$element.trigger("shown.bs."+this.type)}},b.prototype.applyPlacement=function(a,b){var c,d=this.tip(),e=d[0].offsetWidth,f=d[0].offsetHeight;a.top=a.top+parseInt(d.css("margin-top"),10),a.left=a.left+parseInt(d.css("margin-left"),10),d.offset(a).addClass("in");var g=d[0].offsetWidth,h=d[0].offsetHeight;if("top"==b&&h!=f&&(c=!0,a.top=a.top+f-h),"bottom"==b||"top"==b){var i=0;a.left<0&&(i=-2*a.left,a.left=0,d.offset(a),g=d[0].offsetWidth,h=d[0].offsetHeight),this.replaceArrow(i-e+g,g,"left")}else this.replaceArrow(h-f,h,"top");c&&d.offset(a)},b.prototype.replaceArrow=function(a,b,c){this.arrow().css(c,a?50*(1-a/b)+"%":"")},b.prototype.setContent=function(){var a=this.tip(),b=this.getTitle();a.find(".tooltip-inner")[this.options.html?"html":"text"](b),a.removeClass("fade in top bottom left right")},b.prototype.hide=function(){var b=this.tip(),c=a.Event("hide.bs."+this.type);return this.$element.trigger(c),c.isDefaultPrevented()?void 0:(b.removeClass("in"),a.support.transition&&this.$tip.hasClass("fade")?b.one(a.support.transition.end,b.detach).emulateTransitionEnd(150):b.detach(),this.$element.trigger("hidden.bs."+this.type),this)},b.prototype.fixTitle=function(){var a=this.$element;(a.attr("title")||"string"!=typeof a.attr("data-original-title"))&&a.attr("data-original-title",a.attr("title")||"").attr("title","")},b.prototype.hasContent=function(){return this.getTitle()},b.prototype.getPosition=function(){var b=this.$element[0];return a.extend({},"function"==typeof b.getBoundingClientRect?b.getBoundingClientRect():{width:b.offsetWidth,height:b.offsetHeight},this.$element.offset())},b.prototype.getTitle=function(){var a,b=this.$element,c=this.options;return a=b.attr("data-original-title")||("function"==typeof c.title?c.title.call(b[0]):c.title)},b.prototype.tip=function(){return this.$tip=this.$tip||a(this.options.template)},b.prototype.arrow=function(){return this.$arrow=this.$arrow||this.tip().find(".tooltip-arrow")},b.prototype.validate=function(){this.$element[0].parentNode||(this.hide(),this.$element=null,this.options=null)},b.prototype.enable=function(){this.enabled=!0},b.prototype.disable=function(){this.enabled=!1},b.prototype.toggleEnabled=function(){this.enabled=!this.enabled},b.prototype.toggle=function(b){var c=b?a(b.currentTarget)[this.type](this._options).data("bs."+this.type):this;c.tip().hasClass("in")?c.leave(c):c.enter(c)},b.prototype.destroy=function(){this.hide().$element.off("."+this.type).removeData("bs."+this.type)};var c=a.fn.tooltip;a.fn.tooltip=function(c){return this.each(function(){var d=a(this),e=d.data("bs.tooltip"),f="object"==typeof c&&c;e||d.data("bs.tooltip",e=new b(this,f)),"string"==typeof c&&e[c]()})},a.fn.tooltip.Constructor=b,a.fn.tooltip.noConflict=function(){return a.fn.tooltip=c,this}}(window.jQuery),+function(a){"use strict";var b=function(a,b){this.init("popover",a,b)};if(!a.fn.tooltip)throw new Error("Popover requires tooltip.js");b.DEFAULTS=a.extend({},a.fn.tooltip.Constructor.DEFAULTS,{placement:"right",trigger:"click",content:"",template:'<div class="popover"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>'}),b.prototype=a.extend({},a.fn.tooltip.Constructor.prototype),b.prototype.constructor=b,b.prototype.getDefaults=function(){return b.DEFAULTS},b.prototype.setContent=function(){var a=this.tip(),b=this.getTitle(),c=this.getContent();a.find(".popover-title")[this.options.html?"html":"text"](b),a.find(".popover-content")[this.options.html?"html":"text"](c),a.removeClass("fade top bottom left right in"),a.find(".popover-title:empty").hide()},b.prototype.hasContent=function(){return this.getTitle()||this.getContent()},b.prototype.getContent=function(){var a=this.$element,b=this.options;return a.attr("data-content")||("function"==typeof b.content?b.content.call(a[0]):b.content)},b.prototype.tip=function(){return this.$tip||(this.$tip=a(this.options.template)),this.$tip},b.prototype.destroy=function(){this.hide().$element.off("."+this.type).removeData(this.type)};var c=a.fn.popover;a.fn.popover=function(c){return this.each(function(){var d=a(this),e=d.data("bs.popover"),f="object"==typeof c&&c;e||d.data("bs.popover",e=new b(this,f)),"string"==typeof c&&e[c]()})},a.fn.popover.Constructor=b,a.fn.popover.noConflict=function(){return a.fn.popover=c,this}}(window.jQuery),+function(a){"use strict";function b(c,d){var e,f=a.proxy(this.process,this);this.$element=a(c).is("body")?a(window):a(c),this.$body=a("body"),this.$scrollElement=this.$element.on("scroll.bs.scroll-spy.data-api",f),this.options=a.extend({},b.DEFAULTS,d),this.selector=(this.options.target||(e=a(c).attr("href"))&&e.replace(/.*(?=#[^\s]+$)/,"")||"")+" .nav li > a",this.offsets=a([]),this.targets=a([]),this.activeTarget=null,this.refresh(),this.process()}b.DEFAULTS={offset:10},b.prototype.refresh=function(){var b=this.$element[0]==window?"offset":"position";this.offsets=a([]),this.targets=a([]);var c=this;this.$body.find(this.selector).map(function(){var d=a(this),e=d.data("target")||d.attr("href"),f=/^#\w/.test(e)&&a(e);return f&&f.length&&[[f[b]().top+(!a.isWindow(c.$scrollElement.get(0))&&c.$scrollElement.scrollTop()),e]]||null}).sort(function(a,b){return a[0]-b[0]}).each(function(){c.offsets.push(this[0]),c.targets.push(this[1])})},b.prototype.process=function(){var a,b=this.$scrollElement.scrollTop()+this.options.offset,c=this.$scrollElement[0].scrollHeight||this.$body[0].scrollHeight,d=c-this.$scrollElement.height(),e=this.offsets,f=this.targets,g=this.activeTarget;if(b>=d)return g!=(a=f.last()[0])&&this.activate(a);for(a=e.length;a--;)g!=f[a]&&b>=e[a]&&(!e[a+1]||b<=e[a+1])&&this.activate(f[a])},b.prototype.activate=function(b){this.activeTarget=b,a(this.selector).parents(".active").removeClass("active");var c=this.selector+'[data-target="'+b+'"],'+this.selector+'[href="'+b+'"]',d=a(c).parents("li").addClass("active");d.parent(".dropdown-menu").length&&(d=d.closest("li.dropdown").addClass("active")),d.trigger("activate")};var c=a.fn.scrollspy;a.fn.scrollspy=function(c){return this.each(function(){var d=a(this),e=d.data("bs.scrollspy"),f="object"==typeof c&&c;e||d.data("bs.scrollspy",e=new b(this,f)),"string"==typeof c&&e[c]()})},a.fn.scrollspy.Constructor=b,a.fn.scrollspy.noConflict=function(){return a.fn.scrollspy=c,this},a(window).on("load",function(){a('[data-spy="scroll"]').each(function(){var b=a(this);b.scrollspy(b.data())})})}(window.jQuery),+function(a){"use strict";var b=function(b){this.element=a(b)};b.prototype.show=function(){var b=this.element,c=b.closest("ul:not(.dropdown-menu)"),d=b.attr("data-target");if(d||(d=b.attr("href"),d=d&&d.replace(/.*(?=#[^\s]*$)/,"")),!b.parent("li").hasClass("active")){var e=c.find(".active:last a")[0],f=a.Event("show.bs.tab",{relatedTarget:e});if(b.trigger(f),!f.isDefaultPrevented()){var g=a(d);this.activate(b.parent("li"),c),this.activate(g,g.parent(),function(){b.trigger({type:"shown.bs.tab",relatedTarget:e})})}}},b.prototype.activate=function(b,c,d){function e(){f.removeClass("active").find("> .dropdown-menu > .active").removeClass("active"),b.addClass("active"),g?(b[0].offsetWidth,b.addClass("in")):b.removeClass("fade"),b.parent(".dropdown-menu")&&b.closest("li.dropdown").addClass("active"),d&&d()}var f=c.find("> .active"),g=d&&a.support.transition&&f.hasClass("fade");g?f.one(a.support.transition.end,e).emulateTransitionEnd(150):e(),f.removeClass("in")};var c=a.fn.tab;a.fn.tab=function(c){return this.each(function(){var d=a(this),e=d.data("bs.tab");e||d.data("bs.tab",e=new b(this)),"string"==typeof c&&e[c]()})},a.fn.tab.Constructor=b,a.fn.tab.noConflict=function(){return a.fn.tab=c,this},a(document).on("click.bs.tab.data-api",'[data-toggle="tab"], [data-toggle="pill"]',function(b){b.preventDefault(),a(this).tab("show")})}(window.jQuery),+function(a){"use strict";var b=function(c,d){this.options=a.extend({},b.DEFAULTS,d),this.$window=a(window).on("scroll.bs.affix.data-api",a.proxy(this.checkPosition,this)).on("click.bs.affix.data-api",a.proxy(this.checkPositionWithEventLoop,this)),this.$element=a(c),this.affixed=this.unpin=null,this.checkPosition()};b.RESET="affix affix-top affix-bottom",b.DEFAULTS={offset:0},b.prototype.checkPositionWithEventLoop=function(){setTimeout(a.proxy(this.checkPosition,this),1)},b.prototype.checkPosition=function(){if(this.$element.is(":visible")){var c=a(document).height(),d=this.$window.scrollTop(),e=this.$element.offset(),f=this.options.offset,g=f.top,h=f.bottom;"object"!=typeof f&&(h=g=f),"function"==typeof g&&(g=f.top()),"function"==typeof h&&(h=f.bottom());var i=null!=this.unpin&&d+this.unpin<=e.top?!1:null!=h&&e.top+this.$element.height()>=c-h?"bottom":null!=g&&g>=d?"top":!1;this.affixed!==i&&(this.unpin&&this.$element.css("top",""),this.affixed=i,this.unpin="bottom"==i?e.top-d:null,this.$element.removeClass(b.RESET).addClass("affix"+(i?"-"+i:"")),"bottom"==i&&this.$element.offset({top:document.body.offsetHeight-h-this.$element.height()}))}};var c=a.fn.affix;a.fn.affix=function(c){return this.each(function(){var d=a(this),e=d.data("bs.affix"),f="object"==typeof c&&c;e||d.data("bs.affix",e=new b(this,f)),"string"==typeof c&&e[c]()})},a.fn.affix.Constructor=b,a.fn.affix.noConflict=function(){return a.fn.affix=c,this},a(window).on("load",function(){a('[data-spy="affix"]').each(function(){var b=a(this),c=b.data();c.offset=c.offset||{},c.offsetBottom&&(c.offset.bottom=c.offsetBottom),c.offsetTop&&(c.offset.top=c.offsetTop),b.affix(c)})})}(window.jQuery);
\ No newline at end of file
+if(!jQuery)throw new Error("Bootstrap requires jQuery");+function(a){"use strict";function b(){var a=document.createElement("bootstrap"),b={WebkitTransition:"webkitTransitionEnd",MozTransition:"transitionend",OTransition:"oTransitionEnd otransitionend",transition:"transitionend"};for(var c in b)if(void 0!==a.style[c])return{end:b[c]}}a.fn.emulateTransitionEnd=function(b){var c=!1,d=this;a(this).one(a.support.transition.end,function(){c=!0});var e=function(){c||a(d).trigger(a.support.transition.end)};return setTimeout(e,b),this},a(function(){a.support.transition=b()})}(window.jQuery),+function(a){"use strict";var b='[data-dismiss="alert"]',c=function(c){a(c).on("click",b,this.close)};c.prototype.close=function(b){function c(){f.trigger("closed.bs.alert").remove()}var d=a(this),e=d.attr("data-target");e||(e=d.attr("href"),e=e&&e.replace(/.*(?=#[^\s]*$)/,""));var f=a(e);b&&b.preventDefault(),f.length||(f=d.hasClass("alert")?d:d.parent()),f.trigger(b=a.Event("close.bs.alert")),b.isDefaultPrevented()||(f.removeClass("in"),a.support.transition&&f.hasClass("fade")?f.one(a.support.transition.end,c).emulateTransitionEnd(150):c())};var d=a.fn.alert;a.fn.alert=function(b){return this.each(function(){var d=a(this),e=d.data("bs.alert");e||d.data("bs.alert",e=new c(this)),"string"==typeof b&&e[b].call(d)})},a.fn.alert.Constructor=c,a.fn.alert.noConflict=function(){return a.fn.alert=d,this},a(document).on("click.bs.alert.data-api",b,c.prototype.close)}(window.jQuery),+function(a){"use strict";var b=function(c,d){this.$element=a(c),this.options=a.extend({},b.DEFAULTS,d)};b.DEFAULTS={loadingText:"loading..."},b.prototype.setState=function(a){var b="disabled",c=this.$element,d=c.is("input")?"val":"html",e=c.data();a+="Text",e.resetText||c.data("resetText",c[d]()),c[d](e[a]||this.options[a]),setTimeout(function(){"loadingText"==a?c.addClass(b).attr(b,b):c.removeClass(b).removeAttr(b)},0)},b.prototype.toggle=function(){var a=this.$element.closest('[data-toggle="buttons"]');if(a.length){var b=this.$element.find("input").prop("checked",!this.$element.hasClass("active")).trigger("change");"radio"===b.prop("type")&&a.find(".active").removeClass("active")}this.$element.toggleClass("active")};var c=a.fn.button;a.fn.button=function(c){return this.each(function(){var d=a(this),e=d.data("bs.button"),f="object"==typeof c&&c;e||d.data("bs.button",e=new b(this,f)),"toggle"==c?e.toggle():c&&e.setState(c)})},a.fn.button.Constructor=b,a.fn.button.noConflict=function(){return a.fn.button=c,this},a(document).on("click.bs.button.data-api","[data-toggle^=button]",function(b){var c=a(b.target);c.hasClass("btn")||(c=c.closest(".btn")),c.button("toggle"),b.preventDefault()})}(window.jQuery),+function(a){"use strict";var b=function(b,c){this.$element=a(b),this.$indicators=this.$element.find(".carousel-indicators"),this.options=c,this.paused=this.sliding=this.interval=this.$active=this.$items=null,"hover"==this.options.pause&&this.$element.on("mouseenter",a.proxy(this.pause,this)).on("mouseleave",a.proxy(this.cycle,this))};b.DEFAULTS={interval:5e3,pause:"hover",wrap:!0},b.prototype.cycle=function(b){return b||(this.paused=!1),this.interval&&clearInterval(this.interval),this.options.interval&&!this.paused&&(this.interval=setInterval(a.proxy(this.next,this),this.options.interval)),this},b.prototype.getActiveIndex=function(){return this.$active=this.$element.find(".item.active"),this.$items=this.$active.parent().children(),this.$items.index(this.$active)},b.prototype.to=function(b){var c=this,d=this.getActiveIndex();return b>this.$items.length-1||0>b?void 0:this.sliding?this.$element.one("slid",function(){c.to(b)}):d==b?this.pause().cycle():this.slide(b>d?"next":"prev",a(this.$items[b]))},b.prototype.pause=function(b){return b||(this.paused=!0),this.$element.find(".next, .prev").length&&a.support.transition.end&&(this.$element.trigger(a.support.transition.end),this.cycle(!0)),this.interval=clearInterval(this.interval),this},b.prototype.next=function(){return this.sliding?void 0:this.slide("next")},b.prototype.prev=function(){return this.sliding?void 0:this.slide("prev")},b.prototype.slide=function(b,c){var d=this.$element.find(".item.active"),e=c||d[b](),f=this.interval,g="next"==b?"left":"right",h="next"==b?"first":"last",i=this;if(!e.length){if(!this.options.wrap)return;e=this.$element.find(".item")[h]()}this.sliding=!0,f&&this.pause();var j=a.Event("slide.bs.carousel",{relatedTarget:e[0],direction:g});if(!e.hasClass("active")){if(this.$indicators.length&&(this.$indicators.find(".active").removeClass("active"),this.$element.one("slid",function(){var b=a(i.$indicators.children()[i.getActiveIndex()]);b&&b.addClass("active")})),a.support.transition&&this.$element.hasClass("slide")){if(this.$element.trigger(j),j.isDefaultPrevented())return;e.addClass(b),e[0].offsetWidth,d.addClass(g),e.addClass(g),d.one(a.support.transition.end,function(){e.removeClass([b,g].join(" ")).addClass("active"),d.removeClass(["active",g].join(" ")),i.sliding=!1,setTimeout(function(){i.$element.trigger("slid")},0)}).emulateTransitionEnd(600)}else{if(this.$element.trigger(j),j.isDefaultPrevented())return;d.removeClass("active"),e.addClass("active"),this.sliding=!1,this.$element.trigger("slid")}return f&&this.cycle(),this}};var c=a.fn.carousel;a.fn.carousel=function(c){return this.each(function(){var d=a(this),e=d.data("bs.carousel"),f=a.extend({},b.DEFAULTS,d.data(),"object"==typeof c&&c),g="string"==typeof c?c:f.slide;e||d.data("bs.carousel",e=new b(this,f)),"number"==typeof c?e.to(c):g?e[g]():f.interval&&e.pause().cycle()})},a.fn.carousel.Constructor=b,a.fn.carousel.noConflict=function(){return a.fn.carousel=c,this},a(document).on("click.bs.carousel.data-api","[data-slide], [data-slide-to]",function(b){var c,d=a(this),e=a(d.attr("data-target")||(c=d.attr("href"))&&c.replace(/.*(?=#[^\s]+$)/,"")),f=a.extend({},e.data(),d.data()),g=d.attr("data-slide-to");g&&(f.interval=!1),e.carousel(f),(g=d.attr("data-slide-to"))&&e.data("bs.carousel").to(g),b.preventDefault()}),a(window).on("load",function(){a('[data-ride="carousel"]').each(function(){var b=a(this);b.carousel(b.data())})})}(window.jQuery),+function(a){"use strict";var b=function(c,d){this.$element=a(c),this.options=a.extend({},b.DEFAULTS,d),this.transitioning=null,this.options.parent&&(this.$parent=a(this.options.parent)),this.options.toggle&&this.toggle()};b.DEFAULTS={toggle:!0},b.prototype.dimension=function(){var a=this.$element.hasClass("width");return a?"width":"height"},b.prototype.show=function(){if(!this.transitioning&&!this.$element.hasClass("in")){var b=a.Event("show.bs.collapse");if(this.$element.trigger(b),!b.isDefaultPrevented()){var c=this.$parent&&this.$parent.find("> .panel > .in");if(c&&c.length){var d=c.data("bs.collapse");if(d&&d.transitioning)return;c.collapse("hide"),d||c.data("bs.collapse",null)}var e=this.dimension();this.$element.removeClass("collapse").addClass("collapsing")[e](0),this.transitioning=1;var f=function(){this.$element.removeClass("collapsing").addClass("in")[e]("auto"),this.transitioning=0,this.$element.trigger("shown.bs.collapse")};if(!a.support.transition)return f.call(this);var g=a.camelCase(["scroll",e].join("-"));this.$element.one(a.support.transition.end,a.proxy(f,this)).emulateTransitionEnd(350)[e](this.$element[0][g])}}},b.prototype.hide=function(){if(!this.transitioning&&this.$element.hasClass("in")){var b=a.Event("hide.bs.collapse");if(this.$element.trigger(b),!b.isDefaultPrevented()){var c=this.dimension();this.$element[c](this.$element[c]())[0].offsetHeight,this.$element.addClass("collapsing").removeClass("collapse").removeClass("in"),this.transitioning=1;var d=function(){this.transitioning=0,this.$element.trigger("hidden.bs.collapse").removeClass("collapsing").addClass("collapse")};return a.support.transition?(this.$element[c](0).one(a.support.transition.end,a.proxy(d,this)).emulateTransitionEnd(350),void 0):d.call(this)}}},b.prototype.toggle=function(){this[this.$element.hasClass("in")?"hide":"show"]()};var c=a.fn.collapse;a.fn.collapse=function(c){return this.each(function(){var d=a(this),e=d.data("bs.collapse"),f=a.extend({},b.DEFAULTS,d.data(),"object"==typeof c&&c);e||d.data("bs.collapse",e=new b(this,f)),"string"==typeof c&&e[c]()})},a.fn.collapse.Constructor=b,a.fn.collapse.noConflict=function(){return a.fn.collapse=c,this},a(document).on("click.bs.collapse.data-api","[data-toggle=collapse]",function(b){var c,d=a(this),e=d.attr("data-target")||b.preventDefault()||(c=d.attr("href"))&&c.replace(/.*(?=#[^\s]+$)/,""),f=a(e),g=f.data("bs.collapse"),h=g?"toggle":d.data(),i=d.attr("data-parent"),j=i&&a(i);g&&g.transitioning||(j&&j.find('[data-toggle=collapse][data-parent="'+i+'"]').not(d).addClass("collapsed"),d[f.hasClass("in")?"addClass":"removeClass"]("collapsed")),f.collapse(h)})}(window.jQuery),+function(a){"use strict";function b(){a(d).remove(),a(e).each(function(b){var d=c(a(this));d.hasClass("open")&&(d.trigger(b=a.Event("hide.bs.dropdown")),b.isDefaultPrevented()||d.removeClass("open").trigger("hidden.bs.dropdown"))})}function c(b){var c=b.attr("data-target");c||(c=b.attr("href"),c=c&&/#/.test(c)&&c.replace(/.*(?=#[^\s]*$)/,""));var d=c&&a(c);return d&&d.length?d:b.parent()}var d=".dropdown-backdrop",e="[data-toggle=dropdown]",f=function(b){a(b).on("click.bs.dropdown",this.toggle)};f.prototype.toggle=function(d){var e=a(this);if(!e.is(".disabled, :disabled")){var f=c(e),g=f.hasClass("open");if(b(),!g){if("ontouchstart"in document.documentElement&&a('<div class="dropdown-backdrop"/>').insertAfter(a(this)).on("click",b),f.trigger(d=a.Event("show.bs.dropdown")),d.isDefaultPrevented())return;f.toggleClass("open").trigger("shown.bs.dropdown")}return e.focus(),!1}},f.prototype.keydown=function(b){if(/(38|40|27)/.test(b.keyCode)){var d=a(this);if(b.preventDefault(),b.stopPropagation(),!d.is(".disabled, :disabled")){var f=c(d),g=f.hasClass("open");if(!g||g&&27==b.keyCode)return 27==b.which&&f.find(e).focus(),d.click();var h=a("[role=menu] li:not(.divider):visible a",f);if(h.length){var i=h.index(h.filter(":focus"));38==b.keyCode&&i>0&&i--,40==b.keyCode&&i<h.length-1&&i++,~i||(i=0),h.eq(i).focus()}}}};var g=a.fn.dropdown;a.fn.dropdown=function(b){return this.each(function(){var c=a(this),d=c.data("dropdown");d||c.data("dropdown",d=new f(this)),"string"==typeof b&&d[b].call(c)})},a.fn.dropdown.Constructor=f,a.fn.dropdown.noConflict=function(){return a.fn.dropdown=g,this},a(document).on("click.bs.dropdown.data-api",b).on("click.bs.dropdown.data-api",".dropdown form",function(a){a.stopPropagation()}).on("click.bs.dropdown.data-api",e,f.prototype.toggle).on("keydown.bs.dropdown.data-api",e+", [role=menu]",f.prototype.keydown)}(window.jQuery),+function(a){"use strict";var b=function(b,c){this.options=c,this.$element=a(b).on("click.dismiss.modal",'[data-dismiss="modal"]',a.proxy(this.hide,this)),this.$backdrop=this.isShown=null,this.options.remote&&this.$element.load(this.options.remote)};b.DEFAULTS={backdrop:!0,keyboard:!0,show:!0},b.prototype.toggle=function(a){return this[this.isShown?"hide":"show"](a)},b.prototype.show=function(b){var c=this,d=a.Event("show.bs.modal",{relatedTarget:b});this.$element.trigger(d),this.isShown||d.isDefaultPrevented()||(this.isShown=!0,this.escape(),this.backdrop(function(){var d=a.support.transition&&c.$element.hasClass("fade");c.$element.parent().length||c.$element.appendTo(document.body),c.$element.show(),d&&c.$element[0].offsetWidth,c.$element.addClass("in").attr("aria-hidden",!1),c.enforceFocus();var e=a.Event("shown.bs.modal",{relatedTarget:b});d?c.$element.one(a.support.transition.end,function(){c.$element.focus().trigger(e)}).emulateTransitionEnd(300):c.$element.focus().trigger(e)}))},b.prototype.hide=function(b){b&&b.preventDefault(),b=a.Event("hide.bs.modal"),this.$element.trigger(b),this.isShown&&!b.isDefaultPrevented()&&(this.isShown=!1,this.escape(),a(document).off("focusin.bs.modal"),this.$element.removeClass("in").attr("aria-hidden",!0).off("click.dismiss.modal"),a.support.transition&&this.$element.hasClass("fade")?this.$element.one(a.support.transition.end,a.proxy(this.hideModal,this)).emulateTransitionEnd(300):this.hideModal())},b.prototype.enforceFocus=function(){a(document).off("focusin.bs.modal").on("focusin.bs.modal",a.proxy(function(a){this.$element[0]===a.target||this.$element.has(a.target).length||this.$element.focus()},this))},b.prototype.escape=function(){this.isShown&&this.options.keyboard?this.$element.on("keyup.dismiss.bs.modal",a.proxy(function(a){27==a.which&&this.hide()},this)):this.isShown||this.$element.off("keyup.dismiss.bs.modal")},b.prototype.hideModal=function(){var a=this;this.$element.hide(),this.backdrop(function(){a.removeBackdrop(),a.$element.trigger("hidden.bs.modal")})},b.prototype.removeBackdrop=function(){this.$backdrop&&this.$backdrop.remove(),this.$backdrop=null},b.prototype.backdrop=function(b){var c=this.$element.hasClass("fade")?"fade":"";if(this.isShown&&this.options.backdrop){var d=a.support.transition&&c;if(this.$backdrop=a('<div class="modal-backdrop '+c+'" />').appendTo(document.body),this.$element.on("click.dismiss.modal",a.proxy(function(a){a.target===a.currentTarget&&("static"==this.options.backdrop?this.$element[0].focus.call(this.$element[0]):this.hide.call(this))},this)),d&&this.$backdrop[0].offsetWidth,this.$backdrop.addClass("in"),!b)return;d?this.$backdrop.one(a.support.transition.end,b).emulateTransitionEnd(150):b()}else!this.isShown&&this.$backdrop?(this.$backdrop.removeClass("in"),a.support.transition&&this.$element.hasClass("fade")?this.$backdrop.one(a.support.transition.end,b).emulateTransitionEnd(150):b()):b&&b()};var c=a.fn.modal;a.fn.modal=function(c,d){return this.each(function(){var e=a(this),f=e.data("bs.modal"),g=a.extend({},b.DEFAULTS,e.data(),"object"==typeof c&&c);f||e.data("bs.modal",f=new b(this,g)),"string"==typeof c?f[c](d):g.show&&f.show(d)})},a.fn.modal.Constructor=b,a.fn.modal.noConflict=function(){return a.fn.modal=c,this},a(document).on("click.bs.modal.data-api",'[data-toggle="modal"]',function(b){var c=a(this),d=c.attr("href"),e=a(c.attr("data-target")||d&&d.replace(/.*(?=#[^\s]+$)/,"")),f=e.data("modal")?"toggle":a.extend({remote:!/#/.test(d)&&d},e.data(),c.data());b.preventDefault(),e.modal(f,this).one("hide",function(){c.is(":visible")&&c.focus()})}),a(document).on("shown.bs.modal",".modal",function(){a(document.body).addClass("modal-open")}).on("hidden.bs.modal",".modal",function(){a(document.body).removeClass("modal-open")})}(window.jQuery),+function(a){"use strict";var b=function(a,b){this.type=this.options=this.enabled=this.timeout=this.hoverState=this.$element=null,this.init("tooltip",a,b)};b.DEFAULTS={animation:!0,placement:"top",selector:!1,template:'<div class="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>',trigger:"hover focus",title:"",delay:0,html:!1,container:!1},b.prototype.init=function(b,c,d){this.enabled=!0,this.type=b,this.$element=a(c),this.options=this.getOptions(d);for(var e=this.options.trigger.split(" "),f=e.length;f--;){var g=e[f];if("click"==g)this.$element.on("click."+this.type,this.options.selector,a.proxy(this.toggle,this));else if("manual"!=g){var h="hover"==g?"mouseenter":"focus",i="hover"==g?"mouseleave":"blur";this.$element.on(h+"."+this.type,this.options.selector,a.proxy(this.enter,this)),this.$element.on(i+"."+this.type,this.options.selector,a.proxy(this.leave,this))}}this.options.selector?this._options=a.extend({},this.options,{trigger:"manual",selector:""}):this.fixTitle()},b.prototype.getDefaults=function(){return b.DEFAULTS},b.prototype.getOptions=function(b){return b=a.extend({},this.getDefaults(),this.$element.data(),b),b.delay&&"number"==typeof b.delay&&(b.delay={show:b.delay,hide:b.delay}),b},b.prototype.getDelegateOptions=function(){var b={},c=this.getDefaults();return this._options&&a.each(this._options,function(a,d){c[a]!=d&&(b[a]=d)}),b},b.prototype.enter=function(b){var c=b instanceof this.constructor?b:a(b.currentTarget)[this.type](this.getDelegateOptions()).data("bs."+this.type);return clearTimeout(c.timeout),c.options.delay&&c.options.delay.show?(c.hoverState="in",c.timeout=setTimeout(function(){"in"==c.hoverState&&c.show()},c.options.delay.show),void 0):c.show()},b.prototype.leave=function(b){var c=b instanceof this.constructor?b:a(b.currentTarget)[this.type](this.getDelegateOptions()).data("bs."+this.type);return clearTimeout(c.timeout),c.options.delay&&c.options.delay.hide?(c.hoverState="out",c.timeout=setTimeout(function(){"out"==c.hoverState&&c.hide()},c.options.delay.hide),void 0):c.hide()},b.prototype.show=function(){var b=a.Event("show.bs."+this.type);if(this.hasContent()&&this.enabled){if(this.$element.trigger(b),b.isDefaultPrevented())return;var c=this.tip();this.setContent(),this.options.animation&&c.addClass("fade");var d="function"==typeof this.options.placement?this.options.placement.call(this,c[0],this.$element[0]):this.options.placement,e=/\s?auto?\s?/i,f=e.test(d);f&&(d=d.replace(e,"")||"top"),c.detach().css({top:0,left:0,display:"block"}).addClass(d),this.options.container?c.appendTo(this.options.container):c.insertAfter(this.$element);var g=this.getPosition(),h=c[0].offsetWidth,i=c[0].offsetHeight;if(f){var j=this.$element.parent(),k=d,l=document.documentElement.scrollTop||document.body.scrollTop,m="body"==this.options.container?window.innerWidth:j.outerWidth(),n="body"==this.options.container?window.innerHeight:j.outerHeight(),o="body"==this.options.container?0:j.offset().left;d="bottom"==d&&g.top+g.height+i-l>n?"top":"top"==d&&g.top-l-i<0?"bottom":"right"==d&&g.right+h>m?"left":"left"==d&&g.left-h<o?"right":d,c.removeClass(k).addClass(d)}var p=this.getCalculatedOffset(d,g,h,i);this.applyPlacement(p,d),this.$element.trigger("shown.bs."+this.type)}},b.prototype.applyPlacement=function(a,b){var c,d=this.tip(),e=d[0].offsetWidth,f=d[0].offsetHeight,g=parseInt(d.css("margin-top"),10),h=parseInt(d.css("margin-left"),10);isNaN(g)&&(g=0),isNaN(h)&&(h=0),a.top=a.top+g,a.left=a.left+h,d.offset(a).addClass("in");var i=d[0].offsetWidth,j=d[0].offsetHeight;if("top"==b&&j!=f&&(c=!0,a.top=a.top+f-j),/bottom|top/.test(b)){var k=0;a.left<0&&(k=-2*a.left,a.left=0,d.offset(a),i=d[0].offsetWidth,j=d[0].offsetHeight),this.replaceArrow(k-e+i,i,"left")}else this.replaceArrow(j-f,j,"top");c&&d.offset(a)},b.prototype.replaceArrow=function(a,b,c){this.arrow().css(c,a?50*(1-a/b)+"%":"")},b.prototype.setContent=function(){var a=this.tip(),b=this.getTitle();a.find(".tooltip-inner")[this.options.html?"html":"text"](b),a.removeClass("fade in top bottom left right")},b.prototype.hide=function(){function b(){c.detach()}var c=this.tip(),d=a.Event("hide.bs."+this.type);return this.$element.trigger(d),d.isDefaultPrevented()?void 0:(c.removeClass("in"),a.support.transition&&this.$tip.hasClass("fade")?c.one(a.support.transition.end,b).emulateTransitionEnd(150):b(),this.$element.trigger("hidden.bs."+this.type),this)},b.prototype.fixTitle=function(){var a=this.$element;(a.attr("title")||"string"!=typeof a.attr("data-original-title"))&&a.attr("data-original-title",a.attr("title")||"").attr("title","")},b.prototype.hasContent=function(){return this.getTitle()},b.prototype.getPosition=function(){var b=this.$element[0];return a.extend({},"function"==typeof b.getBoundingClientRect?b.getBoundingClientRect():{width:b.offsetWidth,height:b.offsetHeight},this.$element.offset())},b.prototype.getCalculatedOffset=function(a,b,c,d){return"bottom"==a?{top:b.top+b.height,left:b.left+b.width/2-c/2}:"top"==a?{top:b.top-d,left:b.left+b.width/2-c/2}:"left"==a?{top:b.top+b.height/2-d/2,left:b.left-c}:{top:b.top+b.height/2-d/2,left:b.left+b.width}},b.prototype.getTitle=function(){var a,b=this.$element,c=this.options;return a=b.attr("data-original-title")||("function"==typeof c.title?c.title.call(b[0]):c.title)},b.prototype.tip=function(){return this.$tip=this.$tip||a(this.options.template)},b.prototype.arrow=function(){return this.$arrow=this.$arrow||this.tip().find(".tooltip-arrow")},b.prototype.validate=function(){this.$element[0].parentNode||(this.hide(),this.$element=null,this.options=null)},b.prototype.enable=function(){this.enabled=!0},b.prototype.disable=function(){this.enabled=!1},b.prototype.toggleEnabled=function(){this.enabled=!this.enabled},b.prototype.toggle=function(b){var c=b?a(b.currentTarget)[this.type](this.getDelegateOptions()).data("bs."+this.type):this;c.tip().hasClass("in")?c.leave(c):c.enter(c)},b.prototype.destroy=function(){this.hide().$element.off("."+this.type).removeData("bs."+this.type)};var c=a.fn.tooltip;a.fn.tooltip=function(c){return this.each(function(){var d=a(this),e=d.data("bs.tooltip"),f="object"==typeof c&&c;e||d.data("bs.tooltip",e=new b(this,f)),"string"==typeof c&&e[c]()})},a.fn.tooltip.Constructor=b,a.fn.tooltip.noConflict=function(){return a.fn.tooltip=c,this}}(window.jQuery),+function(a){"use strict";var b=function(a,b){this.init("popover",a,b)};if(!a.fn.tooltip)throw new Error("Popover requires tooltip.js");b.DEFAULTS=a.extend({},a.fn.tooltip.Constructor.DEFAULTS,{placement:"right",trigger:"click",content:"",template:'<div class="popover"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>'}),b.prototype=a.extend({},a.fn.tooltip.Constructor.prototype),b.prototype.constructor=b,b.prototype.getDefaults=function(){return b.DEFAULTS},b.prototype.setContent=function(){var a=this.tip(),b=this.getTitle(),c=this.getContent();a.find(".popover-title")[this.options.html?"html":"text"](b),a.find(".popover-content")[this.options.html?"html":"text"](c),a.removeClass("fade top bottom left right in"),a.find(".popover-title").html()||a.find(".popover-title").hide()},b.prototype.hasContent=function(){return this.getTitle()||this.getContent()},b.prototype.getContent=function(){var a=this.$element,b=this.options;return a.attr("data-content")||("function"==typeof b.content?b.content.call(a[0]):b.content)},b.prototype.arrow=function(){return this.$arrow=this.$arrow||this.tip().find(".arrow")},b.prototype.tip=function(){return this.$tip||(this.$tip=a(this.options.template)),this.$tip};var c=a.fn.popover;a.fn.popover=function(c){return this.each(function(){var d=a(this),e=d.data("bs.popover"),f="object"==typeof c&&c;e||d.data("bs.popover",e=new b(this,f)),"string"==typeof c&&e[c]()})},a.fn.popover.Constructor=b,a.fn.popover.noConflict=function(){return a.fn.popover=c,this}}(window.jQuery),+function(a){"use strict";function b(c,d){var e,f=a.proxy(this.process,this);this.$element=a(c).is("body")?a(window):a(c),this.$body=a("body"),this.$scrollElement=this.$element.on("scroll.bs.scroll-spy.data-api",f),this.options=a.extend({},b.DEFAULTS,d),this.selector=(this.options.target||(e=a(c).attr("href"))&&e.replace(/.*(?=#[^\s]+$)/,"")||"")+" .nav li > a",this.offsets=a([]),this.targets=a([]),this.activeTarget=null,this.refresh(),this.process()}b.DEFAULTS={offset:10},b.prototype.refresh=function(){var b=this.$element[0]==window?"offset":"position";this.offsets=a([]),this.targets=a([]);var c=this;this.$body.find(this.selector).map(function(){var d=a(this),e=d.data("target")||d.attr("href"),f=/^#\w/.test(e)&&a(e);return f&&f.length&&[[f[b]().top+(!a.isWindow(c.$scrollElement.get(0))&&c.$scrollElement.scrollTop()),e]]||null}).sort(function(a,b){return a[0]-b[0]}).each(function(){c.offsets.push(this[0]),c.targets.push(this[1])})},b.prototype.process=function(){var a,b=this.$scrollElement.scrollTop()+this.options.offset,c=this.$scrollElement[0].scrollHeight||this.$body[0].scrollHeight,d=c-this.$scrollElement.height(),e=this.offsets,f=this.targets,g=this.activeTarget;if(b>=d)return g!=(a=f.last()[0])&&this.activate(a);for(a=e.length;a--;)g!=f[a]&&b>=e[a]&&(!e[a+1]||b<=e[a+1])&&this.activate(f[a])},b.prototype.activate=function(b){this.activeTarget=b,a(this.selector).parents(".active").removeClass("active");var c=this.selector+'[data-target="'+b+'"],'+this.selector+'[href="'+b+'"]',d=a(c).parents("li").addClass("active");d.parent(".dropdown-menu").length&&(d=d.closest("li.dropdown").addClass("active")),d.trigger("activate")};var c=a.fn.scrollspy;a.fn.scrollspy=function(c){return this.each(function(){var d=a(this),e=d.data("bs.scrollspy"),f="object"==typeof c&&c;e||d.data("bs.scrollspy",e=new b(this,f)),"string"==typeof c&&e[c]()})},a.fn.scrollspy.Constructor=b,a.fn.scrollspy.noConflict=function(){return a.fn.scrollspy=c,this},a(window).on("load",function(){a('[data-spy="scroll"]').each(function(){var b=a(this);b.scrollspy(b.data())})})}(window.jQuery),+function(a){"use strict";var b=function(b){this.element=a(b)};b.prototype.show=function(){var b=this.element,c=b.closest("ul:not(.dropdown-menu)"),d=b.attr("data-target");if(d||(d=b.attr("href"),d=d&&d.replace(/.*(?=#[^\s]*$)/,"")),!b.parent("li").hasClass("active")){var e=c.find(".active:last a")[0],f=a.Event("show.bs.tab",{relatedTarget:e});if(b.trigger(f),!f.isDefaultPrevented()){var g=a(d);this.activate(b.parent("li"),c),this.activate(g,g.parent(),function(){b.trigger({type:"shown.bs.tab",relatedTarget:e})})}}},b.prototype.activate=function(b,c,d){function e(){f.removeClass("active").find("> .dropdown-menu > .active").removeClass("active"),b.addClass("active"),g?(b[0].offsetWidth,b.addClass("in")):b.removeClass("fade"),b.parent(".dropdown-menu")&&b.closest("li.dropdown").addClass("active"),d&&d()}var f=c.find("> .active"),g=d&&a.support.transition&&f.hasClass("fade");g?f.one(a.support.transition.end,e).emulateTransitionEnd(150):e(),f.removeClass("in")};var c=a.fn.tab;a.fn.tab=function(c){return this.each(function(){var d=a(this),e=d.data("bs.tab");e||d.data("bs.tab",e=new b(this)),"string"==typeof c&&e[c]()})},a.fn.tab.Constructor=b,a.fn.tab.noConflict=function(){return a.fn.tab=c,this},a(document).on("click.bs.tab.data-api",'[data-toggle="tab"], [data-toggle="pill"]',function(b){b.preventDefault(),a(this).tab("show")})}(window.jQuery),+function(a){"use strict";var b=function(c,d){this.options=a.extend({},b.DEFAULTS,d),this.$window=a(window).on("scroll.bs.affix.data-api",a.proxy(this.checkPosition,this)).on("click.bs.affix.data-api",a.proxy(this.checkPositionWithEventLoop,this)),this.$element=a(c),this.affixed=this.unpin=null,this.checkPosition()};b.RESET="affix affix-top affix-bottom",b.DEFAULTS={offset:0},b.prototype.checkPositionWithEventLoop=function(){setTimeout(a.proxy(this.checkPosition,this),1)},b.prototype.checkPosition=function(){if(this.$element.is(":visible")){var c=a(document).height(),d=this.$window.scrollTop(),e=this.$element.offset(),f=this.options.offset,g=f.top,h=f.bottom;"object"!=typeof f&&(h=g=f),"function"==typeof g&&(g=f.top()),"function"==typeof h&&(h=f.bottom());var i=null!=this.unpin&&d+this.unpin<=e.top?!1:null!=h&&e.top+this.$element.height()>=c-h?"bottom":null!=g&&g>=d?"top":!1;this.affixed!==i&&(this.unpin&&this.$element.css("top",""),this.affixed=i,this.unpin="bottom"==i?e.top-d:null,this.$element.removeClass(b.RESET).addClass("affix"+(i?"-"+i:"")),"bottom"==i&&this.$element.offset({top:document.body.offsetHeight-h-this.$element.height()}))}};var c=a.fn.affix;a.fn.affix=function(c){return this.each(function(){var d=a(this),e=d.data("bs.affix"),f="object"==typeof c&&c;e||d.data("bs.affix",e=new b(this,f)),"string"==typeof c&&e[c]()})},a.fn.affix.Constructor=b,a.fn.affix.noConflict=function(){return a.fn.affix=c,this},a(window).on("load",function(){a('[data-spy="affix"]').each(function(){var b=a(this),c=b.data();c.offset=c.offset||{},c.offsetBottom&&(c.offset.bottom=c.offsetBottom),c.offsetTop&&(c.offset.top=c.offsetTop),b.affix(c)})})}(window.jQuery);
\ No newline at end of file
--- /dev/null
+/* GLOBAL STYLES
+-------------------------------------------------- */
+/* Padding below the footer and lighter body text */
+
+body {
+ padding-bottom: 40px;
+ color: #5a5a5a;
+}
+
+
+
+/* CUSTOMIZE THE NAVBAR
+-------------------------------------------------- */
+
+/* Special class on .container surrounding .navbar, used for positioning it into place. */
+.navbar-wrapper {
+ position: relative;
+ z-index: 15;
+}
+
+
+
+/* CUSTOMIZE THE CAROUSEL
+-------------------------------------------------- */
+
+/* Carousel base class */
+.carousel {
+ margin-bottom: 60px;
+
+ /* Negative margin to pull up carousel. 90px is roughly margins and height of navbar. */
+ margin-top: -90px;
+}
+/* Since positioning the image, we need to help out the caption */
+.carousel-caption {
+ z-index: 10;
+}
+
+/* Declare heights because of positioning of img element */
+.carousel .item {
+ height: 500px;
+}
+.carousel-inner > .item > img {
+ position: absolute;
+ top: 0;
+ left: 0;
+ min-width: 100%;
+ height: 500px;
+}
+
+
+
+/* MARKETING CONTENT
+-------------------------------------------------- */
+
+/* Pad the edges of the mobile views a bit */
+.marketing {
+ padding-left: 15px;
+ padding-right: 15px;
+}
+
+/* Center align the text within the three columns below the carousel */
+.marketing .col-lg-4 {
+ text-align: center;
+ margin-bottom: 20px;
+}
+.marketing h2 {
+ font-weight: normal;
+}
+.marketing .col-lg-4 p {
+ margin-left: 10px;
+ margin-right: 10px;
+}
+
+
+/* Featurettes
+------------------------- */
+
+.featurette-divider {
+ margin: 80px 0; /* Space out the Bootstrap <hr> more */
+}
+
+/* Thin out the marketing headings */
+.featurette-heading {
+ font-weight: 300;
+ line-height: 1;
+ letter-spacing: -1px;
+}
+
+
+
+/* RESPONSIVE CSS
+-------------------------------------------------- */
+
+@media (min-width: 768px) {
+
+ /* Remve the edge padding needed for mobile */
+ .marketing {
+ padding-left: 0;
+ padding-right: 0;
+ }
+
+ /* Navbar positioning foo */
+ .navbar-wrapper {
+ margin-top: 20px;
+ }
+ /* The navbar becomes detached from the top, so we round the corners */
+ .navbar-wrapper .navbar {
+ border-radius: 4px;
+ }
+
+ /* Bump up size of carousel content */
+ .carousel-caption p {
+ margin-bottom: 20px;
+ font-size: 21px;
+ line-height: 1.4;
+ }
+
+ .featurette-heading {
+ font-size: 50px;
+ }
+
+}
+
+@media (min-width: 992px) {
+ .featurette-heading {
+ margin-top: 120px;
+ }
+}
--- /dev/null
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta name="description" content="">
+ <meta name="author" content="">
+ <link rel="shortcut icon" href="../../assets/ico/favicon.png">
+
+ <title>Carousel Template for Bootstrap</title>
+
+ <!-- Bootstrap core CSS -->
+ <link href="../../dist/css/bootstrap.css" rel="stylesheet">
+ <link href="../../dist/css/bootstrap-glyphicons.css" rel="stylesheet">
+
+ <!-- Custom styles for this template -->
+ <link href="carousel.css" rel="stylesheet">
+ </head>
+<!-- NAVBAR
+================================================== -->
+ <body>
+ <div class="navbar-wrapper">
+ <div class="container">
+
+ <div class="navbar navbar-inverse navbar-static-top">
+ <div class="container">
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <a class="navbar-brand" href="#">Project name</a>
+ </div>
+ <div class="navbar-collapse collapse">
+ <ul class="nav navbar-nav">
+ <li class="active"><a href="#">Home</a></li>
+ <li><a href="#about">About</a></li>
+ <li><a href="#contact">Contact</a></li>
+ <li class="dropdown">
+ <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li class="dropdown-header">Nav header</li>
+ <li><a href="#">Separated link</a></li>
+ <li><a href="#">One more separated link</a></li>
+ </ul>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+ </div>
+ </div>
+
+
+ <!-- Carousel
+ ================================================== -->
+ <div id="myCarousel" class="carousel slide">
+ <!-- Indicators -->
+ <ol class="carousel-indicators">
+ <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
+ <li data-target="#myCarousel" data-slide-to="1"></li>
+ <li data-target="#myCarousel" data-slide-to="2"></li>
+ </ol>
+ <div class="carousel-inner">
+ <div class="item active">
+ <img src="data:image/png;base64," data-src="holder.js/100%x500/auto/#777:#7a7a7a/text:First slide" alt="First slide">
+ <div class="container">
+ <div class="carousel-caption">
+ <h1>Example headline.</h1>
+ <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
+ <p><a class="btn btn-large btn-primary" href="#">Sign up today</a></p>
+ </div>
+ </div>
+ </div>
+ <div class="item">
+ <img src="data:image/png;base64," data-src="holder.js/100%x500/auto/#777:#7a7a7a/text:Second slide" alt="Second slide">
+ <div class="container">
+ <div class="carousel-caption">
+ <h1>Another example headline.</h1>
+ <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
+ <p><a class="btn btn-large btn-primary" href="#">Learn more</a></p>
+ </div>
+ </div>
+ </div>
+ <div class="item">
+ <img src="data:image/png;base64," data-src="holder.js/100%x500/auto/#777:#7a7a7a/text:Third slide" alt="Third slide">
+ <div class="container">
+ <div class="carousel-caption">
+ <h1>One more for good measure.</h1>
+ <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
+ <p><a class="btn btn-large btn-primary" href="#">Browse gallery</a></p>
+ </div>
+ </div>
+ </div>
+ </div>
+ <a class="left carousel-control" href="#myCarousel" data-slide="prev"><span class="glyphicon glyphicon-chevron-left"></span></a>
+ <a class="right carousel-control" href="#myCarousel" data-slide="next"><span class="glyphicon glyphicon-chevron-right"></span></a>
+ </div><!-- /.carousel -->
+
+
+
+ <!-- Marketing messaging and featurettes
+ ================================================== -->
+ <!-- Wrap the rest of the page in another container to center all the content. -->
+
+ <div class="container marketing">
+
+ <!-- Three columns of text below the carousel -->
+ <div class="row">
+ <div class="col-lg-4">
+ <img class="img-circle" src="data:image/png;base64," data-src="holder.js/140x140" alt="Generic placeholder image">
+ <h2>Heading</h2>
+ <p>Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna.</p>
+ <p><a class="btn btn-default" href="#">View details »</a></p>
+ </div><!-- /.col-lg-4 -->
+ <div class="col-lg-4">
+ <img class="img-circle" src="data:image/png;base64," data-src="holder.js/140x140" alt="Generic placeholder image">
+ <h2>Heading</h2>
+ <p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh.</p>
+ <p><a class="btn btn-default" href="#">View details »</a></p>
+ </div><!-- /.col-lg-4 -->
+ <div class="col-lg-4">
+ <img class="img-circle" src="data:image/png;base64," data-src="holder.js/140x140" alt="Generic placeholder image">
+ <h2>Heading</h2>
+ <p>Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
+ <p><a class="btn btn-default" href="#">View details »</a></p>
+ </div><!-- /.col-lg-4 -->
+ </div><!-- /.row -->
+
+
+ <!-- START THE FEATURETTES -->
+
+ <hr class="featurette-divider">
+
+ <div class="row featurette">
+ <div class="col-md-7">
+ <h2 class="featurette-heading">First featurette heading. <span class="text-muted">It'll blow your mind.</span></h2>
+ <p class="lead">Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Praesent commodo cursus magna, vel scelerisque nisl consectetur. Fusce dapibus, tellus ac cursus commodo.</p>
+ </div>
+ <div class="col-md-5">
+ <img class="featurette-image img-responsive" src="data:image/png;base64," data-src="holder.js/500x500/auto" alt="Generic placeholder image">
+ </div>
+ </div>
+
+ <hr class="featurette-divider">
+
+ <div class="row featurette">
+ <div class="col-md-5">
+ <img class="featurette-image img-responsive" src="data:image/png;base64," data-src="holder.js/500x500/auto" alt="Generic placeholder image">
+ </div>
+ <div class="col-md-7">
+ <h2 class="featurette-heading">Oh yeah, it's that good. <span class="text-muted">See for yourself.</span></h2>
+ <p class="lead">Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Praesent commodo cursus magna, vel scelerisque nisl consectetur. Fusce dapibus, tellus ac cursus commodo.</p>
+ </div>
+ </div>
+
+ <hr class="featurette-divider">
+
+ <div class="row featurette">
+ <div class="col-md-7">
+ <h2 class="featurette-heading">And lastly, this one. <span class="text-muted">Checkmate.</span></h2>
+ <p class="lead">Donec ullamcorper nulla non metus auctor fringilla. Vestibulum id ligula porta felis euismod semper. Praesent commodo cursus magna, vel scelerisque nisl consectetur. Fusce dapibus, tellus ac cursus commodo.</p>
+ </div>
+ <div class="col-md-5">
+ <img class="featurette-image img-responsive" src="data:image/png;base64," data-src="holder.js/500x500/auto" alt="Generic placeholder image">
+ </div>
+ </div>
+
+ <hr class="featurette-divider">
+
+ <!-- /END THE FEATURETTES -->
+
+
+ <!-- FOOTER -->
+ <footer>
+ <p class="pull-right"><a href="#">Back to top</a></p>
+ <p>© 2013 Company, Inc. · <a href="#">Privacy</a> · <a href="#">Terms</a></p>
+ </footer>
+
+ </div><!-- /.container -->
+
+
+
+ <!-- Bootstrap core JavaScript
+ ================================================== -->
+ <!-- Placed at the end of the document so the pages load faster -->
+ <script src="../../assets/js/jquery.js"></script>
+ <script src="../../dist/js/bootstrap.min.js"></script>
+ <script src="../../assets/js/holder.js"></script>
+ </body>
+</html>
--- /dev/null
+.container {
+ padding-left: 15px;
+ padding-right: 15px;
+}
+
+h4 {
+ margin-top: 25px;
+}
+.row {
+ margin-bottom: 20px;
+}
+.row .row {
+ margin-top: 10px;
+ margin-bottom: 0;
+}
+[class*="col-"] {
+ padding-top: 15px;
+ padding-bottom: 15px;
+ background-color: #eee;
+ border: 1px solid #ddd;
+ background-color: rgba(86,61,124,.15);
+ border: 1px solid rgba(86,61,124,.2);
+}
+
+hr {
+ margin-top: 40px;
+ margin-bottom: 40px;
+}
\ No newline at end of file
--- /dev/null
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta name="description" content="">
+ <meta name="author" content="">
+ <link rel="shortcut icon" href="../../assets/ico/favicon.png">
+
+ <title>Grid Template for Bootstrap</title>
+
+ <!-- Bootstrap core CSS -->
+ <link href="../../dist/css/bootstrap.css" rel="stylesheet">
+
+ <!-- Custom styles for this template -->
+ <link href="grid.css" rel="stylesheet">
+ </head>
+
+ <body>
+ <div class="container">
+
+ <div class="page-header">
+ <h1>Bootstrap grid examples</h1>
+ <p class="lead">Basic grid layouts to get you familiar with building within the Bootstrap grid system.</p>
+ </div>
+
+ <h3>Three equal columns</h3>
+ <p>Get three equal-width columns <strong>starting at desktops and scaling to large desktops</strong>. On mobile devices, tablets and below, the columns will automatically stack.</p>
+ <div class="row">
+ <div class="col-md-4">.col-md-4</div>
+ <div class="col-md-4">.col-md-4</div>
+ <div class="col-md-4">.col-md-4</div>
+ </div>
+
+ <h3>Three unequal columns</h3>
+ <p>Get three columns <strong>starting at desktops and scaling to large desktops</strong> of various widths. Remember, grid columns should add up to twelve for a single horizontal block. More than that, and columns start stacking no matter the viewport.</p>
+ <div class="row">
+ <div class="col-md-3">.col-md-3</div>
+ <div class="col-md-6">.col-md-6</div>
+ <div class="col-md-3">.col-md-3</div>
+ </div>
+
+ <h3>Two columns</h3>
+ <p>Get two columns <strong>starting at desktops and scaling to large desktops</strong>.</p>
+ <div class="row">
+ <div class="col-md-8">.col-md-8</div>
+ <div class="col-md-4">.col-md-4</div>
+ </div>
+
+ <h3>Full width, single column</h3>
+ <p class="text-warning">No grid classes are necessary for full-width elements.</p>
+
+ <hr>
+
+ <h3>Two columns with two nested columns</h3>
+ <p>Per the documentation, nesting is easy—just put a row of columns within an existing row. This gives you two columns <strong>starting at desktops and scaling to large desktops</strong>, with another two (equal widths) within the larger column.</p>
+ <p>At mobile device sizes, tablets and down, these columns and their nested columns will stack.</p>
+ <div class="row">
+ <div class="col-md-8">
+ .col-md-8
+ <div class="row">
+ <div class="col-md-6">.col-md-6</div>
+ <div class="col-md-6">.col-md-6</div>
+ </div>
+ </div>
+ <div class="col-md-4">.col-md-4</div>
+ </div>
+
+ <hr>
+
+ <h3>Mixed: mobile and desktop</h3>
+ <p>The Bootstrap 3 grid system has four tiers of classes: xs (phones), sm (tablets), md (desktops), and lg (larger desktops). You can use nearly any combination of these classes to create more dynamic and flexible layouts.</p>
+ <p>Each tier of classes scales up, meaning if you plan on setting the same widths for xs and sm, you only need to specify xs.</p>
+ <div class="row">
+ <div class="col-xs-12 col-md-8">.col-xs-12 .col-md-8</div>
+ <div class="col-xs-6 col-md-4">.col-xs-6 .col-md-4</div>
+ </div>
+ <div class="row">
+ <div class="col-xs-6 col-md-4">.col-xs-6 .col-md-4</div>
+ <div class="col-xs-6 col-md-4">.col-xs-6 .col-md-4</div>
+ <div class="col-xs-6 col-md-4">.col-xs-6 .col-md-4</div>
+ </div>
+ <div class="row">
+ <div class="col-xs-6 col-md-6">.col-xs-6 .col-md-6</div>
+ <div class="col-xs-6 col-md-6">.col-xs-6 .col-md-6</div>
+ </div>
+
+ <hr>
+
+ <h3>Mixed: mobile, tablet, and desktop</h3>
+ <p></p>
+ <div class="row">
+ <div class="col-xs-12 col-sm-8 col-lg-8">.col-xs-12 .col-lg-8</div>
+ <div class="col-xs-6 col-sm-4 col-lg-4">.col-xs-6 .col-lg-4</div>
+ </div>
+ <div class="row">
+ <div class="col-xs-6 col-sm-4 col-lg-4">.col-xs-6 .col-sm-4 .col-lg-4</div>
+ <div class="col-xs-6 col-sm-4 col-lg-4">.col-xs-6 .col-sm-4 .col-lg-4</div>
+ <div class="col-xs-6 col-sm-4 col-lg-4">.col-xs-6 .col-sm-4 .col-lg-4</div>
+ </div>
+ <div class="row">
+ <div class="col-xs-6 col-sm-6 col-lg-6">.col-xs-6 .col-sm-6 .col-lg-6</div>
+ <div class="col-xs-6 col-sm-6 col-lg-6">.col-xs-6 .col-sm-6 .col-lg-6</div>
+ </div>
+
+ </div> <!-- /container -->
+
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta name="description" content="">
+ <meta name="author" content="">
+ <link rel="shortcut icon" href="../../assets/ico/favicon.png">
+
+ <title>Narrow Jumbotron Template for Bootstrap</title>
+
+ <!-- Bootstrap core CSS -->
+ <link href="../../dist/css/bootstrap.css" rel="stylesheet">
+
+ <!-- Custom styles for this template -->
+ <link href="jumbotron-narrow.css" rel="stylesheet">
+ </head>
+
+ <body>
+
+ <div class="container-narrow">
+ <div class="header">
+ <ul class="nav nav-pills pull-right">
+ <li class="active"><a href="#">Home</a></li>
+ <li><a href="#">About</a></li>
+ <li><a href="#">Contact</a></li>
+ </ul>
+ <h3 class="text-muted">Project name</h3>
+ </div>
+
+ <div class="jumbotron">
+ <h1>Jumbotron heading</h1>
+ <p class="lead">Cras justo odio, dapibus ac facilisis in, egestas eget quam. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
+ <p><a class="btn btn-large btn-success" href="#">Sign up today</a></p>
+ </div>
+
+ <div class="row marketing">
+ <div class="col-lg-6">
+ <h4>Subheading</h4>
+ <p>Donec id elit non mi porta gravida at eget metus. Maecenas faucibus mollis interdum.</p>
+
+ <h4>Subheading</h4>
+ <p>Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras mattis consectetur purus sit amet fermentum.</p>
+
+ <h4>Subheading</h4>
+ <p>Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
+ </div>
+
+ <div class="col-lg-6">
+ <h4>Subheading</h4>
+ <p>Donec id elit non mi porta gravida at eget metus. Maecenas faucibus mollis interdum.</p>
+
+ <h4>Subheading</h4>
+ <p>Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras mattis consectetur purus sit amet fermentum.</p>
+
+ <h4>Subheading</h4>
+ <p>Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
+ </div>
+ </div>
+
+ <div class="footer">
+ <p>© Company 2013</p>
+ </div>
+
+ </div> <!-- /container -->
+
+ </body>
+</html>
--- /dev/null
+/* Space out content a bit */
+body {
+ padding-top: 20px;
+ padding-bottom: 20px;
+}
+
+/* Everything but the jumbotron gets side spacing for mobile-first views */
+.header,
+.marketing,
+.footer {
+ padding-left: 15px;
+ padding-right: 15px;
+}
+
+/* Custom page header */
+.header {
+ border-bottom: 1px solid #e5e5e5;
+}
+/* Make the masthead heading the same height as the navigation */
+.header h3 {
+ margin-top: 0;
+ margin-bottom: 0;
+ line-height: 40px;
+ padding-bottom: 19px;
+}
+
+/* Custom page footer */
+.footer {
+ padding-top: 19px;
+ color: #777;
+ border-top: 1px solid #e5e5e5;
+}
+
+/* Custom container */
+.container-narrow {
+ margin: 0 auto;
+ max-width: 700px;
+}
+.container-narrow > hr {
+ margin: 30px 0;
+}
+
+/* Main marketing message and sign up button */
+.jumbotron {
+ text-align: center;
+ border-bottom: 1px solid #e5e5e5;
+}
+.jumbotron .btn {
+ font-size: 21px;
+ padding: 14px 24px;
+}
+
+/* Supporting marketing content */
+.marketing {
+ margin: 40px 0;
+}
+.marketing p + h4 {
+ margin-top: 28px;
+}
+
+/* Responsive: Portrait tablets and up */
+@media screen and (min-width: 768px) {
+ /* Remove the padding we set earlier */
+ .header,
+ .marketing,
+ .footer {
+ padding-left: 0;
+ padding-right: 0;
+ }
+ /* Space out the masthead */
+ .header {
+ margin-bottom: 30px;
+ }
+ /* Remove the bottom border on the jumbotron for visual effect */
+ .jumbotron {
+ border-bottom: 0;
+ }
+}
--- /dev/null
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta name="description" content="">
+ <meta name="author" content="">
+ <link rel="shortcut icon" href="../../assets/ico/favicon.png">
+
+ <title>Jumbotron Template for Bootstrap</title>
+
+ <!-- Bootstrap core CSS -->
+ <link href="../../dist/css/bootstrap.css" rel="stylesheet">
+
+ <!-- Custom styles for this template -->
+ <link href="jumbotron.css" rel="stylesheet">
+ </head>
+
+ <body>
+
+ <div class="navbar navbar-inverse navbar-fixed-top">
+ <div class="container">
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <a class="navbar-brand" href="#">Project name</a>
+ </div>
+ <div class="navbar-collapse collapse">
+ <ul class="nav navbar-nav">
+ <li class="active"><a href="#">Home</a></li>
+ <li><a href="#about">About</a></li>
+ <li><a href="#contact">Contact</a></li>
+ <li class="dropdown">
+ <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li class="dropdown-header">Nav header</li>
+ <li><a href="#">Separated link</a></li>
+ <li><a href="#">One more separated link</a></li>
+ </ul>
+ </li>
+ </ul>
+ <form class="navbar-form navbar-right">
+ <div class="form-group">
+ <input type="text" placeholder="Email" class="form-control">
+ </div>
+ <div class="form-group">
+ <input type="password" placeholder="Password" class="form-control">
+ </div>
+ <button type="submit" class="btn">Sign in</button>
+ </form>
+ </div><!--/.navbar-collapse -->
+ </div>
+ </div>
+
+ <div class="container">
+
+ <!-- Main jumbotron for a primary marketing message or call to action -->
+ <div class="jumbotron">
+ <h1>Hello, world!</h1>
+ <p>This is a template for a simple marketing or informational website. It includes a large callout called the hero unit and three supporting pieces of content. Use it as a starting point to create something more unique.</p>
+ <p><a class="btn btn-primary btn-large">Learn more »</a></p>
+ </div>
+
+ <div class="body-content">
+
+ <!-- Example row of columns -->
+ <div class="row">
+ <div class="col-lg-4">
+ <h2>Heading</h2>
+ <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
+ <p><a class="btn btn-default" href="#">View details »</a></p>
+ </div>
+ <div class="col-lg-4">
+ <h2>Heading</h2>
+ <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
+ <p><a class="btn btn-default" href="#">View details »</a></p>
+ </div>
+ <div class="col-lg-4">
+ <h2>Heading</h2>
+ <p>Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
+ <p><a class="btn btn-default" href="#">View details »</a></p>
+ </div>
+ </div>
+
+ <hr>
+
+ <footer>
+ <p>© Company 2013</p>
+ </footer>
+ </div>
+
+ </div> <!-- /container -->
+
+ <script src="../../assets/js/jquery.js"></script>
+ <script src="../../dist/js/bootstrap.min.js"></script>
+ </body>
+</html>
\ No newline at end of file
--- /dev/null
+/* Move down content because we have a fixed navbar that is 50px tall */
+body {
+ padding-top: 50px;
+ padding-bottom: 20px;
+}
+
+/* Wrapping element */
+/* Set some basic padding to keep content from hitting the edges */
+.body-content {
+ padding-left: 15px;
+ padding-right: 15px;
+}
+
+/* Responsive: Portrait tablets and up */
+@media screen and (min-width: 768px) {
+ /* Let the jumbotron breathe */
+ .jumbotron {
+ margin-top: 20px;
+ }
+ /* Remove padding from wrapping element since we kick in the grid classes here */
+ .body-content {
+ padding: 0;
+ }
+}
\ No newline at end of file
--- /dev/null
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta name="description" content="">
+ <meta name="author" content="">
+ <link rel="shortcut icon" href="../../assets/ico/favicon.png">
+
+ <title>Justified Nav Template for Bootstrap</title>
+
+ <!-- Bootstrap core CSS -->
+ <link href="../../dist/css/bootstrap.css" rel="stylesheet">
+
+ <!-- Custom styles for this template -->
+ <link href="justified-nav.css" rel="stylesheet">
+ </head>
+
+ <body>
+
+ <div class="container">
+
+ <div class="masthead">
+ <h3 class="text-muted">Project name</h3>
+ <ul class="nav nav-justified">
+ <li class="active"><a href="#">Home</a></li>
+ <li><a href="#">Projects</a></li>
+ <li><a href="#">Services</a></li>
+ <li><a href="#">Downloads</a></li>
+ <li><a href="#">About</a></li>
+ <li><a href="#">Contact</a></li>
+ </ul>
+ </div>
+
+ <!-- Jumbotron -->
+ <div class="jumbotron">
+ <h1>Marketing stuff!</h1>
+ <p class="lead">Cras justo odio, dapibus ac facilisis in, egestas eget quam. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet.</p>
+ <p><a class="btn btn-large btn-success" href="#">Get started today</a></p>
+ </div>
+
+
+ <div class="body-content">
+
+ <!-- Example row of columns -->
+ <div class="row">
+ <div class="col-lg-4">
+ <h2>Heading</h2>
+ <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
+ <p><a class="btn btn-primary" href="#">View details »</a></p>
+ </div>
+ <div class="col-lg-4">
+ <h2>Heading</h2>
+ <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
+ <p><a class="btn btn-primary" href="#">View details »</a></p>
+ </div>
+ <div class="col-lg-4">
+ <h2>Heading</h2>
+ <p>Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa.</p>
+ <p><a class="btn btn-primary" href="#">View details »</a></p>
+ </div>
+ </div>
+
+ </div><!-- /.body-content -->
+
+ <!-- Site footer -->
+ <div class="footer">
+ <p>© Company 2013</p>
+ </div>
+
+ </div> <!-- /container -->
+
+ </body>
+</html>
\ No newline at end of file
--- /dev/null
+body {
+ padding-top: 20px;
+}
+
+/* Everything but the jumbotron gets side spacing for mobile-first views */
+.masthead,
+.footer {
+ padding-left: 15px;
+ padding-right: 15px;
+}
+
+.footer {
+ border-top: 1px solid #eee;
+ margin-top: 40px;
+ padding-top: 40px;
+ padding-bottom: 40px;
+}
+
+/* Main marketing message and sign up button */
+.jumbotron {
+ text-align: center;
+ background-color: transparent;
+}
+.jumbotron .btn {
+ font-size: 21px;
+ padding: 14px 24px;
+}
+
+/* Customize the nav-justified links to be fill the entire space of the .navbar */
+
+.nav-justified {
+ background-color: #eee;
+ border-radius: 5px;
+ border: 1px solid #ccc;
+}
+.nav-justified > li > a {
+ padding-top: 15px;
+ padding-bottom: 15px;
+ color: #777;
+ font-weight: bold;
+ text-align: center;
+ border-bottom: 1px solid #d5d5d5;
+ background-color: #e5e5e5; /* Old browsers */
+ background-repeat: repeat-x; /* Repeat the gradient */
+ background-image: -moz-linear-gradient(top, #f5f5f5 0%, #e5e5e5 100%); /* FF3.6+ */
+ background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f5f5f5), color-stop(100%,#e5e5e5)); /* Chrome,Safari4+ */
+ background-image: -webkit-linear-gradient(top, #f5f5f5 0%,#e5e5e5 100%); /* Chrome 10+,Safari 5.1+ */
+ background-image: -ms-linear-gradient(top, #f5f5f5 0%,#e5e5e5 100%); /* IE10+ */
+ background-image: -o-linear-gradient(top, #f5f5f5 0%,#e5e5e5 100%); /* Opera 11.10+ */
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#e5e5e5',GradientType=0 ); /* IE6-9 */
+ background-image: linear-gradient(top, #f5f5f5 0%,#e5e5e5 100%); /* W3C */
+}
+.nav-justified > .active > a,
+.nav-justified > .active > a:hover,
+.nav-justified > .active > a:focus {
+ background-color: #ddd;
+ background-image: none;
+ box-shadow: inset 0 3px 7px rgba(0,0,0,.15);
+}
+.nav-justified > li:first-child > a {
+ border-radius: 5px 5px 0 0;
+}
+.nav-justified > li:last-child > a {
+ border-bottom: 0;
+ border-radius: 0 0 5px 5px;
+}
+
+@media (min-width: 768px) {
+ .nav-justified {
+ max-height: 52px;
+ }
+ .nav-justified > li > a {
+ border-left: 1px solid #fff;
+ border-right: 1px solid #d5d5d5;
+ }
+ .nav-justified > li:first-child > a {
+ border-left: 0;
+ border-radius: 5px 0 0 5px;
+ }
+ .nav-justified > li:last-child > a {
+ border-radius: 0 5px 5px 0;
+ border-right: 0;
+ }
+}
+
+
+
+/* Responsive: Portrait tablets and up */
+@media screen and (min-width: 768px) {
+ /* Remove the padding we set earlier */
+ .masthead,
+ .marketing,
+ .footer {
+ padding-left: 0;
+ padding-right: 0;
+ }
+}
--- /dev/null
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta name="description" content="">
+ <meta name="author" content="">
+ <link rel="shortcut icon" href="../../assets/ico/favicon.png">
+
+ <title>Fixed Top Navbar Example for Bootstrap</title>
+
+ <!-- Bootstrap core CSS -->
+ <link href="../../dist/css/bootstrap.css" rel="stylesheet">
+
+ <!-- Custom styles for this template -->
+ <link href="navbar-fixed-top.css" rel="stylesheet">
+ </head>
+
+ <body>
+
+ <!-- Fixed navbar -->
+ <div class="navbar navbar-fixed-top">
+ <div class="container">
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <a class="navbar-brand" href="#">Project name</a>
+ </div>
+ <div class="navbar-collapse collapse">
+ <ul class="nav navbar-nav">
+ <li class="active"><a href="#">Home</a></li>
+ <li><a href="#about">About</a></li>
+ <li><a href="#contact">Contact</a></li>
+ <li class="dropdown">
+ <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li class="dropdown-header">Nav header</li>
+ <li><a href="#">Separated link</a></li>
+ <li><a href="#">One more separated link</a></li>
+ </ul>
+ </li>
+ </ul>
+ <ul class="nav navbar-nav navbar-right">
+ <li><a href="../navbar/">Default</a></li>
+ <li><a href="../navbar-static-top/">Static top</a></li>
+ <li class="active"><a href="./">Fixed top</a></li>
+ </ul>
+ </div><!--/.nav-collapse -->
+ </div>
+ </div>
+
+ <div class="container">
+
+ <!-- Main component for a primary marketing message or call to action -->
+ <div class="jumbotron">
+ <h1>Navbar example</h1>
+ <p>This example is a quick exercise to illustrate how the default, static and fixed to top navbar work. It includes the responsive CSS and HTML, so it also adapts to your viewport and device.</p>
+ <p>To see the difference between static and fixed top navbars, just scroll.</p>
+ <p>
+ <a class="btn btn-large btn-primary" href="../../components/#navbar">View navbar docs »</a>
+ </p>
+ </div>
+
+ </div> <!-- /container -->
+
+ <!-- Bootstrap core JavaScript
+ ================================================== -->
+ <!-- Placed at the end of the document so the pages load faster -->
+ <script src="../../assets/js/jquery.js"></script>
+ <script src="../../dist/js/bootstrap.min.js"></script>
+ </body>
+</html>
--- /dev/null
+body {
+ min-height: 2000px;
+ padding-top: 70px;
+}
--- /dev/null
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta name="description" content="">
+ <meta name="author" content="">
+ <link rel="shortcut icon" href="../../assets/ico/favicon.png">
+
+ <title>Static Top Navbar Example for Bootstrap</title>
+
+ <!-- Bootstrap core CSS -->
+ <link href="../../dist/css/bootstrap.css" rel="stylesheet">
+
+ <!-- Custom styles for this template -->
+ <link href="navbar-static-top.css" rel="stylesheet">
+ </head>
+
+ <body>
+
+ <!-- Static navbar -->
+ <div class="navbar navbar-static-top">
+ <div class="container">
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <a class="navbar-brand" href="#">Project name</a>
+ </div>
+ <div class="navbar-collapse collapse">
+ <ul class="nav navbar-nav">
+ <li class="active"><a href="#">Home</a></li>
+ <li><a href="#about">About</a></li>
+ <li><a href="#contact">Contact</a></li>
+ <li class="dropdown">
+ <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li class="dropdown-header">Nav header</li>
+ <li><a href="#">Separated link</a></li>
+ <li><a href="#">One more separated link</a></li>
+ </ul>
+ </li>
+ </ul>
+ <ul class="nav navbar-nav navbar-right">
+ <li><a href="../navbar/">Default</a></li>
+ <li class="active"><a href="./">Static top</a></li>
+ <li><a href="../navbar-fixed-top/">Fixed top</a></li>
+ </ul>
+ </div><!--/.nav-collapse -->
+ </div>
+ </div>
+
+
+ <div class="container">
+
+ <!-- Main component for a primary marketing message or call to action -->
+ <div class="jumbotron">
+ <h1>Navbar example</h1>
+ <p>This example is a quick exercise to illustrate how the default, static and fixed to top navbar work. It includes the responsive CSS and HTML, so it also adapts to your viewport and device.</p>
+ <p>To see the difference between static and fixed top navbars, just scroll.</p>
+ <p>
+ <a class="btn btn-large btn-primary" href="../../components/#navbar">View navbar docs »</a>
+ </p>
+ </div>
+
+ </div> <!-- /container -->
+
+ <!-- Bootstrap core JavaScript
+ ================================================== -->
+ <!-- Placed at the end of the document so the pages load faster -->
+ <script src="../../assets/js/jquery.js"></script>
+ <script src="../../dist/js/bootstrap.min.js"></script>
+ </body>
+</html>
--- /dev/null
+body {
+ min-height: 2000px;
+}
+
+.navbar-static-top {
+ margin-bottom: 19px;
+}
\ No newline at end of file
--- /dev/null
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta name="description" content="">
+ <meta name="author" content="">
+
+ <title>Navbar Template for Bootstrap</title>
+
+ <!-- Bootstrap core CSS -->
+ <link href="../../dist/css/bootstrap.css" rel="stylesheet">
+
+ <!-- Custom styles for this template -->
+ <link href="navbar.css" rel="stylesheet">
+ </head>
+
+ <body>
+
+ <div class="container">
+
+ <!-- Static navbar -->
+ <div class="navbar">
+ <div class="container">
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <a class="navbar-brand" href="#">Project name</a>
+ </div>
+ <div class="navbar-collapse collapse">
+ <ul class="nav navbar-nav">
+ <li class="active"><a href="#">Home</a></li>
+ <li><a href="#about">About</a></li>
+ <li><a href="#contact">Contact</a></li>
+ <li class="dropdown">
+ <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li class="dropdown-header">Nav header</li>
+ <li><a href="#">Separated link</a></li>
+ <li><a href="#">One more separated link</a></li>
+ </ul>
+ </li>
+ </ul>
+ <ul class="nav navbar-nav navbar-right">
+ <li class="active"><a href="./">Default</a></li>
+ <li><a href="../navbar-static-top/">Static top</a></li>
+ <li><a href="../navbar-fixed-top/">Fixed top</a></li>
+ </ul>
+ </div><!--/.nav-collapse -->
+ </div>
+ </div>
+
+ <!-- Main component for a primary marketing message or call to action -->
+ <div class="jumbotron">
+ <h1>Navbar example</h1>
+ <p>This example is a quick exercise to illustrate how the default, static navbar and fixed to top navbar work. It includes the responsive CSS and HTML, so it also adapts to your viewport and device.</p>
+ <p>
+ <a class="btn btn-large btn-primary" href="../../components/#navbar">View navbar docs »</a>
+ </p>
+ </div>
+
+ </div> <!-- /container -->
+
+ <!-- Bootstrap core JavaScript
+ ================================================== -->
+ <!-- Placed at the end of the document so the pages load faster -->
+ <script src="../../assets/js/jquery.js"></script>
+ <script src="../../dist/js/bootstrap.min.js"></script>
+ </body>
+</html>
--- /dev/null
+body {
+padding: 30px;
+}
+
+.navbar {
+margin-bottom: 30px;
+}
\ No newline at end of file
--- /dev/null
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta name="description" content="">
+ <meta name="author" content="">
+ <link rel="shortcut icon" href="../../assets/ico/favicon.png">
+
+ <title>Off Canvas Template for Bootstrap</title>
+
+ <!-- Bootstrap core CSS -->
+ <link href="../../dist/css/bootstrap.min.css" rel="stylesheet">
+
+ <!-- Custom styles for this template -->
+ <link href="offcanvas.css" rel="stylesheet">
+ </head>
+
+ <body>
+ <div class="navbar navbar-fixed-top navbar-inverse" role="navigation">
+ <div class="container">
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <a class="navbar-brand" href="#">Project name</a>
+ </div>
+ <div class="collapse navbar-collapse">
+ <ul class="nav navbar-nav">
+ <li class="active"><a href="#">Home</a></li>
+ <li><a href="#about">About</a></li>
+ <li><a href="#contact">Contact</a></li>
+ </ul>
+ </div><!-- /.nav-collapse -->
+ </div><!-- /.container -->
+ </div><!-- /.navbar -->
+
+ <div class="container">
+
+ <div class="row row-offcanvas row-offcanvas-right">
+ <div class="col-xs-12 col-sm-9">
+ <p class="pull-right visible-xs">
+ <button type="button" class="btn btn-primary btn-xs" data-toggle="offcanvas">Toggle nav</button>
+ </p>
+ <div class="jumbotron">
+ <h1>Hello, world!</h1>
+ <p>This is an example to show the potential of an offcanvas layout pattern in Bootstrap. Try some responsive-range viewport sizes to see it in action.</p>
+ </div>
+ <div class="row">
+ <div class="col-6 col-sm-6 col-lg-4">
+ <h2>Heading</h2>
+ <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
+ <p><a class="btn btn-default" href="#">View details »</a></p>
+ </div><!--/span-->
+ <div class="col-6 col-sm-6 col-lg-4">
+ <h2>Heading</h2>
+ <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
+ <p><a class="btn btn-default" href="#">View details »</a></p>
+ </div><!--/span-->
+ <div class="col-6 col-sm-6 col-lg-4">
+ <h2>Heading</h2>
+ <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
+ <p><a class="btn btn-default" href="#">View details »</a></p>
+ </div><!--/span-->
+ <div class="col-6 col-sm-6 col-lg-4">
+ <h2>Heading</h2>
+ <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
+ <p><a class="btn btn-default" href="#">View details »</a></p>
+ </div><!--/span-->
+ <div class="col-6 col-sm-6 col-lg-4">
+ <h2>Heading</h2>
+ <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
+ <p><a class="btn btn-default" href="#">View details »</a></p>
+ </div><!--/span-->
+ <div class="col-6 col-sm-6 col-lg-4">
+ <h2>Heading</h2>
+ <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
+ <p><a class="btn btn-default" href="#">View details »</a></p>
+ </div><!--/span-->
+ </div><!--/row-->
+ </div><!--/span-->
+
+ <div class="col-xs-6 col-sm-3 sidebar-offcanvas" id="sidebar" role="navigation">
+ <div class="well sidebar-nav">
+ <ul class="nav">
+ <li>Sidebar</li>
+ <li class="active"><a href="#">Link</a></li>
+ <li><a href="#">Link</a></li>
+ <li><a href="#">Link</a></li>
+ <li>Sidebar</li>
+ <li><a href="#">Link</a></li>
+ <li><a href="#">Link</a></li>
+ <li><a href="#">Link</a></li>
+ <li>Sidebar</li>
+ <li><a href="#">Link</a></li>
+ <li><a href="#">Link</a></li>
+ </ul>
+ </div><!--/.well -->
+ </div><!--/span-->
+ </div><!--/row-->
+
+ <hr>
+
+ <footer>
+ <p>© Company 2013</p>
+ </footer>
+
+ </div><!--/.container-->
+
+ <!-- jQuery and plugin -->
+ <script src="../../assets/js/jquery.js"></script>
+ <script src="../../dist/js/bootstrap.min.js"></script>
+ <script src="offcanvas.js"></script>
+ </body>
+</html>
\ No newline at end of file
--- /dev/null
+/*
+ * Style twaks
+ * --------------------------------------------------
+ */
+body {
+ padding-top: 70px;
+}
+footer {
+ padding-left: 15px;
+ padding-right: 15px;
+}
+
+/*
+ * Off Canvas
+ * --------------------------------------------------
+ */
+@media screen and (max-width: 768px) {
+ .row-offcanvas {
+ position: relative;
+ -webkit-transition: all 0.25s ease-out;
+ -moz-transition: all 0.25s ease-out;
+ transition: all 0.25s ease-out;
+ }
+
+ .row-offcanvas-right
+ .sidebar-offcanvas {
+ right: -50%; /* 6 columns */
+ }
+
+ .row-offcanvas-left
+ .sidebar-offcanvas {
+ left: -50%; /* 6 columns */
+ }
+
+ .row-offcanvas-right.active {
+ right: 50%; /* 6 columns */
+ }
+
+ .row-offcanvas-left.active {
+ left: 50%; /* 6 columns */
+ }
+
+ .sidebar-offcanvas {
+ position: absolute;
+ top: 0;
+ width: 50%; /* 6 columns */
+ }
+}
\ No newline at end of file
--- /dev/null
+$(document).ready(function() {
+ $('[data-toggle=offcanvas]').click(function() {
+ $('.row-offcanvas').toggleClass('active');
+ });
+});
\ No newline at end of file
--- /dev/null
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta name="description" content="">
+ <meta name="author" content="">
+ <link rel="shortcut icon" href="../../assets/ico/favicon.png">
+
+ <title>Signin Template for Bootstrap</title>
+
+ <!-- Bootstrap core CSS -->
+ <link href="../../dist/css/bootstrap.css" rel="stylesheet">
+
+ <!-- Custom styles for this template -->
+ <link href="signin.css" rel="stylesheet">
+ </head>
+
+ <body>
+
+ <div class="container">
+
+ <form class="form-signin">
+ <h2 class="form-signin-heading">Please sign in</h2>
+ <input type="text" class="form-control" placeholder="Email address" autofocus>
+ <input type="password" class="form-control" placeholder="Password">
+ <label class="checkbox">
+ <input type="checkbox" value="remember-me"> Remember me
+ </label>
+ <button class="btn btn-large btn-primary btn-block" type="submit">Sign in</button>
+ </form>
+
+ </div> <!-- /container -->
+
+ </body>
+</html>
\ No newline at end of file
--- /dev/null
+body {
+ padding-top: 40px;
+ padding-bottom: 40px;
+ background-color: #eee;
+}
+
+.form-signin {
+ max-width: 330px;
+ padding: 15px;
+ margin: 0 auto;
+}
+.form-signin .form-signin-heading,
+.form-signin .checkbox {
+ margin-bottom: 10px;
+}
+.form-signin .checkbox {
+ font-weight: normal;
+}
+.form-signin .form-control {
+ position: relative;
+ font-size: 16px;
+ height: auto;
+ padding: 10px;
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+}
+.form-signin .form-control:focus {
+ z-index: 2;
+}
+.form-signin input[type="text"] {
+ margin-bottom: -1px;
+ border-bottom-left-radius: 0;
+ border-bottom-right-radius: 0;
+}
+.form-signin input[type="password"] {
+ margin-bottom: 10px;
+ border-top-left-radius: 0;
+ border-top-right-radius: 0;
+}
\ No newline at end of file
--- /dev/null
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta name="description" content="">
+ <meta name="author" content="">
+ <link rel="shortcut icon" href="../../assets/ico/favicon.png">
+
+ <title>Starter Template for Bootstrap</title>
+
+ <!-- Bootstrap core CSS -->
+ <link href="../../dist/css/bootstrap.css" rel="stylesheet">
+
+ <!-- Custom styles for this template -->
+ <link href="starter-template.css" rel="stylesheet">
+ </head>
+
+ <body>
+
+ <div class="navbar navbar-inverse navbar-fixed-top">
+ <div class="container">
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <a class="navbar-brand" href="#">Project name</a>
+ </div>
+ <div class="collapse navbar-collapse">
+ <ul class="nav navbar-nav">
+ <li class="active"><a href="#">Home</a></li>
+ <li><a href="#about">About</a></li>
+ <li><a href="#contact">Contact</a></li>
+ </ul>
+ </div><!--/.nav-collapse -->
+ </div>
+ </div>
+
+ <div class="container">
+
+ <div class="starter-template">
+ <h1>Bootstrap starter template</h1>
+ <p class="lead">Use this document as a way to quickly start any new project.<br> All you get is this text and a mostly barebones HTML document.</p>
+ </div>
+
+ </div><!-- /.container -->
+
+ <script src="../../assets/js/jquery.js"></script>
+ <script src="../../dist/js/bootstrap.min.js"></script>
+ </body>
+</html>
\ No newline at end of file
--- /dev/null
+body {
+ padding-top: 50px;
+}
+.starter-template {
+ padding: 40px 15px;
+ text-align: center;
+}
--- /dev/null
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta name="description" content="">
+ <meta name="author" content="">
+ <link rel="shortcut icon" href="../../assets/ico/favicon.png">
+
+ <title>Sticky Footer Navbar Template for Bootstrap</title>
+
+ <!-- Bootstrap core CSS -->
+ <link href="../../dist/css/bootstrap.css" rel="stylesheet">
+
+ <!-- Custom styles for this template -->
+ <link href="sticky-footer-navbar.css" rel="stylesheet">
+ </head>
+
+ <body>
+
+ <!-- Wrap all page content here -->
+ <div id="wrap">
+
+ <!-- Fixed navbar -->
+ <div class="navbar navbar-fixed-top">
+ <div class="container">
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <a class="navbar-brand" href="#">Project name</a>
+ </div>
+ <div class="collapse navbar-collapse">
+ <ul class="nav navbar-nav">
+ <li class="active"><a href="#">Home</a></li>
+ <li><a href="#about">About</a></li>
+ <li><a href="#contact">Contact</a></li>
+ <li class="dropdown">
+ <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <ul class="dropdown-menu">
+ <li><a href="#">Action</a></li>
+ <li><a href="#">Another action</a></li>
+ <li><a href="#">Something else here</a></li>
+ <li class="divider"></li>
+ <li class="dropdown-header">Nav header</li>
+ <li><a href="#">Separated link</a></li>
+ <li><a href="#">One more separated link</a></li>
+ </ul>
+ </li>
+ </ul>
+ </div><!--/.nav-collapse -->
+ </div>
+ </div>
+
+ <!-- Begin page content -->
+ <div class="container">
+ <div class="page-header">
+ <h1>Sticky footer with fixed navbar</h1>
+ </div>
+ <p class="lead">Pin a fixed-height footer to the bottom of the viewport in desktop browsers with this custom HTML and CSS. A fixed navbar has been added within <code>#wrap</code> with <code>padding-top: 60px;</code> on the <code>.container</code>.</p>
+ <p>Back to <a href="../sticky-footer">the default sticky footer</a> minus the navbar.</p>
+ </div>
+ </div>
+
+ <div id="footer">
+ <div class="container">
+ <p class="text-muted credit">Example courtesy <a href="http://martinbean.co.uk">Martin Bean</a> and <a href="http://ryanfait.com/sticky-footer/">Ryan Fait</a>.</p>
+ </div>
+ </div>
+
+ <!-- Bootstrap core JavaScript
+ ================================================== -->
+ <script src="../../assets/js/jquery.js"></script>
+ <script src="../../dist/js/bootstrap.min.js"></script>
+ </body>
+</html>
\ No newline at end of file
--- /dev/null
+/* Sticky footer styles
+-------------------------------------------------- */
+
+html,
+body {
+ height: 100%;
+ /* The html and body elements cannot have any padding or margin. */
+}
+
+/* Wrapper for page content to push down footer */
+#wrap {
+ min-height: 100%;
+ height: auto !important;
+ height: 100%;
+ /* Negative indent footer by its height */
+ margin: 0 auto -60px;
+ /* Pad bottom by footer height */
+ padding: 0 0 60px;
+}
+
+/* Set the fixed height of the footer here */
+#footer {
+ height: 60px;
+ background-color: #f5f5f5;
+}
+
+
+/* Custom page CSS
+-------------------------------------------------- */
+/* Not required for template or sticky footer method. */
+
+#wrap > .container {
+ padding: 60px 15px 0;
+}
+.container .credit {
+ margin: 20px 0;
+}
+
+#footer > .container {
+ padding-left: 15px;
+ padding-right: 15px;
+}
+
+code {
+ font-size: 80%;
+}
\ No newline at end of file
--- /dev/null
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta name="description" content="">
+ <meta name="author" content="">
+ <link rel="shortcut icon" href="../../assets/ico/favicon.png">
+
+ <title>Sticky Footer Template for Bootstrap</title>
+
+ <!-- Bootstrap core CSS -->
+ <link href="../../dist/css/bootstrap.css" rel="stylesheet">
+
+ <!-- Custom styles for this template -->
+ <link href="sticky-footer.css" rel="stylesheet">
+ </head>
+
+ <body>
+
+ <!-- Wrap all page content here -->
+ <div id="wrap">
+
+ <!-- Begin page content -->
+ <div class="container">
+ <div class="page-header">
+ <h1>Sticky footer</h1>
+ </div>
+ <p class="lead">Pin a fixed-height footer to the bottom of the viewport in desktop browsers with this custom HTML and CSS.</p>
+ <p>Use <a href="../sticky-footer-navbar">the sticky footer with a fixed navbar</a> if need be, too.</p>
+ </div>
+ </div>
+
+ <div id="footer">
+ <div class="container">
+ <p class="text-muted credit">Example courtesy <a href="http://martinbean.co.uk">Martin Bean</a> and <a href="http://ryanfait.com/sticky-footer/">Ryan Fait</a>.</p>
+ </div>
+ </div>
+
+ </body>
+</html>
\ No newline at end of file
--- /dev/null
+/* Sticky footer styles
+-------------------------------------------------- */
+
+html,
+body {
+ height: 100%;
+ /* The html and body elements cannot have any padding or margin. */
+}
+
+/* Wrapper for page content to push down footer */
+#wrap {
+ min-height: 100%;
+ height: auto !important;
+ height: 100%;
+ /* Negative indent footer by its height */
+ margin: 0 auto -60px;
+ /* Pad bottom by footer height */
+ padding: 0 0 60px;
+}
+
+/* Set the fixed height of the footer here */
+#footer {
+ height: 60px;
+ background-color: #f5f5f5;
+}
+
+
+/* Custom page CSS
+-------------------------------------------------- */
+/* Not required for template or sticky footer method. */
+
+.container {
+ width: auto;
+ max-width: 680px;
+ padding: 0 15px;
+}
+.container .credit {
+ margin: 20px 0;
+}
\ No newline at end of file
</div>
<p class="lead">There are a few easy ways to quickly get started with Bootstrap, each one appealing to a different skill level and use case. Read through to see what suits your particular needs.</p>
+ <h3 id="download-source">Download latest full source</h3>
+ <p>Until Bootstrap 3.0.0 is finalized, download the latest full source code (includes compiled and minified versions of our CSS and JavaScript under the <code>dist/</code> directory).</p>
+ <p><a class="btn btn-lg btn-primary" href="{{ site.download }}" onclick="_gaq.push(['_trackEvent', 'Getting started', 'Download', 'Download source']);">Download latest Bootstrap 3</a></p>
+ <!--
<h3>Download compiled CSS and JS</h3>
<p class="lead">The fastest way to get started is to get the compiled and minified versions of our CSS and JavaScript. No documentation or original source files are included.</p>
- <p><a class="btn btn-large btn-primary" href="{{ site.download_dist }}" onclick="_gaq.push(['_trackEvent', 'Getting started', 'Download', 'Download compiled']);">Download Bootstrap</a></p>
+ <p><a class="btn btn-lg btn-primary" href="{{ site.download_dist }}" onclick="_gaq.push(['_trackEvent', 'Getting started', 'Download', 'Download compiled']);">Download Bootstrap</a></p>
+ -->
- <hr>
-
- <h3 id="download-options">More download options</h3>
+ <h3 id="download-additional">Additional downloads</h3>
<div class="bs-docs-dl-options">
<h4>
<a href="{{ site.download }}" onclick="_gaq.push(['_trackEvent', 'Getting started', 'Download', 'Download source']);">Download latest source code</a>
{% highlight bash %}$ bower install bootstrap{% endhighlight %}
</div>
- <hr>
-
- <h3 id="download-cdn">Use the Bootstrap CDN</h3>
+ <h3 id="download-cdn">Bootstrap CDN</h3>
<p>The folks over at <a href="https://www.netdna.com/">NetDNA</a> have graciously provided CDN support for Bootstrap's CSS and JavaScript. To use, swap your local instances for the <a href="http://www.bootstrapcdn.com/">Bootstrap CDN</a> links listed below.</p>
{% highlight html linenos %}
<!-- Latest compiled and minified CSS -->
-<link href="{{ site.cdn_css }}">
+<link rel="stylesheet" href="{{ site.cdn_css }}">
<!-- Latest compiled and minified JavaScript -->
<script src="{{ site.cdn_js }}"></script>
│ ├── bootstrap.min.js
{% endhighlight %}
- <p>This is the most basic form of Bootstrap: compiled files for quick drop-in usage in nearly any web project. We provide compiled CSS and JS (<code>bootstrap.*</code>), as well as compiled and minified CSS and JS (<code>bootstrap.min.*</code>). The image files are compressed using <a href="http://imageoptim.com/">ImageOptim</a>, a Mac app for compressing PNGs.</p>
+ <p>This is the most basic form of Bootstrap: compiled files for quick drop-in usage in nearly any web project. We provide compiled CSS and JS (<code>bootstrap.*</code>), as well as compiled and minified CSS and JS (<code>bootstrap.min.*</code>).</p>
<div class="bs-callout bs-callout-danger">
<h4>jQuery required</h4>
<p>Please note that <strong>all JavaScript plugins require jQuery</strong> to be included, as shown in the <a href="#template">starter template</a>.</p>
<div class="page-header">
<h1 id="template">Basic template</h1>
</div>
- <p class="lead">Make use of a super basic HTML template, or dive into a <a href="{{ site.examples }}">few examples</a> we've started for you. We encourage folks to iterate on these examples and not simply use them as an end result.</p>
+ <p class="lead">Make use of a super basic HTML template, or dive into a <a href="../getting-started#examples">few examples</a> we've started for you. We encourage folks to iterate on these examples and not simply use them as an end result.</p>
<p>Copy and paste the HTML from below to get started with a bare bones Bootstrap document.</p>
{% highlight html %}
<body>
<h1>Hello, world!</h1>
- <!-- JavaScript plugins (requires jQuery) -->
- <script src="http://code.jquery.com/jquery.js"></script>
+ <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+ <script src="//code.jquery.com/jquery.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
- <!-- Optionally enable responsive features in IE8 -->
+ <!-- Enable responsive features in IE8 with Respond.js (https://github.com/scottjehl/Respond) -->
<script src="js/respond.js"></script>
</body>
</html>
{% endhighlight %}
+ </div>
+
+
+
+ <!-- Template
+ ================================================== -->
+ <div class="bs-docs-section">
+ <div class="page-header">
+ <h1 id="examples">Examples</h1>
+ </div>
+ <p class="lead">Build on the basic template above with Bootstrap's many components. Check out some of the more advanced tips for how to customize and build on top of them.</p>
+
+ <div class="row bs-examples">
+ <div class="col-xs-6 col-md-4">
+ <a class="thumbnail" href="../examples/starter-template/">
+ <img src="../examples/screenshots/starter-template.jpg" alt="">
+ </a>
+ <h4>Starter template</h4>
+ <p>Nothing but the basics: compiled CSS and JavaScript along with a container.</p>
+ </div>
+ <div class="col-xs-6 col-md-4">
+ <a class="thumbnail" href="../examples/grid/">
+ <img src="../examples/screenshots/grid.jpg" alt="">
+ </a>
+ <h4>Grids</h4>
+ <p>Multiple examples of grid layouts with all four tiers, nesting, and more.</p>
+ </div>
+ <div class="clearfix visible-xs"></div>
+
+ <div class="col-xs-6 col-md-4">
+ <a class="thumbnail" href="../examples/jumbotron/">
+ <img src="../examples/screenshots/jumbotron.jpg" alt="">
+ </a>
+ <h4>Jumbotron</h4>
+ <p>Build around the jumbotron with a navbar and some basic grid columns.</p>
+ </div>
+ <div class="col-xs-6 col-md-4">
+ <a class="thumbnail" href="../examples/jumbotron-narrow/">
+ <img src="../examples/screenshots/jumbotron-narrow.jpg" alt="">
+ </a>
+ <h4>Narrow jumbotron</h4>
+ <p>Build a more custom page by narrowing the default container and jumbotron.</p>
+ </div>
+ <div class="clearfix visible-xs"></div>
+
+ <div class="col-xs-6 col-md-4">
+ <a class="thumbnail" href="../examples/navbar/">
+ <img src="../examples/screenshots/navbar.jpg" alt="">
+ </a>
+ <h4>Navbar</h4>
+ <p>Super basic template that includes the navbar along with some additional content.</p>
+ </div>
+ <div class="col-xs-6 col-md-4">
+ <a class="thumbnail" href="../examples/navbar-static-top/">
+ <img src="../examples/screenshots/navbar-static.jpg" alt="">
+ </a>
+ <h4>Static top navbar</h4>
+ <p>Super basic template with a static top navbar along with some additional content.</p>
+ </div>
+ <div class="clearfix visible-xs"></div>
+
+ <div class="col-xs-6 col-md-4">
+ <a class="thumbnail" href="../examples/navbar-fixed-top/">
+ <img src="../examples/screenshots/navbar-fixed.jpg" alt="">
+ </a>
+ <h4>Fixed navbar</h4>
+ <p>Super basic template with a fixed top navbar along with some additional content.</p>
+ </div>
+ <div class="col-xs-6 col-md-4">
+ <a class="thumbnail" href="../examples/signin/">
+ <img src="../examples/screenshots/sign-in.jpg" alt="">
+ </a>
+ <h4>Sign-in page</h4>
+ <p>Custom form layout and design for a simple sign in form.</p>
+ </div>
+ <div class="clearfix visible-xs"></div>
+
+ <div class="col-xs-6 col-md-4">
+ <a class="thumbnail" href="../examples/sticky-footer/">
+ <img src="../examples/screenshots/sticky-footer.jpg" alt="">
+ </a>
+ <h4>Sticky footer</h4>
+ <p>Attach a footer to the bottom of the viewport when the content is shorter than it.</p>
+ </div>
+ <div class="col-xs-6 col-md-4">
+ <a class="thumbnail" href="../examples/sticky-footer-navbar/">
+ <img src="../examples/screenshots/sticky-footer-navbar.jpg" alt="">
+ </a>
+ <h4>Sticky footer with navbar</h4>
+ <p>Attach a footer to the bottom of the viewport with a fixed navbar at the top.</p>
+ </div>
+ <div class="clearfix visible-xs"></div>
+
+ <div class="col-xs-6 col-md-4">
+ <a class="thumbnail" href="../examples/justified-nav/">
+ <img src="../examples/screenshots/justified-nav.jpg" alt="">
+ </a>
+ <h4>Justified nav</h4>
+ <p>Expand on the default navbar and more to create justified navigation links.</p>
+ </div>
+ <div class="col-xs-6 col-md-4">
+ <a class="thumbnail" href="../examples/offcanvas/">
+ <img src="../examples/screenshots/offcanvas.jpg" alt="">
+ </a>
+ <h4>Offcanvas</h4>
+ <p>Build a toggleable off-canvas navigation menu for use with Bootstrap.</p>
+ </div>
+ <div class="clearfix visible-xs"></div>
+
+ <div class="col-xs-6 col-md-4">
+ <a class="thumbnail" href="../examples/carousel/">
+ <img src="../examples/screenshots/carousel.jpg" alt="">
+ </a>
+ <h4>Carousel</h4>
+ <p>Customize the navbar and carousel, then add some new components.</p>
+ </div>
+
+ </div>
- <h3>Looking for more example templates?</h3>
- <p>Check out the new <a href="{{ site.examples_repo }}">Examples repository on GitHub</a>, or <a href="{{ site.examples }}">view them in your browser</a>. Included are over a dozen example templates for building with and extending Bootstrap.</p>
</div>
- <!-- Browser compatibility
+ <!-- Template
================================================== -->
<div class="bs-docs-section">
<div class="page-header">
- <h1 id="browsers">Browser compatibility</h1>
+ <h1 id="disable-responsive">Disabling responsiveness</h1>
+ </div>
+ <p class="lead">Don't want your site or application to be scale on different device? With a little bit of work, you can disable the responsive features of Bootstrap so that mobile users see your full desktop-version site.</p>
+
+ <h3>Steps to disable responsive views</h3>
+ <p>To disable responsive features, follow these steps. See it in action in the modified template below.</p>
+ <ol>
+ <li>Remove (or just don't add) the viewport <code><meta></code> mentioned in <a href="../css/#overview-mobile">the CSS docs</a></li>
+ <li>Force a single <code>max-width</code> on the <code>.container</code> (e.g., <code>.container { max-width: 940px; }</code>). Be sure that this comes after the default Bootstrap CSS; otherwise, you'll need <code>!important</code>.</li>
+ <li>For grid layouts, make use of <code>.col-xs-*</code> classes in addition to or in place of the medium/large ones. Don't worry, the extra-small device grid scales up to all resolutions, so you're set there.</li>
+ </ol>
+ <p>You'll still need respond.js for IE8 (since our media queries are still there and need to be picked up). This just disables the "mobile site" of Bootstrap.</p>
+
+ <h3>Bootstrap template with disabled responsive</h3>
+ <p>We've taken the above steps and applied them to a basic template here. Note the steps above are called out in comments here, e.g. <code><-- 1. --></code>.</p>
+{% highlight html %}
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>Disabling responsiveness in Bootstrap</title>
+
+ <!-- 1. Note there is no meta tag here -->
+
+ <!-- Load default Bootstrap -->
+ <link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
+
+ <!-- 2. Add our custom CSS to set the container's fixed width -->
+ <style>
+ .container { max-width: 940px; }
+ </style>
+ </head>
+ <body>
+
+ <h1>Hello, world!</h1>
+
+ <!-- 3. When using grid columns, use the `.col-xs-*` classes -->
+ <div class="row">
+ <div class="col-xs-4">One third</div>
+ <div class="col-xs-4">One third</div>
+ <div class="col-xs-4">One third</div>
+ </div>
+
+ <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+ <script src="//code.jquery.com/jquery.js"></script>
+
+ <!-- Include all compiled plugins (below), or include individual files as needed -->
+ <script src="js/bootstrap.min.js"></script>
+
+ <!-- Enable responsive features in IE8 with Respond.js (https://github.com/scottjehl/Respond) -->
+ <script src="js/respond.js"></script>
+ </body>
+</html>
+{% endhighlight %}
+ </div>
+
+
+
+ <!-- Browser support
+ ================================================== -->
+ <div class="bs-docs-section">
+ <div class="page-header">
+ <h1 id="browsers">Browser support</h1>
</div>
<p class="lead">Bootstrap is built to work best in the latest desktop and mobile browsers, meaning older and less advanced browsers might receive a less stylized, though fully functional, version of certain components.</p>
<p>In addition, <strong>Internet Explorer 8 requires the use of <a href="https://github.com/scottjehl/Respond">respond.js</a> to enable media query support.</strong></p>
<h3>IE Compatibility modes</h3>
- <p>Bootstrap is not supported in the old Internet Explorer compatibility modes. To be sure you're using the latest rendering mode for IE, consider including the appropriate <code>meta</code> tag in your pages.</p>
+ <p>Bootstrap is not supported in the old Internet Explorer compatibility modes. To be sure you're using the latest rendering mode for IE, consider including the appropriate <code>meta</code> tag in your pages:</p>
{% highlight html %}
<meta http-equiv="X-UA-Compatible" content="IE=edge">
{% endhighlight %}
<p>See <a href="http://stackoverflow.com/questions/6771258/whats-the-difference-if-meta-http-equiv-x-ua-compatible-content-ie-edge">this StackOverflow question</a> for more information.</p>
+
+ <h3>Windows Phone 8 and Internet Explorer 10</h3>
+ <p>Internet Explorer 10 doesn't differentiate device width from viewport width, and thus doesn't properly apply the media queries in Bootstrap's CSS. To address this, you can optionally include the following CSS and JavaScript to work around this problem until Microsoft issues a fix.</p>
+{% highlight css %}
+@-webkit-viewport { width: device-width; }
+@-moz-viewport { width: device-width; }
+@-ms-viewport { width: device-width; }
+@-o-viewport { width: device-width; }
+@viewport { width: device-width; }
+{% endhighlight %}
+
+{% highlight js %}
+if (navigator.userAgent.match(/IEMobile\/10\.0/)) {
+ var msViewportStyle = document.createElement("style")
+ msViewportStyle.appendChild(
+ document.createTextNode(
+ "@-ms-viewport{width:auto!important}"
+ )
+ )
+ document.getElementsByTagName("head")[0].appendChild(msViewportStyle)
+}
+{% endhighlight %}
+ <p>For more information and usage guidelines, read <a href="http://timkadlec.com/2013/01/windows-phone-8-and-device-width/">Windows Phone 8 and Device-Width</a>.</p>
+
+ <h3>Safari percent rounding</h3>
+ <p>In the latest Safari for Mac, its rendering engine has a little trouble with the long decimal places of our <code>.col-*-1</code> grid classes, meaning if you have 12 individual columns you'll notice they come up short compared to other rows of columns. There's not much we can do here (<a href="https://github.com/twbs/bootstrap/issues/9282">see #9282</a>) but you do have some options:</p>
+ <ul>
+ <li>Add <code>.pull-right</code> to your last grid column to get the hard-right alignment</li>
+ <li>Tweak your percentages manually to get the perfect rounding for Safari (more difficult than the first option)</li>
+ </ul>
+ <p>We'll keep an eye on this though and update our code if we have an easy solution.</p>
+
+ <h3>Modals and mobile devices</h3>
+ <p>Support for <code>overflow: hidden</code> on the <code><body></code> element is quite limited in iOS and Android. To that end, when you scroll past the top or bottom of a modal in either of those devices' browsers, the <code><body></code> content will begin to scroll.</p>
+
+ <h3>Browser zooming</h3>
+ <p>Page zooming inevitably presents rendering artifacts in some components, both in Bootstrap and the rest of the web. Depending on the issue, we may be able to fix it (search first and then open an issue if need be). However, we tend to ignore these as they often have no direct solution other than hacky workarounds.</p>
+ </div>
+
+
+
+ <!-- Third party support
+ ================================================== -->
+ <div class="bs-docs-section">
+ <div class="page-header">
+ <h1 id="third-parties">Third party support</h1>
+ </div>
+ <p class="lead">While we don't officially support any third party plugins or add-ons, we do offer some useful advice to help avoid potential issues in your projects.</p>
+
+ <h3>Google Maps</h3>
+ <p>If you're using Google Maps on a Bootstrapped project, you might run into some display problems due to our use of <code>* { box-sizing: border-box; }</code>. Previously, you may have also ran into issues with the use of <code>max-width</code> on images. The following snippet should avoid all those problems.</p>
+{% highlight css %}
+/* Fix Google Maps canvas
+ *
+ * Wrap your Google Maps embed in a `.google-map-canvas` to reset Bootstrap's
+ * global `box-sizing` changes. You may optionally need to reset the `max-width`
+ * on images in case you've applied that anywhere else. (That shouldn't be as
+ * necessary with Bootstrap 3 though as that behavior is relegated to the
+ * `.img-responsive` class.)
+ */
+
+.google-map-canvas,
+.google-map-canvas * { .box-sizing(content-box); }
+
+/* Optional responsive image override */
+img { max-width: none; }
+{% endhighlight %}
+ </div>
+
+
+
+ <!-- Accessibility
+ ================================================== -->
+ <div class="bs-docs-section">
+ <div class="page-header">
+ <h1 id="accessibility">Accessibility</h1>
+ </div>
+ <p class="lead">Bootstrap follows common web standards, and with minimal extra effort, can be used to create sites that are accessibile to those using <abbr title="Assistive Technology" class="initialism">AT</abbr>.</p>
+
+ <h3>Skip navigation</h3>
+ <p>If your navigation contains many links and comes before the main content in the DOM, add a <code>Skip to content</code> link immediately after your opening <code><body></code> tag. <a href="http://a11yproject.com/posts/skip-nav-links/">(read why)</a></p>
+{% highlight html %}
+<body>
+ <a href="#content" class="sr-only">Skip to content</a>
+ <div class="container" id="content">
+ The main page content.
+ </div>
+</body>
+{% endhighlight %}
+
+ <h3>Nested headers</h3>
+ <p>Another "gotcha" has to do with how you nest your <code><header></code> elements. <a href="http://squizlabs.github.io/HTML_CodeSniffer/Standards/Section508/">Section 508</a> states that your largest header must be an <code>h1</code>, and the next header must be an <code><h2></code>, etc. This is hard to achieve in practice, but if the largest header on your site is smaller than Bootstrap's default 38px, you should consider modifying your stylesheets before using a smaller header element.</p>
+
+ <h3>Additional resources</h3>
+ <ul>
+ <li><a href="https://github.com/squizlabs/HTML_CodeSniffer">"HTML Codesniffer" bookmarklet for identifying accessibility issues</a></li>
+ <li><a href="http://a11yproject.com/">The A11Y Project</a></li>
+ <li><a href="https://developer.mozilla.org/en-US/docs/Accessibility">MDN accessibility documentation</a></li>
+ </ul>
</div>
<h4>It does not require you to:</h4>
<ul>
<li>Include the source of Bootstrap itself, or of any modifications you may have made to it, in any redistribution you may assemble that includes it</li>
- <li>Submit changes that you make to Bootstrap back to Twitter (though such feedback is encouraged)</li>
+ <li>Submit changes that you make to Bootstrap back to the Bootstrap project (though such feedback is encouraged)</li>
</ul>
</div>
</div>
base_url: "./"
---
-<div class="bs-masthead">
+<main class="bs-masthead" id="content" role="main">
<div class="container">
<h1>Bootstrap 3</h1>
<p class="lead">Sleek, intuitive, and powerful mobile-first front-end framework for faster and easier web development.</p>
<p>
- <a href="{{ site.download_dist }}" class="btn btn-bs btn-large" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Download', 'Download 3.0.0 RC1']);">Download Bootstrap</a>
+ <a href="{{ site.download }}" class="btn btn-outline btn-lg" onclick="_gaq.push(['_trackEvent', 'Jumbotron actions', 'Download', 'Download 3.0.0 RC2']);">Download latest BS3</a>
</p>
+ <p><strong>Heads up!</strong> Downloads are pulled directly from the latest committed code on GitHub, and as a result our docs may at times be out of sync.</p>
</div>
-</div>
+</main>
</div>
<h3 id="js-individual-compiled">Individual or compiled</h3>
- <p>Plugins can be included individually (using bootstrap's individual <code>*.js</code> files, or all at once (using <code>bootstrap.js</code> or the minified <code>bootstrap.min.js</code>.</p>
+ <p>Plugins can be included individually (using Bootstrap's individual <code>*.js</code> files), or all at once (using <code>bootstrap.js</code> or the minified <code>bootstrap.min.js</code>).</p>
<div class="bs-callout bs-callout-danger">
<h4>Do not attempt to include both.</h4>
<div class="bs-callout bs-callout-danger">
<h4>Plugin dependencies</h4>
- <p>Some plugins and CSS components depend on other plugins. If you include plugins individually, make sure to check for these dependencies in the docs.</p>
+ <p>Some plugins and CSS components depend on other plugins. If you include plugins individually, make sure to check for these dependencies in the docs. Also note that all plugins depend on jQuery (this means jQuery must be included <strong>before</strong> the plugin files).</p>
</div>
<h3 id="js-data-attrs">Data attributes</h3>
- <p>You can use all Bootstrap plugins purely through the markup API without writing a single line of JavaScript. This is Bootstrap's first class API and should be your first consideration when using a plugin.</p>
+ <p>You can use all Bootstrap plugins purely through the markup API without writing a single line of JavaScript. This is Bootstrap's first-class API and should be your first consideration when using a plugin.</p>
<p>That said, in some situations it may be desirable to turn this functionality off. Therefore, we also provide the ability to disable the data attribute API by unbinding all events on the document namespaced with <code>data-api</code>. This looks like this:
{% highlight js %}
<p>Sometimes it is necessary to use Bootstrap plugins with other UI frameworks. In these circumstances, namespace collisions can occasionally occur. If this happens, you may call <code>.noConflict</code> on the plugin you wish to revert the value of.</p>
{% highlight js %}
var bootstrapButton = $.fn.button.noConflict() // return $.fn.button to previously assigned value
-$.fn.bootstrapBtn = bootstrapButton // give $().bootstrapBtn the bootstrap functionality
+$.fn.bootstrapBtn = bootstrapButton // give $().bootstrapBtn the Bootstrap functionality
{% endhighlight %}
<h3 id="js-events">Events</h3>
<p>Bootstrap provides custom events for most plugin's unique actions. Generally, these come in an infinitive and past participle form - where the infinitive (ex. <code>show</code>) is triggered at the start of an event, and its past participle form (ex. <code>shown</code>) is trigger on the completion of an action.</p>
- <p>As of 3.0.0, all bootstrap events are namespaced.</p>
+ <p>As of 3.0.0, all Bootstrap events are namespaced.</p>
<p>All infinitive events provide <code>preventDefault</code> functionality. This provides the ability to stop the execution of an action before it starts.</p>
{% highlight js %}
$('#myModal').on('show.bs.modal', function (e) {
<h3>About transitions</h3>
<p>For simple transition effects, include <code>transition.js</code> once alongside the other JS files. If you're using the compiled (or minified) <code>bootstrap.js</code>, there is no need to include this—it's already there.</p>
<h3>What's inside</h3>
- <p>Transition.js is a basic helper for transitionEnd events as well as a css transition emulator. It's used by the other plugins to check for css transition support and to catch hanging transitions.</p>
+ <p>Transition.js is a basic helper for <code>transitionEnd</code> events as well as a CSS transition emulator. It's used by the other plugins to check for CSS transition support and to catch hanging transitions.</p>
</div>
<hr>
- <h4>Overflowing text to show optional scrollbar</h4>
+ <h4>Overflowing text to show scroll behavior</h4>
<p>Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
<p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p>
<p>Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.</p>
</div><!-- /.modal -->
<div class="bs-example" style="padding-bottom: 24px;">
- <a data-toggle="modal" href="#myModal" class="btn btn-primary btn-large">Launch demo modal</a>
+ <a data-toggle="modal" href="#myModal" class="btn btn-primary btn-lg">Launch demo modal</a>
</div><!-- /example -->
{% highlight html %}
<!-- Button trigger modal -->
- <a data-toggle="modal" href="#myModal" class="btn btn-primary btn-large">Launch demo modal</a>
+ <a data-toggle="modal" href="#myModal" class="btn btn-primary btn-lg">Launch demo modal</a>
<!-- Modal -->
- <div class="modal" id="myModal">
+ <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
...
</div>
<div class="modal-footer">
- <a href="#" class="btn">Close</a>
- <a href="#" class="btn btn-primary">Save changes</a>
+ <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+ <button type="button" class="btn btn-primary">Save changes</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
{% endhighlight %}
+
+ <div class="bs-callout bs-callout-warning">
+ <h4>Make modals accessible</h4>
+ <p>
+ Be sure to add <code>role="dialog"</code> to your primary modal div. In the example above, <code>div#myModal</code>.<br>
+ Also, the <code>aria-labelledby</code> attribute references your modal title. In this example, <code>h4#myModalLabel</code>.<br>
+ Finally, <code>aria-hidden="true"</code> tells assistive technologies to skip DOM elements.<br>
+ Additionally, you may give a description of your modal dialog. Use the <code>aria-describedby</code> attribute in the modal's primary <code><div></code> to point to this description (this is not shown in the above example).
+ </p>
+ </div>
+
<h2 id="modals-usage">Usage</h2>
<h3>Via data attributes</h3>
<td>remote</td>
<td>path</td>
<td>false</td>
- <td><p>If a remote URL is provided, content will be loaded via jQuery's <code>load</code> method and injected into the <code>.modal-body</code>. If you're using the data api, you may alternatively use the <code>href</code> tag to specify the remote source. An example of this is shown below:</p>
+ <td><p>If a remote URL is provided, content will be loaded via jQuery's <code>load</code> method and injected into the root of the modal element. If you're using the data api, you may alternatively use the <code>href</code> attribute to specify the remote source. An example of this is shown below:</p>
{% highlight html %}
<a data-toggle="modal" href="remote.html" data-target="#modal">Click me</a>
{% endhighlight %}
</thead>
<tbody>
<tr>
- <td>show</td>
+ <td>show.bs.modal</td>
<td>This event fires immediately when the <code>show</code> instance method is called.</td>
</tr>
<tr>
- <td>shown</td>
+ <td>shown.bs.modal</td>
<td>This event is fired when the modal has been made visible to the user (will wait for CSS transitions to complete).</td>
</tr>
<tr>
- <td>hide</td>
+ <td>hide.bs.modal</td>
<td>This event is fired immediately when the <code>hide</code> instance method has been called.</td>
</tr>
<tr>
- <td>hidden</td>
+ <td>hidden.bs.modal</td>
<td>This event is fired when the modal has finished being hidden from the user (will wait for CSS transitions to complete).</td>
</tr>
</tbody>
<h3>Within a navbar</h3>
<div class="bs-example">
- <div id="navbar-example" class="navbar navbar-static">
- <div class="container" style="width: auto;">
- <a class="navbar-brand" href="#">Project Name</a>
+ <nav id="navbar-example" class="navbar navbar-static" role="navigation">
+ <div class="navbar-header">
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-js-navbar-collapse">
+ <span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
- <div class="nav-collapse collapse bs-js-navbar-collapse">
- <ul class="nav navbar-nav" role="navigation">
- <li class="dropdown">
- <a id="drop1" href="#" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
- <ul class="dropdown-menu" role="menu" aria-labelledby="drop1">
- <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
- <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
- <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Something else here</a></li>
- <li role="presentation" class="divider"></li>
- <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Separated link</a></li>
- </ul>
- </li>
- <li class="dropdown">
- <a href="#" id="drop2" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown 2 <b class="caret"></b></a>
- <ul class="dropdown-menu" role="menu" aria-labelledby="drop2">
- <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
- <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
- <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Something else here</a></li>
- <li role="presentation" class="divider"></li>
- <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Separated link</a></li>
- </ul>
- </li>
- </ul>
- <ul class="nav navbar-nav pull-right">
- <li id="fat-menu" class="dropdown">
- <a href="#" id="drop3" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown 3 <b class="caret"></b></a>
- <ul class="dropdown-menu" role="menu" aria-labelledby="drop3">
- <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
- <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
- <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Something else here</a></li>
- <li role="presentation" class="divider"></li>
- <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Separated link</a></li>
- </ul>
- </li>
- </ul>
- </div><!-- /.nav-collapse -->
- </div><!-- /.container -->
- </div> <!-- /navbar-example -->
+ <a class="navbar-brand" href="#">Project Name</a>
+ </div>
+ <div class="collapse navbar-collapse bs-js-navbar-collapse">
+ <ul class="nav navbar-nav">
+ <li class="dropdown">
+ <a id="drop1" href="#" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <ul class="dropdown-menu" role="menu" aria-labelledby="drop1">
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Something else here</a></li>
+ <li role="presentation" class="divider"></li>
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Separated link</a></li>
+ </ul>
+ </li>
+ <li class="dropdown">
+ <a href="#" id="drop2" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown 2 <b class="caret"></b></a>
+ <ul class="dropdown-menu" role="menu" aria-labelledby="drop2">
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Something else here</a></li>
+ <li role="presentation" class="divider"></li>
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Separated link</a></li>
+ </ul>
+ </li>
+ </ul>
+ <ul class="nav navbar-nav navbar-right">
+ <li id="fat-menu" class="dropdown">
+ <a href="#" id="drop3" role="button" class="dropdown-toggle" data-toggle="dropdown">Dropdown 3 <b class="caret"></b></a>
+ <ul class="dropdown-menu" role="menu" aria-labelledby="drop3">
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Something else here</a></li>
+ <li role="presentation" class="divider"></li>
+ <li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Separated link</a></li>
+ </ul>
+ </li>
+ </ul>
+ </div><!-- /.nav-collapse -->
+ </nav> <!-- /navbar-example -->
</div> <!-- /example -->
<h3>Within tabs</h3>
<ul class="nav nav-pills">
<li class="active"><a href="#">Regular link</a></li>
<li class="dropdown">
- <a class="dropdown-toggle" id="drop4" role="button" data-toggle="dropdown" href="#">Dropdown <b class="caret"></b></a>
+ <a id="drop4" role="button" data-toggle="dropdown" href="#">Dropdown <b class="caret"></b></a>
<ul id="menu1" class="dropdown-menu" role="menu" aria-labelledby="drop4">
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
</ul>
</li>
<li class="dropdown">
- <a class="dropdown-toggle" id="drop5" role="button" data-toggle="dropdown" href="#">Dropdown 2 <b class="caret"></b></a>
+ <a id="drop5" role="button" data-toggle="dropdown" href="#">Dropdown 2 <b class="caret"></b></a>
<ul id="menu2" class="dropdown-menu" role="menu" aria-labelledby="drop5">
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
</ul>
</li>
<li class="dropdown">
- <a class="dropdown-toggle" id="drop6" role="button" data-toggle="dropdown" href="#">Dropdown 3 <b class="caret"></b></a>
+ <a id="drop6" role="button" data-toggle="dropdown" href="#">Dropdown 3 <b class="caret"></b></a>
<ul id="menu3" class="dropdown-menu" role="menu" aria-labelledby="drop6">
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Action</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="http://twitter.com/fat">Another action</a></li>
<p>Add <code>data-toggle="dropdown"</code> to a link or button to toggle a dropdown.</p>
{% highlight html %}
<div class="dropdown">
- <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown trigger</a>
+ <a data-toggle="dropdown" href="#">Dropdown trigger</a>
<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
...
</ul>
<p>To keep URLs intact, use the <code>data-target</code> attribute instead of <code>href="#"</code>.</p>
{% highlight html %}
<div class="dropdown">
- <a class="dropdown-toggle" id="dLabel" role="button" data-toggle="dropdown" data-target="#" href="/page.html">
+ <a id="dLabel" role="button" data-toggle="dropdown" data-target="#" href="/page.html">
Dropdown <span class="caret"></span>
</a>
<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
<h3>Methods</h3>
<h4>$().dropdown('toggle')</h4>
- <p>A programmatic api for toggling menus for a given navbar or tabbed navigation.</p>
- </div>
-
+ <p>Toggles the dropdown menu of a given navbar or tabbed navigation.</p>
+ <h3>Events</h3>
+ <div class="bs-table-scrollable">
+ <table class="table table-bordered table-striped">
+ <thead>
+ <tr>
+ <th style="width: 150px;">Event Type</th>
+ <th>Description</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>show.bs.dropdown</td>
+ <td>This event fires immediately when the show instance method is called.</td>
+ </tr>
+ <tr>
+ <td>shown.bs.dropdown</td>
+ <td>This event is fired when the dropdown has been made visible to the user (will wait for CSS transitions, to complete).</td>
+ </tr>
+ <tr>
+ <td>hide.bs.dropdown</td>
+ <td>This event is fired immediately when the hide instance method has been called.</td>
+ </tr>
+ <tr>
+ <td>hidden.bs.dropdown</td>
+ <td>This event is fired when the dropdown has finished being hidden from the user (will wait for CSS transitions, to complete).</td>
+ </tr>
+ </tbody>
+ </table>
+ </div><!-- ./bs-table-scrollable -->
+{% highlight js %}
+$('#myDropdown').on('show.bs.dropdown', function () {
+ // do something…
+})
+{% endhighlight %}
+ </div>
<!-- ScrollSpy
================================================== -->
<h2 id="scrollspy-examples">Example in navbar</h2>
<p>The ScrollSpy plugin is for automatically updating nav targets based on scroll position. Scroll the area below the navbar and watch the active class change. The dropdown sub items will be highlighted as well.</p>
<div class="bs-example">
- <div id="navbar-example2" class="navbar navbar-static">
- <div class="navbar-inner">
- <div class="container" style="width: auto;">
- <a class="navbar-brand" href="#">Project Name</a>
- <ul class="nav navbar-nav">
- <li><a href="#fat">@fat</a></li>
- <li><a href="#mdo">@mdo</a></li>
- <li class="dropdown">
- <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
- <ul class="dropdown-menu">
- <li><a href="#one">one</a></li>
- <li><a href="#two">two</a></li>
- <li class="divider"></li>
- <li><a href="#three">three</a></li>
- </ul>
- </li>
- </ul>
- </div>
+ <nav id="navbar-example2" class="navbar navbar-static" role="navigation">
+ <div class="navbar-header">
+ <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-js-navbar-scrollspy">
+ <span class="sr-only">Toggle navigation</span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <a class="navbar-brand" href="#">Project Name</a>
</div>
- </div>
+ <div class="collapse navbar-collapse bs-js-navbar-scrollspy">
+ <ul class="nav navbar-nav">
+ <li><a href="#fat">@fat</a></li>
+ <li><a href="#mdo">@mdo</a></li>
+ <li class="dropdown">
+ <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
+ <ul class="dropdown-menu">
+ <li><a href="#one">one</a></li>
+ <li><a href="#two">two</a></li>
+ <li class="divider"></li>
+ <li><a href="#three">three</a></li>
+ </ul>
+ </li>
+ </ul>
+ </div>
+ </nav>
<div data-spy="scroll" data-target="#navbar-example2" data-offset="0" class="scrollspy-example">
<h4 id="fat">@fat</h4>
<p>Ad leggings keytar, brunch id art party dolor labore. Pitchfork yr enim lo-fi before they sold out qui. Tumblr farm-to-table bicycle rights whatever. Anim keffiyeh carles cardigan. Velit seitan mcsweeney's photo booth 3 wolf moon irure. Cosby sweater lomo jean shorts, williamsburg hoodie minim qui you probably haven't heard of them et cardigan trust fund culpa biodiesel wes anderson aesthetic. Nihil tattooed accusamus, cred irony biodiesel keffiyeh artisan ullamco consequat.</p>
<h3>Via JavaScript</h3>
<p>Call the scrollspy via JavaScript:</p>
{% highlight js %}
-$('#navbar-example').scrollspy()
+$('body').scrollspy({ target: '#navbar-example' })
{% endhighlight %}
<div class="bs-callout bs-callout-danger">
{% highlight js %}
$('[data-spy="scroll"]').each(function () {
var $spy = $(this).scrollspy('refresh')
-});
+})
{% endhighlight %}
</thead>
<tbody>
<tr>
- <td>activate</td>
+ <td>activate.bs.scrollspy</td>
<td>This event fires whenever a new item becomes activated by the scrollspy.</td>
</tr>
</tbody>
<p>Enable tabbable tabs via JavaScript (each tab needs to be activated individually):</p>
{% highlight js %}
$('#myTab a').click(function (e) {
- e.preventDefault();
- $(this).tab('show');
+ e.preventDefault()
+ $(this).tab('show')
})
{% endhighlight %}
<p>You can activate individual tabs in several ways:</p>
{% highlight js %}
-$('#myTab a[href="#profile"]').tab('show'); // Select tab by name
-$('#myTab a:first').tab('show'); // Select first tab
-$('#myTab a:last').tab('show'); // Select last tab
-$('#myTab li:eq(2) a').tab('show'); // Select third tab (0-indexed)
+$('#myTab a[href="#profile"]').tab('show') // Select tab by name
+$('#myTab a:first').tab('show') // Select first tab
+$('#myTab a:last').tab('show') // Select last tab
+$('#myTab li:eq(2) a').tab('show') // Select third tab (0-indexed)
{% endhighlight %}
<h3>Markup</h3>
<script>
$(function () {
- $('#myTab a:last').tab('show');
+ $('#myTab a:last').tab('show')
})
</script>
{% endhighlight %}
</thead>
<tbody>
<tr>
- <td>show</td>
+ <td>show.bs.tab</td>
<td>This event fires on tab show, but before the new tab has been shown. Use <code>event.target</code> and <code>event.relatedTarget</code> to target the active tab and the previous active tab (if available) respectively.</td>
</tr>
<tr>
- <td>shown</td>
+ <td>shown.bs.tab</td>
<td>This event fires on tab show after a tab has been shown. Use <code>event.target</code> and <code>event.relatedTarget</code> to target the active tab and the previous active tab (if available) respectively.</td>
</tr>
</tbody>
<h3>Four directions</h3>
<div class="bs-example tooltip-demo">
<div class="bs-example-tooltips">
+ <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="left" title="Tooltip on left">Tooltip on left</button>
<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="top" title="Tooltip on top">Tooltip on top</button>
- <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="right" title="Tooltip on right">Tooltip on right</button>
<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom">Tooltip on bottom</button>
- <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="left" title="Tooltip on left">Tooltip on left</button>
+ <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="right" title="Tooltip on right">Tooltip on right</button>
</div>
</div><!-- /example -->
<td>placement</td>
<td>string | function</td>
<td>'top'</td>
- <td>how to position the tooltip - top | bottom | left | right | auto. <br> When "auto" is specified, it will dynamically reorient the tooltip. For example, if placment is "auto left", the tooltip will display to the left when possible, otherwise it will display right.</td>
+ <td>how to position the tooltip - top | bottom | left | right | auto. <br> When "auto" is specified, it will dynamically reorient the tooltip. For example, if placement is "auto left", the tooltip will display to the left when possible, otherwise it will display right.</td>
</tr>
<tr>
<td>selector</td>
<td>title</td>
<td>string | function</td>
<td>''</td>
- <td>default title value if <code>title</code> tag isn't present</td>
+ <td>default title value if <code>title</code> attribute isn't present</td>
</tr>
<tr>
<td>trigger</td>
</thead>
<tbody>
<tr>
- <td>show</td>
+ <td>show.bs.tooltip</td>
<td>This event fires immediately when the <code>show</code> instance method is called.</td>
</tr>
<tr>
- <td>shown</td>
+ <td>shown.bs.tooltip</td>
<td>This event is fired when the tooltip has been made visible to the user (will wait for CSS transitions to complete).</td>
</tr>
<tr>
- <td>hide</td>
+ <td>hide.bs.tooltip</td>
<td>This event is fired immediately when the <code>hide</code> instance method has been called.</td>
</tr>
<tr>
- <td>hidden</td>
+ <td>hidden.bs.tooltip</td>
<td>This event is fired when the tooltip has finished being hidden from the user (will wait for CSS transitions to complete).</td>
</tr>
</tbody>
</div><!-- /.bs-table-scrollable -->
{% highlight js %}
$('#myTooltip').on('hidden.bs.tooltip', function () {
-// do something…
+ // do something…
})
{% endhighlight %}
</div>
<h3>Live demo</h3>
<div class="bs-example" style="padding-bottom: 24px;">
- <a href="#" class="btn btn-large btn-danger" data-toggle="popover" title="A Title" data-content="And here's some amazing content. It's very engaging. right?">Click to toggle popover</a>
+ <a href="#" class="btn btn-lg btn-danger" data-toggle="popover" title="A Title" data-content="And here's some amazing content. It's very engaging. right?">Click to toggle popover</a>
</div>
<h4>Four directions</h4>
<div class="bs-example tooltip-demo">
<div class="bs-example-tooltips">
- <button type="button" class="btn btn-default" data-toggle="popover" data-placement="top" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
- Popover on top
+ <button type="button" class="btn btn-default" data-container="body" data-toggle="popover" data-placement="left" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
+ Popover on left
</button>
- <button type="button" class="btn btn-default" data-toggle="popover" data-placement="right" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
- Popover on right
+ <button type="button" class="btn btn-default" data-container="body" data-toggle="popover" data-placement="top" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
+ Popover on top
</button>
- <button type="button" class="btn btn-default" data-toggle="popover" data-placement="bottom" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
+ <button type="button" class="btn btn-default" data-container="body" data-toggle="popover" data-placement="bottom" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
Popover on bottom
</button>
- <button type="button" class="btn btn-default" data-toggle="popover" data-placement="left" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
- Popover on left
+ <button type="button" class="btn btn-default" data-container="body" data-toggle="popover" data-placement="right" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
+ Popover on right
</button>
</div>
</div><!-- /example -->
<td>placement</td>
<td>string | function</td>
<td>'right'</td>
- <td>how to position the popover - top | bottom | left | right | auto.<br> When "auto" is specified, it will dynamically reorient the popover. For example, if placment is "auto left", the tooltip will display to the left when possible, otherwise it will display right.</td>
+ <td>how to position the popover - top | bottom | left | right | auto.<br> When "auto" is specified, it will dynamically reorient the popover. For example, if placement is "auto left", the tooltip will display to the left when possible, otherwise it will display right.</td>
</tr>
<tr>
<td>selector</td>
</thead>
<tbody>
<tr>
- <td>show</td>
+ <td>show.bs.popover</td>
<td>This event fires immediately when the <code>show</code> instance method is called.</td>
</tr>
<tr>
- <td>shown</td>
+ <td>shown.bs.popover</td>
<td>This event is fired when the popover has been made visible to the user (will wait for CSS transitions to complete).</td>
</tr>
<tr>
- <td>hide</td>
+ <td>hide.bs.popover</td>
<td>This event is fired immediately when the <code>hide</code> instance method has been called.</td>
</tr>
<tr>
- <td>hidden</td>
+ <td>hidden.bs.popover</td>
<td>This event is fired when the popover has finished being hidden from the user (will wait for CSS transitions to complete).</td>
</tr>
</tbody>
<p>Add dismiss functionality to all alert messages with this plugin.</p>
<div class="bs-example">
<div class="alert fade in">
- <button type="button" class="close" data-dismiss="alert">×</button>
+ <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
<strong>Holy guacamole!</strong> Best check yo self, you're not looking too good.
</div>
</div><!-- /example -->
<div class="bs-example">
- <div class="alert alert-block alert-error fade in">
- <button type="button" class="close" data-dismiss="alert">×</button>
+ <div class="alert alert-block alert-danger fade in">
+ <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
<h4>Oh snap! You got an error!</h4>
<p>Change this and that and try again. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum.</p>
<p>
<h3>Markup</h3>
<p>Just add <code>data-dismiss="alert"</code> to your close button to automatically give an alert close functionality.</p>
- {% highlight html %}<a class="close" data-dismiss="alert" href="#">×</a>{% endhighlight %}
+ {% highlight html %}<a class="close" data-dismiss="alert" href="#" aria-hidden="true">×</a>{% endhighlight %}
<h3>Methods</h3>
</thead>
<tbody>
<tr>
- <td>close</td>
+ <td>close.bs.alert</td>
<td>This event fires immediately when the <code>close</code> instance method is called.</td>
</tr>
<tr>
- <td>closed</td>
+ <td>closed.bs.alert</td>
<td>This event is fired when the alert has been closed (will wait for CSS transitions to complete).</td>
</tr>
</tbody>
</button>
</div><!-- /example -->
{% highlight html %}
-<button type="button" id="fat-btn" data-loading-text="Loading..." class="btn btn-primary">
+<button type="button" data-loading-text="Loading..." class="btn btn-primary">
Loading state
</button>
{% endhighlight %}
</div>
<h2 id="collapse-examples">Example accordion</h2>
- <p>Using the collapse plugin, we built a simple accordion style widget:</p>
+ <p>Using the collapse plugin, we built a simple accordion by extending the panel component.</p>
<div class="bs-example">
- <div class="accordion" id="accordion2">
- <div class="accordion-group">
- <div class="accordion-heading">
- <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne">
- Collapsible Group Item #1
- </a>
+ <div class="panel-group" id="accordion">
+ <div class="panel">
+ <div class="panel-heading">
+ <h3 class="panel-title">
+ <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
+ Collapsible Group Item #1
+ </a>
+ </h3>
</div>
- <div id="collapseOne" class="accordion-body collapse in">
- <div class="accordion-inner">
+ <div id="collapseOne" class="panel-collapse collapse in">
+ <div class="panel-body">
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
</div>
</div>
</div>
- <div class="accordion-group">
- <div class="accordion-heading">
- <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo">
- Collapsible Group Item #2
- </a>
+ <div class="panel">
+ <div class="panel-heading">
+ <h3 class="panel-title">
+ <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo">
+ Collapsible Group Item #2
+ </a>
+ </h3>
</div>
- <div id="collapseTwo" class="accordion-body collapse">
- <div class="accordion-inner">
+ <div id="collapseTwo" class="panel-collapse collapse">
+ <div class="panel-body">
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
</div>
</div>
</div>
- <div class="accordion-group">
- <div class="accordion-heading">
- <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseThree">
- Collapsible Group Item #3
- </a>
+ <div class="panel">
+ <div class="panel-heading">
+ <h3 class="panel-title">
+ <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapseThree">
+ Collapsible Group Item #3
+ </a>
+ </h3>
</div>
- <div id="collapseThree" class="accordion-body collapse">
- <div class="accordion-inner">
+ <div id="collapseThree" class="panel-collapse collapse">
+ <div class="panel-body">
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
</div>
</div>
</div>
</div><!-- /example -->
{% highlight html %}
-<div class="accordion" id="accordion2">
- <div class="accordion-group">
- <div class="accordion-heading">
- <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne">
- Collapsible Group Item #1
- </a>
+<div class="panel-group" id="accordion">
+ <div class="panel">
+ <div class="panel-heading">
+ <h3 class="panel-title">
+ <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
+ Collapsible Group Item #1
+ </a>
+ </h3>
</div>
- <div id="collapseOne" class="accordion-body collapse in">
- <div class="accordion-inner">
- ...
+ <div id="collapseOne" class="panel-collapse collapse in">
+ <div class="panel-body">
+ Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
</div>
</div>
</div>
- <div class="accordion-group">
- <div class="accordion-heading">
- <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo">
- Collapsible Group Item #2
- </a>
+ <div class="panel">
+ <div class="panel-heading">
+ <h3 class="panel-title">
+ <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo">
+ Collapsible Group Item #2
+ </a>
+ </h3>
</div>
- <div id="collapseTwo" class="accordion-body collapse">
- <div class="accordion-inner">
- ...
+ <div id="collapseTwo" class="panel-collapse collapse">
+ <div class="panel-body">
+ Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
</div>
</div>
</div>
- <div class="accordion-group">
- <div class="accordion-heading">
- <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseThree">
- Collapsible Group Item #3
- </a>
+ <div class="panel">
+ <div class="panel-heading">
+ <h3 class="panel-title">
+ <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapseThree">
+ Collapsible Group Item #3
+ </a>
+ </h3>
</div>
- <div id="collapseThree" class="accordion-body collapse">
- <div class="accordion-inner">
- ...
+ <div id="collapseThree" class="panel-collapse collapse">
+ <div class="panel-body">
+ Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
</div>
</div>
</div>
<td>parent</td>
<td>selector</td>
<td>false</td>
- <td>If selector then all collapsible elements under the specified parent will be closed when this collapsible item is shown. (similar to traditional accordion behavior)</td>
+ <td>If selector then all collapsible elements under the specified parent will be closed when this collapsible item is shown. (similar to traditional accordion behavior - this dependent on the <code>accordion-group</code> class)</td>
</tr>
<tr>
<td>toggle</td>
</thead>
<tbody>
<tr>
- <td>show</td>
+ <td>show.bs.collapse</td>
<td>This event fires immediately when the <code>show</code> instance method is called.</td>
</tr>
<tr>
- <td>shown</td>
+ <td>shown.bs.collapse</td>
<td>This event is fired when a collapse element has been made visible to the user (will wait for CSS transitions to complete).</td>
</tr>
<tr>
- <td>hide</td>
+ <td>hide.bs.collapse</td>
<td>
This event is fired immediately when the <code>hide</code> method has been called.
</td>
</tr>
<tr>
- <td>hidden</td>
+ <td>hidden.bs.collapse</td>
<td>This event is fired when a collapse element has been hidden from the user (will wait for CSS transitions to complete).</td>
</tr>
</tbody>
</ol>
<div class="carousel-inner">
<div class="item active">
- <img data-src="holder.js/900x500/auto/#777:#555/text:First slide" alt="">
+ <img src="data:image/png;base64," data-src="holder.js/900x500/auto/#777:#555/text:First slide" alt="First slide">
</div>
<div class="item">
- <img data-src="holder.js/900x500/auto/#666:#444/text:Second slide" alt="">
+ <img src="data:image/png;base64," data-src="holder.js/900x500/auto/#666:#444/text:Second slide" alt="Second slide">
</div>
<div class="item">
- <img data-src="holder.js/900x500/auto/#555:#333/text:Third slide" alt="">
+ <img src="data:image/png;base64," data-src="holder.js/900x500/auto/#555:#333/text:Third slide" alt="Third slide">
</div>
</div>
<a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
<!-- Wrapper for slides -->
<div class="carousel-inner">
<div class="item active">
- <img src="..." alt="">
+ <img src="..." alt="...">
<div class="carousel-caption">
...
</div>
</ol>
<div class="carousel-inner">
<div class="item active">
- <img data-src="holder.js/900x500/auto/#777:#777" alt="">
+ <img data-src="holder.js/900x500/auto/#777:#777" src="data:image/png;base64," alt="First slide image">
<div class="carousel-caption">
<h3>First slide label</h3>
<p>Nulla vitae elit libero, a pharetra augue mollis interdum.</p>
</div>
</div>
<div class="item">
- <img data-src="holder.js/900x500/auto/#666:#666" alt="">
+ <img data-src="holder.js/900x500/auto/#666:#666" src="data:image/png;base64," alt="Second slide image">
<div class="carousel-caption">
<h3>Second slide label</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</div>
</div>
<div class="item">
- <img data-src="holder.js/900x500/auto/#555:#5555" alt="">
+ <img data-src="holder.js/900x500/auto/#555:#5555" src="data:image/png;base64," alt="Third slide image">
<div class="carousel-caption">
<h3>Third slide label</h3>
<p>Praesent commodo cursus magna, vel scelerisque nisl consectetur.</p>
</div><!-- /example -->
{% highlight html %}
<div class="item active">
- <img src="..." alt="">
+ <img src="..." alt="...">
<div class="carousel-caption">
<h3>...</h3>
<p>...</p>
</div>
{% endhighlight %}
+<div class="bs-callout bs-callout-danger">
+ <h4>Accessibility issue</h4>
+ <p>The carousel component is generally not compliant with accessibility standards. If you need to be compliant, please consider other options for presenting your content.</p>
+</div>
<h2 id="carousel-usage">Usage</h2>
<td>"hover"</td>
<td>Pauses the cycling of the carousel on mouseenter and resumes the cycling of the carousel on mouseleave.</td>
</tr>
+ <tr>
+ <td>wrap</td>
+ <td>boolean</td>
+ <td>true</td>
+ <td>Whether the carousel should cycle continuously or have hard stops.</td>
+ </tr>
</tbody>
</table>
</div><!-- /.bs-table-scrollable -->
<h4>.carousel(options)</h4>
<p>Initializes the carousel with an optional options <code>object</code> and starts cycling through items.</p>
-{% highlight html %}
+{% highlight js %}
$('.carousel').carousel({
interval: 2000
})
</thead>
<tbody>
<tr>
- <td>slide</td>
+ <td>slide.bs.carousel</td>
<td>This event fires immediately when the <code>slide</code> instance method is invoked.</td>
</tr>
<tr>
- <td>slid</td>
+ <td>slid.bs.carousel</td>
<td>This event is fired when the carousel has completed its slide transition.</td>
</tr>
</tbody>
<h4>Requires independent styling ;)</h4>
<p>
Affix toggles between three states/classes: <code>affix</code>, <code>affix-top</code>, and <code>affix-bottom</code>. You must provide the styles for these classes yourself (independent of this plugin).
- The <code>affix-top</code> class should be in the regular flow of the document. The <code>affix</code> class should be fixed to the page. And <code>affix-bottom</code> should be positioned absolute. Note, <code>affix-bottom</code> is special in that the plugin will place the element with js relative to the <code>offset: { bottom: number }</code> option you've provided.
+ The <code>affix-top</code> class should be in the regular flow of the document. The <code>affix</code> class should be fixed to the page. And <code>affix-bottom</code> should be positioned absolute. Note, <code>affix-bottom</code> is special in that the plugin will place the element with JS relative to the <code>offset: { bottom: number }</code> option you've provided.
</p>
</div>
"laxcomma" : true,
"laxbreak" : true,
"browser" : true,
+ "eqeqeq" : false,
"eqnull" : true,
"debug" : true,
"devel" : true,
+ "curly" : false,
"boss" : true,
"expr" : true,
"asi" : true
var $parent = this.$element.closest('[data-toggle="buttons"]')
if ($parent.length) {
- var $input = this.$element.find('input').prop('checked', !this.$element.hasClass('active'))
+ var $input = this.$element.find('input')
+ .prop('checked', !this.$element.hasClass('active'))
+ .trigger('change')
if ($input.prop('type') === 'radio') $parent.find('.active').removeClass('active')
}
$.fn.button = function (option) {
return this.each(function () {
var $this = $(this)
- var data = $this.data('button')
+ var data = $this.data('bs.button')
var options = typeof option == 'object' && option
if (!data) $this.data('bs.button', (data = new Button(this, options)))
Carousel.DEFAULTS = {
interval: 5000
, pause: 'hover'
+ , wrap: true
}
Carousel.prototype.cycle = function (e) {
var fallback = type == 'next' ? 'first' : 'last'
var that = this
+ if (!$next.length) {
+ if (!this.options.wrap) return
+ $next = this.$element.find('.item')[fallback]()
+ }
+
this.sliding = true
isCycling && this.pause()
- $next = $next.length ? $next : this.$element.find('.item')[fallback]()
-
var e = $.Event('slide.bs.carousel', { relatedTarget: $next[0], direction: direction })
if ($next.hasClass('active')) return
this.$element.trigger(startEvent)
if (startEvent.isDefaultPrevented()) return
- var actives = this.$parent && this.$parent.find('> .accordion-group > .in')
+ var actives = this.$parent && this.$parent.find('> .panel > .in')
if (actives && actives.length) {
var hasData = actives.data('bs.collapse')
var $parent = parent && $(parent)
if (!data || !data.transitioning) {
- if ($parent) $parent.find('[data-toggle=collapse][data-parent=' + parent + ']').not($this).addClass('collapsed')
+ if ($parent) $parent.find('[data-toggle=collapse][data-parent="' + parent + '"]').not($this).addClass('collapsed')
$this[$target.hasClass('in') ? 'addClass' : 'removeClass']('collapsed')
}
this.$backdrop =
this.isShown = null
- if (this.options.remote) this.$element.find('.modal-body').load(this.options.remote)
+ if (this.options.remote) this.$element.load(this.options.remote)
}
Modal.DEFAULTS = {
, show: true
}
- Modal.prototype.toggle = function () {
- return this[!this.isShown ? 'show' : 'hide']()
+ Modal.prototype.toggle = function (_relatedTarget) {
+ return this[!this.isShown ? 'show' : 'hide'](_relatedTarget)
}
- Modal.prototype.show = function () {
+ Modal.prototype.show = function (_relatedTarget) {
var that = this
- var e = $.Event('show.bs.modal')
+ var e = $.Event('show.bs.modal', { relatedTarget: _relatedTarget })
this.$element.trigger(e)
that.enforceFocus()
+ var e = $.Event('shown.bs.modal', { relatedTarget: _relatedTarget })
+
transition ?
that.$element
.one($.support.transition.end, function () {
- that.$element.focus().trigger('shown.bs.modal')
+ that.$element.focus().trigger(e)
})
.emulateTransitionEnd(300) :
- that.$element.focus().trigger('shown.bs.modal')
+ that.$element.focus().trigger(e)
})
}
this.$element
.removeClass('in')
.attr('aria-hidden', true)
+ .off('click.dismiss.modal')
$.support.transition && this.$element.hasClass('fade') ?
this.$element
this.$backdrop = $('<div class="modal-backdrop ' + animate + '" />')
.appendTo(document.body)
- this.$element.on('click', $.proxy(function (e) {
+ this.$element.on('click.dismiss.modal', $.proxy(function (e) {
if (e.target !== e.currentTarget) return
this.options.backdrop == 'static'
? this.$element[0].focus.call(this.$element[0])
var old = $.fn.modal
- $.fn.modal = function (option) {
+ $.fn.modal = function (option, _relatedTarget) {
return this.each(function () {
var $this = $(this)
var data = $this.data('bs.modal')
var options = $.extend({}, Modal.DEFAULTS, $this.data(), typeof option == 'object' && option)
if (!data) $this.data('bs.modal', (data = new Modal(this, options)))
- if (typeof option == 'string') data[option]()
- else if (options.show) data.show()
+ if (typeof option == 'string') data[option](_relatedTarget)
+ else if (options.show) data.show(_relatedTarget)
})
}
var $this = $(this)
var href = $this.attr('href')
var $target = $($this.attr('data-target') || (href && href.replace(/.*(?=#[^\s]+$)/, ''))) //strip for ie7
- var option = $target.data('modal') ? 'toggle' : $.extend({ remote:!/#/.test(href) && href }, $target.data(), $this.data())
+ var option = $target.data('modal') ? 'toggle' : $.extend({ remote: !/#/.test(href) && href }, $target.data(), $this.data())
e.preventDefault()
$target
- .modal(option)
+ .modal(option, this)
.one('hide', function () {
$this.is(':visible') && $this.focus()
})
})
- var $body = $(document.body)
- .on('shown.bs.modal', '.modal', function () { $body.addClass('modal-open') })
- .on('hidden.bs.modal', '.modal', function () { $body.removeClass('modal-open') })
+ $(document)
+ .on('shown.bs.modal', '.modal', function () { $(document.body).addClass('modal-open') })
+ .on('hidden.bs.modal', '.modal', function () { $(document.body).removeClass('modal-open') })
}(window.jQuery);
$tip.removeClass('fade top bottom left right in')
- $tip.find('.popover-title:empty').hide()
+ // IE8 doesn't accept hiding via the `:empty` pseudo selector, we have to do
+ // this manually by checking the contents.
+ if (!$tip.find('.popover-title').html()) $tip.find('.popover-title').hide()
}
Popover.prototype.hasContent = function () {
o.content)
}
+ Popover.prototype.arrow = function () {
+ return this.$arrow = this.$arrow || this.tip().find('.arrow')
+ }
+
Popover.prototype.tip = function () {
if (!this.$tip) this.$tip = $(this.options.template)
return this.$tip
}
- Popover.prototype.destroy = function () {
- this.hide().$element.off('.' + this.type).removeData(this.type)
- }
-
// POPOVER PLUGIN DEFINITION
// =========================
target3.click()
})
+ test("should allow dots in data-parent", function () {
+ $.support.transition = false
+ stop()
+
+ var accordion = $('<div class="accordion"><div class="accordion-group"></div><div class="accordion-group"></div><div class="accordion-group"></div></div>')
+ .appendTo($('#qunit-fixture'))
+
+ var target1 = $('<a data-toggle="collapse" href="#body1" data-parent=".accordion"></a>')
+ .appendTo(accordion.find('.accordion-group').eq(0))
+
+ var collapsible1 = $('<div id="body1" class="in"></div>')
+ .appendTo(accordion.find('.accordion-group').eq(0))
+
+ var target2 = $('<a class="collapsed" data-toggle="collapse" href="#body2" data-parent=".accordion"></a>')
+ .appendTo(accordion.find('.accordion-group').eq(1))
+
+ var collapsible2 = $('<div id="body2"></div>')
+ .appendTo(accordion.find('.accordion-group').eq(1))
+
+ var target3 = $('<a class="collapsed" data-toggle="collapse" href="#body3" data-parent=".accordion"></a>')
+ .appendTo(accordion.find('.accordion-group').eq(2))
+
+ var collapsible3 = $('<div id="body3"></div>')
+ .appendTo(accordion.find('.accordion-group').eq(2))
+ .on('show.bs.collapse', function () {
+ ok(target1.hasClass('collapsed'))
+ ok(target2.hasClass('collapsed'))
+ ok(!target3.hasClass('collapsed'))
+
+ start()
+ })
+
+ target3.click()
+ })
+
})
.appendTo('#qunit-fixture')
.find('[data-toggle="dropdown"]')
.dropdown()
-
+
stop()
-
+
dropdown
.parent('.dropdown')
.bind('show.bs.dropdown', function () {
ok(true, 'hide was called')
start()
})
-
+
dropdown.click()
$(document.body).click()
})
.appendTo('#qunit-fixture')
.find('[data-toggle="dropdown"]')
.dropdown()
-
+
stop()
-
+
dropdown
.parent('.dropdown')
.bind('shown.bs.dropdown', function () {
ok(true, 'hide was called')
start()
})
-
+
dropdown.click()
$(document.body).click()
})
$(function () {
- module("modal")
+ module("modal")
- test("should provide no conflict", function () {
- var modal = $.fn.modal.noConflict()
- ok(!$.fn.modal, 'modal was set back to undefined (org value)')
- $.fn.modal = modal
- })
+ test("should provide no conflict", function () {
+ var modal = $.fn.modal.noConflict()
+ ok(!$.fn.modal, 'modal was set back to undefined (org value)')
+ $.fn.modal = modal
+ })
- test("should be defined on jquery object", function () {
-
var div = $("<div id='modal-test'></div>")
- ok(div.modal, 'modal method is defined')
- })
+ test("should be defined on jquery object", function () {
+ var div = $("<div id='modal-test'></div>")
+ ok(div.modal, 'modal method is defined')
+ })
- test("should return element", function () {
-
var div = $("<div id='modal-test'></div>")
- ok(div.modal() == div, 'document.body returned')
- $('#modal-test').remove()
- })
+ test("should return element", function () {
+ var div = $("<div id='modal-test'></div>")
+ ok(div.modal() == div, 'document.body returned')
+ $('#modal-test').remove()
+ })
- test("should expose defaults var for settings", function () {
- ok($.fn.modal.Constructor.DEFAULTS, 'default object exposed')
- })
+ test("should expose defaults var for settings", function () {
+ ok($.fn.modal.Constructor.DEFAULTS, 'default object exposed')
+ })
- test("should insert into dom when show method is called", function () {
- stop()
- $.support.transition = false
-
$("<div id='modal-test'></div>")
- .on("shown.bs.modal", function () {
- ok($('#modal-test').length, 'modal inserted into dom')
- $(this).remove()
- start()
- })
- .modal("show")
- })
+ test("should insert into dom when show method is called", function () {
+ stop()
+ $.support.transition = false
+ $("<div id='modal-test'></div>")
+ .on("shown.bs.modal", function () {
+ ok($('#modal-test').length, 'modal inserted into dom')
+ $(this).remove()
+ start()
+ })
+ .modal("show")
+ })
- test("should fire show event", function () {
- stop()
- $.support.transition = false
-
$("<div id='modal-test'></div>")
- .on("show.bs.modal", function () {
- ok(true, "show was called")
- })
- .on("shown.bs.modal", function () {
- $(this).remove()
- start()
- })
- .modal("show")
- })
+ test("should fire show event", function () {
+ stop()
+ $.support.transition = false
+ $("<div id='modal-test'></div>")
+ .on("show.bs.modal", function () {
+ ok(true, "show was called")
+ })
+ .on("shown.bs.modal", function () {
+ $(this).remove()
+ start()
+ })
+ .modal("show")
+ })
- test("should not fire shown when default prevented", function () {
- stop()
- $.support.transition = false
-
$("<div id='modal-test'></div>")
- .on("show.bs.modal", function (e) {
- e.preventDefault()
- ok(true, "show was called")
- start()
- })
- .on("shown.bs.modal", function () {
- ok(false, "shown was called")
- })
- .modal("show")
- })
+ test("should not fire shown when default prevented", function () {
+ stop()
+ $.support.transition = false
+ $("<div id='modal-test'></div>")
+ .on("show.bs.modal", function (e) {
+ e.preventDefault()
+ ok(true, "show was called")
+ start()
+ })
+ .on("shown.bs.modal", function () {
+ ok(false, "shown was called")
+ })
+ .modal("show")
+ })
- test("should hide modal when hide is called", function () {
- stop()
- $.support.transition = false
+ test("should hide modal when hide is called", function () {
+ stop()
+ $.support.transition = false
-
$("<div id='modal-test'></div>")
- .on("shown.bs.modal", function () {
- ok($('#modal-test').is(":visible"), 'modal visible')
- ok($('#modal-test').length, 'modal inserted into dom')
- $(this).modal("hide")
- })
- .on("hidden.bs.modal", function() {
- ok(!$('#modal-test').is(":visible"), 'modal hidden')
- $('#modal-test').remove()
- start()
- })
- .modal("show")
- })
+ $("<div id='modal-test'></div>")
+ .on("shown.bs.modal", function () {
+ ok($('#modal-test').is(":visible"), 'modal visible')
+ ok($('#modal-test').length, 'modal inserted into dom')
+ $(this).modal("hide")
+ })
+ .on("hidden.bs.modal", function() {
+ ok(!$('#modal-test').is(":visible"), 'modal hidden')
+ $('#modal-test').remove()
+ start()
+ })
+ .modal("show")
+ })
- test("should toggle when toggle is called", function () {
- stop()
- $.support.transition = false
-
var div = $("<div id='modal-test'></div>")
- div
- .on("shown.bs.modal", function () {
- ok($('#modal-test').is(":visible"), 'modal visible')
- ok($('#modal-test').length, 'modal inserted into dom')
- div.modal("toggle")
- })
- .on("hidden.bs.modal", function() {
- ok(!$('#modal-test').is(":visible"), 'modal hidden')
- div.remove()
- start()
- })
- .modal("toggle")
- })
+ test("should toggle when toggle is called", function () {
+ stop()
+ $.support.transition = false
+ var div = $("<div id='modal-test'></div>")
+ div
+ .on("shown.bs.modal", function () {
+ ok($('#modal-test').is(":visible"), 'modal visible')
+ ok($('#modal-test').length, 'modal inserted into dom')
+ div.modal("toggle")
+ })
+ .on("hidden.bs.modal", function() {
+ ok(!$('#modal-test').is(":visible"), 'modal hidden')
+ div.remove()
+ start()
+ })
+ .modal("toggle")
+ })
- test("should remove from dom when click [data-dismiss=modal]", function () {
- stop()
- $.support.transition = false
-
var div = $("<div id='modal-test'><span class='close' data-dismiss='modal'></span></div>")
- div
- .on("shown.bs.modal", function () {
- ok($('#modal-test').is(":visible"), 'modal visible')
- ok($('#modal-test').length, 'modal inserted into dom')
- div.find('.close').click()
- })
- .on("hidden.bs.modal", function() {
- ok(!$('#modal-test').is(":visible"), 'modal hidden')
- div.remove()
- start()
- })
- .modal("toggle")
- })
+ test("should remove from dom when click [data-dismiss=modal]", function () {
+ stop()
+ $.support.transition = false
+ var div = $("<div id='modal-test'><span class='close' data-dismiss='modal'></span></div>")
+ div
+ .on("shown.bs.modal", function () {
+ ok($('#modal-test').is(":visible"), 'modal visible')
+ ok($('#modal-test').length, 'modal inserted into dom')
+ div.find('.close').click()
+ })
+ .on("hidden.bs.modal", function() {
+ ok(!$('#modal-test').is(":visible"), 'modal hidden')
+ div.remove()
+ start()
+ })
+ .modal("toggle")
+ })
- test("should allow modal close with 'backdrop:false'", function () {
- stop()
- $.support.transition = false
-
var div = $("<div>", { id: 'modal-test', "data-backdrop": false })
- div
- .on("shown.bs.modal", function () {
- ok($('#modal-test').is(":visible"), 'modal visible')
- div.modal("hide")
- })
- .on("hidden.bs.modal", function() {
- ok(!$('#modal-test').is(":visible"), 'modal hidden')
- div.remove()
- start()
- })
- .modal("show")
- })
+ test("should allow modal close with 'backdrop:false'", function () {
+ stop()
+ $.support.transition = false
+ var div = $("<div>", { id: 'modal-test', "data-backdrop": false })
+ div
+ .on("shown.bs.modal", function () {
+ ok($('#modal-test').is(":visible"), 'modal visible')
+ div.modal("hide")
+ })
+ .on("hidden.bs.modal", function() {
+ ok(!$('#modal-test').is(":visible"), 'modal hidden')
+ div.remove()
+ start()
+ })
+ .modal("show")
+ })
- test("should close modal when clicking outside of modal-content", function () {
- stop()
- $.support.transition = false
- var div = $("<div id='modal-test'><div class='contents'></div></div>")
- div
- .bind("shown.bs.modal", function () {
- ok($('#modal-test').length, 'modal insterted into dom')
- $('.contents').click()
- ok($('#modal-test').is(":visible"), 'modal visible')
- $('#modal-test').click()
- })
- .bind("hidden.bs.modal", function() {
- ok(!$('#modal-test').is(":visible"), 'modal hidden')
- div.remove()
- start()
- })
- .modal("show")
- })
+ test("should close modal when clicking outside of modal-content", function () {
+ stop()
+ $.support.transition = false
+ var div = $("<div id='modal-test'><div class='contents'></div></div>")
+ div
+ .bind("shown.bs.modal", function () {
+ ok($('#modal-test').length, 'modal insterted into dom')
+ $('.contents').click()
+ ok($('#modal-test').is(":visible"), 'modal visible')
+ $('#modal-test').click()
+ })
+ .bind("hidden.bs.modal", function() {
+ ok(!$('#modal-test').is(":visible"), 'modal hidden')
+ div.remove()
+ start()
+ })
+ .modal("show")
+ })
+
+ test("should trigger hide event once when clicking outside of modal-content", function () {
+ stop()
+ $.support.transition = false
+ var div = $("<div id='modal-test'><div class='contents'></div></div>")
+ var triggered
+ div
+ .bind("shown.bs.modal", function () {
+ triggered = 0
+ $('#modal-test').click()
+ })
+ .one("hidden.bs.modal", function() {
+ div.modal("show")
+ })
+ .bind("hide.bs.modal", function () {
+ triggered += 1
+ ok(triggered === 1, 'modal hide triggered once')
+ start()
+ })
+ .modal("show")
+ })
})
/* ========================================================================
* Bootstrap: tooltip.js v3.0.0
- * http://twbs.github.com/bootstrap/javascript.html#affix
+ * http://twbs.github.com/bootstrap/javascript.html#tooltip
* Inspired by the original jQuery.tipsy by Jason Frame
* ========================================================================
* Copyright 2012 Twitter, Inc.
var eventIn = trigger == 'hover' ? 'mouseenter' : 'focus'
var eventOut = trigger == 'hover' ? 'mouseleave' : 'blur'
- this.$element.on(eventIn + '.' + this.type, this.options.selector, $.proxy(this.enter, this))
+ this.$element.on(eventIn + '.' + this.type, this.options.selector, $.proxy(this.enter, this))
this.$element.on(eventOut + '.' + this.type, this.options.selector, $.proxy(this.leave, this))
}
}
return options
}
- Tooltip.prototype.enter = function (obj) {
- var defaults = this.getDefaults()
+ Tooltip.prototype.getDelegateOptions = function () {
var options = {}
+ var defaults = this.getDefaults()
this._options && $.each(this._options, function (key, value) {
if (defaults[key] != value) options[key] = value
})
+ return options
+ }
+
+ Tooltip.prototype.enter = function (obj) {
var self = obj instanceof this.constructor ?
- obj : $(obj.currentTarget)[this.type](options).data('bs.' + this.type)
+ obj : $(obj.currentTarget)[this.type](this.getDelegateOptions()).data('bs.' + this.type)
clearTimeout(self.timeout)
Tooltip.prototype.leave = function (obj) {
var self = obj instanceof this.constructor ?
- obj : $(obj.currentTarget)[this.type](this._options).data('bs.' + this.type)
+ obj : $(obj.currentTarget)[this.type](this.getDelegateOptions()).data('bs.' + this.type)
clearTimeout(self.timeout)
.addClass(placement)
}
- var tp = placement == 'bottom' ? { top: pos.top + pos.height, left: pos.left + pos.width / 2 - actualWidth / 2 } :
- placement == 'top' ? { top: pos.top - actualHeight, left: pos.left + pos.width / 2 - actualWidth / 2 } :
- placement == 'left' ? { top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth } :
- /* placement == 'right' */ { top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width }
+ var calculatedOffset = this.getCalculatedOffset(placement, pos, actualWidth, actualHeight)
- this.applyPlacement(tp, placement)
+ this.applyPlacement(calculatedOffset, placement)
this.$element.trigger('shown.bs.' + this.type)
}
}
var height = $tip[0].offsetHeight
// manually read margins because getBoundingClientRect includes difference
- offset.top = offset.top + parseInt($tip.css('margin-top'), 10)
- offset.left = offset.left + parseInt($tip.css('margin-left'), 10)
+ var marginTop = parseInt($tip.css('margin-top'), 10)
+ var marginLeft = parseInt($tip.css('margin-left'), 10)
+
+ // we must check for NaN for ie 8/9
+ if (isNaN(marginTop)) marginTop = 0
+ if (isNaN(marginLeft)) marginLeft = 0
+
+ offset.top = offset.top + marginTop
+ offset.left = offset.left + marginLeft
$tip
.offset(offset)
.addClass('in')
+ // check to see if placing tip in new offset caused the tip to resize itself
var actualWidth = $tip[0].offsetWidth
var actualHeight = $tip[0].offsetHeight
if (placement == 'top' && actualHeight != height) {
replace = true
- offset.top = offset.top + height - actualHeight
+ offset.top = offset.top + height - actualHeight
}
- if (placement == 'bottom' || placement == 'top') {
+ if (/bottom|top/.test(placement)) {
var delta = 0
- if (offset.left < 0){
+ if (offset.left < 0) {
delta = offset.left * -2
offset.left = 0
var $tip = this.tip()
var e = $.Event('hide.bs.' + this.type)
+ function complete() { $tip.detach() }
+
this.$element.trigger(e)
if (e.isDefaultPrevented()) return
$.support.transition && this.$tip.hasClass('fade') ?
$tip
- .one($.support.transition.end, $tip.detach)
+ .one($.support.transition.end, complete)
.emulateTransitionEnd(150) :
- $tip.detach()
+ complete()
this.$element.trigger('hidden.bs.' + this.type)
}, this.$element.offset())
}
+ Tooltip.prototype.getCalculatedOffset = function (placement, pos, actualWidth, actualHeight) {
+ return placement == 'bottom' ? { top: pos.top + pos.height, left: pos.left + pos.width / 2 - actualWidth / 2 } :
+ placement == 'top' ? { top: pos.top - actualHeight, left: pos.left + pos.width / 2 - actualWidth / 2 } :
+ placement == 'left' ? { top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth } :
+ /* placement == 'right' */ { top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width }
+ }
+
Tooltip.prototype.getTitle = function () {
var title
var $e = this.$element
return this.$tip = this.$tip || $(this.options.template)
}
- Tooltip.prototype.arrow =function(){
- return this.$arrow = this.$arrow || this.tip().find(".tooltip-arrow")
+ Tooltip.prototype.arrow = function () {
+ return this.$arrow = this.$arrow || this.tip().find('.tooltip-arrow')
}
Tooltip.prototype.validate = function () {
}
Tooltip.prototype.toggle = function (e) {
- var self = e ? $(e.currentTarget)[this.type](this._options).data('bs.' + this.type) : this
+ var self = e ? $(e.currentTarget)[this.type](this.getDelegateOptions()).data('bs.' + this.type) : this
self.tip().hasClass('in') ? self.leave(self) : self.enter(self)
}
// http://blog.alexmaccaw.com/css-transitions
$.fn.emulateTransitionEnd = function (duration) {
var called = false, $el = this
- $(this).one('webkitTransitionEnd', function () { called = true })
- var callback = function () { if (!called) $($el).trigger('webkitTransitionEnd') }
+ $(this).one($.support.transition.end, function () { called = true })
+ var callback = function () { if (!called) $($el).trigger($.support.transition.end) }
setTimeout(callback, duration)
return this
}
+++ /dev/null
-//
-// Accordion
-// --------------------------------------------------
-
-
-// Parent container
-.accordion {
- margin-bottom: @line-height-computed;
-}
-
-// Group == heading + body
-.accordion-group {
- margin-bottom: 2px;
- border: 1px solid @accordion-border-color;
- border-radius: @border-radius-base;
-}
-.accordion-heading {
- border-bottom: 0;
-
- .accordion-toggle {
- display: block;
- padding: 8px 15px;
- cursor: pointer;
- }
-}
-
-// Inner needs the styles because you can't animate properly with any styles on the element
-.accordion-inner {
- padding: 9px 15px;
- border-top: 1px solid @accordion-border-color;
-}
// -------------------------
.alert {
- padding: 10px 35px 10px 15px;
+ padding: @alert-padding;
margin-bottom: @line-height-computed;
color: @alert-text;
background-color: @alert-bg;
}
// Provide class for links that match alerts
.alert-link {
- font-weight: 500;
+ font-weight: @alert-link-font-weight;
color: darken(@alert-text, 10%);
}
+ // Improve alignment and spacing of inner content
+ > p,
+ > ul {
+ margin-bottom: 0;
+ }
+ > p + p {
+ margin-top: 5px;
+ }
+}
+
+// Dismissable alerts
+//
+// Expand the right padding and account for the close button's positioning.
+
+.alert-dismissable {
+ padding-right: (@alert-padding + 20);
+
// Adjust close link position
.close {
position: relative;
}
// Alternate styles
-// -------------------------
+//
+// Generate contextual modifier classes for colorizing the alert.
.alert-success {
- .alert-variant(@alert-success-bg, @alert-success-border, @alert-success-text);
+ .alert-variant(@alert-success-bg; @alert-success-border; @alert-success-text);
}
.alert-danger {
- .alert-variant(@alert-danger-bg, @alert-danger-border, @alert-danger-text);
+ .alert-variant(@alert-danger-bg; @alert-danger-border; @alert-danger-text);
}
.alert-info {
- .alert-variant(@alert-info-bg, @alert-info-border, @alert-info-text);
-}
-
-// Block alerts
-// -------------------------
-
-.alert-block {
- padding-top: 15px;
- padding-bottom: 15px;
-
- > p,
- > ul {
- margin-bottom: 0;
- }
- p + p {
- margin-top: 5px;
- }
+ .alert-variant(@alert-info-bg; @alert-info-border; @alert-info-text);
}
min-width: 10px;
padding: 3px 7px;
font-size: @font-size-small;
- font-weight: bold;
+ font-weight: @badge-font-weight;
color: @badge-color;
- line-height: 1;
- vertical-align: middle;
+ line-height: @badge-line-height;
+ vertical-align: baseline;
white-space: nowrap;
text-align: center;
background-color: @badge-bg;
- border-radius: 10px;
+ border-radius: @badge-border-radius;
- // Empty labels/badges collapse
+ // Empty badges collapse automatically (not available in IE8)
&:empty {
display: none;
}
// Components: common
@import "component-animations.less";
+@import "input-groups.less";
@import "dropdowns.less";
@import "list-group.less";
@import "panels.less";
@import "labels.less";
@import "badges.less";
@import "progress-bars.less";
-@import "accordion.less";
@import "carousel.less";
@import "jumbotron.less";
// --------------------------------------------------
// Button carets
-.btn .caret {
- border-top-color: @btn-default-color;
+//
+// Match the button text color to the arrow/caret for indicating dropdown-ness.
+
+.caret {
+ .btn-default & {
+ border-top-color: @btn-default-color;
+ }
+ .btn-primary &,
+ .btn-success &,
+ .btn-warning &,
+ .btn-danger &,
+ .btn-info & {
+ border-top-color: #fff;
+ }
}
-.dropup .btn .caret {
- border-bottom-color: @btn-default-color;
+.dropup {
+ & .btn-default .caret {
+ border-bottom-color: @btn-default-color;
+ }
+ & .btn-primary,
+ & .btn-success,
+ & .btn-warning,
+ & .btn-danger,
+ & .btn-info {
+ .caret {
+ border-bottom-color: #fff;
+ }
+ }
}
// Make the div behave like a button
float: left;
// Bring the "active" button to the front
&:hover,
- &:active {
+ &:focus,
+ &:active,
+ &.active {
z-index: 2;
}
+ &:focus {
+ // Remove focus outline when dropdown JS adds it after closing the menu
+ outline: none;
+ }
}
}
// Prevent double borders when buttons are next to each other
-.btn-group .btn + .btn {
- margin-left: -1px;
+.btn-group {
+ .btn + .btn,
+ .btn + .btn-group,
+ .btn-group + .btn,
+ .btn-group + .btn-group {
+ margin-left: -1px;
+ }
}
// Optional: Group multiple button groups together for a toolbar
}
+// Sizing
+//
+// Remix the default button sizing classes into new ones for easier manipulation.
+
+.btn-group-xs > .btn { .btn-xs(); }
+.btn-group-sm > .btn { .btn-sm(); }
+.btn-group-lg > .btn { .btn-lg(); }
+
// Split button dropdowns
// ----------------------
padding-left: 8px;
padding-right: 8px;
}
-.btn-group > .btn-large + .dropdown-toggle {
+.btn-group > .btn-lg + .dropdown-toggle {
padding-left: 12px;
padding-right: 12px;
}
margin-left: 0;
}
// Carets in other button sizes
-.btn-large .caret {
- border-width: 5px;
+.btn-lg .caret {
+ border-width: @caret-width-large;
}
// Upside down carets for .dropup
-.dropup .btn-large .caret {
- border-bottom-width: 5px;
+.dropup .btn-lg .caret {
+ border-bottom-width: @caret-width-large;
}
// Vertical button groups
// ----------------------
-.btn-group-vertical > .btn {
- display: block;
- float: none;
- width: 100%;
- max-width: 100%;
- + .btn {
+.btn-group-vertical {
+ > .btn,
+ > .btn-group {
+ display: block;
+ float: none;
+ width: 100%;
+ max-width: 100%;
+ }
+
+ // Clear floats so dropdown menus can be properly placed
+ > .btn-group {
+ .clearfix();
+ > .btn {
+ float: none;
+ }
+ }
+
+ > .btn + .btn,
+ > .btn + .btn-group,
+ > .btn-group + .btn,
+ > .btn-group + .btn-group {
margin-top: -1px;
+ margin-left: 0;
}
}
-.btn-group-vertical .btn {
+
+.btn-group-vertical > .btn {
&:not(:first-child):not(:last-child) {
border-radius: 0;
}
- &:first-child {
+ &:first-child:not(:last-child) {
+ border-top-right-radius: @border-radius-base;
.border-bottom-radius(0);
}
- &:last-child {
+ &:last-child:not(:first-child) {
+ border-bottom-left-radius: @border-radius-base;
.border-top-radius(0);
}
}
+.btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn {
+ border-radius: 0;
+}
+.btn-group-vertical > .btn-group:first-child {
+ > .btn:last-child,
+ > .dropdown-toggle {
+ .border-bottom-radius(0);
+ }
+}
+.btn-group-vertical > .btn-group:last-child > .btn:first-child {
+ .border-top-radius(0);
+}
+
// Justified button groups
.btn-group-justified {
display: table;
width: 100%;
+ table-layout: fixed;
+ border-collapse: separate;
.btn {
float: none;
display: table-cell;
// Checkbox and radio options
-.btn-group[data-toggle="buttons"] > .btn > input[type="radio"],
-.btn-group[data-toggle="buttons"] > .btn > input[type="checkbox"] {
+[data-toggle="buttons"] > .btn > input[type="radio"],
+[data-toggle="buttons"] > .btn > input[type="checkbox"] {
display: none;
}
padding: @padding-base-vertical @padding-base-horizontal;
margin-bottom: 0; // For input.btn
font-size: @font-size-base;
- font-weight: 500;
+ font-weight: @btn-font-weight;
line-height: @line-height-base;
text-align: center;
vertical-align: middle;
border: 1px solid transparent;
border-radius: @border-radius-base;
white-space: nowrap;
+ .user-select(none);
&:focus {
.tab-focus();
&:hover,
&:focus {
- color: @btn-hover-color;
+ color: @btn-default-color;
text-decoration: none;
}
&:active,
&.active {
outline: 0;
+ background-image: none;
.box-shadow(inset 0 3px 5px rgba(0,0,0,.125));
}
&.disabled,
&[disabled],
fieldset[disabled] & {
- cursor: default;
+ cursor: not-allowed;
pointer-events: none; // Future-proof disabling of clicks
.opacity(.65);
.box-shadow(none);
// --------------------------------------------------
.btn-default {
- .btn-pseudo-states(@btn-default-color, @btn-default-bg, @btn-default-border);
+ .button-variant(@btn-default-color; @btn-default-bg; @btn-default-border);
}
.btn-primary {
- .btn-pseudo-states(@btn-primary-color, @btn-primary-bg, @btn-primary-border);
+ .button-variant(@btn-primary-color; @btn-primary-bg; @btn-primary-border);
}
// Warning appears as orange
.btn-warning {
- .btn-pseudo-states(@btn-warning-color, @btn-warning-bg, @btn-warning-border);
+ .button-variant(@btn-warning-color; @btn-warning-bg; @btn-warning-border);
}
// Danger and error appear as red
.btn-danger {
- .btn-pseudo-states(@btn-danger-color, @btn-danger-bg, @btn-danger-border);
+ .button-variant(@btn-danger-color; @btn-danger-bg; @btn-danger-border);
}
// Success appears as green
.btn-success {
- .btn-pseudo-states(@btn-success-color, @btn-success-bg, @btn-success-border);
+ .button-variant(@btn-success-color; @btn-success-bg; @btn-success-border);
}
// Info appears as blue-green
.btn-info {
- .btn-pseudo-states(@btn-info-color, @btn-info-bg, @btn-info-border);
+ .button-variant(@btn-info-color; @btn-info-bg; @btn-info-border);
}
fieldset[disabled] & {
&:hover,
&:focus {
- color: @gray-dark;
+ color: @btn-link-disabled-color;
text-decoration: none;
}
}
// Button Sizes
// --------------------------------------------------
-.btn-large {
- padding: @padding-large-vertical @padding-large-horizontal;
- font-size: @font-size-large;
- border-radius: @border-radius-large;
+.btn-lg {
+ // line-height: ensure even-numbered height of button next to large input
+ .button-size(@padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large; @border-radius-large);
}
-.btn-small {
- padding: @padding-small-vertical @padding-small-horizontal;
- font-size: @font-size-small;
- line-height: 1.5; // ensure proper height of button next to small input
- border-radius: @border-radius-small;
+.btn-sm,
+.btn-xs {
+ // line-height: ensure proper height of button next to small input
+ .button-size(@padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @border-radius-small);
+}
+.btn-xs {
+ padding: 1px 5px;
}
top: 0;
left: 0;
bottom: 0;
- width: 15%;
- .opacity(.5);
- font-size: 20px;
+ width: @carousel-control-width;
+ .opacity(@carousel-control-opacity);
+ font-size: @carousel-control-font-size;
color: @carousel-control-color;
text-align: center;
text-shadow: @carousel-text-shadow;
// Set gradients for backgrounds
&.left {
#gradient > .horizontal(@start-color: rgba(0,0,0,.5); @end-color: rgba(0,0,0,.0001));
- background-color: transparent;
}
&.right {
left: auto;
right: 0;
#gradient > .horizontal(@start-color: rgba(0,0,0,.0001); @end-color: rgba(0,0,0,.5));
- background-color: transparent;
}
// Hover/focus state
}
// Toggles
- .glyphicon,
.icon-prev,
.icon-next {
position: absolute;
margin-left: -10px;
font-family: serif;
}
- // Non-glyphicon toggles
+
.icon-prev {
&:before {
content: '\2039';// SINGLE LEFT-POINTING ANGLE QUOTATION MARK (U+2039)
}
// Optional indicator pips
-// -----------------------------
+//
+// Add an unordered list with the following class and add a list item for each
+// slide your carousel holds.
+
.carousel-indicators {
position: absolute;
bottom: 10px;
left: 50%;
z-index: 15;
- width: 120px;
- margin-left: -60px;
+ width: 60%;
+ margin-left: -30%;
padding-left: 0;
list-style: none;
text-align: center;
@media screen and (min-width: @screen-tablet) {
// Scale up the controls a smidge
- .carousel-control .glyphicon,
.carousel-control .icon-prev,
.carousel-control .icon-next {
width: 30px;
.close {
float: right;
font-size: (@font-size-base * 1.5);
- font-weight: bold;
+ font-weight: @close-font-weight;
line-height: 1;
color: @close-color;
text-shadow: @close-text-shadow;
color: @code-color;
background-color: @code-bg;
white-space: nowrap;
- border-radius: 4px;
+ border-radius: @border-radius-base;
}
// Blocks of code
line-height: @line-height-base;
word-break: break-all;
word-wrap: break-word;
- color: @gray-dark;
+ color: @pre-color;
background-color: @pre-bg;
border: 1px solid @pre-border-color;
border-radius: @border-radius-base;
// Account for some code outputs that place code tags in pre tags
code {
padding: 0;
+ font-size: inherit;
color: inherit;
white-space: pre-wrap;
background-color: transparent;
// Enable scrollable blocks of code
.pre-scrollable {
- max-height: 340px;
+ max-height: @pre-scrollable-max-height;
overflow-y: scroll;
}
// Dropdown arrow/caret
-// --------------------
.caret {
display: inline-block;
width: 0;
height: 0;
margin-left: 2px;
vertical-align: middle;
- border-top: 4px solid @dropdown-caret-color;
- border-right: 4px solid transparent;
- border-left: 4px solid transparent;
+ border-top: @caret-width-base solid @dropdown-caret-color;
+ border-right: @caret-width-base solid transparent;
+ border-left: @caret-width-base solid transparent;
content: "";
}
+// The dropdown wrapper (div)
+.dropdown {
+ position: relative;
+}
+
+// Prevent the focus on the dropdown toggle when closing dropdowns
+.dropdown-toggle:focus {
+ outline: 0;
+}
+
// The dropdown menu (ul)
-// ----------------------
.dropdown-menu {
position: absolute;
top: 100%;
padding: 5px 0;
margin: 2px 0 0; // override default ul
list-style: none;
+ font-size: @font-size-base;
background-color: @dropdown-bg;
border: 1px solid @dropdown-fallback-border; // IE8 fallback
border: 1px solid @dropdown-border;
border-radius: @border-radius-base;
.box-shadow(0 6px 12px rgba(0,0,0,.175));
- .background-clip(padding-box);
+ background-clip: padding-box;
// Aligns the dropdown menu to right
&.pull-right {
}
// Hover/Focus state
-// -----------
.dropdown-menu > li > a {
&:hover,
&:focus {
text-decoration: none;
color: @dropdown-link-hover-color;
- #gradient > .vertical(@start-color: @dropdown-link-hover-bg; @end-color: darken(@dropdown-link-hover-bg, 5%));
+ background-color: @dropdown-link-hover-bg;
}
}
// Active state
-// ------------
.dropdown-menu > .active > a {
&,
&:hover,
color: @dropdown-link-active-color;
text-decoration: none;
outline: 0;
- #gradient > .vertical(@start-color: @dropdown-link-active-bg; @end-color: darken(@dropdown-link-active-bg, 5%));
+ background-color: @dropdown-link-active-bg;
}
}
// Disabled state
-// --------------
+//
// Gray out text and ensure the hover/focus state remains gray
+
.dropdown-menu > .disabled > a {
&,
&:hover,
&:focus {
- color: @gray-light;
+ color: @dropdown-link-disabled-color;
}
}
// Nuke hover/focus effects
}
// Open state for the dropdown
-// ---------------------------
.open {
// Show the menu
> .dropdown-menu {
}
// Dropdown section headers
-// ---------------------------
.dropdown-header {
display: block;
padding: 3px 20px;
font-size: @font-size-small;
line-height: @line-height-base;
- color: @gray-light;
+ color: @dropdown-header-color;
}
-
-
// Backdrop to catch body clicks on mobile, etc.
-// ---------------------------
.dropdown-backdrop {
position: fixed;
left: 0;
}
// Right aligned dropdowns
-// ---------------------------
.pull-right > .dropdown-menu {
right: 0;
left: auto;
}
// Allow for dropdowns to go bottom up (aka, dropup-menu)
-// ------------------------------------------------------
+//
// Just add .dropup after the standard .dropdown class and you're set, bro.
// TODO: abstract this so that the navbar fixed styles are not placed here?
+
.dropup,
.navbar-fixed-bottom .dropdown {
// Reverse the caret
margin-bottom: @line-height-computed;
font-size: (@font-size-base * 1.5);
line-height: inherit;
- color: @gray-dark;
+ color: @legend-color;
border: 0;
border-bottom: 1px solid @legend-border-color;
}
// See https://github.com/twbs/bootstrap/issues/8350 for more.
input[type="number"] {
&::-webkit-outer-spin-button,
- &::-webkit-inner-spin-button {
+ &::-webkit-inner-spin-button {
height: auto;
}
}
padding: @padding-base-vertical @padding-base-horizontal;
font-size: @font-size-base;
line-height: @line-height-base;
- color: @gray;
+ color: @input-color;
vertical-align: middle;
background-color: @input-bg;
border: 1px solid @input-border;
.box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
.transition(~"border-color ease-in-out .15s, box-shadow ease-in-out .15s");
- &:focus {
- border-color: rgba(82,168,236,.8);
- outline: 0;
- .box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6)");
- }
+ // Customize the `:focus` state to imitate native WebKit styles.
+ .form-control-focus();
// Disabled and read-only inputs
- // Note: HTML5 says that inputs under a fieldset > legend:first-child won't be
- // disabled if the fieldset is disabled. Due to implementation difficulty,
- // we don't honor that edge case; we style them as disabled anyway.
+ // Note: HTML5 says that controls under a fieldset > legend:first-child won't
+ // be disabled if the fieldset is disabled. Due to implementation difficulty,
+ // we don't honor that edge case; we style them as disabled anyway.
&[disabled],
&[readonly],
fieldset[disabled] & {
margin-left: 10px; // space out consecutive inline controls
}
-
-
-// Form control sizing
+// Apply same disabled cursor tweak as for inputs
//
-// Relative text size, padding, and border-radii changes for form controls. For
-// horizontal sizing, wrap controls in the predefined grid classes. `<select>`
-// element gets special love because it's special, and that's a fact!
-
-.form-control {
- &.input-large {
- height: @input-height-large;
- padding: @padding-large-vertical @padding-large-horizontal;
- font-size: @font-size-large;
- border-radius: @border-radius-large;
- }
- &.input-small {
- height: @input-height-small;
- padding: @padding-small-vertical @padding-small-horizontal;
- font-size: @font-size-small;
- border-radius: @border-radius-small;
+// Note: Neither radios nor checkboxes can be readonly.
+input[type="radio"],
+input[type="checkbox"],
+.radio,
+.radio-inline,
+.checkbox,
+.checkbox-inline {
+ &[disabled],
+ fieldset[disabled] & {
+ cursor: not-allowed;
}
}
-select {
- &.input-large {
- height: @input-height-large;
- line-height: @input-height-large;
- }
- &.input-small {
- height: @input-height-small;
- line-height: @input-height-small;
- }
+
+// Form control sizing
+.input-sm {
+ .input-size(@input-height-small; @padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @border-radius-small);
+}
+
+.input-lg {
+ .input-size(@input-height-large; @padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large; @border-radius-large);
}
// Warning
.has-warning {
- .form-control-validation(@state-warning-text, @state-warning-text, @state-warning-bg);
+ .form-control-validation(@state-warning-text; @state-warning-text; @state-warning-bg);
}
// Error
.has-error {
- .form-control-validation(@state-danger-text, @state-danger-text, @state-danger-bg);
+ .form-control-validation(@state-danger-text; @state-danger-text; @state-danger-bg);
}
// Success
.has-success {
- .form-control-validation(@state-success-text, @state-success-text, @state-success-bg);
+ .form-control-validation(@state-success-text; @state-success-text; @state-success-bg);
+}
+
+
+// Static form control text
+//
+// Apply class to a `p` element to make any string of text align with labels in
+// a horizontal form layout.
+
+.form-control-static {
+ margin-bottom: 0; // Remove default margin from `p`
+ padding-top: @padding-base-vertical;
}
-// Input groups
-// --------------------------------------------------
-
-// Base styles
-// -------------------------
-.input-group {
- display: table;
- border-collapse: separate; // prevent input groups from inheriting border styles from table cells when placed within a table
-
- // Undo padding and float of grid classes
- &.col {
- float: none;
- padding-left: 0;
- padding-right: 0;
- }
-
- .form-control {
- width: 100%;
- margin-bottom: 0;
- }
-}
-
-// Display as table-cell
-// -------------------------
-.input-group-addon,
-.input-group-btn,
-.input-group .form-control {
- display: table-cell;
-
- &:not(:first-child):not(:last-child) {
- border-radius: 0;
- }
-}
-// Addon and addon wrapper for buttons
-.input-group-addon,
-.input-group-btn {
- width: 1%;
- white-space: nowrap;
- vertical-align: middle; // Match the inputs
-}
-
-// Text input groups
-// -------------------------
-.input-group-addon {
- .box-sizing(border-box);
- padding: @padding-base-vertical @padding-base-horizontal;
- font-size: @font-size-base;
- font-weight: normal;
- line-height: @line-height-base;
- text-align: center;
- background-color: @gray-lighter;
- border: 1px solid @input-group-addon-border-color;
- border-radius: @border-radius-base;
-
- &.input-small {
- padding: @padding-small-vertical @padding-small-horizontal;
- font-size: @font-size-small;
- border-radius: @border-radius-small;
- }
- &.input-large {
- padding: @padding-large-vertical @padding-large-horizontal;
- font-size: @font-size-large;
- border-radius: @border-radius-large;
- }
-}
-
-// Reset rounded corners
-.input-group .form-control:first-child,
-.input-group-addon:first-child,
-.input-group-btn:first-child > .btn,
-.input-group-btn:first-child > .dropdown-toggle,
-.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle) {
- .border-right-radius(0);
-}
-.input-group-addon:first-child {
- border-right: 0;
-}
-.input-group .form-control:last-child,
-.input-group-addon:last-child,
-.input-group-btn:last-child > .btn,
-.input-group-btn:last-child > .dropdown-toggle,
-.input-group-btn:first-child > .btn:not(:first-child) {
- .border-left-radius(0);
-}
-.input-group-addon:last-child {
- border-left: 0;
-}
-
-// Button input groups
-// -------------------------
-.input-group-btn {
- position: relative;
- white-space: nowrap;
-}
-.input-group-btn > .btn {
- position: relative;
- // Jankily prevent input button groups from wrapping
- + .btn {
- margin-left: -4px;
- }
- // Bring the "active" button to the front
- &:hover,
- &:active {
- z-index: 2;
- }
-}
-
-
// Inline forms
-// --------------------------------------------------
+//
+// Make forms appear inline(-block) by adding the `.form-inline` class. Inline
+// forms begin stacked on extra small (mobile) devices and then go inline when
+// viewports reach <768px.
+//
+// Requires wrapping inputs and labels with `.form-group` for proper display of
+// default HTML form controls and our custom form controls (e.g., input groups).
+//
+// Heads up! This is mixin-ed into `.navbar-form` in navbars.less.
.form-inline {
- .form-control,
- .radio,
- .checkbox {
- display: inline-block;
- }
- .radio,
- .checkbox {
- margin-top: 0;
- margin-bottom: 0;
+
+ // Kick in the inline
+ @media (min-width: @screen-tablet) {
+ // Inline-block all the things for "inline"
+ .form-group {
+ display: inline-block;
+ margin-bottom: 0;
+ vertical-align: middle;
+ }
+
+ // In navbar-form, allow folks to *not* use `.form-group`
+ .form-control {
+ display: inline-block;
+ }
+
+ // Remove default margin on radios/checkboxes that were used for stacking, and
+ // then undo the floating of radios and checkboxes to match (which also avoids
+ // a bug in WebKit: https://github.com/twbs/bootstrap/issues/1969).
+ .radio,
+ .checkbox {
+ display: inline-block;
+ margin-top: 0;
+ margin-bottom: 0;
+ padding-left: 0;
+ }
+ .radio input[type="radio"],
+ .checkbox input[type="checkbox"] {
+ float: none;
+ margin-left: 0;
+ }
}
}
// Horizontal forms
-// --------------------------------------------------
-// Horizontal forms are built on grid classes.
+//
+// Horizontal forms are built on grid classes and allow you to create forms with
+// labels on the left and inputs on the right.
-.form-horizontal .control-label {
- padding-top: 6px;
+.form-horizontal .control-label,
+.form-horizontal .radio-inline,
+.form-horizontal .checkbox-inline {
+ padding-top: @padding-base-vertical;
}
.form-horizontal {
// Grid system
// --------------------------------------------------
+
// Set the container width, and override it for fixed navbars in media queries
.container {
.container-fixed();
}
// Common styles for small and large grid columns
-.col-1,
-.col-2,
-.col-3,
-.col-4,
-.col-5,
-.col-6,
-.col-7,
-.col-8,
-.col-9,
-.col-10,
-.col-11,
-.col-12,
+.col-xs-1,
+.col-xs-2,
+.col-xs-3,
+.col-xs-4,
+.col-xs-5,
+.col-xs-6,
+.col-xs-7,
+.col-xs-8,
+.col-xs-9,
+.col-xs-10,
+.col-xs-11,
+.col-xs-12,
.col-sm-1,
.col-sm-2,
.col-sm-3,
.col-sm-10,
.col-sm-11,
.col-sm-12,
+.col-md-1,
+.col-md-2,
+.col-md-3,
+.col-md-4,
+.col-md-5,
+.col-md-6,
+.col-md-7,
+.col-md-8,
+.col-md-9,
+.col-md-10,
+.col-md-11,
+.col-md-12,
.col-lg-1,
.col-lg-2,
.col-lg-3,
}
-
+// Extra small grid
//
-// Container and grid column sizing
+// Grid classes for extra small devices like smartphones. No offset, push, or
+// pull classes are present here due to the size of the target.
//
+// Note that `.col-xs-12` doesn't get floated on purpose—there's no need since
+// it's full-width.
-// Tiny device columns (smartphones)
-.col-1,
-.col-2,
-.col-3,
-.col-4,
-.col-5,
-.col-6,
-.col-7,
-.col-8,
-.col-9,
-.col-10,
-.col-11,
-.col-12 {
+.col-xs-1,
+.col-xs-2,
+.col-xs-3,
+.col-xs-4,
+.col-xs-5,
+.col-xs-6,
+.col-xs-7,
+.col-xs-8,
+.col-xs-9,
+.col-xs-10,
+.col-xs-11 {
float: left;
}
-.col-1 { width: percentage((1 / @grid-columns)); }
-.col-2 { width: percentage((2 / @grid-columns)); }
-.col-3 { width: percentage((3 / @grid-columns)); }
-.col-4 { width: percentage((4 / @grid-columns)); }
-.col-5 { width: percentage((5 / @grid-columns)); }
-.col-6 { width: percentage((6 / @grid-columns)); }
-.col-7 { width: percentage((7 / @grid-columns)); }
-.col-8 { width: percentage((8 / @grid-columns)); }
-.col-9 { width: percentage((9 / @grid-columns)); }
-.col-10 { width: percentage((10/ @grid-columns)); }
-.col-11 { width: percentage((11/ @grid-columns)); }
-.col-12 { width: 100%; }
-
-// Small device columns (phones to tablets)
+.col-xs-1 { width: percentage((1 / @grid-columns)); }
+.col-xs-2 { width: percentage((2 / @grid-columns)); }
+.col-xs-3 { width: percentage((3 / @grid-columns)); }
+.col-xs-4 { width: percentage((4 / @grid-columns)); }
+.col-xs-5 { width: percentage((5 / @grid-columns)); }
+.col-xs-6 { width: percentage((6 / @grid-columns)); }
+.col-xs-7 { width: percentage((7 / @grid-columns)); }
+.col-xs-8 { width: percentage((8 / @grid-columns)); }
+.col-xs-9 { width: percentage((9 / @grid-columns)); }
+.col-xs-10 { width: percentage((10/ @grid-columns)); }
+.col-xs-11 { width: percentage((11/ @grid-columns)); }
+.col-xs-12 { width: 100%; }
+
+
+// Small grid
+//
+// Columns, offsets, pushes, and pulls for the small device range, from phones
+// to tablets.
+//
+// Note that `.col-sm-12` doesn't get floated on purpose—there's no need since
+// it's full-width.
+
@media (min-width: @screen-tablet) {
.container {
max-width: @container-tablet;
.col-sm-8,
.col-sm-9,
.col-sm-10,
- .col-sm-11,
- .col-sm-12 {
+ .col-sm-11 {
float: left;
}
.col-sm-1 { width: percentage((1 / @grid-columns)); }
.col-sm-12 { width: 100%; }
// Push and pull columns for source order changes
- .col-push-1 { left: percentage((1 / @grid-columns)); }
- .col-push-2 { left: percentage((2 / @grid-columns)); }
- .col-push-3 { left: percentage((3 / @grid-columns)); }
- .col-push-4 { left: percentage((4 / @grid-columns)); }
- .col-push-5 { left: percentage((5 / @grid-columns)); }
- .col-push-6 { left: percentage((6 / @grid-columns)); }
- .col-push-7 { left: percentage((7 / @grid-columns)); }
- .col-push-8 { left: percentage((8 / @grid-columns)); }
- .col-push-9 { left: percentage((9 / @grid-columns)); }
- .col-push-10 { left: percentage((10/ @grid-columns)); }
- .col-push-11 { left: percentage((11/ @grid-columns)); }
-
- .col-pull-1 { right: percentage((1 / @grid-columns)); }
- .col-pull-2 { right: percentage((2 / @grid-columns)); }
- .col-pull-3 { right: percentage((3 / @grid-columns)); }
- .col-pull-4 { right: percentage((4 / @grid-columns)); }
- .col-pull-5 { right: percentage((5 / @grid-columns)); }
- .col-pull-6 { right: percentage((6 / @grid-columns)); }
- .col-pull-7 { right: percentage((7 / @grid-columns)); }
- .col-pull-8 { right: percentage((8 / @grid-columns)); }
- .col-pull-9 { right: percentage((9 / @grid-columns)); }
- .col-pull-10 { right: percentage((10/ @grid-columns)); }
- .col-pull-11 { right: percentage((11/ @grid-columns)); }
+ .col-sm-push-1 { left: percentage((1 / @grid-columns)); }
+ .col-sm-push-2 { left: percentage((2 / @grid-columns)); }
+ .col-sm-push-3 { left: percentage((3 / @grid-columns)); }
+ .col-sm-push-4 { left: percentage((4 / @grid-columns)); }
+ .col-sm-push-5 { left: percentage((5 / @grid-columns)); }
+ .col-sm-push-6 { left: percentage((6 / @grid-columns)); }
+ .col-sm-push-7 { left: percentage((7 / @grid-columns)); }
+ .col-sm-push-8 { left: percentage((8 / @grid-columns)); }
+ .col-sm-push-9 { left: percentage((9 / @grid-columns)); }
+ .col-sm-push-10 { left: percentage((10/ @grid-columns)); }
+ .col-sm-push-11 { left: percentage((11/ @grid-columns)); }
+
+ .col-sm-pull-1 { right: percentage((1 / @grid-columns)); }
+ .col-sm-pull-2 { right: percentage((2 / @grid-columns)); }
+ .col-sm-pull-3 { right: percentage((3 / @grid-columns)); }
+ .col-sm-pull-4 { right: percentage((4 / @grid-columns)); }
+ .col-sm-pull-5 { right: percentage((5 / @grid-columns)); }
+ .col-sm-pull-6 { right: percentage((6 / @grid-columns)); }
+ .col-sm-pull-7 { right: percentage((7 / @grid-columns)); }
+ .col-sm-pull-8 { right: percentage((8 / @grid-columns)); }
+ .col-sm-pull-9 { right: percentage((9 / @grid-columns)); }
+ .col-sm-pull-10 { right: percentage((10/ @grid-columns)); }
+ .col-sm-pull-11 { right: percentage((11/ @grid-columns)); }
+
+ // Offsets
+ .col-sm-offset-1 { margin-left: percentage((1 / @grid-columns)); }
+ .col-sm-offset-2 { margin-left: percentage((2 / @grid-columns)); }
+ .col-sm-offset-3 { margin-left: percentage((3 / @grid-columns)); }
+ .col-sm-offset-4 { margin-left: percentage((4 / @grid-columns)); }
+ .col-sm-offset-5 { margin-left: percentage((5 / @grid-columns)); }
+ .col-sm-offset-6 { margin-left: percentage((6 / @grid-columns)); }
+ .col-sm-offset-7 { margin-left: percentage((7 / @grid-columns)); }
+ .col-sm-offset-8 { margin-left: percentage((8 / @grid-columns)); }
+ .col-sm-offset-9 { margin-left: percentage((9 / @grid-columns)); }
+ .col-sm-offset-10 { margin-left: percentage((10/ @grid-columns)); }
+ .col-sm-offset-11 { margin-left: percentage((11/ @grid-columns)); }
}
-// Medium and large device columns (desktop and up)
+
+// Medium grid
+//
+// Columns, offsets, pushes, and pulls for the desktop device range.
+//
+// Note that `.col-md-12` doesn't get floated on purpose—there's no need since
+// it's full-width.
+
@media (min-width: @screen-desktop) {
.container {
max-width: @container-desktop;
}
+ .col-md-1,
+ .col-md-2,
+ .col-md-3,
+ .col-md-4,
+ .col-md-5,
+ .col-md-6,
+ .col-md-7,
+ .col-md-8,
+ .col-md-9,
+ .col-md-10,
+ .col-md-11 {
+ float: left;
+ }
+ .col-md-1 { width: percentage((1 / @grid-columns)); }
+ .col-md-2 { width: percentage((2 / @grid-columns)); }
+ .col-md-3 { width: percentage((3 / @grid-columns)); }
+ .col-md-4 { width: percentage((4 / @grid-columns)); }
+ .col-md-5 { width: percentage((5 / @grid-columns)); }
+ .col-md-6 { width: percentage((6 / @grid-columns)); }
+ .col-md-7 { width: percentage((7 / @grid-columns)); }
+ .col-md-8 { width: percentage((8 / @grid-columns)); }
+ .col-md-9 { width: percentage((9 / @grid-columns)); }
+ .col-md-10 { width: percentage((10/ @grid-columns)); }
+ .col-md-11 { width: percentage((11/ @grid-columns)); }
+ .col-md-12 { width: 100%; }
+
+ // Push and pull columns for source order changes
+ .col-md-push-0 { left: auto; }
+ .col-md-push-1 { left: percentage((1 / @grid-columns)); }
+ .col-md-push-2 { left: percentage((2 / @grid-columns)); }
+ .col-md-push-3 { left: percentage((3 / @grid-columns)); }
+ .col-md-push-4 { left: percentage((4 / @grid-columns)); }
+ .col-md-push-5 { left: percentage((5 / @grid-columns)); }
+ .col-md-push-6 { left: percentage((6 / @grid-columns)); }
+ .col-md-push-7 { left: percentage((7 / @grid-columns)); }
+ .col-md-push-8 { left: percentage((8 / @grid-columns)); }
+ .col-md-push-9 { left: percentage((9 / @grid-columns)); }
+ .col-md-push-10 { left: percentage((10/ @grid-columns)); }
+ .col-md-push-11 { left: percentage((11/ @grid-columns)); }
+
+ .col-md-pull-0 { right: auto; }
+ .col-md-pull-1 { right: percentage((1 / @grid-columns)); }
+ .col-md-pull-2 { right: percentage((2 / @grid-columns)); }
+ .col-md-pull-3 { right: percentage((3 / @grid-columns)); }
+ .col-md-pull-4 { right: percentage((4 / @grid-columns)); }
+ .col-md-pull-5 { right: percentage((5 / @grid-columns)); }
+ .col-md-pull-6 { right: percentage((6 / @grid-columns)); }
+ .col-md-pull-7 { right: percentage((7 / @grid-columns)); }
+ .col-md-pull-8 { right: percentage((8 / @grid-columns)); }
+ .col-md-pull-9 { right: percentage((9 / @grid-columns)); }
+ .col-md-pull-10 { right: percentage((10/ @grid-columns)); }
+ .col-md-pull-11 { right: percentage((11/ @grid-columns)); }
+
+ // Offsets
+ .col-md-offset-0 { margin-left: 0; }
+ .col-md-offset-1 { margin-left: percentage((1 / @grid-columns)); }
+ .col-md-offset-2 { margin-left: percentage((2 / @grid-columns)); }
+ .col-md-offset-3 { margin-left: percentage((3 / @grid-columns)); }
+ .col-md-offset-4 { margin-left: percentage((4 / @grid-columns)); }
+ .col-md-offset-5 { margin-left: percentage((5 / @grid-columns)); }
+ .col-md-offset-6 { margin-left: percentage((6 / @grid-columns)); }
+ .col-md-offset-7 { margin-left: percentage((7 / @grid-columns)); }
+ .col-md-offset-8 { margin-left: percentage((8 / @grid-columns)); }
+ .col-md-offset-9 { margin-left: percentage((9 / @grid-columns)); }
+ .col-md-offset-10 { margin-left: percentage((10/ @grid-columns)); }
+ .col-md-offset-11 { margin-left: percentage((11/ @grid-columns)); }
+}
+
+
+// Large grid
+//
+// Columns, offsets, pushes, and pulls for the large desktop device range.
+//
+// Note that `.col-lg-12` doesn't get floated on purpose—there's no need since
+// it's full-width.
+
+@media (min-width: @screen-large-desktop) {
+ .container {
+ max-width: @container-large-desktop;
+ }
+
.col-lg-1,
.col-lg-2,
.col-lg-3,
.col-lg-8,
.col-lg-9,
.col-lg-10,
- .col-lg-11,
- .col-lg-12 {
+ .col-lg-11 {
float: left;
}
.col-lg-1 { width: percentage((1 / @grid-columns)); }
.col-lg-11 { width: percentage((11/ @grid-columns)); }
.col-lg-12 { width: 100%; }
- // Offsets
- .col-offset-1 { margin-left: percentage((1 / @grid-columns)); }
- .col-offset-2 { margin-left: percentage((2 / @grid-columns)); }
- .col-offset-3 { margin-left: percentage((3 / @grid-columns)); }
- .col-offset-4 { margin-left: percentage((4 / @grid-columns)); }
- .col-offset-5 { margin-left: percentage((5 / @grid-columns)); }
- .col-offset-6 { margin-left: percentage((6 / @grid-columns)); }
- .col-offset-7 { margin-left: percentage((7 / @grid-columns)); }
- .col-offset-8 { margin-left: percentage((8 / @grid-columns)); }
- .col-offset-9 { margin-left: percentage((9 / @grid-columns)); }
- .col-offset-10 { margin-left: percentage((10/ @grid-columns)); }
- .col-offset-11 { margin-left: percentage((11/ @grid-columns)); }
-}
+ // Push and pull columns for source order changes
+ .col-lg-push-0 { left: auto; }
+ .col-lg-push-1 { left: percentage((1 / @grid-columns)); }
+ .col-lg-push-2 { left: percentage((2 / @grid-columns)); }
+ .col-lg-push-3 { left: percentage((3 / @grid-columns)); }
+ .col-lg-push-4 { left: percentage((4 / @grid-columns)); }
+ .col-lg-push-5 { left: percentage((5 / @grid-columns)); }
+ .col-lg-push-6 { left: percentage((6 / @grid-columns)); }
+ .col-lg-push-7 { left: percentage((7 / @grid-columns)); }
+ .col-lg-push-8 { left: percentage((8 / @grid-columns)); }
+ .col-lg-push-9 { left: percentage((9 / @grid-columns)); }
+ .col-lg-push-10 { left: percentage((10/ @grid-columns)); }
+ .col-lg-push-11 { left: percentage((11/ @grid-columns)); }
-// Large desktops and up
-@media (min-width: @screen-large-desktop) {
- .container {
- max-width: @container-large-desktop;
- }
+ .col-lg-pull-0 { right: auto; }
+ .col-lg-pull-1 { right: percentage((1 / @grid-columns)); }
+ .col-lg-pull-2 { right: percentage((2 / @grid-columns)); }
+ .col-lg-pull-3 { right: percentage((3 / @grid-columns)); }
+ .col-lg-pull-4 { right: percentage((4 / @grid-columns)); }
+ .col-lg-pull-5 { right: percentage((5 / @grid-columns)); }
+ .col-lg-pull-6 { right: percentage((6 / @grid-columns)); }
+ .col-lg-pull-7 { right: percentage((7 / @grid-columns)); }
+ .col-lg-pull-8 { right: percentage((8 / @grid-columns)); }
+ .col-lg-pull-9 { right: percentage((9 / @grid-columns)); }
+ .col-lg-pull-10 { right: percentage((10/ @grid-columns)); }
+ .col-lg-pull-11 { right: percentage((11/ @grid-columns)); }
+
+ // Offsets
+ .col-lg-offset-0 { margin-left: 0; }
+ .col-lg-offset-1 { margin-left: percentage((1 / @grid-columns)); }
+ .col-lg-offset-2 { margin-left: percentage((2 / @grid-columns)); }
+ .col-lg-offset-3 { margin-left: percentage((3 / @grid-columns)); }
+ .col-lg-offset-4 { margin-left: percentage((4 / @grid-columns)); }
+ .col-lg-offset-5 { margin-left: percentage((5 / @grid-columns)); }
+ .col-lg-offset-6 { margin-left: percentage((6 / @grid-columns)); }
+ .col-lg-offset-7 { margin-left: percentage((7 / @grid-columns)); }
+ .col-lg-offset-8 { margin-left: percentage((8 / @grid-columns)); }
+ .col-lg-offset-9 { margin-left: percentage((9 / @grid-columns)); }
+ .col-lg-offset-10 { margin-left: percentage((10/ @grid-columns)); }
+ .col-lg-offset-11 { margin-left: percentage((11/ @grid-columns)); }
}
--- /dev/null
+//
+// Input groups
+// --------------------------------------------------
+
+// Base styles
+// -------------------------
+.input-group {
+ position: relative; // For dropdowns
+ display: table;
+ border-collapse: separate; // prevent input groups from inheriting border styles from table cells when placed within a table
+
+ // Undo padding and float of grid classes
+ &.col {
+ float: none;
+ padding-left: 0;
+ padding-right: 0;
+ }
+
+ .form-control {
+ width: 100%;
+ margin-bottom: 0;
+ }
+}
+
+// Sizing options
+//
+// Remix the default form control sizing classes into new ones for easier
+// manipulation.
+
+.input-group-lg > .form-control,
+.input-group-lg > .input-group-addon,
+.input-group-lg > .input-group-btn > .btn { .input-lg(); }
+.input-group-sm > .form-control,
+.input-group-sm > .input-group-addon,
+.input-group-sm > .input-group-btn > .btn { .input-sm(); }
+
+
+// Display as table-cell
+// -------------------------
+.input-group-addon,
+.input-group-btn,
+.input-group .form-control {
+ display: table-cell;
+
+ &:not(:first-child):not(:last-child) {
+ border-radius: 0;
+ }
+}
+// Addon and addon wrapper for buttons
+.input-group-addon,
+.input-group-btn {
+ width: 1%;
+ white-space: nowrap;
+ vertical-align: middle; // Match the inputs
+}
+
+// Text input groups
+// -------------------------
+.input-group-addon {
+ padding: @padding-base-vertical @padding-base-horizontal;
+ font-size: @font-size-base;
+ font-weight: normal;
+ line-height: 1;
+ text-align: center;
+ background-color: @input-group-addon-bg;
+ border: 1px solid @input-group-addon-border-color;
+ border-radius: @border-radius-base;
+
+ // Sizing
+ &.input-sm {
+ padding: @padding-small-vertical @padding-small-horizontal;
+ font-size: @font-size-small;
+ border-radius: @border-radius-small;
+ }
+ &.input-lg {
+ padding: @padding-large-vertical @padding-large-horizontal;
+ font-size: @font-size-large;
+ border-radius: @border-radius-large;
+ }
+
+ // Nuke default margins from checkboxes and radios to vertically center within.
+ input[type="radio"],
+ input[type="checkbox"] {
+ margin-top: 0;
+ }
+}
+
+// Reset rounded corners
+.input-group .form-control:first-child,
+.input-group-addon:first-child,
+.input-group-btn:first-child > .btn,
+.input-group-btn:first-child > .dropdown-toggle,
+.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle) {
+ .border-right-radius(0);
+}
+.input-group-addon:first-child {
+ border-right: 0;
+}
+.input-group .form-control:last-child,
+.input-group-addon:last-child,
+.input-group-btn:last-child > .btn,
+.input-group-btn:last-child > .dropdown-toggle,
+.input-group-btn:first-child > .btn:not(:first-child) {
+ .border-left-radius(0);
+}
+.input-group-addon:last-child {
+ border-left: 0;
+}
+
+// Button input groups
+// -------------------------
+.input-group-btn {
+ position: relative;
+ white-space: nowrap;
+}
+.input-group-btn > .btn {
+ position: relative;
+ // Jankily prevent input button groups from wrapping
+ + .btn {
+ margin-left: -4px;
+ }
+ // Bring the "active" button to the front
+ &:hover,
+ &:active {
+ z-index: 2;
+ }
+}
display: inline;
padding: .25em .6em;
font-size: 75%;
- font-weight: 500;
+ font-weight: bold;
line-height: 1;
color: @label-color;
text-align: center;
white-space: nowrap;
- vertical-align: middle;
- background-color: @gray-light;
+ vertical-align: baseline;
border-radius: .25em;
// Add hover effects, but only for links
color: @label-link-hover-color;
text-decoration: none;
cursor: pointer;
- background-color: darken(@gray-light, 10%);
}
}
+
+ // Empty labels collapse automatically (not available in IE8)
+ &:empty {
+ display: none;
+ }
}
// Colors
// Contextual variations (linked labels get darker on :hover)
-.label-danger {
- .label-variant(@label-danger-bg);
+
+.label-default {
+ .label-variant(@label-default-bg);
+}
+
+.label-primary {
+ .label-variant(@label-primary-bg);
}
.label-success {
.label-variant(@label-success-bg);
}
+.label-info {
+ .label-variant(@label-info-bg);
+}
+
.label-warning {
.label-variant(@label-warning-bg);
}
-.label-info {
- .label-variant(@label-info-bg);
+.label-danger {
+ .label-variant(@label-danger-bg);
}
// No need to set list-style: none; since .list-group-item is block level
margin-bottom: 20px;
padding-left: 0; // reset padding because ul and ol
- background-color: @list-group-bg;
}
// Individual list items
.list-group-item {
position: relative;
display: block;
- padding: 10px 30px 10px 15px;
+ padding: 10px 15px;
// Place the border on the list items and negative margin up for better styling
margin-bottom: -1px;
+ background-color: @list-group-bg;
border: 1px solid @list-group-border;
// Round the first and last items
&:first-child {
- .border-top-radius(@border-radius-base);
+ .border-top-radius(@list-group-border-radius);
}
&:last-child {
margin-bottom: 0;
- .border-bottom-radius(@border-radius-base);
+ .border-bottom-radius(@list-group-border-radius);
}
// Align badges within list items
> .badge {
float: right;
- margin-right: -15px;
}
-}
-
-// Custom content options
-// -------------------------
-
-.list-group-item-heading {
- margin-top: 0;
- margin-bottom: 5px;
-}
-.list-group-item-text {
- margin-bottom: 0;
- line-height: 1.3;
-}
-
-// Linked list items
-// -------------------------
-
-// Custom content within linked items
-a.list-group-item {
- // Colorize content accordingly
- .list-group-item-heading {
- color: @list-group-link-heading-color;
+ > .badge + .badge {
+ margin-right: 5px;
}
- .list-group-item-text {
+
+ // Linked list items
+ a& {
color: @list-group-link-color;
- }
- // Hover state
- &:hover,
- &:focus {
- text-decoration: none;
- background-color: @list-group-hover-bg;
+ .list-group-item-heading {
+ color: @list-group-link-heading-color;
+ }
+
+ // Hover state
+ &:hover,
+ &:focus {
+ text-decoration: none;
+ background-color: @list-group-hover-bg;
+ }
}
// Active class on item itself, not parent
- &.active {
+ &.active,
+ &.active:hover,
+ &.active:focus {
z-index: 2; // Place active items above their siblings for proper border styling
color: @list-group-active-color;
background-color: @list-group-active-bg;
}
}
}
+
+// Custom content options
+// -------------------------
+
+.list-group-item-heading {
+ margin-top: 0;
+ margin-bottom: 5px;
+}
+.list-group-item-text {
+ margin-bottom: 0;
+ line-height: 1.3;
+}
}
// Sizing shortcuts
-.size(@width, @height) {
+.size(@width; @height) {
width: @width;
height: @height;
}
.square(@size) {
- .size(@size, @size);
+ .size(@size; @size);
}
// Placeholder text
// Transformations
.rotate(@degrees) {
-webkit-transform: rotate(@degrees);
- -ms-transform: rotate(@degrees);
+ -ms-transform: rotate(@degrees); // IE9+
transform: rotate(@degrees);
}
.scale(@ratio) {
-webkit-transform: scale(@ratio);
- -ms-transform: scale(@ratio);
+ -ms-transform: scale(@ratio); // IE9+
transform: scale(@ratio);
}
-.translate(@x, @y) {
+.translate(@x; @y) {
-webkit-transform: translate(@x, @y);
- -ms-transform: translate(@x, @y);
+ -ms-transform: translate(@x, @y); // IE9+
transform: translate(@x, @y);
}
-.skew(@x, @y) {
+.skew(@x; @y) {
-webkit-transform: skew(@x, @y);
- -ms-transform: skewX(@x) skewY(@y); // See https://github.com/twbs/bootstrap/issues/4885
+ -ms-transform: skewX(@x) skewY(@y); // See https://github.com/twbs/bootstrap/issues/4885; IE9+
transform: skew(@x, @y);
}
-.translate3d(@x, @y, @z) {
+.translate3d(@x; @y; @z) {
-webkit-transform: translate3d(@x, @y, @z);
transform: translate3d(@x, @y, @z);
}
// Default value is `visible`, but can be changed to `hidden`
// See git pull https://github.com/dannykeane/bootstrap.git backface-visibility for examples
.backface-visibility(@visibility){
- -webkit-backface-visibility: @visibility;
- -moz-backface-visibility: @visibility;
- backface-visibility: @visibility;
-}
-
-// Background clipping
-.background-clip(@clip) {
- background-clip: @clip;
-}
-
-// Background sizing
-.background-size(@size) {
- background-size: @size;
+ -webkit-backface-visibility: @visibility;
+ -moz-backface-visibility: @visibility;
+ backface-visibility: @visibility;
}
// Box sizing
.user-select(@select) {
-webkit-user-select: @select;
-moz-user-select: @select;
- -ms-user-select: @select;
+ -ms-user-select: @select; // IE10+
-o-user-select: @select;
user-select: @select;
}
}
// CSS3 Content Columns
-.content-columns(@column-count, @column-gap: @grid-gutter-width) {
+.content-columns(@column-count; @column-gap: @grid-gutter-width) {
-webkit-column-count: @column-count;
-moz-column-count: @column-count;
column-count: @column-count;
word-wrap: break-word;
-webkit-hyphens: @mode;
-moz-hyphens: @mode;
- -ms-hyphens: @mode;
+ -ms-hyphens: @mode; // IE10+
-o-hyphens: @mode;
hyphens: @mode;
}
//
// Creates two color stops, start and end, by specifying a color and position for each color stop.
// Color stops are not available in IE9 and below.
- .horizontal(@start-color: #555; @start-percent: 0%; @end-color: #333; @end-percent: 100%) {
- background-color: @end-color;
+ .horizontal(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) {
background-image: -webkit-gradient(linear, @start-percent top, @end-percent top, from(@start-color), to(@end-color)); // Safari 4+, Chrome 2+
background-image: -webkit-linear-gradient(left, color-stop(@start-color @start-percent), color-stop(@end-color @end-percent)); // Safari 5.1+, Chrome 10+
background-image: -moz-linear-gradient(left, @start-color @start-percent, @end-color @end-percent); // FF 3.6+
//
// Creates two color stops, start and end, by specifying a color and position for each color stop.
// Color stops are not available in IE9 and below.
- .vertical(@start-color: #555; @start-percent: 0%; @end-color: #333; @end-percent: 100%) {
- background-color: @end-color;
+ .vertical(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) {
background-image: -webkit-gradient(linear, left @start-percent, left @end-percent, from(@start-color), to(@end-color)); // Safari 4+, Chrome 2+
background-image: -webkit-linear-gradient(top, @start-color, @start-percent, @end-color, @end-percent); // Safari 5.1+, Chrome 10+
background-image: -moz-linear-gradient(top, @start-color @start-percent, @end-color @end-percent); // FF 3.6+
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start-color),argb(@end-color))); // IE9 and down
}
- .directional(@start-color: #555, @end-color: #333, @deg: 45deg) {
- background-color: @end-color;
+ .directional(@start-color: #555; @end-color: #333; @deg: 45deg) {
background-repeat: repeat-x;
background-image: -webkit-linear-gradient(@deg, @start-color, @end-color); // Safari 5.1+, Chrome 10+
background-image: -moz-linear-gradient(@deg, @start-color, @end-color); // FF 3.6+
background-image: linear-gradient(@deg, @start-color, @end-color); // Standard, IE10
}
- .horizontal-three-colors(@start-color: #00b3ee, @mid-color: #7a43b6, @color-stop: 50%, @end-color: #c3325f) {
- background-color: mix(@mid-color, @end-color, 80%);
+ .horizontal-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) {
background-image: -webkit-gradient(left, linear, 0 0, 0 100%, from(@start-color), color-stop(@color-stop, @mid-color), to(@end-color));
background-image: -webkit-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color);
background-image: -moz-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color);
background-repeat: no-repeat;
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback
}
-
- .vertical-three-colors(@start-color: #00b3ee, @mid-color: #7a43b6, @color-stop: 50%, @end-color: #c3325f) {
- background-color: mix(@mid-color, @end-color, 80%);
+ .vertical-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) {
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@start-color), color-stop(@color-stop, @mid-color), to(@end-color));
background-image: -webkit-linear-gradient(@start-color, @mid-color @color-stop, @end-color);
background-image: -moz-linear-gradient(top, @start-color, @mid-color @color-stop, @end-color);
background-repeat: no-repeat;
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback
}
- .radial(@inner-color: #555, @outer-color: #333) {
- background-color: @outer-color;
+ .radial(@inner-color: #555; @outer-color: #333) {
background-image: -webkit-gradient(radial, center center, 0, center center, 460, from(@inner-color), to(@outer-color));
background-image: -webkit-radial-gradient(circle, @inner-color, @outer-color);
background-image: -moz-radial-gradient(circle, @inner-color, @outer-color);
background-image: radial-gradient(circle, @inner-color, @outer-color);
background-repeat: no-repeat;
}
- .striped(@color: #555, @angle: 45deg) {
- background-color: @color;
+ .striped(@color: #555; @angle: 45deg) {
background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255,255,255,.15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255,255,255,.15)), color-stop(.75, rgba(255,255,255,.15)), color-stop(.75, transparent), to(transparent));
background-image: -webkit-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
background-image: -moz-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
-// RETINA IMAGE SUPPORT
-// --------------------------------------------------
-
+// Retina images
+//
// Short retina mixin for setting background-image and -size
-.img-retina(@file-1x, @file-2x, @width-1x, @height-1x) {
+
+.img-retina(@file-1x; @file-2x; @width-1x; @height-1x) {
background-image: url("@{file-1x}");
@media
}
+// Responsive image
+//
+// Keep images from scaling beyond the width of their parents.
+
+.img-responsive(@display: block;) {
+ display: @display;
+ max-width: 100%; // Part 1: Set a maximum relative to the parent
+ height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
+}
+
+
// COMPONENT MIXINS
// --------------------------------------------------
background-color: @color;
}
+// Panels
+// -------------------------
+.panel-variant(@border; @heading-text-color; @heading-bg-color; @heading-border) {
+ border-color: @border;
+ & > .panel-heading {
+ color: @heading-text-color;
+ background-color: @heading-bg-color;
+ border-color: @heading-border;
+ + .panel-collapse .panel-body {
+ border-top-color: @border;
+ }
+ }
+ & > .panel-footer {
+ + .panel-collapse .panel-body {
+ border-bottom-color: @border;
+ }
+ }
+}
+
// Alerts
// -------------------------
-.alert-variant(@background, @border, @text-color) {
+.alert-variant(@background; @border; @text-color) {
background-color: @background;
border-color: @border;
color: @text-color;
}
}
-// Button pseudo states
+// Tables
+// -------------------------
+.table-row-variant(@state; @background; @border) {
+ // Exact selectors below required to override `.table-striped` and prevent
+ // inheritance to nested tables.
+ .table > thead > tr,
+ .table > tbody > tr,
+ .table > tfoot > tr {
+ > td.@{state},
+ > th.@{state},
+ &.@{state} > td,
+ &.@{state} > th {
+ background-color: @background;
+ border-color: @border;
+ }
+ }
+
+ // Hover states for `.table-hover`
+ // Note: this is not available for cells or rows within `thead` or `tfoot`.
+ .table-hover > tbody > tr {
+ > td.@{state}:hover,
+ > th.@{state}:hover,
+ &.@{state}:hover > td {
+ background-color: darken(@background, 5%);
+ border-color: darken(@border, 5%);
+ }
+ }
+}
+
+// Button variants
// -------------------------
// Easily pump out default styles, as well as :hover, :focus, :active,
// and disabled options for all buttons
-.btn-pseudo-states(@color, @background, @border) {
+.button-variant(@color; @background; @border) {
color: @color;
background-color: @background;
border-color: @border;
&:hover,
&:focus,
&:active,
- &.active {
- background-color: darken(@background, 5%);
- border-color: darken(@border, 10%);
+ &.active,
+ .open .dropdown-toggle& {
+ color: @color;
+ background-color: darken(@background, 8%);
+ border-color: darken(@border, 12%);
+ }
+ &:active,
+ &.active,
+ .open .dropdown-toggle& {
+ background-image: none;
}
-
&.disabled,
&[disabled],
fieldset[disabled] & {
}
}
+// Button sizes
+// -------------------------
+.button-size(@padding-vertical; @padding-horizontal; @font-size; @line-height; @border-radius) {
+ padding: @padding-vertical @padding-horizontal;
+ font-size: @font-size;
+ line-height: @line-height;
+ border-radius: @border-radius;
+}
+
+// Pagination
+// -------------------------
+.pagination-size(@padding-vertical; @padding-horizontal; @font-size; @border-radius) {
+ > li {
+ > a,
+ > span {
+ padding: @padding-vertical @padding-horizontal;
+ font-size: @font-size;
+ }
+ &:first-child {
+ > a,
+ > span {
+ .border-left-radius(@border-radius);
+ }
+ }
+ &:last-child {
+ > a,
+ > span {
+ .border-right-radius(@border-radius);
+ }
+ }
+ }
+}
+
// Labels
// -------------------------
.label-variant(@color) {
// Navbar vertical align
// -------------------------
// Vertically center elements in the navbar.
-// Example: an element has a height of 30px, so write out `.navbarVerticalAlign(30px);` to calculate the appropriate top margin.
+// Example: an element has a height of 30px, so write out `.navbar-vertical-align(30px);` to calculate the appropriate top margin.
.navbar-vertical-align(@element-height) {
margin-top: ((@navbar-height - @element-height) / 2);
margin-bottom: ((@navbar-height - @element-height) / 2);
}
// Creates a wrapper for a series of columns
-.make-row() {
+.make-row(@gutter: @grid-gutter-width) {
// Then clear the floated columns
.clearfix();
- @media (min-width: @screen-small) {
- margin-left: (@grid-gutter-width / -2);
- margin-right: (@grid-gutter-width / -2);
+ .container & {
+ @media (min-width: @screen-small) {
+ margin-left: (@gutter / -2);
+ margin-right: (@gutter / -2);
+ }
}
// Negative margin nested rows out to align the content of columns
.row {
- margin-left: (@grid-gutter-width / -2);
- margin-right: (@grid-gutter-width / -2);
+ margin-left: (@gutter / -2);
+ margin-right: (@gutter / -2);
+ }
+}
+
+// Generate the extra small columns
+.make-xs-column(@columns; @gutter: @grid-gutter-width) {
+ position: relative;
+ float: left;
+ width: percentage((@columns / @grid-columns));
+ // Prevent columns from collapsing when empty
+ min-height: 1px;
+ // Inner gutter via padding
+ padding-left: (@gutter / 2);
+ padding-right: (@gutter / 2);
+}
+
+// Generate the small columns
+.make-sm-column(@columns; @gutter: @grid-gutter-width) {
+ position: relative;
+ // Prevent columns from collapsing when empty
+ min-height: 1px;
+ // Inner gutter via padding
+ padding-left: (@gutter / 2);
+ padding-right: (@gutter / 2);
+
+ // Calculate width based on number of columns available
+ @media (min-width: @screen-small) {
+ float: left;
+ width: percentage((@columns / @grid-columns));
+ }
+}
+
+// Generate the small column offsets
+.make-sm-column-offset(@columns) {
+ @media (min-width: @screen-small) {
+ margin-left: percentage((@columns / @grid-columns));
+ }
+}
+.make-sm-column-push(@columns) {
+ @media (min-width: @screen-small) {
+ left: percentage((@columns / @grid-columns));
+ }
+}
+.make-sm-column-pull(@columns) {
+ @media (min-width: @screen-small) {
+ right: percentage((@columns / @grid-columns));
}
}
-// Generate the columns
-.make-column(@columns) {
+// Generate the medium columns
+.make-md-column(@columns; @gutter: @grid-gutter-width) {
position: relative;
// Prevent columns from collapsing when empty
min-height: 1px;
// Inner gutter via padding
- padding-left: (@grid-gutter-width / 2);
- padding-right: (@grid-gutter-width / 2);
+ padding-left: (@gutter / 2);
+ padding-right: (@gutter / 2);
// Calculate width based on number of columns available
- @media (min-width: @grid-float-breakpoint) {
+ @media (min-width: @screen-medium) {
float: left;
width: percentage((@columns / @grid-columns));
}
}
-// Generate the column offsets
-.make-column-offset(@columns) {
- @media (min-width: @grid-float-breakpoint) {
+// Generate the large column offsets
+.make-md-column-offset(@columns) {
+ @media (min-width: @screen-medium) {
margin-left: percentage((@columns / @grid-columns));
}
}
-.make-column-push(@columns) {
- @media (min-width: @grid-float-breakpoint) {
+.make-md-column-push(@columns) {
+ @media (min-width: @screen-medium) {
left: percentage((@columns / @grid-columns));
}
}
-.make-column-pull(@columns) {
- @media (min-width: @grid-float-breakpoint) {
+.make-md-column-pull(@columns) {
+ @media (min-width: @screen-medium) {
right: percentage((@columns / @grid-columns));
}
}
-// Generate the small columns
-.make-small-column(@columns) {
+// Generate the large columns
+.make-lg-column(@columns; @gutter: @grid-gutter-width) {
position: relative;
- float: left;
// Prevent columns from collapsing when empty
min-height: 1px;
// Inner gutter via padding
- padding-left: (@grid-gutter-width / 2);
- padding-right: (@grid-gutter-width / 2);
- @max-width: (@grid-float-breakpoint - 1);
+ padding-left: (@gutter / 2);
+ padding-right: (@gutter / 2);
// Calculate width based on number of columns available
- @media (max-width: @max-width) {
+ @media (min-width: @screen-large) {
+ float: left;
width: percentage((@columns / @grid-columns));
}
}
+// Generate the large column offsets
+.make-lg-column-offset(@columns) {
+ @media (min-width: @screen-large) {
+ margin-left: percentage((@columns / @grid-columns));
+ }
+}
+.make-lg-column-push(@columns) {
+ @media (min-width: @screen-large) {
+ left: percentage((@columns / @grid-columns));
+ }
+}
+.make-lg-column-pull(@columns) {
+ @media (min-width: @screen-large) {
+ right: percentage((@columns / @grid-columns));
+ }
+}
+
// Form validation states
//
// Used in forms.less to generate the form validation CSS for warnings, errors,
// and successes.
-.form-control-validation(@text-color: #555, @border-color: #ccc, @background-color: #f5f5f5) {
+.form-control-validation(@text-color: #555; @border-color: #ccc; @background-color: #f5f5f5) {
// Color the label and help text
.help-block,
.control-label {
}
// Set the border and box shadow on specific inputs to match
.form-control {
- padding-right: 32px; // to account for the feedback icon
border-color: @border-color;
.box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work
&:focus {
background-color: @background-color;
}
}
+
+// Form control focus state
+//
+// Generate a customized focus state and for any input with the specified color,
+// which defaults to the `@input-focus-border` variable.
+//
+// We highly encourage you to not customize the default value, but instead use
+// this to tweak colors on an as-needed basis. This aesthetic change is based on
+// WebKit's default styles, but applicable to a wider range of browsers. Its
+// usability and accessibility should be taken into account with any change.
+//
+// Example usage: change the default blue border and shadow to white for better
+// contrast against a dark gray background.
+
+.form-control-focus(@color: @input-border-focus) {
+ @color-rgba: rgba(red(@color), green(@color), blue(@color), .6);
+ &:focus {
+ border-color: @color;
+ outline: 0;
+ .box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px @{color-rgba}");
+ }
+}
+
+// Form control sizing
+//
+// Relative text size, padding, and border-radii changes for form controls. For
+// horizontal sizing, wrap controls in the predefined grid classes. `<select>`
+// element gets special love because it's special, and that's a fact!
+
+.input-size(@input-height; @padding-vertical; @padding-horizontal; @font-size; @line-height; @border-radius) {
+ height: @input-height;
+ padding: @padding-vertical @padding-horizontal;
+ font-size: @font-size;
+ line-height: @line-height;
+ border-radius: @border-radius;
+
+ select& {
+ height: @input-height;
+ line-height: @input-height;
+ }
+
+ textarea& {
+ height: auto;
+ }
+}
.translate(0, -25%);
.transition-transform(~"0.3s ease-out");
}
- &.fade.in .modal-dialog { .translate(0, 0)}
+ &.in .modal-dialog { .translate(0, 0)}
}
// Shell div to position the modal with bottom padding
.modal-dialog {
- position: relative;
- top: 0;
- left: 0;
- right: 0;
+ margin-left: auto;
+ margin-right: auto;
width: auto;
padding: 10px;
z-index: (@zindex-modal-background + 10);
border: 1px solid @modal-content-border-color;
border-radius: @border-radius-large;
.box-shadow(0 3px 9px rgba(0,0,0,.5));
- .background-clip(padding-box);
+ background-clip: padding-box;
// Remove focus outline from opened modal
outline: none;
}
background-color: @modal-backdrop-bg;
// Fade for backdrop
&.fade { .opacity(0); }
- &.fade.in { .opacity(.5); }
+ &.in { .opacity(.5); }
}
// Modal header
.modal-dialog {
left: 50%;
right: auto;
- width: 560px;
- margin-left: -280px;
+ width: 600px;
padding-top: 30px;
padding-bottom: 30px;
}
// Navbars
// --------------------------------------------------
+
// Wrapper and base class
+//
+// Provide a static navbar from which we expand to create full-width, fixed, and
+// other navbar variations.
+
.navbar {
position: relative;
min-height: @navbar-height; // Ensure a navbar always shows (e.g., without a .navbar-brand in collapsed mode)
- margin-bottom: 20px;
- padding-left: @navbar-padding-horizontal;
- padding-right: @navbar-padding-horizontal;
+ margin-bottom: @navbar-margin-bottom;
background-color: @navbar-bg;
- border-radius: @border-radius-base;
+ border: 1px solid @navbar-border;
// Prevent floats from breaking the navbar
.clearfix();
+
+ @media (min-width: @grid-float-breakpoint) {
+ border-radius: @navbar-border-radius;
+ }
}
-// Navbar nav links
-// -------------------------
-.navbar-nav {
- // Space out from .navbar .brand and .btn-navbar when stacked in mobile views
- margin-top: 10px;
- margin-bottom: 15px;
+// Navbar heading
+//
+// Groups `.navbar-brand` and `.navbar-toggle` into a single component for easy
+// styling of responsive aspects.
- > li > a {
- padding-top: ((@navbar-height - @line-height-computed) / 2);
- padding-bottom: ((@navbar-height - @line-height-computed) / 2);
- color: @navbar-link-color;
- line-height: 20px;
- border-radius: @border-radius-base;
- &:hover,
- &:focus {
- color: @navbar-link-hover-color;
- background-color: @navbar-link-hover-bg;
- }
+.navbar-header {
+ padding-left: @navbar-padding-horizontal;
+ padding-right: @navbar-padding-horizontal;
+ .clearfix();
+
+ @media (min-width: @grid-float-breakpoint) {
+ float: left;
}
- > .active > a {
- &,
- &:hover,
- &:focus {
- color: @navbar-link-active-color;
- background-color: @navbar-link-active-bg;
- }
+}
+
+
+// Navbar collapse (body)
+//
+// Group your navbar content into this for easy collapsing and expanding across
+// various device sizes. By default, this content is collapsed when <768px, but
+// will expand past that for a horizontal display.
+//
+// To start (on mobile devices) the navbar links, forms, and buttons are stacked
+// vertically and include a `max-height` to overflow in case you have too much
+// content for the user's viewport.
+
+.navbar-collapse {
+ max-height: 340px;
+ overflow-x: visible;
+ padding-right: @navbar-padding-horizontal;
+ padding-left: @navbar-padding-horizontal;
+ border-top: 1px solid darken(@navbar-bg, 7%);
+ box-shadow: inset 0 1px 0 rgba(255,255,255,.1);
+ .clearfix();
+ -webkit-overflow-scrolling: touch;
+
+ &.in {
+ overflow-y: auto;
}
- > .disabled > a {
- &,
- &:hover,
- &:focus {
- color: @navbar-link-disabled-color;
- background-color: @navbar-link-disabled-bg;
+
+ @media (min-width: @grid-float-breakpoint) {
+ width: auto;
+ padding-right: 0;
+ padding-left: 0;
+ border-top: 0;
+ box-shadow: none;
+
+ &.collapse {
+ display: block !important;
+ height: auto !important;
+ padding-bottom: 0; // Override default setting
+ overflow: visible !important;
}
- }
- // Right aligned contents
- // Make them full width first so that they align properly on mobile
- &.pull-right {
- width: 100%;
+ &.in {
+ overflow-y: visible;
+ }
}
}
-
//
// Navbar alignment options
-// --------------------------------------------------
+//
+// Display the navbar across the entirity of the page or fixed it to the top or
+// bottom of the page.
-// Static navbar
+// Static top (unfixed, but 100% wide) navbar
.navbar-static-top {
- border-radius: 0;
+ border-width: 0 0 1px;
+ @media (min-width: @grid-float-breakpoint) {
+ border-radius: 0;
+ }
}
// Fix the top/bottom navbars when screen real estate supports it
right: 0;
left: 0;
z-index: @zindex-navbar-fixed;
- border-radius: 0;
+ border-width: 0 0 1px;
+
+ // Undo the rounded corners
+ @media (min-width: @grid-float-breakpoint) {
+ border-radius: 0;
+ }
}
.navbar-fixed-top {
top: 0;
}
-
-//
-// Navbar optional components
-// --------------------------------------------------
-
// Brand/project name
+
.navbar-brand {
- display: block;
- max-width: 200px;
- margin-left: auto;
- margin-right: auto;
- padding: @navbar-padding-vertical @navbar-padding-horizontal;
+ float: left;
+ padding-top: @navbar-padding-vertical;
+ padding-bottom: @navbar-padding-vertical;
font-size: @font-size-large;
- font-weight: 500;
line-height: @line-height-computed;
color: @navbar-brand-color;
- text-align: center;
&:hover,
&:focus {
color: @navbar-brand-hover-color;
}
}
-// Collapsible navbar toggle
+
+// Navbar toggle
+//
+// Custom button for toggling the `.navbar-collapse`, powered by the collapse
+// JavaScript plugin.
+
.navbar-toggle {
- position: absolute;
- top: floor((@navbar-height - 32) / 2);
- right: 10px;
- width: 48px;
- height: 32px;
- padding: 8px 12px;
+ position: relative;
+ float: right;
+ padding: 9px 10px;
+ .navbar-vertical-align(34px);
background-color: transparent;
border: 1px solid @navbar-toggle-border-color;
border-radius: @border-radius-base;
.icon-bar + .icon-bar {
margin-top: 4px;
}
+
+ @media (min-width: @grid-float-breakpoint) {
+ position: relative;
+ top: auto;
+ left: auto;
+ display: none;
+ }
}
+
+// Navbar nav links
+//
+// Builds on top of the `.nav` components with it's own modifier class to make
+// the nav the full height of the horizontal nav (above 768px).
+
+.navbar-nav {
+ margin: (@navbar-padding-vertical / 2) -@navbar-padding-horizontal;
+
+ > li > a {
+ padding-top: 10px;
+ padding-bottom: 10px;
+ color: @navbar-link-color;
+ line-height: @line-height-computed;
+ &:hover,
+ &:focus {
+ color: @navbar-link-hover-color;
+ background-color: @navbar-link-hover-bg;
+ }
+ }
+ > .active > a {
+ &,
+ &:hover,
+ &:focus {
+ color: @navbar-link-active-color;
+ background-color: @navbar-link-active-bg;
+ }
+ }
+ > .disabled > a {
+ &,
+ &:hover,
+ &:focus {
+ color: @navbar-link-disabled-color;
+ background-color: @navbar-link-disabled-bg;
+ }
+ }
+
+ @media (max-width: @screen-phone-max) {
+ // Dropdowns get custom display when collapsed
+ .open .dropdown-menu {
+ position: static;
+ float: none;
+ width: auto;
+ margin-top: 0;
+ background-color: transparent;
+ border: 0;
+ box-shadow: none;
+ > li > a,
+ .dropdown-header {
+ padding: 5px 15px 5px 25px;
+ }
+ > li > a {
+ color: @navbar-link-color;
+ line-height: @line-height-computed;
+ &:hover,
+ &:focus {
+ color: @navbar-link-hover-color;
+ background-color: @navbar-link-hover-bg;
+ background-image: none;
+ }
+ }
+ > .active > a {
+ &,
+ &:hover,
+ &:focus {
+ color: @navbar-link-active-color;
+ background-color: @navbar-link-active-bg;
+ }
+ }
+ > .disabled > a {
+ &,
+ &:hover,
+ &:focus {
+ color: @navbar-link-disabled-color;
+ background-color: @navbar-link-disabled-bg;
+ }
+ }
+ }
+ }
+
+ // Uncollapse the nav
+ @media (min-width: @grid-float-breakpoint) {
+ float: left;
+ margin: 0;
+
+ > li {
+ float: left;
+ > a {
+ padding-top: ((@navbar-height - @line-height-computed) / 2);
+ padding-bottom: ((@navbar-height - @line-height-computed) / 2);
+ }
+ }
+ }
+
+}
+
+
+// Component alignment
+//
+// Repurpose the pull utilities as their own navbar utilities to avoid specifity
+// issues with parents and chaining. Only do this when the navbar is uncollapsed
+// though so that navbar contents properly stack and align in mobile.
+
+@media (min-width: @grid-float-breakpoint) {
+ .navbar-left { .pull-left(); }
+ .navbar-right {
+ .pull-right();
+ .dropdown-menu {
+ .pull-right > .dropdown-menu();
+ }
+ }
+}
+
+
// Navbar form
+//
+// Extension of the `.form-inline` with some extra flavor for optimum display in
+// our navbars.
+
.navbar-form {
+ margin-left: -@navbar-padding-horizontal;
+ margin-right: -@navbar-padding-horizontal;
+ padding: 10px @navbar-padding-horizontal;
+ border-top: 1px solid darken(@navbar-bg, 7%);
+ border-bottom: 1px solid darken(@navbar-bg, 7%);
+ @shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1);
+ .box-shadow(@shadow);
+
+ // Mixin behavior for optimum display
.form-inline();
- .navbar-vertical-align(@input-height-base); // Vertically center in navbar
+
+ .form-group {
+ @media (max-width: @screen-phone-max) {
+ margin-bottom: 5px;
+ }
+ }
+
+ // Vertically center in expanded, horizontal navbar
+ .navbar-vertical-align(@input-height-base);
+
+ // Undo 100% width for pull classes
+ @media (min-width: @grid-float-breakpoint) {
+ width: auto;
+ border: 0;
+ margin-left: 0;
+ margin-right: 0;
+ padding-top: 0;
+ padding-bottom: 0;
+ .box-shadow(none);
+ }
}
+
// Dropdown menus
// Menu position and menu carets
.navbar-nav > li > .dropdown-menu {
margin-top: 0;
- border-top-left-radius: 0;
- border-top-right-radius: 0;
+ .border-top-radius(0);
}
// Menu position and menu caret support for dropups via extra dropup class
.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu {
- border-bottom-left-radius: 0;
- border-bottom-right-radius: 0;
+ .border-bottom-radius(0);
}
// Dropdown menu items and carets
}
+// Buttons in navbars
+//
+// Vertically center a button within a navbar (when *not* in a form).
+
+.navbar-btn {
+ .navbar-vertical-align(@input-height-base);
+}
+
+
+// Text in navbars
+//
+// Add a class to make any element properly align itself vertically within the navbars.
+
+.navbar-text {
+ float: left;
+ color: @navbar-color;
+ .navbar-vertical-align(@line-height-computed);
+
+ @media (min-width: @grid-float-breakpoint) {
+ margin-left: @navbar-padding-horizontal;
+ margin-right: @navbar-padding-horizontal;
+ }
+}
+
+
+// Links in navbars
+//
+// Add a class to ensure links outside the navbar nav are colored correctly.
+
+// Default navbar variables
+.navbar-link {
+ color: @navbar-link-color;
+ &:hover {
+ color: @navbar-link-hover-color;
+ }
+}
+
// Inverse navbar
// --------------------------------------------------
.navbar-inverse {
background-color: @navbar-inverse-bg;
+ border-color: @navbar-inverse-border;
.navbar-brand {
color: @navbar-inverse-brand-color;
}
}
+ .navbar-collapse,
+ .navbar-form {
+ border-color: darken(@navbar-inverse-bg, 7%);
+ }
+
// Dropdowns
.navbar-nav {
> .open > a {
}
}
}
- }
-}
-
-
-// Responsive navbar
-// --------------------------------------------------
-
-@media screen and (min-width: @grid-float-breakpoint) {
-
- .navbar-brand {
- float: left;
- margin-left: -(@navbar-padding-horizontal);
- margin-right: 5px;
- }
- .navbar-nav {
- float: left;
- // undo margin to make nav extend full height of navbar
- margin-top: 0;
- margin-bottom: 0;
-
- > li {
- float: left;
- > a {
- border-radius: 0;
+ @media (max-width: @screen-phone-max) {
+ // Dropdowns get custom display
+ .open .dropdown-menu {
+ > .dropdown-header {
+ border-color: @navbar-inverse-border;
+ }
+ > li > a {
+ color: @navbar-inverse-link-color;
+ &:hover,
+ &:focus {
+ color: @navbar-inverse-link-hover-color;
+ background-color: @navbar-inverse-link-hover-bg;
+ }
+ }
+ > .active > a {
+ &,
+ &:hover,
+ &:focus {
+ color: @navbar-inverse-link-active-color;
+ background-color: @navbar-inverse-link-active-bg;
+ }
+ }
+ > .disabled > a {
+ &,
+ &:hover,
+ &:focus {
+ color: @navbar-inverse-link-disabled-color;
+ background-color: @navbar-inverse-link-disabled-bg;
+ }
+ }
}
}
-
- &.pull-right {
- float: right;
- width: auto;
- }
}
- // Required to make the collapsing navbar work on regular desktops
- .navbar-toggle {
- position: relative;
- top: auto;
- left: auto;
- display: none;
- }
- .nav-collapse.collapse {
- display: block !important;
- height: auto !important;
- overflow: visible !important;
- }
-
-}
-
-
-
-// Buttons in navbars
-//
-// Vertically center a button within a navbar (when *not* in a form).
-
-.navbar-btn {
- margin-top: ((@navbar-height - @input-height-base) / 2);
-}
-
-
-
-// Text in navbars
-//
-// Add a class to make any element properly align itself vertically within the navbars.
-
-.navbar-text {
- .navbar-vertical-align(@line-height-computed);
-}
-
-
-
-// Links in navbars
-//
-// Add a class to ensure links outside the navbar nav are colored correctly.
-
-// Default navbar variables
-.navbar-link {
- color: @navbar-link-color;
- &:hover {
- color: @navbar-link-hover-color;
+ .navbar-link {
+ color: @navbar-inverse-link-color;
+ &:hover {
+ color: @navbar-inverse-link-hover-color;
+ }
}
-}
-// Use the inverse navbar variables
-.navbar-inverse .navbar-link {
- color: @navbar-inverse-link-color;
- &:hover {
- color: @navbar-inverse-link-hover-color;
- }
}
> a {
position: relative;
display: block;
- padding: 10px 15px;
+ padding: @nav-link-padding;
&:hover,
&:focus {
text-decoration: none;
cursor: not-allowed;
}
}
-
- // Space the headers out when they follow another list item (link)
- + .nav-header {
- margin-top: 9px;
- }
}
// Open dropdowns
- &.open > a {
+ .open > a {
&,
&:hover,
&:focus {
- color: @nav-open-link-hover-color;
- background-color: @link-color;
+ background-color: @nav-link-hover-bg;
border-color: @link-color;
- .caret {
- border-top-color: @nav-open-caret-border-color;
- border-bottom-color: @nav-open-caret-border-color;
- }
}
}
- // Redeclare pull classes because of specificity
- // Todo: consider making these utilities !important to avoid this bullshit
- > .pull-right {
- float: right;
- }
-
// Dividers (basically an hr) within the dropdown
.nav-divider {
.nav-divider();
}
-}
-
+ // Prevent IE8 from misplacing imgs
+ // See https://github.com/h5bp/html5-boilerplate/issues/984#issuecomment-3985989
+ > li > a > img {
+ max-width: none;
+ }
+}
-// Nav variations
-// --------------------------------------------------
// Tabs
// -------------------------
border: 1px solid transparent;
border-radius: @border-radius-base @border-radius-base 0 0;
&:hover {
- border-color: @nav-tabs-link-hover-border-color;
+ border-color: @nav-tabs-link-hover-border-color @nav-tabs-link-hover-border-color @nav-tabs-border-color;
}
}
> li {
float: none;
+ li {
- > a {
- margin-top: 2px;
- margin-left: 0; // no need for this gap between nav items
- }
+ margin-top: 2px;
+ margin-left: 0; // no need for this gap between nav items
}
}
}
+
+// Nav variations
+// --------------------------------------------------
+
// Justified nav links
// -------------------------
.nav-justified {
width: 100%;
+
> li {
float: none;
- display: table-cell;
- width: 1%;
- > a {
+ > a {
text-align: center;
}
}
+
+ @media (min-width: @screen-small) {
+ > li {
+ display: table-cell;
+ width: 1%;
+ }
+ }
}
// Move borders to anchors instead of bottom of list
> .active > a {
border-bottom-color: @nav-tabs-justified-active-link-border-color;
}
-
}
-
// Tabbable tabs
// -------------------------
padding-left: 0;
margin: @line-height-computed 0;
border-radius: @border-radius-base;
-
+
> li {
display: inline; // Remove list-style and block-level defaults
> a,
> span {
+ position: relative;
float: left; // Collapse white-space
- padding: 4px 12px;
+ padding: @padding-base-vertical @padding-base-horizontal;
line-height: @line-height-base;
text-decoration: none;
background-color: @pagination-bg;
border: 1px solid @pagination-border;
- border-left-width: 0;
+ margin-left: -1px;
}
&:first-child {
> a,
> span {
- border-left-width: 1px;
+ margin-left: 0;
.border-left-radius(@border-radius-base);
}
}
}
}
}
-
- > li > a:hover,
- > li > a:focus,
- > .active > a,
- > .active > span {
- background-color: @pagination-active-bg;
+
+ > li > a,
+ > li > span {
+ &:hover,
+ &:focus {
+ background-color: @pagination-hover-bg;
+ }
}
+
> .active > a,
> .active > span {
- color: @pagination-active-color;
- cursor: default;
+ &,
+ &:hover,
+ &:focus {
+ z-index: 2;
+ color: @pagination-active-color;
+ background-color: @pagination-active-bg;
+ border-color: @pagination-active-bg;
+ cursor: default;
+ }
}
-
+
> .disabled {
> span,
> a,
> a:focus {
color: @pagination-disabled-color;
background-color: @pagination-bg;
+ border-color: @pagination-border;
cursor: not-allowed;
}
}
// --------------------------------------------------
// Large
-.pagination-large {
- > li {
- > a,
- > span {
- padding: @padding-large-vertical @padding-large-horizontal;
- font-size: @font-size-large;
- }
- &:first-child {
- > a,
- > span {
- .border-left-radius(@border-radius-large);
- }
- }
- &:last-child {
- > a,
- > span {
- .border-right-radius(@border-radius-large);
- }
- }
- }
+.pagination-lg {
+ .pagination-size(@padding-large-vertical; @padding-large-horizontal; @font-size-large; @border-radius-large);
}
// Small
-.pagination-small {
- > li {
- > a,
- > span {
- padding: @padding-small-vertical @padding-small-horizontal;
- font-size: @font-size-small;
- }
- &:first-child {
- > a,
- > span {
- .border-left-radius(@border-radius-small);
- }
- }
- &:last-child {
- > a,
- > span {
- .border-right-radius(@border-radius-small);
- }
- }
- }
+.pagination-sm {
+ .pagination-size(@padding-small-vertical; @padding-small-horizontal; @font-size-small; @border-radius-small);
}
// Base class
.panel {
- padding: 15px;
- margin-bottom: 20px;
+ margin-bottom: @line-height-computed;
background-color: @panel-bg;
border: 1px solid @panel-border;
border-radius: @panel-border-radius;
.box-shadow(0 1px 1px rgba(0,0,0,.05));
}
+// Panel contents
+.panel-body {
+ padding: 15px;
+}
+
+// List groups in panels
+//
+// By default, space out list group content from panel headings to account for
+// any kind of custom content between the two.
+
+.panel {
+ > .list-group {
+ margin-bottom: 0;
+
+ .list-group-item {
+ border-width: 1px 0;
+
+ // Remove border radius for top one
+ &:first-child {
+ .border-top-radius(0);
+ }
+ // But keep it for the last one
+ &:last-child {
+ border-bottom: 0;
+ }
+ }
+ }
+}
+// Collapse space between when there's no additional content.
+.panel-heading + .list-group {
+ .list-group-item:first-child {
+ border-top-width: 0;
+ }
+}
+
// Optional heading
.panel-heading {
- margin: -15px -15px 15px;
padding: 10px 15px;
background-color: @panel-heading-bg;
border-bottom: 1px solid @panel-border;
- border-top-left-radius: (@panel-border-radius - 1);
- border-top-right-radius: (@panel-border-radius - 1);
+ .border-top-radius(@panel-border-radius - 1);
}
// Within heading, strip any `h*` tag of it's default margins for spacing.
margin-top: 0;
margin-bottom: 0;
font-size: (@font-size-base * 1.25);
- font-weight: 500;
+ > a {
+ color: inherit;
+ }
}
// Optional footer (stays gray in every modifier class)
.panel-footer {
- margin: 15px -15px -15px;
padding: 10px 15px;
background-color: @panel-footer-bg;
border-top: 1px solid @panel-border;
- border-bottom-left-radius: (@panel-border-radius - 1);
- border-bottom-right-radius: (@panel-border-radius - 1);
+ .border-bottom-radius(@panel-border-radius - 1);
}
-// Contextual variations
-.panel-primary {
- border-color: @panel-primary-border;
+
+// Collapsable panels (aka, accordion)
+//
+// Wrap a series of panels in `.panel-group` to turn them into an accordion with
+// the help of our collapse JavaScript plugin.
+
+.panel-group {
+ // Tighten up margin so it's only between panels
+ .panel {
+ margin-bottom: 0;
+ border-radius: @panel-border-radius;
+ overflow: hidden; // crop contents when collapsed
+ + .panel {
+ margin-top: 5px;
+ }
+ }
+
.panel-heading {
- color: @panel-primary-text;
- background-color: @panel-primary-heading-bg;
- border-color: @panel-primary-border;
+ border-bottom: 0;
+ + .panel-collapse .panel-body {
+ border-top: 1px solid @panel-border;
+ }
+ }
+ .panel-footer {
+ border-top: 0;
+ + .panel-collapse .panel-body {
+ border-bottom: 1px solid @panel-border;
+ }
+ }
+
+ // New subcomponent for wrapping collapsable content for proper animations
+ .panel-collapse {
+
}
}
+
+
+// Contextual variations
+.panel-primary {
+ .panel-variant(@panel-primary-border; @panel-primary-text; @panel-primary-heading-bg; @panel-primary-border);
+}
.panel-success {
- border-color: @panel-success-border;
- .panel-heading {
- color: @panel-success-text;
- background-color: @panel-success-heading-bg;
- border-color: @panel-success-border;
- }
+ .panel-variant(@panel-success-border; @panel-success-text; @panel-success-heading-bg; @panel-success-border);
}
.panel-warning {
- border-color: @panel-warning-border;
- .panel-heading {
- color: @panel-warning-text;
- background-color: @panel-warning-heading-bg;
- border-color: @panel-warning-border;
- }
+ .panel-variant(@panel-warning-border; @panel-warning-text; @panel-warning-heading-bg; @panel-warning-border);
}
.panel-danger {
- border-color: @panel-danger-border;
- .panel-heading {
- color: @panel-danger-text;
- background-color: @panel-danger-heading-bg;
- border-color: @panel-danger-border;
- }
+ .panel-variant(@panel-danger-border; @panel-danger-text; @panel-danger-heading-bg; @panel-danger-border);
}
.panel-info {
- border-color: @panel-info-border;
- .panel-heading {
- color: @panel-info-text;
- background-color: @panel-info-heading-bg;
- border-color: @panel-info-border;
- }
-}
-
-// List groups in panels
-.list-group-flush {
- margin: 15px -15px -15px;
-
- .list-group-item {
- border-width: 1px 0;
-
- // Remove border radius for top one
- &:first-child {
- .border-top-radius(0);
- }
- // But keep it for the last one
- &:last-child {
- border-bottom: 0;
- }
- }
+ .panel-variant(@panel-info-border; @panel-info-text; @panel-info-heading-bg; @panel-info-border);
}
padding: 1px;
text-align: left; // Reset given new insertion method
background-color: @popover-bg;
- -webkit-bg-clip: padding-box;
- -moz-bg-clip: padding;
background-clip: padding-box;
border: 1px solid @popover-fallback-border-color;
border: 1px solid @popover-border-color;
to { background-position: 0 0; }
}
-// IE9
-@-ms-keyframes progress-bar-stripes {
- from { background-position: 40px 0; }
- to { background-position: 0 0; }
-}
-
// Opera
@-o-keyframes progress-bar-stripes {
from { background-position: 0 0; }
to { background-position: 40px 0; }
}
-// Spec
+// Spec and IE10+
@keyframes progress-bar-stripes {
from { background-position: 40px 0; }
to { background-position: 0 0; }
// Striped bars
.progress-striped .progress-bar {
#gradient > .striped(@progress-bar-bg);
- .background-size(40px 40px);
+ background-size: 40px 40px;
}
// Call animation for the active one
// Variations
// -------------------------
-// Danger (red)
-.progress-bar-danger {
- .progress-bar-variant(@progress-bar-danger-bg);
-}
-
-// Success (green)
.progress-bar-success {
.progress-bar-variant(@progress-bar-success-bg);
}
-// Warning (orange)
+.progress-bar-info {
+ .progress-bar-variant(@progress-bar-info-bg);
+}
+
.progress-bar-warning {
.progress-bar-variant(@progress-bar-warning-bg);
}
-// Info (teal)
-.progress-bar-info {
- .progress-bar-variant(@progress-bar-info-bg);
+.progress-bar-danger {
+ .progress-bar-variant(@progress-bar-danger-bg);
}
// Visibility utilities
-// For Phones
-.visible-sm {
+.visible-xs {
.responsive-visibility();
+ @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
+ .responsive-invisibility();
+ }
+ @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) {
+ .responsive-invisibility();
+ }
+ @media (min-width: @screen-large-desktop) {
+ .responsive-invisibility();
+ }
+}
+.visible-sm {
+ .responsive-invisibility();
+ @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
+ .responsive-visibility();
+ }
+ @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) {
+ .responsive-invisibility();
+ }
+ @media (min-width: @screen-large-desktop) {
+ .responsive-invisibility();
+ }
}
.visible-md {
.responsive-invisibility();
+ @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
+ .responsive-invisibility();
+ }
+ @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) {
+ .responsive-visibility();
+ }
+ @media (min-width: @screen-large-desktop) {
+ .responsive-invisibility();
+ }
}
.visible-lg {
.responsive-invisibility();
+ @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
+ .responsive-invisibility();
+ }
+ @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) {
+ .responsive-invisibility();
+ }
+ @media (min-width: @screen-large-desktop) {
+ .responsive-visibility();
+ }
}
-.hidden-sm {
+.hidden-xs {
.responsive-invisibility();
-}
-.hidden-md {
- .responsive-visibility();
-}
-.hidden-lg {
- .responsive-visibility();
-}
-
-
-// Tablets & small desktops only
-@media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
- .visible-sm {
- .responsive-invisibility();
- }
- .visible-md {
+ @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
.responsive-visibility();
}
- .visible-lg {
- .responsive-invisibility();
+ @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) {
+ .responsive-visibility();
}
-
- .hidden-sm {
+ @media (min-width: @screen-large-desktop) {
.responsive-visibility();
}
- .hidden-md {
+}
+.hidden-sm {
+ .responsive-visibility();
+ @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
.responsive-invisibility();
}
- .hidden-lg {
+ @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) {
+ .responsive-visibility();
+ }
+ @media (min-width: @screen-large-desktop) {
.responsive-visibility();
}
}
-
-// For desktops
-@media (min-width: @screen-desktop) {
- .visible-sm {
- .responsive-invisibility();
+.hidden-md {
+ .responsive-visibility();
+ @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
+ .responsive-visibility();
}
- .visible-md {
+ @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) {
.responsive-invisibility();
}
- .visible-lg {
+ @media (min-width: @screen-large-desktop) {
.responsive-visibility();
}
-
- .hidden-sm {
+}
+.hidden-lg {
+ .responsive-visibility();
+ @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) {
.responsive-visibility();
}
- .hidden-md {
+ @media (min-width: @screen-desktop) and (max-width: @screen-desktop-max) {
.responsive-visibility();
}
- .hidden-lg {
+ @media (min-width: @screen-large-desktop) {
.responsive-invisibility();
}
}
// Reset the box-sizing
// -------------------------
-* {
+*,
+*:before,
+*:after {
.box-sizing(border-box);
}
line-height: inherit;
}
+// Reset unusual Firefox-on-Android default style, see https://github.com/necolas/normalize.css/issues/214
+button,
+input,
+select[multiple],
+textarea {
+ background-image: none;
+}
+
// Links
// -------------------------
// Responsive images (ensure images don't scale beyond their parents)
.img-responsive {
- display: inline-block;
- max-width: 100%; // Part 1: Set a maximum relative to the parent
- height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
+ .img-responsive();
}
// Rounded corners
// Perfect circle
.img-circle {
- border-radius: 500px; // crank the border-radius so it works with most reasonably sized images
+ border-radius: 50%; // set radius in percents
}
border-top: 1px solid @hr-border;
}
+// Only display content to screen readers
+// See: http://a11yproject.com/posts/how-to-hide-content/
+// -------------------------
+
+.sr-only {
+ position: absolute;
+ width: 1px;
+ height: 1px;
+ margin: -1px;
+ padding: 0;
+ overflow: hidden;
+ clip: rect(0 0 0 0);
+ border: 0;
+}
> th.active,
&.active > td,
&.active > th {
- background-color: @table-bg-hover;
- }
- > td.success,
- > th.success,
- &.success > td,
- &.success > th {
- background-color: @state-success-bg;
- border-color: @state-success-border;
- }
- > td.danger,
- > th.danger,
- &.danger > td,
- &.danger > th {
- background-color: @state-danger-bg;
- border-color: @state-danger-border;
- }
- > td.warning,
- > th.warning,
- &.warning > td,
- &.warning > th {
- background-color: @state-warning-bg;
- border-color: @state-warning-border;
+ background-color: @table-bg-active;
}
}
-// Hover states for `.table-hover`
-// Note: this is not available for cells or rows within `thead` or `tfoot`.
-.table-hover > tbody > tr {
- > td.success:hover,
- > th.success:hover,
- &.success:hover > td {
- background-color: darken(@state-success-bg, 5%);
- border-color: darken(@state-success-border, 5%);
- }
- > td.danger:hover,
- > th.danger:hover,
- &.danger:hover > td {
- background-color: darken(@state-danger-bg, 5%);
- border-color: darken(@state-danger-border, 5%);
- }
- > td.warning:hover,
- > th.warning:hover,
- &.warning:hover > td {
- background-color: darken(@state-warning-bg, 5%);
- border-color: darken(@state-warning-border, 5%);
- }
-}
+// Contextual variants
+// -------------------
+.table-row-variant(success; @state-success-bg; @state-success-border);
+
+.table-row-variant(danger; @state-danger-bg; @state-danger-border);
+
+.table-row-variant(warning; @state-warning-bg; @state-warning-border);
// Can be `a`, `div`, or `img`
.thumbnail,
.img-thumbnail {
- padding: 4px;
+ padding: @thumbnail-padding;
line-height: @line-height-base;
background-color: @thumbnail-bg;
border: 1px solid @thumbnail-border;
.thumbnail {
display: block;
}
-.thumbnail > img,
-.img-thumbnail {
+.thumbnail > img {
.img-responsive();
}
+.img-thumbnail {
+ .img-responsive(inline-block);
+}
// Add a hover state for linked versions only
a.thumbnail:hover,
margin-right: auto;
}
.thumbnail .caption {
- padding: 9px;
+ padding: @thumbnail-caption-padding;
color: @thumbnail-caption-color;
}
line-height: 1.4;
.opacity(0);
- &.in { .opacity(1); }
+ &.in { .opacity(.9); }
&.top { margin-top: -3px; padding: 5px 0; }
&.right { margin-left: 3px; padding: 0 5px; }
&.bottom { margin-top: 3px; padding: 5px 0; }
dd {
margin-left: 0; // Undo browser default
}
-// Horizontal layout (like forms)
-.dl-horizontal {
- dt {
- float: left;
- width: (@component-offset-horizontal - 20);
- clear: left;
- text-align: right;
- .text-overflow();
- }
- dd {
- .clearfix(); // Clear the floated `dt` if an empty `dd` is present
- margin-left: @component-offset-horizontal;
+
+// Horizontal description lists
+//
+// Defaults to being stacked without any of the below styles applied, until the
+// grid breakpoint is reached (default of ~768px).
+
+@media (min-width: @grid-float-breakpoint) {
+ .dl-horizontal {
+ dt {
+ float: left;
+ width: (@component-offset-horizontal - 20);
+ clear: left;
+ text-align: right;
+ .text-overflow();
+ }
+ dd {
+ margin-left: @component-offset-horizontal;
+ .clearfix(); // Clear the floated `dt` if an empty `dd` is present
+ }
}
}
// Float right with text-align: right
&.pull-right {
- float: right;
padding-right: 15px;
padding-left: 0;
border-right: 5px solid @blockquote-border-color;
.clearfix();
}
.pull-right {
- float: right;
+ float: right !important;
}
.pull-left {
- float: left;
+ float: left !important;
}
// -------------------------
// Based on 14px font-size and 1.428 line-height (~20px to start)
-@padding-base-vertical: 8px;
+@padding-base-vertical: 6px;
@padding-base-horizontal: 12px;
-@padding-large-vertical: 14px;
+@padding-large-vertical: 10px;
@padding-large-horizontal: 16px;
@padding-small-vertical: 5px;
@padding-small-horizontal: 10px;
+@line-height-large: 1.33;
+@line-height-small: 1.5;
+
@border-radius-base: 4px;
@border-radius-large: 6px;
@border-radius-small: 3px;
@component-active-bg: @brand-primary;
+@caret-width-base: 4px;
+@caret-width-large: 5px;
// Tables
// -------------------------
// Buttons
// -------------------------
-@btn-default-color: #fff;
-@btn-default-bg: #474949;
-@btn-default-border: @btn-default-bg;
+@btn-font-weight: bold;
+
+@btn-default-color: #333;
+@btn-default-bg: #fff;
+@btn-default-border: #ccc;
-@btn-primary-color: @btn-default-color;
+@btn-primary-color: #fff;
@btn-primary-bg: @brand-primary;
-@btn-primary-border: @btn-primary-bg;
+@btn-primary-border: darken(@btn-primary-bg, 5%);
-@btn-success-color: @btn-default-color;
+@btn-success-color: #fff;
@btn-success-bg: @brand-success;
-@btn-success-border: @btn-success-bg;
+@btn-success-border: darken(@btn-success-bg, 5%);
-@btn-warning-color: @btn-default-color;
+@btn-warning-color: #fff;
@btn-warning-bg: @brand-warning;
-@btn-warning-border: @btn-warning-bg;
+@btn-warning-border: darken(@btn-warning-bg, 5%);
-@btn-danger-color: @btn-default-color;
+@btn-danger-color: #fff;
@btn-danger-bg: @brand-danger;
-@btn-danger-border: @btn-danger-bg;
+@btn-danger-border: darken(@btn-danger-bg, 5%);
-@btn-info-color: @btn-default-color;
+@btn-info-color: #fff;
@btn-info-bg: @brand-info;
-@btn-info-border: @btn-info-bg;
+@btn-info-border: darken(@btn-info-bg, 5%);
-@btn-hover-color: @btn-default-color;
+@btn-link-disabled-color: @gray-light;
// Forms
@input-bg: #fff;
@input-bg-disabled: @gray-lighter;
+@input-color: @gray;
@input-border: #ccc;
@input-border-radius: @border-radius-base;
+@input-border-focus: #66afe9;
@input-color-placeholder: @gray-light;
@input-height-base: (@line-height-computed + (@padding-base-vertical * 2) + 2);
-@input-height-large: (ceil(@font-size-large * @line-height-base) + (@padding-large-vertical * 2) + 2);
-@input-height-small: (ceil(@font-size-small * @line-height-base) + (@padding-small-vertical * 2) + 2);
+@input-height-large: (floor(@font-size-large * @line-height-large) + (@padding-large-vertical * 2) + 2);
+@input-height-small: (floor(@font-size-small * @line-height-small) + (@padding-small-vertical * 2) + 2);
+@legend-color: @gray-dark;
@legend-border-color: #e5e5e5;
+@input-group-addon-bg: @gray-lighter;
@input-group-addon-border-color: @input-border;
@dropdown-link-hover-color: #fff;
@dropdown-link-hover-bg: @dropdown-link-active-bg;
+@dropdown-link-disabled-color: @gray-light;
+
+@dropdown-header-color: @gray-light;
+
@dropdown-caret-color: #000;
@zindex-modal-background: 1040;
@zindex-modal: 1050;
+// Media queries breakpoints
+// --------------------------------------------------
+
+// Extra small screen / phone
+@screen-xsmall: 480px;
+@screen-phone: @screen-xsmall;
+
+// Small screen / tablet
+@screen-small: 768px;
+@screen-tablet: @screen-small;
+
+// Medium screen / desktop
+@screen-medium: 992px;
+@screen-desktop: @screen-medium;
+
+// Large screen / wide desktop
+@screen-large: 1200px;
+@screen-large-desktop: @screen-large;
+
+// So media queries don't overlap when required, provide a maximum
+@screen-phone-max: (@screen-small - 1);
+@screen-small-max: (@screen-medium - 1);
+@screen-tablet-max: (@screen-desktop - 1);
+@screen-desktop-max: (@screen-large-desktop - 1);
+
+
+// Grid system
+// --------------------------------------------------
+
+// Number of columns in the grid system
+@grid-columns: 12;
+// Padding, to be divided by two and applied to the left and right of all columns
+@grid-gutter-width: 30px;
+// Point at which the navbar stops collapsing
+@grid-float-breakpoint: @screen-tablet;
+
// Navbar
// -------------------------
// Basics of a navbar
@navbar-height: 50px;
+@navbar-margin-bottom: @line-height-computed;
@navbar-color: #777;
-@navbar-bg: #eee;
-@navbar-padding-horizontal: floor(@grid-gutter-width / 2); // ~15px
+@navbar-bg: #f8f8f8;
+@navbar-border: darken(@navbar-bg, 6.5%);
+@navbar-border-radius: @border-radius-base;
+@navbar-padding-horizontal: floor(@grid-gutter-width / 2);
@navbar-padding-vertical: ((@navbar-height - @line-height-computed) / 2);
// Navbar links
@navbar-link-hover-color: #333;
@navbar-link-hover-bg: transparent;
@navbar-link-active-color: #555;
-@navbar-link-active-bg: darken(@navbar-bg, 10%);
+@navbar-link-active-bg: darken(@navbar-bg, 6.5%);
@navbar-link-disabled-color: #ccc;
@navbar-link-disabled-bg: transparent;
// Reset inverted navbar basics
@navbar-inverse-color: @gray-light;
@navbar-inverse-bg: #222;
+@navbar-inverse-border: darken(@navbar-inverse-bg, 10%);
// Inverted navbar links
@navbar-inverse-link-color: @gray-light;
// Navs
// -------------------------
+@nav-link-padding: 10px 15px;
@nav-link-hover-bg: @gray-lighter;
@nav-disabled-link-color: @gray-light;
@pagination-bg: #fff;
@pagination-border: #ddd;
-@pagination-active-bg: #f5f5f5;
-@pagination-active-color: @gray-light;
+
+@pagination-hover-bg: @gray-lighter;
+
+@pagination-active-bg: @brand-primary;
+@pagination-active-color: #fff;
+
@pagination-disabled-color: @gray-light;
+
// Pager
// -------------------------
// -------------------------
@tooltip-max-width: 200px;
@tooltip-color: #fff;
-@tooltip-bg: rgba(0,0,0,.9);
+@tooltip-bg: #000;
@tooltip-arrow-width: 5px;
@tooltip-arrow-color: @tooltip-bg;
// Labels
// -------------------------
+
+@label-default-bg: @gray-light;
+@label-primary-bg: @brand-primary;
@label-success-bg: @brand-success;
@label-info-bg: @brand-info;
@label-warning-bg: @brand-warning;
// Alerts
// -------------------------
+@alert-padding: 15px;
+@alert-border-radius: @border-radius-base;
+@alert-link-font-weight: bold;
+
@alert-bg: @state-warning-bg;
@alert-text: @state-warning-text;
@alert-border: @state-warning-border;
-@alert-border-radius: @border-radius-base;
@alert-success-bg: @state-success-bg;
@alert-success-text: @state-success-text;
// Thumbnails
// -------------------------
-@thumbnail-caption-color: @text-color;
+@thumbnail-padding: 4px;
@thumbnail-bg: @body-bg;
@thumbnail-border: #ddd;
@thumbnail-border-radius: @border-radius-base;
+@thumbnail-caption-color: @text-color;
+@thumbnail-caption-padding: 9px;
+
// Wells
// -------------------------
@well-bg: #f5f5f5;
-// Accordion
-// -------------------------
-@accordion-border-color: #e5e5e5;
-
-
// Badges
// -------------------------
@badge-color: #fff;
@badge-link-hover-color: #fff;
-
@badge-bg: @gray-light;
+
@badge-active-color: @link-color;
@badge-active-bg: #fff;
+@badge-font-weight: bold;
+@badge-line-height: 1;
+@badge-border-radius: 10px;
+
// Breadcrumbs
// -------------------------
// Carousel
// ------------------------
+
@carousel-text-shadow: 0 1px 2px rgba(0,0,0,.6);
@carousel-control-color: #fff;
+@carousel-control-width: 15%;
+@carousel-control-opacity: .5;
+@carousel-control-font-size: 20px;
-@carousel-indicator-border-color: #fff;
@carousel-indicator-active-bg: #fff;
+@carousel-indicator-border-color: #fff;
@carousel-caption-color: #fff;
// Close
// ------------------------
@close-color: #000;
+@close-font-weight: bold;
@close-text-shadow: 0 1px 0 #fff;
@code-bg: #f9f2f4;
@pre-bg: #f5f5f5;
+@pre-color: @gray-dark;
@pre-border-color: #ccc;
+@pre-scrollable-max-height: 340px;
// Type
// ------------------------
@component-offset-horizontal: 180px;
-// Media queries breakpoints
-// --------------------------------------------------
-
-// Tiny screen / phone
-@screen-tiny: 480px;
-@screen-phone: @screen-tiny;
-
-// Small screen / tablet
-@screen-small: 768px;
-@screen-tablet: @screen-small;
-
-// Medium screen / desktop
-@screen-medium: 992px;
-@screen-desktop: @screen-medium;
-
-// So media queries don't overlap when required, provide a maximum
-@screen-small-max: (@screen-medium - 1);
-@screen-tablet-max: @screen-small-max;
-
-// Large screen / wide desktop
-@screen-large: 1200px;
-@screen-large-desktop: @screen-large;
-
-
// Container sizes
// --------------------------------------------------
// Small screen / tablet
-@container-tablet: 728px;
+@container-tablet: 720px;
// Medium screen / desktop
@container-desktop: 940px;
// Large screen / wide desktop
-@container-large-desktop: 1170px;
-
-
-// Grid system
-// --------------------------------------------------
-
-// Number of columns in the grid system
-@grid-columns: 12;
-// Padding, to be divided by two and applied to the left and right of all columns
-@grid-gutter-width: 30px;
-// Point at which the navbar stops collapsing
-@grid-float-breakpoint: @screen-tablet;
+@container-large-desktop: 1140px;
}
// Sizes
-.well-large {
+.well-lg {
padding: 24px;
border-radius: @border-radius-large;
}
-.well-small {
+.well-sm {
padding: 9px;
border-radius: @border-radius-small;
}
, "grunt-contrib-uglify": "~0.2.2"
, "grunt-contrib-qunit": "~0.2.2"
, "grunt-contrib-watch": "~0.5.1"
+ , "grunt-html-validation": "git://github.com/praveenvijayan/grunt-html-validation.git"
+ , "grunt-jekyll": "~0.3.8"
, "grunt-recess": "~0.3.3"
+ , "browserstack-runner": "~0.0.11"
}
}
projects / bootswatch / commitdiff
