@import url("https://fonts.googleapis.com/css2?family=Work+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400;1,600;1,700&display=swap");

@font-face {
    font-family: "Erika";
    src: url("/content/assets/Erika-Regular.eot");
    src:
        url("/content/assets/Erika-Regular.eot?#iefix")
            format("embedded-opentype"),
        url("/content/assets/Erika-Regular.woff") format("woff"),
        url("/content/assets/Erika-Regular.otf") format("opentype"),
        url("/content/assets/Erika-Regular.ttf") format("truetype"),
        url("/content/assets/Erika-Regular.svg") format("svg");
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
}

/*****************************************************************************/
/*****************************************************************************/
/************** start legacy app.css *****************************************/
/* -- Primary action colour -- */
a {
    color: #f73778;
    text-decoration: none;
    cursor: pointer;
}
a:hover,
a:focus {
    color: #f66294;
    text-decoration: none;
}

.btn {
    border-radius: 10px;
    font-weight: bold;
}

.btn-primary {
    color: #fff !important;
    background-color: #f73778;
    border-color: #f73778;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary {
    color: #fff !important;
    background-color: #f66294 !important;
    border-color: #f66294 !important;
}
.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary {
    background-image: none;
}
.btn-primary.disabled,
.btn-primary[disabled],
fieldset[disabled] .btn-primary,
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled:active,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active {
    background-color: #f73778;
    border-color: #f73778;
}

.btn-info {
    color: #fff !important;
    background-color: #6e2b5f;
    border-color: #6e2b5f;
}
.btn-info:hover,
.btn-info:focus,
.btn-info:active,
.btn-info.active {
    color: #fff !important;
    background-color: #8b557f !important;
    border-color: #8b557f !important;
}

.bg-primary {
    background-color: #f73778;
}
.bg-primary a {
    color: #ffffff;
}
.bg-primary a:hover {
    color: #fff;
}

.bg-white a {
    color: #f73778;
}
.bg-white a:hover {
    color: #f66294;
}

.bg-dark {
    background-color: #f73778;
}

a.bg-light:hover {
    color: #f73778;
}
a.bg-primary:hover {
    background-color: #f66294;
}
a.text-primary:hover {
    color: #f66294;
}
.text-primary {
    color: #f73778;
}

.bg-primary.dker,
.bg-primary .dker {
    background-color: #8b557f;
}

.bg-primary.lter,
.bg-primary .lter {
    background-color: #f66294;
}

.stroke-primary {
    stroke: #f73778;
}

.stroke-primary.dker,
.stroke-primary .dker {
    stroke: #8b557f;
}

.stroke-primary.lter,
.stroke-primary .lter {
    stroke: #f66294;
}

.fill-primary {
    fill: #f73778;
}

.fill-primary.dker,
.fill-primary .dker {
    fill: #8b557f;
}

.fill-primary.lter,
.fill-primary .lter {
    fill: #f66294;
}

.rounded {
    border-radius: 500px;
}

/* -- Header bar colour -- */

.navbar {
    background-color: #ffffff;
}

.navbar .nav > li:hover > a,
.navbar .nav > li.active > a,
.navbar-toggle:hover,
.navbar-toggle.active {
    color: #f73778;
    background-color: transparent;
    text-decoration: none;
}

.navbar .nav > li > a,
.navbar .nav > li:focus > a,
.navbar-toggle,
.navbar-toggle:focus {
    color: #000000;
    background-color: transparent !important;
}

.nav .open > a,
.nav .open > a:focus,
.nav .open > a:hover,
.nav > li > a:focus,
.nav > li > a:hover {
    background-color: transparent;
}

.navbar-toggle .fa {
    background-color: transparent;
    color: #000000;
}

.navbar-toggle:hover .fa {
    color: #f73778;
    background-color: transparent;
}

.navbar support-link,
.navbar support-link > a {
    color: #000000;
    text-decoration: none;
}

.navbar .nav > li > a {
    color: #000000;
    text-decoration: none;
}

.navbar .nav > li > a:hover,
.navbar support-link a:hover,
.navbar a:hover support-link a {
    color: #f73778 !important;
    text-decoration: none;
    background-color: transparent;
}

.dropdown-toggle:hover {
    color: #f73778 !important;
    background-color: transparent !important;
    text-decoration: none !important;
}

.dropdown-toggle,
.dropdown-toggle:visited,
.dropdown-toggle:focus,
.dropdown-toggle.active {
    color: #000000 !important;
    background-color: transparent !important;
    text-decoration: none !important;
}

/* -- Dropdown menu link colour -- */

.dropdown-menu {
    background-color: #ffffff;
    font-size: 12px;
}

.dropdown-menu .m-b-sm {
    border: none transparent 0px;
    background-color: #ffffff;
}

.dropdown-menu > li > a {
    color: #3c484b !important;
    background-color: transparent !important;
    font-weight: bold;
    text-transform: none !important;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus,
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
    background-color: transparent !important;
    color: #f73778 !important;
}

.banner .brand {
    width: 100%;
    height: 96px;
    background-image: url(/content/assets/banner_banner-logo.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 50%;
}

/*CPD*/

.app-private-cpd-list #action_export {
    background-color: #f56a00;
    border-color: #f56a00;
}

.app-private-cpd-list #action_export:hover,
.app-private-cpd-list #action_export:focus,
.app-private-cpd-list #action_export:active,
.app-private-cpd-list #action_export.active {
    background-color: #f78733 !important;
    border-color: #f78733 !important;
}

.app-private-cpd-item .control-label {
    font-weight: bold;
    color: #f73778;
}

.app-private-cpd-item .btn-success {
    background-color: #f56a00;
    border-color: #f56a00;
}

.app-private-cpd-item .btn-success:hover,
.app-private-cpd-item .btn-success:focus,
.app-private-cpd-item .btn-success:active,
.app-private-cpd-item .btn-success.active {
    background-color: #f78733 !important;
    border-color: #f78733 !important;
}

.app-private-cpd-item .btn-danger {
    background-color: #f73778;
    border-color: #f73778;
}

.app-private-cpd-item .btn-danger:hover,
.app-private-cpd-item .btn-danger:focus,
.app-private-cpd-item .btn-danger:active,
.app-private-cpd-item .btn-danger.active {
    background-color: #f66294 !important;
    border-color: #f66294 !important;
}

/* team dashboard */

.app-private-team-dashboard .label-aditional-info {
    color: #f73778 !important;
    fill: #f73778 !important;
    font-family: "Erika", sans-serif !important;
    text-transform: uppercase;
}

.app-private-team-member .text-lg {
    font-family: "Erika", sans-serif !important;
    text-transform: uppercase;
}

.app-private-team-dashboard h2,
.app-private-team-member h2,
.app-private-team-dashboard .label-title,
.app-private-team-member text.grey {
    color: #000000 !important;
    fill: #000000 !important;
    font-family: "Erika", sans-serif !important;
    text-transform: uppercase;
}

.graph line,
.grid line,
.x-grid,
.tear,
#def-tear {
    stroke: #f73778 !important;
}

.app-private-team-dashboard .team-members .active-user {
    color: #f73778 !important;
}

.app-private-team-member .panel .blue-text {
    color: #000000;
}

.text-muted {
    color: #000000 !important;
}

.app-private-team-member .light-blue {
    background-color: #fb9bbb !important;
}

.app-private-team-member .blue {
    background-color: #f9699a !important;
}

.app-private-team-member .dark-blue {
    background-color: #f73778 !important;
}

.app-private-team-member circle.light-blue {
    stroke: #fb9bbb !important;
}

.app-private-team-member circle.blue {
    stroke: #f9699a !important;
}

.app-private-team-member circle.dark-blue {
    stroke: #f73778 !important;
}

@media (max-width: 768px) {
    .navbar-right {
        height: auto !important;
    }
    .navbar-right li .navbar-link {
        height: 50px !important;
        padding: 15px 15px !important;
    }
    .dropdown-toggle .img-circle {
        margin-top: 5px;
    }

    .catalogue .col-sm-5,
    .catalogue .col-sm-6 {
        float: none !important;
    }

    .panel-text .row {
        margin-left: 10px !important;
        margin-right: 10px !important;
    }
}

/**************** end legacy app.css *****************************************/
/*****************************************************************************/
/*****************************************************************************/

/* Page overrides */

html {
    background-color: #ffffff;
}

body {
    color: #000000;
    font-family: "Work Sans", sans-serif;
    font-size: 13px;
}

h1,
.h1,
h2,
.h2,
h3,
.h3 {
    font-family: "Erika", sans-serif !important;
    text-transform: uppercase;
    font-weight: bold;
}

#landing-page #title {
    color: #ffffff !important;
}

.timeline .btn-info,
.timeline .btn-info:hover,
.timeline .btn-info:active {
    background-color: transparent !important;
    border: 1px solid #dee0e5 !important;
    color: #000000 !important;
    font-weight: bold;
    cursor: default;
    -webkit-box-shadow: inset 0 0px 0px rgba(0, 0, 0, 0) !important;
    box-shadow: inset 0 0px 0px rgba(0, 0, 0, 0) !important;
}

h2,
.h2 {
    font-size: 24px;
}

h4 {
    font-size: 16px;
}

.navbar-collapse .navbar-right {
    display: block;
}

.navbar-nav {
    display: none;
}

.navbar-nav a,
.navbar-right a,
#site-footer a {
    background-color: transparent !important;
}

.dropdown-menu a {
    font-weight: normal !important;
}

.navbar-header {
    width: inherit;
}

/* Page specific overides */

/* catalogue */

.form-control {
    font-size: 12px;
    height: 34px;
}

/* sign-in */

.app-public-access-signin,
.app-public-access-forgot,
.app-public-access-signup,
.app-public-access-recover,
.app-public-access-thanks,
.app-public-access-scope,
.app-public-access-verify {
    background-image: url(/content/assets/login-bg.jpg);
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-attachment: fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.app-public-access-signin .signin-panel .text-white,
.app-public-access-forgot .forgot-panel .text-white,
.app-public-access-signup .signup-panel .text-white,
.app-public-access-recover .recover-panel .text-white,
.app-public-access-thanks .thanks-panel .text-white,
.app-public-access-scope .scope-panel .text-white,
.app-public-access-verify .verify-panel .text-white {
    color: #000000;
}

.app-public-access-signin .signin-panel .form-control,
.app-public-access-forgot .forgot-panel .form-control,
.app-public-access-signup .signup-panel .form-control,
.app-public-access-recover .recover-panel .form-control,
.app-public-access-thanks .thanks-panel .form-control,
.app-public-access-scope .scope-panel .form-control,
.app-public-access-verify .verify-panel .form-control {
    border-radius: 25px !important;
    font-size: 13px;
}

.app-public-access-signin .signin-panel a,
.app-public-access-forgot .forgot-panel a,
.app-public-access-signup .signup-panel a,
.app-public-access-recover .recover-panel a,
.app-public-access-thanks .thanks-panel a,
.app-public-access-scope .scope-panel a,
.app-public-access-verify .verify-panel a {
    color: #f73778;
}

.app-public-access-signin .signin-panel a:hover,
.app-public-access-forgot .forgot-panel a:hover,
.app-public-access-signup .signup-panel a:hover,
.app-public-access-recover .recover-panel a:hover,
.app-public-access-thanks .thanks-panel a:hover,
.app-public-access-scope .scope-panel a:hover,
.app-public-access-verify .verify-panel a:hover {
    color: #f66294;
}

.app-public-access-signin .signin-panel .brand img,
.app-public-access-forgot .forgot-panel .brand img,
.app-public-access-signup .signup-panel .brand img,
.app-public-access-recover .recover-panel .brand img,
.app-public-access-thanks .thanks-panel .brand img,
.app-public-access-scope .scope-panel .brand img,
.app-public-access-verify .verify-panel .brand img {
    width: 75%;
    margin-bottom: 20px;
}

.app-public-access-signin .btn-default,
.app-public-access-forgot .btn-default,
.app-public-access-signup .btn-default,
.app-public-access-recover .btn-default,
.app-public-access-thanks .btn-default,
.app-public-access-scope .btn-default,
.app-public-access-verify .btn-default {
    background-color: transparent;
    border: 2px solid #888888;
    color: #888888;
}

.app-public-access-signin .btn-default:hover,
.app-public-access-forgot .btn-default:hover,
.app-public-access-signup .btn-default:hover,
.app-public-access-recover .btn-default:hover,
.app-public-access-thanks .btn-default:hover,
.app-public-access-scope .btn-default:hover,
.app-public-access-verify .btn-default:hover {
    background-color: rgba(255, 255, 255, 0.5);
}

footer#site-footer {
    height: auto !important;
    background-color: transparent;
    color: #ffffff !important;
    border-top: none;
}

#site-footer a {
    color: #ffffff !important;
}

#site-footer .container {
    width: 100%;
    margin: 0px !important;
    padding: 0px !important;
}

#site-footer .row {
    padding: 20px !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
    padding-bottom: 0px;
}

#site-footer .row-social {
    background-color: #f73778;
}

#site-footer .row-social .footer-social {
    font-size: 18px;
    font-weight: 500;
}

#site-footer .row-social ul.social-links {
    margin-bottom: 3em;
    position: relative;
    padding: 0;
    display: table;
    margin: 1em auto 1em auto;
}

#site-footer .row-social ul.social-links li {
    float: left;
    padding: 0;
    margin: 0;
    list-style: none;
}

#site-footer .row-social ul.social-links li a {
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: cover;
    display: block;
    text-indent: -9999px;
    width: 36px;
    height: 36px;
    margin-right: 12px;
}

#site-footer .row-social ul.social-links li a.twitt {
    background-image: url(/content/assets/footer_twitter-icon.png);
}

#site-footer .row-social ul.social-links li a.fb {
    background-image: url(/content/assets/footer_facebook-icon.png);
}

#site-footer .row-social ul.social-links li a.instagram {
    background-image: url(/content/assets/footer_instagram-icon.png);
}

#site-footer .row-social ul.social-links li a.youtube {
    background-image: url(/content/assets/footer_youtube-icon.png);
    margin-right: 0px !important;
}

#site-footer .row-menu {
    background-color: #797979;
    padding: 0px 20px !important;
}

#site-footer .row-menu .menu-block-wrapper {
    margin: auto;
    max-width: 900px;
}

#site-footer .row-menu .menu-block-wrapper .leaf-1,
#site-footer .row-menu .menu-block-wrapper .leaf-2 {
    padding: 23px 0px !important;
}

#site-footer .row-copyright {
    background-color: #333;
    margin: 0px !important;
}

#site-footer .footer-copyright:after,
#site-footer .footer-blurb:after {
    content: "\a";
    white-space: pre;
}

body {
    margin-bottom: 330px !important;
}

.app-private-cpd-list .modal-dialog {
    width: 650px;
}

@media (max-width: 906px) {
    body {
        margin-bottom: 340px !important;
    }
}

@media (max-width: 768px) {
    body {
        margin-bottom: 370px !important;
    }

    .app-private-cpd-list .modal-dialog {
        width: auto;
    }

    .banner .container-fluid {
        height: 240px;
        background-image: none !important;
    }

    .navbar-brand img {
        top: 24px;
    }

    .panel-img {
        max-width: 144px !important;
    }

    .app-public-access-signin #app,
    .app-public-access-forgot #app,
    .app-public-access-signup #app,
    .app-public-access-recover #app,
    .app-public-access-thanks #app,
    .app-public-access-scope #app {
        width: 100%;
        margin-left: 0px;
        margin-right: 0px;
    }

    .app-public-access-signin .signin-panel,
    .app-public-access-forgot .forgot-panel,
    .app-public-access-signup .signup-panel,
    .app-public-access-recover .recover-panel,
    .app-public-access-thanks .thanks-panel,
    .app-public-access-scope .scope-panel {
        width: 100%;
    }

    .app-public-access-signin .signin-panel .brand img,
    .app-public-access-forgot .forgot-panel .brand img,
    .app-public-access-signup .signup-panel .brand img,
    .app-public-access-recover .recover-panel .brand img,
    .app-public-access-thanks .thanks-panel .brand img,
    .app-public-access-scope .scope-panel .brand img {
        max-width: 320px !important;
    }

    .support-link a.ng-scope {
        padding: 0px !important;
    }

    .header-img {
        margin-right: 0px;
    }

    .section-header h1::before {
        content: "\a";
        white-space: pre;
    }

    .section-header h1 {
        line-height: 1.5em;
    }

    #site-footer .row-menu .menu-block-wrapper {
        max-width: 400px !important;
    }

    #site-footer .row-menu .menu-block-wrapper .leaf-1 {
        padding-bottom: 5px !important;
    }

    #site-footer .row-menu .menu-block-wrapper .leaf-2 {
        padding-top: 5px !important;
    }
}

@media (max-width: 625px) {
    body {
        margin-bottom: 388px !important;
    }
}

@media (max-width: 576px) {
    #site-footer .menu-mlid-20118::after {
        content: "/a";
        white-space: pre;
    }
}

@media (max-width: 486px) {
    body {
        margin-bottom: 405px !important;
    }
}

@media (max-width: 320px) {
    .app-private-cpd-list .modal-dialog .col-xs-12 {
        padding-left: 0px;
        padding-right: 0px;
    }

    .uib-datepicker .btn {
        border-radius: 0;
        font-size: 10px;
    }
}

@media (max-height: 930px) {
    .app-public-access-signup #app {
        position: relative;
        top: 20px !important;
        left: 0px !important;
        -ms-transform: none;
        -webkit-transform: none;
        transform: none;
    }
}

@media (max-height: 720px) {
    .app-public-access-signin #app {
        position: relative;
        top: 20px !important;
        left: 0px !important;
        -ms-transform: none;
        -webkit-transform: none;
        transform: none;
    }
}

@media (max-height: 666px) {
    .app-public-access-recover #app {
        position: relative;
        top: 20px !important;
        left: 0px !important;
        -ms-transform: none;
        -webkit-transform: none;
        transform: none;
    }
}

@media (max-height: 430px) {
    .app-public-access-forgot #app,
    .app-public-access-thanks #app {
        position: relative;
        top: 20px !important;
        left: 0px !important;
        -ms-transform: none;
        -webkit-transform: none;
        transform: none;
    }
}

@media (max-height: 395px) {
    .app-public-access-scope #app {
        position: relative;
        top: 20px !important;
        left: 0px !important;
        -ms-transform: none;
        -webkit-transform: none;
        transform: none;
    }
}

/* dashboard migration styles */

.app-public-access-signin .signin-panel,
.app-public-access-forgot .forgot-panel,
.app-public-access-signup .signup-panel,
.app-public-access-recover .recover-panel,
.app-public-access-thanks .thanks-panel,
.app-public-access-scope .scope-panel,
.app-public-access-verify .verify-panel {
    padding: 0px;
    background: transparent;
    border: 0px;
}

.app-public-access-signin .signin-panel #panel-header,
.app-public-access-forgot .forgot-panel #panel-header,
.app-public-access-signup .signup-panel #panel-header,
.app-public-access-recover .recover-panel #panel-header,
.app-public-access-thanks .thanks-panel #panel-header,
.app-public-access-scope .scope-panel #panel-header,
.app-public-access-verify .verify-panel #panel-header {
    padding: 20px 20px 10px 20px;
}

.app-public-access-signin .signin-panel #panel-body,
.app-public-access-signup .signup-panel #panel-body,
.app-public-access-recover .recover-panel #panel-body,
.app-public-access-thanks .thanks-panel #panel-body,
.app-public-access-scope .scope-panel #panel-body,
.app-public-access-verify .verify-panel #panel-body {
    background-color: rgba(255, 255, 255, 0.8);
    border-radius: 25px 25px 0px 0px;
    padding: 10px 20px 10px 20px;
}

.app-public-access-forgot .forgot-panel #panel-body {
    background-color: rgba(255, 255, 255, 0.8);
    border-radius: 25px;
    padding: 10px 20px 40px 20px;
}

.app-public-access-signin .signin-panel #panel-footer,
.app-public-access-forgot .forgot-panel #panel-footer,
.app-public-access-signup .signup-panel #panel-footer,
.app-public-access-recover .recover-panel #panel-footer,
.app-public-access-thanks .thanks-panel #panel-footer,
.app-public-access-scope .scope-panel #panel-footer,
.app-public-access-verify .verify-panel #panel-footer {
    background-color: rgba(255, 255, 255, 0.8);
    border-radius: 0px 0px 25px 25px;
    padding: 10px 20px 40px 20px;
    margin-top: 0px;
}

.app-private-dashboard .banner-text h2,
.app-private-dashboard .banner-text p {
    font-family: "Erika", sans-serif !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    margin-bottom: 0px;
}

.app-private-dashboard .default-tile.panel {
    height: 300px !important;
}

.app-private-dashboard .default-tile .tile-text {
    text-align: center;
}

.app-private-dashboard .tile-text h2,
.app-private-dashboard .tile-text p {
    color: #fff !important;
}

.app-private-dashboard .component-tile-0 .default-tile,
.app-private-dashboard .component-tile-3 .default-tile,
.app-private-dashboard .component-tile-6 .default-tile {
    background-color: #f73778 !important;
}

.app-private-dashboard .component-tile-0 a:hover .default-tile,
.app-private-dashboard .component-tile-3 a:hover .default-tile,
.app-private-dashboard .component-tile-6 a:hover .default-tile {
    background-color: #f66294 !important;
}

.app-private-dashboard .component-tile-1 .default-tile,
.app-private-dashboard .component-tile-4 .default-tile,
.app-private-dashboard .component-tile-7 .default-tile {
    background-color: #f56a00;
}

.app-private-dashboard .component-tile-1 a:hover .default-tile,
.app-private-dashboard .component-tile-4 a:hover .default-tile,
.app-private-dashboard .component-tile-7 a:hover .default-tile {
    background-color: #f78733 !important;
}

.app-private-dashboard .component-tile-2 .default-tile,
.app-private-dashboard .component-tile-5 .default-tile {
    background-color: #6e2b5f;
}

.app-private-dashboard .component-tile-2 a:hover .default-tile,
.app-private-dashboard .component-tile-5 a:hover .default-tile {
    background-color: #8b557f !important;
}

.app-private-dashboard .default-tile .img-container-top {
    display: flex;
    justify-content: center;
    align-items: center;
}

.app-private-dashboard .default-tile .img-container-top .panel-img-top {
    background-color: transparent;
}

.app-private-dashboard .default-tile .img-container-top > div {
    height: 160px !important;
    width: 160px !important;
}

@media (min-width: 1500px) {
    .app-private-dashboard .container-widgets {
        max-width: 1500px !important;
        width: 1500px !important;
    }
}