/**
 * Theme:	Flat Bootstrap
 * File:	theme-flat.css
 * 
 * The stylesheet for our flat ui
 *
 * Contains our custom fonts, color palette, sections with padding, etc.
 *
 * @package flat-bootstrap
 */

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Elements
# Colors
# Padding
# Forms and Buttons
# Alerts
# Grid
# Widgets
# Plugins
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/

/* 
 * For now, set some of our own generic icon sizes, since WordPress includes some icons
 * already, such as glyphicons. This theme uses font-awesome which has way more icons and
 * has its own size and padding options, such as fa-2x, fa-3x, etc.
 * 
 * NOTE that the WordPress visual editor strips blank icon (<i></i>) and span
 * (<span></span>) tags. You MUST add a &nbsp; in between the tags to preserve them.
 * 
 * TO-DO: Find a filter to modify the WordPress function or TinyMCE editor function that 
 * strips these and either prevent that or automatically add the &nbsp; in between. We
 * can maybe even set &nbsp; in that case to be hidden although it doesn't seem to hurt
 * anything anyway. 
 * 
 * TO-DO: Consider deprecating this with Bootstrap v4 because it doesn't have ANY font
 * icons, so we will always load font-awesome in our themes and it has its own fa-2x, 
 * fa-3x, etc. sizes
 * 
 */
span.icon-lg,
i.icon-lg {
    font-size: 50px;
	padding: 0 15px;
}
span.icon-xlg,
i.icon-xlg {
    font-size: 72px;
	padding: 0 25px;
}

/*--------------------------------------------------------------
# Colors
--------------------------------------------------------------*/

/* 
 * Our color palette based off of designmodo's "flat-ui", but with normal color names
 * assigned instead and some additional ones added for lighter and darker colors.
 */

.bg-white, 
.has-white-background-color {
	background-color: #fff;
}
.color-white, 
.has-white-color {
	color: #fff !important;
}

.bg-offwhite, 
.has-offwhite-background-color {
	background-color: #f2f2f2;
}
.color-offwhite, 
.has-offwhite-color {
	color: #f2f2f2 !important;
}

.bg-lightgray, 
.has-lightgray-background-color {
	background-color: #ebebeb;
}
.color-lightgray, 
.has-lightgray-color {
	color: #ebebeb !important;
}

.bg-gray, 
.has-gray-background-color {
	background-color: #e7e7e7;
}
.color-gray, 
.has-gray-color {
	color: #e7e7e7 !important;
}

.bg-darkgray, 
.has-darkgray-background-color {
	background-color: #e0e0e0;
}
.color-darkgray, 
.has-darkgray-color {
	color: #e0e0e0 !important;
}

.bg-lightgreen, 
.has-lightgreen-background-color {
    background-color: #1abc9c;
	color: #f2f2f2;
    font-weight: normal;
}
.color-lightgreen, 
.has-lightgreen-color {
    color: #1abc9c !important;
}
.bg-lightgreen h1, 
.bg-lightgreen h2, 
.bg-lightgreen h3, 
.bg-lightgreen h4,
.bg-lightgreen h5, 
.bg-lightgreen h6 {
	color: #fff;
}

.bg-darkgreen, 
.has-darkgreen-background-color {
    background-color: #16a085;
	color: #f2f2f2;
    font-weight: normal;
}
.color-darkgreen, 
.has-darkgreen-color {
    color: #16a085 !important;
}

.bg-darkgreen h1, 
.bg-darkgreen h2, 
.bg-darkgreen h3, 
.bg-darkgreen h4, 
.bg-darkgreen h5, 
.bg-darkgreen h6 {
	color: #fff;
}

.bg-brightgreen, 
.has-brightgreen-background-color {
	background-color: #2ecc71;
	color: #f2f2f2;
    font-weight: normal;
}
.color-brightgreen, 
.has-brightgreen-color {
    color: #2ecc71 !important;
}

.bg-brightgreen h1, 
.bg-brightgreen h2, 
.bg-brightgreen h3, 
.bg-brightgreen h4, 
.bg-brightgreen h5, 
.bg-brightgreen h6 {
	color: #fff;
}

.bg-darkbrightgreen, 
.has-darkbrightgreen-background-color {
	background-color: #27AE60;
	color: #f2f2f2;
    font-weight: normal;
}
.color-darkbrightgreen, 
.has-darkbrightgreen-color {
    color: #27ae60 !important;
}

.bg-darkbrightgreen h1, 
.bg-darkbrightgreen h2, 
.bg-darkbrightgreen h3, 
.bg-darkbrightgreen h4, 
.bg-darkbrightgreen h5, 
.bg-darkbrightgreen h6 {
	color: #fff;
}

.bg-yellow, 
.has-yellow-background-color {
    background: #f1c40f;
	color: #f2f2f2;
    font-weight: normal;
}

.color-yellow, 
.has-yellow-color {
	color: #f1c40f !important;
}

.bg-yellow h1, 
.bg-yellow h2, 
.bg-yellow h3, 
.bg-yellow h4, 
.bg-yellow h5, 
.bg-yellow h6 {
	color: #fff;
}

.bg-lightorange, 
.has-lightorange-background-color {
    background-color: #f39c12;
	color: #f2f2f2;
    font-weight: normal;
}
.color-lightorange, 
.has-lightorange-color {
	color: #F39C12 !important;
}

.bg-lightorange h1, 
.bg-lightorange h2, 
.bg-lightorange h3, 
.bg-lightorange h4, 
.bg-lightorange h5, 
.bg-lightorange h6 {
	color: #fff;
}

.bg-orange, 
.has-orange-background-color {
    background-color: #e67e22;
	color: #f2f2f2;
    font-weight: normal;
}
.color-orange, 
.has-organge-color {
	color: #E67E22 !important;
}

.bg-orange h1, 
.bg-orange h2, 
.bg-orange h3, 
.bg-orange h4, 
.bg-orange h5, 
.bg-orange h6 {
	color: #fff;
}

.bg-darkorange, 
.has-darkorange-background-color {
    background-color: #D35400;
	color: #f2f2f2;
    font-weight: normal;
}
.color-darkorange, 
.has-darkorange-color {
	color: #D35400 !important;
}

.bg-darkorange h1, 
.bg-darkorange h2, 
.bg-darkorange h3, 
.bg-darkorange h4, 
.bg-darkorange h5, 
.bg-darkorange h6 {
	color: #fff;
}

.bg-blue, 
.has-blue-background-color {
	background-color: #3498db;
	color: #fff;
}
.color-blue, 
.has-blue-color {
	color: #3498db !important;
}

.bg-blue h1, 
.bg-blue h2, 
.bg-blue h3, 
.bg-blue h4, 
.bg-blue h5, 
.bg-blue h6 {
	color: #fff;
}

.bg-darkblue, 
.has-darkblue-background-color {
	background-color: #2980b9;
	color: #fff;
}
.color-darkblue, 
.has-darkblue-color {
	color: #2980b9 !important;
}

.bg-darkblue h1, 
.bg-darkblue h2, 
.bg-darkblue h3, 
.bg-darkblue h4, 
.bg-darkblue h5, 
.bg-darkblue h6 {
	color: #fff;
}

.bg-midnightblue, 
.has-midnightblue-background-color {
	background-color: #34495e;
	color: #fff;
}
.color-midnightblue, 
.has-midnightblue-color {
	color: #34495e !important;
}

.bg-midnightblue h1, 
.bg-midnightblue h2, 
.bg-midnightblue h3, 
.bg-midnightblue h4, 
.bg-midnightblue h5, 
.bg-midnightblue h6 {
	color: #fff;
}

.bg-darkmidnightblue, 
.has-darkmidnightblue-background-color {
	background-color: #2C3E50;
	color: #fff;
}
.color-darkmidnightblue, 
.has-darkmidnightblue-color {
	color: #2C3E50 !important;
}

.bg-darkmidnightblue h1, 
.bg-darkmidnightblue h2, 
.bg-darkmidnightblue h3, 
.bg-darkmidnightblue h4, 
.bg-darkmidnightblue h5, 
.bg-darkmidnightblue h6 {
	color: #fff;
}

.bg-purple, 
.has-purple-background-color {
	background-color: #9B59B6;
	color: #fff;
    font-weight: normal;
}
.color-purple, 
.has-purple-color {
	color: #9B59B6 !important;
}

.bg-purple h1, 
.bg-purple h2, 
.bg-purple h3, 
.bg-purple h4, 
.bg-purple h5, 
.bg-purple h6 {
	color: #fff;
}

.bg-darkpurple, 
.has-darkpurple-background-color {
	background-color: #8e44ad;
	color: #fff;
    font-weight: normal;
}
.color-darkpurple, 
.has-darkpurple-color {
	color: #8e44ad !important;
}

.bg-darkpurple h1, 
.bg-darkpurple h2, 
.bg-darkpurple h3, 
.bg-darkpurple h4, 
.bg-darkpurple h5, 
.bg-darkpurple h6 {
	color: #fff;
}

.bg-red, 
.has-red-background-color {
	background-color: #ff7878;
	color: #f2f2f2;
    font-weight: normal;
}
.color-red, 
.has-red-color {
	color: #ff7878 !important;
}

.bg-red h1, 
.bg-red h2, 
.bg-red h3, 
.bg-red h4, 
.bg-red h5, 
.bg-red h6 {
	color: #fff;
}

.bg-brightred, 
.has-brightred-background-color {
	background-color: #e74c3c;
	color: #f2f2f2;
    font-weight: normal;
}
.color-brightred, 
.has-brightred-color {
	color: #e74c3c !important;
}

.bg-brightred h1, 
.bg-brightred h2, 
.bg-brightred h3, 
.bg-brightred h4, 
.bg-brightred h5, 
.bg-brightred h6 {
	color: #fff;
}

.bg-darkred, 
.has-darkred-background-color {
	background-color: #c0392b;
	color: #f2f2f2;
    font-weight: normal;
}
.color-darkred, 
.has-darkred-color {
	color: #c0392b !important;
}

.bg-darkred h1, 
.bg-darkred h2, 
.bg-darkred h3, 
.bg-darkred h4, 
.bg-darkred h5, 
.bg-darkred h6 {
	color: #fff;
}

.bg-almostblack, 
.has-almostblack-background-color {
	background-color: #2f2f2f;
	color: #fff;
}
.color-almostblack, 
.has-almostblack-color {
	color: #2f2f2f !important;
}

.bg-almostblack h1, 
.bg-almostblack h2, 
.bg-almostblack h3, 
.bg-almostblack h4, 
.bg-almostblack h5, 
.bg-almostblack h6 {
	color: #fff;
}

.bg-notquiteblack, 
.has-notquiteblack-background-color {
	background-color: #222;
	color: #fff;
}
.color-notquiteblack, 
.has-notquiteblack-color {
	color: #222 !important;
}

.bg-notquiteblack h1, 
.bg-notquiteblack h2, 
.bg-notquiteblack h3, 
.bg-notquiteblack h4, 
.bg-notquiteblack h5, 
.bg-notquiteblack h6 {
	color: #fff;
}

.bg-black, 
.has-black-background-color {
	background-color: #000;
	color: #fff;
}
.color-black, 
.has-black-color {
	color: #000 !important;
}

.bg-black h1, 
.bg-black h2, 
.bg-black h3, 
.bg-black h4, 
.bg-black h5, 
.bg-black h6 {
	color: #fff;
}

/* Increase contrast on certain colored backgrounds. We increase the font weight, but
 * then tone the font color down a bit (offwhite). 
 */
.bg-yellow,
.bg-lightorange,
.bg-orange,
.bg-darkorange,
.bg-lightgreen,
.bg-darkgreen,
.bg-brightgreen,
.bg-darkbrightgreen {
	color: #f2f2f2;
    font-weight: normal;
}

/* Set the icons to white for all dark-colored sections */
.bg-lightgreen i, 
.bg-darkgreen i, 
.bg-brightgreen i, 
.bg-darkbrightgreen i, 
.bg-yellow i,
.bg-lightorange i,
.bg-orange i,
.bg-darkorange i,
.bg-blue i, 
.bg-darkblue i, 
.bg-midnightblue i, 
.bg-darkmidnightblue i, 
.bg-purple i, 
.bg-darkpurple i, 
.bg-red i, 
.bg-brightred i, 
.bg-darkred i, 
.bg-notquitetblack i, 
.bg-almostblack i, 
.bg-black i {
	color: #fff;
	font-weight: bold;
	text-decoration: none;
	border: none;
}

.bg-lightgreen a i:hover, 
.bg-darkgreen a i:hover, 
.bg-brightgreen a i:hover, 
.bg-darkbrightgreen a i:hover, 
.bg-yellow a i:hover,
.bg-lightorange a i:hover,
.bg-orange a i:hover,
.bg-darkorange a i:hover,
.bg-blue a i:hover, 
.bg-darkblue a i:hover, 
.bg-midnightblue a i:hover, 
.bg-darkmidnightblue a i:hover, 
.bg-purple a i:hover, 
.bg-darkpurple a i:hover, 
.bg-red a i:hover, 
.bg-brightred a i:hover, 
.bg-darkred a i:hover, 
.bg-notquitetblack a i:hover, 
.bg-almostblack a i:hover, 
.bg-black a i:hover {
	color: #e7e7e7;
	font-weight: bold;
	text-decoration: none;
	border: none;
}

/* Set the link and hover colors for dark sections */
.bg-lightgreen a:not(.btn),
.bg-darkgreen a:not(.btn), 
.bg-brightgreen a:not(.btn), 
.bg-darkbrightgreen a:not(.btn), 
.bg-yellow a:not(.btn),
.bg-lightorange a:not(.btn),
.bg-orange a:not(.btn), 
.bg-darkorange a:not(.btn), 
.bg-blue a:not(.btn), 
.bg-darkblue a:not(.btn), 
.bg-midnightblue a:not(.btn), 
.bg-darkmidnightblue a:not(.btn), 
.bg-purple a:not(.btn), 
.bg-darkpurple a:not(.btn), 
.bg-red a:not(.btn),
.bg-brightred a:not(.btn),
.bg-darkred a:not(.btn) {
	color: #fff;
	font-weight: bold;
	text-decoration: none;
	border: none;
}

.bg-lightgreen a:hover:not(.btn),
.bg-darkgreen a:hover:not(.btn), 
.bg-brightgreen a:hover:not(.btn), 
.bg-darkbrightgreen a:hover:not(.btn), 
.bg-yellow a:hover:not(.btn), 
.bg-lightorange a:hover:not(.btn),
.bg-orange a:hover:not(.btn),
.bg-darkorange a:hover:not(.btn), 
.bg-blue a:hover:not(.btn), 
.bg-darkblue a:hover:not(.btn), 
.bg-midnightblue a:hover:not(.btn), 
.bg-darkmidnightblue a:hover:not(.btn), 
.bg-purple a:hover:not(.btn), 
.bg-darkpurple a:hover:not(.btn), 
.bg-red a:hover:not(.btn),
.bg-brightred a:hover:not(.btn),
.bg-darkred a:hover:not(.btn) {
	color: #e7e7e7;
	font-weight: bold;
	text-decoration: none;
	border: none;
}

/*--------------------------------------------------------------
# Padding
--------------------------------------------------------------*/

/* 
 * We want 24px equal "whitespace" on all sides. When MANUALLY applying a padding, assume
 * the section starts with an hx tag and already has 24px top margin. Also assume the
 * section ends with a p, ul, etc. tag which already has 12px bottom margin. Users can
 * adjust with Bootstrap 4 m-t-1 and m-b-1, etc.
 */
.padding {
 	padding: 0 24px 12px 24px;
 	/*padding: 24px;*/
}
.padding-top {
	padding-top: 24px;
}
.padding-bottom {
	padding-bottom: 24px;
}
.padding-top-bottom {
	padding: 24px 0;
}
.padding-right {
	padding-right: 24px;
}
.padding-left {
	padding-left: 24px;
}
.padding-left-right {
	padding-left: 24px;
	padding-right: 24px;
}
.nopadding-nomargin {
    margin: 0 !important;
    padding: 0 !important;
}

/* 
 * When AUTOMATICALLY applying a padding with our plugin, set the padding back to being
 * equal. Then remove the top margin from the widget title and late remove bottom padding
 * for individual widgets that need it.
 */
.widget.padding {
	padding-top: 24px;
	padding-bottom: 24px;
}
.padding .widget-title {
	margin-top: 0;
}

/* 
 * We want 48px equal top and bottom "whitespace" on a section. When MANUALLY applying a
 * section, assume the section starts with an hx tag and already has 24px top margin. 
 * Also assume the section ends with a p, ul, etc. tag which already has 12px bottom
 * margin. Users can adjust with Bootstrap 4 m-t-2 and m-b-1, etc.
 */
.section {
	padding-top: 24px;
	padding-bottom: 36px;
	/*padding-top: 48px;
	padding-bottom: 48px;*/
}
.section.nopadding {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}
.section.nopadding-top {
	padding-top: 0 !important;
}
.section.nopadding-bottom {
	padding-bottom: 0 !important;
}
.section.border-bottom {
	border-bottom: #bdc3c7 solid 1px;
}
.section.border-bottom-thick {
	border-bottom: #bdc3c7 solid 5px;
}

/* 
 * When AUTOMATICALLY applying a section with our plugin, set the padding back to being
 * equal. Then remove the top margin from the widget title and later remove bottom padding
 * for individual widgets that need it.
 */
.widget.section {
	padding-top: 48px;
	padding-bottom: 48px;
}

.section .widget-title {
	margin-top: 0;
}

/* When widgets are center aligned, remove left padding / margins from nested lists */
/*.section .aligncenter ul ul, 
.padding .aligncenter ul ul {
	padding-left: 0;
}*/

/*#secondary > .padding .aligncenter ul ul, 
#sidebar-pagetop > .padding .aligncenter ul ul,
#sidebar-pagebottom > .padding .aligncenter ul ul,
#sidebar-home > .padding .aligncenter ul ul,
footer#colophon.site-footer > .padding .aligncenter ul ul,
#secondary > .section .aligncenter ul ul, 
#sidebar-pagetop > .section .aligncenter ul ul,
#sidebar-pagebottom > .section .aligncenter ul ul,
#sidebar-home > .section .aligncenter ul ul,
footer#colophon.site-footer > .section .aligncenter ul ul {
	padding-left: 0;
}*/

/* 
 * NOTE: See below Widgets and Plugins sections for more specific tweaks to margins and
 * padding
*/

/*--------------------------------------------------------------
# Forms and Buttons
--------------------------------------------------------------*/

/* New Bootstrap v4 "inverse" (dark) button. In our case it's midnight blue. */
.btn-inverse {
  color: #ffffff;
  background-color: #34495e;
}
.btn-inverse:hover,
.btn-inverse.hover,
.btn-inverse:focus,
.btn-inverse:active,
.btn-inverse.active,
.open > .dropdown-toggle.btn-inverse {
  color: #ffffff;
  background-color: #415b76;
  border-color: #415b76;
}
.btn-inverse:active,
.btn-inverse.active,
.open > .dropdown-toggle.btn-inverse {
  background: #2c3e50;
  border-color: #2c3e50;
}
.btn-inverse.disabled,
.btn-inverse[disabled],
fieldset[disabled] .btn-inverse,
.btn-inverse.disabled:hover,
.btn-inverse[disabled]:hover,
fieldset[disabled] .btn-inverse:hover,
.btn-inverse.disabled.hover,
.btn-inverse[disabled].hover,
fieldset[disabled] .btn-inverse.hover,
.btn-inverse.disabled:focus,
.btn-inverse[disabled]:focus,
fieldset[disabled] .btn-inverse:focus,
.btn-inverse.disabled:active,
.btn-inverse[disabled]:active,
fieldset[disabled] .btn-inverse:active,
.btn-inverse.disabled.active,
.btn-inverse[disabled].active,
fieldset[disabled] .btn-inverse.active {
  background-color: #bdc3c7;
  border-color: #34495e;
}
.btn-inverse .badge {
  color: #34495e;
  background-color: #ffffff;
}

/* New "hollow" ("outline") button that is inverted so works on any dark background */
a.btn.btn-hollow,
button.btn.btn-hollow {
	/*color: #f2f2f2;*/
	color: #fff;
  	border: 2px solid #fff;
    background-color: transparent;
}
.btn-hollow:hover, 
btn.btn-hollow:hover,
button.btn.btn-hollow:hover {
    color: #2f2f2f;
    background-color: #fff;
}

.bg-white button.btn.btn-hollow, 
.bg-white .btn.btn-hollow, 
.bg-offwhite button.btn.btn-hollow, 
.bg-offwhite .btn.btn-hollow, 
.bg-lightgray button.btn.btn-hollow, 
.bg-lightgray .btn.btn-hollow, 
.bg-gray button.btn.btn-hollow, 
.bg-gray .btn.btn-hollow, 
.bg-darkgray button.btn.btn-hollow, 
.bg-darkgray .btn.btn-hollow {
	color: #1abc9c;
	border: 2px solid #1abc9c;
    background-color: transparent;
}
button.btn.btn-hollow:hover, 
.btn.btn-hollow:hover {
    color: #2f2f2f;
    background-color: #f2f2f2;
}

/* 
 * New "transparent" or button that is partially transparent to let background color 
 * show through 
 */
.btn-transparent {
    display: inline-block;
    background-color: rgba(0, 0, 0, 0.35);
    color: #fff;
}
.btn-transparent:hover, 
.btn-transparent:focus {
    color: #f2f2f2;
    background-color: rgba(0, 0, 0, 0.5);
    border-color: rgba(0, 0, 0, 0.5);
    text-decoration: none;
}
.bg-almostblack .btn-transparent:hover,
.bg-almostblack .btn-transparent:focus,
.bg-notquiteblack .btn-transparent:hover,
.bg-notquiteblack .btn-transparent:focus {
    background-color: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.15);
}
.bg-black .btn-transparent {
    background-color: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.1);
}
.bg-black .btn-transparent:hover,
.bg-black .btn-transparent:focus {
    background-color: rgba(255, 255, 255, 0.20);
    border-color: rgba(255, 255, 255, 0.20);
}

/**
 * TO-DO: Style Gutenberg buttons like ours
 */
/*.wp-block-button {
}*/

/*--------------------------------------------------------------
# Alerts
--------------------------------------------------------------*/

/* Add alert-primary as for some reason Bootstrap doesn't include it */
.alert-primary {
  background-color: #1abc9c;
  border-color: #1abc9c;
  color: #ffffff;
}
.alert-primary hr {
  border-top-color: #17a689;
}
.alert-primary .alert-link {
  color: #e6e6e6;
}

/*--------------------------------------------------------------
# Grid
--------------------------------------------------------------*/
/* 
 * Enhance Bootstrap to allow for columns with no gutter (margin) 
 * TO-DO: Bootstrap 4 handles this stuff already, so consider removing at that time
 */

/* Bootstrap grids (rows) need this if not in a container. Its probably better to just 
 * use container-fluid, but this is another more generic option.
 * TO-DO: Consider getting rid of this if we change to container-fluid
*/
.section.fullwidth {
	padding-left: 15px;
	padding-right: 15px;
}

.row.no-gutters {
  margin-right: 0;
  margin-left: 0;
}
.row.no-gutters > [class^="col-"],
.row.no-gutters > [class*=" col-"] {
  padding-right: 0;
  padding-left: 0;
}

/*--------------------------------------------------------------
# Widgets
--------------------------------------------------------------*/

/* 
 * These widgets already have bottom margin on the last element, so reduce bottom padding
 * in our colored sections: Text widget, Custom Menu widget.
 */
.section.widget_text,
.section.widget_nav_menu {
	padding-bottom: 36px;
}
.padding.widget_text,
.padding.widget_nav_menu {
	padding-bottom: 12px;
}

/* 
 * When search form collapses, we need to leave the bottom margin so adjust whitespace
 * in our padded sections.
*/
/* 
 * Search widget form. Remove bottom margin in our sections because it's non-standard
 * (5px). 
 */
/*.section .search-form label,
.padding .search-form label {
	margin-bottom: 0;
}*/
.section .search-submit,
.padding .search-submit {
	margin-bottom: 5px; /* match input field */
}
.section.widget_search {
	padding-bottom: 43px; /* reduce by 5px added above */
}
.padding.widget_search {
	padding-bottom: 19px; /* reduce by 5px added above */
}

/* Calendar widget. Inherit colors in our sections. */
.section .widget_calendar #wp-calendar,
.padding .widget_calendar #wp-calendar {
	color: inherit;
}
.section #wp-calendar caption,
.padding #wp-calendar caption {
	color: inherit;
}

/*--------------------------------------------------------------
# Plugins
--------------------------------------------------------------*/

/* Jetpack Contact Info widget. ALWAYS add bottom margin to map. */
.widget_contact_info .contact-map {
	margin-bottom: 12px;
}

/* 
 * Jetpack Subscription widget. Already has bottom margin on the last element, so reduce 
 * bottom padding in our colored sections.
 */
.section.jetpack_subscription_widget {
	padding-bottom: 36px;
}
.padding.jetpack_subscription_widget {
	padding-bottom: 12px;
}