/*! * Bootstrap v3.0.0 * * Copyright 2012 Twitter, Inc * Licensed under the Apache License v2.0 * http://www.apache.org/licenses/LICENSE-2.0 * * Designed and built with all the love in the world by @mdo and @fat. */ /*! normalize.css v2.0.1 | MIT License | git.io/normalize */ article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary { display: block; } audio, canvas, video { display: inline-block; } audio:not([controls]) { display: none; height: 0; } [hidden] { display: none; } html { font-family: sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } body { margin: 0; } a:focus { outline: thin dotted; } a:active, a:hover { outline: 0; } h1 { font-size: 2em; } abbr[title] { border-bottom: 1px dotted; } b, strong { font-weight: bold; } dfn { font-style: italic; } mark { color: #000; background: #ff0; } code, kbd, pre, samp { font-family: monospace, serif; font-size: 1em; } pre { word-wrap: break-word; white-space: pre; white-space: pre-wrap; } q { quotes: "\201C" "\201D" "\2018" "\2019"; } small { font-size: 80%; } sub, sup { position: relative; font-size: 75%; line-height: 0; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } img { border: 0; } svg:not(:root) { overflow: hidden; } figure { margin: 0; } fieldset { padding: 0.35em 0.625em 0.75em; margin: 0 2px; border: 1px solid #c0c0c0; } legend { padding: 0; border: 0; } button, input, select, textarea { margin: 0; font-family: inherit; font-size: 100%; } button, input { line-height: normal; } button, html input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; } button[disabled], html input[disabled] { cursor: default; } input[type="checkbox"], input[type="radio"] { padding: 0; box-sizing: border-box; } input[type="search"] { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; -webkit-appearance: textfield; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } button::-moz-focus-inner, input::-moz-focus-inner { padding: 0; border: 0; } textarea { overflow: auto; vertical-align: top; } table { border-collapse: collapse; border-spacing: 0; } html { font-size: 62.5%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-overflow-scrolling: touch; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } @media screen and (max-device-width: 480px) { html { -webkit-text-size-adjust: none; -ms-text-size-adjust: none; } } body { margin: 0; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 14px; font-size: 1.4rem; line-height: 1.5; color: #333333; background-color: #ffffff; } body, input, button, select, textarea { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 14px; line-height: 20px; } a { color: #428bca; text-decoration: none; } a:hover { color: #2a6496; text-decoration: underline; } a:focus { outline: thin dotted #333; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; } img { width: auto\9; height: auto; max-width: 100%; vertical-align: middle; } .img-rounded { border-radius: 6px; } .img-polaroid { padding: 4px; background-color: #fff; border: 1px solid #ccc; border: 1px solid rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); } .img-circle { border-radius: 500px; } @media print { * { color: #000 !important; text-shadow: none !important; background: transparent !important; box-shadow: none !important; } a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } abbr[title]:after { content: " (" attr(title) ")"; } .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } thead { display: table-header-group; } tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } } p { margin: 0 0 10px; } .lead { margin-bottom: 20px; font-size: 21px; font-weight: 200; line-height: 30px; } small { font-size: 85%; } strong { font-weight: bold; } em { font-style: italic; } cite { font-style: normal; } .muted { color: #999999; } a.muted:hover { color: #808080; } .text-warning { color: #c09853; } a.text-warning:hover { color: #a47e3c; } .text-error { color: #b94a48; } a.text-error:hover { color: #953b39; } .text-success { color: #468847; } a.text-success:hover { color: #356635; } .text-left { text-align: left; } .text-right { text-align: right; } .text-center { text-align: center; } h1, h2, h3, h4, h5, h6 { font-family: inherit; font-weight: 500; line-height: 20px; text-rendering: optimizelegibility; } h1 small, h2 small, h3 small, h4 small, h5 small, h6 small { font-weight: normal; line-height: 1; color: #999999; } h1, h2, h3 { margin-top: 20px; margin-bottom: 10px; line-height: 40px; } h4, h5, h6 { margin-top: 10px; margin-bottom: 10px; } h1 { font-size: 38.5px; } h2 { font-size: 31.5px; } h3 { font-size: 24.5px; } h4 { font-size: 17.5px; } h5 { font-size: 14px; } h6 { font-size: 11.9px; } h1 small { font-size: 24.5px; } h2 small { font-size: 17.5px; } h3 small { font-size: 14px; } h4 small { font-size: 14px; } .page-header { padding-bottom: 9px; margin: 40px 0 20px; border-bottom: 1px solid #eeeeee; } ul, ol { padding: 0; margin: 0 0 10px 25px; } ul ul, ul ol, ol ol, ol ul { margin-bottom: 0; } li { line-height: 20px; } .list-unstyled, .list-inline { margin-left: 0; list-style: none; } .list-inline > li { display: inline-block; padding-right: 5px; padding-left: 5px; } dl { margin-bottom: 20px; } dt, dd { line-height: 20px; } dt { font-weight: bold; } dd { margin-left: 10px; } .dl-horizontal:before, .dl-horizontal:after { display: table; content: " "; } .dl-horizontal:after { clear: both; } .dl-horizontal dt { float: left; width: 160px; overflow: hidden; clear: left; text-align: right; text-overflow: ellipsis; white-space: nowrap; } .dl-horizontal dd { margin-left: 180px; } hr { margin: 20px 0; border: 0; border-top: 1px solid #eeeeee; border-bottom: 1px solid #fff; } abbr[title], abbr[data-original-title] { cursor: help; border-bottom: 1px dotted #999999; } abbr.initialism { font-size: 90%; text-transform: uppercase; } blockquote { padding: 0 0 0 15px; margin: 0 0 20px; border-left: 5px solid #eeeeee; } blockquote p { margin-bottom: 0; font-size: 17.5px; font-weight: 300; line-height: 1.25; } blockquote small { display: block; line-height: 20px; color: #999999; } blockquote small:before { content: '\2014 \00A0'; } blockquote.pull-right { float: right; padding-right: 15px; padding-left: 0; border-right: 5px solid #eeeeee; border-left: 0; } blockquote.pull-right p, blockquote.pull-right small { text-align: right; } blockquote.pull-right small:before { content: ''; } blockquote.pull-right small:after { content: '\00A0 \2014'; } q:before, q:after, blockquote:before, blockquote:after { content: ""; } address { display: block; margin-bottom: 20px; font-style: normal; line-height: 20px; } code, pre { padding: 0 3px 2px; font-family: Monaco, Menlo, Consolas, "Courier New", monospace; font-size: 12px; color: #333333; border-radius: 4px; } code { padding: 2px 4px; font-size: 90%; color: #c7254e; white-space: nowrap; background-color: #f9f2f4; } pre { display: block; padding: 9.5px; margin: 0 0 10px; font-size: 13px; line-height: 20px; word-break: break-all; word-wrap: break-word; white-space: pre; white-space: pre-wrap; background-color: #f5f5f5; border: 1px solid #ccc; border: 1px solid rgba(0, 0, 0, 0.15); border-radius: 4px; } pre.prettyprint { margin-bottom: 20px; } pre code { padding: 0; color: inherit; white-space: pre; white-space: pre-wrap; background-color: transparent; border: 0; } .pre-scrollable { max-height: 340px; overflow-y: scroll; } .container { max-width: 940px; margin-right: auto; margin-left: auto; } .container:before, .container:after { display: table; content: " "; } .container:after { clear: both; } .row { margin-right: -10px; margin-left: -10px; } .row:before, .row:after { display: table; content: " "; } .row:after { clear: both; } [class^="span"] { padding-right: 10px; padding-left: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } [class*="span"].pull-right { float: right; } .btn { display: inline-block; padding: 6px 12px; margin-bottom: 0; font-size: 14px; font-weight: bold; line-height: 20px; text-align: center; vertical-align: middle; cursor: pointer; border: 1px solid #a7a9aa; border-radius: 4px; } .btn:focus { outline: thin dotted #333; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; } .btn:hover { color: #fff; text-decoration: none; } .btn:active, .btn.active { background-image: none; outline: 0; -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); } .btn.disabled, .btn[disabled], fieldset[disabled] .btn { cursor: default; opacity: 0.65; filter: alpha(opacity=65); -webkit-box-shadow: none; box-shadow: none; } .btn-large { padding: 11px 19px; font-size: 17.5px; border-radius: 6px; } .btn-small { padding: 2px 10px; font-size: 11.9px; border-radius: 3px; } .btn-mini [class^="icon-"], .btn-mini [class*=" icon-"] { margin-top: -1px; } .btn-mini { padding: 0 6px; font-size: 10.5px; border-radius: 3px; } .btn [class^="glyphicon-"]::before { vertical-align: -2px; } .btn-small [class^="glyphicon-"]::before, .btn-mini [class^="glyphicon-"]::before { vertical-align: -1px; } .btn-block { display: block; width: 100%; padding-right: 0; padding-left: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .btn-block + .btn-block { margin-top: 5px; } input[type="submit"].btn-block, input[type="reset"].btn-block, input[type="button"].btn-block { width: 100%; } .btn { color: #fff; background-color: #a7a9aa; border-color: #a7a9aa; } .btn:hover, .btn:focus, .btn:active { background-color: #9a9c9d; border-color: #8d9091; } .btn-primary { background-color: #428bca; border-color: #428bca; } .btn-primary:hover, .btn-primary:focus, .btn-primary:active { background-color: #357ebd; border-color: #3071a9; } .btn-warning { background-color: #f0ad4e; border-color: #f0ad4e; } .btn-warning:hover, .btn-warning:focus, .btn-warning:active { background-color: #eea236; border-color: #ec971f; } .btn-danger { background-color: #d9534f; border-color: #d9534f; } .btn-danger:hover, .btn-danger:focus, .btn-danger:active { background-color: #d43f3a; border-color: #c9302c; } .btn-success { background-color: #5cb85c; border-color: #5cb85c; } .btn-success:hover, .btn-success:focus, .btn-success:active { background-color: #4cae4c; border-color: #449d44; } .btn-link, .btn-link:active, .btn-link[disabled], fieldset[disabled] .btn-link { background-color: transparent; background-image: none; -webkit-box-shadow: none; box-shadow: none; } .btn-link, .btn-link:hover, .btn-link:active { border-color: transparent; } .btn-link { font-weight: normal; color: #428bca; cursor: pointer; border-radius: 0; } .btn-link:hover { color: #2a6496; text-decoration: underline; background-color: transparent; } .btn-link[disabled]:hover, fieldset[disabled] .btn-link:hover { color: #333333; text-decoration: none; } .fade { opacity: 0; -webkit-transition: opacity 0.15s linear; -moz-transition: opacity 0.15s linear; -o-transition: opacity 0.15s linear; transition: opacity 0.15s linear; } .fade.in { opacity: 1; } /*.collapse { position: relative; height: 0; overflow: hidden; .transition(height .35s ease); &.in { height: auto; } }*/ .collapse { position: relative; height: 0; overflow: hidden; -webkit-transition: height 0.35s ease; -moz-transition: height 0.35s ease; -o-transition: height 0.35s ease; transition: height 0.35s ease; } .collapse.in { height: auto; } .nav { padding-left: 0; margin-bottom: 0; margin-left: 0; list-style: none; } .nav:before, .nav:after { display: table; content: " "; } .nav:after { clear: both; } .nav > li { display: block; } .nav > li > a { position: relative; display: block; padding: 10px 15px; } .nav > li > a:hover { text-decoration: none; background-color: #eeeeee; } .nav-list > li > a { margin-bottom: -1px; border: 1px solid #e5e5e5; } .nav-list > li:first-child > a { border-top-right-radius: 4px; border-top-left-radius: 4px; } .nav-list > li:last-child > a { border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; } .nav-list > .active > a, .nav-list > .active > a:hover { z-index: 2; color: #fff; background-color: #428bca; border-color: #428bca; } /* // Prevent IE8 from misplacing imgs // See https://github.com/h5bp/html5-boilerplate/issues/984#issuecomment-3985989 .nav > li > a > img { max-width: none; } // Redeclare pull classes because of specifity .nav > .pull-right { float: right; } // Nav headers (for dropdowns and lists) .nav-header { display: block; padding: 3px 15px; font-size: 11px; font-weight: bold; line-height: @line-height-base; color: @grayLight; text-shadow: 0 1px 0 rgba(255,255,255,.5); text-transform: uppercase; } // Space them out when they follow another list item (link) .nav li + .nav-header { margin-top: 9px; } // Dividers (basically an hr) within the dropdown .nav .divider { .nav-divider(); } */ /* // Tabs // ------------------------- // Give the tabs something to sit on .nav-tabs { border-bottom: 1px solid #ddd; } // Make the list-items overlay the bottom border .nav-tabs > li { margin-bottom: -1px; } // Actual tabs (as links) .nav-tabs > li > a { margin-right: 2px; line-height: @line-height-base; border: 1px solid transparent; border-radius: @border-radius-base @border-radius-base 0 0; &:hover { border-color: @grayLighter @grayLighter #ddd; } } // Active state, and it's :hover to override normal :hover .nav-tabs > .active > a, .nav-tabs > .active > a:hover { color: @gray; background-color: @body-background; border: 1px solid #ddd; border-bottom-color: transparent; cursor: default; } // Pills // ------------------------- // Links rendered as pills .nav-pills > li > a { border-radius: 5px; } .nav-pills > li + li > a { margin-left: 2px; } // Active state .nav-pills > .active > a, .nav-pills > .active > a:hover { color: #fff; background-color: @link-color; } // Stacked pills .nav-stacked > li { float: none; } .nav-stacked > li + li > a { margin-top: 2px; margin-left: 0; // no need for the gap between nav items } // Justified navs // ------------------------- .nav-justified { // Negative margin doesn't work, so we hack it max-height: 37px; } .nav-justified > li { float: none; display: table-cell; width: 1%; text-align: center; } // Lists // ------------------------- .nav-list { background-color: #fff; border-radius: 6px; .box-shadow(0 1px 4px rgba(0,0,0,.065)) } .nav-list > li { float: none; } .nav-list > li > a { margin-bottom: -1px; // pull up the following link for a 1px border between border: 1px solid #e5e5e5; } .nav-list > li > a:hover { background-color: #f5f5f5; } .nav-list > li:first-child > a { border-radius: 6px 6px 0 0; } .nav-list > li:last-child > a { border-radius: 0 0 6px 6px; } .nav-list > .active > a, .nav-list > .active > a:hover { position: relative; z-index: 2; padding: 9px 15px; color: #fff; text-shadow: 0 1px 0 rgba(0,0,0,.15); background-color: @link-color; border-width: 0; .box-shadow(~"inset 1px 0 0 rgba(0,0,0,.1), inset -1px 0 0 rgba(0,0,0,.1)") } // Dropdowns // ------------------------- .nav-tabs .dropdown-menu { // Remove the top rounded corners here since there is a hard edge above the menu .border-top-radius(0); } // Default dropdown links // ------------------------- // Make carets use linkColor to start .nav .dropdown-toggle .caret { border-top-color: @link-color; border-bottom-color: @link-color; margin-top: 8px; } .nav .dropdown-toggle:hover .caret { border-top-color: @link-color-hover; border-bottom-color: @link-color-hover; } // Active dropdown links // ------------------------- .nav .active .dropdown-toggle .caret { border-top-color: #fff; border-bottom-color: #fff; } .nav-tabs .active .dropdown-toggle .caret { border-top-color: @gray; border-bottom-color: @gray; } // Active:hover dropdown links // ------------------------- .nav > .dropdown.active > a:hover { cursor: pointer; } // Open dropdowns // ------------------------- .nav-tabs .open .dropdown-toggle, .nav-pills .open .dropdown-toggle, .nav > li.dropdown.open.active > a:hover { color: #fff; background-color: @grayLight; border-color: @grayLight; } .nav li.dropdown.open .caret, .nav li.dropdown.open.active .caret, .nav li.dropdown.open a:hover .caret { border-top-color: #fff; border-bottom-color: #fff; .opacity(100); } // Dropdowns in stacked tabs .tabs-stacked .open > a:hover { border-color: @grayLight; } // Tabbable tabs // ------------------------- // Clear any floats .tabbable { .clearfix(); } // Show/hide tabbable areas .tab-content > .tab-pane, .pill-content > .pill-pane { display: none; } .tab-content > .active, .pill-content > .active { display: block; } // Disabled state // ------------------------- // Gray out text .nav > .disabled > a { color: @grayLight; } // Nuke hover effects .nav > .disabled > a:hover { text-decoration: none; background-color: transparent; cursor: default; } */ .navbar { padding: 15px; background-color: #eee; } .navbar:before, .navbar:after { display: table; content: " "; } .navbar:after { clear: both; } .navbar .brand { display: inline-block; padding: 7px 15px; font-size: 18px; font-weight: bold; line-height: 1; } .navbar .brand:hover { text-decoration: none; background-color: #ddd; } .btn-navbar { float: right; padding: 10px 12px; background-color: #ddd; border: 0; border-radius: 4px; } .btn-navbar .icon-bar { display: block; width: 20px; height: 2px; background-color: #fff; border-radius: 1px; } .btn-navbar .icon-bar + .icon-bar { margin-top: 3px; } .navbar .nav { margin-top: 15px; } .navbar .nav > li > a { line-height: 20px; } .navbar .nav > li > a:hover { background-color: #ddd; } .navbar .nav > .active > a { background-color: #ddd; } .navbar-inverse { background-color: #222; } .navbar-inverse .brand { color: #fff; } .navbar-inverse .brand:hover { background-color: #333; } .navbar-inverse .nav > li > a { color: #fff; } .navbar-inverse .nav > li > a:hover { background-color: #333; } .navbar-inverse .nav > .active > a { background-color: #333; } .navbar-inverse .btn-navbar { background-color: #444; } /* // COMMON STYLES // ------------- // Base class and wrapper .navbar { overflow: visible; padding: 0 20px; margin-bottom: @line-height-base; background-color: @navbar-background; border-radius: @border-radius-base; // Prevent floats from breaking the navbar .clearfix(); } // Set width to auto for default container // We then reset it for fixed navbars in the #gridSystem mixin .navbar .container { width: auto; } // Override the default collapsed state .nav-collapse.collapse { height: auto; overflow: visible; } // Brand: website or project name // ------------------------- .navbar .brand { float: left; display: block; // Vertically center the text given @navbar-height padding: ((@navbar-height - @line-height-base) / 2) 20px ((@navbar-height - @line-height-base) / 2); margin-left: -20px; // negative indent to left-align the text down the page font-size: 20px; font-weight: 200; color: @navbar-brand-color; text-shadow: 0 1px 0 @navbar-background-highlight; &:hover { text-decoration: none; } } // Plain text in topbar // ------------------------- .navbar-text { margin-bottom: 0; line-height: @navbar-height; color: @navbar-text; } // Janky solution for now to account for links outside the .nav // ------------------------- .navbar-link { color: @navbar-link-color; &:hover { color: @navbar-link-color-hover; } } // Dividers in navbar // ------------------------- .navbar .divider-vertical { height: @navbar-height; margin: 0 9px; border-left: 1px solid @navbar-background; border-right: 1px solid @navbar-background-highlight; } // Buttons in navbar // ------------------------- .navbar .btn, .navbar .btn-group { .navbarVerticalAlign(30px); // Vertically center in navbar } .navbar .btn-group .btn, .navbar .input-prepend .btn, .navbar .input-append .btn { margin-top: 0; // then undo the margin here so we don't accidentally double it } // Navbar forms // ------------------------- .navbar-form { margin-bottom: 0; // remove default bottom margin .clearfix(); input, select, .radio, .checkbox { .navbarVerticalAlign(30px); // Vertically center in navbar } input, select, .btn { display: inline-block; margin-bottom: 0; } input[type="image"], input[type="checkbox"], input[type="radio"] { margin-top: 3px; } .input-append, .input-prepend { margin-top: 5px; white-space: nowrap; // preven two items from separating within a .navbar-form that has .pull-left input { margin-top: 0; // remove the margin on top since it's on the parent } } } // Navbar search // ------------------------- .navbar-search { position: relative; float: left; .navbarVerticalAlign(30px); // Vertically center in navbar margin-bottom: 0; .search-query { margin-bottom: 0; padding: 4px 14px; #font > .sans-serif(13px, normal, 1); border-radius: 15px; // redeclare because of specificity of the type attribute } } // Static navbar // ------------------------- .navbar-static-top { position: static; margin-bottom: 0; // remove 18px margin for default navbar border-radius: 0; } // Fixed navbar // ------------------------- // Shared (top/bottom) styles .navbar-fixed-top, .navbar-fixed-bottom { position: fixed; right: 0; left: 0; z-index: @zindex-navbar-fixed; margin-bottom: 0; // remove 18px margin for default navbar border-radius: 0; } // Reset container width // Required here as we reset the width earlier on and the grid mixins don't override early enough .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container { #grid > .core > .span(@grid-columns); } // Fixed to top .navbar-fixed-top { top: 0; } // Fixed to bottom .navbar-fixed-bottom { bottom: 0; } // NAVIGATION // ---------- .navbar .nav { position: relative; left: 0; display: block; float: left; margin: 0 10px 0 0; } .navbar .nav.pull-right { float: right; // redeclare due to specificity margin-right: 0; // remove margin on float right nav } .navbar .nav > li { float: left; } // Links .navbar .nav > li > a { float: none; // Vertically center the text given @navbar-height padding: ((@navbar-height - @line-height-base) / 2) 15px ((@navbar-height - @line-height-base) / 2); color: @navbar-link-color; text-decoration: none; text-shadow: 0 1px 0 @navbar-background-highlight; } .navbar .nav .dropdown-toggle .caret { margin-top: 8px; } // Hover .navbar .nav > li > a:focus, .navbar .nav > li > a:hover { background-color: @navbar-link-background-hover; // "transparent" is default to differentiate :hover from .active color: @navbar-link-color-hover; text-decoration: none; } // Active nav items .navbar .nav > .active > a, .navbar .nav > .active > a:hover, .navbar .nav > .active > a:focus { color: @navbar-link-color-active; text-decoration: none; background-color: @navbar-link-background-active; } // Navbar button for toggling navbar items in responsive layouts // These definitions need to come after '.navbar .btn' .navbar .btn-navbar { display: none; float: right; padding: 7px 10px; margin-left: 5px; margin-right: 5px; .buttonBackground(darken(@navbar-background-highlight, 5%), darken(@navbar-background, 5%)); .box-shadow(~"inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.075)"); } .navbar .btn-navbar .icon-bar { display: block; width: 18px; height: 2px; background-color: #f5f5f5; border-radius: 1px; .box-shadow(0 1px 0 rgba(0,0,0,.25)); } .btn-navbar .icon-bar + .icon-bar { margin-top: 3px; } // Dropdown menus // -------------- // Menu position and menu carets .navbar .nav > li > .dropdown-menu { &:before { content: ''; display: inline-block; border-left: 7px solid transparent; border-right: 7px solid transparent; border-bottom: 7px solid #ccc; border-bottom-color: @dropdown-border; position: absolute; top: -7px; left: 9px; } &:after { content: ''; display: inline-block; border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 6px solid @dropdown-background; position: absolute; top: -6px; left: 10px; } } // Menu position and menu caret support for dropups via extra dropup class .navbar-fixed-bottom .nav > li > .dropdown-menu { &:before { border-top: 7px solid #ccc; border-top-color: @dropdown-border; border-bottom: 0; bottom: -7px; top: auto; } &:after { border-top: 6px solid @dropdown-background; border-bottom: 0; bottom: -6px; top: auto; } } // Caret should match text color on hover .navbar .nav li.dropdown > a:hover .caret { border-top-color: @navbar-link-color-hover; border-bottom-color: @navbar-link-color-hover; } // Remove background color from open dropdown .navbar .nav li.dropdown.open > .dropdown-toggle, .navbar .nav li.dropdown.active > .dropdown-toggle, .navbar .nav li.dropdown.open.active > .dropdown-toggle { background-color: @navbar-link-background-active; color: @navbar-link-color-active; } .navbar .nav li.dropdown > .dropdown-toggle .caret { border-top-color: @navbar-link-color; border-bottom-color: @navbar-link-color; } .navbar .nav li.dropdown.open > .dropdown-toggle .caret, .navbar .nav li.dropdown.active > .dropdown-toggle .caret, .navbar .nav li.dropdown.open.active > .dropdown-toggle .caret { border-top-color: @navbar-link-color-active; border-bottom-color: @navbar-link-color-active; } // Right aligned menus need alt position .navbar .pull-right > li > .dropdown-menu, .navbar .nav > li > .dropdown-menu.pull-right { left: auto; right: 0; &:before { left: auto; right: 12px; } &:after { left: auto; right: 13px; } .dropdown-menu { left: auto; right: 100%; margin-left: 0; margin-right: -1px; border-radius: 6px 0 6px 6px; } } // Inverted navbar // ------------------------- .navbar-inverse { background-color: @navbar-inverse-background; .brand, .nav > li > a { color: @navbar-inverse-link-color; text-shadow: 0 -1px 0 rgba(0,0,0,.25); &:hover { color: @navbar-inverse-link-color-hover; } } .brand { color: @navbar-inverse-brand-color; } .navbar-text { color: @navbar-inverse-text; } .nav > li > a:focus, .nav > li > a:hover { background-color: @navbar-inverse-link-background-hover; color: @navbar-inverse-link-color-hover; } .nav .active > a, .nav .active > a:hover, .nav .active > a:focus { color: @navbar-inverse-link-color-active; background-color: @navbar-inverse-link-background-active; } // Inline text links .navbar-link { color: @navbar-inverse-link-color; &:hover { color: @navbar-inverse-link-color-hover; } } // Dividers in navbar .divider-vertical { border-left-color: @navbar-inverse-background; border-right-color: @navbar-inverse-background-highlight; } // Dropdowns .nav li.dropdown.open > .dropdown-toggle, .nav li.dropdown.active > .dropdown-toggle, .nav li.dropdown.open.active > .dropdown-toggle { background-color: @navbar-inverse-link-background-active; color: @navbar-inverse-link-color-active; } .nav li.dropdown > a:hover .caret { border-top-color: @navbar-inverse-link-color-active; border-bottom-color: @navbar-inverse-link-color-active; } .nav li.dropdown > .dropdown-toggle .caret { border-top-color: @navbar-inverse-link-color; border-bottom-color: @navbar-inverse-link-color; } .nav li.dropdown.open > .dropdown-toggle .caret, .nav li.dropdown.active > .dropdown-toggle .caret, .nav li.dropdown.open.active > .dropdown-toggle .caret { border-top-color: @navbar-inverse-link-color-active; border-bottom-color: @navbar-inverse-link-color-active; } // Navbar search .navbar-search { .search-query { color: #fff; background-color: @navbar-inverse-search-background; border-color: @navbar-inverse-search-border; .box-shadow(~"inset 0 1px 2px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.15)"); .transition(none); .placeholder(@navbar-inverse-search-placeholder-color); // Focus states (we use .focused since IE8 and down doesn't support :focus) &:focus, &.focused { padding: 5px 15px; color: @grayDark; text-shadow: 0 1px 0 #fff; background-color: @navbar-inverse-search-background-focus; border: 0; .box-shadow(0 0 3px rgba(0,0,0,.15)); outline: 0; } } } // Navbar collapse button .btn-navbar { .buttonBackground(darken(@navbar-inverse-background-highlight, 5%), darken(@navbar-inverse-background, 5%)); } } */ @media screen and (min-width: 768px) { [class^="span"] { float: left; } .span1 { width: 8.3333333%; } .span2 { width: 16.6666667%; } .span3 { width: 25%; } .span4 { width: 33.3333333%; } .span5 { width: 41.666666667%; } .span6 { width: 50%; } .span7 { width: 58.333333333%; } .span8 { width: 66.666666667%; } .span9 { width: 75%; } .span10 { width: 83.333333333%; } .span11 { width: 91.666666667%; } } @media screen and (min-width: 992px) { { /* body { font-size: 1.6rem; font-size: 16px; } */ /* Required to make the collapsing navbar work on regular desktops */ } .container { width: 940px; margin-right: auto; margin-left: auto; } .navbar { padding-top: 0; padding-bottom: 0; } .navbar .brand { float: left; padding-top: 11px; padding-bottom: 11px; margin-left: -15px; } .navbar .nav { margin-top: 0; overflow: hidden; } .navbar .nav > li { float: left; } .navbar .nav > li > a { padding-top: 10px; padding-bottom: 10px; } .navbar .btn-navbar { display: none; } .nav-collapse.collapse { float: left; height: auto !important; overflow: visible !important; } } /* // Grid system and page structure @import "grid.less"; // Base CSS @import "type.less"; @import "code.less"; @import "forms.less"; @import "tables.less"; // Components: common @import "glyphicons.less"; @import "dropdowns.less"; @import "wells.less"; @import "component-animations.less"; @import "close.less"; // Components: Buttons & Alerts @import "buttons.less"; @import "button-groups.less"; @import "alerts.less"; // Components: Nav @import "navs.less"; @import "navbar.less"; @import "breadcrumbs.less"; @import "pagination.less"; @import "pager.less"; // Components: Popovers @import "modals.less"; @import "tooltip.less"; @import "popovers.less"; // Components: Misc @import "thumbnails.less"; @import "media.less"; @import "badges.less"; @import "progress-bars.less"; @import "accordion.less"; @import "carousel.less"; @import "jumbotron.less"; // Utility classes @import "utilities.less"; // Has to be last to override when necessary // Responsive // ------------------------------------------------------------- // Responsive utility classes @import "responsive-utilities.less"; // Media queries // ------------------ // Large desktops @import "responsive-1200px-min.less"; // Tablets to regular desktops @import "responsive-768px-979px.less"; // Phones to portrait tablets and narrow desktops @import "responsive-767px-max.less"; // Responsive navbar // From 979px and below, show a button to toggle navbar contents @import "responsive-navbar.less"; */