.mat-card-avatar.f-avatar-image.f-small-size {
	width: 36px;
	height: 36px;
	line-height: 36px;
	font-size: 14px;
	text-align: center;
	font-weight: 800;
	font-family: "Montserrat", sans-serif;
	color: #fff;
	text-transform: uppercase;
	background-color: #26c1c9;
	border-radius: 50%;
	flex-shrink: 0;
	object-fit: cover;
	margin-right: 16px;
}

.f-timeline-record {
	background-color: #fff;
	box-shadow: 0 2px 8px 0 rgb(0 0 0 / 12%);
	color: rgba(0, 0, 0, .5);
	margin: 24px 0 24px 104px;
	min-width: 170px;
	padding: 16px;
	position: relative;
	font-family: Source Sans Pro, sans-serif;
	font-size: 14px;
	color: rgba(0, 0, 0, .5);
}

.f-timeline-record a {
	color: #0093ee;
}

.f-timeline-record:before {
	background-color: #b5b5b5;
	bottom: calc(50% + 32px);
	content: "";
	left: -54px;
	position: absolute;
	top: -16px;
	width: 2px;
}

.f-timeline-record:after {
	background-color: #b5b5b5;
	bottom: -16px;
	content: "";
	left: -54px;
	position: absolute;
	top: calc(50% + 32px);
	width: 2px;
}

.f-timeline-first-item:before {
	background-image: linear-gradient(0deg, #b5b5b5, hsla(0, 0%, 71%, 0));
	background-color: transparent !important;
	bottom: calc(50% + 32px);
	content: "";
	left: -54px;
	position: absolute;
	top: -16px;
	width: 2px;
}

.f-timeline-last-item:after {
	background-image: linear-gradient(180deg, #b5b5b5, hsla(0, 0%, 71%, 0));
	background-color: transparent;
	bottom: -16px;
	content: "";
	left: -54px;
	position: absolute;
	top: calc(50% + 32px);
	width: 2px;
}

.f-task-type {
	background-color: #26c1c9;
	border-radius: 50%;
	color: #fff;
	height: 32px;
	left: -69px;
	overflow: hidden;
	position: absolute;
	top: calc(50% - 16px);
	user-select: none;
	width: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.f-timeline-data {
	color: rgba(0, 0, 0, .5);
	margin: 16px 0 16px 104px;
	min-width: 170px;
	padding: 0 16px;
	position: relative;
	text-align: center;
	font-family: Source Sans Pro, sans-serif !important;
	font-size: 14px;
}

.f-timeline-data:before {
	background-color: #b5b5b5;
	bottom: 0px;
	content: "";
	left: -54px;
	position: absolute;
	top: 0px;
	width: 2px;
}

.f-section-title {
	color: #000;
	display: inline-block;
	font-family: Source Sans Pro, sans-serif !important;
	font-size: 16px;
	font-stretch: normal;
	font-style: normal;
	font-weight: 700;
	letter-spacing: .57px;
	line-height: normal;
	margin: 32px 0 24px 4px;
	min-width: 104px;
	text-align: center;
}

.f-task-type .svg-icon {
	width: 21px;
	height: 21px;
}

.f-task-type .svg-icon svg {
	fill: #fff;
}

.f-timeline-record .f-flex-row {
	margin-top: 0;
	line-height: 22px;
	flex-flow: row wrap;
}

.f-timeline-record .f-flex-row .f-small-icon {
	border-radius: 100%;
	margin-right: 16px;
}

.f-timeline-record .f-date-text {
	color: #d8d8d8;
}

.f-right-seaction .svg-icon {
	width: 24px;
	height: 24px;
}

.f-right-seaction .svg-icon svg {
	fill: #757575;
}

.f-right-seaction .f-dropdown-more {
	width: 24px;
	height: 24px;
	display: block;
	float: right;
	cursor: pointer;
	margin-right: -8px;
}

.f-timeline-container .f-section-title:first-child {
	margin-top: 12px
}

.f-small-icon img {
	width: 36px;
	height: 36px;
	border-radius: 100%;
}
body .f-timeline-container .f-dropdown-more .svg-icon{background:none !important; margin:0 !important}
body .f-timeline-container .f-dropdown-more .svg-icon svg{background: transparent !important;}

.f-timeline-discription {width: 100%;padding-top: 8px;margin-top: 8px;border-top: 1px solid rgba(0,0,0,.12);}




.f-timeline-payment .flex-2 p {
	font-family: 'Source Sans Pro', sans-serif!important;
    font-weight: 700;
    font-size: 14px;
    line-height: 23px;
    text-transform: uppercase;
	margin: 0;
}
.f-timeline-payment .flex-2 div {
	font-family: 'Source Sans Pro', sans-serif!important;
	color: #757575;
}
.f-timeline-payment .f-date-text {
	color: #757575;
	font-weight: 600;
}



.f-timeline-initiated-ststus .f-timeline-payment .flex-2 p {
	color: #ffc600;
}
.f-timeline-initiated-ststus .f-task-type {
	background-color: #ffc600;
}

.f-timeline-guaranteed-ststus .f-timeline-payment .flex-2 p {
	color: #f68b3e;
}
.f-timeline-guaranteed-ststus .f-task-type {
	background-color: #f68b3e;
}


.f-timeline-disable .f-task-type {
	background-color: #e1e1e1;
}
.f-timeline-disable .f-timeline-payment {
	opacity: .4;
}

.f-timeline-payment .f-date-text {
	font-weight: 700;
	color: #757575 !important;
}
