*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
   
    background: #456990;
    color: #fff;
    overflow-x: hidden;
    padding-bottom: 50px;
}
/* INTRO SECTION
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.intro {
    background: #F45B69;
    padding: 100px 0;
}

.container {
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
   
}




/* TIMELINE
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.timeline ul {
    background: #fff;
    padding: 50px 0;
    margin-bottom:0px;
}

    .timeline ul li {
        list-style-type: none;
        position: relative;
        width: 6px;
        margin: 0 auto;
        padding-top: 50px;
        background: #084dc7;
    }

        .timeline ul li::after {
            content: '';
            position: absolute;
            left: 50%;
            bottom: 0;
            transform: translateX(-50%);
            width: 30px;
            height: 30px;
            border-radius: 50%;
            background: inherit;
        }

        .timeline ul li div {
            position: relative;
            bottom: 0;
            width: 410px;
            padding: 15px;
            background: #084dc7;
        }

            .timeline ul li div::before {
                content: '';
                position: absolute;
                bottom: 7px;
                width: 0;
                height: 0;
                border-style: solid;
            }

        .timeline ul li:nth-child(odd) div {
            left: 45px;
        }

            .timeline ul li:nth-child(odd) div::before {
                left: -15px;
                border-width: 8px 16px 8px 0;
                border-color: transparent #084dc7 transparent transparent;
            }

        .timeline ul li:nth-child(even) div {
            left: -439px;
        }

            .timeline ul li:nth-child(even) div::before {
                right: -15px;
                border-width: 8px 0 8px 16px;
                border-color: transparent transparent transparent #084dc7;
            }

time {
    display: block;
    
    font-weight: bold;
    margin-bottom: 8px;
    text-transform: uppercase;
}


/* EFFECTS
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.timeline ul li::after {
    transition: background .5s ease-in-out;
}

.timeline ul li.in-view::after {
    background: #e5322d;
    top: 78%
}

.timeline ul li div {
    visibility: hidden;
    opacity: 0;
    transition: all .5s ease-in-out;
}

.timeline ul li:nth-child(odd) div {
    transform: translate3d(200px, 0, 0);
}

.timeline ul li:nth-child(even) div {
    transform: translate3d(-200px, 0, 0);
}

.timeline ul li.in-view div {
    transform: none;
    visibility: visible;
    opacity: 1;
    
}


/* GENERAL MEDIA QUERIES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@media screen and (max-width: 320px) {
    .timeline ul li {
        margin-left: 20px;
    }

        .timeline ul li div {
            width: calc(85vw - 74px);
        }

        .timeline ul li:nth-child(even) div {
            left: 45px;
        }

            .timeline ul li:nth-child(even) div::before {
                left: -15px;
                border-width: 8px 16px 8px 0;
                border-color: transparent #456990 transparent transparent;
            }
}
@media screen and (max-width: 900px) {
 

@media screen and (max-width: 600px) {
    .timeline ul li {
        margin-left: 20px;
    }

        .timeline ul li div {
            width: calc(100vw - 91px);
        }

        .timeline ul li:nth-child(even) div {
            left: 45px;
        }

            .timeline ul li:nth-child(even) div::before {
                left: -15px;
                border-width: 8px 16px 8px 0;
                border-color: transparent #456990 transparent transparent;
            }
}

#Top_bar .menu li ul li a span{
	font
}