<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>CSS Background Images</title>
    <link type="text/css" rel="Stylesheet" href="css/site.css" />
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <h1>CSS Background Images</h1>
        <p>
        This site uses a <em>cssImages</em> element in the web.config to 
        combine background images into sprites. It ensures that background images that can only be combined horizontally are indeed only combined 
        horizontally, etc.
        </p>
        <p>
        The sprites will be generated into the <em>___spritegen</em> directory of this site.
        Now that you have opened this page, have a look in there.
        </p>

        <h2>Gradients</h2>

        <div class="gradient-hor-blue-w20h1"></div>
        <div class="gradient-hor-green-w20h1"></div>
        <div class="gradient-vert-blue-w1h20"></div>
        <div class="gradient-vert-green-w1h20"></div>
        <div class="gradient-vert-lightblue-w1h10"></div>
        <div class="gradient-vert-orange-w1h10"></div>

        <h2>Link button with flexible width and rollover color</h2>
        <div class="flexible-width-button"><a href="Default.aspx">Flexible</a></div>
        
        <h2>Simpler link button with fixed width and rollover color</h2>
        <a class="fixed-width-button" href="Default.aspx">Fixed</a>
    </div>
    </form>
</body>
</html>
