Ajax Calender Style for new look

1) Add Ajax Control dll
2)Register dll in HTML source page

<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="ajaxToolkit" %>

3)Write stylesheet for new look

body {

}

.cal_Theme1 .ajax__calendar_container

{

background-color: #e2e2e2; border:solid 1px #cccccc;

}

.cal_Theme1 .ajax__calendar_header

{

background-color: #ffffff; margin-bottom: 4px;

} 

.cal_Theme1 .ajax__calendar_title,

.cal_Theme1 .ajax__calendar_next,

.cal_Theme1 .ajax__calendar_prev

{

color: #004080; padding-top: 3px;

}

.cal_Theme1 .ajax__calendar_body

{

background-color: #e9e9e9; border: solid 1px #cccccc;

}

 .cal_Theme1 .ajax__calendar_dayname

{

text-align:center; font-weight:bold; margin-bottom: 4px; margin-top: 2px;

} 

.cal_Theme1 .ajax__calendar_day

{

text-align:center;

}

.cal_Theme1 .ajax__calendar_hover .ajax__calendar_day,

.cal_Theme1 .ajax__calendar_hover .ajax__calendar_month,

.cal_Theme1 .ajax__calendar_hover .ajax__calendar_year,

.cal_Theme1 .ajax__calendar_active

{

color: #004080; font-weight:bold; background-color: #ffffff;

}

 

 

.cal_Theme1 .ajax__calendar_today

{

font-weight:bold;

}

 

 

.cal_Theme1 .ajax__calendar_other,

.cal_Theme1 .ajax__calendar_hover .ajax__calendar_today,

.cal_Theme1 .ajax__calendar_hover .ajax__calendar_title

{

color: #bbbbbb;

}

4)call style sheet in head tag

<link href="StyleSheet.css" rel="stylesheet" type="text/css" />

5)Write code in from tag

 <form id="form1" runat="server">

        <div>

            <asp:ScriptManager ID="ScriptManager1" runat="server">

            </asp:ScriptManager>

            <ajaxToolkit:CalendarExtender ID="CalendarExtender1" runat="server" CssClass="cal_Theme1"

                TargetControlID="TextBox1" PopupPosition="Right">

            </ajaxToolkit:CalendarExtender>

        </div>

        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

    </form>