/* TIMELINE TEMPLATE CSS by CoolPlugins.net
--------------------------------------------------- */
#event-timeline-wrapper, #event-timeline-wrapper * {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#event-timeline-wrapper {
	display: block;
	width: 100%;
	max-width: 1024px;
	margin: 1.5em auto;
	position: relative;
}

#event-timeline-wrapper:before {
	background: #c1eeff;
	position: absolute;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	height: 16px;
	width: 16px;
	top: -10px;
	left: calc(50% - 8px);
	z-index: 10;
	content: "";
}

#event-timeline-wrapper:after {
	background: #c1eeff;
	position: absolute;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	height: 16px;
	width: 16px;
	bottom: 0px;
	left: calc(50% - 8px);
	z-index: 10;
	content: "";
}

.cool-event-timeline {
	padding: 10px 0;
	position: relative;
	display: inline-block;
	width: 100%;
	margin: 0;
}

.cool-event-timeline a.ect-events-read-more {
	display: inline-block;
	margin: 10px 0 5px;
	font-weight: bold;
	text-decoration: none;
	box-shadow: none;
}

/* Mid vertical line
--------------------------------------------------- */
.cool-event-timeline:before {
	content: "";
	background-color: #dbf5ff;
	position: absolute;
	height: 100%;
	width: 4px;
	left: calc(50% - 2px);
	top: 0;
}

/* Large mid year circle
------------------------------------------------------------- */
.ect-timeline-year {
	background: #a8e7ff;
	color: #00445e;
	position: relative;
	left: calc(50% - 60px);
	display: table;
	text-align: center;
	height: auto;
	min-height: 120px;
	width: 120px;
	z-index: 10;
	margin-top: 30px;
	margin-bottom: 60px;
	box-shadow: white 0px 0px 0px 4px, #dbf5ff 0px 0px 0px 8px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	vertical-align: middle;
}

.ect-timeline-year .year-placeholder {
	display: table-cell;
	width: 100%;
	height: 100%;
	vertical-align: middle;
}

.ect-timeline-year .year-placeholder span.month-year-box {
	display: inline-block;
	line-height: 28px;
	font-weight: 700;
	font-size: 22px;
	color: #00445e;
	padding: 8px;
	word-break: break-word;
	white-space: unset;
}

/* Timeline post area
----------------------------------------------- */
.ect-timeline-post {
	display: inline-block;
	margin: 0 0 60px 0;
	border: 0;
	padding: 0;
	width: 100%;
	position: relative;
	clear: both;
}

/*--- date/venue/rate area style ---*/
.ect-timeline-post .timeline-meta {
	color: #222;
	position: absolute;
	font-weight: 500;
	font-size: 15px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	padding: 15px;
	width: calc(50% - 30px);
	top: 0;
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	transition: all 1s;
}

.ect-timeline-post.even .timeline-meta {
	left: 0;
}

.ect-timeline-post.odd .timeline-meta {
	right: 0;
}

.ect-timeline-post.style-1 .timeline-meta {
	background: #dbf5ff;
}

.ect-timeline-post.style-1 .timeline-meta:before {
	content: "";
	display: block;
	border: 14px solid transparent;
	position: absolute;
	top: 16px;
}

.ect-timeline-post.even .timeline-meta:before {
	border-left-color: #dbf5ff;
	right: -27px;
}

.ect-timeline-post.odd .timeline-meta:before {
	border-right-color: #dbf5ff;
	left: -27px;
}

/*--- date area style ---*/
.ect-timeline-post .timeline-meta .ect-date-area {
	margin-bottom: 5px;
	display: inline-block;
	width: 100%;
	font-size: 30px;
}

.ect-timeline-post .ect-date-area .ev-day {
	font-size: 1em;
}

.ect-timeline-post .ect-date-area .ev-mo {
	font-size: .75em;
}

.ect-timeline-post .ect-date-area .ev-yr {
	font-size: .65em;
}

.ect-timeline-post .ect-date-area .ev-time {
	clear: both;
	font-size: .45em;
	display: inline-block;
	width: 100%;
	line-height: 90%;
	top: -5px;
	position: relative;
}

.timeline-meta span.ect-icon {
	font-size: 24px;
	display: inline-block;
	width: 34px;
	vertical-align: middle;
}

/*--- venue/address area style ---*/
.timeline-meta span.ect-venue-details {
	display: inline-block;
	width: calc(100% - 42px);
	vertical-align: top;
}

.timeline-meta span.tribe-address {
	display: inline-block;
	width: 100%;
	font-size: 90%;
}

.timeline-meta span.tribe-address span {
	display: inline;
}

.timeline-meta .ect-google {
	display: inline-block;
	width: 100%;
}

.timeline-meta span.tribe-address .tribe-delimiter {
	margin-right: 3px;
}

.timeline-meta span.tribe-address .tribe-postal-code {
	margin: 0 3px;
}

/*--- rate area style ---*/
.timeline-meta .ect-rate-area {
	display: inline-block;
	width: 100%;
}

.timeline-meta span.ect-rate-icon {
	font-size: 24px;
	display: inline-block;
	width: 34px;
}

.timeline-meta span.ect-rate {
	display: inline-block;
	width: calc(100% - 42px);
	vertical-align: middle;
	font-weight: bold;
}

/* Timeline mid small dots style
------------------------------------------------------------- */
.ect-timeline-post .timeline-dots {
	background: #a8e7ff;
	position: absolute;
	-webkit-border-radius: 40px;
	-moz-border-radius: 40px;
	border-radius: 40px;
	height: 24px;
	width: 24px;
	top: 18px;
	left: calc(50% - 12px);
	z-index: 10;
}

/* Timeline content area style
------------------------------------------------------------- */
.ect-timeline-post .timeline-content {
	background: #f4fcff;
	position: relative;
	border: 1px solid #dbf5ff;
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	transition: all 1s;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	padding: 0;
	width: calc(50% - 30px);
}

.ect-timeline-post.even .timeline-content {
	margin-left: calc(50% + 30px);
}

.ect-timeline-post.odd .timeline-content {
	margin-left: 0;
}

.ect-timeline-post .timeline-content:before {
	content: "";
	display: block;
	border: 14px solid transparent;
	position: absolute;
	top: 16px;
}

.ect-timeline-post.odd .timeline-content:before {
	border-left-color: #dbf5ff;
	right: -27px;
}

.ect-timeline-post.even .timeline-content:before {
	border-right-color: #dbf5ff;
	left: -27px;
}

.ect-timeline-post h2.content-title {
	padding: 15px 15px 10px;
	margin: 0;
	width: 100%;
	display: inline-block;
	font-size: 18px;
	font-family: inherit;
}

.ect-timeline-post h2.content-title:before {
	display: none;
}

.ect-timeline-post h2.content-title a {
	box-shadow: none;
	text-decoration: none;
	color: #00445e;
}

.ect-timeline-post .ect-event-content {
	padding: 0px 15px 15px;
	margin: 0;
	display: inline-block;
	width: 100%;
	font-size: 15px;
	line-height: normal;
}

.ect-timeline-post .ect-event-content p {
	padding: 0;
	margin: 0;
}

.ect-timeline-post a.timeline-ev-img {
	display: inline-block;
	width: 100%;
	height: auto;
	padding: 0 15px 5px;
	max-height: 225px;
	overflow: hidden;
}

.ect-timeline-post img {
	width: 100%;
	height: 225px;
	object-fit: cover;
	border-radius: 2px;
}

#event-timeline-wrapper .ect-share-wrapper {
	float: right;
	top: -44px;
	right: 12px;
}

#event-timeline-wrapper .ect-share-wrapper .ect-social-share-list {
	left: inherit;
	right: 0;
}

#event-timeline-wrapper .ect-share-wrapper .ect-social-share-list:before {
	left: inherit;
	right: 6px;
}

#event-timeline-wrapper .style-3 .ect-share-wrapper {
	float: right;
	top: -32px;
	right: 0px;
	height: 1px;
}

/* Timeline Template STYLE-2
------------------------------------------------------------- */
#event-timeline-wrapper.style-2:before, #event-timeline-wrapper.style-2:after {
	display: none;
}

div#event-timeline-wrapper.style-2 .cool-event-timeline {
	max-width: 800px;
	margin: 0 auto;
	display: block;
}

.style-2 .cool-event-timeline:before {
	left: calc(34% - 2px);
}

.style-2 .ect-timeline-year {
	left: calc(34% - 60px);
}

.style-2 .ect-timeline-post .timeline-dots {
	left: calc(34% - 12px);
}

.style-2 .ect-timeline-post .timeline-meta {
	width: calc(34% - 20px);
}

.style-2 .ect-timeline-post.even .timeline-content {
	margin-left: calc(34% + 30px);
	width: calc(66% - 30px);
}

.style-2 .ect-timeline-post a.timeline-ev-img {
	padding: 0;
}

/* Timeline Template STYLE-3
------------------------------------------------------------- */
#event-timeline-wrapper.style-3:before, #event-timeline-wrapper.style-3:after {
	left: 52px;
}

div#event-timeline-wrapper.style-3 .cool-event-timeline {
	max-width: 640px;
}

.style-3 .cool-event-timeline:before {
	left: 58px;
}

.style-3 .ect-timeline-year {
	left: 0px;
}

.style-3 .ect-timeline-post .timeline-dots {
	left: 48px;
}

.style-3 .ect-timeline-post .timeline-meta {
	width: 100%;
	position: relative;
	left: 0;
	padding: 0 15px 15px;
}

.style-3 .ect-timeline-post.even .timeline-content {
	margin-left: 88px;
	width: calc(100% - 90px);
	border: 0 !important;
}

.style-3 .ect-timeline-post a.ect-events-read-more {
	width: 100%;
	border: 1px solid #002e3f;
	padding: 4px;
	display: inline-block;
	text-align: center;
	text-decoration: none;
	box-shadow: none;
	font-size: 15px;
}

/* Mobile Friendly Styles
------------------------------------------------------------- */
@media (max-width: 700px) {
	#event-timeline-wrapper:before, #event-timeline-wrapper:after, #event-timeline-wrapper.style-3:before, #event-timeline-wrapper.style-3:after {
		left: 27px;
	}
	
	#event-timeline-wrapper .cool-event-timeline:before {
		left: 33px;
	}
	
	#event-timeline-wrapper .ect-timeline-year {
		left: 0px;
		min-height: 70px;
		width: 70px;
	}
	
	#event-timeline-wrapper .ect-timeline-year .year-placeholder span.month-year-box {
		line-height: 18px;
		font-size: 14px;
		padding: 4px;
	}
	
	#event-timeline-wrapper .ect-timeline-post .timeline-dots {
		left: 26px;
		width: 18px;
		height: 18px;
	}
	
	#event-timeline-wrapper.style-3 .ect-timeline-post .timeline-meta {
		width: 100%;
		left: 0;
		padding: 0 15px 15px;
		margin-left: 0;
	}
	
	#event-timeline-wrapper .ect-timeline-post .timeline-content, #event-timeline-wrapper .ect-timeline-post .timeline-meta {
		margin-left: 60px;
		width: calc(100% - 60px);
		position: relative;
	}
	
	#event-timeline-wrapper .ect-timeline-post.style-1 .timeline-content:before, #event-timeline-wrapper .ect-timeline-post.style-2 .timeline-content:before {
		display: none !important;
	}
	
	#event-timeline-wrapper .ect-timeline-post .timeline-meta:before, #event-timeline-wrapper .ect-timeline-post .timeline-content:before {
		left: -27px !important;
		right: initial !important;
		border-left-color: transparent !important;
	}
	
	#event-timeline-wrapper .ect-timeline-post .timeline-meta {
		-webkit-border-radius: 5px 5px 0 0;
		-moz-border-radius: 5px 5px 0 0;
		border-radius: 5px 5px 0 0;
	}
	
	#event-timeline-wrapper .ect-timeline-post .timeline-content {
		-webkit-border-radius: 0 0 5px 5px;
		-moz-border-radius: 0 0 5px 5px;
		border-radius: 0 0 5px 5px;
	}
	
	.ect-timeline-post a.timeline-ev-img {
		max-height: 150px;
	}
}