/*
Theme Name: ClubBlog
Theme URI: https://www.thewpclub.com/clubblog-wordpress-theme/
Author: The WP Club
Author URI: https://www.thewpclub.com
Description: A Free WordPress Blog / Magazine / Personal / Writers Theme. ClubBlog is a clean minimal and responsive WordPress theme well suited for fashion, writers, travel, health, business, finance, portfolio, design, art, photography, personal or any other creative websites and blogs. Developed with bootstrap framework that makes it mobile and tablets friendly. Get free support at https://ask.thewpclub.com/
Version: 1.1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: clubblog
Tags: custom-menu, custom-colors, custom-header, sticky-post, featured-images, translation-ready, threaded-comments, blog
*/


/* -------- Index --------
1.0 - Default
2.0 - Typography
3.0 - Layout
	3.1  Navigation
	3.2  Header
	3.3  Content
	3.4  Front Page
	3.5  Posts
	3.6  Pagination
	3.7  Page
	3.8  Sidebar
	3.9  Comments
	3.10 Footer
	3.11 Colors
4.0 - Media Queries
5.0 - Print Media
*/

/* --------------------------------------------------------------
1.0 Default
-------------------------------------------------------------- */

/* Form */
.form-control {
	min-height: 44px;
	margin-bottom: 15px;
	padding-top: 10px;
	padding-bottom: 10px;
	border-color: #e7e7e7;
	font-weight: 100;
}

.btn-search,
.btn-submit {
	height: 44px;
	border: 0;
	font-size: 13px;
	color: #fff;
	text-transform: uppercase;
}

.btn-search:hover,
.btn-search:focus,
.btn-submit:hover,
.btn-submit:focus {
	color: #fff;
}


/* WordPress Core */
.alignnone {
    margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
    margin: 5px auto 5px auto;
    display: block;
}

.alignright {
	margin: 5px 0 20px 20px;
	float:right;
}

.alignleft {
	margin: 5px 20px 20px 0;
	float: left;
}

a img.alignright { 
    margin: 5px 0 20px 20px;
    float: right;
}

a img.alignnone {
    margin: 5px 20px 20px 0;
}

a img.alignleft {
    margin: 5px 20px 20px 0;
    float: left;
}

a img.aligncenter {
    margin-left: auto;
    margin-right: auto;
    display: block;
}

.wp-caption {
    max-width: 96%;
}

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

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

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

.wp-caption img {
	width: auto;
	height: auto;
	max-width: 100%;
	margin: 0;
	padding: 0;
	border: 0 none;
}

.wp-caption p.wp-caption-text {
	line-height: 17px;
	margin: 0;
	padding: 0 4px 5px;
	font-size: 11px;
}

.screen-reader-text {
	width: 1px;
	height: 1px;
	position: absolute !important;
	white-space: nowrap;
	clip: rect(1px, 1px, 1px, 1px);
	overflow: hidden;
}

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

.gallery-caption {
	margin-bottom: 0;
	padding: 0 10px 0 0;
	text-align: left;
	display: block;
}

.sticky,
.bypostauthor {

}

/* Tables */
table {
	border-collapse: collapse;
	margin: 0 0 1.5em;
	width: 100%;
}

thead th {
	border-bottom: 2px solid #bbb;
	padding-bottom: 0.5em;
}

th {
	padding: 0.4em;
	text-align: left;
}

tr {
	border-bottom: 1px solid #eee;
}

td {
	padding: 0.4em;
}

th:first-child,
td:first-child {
	padding-left: 0;
}

th:last-child,
td:last-child {
	padding-right: 0;
}

/* --------------------------------------------------------------
2.0 Typography
-------------------------------------------------------------- */

body,
button,
input,
select,
textarea {
	font-family: 'Montserrat', sans-serif;
	font-size: 13px;
	font-weight: 300;
	color: #696969;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: 'Playfair Display', serif;
	color: #333;
}

a {
	color: #696969;
}

/* --------------------------------------------------------------
3.0 Layout
-------------------------------------------------------------- */

/* 3.1 Navigation */
.navbar-default {
	min-height: 70px;
	margin-bottom: 0;
	position: relative;
	background-color: #fff;
	border: 0;
	border-radius: 0;
	-webkit-box-shadow: 0 16px 10px 0 rgba(0, 0, 0, 0.05);
	-moz-box-shadow: 0 16px 10px 0 rgba(0, 0, 0, 0.05);
	box-shadow: 0 16px 10px 0 rgba(0, 0, 0, 0.05);
	z-index: 3;
}

.navbar-default .navbar-toggle {
	margin: 0;
	padding: 26.5px;
	border: 0;
	border-radius: 0;
}

.navbar-default .navbar-toggle .icon-bar {
	height: 3px;
	background-color: #fff;
	border-radius: 2px;
}

.navbar-default .navbar-brand {
	height: 70px;
	padding-top: 16px;
	padding-bottom: 16px;
	font-family: 'Playfair Display', serif;
	font-size: 22px;
	font-weight: 700;
}

.navbar-default .navbar-brand img {
	max-height: 38px;
}

.navbar-default .navbar-brand span.site-description {
	font-family: 'Montserrat', sans-serif;
	font-size: 13px;
	font-weight: 300;
	opacity: 0.7;
	display: block;
}

.navbar-default .navbar-nav > li > a {
	padding-top: 25px;
	padding-bottom: 25px;
	font-size: 12px;
	color: #333;
	font-weight: 700;
	text-transform: uppercase;
}

.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
	background-color: transparent;
}

.navbar-default .navbar-nav > li > .dropdown-menu {
	border: 0;
	border-radius: 0;
	box-shadow: 0 0 0 rgba(0, 0, 0, 0);
}

.navbar-default .navbar-nav > li > .dropdown-menu > li > a {
	padding-top: 6px;
	padding-bottom: 6px;
	color: #333;
	font-size: 12px;
	font-weight: 300;
}

.navbar-default .navbar-nav > li > .dropdown-menu > li > a:hover,
.navbar-default .navbar-nav > li > .dropdown-menu > li > a:focus,
.navbar-default .navbar-nav > li > .dropdown-menu > .active > a,
.navbar-default .navbar-nav > li > .dropdown-menu > .active > a:hover,
.navbar-default .navbar-nav > li > .dropdown-menu > .active > a:focus  {
	background-color: transparent;
}


/* 3.2 Header */
.site-header,
.site-header .col-xs-12 {
	height: 300px;
}

.home .site-header,
.home .site-header .col-xs-12 {
	height: 500px;
}

.site-header {
	position: relative;
	background-repeat: no-repeat;
	background-position: center center;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
}

.site-header:after {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background-color: rgba(51, 51, 51, 0.3);
	content: "";
}

.site-header .header-info {
	line-height: 30px;
	position: absolute;
	top: 50%;
   	left: 50%;
   	-webkit-transform:translate(-50%, -50%);
   	-ms-transform:translate(-50%, -50%);
   	transform:translate(-50%, -50%);
   	font-size: 14px;
	color: #fff;
	font-weight: 300;
	z-index: 2;
}

.site-header .header-info h1 {
	margin-top: 0;
	margin-bottom: 30px;
	font-size: 42px;
	font-weight: 700;
	color: #fff;
}


/* 3.3 Content */
.content {
	padding-top: 30px;
}

/* 3.4 Front Page */


/* 3.5 Posts */
.post-item {
	margin-bottom: 40px;
	padding-bottom: 30px;
	position: relative;
	border-bottom: 1px dotted #d4d4d4;
}

.posts .col-xs-12:last-of-type .post-item {
	margin-bottom: 10px;
}

.post-item .post-title h2 {
	margin-top: 0;
	font-size: 22px;
}

.post-item .post-title h2 a {
	color: #333;
}

.post-item .post-meta {
	margin-bottom: 30px;
	font-size: 11px;
	color: #7f7f7f;
	text-transform: uppercase;
}

.post-item .post-meta a {
	color: #7f7f7f;
}

.post-item .post-categories-list {
	margin-bottom: 30px;
}

.post-item .post-image .post-categories-list {
	padding: 30px;
	position: absolute;
	top: 0;
	left: 0;
}

.post-item .post-categories-list .post-categories {
	margin: 0;
	padding: 0;
	list-style: none;
	display: table;
}

.post-item .post-categories-list .post-categories li {
	margin-bottom: 5px;
	margin-right: 5px;
	float: left;
}

.post-item .post-categories-list .post-categories li:last-of-type {
	margin-right: 0;
}

.post-item .post-categories-list .post-categories li a {
	padding: 5px 10px;
	border-radius: 4px;
	font-size: 12px;
	font-weight: 300;
	color: #fff;
	display: table;
}

.post-item .post-image {
	margin-bottom: 30px;
	position: relative;
}

.post-item .post-image img {
	border-bottom: 7px solid;
	border-radius: 4px;
	-webkit-box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.04);
	-moz-box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.04);
	box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.04);
}

.post-item .post-message {
	line-height: 25px;
}

.post-item .post-message a {
	text-decoration: underline;
}

.post-item .post-edit a {
	text-decoration: underline;
}

.post-item .post-tags {
	margin-top: 30px;
}

.post-item .post-tags .tags {
	display: table;
}

.post-item .post-tags .tags a {
	margin-bottom: 5px;
	margin-right: 5px;
	padding: 5px 10px;
	border-radius: 4px;
	font-size: 12px;
	font-weight: 300;
	color: #fff;
	float: left;
	display: table;
}

.post-item .post-navigation {
	padding-top: 15px;
}

.post-item-first {
	height: 500px;
	background-repeat: no-repeat;
	background-position: center center;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
	border-bottom: 7px solid;
	border-radius: 4px;
	-webkit-box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.04);
	-moz-box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.04);
	box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.04);
}

.post-item-first:after {
	width: 100%;
	height: 175px;
	position: absolute;
	bottom: 0;
	left: 0;
	background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.75) 75%);
	background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%,rgba(0, 0, 0, 0.75) 75%);
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%,rgba(0, 0, 0, 0.75) 75%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=0 );
	content: "";
}

.post-item-first .post-categories-list {
	padding: 30px;
}

.post-item-first .post-title {
	width: 100%;
	padding-left: 30px;
	padding-right: 30px;
	position: absolute;
	bottom: 30px;
	z-index: 2;
}

.post-item-first .post-title h2 a {
	color: #fff;
}

.post-item-first .post-meta,
.post-item-first .post-meta a {
	color: #e5e5e5;
}

.post-item-first .post-info {
	margin-bottom: 0;
	color: #d9d9d9;
}

.post-item-first .post-info a {
	color: #d9d9d9;
}


/* 3.6 Pagination */
.nav-links .page-numbers {
	height: 30px;
	line-height: 30px;
	margin-right: 1px;
	padding-left: 12px;
	padding-right: 12px;
	border-radius: 4px;
	text-align: center;
	display: table;
	float: left;
}

.nav-links .page-numbers.current {
	color: #fff;
}


/* 3.7 Page */
.page-content,
.archive-items,
.single-items {
	padding-top: 30px;
}

.page-title h1 {
	margin-top: 0;
	margin-bottom: 30px;
}

.page-message {
	width: 100%;
	line-height: 25px;
	display: inline-block;
}

.page-message a {
	text-decoration: underline;
}

.page-edit a {
	text-decoration: underline;
}


/* 3.8 Sidebar */
.sidebar-item {
	margin-bottom: 30px;
	padding: 30px;
	border-bottom: 7px solid;
	border-radius: 4px;
	-webkit-box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.04);
	-moz-box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.04);
	box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.04);
}

.sidebar-item h2 {
	margin-top: 0;
	font-size: 22px;
}

.sidebar-item ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sidebar-item li {
	line-height: 25px;
}


/* 3.9 Comments */
.comment.depth-1 {
	margin-bottom: 30px;
	padding: 30px;
	background-color: #fff;
	border-bottom: 7px solid;
	border-radius: 4px;
	-webkit-box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.04);
	-moz-box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.04);
	box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.04);
}

.comment.depth-5 {
	margin-bottom: 15px;
	padding-bottom: 15px;
	border-bottom: 1px dotted #e7e7e7;
}

.comment .children {
	margin-top: 30px;
	list-style: none;
}

.comment .avatar {
	border-radius: 100%;
}

.comment .comment-meta {
	margin-bottom: 10px;
	font-size: 11px;
	color: #7f7f7f;
}

.comment .comment-meta a {
	color: #7f7f7f;
}

.comment .reply a {
	padding: 5px 10px;
	border-radius: 4px;
	font-size: 11px;
	color: #fff;
	text-transform: uppercase;
}


/* 3.10 Footer */
footer {
	font-size: 12px;
	color: #b1b1b1;
	font-weight: 300;
}

footer p {
	margin-bottom: 0;
}

footer .footer-main {
	padding-top: 15px;
	padding-bottom: 15px;
	border-top: 1px solid #f2f2f2;
}


/* 3.11 Colors */

/* Color 1 */
.navbar-default .navbar-toggle,
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus,
.post-item .post-categories-list .post-categories li a,
.post-item .post-tags .tags a,
.nav-links .page-numbers.current {
	background-color: #f8859f;
}

.post-item .post-image img,
.post-item-first {
	border-color: #f8859f;
}

a:hover,
a:focus,
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus,
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus,
.navbar-default .navbar-nav > li > .dropdown-menu > li > a:hover,
.navbar-default .navbar-nav > li > .dropdown-menu > li > a:focus,
.navbar-default .navbar-nav > li > .dropdown-menu > .active > a,
.navbar-default .navbar-nav > li > .dropdown-menu > .active > a:hover,
.navbar-default .navbar-nav > li > .dropdown-menu > .active > a:focus,
footer a {
	color: #f8859f;
}

/* Color 2 */
.btn-search,
.btn-submit,
.btn-search:hover,
.btn-search:focus,
.btn-submit:hover,
.btn-submit:focus,
.comment .reply a {
	background-color: #3fe8cf;
}

.sidebar-item,
.comment.depth-1 {
	border-color: #3fe8cf;
}

/* Header Color */
.navbar-default .navbar-brand {
	color: #333;
}

/* --------------------------------------------------------------
4.0 Media Queries
-------------------------------------------------------------- */

/* Extra Small Devices, .visible-xs-* */
@media (max-width: 767px) {

	/* 3.1 Navigation */
	.navbar-default {
		min-height: 50px;
	}

	.navbar-default .navbar-brand {
		height: auto;
		padding-top: 15px;
		padding-bottom: 15px;
	}

	.navbar-default .navbar-nav {
		float: none!important;
	}

	.navbar-default .navbar-nav > li > a {
		padding-top: 10px;
		padding-bottom: 10px;
	}


	/* 3.2 Header */
	.site-header .header-info {
		width: 90%;
	}


	/* 3.10 Footer */
	footer p {
		line-height: 30px;
	}

	footer .col-sm-6 {
		text-align: left!important;
	}
}

/* Small Devices, .visible-sm-* */
@media (min-width: 768px) and (max-width: 991px) {

	/* 3.1 Navigation */
	.navbar-default .navbar-header {
		width: 100%;
	}

	.navbar-default .navbar-brand {
		height: auto;
		margin-left: auto!important;
		margin-right: auto;
		padding-top: 15px;
		padding-bottom: 15px;
		float: none;
		display: table;
	}

	.navbar-default .navbar-nav {
		margin-left: auto;
		margin-right: auto;
		float: none!important;
	}

	.navbar-default .navbar-nav > li > a {
		padding-left: 8px;
		padding-right: 8px;
	}
}

/* Medium Devices, .visible-md-* */
@media (min-width: 992px) and (max-width: 1199px) {

}

/* Large Devices, .visible-lg-* */
@media (min-width: 1200px) {
	
}

/* --------------------------------------------------------------
5.0 Media Queries
-------------------------------------------------------------- */

@media print {
	.content .col-sm-8,
	.posts .col-md-6 {
		width: 100%;
	}

	.content .col-sm-4,
	.page-nav {
		display: none;
	}
}