From d05cd28c5610c5210ba82b317d7a589ae1cf5fa3 Mon Sep 17 00:00:00 2001 From: Angelos Chalaris Date: Sat, 8 Oct 2016 11:22:34 +0300 Subject: [PATCH] Bootstrap flavor - base --- flavors/mini-bootstrap.css | 325 +++++++++++++++++---------------- flavors/mini-bootstrap.min.css | 2 +- flavors/mini-bootstrap.scss | 91 +++++---- 3 files changed, 225 insertions(+), 193 deletions(-) diff --git a/flavors/mini-bootstrap.css b/flavors/mini-bootstrap.css index 8b7f5d2..d1a4d5a 100644 --- a/flavors/mini-bootstrap.css +++ b/flavors/mini-bootstrap.css @@ -3,21 +3,122 @@ 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, sans-serif; - font-size: 1em; - line-height: 1.5; + 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: #222; - background-color: #f5f5f5; } + color: #333; + background-color: #fff; } /* Correct display in IE 9-. @@ -36,30 +137,30 @@ figure { Styles for headers. */ h1, h2, h3, h4, h5, h6 { - line-height: 1.2; - margin: 0.7em 0; + line-height: 1.1; + margin: 0; font-weight: 500; } h1 small, h2 small, h3 small, h4 small, h5 small, h6 small { - color: #555555; - font-weight: 200; } + color: #777; + font-weight: 400; } h1 { - font-size: 2em; } + font-size: 36px; } h2 { - font-size: 1.5em; } + font-size: 30px; } h3 { - font-size: 1.15em; } + font-size: 24.0px; } h4 { - font-size: 1em; } + font-size: 18.0px; } h5 { - font-size: 0.8em; } + font-size: 14px; } h6 { - font-size: 0.7em; } + font-size: 12px; } /* Correct box-sizing in Firefox. @@ -67,30 +168,30 @@ h6 { */ hr { box-sizing: content-box; - line-height: 1.2; + line-height: 1.14286; margin: 0.7em 0; height: 0; border: 0; - border-top: 1px solid #cfcfcf; } + border-top: 1px solid #d9d9d9; } /* Style for all small text and size for sub and sup. */ small, sub, sup { - font-size: 75%; } + font-size: 80%; } /* Style for paragraph and preformatted elements. */ p, pre { - margin: 0 0 0.6em; } + margin: 0 0 10px; } /* Style for lists. */ ul, ol { margin-top: 0; - margin-bottom: 0.6em; } + margin-bottom: 10px; } ul ul, ul ol, ol ul, ol ol { margin-bottom: 0; } @@ -98,19 +199,19 @@ ul, ol { Styles for code and preformatted. */ samp, kbd, code, pre { - font-family: monospace, monospace; - font-size: 1em; } + font-family: Menlo, Monaco, Consolas, "Courier New", monospace; + font-size: 14px; } kbd, code, pre { padding: 2px 4px; border-radius: 4px; } code, pre { - background-color: gainsboro; } + background-color: #f9f2f4; } kbd { - color: #fefefe; - background-color: #222; } + color: #fff; + background-color: #333; } pre { display: block; @@ -132,14 +233,14 @@ pre { a { background-color: transparent; text-decoration: none; - color: #2678b3; } + color: #337ab7; } a:active, a:hover { outline-width: 0; - color: #3793d5; } + color: #23527c; } a:visited { - color: #1d5c89; } + color: #337ab7; } a:visited:active, a:visited:hover { - color: #2678b3; } + color: #23527c; } /* Prevent the duplicate application of `bolder` in Safari 6. @@ -172,8 +273,8 @@ abbr[title] { Style for mark. */ mark { - background-color: #ffff33; - color: #222; } + background-color: #fcf8e3; + color: #333; } /* Styling for hidden elements. @@ -234,9 +335,9 @@ button, input, hr { Style for buttons and input elements. */ button, input, optgroup, select, textarea { - font-family: "Helvetica Neue", Helvetica, sans-serif; + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 100%; - line-height: 1.2; + line-height: 1.14286; margin: 0; } /* @@ -260,10 +361,10 @@ button, html [type="button"], [type="reset"], [type="submit"] { Style for fieldset. */ fieldset { - border: 1px solid #cfcfcf; - border-radius: 4px; - margin: 0 2px; - padding: 0.35em 0.65em 0.75em; } + border: 0; + border-radius: 0; + margin: 0; + padding: 0; } /* Add correct box sizing and remove padding in IE 10-. @@ -686,8 +787,8 @@ textarea { .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; } + background-color: #e6e6e6; + border-color: #bfbfbf; } .frm input[type="checkbox"], .frm input[type="radio"] { display: inline-block; } .frm select { @@ -882,111 +983,13 @@ textarea { 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; } + border-color: #337ab7; } .bordered { border: 1px solid rgba(0, 0, 0, 0.25) !important; } @@ -1162,13 +1165,13 @@ img.thumb { left: 1px; height: 40px; padding: 8px 14px; - color: #2678b3; - background-color: #f5f5f5; + color: #337ab7; + background-color: #fff; 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; } + background: #e6e6e6; } .tabs input[type="radio"] + div > label + div { position: absolute; z-index: -2; @@ -1180,9 +1183,9 @@ img.thumb { background: #fff; border: 1px solid #ccc; } .tabs input[type="radio"]:checked + div > label { - color: #222; + color: #333; background: #fff; - border-top: 3px solid #2678b3; + border-top: 3px solid #337ab7; border-bottom: 1px solid #fff; } .tabs input[type="radio"]:checked + div > label + div { position: absolute; @@ -1236,8 +1239,8 @@ img.thumb { z-index: 998; position: relative; width: 45%; - color: #222; - background-color: #f5f5f5; + color: #333; + background-color: #fff; margin: 8.5% auto 0; padding: 18px; border: 1px solid #ccc; @@ -1329,7 +1332,7 @@ input[type="checkbox"].clps { display: none; } input[type="checkbox"].clps + div { display: none; - color: #222; + color: #333; background-color: #eeeeee; padding: 10px; margin-top: 5px; @@ -1343,7 +1346,7 @@ input[type="radio"].acrd { input[type="radio"].acrd + label { width: 100%; display: block; - color: #222; + color: #333; background-color: #eeeeee; padding: 8px; margin-bottom: 5px; @@ -1354,8 +1357,8 @@ input[type="radio"].acrd { background-color: #dbdbdb; } input[type="radio"].acrd + label + div { display: none; - color: #222; - background-color: #f5f5f5; + color: #333; + background-color: #fff; padding: 10px; margin-top: -1px; margin-bottom: 5px; @@ -1529,8 +1532,8 @@ input[type="radio"]:checked.acrd + label { overflow: auto; left: 0; top: 340px; - background-color: #222; - color: #f5f5f5; + 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; } @@ -1657,7 +1660,7 @@ input[type="radio"]:checked.acrd + label { border: 1px solid #ccc; border-radius: 4px; background-color: #e7e7e7; - color: #222; + color: #333; padding: 20px; } .alert-blue + div { @@ -1750,8 +1753,8 @@ input[type="checkbox"]:checked.alert-red + div { .panel { border: 1px solid #ccc; border-radius: 4px; - background-color: #f5f5f5; - color: #222; + background-color: #fff; + color: #333; padding: 0; } .panel > * { @@ -1759,7 +1762,7 @@ input[type="checkbox"]:checked.alert-red + div { .panel .head { border: 0; border-bottom: 1px solid #ccc; - color: #222; + color: #333; background-color: #e7e7e7; padding: 10px; margin: 0; } @@ -1771,8 +1774,8 @@ input[type="checkbox"].popover-top { input[type="checkbox"].popover-top + label > .popover-top { position: absolute; display: none; - background-color: #222; - color: #f5f5f5; + background-color: #333; + color: #fff; border-radius: 5px; padding: 7px 10px; z-index: 998; @@ -1781,7 +1784,7 @@ input[type="checkbox"].popover-top { input[type="checkbox"].popover-top + label > .popover-top:before { position: absolute; display: block; - border-top: 7px solid #222; + border-top: 7px solid #333; border-right: 7px solid transparent; border-left: 7px solid transparent; bottom: -7px; @@ -1798,8 +1801,8 @@ input[type="checkbox"].popover-bottom { input[type="checkbox"].popover-bottom + label > .popover-bottom { position: absolute; display: none; - background-color: #222; - color: #f5f5f5; + background-color: #333; + color: #fff; border-radius: 4px; padding: 7px 10px; z-index: 998; @@ -1808,7 +1811,7 @@ input[type="checkbox"].popover-bottom { input[type="checkbox"].popover-bottom + label > .popover-bottom:before { position: absolute; display: block; - border-bottom: 7px solid #222; + border-bottom: 7px solid #333; border-right: 7px solid transparent; border-left: 7px solid transparent; top: -7px; diff --git a/flavors/mini-bootstrap.min.css b/flavors/mini-bootstrap.min.css index 77a409e..097c32d 100644 --- a/flavors/mini-bootstrap.min.css +++ b/flavors/mini-bootstrap.min.css @@ -1 +1 @@ -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 +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: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:#e6e6e6;border-color:#bfbfbf}.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:#337ab7}.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:#337ab7;background-color:#fff;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:#e6e6e6}.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:#333;background:#fff;border-top:3px solid #337ab7;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:#333;background-color:#fff;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:#333;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:#333;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:#333;background-color:#fff;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:#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:#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:#333;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:#fff;color:#333;padding:0}.panel>*{padding:10px}.panel .head{border:0;border-bottom:1px solid #ccc;color:#333;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:#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}.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-bootstrap.scss b/flavors/mini-bootstrap.scss index 962669a..9626dd5 100644 --- a/flavors/mini-bootstrap.scss +++ b/flavors/mini-bootstrap.scss @@ -21,61 +21,90 @@ //==================================================================== // 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: #f5f5f5; // Body background color -$body-color: #222; // Body text color +$body-bg-color: #fff; // Body background color +$body-color: #333; // 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 +$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) -$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 +// --- 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: lighten($body-color, 20%); // Header small text color -$header-small-font-weight: 200; // Header small font weight +$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.) -$p-margin: 0 0 0.6em; // Margin for paragraph and pre elements -$small-font-size: 75%; // Font size for small, sub and sup elements +// --- 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: 0.6em; // Bottom margin for lists -$mark-bg-color: #ffff33; // Mark background color +$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 -$code-fonts: monospace, monospace; // Font-family for code, pre, kbd, samp elements +// --- 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:					darken($body-bg-color, 10%);					// Code and pre background color	
+$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:						lighten($body-bg-color, 3.5%);					// Kbd text 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
-$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
+//	--- 	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:				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
+$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';
 //====================================================================
@@ -212,7 +241,7 @@ $colored-bg-text1-bg-color:					$btn-b-bg-color;					// Background color for the
 $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';
+// @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);