.operation {margin:0 0 1.2rem 0; border-radius: .25rem; border: 1px solid #ccc;padding: .25rem;}
.operation .color-primary {font-size: 0.925rem; font-weight: bolder;line-height: 2.05rem;}
.operation span.txt {color: #bbb;}
.operation a.btn {color: #fff; padding: .375rem .75rem;}
.operation button.btn {padding: .375rem .75rem;}
.operation a.btn:hover {color: #fff;}
.operation em {font-size: 11px;}
.operation .text-right-style {text-align: right;}

/*table.table th, table.table td{min-width: 80px;}*/

.form-row .star-span, .form-row .error {color: red; font-weight: 700;}

.form-group .star-span, .form-group .error {color: red; font-weight: 700;}

.collapse.show {
    display: block!important;
}

.alert {padding: .55rem 0.35rem;}

/** 流程视图 */
.progress-list {
    position: relative;
    margin-bottom: 4.5rem;
    margin-left: 0;
    padding-left: 0;
    list-style: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.progress-list > li {
    position: relative;
    width: 100%;
    text-align: center;
}

.progress-list > li::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -1px;
    width: 100%;
    height: 3px;
    background-color: rgba(61, 70, 79, 0.125);
}

.progress-list > li:last-child::before {
    display: none;
}

.progress-list > li > button {
    padding: 0;
    position: relative;
    display: inline-block;
    width: 1rem;
    height: 1rem;
    background-color: #E9EAEB;
    color: rgba(61, 70, 79, 0.125);
    border: 4px solid #ffffff;
    vertical-align: middle;
    border-radius: 1rem;
    line-height: 1;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    white-space: normal;
    z-index: 1;
}

.progress-list > li > button:focus, .progress-list > li > button:active {
    outline: 0;
    -webkit-box-shadow: 0 0 0 2px #346CB0;
    box-shadow: 0 0 0 2px #346CB0;
}

.progress-list > .error > button,
.progress-list > .success > button {
    width: 24px;
    height: 24px;
}

.progress-list .progress-indicator {
    display: none;
    width: 1rem;
    height: 1rem;
    background-size: cover;
    background-repeat: no-repeat;
}

.progress-list .progress-label {
    display: inline-block;
    position: absolute;
    top: 1.75rem;
    left: 50%;
    -webkit-transform: translate3d(-50%, 0, 0);
    transform: translate3d(-50%, 0, 0);
    font-size: 0.5rem;
    color: #686F76;
}

.progress-list > .active::before {
    background-color: #346CB0;
}

.progress-list > .active > button {
    color: #346CB0;
    background-color: #346CB0;
    border-color: #346CB0;
}

.progress-list > .active > button:focus, .progress-list > .active > button:active {
    -webkit-box-shadow: 0 0 0 2px #346CB0;
    box-shadow: 0 0 0 2px #346CB0;
}

.progress-list > .active .progress-indicator {
    color: #346CB0;
}

.progress-list > .active::before {
    background-color: rgba(61, 70, 79, 0.125);
}

.progress-list > .active > button {
    background-color: #ffffff;
}

.progress-list > .active .progress-label {
    color: #28313B;
}

.progress-list > .success::before {
    background-color: #346CB0;
}

.progress-list > .success > button {
    color: #346CB0;
    background-color: #ffffff;
    border-color: #ffffff;
}

.progress-list > .success > button:focus, .progress-list > .success > button:active {
    -webkit-box-shadow: 0 0 0 2px #346CB0;
    box-shadow: 0 0 0 2px #346CB0;
}

.progress-list > .success .progress-indicator {
    color: #346CB0;
}

.progress-list > .success .progress-label {
    color: #28313B;
}

.progress-list > .error::before {
    background-color: #EA6759;
}

.progress-list > .error > button {
    color: #EA6759;
    background-color: #ffffff;
    border-color: #ffffff;
}

.progress-list > .error > button:focus, .progress-list > .error > button:active {
    -webkit-box-shadow: 0 0 0 2px #EA6759;
    box-shadow: 0 0 0 2px #EA6759;
}

.progress-list > .error .progress-indicator {
    color: #EA6759;
}

.progress-list > .error::before {
    background-color: rgba(61, 70, 79, 0.125);
}

.progress-list > .active .progress-indicator,
.progress-list > .success .progress-indicator,
.progress-list > .error .progress-indicator {
    display: inline-block;
}

.progress-list > .success .progress-indicator {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%2300A28A' viewBox='0 0 24 24'%3e%3cpath d='M12 .9C5.9.9.9 5.9.9 12s5 11.1 11.1 11.1 11.1-5 11.1-11.1S18.1.9 12 .9zm6.2 8.3l-7.1 7.2c-.3.3-.7.3-1 0l-3.9-3.9c-.2-.3-.2-.8 0-1.1l1-1c.3-.2.8-.2 1.1 0l2 2.1c.2.2.5.2.7 0l5.2-5.3c.2-.3.7-.3 1 0l1 1c.3.2.3.7 0 1z'%3e%3c/path%3e%3c/svg%3e");
}

.progress-list > .error .progress-indicator {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23EA6759' viewBox='0 0 24 24'%3e%3cpath xmlns='http://www.w3.org/2000/svg' d='M12 .9C5.9.9.9 5.9.9 12s5 11.1 11.1 11.1 11.1-5 11.1-11.1S18.1.9 12 .9zm2.3 11.5l3.6 3.6c.1.2.1.4 0 .6l-1.3 1.3c-.2.2-.5.2-.7 0l-3.6-3.6c-.2-.2-.4-.2-.6 0l-3.6 3.6c-.2.2-.5.2-.7 0l-1.3-1.3c-.1-.2-.1-.4 0-.6l3.6-3.6c.2-.2.2-.5 0-.7L6.1 8.1c-.2-.2-.2-.5 0-.7l1.3-1.3c.2-.1.4-.1.6 0l3.7 3.7c.2.2.4.2.6 0l3.6-3.6c.2-.2.5-.2.7 0l1.3 1.3c.1.2.1.4 0 .6l-3.6 3.6c-.2.2-.2.5 0 .7z'%3e%3c/path%3e%3c/svg%3e");
}

.nav-down-line .nav-item .active{
    border: none;
    border-bottom: 3px solid #41D492;
}

.nav-down-line .nav-item .nav-link:hover {
    border: none;
    border-bottom: 3px solid #41D492;
}

.nav-down-line .nav-item .nav-link:focus {
    border: none;
    border-bottom: 3px solid #41D492;
}

.nav-down-line .nav-item .active h3 {
    font-weight: 700;
}


/** 横向动态流程视图 */
.progress-controls {
    position: relative;
}

.progress_inner #step-5:checked + div + div + div + div > .box_base,
.progress_inner #step-4:checked + input + div + div + div + div > .box_base,
.progress_inner #step-2:checked + input + input + input + div + div + div + div > .box_base,
.progress_inner #step-3:checked + input + input + div + div + div + div > .box_base,
.progress_inner #step-1:checked + input + input + input + input + div + div + div + div > .box_base {
    top: 50%;
    left: 0px;
    opacity: 1;
}
.progress_inner #step-5:checked + div + div + div + div > .box_item,
.progress_inner #step-4:checked + input + div + div + div + div > .box_item,
.progress_inner #step-2:checked + input + input + input + div + div + div + div > .box_item,
.progress_inner #step-3:checked + input + input + div + div + div + div > .box_item,
.progress_inner #step-1:checked + input + input + input + input + div + div + div + div > .box_item {
    top: -30px;
    left: 0px;
    opacity: 0;
}

.progress_inner #step-5:checked + div + div + div + div > .box_lid,
.progress_inner #step-4:checked + input + div + div + div + div > .box_lid,
.progress_inner #step-2:checked + input + input + input + div + div + div + div > .box_lid {
    top: -20px;
    left: 0px;
    opacity: 0;
}
.progress_inner #step-5:checked + div + div + div + div > .box_item,
.progress_inner #step-4:checked + input + div + div + div + div > .box_item,
.progress_inner #step-2:checked + input + input + input + div + div + div + div > .box_item {
    top: -10px;
    left: 0px;
    opacity: 1;
}

.progress_inner #step-5:checked + div + div + div + div > .box_item,
.progress_inner #step-4:checked + input + div + div + div + div > .box_item,
.progress_inner #step-3:checked + input + input + div + div + div + div > .box_item {
    top: 10px;
    left: 0px;
    opacity: 1;
}
.progress_inner #step-5:checked + div + div + div + div > .box_lid,
.progress_inner #step-4:checked + input + div + div + div + div > .box_lid,
.progress_inner #step-3:checked + input + input + div + div + div + div > .box_lid {
    top: -1px;
    left: 0px;
    opacity: 1;
}
.progress_inner #step-5:checked + div + div + div + div > .box_ribbon,
.progress_inner #step-4:checked + input + div + div + div + div > .box_ribbon,
.progress_inner #step-3:checked + input + input + div + div + div + div > .box_ribbon {
    top: 70%;
    left: 0px;
    opacity: 0;
}
.progress_inner #step-5:checked + div + div + div + div > .box_bow,
.progress_inner #step-4:checked + input + div + div + div + div > .box_bow,
.progress_inner #step-3:checked + input + input + div + div + div + div > .box_bow {
    top: 0px;
    left: 0px;
    opacity: 0;
}

.progress_inner #step-5:checked + div + div + div + div > .box_ribbon,
.progress_inner #step-4:checked + input + div + div + div + div > .box_ribbon {
    top: 50%;
    left: 0px;
    opacity: 1;
}
.progress_inner #step-5:checked + div + div + div + div > .box_bow,
.progress_inner #step-4:checked + input + div + div + div + div > .box_bow {
    top: -10px;
    left: 0px;
    opacity: 1;
}

.progress_inner #step-5:checked + div + div + div + div > .box_tag {
    top: 10px;
    left: 20px;
    opacity: 1;
}
.progress_inner #step-5:checked + div + div + div + div > .box_string {
    top: 10px;
    left: 20px;
    opacity: 1;
}

.progress_inner {
    margin-top: 80px;
}

.progress_inner__step:before,
.progress_inner__status .box_base,
.progress_inner__status .box_item,
.progress_inner__status .box_ribbon,
.progress_inner__status .box_bow,
.progress_inner__status .box_bow__left,
.progress_inner__status .box_bow__right,
.progress_inner__status .box_tag,
.progress_inner__status .box_string {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    margin: auto;
}

.progress_inner__bar, .progress_inner__bar--set {
    height: 6px;
    left: 10%;
    background: -webkit-repeating-linear-gradient(45deg, #1ea4ec, #1ea4ec 4px, #1f8bc5 4px, #1f8bc5 10px);
    background: repeating-linear-gradient(45deg, #1ea4ec, #1ea4ec 4px, #1f8bc5 4px, #1f8bc5 10px);
    -webkit-transition: width 800ms cubic-bezier(0.915, 0.015, 0.3, 1.005);
    transition: width 800ms cubic-bezier(0.915, 0.015, 0.3, 1.005);
    border-radius: 6px;
    width: 0;
    position: relative;
    z-index: -1;
}

.progress_inner__step:before {
    width: 30px;
    height: 30px;
    color: #70afd0;
    background: white;
    line-height: 30px;
    border: 3px solid #a6cde2;
    font-size: 12px;
    top: 3px;
    border-radius: 100%;
    -webkit-transition: all .4s;
    transition: all .4s;
    cursor: pointer;
    pointer-events: none;
}

.progress_inner__step {
    font-size: 14px;
    padding: 0 10px;
    -webkit-transition: all .4s;
    transition: all .4s;
    float: left;
    text-align: center;
    position: relative;
}
.progress_inner__step label {
    padding-top: 50px;
    top: -20px;
    display: block;
    position: relative;
    cursor: pointer;
}
.progress_inner__step:hover {
    color: white;
}
.progress_inner__step:hover:before {
    color: white;
    background: #1ea4ec;
}

.progress_inner {
    height: 500px;
}
.progress_inner #step-5:checked + div {
    width: 80%;
}
.progress_inner #step-5:checked + div + div + div > .tab:nth-of-type(5) {
    opacity: 1;
    top: 0;
}
.progress_inner #step-5:checked + div + div + div + div {
    right: 10%;
}
.progress_inner #step-4:checked + input + div {
    width: 60%;
}
.progress_inner #step-4:checked + input + div + div + div > .tab:nth-of-type(4) {
    opacity: 1;
    top: 0;
}
.progress_inner #step-4:checked + input + div + div + div + div {
    right: 30%;
}
.progress_inner #step-3:checked + input + input + div {
    width: 40%;
}
.progress_inner #step-3:checked + input + input + div + div + div > .tab:nth-of-type(3) {
    opacity: 1;
    top: 0;
}
.progress_inner #step-3:checked + input + input + div + div + div + div {
    right: 50%;
}
.progress_inner #step-2:checked + input + input + input + div {
    width: 20%;
}
.progress_inner #step-2:checked + input + input + input + div + div + div > .tab:nth-of-type(2) {
    opacity: 1;
    top: 0;
}
.progress_inner #step-2:checked + input + input + input + div + div + div + div {
    right: 70%;
}
.progress_inner #step-1:checked + input + input + input + input + div {
    width: 0%;
}
.progress_inner #step-1:checked + input + input + input + input + div + div + div > .tab:nth-of-type(1) {
    opacity: 1;
    top: 0;
}
.progress_inner #step-1:checked + input + input + input + input + div + div + div + div {
    right: 90%;
}
.progress_inner__step:nth-of-type(1):before {
    content: "1";
}
.progress_inner__step:nth-of-type(2):before {
    content: "2";
}
.progress_inner__step:nth-of-type(3):before {
    content: "3";
}
.progress_inner__step:nth-of-type(4):before {
    content: "4";
}
.progress_inner__step:nth-of-type(5):before {
    content: "5";
}
.progress_inner__step:nth-of-type(6):before {
    content: "5";
}
.progress_inner__step:nth-of-type(7):before {
    content: "5";
}
.progress_inner__step:nth-of-type(8):before {
    content: "5";
}
.progress_inner__bar--set {
    width: 80%;
    top: -6px;
    background: #70afd0;
    position: relative;
    z-index: -2;
}
.progress_inner__tabs .tab {
    opacity: 0;
    position: absolute;
    top: 40px;
    text-align: center;
    margin-top: 80px;
    box-shadow: 0px 2px 1px #80b7d5;
    padding: 30px;
    background: white;
    border-radius: 10px;
    -webkit-transition: all .2s;
    transition: all .2s;
}
.progress_inner__tabs .tab h1 {
    margin: 0;
}
.progress_inner__tabs .tab p {
    font-weight: 400;
    opacity: 0.8;
}
.progress_inner__status {
    width: 40px;
    height: 40px;
    top: -80px;
    -webkit-transition: right 800ms cubic-bezier(0.915, 0.015, 0.3, 1.005);
    transition: right 800ms cubic-bezier(0.915, 0.015, 0.3, 1.005);
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
    position: absolute;
}
.progress_inner__status div {
    opacity: 0;
    -webkit-transition: all 600ms cubic-bezier(0.915, 0.015, 0.3, 1.005);
    transition: all 600ms cubic-bezier(0.915, 0.015, 0.3, 1.005);
    -webkit-transition-delay: 300ms;
    transition-delay: 300ms;
}
.progress_inner__status div {
    position: absolute;
}
.progress_inner__status .box_base {
    background: -webkit-repeating-linear-gradient(45deg, #986c5d, #986c5d 2px, #775144 2px, #775144 4px);
    background: repeating-linear-gradient(45deg, #986c5d, #986c5d 2px, #775144 2px, #775144 4px);
    width: 36px;
    height: 40px;
    z-index: 1;
    border-radius: 1px;
}
.progress_inner__status .box_lid {
    width: 40px;
    height: 13.33333px;
    background: #775144;
    z-index: 2;
    border-radius: 1px;
    top: 0;
}
.progress_inner__status .box_item {
    width: 20px;
    height: 20px;
    background: #be69d2;
    z-index: 0;
    border-radius: 4px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
.progress_inner__status .box_ribbon {
    width: 10px;
    height: 42px;
    background: #ee0f29;
    z-index: 4;
    border-radius: 1px;
}
.progress_inner__status .box_bow__left, .progress_inner__status .box_bow__right {
    width: 6px;
    height: 10px;
    background: #be0c21;
    position: absolute;
    z-index: 3;
    opacity: 1;
    border-radius: 1px;
}
.progress_inner__status .box_bow {
    top: -6px;
    z-index: 1;
    -webkit-transition-delay: 500ms;
    transition-delay: 500ms;
}
.progress_inner__status .box_bow__left {
    left: 6px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
.progress_inner__status .box_bow__right {
    left: -4px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.progress_inner__status .box_tag {
    width: 20px;
    height: 10px;
    background: #487ac7;
    z-index: 4;
    -webkit-transform: rotate(-10deg) translateX(-40px) translateY(0px);
    transform: rotate(-10deg) translateX(-40px) translateY(0px);
    border-radius: 2px;
    -webkit-transition-delay: 500ms;
    transition-delay: 500ms;
}
.progress_inner__status .box_string {
    width: 17px;
    height: 2px;
    background: #343434;
    z-index: 4;
    -webkit-transform: rotate(-39deg) translateX(-22px) translateY(-12px);
    transform: rotate(-39deg) translateX(-22px) translateY(-12px);
}
.progress_inner input[type="radio"] {
    display: none;
}

/** 垂直动态时间轴流程视图 */
.timeline {
    list-style: none;
    position: relative;
    max-width: 1200px;
    padding: 20px;
    margin: 0 auto;
    overflow: hidden; }
.timeline:after {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -2px;
    background-color: rgba(0, 0, 0, 0.2);
    height: 100%;
    width: 4px;
    border-radius: 2px;
    display: block; }
.timeline .timeline-row {
    padding-left: 50%;
    position: relative;
    z-index: 10; }
.timeline .timeline-row .timeline-time {
    position: absolute;
    right: 50%;
    top: 31px;
    text-align: right;
    margin-right: 40px;
    font-size: 16px;
    font-weight: 600; }
.timeline .timeline-row .timeline-time small {
    display: block;
    color: white;
    text-transform: uppercase;
    opacity: 0.75;
    font-size: 11px;
    font-weight: 400; }
.timeline .timeline-row .timeline-icon {
    position: absolute;
    top: 30px;
    left: 50%;
    margin-left: -20px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: white;
    text-align: center;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    padding: 3px;
    color: white;
    font-size: 14px;
    z-index: 100; }
.timeline .timeline-row .timeline-icon > div {
    border-radius: 50%;
    line-height: 34px;
    font-size: 16px; }
.timeline .timeline-row .timeline-content {
    margin-left: 40px;
    position: relative;
    border: 1px solid #203A45;
    border-radius: 5px;
    color: #333333; }

.timeline .timeline-row .hand-down {
    background-color: #fff;
    position: absolute;
    left: -15px;
    top: -25px;
    font-size: 24px;
    color: red;
    font-weight: bold;
    border-radius: 50%;
    animation: headDownAnimation 2s infinite;
    -webkit-animation: headDownAnimation 2s infinite;
    -moz-animation: headDownAnimation 2s infinite;
}

@keyframes headDownAnimation {
    0% {top: -25px;}
    50% {top: -10px;}
    100% {top: -25px;}
}
@-webkit-keyframes headDownAnimation {
    0% {top: -25px;}
    50% {top: -10px;}
    100% {top: -25px;}
}
@-moz-keyframes headDownAnimation {
    0% {top: -25px;}
    50% {top: -10px;}
    100% {top: -25px;}
}

.timeline .timeline-row .timeline-content.active {
    border: 1px solid #fe0a02;
    animation: notificationpulse 2s infinite;
    -webkit-animation: notificationpulse 2s infinite;
    -moz-animation: notificationpulse 2s infinite;
}

@keyframes notificationpulse {
    0% {box-shadow: 0 0 0 4px #fc6863;}
    25% {box-shadow: 0 0 0 2px #fc6863;}
    50% {box-shadow: 0 0 0 0px #fc6863;}
    75% {box-shadow: 0 0 0 2px #fc6863;}
    100% {box-shadow: 0 0 0 4px #fc6863;}
}
@-webkit-keyframes notificationpulse {
    0% {box-shadow: 0 0 0 4px #fc6863;}
    25% {box-shadow: 0 0 0 2px #fc6863;}
    50% {box-shadow: 0 0 0 0px #fc6863;}
    75% {box-shadow: 0 0 0 2px #fc6863;}
    100% {box-shadow: 0 0 0 4px #fc6863;}
}
@-moz-keyframes notificationpulse {
    0% {box-shadow: 0 0 0 4px #fc6863;}
    25% {box-shadow: 0 0 0 2px #fc6863;}
    50% {box-shadow: 0 0 0 0px #fc6863;}
    75% {box-shadow: 0 0 0 2px #fc6863;}
    100% {box-shadow: 0 0 0 4px #fc6863;}
}

.timeline .timeline-row .timeline-content:after {
    content: "";
    position: absolute;
    top: 48px;
    left: -41px;
    height: 4px;
    width: 40px;
    background-color: rgba(0, 0, 0, 0.2);
    z-index: -1; }
.timeline .timeline-row .timeline-content .panel-body {
    padding: 30px 15px 2px;
    position: relative;
    z-index: 10; }
.timeline .timeline-row .timeline-content h2 {
    font-size: 22px;
    margin-bottom: 12px;
    margin-top: 0;
    line-height: 1.2; }
.timeline .timeline-row .timeline-content p {
    margin-bottom: 15px; }
.timeline .timeline-row .timeline-content img {
    margin-bottom: 15px; }
.timeline .timeline-row .timeline-content blockquote {
    border-color: #eeeeee; }
.timeline .timeline-row .timeline-content blockquote footer,
.timeline .timeline-row .timeline-content blockquote small,
.timeline .timeline-row .timeline-content blockquote .small,
.timeline .timeline-row .timeline-content blockquote.blockquote-reverse footer,
.timeline .timeline-row .timeline-content blockquote.blockquote-reverse small,
.timeline .timeline-row .timeline-content blockquote.blockquote-reverse .small {
    color: #999999; }
.timeline .timeline-row .timeline-content .video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    margin-bottom: 15px;
    overflow: hidden; }
.timeline .timeline-row .timeline-content .video-container iframe,
.timeline .timeline-row .timeline-content .video-container object,
.timeline .timeline-row .timeline-content .video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }
.timeline .timeline-row:nth-child(odd) {
    padding-left: 0;
    padding-right: 50%; }
.timeline .timeline-row:nth-child(odd) .timeline-time {
    right: auto;
    left: 50%;
    text-align: left;
    margin-right: 0;
    margin-left: 40px; }
.timeline .timeline-row:nth-child(odd) .timeline-content {
    margin-right: 40px;
    margin-left: 0; }
.timeline .timeline-row:nth-child(odd) .timeline-content:after {
    left: auto;
    right: -41px; }
.timeline.animated .timeline-row .timeline-content {
    opacity: 0;
    left: 20px;
    -webkit-transition: all 0.8s;
    -moz-transition: all 0.8s;
    transition: all 0.8s; }
.timeline.animated .timeline-row:nth-child(odd) .timeline-content {
    left: -20px; }
.timeline.animated .timeline-row.active .timeline-content {
    opacity: 1;
    left: 0; }
.timeline.animated .timeline-row.active:nth-child(odd) .timeline-content {
    left: 0; }

@media (max-width: 1200px) {
    .timeline {
        padding: 15px 10px; }
    .timeline:after {
        left: 28px; }
    .timeline .timeline-row {
        padding-left: 0;
        margin-bottom: 16px; }
    .timeline .timeline-row .timeline-time {
        position: relative;
        right: auto;
        top: 0;
        text-align: left;
        margin: 0 0 6px 56px; }
    .timeline .timeline-row .timeline-time strong {
        display: inline-block;
        margin-right: 10px; }
    .timeline .timeline-row .timeline-icon {
        top: 45px;
        left: -2px;
        margin-left: 0; }
    .timeline .timeline-row .timeline-content {
        margin-left: 56px;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
        position: relative; }
    .timeline .timeline-row .timeline-content:after {
        right: auto !important;
        left: -40px !important;
        top: 32px; }
    .timeline .timeline-row:nth-child(odd) {
        padding-right: 0; }
    .timeline .timeline-row:nth-child(odd) .timeline-time {
        position: relative;
        right: auto;
        left: auto;
        top: 0;
        text-align: left;
        margin: 0 0 6px 56px; }
    .timeline .timeline-row:nth-child(odd) .timeline-content {
        margin-right: 0;
        margin-left: 55px; }
    .timeline.animated .timeline-row:nth-child(odd) .timeline-content {
        left: 20px; }
    .timeline.animated .timeline-row.active:nth-child(odd) .timeline-content {
        left: 0; } }




.steps {
    display: flex;
    margin: 1.25rem 0;
    font-weight: normal;
}

.steps ul {
    display: flex;
    margin: 0 auto;
    padding-left: 0;
    list-style: none;
    background-color: #e6e8ed;
    align-items: flex-start;
    flex-wrap: nowrap;
    border-radius: 999px;
}

.steps li {
    position: relative;
    overflow: hidden;
    max-width: 100%;
}

.steps li:first-child:before {
    display: none;
}

.steps li:first-child a {
    border-top-left-radius: 999px;
    border-bottom-left-radius: 999px;
}

.steps li:last-child a {
    border-top-right-radius: 999px;
    border-bottom-right-radius: 999px;
}

.steps li:before {
    content: '';
    position: absolute;
    top: 2px;
    left: -0.875rem;
    z-index: 1;
    display: block;
    height: 1.75rem;
    width: 1.75rem;
    border: 2px solid #ffffff;
    border-top-right-radius: .5rem;
    background-color: #e6e8ed;
    transform: rotate(45deg);
}

.steps li:hover + li:before {
    background-color: #dde0e7;
}

.steps li:hover a {
    background-color: #dde0e7;
    text-decoration: none;
}

.steps a {
    display: block;
    padding: 5px 0.875rem 6px 1.75rem;
    text-align: center;
    color: #363642;
    line-height: 1.25rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.steps a:focus {
    text-decoration: none;
}

.steps a:hover {
    text-decoration: none;
}

.steps a > span:last-child {
    margin-left: 5px;
}

.step-indicator {
    display: inline-block;
    width: 1.25rem;
    height: 1.25rem;
    font-size: 1rem;
    color: #ffffff;
    text-align: center;
    background-color: #a6abbd;
    line-height: 1.25rem;
    border-radius: 1.25rem;
}

.step-indicator-icon {
    background-color: transparent;
    color: #888c9b;
}

.step-indicator-icon > .fa {
    margin-top: 2px;
}

.steps .active + li:before {
    background-color: #346CB0;
}

.steps .active a {
    background-color: #346CB0;
    color: #fff;
}

.steps .active .step-indicator {
    color: #fff;
}

.steps .active:hover + li:before {
    background-color: #3165a4;
}

.steps .active:hover a {
    background-color: #3165a4;
    color: #fff;
}

.steps .success + li:before {
    background-color: #00A28A;
}

.steps .success a {
    background-color: #00A28A;
    color: #fff;
}

.steps .success .step-indicator {
    color: #fff;
}

.steps .success:hover + li:before {
    background-color: #00937d;
}

.steps .success:hover a {
    background-color: #00937d;
    color: #fff;
}

.steps .error + li:before {
    background-color: #EA6759;
}

.steps .error a {
    background-color: #EA6759;
    color: #fff;
}

.steps .error .step-indicator {
    color: #fff;
}

.steps .error:hover + li:before {
    background-color: #e85b4b;
}

.steps .error:hover a {
    background-color: #e85b4b;
    color: #fff;
}

.steps-float {
    margin: 0;
    transform: translate3d(0, -50%, 0);
}