ASP.NET MVC displaying database table

i have just started to learn MVC 4 ASP.NET. I am using a tutorial called MVC Music Store as a starting point. I have a database table called 'Orders' which contains many records. I decided to try to display all the orders in a table. Here is the Order model:

using System.Collections.Generic;
using System.ComponentModel;
using System.ComponentModel.DataAnnotations;
using System.Web.Mvc;

namespace MvcMusicStore.Models
{
[Bind(Exclude = "OrderId")]
public partial class Order
{
    [ScaffoldColumn(false)]
    public int OrderId { get; set; }

    [ScaffoldColumn(false)]
    public System.DateTime OrderDate { get; set; }

    [ScaffoldColumn(false)]
    public string Username { get; set; }

    [Required(ErrorMessage = "First Name is required")]
    [DisplayName("First Name")]
    [StringLength(160)]
    public string FirstName { get; set; }

    [Required(ErrorMessage = "Last Name is required")]
    [DisplayName("Last Name")]
    [StringLength(160)]
    public string LastName { get; set; }

    [Required(ErrorMessage = "Address is required")]
    [StringLength(70)]
    public string Address { get; set; }

    [Required(ErrorMessage = "City is required")]
    [StringLength(40)]
    public string City { get; set; }

    [Required(ErrorMessage = "State is required")]
    [StringLength(40)]
    public string State { get; set; }

    [Required(ErrorMessage = "Postal Code is required")]
    [DisplayName("Postal Code")]
    [StringLength(10)]
    public string PostalCode { get; set; }

    [Required(ErrorMessage = "Country is required")]
    [StringLength(40)]
    public string Country { get; set; }

    [Required(ErrorMessage = "Phone is required")]
    [StringLength(24)]
    public string Phone { get; set; }

    [Required(ErrorMessage = "Email Address is required")]
    [DisplayName("Email Address")]
    [RegularExpression(@"[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}",
        ErrorMessage = "Email is is not valid.")]
    [DataType(DataType.EmailAddress)]
    public string Email { get; set; }

    [ScaffoldColumn(false)]
    public decimal Total { get; set; }

    public List<OrderDetail> OrderDetails { get; set; }
   }
   }

I can display the database results using a razor view, but it displays every view on one page in a table that is very long.

My question is, is there a way to make it so the page will just display 20 orders and then I can click next page to see the next 20? Just so you know how the complete process works, i am just doing 'code first' using entity framework (Microsoft seems to be encouraging this approach in most of their tutorials):

using System.Data.Entity;

namespace MvcMusicStore.Models
{
public class MusicStoreEntities : DbContext
{
    public DbSet<Order> Orders { get; set; }
    public DbSet<OrderDetail> OrderDetails { get; set; }
}
}

The controller:

using System;
using System.Collections.Generic;
using System.Data;
using System.Data.Entity;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using MvcMusicStore.Models;

namespace Test.Controllers
{
public class OrdersController : Controller
{
    private MusicStoreEntities db = new MusicStoreEntities();

    //
    // GET: /Orders/

    public ActionResult Index()
    {
        return View(db.Orders.ToList());
    }


}
}

This is the razor view:

@model IEnumerable<MvcMusicStore.Models.Order>

@{
ViewBag.Title = "Index";
}


<h2>Orders Overview</h2>
<br />
<div class="CSSTableGenerator" >
<table>
<tr>
    <td>
        @Html.DisplayNameFor(model => model.OrderId)
    </td>
     <td>
        @Html.DisplayNameFor(model => model.OrderDate)
    </td>
    <td>
        @Html.DisplayNameFor(model => model.Username)
    </td>
    <td>
        @Html.DisplayNameFor(model => model.Total)
    </td>
    <td>
        @Html.DisplayNameFor(model => model.FirstName)
    </td>
    <td>
        @Html.DisplayNameFor(model => model.LastName)
    </td>
    <td>
        @Html.DisplayNameFor(model => model.Address)
    </td>
    <td>
        @Html.DisplayNameFor(model => model.City)
    </td>
    <td>
        @Html.DisplayNameFor(model => model.State)
    </td>
    <td>
        @Html.DisplayNameFor(model => model.PostalCode)
    </td>
    <td>
        @Html.DisplayNameFor(model => model.Country)
    </td>
    <td>
        @Html.DisplayNameFor(model => model.Phone)
    </td>
    <td>
        @Html.DisplayNameFor(model => model.Email)
    </td>


</tr>

@foreach (var item in Model) {
<tr>
     <td>
        @Html.DisplayFor(modelItem => item.OrderId)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.OrderDate)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.Username)
    </td>
      <td>
        @Html.DisplayFor(modelItem => item.Total)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.FirstName)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.LastName)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.Address)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.City)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.State)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.PostalCode)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.Country)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.Phone)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.Email)
    </td>
    <td>

        @Html.ActionLink("Details", "Details", new { id=item.OrderId }) |
        @Html.ActionLink("Delete", "Delete", new { id=item.OrderId })
    </td>
    </tr>
    }

    </table>
    </div>

Second question, is that the total price is always 0.0 for each order in the table. However all other fields are correct. Thanks for tips.