<?xml version="1.0" encoding="utf-8"?>
<UserControl x:Class="Themes.Gallery" mc:Ignorable="d" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:c1="http://schemas.componentone.com/winfx/2006/xaml" xmlns:local="clr-namespace:Themes" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006">
  <UserControl.Resources>
    <Style x:Key="ItemStyle" TargetType="Border">
      <Setter Property="Height" Value="50" />
	       <Setter Property="Width" Value="50" />
	        <Setter Property="Margin" Value="5 5 10 5" />
	        <Setter Property="CornerRadius" Value="3" />
	        <Setter Property="BorderThickness" Value="2" />
	    	<Setter Property="BorderBrush" Value="#FF8FB4CC" />
    </Style>
	<Style x:Key="LabelText" TargetType="TextBlock">
    	<Setter Property="FontSize" Value="10" />
    	<Setter Property="Foreground" Value="#FF5a5a5a" />
		<Setter Property="TextWrapping" Value="Wrap" />
		<Setter Property="VerticalAlignment" Value="Top" />
		<Setter Property="Margin" Value="0 5 0 0" />
    </Style>

    <!-- Toolbar images Style -->
    <Style TargetType="Image" x:Key="tbIcon">
      <Setter Property="Stretch" Value="None" />
    </Style>
  </UserControl.Resources>

    <c1:C1TabControl TabItemShape="Sloped" TabStripPlacement="Top" UnselectedContentMode="Collapsed">

        <c1:C1TabItem Header="Grids &amp; Basic">
            <c1:C1TabControl TabItemShape="Rectangle" TabStripPlacement="Left" Margin="8 0 0 0" UnselectedContentMode="Collapsed">

                <!-- DataGrid -->
                <c1:C1TabItem Header="DataGrid">
                    <c1:C1DataGrid x:Name="grid" CanUserGroup="True" Margin="10" CanUserFreezeColumns="Left" HeadersVisibility="All" />
                </c1:C1TabItem>

                <!-- FlexGrid -->
                <c1:C1TabItem Header="FlexGrid">
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition />
                        </Grid.RowDefinitions>
                        <c1:C1FlexGridGroupPanel x:Name="_groupPanelCustomGrouping" Grid.Row="0" WatermarkText="Drag column headers here to create groups." MaxGroups="8" HideGroupedColumns="False" FlexGrid="{Binding ElementName=flexGrid}" />
                        <c1:C1FlexGrid x:Name="flexGrid" Grid.Row="1" Margin="10" HeadersVisibility="All" />
                    </Grid>
                </c1:C1TabItem>

                <!-- ReportViewer-->
                <c1:C1TabItem Header="Report Viewer">
                    <c1:C1ReportViewer x:Name="ReportViewer" Grid.Row="2" ViewMode="FitWidth" Margin="10" />
                </c1:C1TabItem>
                
                <!-- C1ListBox -->
                <c1:C1TabItem Header="ListBox" HorizontalContentAlignment="Stretch">
                    <c1:C1ListBox x:Name="listBox" Margin="10" CornerRadius="12">
                        <c1:C1ListBox.ItemTemplate>
                            <DataTemplate>
                                <TextBlock Text="{Binding Name}" />
                            </DataTemplate>
                        </c1:C1ListBox.ItemTemplate>
                    </c1:C1ListBox>
                </c1:C1TabItem>

                <!-- Inputs -->
                <c1:C1TabItem Header="Basic Controls" IsSelected="True">
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="*" />
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="200" />
                            <ColumnDefinition Width="*" />
                            <ColumnDefinition Width="Auto" />
                        </Grid.ColumnDefinitions>

                        <!-- Menu -->
						<StackPanel Grid.ColumnSpan="2">
                        <c1:C1Menu x:Name="menu" c1:C1DockPanel.Dock="Top" DetectBoundaries="True" Height="24">
                            <c1:C1MenuItem Header="File">
                                <c1:C1MenuItem Header="New">
                                    <c1:C1MenuItem Header="Project..." />
                                    <c1:C1MenuItem Header="Web Site..." />
                                    <c1:C1MenuItem Header="Team Project..." />
                                    <c1:C1MenuItem Header="File..." />
                                </c1:C1MenuItem>
                                <c1:C1MenuItem Header="Open">
                                    <c1:C1MenuItem Header="Project..." />
                                    <c1:C1MenuItem Header="Web Site..." />
                                    <c1:C1MenuItem Header="File..." />
                                </c1:C1MenuItem>
                                <c1:C1Separator />
                                <c1:C1MenuItem Header="Add">
                                    <c1:C1MenuItem Header="New Project..." />
                                    <c1:C1MenuItem Header="New Web Site..." />
                                    <c1:C1Separator />
                                    <c1:C1MenuItem Header="Existing Project..." />
                                    <c1:C1MenuItem Header="Existing Web Site..." />
                                </c1:C1MenuItem>
                                <c1:C1Separator />
                                <c1:C1MenuItem Header="Close" />
                                <c1:C1MenuItem Header="Close Solution" />
                                <c1:C1Separator />
                                <c1:C1MenuItem Header="Save" />
                                <c1:C1MenuItem Header="Save All" />
                                <c1:C1Separator />
                                <c1:C1MenuItem Header="Page Setup" />
                                <c1:C1MenuItem Header="Print" />
                                <c1:C1Separator />
                                <c1:C1MenuItem Header="Exit" />
                            </c1:C1MenuItem>
                            <c1:C1MenuItem Header="Edit">
                                <c1:C1MenuItem Header="Undo" />
                                <c1:C1MenuItem Header="Redo" />
                                <c1:C1Separator />
                                <c1:C1MenuItem Header="Cut" />
                                <c1:C1MenuItem Header="Copy" />
                                <c1:C1MenuItem Header="Paste" />
                                <c1:C1MenuItem Header="Delete" />
                            </c1:C1MenuItem>
                            <c1:C1MenuItem Header="Window">
                                <c1:C1MenuItem Header="Document 1" IsCheckable="True" IsChecked="True" />
                                <c1:C1MenuItem Header="Document 2" IsCheckable="True" IsChecked="True" />
                                <c1:C1MenuItem Header="Document 3" IsCheckable="True" />
                                <c1:C1MenuItem Header="Document 4" IsCheckable="True" />
                            </c1:C1MenuItem>
                        </c1:C1Menu>

                        <!-- Toolbar -->
                        <c1:C1Toolbar Grid.Row="1" Grid.ColumnSpan="2">

                            <!-- Clipboard -->
                            <c1:C1ToolbarGroup Header="Clipboard">
                                <c1:C1ToolbarStrip>
                                    <c1:C1ToolbarButton Width="60" HorizontalContentAlignment="Left">
                                        <StackPanel Orientation="Horizontal">
                                            <Image Grid.Column="1" Source="../../Resources/cut.png" Margin="7 0 7 0" />
                                            <TextBlock Text="Cut" VerticalAlignment="Center" TextAlignment="Center" />
                                        </StackPanel>
                                    </c1:C1ToolbarButton>
                                </c1:C1ToolbarStrip>
                                <c1:C1ToolbarStrip>
                                    <c1:C1ToolbarButton Width="60" HorizontalContentAlignment="Left">
                                        <StackPanel Orientation="Horizontal">
                                            <Image Source="../../Resources/copy.png" Margin="4 0 4 0" />
                                            <TextBlock Text="Copy" VerticalAlignment="Center" TextAlignment="Center" />
                                        </StackPanel>
                                    </c1:C1ToolbarButton>
                                </c1:C1ToolbarStrip>
                                <c1:C1ToolbarStrip>
                                    <c1:C1ToolbarButton Width="60" HorizontalContentAlignment="Left">
                                        <StackPanel Orientation="Horizontal">
                                            <Image Source="../../Resources/paste.png" Margin="4 0 4 0" />
                                            <TextBlock Text="Paste" VerticalAlignment="Center" TextAlignment="Center" />
                                        </StackPanel>
                                    </c1:C1ToolbarButton>
                                </c1:C1ToolbarStrip>
                            </c1:C1ToolbarGroup>

                            <!-- Font -->
                            <c1:C1ToolbarGroup Header="Font">
                                <c1:C1ToolbarStrip>
                                    <c1:C1ComboBox Width="100" Height="22" Margin="0 0 3 0">
                                        <c1:C1ComboBoxItem Content="default" IsSelected="True" />
                                        <c1:C1ComboBoxItem Content="Arial" />
                                        <c1:C1ComboBoxItem Content="Arial Black" />
                                    </c1:C1ComboBox>
                                    <c1:C1ComboBox Width="60" Height="22" Margin="0 0 1 0">
                                        <c1:C1ComboBoxItem Content="8" />
                                        <c1:C1ComboBoxItem Content="9" />
                                        <c1:C1ComboBoxItem Content="10" IsSelected="True" />
                                        <c1:C1ComboBoxItem Content="12" />
                                    </c1:C1ComboBox>
                                </c1:C1ToolbarStrip>
                                <c1:C1ToolbarStrip>
                                    <c1:C1ToolbarToggleButton>
                                        <Image Source="../../Resources/bold.png" Height="16" Width="16" />
                                    </c1:C1ToolbarToggleButton>
                                    <c1:C1ToolbarToggleButton>
                                        <Image Source="../../Resources/italic.png" Height="16" Width="16" />
                                    </c1:C1ToolbarToggleButton>
                                    <c1:C1ToolbarToggleButton>
                                        <Image Source="../../Resources/underline.png" Height="16" Width="16" />
                                    </c1:C1ToolbarToggleButton>

                                    <c1:C1Separator />

                                    <c1:C1ToolbarToggleButton>
                                        <Image Source="../../Resources/subscript.png" Margin="2 2 -2 -2" Height="16" Width="16" />
                                    </c1:C1ToolbarToggleButton>
                                    <c1:C1ToolbarToggleButton>
                                        <Image Source="../../Resources/superscript.png" Height="16" Width="16" />
                                    </c1:C1ToolbarToggleButton>

                                </c1:C1ToolbarStrip>
                                <c1:C1ToolbarStrip>
                                    <c1:C1ColorPicker Width="42" />
                                </c1:C1ToolbarStrip>
                            </c1:C1ToolbarGroup>

                            <!-- Shapes -->
                            <c1:C1ToolbarGroup Header="Shapes">
                                <c1:C1ToolbarStrip>
                                    <c1:C1ToolbarToggleButton GroupName="Shape" IsChecked="true">
                                        <Image Style="{StaticResource tbIcon}" Source="../../Resources/shape_circle.png" />
                                    </c1:C1ToolbarToggleButton>
                                    <c1:C1ToolbarToggleButton GroupName="Shape">
                                        <Image Style="{StaticResource tbIcon}" Source="../../Resources/shape_ellipse.png" />
                                    </c1:C1ToolbarToggleButton>
                                    <c1:C1ToolbarToggleButton GroupName="Shape">
                                        <Image Style="{StaticResource tbIcon}" Source="../../Resources/shape_hexagon.png" />
                                    </c1:C1ToolbarToggleButton>
                                </c1:C1ToolbarStrip>
                                <c1:C1ToolbarStrip Padding="0">
                                    <c1:C1ToolbarToggleButton GroupName="Shape">
                                        <Image Style="{StaticResource tbIcon}" Source="../../Resources/shape_octagon.png" />
                                    </c1:C1ToolbarToggleButton>
                                    <c1:C1ToolbarToggleButton GroupName="Shape">
                                        <Image Style="{StaticResource tbIcon}" Source="../../Resources/shape_pentagon.png" />
                                    </c1:C1ToolbarToggleButton>
                                    <c1:C1ToolbarToggleButton GroupName="Shape">
                                        <Image Style="{StaticResource tbIcon}" Source="../../Resources/shape_rectangle.png" />
                                    </c1:C1ToolbarToggleButton>
                                </c1:C1ToolbarStrip>
                                <c1:C1ToolbarStrip Padding="0">
                                    <c1:C1ToolbarToggleButton GroupName="Shape">
                                        <Image Style="{StaticResource tbIcon}" Source="../../Resources/shape_rhomb.png" />
                                    </c1:C1ToolbarToggleButton>
                                    <c1:C1ToolbarToggleButton GroupName="Shape">
                                        <Image Style="{StaticResource tbIcon}" Source="../../Resources/shape_square.png" />
                                    </c1:C1ToolbarToggleButton>
                                    <c1:C1ToolbarToggleButton GroupName="Shape">
                                        <Image Style="{StaticResource tbIcon}" Source="../../Resources/shape_triangle.png" />
                                    </c1:C1ToolbarToggleButton>
                                </c1:C1ToolbarStrip>
                            </c1:C1ToolbarGroup>

                            <!-- Layout -->
                            <c1:C1ToolbarGroup Header="Layout">
                                <c1:C1ToolbarStrip>
                                    <c1:C1ToolbarButton>
                                        <Image Style="{StaticResource tbIcon}" Source="../../Resources/layout_northwest.png" />
                                    </c1:C1ToolbarButton>
                                    <c1:C1ToolbarButton>
                                        <Image Style="{StaticResource tbIcon}" Source="../../Resources/layout_north.png" />
                                    </c1:C1ToolbarButton>
                                    <c1:C1ToolbarButton>
                                        <Image Style="{StaticResource tbIcon}" Source="../../Resources/layout_northeast.png" />
                                    </c1:C1ToolbarButton>
                                </c1:C1ToolbarStrip>
                                <c1:C1ToolbarStrip>
                                    <c1:C1ToolbarButton>
                                        <Image Style="{StaticResource tbIcon}" Source="../../Resources/layout_west.png" />
                                    </c1:C1ToolbarButton>
                                    <c1:C1ToolbarButton>
                                        <Image Style="{StaticResource tbIcon}" Source="../../Resources/layout_center.png" />
                                    </c1:C1ToolbarButton>
                                    <c1:C1ToolbarButton>
                                        <Image Style="{StaticResource tbIcon}" Source="../../Resources/layout_east.png" />
                                    </c1:C1ToolbarButton>
                                </c1:C1ToolbarStrip>
                                <c1:C1ToolbarStrip>
                                    <c1:C1ToolbarButton>
                                        <Image Style="{StaticResource tbIcon}" Source="../../Resources/layout_southwest.png" />
                                    </c1:C1ToolbarButton>
                                    <c1:C1ToolbarButton>
                                        <Image Style="{StaticResource tbIcon}" Source="../../Resources/layout_south.png" />
                                    </c1:C1ToolbarButton>
                                    <c1:C1ToolbarButton>
                                        <Image Style="{StaticResource tbIcon}" Source="../../Resources/layout_southeast.png" />
                                    </c1:C1ToolbarButton>
                                </c1:C1ToolbarStrip>
                            </c1:C1ToolbarGroup>
                        </c1:C1Toolbar>
						</StackPanel>
						<Grid Grid.Column="2" Grid.RowSpan="2">
							<Grid.RowDefinitions>
								<RowDefinition Height="Auto" MinHeight="137" />
								<RowDefinition />
							</Grid.RowDefinitions>
                        <!-- TreeView -->
                        <c1:C1TreeView Grid.Row="1" Margin="10,10,0,0" Padding="6,2,0,2">
                            <c1:C1TreeViewItem Header="Studio for Silverlight" IsExpanded="True">
                                <c1:C1TreeViewItem Header="Data Visualization" />
                                <c1:C1TreeViewItem Header="Menus and Navigation" />
                                <c1:C1TreeViewItem Header="Input Controls" />
                                <c1:C1TreeViewItem Header="Containers" />
                                <c1:C1TreeViewItem Header="Media and Imaging" />
                                <c1:C1TreeViewItem Header="Utilities" />
                            </c1:C1TreeViewItem>
                            <c1:C1TreeViewItem Header="XapOptimizer" IsExpanded="True">
                                <c1:C1TreeViewItem Header="Pruning" />
                                <c1:C1TreeViewItem Header="Obfuscation" />
                                <c1:C1TreeViewItem Header="Strong Signing" />
                                <c1:C1TreeViewItem Header="Deploy architecture" />
                            </c1:C1TreeViewItem>
                        </c1:C1TreeView>
						<!-- Window -->
                        <c1:C1Window Header="Compare" Canvas.ZIndex="117" Padding="5" ShowMaximizeButton="False" IsActive="True" IsEnabled="True" IsResizable="False" Grid.Column="2" Margin="10,0,0,0">
                            <!-- Accordion and Property Grid-->                            
                            <!--<c1:C1Accordion Grid.Row="2" Grid.Column="1"  VerticalAlignment="Top" Width="190">
                                <c1:C1AccordionItem Header="Person 1" IsExpanded="True" >-->
                                    <c1:C1PropertyGrid x:Name="propGrid1" ShowDescription="False" Width="227" />
                                <!--</c1:C1AccordionItem>
                                <c1:C1AccordionItem Header="Person 2" IsExpanded="True">
                                    <c1:C1PropertyGrid x:Name="propGrid2" ShowDescription="False" />
                                </c1:C1AccordionItem>
                            </c1:C1Accordion>-->
                        </c1:C1Window>
						</Grid>

                        <ScrollViewer Grid.Row="1" Grid.Column="1" VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" HorizontalAlignment="Center" VerticalAlignment="Top" BorderThickness="0">
                        <c1:C1WrapPanel Width="300">
                            <c1:C1TextBoxBase TextWrapping="Wrap" Height="28" Width="120" Margin="10" />

                            <c1:C1ComboBox Height="28" Width="120" MaxDropDownHeight="100" Margin="10" Padding="0">
                                <c1:C1ComboBoxItem Content="Studio for Silverlight" />
                                <c1:C1ComboBoxItem Content="Studio for WPF" />
                                <c1:C1ComboBoxItem Content="Studio for ASP.NET" />
                                <c1:C1ComboBoxItem Content="Studio for iPhone" />
                                <c1:C1ComboBoxItem Content="Studio for WinForms" />
                                <c1:C1ComboBoxItem Content="Studio for ActiveX" />
                                <c1:C1ComboBoxItem Content="Studio for Mobile" />
                                <c1:C1ComboBoxItem Content="Studio for Silverlight" />
                                <c1:C1ComboBoxItem Content="Studio for WPF" />
                                <c1:C1ComboBoxItem Content="Studio for ASP.NET" />
                                <c1:C1ComboBoxItem Content="Studio for iPhone" />
                                <c1:C1ComboBoxItem Content="Studio for WinForms" />
                                <c1:C1ComboBoxItem Content="Studio for ActiveX" />
                                <c1:C1ComboBoxItem Content="Studio for Mobile" />
                            </c1:C1ComboBox>

                            <c1:C1FilePicker Height="28" Width="120" Margin="10" />

                            <c1:C1NumericBox Height="28" Width="120" Margin="10" />

                            <c1:C1RangeSlider Width="160" Margin="10" Height="22" />

                            <!--<c1:C1RangeSlider Orientation="Vertical"  Height="120" Margin="30,10,10,10"  />-->
                            <c1:C1ColorPicker Height="28" Width="120" Margin="10" />

                            <c1:C1DateTimePicker Height="28" Width="226" Margin="10" />

                            <!--<c1:C1DatePicker Height="28" Width="120" Margin="10"/>-->

                        </c1:C1WrapPanel>
                        </ScrollViewer>

                        <c1:C1OutlookBar Grid.Row="1" IsExpanded="True" Dock="Left" ExpandedWidth="200">

            <!-- content shown when the bar is collapsed -->
            <c1:C1OutlookBar.CollapsedContent>
                <c1:C1LayoutTransformer>
                    <c1:C1LayoutTransformer.LayoutTransform>
                        <RotateTransform Angle="270" />
                    </c1:C1LayoutTransformer.LayoutTransform>
                    <TextBlock FontSize="13" TextAlignment="Center" VerticalAlignment="Center" Text="Navigation Pane" />
                </c1:C1LayoutTransformer>
            </c1:C1OutlookBar.CollapsedContent>

            <c1:C1OutlookBar.LargeIconTemplate>
                <DataTemplate>
                    <Image Source="{Binding}" Width="24" Height="24" />
                </DataTemplate>
            </c1:C1OutlookBar.LargeIconTemplate>
            <c1:C1OutlookBar.SmallIconTemplate>
                <DataTemplate>
                    <Grid Height="24">
                        <Image Source="{Binding}" Width="16" Height="16" />
                    </Grid>
                </DataTemplate>
            </c1:C1OutlookBar.SmallIconTemplate>

            <!-- Inbox -->
            <c1:C1OutlookItem Header="Mail" LargeIcon="Resources/ico24x-mail.png" SmallIcon="Resources/ico16x-mail.png">
                <c1:C1TreeView x:Name="mail" BorderThickness="0">
            <c1:C1TreeView.ItemContainerStyle>
                <Style TargetType="c1:C1TreeViewItem">
                    <Setter Property="IsExpanded" Value="True" />
                </Style>
            </c1:C1TreeView.ItemContainerStyle>
            <c1:C1TreeView.ItemTemplate>
                <c1:C1HierarchicalDataTemplate ItemsSource="{Binding Children}">
                    <StackPanel Orientation="Horizontal">
                        <Image Source="{Binding Source}" />
                        <TextBlock Text="{Binding Name}" />
                    </StackPanel>
                </c1:C1HierarchicalDataTemplate>
            </c1:C1TreeView.ItemTemplate>
        </c1:C1TreeView>
            </c1:C1OutlookItem>
		
		    <!-- Calendar -->
            <c1:C1OutlookItem Header="Calendar" LargeIcon="Resources/ico24x-calendar.png" SmallIcon="Resources/ico16x-calendar.png">
                <c1:C1TreeView BorderBrush="Transparent">
                            <c1:C1TreeViewItem Header="My Calendars" IsExpanded="True">
                                <c1:C1TreeViewItem>
                                    <c1:C1TreeViewItem.Header>
                                        <StackPanel Orientation="Horizontal">
                                            <Image HorizontalAlignment="Left" Width="16" Height="16" Source="../Resources/ico16x-calendar.png" Stretch="Fill" Margin="0 0 5 0" />
                                            <TextBlock TextWrapping="Wrap" Text="Calendar" VerticalAlignment="Center" />
                                        </StackPanel>
                                    </c1:C1TreeViewItem.Header>
                                </c1:C1TreeViewItem>
                            </c1:C1TreeViewItem>
                        </c1:C1TreeView>
            </c1:C1OutlookItem>

            <!-- Contacts -->
            <c1:C1OutlookItem Header="Contacts" LargeIcon="Resources/ico24x-contacts.png" SmallIcon="Resources/ico16x-contacts.png">
                <c1:C1TreeView x:Name="contacts" BorderThickness="0">
            <c1:C1TreeViewItem Header="My Contacts" IsExpanded="True">
                <c1:C1TreeViewItem>
                    <c1:C1TreeViewItem.Header>
                        <StackPanel Orientation="Horizontal">
                            <Image Source="../Resources/ico16x-contacts.png" Margin="0 0 5 0" />
                            <TextBlock Text="Contacts" VerticalAlignment="Center" />
                        </StackPanel>
                    </c1:C1TreeViewItem.Header>
                </c1:C1TreeViewItem>
                <c1:C1TreeViewItem>
                    <c1:C1TreeViewItem.Header>
                        <StackPanel Orientation="Horizontal">
                            <Image Source="../Resources/ico16x-contacts.png" Margin="0 0 5 0" />
                            <TextBlock Text="Suggested Contacts" VerticalAlignment="Center" />
                        </StackPanel>
                    </c1:C1TreeViewItem.Header>
                </c1:C1TreeViewItem>
            </c1:C1TreeViewItem>
        </c1:C1TreeView>
            </c1:C1OutlookItem>

            <!-- Tasks -->
            <c1:C1OutlookItem Header="Tasks" LargeIcon="Resources/ico24x-task.png" SmallIcon="Resources/ico16x-task.png">
                <c1:C1TreeView x:Name="tasks" BorderThickness="0">
            <c1:C1TreeViewItem Header="My Tasks" IsExpanded="True">
                <c1:C1TreeViewItem>
                    <c1:C1TreeViewItem.Header>
                        <StackPanel Orientation="Horizontal">
                            <Image />
                            <TextBlock Text="To-Do List" />
                        </StackPanel>
                    </c1:C1TreeViewItem.Header>
                </c1:C1TreeViewItem>
                <c1:C1TreeViewItem>
                    <c1:C1TreeViewItem.Header>
                        <StackPanel Orientation="Horizontal">
                            <Image Source="../Resources/ico16x-task.png" Margin="0 0 5 0" />
                            <TextBlock Text="Tasks" VerticalAlignment="Center" />
                        </StackPanel>
                    </c1:C1TreeViewItem.Header>
                </c1:C1TreeViewItem>
            </c1:C1TreeViewItem>
        </c1:C1TreeView>
            </c1:C1OutlookItem>

            <!-- Notes -->
            <c1:C1OutlookItem Header="Notes" LargeIcon="Resources/ico24x-notes.png" SmallIcon="Resources/ico16x-notes.png">
                <c1:C1TreeView x:Name="notes" BorderThickness="0">
            <c1:C1TreeViewItem Header="My Notes" IsExpanded="True">
                <c1:C1TreeViewItem>
                    <c1:C1TreeViewItem.Header>
                        <StackPanel Orientation="Horizontal" VerticalAlignment="Center">
                            <Image Source="../Resources/ico16x-notes.png" Margin="0 0 5 0" />
                            <TextBlock Text="Notes" VerticalAlignment="Center" />
                        </StackPanel>
                    </c1:C1TreeViewItem.Header>
                </c1:C1TreeViewItem>
            </c1:C1TreeViewItem>
        </c1:C1TreeView>
            </c1:C1OutlookItem>

        </c1:C1OutlookBar>

                    </Grid>
                </c1:C1TabItem>

            </c1:C1TabControl>
        </c1:C1TabItem>

        <c1:C1TabItem Header="Visualization controls">
            <c1:C1TabControl TabItemShape="Rectangle" TabStripPlacement="Left" Margin="8 0 0 0" UnselectedContentMode="Collapsed">

                    <!-- Chart -->
                    <c1:C1TabItem Header="Chart">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition />
                                <ColumnDefinition />
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition />
                                <RowDefinition />
                            </Grid.RowDefinitions>

                            <c1:C1Chart ChartType="Column" Loaded="C1Chart_Loaded" Margin="10,10,5,5">
                                <c1:C1ChartLegend />
                            </c1:C1Chart>

                            <c1:C1Chart Grid.Row="1" ChartType="Bar" Loaded="C1Chart_Loaded" Margin="10,5,5,10">
                                <c1:C1ChartLegend />
                            </c1:C1Chart>

                            <c1:C1Chart Grid.Column="1" ChartType="Pie" Loaded="C1Chart_Loaded" Margin="5,10,10,5">
                                <c1:C1ChartLegend />
                            </c1:C1Chart>

                            <c1:C1Chart Grid.Row="1" Grid.Column="1" ChartType="LineSymbols" Loaded="C1Chart_Loaded" Margin="5,5,10,10">
                                <c1:C1ChartLegend />
                            </c1:C1Chart>
                        </Grid>
                    </c1:C1TabItem>

                    <!-- Ruler -->
                    <c1:C1TabItem Header="Ruler Gauge">
                        <c1:C1RulerGauge Width="70" Height="300" VerticalAlignment="Center" HorizontalAlignment="Center" Orientation="Vertical" XAxisLocation="0.1" XAxisLength="0.8" YAxisLocation="0.5" Value="37" Margin="10">
                            <c1:C1GaugeMark Interval="20" />
                            <c1:C1GaugeMark Interval="10" />
                            <c1:C1GaugeMark Interval="5" />
                            <c1:C1GaugeLabel Interval="20" Format="n0" Alignment="Out" AlignmentOffset="8" />
                        </c1:C1RulerGauge>
                    </c1:C1TabItem>
                    
                    <!-- Gauges -->
                    <c1:C1TabItem Header="Linear and Radial">
                        <Grid VerticalAlignment="Center" HorizontalAlignment="Center" MaxHeight="300" MaxWidth="500">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*" />
                                <ColumnDefinition Width="10" />
                                <ColumnDefinition Width="*" />
                            </Grid.ColumnDefinitions>
                            <c1:C1RadialGauge Value="0" Radius="0.7" Grid.Column="0" Margin="10,10,5,10">
                                <c1:C1GaugeRange To="20" Width="0.15" Fill="#FF07D6C1" />
                                <c1:C1GaugeRange From="20" To="75" StartWidth="0.15" EndWidth="0.3" Fill="Gray" Opacity="0.6" />
                                <c1:C1GaugeRange From="75" Width="0.15" Fill="#FF14B4D6" Opacity="0.6" />
                                <c1:C1GaugeMark Interval="20" />
                                <c1:C1GaugeMark Interval="10" />
                                <c1:C1GaugeLabel Interval="20" Location="0.8" FontSize="12" Format="f0" Alignment="In" />
                            </c1:C1RadialGauge>
                            <c1:C1LinearGauge Height="80" Value="0" YAxisLocation="0.5" XAxisLocation="0.1" XAxisLength="0.8" Grid.Column="2" Margin="5,10,10,10">
                                <c1:C1GaugeRange To="20" Width="0.15" Fill="#FF07D6C1" Opacity="0.6" />
                                <c1:C1GaugeRange From="20" To="75" StartWidth="0.15" EndWidth="0.3" Fill="Gray" Opacity="0.6" />
                                <c1:C1GaugeRange From="75" Width="0.15" Fill="#FF14B4D6" Opacity="0.6" />
                                <c1:C1GaugeMark Interval="20" />
                                <c1:C1GaugeMark Interval="10" />
                                <c1:C1GaugeLabel Interval="20" FontSize="12" Format="f0" Alignment="In" />
                            </c1:C1LinearGauge>
                        </Grid>

                    </c1:C1TabItem>

                    <!-- Speedometer -->
                    <c1:C1TabItem Header="Speedometer">
                        <c1:C1SpeedometerGauge x:Name="SpeedGauge" VerticalAlignment="Center" HorizontalAlignment="Center" MaxHeight="400" MaxWidth="400" Value="20" StartAngle="-50" SweepAngle="100" Margin="10">
                            <c1:C1GaugeMark Interval="20" />
                            <c1:C1GaugeMark Interval="10" />
                            <c1:C1GaugeMark Interval="5" />
                            <c1:C1GaugeLabel Interval="20" Alignment="In" AlignmentOffset="10" />
                        </c1:C1SpeedometerGauge>
                    </c1:C1TabItem>

                    <!-- Volumemeter -->
                    <c1:C1TabItem Header="Volumemeter">
                        <c1:C1VolumeGauge x:Name="VolumeGauge" VerticalAlignment="Center" HorizontalAlignment="Center" MaxHeight="400" MaxWidth="400" Value="20" StartAngle="10" SweepAngle="160">
                            <c1:C1VolumeGauge.FaceTemplate>
                                <DataTemplate>
                                    <Grid Margin="10">
                                        <Grid.RowDefinitions>
                                            <RowDefinition Height="0.15*" />
                                            <RowDefinition />
                                            <RowDefinition Height="0.15*" />
                                        </Grid.RowDefinitions>
                                        <TextBlock Text="F" FontSize="25" FontFamily="Arial" Foreground="#000000" FontWeight="Bold" />
                                        <Grid Height="40" Width="40" Grid.Row="1">
                                            <Path Data="M7.0000005,3.0050032 C6.4477415,3.0050032 6.000001,3.4527071 6.000001,4.005003 L6.000001,14.005003 C6.000001,14.557169 6.4475465,15.005003 7.0000005,15.005003 L20,15.005003 C20.552301,15.005003 21,14.557275 21,14.005003 L21,4.005003 C21,3.4525788 20.552227,3.0050032 20,3.0050032 z M27.755436,0.00028914632 C28.495354,-0.016514905 29.794043,0.7009427 31.201189,1.6764078 C32.344528,2.4689984 33.559528,3.4319692 34.604687,4.3099251 C37.177437,6.4711437 38.412182,10.690466 37.794823,11.513642 C37.64043,11.719504 37.460331,11.809512 37.277069,11.828805 C37.231243,11.833628 37.185219,11.83403 37.139339,11.830715 C36.772396,11.804184 36.414997,11.539693 36.247337,11.397367 C36.205433,11.361786 36.175381,11.333851 36.160007,11.319179 C36.152321,11.311842 36.1483,11.307822 36.1483,11.307822 C36.1483,11.307822 36.045406,12.285447 36.032528,13.687622 C36.029308,14.038166 36.031731,14.415233 36.042778,14.810188 C36.048309,15.007668 36.055996,15.20962 36.066219,15.414962 C36.107128,16.23634 36.188622,17.111977 36.334846,17.972744 C36.407951,18.403131 36.49831,18.826811 36.604675,19.250301 C37.030174,20.944275 37.695244,22.631779 38.252693,24.467325 C38.53141,25.385077 38.783199,26.339832 38.964684,27.350826 C39.055428,27.856335 39.12859,28.375927 39.17873,28.911987 C39.203808,29.180021 39.223133,29.452175 39.236027,29.728754 C39.313969,31.400984 39.082863,32.706581 38.652042,33.72937 C38.54435,33.985023 38.424183,34.223026 38.293228,34.444633 C37.245674,36.217476 35.509064,36.941998 33.959427,37.286957 C33.57198,37.373203 33.196251,37.435719 32.845871,37.48497 C32.670689,37.509598 32.501835,37.530903 32.341034,37.550198 C29.768539,37.858883 25.75477,35.389519 25.75477,30.552256 C25.75477,28.738462 25.783726,26.736513 25.760197,24.91004 C25.728855,22.474806 25.604212,20.351408 25.193386,19.401888 C25.090685,19.164522 24.970089,19.0005 24.828577,18.923311 C24.545589,18.768948 24.269035,18.76893 24.013334,18.855778 L24,18.860909 L24,38.004997 L27,38.004997 L27,42.004997 L0,42.004997 L0,38.004997 L3.0000007,38.004997 L3.0000007,2.0049994 C2.9999893,0.90056473 3.8953815,0.0050031939 5.0000005,0.0049985927 L22,0.0049985927 C23.104679,0.0050031939 24,0.90043807 24,2.0049994 L24,14.854666 L24.238474,14.839113 C26.166895,14.772465 27.572838,15.691495 28.39201,17.866755 C28.801527,18.954315 29.064346,20.355766 29.172379,22.105011 C29.226393,22.979597 29.241722,23.941156 29.217354,24.993845 C29.20517,25.520189 29.183058,26.069315 29.1509,26.641764 C28.893612,31.221786 29.974562,33.048023 31.222088,33.678131 C31.378071,33.756912 31.536663,33.816998 31.695583,33.861431 C32.331322,34.039185 32.972206,33.966454 33.47197,33.837887 C33.721882,33.773598 33.936504,33.695354 34.097546,33.627457 C34.17807,33.593517 34.245205,33.562157 34.296665,33.536427 C35.119778,33.124931 36.663822,30.860832 34.811211,25.406099 C32.958721,19.951729 32.444397,14.909475 32.547298,13.262984 C32.650208,11.616405 32.547699,9.9700193 31.827284,8.735157 C31.647167,8.4264212 31.331963,7.9568949 30.944387,7.4117856 C30.314539,6.5259657 29.49366,5.4406085 28.750799,4.5213928 C28.293657,3.9557228 27.866068,3.4529479 27.530729,3.0983014 C27.446896,3.0096405 27.368832,2.9302397 27.297518,2.8614302 C27.26186,2.8270245 27.227888,2.7952664 27.195726,2.7663224 C26.938457,2.5347924 26.758305,2.2903709 26.648922,2.044323 C26.594234,1.9213079 26.557224,1.7978911 26.537106,1.6754751 C26.527046,1.6142684 26.521206,1.5533118 26.519485,1.4927813 C26.505737,1.008553 26.755676,0.55161005 27.217943,0.2119958 C27.275726,0.16954438 27.336826,0.12892602 27.401142,0.090316311 C27.465458,0.051707689 27.539827,0.025965234 27.623362,0.012159782 C27.665131,0.0052574514 27.709192,0.0013392377 27.755436,0.00028914632 z" Fill="White" Stretch="Fill" UseLayoutRounding="False" />
                                        </Grid>
                                        <TextBlock Text="E" FontSize="25" FontFamily="Arial" FontWeight="Bold" Foreground="#000000" Grid.Row="2" />
                                    </Grid>
                                </DataTemplate>
                            </c1:C1VolumeGauge.FaceTemplate>
                            <c1:C1GaugeMark Interval="20" Location="0.9" />
                            <c1:C1GaugeMark Interval="5" Location="0.9" />
                            <c1:C1GaugeLabel Interval="20" Alignment="Out" AlignmentOffset="15" Location="0.9" />
                        </c1:C1VolumeGauge>
                    </c1:C1TabItem>
                
                <!-- Knob -->
                <c1:C1TabItem Header="Knob">
                    <c1:C1Knob x:Name="knob" Height="300" Width="300" Margin="10" Minimum="0" Maximum="100" SweepAngle="270" InteractionMode="ClickOrDrag">
                        <c1:C1GaugeMark Interval="20" />
                        <c1:C1GaugeMark Interval="10" />
                        <c1:C1GaugeMark Interval="1" />
                        <c1:C1GaugeLabel Interval="20" Alignment="Out" AlignmentOffset="10" />
                    </c1:C1Knob>
                </c1:C1TabItem>

                </c1:C1TabControl>
        </c1:C1TabItem>
        
        <c1:C1TabItem Header="Others">
            <c1:C1TabControl TabItemShape="Rectangle" TabStripPlacement="Left" Margin="8 0 0 0" UnselectedContentMode="Collapsed">

                <!-- Maps -->
                <c1:C1TabItem Header="Maps">
                    <c1:C1Maps Zoom="3" Margin="20" />
                </c1:C1TabItem>

                <!-- CoverFlow -->
            <c1:C1TabItem Header="CoverFlow">
                <c1:C1CoverFlow x:Name="coverFlow" Margin="50 10 50 10" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" MaxHeight="500">
                    <c1:C1CoverFlow.ItemTemplate>
                        <DataTemplate>
                            <Border BorderThickness="3" CornerRadius="10" BorderBrush="#000000">
                                <Border.Background>
                                    <LinearGradientBrush EndPoint="0.966,0.951" StartPoint="0.04,0.065">
                                        <GradientStop Color="#FFCBCBCB" Offset="0.573" />
                                        <GradientStop Color="White" Offset="1" />
                                    </LinearGradientBrush>
                                </Border.Background>
                                <Border Margin="5" CornerRadius="5">
                                    <Border.Background>
                                        <LinearGradientBrush EndPoint="0.973,0.971" StartPoint="0.025,0.023">
                                            <GradientStop Color="#B2FFFFFF" />
                                            <GradientStop Color="#19000000" Offset="1" />
                                        </LinearGradientBrush>
                                    </Border.Background>
                                    <StackPanel VerticalAlignment="Top" Orientation="Vertical" HorizontalAlignment="Left" Margin="20">
                                        <TextBlock Text="{Binding Name}" TextWrapping="Wrap" FontSize="12" FontWeight="Bold" Style="{StaticResource LabelText}" Margin="0 0 0 15" />
                                        <Grid>
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition Width="Auto" />
                                                <ColumnDefinition />
                                            </Grid.ColumnDefinitions>
                                            <Border HorizontalAlignment="Left" VerticalAlignment="Center" Style="{StaticResource ItemStyle}">
                                                <Grid>
                                                    <Rectangle Stroke="#FF7E7E7E" RadiusY="1" Fill="White" RadiusX="1" />
                                                    <Rectangle Stroke="#FFABB1B3" RadiusY="1" Margin="3,3,3,9">
                                                        <Rectangle.Fill>
                                                            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                                                <GradientStop Color="#FFD7D7D7" />
                                                                <GradientStop Color="#FFFFFFFF" Offset="0.652" />
                                                            </LinearGradientBrush>
                                                        </Rectangle.Fill>
                                                    </Rectangle>
                                                    <Path Stretch="Fill" Stroke="{x:Null}" Margin="4,6,4,10" UseLayoutRounding="False" Data="M17.60116,6.1738421E-05 C24.849646,0.023804173 26.683809,6.5920992 26.299255,12.14412 C25.308187,19.035593 23.641359,20.055075 22.426523,20.763863 C22.011572,22.301838 22.281172,23.129519 22.872089,23.413864 C25.789896,24.566036 28.26816,25.747917 31.26363,26.867565 C33.701267,28.11087 34.777184,28.794552 35.861771,29.767353 L38.065468,34.026146 C38.065468,34.026146 -2.0894244,33.953915 -2.0894244,33.953915 L0,29.600348 L0.0063374043,29.592121 C0.76684761,28.636683 2.0420403,27.542118 4.10077,26.985603 C8.0647907,25.539055 10.515559,24.379763 11.685194,23.874727 C12.629223,23.317556 13.257205,21.523518 12.521232,20.930931 C10.421399,19.15081 8.8502626,17.703053 8.3638849,11.022204 C7.883646,6.7073164 10.405101,-0.023508755 17.60116,6.1738421E-05 z">
                                                        <Path.Fill>
                                                            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                                                <GradientStop Color="#FF516D7C" Offset="0.012" />
                                                                <GradientStop Color="#33516D7C" Offset="1" />
                                                            </LinearGradientBrush>
                                                        </Path.Fill>
                                                    </Path>
                                                    <Path Fill="#3FFFFFFF" Stretch="Fill" Data="M0,0 L21.185122,0 C21.588734,0.12784213 21.858183,0.39503863 22,0.79480571 L22,24 C18.573542,13.458178 11.15755,5.5119557 0,0 z" HorizontalAlignment="Left" VerticalAlignment="Top" UseLayoutRounding="False" />
                                                </Grid>
                                            </Border>
                                            <StackPanel Grid.Column="1">
                                                <StackPanel Orientation="Horizontal" Margin="10 0 0 0">
                                                    <TextBlock Text="{Binding Age}" Style="{StaticResource LabelText}" />
                                                    <TextBlock Text=" years old." Style="{StaticResource LabelText}" />
                                                </StackPanel>
                                                <TextBlock Text="{Binding Address}" Style="{StaticResource LabelText}" Margin="10 0 0 0" />
                                                <TextBlock Text="{Binding Residence}" Style="{StaticResource LabelText}" Margin="10 0 0 0" />
                                            </StackPanel>
                                        </Grid>
                                    </StackPanel>
                                </Border>
                            </Border>
                        </DataTemplate>
                    </c1:C1CoverFlow.ItemTemplate>
                </c1:C1CoverFlow>
            </c1:C1TabItem>

            <!-- MediaPlayer -->
            <c1:C1TabItem Header="Media Player">
                <c1:C1MediaPlayer x:Name="C1MediaPlayer" AutoPlay="False">
                    <c1:C1MediaItem MediaSource="http://video.ted.com/talks/podcast/HansRosling_2006.mp4" ThumbnailSource="Resources/HansRosling_2006.jpg" Title="Hans Rosling shows the best stats you've ever seen">
                        <c1:C1MediaChapter Title="Global life expectancies" Position="00:00:25" ThumbnailSource="Resources/HansRosling_2006_00_25.jpg" />
                        <c1:C1MediaChapter Title="World wealth" Position="00:06:18" ThumbnailSource="Resources/HansRosling_2006_06_18.jpg" />
                        <c1:C1MediaChapter Title="GDP and child death" Position="00:09:16" ThumbnailSource="Resources/HansRosling_2006_09_16.jpg" />
                        <c1:C1MediaChapter Title="How can we use this data?" Position="00:15:04" ThumbnailSource="Resources/HansRosling_2006_15_04.jpg" />
                    </c1:C1MediaItem>
                </c1:C1MediaPlayer>
            </c1:C1TabItem>
                    </c1:C1TabControl>
        </c1:C1TabItem>

    </c1:C1TabControl>
</UserControl>