diff --git a/docs/v2/DEVLOG.md b/docs/v2/DEVLOG.md index c514d01..5625cd4 100644 --- a/docs/v2/DEVLOG.md +++ b/docs/v2/DEVLOG.md @@ -366,4 +366,7 @@ - Deployed live demo. - New module restructure: all modules will be moved to core, some merges might have to be applied (check issue #14). Restructure was applied as follows: - Added the functionality of the new `alert` module to `contextual`. Includes mixin `make-alert-alt-color` for different `alert` color variants. - - Restructured folders. `mini-shell` removed, `mini-core` renamed to `mini`. `mini` is the core folder now. \ No newline at end of file + - Restructured folders. `mini-shell` removed, `mini-core` renamed to `mini`. `mini` is the core folder now. + - Created branch `v1-neutrino` both locally and on Github to support legacy versions in the future. `master` is now the branch for **Fermion** only. + - Aggressive deletion of older files. The following folder are now gone: `scss/mini`, `scss/mini-extra`, `flavors` except for the contents of the `v2` folder and the folder itself. + \ No newline at end of file diff --git a/flavors/README.md b/flavors/README.md deleted file mode 100644 index ed5def6..0000000 --- a/flavors/README.md +++ /dev/null @@ -1,23 +0,0 @@ -# Flavors - -Below is a list of all the currently available flavors: - -## Default - -- Dark gray text on light gray background -- High contrast -- Simple and clean styling -- Full flavor - - -## NiteOwl - -- Light gray text on dark blue background -- High contrast -- Simple and clean styling -- Full flavor - -## Bootstrap - -- Similar to the Bootstrap framework's style. -- Full flavor \ No newline at end of file diff --git a/flavors/mini-bootstrap.css b/flavors/mini-bootstrap.css deleted file mode 100644 index 3297123..0000000 --- a/flavors/mini-bootstrap.css +++ /dev/null @@ -1,1925 +0,0 @@ -/* - Flavor name: Bootstrap (mini-bootstrap) - Author: Angelos Chalaris (chalarangelo@gmail.com) - mini.css version: v1.1 (October, 2016) -*/ -/* - Image thumbnail style mixin. [1] - Parameters: - - $thumb-name : The class name for the thumbnail style. - - $thumb-padding : The padding between the image and the border. - - $thumb-border : The style of the thumbnail's border. - - $thumb-border-radius : The border radius of the thumbnail. - - $thumb-hover-color : The color of the thumbnail's border when hovering over it. - Notes: - - [1] : This style only applies to `img` elements with the class specified in - `$thumb-name`. -*/ -/* - Mixin for generic border style. - Parameters: - - $border-generic-name : The class name for the generic border. - Notes: - - [1] : The border style uses rgba to create a 1px solid border with 0.25 - opacity around an element, which makes it look properly bordered. - Might be incompatible with older browsers. - - [2] : The border style overwrites any border style as it uses - `!important`, exercise caution when using. -*/ -/* - Mixin for generic border radius styles. - Parameters: - - $border-style-name : The class name for the generic border radius style. - - $border-style-radius : The radius for the generic border radius style. - Notes: - - [1] : The border style overwrites any border style as it uses - `!important`, exercise caution when using. -*/ -/* - Mixin for generic contextual color text styles. - Parameters: - - $colored-text-name : The class name for the contextual color text style. - - $colored-text-color : The color for the contextual color text style. - Notes: - - [1] : The contextual color text style overwrites any text color as it uses - `!important`, exercise caution when using. -*/ -/* - Mixin for generic contextual background text styles. - Parameters: - - $colored-bg-text-name : The class name for the contextual background text style. - - $colored-bg-text-color : The background color for the contextual background text style. - Notes: - - [1] : The contextual background text style overwrites any text color as it - uses `!important`, exercise caution when using. -*/ -/* - Mixin for simple caret utility class. - Parameters: - - $caret-name : The class name for caret utility class. - - $caret-size : The size of the caret utility element. [1] - - $caret-color : The color of the caret utility element. - Notes: - - [1] : The caret is built using the border trick. Sizes can be specified - in either `px` or `em`, but they might take a bit of tweaking to - get right. -*/ -/* - Mixin for simple close sign utility class. - Parameters: - - $close-name : The class name for close utility class. - - $close-color : The color of the close utility element. - - $close-cursor : The cursor for the close utility element. - - $close-font-size : The font-size for the close utility element. - - $close-font-weight : The font-weight for the close utility element. - - $close-hover-color : The color of the close utility element when hovering over it. -*/ -/* - Mixin for quick float classes. [1] - Parameters: - - $drag-left-name : The class name for left drags. - - $drag-right-name : The class name for right drags. - Notes: - - [1] : These classes use `!important` to set the float properties, - exercise caution when using. -*/ -/* - Mixin for center block class. - Parameters: - - $center-block-name : The class name for center block class. -*/ -/* - Mixin for clearfix class. - Parameters: - - $clearfix-name : The class name for the clearfix class. -*/ -/* - Mixin for hidden class. [1] - Parameters: - - $hidden-name : The class name for hidden elements. - Notes: - - [1] : This class uses `!important` to set the display property, - exercise caution when using. -*/ -pre { - border: 1px solid rgba(0, 0, 0, 0.25); } - -/* - Set font-family, line-height, prevent adjustments of font size after orientation changes in IE and iOS. - Set body colors and margin. -*/ -html { - font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; - font-size: 14px; - line-height: 1.42857; - -ms-text-size-adjust: 100%; - -webkit-text-size-adjust: 100%; } - -body { - margin: 0; - color: #333; - background-color: #fff; } - -/* - Correct display in IE 9-. - Give images display: block to be responsive. -*/ -article, aside, footer, header, nav, section, figcaption, figure, main, details, menu, img { - display: block; } - -/* - Correct margin in IE 8. -*/ -figure { - margin: 1em 40px; } - -/* - Styles for headers. -*/ -h1, h2, h3, h4, h5, h6 { - line-height: 1.1; - margin: 0; - font-weight: 500; } - h1 small, h2 small, h3 small, h4 small, h5 small, h6 small { - color: #777; - font-weight: 400; } - -h1 { - font-size: 36px; } - -h2 { - font-size: 30px; } - -h3 { - font-size: 24.0px; } - -h4 { - font-size: 18.0px; } - -h5 { - font-size: 14px; } - -h6 { - font-size: 12px; } - -/* - Correct box-sizing in Firefox. - Style for horizontal rule. -*/ -hr { - box-sizing: content-box; - line-height: 1.14286; - margin: 0.7em 0; - height: 0; - border: 0; - border-top: 1px solid #d9d9d9; } - -/* - Style for all small text and size for sub and sup. -*/ -small, sub, sup { - font-size: 80%; } - -/* - Style for paragraph and preformatted elements. -*/ -p, pre { - margin: 0 0 10px; } - -/* - Style for lists. -*/ -ul, ol { - margin-top: 0; - margin-bottom: 10px; } - ul ul, ul ol, ol ul, ol ol { - margin-bottom: 0; } - -/* - Styles for code and preformatted. -*/ -samp, kbd, code, pre { - font-family: Menlo, Monaco, Consolas, "Courier New", monospace; - font-size: 14px; } - -kbd, code, pre { - padding: 2px 4px; - border-radius: 4px; } - -code, pre { - background-color: #f9f2f4; } - -kbd { - color: #fff; - background-color: #333; } - -pre { - display: block; - word-break: break-all; - word-wrap: break-word; } - pre code { - padding: 0; - font-size: inherit; - color: inherit; - white-space: pre-wrap; - background-color: transparent; - border-radius: 0; } - -/* - Style for hyperlinks, remove underline. - Remove gray background on active links in IE 10. - Remove outline on focused links when they are also active or hovered. -*/ -a { - background-color: transparent; - text-decoration: none; - color: #337ab7; } - a:active, a:hover { - outline-width: 0; - color: #23527c; } - a:visited { - color: #337ab7; } - a:visited:active, a:visited:hover { - color: #23527c; } - -/* - Prevent the duplicate application of `bolder` in Safari 6. -*/ -b, strong { - font-weight: inherit; } - -/* - Correct font weight in Chrome, Edge, Safari. -*/ -b, strong { - font-weight: bolder; } - -/* - Correct font style in Android 4.3-. -*/ -dfn { - font-style: italic; } - -/* - Remove botom border in Firefox 39-. - Correct text decoration in Chrome, Edge, IE, Opera, and Safari. -*/ -abbr[title] { - border-bottom: none; - text-decoration: underline; - text-decoration: underline dotted; } - -/* - Style for mark. -*/ -mark { - background-color: #fcf8e3; - color: #333; } - -/* - Styling for hidden elements. - Correct display for template in IE. - Correct display for audio:not([controls]) in iOS 4-7. -*/ -[hidden], .hidden, template, audio:not([controls]) { - display: none; } - -audio:not([controls]) { - height: 0; } - -/* - Correct display in IE 9-. -*/ -audio, video, progress { - display: inline-block; } - -/* - Styles for sub and sup. - Prevent `sub` and `sup` elements from affecting the line height. - Correct vertical alignment of progress in Chrome, Firefox, and Opera. -*/ -sub, sup, progress { - vertical-align: baseline; } - -sub, sup { - line-height: 0; - position: relative; } - -sub { - bottom: -0.25em; } - -sup { - top: -0.5em; } - -/* - Remove the border on images inside links in IE 10-. - Make images responsive. -*/ -img { - border-style: none; - max-width: 100%; } - -/* - Hide the overflow in IE. -*/ -svg:not(:root) { - overflow: hidden; } - -/* - Show the overflow in IE and Edge. -*/ -button, input, hr { - overflow: visible; } - -/* - Style for buttons and input elements. -*/ -button, input, optgroup, select, textarea { - font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; - font-size: 100%; - line-height: 1.14286; - margin: 0; } - -/* - Remove the inheritance of text transform in Edge, Firefox, and IE. -*/ -button, select { - text-transform: none; } - -/* - Correct styling for iOS, Safari and Firefox. -*/ -button, html [type="button"], [type="reset"], [type="submit"] { - -webkit-appearance: button; } - button::-moz-focus-inner, html [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { - border-style: none; - padding: 0; } - button:-moz-focusring, html [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { - outline: 1px dotted ButtonText; } - -/* - Style for fieldset. -*/ -fieldset { - border: 0; - border-radius: 0; - margin: 0; - padding: 0; } - -/* - Add correct box sizing and remove padding in IE 10-. -*/ -[type="checkbox"], [type="radio"], legend { - box-sizing: border-box; - padding: 0; } - -/* - - Correct text wrapping and color inheritance from `fieldset` elements in Edge and IE. - Remove the padding so developers are not caught out when they zero out `fieldset` - elements in all browsers. -*/ -legend { - color: inherit; - display: table; - max-width: 100%; - white-space: normal; } - -/* - Remove the default vertical scrollbar in IE. -*/ -textarea { - overflow: auto; } - -/* - Correct the cursor style of increment and decrement buttons in Chrome. - Make images responsive. -*/ -[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button, img { - height: auto; } - -/* - Correct styling in Chrome and Safari. - Remove the inner padding and cancel buttons in Chrome and Safari on OS X. -*/ -[type="search"] { - -webkit-appearance: textfield; - outline-offset: -2px; } - [type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration { - -webkit-appearance: none; } - -/* - Correct the inability to style clickable types in iOS and Safari. - Change font properties to `inherit` in Safari. -*/ -::-webkit-file-upload-button { - -webkit-appearance: button; - font: inherit; } - -/* - Mixin for button color variant. - Parameters: - - $btn-variant-color : The text color of the button variant. - - $btn-variant-bg-color : The background color of the button variant. - - $btn-variant-hover-style : Hover/active/focus style of the button variant. [1] - - $btn-variant-hover-style-percentage : Hover/active/focus style of the button variant percentage modifier. - Notes: - - [1] : The values that $btn-variant-hover-style can take are `lighten` and `darken`. The inside condition - only checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`. - - [2] : Do not use this mixin directly, use `make-btn-style` instead. -*/ -/* - Mixin for the buttons. - Parameters: - - $btn-name : The class name of the buttons. - - $btn-border : The border of the buttons. - - $btn-border-radius : The border-radius of the buttons. - - $btn-margin : The margin of the buttons. - - $btn-padding : The padding of the buttons. - - $btn-color : The text color of the buttons. - - $btn-bg-color : The background color of the buttons. - - $btn-hover-style : Hover/active/focus style of the buttons. [1] - - $btn-hover-style-percentage : Hover/active/focus style of the buttons percentage modifier. - - $btn-cursor : The cursor style when hovering over the buttons. - - $btn-disabled-cursor : The cursor style when hovering over the buttons whie disabled. - - $btn-disabled-opacity : The opacity of the buttons when disabled. - Notes: - - [1] : The values that $btn-hover-style can take are `lighten` and `darken`. The inside condition only - checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`. - - [2] : This only creates a basic button style. For more styles use `make-btn-style`. -*/ -/* - Mixin for button styles. - Parameters: - - $btn-name : The class name of the buttons. [1] - - $btn-style-name : The class name of the button style. - - $btn-style-color : The text color of the button style. - - $btn-style-bg-color : The background color of the button style. - - $btn-style-hover-style : Hover/active/focus style of the button style. [2][3] - - $btn-style-hover-style-percentage : Hover/active/focus style of the button style percentage modifier.[3] - Notes: - - [1] : The value of $btn-name must be the same as the value specified when using `make-btn`, otherwise - the specified style will not work correctly. - - [2] : The values that $btn-style-hover-style can take are `lighten` and `darken`. The inside condition - only checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`. - - [3] : The values of $btn-style-hover-style and $btn-style-hover-style-percentage default to `lighten` - and `7.5%` if not specified. - - [4] : This mixin should be used in combination with `make-btn` and is suggested that you use it after - `make-btn`. -*/ -/* - Mixin for button sizes. - Parameters: - - $btn-name : The class name of the buttons. [1] - - $btn-size-name : The class name of the button size. - - $btn-size-padding : The padding of the button size. - - $btn-size-font-size : The font-size of the button size. - Notes: - - [1] : The value of $btn-name must be the same as the value specified when using `make-btn`, otherwise - the specified style will not work correctly. - - [2] : This mixin should be used in combination with `make-btn` and is suggested that you use it after - `make-btn`. -*/ -.btn, a.btn, a.btn:visited { - display: inline-block; - border: 0; - border-radius: 4px; - margin: 5px 0; - padding: 6px 12px; - color: #333; - background: #fff; - cursor: pointer; } - .btn:hover, .btn:active, .btn:focus, a.btn:hover, a.btn:active, a.btn:focus, a.btn:visited:hover, a.btn:visited:active, a.btn:visited:focus { - background: #ececec; } - .btn.disabled, .btn[disabled], .btn:disabled, a.btn.disabled, a.btn[disabled], a.btn:disabled, a.btn:visited.disabled, a.btn:visited[disabled], a.btn:visited:disabled { - cursor: not-allowed; - opacity: 0.65; } - -.btn.btn-primary, a.btn.btn-primary, a.btn.btn-primary:visited { - color: #fff; - background: #337ab7; } - .btn.btn-primary:hover, .btn.btn-primary:active, .btn.btn-primary:focus, a.btn.btn-primary:hover, a.btn.btn-primary:active, a.btn.btn-primary:focus, a.btn.btn-primary:visited:hover, a.btn.btn-primary:visited:active, a.btn.btn-primary:visited:focus { - background: #2b6699; } - -.btn.btn-success, a.btn.btn-success, a.btn.btn-success:visited { - color: #fff; - background: #5cb85c; } - .btn.btn-success:hover, .btn.btn-success:active, .btn.btn-success:focus, a.btn.btn-success:hover, a.btn.btn-success:active, a.btn.btn-success:focus, a.btn.btn-success:visited:hover, a.btn.btn-success:visited:active, a.btn.btn-success:visited:focus { - background: #48a648; } - -.btn.btn-info, a.btn.btn-info, a.btn.btn-info:visited { - color: #fff; - background: #5bc0de; } - .btn.btn-info:hover, .btn.btn-info:active, .btn.btn-info:focus, a.btn.btn-info:hover, a.btn.btn-info:active, a.btn.btn-info:focus, a.btn.btn-info:visited:hover, a.btn.btn-info:visited:active, a.btn.btn-info:visited:focus { - background: #3bb4d8; } - -.btn.btn-warning, a.btn.btn-warning, a.btn.btn-warning:visited { - color: #fff; - background: #f0ad4e; } - .btn.btn-warning:hover, .btn.btn-warning:active, .btn.btn-warning:focus, a.btn.btn-warning:hover, a.btn.btn-warning:active, a.btn.btn-warning:focus, a.btn.btn-warning:visited:hover, a.btn.btn-warning:visited:active, a.btn.btn-warning:visited:focus { - background: #ed9d2b; } - -.btn.btn-danger, a.btn.btn-danger, a.btn.btn-danger:visited { - color: #fff; - background: #d9534f; } - .btn.btn-danger:hover, .btn.btn-danger:active, .btn.btn-danger:focus, a.btn.btn-danger:hover, a.btn.btn-danger:active, a.btn.btn-danger:focus, a.btn.btn-danger:visited:hover, a.btn.btn-danger:visited:active, a.btn.btn-danger:visited:focus { - background: #d23430; } - -.btn.btn-lg { - padding: 10px 16px; - font-size: 128.6%; } - -.btn.btn-sm { - padding: 5px 10px; - font-size: 85.7%; } - -.btn.btn-xs { - padding: 1px 5px; - font-size: 85.7%; } - -.btn { - border: 1px solid rgba(0, 0, 0, 0.25) !important; } - -/* - Mixin for responsive, mobile-first grid. - Parameters: - - $container-name : The class name of the container for the grid. - - $container-padding : The left and right padding of the container. [1] - - $row-name : The class name of the grid's rows. - - $col-name : The class name of the grid's columns. - - $col-number : The amount of columns in the grid. - - $xs-prefix : Class prefix for extra small screens. - - $sm-prefix : Class prefix for small screens. - - $md-prefix : Class prefix for medium screens. - - $lg-prefix : Class prefix for large screens. - - $hide-suffix : Class suffix for hidden columns. [2] - - $sm-breakpoint : Breakpoint for small screens. - - $md-breakpoint : Breakpoint for medium screens. - - $lg-breakpoint : Breakpoint for large screens. - Notes: - - [1] : The padding of the container might cause the page to grow by $container-padding to the right. This - can be fixed either via @media queries or setting the padding to 0. - - [2] : Columns with the $hide-suffix will be only hidden in the screen size specified. - - [3] : Refer to https://github.com/Chalarangelo/mini.css/wiki/Grid for additional information. -*/ -.container-fluid { - padding-right: 15px; - padding-left: 15px; - margin-right: auto; - margin-left: auto; - width: 100%; } - .container-fluid * { - box-sizing: border-box; } - -.row:before, .row:after { - content: ""; - display: table; - clear: both; } - -.col { - float: left; - padding: 15px; } - -.xs-1 { - width: 8.33333%; } - -.xs-2 { - width: 16.66667%; } - -.xs-3 { - width: 25%; } - -.xs-4 { - width: 33.33333%; } - -.xs-5 { - width: 41.66667%; } - -.xs-6 { - width: 50%; } - -.xs-7 { - width: 58.33333%; } - -.xs-8 { - width: 66.66667%; } - -.xs-9 { - width: 75%; } - -.xs-10 { - width: 83.33333%; } - -.xs-11 { - width: 91.66667%; } - -.xs-12 { - width: 100%; } - -.sm-hidden, -.md-hidden, -.lg-hidden { - display: block; } - -.xs-hidden { - display: none; } - -@media (min-width: 768px) { - .sm-1 { - width: 8.33333%; } - - .sm-2 { - width: 16.66667%; } - - .sm-3 { - width: 25%; } - - .sm-4 { - width: 33.33333%; } - - .sm-5 { - width: 41.66667%; } - - .sm-6 { - width: 50%; } - - .sm-7 { - width: 58.33333%; } - - .sm-8 { - width: 66.66667%; } - - .sm-9 { - width: 75%; } - - .sm-10 { - width: 83.33333%; } - - .sm-11 { - width: 91.66667%; } - - .sm-12 { - width: 100%; } - - .xs-hidden, - .md-hidden, - .lg-hidden { - display: block; } - - .sm-hidden { - display: none; } } -@media (min-width: 992px) { - .md-1 { - width: 8.33333%; } - - .md-2 { - width: 16.66667%; } - - .md-3 { - width: 25%; } - - .md-4 { - width: 33.33333%; } - - .md-5 { - width: 41.66667%; } - - .md-6 { - width: 50%; } - - .md-7 { - width: 58.33333%; } - - .md-8 { - width: 66.66667%; } - - .md-9 { - width: 75%; } - - .md-10 { - width: 83.33333%; } - - .md-11 { - width: 91.66667%; } - - .md-12 { - width: 100%; } - - .xs-hidden, - .sm-hidden, - .lg-hidden { - display: block; } - - .md-hidden { - display: none; } } -@media (min-width: 1200px) { - .lg-1 { - width: 8.33333%; } - - .lg-2 { - width: 16.66667%; } - - .lg-3 { - width: 25%; } - - .lg-4 { - width: 33.33333%; } - - .lg-5 { - width: 41.66667%; } - - .lg-6 { - width: 50%; } - - .lg-7 { - width: 58.33333%; } - - .lg-8 { - width: 66.66667%; } - - .lg-9 { - width: 75%; } - - .lg-10 { - width: 83.33333%; } - - .lg-11 { - width: 91.66667%; } - - .lg-12 { - width: 100%; } - - .xs-hidden, - .sm-hidden, - .md-hidden { - display: block; } - - .lg-hidden { - display: none; } } -/* - Mixin for the forms. - Parameters: - - $frm-name : The class name of the form. - - $frm-border : The border of the form elements. - - $frm-border-radius : The border-radius of the form elements. - - $frm-margin : The margin of the form elements. - - $frm-padding : The padding of the form elements. - - $frm-focus-color : The color used to mark the focused form element. - - $frm-invalid-color : The color used to mark an invalid form element. - - $frm-disabled-cursor : The cursor style when hovering over disabled form elements. - - $frm-disabled-opacity : The opacity of the form elements when disabled. - - $frm-readonly-bg-color : The background color of the form elements when they are readonly. - - $frm-readonly-border-color : The border color of the form elements when they are readonly. - - $frm-select-height : The height for non-multiline select elements in the form. - - $frm-label-margin : The margin for the form's label elements. - - $frm-ctrl-group-name : The class name of the control groups in the form. - - $frm-ctl-group-margin : The margin for control groups inside the form. - - $frm-inline-name : The class name for forms with inline style. - - $frm-aligned-name : The class name for forms with aligned style. - - $frm-aligned-label-width : The width of labels in forms with aligned style. - Notes: - - [1] : Input elements with button-like style (i.e. submit, reset, button etc.) are not affected by form styling. - Please use the button styles and mixins provided to properly style them to your liking. -*/ -.form input[type="color"], .form input[type^="date"], .form input[type$="time"], .form input[type="email"], -.form input[type="month"], .form input[type="week"], .form input[type="text"], .form input[type="password"], -.form input[type="url"], .form input[type="number"], .form input[type="search"], .form input[type="tel"], -.form select, .form textarea { - box-sizing: border-box; - border: 1px solid #ccc; - border-radius: 4px; - box-shadow: none; } -.form input:not([type]) { - box-sizing: border-box; - border: 1px solid #ccc; - border-radius: 4px; - box-shadow: none; } -.form input, .form select, .form textarea { - display: block; - margin: 0; - padding: 6px 12px; } - .form input:focus, .form select:focus, .form textarea:focus { - border-color: #66afe9; } - .form input[disabled], .form select[disabled], .form textarea[disabled] { - cursor: not-allowed; - opacity: 0.65; } - .form input:invalid, .form input:focus:invalid, .form input:focus:invalid:focus, .form select:invalid, .form select:focus:invalid, .form select:focus:invalid:focus, .form textarea:invalid, .form textarea:focus:invalid, .form textarea:focus:invalid:focus { - border-color: #a94442; } - .form input[readonly], .form select[readonly], .form textarea[readonly] { - background-color: #e6e6e6; - border-color: #bfbfbf; } -.form input[type="checkbox"], .form input[type="radio"] { - display: inline-block; } -.form select { - height: 34px; } - .form select[multiple] { - height: auto; } -.form label { - margin: 0 0 5px 0; } -.form.form-inline input, .form.form-inline select, .form.form-inline textarea, .form.form-inline label, .form.form-horizontal input, .form.form-horizontal select, .form.form-horizontal textarea, .form.form-horizontal label { - display: inline-block; } -.form.form-inline .ctrl-group { - display: inline-block; } -.form.form-horizontal .form-group label { - text-align: right; - vertical-align: middle; - width: 20%; - margin-top: 0; } -.form .form-group { - margin: 0 0 15px 0; } - -/* - Mixin for the tables. - Parameters: - - $tbl-name : The class name of the table. - - $tbl-border : The border of the table and cells. [1] - - $tbl-margin : The margin of the table cells. - - $tbl-padding : The padding of the table cells. - - $tbl-head-bg-color : The color of the thead background. - - $tbl-head-color : The color of the thead text. - - $tbl-body-bg-color : The color of the even-numbered rows in tbody. - - $tbl-body-alt-bg-color : The color of the odd-numbered rows in tbody. - - $tbl-body-color : The color of the text in tbody. - - $tbl-horizontal-name : The class name for the horizontal style table. - - $tbl-bordered-name : The class name for the bordered style table. - Notes: - - [1] : This style will apply to the table and cells. All styles applied to - the table (horizontal, bordered) will use the same style of border. -*/ -.table { - border-collapse: collapse; - border-spacing: 0; - empty-cells: show; - border: 1px solid #ddd; } - .table td, .table th { - overflow: visible; - border-left: 1px solid #ddd; - border-bottom: none; - margin: 0; - padding: 8px; } - .table thead { - background-color: #fff; - color: #333; - text-align: left; } - .table tbody { - background-color: #fff; - color: #333; } - .table tbody tr:nth-child(2n-1) { - background-color: #f9f9f9; } - .table.table-horizontal td, .table.table-horizontal th { - border-left: none; - border-bottom: 1px solid #ddd; } - .table.table-bordered td, .table.table-bordered th { - border-bottom: 1px solid #ddd; } - -/* - Mixin for navigation bar and complementary styles. - Parameters: - - $nav-name : The class name for the navigation bar. - - $nav-vertical-name : The class name for the vertical style of the navigation bar. - - $nav-fixed-name : The class name for the fixed style of the navigation bar. - - $nav-logo-name : The class name for the logo item of the navigation bar. - - $nav-logo-size : The font-size of the logo item of the navigation bar. - - $nav-link-name : The class name for the navigation links of the navigation bar. - - $nav-padding : The padding of the elements of the navigation bar. [1] - - $nav-color : The text color of the navigation elements. - - $nav-bg-color : The background color of the navigation bar. - - $nav-hover-style : Hover/active/focus style of the navigation elements. [2] - - $nav-hover-style-percentage : Hover/active/focus style of the navigation elements percentage modifier. - - $nav-disabled-cursor : The cursor style when hovering over the navigation elements whie disabled. - - $nav-disabled-opacity : The opacity of the navigation elements when disabled. - - $nav-fixed-left-right : The orientation of the fixed navigation bar. [3][4] - - $grid-columns-total : Total amount fo columns in the used grid. [5] - - $grid-coloumns-count-for-nav-fixed-vertical : Desired amount of columns occupied by the vertical navigation bar in the grid. [5] - - $nav-fixed-collapse-breakpoint : The breakpoint below which fixed navigation bars will collapse to a menu toggle button. - - $nav-fixed-collapse-label-location : Location of the collapsed menu button label. [6] - - $nav-fixed-collapse-label-margin : The margin for the collapsed menu button label. - - $nav-fixed-collapse-label-font-size : The font size of the collapsed menu button label. - Notes: - - [1] : This padding applies to all elements of the navigation bar and all styles(e.g. vertical or fixed). - For vertical styles it adapts to apply properly. It also adapts to apply properly to the collapse - label of the navigation bar. Please specify only a single padding value (i.e. 6px, 1.25em etc.) to - avoid CSS errors and ultimately the style not being applied to some elements. - - [2] : The values that $nav-hover-style can take are `lighten` and `darken`. The inside condition only - checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`. - - [3] : The values of $nav-fixed-left-right recognizes are `left` and `right`. However if invalid values - are provided, due to the inside condition only checking for `left`, `right` will be used as the - default value. - - [4]: The values of $nav-fixed-left-right will apply to all fixed navigation bars. The horizontal bars - should not be affected as they are 100% width, meaning that anchoring to left or right should have - the same result. - - [5] : These values are used to make the navigation bar work better with the grid system. Values do not have - to be the same as the grid or integer values, meaning that values like 12 and 1.5 could work great leaving - a small gap just before the third column in the grid. If no grid is specified, you can use percentage - values like 100 and 15 to get a 15% width for example. - - [6] : The value $nav-fixed-collapse-label-location recognizes are `top-left`, `top-right`, `bottom-left` - and `bottom-right`. Due to the way the conditional checking is implemented, `bottom-right` will be - used as a default if no valid value is specified. -*/ -.navbar { - box-sizing: border-box; - background-color: #f8f8f8; } - .navbar .navbar-brand { - font-size: 128.6%; - color: #333; } - .navbar ul { - display: inline-block; - list-style: none; - margin: 0; - padding: 0; } - .navbar ul li { - display: inline-block; - margin: 0; - white-space: nowrap; } - .navbar ul li > * { - display: inline-block; - padding: 15px; - color: #333; - margin: 0; } - .navbar ul li .navbar-nav:hover, .navbar ul li .navbar-nav:active, .navbar ul li .navbar-nav:focus { - color: #333; - background: #e5e5e5; } - .navbar ul li .navbar-nav.disabled, .navbar ul li .navbar-nav[disabled], .navbar ul li .navbar-nav:disabled { - cursor: not-allowed; - opacity: 0.65; } - .navbar.navbar-vertical ul { - display: block; } - .navbar.navbar-vertical ul li { - display: block; } - .navbar.navbar-vertical ul li > * { - width: 100%; - padding: 15px 0; } - .navbar.navbar-fixed { - position: fixed; - left: 0; - top: 0; - z-index: 999; - width: 100%; } - .navbar.navbar-fixed.navbar-vertical { - height: 100%; - width: 16.66667%; } - .navbar.navbar-fixed.navbar-vertical ul { - width: 100%; } - .navbar.navbar-fixed.navbar-vertical ul li { - display: block; } - .navbar + label { - display: none; - font-weight: 700; - margin: 10px; - font-size: 1.75em; - padding: 15px; - color: #333; - background-color: #f8f8f8; - width: auto; - position: fixed; - z-index: 1000; - top: 0; - right: 0; } - .navbar + label:before { - position: relative; - content: '\2630'; } - .navbar + label:hover, .navbar + label:active, .navbar + label:focus { - background: #e5e5e5; } - -@media (max-width: 768px) { - .navbar { - overflow: auto; } - .navbar.navbar-fixed { - display: none; } - .navbar.navbar-fixed + label { - display: block; } - - input[type="checkbox"]:checked + .navbar.navbar-fixed { - display: block; - width: 100%; - height: 100%; } - input[type="checkbox"]:checked + .navbar.navbar-fixed ul { - display: block; } - input[type="checkbox"]:checked + .navbar.navbar-fixed ul li { - display: block; } - input[type="checkbox"]:checked + .navbar.navbar-fixed ul li * { - width: 100%; - padding: 15px 0; } - input[type="checkbox"]:checked + .navbar.navbar-fixed + label:before { - content: '\00d7'; } } -.navbar { - border: 1px solid rgba(0, 0, 0, 0.25) !important; } - -.navbar { - border-radius: 4px !important; } - -img.thumbnail { - padding: 4px; - border: 1px solid #ddd; - border-radius: 4px; - cursor: pointer; } - img.thumbnail:hover, img.thumbnail:focus, img.thumbnailactive { - border-color: #337ab7; } - -.bordered { - border: 1px solid rgba(0, 0, 0, 0.25) !important; } - -.rounded { - border-radius: 4px !important; } - -.circle { - border-radius: 50% !important; } - -.text-primary { - color: #337ab7 !important; } - -.text-success { - color: #5cb85c !important; } - -.text-info { - color: #5bc0de !important; } - -.text-warning { - color: #f0ad4e !important; } - -.text-danger { - color: #d9534f !important; } - -.text-muted { - color: #777 !important; } - -.bg-primary { - background-color: #337ab7 !important; } - -.bg-success { - background-color: #5cb85c !important; } - -.bg-info { - background-color: #5bc0de !important; } - -.bg-warning { - background-color: #f0ad4e !important; } - -.bg-danger { - background-color: #d9534f !important; } - -.caret { - display: inline-block; - vertical-align: middle; - line-height: 1; - width: 0; - height: 0; - border: 4px solid transparent; - border-top: 4px solid #333; } - -.close { - display: inline-block; - vertical-align: middle; - line-height: 1; - color: #aaa; - font-size: 21px; - font-weight: 700; - cursor: pointer; } - .close:before { - content: '\00d7'; } - .close:hover, .close:active, .close:focus { - color: #777; } - -.pull-left { - float: left !important; } - -.pull-right { - float: right !important; } - -.center-block { - display: block; - margin-left: auto; - margin-right: auto; } - -.clearfix:before, .clearfix:after { - content: ""; - display: table; - clear: both; } - -.hidden { - display: none !important; } - -/* - Mixin for the labels/badges. - Parameters: - - $lbl-name : The class name of the labels/badges. - - $lbl-bg-color : The background color of the labels/badges. - - $lbl-color : The text color of the labels/badges. - - $lbl-border-radius : The border-radius of the labels/badges. - - $lbl-padding : The padding of the labels/badges. - - $lbl-hide-on-empty : Style of the label/badges when empty. [1] - Notes: - - [1] : The values that $lbl-hide-on-empty can take are `hide` or `show`. The inside condition only - checks if the value is `hide` and acts accordingly. Invalid values are treated as `show`. -*/ -/* - Mixin for labels/badges styles. - Parameters: - - $lbl-name : The class name of the labels/badges. [1] - - $lbl-style-name : The class name of the labels/badges style. - - $lbl-style-color : The text color of the labels/badges style. - - $lbl-style-bg-color : The background color of the labels/badges style. - Notes: - - [1] : The value of $lbl-name must be the same as the value specified when using `make-lbl`, otherwise - the specified style will not work correctly. -*/ -.label { - display: inline-block; - padding: 0.2em 0.6em 0.3em; - color: #fff; - background-color: #777; - border-radius: 0.25em; } - .label:empty { - display: none; } - -.label.label-primary { - color: #fff; - background-color: #337ab7; } - -.label.label-success { - color: #fff; - background-color: #5cb85c; } - -.label.label-info { - color: #fff; - background-color: #5bc0de; } - -.label.label-warning { - color: #fff; - background-color: #f0ad4e; } - -.label.label-danger { - color: #fff; - background-color: #d9534f; } - -.badge { - display: inline-block; - padding: 3px 7px; - color: #fff; - background-color: #777; - border-radius: 10px; } - .badge:empty { - display: none; } - -.badge.badge-primary { - color: #fff; - background-color: #337ab7; } - -.badge.badge-success { - color: #fff; - background-color: #5cb85c; } - -.badge.badge-info { - color: #fff; - background-color: #5bc0de; } - -.badge.badge-warning { - color: #fff; - background-color: #f0ad4e; } - -.badge.badge-danger { - color: #fff; - background-color: #d9534f; } - -/* - Mixin for tab system. - Parameters: - - $tabs-name : The class name for the tab system's container. - - $tabs-label-spacing : The spacing between tab labels. - - $tabs-label-height : The height of the tab labels. - - $tabs-label-padding : The padding of the tab labels. - - $tabs-label-color : The text color of the tab labels. - - $tabs-label-bg-color : The background color of the tab labels. - - $tabs-active-label-color : The text color of the active tab's label. - - $tabs-active-label-bg-color : The background color of the active tab's label. - - $tabs-border-color : Border color for the tab system. [1] - - $tabs-label-border-radius : Border radius for the tab labels. - - $tabs-active-label-stripe : The style of the colored stripe that appears on the active tab's label. [2] - - $tabs-inactive-label-hover-style : Hover/active/focus style of the tab labels. [3] - - $tabs-inactive-label-hover-style-percentage : Hover/active/focus style of the tab labels percentage modifier. - - $tabs-content-bg-color : The background color of the active tab's content. - - $tabs-content-padding : The padding of the active tab's content. - Notes: - - [1] : The color specified in $tabs-border-color applies to all borders in the tab system. This - includes borders in the tab labels and active tab's content. - - [2] : The style of the colored stripe is a border style so you should specify it as such. - - [3] : The values that $tabs-hover-style can take are `lighten` and `darken`. The inside condition only - checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`. -*/ -.nav-tabs { - position: relative; - min-height: 250px; - width: 100%; } - .nav-tabs input[type="radio"] { - display: none; } - .nav-tabs input[type="radio"] + div { - display: inline; } - .nav-tabs input[type="radio"] + div > label { - position: reative; - float: left; - margin-right: 3px; - left: 1px; - height: 20px; - padding: 10px 18px; - color: #337ab7; - background-color: #fff; - border: 1px solid #ddd; - border-radius: 4px 4px 0 0; - cursor: pointer; } - .nav-tabs input[type="radio"] + div > label:hover, .nav-tabs input[type="radio"] + div > label:active, .nav-tabs input[type="radio"] + div > label:focus { - background: #e6e6e6; } - .nav-tabs input[type="radio"] + div > label + div { - position: absolute; - z-index: -2; - left: 0; - top: 19px; - bottom: 0; - right: 0; - padding: 20px; - background: #fff; - border: 1px solid #ddd; } - .nav-tabs input[type="radio"]:checked + div > label { - color: #333; - background: #fff; - border-top: 1px solid #ddd; - border-bottom: 1px solid #fff; } - .nav-tabs input[type="radio"]:checked + div > label + div { - position: absolute; - z-index: -1; } - -.nav-tabs input[type="radio"] + div > label + div { - top: 40px; } - -.nav-tabs input[type="radio"] + div > label { - border: 0; } - -.nav-tabs input[type="radio"]:checked + div > label { - border: 1px solid #ddd; - border-bottom: 0; } - -/* - Mixin for modal dialogs. - Parameters: - - $modal-name : The class name for the modal dialog. - - $modal-color : The text color of the modal dialog. - - $modal-bg-color : The background color of the modal dialog. - - $modal-transition-enabled : Determines if a transition style will be applied when the modal changes states. [1] - - $modal-shadow-enabled : Determines if a shadow should be cast from the modal dialog. [1] - - $modal-border : The border style of the modal dialog. - - $modal-border-radius : The border radius of the modal dialog's border. - - $modal-padding : The padding of the modal dialog's contents. - - $modal-top-margin : The distance of the modal dialog from the top of the parent container. [2] - - $modal-width : The width of the modal dialog. [2] - Notes: - - [1] : The values of $modal-transition-enabled and $modal-shadow-enabled should be `enabled` or `disabled`. - If an invalid value is supplied, the mixin will act as if it was `disabled`. - - [2] : The values of $modal-top-margin and $modal-width should be in percentage (%) values to properly scale - on all devices. However, there are no restrictions. -*/ -/* - Mixin for close button support inside of modal dialogs. - Parameters: - - $modal-name : The class name for the modal dialog. [1] - - $close-name : The class name for the close sign utility class. [2] - - $modal-padding : The padding of the close button. [3] - Notes: - - [1] : The value of $modal-name should match the value specified in the modal dialog's - mixin, in order for this to work correctly. - - [2] : The value of $close-name should match the value specified in the close sign utility's - mixin, in order for this to work correctly. - - [3] : The close button will be placed at the top right of the modal dialog. Its padding - should be similar to the value specified for padding in the modal dialog itself, however - it could vary based on personal preference. -*/ -.modal { - display: none; } - .modal + div { - z-index: 997; - position: fixed; - width: 100%; - height: 0; - opacity: 0; - display: none; - transition: opacity .3s ease-out; } - .modal + div > div { - z-index: 998; - position: relative; - width: 600px; - color: #333; - background-color: #fff; - margin: 30px auto 0; - padding: 18px; - border: 1px solid #999; - border-radius: 6px; - box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5); } - .modal:checked + div { - height: 100%; - opacity: 1; - display: block; } - .modal:checked + div > label { - background-color: rgba(0, 0, 0, 0.35); - position: fixed; - width: 100%; - height: 100%; - top: 0; } - -.modal + div > div .close { - position: absolute; - top: 20px; - right: 20px; } - -/* - Mixin for navigation bar's dropdown element. - Parameters: - - $nav-name : The class name for the navigation bar. [1] - - $nav-link-name : The class name for the navigation links of the navigation bar. [1] - - $dropdown-name : The class name for the dropdown element. [2] - - $dropdown-left-margin : The left margin of the dropdown element's contents. [3] - - $dropdown-font-size : The font size of the dropdown element's contents. - Notes: - - [1] : The values of $nav-name and $nav-link-name must match those specified in the navigation bar's - definition, otherwise the dropdown element will not work properly. - - [2] : The value of $dropdown-name is used in two distinct elements of the component, namely the - checkbox and the dropdown toggle. - - [3] : The value of $dropdown-left-margin will affect all open dropdown menus, as well as dropdown - menus on mobile screens. It is suggested that you set this value to something different than - 0 to visually represent the menu hierarchy in devices with smaller screens. -*/ -.navbar .navbar-nav.dropdown { - cursor: pointer; } -.navbar input[type="checkbox"], .navbar input[type="radio"] { - display: none; } - .navbar input[type="checkbox"].dropdown + div, .navbar input[type="radio"].dropdown + div { - display: none; } - .navbar input[type="checkbox"]:checked.dropdown + div, .navbar input[type="radio"]:checked.dropdown + div { - display: block; - font-size: 80%; - margin-left: 20px; } - -/* - Mixin for collapse component. - Parameters: - - $collapse-name : The class name of the collapse component. - - $collapse-border : The border style of the collapse contents. - - $collapse-border-radius : The border radius of the collapse contents. - - $collapse-padding : The padding of the collapse contents. - - $collapse-margin-top : The margin above the collapse contents. [1] - - $collapse-color : The collapse contents' text color. - - $collapse-bg-color : The collapse contents' background color. - Notes: - - [1] : The value of $collapse-margin-top is used for spacing between the button label that is usually - above the collapsed contents and the contents themselves. -*/ -/* - Mixin for accordion component. - Parameters: - - $accordion-name : The class name of the accordion component. - - $accordion-border : The border style of the accordion component. - - $accordion-border-radius : The border radius of the accordion component. [1] - - $accordion-padding : The padding of the accordion's contents. - - $accordion-margin : The margin between accordion's parts. [2] - - $accordion-color : The accordion contents' text color. - - $accordion-bg-color : The accordion contents' background color. - - $accordion-label-color : The accordion labels' text color. - - $accordion-label-bg-color : The accordion labels' background color. - - $accordion-label-padding : The padding of the accordion's labels. - - $accordion-hover-style : Hover/active/focus style of the accordion's labels. [3] - - $accordion-hover-style-percentage : Hover/active/focus style of the accordion's labels percentage modifier. - Notes: - - [1] : The value of $accordion-border-radius will be applied to labels along with their contents. - Closed labels will have the border-radius applied to all of their corners, while open labels will - change accordingly to combine their border with the shown contents. - - [2] : The value of $accordion-margin will be applied only to margin-bottom of all parts in order - to space them out evenly. This does not apply to label and related content margins. - - [3] : The values that $accordion-hover-style can take are `lighten` and `darken`. The inside condition only - checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`. -*/ -input[type="checkbox"].collapse { - display: none; } - input[type="checkbox"].collapse + div { - display: none; - color: #333; - background-color: #f5f5f5; - padding: 19px; - margin-top: 6px; - border: 1px solid #e3e3e3; - border-radius: 4px; } -input[type="checkbox"]:checked.collapse + div { - display: block; } - -input[type="radio"].accordion { - display: none; } - input[type="radio"].accordion + label { - width: 100%; - display: block; - color: #333; - background-color: #f5f5f5; - padding: 8px; - margin-bottom: 6px; - border: 1px solid #e3e3e3; - border-radius: 4px; - cursor: pointer; } - input[type="radio"].accordion + label:hover, input[type="radio"].accordion + label:active, input[type="radio"].accordion + label:focus { - background-color: #e2e2e2; } - input[type="radio"].accordion + label + div { - display: none; - color: #333; - background-color: #fff; - padding: 19px; - margin-top: -1px; - margin-bottom: 6px; - border: 1px solid #e3e3e3; - border-radius: 0 0 4px 4px; } -input[type="radio"]:checked.accordion + label { - border-radius: 4px 4px 0 0; - margin-bottom: 0; } - input[type="radio"]:checked.accordion + label + div { - display: block; } - -/* - Mixin for the progress element. - Parameters: - - $progress-name : The class name of the progress wrapper. - - $progress-height : The height of the progress wrapper. - - $progress-border-radius : The border radius of the progress wrapper. - - $progress-bg-color : The background color of the progress wrapper. [1] - - $progress-font-size : The font size of the progress bar's text (if any). - - $progress-bar-color : The progress bar's text color. - - $progress-bar-bg-color : The progress bar's background color. - Notes: - - [1] : The background color of the progress wrapper should be a different color than the - page's background to make sure that it is visible. - - [2] : This only creates a basic progress style. For more progress bar styles use `make-progress-bar-variant`. -*/ -/* - Mixin for progress bar styles. - Parameters: - - $progress-name : The class name of the progress wrapper. [1] - - $progress-bar-variant-name : The class name of the progress bar variant. - - $progress-bar-variant-color : The progress bar variant's text color. - - $progress-bar-variant-bg-coor : The progress bar variant's background color. - Notes: - - [1] : The name of $progress-name should match the one specified in `make-progress` for the - progress bar variant to work correctly. - - [2] : This mixin should be used in combination with `make-progress` and is suggested that you - use it after `make-progress`. -*/ -.progress-bar { - position: relative; - overflow: hidden; - height: 20px; - background-color: #d7d7d7; - border-radius: 4px; } - .progress-bar > span { - float: left; - width: 0; - height: 100%; - color: #fff; - background-color: #337ab7; - text-align: center; - font-size: 12px; } - -.progress-bar > span.progress-bar-success { - color: #fff; - background-color: #5cb85c; } - -.progress-bar > span.progress-bar-info { - color: #fff; - background-color: #5bc0de; } - -.progress-bar > span.progress-bar-warning { - color: #fff; - background-color: #f0ad4e; } - -.progress-bar > span.progress-bar-danger { - color: #fff; - background-color: #d9534f; } - -/* - Mixin for dotted spinner component. - Parameters: - - $spinner-dots-name : The class name of the dotted spinner component. - - $spinner-dots-height : The height of the dotted spinner component. [1][2] - - $spinner-dots-animation-time : The animation time of the dotted spinner component. - Notes: - - [1] : The value of $spinner-dots-height can be specified in `em`, `px` etc. but it is - suggested that you specify it in the same measurement as the text base. - - [2] : The value of $spinner-dots-height will be used for both the size of the component - and the animation. Some tweaking might be required. -*/ -/* - Mixin for dotted spinner component. - Parameters: - - $spinner-round-name : The class name of the round spinner component. - - $spinner-round-size : The size of the round spinner component. [1] - - $spinner-round-doughnut-style : The doughnut style of the round spinner component. [2] - - $spinner-round-spin-style : The spinning part style of the round spinner component. [2] - - $spinner-round-animation-time : The animation time of the round spinner component. - Notes: - - [1] : The value of $spinner-round-size affects both height and width of the component. - - [2] : The values of $spinner-round-doughnut-style and $spinner-round-spin-style are styles - specified in border style format. -*/ -.spinner-dots { - display: inline-block; - overflow: hidden; - height: 20px; - vertical-align: bottom; } - .spinner-dots:after { - display: inline-table; - white-space: pre; - content: "\A.\A..\A..."; - animation: spin-dots 1.5s steps(4) infinite; } - -@keyframes spin-dots { - to { - transform: translateY(-80px); } } -.spinner-round { - display: inline-block; - border: 6px solid rgba(51, 51, 51, 0.25); - border-left: 6px solid #337ab7; - transform: translateZ(0); - animation: spin-round 1.5s infinite linear; } - .spinner-round, .spinner-round:after { - border-radius: 50%; - width: 20px; - height: 20px; } - -@keyframes spin-round { - 0% { - transform: rotate(0deg); } - 100% { - transform: rotate(360deg); } } -/* - Mixin for the carousel component. - Parameters: - - $carousel-name : The class name for the carousel. - - $carousel-width : The width of the carousel. [1] - - $carousel-height : The height of the carousel. - - $carousel-border : The style of the carousel's border. - - $carousel-border-radius : The border-radius of the carousel. - - $carousel-container-bg-color : The background color of the carousel. - - $carousel-content-padding : The padding of the carousel's contents. [2] - - $carousel-description-color : The text color of the carousel's description. - - $carousel-description-bg-color : The background color of the carousel's description. - - $carousel-description-top : The distance of the carousel's description from the top of the container. [3] - - $carousel-description-height : The height of the carousel's description area. [3] - - $carousel-control-top : The distance of the carousel's controls from the top of the container. [3] - - $carousel-control-font-size : The font-size of the carousel's controls. - - $carousel-control-color : The text color of the carousel's controls. - Notes: - - [1] : The height of the carousel is suggested to be defined as a percentage so that - it makes it responsive for smaller screens. - - [2] : The value of $carousel-content-padding only applies to images inside the carousel. - - [3] : The distances from the top are used for positioning the elements. The height of the - desccription should normally be the height of the container minus the top distance of - the description. Control distance should be about 90% of the container's height. -*/ -.carousel { - position: relative; - width: 80%; - height: 500px; - overflow: hidden; - text-align: center; - margin: auto; - border: 1px solid #ddd; - border-radius: 4px; } - .carousel input[type="radio"] { - display: none; } - .carousel input[type="radio"] + div { - display: none; - position: absolute; - width: 100%; - height: 100%; - left: 0; - top: 0; - padding: 10px; - background-color: #e7e7e7; } - .carousel input[type="radio"] + div > img { - max-width: 100%; - max-height: 100%; - margin: auto; } - .carousel input[type="radio"] + div > div { - position: absolute; - width: 100%; - height: 160px; - overflow: auto; - left: 0; - top: 360px; - background-color: #333; - color: #fff; - opacity: 0.1; } - .carousel input[type="radio"] + div > div:hover, .carousel input[type="radio"] + div > div:active, .carousel input[type="radio"] + div > div:focus { - opacity: 0.8; } - .carousel input[type="radio"] + div + label { - position: relative; - z-index: 998; - cursor: pointer; - top: 450px; - color: #fff; - font-size: 1.8em; } - .carousel input[type="radio"] + div + label:before { - content: '\25cb'; } - .carousel input[type="radio"]:checked + div { - display: block; } - .carousel input[type="radio"]:checked + div + label:before { - content: '\25cf'; } - -/* - Mixin for breadcrumbs style. - Parameters: - - $breadcrumbs-name : The class name for the breadcrumbs style. - - $breadcrumbs-style : The style of the breadcrumbs separator character. [1][2][3] - Notes: - - [1] : $breadcrumbs-style accepts the values 1, 2 or 3. If an invalid value is - supplied, it will be treated as 3. - - [2] : The three provided styles are as follows: - - $breadcrumbs-style == 1 : forward slash. - - $breadcrumbs-style == 2 : greater than symbol. - - $breadcrumbs-style == 3 : right angle symbol (default). - - [3] : The value of $breadcrumbs-style can be omitted and will default to 3. -*/ -/* - Mixin for generic container style. - Parameters: - - $container-name : The class name for the generic container. - - $container-color : The text color of the generic container. - - $container-bg-color : The background color of the generic container. - - $container-border : The border style of the generic container. - - $container-border-radius : The border-radius of the generic container. - - $container-padding : The content badding of the generic container. - Notes: - - [1] : This mixin is also used for making alerts and panels. -*/ -/* - Mixin for generic alert style. - Parameters: - - $alert-name : The class name for the alert. - - $alert-color : The text color of the alert. - - $alert-bg-color : The background color of the alert. - - $alert-border : The border style of the alert. - - $alert-border-radius : The border-radius of the alert. - - $alert-padding : The content badding of the alert. - - $close-name : The class name for the close utility. [1] - Notes: - - [1] : The value of $close-name must match that of the class specified - for close elements for the alert to work correctly. - - [2] : This mixin uses `make-generic-container` to partially generate its - CSS. -*/ -/* - Mixin for generic panel style. - Parameters: - - $panel-name : The class name for the panel. - - $panel-color : The text color of the panel. - - $panel-bg-color : The background color of the panel. - - $panel-border : The border style of the panel. - - $panel-border-radius : The border-radius of the panel. - - $panel-padding : The content badding of the panel. - - $panel-header-name : The class name for the panel's header. - - $panel-header-color : The text color of the panel's header. - - $panel-header-bg-color : The background color of the panel's header. - - $panel-header-padding : The padding of the panel's header. - Notes: - - [1] : This mixin uses `make-generic-container` to partially generate its - CSS. -*/ -/* - Mixin for generic popover style. - Parameters: - - $popover-name : The name for the popover style - - $popover-direction : The direction of the popover. [1] - - $popover-border-radius : The border radius for the popover style. - - $popover-distance : The distance for the popover style's placement. [2] - - $popover-color : The text color of the popover style. - - $popover-bg-color : The background color of the popover style. - - $popover-padding : The padding of the popover. - Notes: - - [1] : The values that $popover-direction accepts are 'top' and 'bottom'. If an invalid value - is provided, it will be treated as 'bottom'. - - [2] : The value of $popover-distance should be treated as a general guideline for the popover - distance and is supposed to be tweaked with inline styles or helper classes for better use. -*/ -/* - Mixin for generic button states. - Parameters: - - $button-states-name : The class name of the stateful button. - Notes: - - [1] : This mixin is experimental, it might be buggy. -*/ -/* - Mixin for generic button groups. - Parameters: - - $btn-group-name : The class name of the button group. - - $btn-name : The name of the button class. [1][2] - - $btn-group-border : The border style of the button group. - - $btn-group-border-radius : The border radius at the edges of the button group. - Notes: - - [1] : The value of $btn-name must match that of the generic button class. - - [2] : The value of $btn-name can be hacked to allow for button variants to be styled - in custom manners (e.g. if you button class is `btn` and your button variant's class - is `blue`, you can style it, using `btn +'.blue'`). - - [3] : This mixin is experimental, although it is marked stable for most cases. - - [4] : The results of this mixin are purely stylistic and do not provide any grouping - functionality. -*/ -.breadcrumb { - list-style: none; } - .breadcrumb > li { - display: inline-block; } - .breadcrumb > li + li:before { - content: '\002f\00a0'; } - -.well { - border: 1px solid #e3e3e3; - border-radius: 4px; - background-color: #f5f5f5; - color: #333; - padding: 19px; } - -.alert-success + div { - border: 1px solid #449d44; - border-radius: 4px; - background-color: #80c780; - color: #357935; - padding: 15px; } - -input[type="checkbox"].alert-success { - display: none; } - input[type="checkbox"].alert-success + div { - display: none; - position: relative; } - input[type="checkbox"].alert-success + div a { - font-weight: 700; - text-decoration: none; - color: #255625; } - input[type="checkbox"].alert-success + div a:hover, input[type="checkbox"].alert-success + div a:active, input[type="checkbox"].alert-success + div a:focus { - text-decoration: underline; } - input[type="checkbox"].alert-success + div .close { - position: absolute; - top: 15px; - right: 15px; - color: #357935; } - input[type="checkbox"].alert-success + div .close:hover, input[type="checkbox"].alert-success + div .close:active, input[type="checkbox"].alert-success + div .close:focus { - color: #255625; } - -input[type="checkbox"]:checked.alert-success + div { - display: block; } - -.alert-info + div { - border: 1px solid #31b0d5; - border-radius: 4px; - background-color: #80c780; - color: #2390b0; - padding: 15px; } - -input[type="checkbox"].alert-info { - display: none; } - input[type="checkbox"].alert-info + div { - display: none; - position: relative; } - input[type="checkbox"].alert-info + div a { - font-weight: 700; - text-decoration: none; - color: #1b6d85; } - input[type="checkbox"].alert-info + div a:hover, input[type="checkbox"].alert-info + div a:active, input[type="checkbox"].alert-info + div a:focus { - text-decoration: underline; } - input[type="checkbox"].alert-info + div .close { - position: absolute; - top: 15px; - right: 15px; - color: #2390b0; } - input[type="checkbox"].alert-info + div .close:hover, input[type="checkbox"].alert-info + div .close:active, input[type="checkbox"].alert-info + div .close:focus { - color: #1b6d85; } - -input[type="checkbox"]:checked.alert-info + div { - display: block; } - -.alert-warning + div { - border: 1px solid #ec971f; - border-radius: 4px; - background-color: #f4c37d; - color: #c77c11; - padding: 15px; } - -input[type="checkbox"].alert-warning { - display: none; } - input[type="checkbox"].alert-warning + div { - display: none; - position: relative; } - input[type="checkbox"].alert-warning + div a { - font-weight: 700; - text-decoration: none; - color: #985f0d; } - input[type="checkbox"].alert-warning + div a:hover, input[type="checkbox"].alert-warning + div a:active, input[type="checkbox"].alert-warning + div a:focus { - text-decoration: underline; } - input[type="checkbox"].alert-warning + div .close { - position: absolute; - top: 15px; - right: 15px; - color: #c77c11; } - input[type="checkbox"].alert-warning + div .close:hover, input[type="checkbox"].alert-warning + div .close:active, input[type="checkbox"].alert-warning + div .close:focus { - color: #985f0d; } - -input[type="checkbox"]:checked.alert-warning + div { - display: block; } - -.alert-danger + div { - border: 1px solid #c9302c; - border-radius: 4px; - background-color: #e27c79; - color: #a02622; - padding: 15px; } - -input[type="checkbox"].alert-danger { - display: none; } - input[type="checkbox"].alert-danger + div { - display: none; - position: relative; } - input[type="checkbox"].alert-danger + div a { - font-weight: 700; - text-decoration: none; - color: #761c19; } - input[type="checkbox"].alert-danger + div a:hover, input[type="checkbox"].alert-danger + div a:active, input[type="checkbox"].alert-danger + div a:focus { - text-decoration: underline; } - input[type="checkbox"].alert-danger + div .close { - position: absolute; - top: 15px; - right: 15px; - color: #a02622; } - input[type="checkbox"].alert-danger + div .close:hover, input[type="checkbox"].alert-danger + div .close:active, input[type="checkbox"].alert-danger + div .close:focus { - color: #761c19; } - -input[type="checkbox"]:checked.alert-danger + div { - display: block; } - -.panel { - border: 1px solid #ddd; - border-radius: 4px; - background-color: #fff; - color: #333; - padding: 0; } - -.panel > * { - padding: 15px; } -.panel .head { - border: 0; - border-bottom: 1px solid #ddd; - color: #333; - background-color: #e7e7e7; - padding: 15px; - margin: 0; } - -input[type="checkbox"].popover-top { - display: none; } - input[type="checkbox"].popover-top + label { - position: relative; } - input[type="checkbox"].popover-top + label > .popover-top { - position: absolute; - display: none; - background-color: #333; - color: #fff; - border-radius: 5px; - padding: 7px 10px; - z-index: 998; - width: auto; - bottom: 49px; } - input[type="checkbox"].popover-top + label > .popover-top:before { - position: absolute; - display: block; - border-top: 7px solid #333; - border-right: 7px solid transparent; - border-left: 7px solid transparent; - bottom: -7px; - content: ''; - left: 50%; - margin-left: -7px; } -input[type="checkbox"]:checked.popover-top + label > .popover-top { - display: block; } - -input[type="checkbox"].popover-bottom { - display: none; } - input[type="checkbox"].popover-bottom + label { - position: relative; } - input[type="checkbox"].popover-bottom + label > .popover-bottom { - position: absolute; - display: none; - background-color: #333; - color: #fff; - border-radius: 4px; - padding: 7px 10px; - z-index: 998; - width: auto; - top: 49px; } - input[type="checkbox"].popover-bottom + label > .popover-bottom:before { - position: absolute; - display: block; - border-bottom: 7px solid #333; - border-right: 7px solid transparent; - border-left: 7px solid transparent; - top: -7px; - content: ''; - left: 50%; - margin-left: -7px; } -input[type="checkbox"]:checked.popover-bottom + label > .popover-bottom { - display: block; } diff --git a/flavors/mini-bootstrap.min.css b/flavors/mini-bootstrap.min.css deleted file mode 100644 index 720f21e..0000000 --- a/flavors/mini-bootstrap.min.css +++ /dev/null @@ -1 +0,0 @@ -pre{border:1px solid rgba(0,0,0,.25)}html{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;line-height:1.42857;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0;color:#333;background-color:#fff}article,aside,details,figcaption,figure,footer,header,img,main,menu,nav,section{display:block}figure{margin:1em 40px}h1,h2,h3,h4,h5,h6{line-height:1.1;margin:0;font-weight:500}h1 small,h2 small,h3 small,h4 small,h5 small,h6 small{color:#777;font-weight:400}h1{font-size:36px}h2{font-size:30px}h3{font-size:24px}h4{font-size:18px}h5{font-size:14px}h6{font-size:12px}hr{box-sizing:content-box;line-height:1.14286;margin:.7em 0;height:0;border:0;border-top:1px solid #d9d9d9}small,sub,sup{font-size:80%}p,pre{margin:0 0 10px}ol,ul{margin-top:0;margin-bottom:10px}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}code,kbd,pre,samp{font-family:Menlo,Monaco,Consolas,"Courier New",monospace;font-size:14px}code,kbd,pre{padding:2px 4px;border-radius:4px}code,pre{background-color:#f9f2f4}kbd{color:#fff;background-color:#333}pre{display:block;word-break:break-all;word-wrap:break-word}pre code{padding:0;font-size:inherit;color:inherit;white-space:pre-wrap;background-color:transparent;border-radius:0}a{background-color:transparent;text-decoration:none;color:#337ab7}a:active,a:hover{outline-width:0;color:#23527c}a:visited{color:#337ab7}a:visited:active,a:visited:hover{color:#23527c}b,strong{font-weight:bolder}dfn{font-style:italic}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}mark{background-color:#fcf8e3;color:#333}.hidden,[hidden],audio:not([controls]),template{display:none}audio:not([controls]){height:0}audio,progress,video{display:inline-block}progress,sub,sup{vertical-align:baseline}sub,sup{line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none;max-width:100%}svg:not(:root){overflow:hidden}button,hr,input{overflow:visible}button,input,optgroup,select,textarea{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:100%;line-height:1.14286;margin:0}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner,html [type=button]::-moz-focus-inner{border-style:none;padding:0}[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring,html [type=button]:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:0;border-radius:0;margin:0;padding:0}[type=checkbox],[type=radio],legend{box-sizing:border-box;padding:0}legend{color:inherit;display:table;max-width:100%;white-space:normal}textarea{overflow:auto}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button,img{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}.btn,a.btn,a.btn:visited{display:inline-block;border:0;border-radius:4px;margin:5px 0;padding:6px 12px;color:#333;background:#fff;cursor:pointer}.btn:active,.btn:focus,.btn:hover,a.btn:active,a.btn:focus,a.btn:hover,a.btn:visited:active,a.btn:visited:focus,a.btn:visited:hover{background:#ececec}.btn.disabled,.btn:disabled,.btn[disabled],a.btn.disabled,a.btn:disabled,a.btn:visited.disabled,a.btn:visited:disabled,a.btn:visited[disabled],a.btn[disabled]{cursor:not-allowed;opacity:.65}.btn.btn-primary,a.btn.btn-primary,a.btn.btn-primary:visited{color:#fff;background:#337ab7}.btn.btn-primary:active,.btn.btn-primary:focus,.btn.btn-primary:hover,a.btn.btn-primary:active,a.btn.btn-primary:focus,a.btn.btn-primary:hover,a.btn.btn-primary:visited:active,a.btn.btn-primary:visited:focus,a.btn.btn-primary:visited:hover{background:#2b6699}.btn.btn-success,a.btn.btn-success,a.btn.btn-success:visited{color:#fff;background:#5cb85c}.btn.btn-success:active,.btn.btn-success:focus,.btn.btn-success:hover,a.btn.btn-success:active,a.btn.btn-success:focus,a.btn.btn-success:hover,a.btn.btn-success:visited:active,a.btn.btn-success:visited:focus,a.btn.btn-success:visited:hover{background:#48a648}.btn.btn-info,a.btn.btn-info,a.btn.btn-info:visited{color:#fff;background:#5bc0de}.btn.btn-info:active,.btn.btn-info:focus,.btn.btn-info:hover,a.btn.btn-info:active,a.btn.btn-info:focus,a.btn.btn-info:hover,a.btn.btn-info:visited:active,a.btn.btn-info:visited:focus,a.btn.btn-info:visited:hover{background:#3bb4d8}.btn.btn-warning,a.btn.btn-warning,a.btn.btn-warning:visited{color:#fff;background:#f0ad4e}.btn.btn-warning:active,.btn.btn-warning:focus,.btn.btn-warning:hover,a.btn.btn-warning:active,a.btn.btn-warning:focus,a.btn.btn-warning:hover,a.btn.btn-warning:visited:active,a.btn.btn-warning:visited:focus,a.btn.btn-warning:visited:hover{background:#ed9d2b}.btn.btn-danger,a.btn.btn-danger,a.btn.btn-danger:visited{color:#fff;background:#d9534f}.btn.btn-danger:active,.btn.btn-danger:focus,.btn.btn-danger:hover,a.btn.btn-danger:active,a.btn.btn-danger:focus,a.btn.btn-danger:hover,a.btn.btn-danger:visited:active,a.btn.btn-danger:visited:focus,a.btn.btn-danger:visited:hover{background:#d23430}.btn.btn-lg{padding:10px 16px;font-size:128.6%}.btn.btn-sm{padding:5px 10px;font-size:85.7%}.btn.btn-xs{padding:1px 5px;font-size:85.7%}.btn{border:1px solid rgba(0,0,0,.25)!important}.container-fluid{padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto;width:100%}.container-fluid *{box-sizing:border-box}.row:after,.row:before{content:"";display:table;clear:both}.col{float:left;padding:15px}.xs-1{width:8.33333%}.xs-2{width:16.66667%}.xs-3{width:25%}.xs-4{width:33.33333%}.xs-5{width:41.66667%}.xs-6{width:50%}.xs-7{width:58.33333%}.xs-8{width:66.66667%}.xs-9{width:75%}.xs-10{width:83.33333%}.xs-11{width:91.66667%}.xs-12{width:100%}.lg-hidden,.md-hidden,.sm-hidden{display:block}.xs-hidden{display:none}@media (min-width:768px){.sm-1{width:8.33333%}.sm-2{width:16.66667%}.sm-3{width:25%}.sm-4{width:33.33333%}.sm-5{width:41.66667%}.sm-6{width:50%}.sm-7{width:58.33333%}.sm-8{width:66.66667%}.sm-9{width:75%}.sm-10{width:83.33333%}.sm-11{width:91.66667%}.sm-12{width:100%}.lg-hidden,.md-hidden,.xs-hidden{display:block}.sm-hidden{display:none}}@media (min-width:992px){.md-1{width:8.33333%}.md-2{width:16.66667%}.md-3{width:25%}.md-4{width:33.33333%}.md-5{width:41.66667%}.md-6{width:50%}.md-7{width:58.33333%}.md-8{width:66.66667%}.md-9{width:75%}.md-10{width:83.33333%}.md-11{width:91.66667%}.md-12{width:100%}.lg-hidden,.sm-hidden,.xs-hidden{display:block}.md-hidden{display:none}}@media (min-width:1200px){.lg-1{width:8.33333%}.lg-2{width:16.66667%}.lg-3{width:25%}.lg-4{width:33.33333%}.lg-5{width:41.66667%}.lg-6{width:50%}.lg-7{width:58.33333%}.lg-8{width:66.66667%}.lg-9{width:75%}.lg-10{width:83.33333%}.lg-11{width:91.66667%}.lg-12{width:100%}.md-hidden,.sm-hidden,.xs-hidden{display:block}.lg-hidden{display:none}}.form input:not([type]),.form input[type$=time],.form input[type=color],.form input[type=email],.form input[type=month],.form input[type=number],.form input[type=password],.form input[type=search],.form input[type=tel],.form input[type=text],.form input[type=url],.form input[type=week],.form input[type^=date],.form select,.form textarea{box-sizing:border-box;border:1px solid #ccc;border-radius:4px;box-shadow:none}.form input,.form select,.form textarea{display:block;margin:0;padding:6px 12px}.form input:focus,.form select:focus,.form textarea:focus{border-color:#66afe9}.form input[disabled],.form select[disabled],.form textarea[disabled]{cursor:not-allowed;opacity:.65}.form input:focus:invalid,.form input:focus:invalid:focus,.form input:invalid,.form select:focus:invalid,.form select:focus:invalid:focus,.form select:invalid,.form textarea:focus:invalid,.form textarea:focus:invalid:focus,.form textarea:invalid{border-color:#a94442}.form input[readonly],.form select[readonly],.form textarea[readonly]{background-color:#e6e6e6;border-color:#bfbfbf}.form input[type=checkbox],.form input[type=radio]{display:inline-block}.form select{height:34px}.form select[multiple]{height:auto}.form label{margin:0 0 5px}.form.form-horizontal input,.form.form-horizontal label,.form.form-horizontal select,.form.form-horizontal textarea,.form.form-inline .ctrl-group,.form.form-inline input,.form.form-inline label,.form.form-inline select,.form.form-inline textarea{display:inline-block}.form.form-horizontal .form-group label{text-align:right;vertical-align:middle;width:20%;margin-top:0}.form .form-group{margin:0 0 15px}.table{border-collapse:collapse;border-spacing:0;empty-cells:show;border:1px solid #ddd}.table td,.table th{overflow:visible;border-left:1px solid #ddd;border-bottom:none;margin:0;padding:8px}.table thead{background-color:#fff;color:#333;text-align:left}.table tbody{background-color:#fff;color:#333}.table tbody tr:nth-child(2n-1){background-color:#f9f9f9}.table.table-horizontal td,.table.table-horizontal th{border-left:none;border-bottom:1px solid #ddd}.table.table-bordered td,.table.table-bordered th{border-bottom:1px solid #ddd}.navbar{box-sizing:border-box;background-color:#f8f8f8}.navbar .navbar-brand{font-size:128.6%;color:#333}.navbar ul{display:inline-block;list-style:none;margin:0;padding:0}.navbar ul li{display:inline-block;margin:0;white-space:nowrap}.navbar ul li>*{display:inline-block;padding:15px;color:#333;margin:0}.navbar ul li .navbar-nav:active,.navbar ul li .navbar-nav:focus,.navbar ul li .navbar-nav:hover{color:#333;background:#e5e5e5}.navbar ul li .navbar-nav.disabled,.navbar ul li .navbar-nav:disabled,.navbar ul li .navbar-nav[disabled]{cursor:not-allowed;opacity:.65}.navbar.navbar-vertical ul,.navbar.navbar-vertical ul li{display:block}.navbar.navbar-vertical ul li>*{width:100%;padding:15px 0}.navbar.navbar-fixed{position:fixed;left:0;top:0;z-index:999;width:100%}.navbar.navbar-fixed.navbar-vertical{height:100%;width:16.66667%}.navbar.navbar-fixed.navbar-vertical ul{width:100%}.navbar.navbar-fixed.navbar-vertical ul li{display:block}.navbar+label{display:none;font-weight:700;margin:10px;font-size:1.75em;padding:15px;color:#333;background-color:#f8f8f8;width:auto;position:fixed;z-index:1000;top:0;right:0}.navbar+label:before{position:relative;content:'\2630'}.navbar+label:active,.navbar+label:focus,.navbar+label:hover{background:#e5e5e5}@media (max-width:768px){.navbar{overflow:auto}.navbar.navbar-fixed{display:none}.navbar.navbar-fixed+label{display:block}input[type=checkbox]:checked+.navbar.navbar-fixed{display:block;width:100%;height:100%}input[type=checkbox]:checked+.navbar.navbar-fixed ul,input[type=checkbox]:checked+.navbar.navbar-fixed ul li{display:block}input[type=checkbox]:checked+.navbar.navbar-fixed ul li *{width:100%;padding:15px 0}input[type=checkbox]:checked+.navbar.navbar-fixed+label:before{content:'\00d7'}}.navbar{border:1px solid rgba(0,0,0,.25)!important;border-radius:4px!important}img.thumbnail{padding:4px;border:1px solid #ddd;border-radius:4px;cursor:pointer}img.thumbnail:focus,img.thumbnail:hover,img.thumbnailactive{border-color:#337ab7}.bordered{border:1px solid rgba(0,0,0,.25)!important}.rounded{border-radius:4px!important}.circle{border-radius:50%!important}.text-primary{color:#337ab7!important}.text-success{color:#5cb85c!important}.text-info{color:#5bc0de!important}.text-warning{color:#f0ad4e!important}.text-danger{color:#d9534f!important}.text-muted{color:#777!important}.bg-primary{background-color:#337ab7!important}.bg-success{background-color:#5cb85c!important}.bg-info{background-color:#5bc0de!important}.bg-warning{background-color:#f0ad4e!important}.bg-danger{background-color:#d9534f!important}.caret{display:inline-block;vertical-align:middle;line-height:1;width:0;height:0;border:4px solid transparent;border-top:4px solid #333}.close{display:inline-block;vertical-align:middle;line-height:1;color:#aaa;font-size:21px;font-weight:700;cursor:pointer}.close:before{content:'\00d7'}.close:active,.close:focus,.close:hover{color:#777}.pull-left{float:left!important}.pull-right{float:right!important}.center-block{display:block;margin-left:auto;margin-right:auto}.clearfix:after,.clearfix:before{content:"";display:table;clear:both}.hidden{display:none!important}.label{display:inline-block;padding:.2em .6em .3em;color:#fff;background-color:#777;border-radius:.25em}.label:empty{display:none}.label.label-primary{color:#fff;background-color:#337ab7}.label.label-success{color:#fff;background-color:#5cb85c}.label.label-info{color:#fff;background-color:#5bc0de}.label.label-warning{color:#fff;background-color:#f0ad4e}.label.label-danger{color:#fff;background-color:#d9534f}.badge{display:inline-block;padding:3px 7px;color:#fff;background-color:#777;border-radius:10px}.badge:empty{display:none}.badge.badge-primary{color:#fff;background-color:#337ab7}.badge.badge-success{color:#fff;background-color:#5cb85c}.badge.badge-info{color:#fff;background-color:#5bc0de}.badge.badge-warning{color:#fff;background-color:#f0ad4e}.badge.badge-danger{color:#fff;background-color:#d9534f}.nav-tabs{position:relative;min-height:250px;width:100%}.nav-tabs input[type=radio]{display:none}.nav-tabs input[type=radio]+div{display:inline}.nav-tabs input[type=radio]+div>label{position:reative;float:left;margin-right:3px;left:1px;height:20px;padding:10px 18px;color:#337ab7;background-color:#fff;border-radius:4px 4px 0 0;cursor:pointer}.nav-tabs input[type=radio]+div>label:active,.nav-tabs input[type=radio]+div>label:focus,.nav-tabs input[type=radio]+div>label:hover{background:#e6e6e6}.nav-tabs input[type=radio]+div>label+div{position:absolute;z-index:-2;left:0;bottom:0;right:0;padding:20px;background:#fff;border:1px solid #ddd}.nav-tabs input[type=radio]:checked+div>label{color:#333;background:#fff}.nav-tabs input[type=radio]:checked+div>label+div{position:absolute;z-index:-1}.nav-tabs input[type=radio]+div>label+div{top:40px}.nav-tabs input[type=radio]+div>label{border:0}.nav-tabs input[type=radio]:checked+div>label{border:1px solid #ddd;border-bottom:0}.modal{display:none}.modal+div{z-index:997;position:fixed;width:100%;height:0;opacity:0;display:none;transition:opacity .3s ease-out}.modal+div>div{z-index:998;position:relative;width:600px;color:#333;background-color:#fff;margin:30px auto 0;padding:18px;border:1px solid #999;border-radius:6px;box-shadow:0 5px 15px rgba(0,0,0,.5)}.modal:checked+div{height:100%;opacity:1;display:block}.modal:checked+div>label{background-color:rgba(0,0,0,.35);position:fixed;width:100%;height:100%;top:0}.modal+div>div .close{position:absolute;top:20px;right:20px}.navbar .navbar-nav.dropdown{cursor:pointer}.navbar input[type=checkbox],.navbar input[type=checkbox].dropdown+div,.navbar input[type=radio],.navbar input[type=radio].dropdown+div{display:none}.navbar input[type=checkbox]:checked.dropdown+div,.navbar input[type=radio]:checked.dropdown+div{display:block;font-size:80%;margin-left:20px}input[type=checkbox].collapse{display:none}input[type=checkbox].collapse+div{display:none;color:#333;background-color:#f5f5f5;padding:19px;margin-top:6px;border:1px solid #e3e3e3;border-radius:4px}input[type=checkbox]:checked.collapse+div{display:block}input[type=radio].accordion{display:none}input[type=radio].accordion+label{width:100%;display:block;color:#333;background-color:#f5f5f5;padding:8px;margin-bottom:6px;border:1px solid #e3e3e3;border-radius:4px;cursor:pointer}input[type=radio].accordion+label:active,input[type=radio].accordion+label:focus,input[type=radio].accordion+label:hover{background-color:#e2e2e2}input[type=radio].accordion+label+div{display:none;color:#333;background-color:#fff;padding:19px;margin-top:-1px;margin-bottom:6px;border:1px solid #e3e3e3;border-radius:0 0 4px 4px}input[type=radio]:checked.accordion+label{border-radius:4px 4px 0 0;margin-bottom:0}input[type=radio]:checked.accordion+label+div{display:block}.progress-bar{position:relative;overflow:hidden;height:20px;background-color:#d7d7d7;border-radius:4px}.progress-bar>span{float:left;width:0;height:100%;color:#fff;background-color:#337ab7;text-align:center;font-size:12px}.progress-bar>span.progress-bar-success{color:#fff;background-color:#5cb85c}.progress-bar>span.progress-bar-info{color:#fff;background-color:#5bc0de}.progress-bar>span.progress-bar-warning{color:#fff;background-color:#f0ad4e}.progress-bar>span.progress-bar-danger{color:#fff;background-color:#d9534f}.spinner-dots{display:inline-block;overflow:hidden;height:20px;vertical-align:bottom}.spinner-dots:after{display:inline-table;white-space:pre;content:"\A.\A..\A...";animation:spin-dots 1.5s steps(4) infinite}@keyframes spin-dots{to{transform:translateY(-80px)}}.spinner-round{display:inline-block;border:6px solid rgba(51,51,51,.25);border-left:6px solid #337ab7;transform:translateZ(0);animation:spin-round 1.5s infinite linear}.spinner-round,.spinner-round:after{border-radius:50%;width:20px;height:20px}@keyframes spin-round{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.carousel{position:relative;width:80%;height:500px;overflow:hidden;text-align:center;margin:auto;border:1px solid #ddd;border-radius:4px}.carousel input[type=radio]{display:none}.carousel input[type=radio]+div{display:none;position:absolute;width:100%;height:100%;left:0;top:0;padding:10px;background-color:#e7e7e7}.carousel input[type=radio]+div>img{max-width:100%;max-height:100%;margin:auto}.carousel input[type=radio]+div>div{position:absolute;width:100%;height:160px;overflow:auto;left:0;top:360px;background-color:#333;color:#fff;opacity:.1}.carousel input[type=radio]+div>div:active,.carousel input[type=radio]+div>div:focus,.carousel input[type=radio]+div>div:hover{opacity:.8}.carousel input[type=radio]+div+label{position:relative;z-index:998;cursor:pointer;top:450px;color:#fff;font-size:1.8em}.carousel input[type=radio]+div+label:before{content:'\25cb'}.carousel input[type=radio]:checked+div{display:block}.carousel input[type=radio]:checked+div+label:before{content:'\25cf'}.breadcrumb{list-style:none}.breadcrumb>li{display:inline-block}.breadcrumb>li+li:before{content:'\002f\00a0'}.well{border:1px solid #e3e3e3;border-radius:4px;background-color:#f5f5f5;color:#333;padding:19px}.alert-success+div{border:1px solid #449d44;border-radius:4px;background-color:#80c780;color:#357935;padding:15px}input[type=checkbox].alert-success{display:none}input[type=checkbox].alert-success+div{display:none;position:relative}input[type=checkbox].alert-success+div a{font-weight:700;text-decoration:none;color:#255625}input[type=checkbox].alert-success+div a:active,input[type=checkbox].alert-success+div a:focus,input[type=checkbox].alert-success+div a:hover{text-decoration:underline}input[type=checkbox].alert-success+div .close{position:absolute;top:15px;right:15px;color:#357935}input[type=checkbox].alert-success+div .close:active,input[type=checkbox].alert-success+div .close:focus,input[type=checkbox].alert-success+div .close:hover{color:#255625}input[type=checkbox]:checked.alert-success+div{display:block}.alert-info+div{border:1px solid #31b0d5;border-radius:4px;background-color:#80c780;color:#2390b0;padding:15px}input[type=checkbox].alert-info{display:none}input[type=checkbox].alert-info+div{display:none;position:relative}input[type=checkbox].alert-info+div a{font-weight:700;text-decoration:none;color:#1b6d85}input[type=checkbox].alert-info+div a:active,input[type=checkbox].alert-info+div a:focus,input[type=checkbox].alert-info+div a:hover{text-decoration:underline}input[type=checkbox].alert-info+div .close{position:absolute;top:15px;right:15px;color:#2390b0}input[type=checkbox].alert-info+div .close:active,input[type=checkbox].alert-info+div .close:focus,input[type=checkbox].alert-info+div .close:hover{color:#1b6d85}input[type=checkbox]:checked.alert-info+div{display:block}.alert-warning+div{border:1px solid #ec971f;border-radius:4px;background-color:#f4c37d;color:#c77c11;padding:15px}input[type=checkbox].alert-warning{display:none}input[type=checkbox].alert-warning+div{display:none;position:relative}input[type=checkbox].alert-warning+div a{font-weight:700;text-decoration:none;color:#985f0d}input[type=checkbox].alert-warning+div a:active,input[type=checkbox].alert-warning+div a:focus,input[type=checkbox].alert-warning+div a:hover{text-decoration:underline}input[type=checkbox].alert-warning+div .close{position:absolute;top:15px;right:15px;color:#c77c11}input[type=checkbox].alert-warning+div .close:active,input[type=checkbox].alert-warning+div .close:focus,input[type=checkbox].alert-warning+div .close:hover{color:#985f0d}input[type=checkbox]:checked.alert-warning+div{display:block}.alert-danger+div{border:1px solid #c9302c;border-radius:4px;background-color:#e27c79;color:#a02622;padding:15px}input[type=checkbox].alert-danger{display:none}input[type=checkbox].alert-danger+div{display:none;position:relative}input[type=checkbox].alert-danger+div a{font-weight:700;text-decoration:none;color:#761c19}input[type=checkbox].alert-danger+div a:active,input[type=checkbox].alert-danger+div a:focus,input[type=checkbox].alert-danger+div a:hover{text-decoration:underline}input[type=checkbox].alert-danger+div .close{position:absolute;top:15px;right:15px;color:#a02622}input[type=checkbox].alert-danger+div .close:active,input[type=checkbox].alert-danger+div .close:focus,input[type=checkbox].alert-danger+div .close:hover{color:#761c19}input[type=checkbox]:checked.alert-danger+div{display:block}.panel{border:1px solid #ddd;border-radius:4px;background-color:#fff;color:#333;padding:0}.panel>*{padding:15px}.panel .head{border:0;border-bottom:1px solid #ddd;color:#333;background-color:#e7e7e7;padding:15px;margin:0}input[type=checkbox].popover-top{display:none}input[type=checkbox].popover-top+label{position:relative}input[type=checkbox].popover-top+label>.popover-top{position:absolute;display:none;background-color:#333;color:#fff;border-radius:5px;padding:7px 10px;z-index:998;width:auto;bottom:49px}input[type=checkbox].popover-top+label>.popover-top:before{position:absolute;display:block;border-top:7px solid #333;border-right:7px solid transparent;border-left:7px solid transparent;bottom:-7px;content:'';left:50%;margin-left:-7px}input[type=checkbox]:checked.popover-top+label>.popover-top{display:block}input[type=checkbox].popover-bottom{display:none}input[type=checkbox].popover-bottom+label{position:relative}input[type=checkbox].popover-bottom+label>.popover-bottom{position:absolute;display:none;background-color:#333;color:#fff;border-radius:4px;padding:7px 10px;z-index:998;width:auto;top:49px}input[type=checkbox].popover-bottom+label>.popover-bottom:before{position:absolute;display:block;border-bottom:7px solid #333;border-right:7px solid transparent;border-left:7px solid transparent;top:-7px;content:'';left:50%;margin-left:-7px}input[type=checkbox]:checked.popover-bottom+label>.popover-bottom{display:block} \ No newline at end of file diff --git a/flavors/mini-bootstrap.scss b/flavors/mini-bootstrap.scss deleted file mode 100644 index 638ba13..0000000 --- a/flavors/mini-bootstrap.scss +++ /dev/null @@ -1,623 +0,0 @@ -//==================================================================== -// This is the file you should edit to make the flavor you want. -// Please read the instructions carefully. -//==================================================================== -// !! IMPORTANT !! -// Please copy this file or rename it, if you want to keep the default -// flavor definitions file. -//==================================================================== -// Update the comment below to include it in your flavor, providing the information -// you want along with your customized flavor. You can also delete it if you don't -// want it in your final CSS file. -/* - Flavor name: Bootstrap (mini-bootstrap) - Author: Angelos Chalaris (chalarangelo@gmail.com) - mini.css version: v1.1 (October, 2016) -*/ -//==================================================================== -// -// CORE COMPONENTS (located in `mini`): -// -//==================================================================== -// Variable definitions for the Base module (_base.scss) -//==================================================================== -// Pre-enable utilities (_utility.scss). -// --- NOTES: --- -// The utility module is pre enabled in order for certain elements to -// use certain utility mixins. -// ------------------- -@import '../scss/mini/utility'; -// Basic rules for body -$body-margin: 0; // Margin for body -$body-bg-color: #fff; // Body background color -$body-color: #333; // Body text color -// Basic typography rules -$base-fonts: "\"Helvetica Neue\", Helvetica, Arial, sans-serif"; // Font-family -$base-font-size: 14px; // Font-size -$base-line-height: 1.42857143; // Line-height -// Rules for headers (multipliers apply on top of the basic typography rules) -// --- NOTES: --- -// Headers are not followed by a bottom border. -// elements inside headers use the default small sizing. -// ------------------- -$h1-multiplier: 2.571428571428571; // Header 1 font-sze multiplier -$h2-multiplier: 2.142857142857143; // Header 2 font-sze multiplier -$h3-multiplier: 1.714285714285714; // Header 3 font-sze multiplier -$h4-multiplier: 1.285714285714286; // Header 4 font-sze multiplier -$h5-multiplier: 1; // Header 5 font-sze multiplier -$h6-multiplier: 0.8571428571428571; // Header 6 font-sze multiplier -$header-line-height-multiplier: 0.76999999923; // Multiplier for line height of headers -$header-margin: 0; // Margin for headers -$header-font-weight: 500; // Font weight for headers -// Rules for small elements inside headers -$header-small-color: #777; // Header small text color -$header-small-font-weight: 400; // Header small font weight -// Rules for horizontal rules -$hr-line-height-multiplier: 0.8; // Multiplier for line height of horizontal rule -$hr-margin: 0.7em 0; // Margin for horizontal rule -$hr-border-style: 1px solid darken($body-bg-color, 15%); // Color and style of horizontal rule -// Common content typography rules (paragraphs, lists etc.) -// --- NOTES: --- -// To counteract the styling of elements inside headers, -// $small-font-size is 80% instead of 85% (75% for headers). -// ------------------- -$p-margin: 0 0 10px; // Margin for paragraph and pre elements -$small-font-size: 80%; // Font size for small, sub and sup elements -$sub-bottom: -0.25em; // Sub bottom -$sup-top: -0.5em; // Sup top -$list-margin-top: 0; // Top margin for lists -$list-margin-bottom: 10px; // Bottom margin for lists -$mark-bg-color: #fcf8e3; // Mark background color -$mark-color: $body-color; // Mark text color -// Code, preformatted and keyboard rules -// --- NOTES: --- -// 
 elements use the same style as  elements and do not
-//  have their own unique padding specified.
-// 	
 elements use generic border styling to style their border
-//	instead of a specific border color. (*)
-//	Code elements use the default color used in the document's body,
-//	instead of #c7254e.
-// 	(*): The generic border mixin from utilites could not be used,
-//	because it is built to apply to a class of elements, not a type.
-//	-------------------
-$code-fonts:					"Menlo, Monaco, Consolas, \"Courier New\", monospace";	// Font-family for code, pre, kbd, samp elements
-$code-padding:					2px 4px;										// Padding for code and pre elements
-$code-bg-color:					#f9f2f4;										// Code and pre background color	
-$code-border-radius:			4px;											// Border radius for code, pre and kbd elements
-$kbd-bg-color:					$body-color; 									// Kbd background color
-$kbd-color:						$body-bg-color;									// Kbd text color
-pre 							{ border: 1px solid rgba(0,0,0, 0.25); }		// Use generic styling to style border for pre elements						
-//	Hyperlink rules
-//	--- 	NOTES: 	---
-//	 elements have no underline style applied to them when hovered
-//	over or otherwise selected or focused.
-//	-------------------
-$a-color:						#337ab7;										// Hyperlink text color
-$a-hover-color:					#23527c;										// Hyperlink hover text color
-$a-visited-color:				#337ab7;										// Hyperlink visited text color
-$a-visited-hover-color:			#23527c;										// Hyperlink visited hover text color
-//	Button, input and form rules
-$button-fonts:					$base-fonts;									// Font-family for buttons and inputs
-$button-font-size:				100%;											// Font size for buttons and inputs
-$button-line-height-multiplier:	0.8;											// Multiplier for line height of buttons and inputs
-$button-margin:					0;												// Margin for buttons and inputs
-$fieldset-border:				0;												// Border style for fieldset
-$fieldset-border-radius:		0;												// Border radius for fieldset
-$fieldset-margin:				0;												// Margin for fieldset
-$fieldset-padding:				0;												// Padding for fieldset
-//	Enable base (_base.scss) and use the variables defined above.
-@import '../scss/mini/base';
-//====================================================================
-//	Variable definitions for the Button module (_button.scss)
-//====================================================================
-// 	Colors and styles (you can remove things you don't need or define more
-//	colors if you need them).
-//	--- 	NOTES: 	---
-//	Button styles use approximations for some colors (mainly hover colors).
-//	Button border is built using utility module's generic mixin.
-//	Buttons differ from Bootstrap's in terms of line height.
-//	Button size variant font sizes are approximate.
-//	`btn-link` is not supported.
-//	-------------------
-$btn-default-color:							$body-color;						// Default text color for buttons
-$btn-alt-color:								$body-bg-color;						// Alternative text color for buttons
-$btn-default-bg-color:						$body-bg-color;						// Default background color for buttons
-$btn-p-bg-color:							#337ab7;							// Color for button style 1
-$btn-s-bg-color:							#5cb85c;							// Color for button style 2
-$btn-i-bg-color:							#5bc0de;							// Color for button style 3
-$btn-w-bg-color:							#f0ad4e;							// Color for button style 4
-$btn-d-bg-color:							#d9534f;							// Color for button style 5
-//	Button class names (you can remove things you don't need or define more
-//	classes if you need them).
-$btn-class-name:							btn;								// Name for the base button class
-$btn-style1-name:							btn-primary;						// Name for button style 1 class
-$btn-style2-name:							btn-success;						// Name for button style 2 class
-$btn-style3-name:							btn-info;							// Name for button style 3 class
-$btn-style4-name:							btn-warning;						// Name for button style 4 class
-$btn-style5-name:							btn-danger;							// Name for button style 5 class
-$btn-size1-name:							btn-lg;								// Name for the button size 1 class
-$btn-size2-name:							btn-sm;								// Name for the button size 2 class
-$btn-size3-name:							btn-xs;								// Name for the button size 3 class
-//	Enable buttons (_button.scss). (Use individual mixins below to use.)
-@import '../scss/mini/button';
-// Use button mixins to create buttons with given specs. For more information
-// refer to the _button.scss file to check the definitions.
-@include make-btn($btn-class-name, 0, 4px, 5px 0, 6px 12px, $btn-default-color, $btn-default-bg-color, darken, 7.5%, pointer, not-allowed, .65);
-@include make-btn-style($btn-class-name, $btn-style1-name, $btn-alt-color, $btn-p-bg-color, darken);
-@include make-btn-style($btn-class-name, $btn-style2-name, $btn-alt-color, $btn-s-bg-color, darken);
-@include make-btn-style($btn-class-name, $btn-style3-name, $btn-alt-color, $btn-i-bg-color, darken);
-@include make-btn-style($btn-class-name, $btn-style4-name, $btn-alt-color, $btn-w-bg-color, darken);
-@include make-btn-style($btn-class-name, $btn-style5-name, $btn-alt-color, $btn-d-bg-color, darken);
-@include make-btn-size($btn-class-name, $btn-size1-name, 10px 16px, 128.6%);
-@include make-btn-size($btn-class-name, $btn-size2-name, 5px 10px, 85.7%);
-@include make-btn-size($btn-class-name, $btn-size3-name, 1px 5px, 85.7%);
-@include make-border-generic($btn-class-name);
-//====================================================================
-//	Variable definitions for the Grid module (_grid.scss)
-//====================================================================
-//	Class names for the grid system
-//	--- 	NOTES: 	---
-//	Only .container-fluid is supported currently.
-//	Column naming follows standard mini.css naming conventions
-//	instead of Bootstrap conventions.
-//	(example: `col md-1` instead of `col-md-1`)
-//	Offsets are still built using the hidden column class, which is
-//	suffixed with `-hidden` for convenience's sake.
-//	-------------------
-$grid-container-name:						container-fluid;					// Name for the grid container class
-$grid-row-name:								row;								// Name for the grid's row class
-$grid-column-name:							col;								// Name for the grid's column class
-$grid-extra-small-device-name:				xs;									// Name for extra small devices
-$grid-small-device-name:					sm;									// Name for small devices
-$grid-medium-device-name:					md;									// Name for medium devices
-$grid-large-device-name:					lg;									// Name for large devices
-$grid-no-show-name:							hidden;								// Name for hidden grid elements class
-//	Grid breakpoints for different screens
-$grid-small-breakpoint:						768px;								// Breakpoint for extra small to small devices
-$grid-medium-breakpoint:					992px;								// Breakpoint for small to medium devices
-$grid-large-breakpoint:						1200px;								// Breakpoint for medium to large devices
-//	Enable grid(s) (_grid.scss). (Use individual mixins below to use.)
-@import '../scss/mini/grid';
-// Use grid mixin to create grid with given specs. For more information
-// refer to the grid.scss file to check the definitions.
-@include make-grid($grid-container-name, 15px, $grid-row-name, $grid-column-name, 12, 15px, $grid-extra-small-device-name, $grid-small-device-name, $grid-medium-device-name, $grid-large-device-name, $grid-no-show-name, $grid-small-breakpoint, $grid-medium-breakpoint, $grid-large-breakpoint);
-//====================================================================
-//	Variable definitions for the Form module (_form.scss)
-//====================================================================
-//	Class names for the forms and components
-//	--- 	NOTES: 	---
-//	Basic styling is applied to forms using the .form class. The usual
-//	mini.css syntax should be used instead of the Bootstrap syntax.
-//	.form-group is not supported inside .form-inline.
-//	.form-control-static, .has-error, .has-warning, .has-success are not
-//	supported.
-//	No class is provided for .control-label and subsequently no styling.
-//	Focus and invalid borders are styled approximately.
-//	The width of the left column (label) of horizontal forms is preset to
-//	20%.
-//	Some other functionalities are not supported as they are considered
-//	unimportant for the time being.
-//	No form element size variants are supported yet.
-//	-------------------
-$form-class-name:							form;								// Name for the form class
-$form-control-group-name:					form-group;							// Name for the form's control group class
-//	Colors for form components
-$form-focus-color:							#66afe9;							// Color for focused form element outline
-$form-invalid-color:						#a94442;							// Color for invalid form element outline
-//	Enable forms (_form.scss). (Use individual mixins below to use.)
-@import '../scss/mini/form';
-// Use form mixin to create form with given specs. For more information
-// refer to the _form.scss file to check the definitions.
-@include make-frm($form-class-name, 1px solid #ccc, 4px, 0, 6px 12px, $form-focus-color, $form-invalid-color, not-allowed, .65, darken($body-bg-color,10%), darken($body-bg-color,25%), 34px, 0 0 5px 0, $form-control-group-name,  0 0 15px 0, form-inline, form-horizontal, 20%);
-//====================================================================
-//	Variable definitions for the Table module (_table.scss)
-//====================================================================
-//	Class names for the tables
-//	--- 	NOTES: 	---
-//	The .table class applies the default styling of mini.css (vertical
-//	borders). To get the default styling of Bootstrap, use .table-horizontal
-//	along with .table. 
-//	All customized tables are striped by default.
-//	Hover rows styling is not supported.
-//	Condensed tables are not supported.
-//	Contextual classes on tables are not supported (untested).
-//	Responsive tables are not supported. (Will be added as default in 
-//	later versions)
-//	-------------------
-$table-class-name:							table;								// Name for the table class
-$table-horizontal-name:						table-horizontal;					// Name for the horizontal style tables
-$table-bordered-name:						table-bordered;						// Name for the bordered style tables
-//	Colors for the tables
-$table-head-bg-color:						$body-bg-color;						// Table header background color
-$table-head-color:							$body-color;						// Table header text color
-$table-body-bg-color:						$body-bg-color;						// Table body bakground color
-$table-body-alt-bg-color:					#f9f9f9;							// Table body alternative background color
-$table-body-color:							$body-color;						// Table body text color
-//	Enable tables (_table.scss). (Use individual mixins below to use.)
-@import '../scss/mini/table';
-// Use table mixin to create table with given specs. For more information
-// refer to the _table.scss file to check the definitions.
-@include make-tbl($table-class-name, 1px solid #ddd, 0, 8px, $table-head-bg-color, $table-head-color, $table-body-bg-color,$table-body-alt-bg-color, $table-body-color, $table-horizontal-name, $table-bordered-name);
-//====================================================================
-//	Variable definitions for the Navigation module (_nav.scss)
-//====================================================================
-//	Class names for the navigation elements
-//	--- 	NOTES: 	---
-//	The structure of the navigation bar is based on mini.css structure
-//	conventions. However naming is applied based on the naming conventions
-//	of Bootstrap.
-//	Some colors are based on approximation.
-//	Border color and border radius are built using generic utility mixins.
-//	-------------------
-$navigation-class-name:						navbar;								// Name for the navigation bar class
-$navigation-vertical-name:					navbar-vertical;					// Name for the vertical navigation class
-$navigation-fixed-name:						navbar-fixed;						// Name for the fixed navigation class
-$navigation-logo-name:						navbar-brand;						// Name for the navigation logo class
-$navigation-link-name:						navbar-nav;							// Name for the navigation link class
-// 	Colors and breakpoint for the navigation
-$navigation-bg-color:						#f8f8f8;							// Background color for the navigation bar
-$navigation-color:							$body-color;						// Color for the navigation text
-$navigation-fixed-collapse-breakpoint:		768px;								// Breakpoint for fixed naviation collapse
-//	Enable navigation (_nav.scss). (Use individual mixins below to use.)
-@import '../scss/mini/nav';
-// Use nav mixin to create nav with default specs. For more information
-// refer to the _nav.scss file to check the definitions.
-@include make-nav($navigation-class-name, $navigation-vertical-name, $navigation-fixed-name, $navigation-logo-name, 128.6%, $navigation-link-name, 15px, $navigation-color, $navigation-bg-color, darken, 7.5%, not-allowed, .65, left, 12, 2, $navigation-fixed-collapse-breakpoint, top-right, 10px, 1.75em);
-@include make-border-generic($navigation-class-name);
-@include make-border-radial-style($navigation-class-name, 4px);
-//====================================================================
-//	Variable definitions for the Utilities and Helper Classes module (_utility.scss)
-//====================================================================
-//	Class names for the utility and helper classes (you can remove things you 
-//	don't need or define more if you need them).
-//	--- 	NOTES: 	---
-//	Utilities are enabled at the start of the file.
-//	Close icon colors are approximate.
-//	Generic borders are included (although not part of Bootstrap originally).
-//	No .show class is provided.
-//	Contextual background styles do not have extra padding.
-//	-------------------
-$thumbnail-class-name:						thumbnail;							// Name for the thumbnail class
-$bordered-class-name:						bordered;							// Name for the bordered class
-$bordered-radial-name:						rounded;							// Name for the rounded border class	
-$bordered-radial2-name:						circle;								// Name for the alternative rounded border class
-$colored-text1-name:						text-primary;						// Name for the colored text style 1 class
-$colored-text2-name:						text-success;						// Name for the colored text style 2 class
-$colored-text3-name:						text-info;							// Name for the colored text style 3 class
-$colored-text4-name:						text-warning;						// Name for the colored text style 4 class
-$colored-text5-name:						text-danger;						// Name for the colored text style 5 class
-$colored-text6-name:						text-muted;							// Name for the colored text style 6 class
-$colored-bg-text1-name:						bg-primary;							// Name for the colored background text style 1 class
-$colored-bg-text2-name:						bg-success;							// Name for the colored background text style 2 class
-$colored-bg-text3-name:						bg-info;							// Name for the colored background text style 3 class
-$colored-bg-text4-name:						bg-warning;							// Name for the colored background text style 4 class
-$colored-bg-text5-name:						bg-danger;							// Name for the colored background text style 5 class
-$drag-left-name:							pull-left;							// Name for the drag-left class
-$drag-right-name:							pull-right;							// Name for the drag-right class
-$center-block-name:							center-block;						// Name for the center block class
-$caret-class-name:							caret;								// Name for the caret class
-$close-class-name:							close;								// Name for the close class
-$clearfix-class-name:						clearfix;							// Name for the clearfix class
-$hidden-class-name:							hidden;								// Name for the hidden class
-//	Colors for the utility and helper classes (you can remove things you
-//	don't need or define more colors if you need them).
-$thumbnail-hover-color:						$a-color;							// Border color of the thumbnail when hovering over it
-$bordered-radial-radius:					4px;								// Border radius of rounded borders
-$bordered-radial2-radius:					50%;								// Border radius of the alternative rounded borders
-$colored-text1-color:						$btn-p-bg-color;					// Text color for the colored text style 1 class
-$colored-text2-color:						$btn-s-bg-color;					// Text color for the colored text style 2 class
-$colored-text3-color:						$btn-i-bg-color;					// Text color for the colored text style 3 class
-$colored-text4-color:						$btn-w-bg-color;					// Text color for the colored text style 4 class
-$colored-text5-color:						$btn-d-bg-color;					// Text color for the colored text style 5 class
-$colored-text6-color:						#777;								// Text color for the colored text style 6 class
-$colored-bg-text1-bg-color:					$btn-p-bg-color;					// Background color for the colored text style 1 class
-$colored-bg-text2-bg-color:					$btn-s-bg-color;					// Background color for the colored text style 2 class
-$colored-bg-text3-bg-color:					$btn-i-bg-color;					// Background color for the colored text style 3 class
-$colored-bg-text4-bg-color:					$btn-w-bg-color;					// Background color for the colored text style 4 class
-$colored-bg-text5-bg-color:					$btn-d-bg-color;					// Background color for the colored text style 5 class
-// Use utility mixins to create utility classes with given specs. For more information
-// refer to the _utility.scss file to check the definitions.
-@include make-thumb($thumbnail-class-name, 4px, 1px solid #ddd, 4px, $thumbnail-hover-color);
-@include make-border-generic($bordered-class-name);
-@include make-border-radial-style($bordered-radial-name, $bordered-radial-radius);
-@include make-border-radial-style($bordered-radial2-name, $bordered-radial2-radius);
-@include make-colored-text($colored-text1-name, $colored-text1-color);
-@include make-colored-text($colored-text2-name, $colored-text2-color);
-@include make-colored-text($colored-text3-name, $colored-text3-color);
-@include make-colored-text($colored-text4-name, $colored-text4-color);
-@include make-colored-text($colored-text5-name, $colored-text5-color);
-@include make-colored-text($colored-text6-name, $colored-text6-color);
-@include make-colored-bg-text($colored-bg-text1-name, $colored-bg-text1-bg-color);
-@include make-colored-bg-text($colored-bg-text2-name, $colored-bg-text2-bg-color);
-@include make-colored-bg-text($colored-bg-text3-name, $colored-bg-text3-bg-color);
-@include make-colored-bg-text($colored-bg-text4-name, $colored-bg-text4-bg-color);
-@include make-colored-bg-text($colored-bg-text5-name, $colored-bg-text5-bg-color);
-@include make-caret-down($caret-class-name, 4px, $body-color);
-@include make-close($close-class-name, #aaa, pointer, 21px, 700, #777);
-@include make-drags($drag-left-name, $drag-right-name);
-@include make-center-block($center-block-name);
-@include make-clearfix($clearfix-class-name);
-@include make-hidden($hidden-class-name);
-//====================================================================
-//
-//		EXTRA COMPONENTS (located in `mini-extra`):
-//
-//====================================================================
-//	Variable definitions for the Label module (_label.scss)
-//====================================================================
-// 	Colors and styles (you can remove things you don't need or define more
-//	colors if you need them).
-//	--- 	NOTES: 	---
-//	Label and badge default classes are applied automatically, no contextual
-//	class is needed. Neither .label-default nor .badge-default are supported.
-//	Badge styling is not based on context, they are cotrolled based on the
-//	classes the user specifies.
-//	Labels and badges are sized approximately.
-//	-------------------
-$lbl-default-color:							$btn-alt-color;						// Default text color for labels/badges
-$lbl-default-bg-color:						#777;								// Default background color for labels/badges
-$lbl-style1-bg-color:						$btn-p-bg-color;					// Color for labels/badges style 1
-$lbl-style2-bg-color:						$btn-s-bg-color;					// Color for labels/badges style 2
-$lbl-style3-bg-color:						$btn-i-bg-color;					// Color for labels/badges style 3
-$lbl-style4-bg-color:						$btn-w-bg-color;					// Color for labels/badges style 5
-$lbl-style5-bg-color:						$btn-d-bg-color;					// Color for labels/badges style 6
-//	Label class names (you can remove things you don't need or define more
-//	classes if you need them).
-$lbl-class-name:							label;								// Name for the base labels class
-$lbl-style1-name:							label-primary;						// Name for labels style 1 class
-$lbl-style2-name:							label-success;						// Name for labels style 2 class
-$lbl-style3-name:							label-info;							// Name for labels style 3 class
-$lbl-style4-name:							label-warning;						// Name for labels style 4 class
-$lbl-style5-name:							label-danger;						// Name for labels style 5 class
-$badge-class-name:							badge;								// Name for the base badges class
-$badge-style1-name:							badge-primary;						// Name for badges style 1 class
-$badge-style2-name:							badge-success;						// Name for badges style 2 class
-$badge-style3-name:							badge-info;							// Name for badges style 3 class
-$badge-style4-name:							badge-warning;						// Name for badges style 4 class
-$badge-style5-name:							badge-danger;						// Name for badges style 5 class
-//	Enable labels (_label.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/label';
-// Use label mixins to create labels with given specs. For more information
-// refer to the _label.scss file to check the definitions.
-@include make-lbl($lbl-class-name, $lbl-default-bg-color, $lbl-default-color, .25em, .2em .6em .3em, hide);
-@include make-lbl-style($lbl-class-name, $lbl-style1-name, $lbl-default-color, $lbl-style1-bg-color);
-@include make-lbl-style($lbl-class-name, $lbl-style2-name, $lbl-default-color, $lbl-style2-bg-color);
-@include make-lbl-style($lbl-class-name, $lbl-style3-name, $lbl-default-color, $lbl-style3-bg-color);
-@include make-lbl-style($lbl-class-name, $lbl-style4-name, $lbl-default-color, $lbl-style4-bg-color);
-@include make-lbl-style($lbl-class-name, $lbl-style5-name, $lbl-default-color, $lbl-style5-bg-color);
-@include make-lbl($badge-class-name, $lbl-default-bg-color, $lbl-default-color, 10px, 3px 7px, hide);
-@include make-lbl-style($badge-class-name, $badge-style1-name, $lbl-default-color, $lbl-style1-bg-color);
-@include make-lbl-style($badge-class-name, $badge-style2-name, $lbl-default-color, $lbl-style2-bg-color);
-@include make-lbl-style($badge-class-name, $badge-style3-name, $lbl-default-color, $lbl-style3-bg-color);
-@include make-lbl-style($badge-class-name, $badge-style4-name, $lbl-default-color, $lbl-style4-bg-color);
-@include make-lbl-style($badge-class-name, $badge-style5-name, $lbl-default-color, $lbl-style5-bg-color);
-//====================================================================
-//	Variable definitions for the Tab module (_tab.scss)
-//====================================================================
-//	Tab class names.
-//	--- 	NOTES: 	---
-//	Bootstrap naming conventions are used, but the structure follows the
-//	component structure of mini.css.
-//	Some extra styles are applied at the end of the module definition. This
-//	is due to the way that Bootstrap's tabs are styled.
-//	No events and methods are supported as of yet.
-//	-------------------
-$tabs-class-name:							nav-tabs;							// Name for the tab system container class
-// 	Colors and styles (you can remove things you don't need or define more
-//	colors if you need them).
-$tabs-border-color:							#ddd;								// Border color for the tabs system
-$tabs-content-bg-color:						#fff;								// Background for the active tab's content
-$tabs-color:								$a-color;							// Color for the text in the tab labels
-$tabs-bg-color:								$body-bg-color;						// Background color for the tab labels
-$tabs-active-color:							$body-color;						// Color for the text in the active tab's label
-$tabs-active-bg-color:						$tabs-content-bg-color;				// Background color for the active tab's label
-$tabs-active-stripe-style:					1px solid #ddd;						// Style for the active tab label's stripe
-//	Enable tabs (_tab.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/tab';
-// Use tabs mixin to create tab system with given specs. For more information
-// refer to the _tab.scss file to check the definitions.
-@include make-tabs($tabs-class-name, 250px, 3px, 20px, 10px 18px, $tabs-color, $tabs-bg-color, $tabs-active-color, $tabs-active-bg-color, $tabs-border-color, 4px 4px 0 0, $tabs-active-stripe-style, 'darken', 10%, $tabs-content-bg-color, 20px);
-.#{$tabs-class-name} input[type="radio"] + div > label + div { top: 40px; }
-.#{$tabs-class-name} input[type="radio"] + div > label { border:0; }
-.#{$tabs-class-name} input[type="radio"]:checked + div > label { border: $tabs-active-stripe-style; border-bottom: 0; }
-//====================================================================
-//	Variable definitions for the Modal module (_modal.scss)
-//====================================================================
-//	Modal class names.
-//	--- 	NOTES: 	---
-//	The modal dialog is all contained in the .modal class.
-//	Background color of the overlay is not the exact same as Bootstrap.
-//	Some colors and styles are approximations.
-//	No alternative sizes, methods or events are supported as of yet.
-//	-------------------
-$modal-class-name:							modal;								// Name for the modal class
-// 	Colors and styles (you can remove things you don't need or define more
-//	colors if you need them).
-$modal-bg-color:							$body-bg-color;						// Background color for the modal
-$modal-color:								$body-color;						// Color for the text in the modal
-$modal-border:								1px solid #999;						// Border style for the modal
-//	Enable modal (_modal.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/modal';
-// Use modal mixin to create modal with given specs. For more information
-// refer to the _modal.scss file to check the definitions.
-@include make-modal($modal-class-name, $modal-color, $modal-bg-color, 'enabled', 'enabled', $modal-border, 6px, 18px, 30px, 600px);
-@include make-modal-close-support($modal-class-name, $close-class-name, 20px);
-//====================================================================
-//	Variable definitions for the Dropdown module (_dropdown.scss)
-//====================================================================
-//	Dropdown class names.
-//	--- 	NOTES: 	---
-//	Dropdown styling uses the default styling of mini.css as the equivalent
-//	Bootstrap component is very different.
-//	-------------------
-$dropdown-class-name:						dropdown;							// Name for the dropdown class
-//	Enable dropdown (_dropdown.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/dropdown';
-// Use dropdown mixin to create dropdown with given specs. For more information
-// refer to the _dropdown.scss file to check the definitions.
-@include make-dropdown($navigation-class-name, $navigation-link-name,$dropdown-class-name, 20px, 80%);
-//====================================================================
-//	Variable definitions for the Collapse module (_collapse.scss)
-//====================================================================
-//	Collapse and accordion class names.
-//	--- 	NOTES: 	---
-//	Sizes and colors are approximate. The colors and style of the collapsed 
-//	(hidden) content are based on the Bootstrap example that uses the well.
-//	Classes for collapse and accordion components are .collapse and
-//	.accordion respectively.
-//	-------------------
-$collapse-class-name:						collapse;							// Name for the collapse class
-$accordion-class-name:						accordion;							// Name for the accordion class
-// 	Collapse colors and styles (you can remove things you don't need or 
-//	define more colors if you need them).
-$collapse-border:							1px solid #e3e3e3;					// Border style for the collapse
-$collapse-color:							$body-color;						// Color for the text in the collapse
-$collapse-bg-color:							#f5f5f5;							// Background color for the collapse
-// 	Accordion colors and styles (you can remove things you don't need or 
-//	define more colors if you need them).
-$accordion-border:							$collapse-border;					// Border style for the accordion
-$accordion-color:							$collapse-color;					// Color for the text in the accordion
-$accordion-bg-color:						$body-bg-color;						// Background color for the accordion
-$accordion-label-color:						$collapse-color;					// Color for the text in the accordion's label
-$accordion-label-bg-color:					$collapse-bg-color;					// Background color for the accordion's label
-//	Enable collapse (_collapse.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/collapse';
-// Use collapse and accordion mixins to create components wit the given specs.
-// For more information refer to the _collapse.scss file to check the definitions.
-@include make-collapse($collapse-class-name, $collapse-border, 4px, 19px, 6px, $collapse-color, $collapse-bg-color);
-@include make-accordion($accordion-class-name, $accordion-border, 4px, 19px, 6px, $accordion-color, $accordion-bg-color, $accordion-label-color, $accordion-label-bg-color, 8px, 'darken', 7.5%);
-//====================================================================
-//	Variable definitions for the Progress module (_progress.scss)
-//====================================================================
-//	Progress and progress variants class names.
-//	--- 	NOTES: 	---
-//	Naming conventions are based on the Bootstrap names, syntax is based
-//	on the default mini.css syntax.
-//	Colors and borders might look different due to some approximations.
-//	-------------------
-$progress-class-name:						progress-bar;						// Name for the progress class
-$progress-bar-style1-name:					progress-bar-success;				// Name for the progress bar style 1 class
-$progress-bar-style2-name:					progress-bar-info;					// Name for the progress bar style 2 class
-$progress-bar-style3-name:					progress-bar-warning;				// Name for the progress bar style 3 class
-$progress-bar-style4-name:					progress-bar-danger;				// Name for the progress bar style 4 class
-// Progress and progress variants colors (you can remove things you 
-//	don't need or define more colors if you need them).
-$progress-bg-color:							#d7d7d7;							// Background color for the progress bar container
-$progress-bar-color:						$btn-alt-color;						// Color for the text of the progress bar
-$progress-bar-style1-color:					$btn-alt-color;						// Color for the text of the style 1 progress bar
-$progress-bar-style2-color:					$btn-alt-color;						// Color for the text of the style 2 progress bar
-$progress-bar-style3-color:					$btn-alt-color;						// Color for the text of the style 3 progress bar
-$progress-bar-style4-color:					$btn-alt-color;						// Color for the text of the style 4 progress bar
-$progress-bar-bg-color:						$btn-p-bg-color;					// Background color for the progress bar
-$progress-bar-style1-bg-color:				$btn-s-bg-color;					// Background color for the style 1 progress bar
-$progress-bar-style2-bg-color:				$btn-i-bg-color;					// Background color for the style 2 progress bar
-$progress-bar-style3-bg-color:				$btn-w-bg-color;					// Background color for the style 3 progress bar
-$progress-bar-style4-bg-color:				$btn-d-bg-color;					// Background color for the style 4 progress bar
-//	Enable progress (_progress.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/progress';
-// Use progress mixins to create progress bars with given specs. For more 
-// information refer to the _progress.scss file to check the definitions.
-@include make-progress($progress-class-name, 20px, 4px, $progress-bg-color, 12px, $progress-bar-color, $progress-bar-bg-color);
-@include make-progress-bar-variant($progress-class-name, $progress-bar-style1-name, $progress-bar-style1-color, $progress-bar-style1-bg-color);
-@include make-progress-bar-variant($progress-class-name, $progress-bar-style2-name, $progress-bar-style2-color, $progress-bar-style2-bg-color);
-@include make-progress-bar-variant($progress-class-name, $progress-bar-style3-name, $progress-bar-style3-color, $progress-bar-style3-bg-color);
-@include make-progress-bar-variant($progress-class-name, $progress-bar-style4-name, $progress-bar-style4-color, $progress-bar-style4-bg-color);
-//====================================================================
-//	Variable definitions for the Spinner module (spinner.scss)
-//====================================================================
-//	Spinner class names.
-//	--- 	NOTES: 	---
-//	Spinner styles are in line with Bootstrap's style as Bootstrap does
-//	not feature a similar component.
-//	-------------------
-$spinner-dotted-name:						spinner-dots;						// Name for the dotted spinner class
-$spinner-round-name:						spinner-round;						// Name for the round spinner class
-// Spinner colors.
-$spinner-round-doughnout:					6px solid rgba(51,51,51, 0.25);		// Style for the round spinner doughnut
-$spinner-round-spin:						6px solid $btn-p-bg-color;			// Style for the round spinner spinning part
-//	Enable progress (spinner.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/spinner';
-// Use spinner mixins to create spinners with given specs. For more 
-// information refer to the spinner.scss file to check the definitions.
-@include make-spinner-dots($spinner-dotted-name, 20px, 1.5s);
-@include make-spinner-round($spinner-round-name, 20px, $spinner-round-doughnout, $spinner-round-spin, 1.5s);
-//====================================================================
-//	Variable definitions for the Carousel module (_carousel.scss)
-//====================================================================
-//	Carousel class names.
-//	--- 	NOTES: 	---
-//	Carousel styling is very similar to the mini.css default carousel,
-//	although control styles are based on the Bootstrap styling.
-//	Naming and structure conventions are based on mini.css.
-//	-------------------
-$carousel-class-name:						carousel;						// Name for the carousel class
-// Carousel colors and styles.
-$carousel-border:							1px solid #ddd;					// Border style for the carousel
-$carousel-content-bg-color:					#e7e7e7;						// Background color for the carousel
-$carousel-description-color:				$body-bg-color;					// Color for the text in the carousel's description
-$carousel-description-bg-color:				$body-color;					// Background color for the carousel's description
-$carousel-control-color:					#fff;							// Color for the carousel's control elements
-//	Enable carousel (_carousel.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/carousel';
-// Use carousel mixin to create carousel with given specs. For more 
-// information refer to the _carousel.scss file to check the definitions.
-@include make-carousel($carousel-class-name, 80%, 500px, $carousel-border, 4px, $carousel-content-bg-color, 10px, $carousel-description-color, $carousel-description-bg-color, 360px, 160px, 450px, 1.8em, $carousel-control-color);
-//====================================================================
-//	Variable definitions for the Utility module (_utility.scss)
-//====================================================================
-//	Utility class names.
-//	--- 	NOTES: 	---
-//	Some component styles (like wells) are based on approximation.
-//	Alert styles omit the .alert class and just use their style class.
-//	Panel styling is based on approximation.
-//	Panels are based on the mini.css default structure.
-//	Popovers use the default mini.css styling.
-//	Tooltips, jumbotron and some other components from Bootstrap are not
-//	supported. 
-//	Experimental and unstable components are not included.
-//	-------------------
-$breadcrumbs-class-name:					breadcrumb;						// Name for the breadcrumbs class
-$well-class-name:							well;							// Name for the well class
-$alert-style1-class:						alert-success;					// Name for the style 1 alert
-$alert-style2-class:						alert-info;						// Name for the style 2 alert
-$alert-style3-class:						alert-warning;					// Name for the style 3 alert
-$alert-style4-class:						alert-danger;					// Name for the style 4 alert
-$panel-class-name:							panel;							// Name for the panel class
-$panel-header-name:							head;							// Name for the panel's header class
-$button-states-class-name:					stateful;						// Name for the stateful button class
-$button-group-class-name:					btn-grp;						// Name for the button group class
-$popover-above-name:						popover-top;					// Name for the popover above class
-$popover-below-name:						popover-bottom;					// Name for the popover below class
-// 	Utility color variables and styles (you can remove things you 
-//	don't need or define more colors if you need them).
-$well-color:								$body-color;					// Text color for the well
-$well-bg-color:								#f5f5f5;						// Background color for the well
-$panel-color:								$body-color;					// Text color for the panel
-$panel-bg-color:							$body-bg-color;					// Background color for the panel
-$panel-header-color:						$body-color;					// Text color for the panel's header
-$panel-header-bg-color:						#e7e7e7;						// Background color for the panel's header
-$popover-color:								$body-bg-color;					// Text color for the popover
-$popover-bg-color:							$body-color;					// Background color for the popover
-//	Enable utilities (_utility.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/utility';
-// Use utilities mixins to create utilities with given specs. For more 
-// information refer to the _utility.scss file to check the definitions.
-@include make-breadcrumbs($breadcrumbs-class-name, 1);
-@include make-generic-container($well-class-name, $well-color, $well-bg-color, 1px solid #e3e3e3, 4px, 19px);
-@include make-alert($alert-style1-class, darken($btn-s-bg-color,20%), lighten($btn-s-bg-color, 10%) , 1px solid darken($btn-s-bg-color, 10%), 4px, 15px, close);
-@include make-alert($alert-style2-class, darken($btn-i-bg-color,20%), lighten($btn-s-bg-color, 10%) , 1px solid darken($btn-i-bg-color, 10%), 4px, 15px, close);
-@include make-alert($alert-style3-class, darken($btn-w-bg-color,20%), lighten($btn-w-bg-color, 10%) , 1px solid darken($btn-w-bg-color, 10%), 4px, 15px, close);
-@include make-alert($alert-style4-class, darken($btn-d-bg-color,20%), lighten($btn-d-bg-color, 10%) , 1px solid darken($btn-d-bg-color, 10%), 4px, 15px, close);
-@include make-panel(panel, $panel-color, $panel-bg-color, 1px solid #ddd, 4px, 15px, $panel-header-name, $panel-header-color, $panel-header-bg-color, 15px);
-@include make-popover($popover-above-name, top, 5px, 45px, $popover-color, $popover-bg-color, 7px 10px);
-@include make-popover($popover-below-name, bottom, 4px, 45px, $popover-color, $popover-bg-color, 7px 10px);
-// Use experimental utilities mixins to create utilities with given
-// specs. Please exercise caution when using these mixins.
-// @include make-button-states($button-states-class-name);	// This mixin is unstable and buggy, we suggest you disable it.
-// The folowing mixin is considered stable, you can disable it if you need to.
-// @include make-btn-group($button-group-class-name, $btn-class-name, 1px solid #ccc, 4px); 
-// @include make-btn-group(btn-grp, $btn-class-name+'.'+$btn-style1-name, 1px solid darken($btn-p-bg-color, 10%), 4px); 
-// @include make-btn-group(btn-grp, $btn-class-name+'.'+$btn-style2-name, 1px solid darken($btn-s-bg-color, 10%), 4px); 
-// @include make-btn-group(btn-grp, $btn-class-name+'.'+$btn-style3-name, 1px solid 1px solid darken($btn-i-bg-color, 10%), 4px); 
-//====================================================================
-//====================================================================
\ No newline at end of file
diff --git a/flavors/mini-default.css b/flavors/mini-default.css
deleted file mode 100644
index 8f1bd48..0000000
--- a/flavors/mini-default.css
+++ /dev/null
@@ -1,1869 +0,0 @@
-/*
-	Flavor name: Default (mini-default)
-	Author: Angelos Chalaris (chalarangelo@gmail.com)
-	mini.css version: v1.1 (October, 2016)
-*/
-/*
-	Set font-family, line-height, prevent adjustments of font size after orientation changes in IE and iOS.
-	Set body colors and margin.
-*/
-html {
-  font-family: "Helvetica Neue", Helvetica, sans-serif;
-  font-size: 1em;
-  line-height: 1.5;
-  -ms-text-size-adjust: 100%;
-  -webkit-text-size-adjust: 100%; }
-
-body {
-  margin: 0;
-  color: #222;
-  background-color: #f5f5f5; }
-
-/*
-	Correct display in IE 9-.
-	Give images display: block to be responsive.
-*/
-article, aside, footer, header, nav, section, figcaption, figure, main, details, menu, img {
-  display: block; }
-
-/*
-	Correct margin in IE 8.
-*/
-figure {
-  margin: 1em 40px; }
-
-/*
-	Styles for  headers.
-*/
-h1, h2, h3, h4, h5, h6 {
-  line-height: 1.2;
-  margin: 0.7em 0;
-  font-weight: 500; }
-  h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
-    color: #555555;
-    font-weight: 200; }
-
-h1 {
-  font-size: 2em; }
-
-h2 {
-  font-size: 1.5em; }
-
-h3 {
-  font-size: 1.15em; }
-
-h4 {
-  font-size: 1em; }
-
-h5 {
-  font-size: 0.8em; }
-
-h6 {
-  font-size: 0.7em; }
-
-/*
-	Correct box-sizing in Firefox.
-	Style for horizontal rule.
-*/
-hr {
-  box-sizing: content-box;
-  line-height: 1.2;
-  margin: 0.7em 0;
-  height: 0;
-  border: 0;
-  border-top: 1px solid #cfcfcf; }
-
-/*
-	Style for all small text and size for sub and sup.
-*/
-small, sub, sup {
-  font-size: 75%; }
-
-/*
-	Style for paragraph and preformatted elements.
-*/
-p, pre {
-  margin: 0 0 0.6em; }
-
-/*
-	Style for lists.
-*/
-ul, ol {
-  margin-top: 0;
-  margin-bottom: 0.6em; }
-  ul ul, ul ol, ol ul, ol ol {
-    margin-bottom: 0; }
-
-/*
-	Styles for code and preformatted.
-*/
-samp, kbd, code, pre {
-  font-family: monospace, monospace;
-  font-size: 1em; }
-
-kbd, code, pre {
-  padding: 2px 4px;
-  border-radius: 4px; }
-
-code, pre {
-  background-color: gainsboro; }
-
-kbd {
-  color: #fefefe;
-  background-color: #222; }
-
-pre {
-  display: block;
-  word-break: break-all;
-  word-wrap: break-word; }
-  pre code {
-    padding: 0;
-    font-size: inherit;
-    color: inherit;
-    white-space: pre-wrap;
-    background-color: transparent;
-    border-radius: 0; }
-
-/*
-	Style for hyperlinks, remove underline.
-	Remove gray background on active links in IE 10.
-	Remove outline on focused links when they are also active or hovered.
-*/
-a {
-  background-color: transparent;
-  text-decoration: none;
-  color: #2678b3; }
-  a:active, a:hover {
-    outline-width: 0;
-    color: #3793d5; }
-  a:visited {
-    color: #1d5c89; }
-    a:visited:active, a:visited:hover {
-      color: #2678b3; }
-
-/*
-	Prevent the duplicate application of `bolder` in Safari 6.
-*/
-b, strong {
-  font-weight: inherit; }
-
-/*
-	Correct font weight in Chrome, Edge, Safari.
-*/
-b, strong {
-  font-weight: bolder; }
-
-/*
-	Correct font style in Android 4.3-.
-*/
-dfn {
-  font-style: italic; }
-
-/*
-	Remove botom border in Firefox 39-.
-	Correct text decoration in Chrome, Edge, IE, Opera, and Safari.
-*/
-abbr[title] {
-  border-bottom: none;
-  text-decoration: underline;
-  text-decoration: underline dotted; }
-
-/*
-	Style for mark.
-*/
-mark {
-  background-color: #ffff33;
-  color: #222; }
-
-/*
-	Styling for hidden elements.
-	Correct display for template in IE.
-	Correct display for audio:not([controls]) in iOS 4-7.	
-*/
-[hidden], .hidden, template, audio:not([controls]) {
-  display: none; }
-
-audio:not([controls]) {
-  height: 0; }
-
-/*
-	Correct display in IE 9-.
-*/
-audio, video, progress {
-  display: inline-block; }
-
-/*
-	Styles for sub and sup.
-	Prevent `sub` and `sup` elements from affecting the line height.
-	Correct vertical alignment of progress in Chrome, Firefox, and Opera.
-*/
-sub, sup, progress {
-  vertical-align: baseline; }
-
-sub, sup {
-  line-height: 0;
-  position: relative; }
-
-sub {
-  bottom: -0.25em; }
-
-sup {
-  top: -0.5em; }
-
-/*
-	Remove the border on images inside links in IE 10-.
-	Make images responsive.
-*/
-img {
-  border-style: none;
-  max-width: 100%; }
-
-/*
-	Hide the overflow in IE.
-*/
-svg:not(:root) {
-  overflow: hidden; }
-
-/*
-	Show the overflow in IE and Edge.
-*/
-button, input, hr {
-  overflow: visible; }
-
-/*
-	Style for buttons and input elements.
-*/
-button, input, optgroup, select, textarea {
-  font-family: "Helvetica Neue", Helvetica, sans-serif;
-  font-size: 100%;
-  line-height: 1.2;
-  margin: 0; }
-
-/*
-	Remove the inheritance of text transform in Edge, Firefox, and IE.
-*/
-button, select {
-  text-transform: none; }
-
-/*
-	Correct styling for iOS, Safari and Firefox.
-*/
-button, html [type="button"], [type="reset"], [type="submit"] {
-  -webkit-appearance: button; }
-  button::-moz-focus-inner, html [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
-    border-style: none;
-    padding: 0; }
-  button:-moz-focusring, html [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {
-    outline: 1px dotted ButtonText; }
-
-/*
-	Style for fieldset.
-*/
-fieldset {
-  border: 1px solid #cfcfcf;
-  border-radius: 4px;
-  margin: 0 2px;
-  padding: 0.35em 0.65em 0.75em; }
-
-/*
-	Add correct box sizing and remove padding in IE 10-.
-*/
-[type="checkbox"], [type="radio"], legend {
-  box-sizing: border-box;
-  padding: 0; }
-
-/*
-
-	Correct text wrapping and color inheritance from `fieldset` elements in Edge and IE.
-	Remove the padding so developers are not caught out when they zero out `fieldset` 
-	elements in all browsers.
-*/
-legend {
-  color: inherit;
-  display: table;
-  max-width: 100%;
-  white-space: normal; }
-
-/*
-	Remove the default vertical scrollbar in IE.
-*/
-textarea {
-  overflow: auto; }
-
-/*
-	Correct the cursor style of increment and decrement buttons in Chrome.
-	Make images responsive.
-*/
-[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button, img {
-  height: auto; }
-
-/*
-	Correct styling in Chrome and Safari.
-	Remove the inner padding and cancel buttons in Chrome and Safari on OS X.
-*/
-[type="search"] {
-  -webkit-appearance: textfield;
-  outline-offset: -2px; }
-  [type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration {
-    -webkit-appearance: none; }
-
-/*
-	Correct the inability to style clickable types in iOS and Safari.
-	Change font properties to `inherit` in Safari.
-*/
-::-webkit-file-upload-button {
-  -webkit-appearance: button;
-  font: inherit; }
-
-/*
-	Mixin for button color variant. 
-	Parameters:
-	- $btn-variant-color                  :	The text color of the button variant.
-	- $btn-variant-bg-color               :	The background color of the button variant.
-	- $btn-variant-hover-style	          :	Hover/active/focus style of the button variant. [1]
-	- $btn-variant-hover-style-percentage :	Hover/active/focus style of the button variant percentage modifier.
-	Notes:
-	- [1] : The values that $btn-variant-hover-style can take are `lighten` and `darken`. The inside condition
-		only checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`.
-	- [2] : Do not use this mixin directly, use `make-btn-style` instead.
-*/
-/*
-	Mixin for the buttons.
-	Parameters:
-	- $btn-name                   :	The class name of the buttons.
-	- $btn-border                 :	The border of the buttons.
-	- $btn-border-radius          :	The border-radius of the buttons.
-	- $btn-margin                 :	The margin of the buttons.
-	- $btn-padding                :	The padding of the buttons.
-	- $btn-color                  :	The text color of the buttons.
-	- $btn-bg-color               :	The background color of the buttons.
-	- $btn-hover-style            :	Hover/active/focus style of the buttons. [1]
-	- $btn-hover-style-percentage :	Hover/active/focus style of the buttons percentage modifier.
-	- $btn-cursor                 :	The cursor style when hovering over the buttons.
-	- $btn-disabled-cursor        :	The cursor style when hovering over the buttons whie disabled.
-	- $btn-disabled-opacity       :	The opacity of the buttons when disabled.
-	Notes:
-	- [1] : The values that $btn-hover-style can take are `lighten` and `darken`. The inside condition only 
-		checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`.
-	- [2] : This only creates a basic button style. For more styles use `make-btn-style`.
-*/
-/*
-	Mixin for button styles. 
-	Parameters:
-	- $btn-name                         : The class name of the buttons. [1]
-	- $btn-style-name                   : The class name of the button style.
-	- $btn-style-color                  : The text color of the button style.
-	- $btn-style-bg-color               : The background color of the button style.
-	- $btn-style-hover-style	        : Hover/active/focus style of the button style. [2][3]
-	- $btn-style-hover-style-percentage : Hover/active/focus style of the button style percentage modifier.[3]
-	Notes:
-	- [1] : The value of $btn-name must be the same as the value specified when using `make-btn`, otherwise
-		the specified style will not work correctly.
-	- [2] : The values that $btn-style-hover-style can take are `lighten` and `darken`. The inside condition
-		only checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`.
-	- [3] : The values of $btn-style-hover-style and $btn-style-hover-style-percentage default to `lighten`
-		and `7.5%` if not specified.
-	- [4] : This mixin should be used in combination with `make-btn` and is suggested that you use it after
-		`make-btn`.
-*/
-/*
-	Mixin for button sizes. 
-	Parameters:
-	- $btn-name           : The class name of the buttons. [1]
-	- $btn-size-name      : The class name of the button size.
-	- $btn-size-padding   : The padding of the button size.
-	- $btn-size-font-size : The font-size of the button size.
-	Notes:
-	- [1] : The value of $btn-name must be the same as the value specified when using `make-btn`, otherwise
-		the specified style will not work correctly.
-	- [2] : This mixin should be used in combination with `make-btn` and is suggested that you use it after
-		`make-btn`.
-*/
-.btn, a.btn, a.btn:visited {
-  display: inline-block;
-  border: 0;
-  border-radius: 4px;
-  margin: 2px 0;
-  padding: 6px 12px;
-  color: #2a2a2a;
-  background: #eaeaea;
-  cursor: pointer; }
-  .btn:hover, .btn:active, .btn:focus, a.btn:hover, a.btn:active, a.btn:focus, a.btn:visited:hover, a.btn:visited:active, a.btn:visited:focus {
-    background: #fdfdfd; }
-  .btn.disabled, .btn[disabled], .btn:disabled, a.btn.disabled, a.btn[disabled], a.btn:disabled, a.btn:visited.disabled, a.btn:visited[disabled], a.btn:visited:disabled {
-    cursor: not-allowed;
-    opacity: 0.65; }
-
-.btn.blue, a.btn.blue, a.btn.blue:visited {
-  color: #eeeeee;
-  background: #3f84b3; }
-  .btn.blue:hover, .btn.blue:active, .btn.blue:focus, a.btn.blue:hover, a.btn.blue:active, a.btn.blue:focus, a.btn.blue:visited:hover, a.btn.blue:visited:active, a.btn.blue:visited:focus {
-    background: #5597c3; }
-
-.btn.green, a.btn.green, a.btn.green:visited {
-  color: #eeeeee;
-  background: #2db747; }
-  .btn.green:hover, .btn.green:active, .btn.green:focus, a.btn.green:hover, a.btn.green:active, a.btn.green:focus, a.btn.green:visited:hover, a.btn.green:visited:active, a.btn.green:visited:focus {
-    background: #3bcf57; }
-
-.btn.red, a.btn.red, a.btn.red:visited {
-  color: #eeeeee;
-  background: #ea4848; }
-  .btn.red:hover, .btn.red:active, .btn.red:focus, a.btn.red:hover, a.btn.red:active, a.btn.red:focus, a.btn.red:visited:hover, a.btn.red:visited:active, a.btn.red:visited:focus {
-    background: #ee6a6a; }
-
-.btn.lg {
-  padding: 9px 15px;
-  font-size: 135%; }
-
-.btn.sm {
-  padding: 4px 8px;
-  font-size: 80%; }
-
-/*
-	Mixin for responsive, mobile-first grid. 
-	Parameters:
-	- $container-name    :	The class name of the container for the grid.
-	- $container-padding :	The left and right padding of the container. [1]
-	- $row-name          :	The class name of the grid's rows.
-	- $col-name          :	The class name of the grid's columns.
-	- $col-number        :	The amount of columns in the grid.
-	- $xs-prefix         : 	Class prefix for extra small screens.
-	- $sm-prefix         : 	Class prefix for small screens.
-	- $md-prefix         : 	Class prefix for medium screens.
-	- $lg-prefix         : 	Class prefix for large screens.
-	- $hide-suffix       : 	Class suffix for hidden columns. [2]
-	- $sm-breakpoint     : 	Breakpoint for small screens.
-	- $md-breakpoint     : 	Breakpoint for medium screens.
-	- $lg-breakpoint     : 	Breakpoint for large screens.
-	Notes:
-	- [1] : The padding of the container might cause the page to grow by $container-padding to the right. This 
-			can be fixed either via @media queries or setting the padding to 0.
-	- [2] :	Columns with the $hide-suffix will be only hidden in the screen size specified.
-	- [3] :	Refer to https://github.com/Chalarangelo/mini.css/wiki/Grid for additional information.
-*/
-.grid-container {
-  padding-right: 0;
-  padding-left: 0;
-  margin-right: auto;
-  margin-left: auto;
-  width: 100%; }
-  .grid-container * {
-    box-sizing: border-box; }
-
-.row:before, .row:after {
-  content: "";
-  display: table;
-  clear: both; }
-
-.col {
-  float: left;
-  padding: 12px; }
-
-.xs-1 {
-  width: 8.33333%; }
-
-.xs-2 {
-  width: 16.66667%; }
-
-.xs-3 {
-  width: 25%; }
-
-.xs-4 {
-  width: 33.33333%; }
-
-.xs-5 {
-  width: 41.66667%; }
-
-.xs-6 {
-  width: 50%; }
-
-.xs-7 {
-  width: 58.33333%; }
-
-.xs-8 {
-  width: 66.66667%; }
-
-.xs-9 {
-  width: 75%; }
-
-.xs-10 {
-  width: 83.33333%; }
-
-.xs-11 {
-  width: 91.66667%; }
-
-.xs-12 {
-  width: 100%; }
-
-.sm-no,
-.md-no,
-.lg-no {
-  display: block; }
-
-.xs-no {
-  display: none; }
-
-@media (min-width: 768px) {
-  .sm-1 {
-    width: 8.33333%; }
-
-  .sm-2 {
-    width: 16.66667%; }
-
-  .sm-3 {
-    width: 25%; }
-
-  .sm-4 {
-    width: 33.33333%; }
-
-  .sm-5 {
-    width: 41.66667%; }
-
-  .sm-6 {
-    width: 50%; }
-
-  .sm-7 {
-    width: 58.33333%; }
-
-  .sm-8 {
-    width: 66.66667%; }
-
-  .sm-9 {
-    width: 75%; }
-
-  .sm-10 {
-    width: 83.33333%; }
-
-  .sm-11 {
-    width: 91.66667%; }
-
-  .sm-12 {
-    width: 100%; }
-
-  .xs-no,
-  .md-no,
-  .lg-no {
-    display: block; }
-
-  .sm-no {
-    display: none; } }
-@media (min-width: 1024px) {
-  .md-1 {
-    width: 8.33333%; }
-
-  .md-2 {
-    width: 16.66667%; }
-
-  .md-3 {
-    width: 25%; }
-
-  .md-4 {
-    width: 33.33333%; }
-
-  .md-5 {
-    width: 41.66667%; }
-
-  .md-6 {
-    width: 50%; }
-
-  .md-7 {
-    width: 58.33333%; }
-
-  .md-8 {
-    width: 66.66667%; }
-
-  .md-9 {
-    width: 75%; }
-
-  .md-10 {
-    width: 83.33333%; }
-
-  .md-11 {
-    width: 91.66667%; }
-
-  .md-12 {
-    width: 100%; }
-
-  .xs-no,
-  .sm-no,
-  .lg-no {
-    display: block; }
-
-  .md-no {
-    display: none; } }
-@media (min-width: 1280px) {
-  .lg-1 {
-    width: 8.33333%; }
-
-  .lg-2 {
-    width: 16.66667%; }
-
-  .lg-3 {
-    width: 25%; }
-
-  .lg-4 {
-    width: 33.33333%; }
-
-  .lg-5 {
-    width: 41.66667%; }
-
-  .lg-6 {
-    width: 50%; }
-
-  .lg-7 {
-    width: 58.33333%; }
-
-  .lg-8 {
-    width: 66.66667%; }
-
-  .lg-9 {
-    width: 75%; }
-
-  .lg-10 {
-    width: 83.33333%; }
-
-  .lg-11 {
-    width: 91.66667%; }
-
-  .lg-12 {
-    width: 100%; }
-
-  .xs-no,
-  .sm-no,
-  .md-no {
-    display: block; }
-
-  .lg-no {
-    display: none; } }
-/*
-	Mixin for the forms.
-	Parameters:
-	- $frm-name                  :	The class name of the form.
-	- $frm-border                :	The border of the form elements.
-	- $frm-border-radius         :	The border-radius of the form elements.
-	- $frm-margin                :	The margin of the form elements.
-	- $frm-padding               :	The padding of the form elements.
-	- $frm-focus-color           :	The color used to mark the focused form element.
-	- $frm-invalid-color         :	The color used to mark an invalid form element.
-	- $frm-disabled-cursor       :	The cursor style when hovering over disabled form elements.
-	- $frm-disabled-opacity      :	The opacity of the form elements when disabled.
-	- $frm-readonly-bg-color     :  The background color of the form elements when they are readonly.
-	- $frm-readonly-border-color :	The border color of the form elements when they are readonly.
-	- $frm-select-height         :	The height for non-multiline select elements in the form.
-	- $frm-label-margin          :	The margin for the form's label elements.
-	- $frm-ctrl-group-name       :	The class name of the control groups in the form.
-	- $frm-ctl-group-margin      :	The margin for control groups inside the form.
-	- $frm-inline-name           :	The class name for forms with inline style.
-	- $frm-aligned-name          :	The class name for forms with aligned style.
-	- $frm-aligned-label-width   :	The width of labels in forms with aligned style.	
-	Notes:
-	- [1] : Input elements with button-like style (i.e. submit, reset, button etc.) are not affected by form styling.
-		Please use the button styles and mixins provided to properly style them to your liking.
-*/
-.frm input[type="color"], .frm input[type^="date"], .frm input[type$="time"], .frm input[type="email"],
-.frm input[type="month"], .frm input[type="week"], .frm input[type="text"], .frm input[type="password"],
-.frm input[type="url"], .frm input[type="number"], .frm input[type="search"], .frm input[type="tel"],
-.frm select, .frm textarea {
-  box-sizing: border-box;
-  border: 1px solid #ccc;
-  border-radius: 4px;
-  box-shadow: none; }
-.frm input:not([type]) {
-  box-sizing: border-box;
-  border: 1px solid #ccc;
-  border-radius: 4px;
-  box-shadow: none; }
-.frm input, .frm select, .frm textarea {
-  display: block;
-  margin: 0.2em;
-  padding: 0.3em; }
-  .frm input:focus, .frm select:focus, .frm textarea:focus {
-    border-color: #2678b3; }
-  .frm input[disabled], .frm select[disabled], .frm textarea[disabled] {
-    cursor: not-allowed;
-    opacity: 0.65; }
-  .frm input:invalid, .frm input:focus:invalid, .frm input:focus:invalid:focus, .frm select:invalid, .frm select:focus:invalid, .frm select:focus:invalid:focus, .frm textarea:invalid, .frm textarea:focus:invalid, .frm textarea:focus:invalid:focus {
-    border-color: #e9322d; }
-  .frm input[readonly], .frm select[readonly], .frm textarea[readonly] {
-    background-color: gainsboro;
-    border-color: #b5b5b5; }
-.frm input[type="checkbox"], .frm input[type="radio"] {
-  display: inline-block; }
-.frm select {
-  height: 1.9em; }
-  .frm select[multiple] {
-    height: auto; }
-.frm label {
-  margin: 0.5em 0 0 0.2em; }
-.frm.inline input, .frm.inline select, .frm.inline textarea, .frm.inline label, .frm.aligned input, .frm.aligned select, .frm.aligned textarea, .frm.aligned label {
-  display: inline-block; }
-.frm.inline .ctrl-group {
-  display: inline-block; }
-.frm.aligned .ctrl-group label {
-  text-align: right;
-  vertical-align: middle;
-  width: 15em;
-  margin-top: 0; }
-.frm .ctrl-group {
-  margin: 0 0 0.3em 0; }
-
-/*
-	Mixin for the tables.
-	Parameters:
-	- $tbl-name                  :	The class name of the table.
-	- $tbl-border                :	The border of the table and cells. [1]
-	- $tbl-margin                :	The margin of the table cells.
-	- $tbl-padding               :	The padding of the table cells.
-	- $tbl-head-bg-color         :	The color of the thead background.
-	- $tbl-head-color            :	The color of the thead text.
-	- $tbl-body-bg-color         :	The color of the even-numbered rows in tbody.
-	- $tbl-body-alt-bg-color     :	The color of the odd-numbered rows in tbody.
-	- $tbl-body-color            :  The color of the text in tbody.
-	- $tbl-horizontal-name       :	The class name for the horizontal style table.
-	- $tbl-bordered-name         :	The class name for the bordered style table.
-	Notes:
-	- [1] : This style will apply to the table and cells. All styles applied to 
-		the table (horizontal, bordered) will use the same style of border.
-*/
-.tbl {
-  border-collapse: collapse;
-  border-spacing: 0;
-  empty-cells: show;
-  border: 1px solid #bdbdbd; }
-  .tbl td, .tbl th {
-    overflow: visible;
-    border-left: 1px solid #bdbdbd;
-    border-bottom: none;
-    margin: 0;
-    padding: 0.5em; }
-  .tbl thead {
-    background-color: #d9d9d9;
-    color: #111;
-    text-align: left; }
-  .tbl tbody {
-    background-color: #f5f5f5;
-    color: #111; }
-    .tbl tbody tr:nth-child(2n-1) {
-      background-color: #ececec; }
-  .tbl.hor td, .tbl.hor th {
-    border-left: none;
-    border-bottom: 1px solid #bdbdbd; }
-  .tbl.bor td, .tbl.bor th {
-    border-bottom: 1px solid #bdbdbd; }
-
-/*
-	Mixin for navigation bar and complementary styles.
-	Parameters:
-	- $nav-name                                   :	The class name for the navigation bar.
-	- $nav-vertical-name                          :	The class name for the vertical style of the navigation bar.
-	- $nav-fixed-name                             :	The class name for the fixed style of the navigation bar.
-	- $nav-logo-name                              :	The class name for the logo item of the navigation bar.
-	- $nav-logo-size                              :	The font-size of the logo item of the navigation bar.
-	- $nav-link-name                              :	The class name for the navigation links of the navigation bar.
-	- $nav-padding                                :	The padding of the elements of the navigation bar. [1]
-	- $nav-color                                  :	The text color of the navigation elements.
-	- $nav-bg-color                               :	The background color of the navigation bar.
-	- $nav-hover-style                            :	Hover/active/focus style of the navigation elements. [2]
-	- $nav-hover-style-percentage                 :	Hover/active/focus style of the navigation elements percentage modifier.
-	- $nav-disabled-cursor                        :	The cursor style when hovering over the navigation elements whie disabled.
-	- $nav-disabled-opacity                       :	The opacity of the navigation elements when disabled.
-	- $nav-fixed-left-right                       :	The orientation of the fixed navigation bar. [3][4]
-	- $grid-columns-total                         :	Total amount fo columns in the used grid. [5]
-	- $grid-coloumns-count-for-nav-fixed-vertical :	Desired amount of columns occupied by the vertical navigation bar in the grid. [5]
-	- $nav-fixed-collapse-breakpoint              :	The breakpoint below which fixed navigation bars will collapse to a menu toggle button.
-	- $nav-fixed-collapse-label-location          :	Location of the collapsed menu button label. [6]
-	- $nav-fixed-collapse-label-margin            :	The margin for the collapsed menu button label.
-	- $nav-fixed-collapse-label-font-size         :	The font size of the collapsed menu button label.
-	Notes:
-	- [1] : This padding applies to all elements of the navigation bar and all styles(e.g. vertical or fixed). 
-		For vertical styles it adapts to apply properly. It also adapts to apply properly to the collapse 
-		label of the navigation bar. Please specify only a single padding value (i.e. 6px, 1.25em etc.) to 
-		avoid CSS errors and ultimately the style not being applied to some elements.
-	- [2] : The values that $nav-hover-style can take are `lighten` and `darken`. The inside condition only 
-		checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`.
-	- [3] : The values of $nav-fixed-left-right recognizes are `left` and `right`. However if invalid values
-		are provided, due to the inside condition only checking for `left`, `right` will be used as the
-		default value.
-	- [4]: The values of $nav-fixed-left-right will apply to all fixed navigation bars. The horizontal bars
-		should not be affected as they are 100% width, meaning that anchoring to left or right should have
-		the same result.
-	- [5] : These values are used to make the navigation bar work better with the grid system. Values do not have 
-		to be the same as the grid or integer values, meaning that values like 12 and 1.5 could work great leaving
-		a small gap just before the third column in the grid. If no grid is specified, you can use percentage
-		values like 100 and 15 to get a 15% width for example.
-	- [6] : The value $nav-fixed-collapse-label-location recognizes are `top-left`, `top-right`, `bottom-left`
-		and `bottom-right`. Due to the way the conditional checking is implemented, `bottom-right` will be
-		used as a default if no valid value is specified.
-*/
-.nav {
-  box-sizing: border-box;
-  background-color: #272727; }
-  .nav .logo {
-    font-size: 135%;
-    color: #ddd; }
-  .nav ul {
-    display: inline-block;
-    list-style: none;
-    margin: 0;
-    padding: 0; }
-    .nav ul li {
-      display: inline-block;
-      margin: 0;
-      white-space: nowrap; }
-      .nav ul li > * {
-        display: inline-block;
-        padding: 8px;
-        color: #ddd;
-        margin: 0; }
-      .nav ul li .link:hover, .nav ul li .link:active, .nav ul li .link:focus {
-        color: #ddd;
-        background: #141414; }
-      .nav ul li .link.disabled, .nav ul li .link[disabled], .nav ul li .link:disabled {
-        cursor: not-allowed;
-        opacity: 0.65; }
-  .nav.vertical ul {
-    display: block; }
-    .nav.vertical ul li {
-      display: block; }
-      .nav.vertical ul li > * {
-        width: 100%;
-        padding: 8px 0; }
-  .nav.fixed {
-    position: fixed;
-    left: 0;
-    top: 0;
-    z-index: 999;
-    width: 100%; }
-    .nav.fixed.vertical {
-      height: 100%;
-      width: 16.66667%; }
-      .nav.fixed.vertical ul {
-        width: 100%; }
-        .nav.fixed.vertical ul li {
-          display: block; }
-  .nav + label {
-    display: none;
-    font-weight: 700;
-    margin: 10px;
-    font-size: 1.75em;
-    padding: 8px;
-    color: #ddd;
-    background-color: #272727;
-    width: auto;
-    position: fixed;
-    z-index: 1000;
-    top: 0;
-    right: 0; }
-    .nav + label:before {
-      position: relative;
-      content: '\2630'; }
-    .nav + label:hover, .nav + label:active, .nav + label:focus {
-      background: #141414; }
-
-@media (max-width: 768px) {
-  .nav {
-    overflow: auto; }
-    .nav.fixed {
-      display: none; }
-      .nav.fixed + label {
-        display: block; }
-
-  input[type="checkbox"]:checked + .nav.fixed {
-    display: block;
-    width: 100%;
-    height: 100%; }
-    input[type="checkbox"]:checked + .nav.fixed ul {
-      display: block; }
-      input[type="checkbox"]:checked + .nav.fixed ul li {
-        display: block; }
-        input[type="checkbox"]:checked + .nav.fixed ul li * {
-          width: 100%;
-          padding: 8px 0; }
-    input[type="checkbox"]:checked + .nav.fixed + label:before {
-      content: '\00d7'; } }
-/*
-	Image thumbnail style mixin. [1]
-	Parameters:
-	- $thumb-name          : 	The class name for the thumbnail style.
-	- $thumb-padding       :	The padding between the image and the border.
-	- $thumb-border	       :	The style of the thumbnail's border.
-	- $thumb-border-radius :	The border radius of the thumbnail.
-	- $thumb-hover-color   :	The color of the thumbnail's border when hovering over it.
-	Notes:
-	- [1] : This style only applies to `img` elements with the class specified in
-		`$thumb-name`.
-*/
-/*
-	Mixin for generic border style.
-	Parameters:
-	- $border-generic-name :	The class name for the generic border.
-	Notes:
-	- [1] : The border style uses rgba to create a 1px solid border with 0.25 
-		opacity around an element, which makes it look properly bordered. 
-		Might be incompatible with older browsers.
-	- [2] : The border style overwrites any border style as it uses 
-		`!important`, exercise caution when using.
-*/
-/*
-	Mixin for generic border radius styles.
-	Parameters:
-	- $border-style-name   :	The class name for the generic border radius style.
-	- $border-style-radius :	The radius for the generic border radius style.
-	Notes:
-	- [1] : The border style overwrites any border style as it uses 
-		`!important`, exercise caution when using.
-*/
-/*
-	Mixin for generic contextual color text styles.
-	Parameters:
-	- $colored-text-name  :	The class name for the contextual color text style.
-	- $colored-text-color :	The color for the contextual color text style.
-	Notes:
-	- [1] : The contextual color text style overwrites any text color as it uses 
-		`!important`, exercise caution when using.
-*/
-/*
-	Mixin for generic contextual background text styles.
-	Parameters:
-	- $colored-bg-text-name  :	The class name for the contextual background text style.
-	- $colored-bg-text-color :	The background color for the contextual background text style.
-	Notes:
-	- [1] : The contextual background text style overwrites any text color as it 
-		uses  `!important`, exercise caution when using.
-*/
-/*
-	Mixin for simple caret utility class.
-	Parameters:
-	- $caret-name  :	The class name for caret utility class.
-	- $caret-size  :	The size of the caret utility element. [1]
-	- $caret-color :	The color of the caret utility element.
-	Notes:
-	- [1] : The caret is built using the border trick. Sizes can be specified
-		in either `px` or `em`, but they might take a bit of tweaking to
-		get right.
-*/
-/*
-	Mixin for simple close sign utility class.
-	Parameters:
-	- $close-name        :	The class name for close utility class.
-	- $close-color       :	The color of the close utility element.
-	- $close-cursor      :	The cursor for the close utility element.
-	- $close-font-size   :	The font-size for the close utility element.
-	- $close-font-weight :	The font-weight for the close utility element.
-	- $close-hover-color :	The color of the close utility element when hovering over it.
-*/
-/*
-	Mixin for quick float classes. [1]
-	Parameters:
-	- $drag-left-name  :	The class name for left drags.
-	- $drag-right-name :	The class name for right drags.
-	Notes:
-	- [1] : These classes use `!important` to set the float properties, 
-		exercise caution when using.
-*/
-/*
-	Mixin for center block class.
-	Parameters:
-	- $center-block-name :	The class name for center block class.
-*/
-/*
-	Mixin for clearfix class.
-	Parameters:
-	- $clearfix-name :	The class name for the clearfix class.
-*/
-/*
-	Mixin for hidden class. [1]
-	Parameters:
-	- $hidden-name :	The class name for hidden elements.
-	Notes:
-	- [1] : This class uses `!important` to set the display property, 
-		exercise caution when using.
-*/
-img.thumb {
-  padding: 0.25em;
-  border: 1px solid #ccc;
-  border-radius: 4px;
-  cursor: pointer; }
-  img.thumb:hover, img.thumb:focus, img.thumbactive {
-    border-color: #2678b3; }
-
-.bordered {
-  border: 1px solid rgba(0, 0, 0, 0.25) !important; }
-
-.rounded {
-  border-radius: 4px !important; }
-
-.circle {
-  border-radius: 50% !important; }
-
-.txt-blue {
-  color: #3f84b3 !important; }
-
-.txt-green {
-  color: #2db747 !important; }
-
-.txt-red {
-  color: #ea4848 !important; }
-
-.bg-blue {
-  background-color: #3f84b3 !important; }
-
-.bg-green {
-  background-color: #2db747 !important; }
-
-.bg-red {
-  background-color: #ea4848 !important; }
-
-.caret {
-  display: inline-block;
-  vertical-align: middle;
-  line-height: 1;
-  width: 0;
-  height: 0;
-  border: 0.35em solid transparent;
-  border-top: 0.35em solid #222; }
-
-.close {
-  display: inline-block;
-  vertical-align: middle;
-  line-height: 1;
-  color: #aaa;
-  font-size: 1.3em;
-  font-weight: 700;
-  cursor: pointer; }
-  .close:before {
-    content: '\00d7'; }
-  .close:hover, .close:active, .close:focus {
-    color: #777; }
-
-.drg-left {
-  float: left !important; }
-
-.drg-right {
-  float: right !important; }
-
-.ct-block {
-  display: block;
-  margin-left: auto;
-  margin-right: auto; }
-
-.cf:before, .cf:after {
-  content: "";
-  display: table;
-  clear: both; }
-
-.hidden {
-  display: none !important; }
-
-/*
-	Mixin for the labels/badges.
-	Parameters:
-	- $lbl-name          :	The class name of the labels/badges.
-	- $lbl-bg-color      :	The background color of the labels/badges.
-	- $lbl-color         :	The text color of the labels/badges.
-	- $lbl-border-radius :	The border-radius of the labels/badges.
-	- $lbl-padding       :	The padding of the labels/badges.
-	- $lbl-hide-on-empty :	Style of the label/badges when empty. [1]
-	Notes:
-	- [1] : The values that $lbl-hide-on-empty can take are `hide` or `show`. The inside condition only 
-		checks if the value is `hide` and acts accordingly. Invalid values are treated as `show`.
-*/
-/*
-	Mixin for labels/badges styles. 
-	Parameters:
-	- $lbl-name                         : The class name of the labels/badges. [1]
-	- $lbl-style-name                   : The class name of the labels/badges style.
-	- $lbl-style-color                  : The text color of the labels/badges style.
-	- $lbl-style-bg-color               : The background color of the labels/badges style.
-	Notes:
-	- [1] : The value of $lbl-name must be the same as the value specified when using `make-lbl`, otherwise
-		the specified style will not work correctly.
-*/
-.lbl {
-  display: inline-block;
-  padding: 6px 10px;
-  color: #eeeeee;
-  background-color: #777;
-  border-radius: 4px; }
-  .lbl:empty {
-    display: none; }
-
-.lbl.blue {
-  color: #eeeeee;
-  background-color: #3f84b3; }
-
-.lbl.green {
-  color: #eeeeee;
-  background-color: #2db747; }
-
-.lbl.red {
-  color: #eeeeee;
-  background-color: #ea4848; }
-
-.bdg {
-  display: inline-block;
-  padding: 3px 8px;
-  color: #eeeeee;
-  background-color: #777;
-  border-radius: 8px; }
-  .bdg:empty {
-    display: none; }
-
-.bdg.blue {
-  color: #eeeeee;
-  background-color: #3f84b3; }
-
-.bdg.green {
-  color: #eeeeee;
-  background-color: #2db747; }
-
-.bdg.red {
-  color: #eeeeee;
-  background-color: #ea4848; }
-
-/*
-	Mixin for tab system.
-	Parameters:
-	- $tabs-name                                  :	The class name for the tab system's container.
-	- $tabs-label-spacing                         :	The spacing between tab labels.
-	- $tabs-label-height                          : The height of the tab labels.
-	- $tabs-label-padding                         :	The padding of the tab labels.
-	- $tabs-label-color                           :	The text color of the tab labels.
-	- $tabs-label-bg-color                        : The background color of the tab labels.
-	- $tabs-active-label-color                    : The text color of the active tab's label.
-	- $tabs-active-label-bg-color                 :	The background color of the active tab's label.
-	- $tabs-border-color                          :	Border color for the tab system. [1]
-	- $tabs-label-border-radius                   : Border radius for the tab labels.
-	- $tabs-active-label-stripe                   : The style of the colored stripe that appears on the active tab's label. [2]
-	- $tabs-inactive-label-hover-style            :	Hover/active/focus style of the tab labels. [3]
-	- $tabs-inactive-label-hover-style-percentage :	Hover/active/focus style of the tab labels percentage modifier.
-	- $tabs-content-bg-color                      : The background color of the active tab's content.
-	- $tabs-content-padding                       :	The padding of the active tab's content.
-	Notes:
-	- [1] : The color specified in $tabs-border-color applies to all borders in the tab system. This
-		includes borders in the tab labels and active tab's content.
-	- [2] : The style of the colored stripe is a border style so you should specify it as such.
-	- [3] : The values that $tabs-hover-style can take are `lighten` and `darken`. The inside condition only 
-		checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`.
-*/
-.tabs {
-  position: relative;
-  min-height: 250px;
-  width: 100%; }
-  .tabs input[type="radio"] {
-    display: none; }
-    .tabs input[type="radio"] + div {
-      display: inline; }
-      .tabs input[type="radio"] + div > label {
-        position: reative;
-        float: left;
-        margin-right: 3px;
-        left: 1px;
-        height: 40px;
-        padding: 8px 14px;
-        color: #2678b3;
-        background-color: #f5f5f5;
-        border: 1px solid #ccc;
-        border-radius: 4px 4px 0 0;
-        cursor: pointer; }
-        .tabs input[type="radio"] + div > label:hover, .tabs input[type="radio"] + div > label:active, .tabs input[type="radio"] + div > label:focus {
-          background: gainsboro; }
-        .tabs input[type="radio"] + div > label + div {
-          position: absolute;
-          z-index: -2;
-          left: 0;
-          top: 39px;
-          bottom: 0;
-          right: 0;
-          padding: 20px;
-          background: #fff;
-          border: 1px solid #ccc; }
-    .tabs input[type="radio"]:checked + div > label {
-      color: #222;
-      background: #fff;
-      border-top: 3px solid #2678b3;
-      border-bottom: 1px solid #fff; }
-      .tabs input[type="radio"]:checked + div > label + div {
-        position: absolute;
-        z-index: -1; }
-
-/*
-	Mixin for modal dialogs.
-	Parameters:
-	- $modal-name               :	The class name for the modal dialog.
-	- $modal-color              :	The text color of the modal dialog.
-	- $modal-bg-color           :	The background color of the modal dialog.
-	- $modal-transition-enabled :	Determines if a transition style will be applied when the modal changes states. [1]
-	- $modal-shadow-enabled     :	Determines if a shadow should be cast from the modal dialog. [1]
-	- $modal-border             :	The border style of the modal dialog.
-	- $modal-border-radius      :	The border radius of the modal dialog's border.
-	- $modal-padding            :	The padding of the modal dialog's contents.
-	- $modal-top-margin         :	The distance of the modal dialog from the top of the parent container. [2]
-	- $modal-width              :	The width of the modal dialog. [2]
-	Notes:
-	- [1] : The values of $modal-transition-enabled and $modal-shadow-enabled should be `enabled` or `disabled`.
-		If an invalid value is supplied, the mixin will act as if it was `disabled`.
-	- [2] : The values of $modal-top-margin and $modal-width should be in percentage (%) values to properly scale
-		on all devices. However, there are no restrictions.
-*/
-/*
-	Mixin for close button support inside of modal dialogs.
-	Parameters:
-	- $modal-name    :	The class name for the modal dialog. [1]
-	- $close-name    :	The class name for the close sign utility class. [2]
-	- $modal-padding :	The padding of the close button. [3]
-	Notes:
-	- [1] : The value of $modal-name should match the value specified in the modal dialog's
-		mixin, in order for this to work correctly.
-	- [2] : The value of $close-name should match the value specified in the close sign utility's
-		mixin, in order for this to work correctly.
-	- [3] : The close button will be placed at the top right of the modal dialog. Its padding
-		should be similar to the value specified for padding in the modal dialog itself, however
-		it could vary based on personal preference.
-*/
-.modal {
-  display: none; }
-  .modal + div {
-    z-index: 997;
-    position: fixed;
-    width: 100%;
-    height: 0;
-    opacity: 0;
-    display: none;
-    transition: opacity .3s ease-out; }
-    .modal + div > div {
-      z-index: 998;
-      position: relative;
-      width: 45%;
-      color: #222;
-      background-color: #f5f5f5;
-      margin: 8.5% auto 0;
-      padding: 18px;
-      border: 1px solid #ccc;
-      border-radius: 4px;
-      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5); }
-  .modal:checked + div {
-    height: 100%;
-    opacity: 1;
-    display: block; }
-    .modal:checked + div > label {
-      background-color: rgba(0, 0, 0, 0.35);
-      position: fixed;
-      width: 100%;
-      height: 100%;
-      top: 0; }
-
-.modal + div > div .close {
-  position: absolute;
-  top: 20px;
-  right: 20px; }
-
-/*
-	Mixin for navigation bar's dropdown element.
-	Parameters:
-	- $nav-name             :	The class name for the navigation bar. [1]
-	- $nav-link-name        :	The class name for the navigation links of the navigation bar. [1]
-	- $dropdown-name        :	The class name for the dropdown element. [2]
-	- $dropdown-left-margin :	The left margin of the dropdown element's contents. [3]
-	- $dropdown-font-size   :	The font size of the dropdown element's contents.
-	Notes:
-	- [1] : The values of $nav-name and $nav-link-name must match those specified in the navigation bar's
-		definition, otherwise the dropdown element will not work properly.
-	- [2] : The value of $dropdown-name is used in two distinct elements of the component, namely the
-		checkbox and the dropdown toggle.
-	- [3] : The value of $dropdown-left-margin will affect all open dropdown menus, as well as dropdown
-		menus on mobile screens. It is suggested that you set this value to something different than
-		0 to visually represent the menu hierarchy in devices with smaller screens.
-*/
-.nav .link.dropdown {
-  cursor: pointer; }
-.nav input[type="checkbox"], .nav input[type="radio"] {
-  display: none; }
-  .nav input[type="checkbox"].dropdown + div, .nav input[type="radio"].dropdown + div {
-    display: none; }
-  .nav input[type="checkbox"]:checked.dropdown + div, .nav input[type="radio"]:checked.dropdown + div {
-    display: block;
-    font-size: 0.8em;
-    margin-left: 20px; }
-
-/*
-	Mixin for collapse component. 
-	Parameters:
-	- $collapse-name          : The class name of the collapse component.
-	- $collapse-border        :	The border style of the collapse contents.
-	- $collapse-border-radius :	The border radius of the collapse contents.
-	- $collapse-padding       :	The padding of the collapse contents.
-	- $collapse-margin-top    : The margin above the collapse contents. [1]
-	- $collapse-color         : The collapse contents' text color.
-	- $collapse-bg-color      :	The collapse contents' background color.
-	Notes:
-	- [1] : The value of $collapse-margin-top is used for spacing between the button label that is usually
-		above the collapsed contents and the contents themselves.
-*/
-/*
-	Mixin for accordion component. 
-	Parameters:
-	- $accordion-name                   :	The class name of the accordion component.
-	- $accordion-border                 :	The border style of the accordion component.
-	- $accordion-border-radius          :	The border radius of the accordion component. [1]
-	- $accordion-padding                :	The padding of the accordion's contents.
-	- $accordion-margin                 :	The margin between accordion's parts. [2]
-	- $accordion-color                  : 	The accordion contents' text color.
-	- $accordion-bg-color               :	The accordion contents' background color.
-	- $accordion-label-color            : 	The accordion labels' text color.
-	- $accordion-label-bg-color         :	The accordion labels' background color.
-	- $accordion-label-padding          :	The padding of the accordion's labels.
-	- $accordion-hover-style            :	Hover/active/focus style of the accordion's labels. [3]
-	- $accordion-hover-style-percentage :	Hover/active/focus style of the accordion's labels percentage modifier.
-	Notes:
-	- [1] : The value of $accordion-border-radius will be applied to labels along with their contents.
-		Closed labels will have the border-radius applied to all of their corners, while open labels will
-		change accordingly to combine their border with the shown contents.
-	- [2] : The value of $accordion-margin will be applied only to margin-bottom of all parts in order
-		to space them out evenly. This does not apply to label and related content margins.
-	- [3] : The values that $accordion-hover-style can take are `lighten` and `darken`. The inside condition only 
-		checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`.
-*/
-input[type="checkbox"].clps {
-  display: none; }
-  input[type="checkbox"].clps + div {
-    display: none;
-    color: #222;
-    background-color: #eeeeee;
-    padding: 10px;
-    margin-top: 5px;
-    border: 1px solid #ccc;
-    border-radius: 4px; }
-input[type="checkbox"]:checked.clps + div {
-  display: block; }
-
-input[type="radio"].acrd {
-  display: none; }
-  input[type="radio"].acrd + label {
-    width: 100%;
-    display: block;
-    color: #222;
-    background-color: #eeeeee;
-    padding: 8px;
-    margin-bottom: 5px;
-    border: 1px solid #ccc;
-    border-radius: 4px;
-    cursor: pointer; }
-    input[type="radio"].acrd + label:hover, input[type="radio"].acrd + label:active, input[type="radio"].acrd + label:focus {
-      background-color: #dbdbdb; }
-    input[type="radio"].acrd + label + div {
-      display: none;
-      color: #222;
-      background-color: #f5f5f5;
-      padding: 10px;
-      margin-top: -1px;
-      margin-bottom: 5px;
-      border: 1px solid #ccc;
-      border-radius: 0 0 4px 4px; }
-input[type="radio"]:checked.acrd + label {
-  border-radius: 4px 4px 0 0;
-  margin-bottom: 0; }
-  input[type="radio"]:checked.acrd + label + div {
-    display: block; }
-
-/*
-	Mixin for the progress element. 
-	Parameters:
-	- $progress-name          : The class name of the progress wrapper.
-	- $progress-height        :	The height of the progress wrapper.
-	- $progress-border-radius :	The border radius of the progress wrapper.
-	- $progress-bg-color      :	The background color of the progress wrapper. [1]
-	- $progress-font-size     : The font size of the progress bar's text (if any).
-	- $progress-bar-color     : The progress bar's text color.
-	- $progress-bar-bg-color  :	The progress bar's background color.
-	Notes:
-	- [1] : The background color of the progress wrapper should be a different color than the
-		page's background to make sure that it is visible. 
-	- [2] : This only creates a basic progress style. For more progress bar styles use `make-progress-bar-variant`.
-*/
-/*
-	Mixin for progress bar styles. 
-	Parameters:
-	- $progress-name                : 	The class name of the progress wrapper. [1]
-	- $progress-bar-variant-name    :	The class name of the progress bar variant.
-	- $progress-bar-variant-color   :	The progress bar variant's text color.
-	- $progress-bar-variant-bg-coor :	The progress bar variant's background color.
-	Notes:
-	- [1] : The name of $progress-name should match the one specified in `make-progress` for the
-		progress bar variant to work correctly.
-	- [2] : This mixin should be used in combination with `make-progress` and is suggested that you 
-		use it after `make-progress`.
-*/
-.prg {
-  position: relative;
-  overflow: hidden;
-  height: 20px;
-  background-color: #d7d7d7;
-  border-radius: 4px; }
-  .prg > span {
-    float: left;
-    width: 0;
-    height: 100%;
-    color: #eeeeee;
-    background-color: #3f84b3;
-    text-align: center;
-    font-size: 0.8em; }
-
-.prg > span.green {
-  color: #eeeeee;
-  background-color: #2db747; }
-
-.prg > span.red {
-  color: #eeeeee;
-  background-color: #ea4848; }
-
-/*
-	Mixin for dotted spinner component. 
-	Parameters:
-	- $spinner-dots-name           :	The class name of the dotted spinner component.
-	- $spinner-dots-height         :	The height of the dotted spinner component. [1][2]
-	- $spinner-dots-animation-time :	The animation time of the dotted spinner component.
-	Notes:
-	- [1] : The value of $spinner-dots-height can be specified in `em`, `px` etc. but it is
-		suggested that you specify it in the same measurement as the text base.
-	- [2] : The value of $spinner-dots-height will be used for both the size of the component
-		and the animation. Some tweaking might be required.
-*/
-/*
-	Mixin for dotted spinner component. 
-	Parameters:
-	- $spinner-round-name           :	The class name of the round spinner component.
-	- $spinner-round-size           :	The size of the round spinner component. [1]
-	- $spinner-round-doughnut-style :	The doughnut style of the round spinner component. [2]
-	- $spinner-round-spin-style     :	The spinning part style of the round spinner component. [2]
-	- $spinner-round-animation-time :	The animation time of the round spinner component.
-	Notes:
-	- [1] : The value of $spinner-round-size affects both height and width of the component.
-	- [2] : The values of $spinner-round-doughnut-style and $spinner-round-spin-style are styles
-		specified in border style format.
-*/
-.spinner-dots {
-  display: inline-block;
-  overflow: hidden;
-  height: 1.5em;
-  vertical-align: bottom; }
-  .spinner-dots:after {
-    display: inline-table;
-    white-space: pre;
-    content: "\A.\A..\A...";
-    animation: spin-dots 1.5s steps(4) infinite; }
-
-@keyframes spin-dots {
-  to {
-    transform: translateY(-6em); } }
-.spinner-round {
-  display: inline-block;
-  border: 0.4em solid rgba(34, 34, 34, 0.2);
-  border-left: 0.4em solid #222;
-  transform: translateZ(0);
-  animation: spin-round 1.5s infinite linear; }
-  .spinner-round, .spinner-round:after {
-    border-radius: 50%;
-    width: 1.5em;
-    height: 1.5em; }
-
-@keyframes spin-round {
-  0% {
-    transform: rotate(0deg); }
-  100% {
-    transform: rotate(360deg); } }
-/*
-	Mixin for the carousel component. 
-	Parameters:
-	- $carousel-name                 :	The class name for the carousel.
-	- $carousel-width                :	The width of the carousel. [1]
-	- $carousel-height               :	The height of the carousel.
-	- $carousel-border               :	The style of the carousel's border.
-	- $carousel-border-radius        :	The border-radius of the carousel.
-	- $carousel-container-bg-color   :	The background color of the carousel.
-	- $carousel-content-padding      :	The padding of the carousel's contents. [2]
-	- $carousel-description-color    :	The text color of the carousel's description.
-	- $carousel-description-bg-color :	The background color of the carousel's description.
-	- $carousel-description-top      :	The distance of the carousel's description from the top of the container. [3]
-	- $carousel-description-height   :	The height of the carousel's description area. [3]
-	- $carousel-control-top          :	The distance of the carousel's controls from the top of the container. [3]
-	- $carousel-control-font-size    :	The font-size of the carousel's controls.
-	- $carousel-control-color        :	The text color of the carousel's controls.
-	Notes:
-	- [1] : The height of the carousel is suggested to be defined as a percentage so that
-		it makes it responsive for smaller screens.
-	- [2] : The value of $carousel-content-padding only applies to images inside the carousel.
-	- [3] : The distances from the top are used for positioning the elements. The height of the
-		desccription should normally be the height of the container minus the top distance of
-		the description. Control distance should be about 90% of the container's height.
-*/
-.carousel {
-  position: relative;
-  width: 80%;
-  height: 500px;
-  overflow: hidden;
-  text-align: center;
-  margin: auto;
-  border: 1px solid #ccc;
-  border-radius: 4px; }
-  .carousel input[type="radio"] {
-    display: none; }
-    .carousel input[type="radio"] + div {
-      display: none;
-      position: absolute;
-      width: 100%;
-      height: 100%;
-      left: 0;
-      top: 0;
-      padding: 10px;
-      background-color: #e7e7e7; }
-      .carousel input[type="radio"] + div > img {
-        max-width: 100%;
-        max-height: 100%;
-        margin: auto; }
-      .carousel input[type="radio"] + div > div {
-        position: absolute;
-        width: 100%;
-        height: 160px;
-        overflow: auto;
-        left: 0;
-        top: 340px;
-        background-color: #222;
-        color: #f5f5f5;
-        opacity: 0.1; }
-        .carousel input[type="radio"] + div > div:hover, .carousel input[type="radio"] + div > div:active, .carousel input[type="radio"] + div > div:focus {
-          opacity: 0.8; }
-      .carousel input[type="radio"] + div + label {
-        position: relative;
-        z-index: 998;
-        cursor: pointer;
-        top: 450px;
-        color: #fafafa;
-        font-size: 1.8em; }
-        .carousel input[type="radio"] + div + label:before {
-          content: '\25cb'; }
-    .carousel input[type="radio"]:checked + div {
-      display: block; }
-      .carousel input[type="radio"]:checked + div + label:before {
-        content: '\25cf'; }
-
-/*
-	Mixin for breadcrumbs style.
-	Parameters:
-	- $breadcrumbs-name   :	The class name for the breadcrumbs style.
-	- $breadcrumbs-style :	The style of the breadcrumbs separator character. [1][2][3]
-	Notes:
-	- [1] : $breadcrumbs-style accepts the values 1, 2 or 3. If an invalid value is
-		supplied, it will be treated as 3.
-	- [2] : The three provided styles are as follows:
-	  - $breadcrumbs-style == 1 : forward slash.
-	  - $breadcrumbs-style == 2 : greater than symbol.
-	  - $breadcrumbs-style == 3 : right angle symbol (default).
-	- [3] : The value of $breadcrumbs-style can be omitted and will default to 3.
-*/
-/*
-	Mixin for generic container style.
-	Parameters:
-	- $container-name          : The class name for the generic container.
-	- $container-color         : The text color of the generic container.
-	- $container-bg-color      : The background color of the generic container.
-	- $container-border        : The border style of the generic container.
-	- $container-border-radius : The border-radius of the generic container.
-	- $container-padding       : The content badding of the generic container.
-	Notes:
-	- [1] : This mixin is also used for making alerts and panels.
-*/
-/*
-	Mixin for generic alert style.
-	Parameters:
-	- $alert-name          : The class name for the alert.
-	- $alert-color         : The text color of the alert.
-	- $alert-bg-color      : The background color of the alert.
-	- $alert-border        : The border style of the alert.
-	- $alert-border-radius : The border-radius of the alert.
-	- $alert-padding       : The content badding of the alert.
-	- $close-name          : The class name for the close utility. [1]
-	Notes:
-	- [1] : The value of $close-name must match that of the class specified
-		for close elements for the alert to work correctly.
-	- [2] : This mixin uses `make-generic-container` to partially generate its
-		CSS.
-*/
-/*
-	Mixin for generic panel style.
-	Parameters:
-	- $panel-name            : The class name for the panel.
-	- $panel-color           : The text color of the panel.
-	- $panel-bg-color        : The background color of the panel.
-	- $panel-border          : The border style of the panel.
-	- $panel-border-radius   : The border-radius of the panel.
-	- $panel-padding         : The content badding of the panel.
-	- $panel-header-name     : The class name for the panel's header.
-	- $panel-header-color    : The text color of the panel's header.
-	- $panel-header-bg-color : The background color of the panel's header.
-	- $panel-header-padding  : The padding of the panel's header.
-	Notes:
-	- [1] : This mixin uses `make-generic-container` to partially generate its
-		CSS.
-*/
-/*
-	Mixin for generic popover style.
-	Parameters:
-	- $popover-name          : The name for the popover style
-	- $popover-direction     : The direction of the popover. [1]
-	- $popover-border-radius : The border radius for the popover style.
-	- $popover-distance      : The distance for the popover style's placement. [2]
-	- $popover-color         : The text color of the popover style.
-	- $popover-bg-color      : The background color of the popover style.
-	- $popover-padding       : The padding of the popover.
-	Notes:
-	- [1] : The values that $popover-direction accepts are 'top' and 'bottom'. If an invalid value
-		is provided, it will be treated as 'bottom'.
-	- [2] : The value of $popover-distance should be treated as a general guideline for the popover
-		distance and is supposed to be tweaked with inline styles or helper classes for better use.
-*/
-/*
-	Mixin for generic button states.
-	Parameters:
-	- $button-states-name :	The class name of the stateful button.
-	Notes:
-	- [1] : This mixin is experimental, it might be buggy.
-*/
-/*
-	Mixin for generic button groups.
-	Parameters:
-	- $btn-group-name          :	The class name of the button group.
-	- $btn-name                :	The name of the button class. [1][2]
-	- $btn-group-border        :	The border style of the button group.
-	- $btn-group-border-radius :	The border radius at the edges of the button group.
-	Notes:
-	- [1] :	The value of $btn-name must match that of the generic button class.
-	- [2] : The value of $btn-name can be hacked to allow for button variants to be styled
-		in custom manners (e.g. if you button class is `btn` and your button variant's class
-		is `blue`, you can style it, using `btn +'.blue'`).
-	- [3] : This mixin is experimental, although it is marked stable for most cases.
-	- [4] : The results of this mixin are purely stylistic and do not provide any grouping
-		functionality.
-*/
-.brdcrmb {
-  list-style: none; }
-  .brdcrmb > li {
-    display: inline-block; }
-    .brdcrmb > li + li:before {
-      content: '\27e9\00a0'; }
-
-.well {
-  border: 1px solid #ccc;
-  border-radius: 4px;
-  background-color: #e7e7e7;
-  color: #222;
-  padding: 20px; }
-
-.alert-blue + div {
-  border: 1px solid #32688d;
-  border-radius: 4px;
-  background-color: #5e9cc7;
-  color: #244c68;
-  padding: 20px; }
-
-input[type="checkbox"].alert-blue {
-  display: none; }
-  input[type="checkbox"].alert-blue + div {
-    display: none;
-    position: relative; }
-    input[type="checkbox"].alert-blue + div a {
-      font-weight: 700;
-      text-decoration: none;
-      color: #173142; }
-      input[type="checkbox"].alert-blue + div a:hover, input[type="checkbox"].alert-blue + div a:active, input[type="checkbox"].alert-blue + div a:focus {
-        text-decoration: underline; }
-    input[type="checkbox"].alert-blue + div .close {
-      position: absolute;
-      top: 20px;
-      right: 20px;
-      color: #244c68; }
-      input[type="checkbox"].alert-blue + div .close:hover, input[type="checkbox"].alert-blue + div .close:active, input[type="checkbox"].alert-blue + div .close:focus {
-        color: #173142; }
-
-input[type="checkbox"]:checked.alert-blue + div {
-  display: block; }
-
-.alert-green + div {
-  border: 1px solid #238e37;
-  border-radius: 4px;
-  background-color: #46d160;
-  color: #196527;
-  padding: 20px; }
-
-input[type="checkbox"].alert-green {
-  display: none; }
-  input[type="checkbox"].alert-green + div {
-    display: none;
-    position: relative; }
-    input[type="checkbox"].alert-green + div a {
-      font-weight: 700;
-      text-decoration: none;
-      color: #0f3c17; }
-      input[type="checkbox"].alert-green + div a:hover, input[type="checkbox"].alert-green + div a:active, input[type="checkbox"].alert-green + div a:focus {
-        text-decoration: underline; }
-    input[type="checkbox"].alert-green + div .close {
-      position: absolute;
-      top: 20px;
-      right: 20px;
-      color: #196527; }
-      input[type="checkbox"].alert-green + div .close:hover, input[type="checkbox"].alert-green + div .close:active, input[type="checkbox"].alert-green + div .close:focus {
-        color: #0f3c17; }
-
-input[type="checkbox"]:checked.alert-green + div {
-  display: block; }
-
-.alert-red + div {
-  border: 1px solid #e51a1a;
-  border-radius: 4px;
-  background-color: #ef7676;
-  color: #b71515;
-  padding: 20px; }
-
-input[type="checkbox"].alert-red {
-  display: none; }
-  input[type="checkbox"].alert-red + div {
-    display: none;
-    position: relative; }
-    input[type="checkbox"].alert-red + div a {
-      font-weight: 700;
-      text-decoration: none;
-      color: #891010; }
-      input[type="checkbox"].alert-red + div a:hover, input[type="checkbox"].alert-red + div a:active, input[type="checkbox"].alert-red + div a:focus {
-        text-decoration: underline; }
-    input[type="checkbox"].alert-red + div .close {
-      position: absolute;
-      top: 20px;
-      right: 20px;
-      color: #b71515; }
-      input[type="checkbox"].alert-red + div .close:hover, input[type="checkbox"].alert-red + div .close:active, input[type="checkbox"].alert-red + div .close:focus {
-        color: #891010; }
-
-input[type="checkbox"]:checked.alert-red + div {
-  display: block; }
-
-.panel {
-  border: 1px solid #ccc;
-  border-radius: 4px;
-  background-color: #f5f5f5;
-  color: #222;
-  padding: 0; }
-
-.panel > * {
-  padding: 10px; }
-.panel .head {
-  border: 0;
-  border-bottom: 1px solid #ccc;
-  color: #222;
-  background-color: #e7e7e7;
-  padding: 10px;
-  margin: 0; }
-
-input[type="checkbox"].popover-top {
-  display: none; }
-  input[type="checkbox"].popover-top + label {
-    position: relative; }
-  input[type="checkbox"].popover-top + label > .popover-top {
-    position: absolute;
-    display: none;
-    background-color: #222;
-    color: #f5f5f5;
-    border-radius: 5px;
-    padding: 7px 10px;
-    z-index: 998;
-    width: auto;
-    bottom: 49px; }
-    input[type="checkbox"].popover-top + label > .popover-top:before {
-      position: absolute;
-      display: block;
-      border-top: 7px solid #222;
-      border-right: 7px solid transparent;
-      border-left: 7px solid transparent;
-      bottom: -7px;
-      content: '';
-      left: 50%;
-      margin-left: -7px; }
-input[type="checkbox"]:checked.popover-top + label > .popover-top {
-  display: block; }
-
-input[type="checkbox"].popover-bottom {
-  display: none; }
-  input[type="checkbox"].popover-bottom + label {
-    position: relative; }
-  input[type="checkbox"].popover-bottom + label > .popover-bottom {
-    position: absolute;
-    display: none;
-    background-color: #222;
-    color: #f5f5f5;
-    border-radius: 4px;
-    padding: 7px 10px;
-    z-index: 998;
-    width: auto;
-    top: 49px; }
-    input[type="checkbox"].popover-bottom + label > .popover-bottom:before {
-      position: absolute;
-      display: block;
-      border-bottom: 7px solid #222;
-      border-right: 7px solid transparent;
-      border-left: 7px solid transparent;
-      top: -7px;
-      content: '';
-      left: 50%;
-      margin-left: -7px; }
-input[type="checkbox"]:checked.popover-bottom + label > .popover-bottom {
-  display: block; }
-
-.btn-grp .btn {
-  border: 1px solid #ccc;
-  margin: 0; }
-  .btn-grp .btn:not(:first-child):not(:last-child) {
-    border-radius: 0;
-    border-right: 0; }
-  .btn-grp .btn:first-child {
-    border-radius: 4px 0 0 4px;
-    border-right: 0; }
-  .btn-grp .btn:last-child {
-    border-radius: 0 4px 4px 0; }
-
-.btn-grp .btn.blue {
-  border: 1px solid #32688d;
-  margin: 0; }
-  .btn-grp .btn.blue:not(:first-child):not(:last-child) {
-    border-radius: 0;
-    border-right: 0; }
-  .btn-grp .btn.blue:first-child {
-    border-radius: 4px 0 0 4px;
-    border-right: 0; }
-  .btn-grp .btn.blue:last-child {
-    border-radius: 0 4px 4px 0; }
-
-.btn-grp .btn.green {
-  border: 1px solid #238e37;
-  margin: 0; }
-  .btn-grp .btn.green:not(:first-child):not(:last-child) {
-    border-radius: 0;
-    border-right: 0; }
-  .btn-grp .btn.green:first-child {
-    border-radius: 4px 0 0 4px;
-    border-right: 0; }
-  .btn-grp .btn.green:last-child {
-    border-radius: 0 4px 4px 0; }
-
-.btn-grp .btn.red {
-  border: 1px solid 1px solid #e51a1a;
-  margin: 0; }
-  .btn-grp .btn.red:not(:first-child):not(:last-child) {
-    border-radius: 0;
-    border-right: 0; }
-  .btn-grp .btn.red:first-child {
-    border-radius: 4px 0 0 4px;
-    border-right: 0; }
-  .btn-grp .btn.red:last-child {
-    border-radius: 0 4px 4px 0; }
-
-/*# sourceMappingURL=mini-default.css.map */
diff --git a/flavors/mini-default.min.css b/flavors/mini-default.min.css
deleted file mode 100644
index 77a409e..0000000
--- a/flavors/mini-default.min.css
+++ /dev/null
@@ -1 +0,0 @@
-html{font-family:"Helvetica Neue",Helvetica,sans-serif;font-size:1em;line-height:1.5;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0;color:#222;background-color:#f5f5f5}article,aside,details,figcaption,figure,footer,header,img,main,menu,nav,section{display:block}figure{margin:1em 40px}h1,h2,h3,h4,h5,h6{line-height:1.2;margin:.7em 0;font-weight:500}h1 small,h2 small,h3 small,h4 small,h5 small,h6 small{color:#555;font-weight:200}h1{font-size:2em}h2{font-size:1.5em}h3{font-size:1.15em}h4{font-size:1em}h5{font-size:.8em}h6{font-size:.7em}hr{box-sizing:content-box;line-height:1.2;margin:.7em 0;height:0;border:0;border-top:1px solid #cfcfcf}small,sub,sup{font-size:75%}p,pre{margin:0 0 .6em}ol,ul{margin-top:0;margin-bottom:.6em}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}code,kbd,pre{padding:2px 4px;border-radius:4px}code,pre{background-color:#dcdcdc}kbd{color:#fefefe;background-color:#222}pre{display:block;word-break:break-all;word-wrap:break-word}pre code{padding:0;font-size:inherit;color:inherit;white-space:pre-wrap;background-color:transparent;border-radius:0}a{background-color:transparent;text-decoration:none;color:#2678b3}a:active,a:hover{outline-width:0;color:#3793d5}a:visited{color:#1d5c89}a:visited:active,a:visited:hover{color:#2678b3}b,strong{font-weight:bolder}dfn{font-style:italic}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}mark{background-color:#ff3;color:#222}.hidden,[hidden],audio:not([controls]),template{display:none}audio:not([controls]){height:0}audio,progress,video{display:inline-block}progress,sub,sup{vertical-align:baseline}sub,sup{line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none;max-width:100%}svg:not(:root){overflow:hidden}button,hr,input{overflow:visible}button,input,optgroup,select,textarea{font-family:"Helvetica Neue",Helvetica,sans-serif;font-size:100%;line-height:1.2;margin:0}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner,html [type=button]::-moz-focus-inner{border-style:none;padding:0}[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring,html [type=button]:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid #cfcfcf;border-radius:4px;margin:0 2px;padding:.35em .65em .75em}[type=checkbox],[type=radio],legend{box-sizing:border-box;padding:0}legend{color:inherit;display:table;max-width:100%;white-space:normal}textarea{overflow:auto}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button,img{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}.btn,a.btn,a.btn:visited{display:inline-block;border:0;border-radius:4px;margin:2px 0;padding:6px 12px;color:#2a2a2a;background:#eaeaea;cursor:pointer}.btn:active,.btn:focus,.btn:hover,a.btn:active,a.btn:focus,a.btn:hover,a.btn:visited:active,a.btn:visited:focus,a.btn:visited:hover{background:#fdfdfd}.btn.disabled,.btn:disabled,.btn[disabled],a.btn.disabled,a.btn:disabled,a.btn:visited.disabled,a.btn:visited:disabled,a.btn:visited[disabled],a.btn[disabled]{cursor:not-allowed;opacity:.65}.btn.blue,a.btn.blue,a.btn.blue:visited{color:#eee;background:#3f84b3}.btn.blue:active,.btn.blue:focus,.btn.blue:hover,a.btn.blue:active,a.btn.blue:focus,a.btn.blue:hover,a.btn.blue:visited:active,a.btn.blue:visited:focus,a.btn.blue:visited:hover{background:#5597c3}.btn.green,a.btn.green,a.btn.green:visited{color:#eee;background:#2db747}.btn.green:active,.btn.green:focus,.btn.green:hover,a.btn.green:active,a.btn.green:focus,a.btn.green:hover,a.btn.green:visited:active,a.btn.green:visited:focus,a.btn.green:visited:hover{background:#3bcf57}.btn.red,a.btn.red,a.btn.red:visited{color:#eee;background:#ea4848}.btn.red:active,.btn.red:focus,.btn.red:hover,a.btn.red:active,a.btn.red:focus,a.btn.red:hover,a.btn.red:visited:active,a.btn.red:visited:focus,a.btn.red:visited:hover{background:#ee6a6a}.btn.lg{padding:9px 15px;font-size:135%}.btn.sm{padding:4px 8px;font-size:80%}.grid-container{padding-right:0;padding-left:0;margin-right:auto;margin-left:auto;width:100%}.grid-container *{box-sizing:border-box}.row:after,.row:before{content:"";display:table;clear:both}.col{float:left;padding:12px}.xs-1{width:8.33333%}.xs-2{width:16.66667%}.xs-3{width:25%}.xs-4{width:33.33333%}.xs-5{width:41.66667%}.xs-6{width:50%}.xs-7{width:58.33333%}.xs-8{width:66.66667%}.xs-9{width:75%}.xs-10{width:83.33333%}.xs-11{width:91.66667%}.xs-12{width:100%}.lg-no,.md-no,.sm-no{display:block}.xs-no{display:none}@media (min-width:768px){.sm-1{width:8.33333%}.sm-2{width:16.66667%}.sm-3{width:25%}.sm-4{width:33.33333%}.sm-5{width:41.66667%}.sm-6{width:50%}.sm-7{width:58.33333%}.sm-8{width:66.66667%}.sm-9{width:75%}.sm-10{width:83.33333%}.sm-11{width:91.66667%}.sm-12{width:100%}.lg-no,.md-no,.xs-no{display:block}.sm-no{display:none}}@media (min-width:1024px){.md-1{width:8.33333%}.md-2{width:16.66667%}.md-3{width:25%}.md-4{width:33.33333%}.md-5{width:41.66667%}.md-6{width:50%}.md-7{width:58.33333%}.md-8{width:66.66667%}.md-9{width:75%}.md-10{width:83.33333%}.md-11{width:91.66667%}.md-12{width:100%}.lg-no,.sm-no,.xs-no{display:block}.md-no{display:none}}@media (min-width:1280px){.lg-1{width:8.33333%}.lg-2{width:16.66667%}.lg-3{width:25%}.lg-4{width:33.33333%}.lg-5{width:41.66667%}.lg-6{width:50%}.lg-7{width:58.33333%}.lg-8{width:66.66667%}.lg-9{width:75%}.lg-10{width:83.33333%}.lg-11{width:91.66667%}.lg-12{width:100%}.md-no,.sm-no,.xs-no{display:block}.lg-no{display:none}}.frm input:not([type]),.frm input[type$=time],.frm input[type=color],.frm input[type=email],.frm input[type=month],.frm input[type=number],.frm input[type=password],.frm input[type=search],.frm input[type=tel],.frm input[type=text],.frm input[type=url],.frm input[type=week],.frm input[type^=date],.frm select,.frm textarea{box-sizing:border-box;border:1px solid #ccc;border-radius:4px;box-shadow:none}.frm input,.frm select,.frm textarea{display:block;margin:.2em;padding:.3em}.frm input:focus,.frm select:focus,.frm textarea:focus{border-color:#2678b3}.frm input[disabled],.frm select[disabled],.frm textarea[disabled]{cursor:not-allowed;opacity:.65}.frm input:focus:invalid,.frm input:focus:invalid:focus,.frm input:invalid,.frm select:focus:invalid,.frm select:focus:invalid:focus,.frm select:invalid,.frm textarea:focus:invalid,.frm textarea:focus:invalid:focus,.frm textarea:invalid{border-color:#e9322d}.frm input[readonly],.frm select[readonly],.frm textarea[readonly]{background-color:#dcdcdc;border-color:#b5b5b5}.frm input[type=checkbox],.frm input[type=radio]{display:inline-block}.frm select{height:1.9em}.frm select[multiple]{height:auto}.frm label{margin:.5em 0 0 .2em}.frm.aligned input,.frm.aligned label,.frm.aligned select,.frm.aligned textarea,.frm.inline .ctrl-group,.frm.inline input,.frm.inline label,.frm.inline select,.frm.inline textarea{display:inline-block}.frm.aligned .ctrl-group label{text-align:right;vertical-align:middle;width:15em;margin-top:0}.frm .ctrl-group{margin:0 0 .3em}.tbl{border-collapse:collapse;border-spacing:0;empty-cells:show;border:1px solid #bdbdbd}.tbl td,.tbl th{overflow:visible;border-left:1px solid #bdbdbd;border-bottom:none;margin:0;padding:.5em}.tbl thead{background-color:#d9d9d9;color:#111;text-align:left}.tbl tbody{background-color:#f5f5f5;color:#111}.tbl tbody tr:nth-child(2n-1){background-color:#ececec}.tbl.hor td,.tbl.hor th{border-left:none;border-bottom:1px solid #bdbdbd}.tbl.bor td,.tbl.bor th{border-bottom:1px solid #bdbdbd}.nav{box-sizing:border-box;background-color:#272727}.nav .logo{font-size:135%;color:#ddd}.nav ul{display:inline-block;list-style:none;margin:0;padding:0}.nav ul li{display:inline-block;margin:0;white-space:nowrap}.nav ul li>*{display:inline-block;padding:8px;color:#ddd;margin:0}.nav ul li .link:active,.nav ul li .link:focus,.nav ul li .link:hover{color:#ddd;background:#141414}.nav ul li .link.disabled,.nav ul li .link:disabled,.nav ul li .link[disabled]{cursor:not-allowed;opacity:.65}.nav.vertical ul,.nav.vertical ul li{display:block}.nav.vertical ul li>*{width:100%;padding:8px 0}.nav.fixed{position:fixed;left:0;top:0;z-index:999;width:100%}.nav.fixed.vertical{height:100%;width:16.66667%}.nav.fixed.vertical ul{width:100%}.nav.fixed.vertical ul li{display:block}.nav+label{display:none;font-weight:700;margin:10px;font-size:1.75em;padding:8px;color:#ddd;background-color:#272727;width:auto;position:fixed;z-index:1000;top:0;right:0}.nav+label:before{position:relative;content:'\2630'}.nav+label:active,.nav+label:focus,.nav+label:hover{background:#141414}@media (max-width:768px){.nav{overflow:auto}.nav.fixed{display:none}.nav.fixed+label{display:block}input[type=checkbox]:checked+.nav.fixed{display:block;width:100%;height:100%}input[type=checkbox]:checked+.nav.fixed ul,input[type=checkbox]:checked+.nav.fixed ul li{display:block}input[type=checkbox]:checked+.nav.fixed ul li *{width:100%;padding:8px 0}input[type=checkbox]:checked+.nav.fixed+label:before{content:'\00d7'}}img.thumb{padding:.25em;border:1px solid #ccc;border-radius:4px;cursor:pointer}img.thumb:focus,img.thumb:hover,img.thumbactive{border-color:#2678b3}.bordered{border:1px solid rgba(0,0,0,.25)!important}.rounded{border-radius:4px!important}.circle{border-radius:50%!important}.txt-blue{color:#3f84b3!important}.txt-green{color:#2db747!important}.txt-red{color:#ea4848!important}.bg-blue{background-color:#3f84b3!important}.bg-green{background-color:#2db747!important}.bg-red{background-color:#ea4848!important}.caret{display:inline-block;vertical-align:middle;line-height:1;width:0;height:0;border:.35em solid transparent;border-top:.35em solid #222}.close{display:inline-block;vertical-align:middle;line-height:1;color:#aaa;font-size:1.3em;font-weight:700;cursor:pointer}.close:before{content:'\00d7'}.close:active,.close:focus,.close:hover{color:#777}.drg-left{float:left!important}.drg-right{float:right!important}.ct-block{display:block;margin-left:auto;margin-right:auto}.cf:after,.cf:before{content:"";display:table;clear:both}.hidden{display:none!important}.lbl{display:inline-block;padding:6px 10px;color:#eee;background-color:#777;border-radius:4px}.lbl:empty{display:none}.lbl.blue{color:#eee;background-color:#3f84b3}.lbl.green{color:#eee;background-color:#2db747}.lbl.red{color:#eee;background-color:#ea4848}.bdg{display:inline-block;padding:3px 8px;color:#eee;background-color:#777;border-radius:8px}.bdg:empty{display:none}.bdg.blue{color:#eee;background-color:#3f84b3}.bdg.green{color:#eee;background-color:#2db747}.bdg.red{color:#eee;background-color:#ea4848}.tabs{position:relative;min-height:250px;width:100%}.tabs input[type=radio]{display:none}.tabs input[type=radio]+div{display:inline}.tabs input[type=radio]+div>label{position:reative;float:left;margin-right:3px;left:1px;height:40px;padding:8px 14px;color:#2678b3;background-color:#f5f5f5;border:1px solid #ccc;border-radius:4px 4px 0 0;cursor:pointer}.tabs input[type=radio]+div>label:active,.tabs input[type=radio]+div>label:focus,.tabs input[type=radio]+div>label:hover{background:#dcdcdc}.tabs input[type=radio]+div>label+div{position:absolute;z-index:-2;left:0;top:39px;bottom:0;right:0;padding:20px;background:#fff;border:1px solid #ccc}.tabs input[type=radio]:checked+div>label{color:#222;background:#fff;border-top:3px solid #2678b3;border-bottom:1px solid #fff}.tabs input[type=radio]:checked+div>label+div{position:absolute;z-index:-1}.modal{display:none}.modal+div{z-index:997;position:fixed;width:100%;height:0;opacity:0;display:none;transition:opacity .3s ease-out}.modal+div>div{z-index:998;position:relative;width:45%;color:#222;background-color:#f5f5f5;margin:8.5% auto 0;padding:18px;border:1px solid #ccc;border-radius:4px;box-shadow:0 5px 15px rgba(0,0,0,.5)}.modal:checked+div{height:100%;opacity:1;display:block}.modal:checked+div>label{background-color:rgba(0,0,0,.35);position:fixed;width:100%;height:100%;top:0}.modal+div>div .close{position:absolute;top:20px;right:20px}.nav .link.dropdown{cursor:pointer}.nav input[type=checkbox],.nav input[type=checkbox].dropdown+div,.nav input[type=radio],.nav input[type=radio].dropdown+div{display:none}.nav input[type=checkbox]:checked.dropdown+div,.nav input[type=radio]:checked.dropdown+div{display:block;font-size:.8em;margin-left:20px}input[type=checkbox].clps{display:none}input[type=checkbox].clps+div{display:none;color:#222;background-color:#eee;padding:10px;margin-top:5px;border:1px solid #ccc;border-radius:4px}input[type=checkbox]:checked.clps+div{display:block}input[type=radio].acrd{display:none}input[type=radio].acrd+label{width:100%;display:block;color:#222;background-color:#eee;padding:8px;margin-bottom:5px;border:1px solid #ccc;border-radius:4px;cursor:pointer}input[type=radio].acrd+label:active,input[type=radio].acrd+label:focus,input[type=radio].acrd+label:hover{background-color:#dbdbdb}input[type=radio].acrd+label+div{display:none;color:#222;background-color:#f5f5f5;padding:10px;margin-top:-1px;margin-bottom:5px;border:1px solid #ccc;border-radius:0 0 4px 4px}input[type=radio]:checked.acrd+label{border-radius:4px 4px 0 0;margin-bottom:0}input[type=radio]:checked.acrd+label+div{display:block}.prg{position:relative;overflow:hidden;height:20px;background-color:#d7d7d7;border-radius:4px}.prg>span{float:left;width:0;height:100%;color:#eee;background-color:#3f84b3;text-align:center;font-size:.8em}.prg>span.green{color:#eee;background-color:#2db747}.prg>span.red{color:#eee;background-color:#ea4848}.spinner-dots{display:inline-block;overflow:hidden;height:1.5em;vertical-align:bottom}.spinner-dots:after{display:inline-table;white-space:pre;content:"\A.\A..\A...";animation:spin-dots 1.5s steps(4) infinite}@keyframes spin-dots{to{transform:translateY(-6em)}}.spinner-round{display:inline-block;border:.4em solid rgba(34,34,34,.2);border-left:.4em solid #222;transform:translateZ(0);animation:spin-round 1.5s infinite linear}.spinner-round,.spinner-round:after{border-radius:50%;width:1.5em;height:1.5em}@keyframes spin-round{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.carousel{position:relative;width:80%;height:500px;overflow:hidden;text-align:center;margin:auto;border:1px solid #ccc;border-radius:4px}.carousel input[type=radio]{display:none}.carousel input[type=radio]+div{display:none;position:absolute;width:100%;height:100%;left:0;top:0;padding:10px;background-color:#e7e7e7}.carousel input[type=radio]+div>img{max-width:100%;max-height:100%;margin:auto}.carousel input[type=radio]+div>div{position:absolute;width:100%;height:160px;overflow:auto;left:0;top:340px;background-color:#222;color:#f5f5f5;opacity:.1}.carousel input[type=radio]+div>div:active,.carousel input[type=radio]+div>div:focus,.carousel input[type=radio]+div>div:hover{opacity:.8}.carousel input[type=radio]+div+label{position:relative;z-index:998;cursor:pointer;top:450px;color:#fafafa;font-size:1.8em}.carousel input[type=radio]+div+label:before{content:'\25cb'}.carousel input[type=radio]:checked+div{display:block}.carousel input[type=radio]:checked+div+label:before{content:'\25cf'}.brdcrmb{list-style:none}.brdcrmb>li{display:inline-block}.brdcrmb>li+li:before{content:'\27e9\00a0'}.well{border:1px solid #ccc;border-radius:4px;background-color:#e7e7e7;color:#222;padding:20px}.alert-blue+div{border:1px solid #32688d;border-radius:4px;background-color:#5e9cc7;color:#244c68;padding:20px}input[type=checkbox].alert-blue{display:none}input[type=checkbox].alert-blue+div{display:none;position:relative}input[type=checkbox].alert-blue+div a{font-weight:700;text-decoration:none;color:#173142}input[type=checkbox].alert-blue+div a:active,input[type=checkbox].alert-blue+div a:focus,input[type=checkbox].alert-blue+div a:hover{text-decoration:underline}input[type=checkbox].alert-blue+div .close{position:absolute;top:20px;right:20px;color:#244c68}input[type=checkbox].alert-blue+div .close:active,input[type=checkbox].alert-blue+div .close:focus,input[type=checkbox].alert-blue+div .close:hover{color:#173142}input[type=checkbox]:checked.alert-blue+div{display:block}.alert-green+div{border:1px solid #238e37;border-radius:4px;background-color:#46d160;color:#196527;padding:20px}input[type=checkbox].alert-green{display:none}input[type=checkbox].alert-green+div{display:none;position:relative}input[type=checkbox].alert-green+div a{font-weight:700;text-decoration:none;color:#0f3c17}input[type=checkbox].alert-green+div a:active,input[type=checkbox].alert-green+div a:focus,input[type=checkbox].alert-green+div a:hover{text-decoration:underline}input[type=checkbox].alert-green+div .close{position:absolute;top:20px;right:20px;color:#196527}input[type=checkbox].alert-green+div .close:active,input[type=checkbox].alert-green+div .close:focus,input[type=checkbox].alert-green+div .close:hover{color:#0f3c17}input[type=checkbox]:checked.alert-green+div{display:block}.alert-red+div{border:1px solid #e51a1a;border-radius:4px;background-color:#ef7676;color:#b71515;padding:20px}input[type=checkbox].alert-red{display:none}input[type=checkbox].alert-red+div{display:none;position:relative}input[type=checkbox].alert-red+div a{font-weight:700;text-decoration:none;color:#891010}input[type=checkbox].alert-red+div a:active,input[type=checkbox].alert-red+div a:focus,input[type=checkbox].alert-red+div a:hover{text-decoration:underline}input[type=checkbox].alert-red+div .close{position:absolute;top:20px;right:20px;color:#b71515}input[type=checkbox].alert-red+div .close:active,input[type=checkbox].alert-red+div .close:focus,input[type=checkbox].alert-red+div .close:hover{color:#891010}input[type=checkbox]:checked.alert-red+div{display:block}.panel{border:1px solid #ccc;border-radius:4px;background-color:#f5f5f5;color:#222;padding:0}.panel>*{padding:10px}.panel .head{border:0;border-bottom:1px solid #ccc;color:#222;background-color:#e7e7e7;padding:10px;margin:0}input[type=checkbox].popover-top{display:none}input[type=checkbox].popover-top+label{position:relative}input[type=checkbox].popover-top+label>.popover-top{position:absolute;display:none;background-color:#222;color:#f5f5f5;border-radius:5px;padding:7px 10px;z-index:998;width:auto;bottom:49px}input[type=checkbox].popover-top+label>.popover-top:before{position:absolute;display:block;border-top:7px solid #222;border-right:7px solid transparent;border-left:7px solid transparent;bottom:-7px;content:'';left:50%;margin-left:-7px}input[type=checkbox]:checked.popover-top+label>.popover-top{display:block}input[type=checkbox].popover-bottom{display:none}input[type=checkbox].popover-bottom+label{position:relative}input[type=checkbox].popover-bottom+label>.popover-bottom{position:absolute;display:none;background-color:#222;color:#f5f5f5;border-radius:4px;padding:7px 10px;z-index:998;width:auto;top:49px}input[type=checkbox].popover-bottom+label>.popover-bottom:before{position:absolute;display:block;border-bottom:7px solid #222;border-right:7px solid transparent;border-left:7px solid transparent;top:-7px;content:'';left:50%;margin-left:-7px}input[type=checkbox]:checked.popover-bottom+label>.popover-bottom{display:block}.btn-grp .btn{border:1px solid #ccc;margin:0}.btn-grp .btn:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn:last-child{border-radius:0 4px 4px 0}.btn-grp .btn.blue{border:1px solid #32688d;margin:0}.btn-grp .btn.blue:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn.blue:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn.blue:last-child{border-radius:0 4px 4px 0}.btn-grp .btn.green{border:1px solid #238e37;margin:0}.btn-grp .btn.green:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn.green:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn.green:last-child{border-radius:0 4px 4px 0}.btn-grp .btn.red{border:1px solid 1px solid #e51a1a;margin:0}.btn-grp .btn.red:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn.red:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn.red:last-child{border-radius:0 4px 4px 0}
\ No newline at end of file
diff --git a/flavors/mini-default.scss b/flavors/mini-default.scss
deleted file mode 100644
index 28b0b15..0000000
--- a/flavors/mini-default.scss
+++ /dev/null
@@ -1,436 +0,0 @@
-//====================================================================
-//	This is the file you should edit to make the flavor you want.
-// 	Please read the instructions carefully.
-//====================================================================
-// 				!!	 IMPORTANT	!!
-//	Please copy this file or rename it, if you want to keep the default
-// 	flavor definitions file.
-//====================================================================
-//	Update the comment below to include it in your flavor, providing the information
-//	you want along with your customized flavor. You can also delete it if you don't
-// 	want it in your final CSS file.
-/*
-	Flavor name: Default (mini-default)
-	Author: Angelos Chalaris (chalarangelo@gmail.com)
-	mini.css version: v1.1 (October, 2016)
-*/
-//====================================================================
-//
-//		CORE COMPONENTS (located in `mini`):
-//
-//====================================================================
-//	Variable definitions for the Base module (_base.scss)
-//====================================================================
-//	Basic rules for body
-$body-margin:					0;												// Margin for body
-$body-bg-color:					#f5f5f5;										// Body background color
-$body-color:					#222;											// Body text color
-//	Basic typography rules
-$base-fonts:					"\"Helvetica Neue\", Helvetica, sans-serif";	// Font-family
-$base-font-size:				1em;											// Font-size
-$base-line-height:				1.5;											// Line-height
-//	Rules for headers (multipliers apply on top of the basic typography rules)
-$h1-multiplier:					2;												// Header 1 font-sze multiplier
-$h2-multiplier:					1.5;											// Header 2 font-sze multiplier
-$h3-multiplier:					1.15;											// Header 3 font-sze multiplier
-$h4-multiplier:					1;												// Header 4 font-sze multiplier
-$h5-multiplier:					0.8;											// Header 5 font-sze multiplier
-$h6-multiplier:					0.7;											// Header 6 font-sze multiplier
-$header-line-height-multiplier:	0.8;											// Multiplier for line height of headers					 
-$header-margin:					0.7em 0;										// Margin for headers
-$header-font-weight:			500;											// Font weight for headers
-//	Rules for small elements inside headers
-$header-small-color:			lighten($body-color, 20%);						// Header small text color
-$header-small-font-weight:		200;											// Header small font weight
-//	Rules for horizontal rules
-$hr-line-height-multiplier:		0.8;											// Multiplier for line height of horizontal rule
-$hr-margin:						0.7em 0;										// Margin for horizontal rule
-$hr-border-style:				1px solid darken($body-bg-color, 15%);			// Color and style of horizontal rule
-//	Common content typography rules (paragraphs, lists etc.)
-$p-margin:						0 0 0.6em;										// Margin for paragraph and pre elements
-$small-font-size:				75%;											// Font size for small, sub and sup elements
-$sub-bottom:					-0.25em;										// Sub bottom
-$sup-top:						-0.5em;											// Sup top
-$list-margin-top:				0;												// Top margin for lists
-$list-margin-bottom:			0.6em;											// Bottom margin for lists
-$mark-bg-color:					#ffff33;										// Mark background color
-$mark-color:					$body-color;									// Mark text color
-//	Code, preformatted and keyboard rules
-$code-fonts:					monospace, monospace;							// Font-family for code, pre, kbd, samp elements
-$code-padding:					2px 4px;										// Padding for code and pre elements
-$code-bg-color:					darken($body-bg-color, 10%);					// Code and pre background color	
-$code-border-radius:			4px;											// Border radius for code, pre and kbd elements
-$kbd-bg-color:					$body-color; 									// Kbd background color
-$kbd-color:						lighten($body-bg-color, 3.5%);					// Kbd text color
-//	Hyperlink rules
-$a-color:						#2678b3;										// Hyperlink text color
-$a-hover-color:					lighten($a-color, 10%);							// Hyperlink hover text color
-$a-visited-color:				darken($a-color, 10%);							// Hyperlink visited text color
-$a-visited-hover-color:			$a-color;										// Hyperlink visited hover text color
-//	Button, input and form rules
-$button-fonts:					$base-fonts;									// Font-family for buttons and inputs
-$button-font-size:				100%;											// Font size for buttons and inputs
-$button-line-height-multiplier:	0.8;											// Multiplier for line height of buttons and inputs
-$button-margin:					0;												// Margin for buttons and inputs
-$fieldset-border:				1px solid darken($body-bg-color, 15%);			// Border style for fieldset
-$fieldset-border-radius:		4px;											// Border radius for fieldset
-$fieldset-margin:				0 2px;											// Margin for fieldset
-$fieldset-padding:				0.35em 0.65em 0.75em;							// Padding for fieldset
-//	Enable base (_base.scss) and use the variables defined above.
-@import '../scss/mini/base';
-//====================================================================
-//	Variable definitions for the Button module (_button.scss)
-//====================================================================
-// 	Colors and styles (you can remove things you don't need or define more
-//	colors if you need them).
-$btn-default-color:							#2a2a2a;							// Default text color for buttons
-$btn-alt-color:								#eeeeee;							// Alternative text color for buttons
-$btn-default-bg-color:						#eaeaea;							// Default background color for buttons
-$btn-b-bg-color:							#3f84b3;							// Color for button style 1
-$btn-g-bg-color:							#2db747;							// Color for button style 2
-$btn-r-bg-color:							#ea4848;							// Color for button style 3
-//	Button class names (you can remove things you don't need or define more
-//	classes if you need them).
-$btn-class-name:							btn;								// Name for the base button class
-$btn-style1-name:							'blue';								// Name for button style 1 class
-$btn-style2-name:							'green';							// Name for button style 2 class
-$btn-style3-name:							'red';								// Name for button style 3 class
-$btn-size1-name:							lg;									// Name for the button size 1 class
-$btn-size2-name:							sm;									// Name for the button size 2 class
-//	Enable buttons (_button.scss). (Use individual mixins below to use.)
-@import '../scss/mini/button';
-// Use button mixins to create buttons with given specs. For more information
-// refer to the _button.scss file to check the definitions.
-@include make-btn($btn-class-name, 0, 4px, 2px 0, 6px 12px, $btn-default-color, $btn-default-bg-color, lighten, 7.5%, pointer, not-allowed, .65);
-@include make-btn-style($btn-class-name, $btn-style1-name, $btn-alt-color, $btn-b-bg-color);
-@include make-btn-style($btn-class-name, $btn-style2-name, $btn-alt-color, $btn-g-bg-color);
-@include make-btn-style($btn-class-name, $btn-style3-name, $btn-alt-color, $btn-r-bg-color);
-@include make-btn-size($btn-class-name, $btn-size1-name, 9px 15px, 135%);
-@include make-btn-size($btn-class-name, $btn-size2-name, 4px 8px, 80%);
-//====================================================================
-//	Variable definitions for the Grid module (_grid.scss)
-//====================================================================
-//	Class names for the grid system
-$grid-container-name:						grid-container;						// Name for the grid container class
-$grid-row-name:								row;								// Name for the grid's row class
-$grid-column-name:							col;								// Name for the grid's column class
-$grid-extra-small-device-name:				xs;									// Name for extra small devices
-$grid-small-device-name:					sm;									// Name for small devices
-$grid-medium-device-name:					md;									// Name for medium devices
-$grid-large-device-name:					lg;									// Name for large devices
-$grid-no-show-name:							no;									// Name for hidden grid elements class
-//	Grid breakpoints for different screens
-$grid-small-breakpoint:						768px;								// Breakpoint for extra small to small devices
-$grid-medium-breakpoint:					1024px;								// Breakpoint for small to medium devices
-$grid-large-breakpoint:						1280px;								// Breakpoint for medium to large devices
-//	Enable grid(s) (_grid.scss). (Use individual mixins below to use.)
-@import '../scss/mini/grid';
-// Use grid mixin to create grid with given specs. For more information
-// refer to the grid.scss file to check the definitions.
-@include make-grid($grid-container-name, 0, $grid-row-name, $grid-column-name, 12, 12px, $grid-extra-small-device-name, $grid-small-device-name, $grid-medium-device-name, $grid-large-device-name, $grid-no-show-name, $grid-small-breakpoint, $grid-medium-breakpoint, $grid-large-breakpoint);
-//====================================================================
-//	Variable definitions for the Form module (_form.scss)
-//====================================================================
-//	Class names for the forms and components
-$form-class-name:							frm;								// Name for the form class
-$form-control-group-name:					ctrl-group;							// Name for the form's control group class
-//	Colors for form components
-$form-focus-color:							#2678b3;							// Color for focused form element outline
-$form-invalid-color:						#e9322d;							// Color for invalid form element outline
-//	Enable forms (_form.scss). (Use individual mixins below to use.)
-@import '../scss/mini/form';
-// Use form mixin to create form with given specs. For more information
-// refer to the _form.scss file to check the definitions.
-@include make-frm($form-class-name, 1px solid #ccc, 4px, 0.2em, 0.3em, $form-focus-color, $form-invalid-color, not-allowed, .65, darken($body-bg-color,10%), darken($body-bg-color,25%), 1.9em, 0.5em 0 0 0.2em, $form-control-group-name,  0 0 0.3em 0, inline, aligned,15em);
-//====================================================================
-//	Variable definitions for the Table module (_table.scss)
-//====================================================================
-//	Class names for the tables
-$table-class-name:							tbl;								// Name for the table class
-$table-horizontal-name:						hor;								// Name for the horizontal style tables
-$table-bordered-name:						bor;								// Name for the bordered style tables
-//	Colors for the tables
-$table-head-bg-color:						#d9d9d9;							// Table header background color
-$table-head-color:							#111;								// Table header text color
-$table-body-bg-color:						#f5f5f5;							// Table body bakground color
-$table-body-alt-bg-color:					#ececec;							// Table body alternative background color
-$table-body-color:							#111;								// Table body text color
-//	Enable tables (_table.scss). (Use individual mixins below to use.)
-@import '../scss/mini/table';
-// Use table mixin to create table with given specs. For more information
-// refer to the _table.scss file to check the definitions.
-@include make-tbl($table-class-name, 1px solid #bdbdbd, 0, 0.5em, $table-head-bg-color, $table-head-color, $table-body-bg-color,$table-body-alt-bg-color, $table-body-color, $table-horizontal-name, $table-bordered-name);
-//====================================================================
-//	Variable definitions for the Navigation module (_nav.scss)
-//====================================================================
-//	Class names for the navigation elements
-$navigation-class-name:						nav;								// Name for the navigation bar class
-$navigation-vertical-name:					vertical;							// Name for the vertical navigation class
-$navigation-fixed-name:						fixed;								// Name for the fixed navigation class
-$navigation-logo-name:						logo;								// Name for the navigation logo class
-$navigation-link-name:						link;								// Name for the navigation link class
-// 	Colors and breakpoint for the navigation
-$navigation-bg-color:						#272727;							// Background color for the navigation bar
-$navigation-color:							#ddd;								// Color for the navigation text
-$navigation-fixed-collapse-breakpoint:		768px;								// Breakpoint for fixed naviation collapse
-//	Enable navigation (_nav.scss). (Use individual mixins below to use.)
-@import '../scss/mini/nav';
-// Use nav mixin to create nav with default specs. For more information
-// refer to the _nav.scss file to check the definitions.
-@include make-nav($navigation-class-name, $navigation-vertical-name, $navigation-fixed-name, $navigation-logo-name, 135%, $navigation-link-name, 8px, $navigation-color, $navigation-bg-color, darken, 7.5%, not-allowed, .65, left, 12, 2, $navigation-fixed-collapse-breakpoint, top-right, 10px, 1.75em);
-//====================================================================
-//	Variable definitions for the Utilities and Helper Classes module (_utility.scss)
-//====================================================================
-//	Class names for the utility and helper classes (you can remove things you 
-//	don't need or define more if you need them).
-$thumbnail-class-name:						thumb;								// Name for the thumbnail class
-$bordered-class-name:						bordered;							// Name for the bordered class
-$bordered-radial-name:						rounded;							// Name for the rounded border class	
-$bordered-radial2-name:						circle;								// Name for the alternative rounded border class
-$colored-text1-name:						txt-blue;							// Name for the colored text style 1 class
-$colored-text2-name:						txt-green;							// Name for the colored text style 2 class
-$colored-text3-name:						txt-red;							// Name for the colored text style 3 class
-$colored-bg-text1-name:						bg-blue;							// Name for the colored background text style 1 class
-$colored-bg-text2-name:						bg-green;							// Name for the colored background text style 2 class
-$colored-bg-text3-name:						bg-red;								// Name for the colored background text style 3 class
-$drag-left-name:							drg-left;							// Name for the drag-left class
-$drag-right-name:							drg-right;							// Name for the drag-right class
-$center-block-name:							ct-block;							// Name for the center block class
-$caret-class-name:							caret;								// Name for the caret class
-$close-class-name:							close;								// Name for the close class
-$clearfix-class-name:						cf;									// Name for the clearfix class
-$hidden-class-name:							hidden;								// Name for the hidden class
-//	Colors for the utility and helper classes (you can remove things you
-//	don't need or define more colors if you need them).
-$thumbnail-hover-color:						$a-color;							// Border color of the thumbnail when hovering over it
-$bordered-radial-radius:					4px;								// Border radius of rounded borders
-$bordered-radial2-radius:					50%;								// Border radius of the alternative rounded borders
-$colored-text1-color:						$btn-b-bg-color;					// Text color for the colored text style 1 class
-$colored-text2-color:						$btn-g-bg-color;					// Text color for the colored text style 2 class
-$colored-text3-color:						$btn-r-bg-color;					// Text color for the colored text style 3 class
-$colored-bg-text1-bg-color:					$btn-b-bg-color;					// Background color for the colored text style 1 class
-$colored-bg-text2-bg-color:					$btn-g-bg-color;					// Background color for the colored text style 2 class
-$colored-bg-text3-bg-color:					$btn-r-bg-color;					// Background color for the colored text style 3 class
-//	Enable utilities (_utility.scss). (Use individual mixins below to use.)
-@import '../scss/mini/utility';
-// Use utility mixins to create utility classes with given specs. For more information
-// refer to the _utility.scss file to check the definitions.
-@include make-thumb($thumbnail-class-name, 0.25em, 1px solid #ccc, 4px, $thumbnail-hover-color);
-@include make-border-generic($bordered-class-name);
-@include make-border-radial-style($bordered-radial-name, $bordered-radial-radius);
-@include make-border-radial-style($bordered-radial2-name, $bordered-radial2-radius);
-@include make-colored-text($colored-text1-name, $colored-text1-color);
-@include make-colored-text($colored-text2-name, $colored-text2-color);
-@include make-colored-text($colored-text3-name, $colored-text3-color);
-@include make-colored-bg-text($colored-bg-text1-name, $colored-bg-text1-bg-color);
-@include make-colored-bg-text($colored-bg-text2-name, $colored-bg-text2-bg-color);
-@include make-colored-bg-text($colored-bg-text3-name, $colored-bg-text3-bg-color);
-@include make-caret-down($caret-class-name, 0.35em, #222);
-@include make-close($close-class-name, #aaa, pointer, 1.3em, 700, #777);
-@include make-drags($drag-left-name, $drag-right-name);
-@include make-center-block($center-block-name);
-@include make-clearfix($clearfix-class-name);
-@include make-hidden($hidden-class-name);
-//====================================================================
-//
-//		EXTRA COMPONENTS (located in `mini-extra`):
-//
-//====================================================================
-//	Variable definitions for the Label module (_label.scss)
-//====================================================================
-// 	Colors and styles (you can remove things you don't need or define more
-//	colors if you need them).
-$lbl-default-color:							$btn-alt-color;						// Default text color for labels/badges
-$lbl-default-bg-color:						#777;								// Default background color for labels/badges
-$lbl-b-bg-color:							$btn-b-bg-color;					// Color for labels/badges style 1
-$lbl-g-bg-color:							$btn-g-bg-color;					// Color for labels/badges style 2
-$lbl-r-bg-color:							$btn-r-bg-color;					// Color for labels/badges style 3
-//	Label class names (you can remove things you don't need or define more
-//	classes if you need them).
-$lbl-class-name:							lbl;								// Name for the base labels class
-$lbl-style1-name:							'blue';								// Name for labels/badges style 1 class
-$lbl-style2-name:							'green';							// Name for labels/badges style 2 class
-$lbl-style3-name:							'red';								// Name for labels/badges style 3 class
-$badge-class-name:							bdg;								// Name for the base badges class
-//	Enable labels (_label.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/label';
-// Use label mixins to create labels with given specs. For more information
-// refer to the _label.scss file to check the definitions.
-@include make-lbl($lbl-class-name, $lbl-default-bg-color, $lbl-default-color, 4px, 6px 10px, hide);
-@include make-lbl-style($lbl-class-name, $lbl-style1-name, $lbl-default-color, $lbl-b-bg-color);
-@include make-lbl-style($lbl-class-name, $lbl-style2-name, $lbl-default-color, $lbl-g-bg-color);
-@include make-lbl-style($lbl-class-name, $lbl-style3-name, $lbl-default-color, $lbl-r-bg-color);
-@include make-lbl($badge-class-name, $lbl-default-bg-color, $lbl-default-color, 8px, 3px 8px, hide);
-@include make-lbl-style($badge-class-name, $lbl-style1-name, $lbl-default-color, $lbl-b-bg-color);
-@include make-lbl-style($badge-class-name, $lbl-style2-name, $lbl-default-color, $lbl-g-bg-color);
-@include make-lbl-style($badge-class-name, $lbl-style3-name, $lbl-default-color, $lbl-r-bg-color);
-//====================================================================
-//	Variable definitions for the Tab module (_tab.scss)
-//====================================================================
-//	Tab class names.
-$tabs-class-name:							tabs;								// Name for the tab system container class
-// 	Colors and styles (you can remove things you don't need or define more
-//	colors if you need them).
-$tabs-border-color:							#ccc;								// Border color for the tabs system
-$tabs-content-bg-color:						#fff;								// Background for the active tab's content
-$tabs-color:								$a-color;							// Color for the text in the tab labels
-$tabs-bg-color:								$body-bg-color;						// Background color for the tab labels
-$tabs-active-color:							$body-color;						// Color for the text in the active tab's label
-$tabs-active-bg-color:						$tabs-content-bg-color;				// Background color for the active tab's label
-$tabs-active-stripe-style:					3px solid $a-color;					// Style for the active tab label's stripe
-//	Enable tabs (_tab.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/tab';
-// Use tabs mixin to create tab system with given specs. For more information
-// refer to the _tab.scss file to check the definitions.
-@include make-tabs($tabs-class-name, 250px, 3px, 40px, 8px 14px, $tabs-color, $tabs-bg-color, $tabs-active-color, $tabs-active-bg-color, $tabs-border-color, 4px 4px 0 0, $tabs-active-stripe-style, 'darken', 10%, $tabs-content-bg-color, 20px);
-//====================================================================
-//	Variable definitions for the Modal module (_modal.scss)
-//====================================================================
-//	Modal class names.
-$modal-class-name:							modal;								// Name for the modal class
-// 	Colors and styles (you can remove things you don't need or define more
-//	colors if you need them).
-$modal-bg-color:							$body-bg-color;						// Background color for the modal
-$modal-color:								$body-color;						// Color for the text in the modal
-$modal-border:								1px solid #ccc;						// Border style for the modal
-//	Enable modal (_modal.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/modal';
-// Use modal mixin to create modal with given specs. For more information
-// refer to the _modal.scss file to check the definitions.
-@include make-modal($modal-class-name, $modal-color, $modal-bg-color, 'enabled', 'enabled', $modal-border, 4px, 18px, 8.5%, 45%);
-@include make-modal-close-support($modal-class-name, $close-class-name, 20px);
-//====================================================================
-//	Variable definitions for the Dropdown module (_dropdown.scss)
-//====================================================================
-//	Dropdown class names.
-$dropdown-class-name:						dropdown;							// Name for the dropdown class
-//	Enable dropdown (_dropdown.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/dropdown';
-// Use dropdown mixin to create dropdown with given specs. For more information
-// refer to the _dropdown.scss file to check the definitions.
-@include make-dropdown($navigation-class-name, $navigation-link-name,$dropdown-class-name, 20px, 0.8em);
-//====================================================================
-//	Variable definitions for the Collapse module (_collapse.scss)
-//====================================================================
-//	Collapse and accordion class names.
-$collapse-class-name:						clps;								// Name for the collapse class
-$accordion-class-name:						acrd;								// Name for the accordion class
-// 	Collapse colors and styles (you can remove things you don't need or 
-//	define more colors if you need them).
-$collapse-border:							1px solid #ccc;						// Border style for the collapse
-$collapse-color:							$body-color;						// Color for the text in the collapse
-$collapse-bg-color:							#eeeeee;							// Background color for the collapse
-// 	Accordion colors and styles (you can remove things you don't need or 
-//	define more colors if you need them).
-$accordion-border:							$collapse-border;					// Border style for the accordion
-$accordion-color:							$collapse-color;					// Color for the text in the accordion
-$accordion-bg-color:						$body-bg-color;						// Background color for the accordion
-$accordion-label-color:						$collapse-color;					// Color for the text in the accordion's label
-$accordion-label-bg-color:					$collapse-bg-color;					// Background color for the accordion's label
-//	Enable collapse (_collapse.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/collapse';
-// Use collapse and accordion mixins to create components wit the given specs.
-// For more information refer to the _collapse.scss file to check the definitions.
-@include make-collapse($collapse-class-name, $collapse-border, 4px, 10px, 5px, $collapse-color, $collapse-bg-color);
-@include make-accordion($accordion-class-name, $accordion-border, 4px, 10px, 5px, $accordion-color, $accordion-bg-color, $accordion-label-color, $accordion-label-bg-color, 8px, 'darken', 7.5%);
-//====================================================================
-//	Variable definitions for the Progress module (_progress.scss)
-//====================================================================
-//	Progress and progress variants class names.
-$progress-class-name:						prg;								// Name for the progress class
-$progress-bar-style1-name:					'green';							// Name for the progress bar style 1 class
-$progress-bar-style2-name:					'red';								// Name for the progress bar style 2 class
-// Progress and progress variants colors (you can remove things you 
-//	don't need or define more colors if you need them).
-$progress-bg-color:							#d7d7d7;							// Background color for the progress bar container
-$progress-bar-color:						$btn-alt-color;						// Color for the text of the progress bar
-$progress-bar-style1-color:					$btn-alt-color;						// Color for the text of the style 1 progress bar
-$progress-bar-style2-color:					$btn-alt-color;						// Color for the text of the style 2 progress bar
-$progress-bar-bg-color:						$btn-b-bg-color;					// Background color for the progress bar
-$progress-bar-style1-bg-color:				$btn-g-bg-color;					// Background color for the style 1 progress bar
-$progress-bar-style2-bg-color:				$btn-r-bg-color;					// Background color for the style 2 progress bar
-//	Enable progress (_progress.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/progress';
-// Use progress mixins to create progress bars with given specs. For more 
-// information refer to the _progress.scss file to check the definitions.
-@include make-progress($progress-class-name, 20px, 4px, $progress-bg-color, 0.8em, $progress-bar-color, $progress-bar-bg-color);
-@include make-progress-bar-variant($progress-class-name, $progress-bar-style1-name, $progress-bar-style1-color, $progress-bar-style1-bg-color);
-@include make-progress-bar-variant($progress-class-name, $progress-bar-style2-name, $progress-bar-style2-color, $progress-bar-style2-bg-color);
-//====================================================================
-//	Variable definitions for the Spinner module (spinner.scss)
-//====================================================================
-//	Spinner class names.
-$spinner-dotted-name:						spinner-dots;						// Name for the dotted spinner class
-$spinner-round-name:						spinner-round;						// Name for the round spinner class
-// Spinner colors.
-$spinner-round-doughnout:					0.4em solid rgba(34,34,34, 0.2);	// Style for the round spinner doughnut
-$spinner-round-spin:						0.4em solid #222;					// Style for the round spinner spinning part
-//	Enable progress (spinner.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/spinner';
-// Use spinner mixins to create spinners with given specs. For more 
-// information refer to the spinner.scss file to check the definitions.
-@include make-spinner-dots($spinner-dotted-name, 1.5em, 1.5s);
-@include make-spinner-round($spinner-round-name, 1.5em, $spinner-round-doughnout, $spinner-round-spin, 1.5s);
-//====================================================================
-//	Variable definitions for the Carousel module (_carousel.scss)
-//====================================================================
-//	Carousel class names.
-$carousel-class-name:						carousel;						// Name for the carousel class
-// Carousel colors and styles.
-$carousel-border:							1px solid #ccc;					// Border style for the carousel
-$carousel-content-bg-color:					#e7e7e7;						// Background color for the carousel
-$carousel-description-color:				$body-bg-color;					// Color for the text in the carousel's description
-$carousel-description-bg-color:				$body-color;					// Background color for the carousel's description
-$carousel-control-color:					#fafafa;						// Color for the carousel's control elements
-//	Enable carousel (_carousel.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/carousel';
-// Use carousel mixin to create carousel with given specs. For more 
-// information refer to the _carousel.scss file to check the definitions.
-@include make-carousel($carousel-class-name, 80%, 500px, $carousel-border, 4px, $carousel-content-bg-color, 10px, $carousel-description-color, $carousel-description-bg-color, 340px, 160px, 450px, 1.8em, $carousel-control-color);
-//====================================================================
-//	Variable definitions for the Utility module (_utility.scss)
-//====================================================================
-//	Utility class names.
-$breadcrumbs-class-name:					brdcrmb;						// Name for the breadcrumbs class
-$well-class-name:							well;							// Name for the well class
-$alert-style1-class:						alert-blue;						// Name for the style 1 alert
-$alert-style2-class:						alert-green;					// Name for the style 2 alert
-$alert-style3-class:						alert-red;						// Name for the style 3 alert
-$panel-class-name:							panel;							// Name for the panel class
-$panel-header-name:							head;							// Name for the panel's header class
-$button-states-class-name:					stateful;						// Name for the stateful button class
-$button-group-class-name:					btn-grp;						// Name for the button group class
-$popover-above-name:						popover-top;					// Name for the popover above class
-$popover-below-name:						popover-bottom;					// Name for the popover below class
-// 	Utility color variables and styles (you can remove things you 
-//	don't need or define more colors if you need them).
-$well-color:								$body-color;					// Text color for the well
-$well-bg-color:								#e7e7e7;						// Background color for the well
-$panel-color:								$body-color;					// Text color for the panel
-$panel-bg-color:							$body-bg-color;					// Background color for the panel
-$panel-header-color:						$body-color;					// Text color for the panel's header
-$panel-header-bg-color:						#e7e7e7;						// Background color for the panel's header
-$popover-color:								$body-bg-color;					// Text color for the popover
-$popover-bg-color:							$body-color;					// Background color for the popover
-//	Enable utilities (_utility.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/utility';
-// Use utilities mixins to create utilities with given specs. For more 
-// information refer to the _utility.scss file to check the definitions.
-@include make-breadcrumbs($breadcrumbs-class-name);
-@include make-generic-container($well-class-name, $well-color, $well-bg-color, 1px solid #ccc, 4px, 20px);
-@include make-alert($alert-style1-class, darken($btn-b-bg-color,20%), lighten($btn-b-bg-color, 10%) , 1px solid darken($btn-b-bg-color, 10%), 4px, 20px, close);
-@include make-alert($alert-style2-class, darken($btn-g-bg-color,20%), lighten($btn-g-bg-color, 10%) , 1px solid darken($btn-g-bg-color, 10%), 4px, 20px, close);
-@include make-alert($alert-style3-class, darken($btn-r-bg-color,20%), lighten($btn-r-bg-color, 10%) , 1px solid darken($btn-r-bg-color, 10%), 4px, 20px, close);
-@include make-panel(panel, $panel-color, $panel-bg-color, 1px solid #ccc, 4px, 10px, $panel-header-name, $panel-header-color, $panel-header-bg-color, 10px);
-@include make-popover($popover-above-name, top, 5px, 45px, $popover-color, $popover-bg-color, 7px 10px);
-@include make-popover($popover-below-name, bottom, 4px, 45px, $popover-color, $popover-bg-color, 7px 10px);
-// Use experimental utilities mixins to create utilities with given
-// specs. Please exercise caution when using these mixins.
-//@include make-button-states($button-states-class-name);	// This mixin is unstable and buggy, we suggest you disable it.
-// The folowing mixin is considered stable, you can disable it if you need to.
-@include make-btn-group($button-group-class-name, $btn-class-name, 1px solid #ccc, 4px); 
-@include make-btn-group(btn-grp, $btn-class-name+'.'+$btn-style1-name, 1px solid darken($btn-b-bg-color, 10%), 4px); 
-@include make-btn-group(btn-grp, $btn-class-name+'.'+$btn-style2-name, 1px solid darken($btn-g-bg-color, 10%), 4px); 
-@include make-btn-group(btn-grp, $btn-class-name+'.'+$btn-style3-name, 1px solid 1px solid darken($btn-r-bg-color, 10%), 4px); 
-//====================================================================
-//====================================================================
\ No newline at end of file
diff --git a/flavors/mini-niteowl.css b/flavors/mini-niteowl.css
deleted file mode 100644
index d3d62b8..0000000
--- a/flavors/mini-niteowl.css
+++ /dev/null
@@ -1,1869 +0,0 @@
-/*
-	Flavor name: NiteOwl (mini-niteowl)
-	Author: Angelos Chalaris (chalarangelo@gmail.com)
-	mini.css version: v1.1 (October, 2016)
-*/
-/*
-	Set font-family, line-height, prevent adjustments of font size after orientation changes in IE and iOS.
-	Set body colors and margin.
-*/
-html {
-  font-family: "Helvetica Neue", Helvetica, sans-serif;
-  font-size: 1em;
-  line-height: 1.5;
-  -ms-text-size-adjust: 100%;
-  -webkit-text-size-adjust: 100%; }
-
-body {
-  margin: 0;
-  color: #f5f5f5;
-  background-color: #151f29; }
-
-/*
-	Correct display in IE 9-.
-	Give images display: block to be responsive.
-*/
-article, aside, footer, header, nav, section, figcaption, figure, main, details, menu, img {
-  display: block; }
-
-/*
-	Correct margin in IE 8.
-*/
-figure {
-  margin: 1em 40px; }
-
-/*
-	Styles for  headers.
-*/
-h1, h2, h3, h4, h5, h6 {
-  line-height: 1.2;
-  margin: 0.7em 0;
-  font-weight: 500; }
-  h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
-    color: #b5b5b5;
-    font-weight: 200; }
-
-h1 {
-  font-size: 2em; }
-
-h2 {
-  font-size: 1.5em; }
-
-h3 {
-  font-size: 1.15em; }
-
-h4 {
-  font-size: 1em; }
-
-h5 {
-  font-size: 0.8em; }
-
-h6 {
-  font-size: 0.7em; }
-
-/*
-	Correct box-sizing in Firefox.
-	Style for horizontal rule.
-*/
-hr {
-  box-sizing: content-box;
-  line-height: 1.2;
-  margin: 0.7em 0;
-  height: 0;
-  border: 0;
-  border-top: 1px solid #304251; }
-
-/*
-	Style for all small text and size for sub and sup.
-*/
-small, sub, sup {
-  font-size: 75%; }
-
-/*
-	Style for paragraph and preformatted elements.
-*/
-p, pre {
-  margin: 0 0 0.6em; }
-
-/*
-	Style for lists.
-*/
-ul, ol {
-  margin-top: 0;
-  margin-bottom: 0.6em; }
-  ul ul, ul ol, ol ul, ol ol {
-    margin-bottom: 0; }
-
-/*
-	Styles for code and preformatted.
-*/
-samp, kbd, code, pre {
-  font-family: monospace, monospace;
-  font-size: 1em; }
-
-kbd, code, pre {
-  padding: 2px 4px;
-  border-radius: 4px; }
-
-code, pre {
-  background-color: #040607; }
-
-kbd {
-  color: #1b2835;
-  background-color: #f5f5f5; }
-
-pre {
-  display: block;
-  word-break: break-all;
-  word-wrap: break-word; }
-  pre code {
-    padding: 0;
-    font-size: inherit;
-    color: inherit;
-    white-space: pre-wrap;
-    background-color: transparent;
-    border-radius: 0; }
-
-/*
-	Style for hyperlinks, remove underline.
-	Remove gray background on active links in IE 10.
-	Remove outline on focused links when they are also active or hovered.
-*/
-a {
-  background-color: transparent;
-  text-decoration: none;
-  color: #6493cd; }
-  a:active, a:hover {
-    outline-width: 0;
-    color: #8baed9; }
-  a:visited {
-    color: #3e78c0; }
-    a:visited:active, a:visited:hover {
-      color: #6493cd; }
-
-/*
-	Prevent the duplicate application of `bolder` in Safari 6.
-*/
-b, strong {
-  font-weight: inherit; }
-
-/*
-	Correct font weight in Chrome, Edge, Safari.
-*/
-b, strong {
-  font-weight: bolder; }
-
-/*
-	Correct font style in Android 4.3-.
-*/
-dfn {
-  font-style: italic; }
-
-/*
-	Remove botom border in Firefox 39-.
-	Correct text decoration in Chrome, Edge, IE, Opera, and Safari.
-*/
-abbr[title] {
-  border-bottom: none;
-  text-decoration: underline;
-  text-decoration: underline dotted; }
-
-/*
-	Style for mark.
-*/
-mark {
-  background-color: #e44b23;
-  color: #f5f5f5; }
-
-/*
-	Styling for hidden elements.
-	Correct display for template in IE.
-	Correct display for audio:not([controls]) in iOS 4-7.	
-*/
-[hidden], .hidden, template, audio:not([controls]) {
-  display: none; }
-
-audio:not([controls]) {
-  height: 0; }
-
-/*
-	Correct display in IE 9-.
-*/
-audio, video, progress {
-  display: inline-block; }
-
-/*
-	Styles for sub and sup.
-	Prevent `sub` and `sup` elements from affecting the line height.
-	Correct vertical alignment of progress in Chrome, Firefox, and Opera.
-*/
-sub, sup, progress {
-  vertical-align: baseline; }
-
-sub, sup {
-  line-height: 0;
-  position: relative; }
-
-sub {
-  bottom: -0.25em; }
-
-sup {
-  top: -0.5em; }
-
-/*
-	Remove the border on images inside links in IE 10-.
-	Make images responsive.
-*/
-img {
-  border-style: none;
-  max-width: 100%; }
-
-/*
-	Hide the overflow in IE.
-*/
-svg:not(:root) {
-  overflow: hidden; }
-
-/*
-	Show the overflow in IE and Edge.
-*/
-button, input, hr {
-  overflow: visible; }
-
-/*
-	Style for buttons and input elements.
-*/
-button, input, optgroup, select, textarea {
-  font-family: "Helvetica Neue", Helvetica, sans-serif;
-  font-size: 100%;
-  line-height: 1.2;
-  margin: 0; }
-
-/*
-	Remove the inheritance of text transform in Edge, Firefox, and IE.
-*/
-button, select {
-  text-transform: none; }
-
-/*
-	Correct styling for iOS, Safari and Firefox.
-*/
-button, html [type="button"], [type="reset"], [type="submit"] {
-  -webkit-appearance: button; }
-  button::-moz-focus-inner, html [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
-    border-style: none;
-    padding: 0; }
-  button:-moz-focusring, html [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {
-    outline: 1px dotted ButtonText; }
-
-/*
-	Style for fieldset.
-*/
-fieldset {
-  border: 1px solid #304251;
-  border-radius: 4px;
-  margin: 0 2px;
-  padding: 0.35em 0.65em 0.75em; }
-
-/*
-	Add correct box sizing and remove padding in IE 10-.
-*/
-[type="checkbox"], [type="radio"], legend {
-  box-sizing: border-box;
-  padding: 0; }
-
-/*
-
-	Correct text wrapping and color inheritance from `fieldset` elements in Edge and IE.
-	Remove the padding so developers are not caught out when they zero out `fieldset` 
-	elements in all browsers.
-*/
-legend {
-  color: inherit;
-  display: table;
-  max-width: 100%;
-  white-space: normal; }
-
-/*
-	Remove the default vertical scrollbar in IE.
-*/
-textarea {
-  overflow: auto; }
-
-/*
-	Correct the cursor style of increment and decrement buttons in Chrome.
-	Make images responsive.
-*/
-[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button, img {
-  height: auto; }
-
-/*
-	Correct styling in Chrome and Safari.
-	Remove the inner padding and cancel buttons in Chrome and Safari on OS X.
-*/
-[type="search"] {
-  -webkit-appearance: textfield;
-  outline-offset: -2px; }
-  [type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration {
-    -webkit-appearance: none; }
-
-/*
-	Correct the inability to style clickable types in iOS and Safari.
-	Change font properties to `inherit` in Safari.
-*/
-::-webkit-file-upload-button {
-  -webkit-appearance: button;
-  font: inherit; }
-
-/*
-	Mixin for button color variant. 
-	Parameters:
-	- $btn-variant-color                  :	The text color of the button variant.
-	- $btn-variant-bg-color               :	The background color of the button variant.
-	- $btn-variant-hover-style	          :	Hover/active/focus style of the button variant. [1]
-	- $btn-variant-hover-style-percentage :	Hover/active/focus style of the button variant percentage modifier.
-	Notes:
-	- [1] : The values that $btn-variant-hover-style can take are `lighten` and `darken`. The inside condition
-		only checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`.
-	- [2] : Do not use this mixin directly, use `make-btn-style` instead.
-*/
-/*
-	Mixin for the buttons.
-	Parameters:
-	- $btn-name                   :	The class name of the buttons.
-	- $btn-border                 :	The border of the buttons.
-	- $btn-border-radius          :	The border-radius of the buttons.
-	- $btn-margin                 :	The margin of the buttons.
-	- $btn-padding                :	The padding of the buttons.
-	- $btn-color                  :	The text color of the buttons.
-	- $btn-bg-color               :	The background color of the buttons.
-	- $btn-hover-style            :	Hover/active/focus style of the buttons. [1]
-	- $btn-hover-style-percentage :	Hover/active/focus style of the buttons percentage modifier.
-	- $btn-cursor                 :	The cursor style when hovering over the buttons.
-	- $btn-disabled-cursor        :	The cursor style when hovering over the buttons whie disabled.
-	- $btn-disabled-opacity       :	The opacity of the buttons when disabled.
-	Notes:
-	- [1] : The values that $btn-hover-style can take are `lighten` and `darken`. The inside condition only 
-		checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`.
-	- [2] : This only creates a basic button style. For more styles use `make-btn-style`.
-*/
-/*
-	Mixin for button styles. 
-	Parameters:
-	- $btn-name                         : The class name of the buttons. [1]
-	- $btn-style-name                   : The class name of the button style.
-	- $btn-style-color                  : The text color of the button style.
-	- $btn-style-bg-color               : The background color of the button style.
-	- $btn-style-hover-style	        : Hover/active/focus style of the button style. [2][3]
-	- $btn-style-hover-style-percentage : Hover/active/focus style of the button style percentage modifier.[3]
-	Notes:
-	- [1] : The value of $btn-name must be the same as the value specified when using `make-btn`, otherwise
-		the specified style will not work correctly.
-	- [2] : The values that $btn-style-hover-style can take are `lighten` and `darken`. The inside condition
-		only checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`.
-	- [3] : The values of $btn-style-hover-style and $btn-style-hover-style-percentage default to `lighten`
-		and `7.5%` if not specified.
-	- [4] : This mixin should be used in combination with `make-btn` and is suggested that you use it after
-		`make-btn`.
-*/
-/*
-	Mixin for button sizes. 
-	Parameters:
-	- $btn-name           : The class name of the buttons. [1]
-	- $btn-size-name      : The class name of the button size.
-	- $btn-size-padding   : The padding of the button size.
-	- $btn-size-font-size : The font-size of the button size.
-	Notes:
-	- [1] : The value of $btn-name must be the same as the value specified when using `make-btn`, otherwise
-		the specified style will not work correctly.
-	- [2] : This mixin should be used in combination with `make-btn` and is suggested that you use it after
-		`make-btn`.
-*/
-.btn, a.btn, a.btn:visited {
-  display: inline-block;
-  border: 0;
-  border-radius: 4px;
-  margin: 2px 0;
-  padding: 6px 12px;
-  color: #f5f5f5;
-  background: #454545;
-  cursor: pointer; }
-  .btn:hover, .btn:active, .btn:focus, a.btn:hover, a.btn:active, a.btn:focus, a.btn:visited:hover, a.btn:visited:active, a.btn:visited:focus {
-    background: #585858; }
-  .btn.disabled, .btn[disabled], .btn:disabled, a.btn.disabled, a.btn[disabled], a.btn:disabled, a.btn:visited.disabled, a.btn:visited[disabled], a.btn:visited:disabled {
-    cursor: not-allowed;
-    opacity: 0.65; }
-
-.btn.blue, a.btn.blue, a.btn.blue:visited {
-  color: #f5f5f5;
-  background: #364952; }
-  .btn.blue:hover, .btn.blue:active, .btn.blue:focus, a.btn.blue:hover, a.btn.blue:active, a.btn.blue:focus, a.btn.blue:visited:hover, a.btn.blue:visited:active, a.btn.blue:visited:focus {
-    background: #455e69; }
-
-.btn.green, a.btn.green, a.btn.green:visited {
-  color: #f5f5f5;
-  background: #409f45; }
-  .btn.green:hover, .btn.green:active, .btn.green:focus, a.btn.green:hover, a.btn.green:active, a.btn.green:focus, a.btn.green:visited:hover, a.btn.green:visited:active, a.btn.green:visited:focus {
-    background: #398d3d; }
-
-.btn.red, a.btn.red, a.btn.red:visited {
-  color: #f5f5f5;
-  background: #e72a2a; }
-  .btn.red:hover, .btn.red:active, .btn.red:focus, a.btn.red:hover, a.btn.red:active, a.btn.red:focus, a.btn.red:visited:hover, a.btn.red:visited:active, a.btn.red:visited:focus {
-    background: #d31818; }
-
-.btn.lg {
-  padding: 9px 15px;
-  font-size: 135%; }
-
-.btn.sm {
-  padding: 4px 8px;
-  font-size: 80%; }
-
-/*
-	Mixin for responsive, mobile-first grid. 
-	Parameters:
-	- $container-name    :	The class name of the container for the grid.
-	- $container-padding :	The left and right padding of the container. [1]
-	- $row-name          :	The class name of the grid's rows.
-	- $col-name          :	The class name of the grid's columns.
-	- $col-number        :	The amount of columns in the grid.
-	- $xs-prefix         : 	Class prefix for extra small screens.
-	- $sm-prefix         : 	Class prefix for small screens.
-	- $md-prefix         : 	Class prefix for medium screens.
-	- $lg-prefix         : 	Class prefix for large screens.
-	- $hide-suffix       : 	Class suffix for hidden columns. [2]
-	- $sm-breakpoint     : 	Breakpoint for small screens.
-	- $md-breakpoint     : 	Breakpoint for medium screens.
-	- $lg-breakpoint     : 	Breakpoint for large screens.
-	Notes:
-	- [1] : The padding of the container might cause the page to grow by $container-padding to the right. This 
-			can be fixed either via @media queries or setting the padding to 0.
-	- [2] :	Columns with the $hide-suffix will be only hidden in the screen size specified.
-	- [3] :	Refer to https://github.com/Chalarangelo/mini.css/wiki/Grid for additional information.
-*/
-.grid-container {
-  padding-right: 0;
-  padding-left: 0;
-  margin-right: auto;
-  margin-left: auto;
-  width: 100%; }
-  .grid-container * {
-    box-sizing: border-box; }
-
-.row:before, .row:after {
-  content: "";
-  display: table;
-  clear: both; }
-
-.col {
-  float: left;
-  padding: 12px; }
-
-.xs-1 {
-  width: 8.33333%; }
-
-.xs-2 {
-  width: 16.66667%; }
-
-.xs-3 {
-  width: 25%; }
-
-.xs-4 {
-  width: 33.33333%; }
-
-.xs-5 {
-  width: 41.66667%; }
-
-.xs-6 {
-  width: 50%; }
-
-.xs-7 {
-  width: 58.33333%; }
-
-.xs-8 {
-  width: 66.66667%; }
-
-.xs-9 {
-  width: 75%; }
-
-.xs-10 {
-  width: 83.33333%; }
-
-.xs-11 {
-  width: 91.66667%; }
-
-.xs-12 {
-  width: 100%; }
-
-.sm-no,
-.md-no,
-.lg-no {
-  display: block; }
-
-.xs-no {
-  display: none; }
-
-@media (min-width: 768px) {
-  .sm-1 {
-    width: 8.33333%; }
-
-  .sm-2 {
-    width: 16.66667%; }
-
-  .sm-3 {
-    width: 25%; }
-
-  .sm-4 {
-    width: 33.33333%; }
-
-  .sm-5 {
-    width: 41.66667%; }
-
-  .sm-6 {
-    width: 50%; }
-
-  .sm-7 {
-    width: 58.33333%; }
-
-  .sm-8 {
-    width: 66.66667%; }
-
-  .sm-9 {
-    width: 75%; }
-
-  .sm-10 {
-    width: 83.33333%; }
-
-  .sm-11 {
-    width: 91.66667%; }
-
-  .sm-12 {
-    width: 100%; }
-
-  .xs-no,
-  .md-no,
-  .lg-no {
-    display: block; }
-
-  .sm-no {
-    display: none; } }
-@media (min-width: 1024px) {
-  .md-1 {
-    width: 8.33333%; }
-
-  .md-2 {
-    width: 16.66667%; }
-
-  .md-3 {
-    width: 25%; }
-
-  .md-4 {
-    width: 33.33333%; }
-
-  .md-5 {
-    width: 41.66667%; }
-
-  .md-6 {
-    width: 50%; }
-
-  .md-7 {
-    width: 58.33333%; }
-
-  .md-8 {
-    width: 66.66667%; }
-
-  .md-9 {
-    width: 75%; }
-
-  .md-10 {
-    width: 83.33333%; }
-
-  .md-11 {
-    width: 91.66667%; }
-
-  .md-12 {
-    width: 100%; }
-
-  .xs-no,
-  .sm-no,
-  .lg-no {
-    display: block; }
-
-  .md-no {
-    display: none; } }
-@media (min-width: 1280px) {
-  .lg-1 {
-    width: 8.33333%; }
-
-  .lg-2 {
-    width: 16.66667%; }
-
-  .lg-3 {
-    width: 25%; }
-
-  .lg-4 {
-    width: 33.33333%; }
-
-  .lg-5 {
-    width: 41.66667%; }
-
-  .lg-6 {
-    width: 50%; }
-
-  .lg-7 {
-    width: 58.33333%; }
-
-  .lg-8 {
-    width: 66.66667%; }
-
-  .lg-9 {
-    width: 75%; }
-
-  .lg-10 {
-    width: 83.33333%; }
-
-  .lg-11 {
-    width: 91.66667%; }
-
-  .lg-12 {
-    width: 100%; }
-
-  .xs-no,
-  .sm-no,
-  .md-no {
-    display: block; }
-
-  .lg-no {
-    display: none; } }
-/*
-	Mixin for the forms.
-	Parameters:
-	- $frm-name                  :	The class name of the form.
-	- $frm-border                :	The border of the form elements.
-	- $frm-border-radius         :	The border-radius of the form elements.
-	- $frm-margin                :	The margin of the form elements.
-	- $frm-padding               :	The padding of the form elements.
-	- $frm-focus-color           :	The color used to mark the focused form element.
-	- $frm-invalid-color         :	The color used to mark an invalid form element.
-	- $frm-disabled-cursor       :	The cursor style when hovering over disabled form elements.
-	- $frm-disabled-opacity      :	The opacity of the form elements when disabled.
-	- $frm-readonly-bg-color     :  The background color of the form elements when they are readonly.
-	- $frm-readonly-border-color :	The border color of the form elements when they are readonly.
-	- $frm-select-height         :	The height for non-multiline select elements in the form.
-	- $frm-label-margin          :	The margin for the form's label elements.
-	- $frm-ctrl-group-name       :	The class name of the control groups in the form.
-	- $frm-ctl-group-margin      :	The margin for control groups inside the form.
-	- $frm-inline-name           :	The class name for forms with inline style.
-	- $frm-aligned-name          :	The class name for forms with aligned style.
-	- $frm-aligned-label-width   :	The width of labels in forms with aligned style.	
-	Notes:
-	- [1] : Input elements with button-like style (i.e. submit, reset, button etc.) are not affected by form styling.
-		Please use the button styles and mixins provided to properly style them to your liking.
-*/
-.frm input[type="color"], .frm input[type^="date"], .frm input[type$="time"], .frm input[type="email"],
-.frm input[type="month"], .frm input[type="week"], .frm input[type="text"], .frm input[type="password"],
-.frm input[type="url"], .frm input[type="number"], .frm input[type="search"], .frm input[type="tel"],
-.frm select, .frm textarea {
-  box-sizing: border-box;
-  border: 1px solid #304251;
-  border-radius: 4px;
-  box-shadow: none; }
-.frm input:not([type]) {
-  box-sizing: border-box;
-  border: 1px solid #304251;
-  border-radius: 4px;
-  box-shadow: none; }
-.frm input, .frm select, .frm textarea {
-  display: block;
-  margin: 0.2em;
-  padding: 0.3em; }
-  .frm input:focus, .frm select:focus, .frm textarea:focus {
-    border-color: #f1e05a; }
-  .frm input[disabled], .frm select[disabled], .frm textarea[disabled] {
-    cursor: not-allowed;
-    opacity: 0.65; }
-  .frm input:invalid, .frm input:focus:invalid, .frm input:focus:invalid:focus, .frm select:invalid, .frm select:focus:invalid, .frm select:focus:invalid:focus, .frm textarea:invalid, .frm textarea:focus:invalid, .frm textarea:focus:invalid:focus {
-    border-color: #e44b23; }
-  .frm input[readonly], .frm select[readonly], .frm textarea[readonly] {
-    background-color: #040607;
-    border-color: black; }
-.frm input[type="checkbox"], .frm input[type="radio"] {
-  display: inline-block; }
-.frm select {
-  height: 1.9em; }
-  .frm select[multiple] {
-    height: auto; }
-.frm label {
-  margin: 0.5em 0 0 0.2em; }
-.frm.inline input, .frm.inline select, .frm.inline textarea, .frm.inline label, .frm.aligned input, .frm.aligned select, .frm.aligned textarea, .frm.aligned label {
-  display: inline-block; }
-.frm.inline .ctrl-group {
-  display: inline-block; }
-.frm.aligned .ctrl-group label {
-  text-align: right;
-  vertical-align: middle;
-  width: 15em;
-  margin-top: 0; }
-.frm .ctrl-group {
-  margin: 0 0 0.3em 0; }
-
-/*
-	Mixin for the tables.
-	Parameters:
-	- $tbl-name                  :	The class name of the table.
-	- $tbl-border                :	The border of the table and cells. [1]
-	- $tbl-margin                :	The margin of the table cells.
-	- $tbl-padding               :	The padding of the table cells.
-	- $tbl-head-bg-color         :	The color of the thead background.
-	- $tbl-head-color            :	The color of the thead text.
-	- $tbl-body-bg-color         :	The color of the even-numbered rows in tbody.
-	- $tbl-body-alt-bg-color     :	The color of the odd-numbered rows in tbody.
-	- $tbl-body-color            :  The color of the text in tbody.
-	- $tbl-horizontal-name       :	The class name for the horizontal style table.
-	- $tbl-bordered-name         :	The class name for the bordered style table.
-	Notes:
-	- [1] : This style will apply to the table and cells. All styles applied to 
-		the table (horizontal, bordered) will use the same style of border.
-*/
-.tbl {
-  border-collapse: collapse;
-  border-spacing: 0;
-  empty-cells: show;
-  border: 1px solid #304251; }
-  .tbl td, .tbl th {
-    overflow: visible;
-    border-left: 1px solid #304251;
-    border-bottom: none;
-    margin: 0;
-    padding: 0.5em; }
-  .tbl thead {
-    background-color: #3b5773;
-    color: #f5f5f5;
-    text-align: left; }
-  .tbl tbody {
-    background-color: #1e2c3a;
-    color: #e1e1e1; }
-    .tbl tbody tr:nth-child(2n-1) {
-      background-color: #26384b; }
-  .tbl.hor td, .tbl.hor th {
-    border-left: none;
-    border-bottom: 1px solid #304251; }
-  .tbl.bor td, .tbl.bor th {
-    border-bottom: 1px solid #304251; }
-
-/*
-	Mixin for navigation bar and complementary styles.
-	Parameters:
-	- $nav-name                                   :	The class name for the navigation bar.
-	- $nav-vertical-name                          :	The class name for the vertical style of the navigation bar.
-	- $nav-fixed-name                             :	The class name for the fixed style of the navigation bar.
-	- $nav-logo-name                              :	The class name for the logo item of the navigation bar.
-	- $nav-logo-size                              :	The font-size of the logo item of the navigation bar.
-	- $nav-link-name                              :	The class name for the navigation links of the navigation bar.
-	- $nav-padding                                :	The padding of the elements of the navigation bar. [1]
-	- $nav-color                                  :	The text color of the navigation elements.
-	- $nav-bg-color                               :	The background color of the navigation bar.
-	- $nav-hover-style                            :	Hover/active/focus style of the navigation elements. [2]
-	- $nav-hover-style-percentage                 :	Hover/active/focus style of the navigation elements percentage modifier.
-	- $nav-disabled-cursor                        :	The cursor style when hovering over the navigation elements whie disabled.
-	- $nav-disabled-opacity                       :	The opacity of the navigation elements when disabled.
-	- $nav-fixed-left-right                       :	The orientation of the fixed navigation bar. [3][4]
-	- $grid-columns-total                         :	Total amount fo columns in the used grid. [5]
-	- $grid-coloumns-count-for-nav-fixed-vertical :	Desired amount of columns occupied by the vertical navigation bar in the grid. [5]
-	- $nav-fixed-collapse-breakpoint              :	The breakpoint below which fixed navigation bars will collapse to a menu toggle button.
-	- $nav-fixed-collapse-label-location          :	Location of the collapsed menu button label. [6]
-	- $nav-fixed-collapse-label-margin            :	The margin for the collapsed menu button label.
-	- $nav-fixed-collapse-label-font-size         :	The font size of the collapsed menu button label.
-	Notes:
-	- [1] : This padding applies to all elements of the navigation bar and all styles(e.g. vertical or fixed). 
-		For vertical styles it adapts to apply properly. It also adapts to apply properly to the collapse 
-		label of the navigation bar. Please specify only a single padding value (i.e. 6px, 1.25em etc.) to 
-		avoid CSS errors and ultimately the style not being applied to some elements.
-	- [2] : The values that $nav-hover-style can take are `lighten` and `darken`. The inside condition only 
-		checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`.
-	- [3] : The values of $nav-fixed-left-right recognizes are `left` and `right`. However if invalid values
-		are provided, due to the inside condition only checking for `left`, `right` will be used as the
-		default value.
-	- [4]: The values of $nav-fixed-left-right will apply to all fixed navigation bars. The horizontal bars
-		should not be affected as they are 100% width, meaning that anchoring to left or right should have
-		the same result.
-	- [5] : These values are used to make the navigation bar work better with the grid system. Values do not have 
-		to be the same as the grid or integer values, meaning that values like 12 and 1.5 could work great leaving
-		a small gap just before the third column in the grid. If no grid is specified, you can use percentage
-		values like 100 and 15 to get a 15% width for example.
-	- [6] : The value $nav-fixed-collapse-label-location recognizes are `top-left`, `top-right`, `bottom-left`
-		and `bottom-right`. Due to the way the conditional checking is implemented, `bottom-right` will be
-		used as a default if no valid value is specified.
-*/
-.nav {
-  box-sizing: border-box;
-  background-color: #243447; }
-  .nav .logo {
-    font-size: 135%;
-    color: #f5f5f5; }
-  .nav ul {
-    display: inline-block;
-    list-style: none;
-    margin: 0;
-    padding: 0; }
-    .nav ul li {
-      display: inline-block;
-      margin: 0;
-      white-space: nowrap; }
-      .nav ul li > * {
-        display: inline-block;
-        padding: 8px;
-        color: #f5f5f5;
-        margin: 0; }
-      .nav ul li .link:hover, .nav ul li .link:active, .nav ul li .link:focus {
-        color: #f5f5f5;
-        background: #17212e; }
-      .nav ul li .link.disabled, .nav ul li .link[disabled], .nav ul li .link:disabled {
-        cursor: not-allowed;
-        opacity: 0.65; }
-  .nav.vertical ul {
-    display: block; }
-    .nav.vertical ul li {
-      display: block; }
-      .nav.vertical ul li > * {
-        width: 100%;
-        padding: 8px 0; }
-  .nav.fixed {
-    position: fixed;
-    left: 0;
-    top: 0;
-    z-index: 999;
-    width: 100%; }
-    .nav.fixed.vertical {
-      height: 100%;
-      width: 16.66667%; }
-      .nav.fixed.vertical ul {
-        width: 100%; }
-        .nav.fixed.vertical ul li {
-          display: block; }
-  .nav + label {
-    display: none;
-    font-weight: 700;
-    margin: 10px;
-    font-size: 1.75em;
-    padding: 8px;
-    color: #f5f5f5;
-    background-color: #243447;
-    width: auto;
-    position: fixed;
-    z-index: 1000;
-    top: 0;
-    right: 0; }
-    .nav + label:before {
-      position: relative;
-      content: '\2630'; }
-    .nav + label:hover, .nav + label:active, .nav + label:focus {
-      background: #17212e; }
-
-@media (max-width: 768px) {
-  .nav {
-    overflow: auto; }
-    .nav.fixed {
-      display: none; }
-      .nav.fixed + label {
-        display: block; }
-
-  input[type="checkbox"]:checked + .nav.fixed {
-    display: block;
-    width: 100%;
-    height: 100%; }
-    input[type="checkbox"]:checked + .nav.fixed ul {
-      display: block; }
-      input[type="checkbox"]:checked + .nav.fixed ul li {
-        display: block; }
-        input[type="checkbox"]:checked + .nav.fixed ul li * {
-          width: 100%;
-          padding: 8px 0; }
-    input[type="checkbox"]:checked + .nav.fixed + label:before {
-      content: '\00d7'; } }
-/*
-	Image thumbnail style mixin. [1]
-	Parameters:
-	- $thumb-name          : 	The class name for the thumbnail style.
-	- $thumb-padding       :	The padding between the image and the border.
-	- $thumb-border	       :	The style of the thumbnail's border.
-	- $thumb-border-radius :	The border radius of the thumbnail.
-	- $thumb-hover-color   :	The color of the thumbnail's border when hovering over it.
-	Notes:
-	- [1] : This style only applies to `img` elements with the class specified in
-		`$thumb-name`.
-*/
-/*
-	Mixin for generic border style.
-	Parameters:
-	- $border-generic-name :	The class name for the generic border.
-	Notes:
-	- [1] : The border style uses rgba to create a 1px solid border with 0.25 
-		opacity around an element, which makes it look properly bordered. 
-		Might be incompatible with older browsers.
-	- [2] : The border style overwrites any border style as it uses 
-		`!important`, exercise caution when using.
-*/
-/*
-	Mixin for generic border radius styles.
-	Parameters:
-	- $border-style-name   :	The class name for the generic border radius style.
-	- $border-style-radius :	The radius for the generic border radius style.
-	Notes:
-	- [1] : The border style overwrites any border style as it uses 
-		`!important`, exercise caution when using.
-*/
-/*
-	Mixin for generic contextual color text styles.
-	Parameters:
-	- $colored-text-name  :	The class name for the contextual color text style.
-	- $colored-text-color :	The color for the contextual color text style.
-	Notes:
-	- [1] : The contextual color text style overwrites any text color as it uses 
-		`!important`, exercise caution when using.
-*/
-/*
-	Mixin for generic contextual background text styles.
-	Parameters:
-	- $colored-bg-text-name  :	The class name for the contextual background text style.
-	- $colored-bg-text-color :	The background color for the contextual background text style.
-	Notes:
-	- [1] : The contextual background text style overwrites any text color as it 
-		uses  `!important`, exercise caution when using.
-*/
-/*
-	Mixin for simple caret utility class.
-	Parameters:
-	- $caret-name  :	The class name for caret utility class.
-	- $caret-size  :	The size of the caret utility element. [1]
-	- $caret-color :	The color of the caret utility element.
-	Notes:
-	- [1] : The caret is built using the border trick. Sizes can be specified
-		in either `px` or `em`, but they might take a bit of tweaking to
-		get right.
-*/
-/*
-	Mixin for simple close sign utility class.
-	Parameters:
-	- $close-name        :	The class name for close utility class.
-	- $close-color       :	The color of the close utility element.
-	- $close-cursor      :	The cursor for the close utility element.
-	- $close-font-size   :	The font-size for the close utility element.
-	- $close-font-weight :	The font-weight for the close utility element.
-	- $close-hover-color :	The color of the close utility element when hovering over it.
-*/
-/*
-	Mixin for quick float classes. [1]
-	Parameters:
-	- $drag-left-name  :	The class name for left drags.
-	- $drag-right-name :	The class name for right drags.
-	Notes:
-	- [1] : These classes use `!important` to set the float properties, 
-		exercise caution when using.
-*/
-/*
-	Mixin for center block class.
-	Parameters:
-	- $center-block-name :	The class name for center block class.
-*/
-/*
-	Mixin for clearfix class.
-	Parameters:
-	- $clearfix-name :	The class name for the clearfix class.
-*/
-/*
-	Mixin for hidden class. [1]
-	Parameters:
-	- $hidden-name :	The class name for hidden elements.
-	Notes:
-	- [1] : This class uses `!important` to set the display property, 
-		exercise caution when using.
-*/
-img.thumb {
-  padding: 0.25em;
-  border: 1px solid #304251;
-  border-radius: 4px;
-  cursor: pointer; }
-  img.thumb:hover, img.thumb:focus, img.thumbactive {
-    border-color: #6493cd; }
-
-.bordered {
-  border: 1px solid rgba(0, 0, 0, 0.25) !important; }
-
-.rounded {
-  border-radius: 4px !important; }
-
-.circle {
-  border-radius: 50% !important; }
-
-.txt-blue {
-  color: #364952 !important; }
-
-.txt-green {
-  color: #409f45 !important; }
-
-.txt-red {
-  color: #e72a2a !important; }
-
-.bg-blue {
-  background-color: #364952 !important; }
-
-.bg-green {
-  background-color: #409f45 !important; }
-
-.bg-red {
-  background-color: #e72a2a !important; }
-
-.caret {
-  display: inline-block;
-  vertical-align: middle;
-  line-height: 1;
-  width: 0;
-  height: 0;
-  border: 0.35em solid transparent;
-  border-top: 0.35em solid #aaa; }
-
-.close {
-  display: inline-block;
-  vertical-align: middle;
-  line-height: 1;
-  color: #aaa;
-  font-size: 1.3em;
-  font-weight: 700;
-  cursor: pointer; }
-  .close:before {
-    content: '\00d7'; }
-  .close:hover, .close:active, .close:focus {
-    color: #777; }
-
-.drg-left {
-  float: left !important; }
-
-.drg-right {
-  float: right !important; }
-
-.ct-block {
-  display: block;
-  margin-left: auto;
-  margin-right: auto; }
-
-.cf:before, .cf:after {
-  content: "";
-  display: table;
-  clear: both; }
-
-.hidden {
-  display: none !important; }
-
-/*
-	Mixin for the labels/badges.
-	Parameters:
-	- $lbl-name          :	The class name of the labels/badges.
-	- $lbl-bg-color      :	The background color of the labels/badges.
-	- $lbl-color         :	The text color of the labels/badges.
-	- $lbl-border-radius :	The border-radius of the labels/badges.
-	- $lbl-padding       :	The padding of the labels/badges.
-	- $lbl-hide-on-empty :	Style of the label/badges when empty. [1]
-	Notes:
-	- [1] : The values that $lbl-hide-on-empty can take are `hide` or `show`. The inside condition only 
-		checks if the value is `hide` and acts accordingly. Invalid values are treated as `show`.
-*/
-/*
-	Mixin for labels/badges styles. 
-	Parameters:
-	- $lbl-name                         : The class name of the labels/badges. [1]
-	- $lbl-style-name                   : The class name of the labels/badges style.
-	- $lbl-style-color                  : The text color of the labels/badges style.
-	- $lbl-style-bg-color               : The background color of the labels/badges style.
-	Notes:
-	- [1] : The value of $lbl-name must be the same as the value specified when using `make-lbl`, otherwise
-		the specified style will not work correctly.
-*/
-.lbl {
-  display: inline-block;
-  padding: 6px 10px;
-  color: #f5f5f5;
-  background-color: #525252;
-  border-radius: 4px; }
-  .lbl:empty {
-    display: none; }
-
-.lbl.blue {
-  color: #f5f5f5;
-  background-color: #364952; }
-
-.lbl.green {
-  color: #f5f5f5;
-  background-color: #409f45; }
-
-.lbl.red {
-  color: #f5f5f5;
-  background-color: #e72a2a; }
-
-.bdg {
-  display: inline-block;
-  padding: 3px 8px;
-  color: #f5f5f5;
-  background-color: #525252;
-  border-radius: 8px; }
-  .bdg:empty {
-    display: none; }
-
-.bdg.blue {
-  color: #f5f5f5;
-  background-color: #364952; }
-
-.bdg.green {
-  color: #f5f5f5;
-  background-color: #409f45; }
-
-.bdg.red {
-  color: #f5f5f5;
-  background-color: #e72a2a; }
-
-/*
-	Mixin for tab system.
-	Parameters:
-	- $tabs-name                                  :	The class name for the tab system's container.
-	- $tabs-label-spacing                         :	The spacing between tab labels.
-	- $tabs-label-height                          : The height of the tab labels.
-	- $tabs-label-padding                         :	The padding of the tab labels.
-	- $tabs-label-color                           :	The text color of the tab labels.
-	- $tabs-label-bg-color                        : The background color of the tab labels.
-	- $tabs-active-label-color                    : The text color of the active tab's label.
-	- $tabs-active-label-bg-color                 :	The background color of the active tab's label.
-	- $tabs-border-color                          :	Border color for the tab system. [1]
-	- $tabs-label-border-radius                   : Border radius for the tab labels.
-	- $tabs-active-label-stripe                   : The style of the colored stripe that appears on the active tab's label. [2]
-	- $tabs-inactive-label-hover-style            :	Hover/active/focus style of the tab labels. [3]
-	- $tabs-inactive-label-hover-style-percentage :	Hover/active/focus style of the tab labels percentage modifier.
-	- $tabs-content-bg-color                      : The background color of the active tab's content.
-	- $tabs-content-padding                       :	The padding of the active tab's content.
-	Notes:
-	- [1] : The color specified in $tabs-border-color applies to all borders in the tab system. This
-		includes borders in the tab labels and active tab's content.
-	- [2] : The style of the colored stripe is a border style so you should specify it as such.
-	- [3] : The values that $tabs-hover-style can take are `lighten` and `darken`. The inside condition only 
-		checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`.
-*/
-.tabs {
-  position: relative;
-  min-height: 250px;
-  width: 100%; }
-  .tabs input[type="radio"] {
-    display: none; }
-    .tabs input[type="radio"] + div {
-      display: inline; }
-      .tabs input[type="radio"] + div > label {
-        position: reative;
-        float: left;
-        margin-right: 3px;
-        left: 1px;
-        height: 40px;
-        padding: 8px 14px;
-        color: #6493cd;
-        background-color: #151f29;
-        border: 1px solid #304251;
-        border-radius: 4px 4px 0 0;
-        cursor: pointer; }
-        .tabs input[type="radio"] + div > label:hover, .tabs input[type="radio"] + div > label:active, .tabs input[type="radio"] + div > label:focus {
-          background: #040607; }
-        .tabs input[type="radio"] + div > label + div {
-          position: absolute;
-          z-index: -2;
-          left: 0;
-          top: 39px;
-          bottom: 0;
-          right: 0;
-          padding: 20px;
-          background: #1e2c3a;
-          border: 1px solid #304251; }
-    .tabs input[type="radio"]:checked + div > label {
-      color: #f5f5f5;
-      background: #1e2c3a;
-      border-top: 3px solid #6493cd;
-      border-bottom: 1px solid #1e2c3a; }
-      .tabs input[type="radio"]:checked + div > label + div {
-        position: absolute;
-        z-index: -1; }
-
-/*
-	Mixin for modal dialogs.
-	Parameters:
-	- $modal-name               :	The class name for the modal dialog.
-	- $modal-color              :	The text color of the modal dialog.
-	- $modal-bg-color           :	The background color of the modal dialog.
-	- $modal-transition-enabled :	Determines if a transition style will be applied when the modal changes states. [1]
-	- $modal-shadow-enabled     :	Determines if a shadow should be cast from the modal dialog. [1]
-	- $modal-border             :	The border style of the modal dialog.
-	- $modal-border-radius      :	The border radius of the modal dialog's border.
-	- $modal-padding            :	The padding of the modal dialog's contents.
-	- $modal-top-margin         :	The distance of the modal dialog from the top of the parent container. [2]
-	- $modal-width              :	The width of the modal dialog. [2]
-	Notes:
-	- [1] : The values of $modal-transition-enabled and $modal-shadow-enabled should be `enabled` or `disabled`.
-		If an invalid value is supplied, the mixin will act as if it was `disabled`.
-	- [2] : The values of $modal-top-margin and $modal-width should be in percentage (%) values to properly scale
-		on all devices. However, there are no restrictions.
-*/
-/*
-	Mixin for close button support inside of modal dialogs.
-	Parameters:
-	- $modal-name    :	The class name for the modal dialog. [1]
-	- $close-name    :	The class name for the close sign utility class. [2]
-	- $modal-padding :	The padding of the close button. [3]
-	Notes:
-	- [1] : The value of $modal-name should match the value specified in the modal dialog's
-		mixin, in order for this to work correctly.
-	- [2] : The value of $close-name should match the value specified in the close sign utility's
-		mixin, in order for this to work correctly.
-	- [3] : The close button will be placed at the top right of the modal dialog. Its padding
-		should be similar to the value specified for padding in the modal dialog itself, however
-		it could vary based on personal preference.
-*/
-.modal {
-  display: none; }
-  .modal + div {
-    z-index: 997;
-    position: fixed;
-    width: 100%;
-    height: 0;
-    opacity: 0;
-    display: none;
-    transition: opacity .3s ease-out; }
-    .modal + div > div {
-      z-index: 998;
-      position: relative;
-      width: 45%;
-      color: #f5f5f5;
-      background-color: #151f29;
-      margin: 8.5% auto 0;
-      padding: 18px;
-      border: 1px solid #304251;
-      border-radius: 4px;
-      box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5); }
-  .modal:checked + div {
-    height: 100%;
-    opacity: 1;
-    display: block; }
-    .modal:checked + div > label {
-      background-color: rgba(0, 0, 0, 0.35);
-      position: fixed;
-      width: 100%;
-      height: 100%;
-      top: 0; }
-
-.modal + div > div .close {
-  position: absolute;
-  top: 20px;
-  right: 20px; }
-
-/*
-	Mixin for navigation bar's dropdown element.
-	Parameters:
-	- $nav-name             :	The class name for the navigation bar. [1]
-	- $nav-link-name        :	The class name for the navigation links of the navigation bar. [1]
-	- $dropdown-name        :	The class name for the dropdown element. [2]
-	- $dropdown-left-margin :	The left margin of the dropdown element's contents. [3]
-	- $dropdown-font-size   :	The font size of the dropdown element's contents.
-	Notes:
-	- [1] : The values of $nav-name and $nav-link-name must match those specified in the navigation bar's
-		definition, otherwise the dropdown element will not work properly.
-	- [2] : The value of $dropdown-name is used in two distinct elements of the component, namely the
-		checkbox and the dropdown toggle.
-	- [3] : The value of $dropdown-left-margin will affect all open dropdown menus, as well as dropdown
-		menus on mobile screens. It is suggested that you set this value to something different than
-		0 to visually represent the menu hierarchy in devices with smaller screens.
-*/
-.nav .link.dropdown {
-  cursor: pointer; }
-.nav input[type="checkbox"], .nav input[type="radio"] {
-  display: none; }
-  .nav input[type="checkbox"].dropdown + div, .nav input[type="radio"].dropdown + div {
-    display: none; }
-  .nav input[type="checkbox"]:checked.dropdown + div, .nav input[type="radio"]:checked.dropdown + div {
-    display: block;
-    font-size: 0.8em;
-    margin-left: 20px; }
-
-/*
-	Mixin for collapse component. 
-	Parameters:
-	- $collapse-name          : The class name of the collapse component.
-	- $collapse-border        :	The border style of the collapse contents.
-	- $collapse-border-radius :	The border radius of the collapse contents.
-	- $collapse-padding       :	The padding of the collapse contents.
-	- $collapse-margin-top    : The margin above the collapse contents. [1]
-	- $collapse-color         : The collapse contents' text color.
-	- $collapse-bg-color      :	The collapse contents' background color.
-	Notes:
-	- [1] : The value of $collapse-margin-top is used for spacing between the button label that is usually
-		above the collapsed contents and the contents themselves.
-*/
-/*
-	Mixin for accordion component. 
-	Parameters:
-	- $accordion-name                   :	The class name of the accordion component.
-	- $accordion-border                 :	The border style of the accordion component.
-	- $accordion-border-radius          :	The border radius of the accordion component. [1]
-	- $accordion-padding                :	The padding of the accordion's contents.
-	- $accordion-margin                 :	The margin between accordion's parts. [2]
-	- $accordion-color                  : 	The accordion contents' text color.
-	- $accordion-bg-color               :	The accordion contents' background color.
-	- $accordion-label-color            : 	The accordion labels' text color.
-	- $accordion-label-bg-color         :	The accordion labels' background color.
-	- $accordion-label-padding          :	The padding of the accordion's labels.
-	- $accordion-hover-style            :	Hover/active/focus style of the accordion's labels. [3]
-	- $accordion-hover-style-percentage :	Hover/active/focus style of the accordion's labels percentage modifier.
-	Notes:
-	- [1] : The value of $accordion-border-radius will be applied to labels along with their contents.
-		Closed labels will have the border-radius applied to all of their corners, while open labels will
-		change accordingly to combine their border with the shown contents.
-	- [2] : The value of $accordion-margin will be applied only to margin-bottom of all parts in order
-		to space them out evenly. This does not apply to label and related content margins.
-	- [3] : The values that $accordion-hover-style can take are `lighten` and `darken`. The inside condition only 
-		checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`.
-*/
-input[type="checkbox"].clps {
-  display: none; }
-  input[type="checkbox"].clps + div {
-    display: none;
-    color: #f5f5f5;
-    background-color: #26384b;
-    padding: 10px;
-    margin-top: 5px;
-    border: 1px solid #304251;
-    border-radius: 4px; }
-input[type="checkbox"]:checked.clps + div {
-  display: block; }
-
-input[type="radio"].acrd {
-  display: none; }
-  input[type="radio"].acrd + label {
-    width: 100%;
-    display: block;
-    color: #f5f5f5;
-    background-color: #26384b;
-    padding: 8px;
-    margin-bottom: 5px;
-    border: 1px solid #304251;
-    border-radius: 4px;
-    cursor: pointer; }
-    input[type="radio"].acrd + label:hover, input[type="radio"].acrd + label:active, input[type="radio"].acrd + label:focus {
-      background-color: #192531; }
-    input[type="radio"].acrd + label + div {
-      display: none;
-      color: #f5f5f5;
-      background-color: #151f29;
-      padding: 10px;
-      margin-top: -1px;
-      margin-bottom: 5px;
-      border: 1px solid #304251;
-      border-radius: 0 0 4px 4px; }
-input[type="radio"]:checked.acrd + label {
-  border-radius: 4px 4px 0 0;
-  margin-bottom: 0; }
-  input[type="radio"]:checked.acrd + label + div {
-    display: block; }
-
-/*
-	Mixin for the progress element. 
-	Parameters:
-	- $progress-name          : The class name of the progress wrapper.
-	- $progress-height        :	The height of the progress wrapper.
-	- $progress-border-radius :	The border radius of the progress wrapper.
-	- $progress-bg-color      :	The background color of the progress wrapper. [1]
-	- $progress-font-size     : The font size of the progress bar's text (if any).
-	- $progress-bar-color     : The progress bar's text color.
-	- $progress-bar-bg-color  :	The progress bar's background color.
-	Notes:
-	- [1] : The background color of the progress wrapper should be a different color than the
-		page's background to make sure that it is visible. 
-	- [2] : This only creates a basic progress style. For more progress bar styles use `make-progress-bar-variant`.
-*/
-/*
-	Mixin for progress bar styles. 
-	Parameters:
-	- $progress-name                : 	The class name of the progress wrapper. [1]
-	- $progress-bar-variant-name    :	The class name of the progress bar variant.
-	- $progress-bar-variant-color   :	The progress bar variant's text color.
-	- $progress-bar-variant-bg-coor :	The progress bar variant's background color.
-	Notes:
-	- [1] : The name of $progress-name should match the one specified in `make-progress` for the
-		progress bar variant to work correctly.
-	- [2] : This mixin should be used in combination with `make-progress` and is suggested that you 
-		use it after `make-progress`.
-*/
-.prg {
-  position: relative;
-  overflow: hidden;
-  height: 20px;
-  background-color: #d7d7d7;
-  border-radius: 4px; }
-  .prg > span {
-    float: left;
-    width: 0;
-    height: 100%;
-    color: #f5f5f5;
-    background-color: #364952;
-    text-align: center;
-    font-size: 0.8em; }
-
-.prg > span.green {
-  color: #f5f5f5;
-  background-color: #409f45; }
-
-.prg > span.red {
-  color: #f5f5f5;
-  background-color: #e72a2a; }
-
-/*
-	Mixin for dotted spinner component. 
-	Parameters:
-	- $spinner-dots-name           :	The class name of the dotted spinner component.
-	- $spinner-dots-height         :	The height of the dotted spinner component. [1][2]
-	- $spinner-dots-animation-time :	The animation time of the dotted spinner component.
-	Notes:
-	- [1] : The value of $spinner-dots-height can be specified in `em`, `px` etc. but it is
-		suggested that you specify it in the same measurement as the text base.
-	- [2] : The value of $spinner-dots-height will be used for both the size of the component
-		and the animation. Some tweaking might be required.
-*/
-/*
-	Mixin for dotted spinner component. 
-	Parameters:
-	- $spinner-round-name           :	The class name of the round spinner component.
-	- $spinner-round-size           :	The size of the round spinner component. [1]
-	- $spinner-round-doughnut-style :	The doughnut style of the round spinner component. [2]
-	- $spinner-round-spin-style     :	The spinning part style of the round spinner component. [2]
-	- $spinner-round-animation-time :	The animation time of the round spinner component.
-	Notes:
-	- [1] : The value of $spinner-round-size affects both height and width of the component.
-	- [2] : The values of $spinner-round-doughnut-style and $spinner-round-spin-style are styles
-		specified in border style format.
-*/
-.spinner-dots {
-  display: inline-block;
-  overflow: hidden;
-  height: 1.5em;
-  vertical-align: bottom; }
-  .spinner-dots:after {
-    display: inline-table;
-    white-space: pre;
-    content: "\A.\A..\A...";
-    animation: spin-dots 1.5s steps(4) infinite; }
-
-@keyframes spin-dots {
-  to {
-    transform: translateY(-6em); } }
-.spinner-round {
-  display: inline-block;
-  border: 0.4em solid rgba(245, 245, 245, 0.2);
-  border-left: 0.4em solid #f5f5f5;
-  transform: translateZ(0);
-  animation: spin-round 1.5s infinite linear; }
-  .spinner-round, .spinner-round:after {
-    border-radius: 50%;
-    width: 1.5em;
-    height: 1.5em; }
-
-@keyframes spin-round {
-  0% {
-    transform: rotate(0deg); }
-  100% {
-    transform: rotate(360deg); } }
-/*
-	Mixin for the carousel component. 
-	Parameters:
-	- $carousel-name                 :	The class name for the carousel.
-	- $carousel-width                :	The width of the carousel. [1]
-	- $carousel-height               :	The height of the carousel.
-	- $carousel-border               :	The style of the carousel's border.
-	- $carousel-border-radius        :	The border-radius of the carousel.
-	- $carousel-container-bg-color   :	The background color of the carousel.
-	- $carousel-content-padding      :	The padding of the carousel's contents. [2]
-	- $carousel-description-color    :	The text color of the carousel's description.
-	- $carousel-description-bg-color :	The background color of the carousel's description.
-	- $carousel-description-top      :	The distance of the carousel's description from the top of the container. [3]
-	- $carousel-description-height   :	The height of the carousel's description area. [3]
-	- $carousel-control-top          :	The distance of the carousel's controls from the top of the container. [3]
-	- $carousel-control-font-size    :	The font-size of the carousel's controls.
-	- $carousel-control-color        :	The text color of the carousel's controls.
-	Notes:
-	- [1] : The height of the carousel is suggested to be defined as a percentage so that
-		it makes it responsive for smaller screens.
-	- [2] : The value of $carousel-content-padding only applies to images inside the carousel.
-	- [3] : The distances from the top are used for positioning the elements. The height of the
-		desccription should normally be the height of the container minus the top distance of
-		the description. Control distance should be about 90% of the container's height.
-*/
-.carousel {
-  position: relative;
-  width: 80%;
-  height: 500px;
-  overflow: hidden;
-  text-align: center;
-  margin: auto;
-  border: 1px solid #304251;
-  border-radius: 4px; }
-  .carousel input[type="radio"] {
-    display: none; }
-    .carousel input[type="radio"] + div {
-      display: none;
-      position: absolute;
-      width: 100%;
-      height: 100%;
-      left: 0;
-      top: 0;
-      padding: 10px;
-      background-color: #e5ebf1; }
-      .carousel input[type="radio"] + div > img {
-        max-width: 100%;
-        max-height: 100%;
-        margin: auto; }
-      .carousel input[type="radio"] + div > div {
-        position: absolute;
-        width: 100%;
-        height: 160px;
-        overflow: auto;
-        left: 0;
-        top: 340px;
-        background-color: #151f29;
-        color: #f5f5f5;
-        opacity: 0.1; }
-        .carousel input[type="radio"] + div > div:hover, .carousel input[type="radio"] + div > div:active, .carousel input[type="radio"] + div > div:focus {
-          opacity: 0.8; }
-      .carousel input[type="radio"] + div + label {
-        position: relative;
-        z-index: 998;
-        cursor: pointer;
-        top: 450px;
-        color: #f5f5f5;
-        font-size: 1.8em; }
-        .carousel input[type="radio"] + div + label:before {
-          content: '\25cb'; }
-    .carousel input[type="radio"]:checked + div {
-      display: block; }
-      .carousel input[type="radio"]:checked + div + label:before {
-        content: '\25cf'; }
-
-/*
-	Mixin for breadcrumbs style.
-	Parameters:
-	- $breadcrumbs-name   :	The class name for the breadcrumbs style.
-	- $breadcrumbs-style :	The style of the breadcrumbs separator character. [1][2][3]
-	Notes:
-	- [1] : $breadcrumbs-style accepts the values 1, 2 or 3. If an invalid value is
-		supplied, it will be treated as 3.
-	- [2] : The three provided styles are as follows:
-	  - $breadcrumbs-style == 1 : forward slash.
-	  - $breadcrumbs-style == 2 : greater than symbol.
-	  - $breadcrumbs-style == 3 : right angle symbol (default).
-	- [3] : The value of $breadcrumbs-style can be omitted and will default to 3.
-*/
-/*
-	Mixin for generic container style.
-	Parameters:
-	- $container-name          : The class name for the generic container.
-	- $container-color         : The text color of the generic container.
-	- $container-bg-color      : The background color of the generic container.
-	- $container-border        : The border style of the generic container.
-	- $container-border-radius : The border-radius of the generic container.
-	- $container-padding       : The content badding of the generic container.
-	Notes:
-	- [1] : This mixin is also used for making alerts and panels.
-*/
-/*
-	Mixin for generic alert style.
-	Parameters:
-	- $alert-name          : The class name for the alert.
-	- $alert-color         : The text color of the alert.
-	- $alert-bg-color      : The background color of the alert.
-	- $alert-border        : The border style of the alert.
-	- $alert-border-radius : The border-radius of the alert.
-	- $alert-padding       : The content badding of the alert.
-	- $close-name          : The class name for the close utility. [1]
-	Notes:
-	- [1] : The value of $close-name must match that of the class specified
-		for close elements for the alert to work correctly.
-	- [2] : This mixin uses `make-generic-container` to partially generate its
-		CSS.
-*/
-/*
-	Mixin for generic panel style.
-	Parameters:
-	- $panel-name            : The class name for the panel.
-	- $panel-color           : The text color of the panel.
-	- $panel-bg-color        : The background color of the panel.
-	- $panel-border          : The border style of the panel.
-	- $panel-border-radius   : The border-radius of the panel.
-	- $panel-padding         : The content badding of the panel.
-	- $panel-header-name     : The class name for the panel's header.
-	- $panel-header-color    : The text color of the panel's header.
-	- $panel-header-bg-color : The background color of the panel's header.
-	- $panel-header-padding  : The padding of the panel's header.
-	Notes:
-	- [1] : This mixin uses `make-generic-container` to partially generate its
-		CSS.
-*/
-/*
-	Mixin for generic popover style.
-	Parameters:
-	- $popover-name          : The name for the popover style
-	- $popover-direction     : The direction of the popover. [1]
-	- $popover-border-radius : The border radius for the popover style.
-	- $popover-distance      : The distance for the popover style's placement. [2]
-	- $popover-color         : The text color of the popover style.
-	- $popover-bg-color      : The background color of the popover style.
-	- $popover-padding       : The padding of the popover.
-	Notes:
-	- [1] : The values that $popover-direction accepts are 'top' and 'bottom'. If an invalid value
-		is provided, it will be treated as 'bottom'.
-	- [2] : The value of $popover-distance should be treated as a general guideline for the popover
-		distance and is supposed to be tweaked with inline styles or helper classes for better use.
-*/
-/*
-	Mixin for generic button states.
-	Parameters:
-	- $button-states-name :	The class name of the stateful button.
-	Notes:
-	- [1] : This mixin is experimental, it might be buggy.
-*/
-/*
-	Mixin for generic button groups.
-	Parameters:
-	- $btn-group-name          :	The class name of the button group.
-	- $btn-name                :	The name of the button class. [1][2]
-	- $btn-group-border        :	The border style of the button group.
-	- $btn-group-border-radius :	The border radius at the edges of the button group.
-	Notes:
-	- [1] :	The value of $btn-name must match that of the generic button class.
-	- [2] : The value of $btn-name can be hacked to allow for button variants to be styled
-		in custom manners (e.g. if you button class is `btn` and your button variant's class
-		is `blue`, you can style it, using `btn +'.blue'`).
-	- [3] : This mixin is experimental, although it is marked stable for most cases.
-	- [4] : The results of this mixin are purely stylistic and do not provide any grouping
-		functionality.
-*/
-.brdcrmb {
-  list-style: none; }
-  .brdcrmb > li {
-    display: inline-block; }
-    .brdcrmb > li + li:before {
-      content: '\27e9\00a0'; }
-
-.well {
-  border: 1px solid #304251;
-  border-radius: 4px;
-  background-color: #26384b;
-  color: #f5f5f5;
-  padding: 20px; }
-
-.alert-blue + div {
-  border: 1px solid #222e33;
-  border-radius: 4px;
-  background-color: #4a6471;
-  color: #0e1215;
-  padding: 20px; }
-
-input[type="checkbox"].alert-blue {
-  display: none; }
-  input[type="checkbox"].alert-blue + div {
-    display: none;
-    position: relative; }
-    input[type="checkbox"].alert-blue + div a {
-      font-weight: 700;
-      text-decoration: none;
-      color: black; }
-      input[type="checkbox"].alert-blue + div a:hover, input[type="checkbox"].alert-blue + div a:active, input[type="checkbox"].alert-blue + div a:focus {
-        text-decoration: underline; }
-    input[type="checkbox"].alert-blue + div .close {
-      position: absolute;
-      top: 20px;
-      right: 20px;
-      color: #0e1215; }
-      input[type="checkbox"].alert-blue + div .close:hover, input[type="checkbox"].alert-blue + div .close:active, input[type="checkbox"].alert-blue + div .close:focus {
-        color: black; }
-
-input[type="checkbox"]:checked.alert-blue + div {
-  display: block; }
-
-.alert-green + div {
-  border: 1px solid #317b35;
-  border-radius: 4px;
-  background-color: #57bb5c;
-  color: #235625;
-  padding: 20px; }
-
-input[type="checkbox"].alert-green {
-  display: none; }
-  input[type="checkbox"].alert-green + div {
-    display: none;
-    position: relative; }
-    input[type="checkbox"].alert-green + div a {
-      font-weight: 700;
-      text-decoration: none;
-      color: #143216; }
-      input[type="checkbox"].alert-green + div a:hover, input[type="checkbox"].alert-green + div a:active, input[type="checkbox"].alert-green + div a:focus {
-        text-decoration: underline; }
-    input[type="checkbox"].alert-green + div .close {
-      position: absolute;
-      top: 20px;
-      right: 20px;
-      color: #235625; }
-      input[type="checkbox"].alert-green + div .close:hover, input[type="checkbox"].alert-green + div .close:active, input[type="checkbox"].alert-green + div .close:focus {
-        color: #143216; }
-
-input[type="checkbox"]:checked.alert-green + div {
-  display: block; }
-
-.alert-red + div {
-  border: 1px solid #c81616;
-  border-radius: 4px;
-  background-color: #ec5858;
-  color: #9a1111;
-  padding: 20px; }
-
-input[type="checkbox"].alert-red {
-  display: none; }
-  input[type="checkbox"].alert-red + div {
-    display: none;
-    position: relative; }
-    input[type="checkbox"].alert-red + div a {
-      font-weight: 700;
-      text-decoration: none;
-      color: #6c0c0c; }
-      input[type="checkbox"].alert-red + div a:hover, input[type="checkbox"].alert-red + div a:active, input[type="checkbox"].alert-red + div a:focus {
-        text-decoration: underline; }
-    input[type="checkbox"].alert-red + div .close {
-      position: absolute;
-      top: 20px;
-      right: 20px;
-      color: #9a1111; }
-      input[type="checkbox"].alert-red + div .close:hover, input[type="checkbox"].alert-red + div .close:active, input[type="checkbox"].alert-red + div .close:focus {
-        color: #6c0c0c; }
-
-input[type="checkbox"]:checked.alert-red + div {
-  display: block; }
-
-.panel {
-  border: 1px solid #304251;
-  border-radius: 4px;
-  background-color: #151f29;
-  color: #f5f5f5;
-  padding: 0; }
-
-.panel > * {
-  padding: 10px; }
-.panel .head {
-  border: 0;
-  border-bottom: 1px solid #304251;
-  color: #f5f5f5;
-  background-color: #26384b;
-  padding: 10px;
-  margin: 0; }
-
-input[type="checkbox"].popover-top {
-  display: none; }
-  input[type="checkbox"].popover-top + label {
-    position: relative; }
-  input[type="checkbox"].popover-top + label > .popover-top {
-    position: absolute;
-    display: none;
-    background-color: #f5f5f5;
-    color: #151f29;
-    border-radius: 5px;
-    padding: 7px 10px;
-    z-index: 998;
-    width: auto;
-    bottom: 49px; }
-    input[type="checkbox"].popover-top + label > .popover-top:before {
-      position: absolute;
-      display: block;
-      border-top: 7px solid #f5f5f5;
-      border-right: 7px solid transparent;
-      border-left: 7px solid transparent;
-      bottom: -7px;
-      content: '';
-      left: 50%;
-      margin-left: -7px; }
-input[type="checkbox"]:checked.popover-top + label > .popover-top {
-  display: block; }
-
-input[type="checkbox"].popover-bottom {
-  display: none; }
-  input[type="checkbox"].popover-bottom + label {
-    position: relative; }
-  input[type="checkbox"].popover-bottom + label > .popover-bottom {
-    position: absolute;
-    display: none;
-    background-color: #f5f5f5;
-    color: #151f29;
-    border-radius: 4px;
-    padding: 7px 10px;
-    z-index: 998;
-    width: auto;
-    top: 49px; }
-    input[type="checkbox"].popover-bottom + label > .popover-bottom:before {
-      position: absolute;
-      display: block;
-      border-bottom: 7px solid #f5f5f5;
-      border-right: 7px solid transparent;
-      border-left: 7px solid transparent;
-      top: -7px;
-      content: '';
-      left: 50%;
-      margin-left: -7px; }
-input[type="checkbox"]:checked.popover-bottom + label > .popover-bottom {
-  display: block; }
-
-.btn-grp .btn {
-  border: 1px solid #304251;
-  margin: 0; }
-  .btn-grp .btn:not(:first-child):not(:last-child) {
-    border-radius: 0;
-    border-right: 0; }
-  .btn-grp .btn:first-child {
-    border-radius: 4px 0 0 4px;
-    border-right: 0; }
-  .btn-grp .btn:last-child {
-    border-radius: 0 4px 4px 0; }
-
-.btn-grp .btn.blue {
-  border: 1px solid #222e33;
-  margin: 0; }
-  .btn-grp .btn.blue:not(:first-child):not(:last-child) {
-    border-radius: 0;
-    border-right: 0; }
-  .btn-grp .btn.blue:first-child {
-    border-radius: 4px 0 0 4px;
-    border-right: 0; }
-  .btn-grp .btn.blue:last-child {
-    border-radius: 0 4px 4px 0; }
-
-.btn-grp .btn.green {
-  border: 1px solid #317b35;
-  margin: 0; }
-  .btn-grp .btn.green:not(:first-child):not(:last-child) {
-    border-radius: 0;
-    border-right: 0; }
-  .btn-grp .btn.green:first-child {
-    border-radius: 4px 0 0 4px;
-    border-right: 0; }
-  .btn-grp .btn.green:last-child {
-    border-radius: 0 4px 4px 0; }
-
-.btn-grp .btn.red {
-  border: 1px solid 1px solid #c81616;
-  margin: 0; }
-  .btn-grp .btn.red:not(:first-child):not(:last-child) {
-    border-radius: 0;
-    border-right: 0; }
-  .btn-grp .btn.red:first-child {
-    border-radius: 4px 0 0 4px;
-    border-right: 0; }
-  .btn-grp .btn.red:last-child {
-    border-radius: 0 4px 4px 0; }
-
-/*# sourceMappingURL=mini-niteowl.css.map */
diff --git a/flavors/mini-niteowl.min.css b/flavors/mini-niteowl.min.css
deleted file mode 100644
index 8d23ed0..0000000
--- a/flavors/mini-niteowl.min.css
+++ /dev/null
@@ -1 +0,0 @@
-html{font-family:"Helvetica Neue",Helvetica,sans-serif;font-size:1em;line-height:1.5;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0;color:#f5f5f5;background-color:#151f29}article,aside,details,figcaption,figure,footer,header,img,main,menu,nav,section{display:block}figure{margin:1em 40px}h1,h2,h3,h4,h5,h6{line-height:1.2;margin:.7em 0;font-weight:500}h1 small,h2 small,h3 small,h4 small,h5 small,h6 small{color:#b5b5b5;font-weight:200}h1{font-size:2em}h2{font-size:1.5em}h3{font-size:1.15em}h4{font-size:1em}h5{font-size:.8em}h6{font-size:.7em}hr{box-sizing:content-box;line-height:1.2;margin:.7em 0;height:0;border:0;border-top:1px solid #304251}small,sub,sup{font-size:75%}p,pre{margin:0 0 .6em}ol,ul{margin-top:0;margin-bottom:.6em}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}code,kbd,pre{padding:2px 4px;border-radius:4px}code,pre{background-color:#040607}kbd{color:#1b2835;background-color:#f5f5f5}pre{display:block;word-break:break-all;word-wrap:break-word}pre code{padding:0;font-size:inherit;color:inherit;white-space:pre-wrap;background-color:transparent;border-radius:0}a{background-color:transparent;text-decoration:none;color:#6493cd}a:active,a:hover{outline-width:0;color:#8baed9}a:visited{color:#3e78c0}a:visited:active,a:visited:hover{color:#6493cd}b,strong{font-weight:bolder}dfn{font-style:italic}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}mark{background-color:#e44b23;color:#f5f5f5}.hidden,[hidden],audio:not([controls]),template{display:none}audio:not([controls]){height:0}audio,progress,video{display:inline-block}progress,sub,sup{vertical-align:baseline}sub,sup{line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none;max-width:100%}svg:not(:root){overflow:hidden}button,hr,input{overflow:visible}button,input,optgroup,select,textarea{font-family:"Helvetica Neue",Helvetica,sans-serif;font-size:100%;line-height:1.2;margin:0}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner,html [type=button]::-moz-focus-inner{border-style:none;padding:0}[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring,html [type=button]:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid #304251;border-radius:4px;margin:0 2px;padding:.35em .65em .75em}[type=checkbox],[type=radio],legend{box-sizing:border-box;padding:0}legend{color:inherit;display:table;max-width:100%;white-space:normal}textarea{overflow:auto}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button,img{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}.btn,a.btn,a.btn:visited{display:inline-block;border:0;border-radius:4px;margin:2px 0;padding:6px 12px;color:#f5f5f5;background:#454545;cursor:pointer}.btn:active,.btn:focus,.btn:hover,a.btn:active,a.btn:focus,a.btn:hover,a.btn:visited:active,a.btn:visited:focus,a.btn:visited:hover{background:#585858}.btn.disabled,.btn:disabled,.btn[disabled],a.btn.disabled,a.btn:disabled,a.btn:visited.disabled,a.btn:visited:disabled,a.btn:visited[disabled],a.btn[disabled]{cursor:not-allowed;opacity:.65}.btn.blue,a.btn.blue,a.btn.blue:visited{color:#f5f5f5;background:#364952}.btn.blue:active,.btn.blue:focus,.btn.blue:hover,a.btn.blue:active,a.btn.blue:focus,a.btn.blue:hover,a.btn.blue:visited:active,a.btn.blue:visited:focus,a.btn.blue:visited:hover{background:#455e69}.btn.green,a.btn.green,a.btn.green:visited{color:#f5f5f5;background:#409f45}.btn.green:active,.btn.green:focus,.btn.green:hover,a.btn.green:active,a.btn.green:focus,a.btn.green:hover,a.btn.green:visited:active,a.btn.green:visited:focus,a.btn.green:visited:hover{background:#398d3d}.btn.red,a.btn.red,a.btn.red:visited{color:#f5f5f5;background:#e72a2a}.btn.red:active,.btn.red:focus,.btn.red:hover,a.btn.red:active,a.btn.red:focus,a.btn.red:hover,a.btn.red:visited:active,a.btn.red:visited:focus,a.btn.red:visited:hover{background:#d31818}.btn.lg{padding:9px 15px;font-size:135%}.btn.sm{padding:4px 8px;font-size:80%}.grid-container{padding-right:0;padding-left:0;margin-right:auto;margin-left:auto;width:100%}.grid-container *{box-sizing:border-box}.row:after,.row:before{content:"";display:table;clear:both}.col{float:left;padding:12px}.xs-1{width:8.33333%}.xs-2{width:16.66667%}.xs-3{width:25%}.xs-4{width:33.33333%}.xs-5{width:41.66667%}.xs-6{width:50%}.xs-7{width:58.33333%}.xs-8{width:66.66667%}.xs-9{width:75%}.xs-10{width:83.33333%}.xs-11{width:91.66667%}.xs-12{width:100%}.lg-no,.md-no,.sm-no{display:block}.xs-no{display:none}@media (min-width:768px){.sm-1{width:8.33333%}.sm-2{width:16.66667%}.sm-3{width:25%}.sm-4{width:33.33333%}.sm-5{width:41.66667%}.sm-6{width:50%}.sm-7{width:58.33333%}.sm-8{width:66.66667%}.sm-9{width:75%}.sm-10{width:83.33333%}.sm-11{width:91.66667%}.sm-12{width:100%}.lg-no,.md-no,.xs-no{display:block}.sm-no{display:none}}@media (min-width:1024px){.md-1{width:8.33333%}.md-2{width:16.66667%}.md-3{width:25%}.md-4{width:33.33333%}.md-5{width:41.66667%}.md-6{width:50%}.md-7{width:58.33333%}.md-8{width:66.66667%}.md-9{width:75%}.md-10{width:83.33333%}.md-11{width:91.66667%}.md-12{width:100%}.lg-no,.sm-no,.xs-no{display:block}.md-no{display:none}}@media (min-width:1280px){.lg-1{width:8.33333%}.lg-2{width:16.66667%}.lg-3{width:25%}.lg-4{width:33.33333%}.lg-5{width:41.66667%}.lg-6{width:50%}.lg-7{width:58.33333%}.lg-8{width:66.66667%}.lg-9{width:75%}.lg-10{width:83.33333%}.lg-11{width:91.66667%}.lg-12{width:100%}.md-no,.sm-no,.xs-no{display:block}.lg-no{display:none}}.frm input:not([type]),.frm input[type$=time],.frm input[type=color],.frm input[type=email],.frm input[type=month],.frm input[type=number],.frm input[type=password],.frm input[type=search],.frm input[type=tel],.frm input[type=text],.frm input[type=url],.frm input[type=week],.frm input[type^=date],.frm select,.frm textarea{box-sizing:border-box;border:1px solid #304251;border-radius:4px;box-shadow:none}.frm input,.frm select,.frm textarea{display:block;margin:.2em;padding:.3em}.frm input:focus,.frm select:focus,.frm textarea:focus{border-color:#f1e05a}.frm input[disabled],.frm select[disabled],.frm textarea[disabled]{cursor:not-allowed;opacity:.65}.frm input:focus:invalid,.frm input:focus:invalid:focus,.frm input:invalid,.frm select:focus:invalid,.frm select:focus:invalid:focus,.frm select:invalid,.frm textarea:focus:invalid,.frm textarea:focus:invalid:focus,.frm textarea:invalid{border-color:#e44b23}.frm input[readonly],.frm select[readonly],.frm textarea[readonly]{background-color:#040607;border-color:#000}.frm input[type=checkbox],.frm input[type=radio]{display:inline-block}.frm select{height:1.9em}.frm select[multiple]{height:auto}.frm label{margin:.5em 0 0 .2em}.frm.aligned input,.frm.aligned label,.frm.aligned select,.frm.aligned textarea,.frm.inline .ctrl-group,.frm.inline input,.frm.inline label,.frm.inline select,.frm.inline textarea{display:inline-block}.frm.aligned .ctrl-group label{text-align:right;vertical-align:middle;width:15em;margin-top:0}.frm .ctrl-group{margin:0 0 .3em}.tbl{border-collapse:collapse;border-spacing:0;empty-cells:show;border:1px solid #304251}.tbl td,.tbl th{overflow:visible;border-left:1px solid #304251;border-bottom:none;margin:0;padding:.5em}.tbl thead{background-color:#3b5773;color:#f5f5f5;text-align:left}.tbl tbody{background-color:#1e2c3a;color:#e1e1e1}.tbl tbody tr:nth-child(2n-1){background-color:#26384b}.tbl.hor td,.tbl.hor th{border-left:none;border-bottom:1px solid #304251}.tbl.bor td,.tbl.bor th{border-bottom:1px solid #304251}.nav{box-sizing:border-box;background-color:#243447}.nav .logo{font-size:135%;color:#f5f5f5}.nav ul{display:inline-block;list-style:none;margin:0;padding:0}.nav ul li{display:inline-block;margin:0;white-space:nowrap}.nav ul li>*{display:inline-block;padding:8px;color:#f5f5f5;margin:0}.nav ul li .link:active,.nav ul li .link:focus,.nav ul li .link:hover{color:#f5f5f5;background:#17212e}.nav ul li .link.disabled,.nav ul li .link:disabled,.nav ul li .link[disabled]{cursor:not-allowed;opacity:.65}.nav.vertical ul,.nav.vertical ul li{display:block}.nav.vertical ul li>*{width:100%;padding:8px 0}.nav.fixed{position:fixed;left:0;top:0;z-index:999;width:100%}.nav.fixed.vertical{height:100%;width:16.66667%}.nav.fixed.vertical ul{width:100%}.nav.fixed.vertical ul li{display:block}.nav+label{display:none;font-weight:700;margin:10px;font-size:1.75em;padding:8px;color:#f5f5f5;background-color:#243447;width:auto;position:fixed;z-index:1000;top:0;right:0}.nav+label:before{position:relative;content:'\2630'}.nav+label:active,.nav+label:focus,.nav+label:hover{background:#17212e}@media (max-width:768px){.nav{overflow:auto}.nav.fixed{display:none}.nav.fixed+label{display:block}input[type=checkbox]:checked+.nav.fixed{display:block;width:100%;height:100%}input[type=checkbox]:checked+.nav.fixed ul,input[type=checkbox]:checked+.nav.fixed ul li{display:block}input[type=checkbox]:checked+.nav.fixed ul li *{width:100%;padding:8px 0}input[type=checkbox]:checked+.nav.fixed+label:before{content:'\00d7'}}img.thumb{padding:.25em;border:1px solid #304251;border-radius:4px;cursor:pointer}img.thumb:focus,img.thumb:hover,img.thumbactive{border-color:#6493cd}.bordered{border:1px solid rgba(0,0,0,.25)!important}.rounded{border-radius:4px!important}.circle{border-radius:50%!important}.txt-blue{color:#364952!important}.txt-green{color:#409f45!important}.txt-red{color:#e72a2a!important}.bg-blue{background-color:#364952!important}.bg-green{background-color:#409f45!important}.bg-red{background-color:#e72a2a!important}.caret{display:inline-block;vertical-align:middle;line-height:1;width:0;height:0;border:.35em solid transparent;border-top:.35em solid #aaa}.close{display:inline-block;vertical-align:middle;line-height:1;color:#aaa;font-size:1.3em;font-weight:700;cursor:pointer}.close:before{content:'\00d7'}.close:active,.close:focus,.close:hover{color:#777}.drg-left{float:left!important}.drg-right{float:right!important}.ct-block{display:block;margin-left:auto;margin-right:auto}.cf:after,.cf:before{content:"";display:table;clear:both}.hidden{display:none!important}.lbl{display:inline-block;padding:6px 10px;color:#f5f5f5;background-color:#525252;border-radius:4px}.lbl:empty{display:none}.lbl.blue{color:#f5f5f5;background-color:#364952}.lbl.green{color:#f5f5f5;background-color:#409f45}.lbl.red{color:#f5f5f5;background-color:#e72a2a}.bdg{display:inline-block;padding:3px 8px;color:#f5f5f5;background-color:#525252;border-radius:8px}.bdg:empty{display:none}.bdg.blue{color:#f5f5f5;background-color:#364952}.bdg.green{color:#f5f5f5;background-color:#409f45}.bdg.red{color:#f5f5f5;background-color:#e72a2a}.tabs{position:relative;min-height:250px;width:100%}.tabs input[type=radio]{display:none}.tabs input[type=radio]+div{display:inline}.tabs input[type=radio]+div>label{position:reative;float:left;margin-right:3px;left:1px;height:40px;padding:8px 14px;color:#6493cd;background-color:#151f29;border:1px solid #304251;border-radius:4px 4px 0 0;cursor:pointer}.tabs input[type=radio]+div>label:active,.tabs input[type=radio]+div>label:focus,.tabs input[type=radio]+div>label:hover{background:#040607}.tabs input[type=radio]+div>label+div{position:absolute;z-index:-2;left:0;top:39px;bottom:0;right:0;padding:20px;background:#1e2c3a;border:1px solid #304251}.tabs input[type=radio]:checked+div>label{color:#f5f5f5;background:#1e2c3a;border-top:3px solid #6493cd;border-bottom:1px solid #1e2c3a}.tabs input[type=radio]:checked+div>label+div{position:absolute;z-index:-1}.modal{display:none}.modal+div{z-index:997;position:fixed;width:100%;height:0;opacity:0;display:none;transition:opacity .3s ease-out}.modal+div>div{z-index:998;position:relative;width:45%;color:#f5f5f5;background-color:#151f29;margin:8.5% auto 0;padding:18px;border:1px solid #304251;border-radius:4px;box-shadow:0 5px 15px rgba(0,0,0,.5)}.modal:checked+div{height:100%;opacity:1;display:block}.modal:checked+div>label{background-color:rgba(0,0,0,.35);position:fixed;width:100%;height:100%;top:0}.modal+div>div .close{position:absolute;top:20px;right:20px}.nav .link.dropdown{cursor:pointer}.nav input[type=checkbox],.nav input[type=checkbox].dropdown+div,.nav input[type=radio],.nav input[type=radio].dropdown+div{display:none}.nav input[type=checkbox]:checked.dropdown+div,.nav input[type=radio]:checked.dropdown+div{display:block;font-size:.8em;margin-left:20px}input[type=checkbox].clps{display:none}input[type=checkbox].clps+div{display:none;color:#f5f5f5;background-color:#26384b;padding:10px;margin-top:5px;border:1px solid #304251;border-radius:4px}input[type=checkbox]:checked.clps+div{display:block}input[type=radio].acrd{display:none}input[type=radio].acrd+label{width:100%;display:block;color:#f5f5f5;background-color:#26384b;padding:8px;margin-bottom:5px;border:1px solid #304251;border-radius:4px;cursor:pointer}input[type=radio].acrd+label:active,input[type=radio].acrd+label:focus,input[type=radio].acrd+label:hover{background-color:#192531}input[type=radio].acrd+label+div{display:none;color:#f5f5f5;background-color:#151f29;padding:10px;margin-top:-1px;margin-bottom:5px;border:1px solid #304251;border-radius:0 0 4px 4px}input[type=radio]:checked.acrd+label{border-radius:4px 4px 0 0;margin-bottom:0}input[type=radio]:checked.acrd+label+div{display:block}.prg{position:relative;overflow:hidden;height:20px;background-color:#d7d7d7;border-radius:4px}.prg>span{float:left;width:0;height:100%;color:#f5f5f5;background-color:#364952;text-align:center;font-size:.8em}.prg>span.green{color:#f5f5f5;background-color:#409f45}.prg>span.red{color:#f5f5f5;background-color:#e72a2a}.spinner-dots{display:inline-block;overflow:hidden;height:1.5em;vertical-align:bottom}.spinner-dots:after{display:inline-table;white-space:pre;content:"\A.\A..\A...";animation:spin-dots 1.5s steps(4) infinite}@keyframes spin-dots{to{transform:translateY(-6em)}}.spinner-round{display:inline-block;border:.4em solid rgba(245,245,245,.2);border-left:.4em solid #f5f5f5;transform:translateZ(0);animation:spin-round 1.5s infinite linear}.spinner-round,.spinner-round:after{border-radius:50%;width:1.5em;height:1.5em}@keyframes spin-round{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.carousel{position:relative;width:80%;height:500px;overflow:hidden;text-align:center;margin:auto;border:1px solid #304251;border-radius:4px}.carousel input[type=radio]{display:none}.carousel input[type=radio]+div{display:none;position:absolute;width:100%;height:100%;left:0;top:0;padding:10px;background-color:#e5ebf1}.carousel input[type=radio]+div>img{max-width:100%;max-height:100%;margin:auto}.carousel input[type=radio]+div>div{position:absolute;width:100%;height:160px;overflow:auto;left:0;top:340px;background-color:#151f29;color:#f5f5f5;opacity:.1}.carousel input[type=radio]+div>div:active,.carousel input[type=radio]+div>div:focus,.carousel input[type=radio]+div>div:hover{opacity:.8}.carousel input[type=radio]+div+label{position:relative;z-index:998;cursor:pointer;top:450px;color:#f5f5f5;font-size:1.8em}.carousel input[type=radio]+div+label:before{content:'\25cb'}.carousel input[type=radio]:checked+div{display:block}.carousel input[type=radio]:checked+div+label:before{content:'\25cf'}.brdcrmb{list-style:none}.brdcrmb>li{display:inline-block}.brdcrmb>li+li:before{content:'\27e9\00a0'}.well{border:1px solid #304251;border-radius:4px;background-color:#26384b;color:#f5f5f5;padding:20px}.alert-blue+div{border:1px solid #222e33;border-radius:4px;background-color:#4a6471;color:#0e1215;padding:20px}input[type=checkbox].alert-blue{display:none}input[type=checkbox].alert-blue+div{display:none;position:relative}input[type=checkbox].alert-blue+div a{font-weight:700;text-decoration:none;color:#000}input[type=checkbox].alert-blue+div a:active,input[type=checkbox].alert-blue+div a:focus,input[type=checkbox].alert-blue+div a:hover{text-decoration:underline}input[type=checkbox].alert-blue+div .close{position:absolute;top:20px;right:20px;color:#0e1215}input[type=checkbox].alert-blue+div .close:active,input[type=checkbox].alert-blue+div .close:focus,input[type=checkbox].alert-blue+div .close:hover{color:#000}input[type=checkbox]:checked.alert-blue+div{display:block}.alert-green+div{border:1px solid #317b35;border-radius:4px;background-color:#57bb5c;color:#235625;padding:20px}input[type=checkbox].alert-green{display:none}input[type=checkbox].alert-green+div{display:none;position:relative}input[type=checkbox].alert-green+div a{font-weight:700;text-decoration:none;color:#143216}input[type=checkbox].alert-green+div a:active,input[type=checkbox].alert-green+div a:focus,input[type=checkbox].alert-green+div a:hover{text-decoration:underline}input[type=checkbox].alert-green+div .close{position:absolute;top:20px;right:20px;color:#235625}input[type=checkbox].alert-green+div .close:active,input[type=checkbox].alert-green+div .close:focus,input[type=checkbox].alert-green+div .close:hover{color:#143216}input[type=checkbox]:checked.alert-green+div{display:block}.alert-red+div{border:1px solid #c81616;border-radius:4px;background-color:#ec5858;color:#9a1111;padding:20px}input[type=checkbox].alert-red{display:none}input[type=checkbox].alert-red+div{display:none;position:relative}input[type=checkbox].alert-red+div a{font-weight:700;text-decoration:none;color:#6c0c0c}input[type=checkbox].alert-red+div a:active,input[type=checkbox].alert-red+div a:focus,input[type=checkbox].alert-red+div a:hover{text-decoration:underline}input[type=checkbox].alert-red+div .close{position:absolute;top:20px;right:20px;color:#9a1111}input[type=checkbox].alert-red+div .close:active,input[type=checkbox].alert-red+div .close:focus,input[type=checkbox].alert-red+div .close:hover{color:#6c0c0c}input[type=checkbox]:checked.alert-red+div{display:block}.panel{border:1px solid #304251;border-radius:4px;background-color:#151f29;color:#f5f5f5;padding:0}.panel>*{padding:10px}.panel .head{border:0;border-bottom:1px solid #304251;color:#f5f5f5;background-color:#26384b;padding:10px;margin:0}input[type=checkbox].popover-top{display:none}input[type=checkbox].popover-top+label{position:relative}input[type=checkbox].popover-top+label>.popover-top{position:absolute;display:none;background-color:#f5f5f5;color:#151f29;border-radius:5px;padding:7px 10px;z-index:998;width:auto;bottom:49px}input[type=checkbox].popover-top+label>.popover-top:before{position:absolute;display:block;border-top:7px solid #f5f5f5;border-right:7px solid transparent;border-left:7px solid transparent;bottom:-7px;content:'';left:50%;margin-left:-7px}input[type=checkbox]:checked.popover-top+label>.popover-top{display:block}input[type=checkbox].popover-bottom{display:none}input[type=checkbox].popover-bottom+label{position:relative}input[type=checkbox].popover-bottom+label>.popover-bottom{position:absolute;display:none;background-color:#f5f5f5;color:#151f29;border-radius:4px;padding:7px 10px;z-index:998;width:auto;top:49px}input[type=checkbox].popover-bottom+label>.popover-bottom:before{position:absolute;display:block;border-bottom:7px solid #f5f5f5;border-right:7px solid transparent;border-left:7px solid transparent;top:-7px;content:'';left:50%;margin-left:-7px}input[type=checkbox]:checked.popover-bottom+label>.popover-bottom{display:block}.btn-grp .btn{border:1px solid #304251;margin:0}.btn-grp .btn:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn:last-child{border-radius:0 4px 4px 0}.btn-grp .btn.blue{border:1px solid #222e33;margin:0}.btn-grp .btn.blue:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn.blue:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn.blue:last-child{border-radius:0 4px 4px 0}.btn-grp .btn.green{border:1px solid #317b35;margin:0}.btn-grp .btn.green:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn.green:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn.green:last-child{border-radius:0 4px 4px 0}.btn-grp .btn.red{border:1px solid 1px solid #c81616;margin:0}.btn-grp .btn.red:not(:first-child):not(:last-child){border-radius:0;border-right:0}.btn-grp .btn.red:first-child{border-radius:4px 0 0 4px;border-right:0}.btn-grp .btn.red:last-child{border-radius:0 4px 4px 0}
\ No newline at end of file
diff --git a/flavors/mini-niteowl.scss b/flavors/mini-niteowl.scss
deleted file mode 100644
index 176fed9..0000000
--- a/flavors/mini-niteowl.scss
+++ /dev/null
@@ -1,436 +0,0 @@
-//====================================================================
-//	This is the file you should edit to make the flavor you want.
-// 	Please read the instructions carefully.
-//====================================================================
-// 				!!	 IMPORTANT	!!
-//	Please copy this file or rename it, if you want to keep the default
-// 	flavor definitions file.
-//====================================================================
-//	Update the comment below to include it in your flavor, providing the information
-//	you want along with your customized flavor. You can also delete it if you don't
-// 	want it in your final CSS file.
-/*
-	Flavor name: NiteOwl (mini-niteowl)
-	Author: Angelos Chalaris (chalarangelo@gmail.com)
-	mini.css version: v1.1 (October, 2016)
-*/
-//====================================================================
-//
-//		CORE COMPONENTS (located in `mini`):
-//
-//====================================================================
-//	Variable definitions for the Base module (_base.scss)
-//====================================================================
-//	Basic rules for body
-$body-margin:					0;												// Margin for body
-$body-bg-color:					#151f29;										// Body background color
-$body-color:					#f5f5f5;										// Body text color
-//	Basic typography rules
-$base-fonts:					"\"Helvetica Neue\", Helvetica, sans-serif";	// Font-family
-$base-font-size:				1em;											// Font-size
-$base-line-height:				1.5;											// Line-height
-//	Rules for headers (multipliers apply on top of the basic typography rules)
-$h1-multiplier:					2;												// Header 1 font-sze multiplier
-$h2-multiplier:					1.5;											// Header 2 font-sze multiplier
-$h3-multiplier:					1.15;											// Header 3 font-sze multiplier
-$h4-multiplier:					1;												// Header 4 font-sze multiplier
-$h5-multiplier:					0.8;											// Header 5 font-sze multiplier
-$h6-multiplier:					0.7;											// Header 6 font-sze multiplier
-$header-line-height-multiplier:	0.8;											// Multiplier for line height of headers					 
-$header-margin:					0.7em 0;										// Margin for headers
-$header-font-weight:			500;											// Font weight for headers
-//	Rules for small elements inside headers
-$header-small-color:			darken($body-color, 25%);						// Header small text color
-$header-small-font-weight:		200;											// Header small font weight
-//	Rules for horizontal rules
-$hr-line-height-multiplier:		0.8;											// Multiplier for line height of horizontal rule
-$hr-margin:						0.7em 0;										// Margin for horizontal rule
-$hr-border-style:				1px solid #304251;								// Color and style of horizontal rule
-//	Common content typography rules (paragraphs, lists etc.)
-$p-margin:						0 0 0.6em;										// Margin for paragraph and pre elements
-$small-font-size:				75%;											// Font size for small, sub and sup elements
-$sub-bottom:					-0.25em;										// Sub bottom
-$sup-top:						-0.5em;											// Sup top
-$list-margin-top:				0;												// Top margin for lists
-$list-margin-bottom:			0.6em;											// Bottom margin for lists
-$mark-bg-color:					#e44b23;										// Mark background color
-$mark-color:					$body-color;									// Mark text color
-//	Code, preformatted and keyboard rules
-$code-fonts:					monospace, monospace;							// Font-family for code, pre, kbd, samp elements
-$code-padding:					2px 4px;										// Padding for code and pre elements
-$code-bg-color:					darken($body-bg-color, 10%);					// Code and pre background color	
-$code-border-radius:			4px;											// Border radius for code, pre and kbd elements
-$kbd-bg-color:					$body-color; 									// Kbd background color
-$kbd-color:						lighten($body-bg-color, 3.5%);					// Kbd text color
-//	Hyperlink rules
-$a-color:						#6493cd;										// Hyperlink text color
-$a-hover-color:					lighten($a-color, 10%);							// Hyperlink hover text color
-$a-visited-color:				darken($a-color, 10%);							// Hyperlink visited text color
-$a-visited-hover-color:			$a-color;										// Hyperlink visited hover text color
-//	Button, input and form rules
-$button-fonts:					$base-fonts;									// Font-family for buttons and inputs
-$button-font-size:				100%;											// Font size for buttons and inputs
-$button-line-height-multiplier:	0.8;											// Multiplier for line height of buttons and inputs
-$button-margin:					0;												// Margin for buttons and inputs
-$fieldset-border:				1px solid #304251;								// Border style for fieldset
-$fieldset-border-radius:		4px;											// Border radius for fieldset
-$fieldset-margin:				0 2px;											// Margin for fieldset
-$fieldset-padding:				0.35em 0.65em 0.75em;							// Padding for fieldset
-//	Enable base (_base.scss) and use the variables defined above.
-@import '../scss/mini/base';
-//====================================================================
-//	Variable definitions for the Button module (_button.scss)
-//====================================================================
-// 	Colors and styles (you can remove things you don't need or define more
-//	colors if you need them).
-$btn-default-color:							#f5f5f5;							// Default text color for buttons
-$btn-alt-color:								#f5f5f5;							// Alternative text color for buttons
-$btn-default-bg-color:						#454545;							// Default background color for buttons
-$btn-b-bg-color:							#364952;							// Color for button style 1
-$btn-g-bg-color:							#409f45;							// Color for button style 2
-$btn-r-bg-color:							#e72a2a;							// Color for button style 3
-//	Button class names (you can remove things you don't need or define more
-//	classes if you need them).
-$btn-class-name:							btn;								// Name for the base button class
-$btn-style1-name:							'blue';								// Name for button style 1 class
-$btn-style2-name:							'green';							// Name for button style 2 class
-$btn-style3-name:							'red';								// Name for button style 3 class
-$btn-size1-name:							lg;									// Name for the button size 1 class
-$btn-size2-name:							sm;									// Name for the button size 2 class
-//	Enable buttons (_button.scss). (Use individual mixins below to use.)
-@import '../scss/mini/button';
-// Use button mixins to create buttons with given specs. For more information
-// refer to the _button.scss file to check the definitions.
-@include make-btn($btn-class-name, 0, 4px, 2px 0, 6px 12px, $btn-default-color, $btn-default-bg-color, lighten, 7.5%, pointer, not-allowed, .65);
-@include make-btn-style($btn-class-name, $btn-style1-name, $btn-alt-color, $btn-b-bg-color);
-@include make-btn-style($btn-class-name, $btn-style2-name, $btn-alt-color, $btn-g-bg-color, darken, 5%);
-@include make-btn-style($btn-class-name, $btn-style3-name, $btn-alt-color, $btn-r-bg-color, darken);
-@include make-btn-size($btn-class-name, $btn-size1-name, 9px 15px, 135%);
-@include make-btn-size($btn-class-name, $btn-size2-name, 4px 8px, 80%);
-//====================================================================
-//	Variable definitions for the Grid module (_grid.scss)
-//====================================================================
-//	Class names for the grid system
-$grid-container-name:						grid-container;						// Name for the grid container class
-$grid-row-name:								row;								// Name for the grid's row class
-$grid-column-name:							col;								// Name for the grid's column class
-$grid-extra-small-device-name:				xs;									// Name for extra small devices
-$grid-small-device-name:					sm;									// Name for small devices
-$grid-medium-device-name:					md;									// Name for medium devices
-$grid-large-device-name:					lg;									// Name for large devices
-$grid-no-show-name:							no;									// Name for hidden grid elements class
-//	Grid breakpoints for different screens
-$grid-small-breakpoint:						768px;								// Breakpoint for extra small to small devices
-$grid-medium-breakpoint:					1024px;								// Breakpoint for small to medium devices
-$grid-large-breakpoint:						1280px;								// Breakpoint for medium to large devices
-//	Enable grid(s) (_grid.scss). (Use individual mixins below to use.)
-@import '../scss/mini/grid';
-// Use grid mixin to create grid with given specs. For more information
-// refer to the grid.scss file to check the definitions.
-@include make-grid($grid-container-name, 0, $grid-row-name, $grid-column-name, 12, 12px, $grid-extra-small-device-name, $grid-small-device-name, $grid-medium-device-name, $grid-large-device-name, $grid-no-show-name, $grid-small-breakpoint, $grid-medium-breakpoint, $grid-large-breakpoint);
-//====================================================================
-//	Variable definitions for the Form module (_form.scss)
-//====================================================================
-//	Class names for the forms and components
-$form-class-name:							frm;								// Name for the form class
-$form-control-group-name:					ctrl-group;							// Name for the form's control group class
-//	Colors for form components
-$form-focus-color:							#f1e05a;							// Color for focused form element outline
-$form-invalid-color:						#e44b23;							// Color for invalid form element outline
-//	Enable forms (_form.scss). (Use individual mixins below to use.)
-@import '../scss/mini/form';
-// Use form mixin to create form with given specs. For more information
-// refer to the _form.scss file to check the definitions.
-@include make-frm($form-class-name, 1px solid #304251, 4px, 0.2em, 0.3em, $form-focus-color, $form-invalid-color, not-allowed, .65, darken($body-bg-color,10%), darken($body-bg-color,25%), 1.9em, 0.5em 0 0 0.2em, $form-control-group-name,  0 0 0.3em 0, inline, aligned,15em);
-//====================================================================
-//	Variable definitions for the Table module (_table.scss)
-//====================================================================
-//	Class names for the tables
-$table-class-name:							tbl;								// Name for the table class
-$table-horizontal-name:						hor;								// Name for the horizontal style tables
-$table-bordered-name:						bor;								// Name for the bordered style tables
-//	Colors for the tables
-$table-head-bg-color:						lighten($body-bg-color,22%);		// Table header background color
-$table-head-color:							$body-color;						// Table header text color
-$table-body-bg-color:						lighten($body-bg-color,5%);			// Table body bakground color
-$table-body-alt-bg-color:					lighten($body-bg-color,10%);		// Table body alternative background color
-$table-body-color:							darken($body-color,8%);				// Table body text color
-//	Enable tables (_table.scss). (Use individual mixins below to use.)
-@import '../scss/mini/table';
-// Use table mixin to create table with given specs. For more information
-// refer to the _table.scss file to check the definitions.
-@include make-tbl($table-class-name, 1px solid #304251, 0, 0.5em, $table-head-bg-color, $table-head-color, $table-body-bg-color,$table-body-alt-bg-color, $table-body-color, $table-horizontal-name, $table-bordered-name);
-//====================================================================
-//	Variable definitions for the Navigation module (_nav.scss)
-//====================================================================
-//	Class names for the navigation elements
-$navigation-class-name:						nav;								// Name for the navigation bar class
-$navigation-vertical-name:					vertical;							// Name for the vertical navigation class
-$navigation-fixed-name:						fixed;								// Name for the fixed navigation class
-$navigation-logo-name:						logo;								// Name for the navigation logo class
-$navigation-link-name:						link;								// Name for the navigation link class
-// 	Colors and breakpoint for the navigation
-$navigation-bg-color:						#243447;							// Background color for the navigation bar
-$navigation-color:							$body-color;						// Color for the navigation text
-$navigation-fixed-collapse-breakpoint:		768px;								// Breakpoint for fixed naviation collapse
-//	Enable navigation (_nav.scss). (Use individual mixins below to use.)
-@import '../scss/mini/nav';
-// Use nav mixin to create nav with default specs. For more information
-// refer to the _nav.scss file to check the definitions.
-@include make-nav($navigation-class-name, $navigation-vertical-name, $navigation-fixed-name, $navigation-logo-name, 135%, $navigation-link-name, 8px, $navigation-color, $navigation-bg-color, darken, 7.5%, not-allowed, .65, left, 12, 2, $navigation-fixed-collapse-breakpoint, top-right, 10px, 1.75em);
-//====================================================================
-//	Variable definitions for the Utilities and Helper Classes module (_utility.scss)
-//====================================================================
-//	Class names for the utility and helper classes (you can remove things you 
-//	don't need or define more if you need them).
-$thumbnail-class-name:						thumb;								// Name for the thumbnail class
-$bordered-class-name:						bordered;							// Name for the bordered class
-$bordered-radial-name:						rounded;							// Name for the rounded border class	
-$bordered-radial2-name:						circle;								// Name for the alternative rounded border class
-$colored-text1-name:						txt-blue;							// Name for the colored text style 1 class
-$colored-text2-name:						txt-green;							// Name for the colored text style 2 class
-$colored-text3-name:						txt-red;							// Name for the colored text style 3 class
-$colored-bg-text1-name:						bg-blue;							// Name for the colored background text style 1 class
-$colored-bg-text2-name:						bg-green;							// Name for the colored background text style 2 class
-$colored-bg-text3-name:						bg-red;								// Name for the colored background text style 3 class
-$drag-left-name:							drg-left;							// Name for the drag-left class
-$drag-right-name:							drg-right;							// Name for the drag-right class
-$center-block-name:							ct-block;							// Name for the center block class
-$caret-class-name:							caret;								// Name for the caret class
-$close-class-name:							close;								// Name for the close class
-$clearfix-class-name:						cf;									// Name for the clearfix class
-$hidden-class-name:							hidden;								// Name for the hidden class
-//	Colors for the utility and helper classes (you can remove things you
-//	don't need or define more colors if you need them).
-$thumbnail-hover-color:						$a-color;							// Border color of the thumbnail when hovering over it
-$bordered-radial-radius:					4px;								// Border radius of rounded borders
-$bordered-radial2-radius:					50%;								// Border radius of the alternative rounded borders
-$colored-text1-color:						$btn-b-bg-color;					// Text color for the colored text style 1 class
-$colored-text2-color:						$btn-g-bg-color;					// Text color for the colored text style 2 class
-$colored-text3-color:						$btn-r-bg-color;					// Text color for the colored text style 3 class
-$colored-bg-text1-bg-color:					$btn-b-bg-color;					// Background color for the colored text style 1 class
-$colored-bg-text2-bg-color:					$btn-g-bg-color;					// Background color for the colored text style 2 class
-$colored-bg-text3-bg-color:					$btn-r-bg-color;					// Background color for the colored text style 3 class
-//	Enable utilities (_utility.scss). (Use individual mixins below to use.)
-@import '../scss/mini/utility';
-// Use utility mixins to create utility classes with given specs. For more information
-// refer to the _utility.scss file to check the definitions.
-@include make-thumb($thumbnail-class-name, 0.25em, 1px solid #304251, 4px, $thumbnail-hover-color);
-@include make-border-generic($bordered-class-name);
-@include make-border-radial-style($bordered-radial-name, $bordered-radial-radius);
-@include make-border-radial-style($bordered-radial2-name, $bordered-radial2-radius);
-@include make-colored-text($colored-text1-name, $colored-text1-color);
-@include make-colored-text($colored-text2-name, $colored-text2-color);
-@include make-colored-text($colored-text3-name, $colored-text3-color);
-@include make-colored-bg-text($colored-bg-text1-name, $colored-bg-text1-bg-color);
-@include make-colored-bg-text($colored-bg-text2-name, $colored-bg-text2-bg-color);
-@include make-colored-bg-text($colored-bg-text3-name, $colored-bg-text3-bg-color);
-@include make-caret-down($caret-class-name, 0.35em, #aaa);
-@include make-close($close-class-name, #aaa, pointer, 1.3em, 700, #777);
-@include make-drags($drag-left-name, $drag-right-name);
-@include make-center-block($center-block-name);
-@include make-clearfix($clearfix-class-name);
-@include make-hidden($hidden-class-name);
-//====================================================================
-//
-//		EXTRA COMPONENTS (located in `mini-extra`):
-//
-//====================================================================
-//	Variable definitions for the Label module (_label.scss)
-//====================================================================
-// 	Colors and styles (you can remove things you don't need or define more
-//	colors if you need them).
-$lbl-default-color:							$btn-alt-color;						// Default text color for labels/badges
-$lbl-default-bg-color:						lighten($btn-default-bg-color,5%);	// Default background color for labels/badges
-$lbl-b-bg-color:							$btn-b-bg-color;					// Color for labels/badges style 1
-$lbl-g-bg-color:							$btn-g-bg-color;					// Color for labels/badges style 2
-$lbl-r-bg-color:							$btn-r-bg-color;					// Color for labels/badges style 3
-//	Label class names (you can remove things you don't need or define more
-//	classes if you need them).
-$lbl-class-name:							lbl;								// Name for the base labels class
-$lbl-style1-name:							'blue';								// Name for labels/badges style 1 class
-$lbl-style2-name:							'green';							// Name for labels/badges style 2 class
-$lbl-style3-name:							'red';								// Name for labels/badges style 3 class
-$badge-class-name:							bdg;								// Name for the base badges class
-//	Enable labels (_label.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/label';
-// Use label mixins to create labels with given specs. For more information
-// refer to the _label.scss file to check the definitions.
-@include make-lbl($lbl-class-name, $lbl-default-bg-color, $lbl-default-color, 4px, 6px 10px, hide);
-@include make-lbl-style($lbl-class-name, $lbl-style1-name, $lbl-default-color, $lbl-b-bg-color);
-@include make-lbl-style($lbl-class-name, $lbl-style2-name, $lbl-default-color, $lbl-g-bg-color);
-@include make-lbl-style($lbl-class-name, $lbl-style3-name, $lbl-default-color, $lbl-r-bg-color);
-@include make-lbl($badge-class-name, $lbl-default-bg-color, $lbl-default-color, 8px, 3px 8px, hide);
-@include make-lbl-style($badge-class-name, $lbl-style1-name, $lbl-default-color, $lbl-b-bg-color);
-@include make-lbl-style($badge-class-name, $lbl-style2-name, $lbl-default-color, $lbl-g-bg-color);
-@include make-lbl-style($badge-class-name, $lbl-style3-name, $lbl-default-color, $lbl-r-bg-color);
-//====================================================================
-//	Variable definitions for the Tab module (_tab.scss)
-//====================================================================
-//	Tab class names.
-$tabs-class-name:							tabs;								// Name for the tab system container class
-// 	Colors and styles (you can remove things you don't need or define more
-//	colors if you need them).
-$tabs-border-color:							#304251;							// Border color for the tabs system
-$tabs-content-bg-color:						lighten($body-bg-color,5%);			// Background for the active tab's content
-$tabs-color:								$a-color;							// Color for the text in the tab labels
-$tabs-bg-color:								$body-bg-color;						// Background color for the tab labels
-$tabs-active-color:							$body-color;						// Color for the text in the active tab's label
-$tabs-active-bg-color:						$tabs-content-bg-color;				// Background color for the active tab's label
-$tabs-active-stripe-style:					3px solid $a-color;					// Style for the active tab label's stripe
-//	Enable tabs (_tab.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/tab';
-// Use tabs mixin to create tab system with given specs. For more information
-// refer to the _tab.scss file to check the definitions.
-@include make-tabs($tabs-class-name, 250px, 3px, 40px, 8px 14px, $tabs-color, $tabs-bg-color, $tabs-active-color, $tabs-active-bg-color, $tabs-border-color, 4px 4px 0 0, $tabs-active-stripe-style, 'darken', 10%, $tabs-content-bg-color, 20px);
-//====================================================================
-//	Variable definitions for the Modal module (_modal.scss)
-//====================================================================
-//	Modal class names.
-$modal-class-name:							modal;								// Name for the modal class
-// 	Colors and styles (you can remove things you don't need or define more
-//	colors if you need them).
-$modal-bg-color:							$body-bg-color;						// Background color for the modal
-$modal-color:								$body-color;						// Color for the text in the modal
-$modal-border:								1px solid #304251;					// Border style for the modal
-//	Enable modal (_modal.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/modal';
-// Use modal mixin to create modal with given specs. For more information
-// refer to the _modal.scss file to check the definitions.
-@include make-modal($modal-class-name, $modal-color, $modal-bg-color, 'enabled', 'enabled', $modal-border, 4px, 18px, 8.5%, 45%);
-@include make-modal-close-support($modal-class-name, $close-class-name, 20px);
-//====================================================================
-//	Variable definitions for the Dropdown module (_dropdown.scss)
-//====================================================================
-//	Dropdown class names.
-$dropdown-class-name:						dropdown;							// Name for the dropdown class
-//	Enable dropdown (_dropdown.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/dropdown';
-// Use dropdown mixin to create dropdown with given specs. For more information
-// refer to the _dropdown.scss file to check the definitions.
-@include make-dropdown($navigation-class-name, $navigation-link-name,$dropdown-class-name, 20px, 0.8em);
-//====================================================================
-//	Variable definitions for the Collapse module (_collapse.scss)
-//====================================================================
-//	Collapse and accordion class names.
-$collapse-class-name:						clps;								// Name for the collapse class
-$accordion-class-name:						acrd;								// Name for the accordion class
-// 	Collapse colors and styles (you can remove things you don't need or 
-//	define more colors if you need them).
-$collapse-border:							1px solid #304251;					// Border style for the collapse
-$collapse-color:							$body-color;						// Color for the text in the collapse
-$collapse-bg-color:							lighten($body-bg-color,10%);			// Background color for the collapse
-// 	Accordion colors and styles (you can remove things you don't need or 
-//	define more colors if you need them).
-$accordion-border:							$collapse-border;					// Border style for the accordion
-$accordion-color:							$collapse-color;					// Color for the text in the accordion
-$accordion-bg-color:						$body-bg-color;						// Background color for the accordion
-$accordion-label-color:						$collapse-color;					// Color for the text in the accordion's label
-$accordion-label-bg-color:					$collapse-bg-color;					// Background color for the accordion's label
-//	Enable collapse (_collapse.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/collapse';
-// Use collapse and accordion mixins to create components wit the given specs.
-// For more information refer to the _collapse.scss file to check the definitions.
-@include make-collapse($collapse-class-name, $collapse-border, 4px, 10px, 5px, $collapse-color, $collapse-bg-color);
-@include make-accordion($accordion-class-name, $accordion-border, 4px, 10px, 5px, $accordion-color, $accordion-bg-color, $accordion-label-color, $accordion-label-bg-color, 8px, 'darken', 7.5%);
-//====================================================================
-//	Variable definitions for the Progress module (_progress.scss)
-//====================================================================
-//	Progress and progress variants class names.
-$progress-class-name:						prg;								// Name for the progress class
-$progress-bar-style1-name:					'green';							// Name for the progress bar style 1 class
-$progress-bar-style2-name:					'red';								// Name for the progress bar style 2 class
-// Progress and progress variants colors (you can remove things you 
-//	don't need or define more colors if you need them).
-$progress-bg-color:							#d7d7d7;							// Background color for the progress bar container
-$progress-bar-color:						$btn-alt-color;						// Color for the text of the progress bar
-$progress-bar-style1-color:					$btn-alt-color;						// Color for the text of the style 1 progress bar
-$progress-bar-style2-color:					$btn-alt-color;						// Color for the text of the style 2 progress bar
-$progress-bar-bg-color:						$btn-b-bg-color;					// Background color for the progress bar
-$progress-bar-style1-bg-color:				$btn-g-bg-color;					// Background color for the style 1 progress bar
-$progress-bar-style2-bg-color:				$btn-r-bg-color;					// Background color for the style 2 progress bar
-//	Enable progress (_progress.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/progress';
-// Use progress mixins to create progress bars with given specs. For more 
-// information refer to the _progress.scss file to check the definitions.
-@include make-progress($progress-class-name, 20px, 4px, $progress-bg-color, 0.8em, $progress-bar-color, $progress-bar-bg-color);
-@include make-progress-bar-variant($progress-class-name, $progress-bar-style1-name, $progress-bar-style1-color, $progress-bar-style1-bg-color);
-@include make-progress-bar-variant($progress-class-name, $progress-bar-style2-name, $progress-bar-style2-color, $progress-bar-style2-bg-color);
-//====================================================================
-//	Variable definitions for the Spinner module (spinner.scss)
-//====================================================================
-//	Spinner class names.
-$spinner-dotted-name:						spinner-dots;						// Name for the dotted spinner class
-$spinner-round-name:						spinner-round;						// Name for the round spinner class
-// Spinner colors.
-$spinner-round-doughnout:					0.4em solid rgba(245,245,245, 0.2);	// Style for the round spinner doughnut
-$spinner-round-spin:						0.4em solid #f5f5f5;				// Style for the round spinner spinning part
-//	Enable progress (spinner.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/spinner';
-// Use spinner mixins to create spinners with given specs. For more 
-// information refer to the spinner.scss file to check the definitions.
-@include make-spinner-dots($spinner-dotted-name, 1.5em, 1.5s);
-@include make-spinner-round($spinner-round-name, 1.5em, $spinner-round-doughnout, $spinner-round-spin, 1.5s);
-//====================================================================
-//	Variable definitions for the Carousel module (_carousel.scss)
-//====================================================================
-//	Carousel class names.
-$carousel-class-name:						carousel;						// Name for the carousel class
-// Carousel colors and styles.
-$carousel-border:							1px solid #304251;				// Border style for the carousel
-$carousel-content-bg-color:					lighten($body-bg-color,80%);	// Background color for the carousel
-$carousel-description-color:				$body-color;					// Color for the text in the carousel's description
-$carousel-description-bg-color:				$body-bg-color;					// Background color for the carousel's description
-$carousel-control-color:					$body-color;					// Color for the carousel's control elements
-//	Enable carousel (_carousel.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/carousel';
-// Use carousel mixin to create carousel with given specs. For more 
-// information refer to the _carousel.scss file to check the definitions.
-@include make-carousel($carousel-class-name, 80%, 500px, $carousel-border, 4px, $carousel-content-bg-color, 10px, $carousel-description-color, $carousel-description-bg-color, 340px, 160px, 450px, 1.8em, $carousel-control-color);
-//====================================================================
-//	Variable definitions for the Utility module (_utility.scss)
-//====================================================================
-//	Utility class names.
-$breadcrumbs-class-name:					brdcrmb;						// Name for the breadcrumbs class
-$well-class-name:							well;							// Name for the well class
-$alert-style1-class:						alert-blue;						// Name for the style 1 alert
-$alert-style2-class:						alert-green;					// Name for the style 2 alert
-$alert-style3-class:						alert-red;						// Name for the style 3 alert
-$panel-class-name:							panel;							// Name for the panel class
-$panel-header-name:							head;							// Name for the panel's header class
-$button-states-class-name:					stateful;						// Name for the stateful button class
-$button-group-class-name:					btn-grp;						// Name for the button group class
-$popover-above-name:						popover-top;					// Name for the popover above class
-$popover-below-name:						popover-bottom;					// Name for the popover below class
-// 	Utility color variables and styles (you can remove things you 
-//	don't need or define more colors if you need them).
-$well-color:								$body-color;					// Text color for the well
-$well-bg-color:								lighten($body-bg-color,10%);						// Background color for the well
-$panel-color:								$body-color;					// Text color for the panel
-$panel-bg-color:							$body-bg-color;					// Background color for the panel
-$panel-header-color:						$body-color;					// Text color for the panel's header
-$panel-header-bg-color:						lighten($body-bg-color,10%);	// Background color for the panel's header
-$popover-color:								$body-bg-color;					// Text color for the popover
-$popover-bg-color:							$body-color;					// Background color for the popover
-//	Enable utilities (_utility.scss). (Use individual mixins below to use.)
-@import '../scss/mini-extra/utility';
-// Use utilities mixins to create utilities with given specs. For more 
-// information refer to the _utility.scss file to check the definitions.
-@include make-breadcrumbs($breadcrumbs-class-name);
-@include make-generic-container($well-class-name, $well-color, $well-bg-color, 1px solid #304251, 4px, 20px);
-@include make-alert($alert-style1-class, darken($btn-b-bg-color,20%), lighten($btn-b-bg-color, 10%) , 1px solid darken($btn-b-bg-color, 10%), 4px, 20px, close);
-@include make-alert($alert-style2-class, darken($btn-g-bg-color,20%), lighten($btn-g-bg-color, 10%) , 1px solid darken($btn-g-bg-color, 10%), 4px, 20px, close);
-@include make-alert($alert-style3-class, darken($btn-r-bg-color,20%), lighten($btn-r-bg-color, 10%) , 1px solid darken($btn-r-bg-color, 10%), 4px, 20px, close);
-@include make-panel(panel, $panel-color, $panel-bg-color, 1px solid #304251, 4px, 10px, $panel-header-name, $panel-header-color, $panel-header-bg-color, 10px);
-@include make-popover($popover-above-name, top, 5px, 45px, $popover-color, $popover-bg-color, 7px 10px);
-@include make-popover($popover-below-name, bottom, 4px, 45px, $popover-color, $popover-bg-color, 7px 10px);
-// Use experimental utilities mixins to create utilities with given
-// specs. Please exercise caution when using these mixins.
-//@include make-button-states($button-states-class-name);	// This mixin is unstable and buggy, we suggest you disable it.
-// The folowing mixin is considered stable, you can disable it if you need to.
-@include make-btn-group($button-group-class-name, $btn-class-name, 1px solid #304251, 4px); 
-@include make-btn-group(btn-grp, $btn-class-name+'.'+$btn-style1-name, 1px solid darken($btn-b-bg-color, 10%), 4px); 
-@include make-btn-group(btn-grp, $btn-class-name+'.'+$btn-style2-name, 1px solid darken($btn-g-bg-color, 10%), 4px); 
-@include make-btn-group(btn-grp, $btn-class-name+'.'+$btn-style3-name, 1px solid 1px solid darken($btn-r-bg-color, 10%), 4px); 
-//====================================================================
-//====================================================================
\ No newline at end of file
diff --git a/scss/mini-extra/_carousel.scss b/scss/mini-extra/_carousel.scss
deleted file mode 100644
index ad8c355..0000000
--- a/scss/mini-extra/_carousel.scss
+++ /dev/null
@@ -1,92 +0,0 @@
-/*
-	Mixin for the carousel component. 
-	Parameters:
-	- $carousel-name                 :	The class name for the carousel.
-	- $carousel-width                :	The width of the carousel. [1]
-	- $carousel-height               :	The height of the carousel.
-	- $carousel-border               :	The style of the carousel's border.
-	- $carousel-border-radius        :	The border-radius of the carousel.
-	- $carousel-container-bg-color   :	The background color of the carousel.
-	- $carousel-content-padding      :	The padding of the carousel's contents. [2]
-	- $carousel-description-color    :	The text color of the carousel's description.
-	- $carousel-description-bg-color :	The background color of the carousel's description.
-	- $carousel-description-top      :	The distance of the carousel's description from the top of the container. [3]
-	- $carousel-description-height   :	The height of the carousel's description area. [3]
-	- $carousel-control-top          :	The distance of the carousel's controls from the top of the container. [3]
-	- $carousel-control-font-size    :	The font-size of the carousel's controls.
-	- $carousel-control-color        :	The text color of the carousel's controls.
-	Notes:
-	- [1] : The height of the carousel is suggested to be defined as a percentage so that
-		it makes it responsive for smaller screens.
-	- [2] : The value of $carousel-content-padding only applies to images inside the carousel.
-	- [3] : The distances from the top are used for positioning the elements. The height of the
-		desccription should normally be the height of the container minus the top distance of
-		the description. Control distance should be about 90% of the container's height.
-*/
-@mixin make-carousel(	$carousel-name, $carousel-width, $carousel-height, $carousel-border, 
-						$carousel-border-radius, $carousel-container-bg-color, $carousel-content-padding,
-						$carousel-description-color, $carousel-description-bg-color, 
-						$carousel-description-top, $carousel-description-height, $carousel-control-top,
-						$carousel-control-font-size, $carousel-control-color								){
-	.#{$carousel-name}{
-		position: relative;
-		width: $carousel-width;
-		height: $carousel-height;
-		overflow: hidden;
-		text-align: center;
-		margin: auto;
-		border: $carousel-border;
-		border-radius: $carousel-border-radius;
-		& input[type="radio"]{
-			display: none;
-			& + div{
-				display: none;
-				position: absolute;
-				width: 100%;
-				height: 100%;
-				left: 0;
-				top: 0;		
-				padding: $carousel-content-padding;
-				background-color: $carousel-container-bg-color;
-				& > img{
-					max-width: 100%;
-					max-height: 100%;
-					margin: auto;
-				}
-				& > div{
-					position: absolute;
-					width: 100%;
-					height: $carousel-description-height;
-					overflow: auto;
-					left: 0;
-					top: $carousel-description-top;
-					background-color: $carousel-description-bg-color;
-					color: $carousel-description-color;
-					opacity: 0.1;
-					&:hover, &:active, &:focus{
-						opacity: 0.8;
-					}
-				}
-				& + label{
-					position: relative;
-					z-index: 998;
-					cursor: pointer;
-					top: $carousel-control-top;
-					color: $carousel-control-color;		
-					font-size: $carousel-control-font-size;		
-					&:before{
-						content:'\25cb';
-					}
-				}
-			}		
-			&:checked + div{
-				display: block;
-				& + label{
-					&:before{
-						content:'\25cf';
-					}
-				}
-			}
-		}
-	}
-}
\ No newline at end of file
diff --git a/scss/mini-extra/_collapse.scss b/scss/mini-extra/_collapse.scss
deleted file mode 100644
index ee6d0e3..0000000
--- a/scss/mini-extra/_collapse.scss
+++ /dev/null
@@ -1,108 +0,0 @@
-/*
-	Mixin for collapse component. 
-	Parameters:
-	- $collapse-name          : The class name of the collapse component.
-	- $collapse-border        :	The border style of the collapse contents.
-	- $collapse-border-radius :	The border radius of the collapse contents.
-	- $collapse-padding       :	The padding of the collapse contents.
-	- $collapse-margin-top    : The margin above the collapse contents. [1]
-	- $collapse-color         : The collapse contents' text color.
-	- $collapse-bg-color      :	The collapse contents' background color.
-	Notes:
-	- [1] : The value of $collapse-margin-top is used for spacing between the button label that is usually
-		above the collapsed contents and the contents themselves.
-*/
-@mixin make-collapse(	$collapse-name, $collapse-border, $collapse-border-radius, $collapse-padding, 
-						$collapse-margin-top, $collapse-color, $collapse-bg-color						){
-	input[type="checkbox"]{
-		&.#{$collapse-name}{
-			display: none;
-			& + div{
-				display: none;
-				color: $collapse-color;
-				background-color: $collapse-bg-color;
-				padding: $collapse-padding;
-				margin-top: $collapse-margin-top;
-				border: $collapse-border;
-				border-radius: $collapse-border-radius;
-			}
-		}
-		&:checked.#{$collapse-name}{
-			& + div{
-				display: block;
-			}
-		}
-	}
-}
-/*
-	Mixin for accordion component. 
-	Parameters:
-	- $accordion-name                   :	The class name of the accordion component.
-	- $accordion-border                 :	The border style of the accordion component.
-	- $accordion-border-radius          :	The border radius of the accordion component. [1]
-	- $accordion-padding                :	The padding of the accordion's contents.
-	- $accordion-margin                 :	The margin between accordion's parts. [2]
-	- $accordion-color                  : 	The accordion contents' text color.
-	- $accordion-bg-color               :	The accordion contents' background color.
-	- $accordion-label-color            : 	The accordion labels' text color.
-	- $accordion-label-bg-color         :	The accordion labels' background color.
-	- $accordion-label-padding          :	The padding of the accordion's labels.
-	- $accordion-hover-style            :	Hover/active/focus style of the accordion's labels. [3]
-	- $accordion-hover-style-percentage :	Hover/active/focus style of the accordion's labels percentage modifier.
-	Notes:
-	- [1] : The value of $accordion-border-radius will be applied to labels along with their contents.
-		Closed labels will have the border-radius applied to all of their corners, while open labels will
-		change accordingly to combine their border with the shown contents.
-	- [2] : The value of $accordion-margin will be applied only to margin-bottom of all parts in order
-		to space them out evenly. This does not apply to label and related content margins.
-	- [3] : The values that $accordion-hover-style can take are `lighten` and `darken`. The inside condition only 
-		checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`.
-*/
-@mixin make-accordion(	$accordion-name, $accordion-border, $accordion-border-radius, $accordion-padding,
-						$accordion-margin, $accordion-color, $accordion-bg-color, $accordion-label-color,
-						$accordion-label-bg-color, $accordion-label-padding, $accordion-hover-style, 
-						$accordion-hover-style-percentage													){
-	input[type="radio"]{
-		&.#{$accordion-name}{
-			display: none;
-			& + label{
-				width: 100%;
-				display: block;
-				color: $accordion-label-color;
-				background-color: $accordion-label-bg-color;
-				padding: $accordion-label-padding;
-				margin-bottom: $accordion-margin;
-				border: $accordion-border;
-				border-radius: $accordion-border-radius;			
-				cursor: pointer;
-				&:hover, &:active, &:focus{
-					@if $accordion-hover-style == 'lighten'{
-    					background-color: lighten($accordion-label-bg-color, $accordion-hover-style-percentage);
-    				}
-    				@else{
-    					background-color: darken($accordion-label-bg-color, $accordion-hover-style-percentage);
-    				}
-  				}
-				& + div{
-					display: none;
-					color: $accordion-color;
-					background-color: $accordion-bg-color;
-					padding: $accordion-padding;
-					margin-top: -1px;
-					margin-bottom: $accordion-margin;
-					border: $accordion-border;
-					border-radius: 0 0 $accordion-border-radius $accordion-border-radius;
-				}
-			}
-		}
-		&:checked.#{$accordion-name}{
-			& + label{
-				border-radius: $accordion-border-radius $accordion-border-radius 0 0;
-				margin-bottom: 0;
-				& + div{
-					display: block;
-				}
-			}
-		}
-	}
-}
\ No newline at end of file
diff --git a/scss/mini-extra/_dropdown.scss b/scss/mini-extra/_dropdown.scss
deleted file mode 100644
index 6d60a53..0000000
--- a/scss/mini-extra/_dropdown.scss
+++ /dev/null
@@ -1,37 +0,0 @@
-/*
-	Mixin for navigation bar's dropdown element.
-	Parameters:
-	- $nav-name             :	The class name for the navigation bar. [1]
-	- $nav-link-name        :	The class name for the navigation links of the navigation bar. [1]
-	- $dropdown-name        :	The class name for the dropdown element. [2]
-	- $dropdown-left-margin :	The left margin of the dropdown element's contents. [3]
-	- $dropdown-font-size   :	The font size of the dropdown element's contents.
-	Notes:
-	- [1] : The values of $nav-name and $nav-link-name must match those specified in the navigation bar's
-		definition, otherwise the dropdown element will not work properly.
-	- [2] : The value of $dropdown-name is used in two distinct elements of the component, namely the
-		checkbox and the dropdown toggle.
-	- [3] : The value of $dropdown-left-margin will affect all open dropdown menus, as well as dropdown
-		menus on mobile screens. It is suggested that you set this value to something different than
-		0 to visually represent the menu hierarchy in devices with smaller screens.
-*/
-@mixin make-dropdown($nav-name, $nav-link-name, $dropdown-name, $dropdown-left-margin, $dropdown-font-size){
-	.#{$nav-name}{
-		& .#{$nav-link-name}.#{$dropdown-name}{
-			cursor: pointer;
-		}
-		& input[type="checkbox"], & input[type="radio"]{
-			display: none;
-			&.#{$dropdown-name} + div{
-				display: none;
-			}
-			&:checked.#{$dropdown-name}{
-				+ div{
-					display: block;
-					font-size: $dropdown-font-size;
-					margin-left: $dropdown-left-margin;
-				}
-			}
-		}
-	}
-}
\ No newline at end of file
diff --git a/scss/mini-extra/_label.scss b/scss/mini-extra/_label.scss
deleted file mode 100644
index 1c18793..0000000
--- a/scss/mini-extra/_label.scss
+++ /dev/null
@@ -1,44 +0,0 @@
-/*
-	Mixin for the labels/badges.
-	Parameters:
-	- $lbl-name          :	The class name of the labels/badges.
-	- $lbl-bg-color      :	The background color of the labels/badges.
-	- $lbl-color         :	The text color of the labels/badges.
-	- $lbl-border-radius :	The border-radius of the labels/badges.
-	- $lbl-padding       :	The padding of the labels/badges.
-	- $lbl-hide-on-empty :	Style of the label/badges when empty. [1]
-	Notes:
-	- [1] : The values that $lbl-hide-on-empty can take are `hide` or `show`. The inside condition only 
-		checks if the value is `hide` and acts accordingly. Invalid values are treated as `show`.
-*/
-@mixin make-lbl($lbl-name, $lbl-bg-color, $lbl-color, $lbl-border-radius, $lbl-padding, $lbl-hide-on-empty){
-	.#{$lbl-name}{
-		display: inline-block;
-		padding: $lbl-padding;
-		color: $lbl-color;
-		background-color: $lbl-bg-color;
-		border-radius: $lbl-border-radius;
-		@if $lbl-hide-on-empty == 'hide'{
-			&:empty{
-				display: none;
-			}
-		}
-	}
-}
-/*
-	Mixin for labels/badges styles. 
-	Parameters:
-	- $lbl-name                         : The class name of the labels/badges. [1]
-	- $lbl-style-name                   : The class name of the labels/badges style.
-	- $lbl-style-color                  : The text color of the labels/badges style.
-	- $lbl-style-bg-color               : The background color of the labels/badges style.
-	Notes:
-	- [1] : The value of $lbl-name must be the same as the value specified when using `make-lbl`, otherwise
-		the specified style will not work correctly.
-*/
-@mixin make-lbl-style($lbl-name, $lbl-style-name, $lbl-style-color, $lbl-style-bg-color){
-	.#{$lbl-name}.#{$lbl-style-name}{
-		color: $lbl-style-color;
-		background-color: $lbl-style-bg-color;
-	}
-}
\ No newline at end of file
diff --git a/scss/mini-extra/_modal.scss b/scss/mini-extra/_modal.scss
deleted file mode 100644
index 38a42be..0000000
--- a/scss/mini-extra/_modal.scss
+++ /dev/null
@@ -1,85 +0,0 @@
-/*
-	Mixin for modal dialogs.
-	Parameters:
-	- $modal-name               :	The class name for the modal dialog.
-	- $modal-color              :	The text color of the modal dialog.
-	- $modal-bg-color           :	The background color of the modal dialog.
-	- $modal-transition-enabled :	Determines if a transition style will be applied when the modal changes states. [1]
-	- $modal-shadow-enabled     :	Determines if a shadow should be cast from the modal dialog. [1]
-	- $modal-border             :	The border style of the modal dialog.
-	- $modal-border-radius      :	The border radius of the modal dialog's border.
-	- $modal-padding            :	The padding of the modal dialog's contents.
-	- $modal-top-margin         :	The distance of the modal dialog from the top of the parent container. [2]
-	- $modal-width              :	The width of the modal dialog. [2]
-	Notes:
-	- [1] : The values of $modal-transition-enabled and $modal-shadow-enabled should be `enabled` or `disabled`.
-		If an invalid value is supplied, the mixin will act as if it was `disabled`.
-	- [2] : The values of $modal-top-margin and $modal-width should be in percentage (%) values to properly scale
-		on all devices. However, there are no restrictions.
-*/
-@mixin make-modal(	$modal-name, $modal-color, $modal-bg-color, $modal-transition-enabled, 
-					$modal-shadow-enabled, $modal-border, $modal-border-radius, 
-					$modal-padding, $modal-top-margin, $modal-width							){
-	.#{$modal-name}{
-		display: none;
-		& + div{
-			z-index: 997;
-			position: fixed;
-			width: 100%;
-    		height: 0;
-    		opacity: 0;
-    		display: none;
-    		@if $modal-transition-enabled == 'enabled'{
-    			transition: opacity .3s ease-out;
-    		}
-			& > div{
-				z-index: 998;
-				position: relative;
-				width: $modal-width;
-				color: $modal-color;
-				background-color: $modal-bg-color;		
-				margin: $modal-top-margin auto 0;			
-				padding: $modal-padding;
-				border: $modal-border;
-				border-radius: $modal-border-radius;
-				@if $modal-shadow-enabled == 'enabled'{
-    				box-shadow: 0 5px 15px rgba(0,0,0,.5);
-    			}			
-			}
-		}
-		&:checked + div{
-			height: 100%;
-			opacity: 1;	
-			display: block;	
-			& > label{
-				background-color: rgba(0,0,0,.35);					
-				position: fixed;
-				width: 100%;
-    			height: 100%;
-    			top: 0;
-			}
-		}
-	}
-}
-/*
-	Mixin for close button support inside of modal dialogs.
-	Parameters:
-	- $modal-name    :	The class name for the modal dialog. [1]
-	- $close-name    :	The class name for the close sign utility class. [2]
-	- $modal-padding :	The padding of the close button. [3]
-	Notes:
-	- [1] : The value of $modal-name should match the value specified in the modal dialog's
-		mixin, in order for this to work correctly.
-	- [2] : The value of $close-name should match the value specified in the close sign utility's
-		mixin, in order for this to work correctly.
-	- [3] : The close button will be placed at the top right of the modal dialog. Its padding
-		should be similar to the value specified for padding in the modal dialog itself, however
-		it could vary based on personal preference.
-*/
-@mixin make-modal-close-support($modal-name, $close-name, $modal-padding){
-	.#{$modal-name} + div > div .#{$close-name}{
-		position: absolute;
-		top: $modal-padding;
-		right: $modal-padding;
-	}
-}
\ No newline at end of file
diff --git a/scss/mini-extra/_progress.scss b/scss/mini-extra/_progress.scss
deleted file mode 100644
index bd8c03b..0000000
--- a/scss/mini-extra/_progress.scss
+++ /dev/null
@@ -1,53 +0,0 @@
-/*
-	Mixin for the progress element. 
-	Parameters:
-	- $progress-name          : The class name of the progress wrapper.
-	- $progress-height        :	The height of the progress wrapper.
-	- $progress-border-radius :	The border radius of the progress wrapper.
-	- $progress-bg-color      :	The background color of the progress wrapper. [1]
-	- $progress-font-size     : The font size of the progress bar's text (if any).
-	- $progress-bar-color     : The progress bar's text color.
-	- $progress-bar-bg-color  :	The progress bar's background color.
-	Notes:
-	- [1] : The background color of the progress wrapper should be a different color than the
-		page's background to make sure that it is visible. 
-	- [2] : This only creates a basic progress style. For more progress bar styles use `make-progress-bar-variant`.
-*/
-@mixin make-progress(	$progress-name, $progress-height, $progress-border-radius, $progress-bg-color,
-						$progress-font-size, $progress-bar-color, $progress-bar-bg-color				){
-	.#{$progress-name}{
-		position: relative;
-		overflow: hidden;
-		height: $progress-height;
-		background-color: $progress-bg-color;
-		border-radius: $progress-border-radius;
-		& > span{
-			float: left;
-			width: 0;
-			height: 100%;
-			color: $progress-bar-color;
-			background-color: $progress-bar-bg-color;
-			text-align: center;
-			font-size: $progress-font-size;
-		}
-	}
-}
-/*
-	Mixin for progress bar styles. 
-	Parameters:
-	- $progress-name                : 	The class name of the progress wrapper. [1]
-	- $progress-bar-variant-name    :	The class name of the progress bar variant.
-	- $progress-bar-variant-color   :	The progress bar variant's text color.
-	- $progress-bar-variant-bg-coor :	The progress bar variant's background color.
-	Notes:
-	- [1] : The name of $progress-name should match the one specified in `make-progress` for the
-		progress bar variant to work correctly.
-	- [2] : This mixin should be used in combination with `make-progress` and is suggested that you 
-		use it after `make-progress`.
-*/
-@mixin make-progress-bar-variant($progress-name, $progress-bar-variant-name, $progress-bar-variant-color, $progress-bar-variant-bg-color){
-	.#{$progress-name} > span.#{$progress-bar-variant-name}{
-		color: $progress-bar-variant-color;
-		background-color: $progress-bar-variant-bg-color;
-	}
-}
\ No newline at end of file
diff --git a/scss/mini-extra/_spinner.scss b/scss/mini-extra/_spinner.scss
deleted file mode 100644
index b14fcef..0000000
--- a/scss/mini-extra/_spinner.scss
+++ /dev/null
@@ -1,56 +0,0 @@
-/*
-	Mixin for dotted spinner component. 
-	Parameters:
-	- $spinner-dots-name           :	The class name of the dotted spinner component.
-	- $spinner-dots-height         :	The height of the dotted spinner component. [1][2]
-	- $spinner-dots-animation-time :	The animation time of the dotted spinner component.
-	Notes:
-	- [1] : The value of $spinner-dots-height can be specified in `em`, `px` etc. but it is
-		suggested that you specify it in the same measurement as the text base.
-	- [2] : The value of $spinner-dots-height will be used for both the size of the component
-		and the animation. Some tweaking might be required.
-*/
-@mixin make-spinner-dots($spinner-dots-name, $spinner-dots-height, $spinner-dots-animation-time){
-	.#{$spinner-dots-name}{
-		display: inline-block;
-		overflow: hidden;
-		height: $spinner-dots-height;
-		vertical-align: bottom;
-		&:after{
-			display: inline-table;
-			white-space: pre;
-			content: "\A.\A..\A...";
-			animation: spin-dots $spinner-dots-animation-time steps(4) infinite;
-		}
-	}
-	@keyframes spin-dots { to {transform: translateY(-$spinner-dots-height*4);} }
-}
-/*
-	Mixin for dotted spinner component. 
-	Parameters:
-	- $spinner-round-name           :	The class name of the round spinner component.
-	- $spinner-round-size           :	The size of the round spinner component. [1]
-	- $spinner-round-doughnut-style :	The doughnut style of the round spinner component. [2]
-	- $spinner-round-spin-style     :	The spinning part style of the round spinner component. [2]
-	- $spinner-round-animation-time :	The animation time of the round spinner component.
-	Notes:
-	- [1] : The value of $spinner-round-size affects both height and width of the component.
-	- [2] : The values of $spinner-round-doughnut-style and $spinner-round-spin-style are styles
-		specified in border style format.
-*/
-@mixin make-spinner-round(	$spinner-round-name, $spinner-round-size, $spinner-round-doughnut-style, 
-							$spinner-round-spin-style, $spinner-round-animation-time				){
-	.#{$spinner-round-name}{
-			display: inline-block;
-			border: $spinner-round-doughnut-style;
-		  	border-left: $spinner-round-spin-style;
-		  	transform: translateZ(0);
-		  	animation: spin-round $spinner-round-animation-time infinite linear;
-		  	&,&:after{
-		  		border-radius: 50%;
-  				width: $spinner-round-size;
-  				height: $spinner-round-size;
-		  	}
-	}
-	@keyframes spin-round { 0% {transform: rotate(0deg);}	100% {transform: rotate(360deg);} }
-}
\ No newline at end of file
diff --git a/scss/mini-extra/_tab.scss b/scss/mini-extra/_tab.scss
deleted file mode 100644
index 4dcb009..0000000
--- a/scss/mini-extra/_tab.scss
+++ /dev/null
@@ -1,85 +0,0 @@
-/*
-	Mixin for tab system.
-	Parameters:
-	- $tabs-name                                  :	The class name for the tab system's container.
-	- $tabs-label-spacing                         :	The spacing between tab labels.
-	- $tabs-label-height                          : The height of the tab labels.
-	- $tabs-label-padding                         :	The padding of the tab labels.
-	- $tabs-label-color                           :	The text color of the tab labels.
-	- $tabs-label-bg-color                        : The background color of the tab labels.
-	- $tabs-active-label-color                    : The text color of the active tab's label.
-	- $tabs-active-label-bg-color                 :	The background color of the active tab's label.
-	- $tabs-border-color                          :	Border color for the tab system. [1]
-	- $tabs-label-border-radius                   : Border radius for the tab labels.
-	- $tabs-active-label-stripe                   : The style of the colored stripe that appears on the active tab's label. [2]
-	- $tabs-inactive-label-hover-style            :	Hover/active/focus style of the tab labels. [3]
-	- $tabs-inactive-label-hover-style-percentage :	Hover/active/focus style of the tab labels percentage modifier.
-	- $tabs-content-bg-color                      : The background color of the active tab's content.
-	- $tabs-content-padding                       :	The padding of the active tab's content.
-	Notes:
-	- [1] : The color specified in $tabs-border-color applies to all borders in the tab system. This
-		includes borders in the tab labels and active tab's content.
-	- [2] : The style of the colored stripe is a border style so you should specify it as such.
-	- [3] : The values that $tabs-hover-style can take are `lighten` and `darken`. The inside condition only 
-		checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`.
-*/
-@mixin make-tabs(	$tabs-name, $tabs-min-height, $tabs-label-spacing, $tabs-label-height,
-					$tabs-label-padding,  $tabs-label-color, $tabs-label-bg-color,
-					$tabs-active-label-color, $tabs-active-label-bg-color,
-					$tabs-border-color, $tabs-label-border-radius, $tabs-active-label-stripe,
-					$tabs-inactive-label-hover-style, $tabs-inactive-label-hover-style-percentage,
-					$tabs-content-bg-color, $tabs-content-padding									){
-	.#{$tabs-name}{
-		position: relative;
-		min-height: $tabs-min-height;
-		width: 100%;
-		& input[type="radio"]{
-			display: none;
-			& + div{
-				display: inline;
-				& > label{
-					position: reative;
-					float: left;
-					margin-right: $tabs-label-spacing;
-					left: 1px;
-					height: $tabs-label-height;
-					padding: $tabs-label-padding;
-					color: $tabs-label-color;
-					background-color: $tabs-label-bg-color;
-					border: 1px solid $tabs-border-color;
-					border-radius: $tabs-label-border-radius;	
-					cursor: pointer;
-					&:hover, &:active, &:focus{
-						@if $tabs-inactive-label-hover-style == 'lighten'{
-							background: lighten($tabs-label-bg-color, $tabs-inactive-label-hover-style-percentage);
-						}
-						@else{
-							background: darken($tabs-label-bg-color, $tabs-inactive-label-hover-style-percentage);
-						}
-					}
-					& + div{
-						position: absolute;
-						z-index: -2;
-						left: 0; 
-						top: ($tabs-label-height - 1px); 
-						bottom: 0; 
-						right: 0; 
-						padding: $tabs-content-padding; 
-						background: $tabs-content-bg-color; 			
-						border: 1px solid $tabs-border-color;					
-					}
-				}
-			}
-			&:checked + div > label{
-				color: $tabs-active-label-color; 
-				background: $tabs-active-label-bg-color; 
-				border-top: $tabs-active-label-stripe;
-				border-bottom: 1px solid $tabs-content-bg-color;
-				& + div{
-					position: absolute; 
-					z-index: -1; 
-				}
-			}
-		}
-	}
-}
\ No newline at end of file
diff --git a/scss/mini-extra/_utility.scss b/scss/mini-extra/_utility.scss
deleted file mode 100644
index d021e5e..0000000
--- a/scss/mini-extra/_utility.scss
+++ /dev/null
@@ -1,272 +0,0 @@
-/*
-	Mixin for breadcrumbs style.
-	Parameters:
-	- $breadcrumbs-name   :	The class name for the breadcrumbs style.
-	- $breadcrumbs-style :	The style of the breadcrumbs separator character. [1][2][3]
-	Notes:
-	- [1] : $breadcrumbs-style accepts the values 1, 2 or 3. If an invalid value is
-		supplied, it will be treated as 3.
-	- [2] : The three provided styles are as follows:
-	  - $breadcrumbs-style == 1 : forward slash.
-	  - $breadcrumbs-style == 2 : greater than symbol.
-	  - $breadcrumbs-style == 3 : right angle symbol (default).
-	- [3] : The value of $breadcrumbs-style can be omitted and will default to 3.
-*/
-@mixin make-breadcrumbs($breadcrumbs-name, $breadcrumbs-style: 3){
-	.#{$breadcrumbs-name}{
-		list-style: none;
-		& > li{
-			display: inline-block;
-			& + li:before{
-				@if $breadcrumbs-style == 1{
-					content: '\002f\00a0';
-				}
-				@else if $breadcrumbs-style == 2{
-					content: '\003e\00a0';
-				}
-				@else{
-					content: '\27e9\00a0';
-				}
-			}
-		}
-	}
-}
-/*
-	Mixin for generic container style.
-	Parameters:
-	- $container-name          : The class name for the generic container.
-	- $container-color         : The text color of the generic container.
-	- $container-bg-color      : The background color of the generic container.
-	- $container-border        : The border style of the generic container.
-	- $container-border-radius : The border-radius of the generic container.
-	- $container-padding       : The content badding of the generic container.
-	Notes:
-	- [1] : This mixin is also used for making alerts and panels.
-*/
-@mixin make-generic-container($container-name, $container-color, $container-bg-color, $container-border, $container-border-radius, $container-padding){
-	.#{$container-name}{
-		border: $container-border;
-		border-radius: $container-border-radius;
-		background-color: $container-bg-color;
-		color: $container-color;
-		padding: $container-padding;
-	}
-}
-/*
-	Mixin for generic alert style.
-	Parameters:
-	- $alert-name          : The class name for the alert.
-	- $alert-color         : The text color of the alert.
-	- $alert-bg-color      : The background color of the alert.
-	- $alert-border        : The border style of the alert.
-	- $alert-border-radius : The border-radius of the alert.
-	- $alert-padding       : The content badding of the alert.
-	- $close-name          : The class name for the close utility. [1]
-	Notes:
-	- [1] : The value of $close-name must match that of the class specified
-		for close elements for the alert to work correctly.
-	- [2] : This mixin uses `make-generic-container` to partially generate its
-		CSS.
-*/
-@mixin make-alert(	$alert-name, $alert-color, $alert-bg-color, $alert-border, 
-					$alert-border-radius, $alert-padding, $close-name			){
-	@include make-generic-container($alert-name+' + div', $alert-color, $alert-bg-color, $alert-border, $alert-border-radius, $alert-padding);
-	input[type="checkbox"].#{$alert-name}{
-		display: none;
-		& + div{
-			display: none;
-			position: relative;
-			& a{
-				font-weight: 700;
-				text-decoration: none;
-				color: darken($alert-color, 10%);
-				&:hover, &:active, &:focus{
-					text-decoration: underline;
-				}
-			}
-			& .#{$close-name}{
-				position: absolute;
-				top: $alert-padding;
-				right: $alert-padding;
-				color: $alert-color;
-				&:hover, &:active, &:focus{
-					color: darken($alert-color, 10%);
-				}
-			}
-		}
-	}
-	input[type="checkbox"]:checked.#{$alert-name} + div{
-		display: block;
-	}
-}
-/*
-	Mixin for generic panel style.
-	Parameters:
-	- $panel-name            : The class name for the panel.
-	- $panel-color           : The text color of the panel.
-	- $panel-bg-color        : The background color of the panel.
-	- $panel-border          : The border style of the panel.
-	- $panel-border-radius   : The border-radius of the panel.
-	- $panel-padding         : The content badding of the panel.
-	- $panel-header-name     : The class name for the panel's header.
-	- $panel-header-color    : The text color of the panel's header.
-	- $panel-header-bg-color : The background color of the panel's header.
-	- $panel-header-padding  : The padding of the panel's header.
-	Notes:
-	- [1] : This mixin uses `make-generic-container` to partially generate its
-		CSS.
-*/
-@mixin make-panel(	$panel-name, $panel-color, $panel-bg-color, $panel-border, 
-					$panel-border-radius, $panel-padding, $panel-header-name, 
-					$panel-header-color, $panel-header-bg-color, $panel-header-padding	){
-	@include make-generic-container($panel-name, $panel-color, $panel-bg-color, $panel-border, $panel-border-radius, 0);
-	.#{$panel-name}{
-		& > *{
-			padding: $panel-padding;
-		}
-		& .#{$panel-header-name}{
-			border: 0;
-			border-bottom: $panel-border;
-			color: $panel-header-color;
-			background-color: $panel-header-bg-color;
-			padding: $panel-header-padding;
-			margin: 0;
-		}
-	}
-}
-/*
-	Mixin for generic popover style.
-	Parameters:
-	- $popover-name          : The name for the popover style
-	- $popover-direction     : The direction of the popover. [1]
-	- $popover-border-radius : The border radius for the popover style.
-	- $popover-distance      : The distance for the popover style's placement. [2]
-	- $popover-color         : The text color of the popover style.
-	- $popover-bg-color      : The background color of the popover style.
-	- $popover-padding       : The padding of the popover.
-	Notes:
-	- [1] : The values that $popover-direction accepts are 'top' and 'bottom'. If an invalid value
-		is provided, it will be treated as 'bottom'.
-	- [2] : The value of $popover-distance should be treated as a general guideline for the popover
-		distance and is supposed to be tweaked with inline styles or helper classes for better use.
-*/
-@mixin make-popover(	$popover-name, $popover-direction, $popover-border-radius, 
-						$popover-distance, $popover-color, $popover-bg-color, $popover-padding	){
-	input[type="checkbox"]{
-		&.#{$popover-name}{
-			display:none;
-			+ label{
-				position: relative;
-			}
-			+ label > .#{$popover-name}{
-				position: absolute;
-				display: none;
-				background-color: $popover-bg-color;
-				color: $popover-color;
-				border-radius: $popover-border-radius;
-				padding: $popover-padding;
-				z-index: 998;
-				width: auto;
-				@if $popover-direction == 'top'
-				{
-					bottom: 49px;
-				}
-				@else{
-					top: 49px;
-				}				
-				&:before{
-					position: absolute;
-					display: block;
-					@if $popover-direction == 'top'
-					{
-						border-top: 7px solid $popover-bg-color;
-						border-right: 7px solid transparent;
-						border-left: 7px solid transparent;
-						bottom: -7px;
-					}
-					@else{
-						border-bottom: 7px solid $popover-bg-color;
-						border-right: 7px solid transparent;
-						border-left: 7px solid transparent;
-						top: -7px;
-					}	
-					content: '';				
-					left: 50%;
-    				margin-left: -7px;			
-				}
-			}
-		}
-		&:checked.#{$popover-name}{
-			+ label > .#{$popover-name}{
-				display: block;
-			}
-		}
-	}
-}
-//====================================================================
-//	THE MIXINS SPECIFIED BELOW ARE EXPERIMENTAL AND MIGHT NOT BEHAVE
-//	AS DOCUMENTED. EXERCISE CAUTION IF YOU USE THEM!
-//====================================================================
-/*
-	Mixin for generic button states.
-	Parameters:
-	- $button-states-name :	The class name of the stateful button.
-	Notes:
-	- [1] : This mixin is experimental, it might be buggy.
-*/
-@mixin make-button-states($button-states-name){
-	input[type="checkbox"]{
-		&.#{$button-states-name}{
-			display: none;
-			& + label{
-				display: block;
-				& + label{
-					display: none;
-				}
-			}
-		}
-		&:checked{
-			& + label{
-				display: none;
-				& + label{
-					display: block;
-				}
-			}
-		}
-	}
-}
-/*
-	Mixin for generic button groups.
-	Parameters:
-	- $btn-group-name          :	The class name of the button group.
-	- $btn-name                :	The name of the button class. [1][2]
-	- $btn-group-border        :	The border style of the button group.
-	- $btn-group-border-radius :	The border radius at the edges of the button group.
-	Notes:
-	- [1] :	The value of $btn-name must match that of the generic button class.
-	- [2] : The value of $btn-name can be hacked to allow for button variants to be styled
-		in custom manners (e.g. if you button class is `btn` and your button variant's class
-		is `blue`, you can style it, using `btn +'.blue'`).
-	- [3] : This mixin is experimental, although it is marked stable for most cases.
-	- [4] : The results of this mixin are purely stylistic and do not provide any grouping
-		functionality.
-*/
-@mixin make-btn-group($btn-group-name, $btn-name, $btn-group-border, $btn-group-border-radius){
-	.#{$btn-group-name}{
-		& .#{$btn-name}{
-			border: $btn-group-border;
-			margin: 0;
-			&:not(:first-child):not(:last-child){
-				border-radius: 0;
-				border-right: 0;
-			}
-			&:first-child{
-				border-radius: $btn-group-border-radius 0 0 $btn-group-border-radius;
-				border-right: 0;
-			}
-			&:last-child{
-				border-radius: 0 $btn-group-border-radius $btn-group-border-radius 0;
-			}
-		}
-	}
-}
\ No newline at end of file
diff --git a/scss/mini/_base.scss b/scss/mini/_base.scss
deleted file mode 100644
index ea03e9c..0000000
--- a/scss/mini/_base.scss
+++ /dev/null
@@ -1,310 +0,0 @@
-/*
-	Set font-family, line-height, prevent adjustments of font size after orientation changes in IE and iOS.
-	Set body colors and margin.
-*/
-html {
-	font-family: #{$base-fonts};
-	font-size: $base-font-size;
-	line-height: $base-line-height;
-	-ms-text-size-adjust: 100%;
-	-webkit-text-size-adjust: 100%; 
-}
-body {
-	margin: $body-margin;
-	color: $body-color;
-	background-color: $body-bg-color;
-}
-/*
-	Correct display in IE 9-.
-	Give images display: block to be responsive.
-*/
-article,	aside,	footer,	header,	nav,	section,	figcaption,	figure,	main,	details, 	menu, img {
-	display: block;
-}
-/*
-	Correct margin in IE 8.
-*/
-figure {
-	margin: 1em 40px;
-}
-/*
-	Styles for  headers.
-*/
-h1, h2, h3, h4, h5, h6{
-	line-height:  $base-line-height * $header-line-height-multiplier;
-	margin: $header-margin ;
-	font-weight: $header-font-weight ;
-	small{
-		color: $header-small-color ;
-		font-weight: $header-small-font-weight ;
-	}
-}
-h1{	font-size: $base-font-size  * $h1-multiplier;	}
-h2{	font-size: $base-font-size  * $h2-multiplier;	}
-h3{	font-size: $base-font-size  * $h3-multiplier;	}
-h4{	font-size: $base-font-size  * $h4-multiplier;	}
-h5{	font-size: $base-font-size  * $h5-multiplier;	}
-h6{	font-size: $base-font-size  * $h6-multiplier;	}
-/*
-	Correct box-sizing in Firefox.
-	Style for horizontal rule.
-*/
-hr {
-	box-sizing: content-box; 
-	line-height: $base-line-height * $hr-line-height-multiplier ;
-	margin: $hr-margin ;
-	height: 0;
-	border: 0;
-	border-top: $hr-border-style;
-}
-/*
-	Style for all small text and size for sub and sup.
-*/
-small, sub,	sup{
-	font-size: $small-font-size;
-}
-/*
-	Style for paragraph and preformatted elements.
-*/
-p, pre {
-  margin: $p-margin;
-}
-/*
-	Style for lists.
-*/
-ul,	ol {
-	margin-top: $list-margin-top;
-	margin-bottom: $list-margin-bottom;
-	ul,	ol {
-		margin-bottom: 0;
-	}
-}
-/*
-	Styles for code and preformatted.
-*/
-samp,	kbd,	code,	pre{
-	font-family: #{$code-fonts};
-	font-size: $base-font-size;
-}
-kbd, code, pre {
-	padding: $code-padding;
-	border-radius: $code-border-radius;
-}
-code, pre{
-	background-color: $code-bg-color;
-}
-kbd {
-	color: $kbd-color;
-	background-color: $kbd-bg-color;
-}
-pre {
-	display: block;
-	word-break: break-all;
-	word-wrap: break-word;
-	code {
-		padding: 0;
-		font-size: inherit;
-		color: inherit;
-		white-space: pre-wrap;
-		background-color: transparent;
-		border-radius: 0;
-	}
-}
-/*
-	Style for hyperlinks, remove underline.
-	Remove gray background on active links in IE 10.
-	Remove outline on focused links when they are also active or hovered.
-*/
-a {
-	background-color: transparent; 
-	text-decoration: none;
-	color: $a-color; 
-	&:active, &:hover{
-		outline-width: 0;
-		color: $a-hover-color;
-	}
-	&:visited{
-		color: $a-visited-color;
-		&:active, &:hover{
-			color: $a-visited-hover-color; 
-		}
-	}
-}
-/*
-	Prevent the duplicate application of `bolder` in Safari 6.
-*/
-b,	strong {
-	font-weight: inherit;
-}
-/*
-	Correct font weight in Chrome, Edge, Safari.
-*/
-b,	strong {
-	font-weight: bolder;
-}
-/*
-	Correct font style in Android 4.3-.
-*/
-dfn {
-  font-style: italic;
-}
-/*
-	Remove botom border in Firefox 39-.
-	Correct text decoration in Chrome, Edge, IE, Opera, and Safari.
-*/
-abbr[title] {
-	border-bottom: none; 
-	text-decoration: underline; 
-	text-decoration: underline dotted; 
-}
-/*
-	Style for mark.
-*/
-mark {
-	background-color: $mark-bg-color;
-	color: $mark-color;
-}
-/*
-	Styling for hidden elements.
-	Correct display for template in IE.
-	Correct display for audio:not([controls]) in iOS 4-7.	
-*/
-[hidden], .hidden, template, audio:not([controls]) {
-	display: none;
-}
-audio:not([controls]) {
-	height: 0;
-}
-/*
-	Correct display in IE 9-.
-*/
-audio,	video, 	progress {
-	display: inline-block;
-}
-/*
-	Styles for sub and sup.
-	Prevent `sub` and `sup` elements from affecting the line height.
-	Correct vertical alignment of progress in Chrome, Firefox, and Opera.
-*/
-sub,	sup, 	progress{
-	vertical-align: baseline;
-}
-sub, 	sup {
-	line-height: 0;
-	position: relative;
-	
-}
-sub {
-	bottom: $sub-bottom;
-}
-sup {
-	top: $sup-top;
-}
-/*
-	Remove the border on images inside links in IE 10-.
-	Make images responsive.
-*/
-img {
-	border-style: none;
-	max-width: 100%;
-}
-/*
-	Hide the overflow in IE.
-*/
-svg:not(:root) {
-	overflow: hidden;
-}
-/*
-	Show the overflow in IE and Edge.
-*/
-button,	input, hr { 
-	overflow: visible;
-}
-/*
-	Style for buttons and input elements.
-*/
-button,	input,	optgroup,	select,	textarea {
-	font-family: #{$button-fonts};
-	font-size: $button-font-size; 
-	line-height: $base-line-height * $button-line-height-multiplier; 
-	margin: $button-margin; 
-}
-/*
-	Remove the inheritance of text transform in Edge, Firefox, and IE.
-*/
-button,	select { 
-	text-transform: none;
-}
-/*
-	Correct styling for iOS, Safari and Firefox.
-*/
-button,	html [type="button"], 	[type="reset"],	[type="submit"] {
-	-webkit-appearance: button; 
-	&::-moz-focus-inner{
-		border-style: none;
-		padding: 0;
-	}
-	&:-moz-focusring{
-		outline: 1px dotted ButtonText;
-	}
-}
-/*
-	Style for fieldset.
-*/
-fieldset {
-	border: $fieldset-border;
-	border-radius: $fieldset-border-radius;
-	margin: $fieldset-margin;
-	padding: $fieldset-padding;
-}
-/*
-	Add correct box sizing and remove padding in IE 10-.
-*/
-[type="checkbox"],	[type="radio"],	legend {
-	box-sizing: border-box; 
-	padding: 0; 
-}
-/*
-
-	Correct text wrapping and color inheritance from `fieldset` elements in Edge and IE.
-	Remove the padding so developers are not caught out when they zero out `fieldset` 
-	elements in all browsers.
-*/
-legend {
-	color: inherit; 
-	display: table; 
-	max-width: 100%; 
-	white-space: normal; 
-}
-/*
-	Remove the default vertical scrollbar in IE.
-*/
-textarea {
-	overflow: auto;
-}
-/*
-	Correct the cursor style of increment and decrement buttons in Chrome.
-	Make images responsive.
-*/
-[type="number"]::-webkit-inner-spin-button,	[type="number"]::-webkit-outer-spin-button, img {
-	height: auto;
-}
-/*
-	Correct styling in Chrome and Safari.
-	Remove the inner padding and cancel buttons in Chrome and Safari on OS X.
-*/
-[type="search"] {
-	-webkit-appearance: textfield; 
-	outline-offset: -2px; 
-	&::-webkit-search-cancel-button, &::-webkit-search-decoration {
-		-webkit-appearance: none;
-	}
-}
-/*
-	Correct the inability to style clickable types in iOS and Safari.
-	Change font properties to `inherit` in Safari.
-*/
-::-webkit-file-upload-button {
-	-webkit-appearance: button; 
-	font: inherit; 
-}
\ No newline at end of file
diff --git a/scss/mini/_button.scss b/scss/mini/_button.scss
deleted file mode 100644
index 75b34fc..0000000
--- a/scss/mini/_button.scss
+++ /dev/null
@@ -1,106 +0,0 @@
-/*
-	Mixin for button color variant. 
-	Parameters:
-	- $btn-variant-color                  :	The text color of the button variant.
-	- $btn-variant-bg-color               :	The background color of the button variant.
-	- $btn-variant-hover-style	          :	Hover/active/focus style of the button variant. [1]
-	- $btn-variant-hover-style-percentage :	Hover/active/focus style of the button variant percentage modifier.
-	Notes:
-	- [1] : The values that $btn-variant-hover-style can take are `lighten` and `darken`. The inside condition
-		only checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`.
-	- [2] : Do not use this mixin directly, use `make-btn-style` instead.
-*/
-@mixin btn-variant ($btn-variant-color, $btn-variant-bg-color, $btn-variant-hover-style, $btn-variant-hover-style-percentage){
-	color: $btn-variant-color;
-	background: $btn-variant-bg-color;
-	&:hover, &:active, &:focus{
-		@if $btn-variant-hover-style == 'lighten'{
-    		background: lighten($btn-variant-bg-color, $btn-variant-hover-style-percentage);
-    	}
-    	@else{
-    		background: darken($btn-variant-bg-color, $btn-variant-hover-style-percentage);
-    	}
-
-  	}
-}
-/*
-	Mixin for the buttons.
-	Parameters:
-	- $btn-name                   :	The class name of the buttons.
-	- $btn-border                 :	The border of the buttons.
-	- $btn-border-radius          :	The border-radius of the buttons.
-	- $btn-margin                 :	The margin of the buttons.
-	- $btn-padding                :	The padding of the buttons.
-	- $btn-color                  :	The text color of the buttons.
-	- $btn-bg-color               :	The background color of the buttons.
-	- $btn-hover-style            :	Hover/active/focus style of the buttons. [1]
-	- $btn-hover-style-percentage :	Hover/active/focus style of the buttons percentage modifier.
-	- $btn-cursor                 :	The cursor style when hovering over the buttons.
-	- $btn-disabled-cursor        :	The cursor style when hovering over the buttons whie disabled.
-	- $btn-disabled-opacity       :	The opacity of the buttons when disabled.
-	Notes:
-	- [1] : The values that $btn-hover-style can take are `lighten` and `darken`. The inside condition only 
-		checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`.
-	- [2] : This only creates a basic button style. For more styles use `make-btn-style`.
-*/
-@mixin make-btn(	$btn-name, $btn-border, $btn-border-radius, $btn-margin, 
-					$btn-padding, $btn-color, $btn-bg-color,
-					$btn-hover-style, $btn-hover-style-percentage, 
-					$btn-cursor, $btn-disabled-cursor, $btn-disabled-opacity){
-	.#{$btn-name}, a.#{$btn-name}, a.#{$btn-name}:visited{
-		display: inline-block;
-		border: $btn-border;
-		border-radius: $btn-border-radius;
-		margin: $btn-margin;
-		padding: $btn-padding;
-		@include btn-variant($btn-color, $btn-bg-color, $btn-hover-style, $btn-hover-style-percentage);
-		cursor: $btn-cursor;
-		&.disabled, &[disabled], &:disabled{
-			cursor: $btn-disabled-cursor;
-			opacity: $btn-disabled-opacity;
-		}
-	}
-}
-/*
-	Mixin for button styles. 
-	Parameters:
-	- $btn-name                         : The class name of the buttons. [1]
-	- $btn-style-name                   : The class name of the button style.
-	- $btn-style-color                  : The text color of the button style.
-	- $btn-style-bg-color               : The background color of the button style.
-	- $btn-style-hover-style	        : Hover/active/focus style of the button style. [2][3]
-	- $btn-style-hover-style-percentage : Hover/active/focus style of the button style percentage modifier.[3]
-	Notes:
-	- [1] : The value of $btn-name must be the same as the value specified when using `make-btn`, otherwise
-		the specified style will not work correctly.
-	- [2] : The values that $btn-style-hover-style can take are `lighten` and `darken`. The inside condition
-		only checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`.
-	- [3] : The values of $btn-style-hover-style and $btn-style-hover-style-percentage default to `lighten`
-		and `7.5%` if not specified.
-	- [4] : This mixin should be used in combination with `make-btn` and is suggested that you use it after
-		`make-btn`.
-*/
-@mixin make-btn-style($btn-name, $btn-style-name, $btn-style-color, $btn-style-bg-color, $btn-style-hover-style: lighten, $btn-style-hover-style-percentage: 7.5%){
-	.#{$btn-name}.#{$btn-style-name}, a.#{$btn-name}.#{$btn-style-name}, a.#{$btn-name}.#{$btn-style-name}:visited{
-		@include btn-variant($btn-style-color, $btn-style-bg-color, $btn-style-hover-style, $btn-style-hover-style-percentage);
-	}
-}
-/*
-	Mixin for button sizes. 
-	Parameters:
-	- $btn-name           : The class name of the buttons. [1]
-	- $btn-size-name      : The class name of the button size.
-	- $btn-size-padding   : The padding of the button size.
-	- $btn-size-font-size : The font-size of the button size.
-	Notes:
-	- [1] : The value of $btn-name must be the same as the value specified when using `make-btn`, otherwise
-		the specified style will not work correctly.
-	- [2] : This mixin should be used in combination with `make-btn` and is suggested that you use it after
-		`make-btn`.
-*/
-@mixin make-btn-size($btn-name, $btn-size-name, $btn-size-padding, $btn-size-font-size){
-	.#{$btn-name}.#{$btn-size-name}{
-		padding: $btn-size-padding;
-		font-size: $btn-size-font-size;
-	}
-}
\ No newline at end of file
diff --git a/scss/mini/_form.scss b/scss/mini/_form.scss
deleted file mode 100644
index a6b54d7..0000000
--- a/scss/mini/_form.scss
+++ /dev/null
@@ -1,100 +0,0 @@
-/*
-	Mixin for the forms.
-	Parameters:
-	- $frm-name                  :	The class name of the form.
-	- $frm-border                :	The border of the form elements.
-	- $frm-border-radius         :	The border-radius of the form elements.
-	- $frm-margin                :	The margin of the form elements.
-	- $frm-padding               :	The padding of the form elements.
-	- $frm-focus-color           :	The color used to mark the focused form element.
-	- $frm-invalid-color         :	The color used to mark an invalid form element.
-	- $frm-disabled-cursor       :	The cursor style when hovering over disabled form elements.
-	- $frm-disabled-opacity      :	The opacity of the form elements when disabled.
-	- $frm-readonly-bg-color     :  The background color of the form elements when they are readonly.
-	- $frm-readonly-border-color :	The border color of the form elements when they are readonly.
-	- $frm-select-height         :	The height for non-multiline select elements in the form.
-	- $frm-label-margin          :	The margin for the form's label elements.
-	- $frm-ctrl-group-name       :	The class name of the control groups in the form.
-	- $frm-ctl-group-margin      :	The margin for control groups inside the form.
-	- $frm-inline-name           :	The class name for forms with inline style.
-	- $frm-aligned-name          :	The class name for forms with aligned style.
-	- $frm-aligned-label-width   :	The width of labels in forms with aligned style.	
-	Notes:
-	- [1] : Input elements with button-like style (i.e. submit, reset, button etc.) are not affected by form styling.
-		Please use the button styles and mixins provided to properly style them to your liking.
-*/
-@mixin make-frm(  	$frm-name, $frm-border, $frm-border-radius, 
-					$frm-margin, $frm-padding, $frm-focus-color, 
-					$frm-invalid-color, $frm-disabled-cursor, $frm-disabled-opacity,
-					$frm-readonly-bg-color, $frm-readonly-border-color,
-					$frm-select-height, $frm-label-margin, $frm-ctrl-group-name,
-					$frm-ctrl-group-margin, $frm-inline-name, 
-					$frm-aligned-name, $frm-aligned-label-width){
-	.#{$frm-name}{
-		input[type="color"],	input[type^="date"],	input[type$="time"],	input[type="email"],
-		input[type="month"],	input[type="week"],		input[type="text"],		input[type="password"],
-		input[type="url"],		input[type="number"],	input[type="search"],	input[type="tel"],
-		select,	textarea{		
-			box-sizing: border-box;
-			border: $frm-border;
-			border-radius: $frm-border-radius;	
-			box-shadow: none;		
-		}
-		input:not([type]){
-			box-sizing: border-box;
-			border: $frm-border;
-			border-radius: $frm-border-radius;
-			box-shadow: none;
-		}
-		input, select, textarea{
-			display: block;
-			margin: $frm-margin;
-			padding: $frm-padding;
-			&:focus{
-				border-color: $frm-focus-color;
-			}
-			&[disabled]{
-				cursor: $frm-disabled-cursor;
-				opacity: $frm-disabled-opacity;
-			}
-			&:invalid, &:focus:invalid, &:focus:invalid:focus{
-				border-color: $frm-invalid-color;
-			}
-			&[readonly]{
-				background-color: $frm-readonly-bg-color;
-				border-color: $frm-readonly-border-color;
-			}
-		}
-		input[type="checkbox"], input[type="radio"]{
-			display: inline-block;
-		}
-		select{
-			height: $frm-select-height;
-			&[multiple]{
-				height: auto;
-			}
-		}
-		label{
-			margin: $frm-label-margin;
-		}
-		&.#{$frm-inline-name}, &.#{$frm-aligned-name}{
-			input, select, textarea, label{
-				display: inline-block;
-			}
-		}
-		&.#{$frm-inline-name}{
-			.ctrl-group{
-				display: inline-block;
-			}
-		}
-		&.#{$frm-aligned-name} .#{$frm-ctrl-group-name} label{
-			text-align: right;
-			vertical-align: middle;
-			width: $frm-aligned-label-width;
-			margin-top: 0;
-		}
-		.#{$frm-ctrl-group-name}{
-			margin: $frm-ctrl-group-margin;
-		}
-	}
-}
\ No newline at end of file
diff --git a/scss/mini/_grid.scss b/scss/mini/_grid.scss
deleted file mode 100644
index 6c324cb..0000000
--- a/scss/mini/_grid.scss
+++ /dev/null
@@ -1,113 +0,0 @@
-/*
-	Mixin for responsive, mobile-first grid. 
-	Parameters:
-	- $container-name    :	The class name of the container for the grid.
-	- $container-padding :	The left and right padding of the container. [1]
-	- $row-name          :	The class name of the grid's rows.
-	- $col-name          :	The class name of the grid's columns.
-	- $col-number        :	The amount of columns in the grid.
-	- $xs-prefix         : 	Class prefix for extra small screens.
-	- $sm-prefix         : 	Class prefix for small screens.
-	- $md-prefix         : 	Class prefix for medium screens.
-	- $lg-prefix         : 	Class prefix for large screens.
-	- $hide-suffix       : 	Class suffix for hidden columns. [2]
-	- $sm-breakpoint     : 	Breakpoint for small screens.
-	- $md-breakpoint     : 	Breakpoint for medium screens.
-	- $lg-breakpoint     : 	Breakpoint for large screens.
-	Notes:
-	- [1] : The padding of the container might cause the page to grow by $container-padding to the right. This 
-			can be fixed either via @media queries or setting the padding to 0.
-	- [2] :	Columns with the $hide-suffix will be only hidden in the screen size specified.
-	- [3] :	Refer to https://github.com/Chalarangelo/mini.css/wiki/Grid for additional information.
-*/
-@mixin make-grid(	$container-name, $container-padding, 
-					$row-name, $col-name, $col-number, $col-padding, 
-					$xs-prefix, $sm-prefix, $md-prefix, $lg-prefix, $hide-suffix,
-					$sm-breakpoint, $md-breakpoint, $lg-breakpoint	){
-	// Container
-	.#{$container-name}{
-		padding-right: $container-padding;
-		padding-left: $container-padding;
-		margin-right: auto;
-		margin-left: auto;
-		width: 100%;
-		*{
-			box-sizing: border-box;
-		}
-	}
-	// Row
-	.#{$row-name}{
-		&:before, &:after{
-			content: "";
-			display: table;
-			clear: both;
-		}
-	}
-	// Column
-	.#{$col-name}{
-		float: left;
-		padding: $col-padding;
-	}
-	// Extra small screen
-	@for $i from 1 through $col-number{
-		.#{$xs-prefix}-#{$i}{
-			width: #{($i * 100% / $col-number)};
-		}
-	}
-	.#{$sm-prefix}-#{$hide-suffix}, 
-	.#{$md-prefix}-#{$hide-suffix}, 
-	.#{$lg-prefix}-#{$hide-suffix}{
-		display: block;
-	}
-	.#{$xs-prefix}-#{$hide-suffix}{
-		display: none;
-	}
-	// Small screen
-	@media (min-width: $sm-breakpoint){
-		@for $i from 1 through $col-number{
-			.#{$sm-prefix}-#{$i}{
-				width: #{($i * 100% / $col-number)};
-			}
-		}
-		.#{$xs-prefix}-#{$hide-suffix}, 
-		.#{$md-prefix}-#{$hide-suffix}, 
-		.#{$lg-prefix}-#{$hide-suffix}{
-			display: block;
-		}
-		.#{$sm-prefix}-#{$hide-suffix}{
-			display: none;
-		}	
-	}
-	// Medium screen
-	@media (min-width: $md-breakpoint){
-		@for $i from 1 through $col-number{
-			.#{$md-prefix}-#{$i}{
-				width: #{($i * 100% / $col-number)};
-			}
-		}
-		.#{$xs-prefix}-#{$hide-suffix}, 
-		.#{$sm-prefix}-#{$hide-suffix}, 
-		.#{$lg-prefix}-#{$hide-suffix}{
-			display: block;
-		}
-		.#{$md-prefix}-#{$hide-suffix}{
-			display: none;
-		}	
-	}
-	// Large screen
-	@media (min-width: $lg-breakpoint){
-		@for $i from 1 through $col-number{
-			.#{$lg-prefix}-#{$i}{
-				width: #{($i * 100% / $col-number)};
-			}
-		}
-		.#{$xs-prefix}-#{$hide-suffix}, 
-		.#{$sm-prefix}-#{$hide-suffix}, 
-		.#{$md-prefix}-#{$hide-suffix}{
-			display: block;
-		}
-		.#{$lg-prefix}-#{$hide-suffix}{
-			display: none;
-		}
-	}
-}
\ No newline at end of file
diff --git a/scss/mini/_nav.scss b/scss/mini/_nav.scss
deleted file mode 100644
index d4fce75..0000000
--- a/scss/mini/_nav.scss
+++ /dev/null
@@ -1,197 +0,0 @@
-/*
-	Mixin for navigation bar and complementary styles.
-	Parameters:
-	- $nav-name                                   :	The class name for the navigation bar.
-	- $nav-vertical-name                          :	The class name for the vertical style of the navigation bar.
-	- $nav-fixed-name                             :	The class name for the fixed style of the navigation bar.
-	- $nav-logo-name                              :	The class name for the logo item of the navigation bar.
-	- $nav-logo-size                              :	The font-size of the logo item of the navigation bar.
-	- $nav-link-name                              :	The class name for the navigation links of the navigation bar.
-	- $nav-padding                                :	The padding of the elements of the navigation bar. [1]
-	- $nav-color                                  :	The text color of the navigation elements.
-	- $nav-bg-color                               :	The background color of the navigation bar.
-	- $nav-hover-style                            :	Hover/active/focus style of the navigation elements. [2]
-	- $nav-hover-style-percentage                 :	Hover/active/focus style of the navigation elements percentage modifier.
-	- $nav-disabled-cursor                        :	The cursor style when hovering over the navigation elements whie disabled.
-	- $nav-disabled-opacity                       :	The opacity of the navigation elements when disabled.
-	- $nav-fixed-left-right                       :	The orientation of the fixed navigation bar. [3][4]
-	- $grid-columns-total                         :	Total amount fo columns in the used grid. [5]
-	- $grid-coloumns-count-for-nav-fixed-vertical :	Desired amount of columns occupied by the vertical navigation bar in the grid. [5]
-	- $nav-fixed-collapse-breakpoint              :	The breakpoint below which fixed navigation bars will collapse to a menu toggle button.
-	- $nav-fixed-collapse-label-location          :	Location of the collapsed menu button label. [6]
-	- $nav-fixed-collapse-label-margin            :	The margin for the collapsed menu button label.
-	- $nav-fixed-collapse-label-font-size         :	The font size of the collapsed menu button label.
-	Notes:
-	- [1] : This padding applies to all elements of the navigation bar and all styles(e.g. vertical or fixed). 
-		For vertical styles it adapts to apply properly. It also adapts to apply properly to the collapse 
-		label of the navigation bar. Please specify only a single padding value (i.e. 6px, 1.25em etc.) to 
-		avoid CSS errors and ultimately the style not being applied to some elements.
-	- [2] : The values that $nav-hover-style can take are `lighten` and `darken`. The inside condition only 
-		checks if the value is `lighten` and acts accordingly. Invalid values are treated as `darken`.
-	- [3] : The values of $nav-fixed-left-right recognizes are `left` and `right`. However if invalid values
-		are provided, due to the inside condition only checking for `left`, `right` will be used as the
-		default value.
-	- [4]: The values of $nav-fixed-left-right will apply to all fixed navigation bars. The horizontal bars
-		should not be affected as they are 100% width, meaning that anchoring to left or right should have
-		the same result.
-	- [5] : These values are used to make the navigation bar work better with the grid system. Values do not have 
-		to be the same as the grid or integer values, meaning that values like 12 and 1.5 could work great leaving
-		a small gap just before the third column in the grid. If no grid is specified, you can use percentage
-		values like 100 and 15 to get a 15% width for example.
-	- [6] : The value $nav-fixed-collapse-label-location recognizes are `top-left`, `top-right`, `bottom-left`
-		and `bottom-right`. Due to the way the conditional checking is implemented, `bottom-right` will be
-		used as a default if no valid value is specified.
-*/
-@mixin make-nav(	$nav-name, $nav-vertical-name, $nav-fixed-name, $nav-logo-name,
-					$nav-logo-size, $nav-link-name, $nav-padding, $nav-color, $nav-bg-color,   
-					$nav-hover-style, $nav-hover-style-percentage, $nav-disabled-cursor, 
-					$nav-disabled-opacity, $nav-fixed-left-right, $grid-columns-total, 
-					$grid-columns-count-for-nav-fixed-vertical, $nav-fixed-collapse-breakpoint,
-					$nav-fixed-collapse-label-location, $nav-fixed-collapse-label-margin,
-					$nav-fixed-collapse-label-font-size											){
-	.#{$nav-name}{
-		box-sizing: border-box;
-		background-color: #{$nav-bg-color};
-		.#{$nav-logo-name}{
-			font-size: $nav-logo-size;
-			color: #{$nav-color};
-		}
-		ul{
-			display: inline-block;
-			list-style: none;
-			margin: 0;
-			padding: 0;
-			li{
-				display: inline-block;		
-				margin: 0;
-				white-space: nowrap;
-				> * {
-					display: inline-block;
-					padding: #{$nav-padding};
-					color: #{$nav-color};
-					margin: 0;
-				}
-				.#{$nav-link-name}{
-					&:hover, &:active, &:focus{
-						color: #{$nav-color};
-						@if $nav-hover-style == 'lighten'{
-							background: lighten($nav-bg-color, $nav-hover-style-percentage);
-						}
-						@else{
-							background: darken($nav-bg-color, $nav-hover-style-percentage);
-						}
-					}
-					&.disabled, &[disabled], &:disabled{
-						cursor: $nav-disabled-cursor;
-						opacity: $nav-disabled-opacity;
-					}
-				}
-			}
-		}
-		&.#{$nav-vertical-name}{
-			ul{
-				display: block;
-				li{
-					display: block;					
-					> * {
-						width: 100%;
-						padding: #{$nav-padding} 0;
-					}
-				}
-			}
-		}
-		&.#{$nav-fixed-name}{
-			position: fixed;
-			@if $nav-fixed-left-right == 'left'{
-				left: 0;
-			}
-			@else{
-				right: 0;
-			}			
-			top: 0;
-			z-index: 999;
-			width: 100%;
-			&.#{$nav-vertical-name}{
-				height: 100%;
-				width: #{($grid-columns-count-for-nav-fixed-vertical * 100%/ $grid-columns-total)};
-				ul{
-					width: 100%;
-					li{
-						display: block;
-					}
-				}
-			}
-		}
-		& + label{
-			display: none;
-			font-weight: 700;
-			margin: $nav-fixed-collapse-label-margin;
-			font-size: $nav-fixed-collapse-label-font-size;
-			padding: #{$nav-padding};		
-			color: #{$nav-color};
-			background-color: $nav-bg-color;
-			width: auto;
-			position: fixed;
-			z-index: 1000;
-			@if $nav-fixed-collapse-label-location == 'top-left'{
-				top: 0;
-				left: 0;
-			}
-			@else if $nav-fixed-collapse-label-location == 'top-right'{
-				top: 0;
-				right: 0;
-			}
-			@else if $nav-fixed-collapse-label-location == 'bottom-left'{
-				bottom: 0;
-				left: 0;
-			}
-			@else{
-				bottom: 0;
-				right: 0;
-			}		
-			&:before{
-				position: relative;
-				content: '\2630';
-			}
-			&:hover, &:active, &:focus{
-				@if $nav-hover-style == 'lighten'{
-					background: lighten($nav-bg-color, $nav-hover-style-percentage);
-				}
-				@else{
-					background: darken($nav-bg-color, $nav-hover-style-percentage);
-				}
-			}
-		}
-	}
-	@media (max-width: $nav-fixed-collapse-breakpoint){
-		.#{$nav-name}{
-			overflow: auto;
-			&.#{$nav-fixed-name}{
-				display: none;
-				& + label{
-					display: block;
-				}
-			}		
-		}
-		input[type="checkbox"]:checked + .#{$nav-name}.#{$nav-fixed-name}{
-			display: block;
-			width: 100%;
-			height: 100%;
-			ul{
-				display: block;
-				li{
-					display: block;
-					* {
-						width: 100%;
-						padding: #{$nav-padding} 0;
-					}
-				}
-			}
-			& + label{			
-				&:before{
-					content: '\00d7';
-				}
-			}
-		}
-	}
-}
\ No newline at end of file
diff --git a/scss/mini/_table.scss b/scss/mini/_table.scss
deleted file mode 100644
index 8188994..0000000
--- a/scss/mini/_table.scss
+++ /dev/null
@@ -1,59 +0,0 @@
-/*
-	Mixin for the tables.
-	Parameters:
-	- $tbl-name                  :	The class name of the table.
-	- $tbl-border                :	The border of the table and cells. [1]
-	- $tbl-margin                :	The margin of the table cells.
-	- $tbl-padding               :	The padding of the table cells.
-	- $tbl-head-bg-color         :	The color of the thead background.
-	- $tbl-head-color            :	The color of the thead text.
-	- $tbl-body-bg-color         :	The color of the even-numbered rows in tbody.
-	- $tbl-body-alt-bg-color     :	The color of the odd-numbered rows in tbody.
-	- $tbl-body-color            :  The color of the text in tbody.
-	- $tbl-horizontal-name       :	The class name for the horizontal style table.
-	- $tbl-bordered-name         :	The class name for the bordered style table.
-	Notes:
-	- [1] : This style will apply to the table and cells. All styles applied to 
-		the table (horizontal, bordered) will use the same style of border.
-*/
-@mixin make-tbl(	$tbl-name, $tbl-border, $tbl-margin, $tbl-padding,
-					$tbl-head-bg-color, $tbl-head-color, $tbl-body-bg-color,
-					$tbl-body-alt-bg-color, $tbl-body-color, 
-					$tbl-horizontal-name, $tbl-bordered-name				){
-	.#{$tbl-name}{
-		border-collapse: collapse;
-		border-spacing: 0;
-		empty-cells: show;
-		border: $tbl-border;
-		td, th{
-			overflow: visible;
-			border-left: $tbl-border;
-			border-bottom: none;
-			margin: $tbl-margin;	
-			padding: $tbl-padding;
-		}
-		thead {
-			background-color: $tbl-head-bg-color;
-			color: $tbl-head-color;
-			text-align: left;
-		}
-		tbody {
-			background-color: $tbl-body-bg-color;
-			color: $tbl-body-color;
-			tr:nth-child(2n-1) {
-				background-color: $tbl-body-alt-bg-color;
-			}
-		}
-		&.#{$tbl-horizontal-name}{ 
-			td,th{
-				border-left: none;
-				border-bottom: $tbl-border;
-			}
-		}
-		&.#{$tbl-bordered-name}{
-			td,th{
-				border-bottom: $tbl-border;
-			}
-		}
-	}
-}
\ No newline at end of file
diff --git a/scss/mini/_utility.scss b/scss/mini/_utility.scss
deleted file mode 100644
index b6b2e3c..0000000
--- a/scss/mini/_utility.scss
+++ /dev/null
@@ -1,186 +0,0 @@
-/*
-	Image thumbnail style mixin. [1]
-	Parameters:
-	- $thumb-name          : 	The class name for the thumbnail style.
-	- $thumb-padding       :	The padding between the image and the border.
-	- $thumb-border	       :	The style of the thumbnail's border.
-	- $thumb-border-radius :	The border radius of the thumbnail.
-	- $thumb-hover-color   :	The color of the thumbnail's border when hovering over it.
-	Notes:
-	- [1] : This style only applies to `img` elements with the class specified in
-		`$thumb-name`.
-*/
-@mixin make-thumb($thumb-name, $thumb-padding, $thumb-border, $thumb-border-radius, $thumb-hover-color){
-	img.#{$thumb-name}{
-		padding: $thumb-padding;
-		border: $thumb-border;
-		border-radius: $thumb-border-radius;
-		cursor: pointer;
-		&:hover, &:focus, &active{
-			border-color: $thumb-hover-color;
-		}
-	}
-}
-/*
-	Mixin for generic border style.
-	Parameters:
-	- $border-generic-name :	The class name for the generic border.
-	Notes:
-	- [1] : The border style uses rgba to create a 1px solid border with 0.25 
-		opacity around an element, which makes it look properly bordered. 
-		Might be incompatible with older browsers.
-	- [2] : The border style overwrites any border style as it uses 
-		`!important`, exercise caution when using.
-*/
-@mixin make-border-generic($border-generic-name){
-	.#{$border-generic-name}{
-		border: 1px solid rgba(0,0,0, 0.25) !important;
-	}
-}
-/*
-	Mixin for generic border radius styles.
-	Parameters:
-	- $border-style-name   :	The class name for the generic border radius style.
-	- $border-style-radius :	The radius for the generic border radius style.
-	Notes:
-	- [1] : The border style overwrites any border style as it uses 
-		`!important`, exercise caution when using.
-*/
-@mixin make-border-radial-style($border-style-name, $border-style-radius){
-	.#{$border-style-name}{
-		border-radius: $border-style-radius !important;
-	}
-}
-/*
-	Mixin for generic contextual color text styles.
-	Parameters:
-	- $colored-text-name  :	The class name for the contextual color text style.
-	- $colored-text-color :	The color for the contextual color text style.
-	Notes:
-	- [1] : The contextual color text style overwrites any text color as it uses 
-		`!important`, exercise caution when using.
-*/
-@mixin make-colored-text($colored-text-name, $colored-text-color){
-	.#{$colored-text-name}{
-		color: $colored-text-color !important;
-	}
-}
-/*
-	Mixin for generic contextual background text styles.
-	Parameters:
-	- $colored-bg-text-name  :	The class name for the contextual background text style.
-	- $colored-bg-text-color :	The background color for the contextual background text style.
-	Notes:
-	- [1] : The contextual background text style overwrites any text color as it 
-		uses  `!important`, exercise caution when using.
-*/
-@mixin make-colored-bg-text($colored-bg-text-name, $colored-bg-text-color){
-	.#{$colored-bg-text-name}{
-		background-color: $colored-bg-text-color !important;
-	}
-}
-/*
-	Mixin for simple caret utility class.
-	Parameters:
-	- $caret-name  :	The class name for caret utility class.
-	- $caret-size  :	The size of the caret utility element. [1]
-	- $caret-color :	The color of the caret utility element.
-	Notes:
-	- [1] : The caret is built using the border trick. Sizes can be specified
-		in either `px` or `em`, but they might take a bit of tweaking to
-		get right.
-*/
-@mixin make-caret-down($caret-name, $caret-size, $caret-color){
-	.#{$caret-name} {
-		display: inline-block;
-		vertical-align: middle;
-		line-height: 1;
-		width: 0; 
-		height: 0; 
-		border: $caret-size solid transparent;
-		border-top: $caret-size solid $caret-color;
-	}
-}
-/*
-	Mixin for simple close sign utility class.
-	Parameters:
-	- $close-name        :	The class name for close utility class.
-	- $close-color       :	The color of the close utility element.
-	- $close-cursor      :	The cursor for the close utility element.
-	- $close-font-size   :	The font-size for the close utility element.
-	- $close-font-weight :	The font-weight for the close utility element.
-	- $close-hover-color :	The color of the close utility element when hovering over it.
-*/
-@mixin make-close($close-name, $close-color, $close-cursor, $close-font-size, $close-font-weight, $close-hover-color){
-	.#{$close-name}{
-		display: inline-block;	 
-		vertical-align: middle;  
-		line-height: 1; 
-	    color: $close-color;     
-	    font-size: $close-font-size;
-	    font-weight: $close-font-weight;
-	    cursor: $close-cursor;
-	    &:before {
-	    	content: '\00d7';
-		}
-		&:hover, &:active, &:focus{
-			color: $close-hover-color;
-		}
-	}
-}
-/*
-	Mixin for quick float classes. [1]
-	Parameters:
-	- $drag-left-name  :	The class name for left drags.
-	- $drag-right-name :	The class name for right drags.
-	Notes:
-	- [1] : These classes use `!important` to set the float properties, 
-		exercise caution when using.
-*/
-@mixin make-drags($drag-left-name, $drag-right-name){
-	.#{$drag-left-name} {
-		float: left !important;
-	}
-	.#{$drag-right-name} {
-		float: right !important;
-	}
-}
-/*
-	Mixin for center block class.
-	Parameters:
-	- $center-block-name :	The class name for center block class.
-*/
-@mixin make-center-block($center-block-name){
-	.#{$center-block-name} {
-		display: block;
-		margin-left: auto;
-		margin-right: auto;
-	}
-}
-/*
-	Mixin for clearfix class.
-	Parameters:
-	- $clearfix-name :	The class name for the clearfix class.
-*/
-@mixin make-clearfix($clearfix-name){
-	.#{$clearfix-name} {
-		&:before, &:after {
-			content: "";
-			display: table;
-			clear: both;
-		}
-	}
-}
-/*
-	Mixin for hidden class. [1]
-	Parameters:
-	- $hidden-name :	The class name for hidden elements.
-	Notes:
-	- [1] : This class uses `!important` to set the display property, 
-		exercise caution when using.
-*/
-@mixin make-hidden($hidden-name){
-	.#{$hidden-name}{
-		display: none !important;
-	}
-}
\ No newline at end of file