#timeline-container {
	position: relative;
}
.timeline {
    background: #424242;
    color: #bcbcbc;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}

.timeline-inner {
    border: 1px solid #000;
    position: relative;
}

.timeline-controls{
    height: 29px;
    padding: 4px 13px;
}

.timeline-sectionInfo {
    display: inline-block;
    height: 100%;
    float: left;
    border-right: 1px solid #232323;
    text-align: center;
    padding: 0;
}

.timeline-zoomLabel {
    padding: 0 5px;
	transform: translateY(5px);
}

.timeline-zoomRange {
	-webkit-appearance: none;
	width: 85%;
	margin: 0;
	padding: 0;
	z-index: 10;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition:    all 0.2s ease-in-out;
	-o-transition:      all 0.2s ease-in-out;
	-ms-transition:     all 0.2s ease-in-out;
	left: 0;
	background-color: transparent;
	height: 24px;
}

.timeline-canvas {
    height: 100%;
}

.timeline-section {
	border-bottom: 1px solid #232323;
}

.timeline-section:last-child {
	border-bottom: 0;
}

.timeline-section--chapter {
	border: 0;
}

.timeline-waveform-container .timeline-section{
	border-bottom: 1px solid #232323;
}

.timeline-canvas--sprite-layer{
    position: absolute;
    right:0;
}

.timeline-sectionInfo .timeCode,
.timeline-sectionInfo .elapsed,
.timeline-sectionInfo .elapsed:hover,
.timeline-sectionInfo .timeCode:hover {
    color: #fcc015;
}

.timeline-sectionInfo .iwTimecode_editor{
	margin: -5px;
	font-size: 17px;
	color: #fcc015;
	width: 145px;
}
.timeline-sectionInfo--label {
	display: flex;
	align-items: center;
}


.timeline-section--label {
	text-align: center;
	width: 100%;
}

.timeline-dragging-page {
	user-drag: none;
	-webkit-user-drag: none;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.timeline-zoomRange:focus {
    outline: none;
}

.timeline-zoomRange::-ms-track{
	width: 100%;
	height: 6px;
	cursor: pointer;
	animate: 0.2s;
	box-shadow: 0 0 0 #000000, 0 0 0 #0d0d0d;
	background: #232323;
	border-radius: 25px;
	border: 0 solid #000101;
}

.timeline-zoomRange::-moz-range-track {
	width: 100%;
	height: 6px;
	cursor: pointer;
	animate: 0.2s;
	box-shadow: 0 0 0 #000000, 0 0 0 #0d0d0d;
	background: #232323;
	border-radius: 25px;
	border: 0 solid #000101;
}

.timeline-zoomRange::-webkit-slider-runnable-track {
    width: 100%;
    height: 6px;
    cursor: pointer;
    animate: 0.2s;
    box-shadow: 0 0 0 #000000, 0 0 0 #0d0d0d;
    background: #232323;
    border-radius: 25px;
    border: 0 solid #000101;
}

.timeline-zoomRange::-moz-range-thumb {
    box-shadow: 0 0 0 #848c24, 0 0 0 #0d0d0d;
    border: 0 solid #000000;
    height: 14px;
    width: 14px;
    border-radius: 15px;
    background: #fcc015;
    cursor: pointer;
}

.timeline-zoomRange::-webkit-slider-thumb {
	box-shadow: 0 0 0 #848c24, 0 0 0 #0d0d0d;
	border: 0 solid #000000;
	height: 14px;
	width: 14px;
	border-radius: 15px;
	background: #fcc015;
	cursor: pointer;
    -webkit-appearance: none;
    margin-top: -3.6px;
}

.timeline-zoomRange:focus::-webkit-slider-runnable-track {
    background: #232323;
}

.timeline-zoomRange::-ms-track{
	width: 100%;
	height: 6px;
	cursor: pointer;
	animate: 0.2s;
	box-shadow: 0 0 0 #000000, 0 0 0 #0d0d0d;
	border-radius: 25px;
	background: #232323;
	border-color: transparent;
	border-width: 0;
	color: transparent;
}

.timeline-zoomRange::-ms-fill-lower {
	height: 6px;
	background-color: #232323;
}

.timeline-zoomRange::-ms-fill-upper {
	height: 6px;
	background-color: #232323;
}

.timeline-zoomRange::-ms-thumb {
	box-shadow: 0 0 0 #000000, 0 0 0 #0d0d0d;
	border: 0 solid #000000;
	height: 15px;
	width: 15px;
	border-radius: 15px;
	background: #fcc015;
	cursor: pointer;
	margin-top: -2px;
}
.iwp-progress-range-con input[type=range]

.timeline-zoomRange:focus::-ms-fill-lower {
	background-color: transparent;
}

.timeline-zoomRange:focus::-ms-fill-upper {
	background-color: transparent;
}

.timeline-zoomRange::-ms-tooltip {
	display: none;
}

.timeline-time-tip.iw-tip {
	display:none;
	position: absolute;
	top:0;
}

.timeline-time-tip.iw-tip.iw-tip-show {
	display:block;
	-webkit-transition: none;
	-webkit-transition: none;
	-moz-transition: none;
	-o-transition: none;
	transition: none;
	transform: translate3d(0, -180px, 0);
}

#timeline-time-tip-chapter-bar:after,
#timeline-time-tip-body:after{
	top:36px;
}

.timeline {
	display: none;
}

/*  portrait iPad 768px */
@media (min-width:48em) {
	.timeline {
		display: block;
		margin-bottom: .75rem;
	}
}