/* ========================================================================== NMC Bootstrap This LESS file imports all other LESS files. You should compile and minify this file before site launch. ========================================================================== */ /* Import NMC bootstrap */ /** * html5doctor.com Reset Stylesheet * v1.6.1 * Last Updated: 2010-09-17 * Author: Richard Clark - http://richclarkdesign.com * Twitter: @rich_clark */ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; } body { line-height: 1; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } nav ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } a { margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; } /* change colours to suit your needs */ ins { background-color: #ff9; color: #000; text-decoration: none; } /* change colours to suit your needs */ mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; } del { text-decoration: line-through; } abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; } table { border-collapse: collapse; border-spacing: 0; } /* change border colour to suit your needs */ hr { display: block; height: 1px; border: 0; border-top: 1px solid #cccccc; margin: 1em 0; padding: 0; } input, select { vertical-align: middle; } /*--------------------------------------------------- LESS Prefixer --------------------------------------------------- All of the CSS3 fun, none of the prefixes! As a rule, you can use the CSS properties you would expect just by adding a '.': box-shadow => .box-shadow(@args) Also, when shorthand is available, arguments are not parameterized. Learn CSS, not LESS Prefixer. ------------------------------------------------- TABLE OF CONTENTS (*) denotes a syntax-sugar helper ------------------------------------------------- .animation(@args) .animation-delay(@delay) .animation-direction(@direction) .animation-duration(@duration) .animation-iteration-count(@count) .animation-name(@name) .animation-play-state(@state) .animation-timing-function(@function) .background-size(@args) .border-radius(@args) .box-shadow(@args) .inner-shadow(@args) * .box-sizing(@args) .border-box() * .content-box() * .columns(@args) .column-count(@count) .column-gap(@gap) .column-rule(@args) .column-width(@width) .gradient(@default,@start,@stop) * .linear-gradient-top(@default,@color1,@stop1,@color2,@stop2,[@color3,@stop3,@color4,@stop4])* .linear-gradient-left(@default,@color1,@stop1,@color2,@stop2,[@color3,@stop3,@color4,@stop4])* .opacity(@factor) .transform(@args) .rotate(@deg) .scale(@factor) .translate(@x,@y) .translate3d(@x,@y,@z) .translateHardware(@x,@y) * .text-shadow(@args) .transition(@args) .transition-delay(@delay) .transition-duration(@duration) .transition-property(@property) .transition-timing-function(@function) Credit to LESS Elements for the motivation and to CSS3Please.com for implementation. Copyright (c) 2012 Joel Sutherland MIT Licensed: http://www.opensource.org/licenses/mit-license.php -----------------------------------------------------*/ /* Animation */ /* Background Size */ /* Border Radius */ /* Box Shadows */ /* Box Sizing */ /* Columns */ /* Gradients */ /* Opacity */ /* Text Shadow */ /* Transforms */ /* Transitions */ /** * Spacing * * This LESS file defines margins and paddings for block-level * elements. Helper classes are included for use elsewhere * in site styles. */ /* Settings */ /* ========================================================================== Spacing ========================================================================== */ /* ========================================================================== Typography ========================================================================== */ /* ========================================================================== Grid ========================================================================== */ /* ========================================================================== Buttons ========================================================================== */ /* ========================================================================== Site Variables ========================================================================== */ /* ========================================================================== Spacing ========================================================================== */ /* ========================================================================== Typography ========================================================================== */ /* ========================================================================== Grid ========================================================================== */ /* ========================================================================== Buttons ========================================================================== */ /* @baseline: @baseline; */ /** * Spacing * p, m, lh = padding, margin, line-height * a, t, r, b, l, h, v = all, top, right, bottom, left, horizontal, vertical * n, h, s, d = none(0px), half(@baseline / 2), single(@baseline), double(@baseline * 2), none(0px) */ .ptn, .pvn, .pan { padding-top: 0px !important; } .pth, .pvh, .pah { padding-top: 10px !important; } .pts, .pvs, .pas { padding-top: 20px !important; } .ptd, .pvd, .pad { padding-top: 40px !important; } .prn, .phn, .pan { padding-right: 0px !important; } .prh, .phh, .pah { padding-right: 10px !important; } .prs, .phs, .pas { padding-right: 20px !important; } .prd, .phd, .pad { padding-right: 40px !important; } .pbn, .pvn, .pan { padding-bottom: 0px !important; } .pbh, .pvh, .pah { padding-bottom: 10px !important; } .pbs, .pvs, .pas { padding-bottom: 20px !important; } .pbd, .pvd, .pad { padding-bottom: 40px !important; } .pln, .phn, .pan { padding-left: 0px !important; } .plh, .phh, .pah { padding-left: 10px !important; } .pls, .phs, .pas { padding-left: 20px !important; } .pld, .phd, .pad { padding-left: 40px !important; } .mtn, .mvn, .man { margin-top: 0px !important; } .mth, .mvh, .mah { margin-top: 10px !important; } .mts, .mvs, .mas { margin-top: 20px !important; } .mtd, .mvd, .mad { margin-top: 40px !important; } .mrn, .mhn, .man { margin-right: 0px !important; } .mrh, .mhh, .mah { margin-right: 10px !important; } .mrs, .mhs, .mas { margin-right: 20px !important; } .mrd, .mhd, .mad { margin-right: 40px !important; } .mbn, .mvn, .man { margin-bottom: 0px !important; } .mbh, .mvh, .mah { margin-bottom: 10px !important; } .mbs, .mvs, .mas { margin-bottom: 20px !important; } .mbd, .mvd, .mad { margin-bottom: 40px !important; } .mln, .mhn, .man { margin-left: 0px !important; } .mlh, .mhh, .mah { margin-left: 10px !important; } .mls, .mhs, .mas { margin-left: 20px !important; } .mld, .mhd, .mad { margin-left: 40px !important; } .lhh { line-height: 10px !important; } .lhs { line-height: 20px !important; } .lhd { line-height: 40px !important; } .lhn { line-height: 0px !important; } /** * Name Here * * @version 1.0 * @package Name Here * @author New Media Campaigns * @copyright 2012 New Media Campaigns * @link http://www.newmediacampaigns.com * * Copyright (c) 2012 New Media Campaigns * * Permission is hereby granted, free of charge, to any person obtaining a copy * of this software and associated documentation files (the "Software"), to deal * in the Software without restriction, including without limitation the rights * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell * copies of the Software, and to permit persons to whom the Software is furnished * to do so, subject to the following conditions: * * The above copyright notice and this permission notice shall be included in all * copies or substantial portions of the Software. * * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN * THE SOFTWARE. */ /** * Typography * * This LESS file defines the baseline, color, font-size, and other typographical * styles for text elements. */ /* Settings */ /* ========================================================================== Spacing ========================================================================== */ /* ========================================================================== Typography ========================================================================== */ /* ========================================================================== Grid ========================================================================== */ /* ========================================================================== Buttons ========================================================================== */ /* ========================================================================== Site Variables ========================================================================== */ /* ========================================================================== Spacing ========================================================================== */ /* ========================================================================== Typography ========================================================================== */ /* ========================================================================== Grid ========================================================================== */ /* ========================================================================== Buttons ========================================================================== */ /* @baseline: @baseline; @body-color: @body-color; @body-font-family: @body-font-family; @body-font-size: @body-font-size; @body-accent-color: @body-accent-color; @header-color: @header-clor; @header-font-family: @header-font-family; @header-font-weight: @header-font-weight; */ /* Base */ html, body { font-family: "Droid Serif", Georgia, "Times New Roman", Times, serif; color: #666666; font-size: 14px; line-height: 20px !important; } /* Block-level */ h1, h2, h3, h4, h5, h6, ul, ol, dl, p, blockquote, table, form, pre { margin-bottom: 20px !important; } /* Headers */ .all-headers { color: #111111; font-family: "Droid Serif", Georgia, "Times New Roman", Times, serif; font-weight: 700; } h1, .alpha { color: #111111; font-family: "Droid Serif", Georgia, "Times New Roman", Times, serif; font-weight: 700; font-size: 35px; line-height: 40px !important; } h2, .beta { color: #111111; font-family: "Droid Serif", Georgia, "Times New Roman", Times, serif; font-weight: 700; font-size: 24.5px; line-height: 40px !important; } h3, .gamma { color: #111111; font-family: "Droid Serif", Georgia, "Times New Roman", Times, serif; font-weight: 700; font-size: 16.8px; line-height: 40px !important; margin-bottom: 0px !important; } h4, .delta { color: #111111; font-family: "Droid Serif", Georgia, "Times New Roman", Times, serif; font-weight: 700; font-size: 14px; line-height: 40px !important; margin-bottom: 0px !important; } h5, .epsilon { color: #111111; font-family: "Droid Serif", Georgia, "Times New Roman", Times, serif; font-weight: 700; font-size: 14px; line-height: 20px !important; margin-bottom: 0px !important; } h6, .zeta { color: #111111; font-family: "Droid Serif", Georgia, "Times New Roman", Times, serif; font-weight: 700; font-size: 14px; line-height: 20px !important; margin-bottom: 0px !important; } /* Headers (above scale) */ .giga { color: #111111; font-family: "Droid Serif", Georgia, "Times New Roman", Times, serif; font-weight: 700; font-size: 84px; line-height: 80px; } .mega { color: #111111; font-family: "Droid Serif", Georgia, "Times New Roman", Times, serif; font-weight: 700; font-size: 70px; line-height: 60px; } .kilo { color: #111111; font-family: "Droid Serif", Georgia, "Times New Roman", Times, serif; font-weight: 700; font-size: 56px; line-height: 60px; } /* Headers (below scale) */ .milli { color: #111111; font-family: "Droid Serif", Georgia, "Times New Roman", Times, serif; font-weight: 700; font-size: 11.200000000000001px; } /* Text */ a { color: #000000; } a:link { text-decoration: underline; } a:hover { text-decoration: none; } small { font-size: 80%; } sup, sub { font-size: 80%; line-height: 0px !important; } sup { vertical-align: super; } sub { vertical-align: sub; } .lead { color: #333333; font-size: 16px; } blockquote { border-left: 5px solid rgba(0, 0, 0, 0.1); margin-right: 20px !important; margin-left: 20px !important; padding-left: 20px !important; color: #999999; font-size: 16px; font-style: italic; } blockquote :last-child { margin-bottom: 0px !important; } blockquote small { color: rgba(0, 0, 0, 0.5); font-size: 14px; font-style: normal; } pre, code, kbd { background: #F8F8F8; border: 1px solid #EAEAEA; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; margin: 0 2px; padding: 0 5px; font-family: Consolas, "Courier New", Courier, mono; font-size: 12.6px; color: #666666; word-wrap: break-word; } pre { margin-right: 20px !important; margin-left: 20px !important; padding-top: 10px !important; padding-right: 10px !important; padding-bottom: 10px !important; padding-left: 10px !important; } pre code { border: none; margin-top: 0px !important; margin-right: 0px !important; margin-bottom: 0px !important; margin-left: 0px !important; padding-top: 0px !important; padding-right: 0px !important; padding-bottom: 0px !important; padding-left: 0px !important; } a code { background: none; border: none; padding-top: 0px !important; padding-right: 0px !important; padding-bottom: 0px !important; padding-left: 0px !important; margin-top: 0px !important; margin-right: 0px !important; margin-bottom: 0px !important; margin-left: 0px !important; } strong { font-weight: bold; } em { font-style: italic; } ol, ul, dl { margin-left: 20px !important; padding-left: 20px !important; } ol ol, ul ol, dl ol, ol ul, ul ul, dl ul { margin-bottom: 0px !important; } dt { font-weight: bold; } dd { margin-left: 20px !important; } .table { border-collapse: collapse; border-spacing: 0; width: 100%; } .table th, .table td { border-top: 1px solid rgba(0, 0, 0, 0.1); padding: 8px; text-align: left; } .table thead th { vertical-align: bottom; font-weight: bold; } .table thead tr:first-child th { border-top: none; } .table-bordered { border: 1px solid rgba(0, 0, 0, 0.1); border-collapse: separate; border-left: none; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; } .table-bordered th, .table-bordered td { border-left: 1px solid rgba(0, 0, 0, 0.1); } .table-bordered thead:last-child tr:last-child th:first-child, .table-bordered tbody:last-child tr:last-child td:first-child { -webkit-border-radius: 0 0 0 4px; -moz-border-radius: 0 0 0 4px; border-radius: 0 0 0 4px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; } .table-striped tbody tr:nth-child(odd) td { background: rgba(0, 0, 0, 0.04); } /* ========================================================================== Alerts ========================================================================== */ .alert { background: #FCF8E3; border: 1px solid #FBEED5; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; margin-bottom: 20px !important; padding-top: 10px !important; padding-right: 10px !important; padding-bottom: 10px !important; padding-left: 10px !important; color: #C09853; } .alert-success { background: #FCF8E3; border: 1px solid #FBEED5; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; margin-bottom: 20px !important; padding-top: 10px !important; padding-right: 10px !important; padding-bottom: 10px !important; padding-left: 10px !important; color: #C09853; background-color: #DFF0D8; border-color: #D6E9C6; color: #468847; } .alert-error { background: #FCF8E3; border: 1px solid #FBEED5; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; margin-bottom: 20px !important; padding-top: 10px !important; padding-right: 10px !important; padding-bottom: 10px !important; padding-left: 10px !important; color: #C09853; background-color: #F2DEDE; border-color: #EED3D7; color: #B94A48; } .alert-info { background: #FCF8E3; border: 1px solid #FBEED5; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; margin-bottom: 20px !important; padding-top: 10px !important; padding-right: 10px !important; padding-bottom: 10px !important; padding-left: 10px !important; color: #C09853; background-color: #D9EDF7; border-color: #BCE8F1; color: #3A87AD; } /* ========================================================================== Forms ========================================================================== */ label { display: block; font-weight: bold; } label .req { color: #000000; font-weight: bold; } input.text, textarea, select, .radio-group, .checkbox-group { margin-bottom: 20px !important; } input.text, textarea { border: none; margin: 0; padding: 0; -webkit-appearance: none; background: #EEE; border: 1px solid #CCC; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; -webkit-box-shadow: inset rgba(0, 0, 0, 0.1) 0 1px 3px; -moz-box-shadow: inset rgba(0, 0, 0, 0.1) 0 1px 3px; box-shadow: inset rgba(0, 0, 0, 0.1) 0 1px 3px; height: 30px; padding-top: 10px !important; padding-right: 10px !important; padding-bottom: 10px !important; padding-left: 10px !important; width: 100%; } textarea { height: 120px; } select { min-width: 30%; } .checkbox-group label, .radio-group label { font-weight: normal; } .error { background-color: #F2DEDE !important; border-color: red !important; outline-color: red !important; color: red !important; } /** * New Media Campaigns Idioms * * These are common patterns we use in all of our * projects. They are consolidated here to keep code DRY. * * Listing * * .no-text, .text-replace * * .no-list * * .no-form * * .fixed-width(@width) * * .column-width(@width) * * .column-left(@width) * * .column-right(@width) * * .full-size * * .absolute-default * * .absolute-fullsize * * .clearfix */ /* Hides text when using image replacement */ .no-text, .text-replace { overflow: hidden; text-indent: 100%; white-space: nowrap; } /* Removes bullets, margin, and padding from list */ .no-list { list-style: none; margin: 0; padding: 0; } /* Removes webkit styling from form element */ .no-form { border: none; margin: 0; padding: 0; -webkit-appearance: none; } /* Center a fixed width container */ /* Adds left or right columns (e.g. content and sidebar) */ /* Set width and height of element to that of its parent */ .full-size { height: 100%; width: 100%; } /* Position element absolutely to 0,0 */ .absolute-default { position: absolute; left: 0; top: 0; } /* Position element absolutely and set its width and height to that of its parent (useful for slideshows) */ .absolute-fullsize { position: absolute; left: 0; top: 0; height: 100%; width: 100%; } /* The micro clearfix http://nicolasgallagher.com/micro-clearfix-hack/ */ .clearfix { *zoom: 1; } .clearfix:before, .clearfix:after { content: ""; display: table; } .clearfix:after { clear: both; } /** * Hybrid Grid Sytem * * Blend of the Semantic Grid System and Zurb Foundation with a little Twitter Bootstrap */ /* Settings */ /* ========================================================================== Spacing ========================================================================== */ /* ========================================================================== Typography ========================================================================== */ /* ========================================================================== Grid ========================================================================== */ /* ========================================================================== Buttons ========================================================================== */ /* ========================================================================== Site Variables ========================================================================== */ /* ========================================================================== Spacing ========================================================================== */ /* ========================================================================== Typography ========================================================================== */ /* ========================================================================== Grid ========================================================================== */ /* ========================================================================== Buttons ========================================================================== */ /* @fixed-column-width: 40px; @fixed-gutter-width: 20px; @fixed-columns: 12; @fluid-column-width: 4.3%; @fluid-gutter-width: 4.4%; @fluid-columns: 12; @mobile-break-width: 480px; @mobile-column-width: 8.6%; @mobile-gutter-width: 8.8%; @mobile-columns: 6; */ /* Grid */ .grid-fixed, .grid-fluid { *zoom: 1; } .grid-fixed:before, .grid-fluid:before, .grid-fixed:after, .grid-fluid:after { content: ""; display: table; } .grid-fixed:after, .grid-fluid:after { clear: both; } .grid-fixed .row, .grid-fluid .row { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; display: block; width: 100%; margin: 0 auto; *zoom: 1; } .grid-fixed .row:before, .grid-fluid .row:before, .grid-fixed .row:after, .grid-fluid .row:after { content: ""; display: table; } .grid-fixed .row:after, .grid-fluid .row:after { clear: both; } .grid-fixed .row .center, .grid-fluid .row .center, .grid-fixed .row .center:last-child, .grid-fluid .row .center:last-child { float: none; display: block; margin: 0 auto; } .grid-fixed { width: 940px; /* This is duplicated in both classes. Unavoidable. */ } .grid-fixed .col12 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 940px; margin-left: 20px; position: relative; display: inline; float: left; min-height: 1px; } .grid-fixed .col12:first-child { margin-left: 0; } .grid-fixed .col12:last-child { float: right; } .grid-fixed .col11 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 860px; margin-left: 20px; position: relative; display: inline; float: left; min-height: 1px; } .grid-fixed .col11:first-child { margin-left: 0; } .grid-fixed .col11:last-child { float: right; } .grid-fixed .col10 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 780px; margin-left: 20px; position: relative; display: inline; float: left; min-height: 1px; } .grid-fixed .col10:first-child { margin-left: 0; } .grid-fixed .col10:last-child { float: right; } .grid-fixed .col9 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 700px; margin-left: 20px; position: relative; display: inline; float: left; min-height: 1px; } .grid-fixed .col9:first-child { margin-left: 0; } .grid-fixed .col9:last-child { float: right; } .grid-fixed .col8 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 620px; margin-left: 20px; position: relative; display: inline; float: left; min-height: 1px; } .grid-fixed .col8:first-child { margin-left: 0; } .grid-fixed .col8:last-child { float: right; } .grid-fixed .col7 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 540px; margin-left: 20px; position: relative; display: inline; float: left; min-height: 1px; } .grid-fixed .col7:first-child { margin-left: 0; } .grid-fixed .col7:last-child { float: right; } .grid-fixed .col6 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 460px; margin-left: 20px; position: relative; display: inline; float: left; min-height: 1px; } .grid-fixed .col6:first-child { margin-left: 0; } .grid-fixed .col6:last-child { float: right; } .grid-fixed .col5 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 380px; margin-left: 20px; position: relative; display: inline; float: left; min-height: 1px; } .grid-fixed .col5:first-child { margin-left: 0; } .grid-fixed .col5:last-child { float: right; } .grid-fixed .col4 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 300px; margin-left: 20px; position: relative; display: inline; float: left; min-height: 1px; } .grid-fixed .col4:first-child { margin-left: 0; } .grid-fixed .col4:last-child { float: right; } .grid-fixed .col3 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 220px; margin-left: 20px; position: relative; display: inline; float: left; min-height: 1px; } .grid-fixed .col3:first-child { margin-left: 0; } .grid-fixed .col3:last-child { float: right; } .grid-fixed .col2 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 140px; margin-left: 20px; position: relative; display: inline; float: left; min-height: 1px; } .grid-fixed .col2:first-child { margin-left: 0; } .grid-fixed .col2:last-child { float: right; } .grid-fixed .col1 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 60px; margin-left: 20px; position: relative; display: inline; float: left; min-height: 1px; } .grid-fixed .col1:first-child { margin-left: 0; } .grid-fixed .col1:last-child { float: right; } .grid-fixed .offset11 { margin-left: 900px; } .grid-fixed .offset10 { margin-left: 820px; } .grid-fixed .offset9 { margin-left: 740px; } .grid-fixed .offset8 { margin-left: 660px; } .grid-fixed .offset7 { margin-left: 580px; } .grid-fixed .offset6 { margin-left: 500px; } .grid-fixed .offset5 { margin-left: 420px; } .grid-fixed .offset4 { margin-left: 340px; } .grid-fixed .offset3 { margin-left: 260px; } .grid-fixed .offset2 { margin-left: 180px; } .grid-fixed .offset1 { margin-left: 100px; } .grid-fixed .push11 { left: 880px; } .grid-fixed .push10 { left: 800px; } .grid-fixed .push9 { left: 720px; } .grid-fixed .push8 { left: 640px; } .grid-fixed .push7 { left: 560px; } .grid-fixed .push6 { left: 480px; } .grid-fixed .push5 { left: 400px; } .grid-fixed .push4 { left: 320px; } .grid-fixed .push3 { left: 240px; } .grid-fixed .push2 { left: 160px; } .grid-fixed .push1 { left: 80px; } .grid-fixed .pull11 { right: 880px; } .grid-fixed .pull10 { right: 800px; } .grid-fixed .pull9 { right: 720px; } .grid-fixed .pull8 { right: 640px; } .grid-fixed .pull7 { right: 560px; } .grid-fixed .pull6 { right: 480px; } .grid-fixed .pull5 { right: 400px; } .grid-fixed .pull4 { right: 320px; } .grid-fixed .pull3 { right: 240px; } .grid-fixed .pull2 { right: 160px; } .grid-fixed .pull1 { right: 80px; } .grid-fluid { width: 100%; /* This is duplicated in both classes. Unavoidable. */ } .grid-fluid .col12 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 100%; margin-left: 4.4%; position: relative; display: inline; float: left; min-height: 1px; } .grid-fluid .col12:first-child { margin-left: 0; } .grid-fluid .col12:last-child { float: right; } .grid-fluid .col11 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 91.3%; margin-left: 4.4%; position: relative; display: inline; float: left; min-height: 1px; } .grid-fluid .col11:first-child { margin-left: 0; } .grid-fluid .col11:last-child { float: right; } .grid-fluid .col10 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 82.6%; margin-left: 4.4%; position: relative; display: inline; float: left; min-height: 1px; } .grid-fluid .col10:first-child { margin-left: 0; } .grid-fluid .col10:last-child { float: right; } .grid-fluid .col9 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 73.9%; margin-left: 4.4%; position: relative; display: inline; float: left; min-height: 1px; } .grid-fluid .col9:first-child { margin-left: 0; } .grid-fluid .col9:last-child { float: right; } .grid-fluid .col8 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 65.2%; margin-left: 4.4%; position: relative; display: inline; float: left; min-height: 1px; } .grid-fluid .col8:first-child { margin-left: 0; } .grid-fluid .col8:last-child { float: right; } .grid-fluid .col7 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 56.5%; margin-left: 4.4%; position: relative; display: inline; float: left; min-height: 1px; } .grid-fluid .col7:first-child { margin-left: 0; } .grid-fluid .col7:last-child { float: right; } .grid-fluid .col6 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 47.8%; margin-left: 4.4%; position: relative; display: inline; float: left; min-height: 1px; } .grid-fluid .col6:first-child { margin-left: 0; } .grid-fluid .col6:last-child { float: right; } .grid-fluid .col5 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 39.1%; margin-left: 4.4%; position: relative; display: inline; float: left; min-height: 1px; } .grid-fluid .col5:first-child { margin-left: 0; } .grid-fluid .col5:last-child { float: right; } .grid-fluid .col4 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 30.4%; margin-left: 4.4%; position: relative; display: inline; float: left; min-height: 1px; } .grid-fluid .col4:first-child { margin-left: 0; } .grid-fluid .col4:last-child { float: right; } .grid-fluid .col3 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 21.7%; margin-left: 4.4%; position: relative; display: inline; float: left; min-height: 1px; } .grid-fluid .col3:first-child { margin-left: 0; } .grid-fluid .col3:last-child { float: right; } .grid-fluid .col2 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 13%; margin-left: 4.4%; position: relative; display: inline; float: left; min-height: 1px; } .grid-fluid .col2:first-child { margin-left: 0; } .grid-fluid .col2:last-child { float: right; } .grid-fluid .col1 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 4.3%; margin-left: 4.4%; position: relative; display: inline; float: left; min-height: 1px; } .grid-fluid .col1:first-child { margin-left: 0; } .grid-fluid .col1:last-child { float: right; } .grid-fluid .offset11 { margin-left: 100.1%; } .grid-fluid .offset10 { margin-left: 91.4%; } .grid-fluid .offset9 { margin-left: 82.69999999999999%; } .grid-fluid .offset8 { margin-left: 74%; } .grid-fluid .offset7 { margin-left: 65.3%; } .grid-fluid .offset6 { margin-left: 56.6%; } .grid-fluid .offset5 { margin-left: 47.900000000000006%; } .grid-fluid .offset4 { margin-left: 39.2%; } .grid-fluid .offset3 { margin-left: 30.5%; } .grid-fluid .offset2 { margin-left: 21.8%; } .grid-fluid .offset1 { margin-left: 13.100000000000001%; } .grid-fluid .push11 { left: 95.69999999999999%; } .grid-fluid .push10 { left: 87%; } .grid-fluid .push9 { left: 78.3%; } .grid-fluid .push8 { left: 69.6%; } .grid-fluid .push7 { left: 60.89999999999999%; } .grid-fluid .push6 { left: 52.199999999999996%; } .grid-fluid .push5 { left: 43.5%; } .grid-fluid .push4 { left: 34.8%; } .grid-fluid .push3 { left: 26.099999999999998%; } .grid-fluid .push2 { left: 17.4%; } .grid-fluid .push1 { left: 8.7%; } .grid-fluid .pull11 { right: 95.69999999999999%; } .grid-fluid .pull10 { right: 87%; } .grid-fluid .pull9 { right: 78.3%; } .grid-fluid .pull8 { right: 69.6%; } .grid-fluid .pull7 { right: 60.89999999999999%; } .grid-fluid .pull6 { right: 52.199999999999996%; } .grid-fluid .pull5 { right: 43.5%; } .grid-fluid .pull4 { right: 34.8%; } .grid-fluid .pull3 { right: 26.099999999999998%; } .grid-fluid .pull2 { right: 17.4%; } .grid-fluid .pull1 { right: 8.7%; } @media all and (max-width: 480px) { .grid-fixed .col12 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fixed .col11 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fixed .col10 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fixed .col9 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fixed .col8 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fixed .col7 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fixed .col6 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fixed .col5 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fixed .col4 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fixed .col3 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fixed .col2 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fixed .col1 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fluid .col12 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fluid .col11 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fluid .col10 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fluid .col9 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fluid .col8 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fluid .col7 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fluid .col6 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fluid .col5 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fluid .col4 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fluid .col3 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fluid .col2 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fluid .col1 { width: 100%; margin: 0; left: 0; right: 0; } .grid-fixed, .grid-fluid { width: 100%; } .grid-fixed .m-col4, .grid-fluid .m-col4 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 99.9998%; margin-left: 6.6666%; position: relative; display: inline; float: left; min-height: 1px; } .grid-fixed .m-col4:first-child, .grid-fluid .m-col4:first-child { margin-left: 0; } .grid-fixed .m-col4:last-child, .grid-fluid .m-col4:last-child { float: right; } .grid-fixed .m-col3, .grid-fluid .m-col3 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 73.3332%; margin-left: 6.6666%; position: relative; display: inline; float: left; min-height: 1px; } .grid-fixed .m-col3:first-child, .grid-fluid .m-col3:first-child { margin-left: 0; } .grid-fixed .m-col3:last-child, .grid-fluid .m-col3:last-child { float: right; } .grid-fixed .m-col2, .grid-fluid .m-col2 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 46.6666%; margin-left: 6.6666%; position: relative; display: inline; float: left; min-height: 1px; } .grid-fixed .m-col2:first-child, .grid-fluid .m-col2:first-child { margin-left: 0; } .grid-fixed .m-col2:last-child, .grid-fluid .m-col2:last-child { float: right; } .grid-fixed .m-col1, .grid-fluid .m-col1 { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 20%; margin-left: 6.6666%; position: relative; display: inline; float: left; min-height: 1px; } .grid-fixed .m-col1:first-child, .grid-fluid .m-col1:first-child { margin-left: 0; } .grid-fixed .m-col1:last-child, .grid-fluid .m-col1:last-child { float: right; } .grid-fixed .m-offset3, .grid-fluid .m-offset3 { margin-left: 86.6664%; } .grid-fixed .m-offset2, .grid-fluid .m-offset2 { margin-left: 59.9998%; } .grid-fixed .m-offset1, .grid-fluid .m-offset1 { margin-left: 33.3332%; } .grid-fixed .m-push3, .grid-fluid .m-push3 { left: 79.9998%; } .grid-fixed .m-push2, .grid-fluid .m-push2 { left: 53.3332%; } .grid-fixed .m-push1, .grid-fluid .m-push1 { left: 26.6666%; } .grid-fixed .m-pull3, .grid-fluid .m-pull3 { right: 79.9998%; } .grid-fixed .m-pull2, .grid-fluid .m-pull2 { right: 53.3332%; } .grid-fixed .m-pull1, .grid-fluid .m-pull1 { right: 26.6666%; } } /* Sizes */ .btn-half { height: 20px !important; padding-bottom: 0 !important; padding-top: 0 !important; line-height: 18px; font-size: 0.8em; } .btn-single { height: 30px !important; padding-bottom: 0 !important; padding-top: 0 !important; line-height: 27px; font-size: 1em; } .btn-double { height: 40px !important; padding-bottom: 0 !important; padding-top: 0 !important; line-height: 36px; font-size: 1.1em; } /* Shapes */ /* Text */ /* Color */ /* Border */ /* Minimal */ /* Clean */ /* Soft */ /* Pill */ /* Gloss */ .btn-minimal { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; display: inline-block; padding-right: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; background: #eeeeee; border: 1px solid #c8c8c8; -webkit-box-shadow: inset 0 0 1px 1px #ffffff; -moz-box-shadow: inset 0 0 1px 1px #ffffff; box-shadow: inset 0 0 1px 1px #ffffff; color: #333; text-shadow: 0 1px 0 #fff; } .btn-minimal:hover { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; display: inline-block; padding-right: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; background: #e1e1e1; border: 1px solid #bbbbbb; -webkit-box-shadow: inset 0 0 1px 1px #ffffff; -moz-box-shadow: inset 0 0 1px 1px #ffffff; box-shadow: inset 0 0 1px 1px #ffffff; color: #333; text-shadow: 0 1px 0 #fff; text-decoration: none; } .btn-minimal:active { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; display: inline-block; padding-right: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; background: #d4d4d4; border: 1px solid #aeaeae; -webkit-box-shadow: inset 0 0 1px 1px #fbfbfb; -moz-box-shadow: inset 0 0 1px 1px #fbfbfb; box-shadow: inset 0 0 1px 1px #fbfbfb; color: #333; text-shadow: 0 1px 0 #fff; text-decoration: none; } .btn-clean { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; display: inline-block; padding-right: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; background-color: #eeeeee; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100% #d5d5d5)); background-image: -webkit-linear-gradient(top, #ffffff 0%, #d5d5d5 100%); background-image: -moz-linear-gradient(top, #ffffff 0%, #d5d5d5 100%); background-image: -ms-linear-gradient(top, #ffffff 0%, #d5d5d5 100%); background-image: -o-linear-gradient(top, #ffffff 0%, #d5d5d5 100%); background-image: linear-gradient(top, #ffffff 0%, #d5d5d5 100%); border: 1px solid #c8c8c8; color: #333; text-shadow: 0 1px 0 #fff; } .btn-clean:hover { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; display: inline-block; padding-right: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; background-color: #e1e1e1; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fbfbfb), color-stop(100% #c8c8c8)); background-image: -webkit-linear-gradient(top, #fbfbfb 0%, #c8c8c8 100%); background-image: -moz-linear-gradient(top, #fbfbfb 0%, #c8c8c8 100%); background-image: -ms-linear-gradient(top, #fbfbfb 0%, #c8c8c8 100%); background-image: -o-linear-gradient(top, #fbfbfb 0%, #c8c8c8 100%); background-image: linear-gradient(top, #fbfbfb 0%, #c8c8c8 100%); border: 1px solid #bbbbbb; color: #333; text-shadow: 0 1px 0 #fff; text-decoration: none; } .btn-clean:active { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; display: inline-block; padding-right: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; background-color: #d4d4d4; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #eeeeee), color-stop(100% #bbbbbb)); background-image: -webkit-linear-gradient(top, #eeeeee 0%, #bbbbbb 100%); background-image: -moz-linear-gradient(top, #eeeeee 0%, #bbbbbb 100%); background-image: -ms-linear-gradient(top, #eeeeee 0%, #bbbbbb 100%); background-image: -o-linear-gradient(top, #eeeeee 0%, #bbbbbb 100%); background-image: linear-gradient(top, #eeeeee 0%, #bbbbbb 100%); border: 1px solid #aeaeae; color: #333; text-shadow: 0 1px 0 #fff; text-decoration: none; } .btn-soft { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; display: inline-block; padding-right: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; background-color: #6c84ab; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #7c92b4), color-stop(100% #5c77a1)); background-image: -webkit-linear-gradient(top, #7c92b4 0%, #5c77a1 100%); background-image: -moz-linear-gradient(top, #7c92b4 0%, #5c77a1 100%); background-image: -ms-linear-gradient(top, #7c92b4 0%, #5c77a1 100%); background-image: -o-linear-gradient(top, #7c92b4 0%, #5c77a1 100%); background-image: linear-gradient(top, #7c92b4 0%, #5c77a1 100%); border: 1px solid #405371; -webkit-box-shadow: inset 0 2px 1px -1px #9dadc7; -moz-box-shadow: inset 0 2px 1px -1px #9dadc7; box-shadow: inset 0 2px 1px -1px #9dadc7; color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3); } .btn-soft:hover { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; display: inline-block; padding-right: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; background-color: #5c77a1; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #6c84ab), color-stop(100% #536b91)); background-image: -webkit-linear-gradient(top, #6c84ab 0%, #536b91 100%); background-image: -moz-linear-gradient(top, #6c84ab 0%, #536b91 100%); background-image: -ms-linear-gradient(top, #6c84ab 0%, #536b91 100%); background-image: -o-linear-gradient(top, #6c84ab 0%, #536b91 100%); background-image: linear-gradient(top, #6c84ab 0%, #536b91 100%); border: 1px solid #374760; -webkit-box-shadow: inset 0 2px 1px -1px #8c9fbe; -moz-box-shadow: inset 0 2px 1px -1px #8c9fbe; box-shadow: inset 0 2px 1px -1px #8c9fbe; color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3); text-decoration: none; } .btn-soft:active { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; display: inline-block; padding-right: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; background-color: #536b91; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5c77a1), color-stop(100% #4a5f81)); background-image: -webkit-linear-gradient(top, #5c77a1 0%, #4a5f81 100%); background-image: -moz-linear-gradient(top, #5c77a1 0%, #4a5f81 100%); background-image: -ms-linear-gradient(top, #5c77a1 0%, #4a5f81 100%); background-image: -o-linear-gradient(top, #5c77a1 0%, #4a5f81 100%); background-image: linear-gradient(top, #5c77a1 0%, #4a5f81 100%); border: 1px solid #2e3b50; -webkit-box-shadow: inset 0 2px 1px -1px #7c92b4; -moz-box-shadow: inset 0 2px 1px -1px #7c92b4; box-shadow: inset 0 2px 1px -1px #7c92b4; color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3); text-decoration: none; } .btn-pill { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; display: inline-block; padding-right: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; background-color: #6c84ab; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #7c92b4), color-stop(100% #5c77a1)); background-image: -webkit-linear-gradient(top, #7c92b4 0%, #5c77a1 100%); background-image: -moz-linear-gradient(top, #7c92b4 0%, #5c77a1 100%); background-image: -ms-linear-gradient(top, #7c92b4 0%, #5c77a1 100%); background-image: -o-linear-gradient(top, #7c92b4 0%, #5c77a1 100%); background-image: linear-gradient(top, #7c92b4 0%, #5c77a1 100%); border: 1px solid #405371; -webkit-box-shadow: inset 0 2px 1px -1px #9dadc7; -moz-box-shadow: inset 0 2px 1px -1px #9dadc7; box-shadow: inset 0 2px 1px -1px #9dadc7; color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3); } .btn-pill:hover { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; display: inline-block; padding-right: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; background-color: #5c77a1; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #6c84ab), color-stop(100% #536b91)); background-image: -webkit-linear-gradient(top, #6c84ab 0%, #536b91 100%); background-image: -moz-linear-gradient(top, #6c84ab 0%, #536b91 100%); background-image: -ms-linear-gradient(top, #6c84ab 0%, #536b91 100%); background-image: -o-linear-gradient(top, #6c84ab 0%, #536b91 100%); background-image: linear-gradient(top, #6c84ab 0%, #536b91 100%); border: 1px solid #374760; -webkit-box-shadow: inset 0 2px 1px -1px #8c9fbe; -moz-box-shadow: inset 0 2px 1px -1px #8c9fbe; box-shadow: inset 0 2px 1px -1px #8c9fbe; color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3); text-decoration: none; } .btn-pill:active { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; display: inline-block; padding-right: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; background-color: #536b91; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5c77a1), color-stop(100% #4a5f81)); background-image: -webkit-linear-gradient(top, #5c77a1 0%, #4a5f81 100%); background-image: -moz-linear-gradient(top, #5c77a1 0%, #4a5f81 100%); background-image: -ms-linear-gradient(top, #5c77a1 0%, #4a5f81 100%); background-image: -o-linear-gradient(top, #5c77a1 0%, #4a5f81 100%); background-image: linear-gradient(top, #5c77a1 0%, #4a5f81 100%); border: 1px solid #2e3b50; -webkit-box-shadow: inset 0 2px 1px -1px #7c92b4; -moz-box-shadow: inset 0 2px 1px -1px #7c92b4; box-shadow: inset 0 2px 1px -1px #7c92b4; color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3); text-decoration: none; } .btn-gloss { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; display: inline-block; padding-right: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; background-color: #172d6e; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #8195d0), color-stop(50% #586793), color-stop(50% #3b4c7d), color-stop(100% #44568e)); background-image: -webkit-linear-gradient(top, #8195d0 0%, #586793 50%, #3b4c7d 50%, #44568e 100%); background-image: -moz-linear-gradient(top, #8195d0 0%, #586793 50%, #3b4c7d 50%, #44568e 100%); background-image: -ms-linear-gradient(top, #8195d0 0%, #586793 50%, #3b4c7d 50%, #44568e 100%); background-image: -o-linear-gradient(top, #8195d0 0%, #586793 50%, #3b4c7d 50%, #44568e 100%); background-image: linear-gradient(top, #8195d0 0%, #586793 50%, #3b4c7d 50%, #44568e 100%); border: 1px solid #0a132f; -webkit-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.5); -moz-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.5); box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.5); color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3); } .btn-gloss:hover { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; display: inline-block; padding-right: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; background-color: #132459; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #6f85c9), color-stop(50% #4e5c83), color-stop(50% #33416b), color-stop(100% #3b4c7d)); background-image: -webkit-linear-gradient(top, #6f85c9 0%, #4e5c83 50%, #33416b 50%, #3b4c7d 100%); background-image: -moz-linear-gradient(top, #6f85c9 0%, #4e5c83 50%, #33416b 50%, #3b4c7d 100%); background-image: -ms-linear-gradient(top, #6f85c9 0%, #4e5c83 50%, #33416b 50%, #3b4c7d 100%); background-image: -o-linear-gradient(top, #6f85c9 0%, #4e5c83 50%, #33416b 50%, #3b4c7d 100%); background-image: linear-gradient(top, #6f85c9 0%, #4e5c83 50%, #33416b 50%, #3b4c7d 100%); border: 1px solid #050a1a; -webkit-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.5); -moz-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.5); box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.5); color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3); -webkit-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.3); -moz-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.3); box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.3); text-decoration: none; } .btn-gloss:active { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; display: inline-block; padding-right: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; background-color: #0e1c44; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5c76c2), color-stop(50% #455073), color-stop(50% #2b375a), color-stop(100% #33416b)); background-image: -webkit-linear-gradient(top, #5c76c2 0%, #455073 50%, #2b375a 50%, #33416b 100%); background-image: -moz-linear-gradient(top, #5c76c2 0%, #455073 50%, #2b375a 50%, #33416b 100%); background-image: -ms-linear-gradient(top, #5c76c2 0%, #455073 50%, #2b375a 50%, #33416b 100%); background-image: -o-linear-gradient(top, #5c76c2 0%, #455073 50%, #2b375a 50%, #33416b 100%); background-image: linear-gradient(top, #5c76c2 0%, #455073 50%, #2b375a 50%, #33416b 100%); border: 1px solid #010205; -webkit-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.5); -moz-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.5); box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.5); color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3); -webkit-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.3); -moz-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.3); box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.3); text-decoration: none; -webkit-box-shadow: inset 0 0 5px 0 rgba(0, 0, 0, 0.3); -moz-box-shadow: inset 0 0 5px 0 rgba(0, 0, 0, 0.3); box-shadow: inset 0 0 5px 0 rgba(0, 0, 0, 0.3); } .bar-minimal { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; display: inline-block; padding-right: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; background: #eeeeee; border: 1px solid #c8c8c8; -webkit-box-shadow: inset 0 0 1px 1px #ffffff; -moz-box-shadow: inset 0 0 1px 1px #ffffff; box-shadow: inset 0 0 1px 1px #ffffff; color: #333; text-shadow: 0 1px 0 #fff; display: block; padding-top: 10px !important; padding-right: 10px !important; padding-bottom: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; } .bar-clean { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; display: inline-block; padding-right: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; background-color: #eeeeee; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100% #d5d5d5)); background-image: -webkit-linear-gradient(top, #ffffff 0%, #d5d5d5 100%); background-image: -moz-linear-gradient(top, #ffffff 0%, #d5d5d5 100%); background-image: -ms-linear-gradient(top, #ffffff 0%, #d5d5d5 100%); background-image: -o-linear-gradient(top, #ffffff 0%, #d5d5d5 100%); background-image: linear-gradient(top, #ffffff 0%, #d5d5d5 100%); border: 1px solid #c8c8c8; color: #333; text-shadow: 0 1px 0 #fff; display: block; padding-top: 10px !important; padding-right: 10px !important; padding-bottom: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; } .bar-soft { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; display: inline-block; padding-right: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; background-color: #6c84ab; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #7c92b4), color-stop(100% #5c77a1)); background-image: -webkit-linear-gradient(top, #7c92b4 0%, #5c77a1 100%); background-image: -moz-linear-gradient(top, #7c92b4 0%, #5c77a1 100%); background-image: -ms-linear-gradient(top, #7c92b4 0%, #5c77a1 100%); background-image: -o-linear-gradient(top, #7c92b4 0%, #5c77a1 100%); background-image: linear-gradient(top, #7c92b4 0%, #5c77a1 100%); border: 1px solid #405371; -webkit-box-shadow: inset 0 2px 1px -1px #9dadc7; -moz-box-shadow: inset 0 2px 1px -1px #9dadc7; box-shadow: inset 0 2px 1px -1px #9dadc7; color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3); display: block; padding-top: 10px !important; padding-right: 10px !important; padding-bottom: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; } .bar-pill { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; display: inline-block; padding-right: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; background-color: #6c84ab; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #7c92b4), color-stop(100% #5c77a1)); background-image: -webkit-linear-gradient(top, #7c92b4 0%, #5c77a1 100%); background-image: -moz-linear-gradient(top, #7c92b4 0%, #5c77a1 100%); background-image: -ms-linear-gradient(top, #7c92b4 0%, #5c77a1 100%); background-image: -o-linear-gradient(top, #7c92b4 0%, #5c77a1 100%); background-image: linear-gradient(top, #7c92b4 0%, #5c77a1 100%); border: 1px solid #405371; -webkit-box-shadow: inset 0 2px 1px -1px #9dadc7; -moz-box-shadow: inset 0 2px 1px -1px #9dadc7; box-shadow: inset 0 2px 1px -1px #9dadc7; color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3); display: block; padding-top: 10px !important; padding-right: 10px !important; padding-bottom: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; } .bar-gloss { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; display: inline-block; padding-right: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; background-color: #172d6e; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #8195d0), color-stop(50% #586793), color-stop(50% #3b4c7d), color-stop(100% #44568e)); background-image: -webkit-linear-gradient(top, #8195d0 0%, #586793 50%, #3b4c7d 50%, #44568e 100%); background-image: -moz-linear-gradient(top, #8195d0 0%, #586793 50%, #3b4c7d 50%, #44568e 100%); background-image: -ms-linear-gradient(top, #8195d0 0%, #586793 50%, #3b4c7d 50%, #44568e 100%); background-image: -o-linear-gradient(top, #8195d0 0%, #586793 50%, #3b4c7d 50%, #44568e 100%); background-image: linear-gradient(top, #8195d0 0%, #586793 50%, #3b4c7d 50%, #44568e 100%); border: 1px solid #0a132f; -webkit-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.5); -moz-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.5); box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.5); color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3); display: block; padding-top: 10px !important; padding-right: 10px !important; padding-bottom: 10px !important; padding-left: 10px !important; text-align: center; font-weight: bold; } /* ========================================================================== Settings ========================================================================== */ /* ========================================================================== Spacing ========================================================================== */ /* ========================================================================== Typography ========================================================================== */ /* ========================================================================== Grid ========================================================================== */ /* ========================================================================== Buttons ========================================================================== */ /* ========================================================================== Site Variables ========================================================================== */ /* ========================================================================== Spacing ========================================================================== */ /* ========================================================================== Typography ========================================================================== */ /* ========================================================================== Grid ========================================================================== */ /* ========================================================================== Buttons ========================================================================== */ /* @baseline: @baseline; @button-color: @button-color; @button-primary-color: @button-primary-color; @button-info-color: @button-info-color; @button-success-color: @button-success-color; @button-warning-color: @button-warning-color; @button-danger-color: @button-danger-color; */ /* ========================================================================== Default ========================================================================== */ .btn { height: 30px; font-size: 15px; line-height: 30px; background-clip: border-box !important; background-repeat: repeat-x; border: 1px solid rgba(0, 0, 0, 0.25); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); cursor: pointer; display: inline-block; background-color: #dddddd; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f7f7f7), color-stop(100% #dddddd)); background-image: -webkit-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: -moz-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: -ms-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: -o-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: linear-gradient(top, #f7f7f7 0%, #dddddd 100%); padding-right: 10px !important; padding-left: 10px !important; padding-top: 0px !important; padding-bottom: 0px !important; -webkit-transition: background-position linear 0.1s; -moz-transition: background-position linear 0.1s; -o-transition: background-position linear 0.1s; transition: background-position linear 0.1s; vertical-align: middle; color: #333; font-family: "Droid Serif", Georgia, "Times New Roman", Times, serif; text-decoration: none !important; text-shadow: rgba(255, 255, 255, 0.75) 0 1px 0; } .btn:hover { background-position: 0 -15px; } /* ========================================================================== Styles ========================================================================== */ .btn-primary, .btn-info, .btn-success, .btn-warning, .btn-danger { color: #FFF !important; text-shadow: rgba(0, 0, 0, 0.25) 0 -1px 0 !important; } .btn-primary { height: 30px; font-size: 15px; line-height: 30px; background-clip: border-box !important; background-repeat: repeat-x; border: 1px solid rgba(0, 0, 0, 0.25); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); cursor: pointer; display: inline-block; background-color: #dddddd; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f7f7f7), color-stop(100% #dddddd)); background-image: -webkit-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: -moz-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: -ms-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: -o-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: linear-gradient(top, #f7f7f7 0%, #dddddd 100%); padding-right: 10px !important; padding-left: 10px !important; padding-top: 0px !important; padding-bottom: 0px !important; -webkit-transition: background-position linear 0.1s; -moz-transition: background-position linear 0.1s; -o-transition: background-position linear 0.1s; transition: background-position linear 0.1s; vertical-align: middle; color: #333; font-family: "Droid Serif", Georgia, "Times New Roman", Times, serif; text-decoration: none !important; text-shadow: rgba(255, 255, 255, 0.75) 0 1px 0; background-color: #0055cc; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #006aff), color-stop(100% #0055cc)); background-image: -webkit-linear-gradient(top, #006aff 0%, #0055cc 100%); background-image: -moz-linear-gradient(top, #006aff 0%, #0055cc 100%); background-image: -ms-linear-gradient(top, #006aff 0%, #0055cc 100%); background-image: -o-linear-gradient(top, #006aff 0%, #0055cc 100%); background-image: linear-gradient(top, #006aff 0%, #0055cc 100%); } .btn-primary:hover { background-position: 0 -15px; } .btn-info { height: 30px; font-size: 15px; line-height: 30px; background-clip: border-box !important; background-repeat: repeat-x; border: 1px solid rgba(0, 0, 0, 0.25); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); cursor: pointer; display: inline-block; background-color: #dddddd; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f7f7f7), color-stop(100% #dddddd)); background-image: -webkit-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: -moz-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: -ms-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: -o-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: linear-gradient(top, #f7f7f7 0%, #dddddd 100%); padding-right: 10px !important; padding-left: 10px !important; padding-top: 0px !important; padding-bottom: 0px !important; -webkit-transition: background-position linear 0.1s; -moz-transition: background-position linear 0.1s; -o-transition: background-position linear 0.1s; transition: background-position linear 0.1s; vertical-align: middle; color: #333; font-family: "Droid Serif", Georgia, "Times New Roman", Times, serif; text-decoration: none !important; text-shadow: rgba(255, 255, 255, 0.75) 0 1px 0; background-color: #2f96b4; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #47b0cf), color-stop(100% #2f96b4)); background-image: -webkit-linear-gradient(top, #47b0cf 0%, #2f96b4 100%); background-image: -moz-linear-gradient(top, #47b0cf 0%, #2f96b4 100%); background-image: -ms-linear-gradient(top, #47b0cf 0%, #2f96b4 100%); background-image: -o-linear-gradient(top, #47b0cf 0%, #2f96b4 100%); background-image: linear-gradient(top, #47b0cf 0%, #2f96b4 100%); } .btn-info:hover { background-position: 0 -15px; } .btn-success { height: 30px; font-size: 15px; line-height: 30px; background-clip: border-box !important; background-repeat: repeat-x; border: 1px solid rgba(0, 0, 0, 0.25); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); cursor: pointer; display: inline-block; background-color: #dddddd; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f7f7f7), color-stop(100% #dddddd)); background-image: -webkit-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: -moz-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: -ms-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: -o-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: linear-gradient(top, #f7f7f7 0%, #dddddd 100%); padding-right: 10px !important; padding-left: 10px !important; padding-top: 0px !important; padding-bottom: 0px !important; -webkit-transition: background-position linear 0.1s; -moz-transition: background-position linear 0.1s; -o-transition: background-position linear 0.1s; transition: background-position linear 0.1s; vertical-align: middle; color: #333; font-family: "Droid Serif", Georgia, "Times New Roman", Times, serif; text-decoration: none !important; text-shadow: rgba(255, 255, 255, 0.75) 0 1px 0; background-color: #51a351; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #6fb86f), color-stop(100% #51a351)); background-image: -webkit-linear-gradient(top, #6fb86f 0%, #51a351 100%); background-image: -moz-linear-gradient(top, #6fb86f 0%, #51a351 100%); background-image: -ms-linear-gradient(top, #6fb86f 0%, #51a351 100%); background-image: -o-linear-gradient(top, #6fb86f 0%, #51a351 100%); background-image: linear-gradient(top, #6fb86f 0%, #51a351 100%); } .btn-success:hover { background-position: 0 -15px; } .btn-warning { height: 30px; font-size: 15px; line-height: 30px; background-clip: border-box !important; background-repeat: repeat-x; border: 1px solid rgba(0, 0, 0, 0.25); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); cursor: pointer; display: inline-block; background-color: #dddddd; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f7f7f7), color-stop(100% #dddddd)); background-image: -webkit-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: -moz-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: -ms-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: -o-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: linear-gradient(top, #f7f7f7 0%, #dddddd 100%); padding-right: 10px !important; padding-left: 10px !important; padding-top: 0px !important; padding-bottom: 0px !important; -webkit-transition: background-position linear 0.1s; -moz-transition: background-position linear 0.1s; -o-transition: background-position linear 0.1s; transition: background-position linear 0.1s; vertical-align: middle; color: #333; font-family: "Droid Serif", Georgia, "Times New Roman", Times, serif; text-decoration: none !important; text-shadow: rgba(255, 255, 255, 0.75) 0 1px 0; background-color: #faa732; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fbbc64), color-stop(100% #faa732)); background-image: -webkit-linear-gradient(top, #fbbc64 0%, #faa732 100%); background-image: -moz-linear-gradient(top, #fbbc64 0%, #faa732 100%); background-image: -ms-linear-gradient(top, #fbbc64 0%, #faa732 100%); background-image: -o-linear-gradient(top, #fbbc64 0%, #faa732 100%); background-image: linear-gradient(top, #fbbc64 0%, #faa732 100%); } .btn-warning:hover { background-position: 0 -15px; } .btn-danger { height: 30px; font-size: 15px; line-height: 30px; background-clip: border-box !important; background-repeat: repeat-x; border: 1px solid rgba(0, 0, 0, 0.25); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); cursor: pointer; display: inline-block; background-color: #dddddd; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f7f7f7), color-stop(100% #dddddd)); background-image: -webkit-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: -moz-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: -ms-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: -o-linear-gradient(top, #f7f7f7 0%, #dddddd 100%); background-image: linear-gradient(top, #f7f7f7 0%, #dddddd 100%); padding-right: 10px !important; padding-left: 10px !important; padding-top: 0px !important; padding-bottom: 0px !important; -webkit-transition: background-position linear 0.1s; -moz-transition: background-position linear 0.1s; -o-transition: background-position linear 0.1s; transition: background-position linear 0.1s; vertical-align: middle; color: #333; font-family: "Droid Serif", Georgia, "Times New Roman", Times, serif; text-decoration: none !important; text-shadow: rgba(255, 255, 255, 0.75) 0 1px 0; background-color: #bd362f; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #d3534c), color-stop(100% #bd362f)); background-image: -webkit-linear-gradient(top, #d3534c 0%, #bd362f 100%); background-image: -moz-linear-gradient(top, #d3534c 0%, #bd362f 100%); background-image: -ms-linear-gradient(top, #d3534c 0%, #bd362f 100%); background-image: -o-linear-gradient(top, #d3534c 0%, #bd362f 100%); background-image: linear-gradient(top, #d3534c 0%, #bd362f 100%); } .btn-danger:hover { background-position: 0 -15px; } /* ========================================================================== Sizes (Half = h, Single = s, Double = d) ========================================================================== */ .btn-h, .btn-half { height: 20px; font-size: 12px; line-height: 20px; } .btn-s, .btn-single { height: 30px; font-size: 15px; line-height: 30px; } .btn-d, .btn-double { height: 40px; font-size: 20px; line-height: 40px; } /* Import site-specific styles */ .site-header { position: relative; z-index: 1; text-align: center; } .site-title { margin-bottom: 0px !important; font-family: 'Alfa Slab One'; font-size: 80px; font-weight: normal !important; line-height: 100px !important; } .site-title a { text-decoration: none; } .site-slogan { font-weight: normal; } .fork-me, .fork-me img { position: absolute; top: 0; right: 0; } .fork-me { z-index: 2; } .interior-site-header { background: #EEE; -webkit-box-shadow: inset rgba(0, 0, 0, 0.07) 0 0 40px; -moz-box-shadow: inset rgba(0, 0, 0, 0.07) 0 0 40px; box-shadow: inset rgba(0, 0, 0, 0.07) 0 0 40px; padding-top: 20px !important; padding-right: 20px !important; padding-bottom: 20px !important; padding-left: 20px !important; text-align: center; } .interior-site-header .site-title { font-size: 40px; line-height: 40px !important; } .interior-site-header .site-slogan { margin-bottom: 20px !important; } .site-navigation { background: #EEE; -webkit-box-shadow: inset rgba(0, 0, 0, 0.07) 0 0 40px; -moz-box-shadow: inset rgba(0, 0, 0, 0.07) 0 0 40px; box-shadow: inset rgba(0, 0, 0, 0.07) 0 0 40px; padding-top: 20px !important; padding-right: 20px !important; padding-bottom: 20px !important; padding-left: 20px !important; position: fixed; top: 0; bottom: 0; overflow: auto; width: 240px; } .build-date { margin-bottom: 20px !important; color: #AAA; font-family: Helvetica, Arial, sans-serif; font-size: 11px; } .site-navigation ul { margin-top: 0px !important; margin-right: 0px !important; margin-bottom: 0px !important; margin-left: 0px !important; padding-top: 0px !important; padding-right: 0px !important; padding-bottom: 0px !important; padding-left: 0px !important; list-style: none; margin: 0; padding: 0; font-size: 16px; } .site-navigation > ul > li { margin-bottom: 10px; } .site-navigation a { text-decoration: underline; } .site-navigation a:hover { text-decoration: none; } .site-navigation a.active { background-color: #ff9; } .site-navigation ul ul { margin-left: 20px !important; padding-top: 10px !important; font-size: 12px; } .site-navigation ul ul a { text-decoration: none; } .site-content { padding: 20px 40px 40px 320px; } .site-content h1 { clear: both; } .interior-site-content { padding-top: 40px !important; padding-right: 40px !important; padding-bottom: 40px !important; padding-left: 40px !important; } .top { background: #333; display: inline-block; float: right; margin-right: -40px; padding: 4px 8px; color: #FFF; font-size: 12px; text-decoration: none !important; } .site-footer { clear: both; padding-top: 40px !important; font-size: 13px; text-align: center; } .site-footer img { margin-left: 2px; position: relative; top: -2px; vertical-align: middle; } .site-footer ul { list-style: none; margin-right: 0px !important; margin-left: 0px !important; padding-right: 0px !important; padding-left: 0px !important; } /* Tablets and Smartphones */ @media only screen and (max-width: 1024px) { .build-date { text-align: center; } .site-header { height: 220px; position: absolute; top: 20px; left: 0; width: 100%; } .fork-me img { height: 110px; width: 110px; } .site-navigation { margin-top: 240px; padding: 20px; position: relative; width: auto; } .site-navigation ul { border: 1px solid #999; border-bottom: none; } .site-navigation li { margin-top: 0px !important; margin-right: 0px !important; margin-bottom: 0px !important; margin-left: 0px !important; padding-top: 0px !important; padding-right: 0px !important; padding-bottom: 0px !important; padding-left: 0px !important; } .site-navigation a { background: #CCC; display: block; border-bottom: 1px solid #999; padding: 10px; text-decoration: none; } .site-navigation ul ul { border: none; margin-top: 0px !important; margin-right: 0px !important; margin-bottom: 0px !important; margin-left: 0px !important; padding-top: 0px !important; padding-right: 0px !important; padding-bottom: 0px !important; padding-left: 0px !important; } .site-navigation ul ul a { background: transparent; } .site-content { padding: 20px; } .top { display: inline-block; float: none; } }