/*
Theme Name: Masonry Brick
Theme URI: https://napitwptech.com/themes/masonry-brick/
Author: Bishal Napit
Author URI: https://napitwptech.com/themes/
Description: Masonry Brick, as its name suggest is a WordPress theme based on the masonry layout which is suitable to display your contents in beautiful way. Some of the features of this theme are as it supports WordPress default custom header and custom background, which can be kept as requirement. Also, this theme features custom social menu and also you have the ability to choose the layout option for each of the different pages/posts individually. This theme also supports all 10 post formats so that you can show the contents uniquely according to the post formats used in your site. You can see the demo of this theme through this link: https://demo.napitwptech.com/masonry-brick/ and get free theme support from this link: https://support.napitwptech.com/forums/forum/masonry-brick/.
Version: 1.0.8
Tested up to: 5.8
Requires PHP: 5.6
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Text Domain: masonry-brick
Tags: one-column, two-columns, right-sidebar, left-sidebar, grid-layout, custom-header, flexible-header, custom-background, custom-menu, custom-colors, sticky-post, featured-images, post-formats, footer-widgets, blog, e-commerce, threaded-comments, translation-ready, theme-options

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Masonry Brick is based on Underscores http://underscores.me/, (C) 2012-2015 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
*/

/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/
html {
	font-family: sans-serif;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust:     100%;
}

body {
	margin: 0;
}

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

audio,
canvas,
progress,
video {
	display: inline-block;
	vertical-align: baseline;
}

audio:not([controls]) {
	display: none;
	height: 0;
}

[hidden],
template {
	display: none;
}

a {
	background-color: transparent;
}

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

abbr[title] {
	border-bottom: 1px dotted;
}

b,
strong {
	font-weight: bold;
}

dfn {
	font-style: italic;
}

h1 {
	font-size: 2em;
	margin: 0.67em 0;
}

mark {
	background: #ff0;
	color: #000;
}

small {
	font-size: 80%;
}

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

sup {
	top: -0.5em;
}

sub {
	bottom: -0.25em;
}

img {
	border: 0;
}

svg:not(:root) {
	overflow: hidden;
}

figure {
	margin: 1em 40px;
}

hr {
	box-sizing: content-box;
	height: 0;
}

pre {
	overflow: auto;
}

code,
kbd,
pre,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

button,
input,
optgroup,
select,
textarea {
	color: inherit;
	font: inherit;
	margin: 0;
}

button {
	overflow: visible;
}

button,
select {
	text-transform: none;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
	-webkit-appearance: button;
	cursor: pointer;
}

button[disabled],
html input[disabled] {
	cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

input {
	line-height: normal;
}

input[type="checkbox"],
input[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

input[type="search"] {
	-webkit-appearance: textfield;
	box-sizing: content-box;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

fieldset {
	border: 1px solid #c0c0c0;
	margin: 0 2px;
	padding: 0.35em 0.625em 0.75em;
}

legend {
	border: 0;
	padding: 0;
}

textarea {
	overflow: auto;
}

optgroup {
	font-weight: bold;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

td,
th {
	padding: 0;
}

/*--------------------------------------------------------------
# Global Layout
--------------------------------------------------------------*/
#page {
	max-width: 1200px;
	margin: 0 auto;
}

.wide #page {
	max-width: 100%;
	margin: 0 auto;
}

.inner-wrap {
	max-width: 1160px;
	margin: 0 auto;
}

.boxed #page {
	max-width: 1200px;
	margin: 2% auto;
}

.avatar {
	border-radius: 50%;
}

figure {
	margin: 0;
}

@media screen and (max-width: 1200px) {
	.inner-wrap {
		width: 96%;
	}

	.boxed #page {
		max-width: 96%;
	}
}

/*--------------------------------------------------------------
# Layout settings
--------------------------------------------------------------*/
.not-found.sidebar-404 {
	display: none;
}

#content {
	padding: 60px 0;
}

#primary {
	width: 62%;
	float: left;
}

#secondary {
	width: 36%;
	float: right;
}

#primary.main-contents {
	width: 100%;
	float: none;
}

.left-sidebar #primary {
	float: right;
}

.left-sidebar #secondary {
	float: left;
}

.no-sidebar-full-width #primary {
	float: none;
	width: 100%;
}

.no-sidebar-content-centered #primary {
	float: none;
	margin: 0 auto;
}

.masonry-content {
	float: left;
	width: 30%;
	background-color: #fff;
}

.page .type-page {
	background-color: #fff;
}

.single .masonry-content {
	width: 100%;
}

.single .hentry, .page .hentry {
	margin: 0 0 40px;
}

.post-wrapper, .type-page {
	padding: 20px;
}

.search .type-page {
	padding: 0;
}

.error404 #primary {
	width: 100%;
}

.error-404 {
	background-color: #fff;
	padding: 20px;
}

@media screen and (max-width: 768px) {
	#primary, #secondary {
		width: 100%;
		float: none;
	}

	.masonry-content {
		width: 46.75%;
	}
}

@media screen and (max-width: 480px) {
	.masonry-content {
		width: 100%;
	}
}

/*--------------------------------------------------------------
# Social menu settings
--------------------------------------------------------------*/
#menu-social li a:before {
	display: inline-block;
	padding: 0 10px;
	font-family: "fontawesome";
	vertical-align: middle;
	content: "\f005";
	color: #4169E1;
	font-size: 16px;
}

#menu-social li {
	display: inline-block;
	list-style: none;
}

ul#menu-social {
	padding-left: 0;
	text-align: right;
	margin: 0;
}

#menu-social li a[href*="facebook.com"]:before {
	content: '\f09a';
	color: #3b5998;
}

#menu-social li a[href*="twitter.com"]:before {
	content: '\f099';
	color: #00aced;
}

#menu-social li a[href*="plus.google.com"]:before {
	content: '\f0d5';
	color: #dd4b39;
}

#menu-social li a[href*="youtube.com"]:before {
	content: '\f167';
	color: #bb0000;
}

#menu-social li a[href*="pinterest.com"]:before {
	content: '\f0d2';
	color: #cb2027;
}

#menu-social li a[href*="instagram.com"]:before {
	content: '\f16d';
	color: #517fa4;
}

#menu-social li a[href*="vimeo.com"]:before {
	content: '\f194';
	color: #44bbff;
}

#menu-social li a[href*="skype.com"]:before {
	content: '\f17e';
	color: #009cef;
}

#menu-social li a[href*="linkedin.com"]:before {
	content: '\f0e1';
	color: #007bb6;
}

#menu-social li a[href*="github.com"]:before {
	content: '\f09b';
	color: #4183c4;
}

#menu-social li a[href*="flickr.com"]:before {
	content: '\f16e';
	color: #0062dd;
}

#menu-social li a[href*="dribbble.com"]:before {
	content: '\f17d';
	color: #e24d87;
}

#menu-social li a[href*="stumbleupon.com"]:before {
	content: '\f1a4';
	color: #ec4823;
}

#menu-social li a[href*="tumblr.com"]:before {
	content: '\f173';
	color: #45546b;
}

#menu-social li a[href*="wordpress.com"]:before,
#menu-social li a[href*="wordpress.org"]:before {
	content: '\f19a';
	color: #21759b;
}

#menu-social li a[href*="codepen.io"]:before {
	content: '\f1cb';
	color: #cccccc;
}

#menu-social li a[href*="digg.com"]:before {
	content: '\f1a6';
	color: #14589e;
}

#menu-social li a[href*="reddit.com"]:before {
	content: '\f1a1';
	color: #ff4500;
}

#menu-social li a[href*="xing.com"]:before {
	content: '\f168';
	color: #026466;
}

#menu-social li a[href*="vk.com"]:before {
	content: '\f189';
	color: #45668e;
}

#menu-social li a[href*="weibo.com"]:before {
	content: '\f18a';
	color: #e6162d;
}

#menu-social li a[href*="leanpub.com"]:before {
	content: '\f212';
	color: #000000;
}

#menu-social li a[href*="renren.com"]:before {
	content: '\f18b';
	color: #237bc2;
}

#menu-social li a[href$="/feed/"]:before,
#menu-social li a[href*="rss.com"]:before,
#menu-social li a[href*="feedburner.com"]:before{
	content: '\f09e';
	color: #f26522;
}

#menu-social li a[href*="soundcloud.com"]:before {
	content: '\f1be';
	color: #ff3a00;
}

#menu-social li a[href*="vine.co"]:before {
	content: '\f1ca';
	color: #00bf8f;
}

#menu-social li a[href*="delicious.com"]:before {
	content: '\f1a5';
	color: #2a96ff;
}

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
.masonry-brick-header-image img {
	display: block;
	margin: 0 auto;
}

.site-branding {
	padding: 115px 0;
	background-color: #4169E1;
	text-align: center;
}

.site-title-box {
	width: 820px;
	max-width: 75%;
	margin: 0 auto;
	padding: 20px;
	background: rgba(65,105,225,0.7);
	border: 1px solid #fff;
}

.header-background-image {
	background: no-repeat center;
	background-size: cover!important;
	-moz-background-size: cover!important;
	-webkit-background-size: cover!important;
}

.site-title a, .site-description {
	color: #fff;
}

.site-title, .site-description {
	font-family: Lobster, cursive;
	text-align: center;
}

.site-title {
	margin: 22px 0;
	font-weight: bold;
}

.site-title a {
	font-size: 36px;
	text-decoration: none;
}

.site-title a:hover {
	color: #fff;
}

.site-description {
	font-size: 18px;
}

.header-top-bar {
	background-color: #fff;
	padding: 15px 0;
	border-bottom: 1px solid #fff;
}

.small-info-text {
	float: left;
	width: 69%;
	color: #222;
	font-size: 16px;
}

.social-menu {
	float: right;
	width: 29%;
}

.search-form-top {
	background-color: #222;
	display: none;
	padding: 20px;
	text-align: center;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
}

.search-form-top .search-field {
	width: 800px;
	max-width: 75%;
	padding: 10px;
}

@media screen and (max-width: 768px) {
	.site-title a, .site-title {
		font-size: 30px;
	}

	.site-description {
		font-size: 14px;
	}

	.small-info-text, .social-menu {
		float: none;
		width: 100%;
		padding: 10px 0;
	}

	.social-menu {
		border-top: 1px solid #4169E1;
	}

	ul#menu-social {
		text-align: left;
	}

	.header-top-bar {
		padding: 15px 0;
	}

	.site-title-box {
		padding: 5px;
	}

	.search-form-top .search-field {
		padding: 5px;
	}

	.site-branding {
		padding: 80px 0;
	}
}

@media screen and (max-width: 480px) {
	.site-title a {
		font-size: 22px;
	}

	.site-description {
		font-size: 12px;
	}

	ul#menu-social, .small-info-text {
		text-align: center;
	}

	.site-branding {
		padding: 50px 0;
	}
}

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
body,
button,
input,
select,
textarea {
	color: #222;
	font-family: Roboto, sans-serif;
	font-size: 16px;
	line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
	font-family: Roboto, sans-serif;
	font-weight: bold;
}

h1 {
	font-size: 36px;
}

h2 {
	font-size: 32px;
}

h3 {
	font-size: 28px;
}

h4 {
	font-size: 24px;
}

h5 {
	font-size: 20px;
}

h6 {
	font-size: 16px;
}

p {
	margin-bottom: 24px;
	font-size: 16px;
	font-family: Roboto, sans-serif;
}

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

blockquote {
	background-color: #4169E1;
	color: #fff;
	margin: 0;
}

blockquote a {
	color: #fff;
}

blockquote a:hover {
	color: #222;
}

blockquote p {
	font-family: Lobster, cursive;
	font-size: 22px;
	padding: 20px;
}

blockquote cite {
	font-family: Roboto, sans-serif;
	float: right;
	font-size: 18px;
}

blockquote cite a:hover {
	color: #fff;
}

blockquote cite:before {
	font-family: "fontawesome";
	content: "\f068";
	margin-right: 5px;
}

blockquote p:before {
	font-family: "fontawesome";
	content: "\f10d";
	margin-right: 5px;
}

blockquote p:after {
	font-family: "fontawesome";
	content: "\f10e";
	margin-left: 5px;
}

address {
	margin: 0 0 24px;
	font-family: Lobster, cursive;
}

pre {
	background: #eee;
	font-family: Lobster, cursive;
	font-size: 15px;
	line-height: 1.6;
	margin-bottom: 24px;
	max-width: 100%;
	overflow: auto;
	padding: 24px;
}

code,
kbd,
tt,
var {
	font-family: Roboto, sans-serif;
	font-size: 15px;
}

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

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

big {
	font-size: 125%;
}

@media screen and (max-width: 768px) {
	h1 {
		font-size: 30px;
	}

	h2 {
		font-size: 28px;
	}

	h3 {
		font-size: 26px;
	}

	h4 {
		font-size: 24px;
	}

	h5 {
		font-size: 22px;
	}

	h6 {
		font-size: 20px;
	}

	p {
		font-size: 16px;
	}
}

/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/
html {
	box-sizing: border-box;
}

*,
*:before,
*:after { /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
	box-sizing: inherit;
}

body {
	background: #eaeaea; /* Fallback for when there is no custom background color defined. */
}

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

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

hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin-bottom: 24px;
}

ul,
ol {
	margin: 0;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

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

dt {
	font-weight: bold;
}

dd {
	margin: 0 24px 24px;
}

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

table {
	margin: 0 0 24px;
	width: 100%;
}

tr,
td,
th {
	border: 2px solid #4169E1;
	padding: 5px;
	text-align: center;
}

/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	border: 1px solid #4169E1;
	border-radius: 3px;
	background: #4169E1;
	font-size: 14px;
	padding: 10px 16px 6px;
	color: #fff;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #222;
	border: 1px solid #ccc;
	border-radius: 3px;
	width: 100%;
	max-width: 100%;
}

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 {
	color: #fff;
}

select {
	border: 1px solid #ccc;
	max-width: 100%;
	padding: 10px;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: #222;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"] {
	padding: 10px;
}

textarea {
	padding: 10px;
	width: 100%;
	max-width: 100%;
}

input[type="search"] {
	width: 98%;
	padding: 10px;
	max-width: 98%;
}

/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/
a {
	color: #222;
	text-decoration: none;
}

a:hover {
	color: #4169E1;
}

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

/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/
.main-navigation {
	clear: both;
	display: block;
	float: left;
	width: 100%;
	background-color: #222;
}

.main-navigation ul {
	display: none;
	list-style: none;
	margin: 0;
	padding-left: 0;
}

.main-navigation li {
	float: left;
	position: relative;
}

.main-navigation a {
	display: block;
	text-decoration: none;
	color: #fff;
	background-color: #222;
	padding: 15px;
	font-size: 16px;
}

.main-navigation a:hover {
	color: #fff;
}

.main-navigation ul ul {
	float: left;
	position: absolute;
	left: -9999px;
	z-index: 99999;
}

.main-navigation ul ul ul {
	left: -9999px;
	top: 0;
}

.main-navigation ul ul a {
	width: 200px;
	padding: 15px;
}

.main-navigation ul ul li {
	padding: 0;
}

.main-navigation li.menu-item-has-children > a:after,
.main-navigation li.page_item_has_children > a:after {
	font-family: "fontawesome";
	content: "\f107";
	margin-left: 10px;
}

.main-navigation li li.menu-item-has-children > a:after,
.main-navigation li li.page_item_has_children > a:after {
	font-family: "fontawesome";
	content: "\f105";
	position: absolute;
	right: 10px;
}

.main-navigation li:hover > a,
.main-navigation li.focus > a {
	background-color: #4169E1;
}

.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul {
	left: auto;
}

.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul {
	left: 100%;
}

.main-navigation .current_page_item > a,
.main-navigation .current-menu-item > a,
.main-navigation .current_page_ancestor > a,
.main-navigation .current-menu-ancestor > a {
	background-color: #4169E1;
}

/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {
	display: block;
}

.menu-toggle {
	border: 0;
	padding: 16px;
	background: transparent;
	box-shadow: none;
	color: #fff;
	font-size: 20px;
	text-shadow: none;
}

.menu-toggle:hover {
	border: none;
	box-shadow: none;
}

.menu-toggle:before {
	font-family: "fontawesome";
	content: "\f0c9";
	font-size: 18px;
	margin-right: 12px;
}

.search-toggle, .random-post {
	float: right;
}

.search-toggle {
	cursor: pointer;
}

.sticky-wrapper .main-navigation {
	z-index: 9999;
}

@media screen and (min-width: 768px) {
	.menu-toggle {
		display: none;
	}

	.main-navigation ul {
		display: block;
	}
}

@media screen and (max-width: 768px) {
	.main-navigation.toggled li {
		width: 100%;
	}

	.main-navigation.toggled li {
		float: none;
	}

	.main-navigation.toggled li li a {
		padding-left: 42px;
		width: 100%;
	}

	.main-navigation.toggled li li li a {
		padding-left: 60px;
		width: 100%;
	}

	.main-navigation.toggled ul ul,
	.main-navigation.toggled ul ul ul {
		position: relative;
		top: inherit;
		left: 0;
		display: block;
		float: none;
	}

	.main-navigation.toggled ul ul a {
		width: 100%;
	}

	.main-navigation.toggled ul ul li:hover > ul,
	.main-navigation.toggled ul ul li.focus > ul {
		left: 0;
	}

	.main-navigation li.menu-item-has-children > a:after,
	.main-navigation li.page_item_has_children > a:after {
		content: "";
	}

	.main-navigation li li.menu-item-has-children > a:after,
	.main-navigation li li.page_item_has_children > a:after {
		content: "";
	}
}

@media screen and (max-width: 767px) {
	.sticky-wrapper .main-navigation #primary-menu {
		max-height: 200px;
		overflow: auto;
		width: 100%;
	}
}

@media screen and (max-width: 480px) {
	.main-navigation.toggled li li a {
		padding-left: 30px;
	}

	.main-navigation.toggled li li li a {
		padding-left: 40px;
	}
}

.site-main .post-navigation {
	font-family: Lobster, cursive;
}

.site-main .comment-navigation,
.site-main .post-navigation {
	margin: 0 0 40px;
	overflow: hidden;
	font-size: 18px;
	background-color: #fff;
	padding: 20px;
}

.comment-navigation .nav-previous,
.post-navigation .nav-previous {
	float: left;
	width: 49%;
}

.comment-navigation .nav-next,
.post-navigation .nav-next {
	float: right;
	text-align: right;
	width: 49%;
}

.comment-navigation .nav-previous a:before,
.post-navigation .nav-previous a:before {
	font-family: "fontawesome";
	content: "\f190";
	margin-right: 5px;
}

.comment-navigation .nav-next a:after,
.post-navigation .nav-next a:after {
	font-family: "fontawesome";
	content: "\f18e";
	margin-left: 5px;
}

@media screen and (max-width: 480px) {
	.comment-navigation .nav-previous,
	.post-navigation .nav-previous,
	.comment-navigation .nav-next,
	.post-navigation .nav-next {
		width: 100%;
		float: none;
		text-align: left;
	}
}

/*--------------------------------------------------------------
# Archive pages navigation
--------------------------------------------------------------*/
.navigation.pagination {
	background-color: #fff;
	margin: 40px 0 0;
	padding: 20px;
	overflow: hidden;
}

.navigation.pagination .nav-links {
	font-size: 22px;
	color: #222;
	border-top: 2px solid #4169E1;
	text-align: center;
}

.nav-links .page-numbers.current {
	background-color: #4169E1;
	padding: 5px 10px;
	color: #fff;
}

.nav-links .page-numbers {
	padding: 5px 10px;
}

.nav-links .page-numbers:hover {
	color: #fff;
	background-color: #4169E1;
}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
.site-info {
	padding: 20px 0;
	background-color: #fff;
	border-top: 4px solid #4169E1;
}

.footer-bottom-area {
	width: 100%;
}

.footer-copyright {
	color: #222;
	float: left;
	max-width: 60%;
	font-size: 16px;
}

.footer-copyright a {
	color: #4169E1;
}

.footer-menu {
	float: right;
	max-width: 39%;
}

#footer-menu li {
	list-style: none;
	float: left;
}

#footer-menu a {
	padding: 10px;
	font-size: 16px;
}

.footer-menu ul,
.footer-menu li {
	list-style: none;
	margin: 0;
}

.footer-widgets {
	padding: 40px 0 30px;
	border-top: 4px solid #4169E1;
	background-color: #222;
}

.footer-sidebar-areas {
	width: 31%;
	float: left;
	margin: 0 1%;
	color: #fff;
}

.footer-sidebar-areas a {
	color: #fff;
}

.footer-sidebar-areas a:hover {
	color: #4169E1;
}

@media screen and (max-width: 768px) {
	.footer-menu,
	.footer-copyright {
		float: none;
		max-width: 100%;
	}

	.footer-copyright {
		padding-bottom: 10px;
		text-align: center;
	}

	#footer-menu li {
		float: none;
		display: inline-block;
	}

	ul#footer-menu {
		padding: 10px 0 0;
		text-align: center;
		border-top: 1px solid #4169E1;
	}

	.footer-sidebar-areas {
		width: 100%;
		float: none;
	}
}

/*--------------------------------------------------------------
# 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:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000; /* Above WP toolbar. */
}

/* Do not show the outline on the skip link target. */
#content[tabindex="-1"]:focus {
	outline: 0;
}

/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/
.alignleft {
	display: inline;
	float: left;
	margin-right: 24px;
}

.alignright {
	display: inline;
	float: right;
	margin-left: 24px;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/*--------------------------------------------------------------
# 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;
	table-layout: fixed;
}

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

/*--------------------------------------------------------------
# Breadcrumb CSS
--------------------------------------------------------------*/
.breadcrumbs-area {
	padding: 20px;
	background: #fff;
	margin-bottom: 40px;
}

/*--------------------------------------------------------------
# Widgets
--------------------------------------------------------------*/
.widget {
	margin: 0 0 40px;
	background-color: #fff;
	padding: 20px;
}

.widget input[type="search"] {
	width: 95%;
	max-width: 95%;
}

footer .widget {
	background-color: transparent;
	margin: 0;
}

/* Make sure select elements fit in widgets. */
.widget select {
	max-width: 100%;
}

.widget .widget-title {
	font-size: 22px;
	font-family: Lobster, cursive;
}

.widget .widget-title span {
	border-bottom: 2px solid #222;
	padding: 5px;
}

footer .widget .widget-title span {
	border-bottom: 2px solid #fff;
}

.widget ul, .widget ol {
	margin: 0;
}

.widget ul li {
	list-style: none;
}

.widget ul li ul li {
	margin-left: 10px;
}

.widget ul {
	padding-left: 0;
}

.widget ul ul {
	padding-left: 6px;
}

.widget_nav_menu a, .widget_pages a,
.widget_recent_comments li,
.widget_recent_entries li {
	border-bottom: 1px solid #fff;
	display: block;
	padding: 5px;
}

#secondary .widget_nav_menu a,
#secondary .widget_pages a,
#secondary .widget_recent_comments li,
#secondary .widget_recent_entries li {
	border-bottom: 1px solid #222;
}

.widget_rss .rss-date {
	display: block;
	font-weight: bold;
}

.widget_rss cite {
	display: block;
	font-size: 12px;
	font-weight: bold;
}

.widget_rss ul li {
	margin-bottom: 20px;
}

.widget_recent_entries li a:before,
.widget_recent_comments li:before,
.widget_archive li a:before,
.widget_categories li a:before,
.widget_pages li a:before,
.widget_nav_menu li a:before,
.widget_rss li a:before {
	display: inline-block;
	float: left;
	padding-right: 5px;
	font-family: "fontawesome";
	color: #222;
}

.widget_recent_entries li a:hover:before,
.widget_recent_comments li:hover:before,
.widget_archive li a:hover:before,
.widget_categories li a:hover:before,
.widget_pages li a:hover:before,
.widget_nav_menu li a:hover:before,
.widget_rss li a:hover:before {
	color: #4169E1;
}

footer .widget_recent_entries li a:before,
footer .widget_recent_comments li:before,
footer .widget_archive li a:before,
footer .widget_categories li a:before,
footer .widget_pages li a:before,
footer .widget_nav_menu li a:before,
footer .widget_rss li a:before {
	color: #fff;
}

.widget_recent_entries li a:before {
	content: "\f1da";
}

.widget_recent_comments li:before {
	content: "\f075";
}

.widget_archive li a:before {
	content: "\f187";
}

.widget_categories li a:before {
	content: "\f02d";
}

.widget_pages li a:before {
	content: "\f039";
}

.widget_nav_menu li a:before {
	content: "\f0c9";
}

.widget_rss li a:before {
	content: "\f09e";
}

@media screen and (max-width: 768px) {
	.widget .widget-title {
		font-size: 20px;
	}
}

/*--------------------------------------------------------------
# Random post widget
--------------------------------------------------------------*/
.single-article-content {
	display: inline-block;
	width: 100%;
	margin-bottom: 15px;
}

.random-posts-widget .entry-title {
	font-size: 20px;
	clear: none;
}

.random-posts-widget .entry-meta {
	font-size: 14px;
}

.random-posts-widget .single-article-content img {
	float: left;
	margin-right: 10px;
}

/*--------------------------------------------------------------
# Tabbed widget
--------------------------------------------------------------*/
.masonry-brick-tab-content .tabs-panel {
	display: none;
}

.masonry-brick-tab-content .popular-tab {
	display: block;
}

ul.masonry-brick-tabs li {
	display: inline-block;
	width: 32.6%;
	text-align: center;
	padding: 6px;
}

.masonry-brick-tabs .popular .fa,
.masonry-brick-tabs .recent .fa,
.masonry-brick-tabs .comment .fa {
	margin-right: 5px;
}

ul.masonry-brick-tabs {
	border-bottom: 2px solid #222;
	margin-bottom: 10px;
}

ul.masonry-brick-tabs .active {
	background-color: #222;
}

ul.masonry-brick-tabs .active a {
	color: #fff;
}

.recent-tab .single-article-content img,
.popular-tab .single-article-content img {
	float: left;
	margin-right: 10px;
}

.recent-tab .single-article-content .entry-title,
.popular-tab .single-article-content .entry-title {
	font-size: 20px;
	clear: none;
}

.recent-tab .single-article-content .entry-meta,
.popular-tab .single-article-content  .entry-meta {
	font-size: 14px;
}

.comments-tab-widget .avatar {
	float: left;
	margin-right: 10px;
}

li.comments-tab-widget {
	padding: 10px 0;
	border-bottom: 1px solid #ccc;
	font-family: Lobster, cursive;
}

li.comments-tab-widget p {
	margin-bottom: 0;
	margin-top: 0;
}

/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/
.sticky {
	display: block;
	background-color: #4169E1;
	color: #fff;
}

.sticky a {
	color: #fff;
}

.sticky a:hover {
	color: #222;
}

.sticky .continue-more-link {
	border: 1px solid #fff;
}

.hentry {
	margin: 2% 1.6%;
}

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

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

.page-content,
.entry-content,
.entry-summary {
	margin: 0;
}

.page-links {
	clear: both;
	margin: 0 0 24px;
}

.header-title {
	text-align: center;
	background-color: #fff;
	padding: 20px;
	margin: 0 0 50px;
}

.entry-title,
.page-title,
.taxonomy-description {
	font-family: Lobster, cursive;
}

.entry-title,
.page-title {
	font-family: Lobster, cursive;
	font-size: 28px;
	margin: 0;
	word-wrap: break-word;
}

.entry-content {
	word-wrap: break-word;
}

.featured-image {
	margin: 0;
	text-align: center;
}

.entry-meta .byline {
	display: inline-block;
}

.posted-on .fa-calendar,
.byline .fa-user,
.comments-link .fa-comment,
.cat-links .fa-folder-open,
.tags-links .fa-tags,
.edit-link .fa-edit {
	margin-right: 5px;
}

.entry-meta span.byline,
.entry-meta span.comments-link {
	margin-left: 10px;
}

.entry-meta,
.cat-links,
.tags-links,
.edit-link {
	font-size: 16px;
	font-family: Lobster, cursive;
}

.tags-links,
.edit-link,
.cat-links {
	display: block;
}

.entry-footer {
	margin-top: 10px;
}

.search-no-results .not-found {
	background: #fff;
	padding: 20px;
}

@media screen and (max-width: 768px) {
	.entry-title,
	.page-title {
		font-size: 26px;
	}

	.entry-meta,
	.cat-links,
	.tags-links,
	.edit-link {
		font-size: 14px;
	}
}

@media screen and (max-width: 480px) {
	.hentry {
		margin: 2% 0;
	}
}

/*--------------------------------------------------------------
## GitHub Gist table
--------------------------------------------------------------*/
.gist tr,
.gist td,
.gist th {
	border: none;
}

/*--------------------------------------------------------------
## JetPack subscription form
--------------------------------------------------------------*/
#subscribe-email input {
	color: #222;
}

/*--------------------------------------------------------------
## Post format support
--------------------------------------------------------------*/
.gallery-slider {
	visibility: hidden;
	height: 0;
}

.format-gallery .bx-wrapper {
	position: relative;
}

.format-gallery .bx-controls-direction {
	position: absolute;
	right: 25px;
	top: 5%;
}

.format-gallery .slide-prev {
	margin-right: 5px;
}

.format-gallery .slide-prev,
.format-gallery .slide-next {
	font-size: 30px;
	background-color: rgba(65,105,225,0.7);
	color: #fff;
	padding: 2px 12px;
	border-radius: 5px;
}

.format-gallery .slide-prev:hover,
.format-gallery .slide-next:hover {
	background-color: #4169E1;
}

.format-gallery .slider-images img {
	display: block;
	margin: 0 auto;
}

.format-audio iframe {
	width: 100%;
	height: auto;
}

.format-video .fitvids-video p,
.format-audio .audio-url p,
.format-status .status-user-text p,
.format-quote .quote-details blockquote p {
	margin-bottom: 0;
	margin-top: 0;
}

.format-status .status-details {
	background-color: #4169E1;
	padding: 20px;
	display: inline-block;
	width: 100%;
	color: #fff;
}

.format-status .status-details .status-user-avatar {
	margin-right: 20px;
	margin-bottom: 20px;
	float: left;
}

.format-chat .chat-details {
	background-color: #4169E1;
	padding: 20px;
	font-style: italic;
	font-size: 18px;
	color: #fff;
}

.format-chat .entry-content {
	display: none;
}

.format-link .link-details {
	background-color: #4169E1;
	padding: 20px;
	font-size: 20px;
}

.format-link .link-details a,
.format-link .link-details a:hover {
	color: #fff;
}

.format-link .link-details a:before {
	font-family: "fontawesome";
	content: "\f0c1";
	margin-right: 5px;
}

.quote-details {
	background-color: #4169E1;
	padding: 20px;
}

.quote-details blockquote {
	background-color: transparent;
}

.format-quote .quote-details cite {
	font-size: 14px;
	color: #fff;
	text-align: right;
	display: inherit;
}

.format-quote .quote-details cite:before {
	font-family: "fontawesome";
	content: "\f068";
	margin-right: 5px;
}

.format-quote .quote-details blockquote p:before {
	font-family: "fontawesome";
	content: "\f10d";
	margin-right: 5px;
	margin-left: -18px;
}

.format-quote .quote-details blockquote p:after {
	font-family: "fontawesome";
	content: "\f10e";
	margin-left: 5px;
	margin-right: -18px;
}

/*--------------------------------------------------------------
## Author bio box
--------------------------------------------------------------*/
.author-box {
	background-color: #fff;
	padding: 20px;
	margin: 0 0 40px;
	display: inline-block;
	width: 100%;
}

.author-box .author-img {
	float: left;
	margin-right: 20px;
	margin-bottom: 20px;
}

.author-box .author-img img {
	border-radius: 50%;
}

.author-box .author-name {
	font-weight: bold;
	clear: none;
	display: inline;
}

.author-social-links,
.author-box .author-description,
.author-box .author-name {
	font-family: Lobster, cursive;
}

.author-box .fa {
	font-size: 18px;
	vertical-align: middle;
	padding: 5px;
}

.author-box .fa-twitter {
	color: #00aced;
}

.author-box .fa-google-plus {
	color: #dd4b39;
}

.author-box .fa-facebook {
	color: #3b5998;
}

/*--------------------------------------------------------------
## Related posts
--------------------------------------------------------------*/
.related-posts-main {
	background-color: #fff;
	margin: 0 0 40px;
	padding: 20px;
}

.related-posts.columns {
	width: 30%;
	float: left;
	margin: 0 1.5%;
}

.related-post-contents .entry-title {
	font-size: 20px;
}

.related-post-contents .entry-meta {
	font-size: 16px;
}

.related-posts-main-title {
	font-family: Lobster, cursive;
}

.related-posts-main-title span {
	border-bottom: 2px solid #222;
}

@media screen and (max-width: 480px) {
	.related-post-contents .entry-title {
		font-size: 18px;
	}

	.related-post-contents .entry-meta {
		font-size: 14px;
	}

	.related-posts.columns {
		width: 100%;
		float: none;
		margin: 0 0 10px;
	}
}

/*--------------------------------------------------------------
## Comments
--------------------------------------------------------------*/
.comment-content a {
	word-wrap: break-word;
}

.bypostauthor {
	display: block;
}

#comments {
	background-color: #fff;
	padding: 20px;
	margin: 0 0 40px;
	clear: both;
}

.comment-form label {
	display: block;
}

.comment-respond input,
.comment-respond textarea {
	padding: 10px;
}

.comment-respond .form-submit {
	max-width: 100%;
}

.comment-respond textarea {
	min-width: 100%;
	max-width: 100%;
}

.comment-respond .form-submit input[type="submit"] {
	background: #4169E1;
	color: #ffffff;
	border: none;
	box-shadow: none;
}

.comment-reply-title {
	font-size: 24px;
	font-family: Lobster, cursive;
}

.comments-title {
	font-size: 26px;
	font-family: Lobster, cursive;
}

.comment-metadata,
.comment-author {
	font-family: Lobster, cursive;
}

.comments-area > ol {
	padding: 0;
	margin-left: auto;
	margin-right: auto;
	list-style-type: none;
}

ol.children {
	list-style-type: none;
	margin-left: 20px;
}

.comment-meta {
	margin-bottom: 5px;
}

.comment-author .avatar {
	display: block;
	float: left;
	margin-right: 10px;
}

.comment-body {
	padding-bottom: 10px;
	padding-top: 10px;
	border-bottom: 1px solid #ddd;
}

.bypostauthor > .comment-body .fn:after {
	content: "Post Author";
	margin: 0 0 0 5px;
	background-color: #4169E1;
	padding: 5px;
	color: #fff;
	border-radius: 5px;
}

.comments-area .comment-meta time:before {
	font-family: "fontawesome";
	content: "\f073";
	margin-right: 2px;
}

.comments-area .comment-meta .edit-link a:before {
	font-family: "fontawesome";
	content: "\f044";
	margin-right: 5px;
	color: #222;
}

.comment-author .fn a:before {
	font-family: "fontawesome";
	content: "\f007";
	margin-right: 5px;
	color: #222;
}

.comments-area .comment-meta .edit-link a:hover:before,
.comment-author .fn a:hover:before {
	color: #4169E1;
}

.comment-awaiting-moderation {
	max-width: 100%;
	background-color: #4169E1;
	color: #fff;
	padding: 10px;
	overflow: hidden;
	margin-top: 10px;
}

.comments-area .comment-metadata .edit-link {
	display: block;
}

.comment-content {
	clear: both;
	padding: 10px 0 10px;
}

@media screen and (max-width: 768px) {
	.comment-reply-title {
		font-size: 20px;
	}

	.comments-title {
		font-size: 22px;
	}
}

@media screen and (max-width: 480px) {
	ol.children {
		margin-left: 10px;
		padding-left: 0;
	}
}

/*--------------------------------------------------------------
## Scroll to top
--------------------------------------------------------------*/
a#scroll-up {
	bottom: 20px;
	position: fixed;
	right: 20px;
	display: none;
	opacity: 0.5;
	filter: alpha(opacity=50); /* For IE8 and earlier */
}

a#scroll-up i {
	background-color: #222;
	color: #4169E1;
	font-size: 36px;
	padding: 8px;
	border-radius: 5px;
}

a#scroll-up:hover {
	opacity: 1;
	filter: alpha(opacity=100); /* For IE8 and earlier */
}

/*--------------------------------------------------------------
# Infinite scroll
--------------------------------------------------------------*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .navigation.pagination, /* 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;
}

/*--------------------------------------------------------------
## WooCommerce Plugin CSS
--------------------------------------------------------------*/
.woocommerce-page #primary {
	background: #fff;
	padding: 20px;
	margin: 0 0 40px;
}

.archive.woocommerce-page #primary {
	width: 100%;
}

.woocommerce-page tr,
.woocommerce-page td,
.woocommerce-page th {
	border: 0;
}

/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .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%;
}

/*--------------------------------------------------------------
# Header Video CSS
--------------------------------------------------------------*/
.wp-custom-header {
	position: relative;
}

.wp-custom-header-video-button {
	position: absolute;
	left: 2%;
	top: 85%;
	max-width: 100%;
	border: 1px solid #4169E1;
	border-radius: 3px;
	background: #4169E1;
	font-size: 16px;
	padding: 8px 15px;
	color: #fff;
}

/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/
.wp-caption {
	margin-bottom: 24px;
	max-width: 100%;
	background: #ddd;
	padding: 5px;
	border: 1px solid #4169E1;
}

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

.wp-caption .wp-caption-text {
	margin: 5px 0;
}

.wp-caption-text {
	font-style: italic;
	text-align: center;
	font-size: 12px;
	margin-top: 2px;
}

.gallery .gallery-caption {
	font-size: 12px;
	padding: 5px;
	font-style: italic;
}

/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/
.gallery {
	margin-bottom: 24px;
}

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

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

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

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

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

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

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

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

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

@media screen and (max-width: 768px) {
	.gallery-columns-4 .gallery-item,
	.gallery-columns-5 .gallery-item,
	.gallery-columns-6 .gallery-item,
	.gallery-columns-7 .gallery-item,
	.gallery-columns-8 .gallery-item,
	.gallery-columns-9 .gallery-item {
		width: 25%;
	}
}

@media screen and (max-width: 480px) {
	.gallery-columns-4 .gallery-item,
	.gallery-columns-5 .gallery-item,
	.gallery-columns-6 .gallery-item,
	.gallery-columns-7 .gallery-item,
	.gallery-columns-8 .gallery-item,
	.gallery-columns-9 .gallery-item {
		width: 33.33%;
	}
}