/*
 * @package   MLRTimeline
 * @version   1.4
 * @since     1.3
 * @author    Matthew Lillistone <matthewlillistone.co.uk>
 * 
 */

.timeline-container {max-width:900px; height:auto; margin:0 auto; overflow:hidden;}

.timelinediv {display:block; float:none; min-height:220px;}
.times {padding-left: 0; position:relative;}
.times > li {position:absolute; top:0px; left:0px;}

ul.times {padding:0 !important; margin:0 0 1.5em !important;}
ul.times li {opacity:0; margin:0 !important; width:auto; height:100%; list-style:none;}

ul.times li p.li_body {height:auto;}
.timeline-caption {display:block; margin:0; padding:5px; margin:0; margin-bottom: 15px;}
#timeline-title {font-size:1.2em; padding-left:15px; padding-top: 15px;}
#times {padding: 0px !important;}
.date-node {display:block;}

@media screen and (min-width:560px) and (max-width:9999px) {
.date-node img {max-width: 300px !important; float: left; margin-right: 15px; border-radius:3px;}
}
@media screen and (min-width:0px) and (max-width:560px) {	
.date-node img {max-width: 100%; float: left; margin:0 0 1.2em; border-radius:3px;}
}
div#timeline {height: auto; margin: 10px 0 8px; padding: 10px 10px 15px; white-space: nowrap; overflow:hidden;}

li.post-marker {background:transparent !important;}
li.post-marker p {cursor: default; background: rgba(0, 0, 0, 0) !important; padding:0; padding-left:2px !important;}
.marker {cursor: pointer;}
#time-years {float: left;}

.month-time-increment {padding-left: 0; float:none;}
#timeline ul.time-increment p {display: inline-block; margin-right: 10px; float:none;}
/* #timeline ul.time-increment ul.month-time-increment > p {margin-left: 2px; display: inline-block; padding: 0 10px; float:none;}
*/
div#but-container {margin-bottom:20px; position:relative; clear:both;}
div#but-container:after, #dates_left:after, div#bright:after, div#bleft:after {
	content: ".";
	display:block;
	clear:both;
	visibility:hidden;
	line-height:0;
	height:0;
	}
div#bleft {font-size: 1em; left:15px; position:absolute; z-index:15;}
div#bright {font-size: 1em; right:15px; position:absolute; z-index:15;}
#button-left, #button-right {font-size: 1.5em; opacity:0.7;}
#button-right-end {font-size: 1.5em; margin-left: 10px; opacity:0.7;}
#button-left-end {font-size: 1.5em; margin-right: 10px; opacity:0.7;}
#button-left:hover, #button-right:hover, #button-left-end:hover, #button-right-end:hover {opacity:0.95;}
#button-left {}

.year-increment {float: left;}
p.pyear {font-size: 3em; padding: 0 30px 0 0; border-radius:3px; line-height:1.6em; margin:0 !important;}
.month-increment {float: left;}
p.pmonth {font-size: 2em; padding:0; line-height: 2.5em; border-radius:3px; margin:0 !important; margin-left: 10px !important;}
p.pday {font-size:2em; float:left; margin:0; margin-right:10px; line-height: 1.5em;}
p.phour {margin: 0 !important; line-height: 3em;}

ul#day_list {padding-left:0; margin:0 !important; border-bottom:1px dashed #ddd; line-height:1em;}
ul#day_list .post-marker {display:inline-block; border-left:1px dashed #ddd; margin:0rem !important; margin:0 !important; padding:0 !important;}

#dates_left {position: relative; z-index: 10;}

.li_meta .fa.fa-user {padding-left: 10px;}
.li_meta .fa-folder-open{padding-left:10px;}

.time-increments {
	width: auto;
	height: 100%;
	float:left;
	position:relative;
	margin-bottom: 20px;
}