#timeline {
    background-color: white;
    text-align:center;
    margin:10% 0 0 0;
    padding: 2% 0 2% 0;

    
}

#timeline-mobileview {
    background-color: white;
    text-align:center;
    margin:10% 0 0 0;
    padding: 2% 0 2% 0;
    display:none;
}

.hogle-mobileview, .slac-mobileview, .browz-mobileview,.avetta-mobileview {
    background-color:antiquewhite;
    animation: companies 4s forwards;

}

.line, .line2, .line3, .line4 {
    border-left: 6px solid black;
    left: 50%;
    margin-left:50%;
    top:0;
    animation:line 3s forwards;
    
}

@keyframes line {
    from {height: 0px}
    to {height: 200px}
}

.hogle, .slac, .browz,.avetta {
    background-color:antiquewhite;
    margin: 0 40% 0 40%;
    animation: companies 4s forwards;

}


@keyframes companies {
    from {opacity: 0}
    to {opacity: 1}
}

@media screen and (max-width: 1200px) {
    #timeline {
        display:none;
    }
    #timeline-mobileview{
        display:inline;
    }
}