<!-- of-match-info -->
<article ng-if="quotes.provider == 'tipster'" class="card game-quotes tipster">
    <header class="card-header">
        <h1 class="card-title">{{'WHO_WILL_WIN' | translate}}</h1>
    </header>
    <div class="card-body">
        <article class="game-quote">
            <div class="game-quote-staple">
                <div class="game-quote-percentage" ng-style="{'height': quotes.homePct + '%'}" ng-class="{'voted-game': matchVote.vote=='h'}"></div>
                <span class="game-quote-staple-label" ng-style="{'bottom': quotes.homePct + '%'}">{{ quotes.homePct }}%</span>
            </div>
            <p><span class="quote-result">{{'HOME_WINS' | translate}} </span> <br /> {{ quotes.home }} {{'VOTES' | translate}}</p>
        </article>

        <article class="game-quote">
            <div class="game-quote-staple">
                <div class="game-quote-percentage" ng-style="{'height': quotes.drawPct + '%'}" ng-class="{'voted-game':matchVote.vote=='d'}"></div>
                <span class="game-quote-staple-label"  ng-style="{'bottom': quotes.drawPct + '%'}">{{ quotes.drawPct }}%</span>
            </div>
            <p> <span class="quote-result"> {{'DRAW' | translate}} </span> <br /> {{ quotes.draw }} {{'VOTES' | translate}}</p>
        </article>

        <article class="game-quote">
            <div class="game-quote-staple">
                <div class="game-quote-percentage" ng-style="{'height': quotes.guestPct + '%'}" ng-class="{'voted-game': matchVote.vote=='a'}"></div>
                <span class="game-quote-staple-label" ng-style="{'bottom': quotes.guestPct + '%'}">{{ quotes.guestPct }}%</span>
            </div>
            <p><span class="quote-result">{{'AWAY_WINS' | translate}} </span> <br /> {{ quotes.guest }} {{'VOTES' | translate}}</p>
        </article>
        <div class="clearfix"></div>
    </div>
</article>
