/* our process */
.main-timeline-box{
    position: relative;
}
.main-timeline-box:after {
    content: '';
    background-color: #efefef;
    height: 108%;
    width: 16px;
    transform: translateX(-50%);
    position: absolute;
    left: 50%;
    top: 0px;
}
.main-timeline-box .timeline-icon {
    margin: auto;
    width: 90px;
    height: 90px;
    background-color: #fff;
    border: solid #efefef;
    border-width: 15px;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin-bottom: 30px;
}
.main-timeline-box .timeline-icon:after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    width: 15px;
    height: 30px;
    background-color: #efefef;
    bottom: -30px;
}
.main-timeline-box .timeline-icon i {
    font-size: 23px;
}
.top-white-bg-timeline:after {
    top: 70px;
}
.grey-bg-timeline, .grey-bg-timeline h2:after,
.grey-bg-timeline .timeline-icon,
.grey-bg-timeline .timeline-circle{
    background-color: #f9f9f9 !important;
}
.yellow-bg-timeline, .yellow-bg-timeline h2:after{
    background-color: #efc337 !important;
}
.dark-bg-timeline, .dark-bg-timeline h2:after,
.dark-bg-timeline .timeline-icon,
.dark-bg-timeline .timeline-circle{
    background-color: #2b2b2b !important;
}
.yellow-bg-timeline .timeline-icon,
.yellow-bg-timeline .timeline-circle,
.yellow-bg-timeline .main-timeline .timeline-circle {
    background: #efc337;
    z-index: 9;
}
.white-bg-timeline .timeline-icon,
.white-bg-timeline .timeline-circle,
.white-bg-timeline h2,
.yellow-bg-timeline h2,
.grey-bg-timeline h2,
.grey-bg-timeline .timeline-icon,
.grey-bg-timeline .timeline-circle,
.dark-bg-timeline h2,
.dark-bg-timeline .timeline-icon,
.dark-bg-timeline .timeline-circle
{
    z-index: 9;
}
.dark-bg-timeline h2 {
    color: #fff !important;
}
.main-timeline-box .title{
    margin-bottom: 0;
}
.main-timeline-box h2 {
    color: #000;
    text-transform: uppercase;
    position: relative;
    padding: 15px 0;
    margin-bottom: 0;
}
.main-timeline:after{
    content: '';
    display: block;
    clear: both;
}
.main-timeline .timeline {
    width: 50%;
    padding: 0 60px 0 0;
    margin: 0 10px 20px 0;
    float: left;
}
.main-timeline .timeline-content {
    background: #fff;
    display: block;
    position: relative;
    box-shadow: 0px 5px 6px -1px rgba(0,0,0,0.2);
    padding: 25px 20px 10px;
}
.yellow-bg-timeline .timeline-left-arrow:before,
.dark-bg-timeline .timeline-left-arrow:before {
    border-color: transparent transparent transparent rgba(0,0,0,0.1);
    right: -20px;
}
.yellow-bg-timeline .timeline-right-arrow:before,
.dark-bg-timeline .timeline-right-arrow:before {
    border-right: 15px solid rgba(0,0,0,0.1);
    left: -23px;
}
.main-timeline .timeline-content:hover{ text-decoration: none; }
.main-timeline .timeline-circle{
    color: #fff;
    background-color: #ffffff;
    font-size: 45px;
    line-height: 93px;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    border: 10px solid #efefef;
    transform: translateY(-50%);
    position: absolute;
    top: 30px;
    right: -82px;
}
.main-timeline .timeline:first-child {
    margin-top: 60px;
}
.timeline-content p {
    margin-bottom: 0;
    padding-bottom: 10px;
}

.timeline-content h4 {
    font-size: 1.375em;
    color: #000;
    font-weight: 500;
}
.main-timeline .timeline:nth-child(even){
    float: right;
    padding: 0 0 0 60px;
    margin: 0 0 20px 10px;
}
.main-timeline .timeline:nth-child(even) .timeline-circle {
    right: auto;
    left: -83px;
}
.timeline-left-arrow:before,
.timeline-left-arrow:after,
.timeline-right-arrow:before,
.timeline-right-arrow:after {
    content: '';
    height: 0;
    position: absolute;
    top: 22px;
    width: 0;
    z-index: 1;
    border: medium solid white;
}
.main-timeline-box h2:after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    width: 16px;
    height: 110px;
    top: 0;
    z-index: -1;
    background-color: #fff;
}
.timeline-left-arrow:before {
    border-width: 9px 0 9px 15px;
    border-color: transparent transparent transparent #dbdbdb;
    filter: blur(2px);
    right: -17px;
}
.timeline-left-arrow:after{
    border-color: transparent transparent transparent #ffffff;
    border-width: 9px 0 9px 15px;
    right: -15px;
}
.timeline-right-arrow:before {
    border-top: 9px solid transparent;
    border-bottom: 9px solid transparent;
    border-right: 15px solid #dbdbdb;
    left: -20px;
    filter: blur(2px);
    border-left: medium solid transparent;
}
.timeline-right-arrow:after {
    border-top: 9px solid transparent;
    border-bottom: 9px solid transparent;
    border-right: 15px solid white;
    left: -15px;
    border-left: 0;
}
.timeline-reverse .main-timeline .timeline:nth-child(even){
    float: left;
    padding: 0 60px 0 0;
    margin: 0 10px 20px 0;
}
.timeline-reverse .main-timeline .timeline:nth-child(odd){
    float: right;
    padding: 0 0 0 70px;
}
.timeline-reverse .main-timeline .timeline:nth-child(even) .timeline-circle{
    left: auto;
    right: -83px;
}
.timeline-reverse .main-timeline .timeline:nth-child(odd) .timeline-circle {
    right: auto;
    left: -83px;
}
@media (max-width: 991px){
    .main-timeline-box {
        z-index: -1;
    }
}
@media (max-width: 767px){
    .main-timeline {
        z-index: 9;
        position: relative;
    }
    .timeline-reverse .main-timeline .timeline:nth-child(even),
    .main-timeline .timeline, .main-timeline .timeline:nth-child(even){
        margin: 0 0 40px 0;
    }
    .main-timeline .timeline, .main-timeline .timeline:nth-child(even) {
        width: 100%;
        padding: 0 0px 0 70px !important;
    }
    .main-timeline .timeline:nth-child(even) {
        padding: 0 70px 0px 0px !important;
    }
}

@media (max-width: 595px){
    .timeline-reverse .main-timeline .timeline:nth-child(even),
    .main-timeline .timeline, .main-timeline .timeline:nth-child(even) {
        margin: 0 0 20px 0;
    }
    .main-timeline .timeline:nth-child(odd) .timeline-circle,
    .main-timeline .timeline:nth-child(even) .timeline-circle,
    .timeline-reverse .main-timeline .timeline:nth-child(odd) .timeline-circle,
    .timeline-reverse .main-timeline .timeline:nth-child(even) .timeline-circle{
        left: 0;
        right: 0;
        top: -40px;
        margin: auto;
    }
    .main-timeline .timeline-content {
        margin-bottom: 60px;
        text-align: center;
    }
    .timeline-content p{
        line-height: 160%;
    }
    .main-timeline .timeline, .main-timeline .timeline:nth-child(even),
    .main-timeline .timeline:nth-child(even){
        padding: 0 !important;
    }
    .main-timeline-box{
        padding-bottom: 0;
    }
    .main-timeline .timeline:last-child {
        margin-bottom: 0 !important;
    }
    .timeline-left-arrow:before,
    .timeline-left-arrow:after,
    .timeline-right-arrow:before,
    .timeline-right-arrow:after{
        display: none;
    }
    .mobile-mb-zero{
        margin-bottom: 0 !important;
    }
}