.rouVarInfo {
    display: inline-block;
    vertical-align: top;
    color: #121212 !important;
}

.rouVarInfo {
    width: 25%;
    overflow: hidden;
}

    .rouVarInfo.ui-accordion .ui-accordion-header {
        white-space: nowrap;
    }

    .rouVarInfo table {
        line-height: 1.2;
        color: #121212 !important;
        width: 100%;
    }

    .rouVarInfo .stopName {
        padding-left: 5px;
    }

    .rouVarInfo .orderNo {
        width: 26px;
        vertical-align: middle;
        text-align: center;
    }

        .rouVarInfo .orderNo div {
            width: 20px;
            height: 20px;
            line-height: 20px;
            border-radius: 50%;
            -webkit-border-radius: 50%;
            -moz-border-radius: 50%;
            margin: 3px;
            vertical-align: middle;
            text-align: center;
            color: #fff;
            background-color: #34B67A;
        }

    .rouVarInfo tr:hover {
        cursor: pointer;
        color: #fff;
        background-color: #34B67A;
    }

        .rouVarInfo tr:hover .orderNo div {
            color: #34B67A;
            background-color: #fff;
        }

@media handheld, only screen and (max-width: 600px), only screen and (max-device-width: 600px) {
    .rouVarInfo {
        width: 100%;
    }
}