<?php

use Twig\Environment;
use Twig\Error\LoaderError;
use Twig\Error\RuntimeError;
use Twig\Extension\SandboxExtension;
use Twig\Markup;
use Twig\Sandbox\SecurityError;
use Twig\Sandbox\SecurityNotAllowedTagError;
use Twig\Sandbox\SecurityNotAllowedFilterError;
use Twig\Sandbox\SecurityNotAllowedFunctionError;
use Twig\Source;
use Twig\Template;

/* ui-avatars.html.twig */
class __TwigTemplate_846e6ac7165e77dbd06dfd2f32c31086 extends Template
{
    private $source;
    private $macros = [];

    public function __construct(Environment $env)
    {
        parent::__construct($env);

        $this->source = $this->getSourceContext();

        $this->blocks = [
            'title' => [$this, 'block_title'],
            'css' => [$this, 'block_css'],
            'pagetitle' => [$this, 'block_pagetitle'],
            'body' => [$this, 'block_body'],
        ];
    }

    protected function doGetParent(array $context)
    {
        // line 1
        return "partials/layout-vertical.html.twig";
    }

    protected function doDisplay(array $context, array $blocks = [])
    {
        $macros = $this->macros;
        $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
        $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template", "ui-avatars.html.twig"));

        $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
        $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "template", "ui-avatars.html.twig"));

        $this->parent = $this->loadTemplate("partials/layout-vertical.html.twig", "ui-avatars.html.twig", 1);
        $this->parent->display($context, array_merge($this->blocks, $blocks));
        
        $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);

        
        $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);

    }

    // line 3
    public function block_title($context, array $blocks = [])
    {
        $macros = $this->macros;
        $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
        $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "title"));

        $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
        $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "title"));

        echo "Avatars
";
        
        $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);

        
        $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);

    }

    // line 6
    public function block_css($context, array $blocks = [])
    {
        $macros = $this->macros;
        $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
        $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "css"));

        $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
        $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "css"));

        
        $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);

        
        $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);

    }

    // line 8
    public function block_pagetitle($context, array $blocks = [])
    {
        $macros = $this->macros;
        $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
        $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "pagetitle"));

        $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
        $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "pagetitle"));

        // line 9
        echo "\t";
        echo twig_include($this->env, $context, "partials/page-title.html.twig", ["sub_title" => "Base UI", "page_title" => "Avatars"]);
        echo "
";
        
        $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);

        
        $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);

    }

    // line 12
    public function block_body($context, array $blocks = [])
    {
        $macros = $this->macros;
        $__internal_5a27a8ba21ca79b61932376b2fa922d2 = $this->extensions["Symfony\\Bundle\\WebProfilerBundle\\Twig\\WebProfilerExtension"];
        $__internal_5a27a8ba21ca79b61932376b2fa922d2->enter($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "body"));

        $__internal_6f47bbe9983af81f1e7450e9a3e3768f = $this->extensions["Symfony\\Bridge\\Twig\\Extension\\ProfilerExtension"];
        $__internal_6f47bbe9983af81f1e7450e9a3e3768f->enter($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof = new \Twig\Profiler\Profile($this->getTemplateName(), "block", "body"));

        // line 13
        echo "
\t<div class=\"row\">
\t\t<div class=\"col-xxl-6\">
\t\t\t<div class=\"card\">
\t\t\t\t<div class=\"card-body\">
\t\t\t\t\t<h4 class=\"header-title\">Sizing - Images</h4>
\t\t\t\t\t<p class=\"text-muted fs-14 mb-3\">
\t\t\t\t\t\tCreate and group avatars of different sizes and shapes with the css classes.
\t\t\t\t\t\t                                            Using Bootstrap's naming convention, you can control size of avatar including standard avatar, or scale it up to different sizes.
\t\t\t\t\t</p>

\t\t\t\t\t<div class=\"row\">
\t\t\t\t\t\t<div class=\"col-md-3\">
\t\t\t\t\t\t\t<img src=\"/images/users/avatar-2.jpg\" alt=\"image\" class=\"img-fluid avatar-xs rounded\">
\t\t\t\t\t\t\t<p>
\t\t\t\t\t\t\t\t<code>.avatar-xs</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t\t<img src=\"/images/users/avatar-3.jpg\" alt=\"image\" class=\"img-fluid avatar-sm rounded mt-2\">
\t\t\t\t\t\t\t<p class=\"mb-2 mb-sm-0\">
\t\t\t\t\t\t\t\t<code>.avatar-sm</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>
\t\t\t\t\t\t<div class=\"col-md-3\">
\t\t\t\t\t\t\t<img src=\"/images/users/avatar-4.jpg\" alt=\"image\" class=\"img-fluid avatar-md rounded\"/>
\t\t\t\t\t\t\t<p>
\t\t\t\t\t\t\t\t<code>.avatar-md</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>

\t\t\t\t\t\t<div class=\"col-md-3\">
\t\t\t\t\t\t\t<img src=\"/images/users/avatar-5.jpg\" alt=\"image\" class=\"img-fluid avatar-lg rounded\"/>
\t\t\t\t\t\t\t<p>
\t\t\t\t\t\t\t\t<code>.avatar-lg</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>

\t\t\t\t\t\t<div class=\"col-md-3\">
\t\t\t\t\t\t\t<img src=\"/images/users/avatar-6.jpg\" alt=\"image\" class=\"img-fluid avatar-xl rounded\"/>
\t\t\t\t\t\t\t<p class=\"mb-0\">
\t\t\t\t\t\t\t\t<code>.avatar-xl</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>
\t\t\t\t\t</div>
\t\t\t\t\t<!-- end row-->

\t\t\t\t</div>
\t\t\t</div>
\t\t</div>
\t\t<div class=\"col-xxl-6\">
\t\t\t<div class=\"card\">
\t\t\t\t<div class=\"card-body\">
\t\t\t\t\t<h4 class=\"header-title\">Rounded Circle</h4>
\t\t\t\t\t<p class=\"text-muted fs-14 mb-3\">
\t\t\t\t\t\tUsing an additional class
\t\t\t\t\t\t<code>.rounded-circle</code>
\t\t\t\t\t\tin
\t\t\t\t\t\t<code>&lt;img&gt;</code>
\t\t\t\t\t\telement creates the rounded avatar.
\t\t\t\t\t</p>

\t\t\t\t\t<div class=\"row\">
\t\t\t\t\t\t<div class=\"col-md-4\">
\t\t\t\t\t\t\t<img src=\"/images/users/avatar-7.jpg\" alt=\"image\" class=\"img-fluid avatar-md rounded-circle\"/>
\t\t\t\t\t\t\t<p class=\"mt-1\">
\t\t\t\t\t\t\t\t<code>.avatar-md .rounded-circle</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>

\t\t\t\t\t\t<div class=\"col-md-4\">
\t\t\t\t\t\t\t<img src=\"/images/users/avatar-8.jpg\" alt=\"image\" class=\"img-fluid avatar-lg rounded-circle\"/>
\t\t\t\t\t\t\t<p>
\t\t\t\t\t\t\t\t<code>.avatar-lg .rounded-circle</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>

\t\t\t\t\t\t<div class=\"col-md-4\">
\t\t\t\t\t\t\t<img src=\"/images/users/avatar-9.jpg\" alt=\"image\" class=\"img-fluid avatar-xl rounded-circle\"/>
\t\t\t\t\t\t\t<p class=\"mb-0\">
\t\t\t\t\t\t\t\t<code>.avatar-xl .rounded-circle</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>
\t\t\t\t\t</div>
\t\t\t\t\t<!-- end row-->

\t\t\t\t</div>
\t\t\t</div>
\t\t</div>
\t</div>
\t<!-- end row -->

\t<div class=\"row\">
\t\t<div class=\"col-xxl-6\">
\t\t\t<div class=\"card\">
\t\t\t\t<div class=\"card-body\">
\t\t\t\t\t<h4 class=\"header-title\">Sizing - Background Color</h4>
\t\t\t\t\t<p class=\"text-muted fs-14 mb-3\">
\t\t\t\t\t\tUsing utilities classes of background e.g.
\t\t\t\t\t\t<code>bg-*</code>
\t\t\t\t\t\tallows you to have any background color as well.
\t\t\t\t\t</p>

\t\t\t\t\t<div class=\"row\">
\t\t\t\t\t\t<div class=\"col-md-3\">
\t\t\t\t\t\t\t<div class=\"avatar-xs\">
\t\t\t\t\t\t\t\t<span class=\"avatar-title rounded\">
\t\t\t\t\t\t\t\t\txs
\t\t\t\t\t\t\t\t</span>
\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t<p class=\"mb-2 fs-14 mt-1\">
\t\t\t\t\t\t\t\tUsing
\t\t\t\t\t\t\t\t<code>.avatar-xs</code>
\t\t\t\t\t\t\t</p>

\t\t\t\t\t\t\t<div class=\"avatar-sm mt-3\">
\t\t\t\t\t\t\t\t<span class=\"avatar-title bg-success rounded\">
\t\t\t\t\t\t\t\t\tsm
\t\t\t\t\t\t\t\t</span>
\t\t\t\t\t\t\t</div>

\t\t\t\t\t\t\t<p class=\"mb-0 fs-14 mt-1\">
\t\t\t\t\t\t\t\tUsing
\t\t\t\t\t\t\t\t<code>.avatar-sm</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>
\t\t\t\t\t\t<div class=\"col-md-3\">
\t\t\t\t\t\t\t<div class=\"avatar-md\">
\t\t\t\t\t\t\t\t<span class=\"avatar-title bg-info-subtle text-info fs-20 rounded\">
\t\t\t\t\t\t\t\t\tMD
\t\t\t\t\t\t\t\t</span>
\t\t\t\t\t\t\t</div>

\t\t\t\t\t\t\t<p class=\"mb-0 fs-14 mt-1\">
\t\t\t\t\t\t\t\tUsing
\t\t\t\t\t\t\t\t<code>.avatar-md</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>

\t\t\t\t\t\t<div class=\"col-md-3\">
\t\t\t\t\t\t\t<div class=\"avatar-lg\">
\t\t\t\t\t\t\t\t<span class=\"avatar-title bg-danger fs-22 rounded\">
\t\t\t\t\t\t\t\t\tLG
\t\t\t\t\t\t\t\t</span>
\t\t\t\t\t\t\t</div>

\t\t\t\t\t\t\t<p class=\"mb-0 fs-14 mt-1\">
\t\t\t\t\t\t\t\tUsing
\t\t\t\t\t\t\t\t<code>.avatar-lg</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>

\t\t\t\t\t\t<div class=\"col-md-3\">
\t\t\t\t\t\t\t<div class=\"avatar-xl\">
\t\t\t\t\t\t\t\t<span class=\"avatar-title bg-warning-subtle text-warning fs-24 rounded\">
\t\t\t\t\t\t\t\t\tXL
\t\t\t\t\t\t\t\t</span>
\t\t\t\t\t\t\t</div>

\t\t\t\t\t\t\t<p class=\"mb-0 fs-14 mt-1\">
\t\t\t\t\t\t\t\tUsing
\t\t\t\t\t\t\t\t<code>.avatar-xl</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>
\t\t\t\t\t</div>
\t\t\t\t\t<!-- end row-->

\t\t\t\t</div>
\t\t\t</div>
\t\t</div>
\t\t<div class=\"col-xxl-6\">
\t\t\t<div class=\"card\">
\t\t\t\t<div class=\"card-body\">
\t\t\t\t\t<h4 class=\"header-title\">Rounded Circle Background</h4>
\t\t\t\t\t<p class=\"text-muted fs-14 mb-3\">
\t\t\t\t\t\tUsing an additional class
\t\t\t\t\t\t<code>.rounded-circle</code>
\t\t\t\t\t\tin
\t\t\t\t\t\t<code>&lt;img&gt;</code>
\t\t\t\t\t\telement creates the rounded avatar.
\t\t\t\t\t</p>

\t\t\t\t\t<div class=\"row\">
\t\t\t\t\t\t<div class=\"col-md-4\">
\t\t\t\t\t\t\t<div class=\"avatar-md\">
\t\t\t\t\t\t\t\t<span class=\"avatar-title bg-secondary-subtle text-secondary fs-20 rounded-circle\">
\t\t\t\t\t\t\t\t\tMD
\t\t\t\t\t\t\t\t</span>
\t\t\t\t\t\t\t</div>

\t\t\t\t\t\t\t<p class=\"mb-0 fs-14 mt-1\">
\t\t\t\t\t\t\t\tUsing
\t\t\t\t\t\t\t\t<code>.avatar-md .rounded-circle</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>

\t\t\t\t\t\t<div class=\"col-md-4\">
\t\t\t\t\t\t\t<div class=\"avatar-lg\">
\t\t\t\t\t\t\t\t<span class=\"avatar-title bg-light text-dark fs-22 rounded-circle\">
\t\t\t\t\t\t\t\t\tLG
\t\t\t\t\t\t\t\t</span>
\t\t\t\t\t\t\t</div>

\t\t\t\t\t\t\t<p class=\"mb-0 fs-14 mt-1\">
\t\t\t\t\t\t\t\tUsing
\t\t\t\t\t\t\t\t<code>.avatar-lg .rounded-circle</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>

\t\t\t\t\t\t<div class=\"col-md-4\">
\t\t\t\t\t\t\t<div class=\"avatar-xl\">
\t\t\t\t\t\t\t\t<span class=\"avatar-title bg-primary-subtle text-primary fs-24 rounded-circle\">
\t\t\t\t\t\t\t\t\tXL
\t\t\t\t\t\t\t\t</span>
\t\t\t\t\t\t\t</div>

\t\t\t\t\t\t\t<p class=\"mb-0 fs-14 mt-1\">
\t\t\t\t\t\t\t\tUsing
\t\t\t\t\t\t\t\t<code>.avatar-xl .rounded-circle</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>
\t\t\t\t\t</div>
\t\t\t\t\t<!-- end row-->

\t\t\t\t</div>
\t\t\t</div>
\t\t</div>
\t</div>
\t<!-- end row -->

\t<div class=\"row\">
\t\t<div class=\"col-12\">
\t\t\t<div class=\"card\">
\t\t\t\t<div class=\"card-body\">
\t\t\t\t\t<h4 class=\"header-title\">Images Shapes</h4>
\t\t\t\t\t<p class=\"text-muted fs-14 mb-3\">
\t\t\t\t\t\tAvatars with different sizes and shapes.
\t\t\t\t\t</p>

\t\t\t\t\t<div class=\"row\">
\t\t\t\t\t\t<div class=\"col-sm-2\">
\t\t\t\t\t\t\t<img src=\"/images/small/small-2.jpg\" alt=\"image\" class=\"img-fluid rounded\" width=\"200\"/>
\t\t\t\t\t\t\t<p class=\"mb-0\">
\t\t\t\t\t\t\t\t<code>.rounded</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>

\t\t\t\t\t\t<div class=\"col-sm-2 text-center\">
\t\t\t\t\t\t\t<img src=\"/images/users/avatar-6.jpg\" alt=\"image\" class=\"img-fluid rounded\" width=\"120\"/>
\t\t\t\t\t\t\t<p class=\"mb-0\">
\t\t\t\t\t\t\t\t<code>.rounded</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>

\t\t\t\t\t\t<div class=\"col-sm-2 text-center\">
\t\t\t\t\t\t\t<img src=\"/images/users/avatar-7.jpg\" alt=\"image\" class=\"img-fluid rounded-circle\" width=\"120\"/>
\t\t\t\t\t\t\t<p class=\"mb-0\">
\t\t\t\t\t\t\t\t<code>.rounded-circle</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>

\t\t\t\t\t\t<div class=\"col-sm-2\">
\t\t\t\t\t\t\t<img src=\"/images/small/small-3.jpg\" alt=\"image\" class=\"img-fluid img-thumbnail\" width=\"200\"/>
\t\t\t\t\t\t\t<p class=\"mb-0\">
\t\t\t\t\t\t\t\t<code>.img-thumbnail</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>
\t\t\t\t\t\t<div class=\"col-sm-2\">
\t\t\t\t\t\t\t<img src=\"/images/users/avatar-8.jpg\" alt=\"image\" class=\"img-fluid rounded-circle img-thumbnail\" width=\"120\"/>
\t\t\t\t\t\t\t<p class=\"mb-0\">
\t\t\t\t\t\t\t\t<code>.rounded-circle .img-thumbnail</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>
\t\t\t\t\t</div>
\t\t\t\t\t<!-- end row-->

\t\t\t\t</div>
\t\t\t</div>
\t\t</div>
\t</div>
\t<!-- end row -->

\t<div class=\"row\">
\t\t<div class=\"col-lg-12\">
\t\t\t<div class=\"card\">
\t\t\t\t<div class=\"card-body\">
\t\t\t\t\t<h4 class=\"header-title\">Avatar Group</h4>
\t\t\t\t\t<p class=\"text-muted fs-14 mb-3\">
\t\t\t\t\t\tUse
\t\t\t\t\t\t<code>avatar-group</code>
\t\t\t\t\t\tclass to show avatar
\t\t\t\t\t\t                                                images with the group. Use
\t\t\t\t\t\t<code>avatar-group</code>
\t\t\t\t\t\tclass with
\t\t\t\t\t\t<code>data-bs-toggle=\"tooltip\"</code>
\t\t\t\t\t\tto show avatar group images
\t\t\t\t\t\t                                                with tooltip.
\t\t\t\t\t</p>
\t\t\t\t\t<div class=\"row\">
\t\t\t\t\t\t<div class=\"col-lg-6\">
\t\t\t\t\t\t\t<div class=\"mt-lg-0 mt-3\">
\t\t\t\t\t\t\t\t<div class=\"avatar-group\">
\t\t\t\t\t\t\t\t\t<div class=\"avatar-group-item\">
\t\t\t\t\t\t\t\t\t\t<img src=\"/images/users/avatar-4.jpg\" alt=\"\" class=\"rounded-circle avatar-xs\">
\t\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t\t\t<div class=\"avatar-group-item\">
\t\t\t\t\t\t\t\t\t\t<img src=\"/images/users/avatar-5.jpg\" alt=\"\" class=\"rounded-circle avatar-xs\">
\t\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t\t\t<div class=\"avatar-group-item\">
\t\t\t\t\t\t\t\t\t\t<div class=\"avatar-xs\">
\t\t\t\t\t\t\t\t\t\t\t<div class=\"avatar-title rounded-circle text-bg-info\">
\t\t\t\t\t\t\t\t\t\t\t\tA
\t\t\t\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t\t\t<div class=\"avatar-group-item\">
\t\t\t\t\t\t\t\t\t\t<img src=\"/images/users/avatar-2.jpg\" alt=\"\" class=\"rounded-circle avatar-xs\">
\t\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t</div>
\t\t\t\t\t\t<!--end col-->

\t\t\t\t\t\t<div class=\"col-lg-6\">
\t\t\t\t\t\t\t<div class=\"mt-lg-0 mt-3\">
\t\t\t\t\t\t\t\t<div class=\"avatar-group\">
\t\t\t\t\t\t\t\t\t<a href=\"javascript: void(0);\" class=\"avatar-group-item\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" title=\"Tosha\">
\t\t\t\t\t\t\t\t\t\t<img src=\"/images/users/avatar-1.jpg\" alt=\"\" class=\"rounded-circle avatar-sm\">
\t\t\t\t\t\t\t\t\t</a>
\t\t\t\t\t\t\t\t\t<a href=\"javascript: void(0);\" class=\"avatar-group-item\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" title=\"Brain\">
\t\t\t\t\t\t\t\t\t\t<img src=\"/images/users/avatar-3.jpg\" alt=\"\" class=\"rounded-circle avatar-sm\">
\t\t\t\t\t\t\t\t\t</a>
\t\t\t\t\t\t\t\t\t<a href=\"javascript: void(0);\" class=\"avatar-group-item\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" title=\"Hooker\">
\t\t\t\t\t\t\t\t\t\t<div class=\"avatar-sm\">
\t\t\t\t\t\t\t\t\t\t\t<div class=\"avatar-title rounded-circle bg-light text-primary\">
\t\t\t\t\t\t\t\t\t\t\t\tK
\t\t\t\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t\t\t</a>
\t\t\t\t\t\t\t\t\t<a href=\"javascript: void(0);\" class=\"avatar-group-item\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" title=\"More +\">
\t\t\t\t\t\t\t\t\t\t<div class=\"avatar-sm\">
\t\t\t\t\t\t\t\t\t\t\t<div class=\"avatar-title rounded-circle\">
\t\t\t\t\t\t\t\t\t\t\t\t9+
\t\t\t\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t\t\t</a>
\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t</div>
\t\t\t\t\t\t<!--end col-->
\t\t\t\t\t</div>
\t\t\t\t\t<!--end row-->
\t\t\t\t</div>
\t\t\t\t<!-- end card body -->
\t\t\t</div>
\t\t</div>
\t\t<!-- end col -->
\t</div>
\t<!-- end row -->

";
        
        $__internal_6f47bbe9983af81f1e7450e9a3e3768f->leave($__internal_6f47bbe9983af81f1e7450e9a3e3768f_prof);

        
        $__internal_5a27a8ba21ca79b61932376b2fa922d2->leave($__internal_5a27a8ba21ca79b61932376b2fa922d2_prof);

    }

    public function getTemplateName()
    {
        return "ui-avatars.html.twig";
    }

    public function isTraitable()
    {
        return false;
    }

    public function getDebugInfo()
    {
        return array (  132 => 13,  122 => 12,  109 => 9,  99 => 8,  81 => 6,  61 => 3,  38 => 1,);
    }

    public function getSourceContext()
    {
        return new Source("{% extends 'partials/layout-vertical.html.twig' %}

{% block title %}Avatars
{% endblock %}

{% block css %}{% endblock %}

{% block pagetitle %}
\t{{ include('partials/page-title.html.twig', { sub_title: 'Base UI', page_title: 'Avatars' }) }}
{% endblock %}

{% block body %}

\t<div class=\"row\">
\t\t<div class=\"col-xxl-6\">
\t\t\t<div class=\"card\">
\t\t\t\t<div class=\"card-body\">
\t\t\t\t\t<h4 class=\"header-title\">Sizing - Images</h4>
\t\t\t\t\t<p class=\"text-muted fs-14 mb-3\">
\t\t\t\t\t\tCreate and group avatars of different sizes and shapes with the css classes.
\t\t\t\t\t\t                                            Using Bootstrap's naming convention, you can control size of avatar including standard avatar, or scale it up to different sizes.
\t\t\t\t\t</p>

\t\t\t\t\t<div class=\"row\">
\t\t\t\t\t\t<div class=\"col-md-3\">
\t\t\t\t\t\t\t<img src=\"/images/users/avatar-2.jpg\" alt=\"image\" class=\"img-fluid avatar-xs rounded\">
\t\t\t\t\t\t\t<p>
\t\t\t\t\t\t\t\t<code>.avatar-xs</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t\t<img src=\"/images/users/avatar-3.jpg\" alt=\"image\" class=\"img-fluid avatar-sm rounded mt-2\">
\t\t\t\t\t\t\t<p class=\"mb-2 mb-sm-0\">
\t\t\t\t\t\t\t\t<code>.avatar-sm</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>
\t\t\t\t\t\t<div class=\"col-md-3\">
\t\t\t\t\t\t\t<img src=\"/images/users/avatar-4.jpg\" alt=\"image\" class=\"img-fluid avatar-md rounded\"/>
\t\t\t\t\t\t\t<p>
\t\t\t\t\t\t\t\t<code>.avatar-md</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>

\t\t\t\t\t\t<div class=\"col-md-3\">
\t\t\t\t\t\t\t<img src=\"/images/users/avatar-5.jpg\" alt=\"image\" class=\"img-fluid avatar-lg rounded\"/>
\t\t\t\t\t\t\t<p>
\t\t\t\t\t\t\t\t<code>.avatar-lg</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>

\t\t\t\t\t\t<div class=\"col-md-3\">
\t\t\t\t\t\t\t<img src=\"/images/users/avatar-6.jpg\" alt=\"image\" class=\"img-fluid avatar-xl rounded\"/>
\t\t\t\t\t\t\t<p class=\"mb-0\">
\t\t\t\t\t\t\t\t<code>.avatar-xl</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>
\t\t\t\t\t</div>
\t\t\t\t\t<!-- end row-->

\t\t\t\t</div>
\t\t\t</div>
\t\t</div>
\t\t<div class=\"col-xxl-6\">
\t\t\t<div class=\"card\">
\t\t\t\t<div class=\"card-body\">
\t\t\t\t\t<h4 class=\"header-title\">Rounded Circle</h4>
\t\t\t\t\t<p class=\"text-muted fs-14 mb-3\">
\t\t\t\t\t\tUsing an additional class
\t\t\t\t\t\t<code>.rounded-circle</code>
\t\t\t\t\t\tin
\t\t\t\t\t\t<code>&lt;img&gt;</code>
\t\t\t\t\t\telement creates the rounded avatar.
\t\t\t\t\t</p>

\t\t\t\t\t<div class=\"row\">
\t\t\t\t\t\t<div class=\"col-md-4\">
\t\t\t\t\t\t\t<img src=\"/images/users/avatar-7.jpg\" alt=\"image\" class=\"img-fluid avatar-md rounded-circle\"/>
\t\t\t\t\t\t\t<p class=\"mt-1\">
\t\t\t\t\t\t\t\t<code>.avatar-md .rounded-circle</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>

\t\t\t\t\t\t<div class=\"col-md-4\">
\t\t\t\t\t\t\t<img src=\"/images/users/avatar-8.jpg\" alt=\"image\" class=\"img-fluid avatar-lg rounded-circle\"/>
\t\t\t\t\t\t\t<p>
\t\t\t\t\t\t\t\t<code>.avatar-lg .rounded-circle</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>

\t\t\t\t\t\t<div class=\"col-md-4\">
\t\t\t\t\t\t\t<img src=\"/images/users/avatar-9.jpg\" alt=\"image\" class=\"img-fluid avatar-xl rounded-circle\"/>
\t\t\t\t\t\t\t<p class=\"mb-0\">
\t\t\t\t\t\t\t\t<code>.avatar-xl .rounded-circle</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>
\t\t\t\t\t</div>
\t\t\t\t\t<!-- end row-->

\t\t\t\t</div>
\t\t\t</div>
\t\t</div>
\t</div>
\t<!-- end row -->

\t<div class=\"row\">
\t\t<div class=\"col-xxl-6\">
\t\t\t<div class=\"card\">
\t\t\t\t<div class=\"card-body\">
\t\t\t\t\t<h4 class=\"header-title\">Sizing - Background Color</h4>
\t\t\t\t\t<p class=\"text-muted fs-14 mb-3\">
\t\t\t\t\t\tUsing utilities classes of background e.g.
\t\t\t\t\t\t<code>bg-*</code>
\t\t\t\t\t\tallows you to have any background color as well.
\t\t\t\t\t</p>

\t\t\t\t\t<div class=\"row\">
\t\t\t\t\t\t<div class=\"col-md-3\">
\t\t\t\t\t\t\t<div class=\"avatar-xs\">
\t\t\t\t\t\t\t\t<span class=\"avatar-title rounded\">
\t\t\t\t\t\t\t\t\txs
\t\t\t\t\t\t\t\t</span>
\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t<p class=\"mb-2 fs-14 mt-1\">
\t\t\t\t\t\t\t\tUsing
\t\t\t\t\t\t\t\t<code>.avatar-xs</code>
\t\t\t\t\t\t\t</p>

\t\t\t\t\t\t\t<div class=\"avatar-sm mt-3\">
\t\t\t\t\t\t\t\t<span class=\"avatar-title bg-success rounded\">
\t\t\t\t\t\t\t\t\tsm
\t\t\t\t\t\t\t\t</span>
\t\t\t\t\t\t\t</div>

\t\t\t\t\t\t\t<p class=\"mb-0 fs-14 mt-1\">
\t\t\t\t\t\t\t\tUsing
\t\t\t\t\t\t\t\t<code>.avatar-sm</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>
\t\t\t\t\t\t<div class=\"col-md-3\">
\t\t\t\t\t\t\t<div class=\"avatar-md\">
\t\t\t\t\t\t\t\t<span class=\"avatar-title bg-info-subtle text-info fs-20 rounded\">
\t\t\t\t\t\t\t\t\tMD
\t\t\t\t\t\t\t\t</span>
\t\t\t\t\t\t\t</div>

\t\t\t\t\t\t\t<p class=\"mb-0 fs-14 mt-1\">
\t\t\t\t\t\t\t\tUsing
\t\t\t\t\t\t\t\t<code>.avatar-md</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>

\t\t\t\t\t\t<div class=\"col-md-3\">
\t\t\t\t\t\t\t<div class=\"avatar-lg\">
\t\t\t\t\t\t\t\t<span class=\"avatar-title bg-danger fs-22 rounded\">
\t\t\t\t\t\t\t\t\tLG
\t\t\t\t\t\t\t\t</span>
\t\t\t\t\t\t\t</div>

\t\t\t\t\t\t\t<p class=\"mb-0 fs-14 mt-1\">
\t\t\t\t\t\t\t\tUsing
\t\t\t\t\t\t\t\t<code>.avatar-lg</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>

\t\t\t\t\t\t<div class=\"col-md-3\">
\t\t\t\t\t\t\t<div class=\"avatar-xl\">
\t\t\t\t\t\t\t\t<span class=\"avatar-title bg-warning-subtle text-warning fs-24 rounded\">
\t\t\t\t\t\t\t\t\tXL
\t\t\t\t\t\t\t\t</span>
\t\t\t\t\t\t\t</div>

\t\t\t\t\t\t\t<p class=\"mb-0 fs-14 mt-1\">
\t\t\t\t\t\t\t\tUsing
\t\t\t\t\t\t\t\t<code>.avatar-xl</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>
\t\t\t\t\t</div>
\t\t\t\t\t<!-- end row-->

\t\t\t\t</div>
\t\t\t</div>
\t\t</div>
\t\t<div class=\"col-xxl-6\">
\t\t\t<div class=\"card\">
\t\t\t\t<div class=\"card-body\">
\t\t\t\t\t<h4 class=\"header-title\">Rounded Circle Background</h4>
\t\t\t\t\t<p class=\"text-muted fs-14 mb-3\">
\t\t\t\t\t\tUsing an additional class
\t\t\t\t\t\t<code>.rounded-circle</code>
\t\t\t\t\t\tin
\t\t\t\t\t\t<code>&lt;img&gt;</code>
\t\t\t\t\t\telement creates the rounded avatar.
\t\t\t\t\t</p>

\t\t\t\t\t<div class=\"row\">
\t\t\t\t\t\t<div class=\"col-md-4\">
\t\t\t\t\t\t\t<div class=\"avatar-md\">
\t\t\t\t\t\t\t\t<span class=\"avatar-title bg-secondary-subtle text-secondary fs-20 rounded-circle\">
\t\t\t\t\t\t\t\t\tMD
\t\t\t\t\t\t\t\t</span>
\t\t\t\t\t\t\t</div>

\t\t\t\t\t\t\t<p class=\"mb-0 fs-14 mt-1\">
\t\t\t\t\t\t\t\tUsing
\t\t\t\t\t\t\t\t<code>.avatar-md .rounded-circle</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>

\t\t\t\t\t\t<div class=\"col-md-4\">
\t\t\t\t\t\t\t<div class=\"avatar-lg\">
\t\t\t\t\t\t\t\t<span class=\"avatar-title bg-light text-dark fs-22 rounded-circle\">
\t\t\t\t\t\t\t\t\tLG
\t\t\t\t\t\t\t\t</span>
\t\t\t\t\t\t\t</div>

\t\t\t\t\t\t\t<p class=\"mb-0 fs-14 mt-1\">
\t\t\t\t\t\t\t\tUsing
\t\t\t\t\t\t\t\t<code>.avatar-lg .rounded-circle</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>

\t\t\t\t\t\t<div class=\"col-md-4\">
\t\t\t\t\t\t\t<div class=\"avatar-xl\">
\t\t\t\t\t\t\t\t<span class=\"avatar-title bg-primary-subtle text-primary fs-24 rounded-circle\">
\t\t\t\t\t\t\t\t\tXL
\t\t\t\t\t\t\t\t</span>
\t\t\t\t\t\t\t</div>

\t\t\t\t\t\t\t<p class=\"mb-0 fs-14 mt-1\">
\t\t\t\t\t\t\t\tUsing
\t\t\t\t\t\t\t\t<code>.avatar-xl .rounded-circle</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>
\t\t\t\t\t</div>
\t\t\t\t\t<!-- end row-->

\t\t\t\t</div>
\t\t\t</div>
\t\t</div>
\t</div>
\t<!-- end row -->

\t<div class=\"row\">
\t\t<div class=\"col-12\">
\t\t\t<div class=\"card\">
\t\t\t\t<div class=\"card-body\">
\t\t\t\t\t<h4 class=\"header-title\">Images Shapes</h4>
\t\t\t\t\t<p class=\"text-muted fs-14 mb-3\">
\t\t\t\t\t\tAvatars with different sizes and shapes.
\t\t\t\t\t</p>

\t\t\t\t\t<div class=\"row\">
\t\t\t\t\t\t<div class=\"col-sm-2\">
\t\t\t\t\t\t\t<img src=\"/images/small/small-2.jpg\" alt=\"image\" class=\"img-fluid rounded\" width=\"200\"/>
\t\t\t\t\t\t\t<p class=\"mb-0\">
\t\t\t\t\t\t\t\t<code>.rounded</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>

\t\t\t\t\t\t<div class=\"col-sm-2 text-center\">
\t\t\t\t\t\t\t<img src=\"/images/users/avatar-6.jpg\" alt=\"image\" class=\"img-fluid rounded\" width=\"120\"/>
\t\t\t\t\t\t\t<p class=\"mb-0\">
\t\t\t\t\t\t\t\t<code>.rounded</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>

\t\t\t\t\t\t<div class=\"col-sm-2 text-center\">
\t\t\t\t\t\t\t<img src=\"/images/users/avatar-7.jpg\" alt=\"image\" class=\"img-fluid rounded-circle\" width=\"120\"/>
\t\t\t\t\t\t\t<p class=\"mb-0\">
\t\t\t\t\t\t\t\t<code>.rounded-circle</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>

\t\t\t\t\t\t<div class=\"col-sm-2\">
\t\t\t\t\t\t\t<img src=\"/images/small/small-3.jpg\" alt=\"image\" class=\"img-fluid img-thumbnail\" width=\"200\"/>
\t\t\t\t\t\t\t<p class=\"mb-0\">
\t\t\t\t\t\t\t\t<code>.img-thumbnail</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>
\t\t\t\t\t\t<div class=\"col-sm-2\">
\t\t\t\t\t\t\t<img src=\"/images/users/avatar-8.jpg\" alt=\"image\" class=\"img-fluid rounded-circle img-thumbnail\" width=\"120\"/>
\t\t\t\t\t\t\t<p class=\"mb-0\">
\t\t\t\t\t\t\t\t<code>.rounded-circle .img-thumbnail</code>
\t\t\t\t\t\t\t</p>
\t\t\t\t\t\t</div>
\t\t\t\t\t</div>
\t\t\t\t\t<!-- end row-->

\t\t\t\t</div>
\t\t\t</div>
\t\t</div>
\t</div>
\t<!-- end row -->

\t<div class=\"row\">
\t\t<div class=\"col-lg-12\">
\t\t\t<div class=\"card\">
\t\t\t\t<div class=\"card-body\">
\t\t\t\t\t<h4 class=\"header-title\">Avatar Group</h4>
\t\t\t\t\t<p class=\"text-muted fs-14 mb-3\">
\t\t\t\t\t\tUse
\t\t\t\t\t\t<code>avatar-group</code>
\t\t\t\t\t\tclass to show avatar
\t\t\t\t\t\t                                                images with the group. Use
\t\t\t\t\t\t<code>avatar-group</code>
\t\t\t\t\t\tclass with
\t\t\t\t\t\t<code>data-bs-toggle=\"tooltip\"</code>
\t\t\t\t\t\tto show avatar group images
\t\t\t\t\t\t                                                with tooltip.
\t\t\t\t\t</p>
\t\t\t\t\t<div class=\"row\">
\t\t\t\t\t\t<div class=\"col-lg-6\">
\t\t\t\t\t\t\t<div class=\"mt-lg-0 mt-3\">
\t\t\t\t\t\t\t\t<div class=\"avatar-group\">
\t\t\t\t\t\t\t\t\t<div class=\"avatar-group-item\">
\t\t\t\t\t\t\t\t\t\t<img src=\"/images/users/avatar-4.jpg\" alt=\"\" class=\"rounded-circle avatar-xs\">
\t\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t\t\t<div class=\"avatar-group-item\">
\t\t\t\t\t\t\t\t\t\t<img src=\"/images/users/avatar-5.jpg\" alt=\"\" class=\"rounded-circle avatar-xs\">
\t\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t\t\t<div class=\"avatar-group-item\">
\t\t\t\t\t\t\t\t\t\t<div class=\"avatar-xs\">
\t\t\t\t\t\t\t\t\t\t\t<div class=\"avatar-title rounded-circle text-bg-info\">
\t\t\t\t\t\t\t\t\t\t\t\tA
\t\t\t\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t\t\t<div class=\"avatar-group-item\">
\t\t\t\t\t\t\t\t\t\t<img src=\"/images/users/avatar-2.jpg\" alt=\"\" class=\"rounded-circle avatar-xs\">
\t\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t</div>
\t\t\t\t\t\t<!--end col-->

\t\t\t\t\t\t<div class=\"col-lg-6\">
\t\t\t\t\t\t\t<div class=\"mt-lg-0 mt-3\">
\t\t\t\t\t\t\t\t<div class=\"avatar-group\">
\t\t\t\t\t\t\t\t\t<a href=\"javascript: void(0);\" class=\"avatar-group-item\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" title=\"Tosha\">
\t\t\t\t\t\t\t\t\t\t<img src=\"/images/users/avatar-1.jpg\" alt=\"\" class=\"rounded-circle avatar-sm\">
\t\t\t\t\t\t\t\t\t</a>
\t\t\t\t\t\t\t\t\t<a href=\"javascript: void(0);\" class=\"avatar-group-item\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" title=\"Brain\">
\t\t\t\t\t\t\t\t\t\t<img src=\"/images/users/avatar-3.jpg\" alt=\"\" class=\"rounded-circle avatar-sm\">
\t\t\t\t\t\t\t\t\t</a>
\t\t\t\t\t\t\t\t\t<a href=\"javascript: void(0);\" class=\"avatar-group-item\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" title=\"Hooker\">
\t\t\t\t\t\t\t\t\t\t<div class=\"avatar-sm\">
\t\t\t\t\t\t\t\t\t\t\t<div class=\"avatar-title rounded-circle bg-light text-primary\">
\t\t\t\t\t\t\t\t\t\t\t\tK
\t\t\t\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t\t\t</a>
\t\t\t\t\t\t\t\t\t<a href=\"javascript: void(0);\" class=\"avatar-group-item\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" title=\"More +\">
\t\t\t\t\t\t\t\t\t\t<div class=\"avatar-sm\">
\t\t\t\t\t\t\t\t\t\t\t<div class=\"avatar-title rounded-circle\">
\t\t\t\t\t\t\t\t\t\t\t\t9+
\t\t\t\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t\t\t</a>
\t\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t\t</div>
\t\t\t\t\t\t</div>
\t\t\t\t\t\t<!--end col-->
\t\t\t\t\t</div>
\t\t\t\t\t<!--end row-->
\t\t\t\t</div>
\t\t\t\t<!-- end card body -->
\t\t\t</div>
\t\t</div>
\t\t<!-- end col -->
\t</div>
\t<!-- end row -->

{% endblock %}", "ui-avatars.html.twig", "C:\\Users\\4\\Desktop\\Anant\\jidox\\jidox_symfony\\Jidox\\templates\\ui-avatars.html.twig");
    }
}
