{{define "commoncss"}}
        @font-face {
            font-family: 'Roboto';
            src: url('{{.StaticURL}}/vendor/fonts/Roboto-Bold-webfont.woff');
            font-weight: 700;
            font-style: normal;
        }

        @font-face {
            font-family: 'Roboto';
            src: url('{{.StaticURL}}/vendor/fonts/Roboto-Regular-webfont.woff');
            font-weight: 400;
            font-style: normal;
        }

        @font-face {
            font-family: 'Roboto';
            src: url('{{.StaticURL}}/vendor/fonts/Roboto-Light-webfont.woff');
            font-weight: 300;
            font-style: normal;
        }

        div.dt-buttons {
            margin-bottom: 1em;
        }

        .text-form-error {
            color: var(--red) !important;
        }

        form.user-custom .custom-checkbox.small label {
            line-height: 1.5rem;
        }

        form.user-custom .form-control-user-custom {
            font-size: 0.9rem;
            border-radius: 10rem;
            padding: 1.5rem 1rem;
        }

        form.user-custom .btn-user-custom {
            font-size: 0.9rem;
            border-radius: 10rem;
            padding: 0.75rem 1rem;
        }

        .bg-login-image {
            background-image: url('{{.StaticURL}}{{.Branding.LoginImagePath}}');
            background-size: contain;
            background-repeat: no-repeat;
            padding: 1em;
        }

        .row.login-image {
            height: 200px;
        }
{{end}}