<%@ Page AutoEventWireup="false"  %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
    <link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <div class="demo-container">
        <telerik:RadRibbonBar RenderMode="Lightweight" ID="RadRibbonBar1" runat="server" Width="854px" Style="max-width: 854px;"
            Skin="Office2007">
            <telerik:RibbonBarTab Text="Home">
                <telerik:RibbonBarGroup Text="Clipboard" EnableLauncher="true">
                    <Items>
                        <telerik:RibbonBarMenu Size="Large" Text="Paste" ImageUrl="../../Images/Icons/home/Paste.png"
                            ToolTip="Paste the contents of the Clipboard.">
                            <Items>
                                <telerik:RibbonBarMenuItem Text="Paste" ImageUrl="../../Images/Icons/home/Paste.png" ToolTip="Paste the content.">
                                </telerik:RibbonBarMenuItem>
                                <telerik:RibbonBarMenuItem Text="Paste Special..." ImageUrl="../../Images/Icons/home/Paste.png"
                                    ToolTip="Paste Special.">
                                </telerik:RibbonBarMenuItem>
                            </Items>
                        </telerik:RibbonBarMenu>
                        <telerik:RibbonBarButton Size="Medium" Text="Cut" ImageUrl="../../Images/Icons/home/Cut.png" ToolTip="Cut the selection and put it on the Clipboard.">
                        </telerik:RibbonBarButton>
                        <telerik:RibbonBarButton Size="Medium" Text="Copy" ImageUrl="../../Images/Icons/home/Copy.png"
                            ToolTip="Copy the selection and put it on the Clipboard."></telerik:RibbonBarButton>
                        <telerik:RibbonBarButton Size="Medium" Text="Format" ImageUrl="../../Images/Icons/home/Format_Painter.png"
                            ToolTip="Copy formatting from one place and apply it to another.<br /><br />Double-click this button to apply the same formatting to multiple places in the document.">
                        </telerik:RibbonBarButton>
                    </Items>
                </telerik:RibbonBarGroup>
                <telerik:RibbonBarGroup Text="Font">
                    <Items>
                        <telerik:RibbonBarToggleButton Size="Small" Text="Bold" ImageUrl="../../Images/Icons/home/font/Bold.png"
                            ToolTip="Make the selected text bold."></telerik:RibbonBarToggleButton>
                        <telerik:RibbonBarToggleButton Size="Small" Text="Italic" ImageUrl="../../Images/Icons/home/font/Italic.png"
                            ToolTip="Italicize the selected text."></telerik:RibbonBarToggleButton>
                        <telerik:RibbonBarToggleButton Size="Small" Text="Underline" ImageUrl="../../Images/Icons/home/font/Underline.png"
                            ToolTip="Underline the selected text."></telerik:RibbonBarToggleButton>
                        <telerik:RibbonBarToggleButton Size="Small" Text="Strikethrough" ImageUrl="../../Images/Icons/home/font/Strike.png"
                            ToolTip="Draw a line through the middle of the selected text."></telerik:RibbonBarToggleButton>
                        <telerik:RibbonBarToggleList>
                            <ToggleButtons>
                                <telerik:RibbonBarToggleButton Size="Small" Text="Superscript" ImageUrl="../../Images/Icons/home/font/Superscript.png"
                                    ToolTip="Create small letters above the line of text."></telerik:RibbonBarToggleButton>
                                <telerik:RibbonBarToggleButton Size="Small" Text="Subscript" ImageUrl="../../Images/Icons/home/font/Subscript.png"
                                    ToolTip="Create small letters below the line of text."></telerik:RibbonBarToggleButton>
                            </ToggleButtons>
                        </telerik:RibbonBarToggleList>
                    </Items>
                </telerik:RibbonBarGroup>
                <telerik:RibbonBarGroup Text="Paragraph">
                    <Items>
                        <telerik:RibbonBarButtonStrip>
                            <Buttons>
                                <telerik:RibbonBarButton Text="Align Left" ImageUrl="../../Images/Icons/home/paragraph/AlignLeft.png"
                                    ToolTip="Align text to the left."></telerik:RibbonBarButton>
                                <telerik:RibbonBarButton Text="Align Center" ImageUrl="../../Images/Icons/home/paragraph/AlignCenter.png"
                                    ToolTip="Center text."></telerik:RibbonBarButton>
                                <telerik:RibbonBarButton Text="Align Right" ImageUrl="../../Images/Icons/home/paragraph/AlignRight.png"
                                    ToolTip="Align text to the right."></telerik:RibbonBarButton>
                                <telerik:RibbonBarButton Text="Justify" ImageUrl="../../Images/Icons/home/paragraph/Justify.png"
                                    ToolTip="Align text to both left and right margins, adding extra space between words as necessary.<br /><br />This creates a clean look along the left and right side of the page.">
                                </telerik:RibbonBarButton>
                            </Buttons>
                        </telerik:RibbonBarButtonStrip>
                        <telerik:RibbonBarButtonStrip>
                            <Buttons>
                                <telerik:RibbonBarButton Size="Small" Text="Unordered List" ImageUrl="../../Images/Icons/home/paragraph/UL.png"
                                    ToolTip="Start a bulleted list."></telerik:RibbonBarButton>
                                <telerik:RibbonBarButton Size="Small" Text="Numbered List" ImageUrl="../../Images/Icons/home/paragraph/OL.png"
                                    ToolTip="Start a numbered list."></telerik:RibbonBarButton>
                            </Buttons>
                        </telerik:RibbonBarButtonStrip>
                        <telerik:RibbonBarButtonStrip>
                            <Buttons>
                                <telerik:RibbonBarButton Size="Small" Text="Decrease Indent" ImageUrl="../../Images/Icons/home/paragraph/DecrIndent.png"
                                    ToolTip="Decreases the indent level of the paragraph."></telerik:RibbonBarButton>
                                <telerik:RibbonBarButton Size="Small" Text="Increase Indent" ImageUrl="../../Images/Icons/home/paragraph/IncrIndent.png"
                                    ToolTip="Increases the indent level of the paragraph."></telerik:RibbonBarButton>
                            </Buttons>
                        </telerik:RibbonBarButtonStrip>
                    </Items>
                </telerik:RibbonBarGroup>
                <telerik:RibbonBarGroup Text="Editing" EnableLauncher="true">
                    <Items>
                        <telerik:RibbonBarSplitButton Size="Medium" Text="Find" ImageUrl="../../Images/Icons/home/Find.png"
                            ToolTip="Find and select specific text, formatting, or type of information within the document.<br /><br />You can also replace the information with new text or formatting.">
                            <Buttons>
                                <telerik:RibbonBarButton Text="Find..." ImageUrl="../../Images/Icons/home/Find.png" ToolTip="Find text or other content in the document.">
                                </telerik:RibbonBarButton>
                                <telerik:RibbonBarButton Text="Go to..." ImageUrl="../../Images/Icons/home/Go.png" ToolTip="Navigate to a specific place in the document.<br /><br />Depending on the type of document, you can navigate to a specific page number, line number, footnote, table, comment, or other object.">
                                </telerik:RibbonBarButton>
                            </Buttons>
                        </telerik:RibbonBarSplitButton>
                        <telerik:RibbonBarButton Size="Medium" Text="Replace" ImageUrl="../../Images/Icons/home/Replace.png"
                            ToolTip="Replace text in the document."></telerik:RibbonBarButton>
                        <telerik:RibbonBarMenu Size="Medium" Text="Select" ImageUrl="../../Images/Icons/home/Select.png"
                            ToolTip="Select text or objects in the document.<br /><br />Use Select Object to allow you to select objects that have been positioned behind the text.">
                            <Items>
                                <telerik:RibbonBarMenuItem Text="Select All" ImageUrl="../../Images/Icons/home/Select_All.png"
                                    ToolTip="Select all items.">
                                </telerik:RibbonBarMenuItem>
                                <telerik:RibbonBarMenuItem Text="Select Objects" ImageUrl="../../Images/Icons/home/Select.png"
                                    ToolTip="Select rectangular regions of ink strokes, shapes and text.">
                                </telerik:RibbonBarMenuItem>
                            </Items>
                        </telerik:RibbonBarMenu>
                    </Items>
                </telerik:RibbonBarGroup>
            </telerik:RibbonBarTab>
            <telerik:RibbonBarTab Text="Insert">
                <telerik:RibbonBarGroup Text="Illustrations">
                    <Items>
                        <telerik:RibbonBarButton Size="Large" Text="Picture" ImageUrl="../../Images/Icons/insert/Picture.png"
                            ToolTip="Insert a picture from a file."></telerik:RibbonBarButton>
                        <telerik:RibbonBarButton Size="Large" Text="Clip Art" ImageUrl="../../Images/Icons/insert/Clipart.png"
                            ToolTip="insert Clip Art into the document, including drawings, movies, sounds, or stock photography to illustrate a specific concept.">
                        </telerik:RibbonBarButton>
                        <telerik:RibbonBarMenu Size="Large" Text="Shapes" ImageUrl="../../Images/Icons/insert/Shapes.png"
                            ToolTip="Insert ready-made shapes, such as rectangles and circles, arrows, lines, flowchart symbols, and callouts.">
                            <Items>
                                <telerik:RibbonBarMenuItem Text="Triangle">
                                </telerik:RibbonBarMenuItem>
                                <telerik:RibbonBarMenuItem Text="Square">
                                </telerik:RibbonBarMenuItem>
                                <telerik:RibbonBarMenuItem Text="Rectangle">
                                </telerik:RibbonBarMenuItem>
                                <telerik:RibbonBarMenuItem Text="Hexagon">
                                </telerik:RibbonBarMenuItem>
                                <telerik:RibbonBarMenuItem Text="Circle">
                                </telerik:RibbonBarMenuItem>
                            </Items>
                        </telerik:RibbonBarMenu>
                        <telerik:RibbonBarButton Size="Large" Text="SmartArt" ImageUrl="../../Images/Icons/insert/SmartArt.png"
                            ToolTip="Insert a SmartArt graphic to visually communicate information.<br /><br />SmartArt graphics range from graphical lists and process diagrams to more complex graphics, such as Venn diagrams and organization charts.">
                        </telerik:RibbonBarButton>
                        <telerik:RibbonBarButton Size="Large" Text="Chart" ImageUrl="../../Images/Icons/insert/Chart.png"
                            ToolTip="Insert a chart to illustrate and compare data.<br /><br />Bar, Pie, Line, Area and Surface are some of the available types.">
                        </telerik:RibbonBarButton>
                    </Items>
                </telerik:RibbonBarGroup>
                <telerik:RibbonBarGroup Text="Links">
                    <Items>
                        <telerik:RibbonBarButton Size="Large" Text="Hyperlink" ImageUrl="../../Images/Icons/insert/Link.png"
                            ToolTip="Create a link to a Web page, a picture, an e-mail address, or a program.">
                        </telerik:RibbonBarButton>
                        <telerik:RibbonBarButton Size="Large" Text="Bookmark" ImageUrl="../../Images/Icons/insert/Bookmark.png"
                            ToolTip="Create a bookmark to assign a name to a specific point in a document.<br /><br />You can make hyperlinks that jump directly to a bookmarked location.">
                        </telerik:RibbonBarButton>
                        <telerik:RibbonBarButton Size="Large" Text="Cross-reference" ImageUrl="../../Images/Icons/insert/Cross_reference.png"
                            ToolTip="Refer to items such as headings, figures, and tables by inserting a cross reference.<br /><br />Cross references are automatically updated if the content is moved to another location. By default, cross references are inserted as hyperlinks.">
                        </telerik:RibbonBarButton>
                    </Items>
                </telerik:RibbonBarGroup>
            </telerik:RibbonBarTab>
            <telerik:RibbonBarTab Text="View">
                <telerik:RibbonBarGroup Text="Zoom">
                    <Items>
                        <telerik:RibbonBarToggleList>
                            <ToggleButtons>
                                <telerik:RibbonBarToggleButton Size="Large" Text="Zoom" ImageUrl="../../Images/Icons/view/Zoom.png"
                                    ToolTip="Show the Zoom dialog box to specify the zoom level of the document.<br /><br />In most cases, you can also use the zoom controls in the status bar at the bottom of the window to quickly zoom the document.">
                                </telerik:RibbonBarToggleButton>
                                <telerik:RibbonBarToggleButton Size="Large" Text="100%" ImageUrl="../../Images/Icons/view/100.png"
                                    ToolTip="Zoom the document ot 100% of the normal size."></telerik:RibbonBarToggleButton>
                            </ToggleButtons>
                        </telerik:RibbonBarToggleList>
                        <telerik:RibbonBarToggleList>
                            <ToggleButtons>
                                <telerik:RibbonBarToggleButton Size="Medium" Text="One Page" ImageUrl="../../Images/Icons/view/One_Page.png"
                                    ToolTip="Zoom the document so that an entire page fits in the window."></telerik:RibbonBarToggleButton>
                                <telerik:RibbonBarToggleButton Size="Medium" Text="Two Pages" ImageUrl="../../Images/Icons/view/Two_Pages.png"
                                    ToolTip="Zoom the document so that two pages fit in the window."></telerik:RibbonBarToggleButton>
                                <telerik:RibbonBarToggleButton Size="Medium" Text="Page Width" ImageUrl="../../Images/Icons/view/Page_Width.png"
                                    ToolTip="Zoom the document so that the width of the page matches the width of the window.">
                                </telerik:RibbonBarToggleButton>
                            </ToggleButtons>
                        </telerik:RibbonBarToggleList>
                    </Items>
                </telerik:RibbonBarGroup>
                <telerik:RibbonBarGroup Text="Macros">
                    <Items>
                        <telerik:RibbonBarSplitButton Size="Large" Text="Macros" ImageUrl="../../Images/Icons/view/Macros.png"
                            ToolTip="Click here to record a macro or to access other macro options.">
                            <Buttons>
                                <telerik:RibbonBarButton Text="View Macros" ImageUrl="../../Images/Icons/view/Macros.png" ToolTip="View the list of macros, from which you can run, create or delete a macro.">
                                </telerik:RibbonBarButton>
                                <telerik:RibbonBarButton Text="Record Macro..." ImageUrl="../../Images/Icons/view/Macros_Record.png"
                                    ToolTip="Start or stop recording a macro."></telerik:RibbonBarButton>
                            </Buttons>
                        </telerik:RibbonBarSplitButton>
                    </Items>
                </telerik:RibbonBarGroup>
            </telerik:RibbonBarTab>
        </telerik:RadRibbonBar>
    </div>
    </form>
</body>
</html>