style.css

/*
Theme Name: Billie
Theme URI:
Author: Carolina Nymark
Author URI: https://themesbycarolina.com
Description: Billie is a responsive, accessible blog theme. The theme has two optional menus (including a social menu), several different sidebars and a footer widget area that will hold any number of widgets. The theme is compatible with the new block editor, and also includes a Call To Action button and two page sections that you can combine with your front page. I recommend that you install the Jetpack plugin to make full use of supported features like featured content, contact forms, testimonials, social sharing and more. To create a portfolio, install Jetpack and create your projects, all the templates are already shipped with the theme. Billie also works well with WooCommerce.
Version: 1.1.3
Requires at least: 5.0
Tested up to: 5.5
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Copyright: Carolina Nymark 2015-2020
Text Domain: billie
Tags: threaded-comments, custom-menu, sticky-post, editor-style, block-styles, wide-blocks, translation-ready, rtl-language-support, one-column, two-columns, right-sidebar, featured-images, accessibility-ready, custom-header, custom-logo, footer-widgets, blog

Resetting and rebuilding styles have been helped along
thanks to the fine work of Eric Meyer
https://meyerweb.com/eric/tools/css/reset/index.html
along with Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/ and Blueprint.
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
1.0 Reset
2.0 Typography
3.0 Elements
4.0 Forms
5.0 Navigation
	5.1 Links
	5.2 Menus
6.0 Accessibility
7.0 Alignments
8.0 Clearings
10.0 Content
	10.1 Call to action
	10.2 Posts and pages
	10.3 Comments
11.0 Jetpack
12.0 Media
	12.1 Captions
	12.2 Galleries
13.0 BBpress
14.0 Woocommerce
15.0 Blocks
16.0 Responsive widths
--------------------------------------------------------------*/

/*--------------------------------------------------------------
1.0 Reset
--------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}

html {
	font-size: 100%;
	overflow-y: scroll;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	box-sizing: border-box;
}

*,
*::before,
*::after {
	box-sizing: inherit;
	word-wrap: break-word;
}

body {
	background: #fafafa;
	overflow-x: hidden;
}

article,
details,
figcaption,
figure,
footer,
header,
main,
nav,
section {
	display: block;
}

ol,
ul {
	list-style: none;
}

table { /* tables still need 'cellspacing="0"' in the markup */
	border-collapse: separate;
	border-spacing: 0;
}

caption,
th,
td {
	text-align: left;
}

blockquote::before,
blockquote::after,
q::before,
q::after {
	content: "";
}

blockquote,
q {
	quotes: "" "";
}

a:focus {
	outline: thin dotted;
}

a:hover,
a:active {
	outline: 0;
}

a img {
	border: 0;
}

/*--------------------------------------------------------------
2.0 Typography
--------------------------------------------------------------*/
body,
button,
input,
select,
textarea {
	color: #333;
	font-family: 'Open Sans', sans-serif;
	font-size: 1rem;
	line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
	font-weight: inherit;
}

p {
	margin-bottom: 1rem;
}

b,
strong {
	font-weight: 700;
}

dfn,
cite,
em,
i {
	font-style: italic;
}

blockquote {
	margin-bottom: 2rem;
	border-left: 4px solid #000;
	padding-left: 1rem;
}

address {
	margin: 0 0 1.5em;
}

pre {
	background: #eee;
	font-family: Menlo, Consolas, monaco, monospace;
	line-height: 1.6;
	margin-bottom: 1.5rem;
	max-width: 100%;
	overflow: hidden;
	padding: 1.6em;
	word-wrap: break-word;
	white-space: pre-wrap;
}

code,
kbd,
tt,
var {
	font-family: Menlo, Consolas, monaco, monospace;
}

abbr,
acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

mark,
ins {
	background: #fff9c0;
	text-decoration: none;
}

sup,
sub {
	font-size: 75%;
	height: 0;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	bottom: 1ex;
}

sub {
	top: 0.5ex;
}

small {
	font-size: 75%;
}

big {
	font-size: 125%;
}

/*--------------------------------------------------------------
3.0 Elements
--------------------------------------------------------------*/
hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin-bottom: 1.5rem;
}

ul,
ol {
	margin-left: 1.5rem;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 1.5rem;
}

dt {
	font-weight: 700;
}

dd {
	margin: 0 1.5rem 1.5rem;
}

img {
	height: auto; /* Make sure images are scaled correctly. */
	max-width: 100%; /* Adhere to container width. */
}

figure {
	margin: 0;
}

table {
	margin: 15px 4px 20px 4px;
	border-collapse: collapse;
	border: 1px solid #ccc;
	width: 100%;
}

td {
	border: 1px solid #ccc;
	padding: 0.5rem;
}

th {
	background: #f5f5f5;
	padding: 0.5rem;
	border: 1px solid #ccc;
}

.wp-block-table td,
.wp-block-table th {
	border: 1px solid #ccc;
}

/*--------------------------------------------------------------
4.0 Forms
--------------------------------------------------------------*/
button,
input,
select,
textarea {
	font-size: 100%; /* Corrects font size not being inherited in all browsers */
	margin: 0; /* Addresses margins set differently in IE6/7, F3/4, S5, Chrome */
	vertical-align: baseline; /* Improves appearance and consistency in all browsers */
}

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	border: 1px solid;
	border-color: #ccc #ccc #bbb;
	border-radius: 3px;
	background: #e6e6e6;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), inset 0 15px 17px rgba(255, 255, 255, 0.5), inset 0 -5px 12px rgba(0, 0, 0, 0.05);
	color: rgba(0, 0, 0, 0.8);
	cursor: pointer; /* Improves usability and consistency of cursor style between image-type 'input' and others */
	-webkit-appearance: button; /* Corrects inability to style clickable 'input' types in iOS */
	line-height: 1;
	padding: 0.6em 1em 0.6em;
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	border-color: #ccc #bbb #aaa;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8), inset 0 15px 17px rgba(255, 255, 255, 0.8), inset 0 -5px 12px rgba(0, 0, 0, 0.02);
}

button:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus,
button:active,
input[type="button"]:active,
input[type="reset"]:active,
input[type="submit"]:active {
	border-color: #aaa #bbb #bbb;
	box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.5), inset 0 2px 5px rgba(0, 0, 0, 0.15);
}

input[type="checkbox"],
input[type="radio"] {
	padding: 0; /* Addresses excess padding in IE8/9 */
}

input[type="search"] {
	-webkit-appearance: textfield; /* Addresses appearance set to searchfield in S5, Chrome */
	box-sizing: content-box;
}

input[type="search"]::-webkit-search-decoration { /* Corrects inner padding displayed oddly in S5, Chrome on OSX */
	-webkit-appearance: none;
}

select,
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
textarea {
	color: #666;
	border: 1px solid #ccc;
	border-radius: 3px;
}

select:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
textarea:focus {
	color: #111;
	box-shadow: 0 0 5px rgba(162, 196, 251, 1);
	border: 1px solid rgba(162, 196, 251, 1);
}

select,
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"] {
	padding: 6px;
}

textarea {
	overflow: auto; /* Removes default vertical scrollbar in IE6/7/8/9 */
	padding-left: 3px;
	vertical-align: top; /* Improves readability and alignment in all browsers */
	width: 100%;
}

/*--------------------------------------------------------------
5.0 Navigation
--------------------------------------------------------------*/

.continue,
.more-link {
	position: relative;
	padding: 1rem;
	background: #fff;
	border: 1px solid #f2f2f2;
	border-radius: 4px;
	margin: 1.5rem 0;
	display: block;
}

.page-numbers:hover,
.prev:hover,
.next:hover,
.continue:focus,
.continue:hover,
.more-link:focus,
.more-link:hover,
.nav-previous:hover a,
.nav-next:hover a {
	text-decoration: none;
}

.nav-previous:before {
	content: "\f060";
	display: inline-block;
	font: normal normal normal 14px/1 FontAwesome;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-size: 14px;
	line-height: 1;
	color: #717171;
	margin-right: 0.5rem;
	margin-top: 4px;
	vertical-align: middle;
	float: left;
	text-decoration: none;
}

.nav-next:after {
	content: "\f061";
	display: inline-block;
	font: normal normal normal 14px/1 FontAwesome;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-size: 14px;
	line-height: 1;
	color: #717171;
	margin-left: 0.5rem;
	vertical-align: middle;
	text-decoration: none;
}

.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {
	margin: 0 0 3rem;
	overflow: hidden;
}

.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	display: inline-block;
	vertical-align: top;
	float: left;
	text-align: left;
	width: 40%;
	padding: 1rem;
	background: #fff;
	border: 1px solid #f2f2f2;
	border-radius: 4px;
}

.posts-navigation .nav-next,
.post-navigation .nav-next {
	display: inline-block;
	vertical-align: top;
	float: right;
	text-align: right;
	width: 40%;
	padding: 1rem;
	background: #fff;
	border: 1px solid #f2f2f2;
	border-radius: 4px;
}

.comment-navigation {
	display: inline-block;
	vertical-align: top;
	background: #fff;
	border: 1px solid #f2f2f2;
	border-radius: 4px;
	padding: 12px;
}

.page-links a,
.page-numbers {
	padding: 0 5px 0 5px;
}

.crumbs {
	color: #666;
}

.crumbs ul{
	margin-left: 0;
}

.crumbs li {
	list-style: none;
	display: inline;
}

/*--------------------------------------------------------------
5.1 Links
--------------------------------------------------------------*/
a {
	color: #666;
}

a:visited {
	color: #666;
}

a:hover,
a:focus,
a:active {
	color: #000;
}

/*--------------------------------------------------------------
5.2 Menus
--------------------------------------------------------------*/

/* =Header Menu
-------------------------------------------------------------- */
.main-navigation {
	background: #9cc9c7;
	padding: 0.5rem;
	font-size: 0.9rem;
	font-family: 'Montserrat', sans-serif;
	text-transform: uppercase;
	letter-spacing: 2px;
	width: 100%;
	height: auto;
}

.main-navigation ul {
	list-style: none;
	margin: auto;
	padding: 0;
	width: 100%;
}

.main-navigation li {
	display: inline-block;
	position: relative;
	margin: 0.5rem;
}

.main-navigation a {
	padding: 6px 8px 6px 8px;
	color: #000;
	text-decoration: none;
	border: 1px solid transparent;
	border-radius: 3px;
	display: inline-block;
	background: rgba(255, 255, 255, 0.3);
	text-align: left;
}

.main-navigation a:focus,
.main-navigation a:hover {
	color: #000;
	border: 1px solid #fafafa;
	border-radius: 3px;
	box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.07);
	transition: background-color 0.9s ease;
	background: #fff;
}

/* Top level hover state, preserve hover state when hovering dropdown  */
.main-navigation li > a:hover,
.main-navigation li > a:focus,
.main-navigation li:focus > a,
.main-navigation li:hover > a {
	text-decoration: underline;
}

.main-navigation ul ul {
	position: absolute;
	display: block;
	clear: both;
	min-width: 238px;
	width: auto;
	top: auto;
	padding-right: 1rem;
	padding-top: 0.5rem;
	clip: rect(1px, 1px, 1px, 1px);
	z-index: 999;
}

/* Make sure that the items are visible if they are overlapping. */
.main-navigation ul ul a {
	background: #fff;
}

.main-navigation ul ul ul {
	position: relative;
}

.main-navigation ul ul li {
	margin-left: 0;
	margin-bottom: 0;
}

.main-navigation li:hover ul,
.keyboard-dropdown {
	clip: auto !important;
}

.main-navigation ul li:hover > ul {
	display: block;
}

.sub-menu .menu-item-has-children > a:after {
	content: '';
}

.menu-item-has-children a {
	padding-right: 1.5rem;
}

.menu-item-has-children > a:after {
	content: "⌵";
	top: 4px;
	right: 8px;
	position: absolute;
}

.menu-item-has-children .sub-menu a {
	padding-right: 8px;
}

/* Small menu */
.menu-toggle {
	display: none;
}

@media screen and (max-width: 600px) {

	.menu-toggle,
	.main-navigation.toggled .nav-menu {
		display: block;
	}

	.main-navigation {
		position: relative !important;
	}

	.main-navigation a,
	.menu-item-has-children a,
	.menu-item-has-children .sub-menu a {
		padding: 12px 16px;
	}

	.main-navigation ul {
		display: none;
	}

	.menu-toggle {
		margin: 1rem;
	}

	.menu-toggle:before {
		content: "\f0c9";
		display: inline-block;
		font: normal normal normal 14px/1 FontAwesome;
		text-rendering: auto;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		vertical-align: top;
		font-size: 2em;
		line-height: 1;
		color: #000;
		text-decoration: none;
	}

	.main-navigation li {
		float: none;
		margin: 1.5rem auto 0 auto;
	}

	.main-navigation ul li {
		width: 100%;
		position: relative;
		text-align: center;
	}

	.main-navigation a {
		background: #fff;
	}
	
	.main-navigation ul ul {
		position: relative;
		clip: auto;
		padding: 0;
	}

	.menu-item-has-children > a:after {
		content: '';
	}

}

/*--------------
Social menu
---------------*/

@font-face {
	font-family: 'FontAwesome';
	src: url('fonts/fontawesome-webfont.eot?v=4.2.0');
	src: url('fonts/fontawesome-webfont.eot?#iefix&v=4.2.0') format('embedded-opentype'), url('fonts/fontawesome-webfont.woff?v=4.2.0') format('woff'), url('fonts/fontawesome-webfont.ttf?v=4.2.0') format('truetype'), url('fonts/fontawesome-webfont.svg?v=4.2.0#fontawesomeregular') format('svg');
	font-weight: normal;
	font-style: normal;
}

li a::before {
	display: inline-block;
	font: normal normal normal 14px/1 FontAwesome;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	line-height: 1;
	text-decoration: none;
	margin: 0 5px 0 5px;
	padding: 0;
}

.social-menu li a:before {
	display: inline-block;
	font: normal normal normal 34px/1 FontAwesome;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	line-height: 1;
	text-decoration: none;
	margin: 0 5px 0 5px;
	padding: 0;
}

.social-menu {
	width: 100%;
	margin: 1rem auto;
	text-align: center;
	padding: 0;
}

.social-menu ul {
	margin: 0;
}

.social-menu ul li {
	list-style-type: none;
	display: inline;
}

.social-menu li a,
.social-menu li a:hover {
	text-decoration: none;
	background: none;
}

.social-menu li a:hover:before {
	color: #333;
}

.social-menu li a[href*="dribbble.com"]::before { content: '\f17d'; }
.social-menu li a[href*="facebook.com"]::before { content: '\f09a'; }
.social-menu li a[href*="flickr.com"]::before { content: '\f16e'; }
.social-menu li a[href*="foursquare.com"]::before { content: '\f180'; }
.social-menu li a[href*="github.com"]::before { content: '\f09b'; }
.social-menu li a[href*="plus.google.com"]::before { content: '\f0d5'; }
.social-menu li a[href*="instagram.com"]::before { content: '\f16d'; }
.social-menu li a[href*="jsfiddle.com"]::before { content: '\f1cc'; }
.social-menu li a[href*="linkedin.com"]::before { content: '\f0e1'; }
.social-menu li a[href*="pinterest.com"]::before { content: '\f0d2'; }
.social-menu li a[href*="reddit.com"]::before { content: '\f1a1'; }
.social-menu li a[href*="soundcloud.com"]::before { content: '\f1be'; }
.social-menu li a[href*="stackoverflow.com"]::before { content: '\f16c'; }
.social-menu li a[href*="tumblr.com"]::before { content: '\f173'; }
.social-menu li a[href*="twitter.com"]::before { content: '\f099'; }
.social-menu li a[href*="vimeo.com"]::before { content: '\f194'; }
.social-menu li a[href*="vine.co"]::before { content: '\f1ca'; }
.social-menu li a[href*="yelp.com"]::before { content: '\f1e9'; }
.social-menu li a[href*="youtube.com"]::before { content: '\f167'; }
.social-menu li a[href*="wordpress.com"]::before { content: '\f19a'; }
.social-menu li a[href*="paypal.com"]::before { content: "\f1ed"; }
.social-menu li a[href*="lastfm.com"]::before { content: "\f202"; }
.social-menu li a[href*="behance.net"]::before { content: "\f1b4"; }
.social-menu li a[href*="deviantart.com"]::before { content: "\f1bd"; }
.social-menu li a[href*="spotify.com"]::before { content: "\f1bc"; }
.social-menu li a[href*="skype.com"]::before { content: "\f17e"; }
.social-menu li a[href*="slack.com"]::before { content: "\f198"; }

/*--------------------------------------------------------------
6.0 Accessibility
--------------------------------------------------------------*/

/* Text meant only for screen readers */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
}

.screen-reader-text:hover,
.screen-reader-text:active,
.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-weight: 700;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000; /* Above WP toolbar */
}

/*--------------------------------------------------------------
7.0 Alignments
--------------------------------------------------------------*/
.alignleft {
	display: inline;
	float: left;
	margin-right: 1.5rem;
}

.alignright {
	display: inline;
	float: right;
	margin-left: 1.5rem;
}

.aligncenter {
	clear: both;
	display: block;
	margin: 0 auto;
}

.wp-block-cover.alignright,
.wp-block-cover.alignleft {
	display: flex;
}

.wp-block-image .alignleft {
	margin: 0 2rem 2rem 0;
}

.wp-block-cover.alignleft {
	margin-right: 2rem;
}

.wp-block-image .alignright {
	margin: 0 0 2rem 2rem;
}

.wp-block-cover.alignright {
	margin-left: 2rem;
}

.wp-block-audio.aligncenter {
	margin: 0;
}

.wp-block-categories.aligncenter {
	padding-left: 2.5rem;
}



/*--------------------------------------------------------------
8.0 Clearings
--------------------------------------------------------------*/
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
	content: "";
	display: table;
}

.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
	clear: both;
}

.clearfix:before,
.clearfix:after {
	display: table;
	content: " ";
}

.clearfix:after {
	clear: both;
}

/*----------------------------
9.0 widgets
----------------------------*/
.widget-area {
	padding: 1.5rem;
}

.widget {
	font-size: 0.9rem;
	display: inline-block;
	vertical-align: top;
	list-style: none;
	position: relative;
	margin: 0 0.5rem 2rem 0.5rem;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
	text-transform: uppercase;
	text-align: left;
}

.widget-title,
.widgettitle {
	margin: 0;
	padding-bottom: 0.5rem;
	font-family: "Montserrat", sans-serif;
	text-transform: uppercase;
}

.widget ul {
	padding: 0;
	margin: 0;
	float: left;
	width: 100%;
}

.widget ul li {
	list-style: none;
	margin: 1rem;
	padding: 0 0 0.5rem 0.5rem;
	text-align: left;
	background: url("images/border.png") repeat-x bottom;
}

#calendar_wrap {
	padding-top: 5px;
}

.widget_calendar .widgettitle {
	display: none;
}

table#wp-calendar,
#wp-calendar {
	padding: 5px;
	margin-bottom: 2rem;
	border: none;
}

#wp-calendar th {
	padding: 5px;
	text-align: center;
}

#wp-calendar td {
	padding: 5px;
	border: 1px solid #e9e9e9;
	text-align: center;
}

#wp-calendar caption {
	margin-bottom: 0.5rem;
}

#wp-calendar td a:hover,
.widget ul li a,
.tagcloud a {
	text-decoration: none;
}

#wp-calendar a,
.widget ul li a:hover,
.tagcloud a:hover {
	text-decoration: underline;
}

#wp-calendar tfoot td,
#wp-calendar tfoot {
	border: none;
}

#wp-calendar td a {
	font-weight: 700;
}

.textwidget {
	padding: 10px;
	overflow: hidden;
}

.widget select,
.widget_search input[type='search'] {
	width: 95%;
	margin-bottom: 9px;
}

.search-post input {
	margin: 3px;
}

.widget_rss ul li {
	margin-bottom: 25px;
	width: 97%;
}

.rssSummary {
	width: 90%;
}

.rss-date {
	width: 90%;
	float: left;
	clear: both;
}

.site-footer .widget-area {
	text-align: center;
	background: url(images/border.png) repeat-x bottom;
	width: 100%;
	margin: 1rem auto;
	padding: 0 0 2rem 0;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	grid-gap: 1.5rem;
}

.site-footer .widget {
	display: inline-block;
	vertical-align: top;
	list-style: none;
	position: relative;
	padding: 0 18px 0 18px;
	margin: 0 0.5em  45px 0.5em;
	box-shadow: none;
	background: none;
	border: none;
}

/*--------------------------------------------------------------
10.0 Content
--------------------------------------------------------------*/
.site-header {
	text-align: center;
	background: #9cc9c7;
	min-height: 600px;
	clear: both;
}

.has-site-logo .site-header {
	min-height: 700px;
}

.site-branding {
	margin-top: 40px;
	margin-right: auto;
	margin-left: auto;
}

.site-description {
	font-size: 1.5rem;
	font-family: 'Montserrat', sans-serif;
	text-transform: uppercase;
}

.site-title {
	position: relative;
	margin: 0 auto 10px auto;
	font-size: 4rem;
	text-decoration: none;
	font-family: 'Montserrat', sans-serif;
	text-transform: uppercase;
	color: #000;
}

.site-content {
	width: 100%;
	margin: -90px 0 0 0;
	position: relative;
	padding: 1rem 1rem 2rem 1rem;
	z-index: 2;
	background: url(images/border.png) repeat-x bottom;
	display: inline-block;
	text-align: center;
}

.site-content:first-child {
	opacity: .99;
}

.site-footer {
	background: #fff;
	padding: 1rem 0;
}

.site-info {
	width: 90%;
	margin: 2rem auto 1rem auto;
	font-size: 0.7rem;
	text-align: center;
	font-family: 'Montserrat', sans-serif;
	text-transform: uppercase;
	letter-spacing: 2px;
}

.content-area {
	display: inline-block;
	width: 60%;
	margin: 0 auto;
	text-align: left;
}

.site-main {
	margin: 0 auto;
}

.site-content .widget-area {
	margin: 105px auto;
	width: 25%;
	padding: 45px 2% 0 4%;
	text-align: left;
	display: inline-block;
	vertical-align: top;
}

.site-footer {
	clear: both;
	width: 100%;
}

.single-jetpack-testimonial .content-area,
.page .content-area,
.single-jetpack-portfolio .content-area,
.no-sidebar .content-area {
	width: 80%;
	margin: 0 auto;
	float: none;
}

.page-template-staticpage-sidebar .content-area {
	width: 60%;
}

.site-branding form {
	width: 30%;
	border: 1px solid rgba(255, 255, 255, 0.3);
	padding: 1rem;
	margin: 0 auto 130px auto;
	border-radius: 4px;
}

/*--------------------------------------------------------------
10.1 Call to action
--------------------------------------------------------------*/

#action {
	width: 30%;
	margin: 60px auto 55px auto;
	padding: 1rem;
	font-size: 1.1rem;
	font-weight: 700;
	text-transform: uppercase;
	border: 1px solid transparent;
	border-radius: 4px;
	box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);
	background: rgba(255, 255, 255, 0.6);
}

#action:hover,
#action:focus {
	border: 1px solid #fafafa;
	box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
	transition: background-color 1.4s ease;
	background: #fff;
}

#action a {
	text-decoration: none;
	color: #000;
	padding-bottom: 4px;
}

#action a:focus,
#action:hover a {
	background: url(images/border.png) repeat-x bottom;
}

/*--------------------------------------------------------------
10.2 Posts and pages
--------------------------------------------------------------*/

.billie-border {
	background: url(images/border.png) repeat-x bottom;
	border: 4px solid #fff;
	border-radius: 4px;
	box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);
}

.sticky{}

.type-topic,
.type-forum,
.type-jetpack-testimonial,
.page-header,
.type-page,
.type-jetpack-portfolio,
.search-results .type-page,
.type-attachment,
.post {
	border-radius: 4px;
	padding: 45px 65px;
	display: block;
	position: relative;
	overflow: auto;
	box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);
	margin: 0 0 65px 0;
	background: #fcfcfc;
	line-height: 2;
}

.updated:not(.published) {
	display: none;
}

.byline,
.cat-links {
	margin-right: 0.5rem;
}

.single .byline,
.group-blog .byline {
	display: inline;
}

.page-content,
.entry-content,
.entry-summary {
	margin: 1.5rem 0 0;
	font-size: 1.1875rem;
}

.page-content > *,
.entry-content > *,
.entry-summary > *,
.entry-header,
.entry-footer,
.page-links,
.comments-area {
	margin-right: auto;
	margin-left: auto;
	padding-right: 1.5rem;
	padding-left: 1.5rem;
	max-width: 45rem;
}

.entry-content > :not(.container):not(.alignfull):not(.alignwide):not(.alignleft):not(.alignright) {
	margin-left: auto;
	margin-right: auto;
}

.wp-block-group > .wp-block-group__inner-container > * {
	max-width: 45rem;
	margin-left: auto;
	margin-right: auto;
}

.wp-block-group > .wp-block-group__inner-container > .alignwide {
	max-width: calc(50% + 45rem / 2);
}

.wp-block-group > .wp-block-group__inner-container > .alignfull {
	max-width: 100%;
}

@media screen and (min-width: 48em) {

	.entry-content > *.alignright,
	.entry-summary > *.alignright {
		margin-right: calc((100% - 45rem) / 2);
	}

	.entry-content > *.alignleft,
	.entry-summary > *.alignleft {
		margin-left: calc((100% - 45rem) / 2);
	}

}

.alignwide,
.entry-content .alignwide {
	max-width: calc(50% + 45rem / 2);
	margin-left: auto;
	margin-right: auto;
}

.alignfull {
	max-width: 100%;
	padding: 0;
	margin-right: auto;
	margin-left: auto;
	position: relative;
	width: 100%;
}

.page-links {
	display: block;
	clear: both;
	margin-top: 1em;
	padding: 12px 27px;
	background: #fff;
	border: 1px solid #f2f2f2;
	border-radius: 4px;
}

.entry-title,
.entry-title a {
	font-size: 1.8rem;
	text-decoration: none;
	margin: 0.5rem 0 1rem 0;
	padding-bottom: 4px;
	font-family: 'Montserrat', sans-serif;
	text-transform: uppercase;
	letter-spacing: 2px;
	color: #000;
}

.entry-title,
.single .entry-title {
	background: url(images/border.png) repeat-x bottom;
}

.entry-content a,
.entry-title a:hover {
	text-decoration: underline;
}

.page-title {
	font-family: 'Montserrat', sans-serif;
	text-transform: uppercase;
	letter-spacing: 2px;
}

.taxonomy-description {
	margin-bottom: 45px;
}

.entry-content {
	width: 100%;
	display: block;
}

.entry-content a:hover {
	text-decoration: none;
}

.entry-footer,
.entry-meta {
	text-transform: uppercase;
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 2px;
	display: block;
	margin-top: 1.5rem;
	margin-bottom: 1.5rem;
}

.entry-footer {
	margin-top: 2rem;
}

.type-page .entry-footer {
	display: none;
}

.entry-meta a ,
.entry-footer a,
.site-footer a,
.page-links a {
	text-decoration: none;
}

.entry-meta a:focus,
.entry-footer a:focus,
.page-links a:focus,
.site-footer a:focus,
.entry-meta a:hover,
.entry-footer a:hover,
.page-links a:hover,
.site-footer a:hover {
	text-decoration: underline;
	background: url(images/border.png) repeat-x bottom;
}

.edit-link,
.posted-on,
.tags-links,
.comments-link {
	clear: both;
	width: 100%;
	margin-bottom: 0.5rem;
	margin-left: 0.5rem;
	margin-right: 0.5rem;
	padding-left: 1rem;
	border-left: #d5dbde 1px solid;
}

.not-found .page-title:before {
	content: "\f05a";
	display: inline-block;
	font: normal normal normal 40px/1 FontAwesome;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	line-height: 1;
	text-decoration: none;
	margin: 0 10px 0 5px;
	padding: 0;
	color: #666;
}

/*--------------------------------------------------------------
10.3 Comments
--------------------------------------------------------------*/

.comments-area {
	margin-top: 3rem;
	margin-bottom: 3rem;
	clear: both;
	position: relative;
}

.comments-title,
.comment-reply-title {
	font-size: 2rem;
	font-family: 'Montserrat', sans-serif;
	text-transform: uppercase;
	letter-spacing: 2px;
	padding: 0.5rem 0 0.5rem 0;
}

.comment-list {
	margin: 0 0 1.5rem 0;
}

.comment-list,
.children {
	list-style: none;
}

.comment-body {
	margin-bottom: 2rem;
	background: url(images/border.png) repeat-x bottom;
}

.comment-navigation {
	padding-bottom: 0.5rem;
}

.comment-content {
	margin-top: 1rem;
	font-size: 1.1875rem;
}

.comment-content a {
	word-wrap: break-word;
}

.comment-metadata {
	margin: 0 1rem;
	display: inline-block;
}

.comment-metadata .edit-link {
	margin-left: 0.5rem;
}

.comment-metadata a {
	text-decoration: none;
}

.comment-metadata a:hover {
	text-decoration: underline;
}

.reply {
	margin: 1rem;
	padding-bottom: 1rem;
}

.says {
	display: none;
}

.bypostauthor {
	display: block;
}

.comment-author .avatar {
	border: 4px solid #fff;
	border-radius: 4px;
	box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);
}

.comment-meta .fn {
	vertical-align: top;
	margin-left: 1rem;
	font-size: 1.5rem;
}

.comment-meta .fn .url {
	vertical-align: top;
	font-size: 1.5rem;
}

.logged-in-as a:hover,
.reply .comment-reply-link:hover,
.comment-meta .fn .url:hover {
	text-decoration: none;
}

.comment-form p {
	margin-bottom: 1rem;
}

/*labels:*/
.comment-form-url label,
.comment-form-email label,
.comment-form-author label,
.comment-form-comment label {
	font-weight: 700;
	display: block;
	margin-bottom: 0.5rem;
}

.required {
	margin-left: 3px;
}

.comment-form input[type='text'],
.comment-form input[type='email'] {
	width: 300px;
	max-width: 98%;
	margin-bottom: 3px;
}

.form-allowed-tags {
	background: #fff;
	border: 1px solid #f2f2f2;
	border-radius: 4px;
	padding: 1rem;
}


/*--------------------------------------------------------------
11.0 Jetpack
--------------------------------------------------------------*/
/*Infinite scroll*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .posts-navigation, /* Older / Newer Posts Navigation (always hidden) */
.infinite-scroll.neverending .site-footer { /* Theme Footer (when set to scrolling) */
	display: none;
}

/* When Infinite Scroll has reached its end we need to re-display
elements that were hidden (via .neverending) before */
.infinity-end.neverending .site-footer {
	display: block;
}

/* ==========================================================================
	Featured posts
========================================================================== */
.featured-post {
	position: relative;
	border: 1px solid #eeefef;
	border-radius: 4px;
	padding: 0.5rem;
	margin: 2rem 2rem 3rem 2rem;
	box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.04);
	display: inline-block;
	vertical-align: top;
	background: #fff;
	width: 400px;
	height: 267px;
}

.featured-inner {
	height: 100%;
	border-radius: 3px;
	padding: 0;
	background: #9cc9c7;
}

.post-header {
	padding-top: 1rem;
	text-align: center;
	position: relative;
	z-index: 9999;
}

.featured-post h2 a {
	text-transform: uppercase;
	font-size: 1.8rem;
	text-decoration: none;
	font-family: 'Montserrat', sans-serif;
	text-transform: uppercase;
	color: #000;
}

.featured-post h2 a:hover,
.featured-post h2 a:focus {
	text-decoration: underline;
}

.tag-list {
	padding: 0;
	margin: 0;
	color: #666;
	display: inline-block;
	margin-left: 0.5rem;
	padding-left: 1rem;
	border-left: #d5dbde 1px solid;
}

.featured-text {
	display: block;
	width: 100%;
	margin: 25% 0 0 0;
	padding: 0;
	background: #fff;
	border: none;
	border: 1px solid #fafafa;
	color: #666;
	text-transform: uppercase;
	font-size: 0.9rem;
	font-family: "Montserrat", sans-serif;
	opacity: 0.86;
}

/* Jetpack Sharing */
.featured-post .sharedaddy,
.featured-post .sharedaddy .sd-like,
.featured-post .sharedaddy h3.sd-title,
.featured-post .sharedaddy .likes-widget-placeholder {
	display: none;
}

.sharedaddy {
	margin-top: 1rem;
}

.entry-footer .sharedaddy h3.sd-title {
	font-weight: normal;
	font-size: 1.2rem;
}

article #sharing_email .sharing_send,
article .sd-content ul li .option a.share-ustom,
article .sd-content ul li a.sd-button,
article .sd-content ul li.advanced a.share-more,
article .sd-content ul li.preview-item div.option.option-smart-off a,
article .sd-social-icon .sd-content ul li a.sd-button,
article .sd-social-icon-text .sd-content ul li a.sd-button,
article .sd-social-official .sd-content>ul>li .digg_button>a,
article .sd-social-official .sd-content>ul>li>a.sd-button,
article .sd-social-text .sd-content ul li a.sd-button {
	color: #000 !important;
}

/*Jetpack site logo*/
.site-logo {
	clear: both;
	position: relative;
	margin-bottom: 2rem;
}

/*Jetpack portfolio and testimonials*/
.post-type-archive-jetpack-portfolio .content-area,
.post-type-archive-jetpack-testimonial .content-area {
	margin: 0 auto;
	width: 100%;
	text-align: center;
}

.post-type-archive-jetpack-portfolio .page-header,
.post-type-archive-jetpack-testimonial .page-header {
	margin: 0 auto 2em auto;
	width: 80%
}

.post-type-archive-jetpack-portfolio .page-title,
.post-type-archive-jetpack-testimonial .page-title {
	margin: 0;
}

.tax-jetpack-portfolio-type .page-title {
	text-align: center;
	margin: 0;
}

.tax-jetpack-portfolio-tag .featured-text,
.tax-jetpack-portfolio-type .featured-text,
.post-type-archive-jetpack-portfolio .featured-text {
	text-align: center;
}

.jetpack-portfolio-type {
	display: inline-block;
	margin-bottom: 0.5rem;
}

.jetpack-testimonial .entry-title {
	background: none;
	text-align: center;
	margin-top: 1rem;
	text-decoration: none;
	padding-bottom: 4px;
	font-family: 'Montserrat', sans-serif;
	text-transform: uppercase;
	letter-spacing: 2px;
	display: block;
}

.jetpack-testimonial .entry-content {
	width: 100%;
	text-align: center;
	font-style: italic;
}

.post-type-archive-jetpack-testimonial .type-jetpack-testimonial {
	display: inline-block;
	margin: 0 2rem 1rem 2rem;
	padding: 1rem;
	width: 26%;
	vertical-align: top;
}

.post-type-archive-jetpack-testimonial .attachment-billie-jetpack-logo {
	clear: both;
	margin: 0 auto;
	display: block;
}

.attachment-billie-jetpack-testimonial {
	width: 100px;
	height: 100px;
	border-radius: 50px;
	background: url(images/border.png) repeat-x bottom;
	border: 4px solid #fff !important; /*We need to overwrite Jetpacks styling here...*/
	box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);
	margin: 0 auto;
	display: block;
}

/*--------------------------------------------------------------
12.0 Media
--------------------------------------------------------------*/
.page-content img.wp-smiley,
.entry-content img.wp-smiley,
.comment-content img.wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure embeds and iframes fit their containers */
embed,
iframe,
object {
	max-width: 100%;
}

a img {
	border: 1px solid transparent;
	padding: 4px;
}

.attachment-post-thumbnail {
	display: block;
	margin: 0 auto 1.5rem auto;
}

a img:hover,
a img:focus {
	border: 1px solid #999;
	box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);
}

/*--------------------------------------------------------------
12.1 Captions
--------------------------------------------------------------*/
.wp-caption {
	margin-bottom: 1.5rem;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin: 0 auto;
}

.wp-caption-text {
	text-align: center;
}

.wp-caption .wp-caption-text {
	margin: 0.8075rem 0;
}

/*--------------------------------------------------------------
12.2 Galleries
--------------------------------------------------------------*/
.gallery {
	margin-bottom: 1.5rem;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	vertical-align: top;
	width: 100%;
	margin: 0.4%;
}

.gallery-columns-2 .gallery-item {
	max-width: 48%;
}

.gallery-columns-3 .gallery-item {
	max-width: 31.33%;
}

.gallery-columns-4 .gallery-item {
	max-width: 23%;
}

.gallery-columns-5 .gallery-item {
	max-width: 17%;
}

.gallery-columns-6 .gallery-item {
	max-width: 14.66%;
}

.gallery-columns-7 .gallery-item {
	max-width: 12.28%;
}

.gallery-columns-8 .gallery-item {
	max-width: 10.5%;
}

.gallery-columns-9 .gallery-item {
	max-width: 9.11%;
}

.gallery-caption {
	display: block;
}

.single-attachment .crumbs,
.single-attachment .post-navigation {
	display: none;
}

.gallery-icon a img {
	padding: 4px;
}

/*--------------------------------------------------------------
13.0 BBpress
--------------------------------------------------------------*/

#bbpress-forums,
#bbpress-forums .bbp-breadcrumb,
#bbpress-forums .bbp-body {
	font-size: 1.2rem;
}

#bbpress-forums .bbp-forum-info .bbp-forum-content,
#bbpress-forums p.bbp-topic-meta,
div.bbp-template-notice p {
	font-size: 1rem;
}

.bbp-search-form,
.bbp-breadcrumb {
	margin-bottom: 2rem;
}

.subscription-toggle {
	float: right;
	margin-bottom: 2rem;
}

.bbpress .entry-content {
	width: 90%;
}

.bbpress .forum .entry-title {
	background: url(images/border.png) repeat-x bottom;
}

/*Hide avatar clutter...*/
.bbp-topic-started-by .bbp-author-avatar,
.bbp-forum-description .bbp-author-avatar,
.bbp-topic-freshness-author .bbp-author-avatar,
.bbp-topic-description .bbp-author-avatar {
	display: none;
}

.bbp-user-section {
	margin-top: 1rem;
}

#bbpress-forums #bbp-single-user-details #bbp-user-navigation li.current a,
span.bbp-admin-links a,
.bbp-forum-header a.bbp-forum-permalink,
.bbp-topic-header a.bbp-topic-permalink,
.bbp-reply-header a.bbp-reply-permalink {
	color: #333;
}

#bbpress-forums #bbp-your-profile fieldset input,
#bbpress-forums #bbp-your-profile fieldset textarea {
	background: #fff;
}

#bbpress-forums textarea {
	color: #666;
	border: 1px solid #ccc;
	border-radius: 3px;
}

#bbpress-forums textarea:focus {
	color: #111;
	box-shadow: 0 0 5px rgba(162, 196, 251, 1);
	border: 1px solid rgba(162, 196, 251, 1);
}

/*--------------------------------------------------------------
14.0 WooCommerce
--------------------------------------------------------------*/
/*This needs to correspond with .content-area to play well with sidebars.*/
.woocommerce-page .content-area,
.woocommerce #container {
	display: inline-block;
	width: 60%;
	text-align: left;
	padding: 45px 65px;
	margin: 0 0 65px 0;
	background: #fcfcfc url(images/border.png) repeat-x bottom;
	border: 4px solid #fff;
	border-radius: 4px;
	box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);
}

.woocommerce .woocommerce-error::before,
.woocommerce .woocommerce-info::before,
.woocommerce .woocommerce-message::before,
.woocommerce-page .woocommerce-error::before,
.woocommerce-page .woocommerce-info::before,
.woocommerce-page .woocommerce-message::before {
	padding: 0; /*make sure the icon is placed correctly*/
}

.woocommerce .page-title,
.woocommerce-cart .entry-title {
	background: url(images/border.png) repeat-x bottom;
}

.product .attachment-shop_catalog {
	border: 3px solid #fff;
}

.product a:focus .attachment-shop_catalog {
	border: 3px solid #333;
}

.woocommerce #content nav.woocommerce-pagination ul,
.woocommerce nav.woocommerce-pagination ul,
.woocommerce-page #content nav.woocommerce-pagination ul,
.woocommerce-page nav.woocommerce-pagination ul {
	border: 4px solid #fff;
	border-radius: 4px;
	box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);
}

.woocommerce #content nav.woocommerce-pagination ul li,
.woocommerce nav.woocommerce-pagination ul li,
.woocommerce-page #content nav.woocommerce-pagination ul li,
.woocommerce-page nav.woocommerce-pagination ul li {
	border: 1px solid #e7e7e7;
}

.woocommerce #content nav.woocommerce-pagination ul li a,
.woocommerce #content nav.woocommerce-pagination ul li span,
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span,
.woocommerce-page #content nav.woocommerce-pagination ul li a,
.woocommerce-page #content nav.woocommerce-pagination ul li span,
.woocommerce-page nav.woocommerce-pagination ul li a,
.woocommerce-page nav.woocommerce-pagination ul li span {
	padding: 0.5rem 0.7rem;
}

.woocommerce #content nav.woocommerce-pagination ul li a:focus,
.woocommerce #content nav.woocommerce-pagination ul li a:hover,
.woocommerce #content nav.woocommerce-pagination ul li span.current,
.woocommerce nav.woocommerce-pagination ul li a:focus,
.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li span.current,
.woocommerce-page #content nav.woocommerce-pagination ul li a:focus,
.woocommerce-page #content nav.woocommerce-pagination ul li a:hover,
.woocommerce-page #content nav.woocommerce-pagination ul li span.current,
.woocommerce-page nav.woocommerce-pagination ul li a:focus,
.woocommerce-page nav.woocommerce-pagination ul li a:hover,
.woocommerce-page nav.woocommerce-pagination ul li span.current {
	color: #000;
	text-decoration: underline;
}

.woocommerce .cart-collaterals .cart_totals,
.woocommerce-page .cart-collaterals .cart_totals {
	width: 60%;
}

.woocommerce .cart-collaterals .cart_totals table th,
.woocommerce-page .cart-collaterals .cart_totals table th,
.woocommerce .cart-collaterals .cart_totals table td,
.woocommerce-page .cart-collaterals .cart_totals table td {
	padding: 0.5rem;
}

/*--------------------------------------------------------------
15.0 Blocks
--------------------------------------------------------------*/

.wp-block-search,
.wp-block-categories-dropdown,
.wp-block-image,
.wp-block-button {
	margin-bottom: 1.5rem;
}

.wp-block-button__link {
	text-decoration: underline;
}

.wp-block-button__link:hover,
.wp-block-button__link:focus {
	text-decoration: none;
}

.wp-block-column {
	padding: 0.5rem;
}

.wp-block-media-text .wp-block-media-text__content {
	padding: 8%;
}

.wp-block-embed.alignwide.is-type-video iframe {
	width: 100%;
}

.alignfull.wp-block-embed.is-type-video {
	width: 100%;
}

.wp-block-video {
	margin-left: 0;
	margin-right: 0;
}

.wp-block-video video {
	max-width: 100%;
}

/* Increase text color contrast */
.wp-block-latest-comments__comment-date {
	color: #333;
}

.wp-block-video figcaption,
.wp-block-embed figcaption,
.wp-block-audio figcaption {
	margin-bottom: 1.5rem;
	color: #333;
}

.blocks-gallery-caption {
	margin: 0.5em auto 1.5em auto;
	text-align: center;
}

.wp-block-quote cite {
	display: block;
	color: #333;
}

blockquote.wp-block-quote.is-style-large p {
	font-size: 1.5rem;
	line-height: 1.6;
 }

blockquote.wp-block-quote.is-style-large cite {
	text-align: left;
}

.wp-block-quote.is-large,
.wp-block-quote.is-style-large {
	margin: 1.5rem auto;
	padding: 0 1rem;
}

.wp-block-pullquote blockquote {
	border-left: none;
}

.wp-block-pullquote
.wp-block-pullquote {
	margin: 1.5rem 2rem;
}

p.has-drop-cap::first-letter {
	margin: 0.07rem 0.13rem 0 0;
}

.has-billie-blue-color {
	color: #9cc9c7;
}

.has-billie-blue-background-color {
	background-color: #9cc9c7;
}

.wp-block-code {
	font-family: Menlo, Consolas, monaco, monospace;
	color: currentColor;
	padding: 0.8em 1em;
	border: 1px solid #ccc;
	border-radius: 4px;
	background: transparent;
}


/*--------------------------------------------------------------
16.0 Responsive widths
--------------------------------------------------------------*/

@media screen and (max-width: 1100px) {

	.woocommerce-page .content-area,
	.woocommerce #container {
		width: auto;
	}

	.content-area {
		width: 100%;
		margin: 0 auto;
	}

	.site-content .widget-area {
		width: 100%;
		margin: 1rem auto;
		padding: 0;
		display: grid;
		grid-template-columns: 1fr 1fr 1fr;
		grid-gap: 1.5rem;
	}

	.site-footer .widget,
	.widget {
		margin: 0;
	}

	.type-jetpack-testimonial,
	.page-header,
	.type-page,
	.type-jetpack-portfolio,
	.search-results .type-page,
	.type-attachment,
	.post {
		padding: 2rem;
	}

}

@media screen and (max-width: 800px) {

	.site-content {
		padding: 1rem 0 2rem 0;
	}

	.entry-title,
	.entry-title a {
		font-size: 1.8rem;
	}

	.comment-navigation .nav-next,
	.posts-navigation .nav-next,
	.post-navigation .nav-next,
	.comment-navigation .nav-previous,
	.posts-navigation .nav-previous,
	.post-navigation .nav-previous {
		width: 100%;
		margin: 0 0 0.5rem 0;
	}

	#action {
		width: 80%;
		margin: 0 auto 3rem auto;
	}

	.site-branding form {
		width: 80%;
	}

	.site-main {
		width: 100%;
		padding: 0;
	}

	.type-topic,
	.type-forum {
		padding: 1rem;
	}

	.post,
	.post-type-archive-jetpack-testimonial .type-jetpack-testimonial {
		width: 100%;
		margin: 1rem 0 3rem 0;
	}

	.type-post,
	.jetpack-testimonial,
	.jetpack-testimonial .entry-content,
	.content-area,
	.single-jetpack-portfolio .content-area,
	.no-sidebar .content-area,
	.search-results .content-area,
	.search-results .site-content .widget-area,
	.archive .content-area,
	.archive .site-content .widget-area,
	.error404 .content-area,
	.error404 .site-content .widget-area,
	.entry-footer,
	.entry-content {
		width: 100%;
		padding: 0.5rem;
	}

	.page-content > *,
	.entry-content > *, 
	.entry-summary > *,
	.entry-header, 
	.entry-footer,
	.page-links,
	.comments-area {
		padding-right: 0.5rem;
		padding-left: 0.5rem;
	}

	.entry-content ul:not(.container):not(.alignfull):not(.alignwide):not(.alignleft):not(.alignright),
	.entry-content ol:not(.container):not(.alignfull):not(.alignwide):not(.alignleft):not(.alignright) {
		margin-left: 1.5rem;
	}

	.page-title {
		text-align: center;
	}

	.site-footer .widget-area,
	.site-content .widget-area {
		width: 100%;
		margin: 0 auto;
		padding: 0;
		display: block;
	}

	.site-content .widget-area {
		padding: 0.5rem 1rem;
	}

	.site-footer .widget,
	.widget {
		width: 100%;
		margin: 1.5rem 0;
	}

}

@media screen and (max-width: 600px) {

	.featured-wrap {
		text-align: center;
	}

	.site-title {
		font-size: 4rem;
	}

	.site-description {
		width: 90%;
		margin: 0 auto;
	}

	.comment-form,
	.page-header,
	.type-page,
	.comments-area {
		width: 100%;
		margin: 3rem 0;
	}

	.featured-post {
		width: 95%;
		margin: 0 auto 2rem auto;
		float: none;
	}

	.post-type-archive-jetpack-portfolio .page-header,
	.post-type-archive-jetpack-testimonial .page-header {
		width: 100%;
	}

}