    {% set color = app.session.get('color') %}

    <head>
        <meta http-equiv="Content-Type" content="text/html"; charset="utf-8" />
        <meta name="viewport" content="initial-scale=1">

        <title>{% block title %}{{ app.session.get('appname') }}{% endblock %}</title>
        <!--[if lt IE 9]>
            <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->

        <style>
            :root{
                --colorbody: #{{ color['colorbody'] }};
                --main: #{{ color['main'] }};
                --mainR: {{ color['mainrgb']['r'] }};
                --mainG: {{ color['mainrgb']['g'] }};
                --mainB: {{ color['mainrgb']['b'] }};
                --dark: #{{ color['dark'] }};
                --darkR: {{ color['darkrgb']['r'] }};
                --darkG: {{ color['darkrgb']['g'] }};
                --darkB: {{ color['darkrgb']['b'] }};
                --light: #{{ color['light'] }};
                --lightR: {{ color['lightrgb']['r'] }};
                --lightG: {{ color['lightrgb']['g'] }};
                --lightB: {{ color['lightrgb']['b'] }};
                --fontcolorhover: #{{ color['fontcolorhover'] }};
                --fontcolorhoverdark: #{{ color['fontcolorhoverdark'] }};
                --fontfacetitle: {{ app.session.get('fontfacetitle') }};
                --fontfacebody: {{ app.session.get('fontfacebody') }};
                --header: url(/{{ alias }}/{{ header }});
                --logo: url(/{{ alias }}/{{ logo }});   
                {% if not app.session.get('sublogo') is empty %}
                --sublogo: url(/{{ alias }}/{{ app.session.get('sublogo') }});   
                {% else %}
                --sublogo: url();   
                {% endif %}                
                --fgheader: {{ fgheader }};
                --heightheader: {{ heightheader }};
            }             
        </style>

        {% block stylesheets %}
            {% stylesheets
                '@CadolesCoreBundle/Resources/public/css/bootstrap.min.css'
                '@CadolesCoreBundle/Resources/public/css/metisMenu.min.css'
                '@CadolesCoreBundle/Resources/public/css/dataTables.bootstrap.css'
                '@CadolesCoreBundle/Resources/public/css/dataTables.responsive.css'
                '@CadolesCoreBundle/Resources/public/css/bootstrap-datepicker.css'
                '@CadolesCoreBundle/Resources/public/css/bootstrap-datetimepicker.min.css'
                '@CadolesCoreBundle/Resources/public/css/bootstrap-social.css'
                '@CadolesCoreBundle/Resources/public/css/morris.css'
                '@CadolesCoreBundle/Resources/public/fonts/fontawesome/css/all.css'
                '@CadolesCoreBundle/Resources/public/css/pick-a-color-1.2.3.min.css'
                '@CadolesCoreBundle/Resources/public/css/bootstrap-switch.css'
                '@CadolesCoreBundle/Resources/public/css/dropzone.css'
                '@CadolesCoreBundle/Resources/public/css/imgareaselect-default.css'
                '@CadolesCoreBundle/Resources/public/css/timeline.css'
                '@CadolesCoreBundle/Resources/public/css/sb-admin-2.css'
                '@CadolesCoreBundle/Resources/public/css/jquery-ui.min.css'
                '@CadolesCoreBundle/Resources/public/css/bootstrap-slider.css'
                '@CadolesCoreBundle/Resources/public/css/bootstrap-iconpicker.min.css'
                '@CadolesCoreBundle/Resources/public/css/select2.min.css'
                '@CadolesCoreBundle/Resources/public/css/slick.css'
                '@CadolesCoreBundle/Resources/public/css/slick-theme.css'
                '@CadolesCoreBundle/Resources/public/css/jsRapClock.css'
                '@CadolesCoreBundle/Resources/public/css/fullcalendar.css'
                '@CadolesCoreBundle/Resources/public/css/bootstrap-tour.min.css'
                '@CadolesCoreBundle/Resources/public/css/font.css'
                '@CadolesCoreBundle/Resources/public/css/style.css'

                debug=false
            %}
                <link href="{{ asset_url }}" rel="stylesheet" media="screen" />
            {% endstylesheets %}

            <style>
                body,
                .navbar-default ,
                .panel-primary>.panel-heading,
                .pagination>.active>a,
                .pagination>.active>a:focus,
                .pagination>.active>a:hover,
                .pagination>.active>span,
                .pagination>.active>span:focus,
                .pagination>.active>span:hover,
                .herotitle img,
                .avatar,
                .pagemenu,
                .grid .grid-preview .caption,
                .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary,
                .btn-primary
                {
                    background-color: var(--main)
                }
                
                #page-wrapper {
                    background-color: var(--colorbody)
                }

                .navbar-default,
                .panel-primary,
                .panel-primary>.panel-heading,
                .pagination>.active>a,
                .pagination>.active>a:focus,
                .pagination>.active>a:hover,
                .pagination>.active>span,
                .pagination>.active>span:focus,
                .pagination>.active>span:hover,
                .page-header,
                .sidebar ul li,
                .bootstrap-switch.bootstrap-switch-focused,
                .btn-primary
                {
                    border-color: var(--main)
                }

                h1,
                h2,
                .grid-item h3,
                .pagination>li>a,
                .pagination>li>span,
                .modal-dialog,
                a
                {
                    color: var(--main)
                }

                .nav>li>a:focus,
                .nav>li>a:hover,
                .nav .open>a, .nav .open>a:focus, .nav .open>a:hover,
                .sidebar ul li a.active,
                .navbar-top-links li.active a,
                .nav-pills>li.active>a,
                .nav-pills>li.active>a:hover,
                .nav-pills>li.active>a:focus,
                .btn-primary:hover,
                .btn-primary:active,
                .btn-primary:focus
                {
                    background-color: var(--dark) !important;
                }

                .btn-primary:hover,
                .btn-primary:active,
                .btn-primary:focus
                {
                    border-color: var(--dark)  !important;
                }

                .form-control:focus
                {
                    border-color: var(--light)
                }
                .form-control:focus,
                .bootstrap-switch.bootstrap-switch-focused {
                    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba({{ color['lightrgb']['r'] }},{{ color['lightrgb']['g'] }},{{ color['lightrgb']['b'] }},.6)
                }


                a:hover,
                a:focus,
                .pagination>li>a:hover
                {
                    color: var(--dark)
                }

                .header a,
                .navbar-default .navbar-brand,
                .navbar-default a,
                .sidebar a,
                .pagemenu a,
                .grid .grid-preview .caption,
                .grid .grid-preview .caption h1 {
                    color: var(--fontcolorhover)
                }

                .header a:hover,
                .navbar-default .navbar-brand:focus,
                .navbar-default .navbar-brand:hover,
                .navbar-default a:hover,
                .pagemenu a:hover  {
                    color: var(--fontcolorhoverdark)
                }


                .header .title,
                .panel-heading,
                .widgetheader,
                #navbarsmalltitle,
                h1 {
                    font-family: var(--fontfacetitle);
                }

                body, 
                .slick .slicksubtitle,
                .slick .slicklink {
                    font-family: var(--fontfacebody);
                }

                .dropdown-submenu a
                {
                    color: var(--main)
                }                
            </style>



            {% set theme = app.session.get('theme') %}
            {% if theme is not empty %}
            <link href="/{{ alias }}/bundles/cadolescore/themes/{{theme}}/style.css" rel="stylesheet" media="screen" />
            {% endif %}

            <link rel="shortcut icon" href="/{{ alias }}/{{ app.session.get('logo') }}" />

        {% endblock %}
    </head>
