bootswatch-rails 0.2.0 → 0.3.0

data/vendor/assets/stylesheets/bootswatch/spruce/_variables.scss

@@ -1,11 +1,9 @@
-// Variables to customize the look and feel of Bootstrap
-// Swatch: Spruce
-// Version: 2.0.2
-// -----------------------------------------------------
-
+// Spruce 2.2.2
+// Variables
+// --------------------------------------------------
 
 
-// GLOBAL VALUES
+// Global values
 // --------------------------------------------------
 
 
@@ -22,109 +20,144 @@ $white:                 #fff;
 
 // Accent colors
 // -------------------------
-$blue:                  #01584C;
+$blue:                  #004E8B;
 $blueDark:              #013435;
 $green:                 #015B4E;
 $red:                   #D14432;
-$yellow:                #EBD90B;
-$orange:                #FCB46B;
+$yellow:                #F0F1E1;
+$orange:                #F26522;
 $pink:                  #A15B66;
 $purple:                #7073CF;
 
 
 // Scaffolding
 // -------------------------
-$bodyBackground:        #AEAD8E;
-$textColor:             $blueDark;
+$bodyBackground:        $white;
+$textColor:             $gray;
 
 
 // Links
 // -------------------------
-$linkColor:             #F5F3DC;
-$linkColorHover:        $yellow;
+$linkColor:             lighten($green, 10%);
+$linkColorHover:        $linkColor;
 
 
 // Typography
 // -------------------------
-$baseFontSize:          14px;
-$baseFontFamily:        "Helvetica Neue", Helvetica, Arial, sans-serif;
+$sansFontFamily:        "Helvetica Neue", Helvetica, Arial, sans-serif;
+$serifFontFamily:       Georgia, "Times New Roman", Times, serif;
+$monoFontFamily:        Menlo, Monaco, Consolas, "Courier New", monospace;
+
+$baseFontSize:          15px;
+$baseFontFamily:        $serifFontFamily;
 $baseLineHeight:        21px;
-$altFontFamily:         Georgia, "Times New Roman", Times, serif;
+$altFontFamily:         $serifFontFamily;
 
-$headingsFontFamily:    'Josefin Slab', serif; // empty to use BS default, $baseFontFamily
-$headingsFontWeight:    700;    // instead of browser default, bold
-$headingsColor:         inherit; // empty to use BS default, $textColor
+$headingsFontFamily:    'Crete Round', serif; // empty to use BS default, $baseFontFamily
+$headingsFontWeight:    normal;    // instead of browser default, bold
+$headingsColor:         $grayDark; // empty to use BS default, $textColor
 
 
-// Tables
+// Component sizing
 // -------------------------
-$tableBackground:                   #C3C7AE; // overall background-color
-$tableBackgroundAccent:             darken(#C3C7AE, .05); // for striping
-$tableBackgroundHover:              darken(#C3C7AE, .1); // for hover
-$tableBorder:                       $linkColor; // table and cell border
+// Based on 14px font-size and 20px line-height
+
+$fontSizeLarge:         $baseFontSize * 1.25; // ~18px
+$fontSizeSmall:         $baseFontSize * 0.85; // ~12px
+$fontSizeMini:          $baseFontSize * 0.75; // ~11px
 
+$paddingLarge:          11px 19px; // 44px
+$paddingSmall:          2px 10px;  // 26px
+$paddingMini:           0px 6px;   // 22px
+
+$baseBorderRadius:      4px;
+$borderRadiusLarge:     6px;
+$borderRadiusSmall:     3px;
+
+
+// Tables
+// -------------------------
+$tableBackground:                   lighten(#ddd, 10%); // overall background-color
+$tableBackgroundAccent:             lighten(#ddd, 5%); // for striping
+$tableBackgroundHover:              #ddd; // for hover
+$tableBorder:                       $headingsColor; // table and cell border
 
 // Buttons
 // -------------------------
 $btnBackground:                     $white;
-$btnBackgroundHighlight:            darken($white, .1);
-$btnBorder:                         darken($white, .2);
+$btnBackgroundHighlight:            darken($white, 10%);
+$btnBorder:                         darken($white, 15%);
 
-$btnPrimaryBackground:              $linkColor;
-$btnPrimaryBackgroundHighlight:     adjust-hue($btnPrimaryBackground, .15);
+$btnPrimaryBackground:              lighten($green, 5%);
+$btnPrimaryBackgroundHighlight:     $green;
 
-$btnInfoBackground:                 #5bc0de;
+$btnInfoBackground:                 lighten(#2f96b4, 5%);
 $btnInfoBackgroundHighlight:        #2f96b4;
 
-$btnSuccessBackground:              #62c462;
-$btnSuccessBackgroundHighlight:     #51a351;
+$btnSuccessBackground:              lighten($blue, 10%);
+$btnSuccessBackgroundHighlight:     lighten($blue, 5%);
 
-$btnWarningBackground:              lighten($orange, .15);
+$btnWarningBackground:              lighten($orange, 5%);
 $btnWarningBackgroundHighlight:     $orange;
 
-$btnDangerBackground:               #ee5f5b;
-$btnDangerBackgroundHighlight:      #bd362f;
+$btnDangerBackground:               lighten($red, 5%);
+$btnDangerBackgroundHighlight:      $red;
 
 $btnInverseBackground:              $gray;
-$btnInverseBackgroundHighlight:     $grayDarker;
+$btnInverseBackgroundHighlight:     darken($gray, 5%);
 
 
 // Forms
 // -------------------------
 $inputBackground:               $white;
 $inputBorder:                   #ccc;
+$inputBorderRadius:             $baseBorderRadius;
 $inputDisabledBackground:       $grayLighter;
+$formActionsBackground:         transparent;
+$inputHeight:                   $baseLineHeight + 10px; // base line-height + 8px vertical padding + 2px top/bottom border
 
 
 // Dropdowns
 // -------------------------
-$dropdownBackground:            $white;
-$dropdownBorder:                rgba(0,0,0,.2);
-$dropdownLinkColor:             $grayDark;
+$dropdownBackground:            #002425;
+$dropdownBorder:                transparent;
+$dropdownDividerTop:            transparent;
+$dropdownDividerBottom:         $black;
+
+$dropdownLinkColor:             $white;
 $dropdownLinkColorHover:        $white;
-$dropdownLinkBackgroundHover:   $linkColor;
+$dropdownLinkColorActive:       $white;
 
+$dropdownLinkBackgroundActive:  $green;
+$dropdownLinkBackgroundHover:   $green;
 
 
 
 // COMPONENT VARIABLES
 // --------------------------------------------------
 
+
 // Z-index master list
 // -------------------------
 // Used for a bird's eye view of components dependent on the z-axis
 // Try to avoid customizing these :)
 $zindexDropdown:          1000;
 $zindexPopover:           1010;
-$zindexTooltip:           1020;
+$zindexTooltip:           1030;
 $zindexFixedNavbar:       1030;
 $zindexModalBackdrop:     1040;
 $zindexModal:             1050;
 
 
+// Sprite icons path
+// -------------------------
+$iconSpritePath:          "../img/glyphicons-halflings.png";
+$iconWhiteSpritePath:     "../img/glyphicons-halflings-white.png";
+
+
 // Input placeholder text color
 // -------------------------
-$placeholderText:         $grayLight;
+$placeholderText:         #ccc;
 
 
 // Hr border color
@@ -132,56 +165,110 @@ $placeholderText:         $grayLight;
 $hrBorder:                $linkColor;
 
 
+// Horizontal forms & lists
+// -------------------------
+$horizontalComponentOffset:       180px;
+
+
+// Wells
+// -------------------------
+$wellBackground:                  #ddd;
+
+
 // Navbar
 // -------------------------
-$navbarHeight:                    40px;
+$navbarCollapseWidth:             979px;
+$navbarCollapseDesktopWidth:      $navbarCollapseWidth + 1;
+
+$navbarHeight:                    55px;
 $navbarBackground:                $blueDark;
 $navbarBackgroundHighlight:       $navbarBackground;
+$navbarBorder:                    darken($navbarBackground, 5%);
 
 $navbarText:                      $grayLight;
-$navbarLinkColor:                 $grayLight;
+$navbarLinkColor:                 $white;
 $navbarLinkColorHover:            $white;
-$navbarLinkColorActive:           $navbarLinkColorHover;
-$navbarLinkBackgroundHover:       transparent;
-$navbarLinkBackgroundActive:      $navbarBackground;
+$navbarLinkColorActive:           $white;
+$navbarLinkBackgroundHover:       #002425;
+$navbarLinkBackgroundActive:      $navbarLinkBackgroundHover;
+
+$navbarBrandColor:                $navbarLinkColor;
+
+// Inverted navbar
+$navbarInverseBackground:                $wellBackground;
+$navbarInverseBackgroundHighlight:       lighten($wellBackground, 5%);
+$navbarInverseBorder:                    darken($navbarInverseBackground, 5%);
 
-$navbarSearchBackground:          lighten($navbarBackground, .25);
-$navbarSearchBackgroundFocus:     $white;
-$navbarSearchBorder:              darken($navbarSearchBackground, .3);
-$navbarSearchPlaceholderColor:    #ccc;
+$navbarInverseText:                      $textColor;
+$navbarInverseLinkColor:                 $headingsColor;
+$navbarInverseLinkColorHover:            $navbarInverseLinkColor;
+$navbarInverseLinkColorActive:           $navbarInverseLinkColor;
+$navbarInverseLinkBackgroundHover:       darken($navbarInverseBackground, 7%);
+$navbarInverseLinkBackgroundActive:      $navbarInverseLinkBackgroundHover;
+
+$navbarInverseSearchBackground:          lighten($navbarInverseBackground, 25%);
+$navbarInverseSearchBackgroundFocus:     $white;
+$navbarInverseSearchBorder:              $navbarInverseBackground;
+$navbarInverseSearchPlaceholderColor:    $white;
+
+$navbarInverseBrandColor:                $navbarInverseLinkColor;
+
+
+// Pagination
+// -------------------------
+$paginationBackground:                darken($bodyBackground, 10%);
+$paginationBorder:                    transparent;
+$paginationActiveBackground:          #A2CDB5;
 
 
 // Hero unit
 // -------------------------
-$heroUnitBackground:              $grayLighter;
-$heroUnitHeadingColor:            inherit;
+$heroUnitBackground:              #ddd;
+$heroUnitHeadingColor:            $headingsColor;
 $heroUnitLeadColor:               inherit;
 
 
 // Form states and alerts
 // -------------------------
-$warningText:             $orange;
-$warningBackground:       darken(#90A38F, .1);
-$warningBorder:           darken(adjust-hue($warningBackground, -10), .03);
+$warningText:             $white;
+$warningBackground:       $orange;
+$warningBorder:           darken(adjust-hue($warningBackground, -10), 3%);
 
-$errorText:               lighten($red, .25);
-$errorBackground:         darken(#90A38F, .1);
-$errorBorder:             darken(adjust-hue($errorBackground, -10), .03);
+$errorText:               $white;
+$errorBackground:         $red;
+$errorBorder:             darken(adjust-hue($errorBackground, -10), 3%);
 
-$successText:             #9ED99C;
-$successBackground:       darken(#90A38F, .1);
-$successBorder:           darken(adjust-hue($successBackground, -10), .05);
+$successText:             $white;
+$successBackground:       #24C00B;
+$successBorder:           darken(adjust-hue($successBackground, -10), 5%);
 
-$infoText:                #9BCACD;
-$infoBackground:          darken(#90A38F, .1);
-$infoBorder:              darken(adjust-hue($infoBackground, -10), .07);
+$infoText:                $white;
+$infoBackground:          #185AF9;
+$infoBorder:              darken(adjust-hue($infoBackground, -10), 7%);
 
 
+// Tooltips and popovers
+// -------------------------
+$tooltipColor:            #fff;
+$tooltipBackground:       #000;
+$tooltipArrowWidth:       5px;
+$tooltipArrowColor:       $tooltipBackground;
+
+$popoverBackground:       #fff;
+$popoverArrowWidth:       10px;
+$popoverArrowColor:       #fff;
+$popoverTitleBackground:  $green;
+
+// Special enhancement for popovers
+$popoverArrowOuterWidth:  $popoverArrowWidth + 1;
+$popoverArrowOuterColor:  rgba(0,0,0,.25);
+
 
 
 // GRID
 // --------------------------------------------------
 
+
 // Default 940px grid
 // -------------------------
 $gridColumns:             12;
@@ -189,8 +276,26 @@ $gridColumnWidth:         60px;
 $gridGutterWidth:         20px;
 $gridRowWidth:            ($gridColumns * $gridColumnWidth) + ($gridGutterWidth * ($gridColumns - 1));
 
+// 1200px min
+$gridColumnWidth1200:     70px;
+$gridGutterWidth1200:     30px;
+$gridRowWidth1200:        ($gridColumns * $gridColumnWidth1200) + ($gridGutterWidth1200 * ($gridColumns - 1));
+
+// 768px-979px
+$gridColumnWidth768:      42px;
+$gridGutterWidth768:      20px;
+$gridRowWidth768:         ($gridColumns * $gridColumnWidth768) + ($gridGutterWidth768 * ($gridColumns - 1));
+
 
 // Fluid grid
 // -------------------------
-$fluidGridColumnWidth:    6.382978723%;
-$fluidGridGutterWidth:    2.127659574%;
+$fluidGridColumnWidth:    percentage($gridColumnWidth/$gridRowWidth);
+$fluidGridGutterWidth:    percentage($gridGutterWidth/$gridRowWidth);
+
+// 1200px min
+$fluidGridColumnWidth1200:     percentage($gridColumnWidth1200/$gridRowWidth1200);
+$fluidGridGutterWidth1200:     percentage($gridGutterWidth1200/$gridRowWidth1200);
+
+// 768px-979px
+$fluidGridColumnWidth768:      percentage($gridColumnWidth768/$gridRowWidth768);
+$fluidGridGutterWidth768:      percentage($gridGutterWidth768/$gridRowWidth768);

data/vendor/assets/stylesheets/bootswatch/superhero/_bootswatch.scss

@@ -1,40 +1,38 @@
-// Swatch: Superhero
-// Version: 2.0.4
+// Superhero 2.2.2
+// Bootswatch
 // -----------------------------------------------------
 
+
 // TYPOGRAPHY
 // --------------------------------------------------
 
-@import url(https://fonts.googleapis.com/css?family=Oswald);
-@import url(https://fonts.googleapis.com/css?family=Noticia+Text);
+@import url('//fonts.googleapis.com/css?family=Oswald|Noticia+Text');
 
-h6, legend,
-h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
+h1 small, h2 small, h3 small, h4 small, h5 small, h6 small, h6 {
 	font-family: $headingsFontFamily;
 	color: $orange;
-	text-shadow: -1px 1px 0 darken($orange, .3);
+	text-shadow: -1px 1px 0 darken($orange, 30%);
 }
 
-h1, h2, legend {
-	text-shadow: -2px 2px 0 darken($orange, .3);
+h1, h2 {
+	text-shadow: -2px 2px 0 darken($orange, 30%);
 }
 
 h1 {
 	line-height: 55px;
 }
 
-// SCAFFOLDING
-// --------------------------------------------------
-
 code, pre {
-	background-color: lighten($blue, .08);
+	background-color: lighten($blue, 8%);
 	border: none;
 	color: $textColor;
 }
 
-.prettyprint {
-	border: none;
-	text-decoration: none;
+// SCAFFOLDING
+// --------------------------------------------------
+
+.page-header {
+	border-bottom: none;
 }
 
 blockquote {
@@ -59,27 +57,15 @@ blockquote.pull-right {
 		padding: 25px 20px 15px;
 		font-family: $headingsFontFamily;
 		font-size: 30px;
-		text-shadow: -2px 2px 0 darken($orange, .3);
+		text-shadow: -2px 2px 0 darken($orange, 30%);
 	}
 
 	.nav > li > a {
-		padding: 27px 20px 13px;
-		line-height: 30px;
-		font-family: $headingsFontFamily;
-		font-size: 22px;
-		text-shadow: -2px 2px 0 darken($orange, .3);
-	}
-
-	.navbar-text {
-		padding: 27px 20px 13px;
+		padding: 23px 20px 13px;
 		line-height: 30px;
 		font-family: $headingsFontFamily;
 		font-size: 22px;
-		text-shadow: -2px 2px 0 $gray;
-	}
-
-	.nav > li.active > a {
-		color: $orange;
+		text-shadow: -2px 2px 0 darken($orange, 30%);
 	}
 
 	.brand:hover,
@@ -91,21 +77,36 @@ blockquote.pull-right {
 		top: 1px;
 		left: -1px;
 		color: $orange;
-		text-shadow: -1px 1px 0 darken($orange, .3);
+		text-shadow: -1px 1px 0 darken($orange, 30%);
+	}
+
+	.nav > .active > a,
+	.nav > .active > a:hover,
+	.nav > .active > a:focus {
+		@include box-shadow(none);
+	}
+
+	.navbar-text {
+		padding: 23px 20px 13px;
+		line-height: 30px;
+		font-family: $headingsFontFamily;
+		font-size: 22px;
+		text-shadow: -2px 2px 0 $gray;
 	}
 
 	.navbar-search {
-		padding-top: 20px;
+		margin-top: 24px;
 	}
 
 	.navbar-search .search-query {
 		font-family: $baseFontFamily;
 		font-size: $baseFontSize;
 		line-height: $baseLineHeight;
-		color: $textColor;
-		background-color: $blue;
 		@include box-shadow(none);
-		border: none;
+	}
+
+	&.navbar-inverse .navbar-search .search-query {
+		color: $blueDark;
 	}
 
 	.divider-vertical {
@@ -114,6 +115,7 @@ blockquote.pull-right {
 
 	.nav .dropdown-toggle .caret,
 	.nav .open.dropdown .caret {
+		margin-top: 14px;
 		border-top-color: $textColor;
 	}
 
@@ -125,45 +127,47 @@ blockquote.pull-right {
 		left: 20px;
 		border-left: 7px solid transparent;
 		border-right: 7px solid transparent;
-		border-bottom: 7px solid lighten($blue, .1);
+		border-bottom: 7px solid lighten($blue, 10%);
+	}
+
+	[class^="icon-"], [class*=" icon-"] {
+		vertical-align: 20%;
 	}
 
 	.btn-navbar {
 		background-color: $blue;
 		border-color: transparent;
 	}
+}
+
+@media (max-width: $navbarCollapseWidth) {
+
+	.navbar .nav-collapse {
 
-	.nav-collapse.in {
-		background-color: $blue;
 		@include border-radius(4px);
 
-		li > a {
-			color: $textColor;
-		}
+		.nav li > a {
+			color: $orange;
 
-		li > a:hover {
-			color: $textColor;
-			background-color: lighten($blue, .1);
+			&:hover {
+				background-color: lighten($blue, 10%) !important;
+				background-image: none;
+			}
 		}
-	}
 
-	.nav-collapse.in > .nav > li > a {
-		color: $orange;
+		.navbar-form,
+		.navbar-search {
+			border-top: none;
+			border-bottom: none;
+			@include box-shadow(none);
+		}
 
-		&:hover {
-			background-color: lighten($blue, .1);
+		.nav-header {
+			color: $textColor;
 		}
 	}
 }
 
-.dropdown .caret {
-	margin-top: 14px;
-	opacity: 1;
-	border-left: 6px solid transparent;
-	border-right: 6px solid transparent;
-	border-top: 6px solid lighten($blue, .1);
-}
-
 div.subnav {
 	background-color: $blue;
 	background-image: none;
@@ -178,7 +182,7 @@ div.subnav {
 
 	.nav > li > a:hover,
 	.nav > li.active > a:hover {
-		background-color: lighten($blue, .1);
+		background-color: lighten($blue, 10%);
 	}
 
 	.nav > li + li > a {
@@ -226,127 +230,12 @@ div.subnav {
 	}
 }
 
-@media (max-width: 768px) {
-	div.subnav .nav > li:first-child > a,
-	div.subnav .nav > li:first-child > a:hover,
-	div.subnav .nav > li.active:first-child > a,
-	div.subnav .nav > li.active:first-child > a:hover {
-		@include border-radius(4px 4px 0 0);
-	}
-
-	div.subnav .nav > li:last-child > a,
-	div.subnav .nav > li:last-child > a:hover,
-	div.subnav .nav > li.active:last-child > a,
-	div.subnav .nav > li.active:last-child > a:hover {
-		@include border-radius(0 0 4px 4px);
-	}
-
-}
-
-// TABLES
-// -----------------------------------------------------
-
-.table,
-.table-striped tbody > tr > td:first-child,
-.table-striped tbody > tr > td:last-child, {
-	@include border-radius(4px);
-}
-
-// BUTTONS
-// --------------------------------------------------
-
-.btn,
-.btn:hover {
-	text-shadow: none;
-	background-image: none;
-	@include box-shadow(-2px 2px 0 darken($white, .8));
-	border: none;
-}
-
-.btn-warning {
-	background-color: $yellow;
-}
-
-.btn-primary, .btn-primary:hover {
-	@include box-shadow(-2px 2px 0 darken($btnPrimaryBackground, .3));
-}
-
-.btn-warning, .btn-warning:hover {
-	@include box-shadow(-2px 2px 0 darken($yellow, .3));
-}
-
-.btn-danger, .btn-danger:hover {
-	@include box-shadow(-2px 2px 0 darken(#ee5f5b, .3));
-}
-
-.btn-success, .btn-success:hover {
-	@include box-shadow(-2px 2px 0 darken(#62c462, .3));
-}
-
-.btn-info, .btn-info:hover {
-	@include box-shadow(-2px 2px 0 darken(#5bc0de, .4));
-}
-
-.btn-inverse, .btn-inverse:hover {
-	@include box-shadow(-2px 2px 0 darken(#454545, .2));
-}
-
-.btn.dropdown-toggle, .btn.dropdown-toggle:hover {
-	@include box-shadow(0 2px 0 darken($white, .8));
-}
-
-.btn-primary.dropdown-toggle, .btn-primary.dropdown-toggle:hover {
-	@include box-shadow(0 2px 0 darken($btnPrimaryBackground, .3));
-}
-
-.btn-warning.dropdown-toggle, .btn-warning.dropdown-toggle:hover {
-	@include box-shadow(0 2px 0 darken($yellow, .3));
-}
-
-.btn-danger.dropdown-toggle, .btn-danger.dropdown-toggle:hover {
-	@include box-shadow(0 2px 0 darken(#ee5f5b, .3));
-}
-
-.btn-success.dropdown-toggle, .btn-success.dropdown-toggle:hover {
-	@include box-shadow(0 2px 0 darken(#62c462, .3));
-}
-
-.btn-info.dropdown-toggle, .btn-info.dropdown-toggle:hover {
-	@include box-shadow(0 2px 0 darken(#5bc0de, .4));
-}
-
-.btn-inverse.dropdown-toggle, .btn-inverse.dropdown-toggle:hover {
-	@include box-shadow(0 2px 0 darken(#454545, .2));
-}
-
-.btn.active,
-.btn:active {
-	position: relative;
-	top: 1px;
-	left: -1px;
-	@include box-shadow(-1px 1px 0 darken($white, .8))
-}
-
-.btn.disabled,
-.btn.disabled.active,
-.btn.disabled:active,
-.btn[disabled] {
-	@include box-shadow(none);
-	text-shadow: none;
-	top: 0;
-	left: 0;
-}
-
-[class^="icon-"], [class*=" icon-"] {
-	vertical-align: -13%;
-}
-
 // NAVIGATION
 // --------------------------------------------------
 
 .nav .nav-header {
-	color: $linkColor;
-	text-shadow:none;
+	color: $textColor;
+	text-shadow: none;
 }
 
 .nav-list {
@@ -364,7 +253,7 @@ div.subnav {
 }
 
 .nav-list li > a:hover {
-	background-color: lighten($blue, .1);
+	background-color: lighten($blue, 10%);
 }
 
 .nav-tabs, .nav-tabs.nav-stacked > li > a {
@@ -387,7 +276,7 @@ div.subnav {
 
 	li > a:hover,
 	&.nav-stacked > li > a:hover {
-		background-color: lighten($blue, .1);
+		background-color: lighten($blue, 10%);
 		border-color: transparent;
 	}
 }
@@ -398,14 +287,14 @@ div.subnav {
 }
 
 .nav-pills > li:hover > a {
-	background-color: lighten($blue, .1);
+	background-color: lighten($blue, 10%);
 	border-color: transparent;
 }
 
 .nav-tabs .open .dropdown-toggle,
 .nav-pills .open .dropdown-toggle,
 .nav > .open.active > a:hover {
-	background-color: lighten($blue, .1);
+	background-color: lighten($blue, 10%);
 	border-color: transparent;
 }
 
@@ -442,141 +331,216 @@ div.subnav {
 	}
 }
 
-.pagination ul {
+.pagination {
 
-	background-color: $blue;
-	background-image: none;
-	border-color: transparent;
+	ul {
+		background-image: none;
+		border-color: transparent;
+	}
 
-	li > a {
+	ul > li > a,
+	ul > li > span {
 		border: none;
 		color: $textColor;
 	}
 
-	li.active > a,
-	li.active > a:hover {
-		background: $orange;
-		color: $white;
+	ul > li > a:hover {
+		background: lighten($blue, 10%);
 	}
 
-	li > a:hover {
-		background: lighten($blue, .1);
+	ul > .active > a,
+	ul > .active > a:hover,
+	ul > .active > span,
+	ul > .active > span:hover {
+		background-color: $orange;
+		color: $white;
 	}
 
-	li.disabled > a,
-	li.disabled > a:hover {
-		background: darken($blue, .05);
+	ul > .disabled > a,
+	ul > .disabled > a:hover,
+	ul > .disabled > span,
+	ul > .disabled > span:hover {
+		background: darken($blue, 5%);
 	}
 }
 
-.pager a {
-	color: $textColor;
-	background-color: $blue;
-	border-color: transparent;
+.pager {
 
-	&:hover {
-		background: lighten($blue, .1);
+	a {
+		color: $textColor;
+		background-color: $blue;
+		border-color: transparent;
+
+		&:hover {
+			background: lighten($blue, 10%);
+		}
+	}
+
+	.disabled a,
+	.disabled a:hover {
+		background-color: $blue;
 	}
 }
 
-// FORMS
+// BUTTONS
 // --------------------------------------------------
 
-input, button, select, textarea {
-	font-family: 'Noticia Text', serif;
+.btn,
+.btn:hover {
+	text-shadow: none;
+	background-image: none;
+	@include box-shadow(-2px 2px 0 rgba(0, 0, 0, 0.2));
+	border: none;
 }
 
-legend {
-	border-bottom: none;
+.btn-warning {
+	background-color: $yellow;
 }
 
-label {
-	color: $textColor;
-	line-height: 15px;
+.btn-primary, .btn-primary:hover {
+	@include box-shadow(-2px 2px 0 darken($btnPrimaryBackground, 30%));
 }
 
-.help-block {
-	color: $textColor;
-	opacity: 0.6;
+.btn-warning, .btn-warning:hover {
+	@include box-shadow(-2px 2px 0 darken($yellow, 30%));
 }
 
-.form-actions {
-	border-top: none;
+.btn-danger, .btn-danger:hover {
+	@include box-shadow(-2px 2px 0 darken(#ee5f5b, 30%));
 }
 
-.control-group.warning {
-  @include formFieldState(lighten($warningText, .1), lighten($warningText, .1), $warningBackground);
+.btn-success, .btn-success:hover {
+	@include box-shadow(-2px 2px 0 darken(#62c462, 30%));
 }
 
-.control-group.error {
-  @include formFieldState(lighten($errorText, .1), lighten($errorText, .1), $errorBackground);
+.btn-info, .btn-info:hover {
+	@include box-shadow(-2px 2px 0 darken(#5bc0de, 40%));
 }
 
-.control-group.success {
-  @include formFieldState(lighten($successText, .1), lighten($successText, .1), $successBackground);
+.btn-inverse, .btn-inverse:hover {
+	@include box-shadow(-2px 2px 0 darken(#454545, 20%));
 }
 
-// MODALS
-// --------------------------------------------------
+.btn.dropdown-toggle, .btn.dropdown-toggle:hover {
+	@include box-shadow(0 2px 0 darken($white, 80%));
+}
 
-.modal {
-	background-color: transparent;
+.btn-primary.dropdown-toggle, .btn-primary.dropdown-toggle:hover {
+	@include box-shadow(0 2px 0 darken($btnPrimaryBackground, 30%));
+}
+
+.btn-warning.dropdown-toggle, .btn-warning.dropdown-toggle:hover {
+	@include box-shadow(0 2px 0 darken($yellow, 30%));
+}
+
+.btn-danger.dropdown-toggle, .btn-danger.dropdown-toggle:hover {
+	@include box-shadow(0 2px 0 darken(#ee5f5b, 30%));
+}
+
+.btn-success.dropdown-toggle, .btn-success.dropdown-toggle:hover {
+	@include box-shadow(0 2px 0 darken(#62c462, 30%));
+}
+
+.btn-info.dropdown-toggle, .btn-info.dropdown-toggle:hover {
+	@include box-shadow(0 2px 0 darken(#5bc0de, 40%));
+}
+
+.btn-inverse.dropdown-toggle, .btn-inverse.dropdown-toggle:hover {
+	@include box-shadow(0 2px 0 darken(#454545, 20%));
+}
+
+.btn.active,
+.btn:active {
+	position: relative;
+	top: 1px;
+	left: -1px;
+	@include box-shadow(-1px 1px 0 darken($white, 80%))
 }
 
-.modal-header,
-.modal-body,
-.modal-footer {
+.btn.disabled,
+.btn.disabled.active,
+.btn.disabled:active,
+.btn[disabled] {
 	@include box-shadow(none);
-	background-color: $bodyBackground;
-	border: none;
+	text-shadow: none;
+	top: 0;
+	left: 0;
 }
 
-.modal-header {
-	@include border-radius(4px 4px 0 0);
+[class^="icon-"], [class*=" icon-"] {
+	vertical-align: -13%;
 }
 
-.modal-footer {
-	@include border-radius(0 0 4px 4px);
+// TABLES
+// -----------------------------------------------------
+
+.table,
+.table-striped tbody > tr > td:first-child,
+.table-striped tbody > tr > td:last-child, {
+	@include border-radius(4px);
 }
 
-// MISCELLANEOUS
+// FORMS
 // --------------------------------------------------
 
-.page-header {
+input, button, select, textarea {
+	font-family: 'Noticia Text', serif;
+}
+
+legend {
 	border-bottom: none;
+	font-family: $headingsFontFamily;
+	color: $orange;
+	text-shadow: -2px 2px 0 darken($orange, 30%);
 }
 
-footer.footer {
-	border-top: 1px solid darken($blueDark, .05);
+label {
+	color: $textColor;
+	line-height: 15px;
 }
 
-.well, .hero-unit {
-	background-color: $blue;
-	border: none;
-	@include box-shadow(none);
+.help-block {
+	color: $textColor;
+	opacity: 0.6;
 }
 
-.hero-unit h1 {
-	color: $orange;
-	line-height: 2em;
+.form-actions {
+	border-top: none;
 }
 
-.progress {
-	background-color: darken($blueDark, .05);
-	background-image: none;
-	@include box-shadow(none);
+.control-group.warning {
+  @include formFieldState(lighten($warningText, 10%), lighten($warningText, 10%), $warningBackground);
+}
 
-	.bar {
-		@include box-shadow(none);
-	}
+.control-group.error {
+  @include formFieldState(lighten($errorText, 10%), lighten($errorText, 10%), $errorBackground);
 }
 
-.thumbnail {
-	border: none;
-	background: $blue;
-	@include border-radius(3px);
+.control-group.success {
+  @include formFieldState(lighten($successText, 10%), lighten($successText, 10%), $successBackground);
+}
+
+.input-append .add-on,
+.input-prepend .add-on,
+.input-append .btn,
+.input-prepend .btn {
+	color: $bodyBackground;
+}
+
+// DROPDOWNS
+// --------------------------------------------------
+
+.dropdown .caret {
+	margin-top: 14px;
+	opacity: 1;
+	border-left: 6px solid transparent;
+	border-right: 6px solid transparent;
+	border-top: 6px solid lighten($blue, 10%);
 }
 
+// ALERTS, LABELS, BADGES
+// --------------------------------------------------
+
 .label {
 	background-color: $blue;
   	color: $textColor;
@@ -605,7 +569,7 @@ footer.footer {
   text-shadow: none;
 
   a {
-  	color: lighten($orange, .12);
+  	color: lighten($orange, 12%);
   }
 }
 
@@ -626,3 +590,77 @@ footer.footer {
   background-color: $infoText;
 }
 
+// MISC
+// --------------------------------------------------
+
+.well, .hero-unit {
+	border: none;
+	@include box-shadow(none);
+}
+
+.hero-unit h1 {
+	color: $orange;
+	line-height: 2em;
+}
+
+.progress {
+	background-color: darken($blueDark, 5%);
+	background-image: none;
+	@include box-shadow(none);
+
+	.bar {
+		@include box-shadow(none);
+	}
+}
+
+.thumbnail {
+	border: none;
+	background: $blue;
+	@include border-radius(3px);
+}
+
+.modal {
+	background-color: transparent;
+
+	.modal-header,
+	.modal-body,
+	.modal-footer {
+		@include box-shadow(none);
+		background-color: $bodyBackground;
+		border: none;
+	}
+
+	.modal-header {
+		@include border-radius(4px 4px 0 0);
+	}
+
+	.modal-footer {
+		@include border-radius(0 0 4px 4px);
+	}
+}
+
+// MEDIA QUERIES
+// --------------------------------------------------
+
+@media (max-width: 768px) {
+
+	div.subnav {
+
+		.nav > li {
+
+			&:first-child > a,
+			&:first-child > a:hover,
+			&.active:first-child > a,
+			&.active:first-child > a:hover {
+				@include border-radius(4px 4px 0 0);
+			}
+
+			&:last-child > a,
+			&:last-child > a:hover,
+			&.active:last-child > a,
+			&.active:last-child > a:hover {
+				@include border-radius(0 0 4px 4px);
+			}
+		}
+	}
+}