/*//////////////////////////////////////////////////////////////////////////////////////////////////////////*/

/*// Small and Up */
@media only screen and (min-width: 0px) {
    .progress-bar {
        margin:3rem 0;
        font-size:140%;
    }
    .progress-bar ul {
        list-style:none;
        list-style-type:none;
        margin:0;
        padding:0;
        text-transform:uppercase;
        text-align:center;
        display:flex;
        flex-wrap:wrap;
        justify-content:center;
    }
    .progress-bar li {
        display:block;
        padding:2rem 3rem;
        text-transform:uppercase;
        background-color: #f2f2f2;

        display:none;
        border-radius:8px;
    }
    /* state - current */
    .progress-bar li.current {
        font-weight:bold;
        color:#1d4d95;
        display:block;
    }

}

/*// Medium and Up */
@media only screen and (min-width: 601px) {
    .progress-bar li {
        display: block;
        border-radius:0;
        padding:2rem 1.5rem;
    }
    .progress-bar li:first-child {
        border-top-left-radius:8px;
        border-bottom-left-radius:8px;
    }
    .progress-bar li:last-child {
        border-top-right-radius:8px;
        border-bottom-right-radius:8px;
    }
    .progress-bar li:after {
        content:">";
        display:inline-block;
        padding:0 0 0 3rem;
        background-image:url(/img/arrow.png);
        background-position:center right;
        background-repeat:no-repeat;
        background-size:18px;
        color:transparent;
    }
    .progress-bar li:last-child:after {
        display:none;
    }
}

/*// Large and Up */
@media only screen and (min-width: 993px) {
    .progress-bar li {
        padding: 2rem 3rem;
    }
    .progress-bar li:after {
        padding:0 0 0 6rem;
        background-size:24px;
    }
}

/*//////////////////////////////////////////////////////////////////////////////////////////////////////////*/