/*
Theme Name: TimelineBlog
Theme URI: https://awplife.com/wordpress-free-theme/timelineblog/
Template: cryptocurrency-exchange
Author: A WP Life
Author URI: https://awplife.com
Description: TimelineBlog is innovative blog WordPress theme with a clean and responsive design. With its outstanding look and design style, you can rock on the internet. TimelineBlog theme can show your posts elegantly and gorgeously with the help of built-in rich media post formats. This theme is the best way to show your posts in a creative and chronologically way. It has entirely responsive design that can be adjusted according to all kind of devices such as desktop computers, tablets, and smartphones. You can easily share your photos, videos, music and posts in the simple but creative and elegant way. It’s very modern, and it has all the advanced features you need for your website. TimelineBlog flexible design focuses on your content and is ideally suited for blog, portfolio, news, newspaper, magazine, business , architecture, interior design, decoration, furniture, home decor, construction, corporate, agency, business promotion, industries, Beauty & spa salons, photography, shape gym, body fitness, dental healths, medical cares, startups, business agencies, law firms, travel, total education, university portal, coffee restaurant, shops, storefront, meta magazines, future finance, accounting, consulting ,travel agency website. It is very fast and responsive for creating beautiful fast loading and accessible websites. timeline blog is RTL & translation ready. Theme is fully responsive and compatible with popular WordPress plugins like Elementor Page Builder, Beaver Builder, Brizy, Visual Composer, Divi, SiteOrigin, Gutenberg, Block-Enabled, WooCommerce, WPML, Yoast SEO, Jetpack, Contact Form 7, Mailchimp for WordPress, bbPress, Demo Importer, WPForms and more. Whether you’re running an blogline store or setting up your agency website. TimelineBlog is a perfect choice for almost any type of timeline layouts-related blog or website, that can be travel, business, cooking, lifestyle, pet or personal blog. That is yours choose what it could be. With TimelineBlog, you can easily create your timeline website without any coding skills. Check Timeline Blog Demo https://awplife.com/demo/timelineblog/
Tags: blog, portfolio, news, grid-Layout, one-column, two-columns, three-columns, flexible-header, left-sidebar, right-sidebar, custom-background, custom-colors, custom-logo, custom-menu, featured-images, footer-widgets, full-width-template, post-formats, rtl-language-support, theme-options, sticky-post, threaded-comments, translation-ready, block-styles, wide-blocks
Version: 0.1.9
Tested up to: 6.5
Requires PHP: 5.4
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl.html
Text Domain: timelineblog

*/

.timeline {
	list-style: none;
	padding: 70px 0 0;
	margin: 0;
	position: relative;
}

.timeline:before {
	top: 0;
	bottom: 0;
	position: absolute;
	content: " ";
	width: 8px;
	background-color: #ffffff;
	left: 50%;
	margin-left: -1.5px;
	box-shadow: inset 0 0 6px rgba(0,0,0,0.25);
}

.timeline > li {
	margin-bottom: 0px;
	position: relative;
}

.timeline > li:before, .timeline > li:after {
	content: " ";
	display: table;
}

.timeline > li:after {
	clear: both;
}

.timeline > li:before, .timeline > li:after {
	content: " ";
	display: table;
}

.timeline > li:after {
	clear: both;
}

.timeline > li > .timeline-panel.post {
	width: 40%;
	float: left;
	background-color: #fff;
	border-radius: 0px;
	padding: 0px;
	position: relative;
	margin: 0 0 60px;
}

.timeline > li > .timeline-badge {
	color: #fff;
	width: 100px;
	height: 100px;
	overflow: hidden;
	font-size: 1.4rem;
	text-align: center;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	padding: 17px;
	margin-left: -48px;
	background-color: #fe4a3e;
	z-index: 100;
	border-top-right-radius: 50%;
	border-top-left-radius: 50%;
	border-bottom-right-radius: 50%;
	border-bottom-left-radius: 50%;
	border: 5px solid #fff;
	box-shadow: 0px 0px 15px rgba(0,0,0,0.25);
}

.timeline > li > .timeline-badge > .dashicons {
	color: #fff;
	width: auto;
	height: auto;
	font-size: 46px;
    line-height: 1.2;
}

.timeline > li.timeline-inverted > .timeline-panel.post {
	float: right;
}

.timeline > li.timeline-inverted > .timeline-panel.post:before {
	border-left-width: 0;
	border-right-width: 15px;
	left: -15px;
	right: auto;
}

.timeline > li.timeline-inverted > .timeline-panel.post:after {
	border-left-width: 0;
	border-right-width: 14px;
	left: -14px;
	right: auto;
}

.timeline-badge.primary {
	background-color: #2e6da4 !important;
}

.timeline-badge.success {
	background-color: #3f903f !important;
}

.timeline-badge.warning {
	background-color: #fe4a3e !important;
}

.timeline-badge.danger {
	background-color: #d9534f !important;
}

.timeline-badge.info {
	background-color: #5bc0de !important;
}

.timeline-body > ul {
	margin-bottom: 0;
}

.timeline-body > p + p {
	margin-top: 5px;
}

@media (max-width: 767px) {
	ul.timeline:before {
		left: 50%;
	}

	ul.timeline > li > .timeline-panel.post {
		width: calc(100% - 80px);
		width: -moz-calc(100% - 80px);
		width: -webkit-calc(100% - 80px);
	}

	ul.timeline > li > .timeline-panel.post {
		float: right;
	}

	ul.timeline > li > .timeline-panel.post:before {
		border-left-width: 0;
		border-right-width: 15px;
		left: -15px;
		right: auto;
	}

	ul.timeline > li > .timeline-panel.post:after {
		border-left-width: 0;
		border-right-width: 14px;
		left: -14px;
		right: auto;
	}
}

.blog-timeline {
	background-image: url(../images/icons/diagmonds.png);
	background-position: center center;
	background-attachment: fixed;
}

.timeline-panel.post .post-content-area {
	padding: 20px 30px 30px;
}

.timeline-panel.post .post-header {
	margin: 0 0 25px;
}

.timeline-panel.post .post-title {
	font-size: 26px;
}

.timeline-panel.post .more-link {
	word-break: break-all;
	padding: 6px 12px;
	border-radius: 0px;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	font-size: 14px;
	border: none;
	background: #fe4a3e;
	color: #ffffff;
	display: inline-block;
	white-space: normal;
	margin-top: 10px;
}

.timeline-panel.post .more-link:hover, .timeline-panel.post .more-link:focus {
	background: #232323;
	color: #ffffff;
}

.timeline-panel.post .more-link:after {
	display: none;
}

.timeline > li > .entry-date-badge {
	color: #fff;
	min-width: 200px;
	background-color: #ffffff;
	z-index: 100;
}

.blog-timeline .entry-date-badge.caret-left {
	box-shadow: 0px 12px 5px -9px rgba(0,0,0,0.20);
	position: absolute;
	top: 50%;
	left: 60%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.blog-timeline .entry-date-badge.caret-right {
	box-shadow: 0px 12px 5px -9px rgba(0,0,0,0.20);
	position: absolute;
	top: 50%;
	right: 60%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.blog-timeline .entry-date-badge .entry-date {
	font-size: 36px;
	line-height: 1.5;
	font-weight: 500;
	text-align: center;
	color: #232323;
	padding-right: 25px;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-align: center;
	-webkit-align-items: center;
	-webkit-box-align: center;
	align-items: center;
}

.blog-timeline .entry-date-badge .entry-date big {
	color: #fff;
	background-color: #fe4a3e;
	padding: 7px 15px;
	letter-spacing: 1px;
	float: left;
	margin-right: 25px;
}

@media screen and (min-width: 992px) and (max-width: 1200px) {
	.blog-timeline .entry-date-badge .entry-date {
		font-size: 24px;
		line-height: 1.3;
	}
}

@media screen and (min-width: 768px) and (max-width: 992px) {
	.blog-timeline .entry-date-badge .entry-date {
		font-size: 24px;
		line-height: 1.3;
	}

	.timeline > li > .timeline-badge {
		width: 80px;
		height: 80px;
		padding: 17px;
		margin-left: -40px;
	}

	.timeline > li > .timeline-badge > .dashicons {
		font-size: 30px;
	}
}

@media screen and (min-width: 100px) and (max-width: 768px) {
	.timeline > li > .timeline-panel.post {
		margin: 100px 0 60px;
	}

	ul.timeline > li > .timeline-panel.post {
		width: calc(100% - 0px);
		width: -moz-calc(100% - 0px);
		width: -webkit-calc(100% - 0px);
	}

	.blog-timeline .entry-date-badge .entry-date {
		font-size: 16px;
		line-height: 1.5;
	}

	.timeline > li > .timeline-badge {
		width: 60px;
		height: 60px;
		padding: 7px;
		margin-left: -30px;
		border: 3px solid #fff;
		left: 50%;
		top: 20px;
		position: relative;
	}

	.blog-timeline .entry-date-badge.caret-left, .blog-timeline .entry-date-badge.caret-right {
		top: 80px;
		-webkit-transform: none;
		-ms-transform: none;
		transform: none;
		left: 0;
		right: 0;
		width: 30%;
		margin: 0 auto;
	}

	.blog-timeline .entry-date-badge.caret-left:before, .blog-timeline .entry-date-badge.caret-right:after {
		display: none;
	}

	.blog-timeline .entry-date-badge .entry-date big {
		padding: 7px 10px;
	}

	.timeline > li > .timeline-badge > .dashicons {
		font-size: 24px;
		line-height: 1.6;
	}
}

.blog-timeline .post-meta {
	font-weight: 500;
}

.blog-timeline .post-meta i.fa {
	color: #232323;
	font-size: 15px;
	padding-right: 3px;
}

.blog-timeline .post-meta span::after {
	content: "|";
	color: #939393;
	margin-left: 15px;
	margin-right: 15px;
}

.blog-timeline-header {
	margin: 0;
	text-align: center;
}

.blog-timeline-header-title {
	margin: 0;
	display: inline-block;
	font-size: 36px;
	padding-bottom: 15px;
	padding-left: 35px;
	padding-right: 35px;
	background: #fff;
	font-weight: 600;
	position: relative;
	box-shadow: inset 0 0 7px rgba(0,0,0,0.25);
	padding-top: 15px;
	line-height: 1.5;
}

.news-title-color {
	color: #fe4a3e;
}

.p-top-70 {
	padding-top: 70px !important;
}

/* =======================================
 Blog Timeline Carousal CSS
======================================= */
#blog-timeline-carousal .flex-control-nav {
	top: 85%;
}

#blog-timeline-carousal .flex-direction-nav .flex-prev {
	left: 10px;
	text-align: center;
	opacity: 1;
}
#blog-timeline-carousal .flex-direction-nav .flex-next {
	right: 10px;
	text-align: center;
	opacity: 1;
}
#blog-timeline-carousal .flex-direction-nav a {
	background-color: rgba(0, 0, 0, 0.3);
	width: 50px !important;
	height: 50px !important;
	font-size: 40px;
	line-height: 1.65;
}
#blog-timeline-carousal .flex-direction-nav a:before {
	font-size: 30px;
}

/*underline links */
.entry-date-badge a{
	text-decoration: none;
}



.logo-text a{
	color: #000;
}