section#timelineEdu {
    width: 80%;
    margin: 20px auto;
    position: relative;
}

    section#timelineEdu:before {
        content: '';
        display: block;
        position: absolute;
        left: 50%;
        top: 0;
        margin: 0 0 0 -1px;
        width: 2px;
        height: 100%;
        background: rgba(255,255,255,0.2);
    }

    section#timelineEdu article {
        width: 100%;
        margin: 0 0 20px 0;
        position: relative;
    }

        section#timelineEdu article:after {
            content: '';
            display: block;
            clear: both;
        }

        section#timelineEdu article div.inner {
            width: 40%;
            float: left;
            margin: 5px 0 0 0;
            border-radius: 6px;
        }

            section#timelineEdu article div.inner span.date {
                display: block;
                width: 90px;
                height: 70px;
                padding: 20px;
                position: absolute;
                top: 0;
                left: 50%;
                margin: 0 0 0 -32px;
                border-radius: 100%;
                font-size: 12px;
                font-weight: 900;
                text-transform: uppercase;
                background: #25303B;
                color: rgba(255,255,255,0.5);
                border: 1px solid rgba(255,255,255,0.2);
                box-shadow: 0 0 0 20px #25303B;
                vertical-align: middle;
            }

                section#timelineEdu article div.inner span.date span {
                    display: block;
                    text-align: center;
                }

                    section#timelineEdu article div.inner span.date span.day {
                        font-size: 10px;
                    }

                    section#timelineEdu article div.inner span.date span.month {
                        font-size: 18px;
                    }

                    section#timelineEdu article div.inner span.date span.year {
                        font-size: 18px;
                    }

            section#timelineEdu article div.inner h2 {
                padding: 15px;
                margin: 0;
                color: #fff;
                font-size: 20px;
                text-transform: uppercase;
                letter-spacing: -1px;
                border-radius: 6px 6px 0 0;
                position: relative;
            }

                section#timelineEdu article div.inner h2:after {
                    content: '';
                    position: absolute;
                    top: 20px;
                    right: -5px;
                    width: 10px;
                    height: 10px;
                    -webkit-transform: rotate(-45deg);
                }

            section#timelineEdu article div.inner p {
                padding: 15px;
                margin: 0;
                font-size: 14px;
                background: #fff;
                color: #656565;
                border-radius: 0 0 6px 6px;
            }

        section#timelineEdu article:nth-child(2n+2) div.inner {
            float: right;
        }

            section#timelineEdu article:nth-child(2n+2) div.inner h2:after {
                left: -5px;
            }

        section#timelineEdu article:nth-child(1) div.inner h2 {
            background: #e74c3c;
        }

            section#timelineEdu article:nth-child(1) div.inner h2:after {
                background: #e74c3c;
            }

        section#timelineEdu article:nth-child(2) div.inner h2 {
            background: #2ecc71;
        }

            section#timelineEdu article:nth-child(2) div.inner h2:after {
                background: #2ecc71;
            }

        section#timelineEdu article:nth-child(3) div.inner h2 {
            background: #e67e22;
        }

            section#timelineEdu article:nth-child(3) div.inner h2:after {
                background: #e67e22;
            }

        section#timelineEdu article:nth-child(4) div.inner h2 {
            background: #1abc9c;
        }

            section#timelineEdu article:nth-child(4) div.inner h2:after {
                background: #1abc9c;
            }

        section#timelineEdu article:nth-child(5) div.inner h2 {
            background: #9b59b6;
        }

            section#timelineEdu article:nth-child(5) div.inner h2:after {
                background: #9b59b6;
            }