@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,400;0,700;1,400;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Vollkorn:ital,wght@0,500;0,800;1,500;1,800&display=swap');

/*****************************************************************************/
/*****************************************************************************/
/************** start legacy app.css *****************************************/
/* -- Primary action colour -- */
a {
  color: #ec1c24;
  text-decoration: none;
  cursor: pointer;
}
a:hover,
a:focus {
  color: #990606;
  text-decoration: none;
}

.btn-primary {
  color: #fff !important;
  background-color: #ec1c24;
  border-color: #ec1c24;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary {
  color: #fff !important;
  background-color: #990606;
  border-color: #990606;
}
.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: #ec1c24;
  border-color: #ec1c24;
}

.btn-info {
  color: #fff !important;
  background-color: #3b3636;
  border-color: #3b3636;
}
.btn-info:hover,
.btn-info:focus,
.btn-info:active,
.btn-info.active {
  color: #fff !important;
  background-color: #000000;
  border-color: #000000;
}

.bg-primary {
  background-color: #ec1c24;
  color: #f4f3f9;
}
.bg-primary a,
.bg-primary a:hover {
  color: #ffffff;
}

.bg-white a,
.text-primary,
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus,
.dropdown-menu > .active > a {
  color: #ec1c24;
}

a.bg-primary:hover {
  background-color: #ec1c24;
}

.bg-white a:hover,
a.text-primary:hover,
a.bg-light:hover,
a.text-primary:hover,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
  color: #990606;
}

.bg-primary.dker,
.bg-primary .dker{
	background-color: #bd0f15; /* plus 10% */
}

.bg-primary.lter,
.bg-primary .lter{
	background-color: #f25a5f; /* minus 15% */
}

.stroke-primary {
	stroke: #ec1c24;
}

.stroke-primary.dker,
.stroke-primary .dker {
	stroke: #bd0f15;  /* plus 10% */
}

.stroke-primary.lter,
.stroke-primary .lter {
	stroke: #f25a5f;  /* minus 15% */
}

.fill-primary {
	fill: #ec1c24; 
}

.fill-primary.dker,
.fill-primary .dker {
	fill: #bd0f15; /* plus 10% */
}

.fill-primary.lter,
.fill-primary .lter {
	fill: #f25a5f; /* minus 15% */
}

/**************** end legacy app.css *****************************************/
/*****************************************************************************/
/*****************************************************************************/

body {
  font-family: 'Roboto Condensed';
  color: #3b3636;
}

h1, .h1,
h2, .h2
h3, .h3
h4, .h4
h5, .h5 {
  color: #ec1c24;
  font-family: 'Vollkorn';
  font-weight: 700;
}

.bg-dark,
.bg-dark .nav>li>a:hover,
.bg-dark a:hover {
  background-color: #3b3636;
  color: #ffffff;
}

.bg-dark .nav>li>a,
.bg-dark a {
  color: #ffffff;
}

/* Page overides */


/* sign-in */
.app-public-access-signin #terms {
  background-color: #ffffff;
  padding-bottom: 8px;
}

.signin-panel form .text-white,
.forgot-panel form .text-white,
.signup-panel form .text-white,
.recover-panel form .text-white,
.thanks-panel form .text-white,
.scope-panel form .text-white {
  color:#3b3636;
}

.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-color: #3b3636;
  background-image: url(/content/assets/login-bg.jpg);
  background-repeat: no-repeat;
  background-position: center center;
  -webkit-background-size: cover;
     -moz-background-size: cover;
       -o-background-size: cover;
          background-size: cover;
}

.app-public-access-signup .signup-panel .form-group {
  text-align: center;
}

.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 {
  background-color: #ffffff;
  display: table; /*required to avoid display bug in Chrome*/
}

.app-public-access-signin a,
.app-public-access-scope a,
.app-public-access-signup a,
.app-public-access-forgot a,
.app-public-access-thanks a,
.app-public-access-recover a,
.app-public-access-verify a {
  color: #ec1c24 !important;
}

.app-public-access-signin a:hover,
.app-public-access-scope a:hover,
.app-public-access-signup a:hover,
.app-public-access-forgot a:hover,
.app-public-access-thanks a:hover,
.app-public-access-recover a:hover,
.app-public-access-verify a:hover {
  color: #990606 !important;
  background-color: transparent !important;
}

.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: 100%;
  height: 206px !important;
  margin-top: 0px;
  padding: 10px 10px 20px 10px;
}

.app-public-access-signin .form-group,
.app-public-access-scope .form-group,
.app-public-access-signup .form-group,
.app-public-access-forgot .form-group,
.app-public-access-thanks .form-group,
.app-public-access-recover .form-group,
.app-public-access-verify .form-group {
  color: #3B3636;
}

.app-public-access-signin,
.app-public-access-scope,
.app-public-access-signup,
.app-public-access-forgot,
.app-public-access-thanks,
.app-public-access-recover,
.app-public-access-verify {
  background-image: url(/content/assets/login-bg.jpg);
  background-repeat: no-repeat;
  background-position: center center;
  background-attachment: fixed;
  -webkit-background-size: cover;
     -moz-background-size: cover;
       -o-background-size: cover;
          background-size: cover;
}

.app-public-access-signin .signin-panel #panel-footer a:first-child {
  display: none;
}

/* header */

.navbar-brand img {
  max-height: 38px;
}

.navbar-nav {
  width: inherit;
  font-weight: 700;
}

/* -- landing page -- */
.app-private-catalogue-task .h1,
.app-private-catalogue-curriculum .h1,
.app-private-catalogue-event .h1,
.app-private-catalogue-landingpage .h1 {
  color: #ffffff;
}

.timeline .btn-info,
.timeline .btn-info:hover,
.timeline .btn-info:active {
	background-color: #ffffff !important;
	border: 1px solid #dee0e5 !important;
	color: #3b3636 !important;
	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;
}

/* -- CPD -- */

.app-private-cpd-list #action_export {
  background-color: #ec1c24 !important;
  border-color: #ec1c24 !important;
}

.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: #f47a7c !important;
  border-color: #f47a7c !important;
}

.app-private-cpd-item .control-label {
  font-weight: 600;
  color: #ec1c24;
}

/* -- Team dashboard -- */
.app-private-team-dashboard .label-aditional-info {
  color: #ec1c24 !important;
  fill: #ec1c24 !important;
}

.app-private-team-dashboard h2,
.app-private-team-member h2,
.app-private-team-dashboard .label-title,
.app-private-team-member text.grey {
  color: #ec1c24 !important;
  fill: #ec1c24 !important;
  background-color: transparent !important;
  padding: 0px !important;
  font-family: "Vollkorn", sans-serif;
  font-weight: 600;
}

.graph line,
.grid line,
.x-grid,
.tear,
#def-tear {
  stroke: #ec1c24 !important;
}

.app-private-team-dashboard .team-members a {
  text-decoration: none;
}

.app-private-team-dashboard .team-members .active-user {
  color: #ec1c24 !important;
}

.app-private-team-dashboard .team-members .active-user:hover {
  color: #990606;
  text-decoration: none;
}

.app-private-team-member .panel .blue-text {
  color: #3b3636;
}

.text-muted {
  color: #4c5056 !important;
}

/* footer */

#site-footer .col-xs-12 {
  margin-bottom: 0px !important;
}

#site-footer #copyright {
  text-align: left;
}

#site-footer #terms,
#site-footer #privacy {
  text-align: center;
}

#site-footer #social_media {
  text-align: right;
}

#site-footer #facebook a,
#site-footer #twitter a,
#site-footer #instagram a {
  margin-left: 5px;
}

#site-footer #facebook a,
#site-footer #twitter a,
#site-footer #instagram a,
#site-footer #facebook a:hover,
#site-footer #twitter a:hover,
#site-footer #instagram a:hover,
#site-footer #facebook a:focus,
#site-footer #twitter a:focus,
#site-footer #instagram a:focus,
#site-footer #facebook a:active,
#site-footer #twitter a:active,
#site-footer #instagram a:active,
#site-footer #facebook a:visited,
#site-footer #twitter a:visited,
#site-footer #instagram a:visited  {
  fill: #ffffff;
}

@media (max-width: 767px) {
  #site-footer #copyright,
  #site-footer #terms,
  #site-footer #privacy,
  #site-footer #social_media {
    text-align: center !important;
  }
  
  #site-footer #privacy,
  #site-footer #social_media {
    margin-bottom: 15px !important;
  }
}

@media (max-width: 414px) {
  #social_media {
    width: 94px;
  };
}

@media (max-width: 375px) {
  #social_media {
    width: 25%;
  };
}

/* dashboard migration */

.brand img {
  content: url('/content/assets/signin-logo.svg');
}

.navbar-brand img {
  content: url('/content/assets/logo.svg');
}

.app-private-dashboard .banner-item-wrapper {
	height: 400px;
}

.app-private-dashboard .banner-item-wrapper:nth-child(1) {
  background-position:50% 45% !important
}

.app-private-dashboard .banner-item-wrapper:nth-child(2) {
  background-position:50% 76% !important
}

.app-private-dashboard .banner-item-wrapper:nth-child(3) {
  background-position:50% 20% !important
}

.app-private-dashboard .banner-item {
  justify-content: center;
  align-items: end;
  padding-bottom: 60px;
  width: 100%;
}

.app-private-dashboard .banner-text {
  padding: 20px;
  max-width: 650px;
}

.app-private-dashboard .banner-text h2 {
  margin-bottom: 5px;
}

.app-private-dashboard .banner-text p {
  font-weight: bold !important;
  font-family: Vollkorn;
}

.app-private-dashboard .border-highlight .panel:hover {
  border: 3px solid #ec1c24;
}

.app-private-dashboard .tile-text h2 {
  color: #ec1c24;
  font-size: 24px !important;
}

.app-private-dashboard .tile-text p {
  font-family: 'Roboto Condensed';
}

.app-private-dashboard .custom-layout .container-widgets {
  margin-top: 15px;
}

.app-private-dashboard .custom-layout .display-grid {
  display: grid;
  grid-gap: 15px;
  grid-template-columns: repeat(12, 1fr);
}

.app-private-dashboard .custom-layout .carousel-inner {
  grid-column: span 12;
}

.app-private-dashboard .custom-layout .container-widgets .widget {
  grid-column: span 4;
}

.app-private-dashboard .custom-layout .container-widgets .component-tile-3 {
  grid-column: 3/7;
}

.app-private-dashboard .custom-layout .container-widgets  .default-tile.panel {
  margin: 0px;
}

@media (min-width: 1200px) {
  .app-private-dashboard .container-widgets {
    width: 1170px !important;
  }
}
  
@media (max-width: 991px) {
  .app-private-dashboard .custom-layout .container-widgets .widget {
    grid-column: span 6;
  }
}

@media (max-width: 767px) {
  .app-private-dashboard .custom-layout .container-widgets .widget {
    grid-column: span 12;
  }
}